{"version":3,"sources":["webpack://@verndale/toolkit/./src/js/helpers/index.ts","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/resize/handle-element.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/resize/handle-window.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/resize/index.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/utils/dist/velocity.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/scroll/info.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/scroll/offsets/inset.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/scroll/offsets/presets.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/scroll/offsets/edge.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/scroll/offsets/offset.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/scroll/offsets/index.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/scroll/on-scroll-handler.es.js","webpack://@verndale/toolkit/./node_modules/@motionone/dom/dist/gestures/scroll/index.es.js","webpack://@verndale/toolkit/./src/js/modules/productLayers.ts"],"names":["debounce","callback","wait","timerId","args","darkColorPalette","lightColorPalette","getRandomColor","background","resizeHandlers","observer","getElementSize","target","borderBoxSize","inlineSize","blockSize","notifyTarget","contentRect","_a","handler","notifyAll","entries","createResizeObserver","resizeElement","elements","element","elementHandlers","windowCallbacks","windowResizeHandler","createWindowResizeHandler","size","info","resizeWindow","resize","a","b","velocityPerSecond","velocity","frameDuration","maxElapsed","createAxisInfo","createScrollInfo","keys","updateAxisInfo","axisName","time","axis","length","position","prev","prevTime","elapsed","updateScrollInfo","calcInset","container","inset","current","top","left","ScrollOffset","namedEdges","resolveEdge","edge","delta","asNumber","defaultOffset","resolveOffset","offset","containerLength","targetLength","targetInset","offsetDefinition","targetPoint","containerPoint","point","resolveOffsets","options","lengthLabel","targetSize","containerSize","hasChanged","numOffsets","i","measure","node","createOnScrollHandler","onScroll","scrubAnimation","controls","axisInfo","animation","easing","_b","timingOptions","scrollListeners","resizeListeners","onScrollHandlers","getEventTarget","containerHandlers","containerHandler","listener","onLoadProcesss","ProductLayers","Component","el","__publicField","maxHeight","layer","productCardItem","sequence","stagger","scroll","timeline"],"mappings":"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","file":"scripts/5021.498bf69c0fc4fe1c7e32.js","sourcesContent":["// /**\n// * debounce function\n// * Delays the processing of the event\n// */\nexport const debounce = (callback: (args: unknown) => void, wait: number) => {\n  let timerId: ReturnType<typeof setTimeout>;\n\n  return (...args: [unknown]) => {\n    clearTimeout(timerId);\n    timerId = setTimeout(() => {\n      callback(...args);\n    }, wait);\n  };\n};\n\ninterface IColorPalette {\n  name: string;\n  code: string;\n}\n\nexport const darkColorPalette: Array<IColorPalette> = [\n  { name: 'orange', code: '#f47920' },\n  { name: 'yellow', code: '#f4b450' },\n  { name: 'green', code: '#0f9d58' },\n  { name: 'light-blue', code: '#009cde' }\n];\n\nexport const lightColorPalette: Array<IColorPalette> = [\n  { name: 'red', code: '#da291c' },\n  { name: 'purple', code: '#492d8c' },\n  { name: 'blue', code: '#2e67b2' },\n  { name: 'orange', code: '#f47920' },\n  { name: 'yellow', code: '#f4b450' },\n  { name: 'green', code: '#0f9d58' },\n  { name: 'light-blue', code: '#009cde' }\n];\n\nexport const getRandomColor = (\n  background: 'light' | 'dark' = 'light'\n): IColorPalette => {\n  if (background === 'light') {\n    const lightRandomColor =\n      lightColorPalette[Math.floor(Math.random() * lightColorPalette.length)];\n    return lightRandomColor;\n  }\n\n  const darkRandomColor =\n    darkColorPalette[Math.floor(Math.random() * darkColorPalette.length)];\n  return darkRandomColor;\n};\n","import { resolveElements } from '../../utils/resolve-elements.es.js';\n\nconst resizeHandlers = new WeakMap();\nlet observer;\nfunction getElementSize(target, borderBoxSize) {\n    if (borderBoxSize) {\n        const { inlineSize, blockSize } = borderBoxSize[0];\n        return { width: inlineSize, height: blockSize };\n    }\n    else if (target instanceof SVGElement && \"getBBox\" in target) {\n        return target.getBBox();\n    }\n    else {\n        return {\n            width: target.offsetWidth,\n            height: target.offsetHeight,\n        };\n    }\n}\nfunction notifyTarget({ target, contentRect, borderBoxSize, }) {\n    var _a;\n    (_a = resizeHandlers.get(target)) === null || _a === void 0 ? void 0 : _a.forEach((handler) => {\n        handler({\n            target,\n            contentSize: contentRect,\n            get size() {\n                return getElementSize(target, borderBoxSize);\n            },\n        });\n    });\n}\nfunction notifyAll(entries) {\n    entries.forEach(notifyTarget);\n}\nfunction createResizeObserver() {\n    if (typeof ResizeObserver === \"undefined\")\n        return;\n    observer = new ResizeObserver(notifyAll);\n}\nfunction resizeElement(target, handler) {\n    if (!observer)\n        createResizeObserver();\n    const elements = resolveElements(target);\n    elements.forEach((element) => {\n        let elementHandlers = resizeHandlers.get(element);\n        if (!elementHandlers) {\n            elementHandlers = new Set();\n            resizeHandlers.set(element, elementHandlers);\n        }\n        elementHandlers.add(handler);\n        observer === null || observer === void 0 ? void 0 : observer.observe(element);\n    });\n    return () => {\n        elements.forEach((element) => {\n            const elementHandlers = resizeHandlers.get(element);\n            elementHandlers === null || elementHandlers === void 0 ? void 0 : elementHandlers.delete(handler);\n            if (!(elementHandlers === null || elementHandlers === void 0 ? void 0 : elementHandlers.size)) {\n                observer === null || observer === void 0 ? void 0 : observer.unobserve(element);\n            }\n        });\n    };\n}\n\nexport { resizeElement };\n","const windowCallbacks = new Set();\nlet windowResizeHandler;\nfunction createWindowResizeHandler() {\n    windowResizeHandler = () => {\n        const size = {\n            width: window.innerWidth,\n            height: window.innerHeight,\n        };\n        const info = {\n            target: window,\n            size,\n            contentSize: size,\n        };\n        windowCallbacks.forEach((callback) => callback(info));\n    };\n    window.addEventListener(\"resize\", windowResizeHandler);\n}\nfunction resizeWindow(callback) {\n    windowCallbacks.add(callback);\n    if (!windowResizeHandler)\n        createWindowResizeHandler();\n    return () => {\n        windowCallbacks.delete(callback);\n        if (!windowCallbacks.size && windowResizeHandler) {\n            windowResizeHandler = undefined;\n        }\n    };\n}\n\nexport { resizeWindow };\n","import { resizeElement } from './handle-element.es.js';\nimport { resizeWindow } from './handle-window.es.js';\nimport { isFunction } from '@motionone/utils';\n\nfunction resize(a, b) {\n    return isFunction(a) ? resizeWindow(a) : resizeElement(a, b);\n}\n\nexport { resize };\n","/*\n  Convert velocity into velocity per second\n\n  @param [number]: Unit per frame\n  @param [number]: Frame duration in ms\n*/\nfunction velocityPerSecond(velocity, frameDuration) {\n    return frameDuration ? velocity * (1000 / frameDuration) : 0;\n}\n\nexport { velocityPerSecond };\n","import { progress, velocityPerSecond } from '@motionone/utils';\n\n/**\n * A time in milliseconds, beyond which we consider the scroll velocity to be 0.\n */\nconst maxElapsed = 50;\nconst createAxisInfo = () => ({\n    current: 0,\n    offset: [],\n    progress: 0,\n    scrollLength: 0,\n    targetOffset: 0,\n    targetLength: 0,\n    containerLength: 0,\n    velocity: 0,\n});\nconst createScrollInfo = () => ({\n    time: 0,\n    x: createAxisInfo(),\n    y: createAxisInfo(),\n});\nconst keys = {\n    x: {\n        length: \"Width\",\n        position: \"Left\",\n    },\n    y: {\n        length: \"Height\",\n        position: \"Top\",\n    },\n};\nfunction updateAxisInfo(element, axisName, info, time) {\n    const axis = info[axisName];\n    const { length, position } = keys[axisName];\n    const prev = axis.current;\n    const prevTime = info.time;\n    axis.current = element[\"scroll\" + position];\n    axis.scrollLength = element[\"scroll\" + length] - element[\"client\" + length];\n    axis.offset.length = 0;\n    axis.offset[0] = 0;\n    axis.offset[1] = axis.scrollLength;\n    axis.progress = progress(0, axis.scrollLength, axis.current);\n    const elapsed = time - prevTime;\n    axis.velocity =\n        elapsed > maxElapsed ? 0 : velocityPerSecond(axis.current - prev, elapsed);\n}\nfunction updateScrollInfo(element, info, time) {\n    updateAxisInfo(element, \"x\", info, time);\n    updateAxisInfo(element, \"y\", info, time);\n    info.time = time;\n}\n\nexport { createScrollInfo, updateScrollInfo };\n","function calcInset(element, container) {\n    let inset = { x: 0, y: 0 };\n    let current = element;\n    while (current && current !== container) {\n        if (current instanceof HTMLElement) {\n            inset.x += current.offsetLeft;\n            inset.y += current.offsetTop;\n            current = current.offsetParent;\n        }\n        else if (current instanceof SVGGraphicsElement && \"getBBox\" in current) {\n            const { top, left } = current.getBBox();\n            inset.x += left;\n            inset.y += top;\n            /**\n             * Assign the next parent element as the <svg /> tag.\n             */\n            while (current && current.tagName !== \"svg\") {\n                current = current.parentNode;\n            }\n        }\n    }\n    return inset;\n}\n\nexport { calcInset };\n","const ScrollOffset = {\n    Enter: [\n        [0, 1],\n        [1, 1],\n    ],\n    Exit: [\n        [0, 0],\n        [1, 0],\n    ],\n    Any: [\n        [1, 0],\n        [0, 1],\n    ],\n    All: [\n        [0, 0],\n        [1, 1],\n    ],\n};\n\nexport { ScrollOffset };\n","import { isString, isNumber } from '@motionone/utils';\n\nconst namedEdges = {\n    start: 0,\n    center: 0.5,\n    end: 1,\n};\nfunction resolveEdge(edge, length, inset = 0) {\n    let delta = 0;\n    /**\n     * If we have this edge defined as a preset, replace the definition\n     * with the numerical value.\n     */\n    if (namedEdges[edge] !== undefined) {\n        edge = namedEdges[edge];\n    }\n    /**\n     * Handle unit values\n     */\n    if (isString(edge)) {\n        const asNumber = parseFloat(edge);\n        if (edge.endsWith(\"px\")) {\n            delta = asNumber;\n        }\n        else if (edge.endsWith(\"%\")) {\n            edge = asNumber / 100;\n        }\n        else if (edge.endsWith(\"vw\")) {\n            delta = (asNumber / 100) * document.documentElement.clientWidth;\n        }\n        else if (edge.endsWith(\"vh\")) {\n            delta = (asNumber / 100) * document.documentElement.clientHeight;\n        }\n        else {\n            edge = asNumber;\n        }\n    }\n    /**\n     * If the edge is defined as a number, handle as a progress value.\n     */\n    if (isNumber(edge)) {\n        delta = length * edge;\n    }\n    return inset + delta;\n}\n\nexport { namedEdges, resolveEdge };\n","import { isNumber, isString } from '@motionone/utils';\nimport { resolveEdge, namedEdges } from './edge.es.js';\n\nconst defaultOffset = [0, 0];\nfunction resolveOffset(offset, containerLength, targetLength, targetInset) {\n    let offsetDefinition = Array.isArray(offset) ? offset : defaultOffset;\n    let targetPoint = 0;\n    let containerPoint = 0;\n    if (isNumber(offset)) {\n        /**\n         * If we're provided offset: [0, 0.5, 1] then each number x should become\n         * [x, x], so we default to the behaviour of mapping 0 => 0 of both target\n         * and container etc.\n         */\n        offsetDefinition = [offset, offset];\n    }\n    else if (isString(offset)) {\n        offset = offset.trim();\n        if (offset.includes(\" \")) {\n            offsetDefinition = offset.split(\" \");\n        }\n        else {\n            /**\n             * If we're provided a definition like \"100px\" then we want to apply\n             * that only to the top of the target point, leaving the container at 0.\n             * Whereas a named offset like \"end\" should be applied to both.\n             */\n            offsetDefinition = [offset, namedEdges[offset] ? offset : `0`];\n        }\n    }\n    targetPoint = resolveEdge(offsetDefinition[0], targetLength, targetInset);\n    containerPoint = resolveEdge(offsetDefinition[1], containerLength);\n    return targetPoint - containerPoint;\n}\n\nexport { resolveOffset };\n","import { interpolate, defaultOffset } from '@motionone/utils';\nimport { calcInset } from './inset.es.js';\nimport { ScrollOffset } from './presets.es.js';\nimport { resolveOffset } from './offset.es.js';\n\nconst point = { x: 0, y: 0 };\nfunction resolveOffsets(container, info, options) {\n    let { offset: offsetDefinition = ScrollOffset.All } = options;\n    const { target = container, axis = \"y\" } = options;\n    const lengthLabel = axis === \"y\" ? \"height\" : \"width\";\n    const inset = target !== container ? calcInset(target, container) : point;\n    /**\n     * Measure the target and container. If they're the same thing then we\n     * use the container's scrollWidth/Height as the target, from there\n     * all other calculations can remain the same.\n     */\n    const targetSize = target === container\n        ? { width: container.scrollWidth, height: container.scrollHeight }\n        : { width: target.clientWidth, height: target.clientHeight };\n    const containerSize = {\n        width: container.clientWidth,\n        height: container.clientHeight,\n    };\n    /**\n     * Reset the length of the resolved offset array rather than creating a new one.\n     * TODO: More reusable data structures for targetSize/containerSize would also be good.\n     */\n    info[axis].offset.length = 0;\n    /**\n     * Populate the offset array by resolving the user's offset definition into\n     * a list of pixel scroll offets.\n     */\n    let hasChanged = !info[axis].interpolate;\n    const numOffsets = offsetDefinition.length;\n    for (let i = 0; i < numOffsets; i++) {\n        const offset = resolveOffset(offsetDefinition[i], containerSize[lengthLabel], targetSize[lengthLabel], inset[axis]);\n        if (!hasChanged && offset !== info[axis].interpolatorOffsets[i]) {\n            hasChanged = true;\n        }\n        info[axis].offset[i] = offset;\n    }\n    /**\n     * If the pixel scroll offsets have changed, create a new interpolator function\n     * to map scroll value into a progress.\n     */\n    if (hasChanged) {\n        info[axis].interpolate = interpolate(defaultOffset(numOffsets), info[axis].offset);\n        info[axis].interpolatorOffsets = [...info[axis].offset];\n    }\n    info[axis].progress = info[axis].interpolate(info[axis].current);\n}\n\nexport { resolveOffsets };\n","import { isFunction, noopReturn } from '@motionone/utils';\nimport { updateScrollInfo } from './info.es.js';\nimport { resolveOffsets } from './offsets/index.es.js';\n\nfunction measure(container, target = container, info) {\n    /**\n     * Find inset of target within scrollable container\n     */\n    info.x.targetOffset = 0;\n    info.y.targetOffset = 0;\n    if (target !== container) {\n        let node = target;\n        while (node && node != container) {\n            info.x.targetOffset += node.offsetLeft;\n            info.y.targetOffset += node.offsetTop;\n            node = node.offsetParent;\n        }\n    }\n    info.x.targetLength =\n        target === container ? target.scrollWidth : target.clientWidth;\n    info.y.targetLength =\n        target === container ? target.scrollHeight : target.clientHeight;\n    info.x.containerLength = container.clientWidth;\n    info.y.containerLength = container.clientHeight;\n}\nfunction createOnScrollHandler(element, onScroll, info, options = {}) {\n    const axis = options.axis || \"y\";\n    return {\n        measure: () => measure(element, options.target, info),\n        update: (time) => {\n            updateScrollInfo(element, info, time);\n            if (options.offset || options.target) {\n                resolveOffsets(element, info, options);\n            }\n        },\n        notify: isFunction(onScroll)\n            ? () => onScroll(info)\n            : scrubAnimation(onScroll, info[axis]),\n    };\n}\nfunction scrubAnimation(controls, axisInfo) {\n    controls.pause();\n    controls.forEachNative((animation, { easing }) => {\n        var _a, _b;\n        if (animation.updateDuration) {\n            if (!easing)\n                animation.easing = noopReturn;\n            animation.updateDuration(1);\n        }\n        else {\n            const timingOptions = { duration: 1000 };\n            if (!easing)\n                timingOptions.easing = \"linear\";\n            (_b = (_a = animation.effect) === null || _a === void 0 ? void 0 : _a.updateTiming) === null || _b === void 0 ? void 0 : _b.call(_a, timingOptions);\n        }\n    });\n    return () => {\n        controls.currentTime = axisInfo.progress;\n    };\n}\n\nexport { createOnScrollHandler };\n","import { __rest } from 'tslib';\nimport { resize } from '../resize/index.es.js';\nimport { createScrollInfo } from './info.es.js';\nimport { createOnScrollHandler } from './on-scroll-handler.es.js';\n\nconst scrollListeners = new WeakMap();\nconst resizeListeners = new WeakMap();\nconst onScrollHandlers = new WeakMap();\nconst getEventTarget = (element) => element === document.documentElement ? window : element;\nfunction scroll(onScroll, _a = {}) {\n    var { container = document.documentElement } = _a, options = __rest(_a, [\"container\"]);\n    let containerHandlers = onScrollHandlers.get(container);\n    /**\n     * Get the onScroll handlers for this container.\n     * If one isn't found, create a new one.\n     */\n    if (!containerHandlers) {\n        containerHandlers = new Set();\n        onScrollHandlers.set(container, containerHandlers);\n    }\n    /**\n     * Create a new onScroll handler for the provided callback.\n     */\n    const info = createScrollInfo();\n    const containerHandler = createOnScrollHandler(container, onScroll, info, options);\n    containerHandlers.add(containerHandler);\n    /**\n     * Check if there's a scroll event listener for this container.\n     * If not, create one.\n     */\n    if (!scrollListeners.has(container)) {\n        const listener = () => {\n            const time = performance.now();\n            for (const handler of containerHandlers)\n                handler.measure();\n            for (const handler of containerHandlers)\n                handler.update(time);\n            for (const handler of containerHandlers)\n                handler.notify();\n        };\n        scrollListeners.set(container, listener);\n        const target = getEventTarget(container);\n        window.addEventListener(\"resize\", listener, { passive: true });\n        if (container !== document.documentElement) {\n            resizeListeners.set(container, resize(container, listener));\n        }\n        target.addEventListener(\"scroll\", listener, { passive: true });\n    }\n    const listener = scrollListeners.get(container);\n    const onLoadProcesss = requestAnimationFrame(listener);\n    return () => {\n        var _a;\n        if (typeof onScroll !== \"function\")\n            onScroll.stop();\n        cancelAnimationFrame(onLoadProcesss);\n        /**\n         * Check if we even have any handlers for this container.\n         */\n        const containerHandlers = onScrollHandlers.get(container);\n        if (!containerHandlers)\n            return;\n        containerHandlers.delete(containerHandler);\n        if (containerHandlers.size)\n            return;\n        /**\n         * If no more handlers, remove the scroll listener too.\n         */\n        const listener = scrollListeners.get(container);\n        scrollListeners.delete(container);\n        if (listener) {\n            getEventTarget(container).removeEventListener(\"scroll\", listener);\n            (_a = resizeListeners.get(container)) === null || _a === void 0 ? void 0 : _a();\n            window.removeEventListener(\"resize\", listener);\n        }\n    };\n}\n\nexport { scroll };\n","import { Component } from '@verndale/core';\nimport { ElementOrSelector, stagger, timeline, scroll } from 'motion';\nimport { TimelineDefinition } from '@motionone/dom/types/timeline/types';\nimport { debounce } from '../helpers';\n\nclass ProductLayers extends Component {\n  breakpoint = false;\n  reducedMotion = window.matchMedia('(prefers-reduced-motion: reduce)');\n\n  constructor(el: HTMLElement) {\n    super(el);\n    this.breakpoint = window.matchMedia(`(min-width: ${1024}px)`).matches;\n    if (!this.reducedMotion.matches) {\n      this.setInitialStyles();\n      this.setAnimationSequence();\n    }\n  }\n\n  setupDefaults() {\n    this.dom = {\n      el: this.el,\n      layerList: this.el.querySelector<HTMLElement>(\n        '.product-layers__cards-list'\n      ),\n      layers: this.el.querySelectorAll('.product-layers__layer'),\n      productCardsItems: this.el.querySelectorAll(\n        '.product-layers__product-card-item'\n      ),\n      layersAndCardsContainer: this.el.querySelector<HTMLElement>(\n        '.product-layers__layers-and-cards-container'\n      )\n    };\n  }\n\n  addListeners() {\n    window.addEventListener(\n      'resize',\n      debounce(this.handlePageResize.bind(this), 300)\n    );\n  }\n\n  handlePageResize() {\n    if (\n      window.matchMedia(`(min-width: ${1024}px)`).matches !== this.breakpoint &&\n      !this.reducedMotion.matches\n    ) {\n      this.breakpoint = window.matchMedia(`(min-width: ${1024}px)`).matches;\n      this.dom.layers = (this.dom.el as HTMLElement).querySelectorAll(\n        '.product-layers__layer'\n      );\n      this.setInitialStyles();\n\n      requestAnimationFrame(() => {\n        this.setAnimationSequence();\n      });\n    }\n  }\n\n  setInitialStyles() {\n    let maxHeight = 0;\n    //card layers height\n    [].forEach.call(this.dom.layers, (layer: HTMLElement) => {\n      if (layer.clientHeight > maxHeight) maxHeight = layer.clientHeight;\n    });\n\n    if (this.breakpoint) {\n      [].forEach.call(this.dom.layers, (layer: HTMLElement) => {\n        layer.removeAttribute('style');\n      });\n    } else {\n      [].forEach.call(this.dom.layers, (layer: HTMLElement) => {\n        layer.style.blockSize = `${maxHeight}px`;\n      });\n    }\n\n    //card items\n    [].forEach.call(\n      this.dom.productCardsItems,\n      (productCardItem: HTMLElement, i: number) => {\n        productCardItem.style.opacity = '0';\n        productCardItem.style.transform = this.breakpoint\n          ? `translateX(${i % 2 === 0 ? '50px' : '-50px'})`\n          : `translateX(0)`;\n        productCardItem.style.top = '20px';\n      }\n    );\n  }\n\n  setAnimationSequence() {\n    const sequence = [] as TimelineDefinition;\n\n    [].forEach.call(this.dom.layers, (layer: HTMLElement, i: number) => {\n      sequence.push([\n        layer as ElementOrSelector,\n        {\n          transform: [\n            this.breakpoint\n              ? `translate(0, calc(-${i * 50}% + ${27 * i}px))`\n              : `translate(0, calc(-${i * 100}% + ${10 * i}px))`,\n            'translate(0, 0)'\n          ]\n        },\n        { duration: 10, at: 0 }\n      ]);\n    });\n\n    // //card items\n    sequence.push([\n      this.dom.productCardsItems as ElementOrSelector,\n      { opacity: [0, 1], transform: 'translateX(0)', top: '0' },\n      {\n        duration: 2,\n        easing: 'linear',\n        delay: this.breakpoint ? stagger(0.5) : stagger(4),\n        at: 0,\n        opacity: { duration: this.breakpoint ? 1 : 2 },\n        transform: { duration: 3.5 },\n        top: { duration: 0.25 }\n      }\n    ]);\n\n    scroll(timeline(sequence, { duration: 5 }), {\n      target: this.dom.layersAndCardsContainer as HTMLElement,\n      offset: [\n        `start ${this.breakpoint ? '0.45' : '0.45'}`,\n        `end ${this.breakpoint ? 'end' : '-0.5'}`\n      ]\n    });\n  }\n}\n\nexport default ProductLayers;\n"],"sourceRoot":""}