@makeswift/runtime 0.0.0-20230110205857 → 0.0.0-20230110213327

package/dist/Box.cjs.js

@@ -173,38 +173,37 @@ const Box = React.forwardRef(function Box2({
   })));
   const key = React.useMemo(() => uuid.v4(), [boxAnimateType, boxAnimateDuration, boxAnimateDelay, itemAnimateType, itemAnimateDuration, itemAnimateDelay, itemStaggerDuration]);
   const observerRef = React.useRef(null);
-  React.useEffect(() => {
-    var _a;
-    if (boxElement) {
-      if (observerRef.current == null) {
-        observerRef.current = new IntersectionObserver(function intersectionCallback([entry]) {
-          if (entry.isIntersecting) {
-            entry.target.classList.add("show");
-          }
-        }, {
-          root: null,
-          rootMargin: `0px 0px -10% 0px`,
-          threshold: 0.2
-        });
-      }
-      observerRef.current.observe(boxElement);
+  const hasIntersected = React.useRef(false);
+  const elementCallback = React.useCallback((element) => {
+    var _a, _b;
+    if (element) {
+      const observer = (_a = observerRef.current) != null ? _a : new IntersectionObserver(function intersectionCallback([entry]) {
+        if (entry.isIntersecting) {
+          entry.target.classList.add("show");
+          hasIntersected.current = true;
+        }
+      }, {
+        root: null,
+        rootMargin: `0px 0px -10% 0px`,
+        threshold: 0.2
+      });
+      observer.observe(element);
+      observerRef.current = observer;
     } else {
-      (_a = observerRef.current) == null ? void 0 : _a.disconnect();
+      (_b = observerRef.current) == null ? void 0 : _b.disconnect();
       observerRef.current = null;
     }
-    return () => {
-      var _a2;
-      if (boxElement)
-        (_a2 = observerRef.current) == null ? void 0 : _a2.unobserve(boxElement);
-    };
-  }, [boxElement]);
+    setBoxElement(element);
+  }, []);
   React.useEffect(() => {
+    if (hasIntersected.current === false)
+      return;
     boxElement == null ? void 0 : boxElement.classList.remove("show");
     const timeout = setTimeout(() => boxElement == null ? void 0 : boxElement.classList.add("show"), 100);
     return () => clearTimeout(timeout);
   }, [key]);
   return /* @__PURE__ */ jsxRuntime.jsx(gridItem.BackgroundsContainer, {
-    ref: setBoxElement,
+    ref: elementCallback,
     id,
     className: css.cx(width, margin, borderRadius, next.useStyle({
       display: "flex"
@@ -229,7 +228,6 @@ const Box = React.forwardRef(function Box2({
         className: gridItemClassName,
         grid: children.columns,
         index,
-        itemAnimateType,
         itemAnimateDuration,
         itemAnimateDelay,
         itemStaggerDuration,

package/dist/Box.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"Box.cjs.js","sources":["../src/components/builtin/Box/components/Placeholder/index.tsx","../src/components/builtin/Box/Box.tsx"],"sourcesContent":["import { forwardRef, Ref } from 'react'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\ntype Props = { hide?: boolean }\n\nexport default forwardRef(function Placeholder(\n  { hide = false, ...restOfProps }: Props,\n  ref: Ref<HTMLDivElement>,\n) {\n  return (\n    <div\n      {...restOfProps}\n      ref={ref}\n      style={{ visibility: hide ? 'hidden' : 'initial' }}\n      className={useStyle({\n        width: '100%',\n        background: 'rgba(161, 168, 194, 0.18)',\n        height: 80,\n        padding: 8,\n      })}\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"100%\"\n        height=\"100%\"\n        style={{ overflow: 'visible' }}\n      >\n        <rect\n          x={0}\n          y={0}\n          width=\"100%\"\n          height=\"100%\"\n          strokeWidth={2}\n          strokeDasharray=\"4 2\"\n          fill=\"none\"\n          stroke=\"rgba(161, 168, 194, 0.40)\"\n          rx=\"4\"\n          ry=\"4\"\n        />\n      </svg>\n    </div>\n  )\n})\n","import { forwardRef, Ref, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'\nimport { cx } from '@emotion/css'\n\nimport { Element } from '../../../runtimes/react'\nimport Placeholder from './components/Placeholder'\nimport {\n  ElementIDValue,\n  ResponsiveIconRadioGroupValue,\n  GridValue,\n  GapYValue,\n  GapXValue,\n  CheckboxValue,\n  ResponsiveSelectValue,\n  ResponsiveNumberValue,\n  BackgroundsValue,\n} from '../../../prop-controllers/descriptors'\nimport { BoxModelHandle, parse, createBox } from '../../../box-model'\nimport BackgroundsContainer from '../../shared/BackgroundsContainer'\nimport { BoxAnimateIn } from './constants'\nimport { responsiveStyle } from '../../utils/responsive-style'\nimport { GridItem } from '../../shared/grid-item'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { v4 } from 'uuid'\n\ntype Props = {\n  id?: ElementIDValue\n  backgrounds?: BackgroundsValue\n  width?: string\n  height?: ResponsiveIconRadioGroupValue<'auto' | 'stretch'>\n  verticalAlign?: ResponsiveIconRadioGroupValue<\n    'flex-start' | 'center' | 'flex-end' | 'space-between'\n  >\n  margin?: string\n  padding?: string\n  border?: string\n  borderRadius?: string\n  boxShadow?: string\n  rowGap?: GapYValue\n  columnGap?: GapXValue\n  boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  boxAnimateDuration?: ResponsiveNumberValue\n  boxAnimateDelay?: ResponsiveNumberValue\n  itemAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  itemAnimateDuration?: ResponsiveNumberValue\n  itemAnimateDelay?: ResponsiveNumberValue\n  itemStaggerDuration?: ResponsiveNumberValue\n  hidePlaceholder?: CheckboxValue\n  children?: GridValue\n}\n\nconst Box = forwardRef(function Box(\n  {\n    id,\n    backgrounds,\n    width,\n    height,\n    margin,\n    padding,\n    border,\n    children,\n    borderRadius,\n    boxShadow,\n    rowGap,\n    columnGap,\n    hidePlaceholder,\n    verticalAlign,\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimateDelay,\n    itemAnimateType,\n    itemAnimateDuration,\n    itemStaggerDuration,\n  }: Props,\n  ref: Ref<BoxModelHandle>,\n) {\n  const innerRef = useRef<HTMLDivElement | null>(null)\n  const [boxElement, setBoxElement] = useState<HTMLElement | null>(null)\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      getBoxModel() {\n        const paddingBoxElement = innerRef.current\n        const borderBoxElement = innerRef.current\n        const marginBoxElement = boxElement\n        const borderBox = innerRef.current?.getBoundingClientRect()\n        const paddingBoxComputedStyle =\n          paddingBoxElement?.ownerDocument.defaultView?.getComputedStyle(paddingBoxElement)\n        const borderBoxComputedStyle =\n          borderBoxElement?.ownerDocument.defaultView?.getComputedStyle(borderBoxElement)\n        const marginBoxComputedStyle =\n          marginBoxElement?.ownerDocument.defaultView?.getComputedStyle(marginBoxElement)\n        const padding = paddingBoxComputedStyle && {\n          top: parse(paddingBoxComputedStyle.paddingTop),\n          right: parse(paddingBoxComputedStyle.paddingRight),\n          bottom: parse(paddingBoxComputedStyle.paddingBottom),\n          left: parse(paddingBoxComputedStyle.paddingLeft),\n        }\n        const border = borderBoxComputedStyle && {\n          top: parse(borderBoxComputedStyle.borderTopWidth),\n          right: parse(borderBoxComputedStyle.borderRightWidth),\n          bottom: parse(borderBoxComputedStyle.borderBottomWidth),\n          left: parse(borderBoxComputedStyle.borderLeftWidth),\n        }\n        const margin = marginBoxComputedStyle && {\n          top: parse(marginBoxComputedStyle.marginTop),\n          right: parse(marginBoxComputedStyle.marginRight),\n          bottom: parse(marginBoxComputedStyle.marginBottom),\n          left: parse(marginBoxComputedStyle.marginLeft),\n        }\n\n        return borderBox ? createBox({ borderBox, padding, border, margin }) : null\n      },\n    }),\n    [boxElement],\n  )\n\n  const gridItemClassName = useStyle(\n    responsiveStyle([verticalAlign], ([alignItems = 'flex-start']) => ({ alignItems })),\n  )\n\n  const key = useMemo(\n    () => v4(),\n    [\n      boxAnimateType,\n      boxAnimateDuration,\n      boxAnimateDelay,\n      itemAnimateType,\n      itemAnimateDuration,\n      itemAnimateDelay,\n      itemStaggerDuration,\n    ],\n  )\n\n  const observerRef = useRef<IntersectionObserver | null>(null)\n\n  useEffect(() => {\n    if (boxElement) {\n      if (observerRef.current == null) {\n        observerRef.current = new IntersectionObserver(\n          function intersectionCallback([entry]: IntersectionObserverEntry[]) {\n            if (entry.isIntersecting) {\n              entry.target.classList.add('show')\n            }\n          },\n          {\n            root: null,\n            rootMargin: `0px 0px -10% 0px`,\n            threshold: 0.2,\n          },\n        )\n      }\n      observerRef.current.observe(boxElement)\n    } else {\n      observerRef.current?.disconnect()\n      observerRef.current = null\n    }\n\n    return () => {\n      if (boxElement) observerRef.current?.unobserve(boxElement)\n    }\n  }, [boxElement])\n\n  useEffect(() => {\n    boxElement?.classList.remove('show')\n    const timeout = setTimeout(() => boxElement?.classList.add('show'), 100)\n    return () => clearTimeout(timeout)\n  }, [key])\n\n  return (\n    <BackgroundsContainer\n      ref={setBoxElement}\n      id={id}\n      className={cx(\n        width,\n        margin,\n        borderRadius,\n        useStyle({ display: 'flex' }),\n        useStyle(responsiveStyle([height], ([alignSelf = 'auto']) => ({ alignSelf }))),\n      )}\n      boxAnimateType={boxAnimateType}\n      boxAnimateDuration={boxAnimateDuration}\n      boxAnimateDelay={boxAnimateDelay}\n      itemAnimationType={itemAnimateType}\n      backgrounds={backgrounds}\n    >\n      <div\n        ref={innerRef}\n        key={key}\n        className={cx(\n          padding,\n          boxShadow,\n          border,\n          useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' }),\n          useStyle(\n            responsiveStyle([verticalAlign], ([alignContent = 'flex-start']) => ({\n              alignContent,\n            })),\n          ),\n        )}\n      >\n        {children && children.elements.length > 0 ? (\n          children.elements.map((child, index) => (\n            <GridItem\n              key={child.key}\n              className={gridItemClassName}\n              grid={children.columns}\n              index={index}\n              itemAnimateType={itemAnimateType}\n              itemAnimateDuration={itemAnimateDuration}\n              itemAnimateDelay={itemAnimateDelay}\n              itemStaggerDuration={itemStaggerDuration}\n              columnGap={columnGap}\n              rowGap={rowGap}\n            >\n              <Element element={child} />\n            </GridItem>\n          ))\n        ) : (\n          <Placeholder hide={hidePlaceholder} />\n        )}\n      </div>\n    </BackgroundsContainer>\n  )\n})\n\nexport default Box\n"],"names":["forwardRef","ref","hide","restOfProps","visibility","useStyle","width","background","height","padding","overflow","Box","id","backgrounds","margin","border","children","borderRadius","boxShadow","rowGap","columnGap","hidePlaceholder","verticalAlign","boxAnimateType","boxAnimateDuration","boxAnimateDelay","itemAnimateDelay","itemAnimateType","itemAnimateDuration","itemStaggerDuration","innerRef","useRef","boxElement","setBoxElement","useState","useImperativeHandle","getBoxModel","paddingBoxElement","current","borderBoxElement","marginBoxElement","borderBox","getBoundingClientRect","paddingBoxComputedStyle","ownerDocument","defaultView","getComputedStyle","borderBoxComputedStyle","marginBoxComputedStyle","top","parse","paddingTop","right","paddingRight","bottom","paddingBottom","left","paddingLeft","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","marginTop","marginRight","marginBottom","marginLeft","createBox","gridItemClassName","responsiveStyle","alignItems","key","useMemo","v4","observerRef","useEffect","IntersectionObserver","entry","isIntersecting","target","classList","add","root","rootMargin","threshold","observe","disconnect","unobserve","remove","timeout","setTimeout","clearTimeout","BackgroundsContainer","cx","display","alignSelf","flexWrap","alignContent","elements","length","map","child","index","GridItem","columns","Element"],"mappings":"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"}
+{"version":3,"file":"Box.cjs.js","sources":["../src/components/builtin/Box/components/Placeholder/index.tsx","../src/components/builtin/Box/Box.tsx"],"sourcesContent":["import { forwardRef, Ref } from 'react'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\ntype Props = { hide?: boolean }\n\nexport default forwardRef(function Placeholder(\n  { hide = false, ...restOfProps }: Props,\n  ref: Ref<HTMLDivElement>,\n) {\n  return (\n    <div\n      {...restOfProps}\n      ref={ref}\n      style={{ visibility: hide ? 'hidden' : 'initial' }}\n      className={useStyle({\n        width: '100%',\n        background: 'rgba(161, 168, 194, 0.18)',\n        height: 80,\n        padding: 8,\n      })}\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"100%\"\n        height=\"100%\"\n        style={{ overflow: 'visible' }}\n      >\n        <rect\n          x={0}\n          y={0}\n          width=\"100%\"\n          height=\"100%\"\n          strokeWidth={2}\n          strokeDasharray=\"4 2\"\n          fill=\"none\"\n          stroke=\"rgba(161, 168, 194, 0.40)\"\n          rx=\"4\"\n          ry=\"4\"\n        />\n      </svg>\n    </div>\n  )\n})\n","import {\n  forwardRef,\n  Ref,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { cx } from '@emotion/css'\n\nimport { Element } from '../../../runtimes/react'\nimport Placeholder from './components/Placeholder'\nimport {\n  ElementIDValue,\n  ResponsiveIconRadioGroupValue,\n  GridValue,\n  GapYValue,\n  GapXValue,\n  CheckboxValue,\n  ResponsiveSelectValue,\n  ResponsiveNumberValue,\n  BackgroundsValue,\n} from '../../../prop-controllers/descriptors'\nimport { BoxModelHandle, parse, createBox } from '../../../box-model'\nimport BackgroundsContainer from '../../shared/BackgroundsContainer'\nimport { BoxAnimateIn } from './constants'\nimport { responsiveStyle } from '../../utils/responsive-style'\nimport { GridItem } from '../../shared/grid-item'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { v4 } from 'uuid'\n\ntype Props = {\n  id?: ElementIDValue\n  backgrounds?: BackgroundsValue\n  width?: string\n  height?: ResponsiveIconRadioGroupValue<'auto' | 'stretch'>\n  verticalAlign?: ResponsiveIconRadioGroupValue<\n    'flex-start' | 'center' | 'flex-end' | 'space-between'\n  >\n  margin?: string\n  padding?: string\n  border?: string\n  borderRadius?: string\n  boxShadow?: string\n  rowGap?: GapYValue\n  columnGap?: GapXValue\n  boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  boxAnimateDuration?: ResponsiveNumberValue\n  boxAnimateDelay?: ResponsiveNumberValue\n  itemAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  itemAnimateDuration?: ResponsiveNumberValue\n  itemAnimateDelay?: ResponsiveNumberValue\n  itemStaggerDuration?: ResponsiveNumberValue\n  hidePlaceholder?: CheckboxValue\n  children?: GridValue\n}\n\nconst Box = forwardRef(function Box(\n  {\n    id,\n    backgrounds,\n    width,\n    height,\n    margin,\n    padding,\n    border,\n    children,\n    borderRadius,\n    boxShadow,\n    rowGap,\n    columnGap,\n    hidePlaceholder,\n    verticalAlign,\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimateDelay,\n    itemAnimateType,\n    itemAnimateDuration,\n    itemStaggerDuration,\n  }: Props,\n  ref: Ref<BoxModelHandle>,\n) {\n  const innerRef = useRef<HTMLDivElement | null>(null)\n  const [boxElement, setBoxElement] = useState<HTMLElement | null>(null)\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      getBoxModel() {\n        const paddingBoxElement = innerRef.current\n        const borderBoxElement = innerRef.current\n        const marginBoxElement = boxElement\n        const borderBox = innerRef.current?.getBoundingClientRect()\n        const paddingBoxComputedStyle =\n          paddingBoxElement?.ownerDocument.defaultView?.getComputedStyle(paddingBoxElement)\n        const borderBoxComputedStyle =\n          borderBoxElement?.ownerDocument.defaultView?.getComputedStyle(borderBoxElement)\n        const marginBoxComputedStyle =\n          marginBoxElement?.ownerDocument.defaultView?.getComputedStyle(marginBoxElement)\n        const padding = paddingBoxComputedStyle && {\n          top: parse(paddingBoxComputedStyle.paddingTop),\n          right: parse(paddingBoxComputedStyle.paddingRight),\n          bottom: parse(paddingBoxComputedStyle.paddingBottom),\n          left: parse(paddingBoxComputedStyle.paddingLeft),\n        }\n        const border = borderBoxComputedStyle && {\n          top: parse(borderBoxComputedStyle.borderTopWidth),\n          right: parse(borderBoxComputedStyle.borderRightWidth),\n          bottom: parse(borderBoxComputedStyle.borderBottomWidth),\n          left: parse(borderBoxComputedStyle.borderLeftWidth),\n        }\n        const margin = marginBoxComputedStyle && {\n          top: parse(marginBoxComputedStyle.marginTop),\n          right: parse(marginBoxComputedStyle.marginRight),\n          bottom: parse(marginBoxComputedStyle.marginBottom),\n          left: parse(marginBoxComputedStyle.marginLeft),\n        }\n\n        return borderBox ? createBox({ borderBox, padding, border, margin }) : null\n      },\n    }),\n    [boxElement],\n  )\n\n  const gridItemClassName = useStyle(\n    responsiveStyle([verticalAlign], ([alignItems = 'flex-start']) => ({ alignItems })),\n  )\n\n  const key = useMemo(\n    () => v4(),\n    [\n      boxAnimateType,\n      boxAnimateDuration,\n      boxAnimateDelay,\n      itemAnimateType,\n      itemAnimateDuration,\n      itemAnimateDelay,\n      itemStaggerDuration,\n    ],\n  )\n\n  const observerRef = useRef<IntersectionObserver | null>(null)\n  const hasIntersected = useRef(false)\n  const elementCallback = useCallback((element: HTMLDivElement | null) => {\n    if (element) {\n      const observer =\n        observerRef.current ??\n        new IntersectionObserver(\n          function intersectionCallback([entry]: IntersectionObserverEntry[]) {\n            if (entry.isIntersecting) {\n              entry.target.classList.add('show')\n              hasIntersected.current = true\n            }\n          },\n          {\n            root: null,\n            rootMargin: `0px 0px -10% 0px`,\n            threshold: 0.2,\n          },\n        )\n      observer.observe(element)\n      observerRef.current = observer\n    } else {\n      observerRef.current?.disconnect()\n      observerRef.current = null\n    }\n\n    setBoxElement(element)\n  }, [])\n\n  useEffect(() => {\n    if (hasIntersected.current === false) return\n\n    boxElement?.classList.remove('show')\n    const timeout = setTimeout(() => boxElement?.classList.add('show'), 100)\n    return () => clearTimeout(timeout)\n  }, [key])\n\n  return (\n    <BackgroundsContainer\n      ref={elementCallback}\n      id={id}\n      className={cx(\n        width,\n        margin,\n        borderRadius,\n        useStyle({ display: 'flex' }),\n        useStyle(responsiveStyle([height], ([alignSelf = 'auto']) => ({ alignSelf }))),\n      )}\n      boxAnimateType={boxAnimateType}\n      boxAnimateDuration={boxAnimateDuration}\n      boxAnimateDelay={boxAnimateDelay}\n      itemAnimationType={itemAnimateType}\n      backgrounds={backgrounds}\n    >\n      <div\n        ref={innerRef}\n        key={key}\n        className={cx(\n          padding,\n          boxShadow,\n          border,\n          useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' }),\n          useStyle(\n            responsiveStyle([verticalAlign], ([alignContent = 'flex-start']) => ({\n              alignContent,\n            })),\n          ),\n        )}\n      >\n        {children && children.elements.length > 0 ? (\n          children.elements.map((child, index) => (\n            <GridItem\n              key={child.key}\n              className={gridItemClassName}\n              grid={children.columns}\n              index={index}\n              itemAnimateDuration={itemAnimateDuration}\n              itemAnimateDelay={itemAnimateDelay}\n              itemStaggerDuration={itemStaggerDuration}\n              columnGap={columnGap}\n              rowGap={rowGap}\n            >\n              <Element element={child} />\n            </GridItem>\n          ))\n        ) : (\n          <Placeholder hide={hidePlaceholder} />\n        )}\n      </div>\n    </BackgroundsContainer>\n  )\n})\n\nexport default Box\n"],"names":["forwardRef","ref","hide","restOfProps","visibility","useStyle","width","background","height","padding","overflow","Box","id","backgrounds","margin","border","children","borderRadius","boxShadow","rowGap","columnGap","hidePlaceholder","verticalAlign","boxAnimateType","boxAnimateDuration","boxAnimateDelay","itemAnimateDelay","itemAnimateType","itemAnimateDuration","itemStaggerDuration","innerRef","useRef","boxElement","setBoxElement","useState","useImperativeHandle","getBoxModel","paddingBoxElement","current","borderBoxElement","marginBoxElement","borderBox","getBoundingClientRect","paddingBoxComputedStyle","ownerDocument","defaultView","getComputedStyle","borderBoxComputedStyle","marginBoxComputedStyle","top","parse","paddingTop","right","paddingRight","bottom","paddingBottom","left","paddingLeft","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","marginTop","marginRight","marginBottom","marginLeft","createBox","gridItemClassName","responsiveStyle","alignItems","key","useMemo","v4","observerRef","hasIntersected","elementCallback","useCallback","element","observer","IntersectionObserver","entry","isIntersecting","target","classList","add","root","rootMargin","threshold","observe","disconnect","useEffect","remove","timeout","setTimeout","clearTimeout","BackgroundsContainer","cx","display","alignSelf","flexWrap","alignContent","elements","length","map","child","index","GridItem","columns","Element"],"mappings":"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"}

package/dist/Box.es.js

@@ -29,7 +29,7 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-import { forwardRef, useRef, useState, useImperativeHandle, useMemo, useEffect } from "react";
+import { forwardRef, useRef, useState, useImperativeHandle, useMemo, useCallback, useEffect } from "react";
 import { cx } from "@emotion/css";
 import { n as useStyle, r as responsiveStyle, E as Element } from "./index.es.js";
 import { jsx } from "react/jsx-runtime";
@@ -171,38 +171,37 @@ const Box = forwardRef(function Box2({
   })));
   const key = useMemo(() => v4(), [boxAnimateType, boxAnimateDuration, boxAnimateDelay, itemAnimateType, itemAnimateDuration, itemAnimateDelay, itemStaggerDuration]);
   const observerRef = useRef(null);
-  useEffect(() => {
-    var _a;
-    if (boxElement) {
-      if (observerRef.current == null) {
-        observerRef.current = new IntersectionObserver(function intersectionCallback([entry]) {
-          if (entry.isIntersecting) {
-            entry.target.classList.add("show");
-          }
-        }, {
-          root: null,
-          rootMargin: `0px 0px -10% 0px`,
-          threshold: 0.2
-        });
-      }
-      observerRef.current.observe(boxElement);
+  const hasIntersected = useRef(false);
+  const elementCallback = useCallback((element) => {
+    var _a, _b;
+    if (element) {
+      const observer = (_a = observerRef.current) != null ? _a : new IntersectionObserver(function intersectionCallback([entry]) {
+        if (entry.isIntersecting) {
+          entry.target.classList.add("show");
+          hasIntersected.current = true;
+        }
+      }, {
+        root: null,
+        rootMargin: `0px 0px -10% 0px`,
+        threshold: 0.2
+      });
+      observer.observe(element);
+      observerRef.current = observer;
     } else {
-      (_a = observerRef.current) == null ? void 0 : _a.disconnect();
+      (_b = observerRef.current) == null ? void 0 : _b.disconnect();
       observerRef.current = null;
     }
-    return () => {
-      var _a2;
-      if (boxElement)
-        (_a2 = observerRef.current) == null ? void 0 : _a2.unobserve(boxElement);
-    };
-  }, [boxElement]);
+    setBoxElement(element);
+  }, []);
   useEffect(() => {
+    if (hasIntersected.current === false)
+      return;
     boxElement == null ? void 0 : boxElement.classList.remove("show");
     const timeout = setTimeout(() => boxElement == null ? void 0 : boxElement.classList.add("show"), 100);
     return () => clearTimeout(timeout);
   }, [key]);
   return /* @__PURE__ */ jsx(BackgroundsContainer, {
-    ref: setBoxElement,
+    ref: elementCallback,
     id,
     className: cx(width, margin, borderRadius, useStyle({
       display: "flex"
@@ -227,7 +226,6 @@ const Box = forwardRef(function Box2({
         className: gridItemClassName,
         grid: children.columns,
         index,
-        itemAnimateType,
         itemAnimateDuration,
         itemAnimateDelay,
         itemStaggerDuration,

package/dist/Box.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Box.es.js","sources":["../src/components/builtin/Box/components/Placeholder/index.tsx","../src/components/builtin/Box/Box.tsx"],"sourcesContent":["import { forwardRef, Ref } from 'react'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\ntype Props = { hide?: boolean }\n\nexport default forwardRef(function Placeholder(\n  { hide = false, ...restOfProps }: Props,\n  ref: Ref<HTMLDivElement>,\n) {\n  return (\n    <div\n      {...restOfProps}\n      ref={ref}\n      style={{ visibility: hide ? 'hidden' : 'initial' }}\n      className={useStyle({\n        width: '100%',\n        background: 'rgba(161, 168, 194, 0.18)',\n        height: 80,\n        padding: 8,\n      })}\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"100%\"\n        height=\"100%\"\n        style={{ overflow: 'visible' }}\n      >\n        <rect\n          x={0}\n          y={0}\n          width=\"100%\"\n          height=\"100%\"\n          strokeWidth={2}\n          strokeDasharray=\"4 2\"\n          fill=\"none\"\n          stroke=\"rgba(161, 168, 194, 0.40)\"\n          rx=\"4\"\n          ry=\"4\"\n        />\n      </svg>\n    </div>\n  )\n})\n","import { forwardRef, Ref, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react'\nimport { cx } from '@emotion/css'\n\nimport { Element } from '../../../runtimes/react'\nimport Placeholder from './components/Placeholder'\nimport {\n  ElementIDValue,\n  ResponsiveIconRadioGroupValue,\n  GridValue,\n  GapYValue,\n  GapXValue,\n  CheckboxValue,\n  ResponsiveSelectValue,\n  ResponsiveNumberValue,\n  BackgroundsValue,\n} from '../../../prop-controllers/descriptors'\nimport { BoxModelHandle, parse, createBox } from '../../../box-model'\nimport BackgroundsContainer from '../../shared/BackgroundsContainer'\nimport { BoxAnimateIn } from './constants'\nimport { responsiveStyle } from '../../utils/responsive-style'\nimport { GridItem } from '../../shared/grid-item'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { v4 } from 'uuid'\n\ntype Props = {\n  id?: ElementIDValue\n  backgrounds?: BackgroundsValue\n  width?: string\n  height?: ResponsiveIconRadioGroupValue<'auto' | 'stretch'>\n  verticalAlign?: ResponsiveIconRadioGroupValue<\n    'flex-start' | 'center' | 'flex-end' | 'space-between'\n  >\n  margin?: string\n  padding?: string\n  border?: string\n  borderRadius?: string\n  boxShadow?: string\n  rowGap?: GapYValue\n  columnGap?: GapXValue\n  boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  boxAnimateDuration?: ResponsiveNumberValue\n  boxAnimateDelay?: ResponsiveNumberValue\n  itemAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  itemAnimateDuration?: ResponsiveNumberValue\n  itemAnimateDelay?: ResponsiveNumberValue\n  itemStaggerDuration?: ResponsiveNumberValue\n  hidePlaceholder?: CheckboxValue\n  children?: GridValue\n}\n\nconst Box = forwardRef(function Box(\n  {\n    id,\n    backgrounds,\n    width,\n    height,\n    margin,\n    padding,\n    border,\n    children,\n    borderRadius,\n    boxShadow,\n    rowGap,\n    columnGap,\n    hidePlaceholder,\n    verticalAlign,\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimateDelay,\n    itemAnimateType,\n    itemAnimateDuration,\n    itemStaggerDuration,\n  }: Props,\n  ref: Ref<BoxModelHandle>,\n) {\n  const innerRef = useRef<HTMLDivElement | null>(null)\n  const [boxElement, setBoxElement] = useState<HTMLElement | null>(null)\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      getBoxModel() {\n        const paddingBoxElement = innerRef.current\n        const borderBoxElement = innerRef.current\n        const marginBoxElement = boxElement\n        const borderBox = innerRef.current?.getBoundingClientRect()\n        const paddingBoxComputedStyle =\n          paddingBoxElement?.ownerDocument.defaultView?.getComputedStyle(paddingBoxElement)\n        const borderBoxComputedStyle =\n          borderBoxElement?.ownerDocument.defaultView?.getComputedStyle(borderBoxElement)\n        const marginBoxComputedStyle =\n          marginBoxElement?.ownerDocument.defaultView?.getComputedStyle(marginBoxElement)\n        const padding = paddingBoxComputedStyle && {\n          top: parse(paddingBoxComputedStyle.paddingTop),\n          right: parse(paddingBoxComputedStyle.paddingRight),\n          bottom: parse(paddingBoxComputedStyle.paddingBottom),\n          left: parse(paddingBoxComputedStyle.paddingLeft),\n        }\n        const border = borderBoxComputedStyle && {\n          top: parse(borderBoxComputedStyle.borderTopWidth),\n          right: parse(borderBoxComputedStyle.borderRightWidth),\n          bottom: parse(borderBoxComputedStyle.borderBottomWidth),\n          left: parse(borderBoxComputedStyle.borderLeftWidth),\n        }\n        const margin = marginBoxComputedStyle && {\n          top: parse(marginBoxComputedStyle.marginTop),\n          right: parse(marginBoxComputedStyle.marginRight),\n          bottom: parse(marginBoxComputedStyle.marginBottom),\n          left: parse(marginBoxComputedStyle.marginLeft),\n        }\n\n        return borderBox ? createBox({ borderBox, padding, border, margin }) : null\n      },\n    }),\n    [boxElement],\n  )\n\n  const gridItemClassName = useStyle(\n    responsiveStyle([verticalAlign], ([alignItems = 'flex-start']) => ({ alignItems })),\n  )\n\n  const key = useMemo(\n    () => v4(),\n    [\n      boxAnimateType,\n      boxAnimateDuration,\n      boxAnimateDelay,\n      itemAnimateType,\n      itemAnimateDuration,\n      itemAnimateDelay,\n      itemStaggerDuration,\n    ],\n  )\n\n  const observerRef = useRef<IntersectionObserver | null>(null)\n\n  useEffect(() => {\n    if (boxElement) {\n      if (observerRef.current == null) {\n        observerRef.current = new IntersectionObserver(\n          function intersectionCallback([entry]: IntersectionObserverEntry[]) {\n            if (entry.isIntersecting) {\n              entry.target.classList.add('show')\n            }\n          },\n          {\n            root: null,\n            rootMargin: `0px 0px -10% 0px`,\n            threshold: 0.2,\n          },\n        )\n      }\n      observerRef.current.observe(boxElement)\n    } else {\n      observerRef.current?.disconnect()\n      observerRef.current = null\n    }\n\n    return () => {\n      if (boxElement) observerRef.current?.unobserve(boxElement)\n    }\n  }, [boxElement])\n\n  useEffect(() => {\n    boxElement?.classList.remove('show')\n    const timeout = setTimeout(() => boxElement?.classList.add('show'), 100)\n    return () => clearTimeout(timeout)\n  }, [key])\n\n  return (\n    <BackgroundsContainer\n      ref={setBoxElement}\n      id={id}\n      className={cx(\n        width,\n        margin,\n        borderRadius,\n        useStyle({ display: 'flex' }),\n        useStyle(responsiveStyle([height], ([alignSelf = 'auto']) => ({ alignSelf }))),\n      )}\n      boxAnimateType={boxAnimateType}\n      boxAnimateDuration={boxAnimateDuration}\n      boxAnimateDelay={boxAnimateDelay}\n      itemAnimationType={itemAnimateType}\n      backgrounds={backgrounds}\n    >\n      <div\n        ref={innerRef}\n        key={key}\n        className={cx(\n          padding,\n          boxShadow,\n          border,\n          useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' }),\n          useStyle(\n            responsiveStyle([verticalAlign], ([alignContent = 'flex-start']) => ({\n              alignContent,\n            })),\n          ),\n        )}\n      >\n        {children && children.elements.length > 0 ? (\n          children.elements.map((child, index) => (\n            <GridItem\n              key={child.key}\n              className={gridItemClassName}\n              grid={children.columns}\n              index={index}\n              itemAnimateType={itemAnimateType}\n              itemAnimateDuration={itemAnimateDuration}\n              itemAnimateDelay={itemAnimateDelay}\n              itemStaggerDuration={itemStaggerDuration}\n              columnGap={columnGap}\n              rowGap={rowGap}\n            >\n              <Element element={child} />\n            </GridItem>\n          ))\n        ) : (\n          <Placeholder hide={hidePlaceholder} />\n        )}\n      </div>\n    </BackgroundsContainer>\n  )\n})\n\nexport default Box\n"],"names":["forwardRef","ref","hide","restOfProps","visibility","useStyle","width","background","height","padding","overflow","Box","id","backgrounds","margin","border","children","borderRadius","boxShadow","rowGap","columnGap","hidePlaceholder","verticalAlign","boxAnimateType","boxAnimateDuration","boxAnimateDelay","itemAnimateDelay","itemAnimateType","itemAnimateDuration","itemStaggerDuration","innerRef","useRef","boxElement","setBoxElement","useState","useImperativeHandle","getBoxModel","paddingBoxElement","current","borderBoxElement","marginBoxElement","borderBox","getBoundingClientRect","paddingBoxComputedStyle","ownerDocument","defaultView","getComputedStyle","borderBoxComputedStyle","marginBoxComputedStyle","top","parse","paddingTop","right","paddingRight","bottom","paddingBottom","left","paddingLeft","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","marginTop","marginRight","marginBottom","marginLeft","createBox","gridItemClassName","responsiveStyle","alignItems","key","useMemo","v4","observerRef","useEffect","IntersectionObserver","entry","isIntersecting","target","classList","add","root","rootMargin","threshold","observe","disconnect","unobserve","remove","timeout","setTimeout","clearTimeout","cx","display","alignSelf","flexWrap","alignContent","elements","length","map","child","index","columns"],"mappings":"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"}
+{"version":3,"file":"Box.es.js","sources":["../src/components/builtin/Box/components/Placeholder/index.tsx","../src/components/builtin/Box/Box.tsx"],"sourcesContent":["import { forwardRef, Ref } from 'react'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\ntype Props = { hide?: boolean }\n\nexport default forwardRef(function Placeholder(\n  { hide = false, ...restOfProps }: Props,\n  ref: Ref<HTMLDivElement>,\n) {\n  return (\n    <div\n      {...restOfProps}\n      ref={ref}\n      style={{ visibility: hide ? 'hidden' : 'initial' }}\n      className={useStyle({\n        width: '100%',\n        background: 'rgba(161, 168, 194, 0.18)',\n        height: 80,\n        padding: 8,\n      })}\n    >\n      <svg\n        xmlns=\"http://www.w3.org/2000/svg\"\n        width=\"100%\"\n        height=\"100%\"\n        style={{ overflow: 'visible' }}\n      >\n        <rect\n          x={0}\n          y={0}\n          width=\"100%\"\n          height=\"100%\"\n          strokeWidth={2}\n          strokeDasharray=\"4 2\"\n          fill=\"none\"\n          stroke=\"rgba(161, 168, 194, 0.40)\"\n          rx=\"4\"\n          ry=\"4\"\n        />\n      </svg>\n    </div>\n  )\n})\n","import {\n  forwardRef,\n  Ref,\n  useCallback,\n  useEffect,\n  useImperativeHandle,\n  useMemo,\n  useRef,\n  useState,\n} from 'react'\nimport { cx } from '@emotion/css'\n\nimport { Element } from '../../../runtimes/react'\nimport Placeholder from './components/Placeholder'\nimport {\n  ElementIDValue,\n  ResponsiveIconRadioGroupValue,\n  GridValue,\n  GapYValue,\n  GapXValue,\n  CheckboxValue,\n  ResponsiveSelectValue,\n  ResponsiveNumberValue,\n  BackgroundsValue,\n} from '../../../prop-controllers/descriptors'\nimport { BoxModelHandle, parse, createBox } from '../../../box-model'\nimport BackgroundsContainer from '../../shared/BackgroundsContainer'\nimport { BoxAnimateIn } from './constants'\nimport { responsiveStyle } from '../../utils/responsive-style'\nimport { GridItem } from '../../shared/grid-item'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { v4 } from 'uuid'\n\ntype Props = {\n  id?: ElementIDValue\n  backgrounds?: BackgroundsValue\n  width?: string\n  height?: ResponsiveIconRadioGroupValue<'auto' | 'stretch'>\n  verticalAlign?: ResponsiveIconRadioGroupValue<\n    'flex-start' | 'center' | 'flex-end' | 'space-between'\n  >\n  margin?: string\n  padding?: string\n  border?: string\n  borderRadius?: string\n  boxShadow?: string\n  rowGap?: GapYValue\n  columnGap?: GapXValue\n  boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  boxAnimateDuration?: ResponsiveNumberValue\n  boxAnimateDelay?: ResponsiveNumberValue\n  itemAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  itemAnimateDuration?: ResponsiveNumberValue\n  itemAnimateDelay?: ResponsiveNumberValue\n  itemStaggerDuration?: ResponsiveNumberValue\n  hidePlaceholder?: CheckboxValue\n  children?: GridValue\n}\n\nconst Box = forwardRef(function Box(\n  {\n    id,\n    backgrounds,\n    width,\n    height,\n    margin,\n    padding,\n    border,\n    children,\n    borderRadius,\n    boxShadow,\n    rowGap,\n    columnGap,\n    hidePlaceholder,\n    verticalAlign,\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimateDelay,\n    itemAnimateType,\n    itemAnimateDuration,\n    itemStaggerDuration,\n  }: Props,\n  ref: Ref<BoxModelHandle>,\n) {\n  const innerRef = useRef<HTMLDivElement | null>(null)\n  const [boxElement, setBoxElement] = useState<HTMLElement | null>(null)\n\n  useImperativeHandle(\n    ref,\n    () => ({\n      getBoxModel() {\n        const paddingBoxElement = innerRef.current\n        const borderBoxElement = innerRef.current\n        const marginBoxElement = boxElement\n        const borderBox = innerRef.current?.getBoundingClientRect()\n        const paddingBoxComputedStyle =\n          paddingBoxElement?.ownerDocument.defaultView?.getComputedStyle(paddingBoxElement)\n        const borderBoxComputedStyle =\n          borderBoxElement?.ownerDocument.defaultView?.getComputedStyle(borderBoxElement)\n        const marginBoxComputedStyle =\n          marginBoxElement?.ownerDocument.defaultView?.getComputedStyle(marginBoxElement)\n        const padding = paddingBoxComputedStyle && {\n          top: parse(paddingBoxComputedStyle.paddingTop),\n          right: parse(paddingBoxComputedStyle.paddingRight),\n          bottom: parse(paddingBoxComputedStyle.paddingBottom),\n          left: parse(paddingBoxComputedStyle.paddingLeft),\n        }\n        const border = borderBoxComputedStyle && {\n          top: parse(borderBoxComputedStyle.borderTopWidth),\n          right: parse(borderBoxComputedStyle.borderRightWidth),\n          bottom: parse(borderBoxComputedStyle.borderBottomWidth),\n          left: parse(borderBoxComputedStyle.borderLeftWidth),\n        }\n        const margin = marginBoxComputedStyle && {\n          top: parse(marginBoxComputedStyle.marginTop),\n          right: parse(marginBoxComputedStyle.marginRight),\n          bottom: parse(marginBoxComputedStyle.marginBottom),\n          left: parse(marginBoxComputedStyle.marginLeft),\n        }\n\n        return borderBox ? createBox({ borderBox, padding, border, margin }) : null\n      },\n    }),\n    [boxElement],\n  )\n\n  const gridItemClassName = useStyle(\n    responsiveStyle([verticalAlign], ([alignItems = 'flex-start']) => ({ alignItems })),\n  )\n\n  const key = useMemo(\n    () => v4(),\n    [\n      boxAnimateType,\n      boxAnimateDuration,\n      boxAnimateDelay,\n      itemAnimateType,\n      itemAnimateDuration,\n      itemAnimateDelay,\n      itemStaggerDuration,\n    ],\n  )\n\n  const observerRef = useRef<IntersectionObserver | null>(null)\n  const hasIntersected = useRef(false)\n  const elementCallback = useCallback((element: HTMLDivElement | null) => {\n    if (element) {\n      const observer =\n        observerRef.current ??\n        new IntersectionObserver(\n          function intersectionCallback([entry]: IntersectionObserverEntry[]) {\n            if (entry.isIntersecting) {\n              entry.target.classList.add('show')\n              hasIntersected.current = true\n            }\n          },\n          {\n            root: null,\n            rootMargin: `0px 0px -10% 0px`,\n            threshold: 0.2,\n          },\n        )\n      observer.observe(element)\n      observerRef.current = observer\n    } else {\n      observerRef.current?.disconnect()\n      observerRef.current = null\n    }\n\n    setBoxElement(element)\n  }, [])\n\n  useEffect(() => {\n    if (hasIntersected.current === false) return\n\n    boxElement?.classList.remove('show')\n    const timeout = setTimeout(() => boxElement?.classList.add('show'), 100)\n    return () => clearTimeout(timeout)\n  }, [key])\n\n  return (\n    <BackgroundsContainer\n      ref={elementCallback}\n      id={id}\n      className={cx(\n        width,\n        margin,\n        borderRadius,\n        useStyle({ display: 'flex' }),\n        useStyle(responsiveStyle([height], ([alignSelf = 'auto']) => ({ alignSelf }))),\n      )}\n      boxAnimateType={boxAnimateType}\n      boxAnimateDuration={boxAnimateDuration}\n      boxAnimateDelay={boxAnimateDelay}\n      itemAnimationType={itemAnimateType}\n      backgrounds={backgrounds}\n    >\n      <div\n        ref={innerRef}\n        key={key}\n        className={cx(\n          padding,\n          boxShadow,\n          border,\n          useStyle({ display: 'flex', flexWrap: 'wrap', width: '100%' }),\n          useStyle(\n            responsiveStyle([verticalAlign], ([alignContent = 'flex-start']) => ({\n              alignContent,\n            })),\n          ),\n        )}\n      >\n        {children && children.elements.length > 0 ? (\n          children.elements.map((child, index) => (\n            <GridItem\n              key={child.key}\n              className={gridItemClassName}\n              grid={children.columns}\n              index={index}\n              itemAnimateDuration={itemAnimateDuration}\n              itemAnimateDelay={itemAnimateDelay}\n              itemStaggerDuration={itemStaggerDuration}\n              columnGap={columnGap}\n              rowGap={rowGap}\n            >\n              <Element element={child} />\n            </GridItem>\n          ))\n        ) : (\n          <Placeholder hide={hidePlaceholder} />\n        )}\n      </div>\n    </BackgroundsContainer>\n  )\n})\n\nexport default Box\n"],"names":["forwardRef","ref","hide","restOfProps","visibility","useStyle","width","background","height","padding","overflow","Box","id","backgrounds","margin","border","children","borderRadius","boxShadow","rowGap","columnGap","hidePlaceholder","verticalAlign","boxAnimateType","boxAnimateDuration","boxAnimateDelay","itemAnimateDelay","itemAnimateType","itemAnimateDuration","itemStaggerDuration","innerRef","useRef","boxElement","setBoxElement","useState","useImperativeHandle","getBoxModel","paddingBoxElement","current","borderBoxElement","marginBoxElement","borderBox","getBoundingClientRect","paddingBoxComputedStyle","ownerDocument","defaultView","getComputedStyle","borderBoxComputedStyle","marginBoxComputedStyle","top","parse","paddingTop","right","paddingRight","bottom","paddingBottom","left","paddingLeft","borderTopWidth","borderRightWidth","borderBottomWidth","borderLeftWidth","marginTop","marginRight","marginBottom","marginLeft","createBox","gridItemClassName","responsiveStyle","alignItems","key","useMemo","v4","observerRef","hasIntersected","elementCallback","useCallback","element","observer","IntersectionObserver","entry","isIntersecting","target","classList","add","root","rootMargin","threshold","observe","disconnect","useEffect","remove","timeout","setTimeout","clearTimeout","cx","display","alignSelf","flexWrap","alignContent","elements","length","map","child","index","columns"],"mappings":"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"}

package/dist/grid-item.cjs.js

@@ -699,7 +699,6 @@ function GridItem(_g) {
     columnGap,
     rowGap,
     className,
-    itemAnimateType,
     itemAnimateDuration,
     itemAnimateDelay,
     itemStaggerDuration
@@ -709,7 +708,6 @@ function GridItem(_g) {
     "columnGap",
     "rowGap",
     "className",
-    "itemAnimateType",
     "itemAnimateDuration",
     "itemAnimateDelay",
     "itemStaggerDuration"

package/dist/grid-item.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid-item.cjs.js","sources":["../src/components/hooks/useBackgrounds.ts","../src/components/builtin/Box/animations.tsx","../src/utils/clamp.ts","../src/components/shared/BackgroundsContainer/components/Parallax/index.tsx","../src/components/shared/BackgroundsContainer/components/BackgroundVideo/index.tsx","../src/components/shared/BackgroundsContainer/components/Backgrounds/index.tsx","../src/components/shared/BackgroundsContainer/index.tsx","../src/components/shared/grid-item.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { ColorValue as Color } from '../utils/types'\nimport { ResponsiveValue } from '../../prop-controllers'\nimport { isNonNullable } from '../utils/isNonNullable'\nimport { BackgroundsValue as ResponsiveBackgroundsValue } from '../../prop-controllers/descriptors'\nimport { useFiles, useSwatches } from '../../runtimes/react/hooks/makeswift-api'\nimport {\n  getBackgroundsFileIds,\n  getBackgroundsSwatchIds,\n} from '../../prop-controllers/introspection'\n\ntype BackgroundColorData = Color\n\ntype BackgroundGradientStopData = {\n  id: string\n  location: number\n  color: Color | null | undefined\n}\n\ntype BackgroundGradientData = {\n  angle?: number\n  isRadial?: boolean\n  stops: Array<BackgroundGradientStopData>\n}\n\ntype BackgroundImageData = {\n  publicUrl?: string\n  dimensions?: { width: number; height: number } | null\n  position: {\n    x: number\n    y: number\n  }\n  size?: 'cover' | 'contain' | 'auto'\n  repeat?: 'no-repeat' | 'repeat-x' | 'repeat-y' | 'repeat'\n  opacity?: number\n  parallax?: number\n}\n\ntype BackgroundVideoData = {\n  url?: string\n  maskColor: Color | null | undefined\n  aspectRatio?: 'wide' | 'standard'\n  opacity?: number\n  zoom?: number\n  parallax?: number\n}\n\ntype BackgroundData =\n  | { id: string; type: 'color'; payload: BackgroundColorData | null | undefined }\n  | { id: string; type: 'image'; payload: BackgroundImageData | null | undefined }\n  | { id: string; type: 'gradient'; payload: BackgroundGradientData | null | undefined }\n  | { id: string; type: 'video'; payload: BackgroundVideoData | null | undefined }\n\nexport type BackgroundsData = Array<BackgroundData>\n\nexport type BackgroundsPropControllerData = ResponsiveValue<BackgroundsData>\n\nexport function useBackgrounds(\n  value: ResponsiveBackgroundsValue | null | undefined,\n): BackgroundsPropControllerData | null | undefined {\n  const fileIds = getBackgroundsFileIds(value)\n  const files = useFiles(fileIds)\n  const swatchIds = getBackgroundsSwatchIds(value)\n  const swatches = useSwatches(swatchIds)\n\n  return useMemo(() => {\n    if (value == null) return null\n\n    return value.map(({ value: backgrounds, ...restOfValue }) => ({\n      ...restOfValue,\n      value: backgrounds\n        .map((bg): BackgroundData | null | undefined => {\n          if (bg.type === 'image' && bg.payload != null && bg.payload.imageId != null) {\n            const { imageId, ...restOfPayload } = bg.payload\n            const file = files.find(f => f && f.id === imageId)\n\n            return (\n              file && {\n                id: bg.id,\n                type: 'image',\n                payload: {\n                  ...restOfPayload,\n                  publicUrl: file.publicUrl,\n                  dimensions: file.dimensions,\n                },\n              }\n            )\n          }\n\n          if (bg.type === 'color' && bg.payload != null) {\n            const { swatchId, alpha } = bg.payload\n            const swatch = swatches.filter(isNonNullable).find(s => s && s.id === swatchId)\n\n            return { id: bg.id, type: 'color', payload: { swatch, alpha } }\n          }\n\n          if (bg.type === 'gradient' && bg.payload != null && bg.payload.stops.length > 0) {\n            return {\n              id: bg.id,\n              type: 'gradient',\n              payload: {\n                angle: bg.payload.angle,\n                isRadial: bg.payload.isRadial,\n                stops: bg.payload.stops.map(({ color, ...restOfStop }) => ({\n                  ...restOfStop,\n                  color: color && {\n                    swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n                    alpha: color.alpha,\n                  },\n                })),\n              },\n            }\n          }\n\n          if (bg.type === 'video' && bg.payload != null) {\n            const { maskColor, ...restOfPayload } = bg.payload\n            const swatch = maskColor && swatches.find(s => s && s.id === maskColor.swatchId)\n\n            return {\n              id: bg.id,\n              type: 'video',\n              payload: {\n                ...restOfPayload,\n                maskColor: swatch && maskColor && { swatch, alpha: maskColor.alpha },\n              },\n            }\n          }\n\n          return null\n        })\n        .filter(isNonNullable),\n    }))\n  }, [files, swatches, value])\n}\n","import { CSSObject } from '@emotion/css'\nimport { useEffect, useState } from 'react'\nimport { ResponsiveValue } from '../../../prop-controllers'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useMediaQuery } from '../../hooks'\nimport {\n  BoxAnimateIn,\n  DEFAULT_BOX_ANIMATE_DELAY,\n  DEFAULT_BOX_ANIMATE_DURATION,\n  DEFAULT_BOX_ANIMATE_TYPE,\n  DEFAULT_ITEM_ANIMATE_TYPE,\n  DEFAULT_ITEM_STAGGER_DURATION,\n} from './constants'\n\nconst QUERY = '(prefers-reduced-motion: no-preference)'\n\nfunction usePrefersReducedMotion() {\n  const [prefersReducedMotion, setPrefersReducedMotion] = useState(false)\n\n  useEffect(() => {\n    const mediaQueryList = window.matchMedia(QUERY)\n\n    setPrefersReducedMotion(!window.matchMedia(QUERY).matches)\n\n    const listener = (event: MediaQueryListEvent) => {\n      setPrefersReducedMotion(!event.matches)\n    }\n    mediaQueryList.addEventListener('change', listener)\n    return () => {\n      mediaQueryList.removeEventListener('change', listener)\n    }\n  }, [])\n\n  return prefersReducedMotion\n}\n\nconst exitedBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n  none: { opacity: 1 },\n  fadeIn: { opacity: 0 },\n  fadeLeft: { transform: 'translate3d(60px,0,0)', opacity: 0 },\n  fadeRight: { transform: 'translate3d(-60px,0,0)', opacity: 0 },\n  fadeDown: { transform: 'translate3d(0,-80px,0)', opacity: 0 },\n  fadeUp: { transform: 'translate3d(0,80px,0)', opacity: 0 },\n  blurIn: { filter: 'blur(20px)', opacity: 0 },\n  scaleDown: {\n    transform: 'scale(1.2)',\n    opacity: 0,\n  },\n  scaleUp: {\n    transform: 'scale(.75)',\n    opacity: 0,\n  },\n}\n\nconst enteredBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n  none: { opacity: 1 },\n  fadeIn: { opacity: 1 },\n  fadeLeft: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n  fadeRight: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n  fadeDown: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n  fadeUp: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n  blurIn: { filter: 'blur(0px)', opacity: 1 },\n  scaleDown: {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n  scaleUp: {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n}\n\nexport function useBoxAnimation(\n  responsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n  responsiveDuration: ResponsiveValue<number> | undefined,\n  responisveDelay: ResponsiveValue<number> | undefined,\n  itemResponsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n) {\n  const reducedMotion = usePrefersReducedMotion()\n  const animationType = useMediaQuery(responsiveAnimationType) || DEFAULT_BOX_ANIMATE_TYPE\n  const itemAnimationType = useMediaQuery(itemResponsiveAnimationType) || DEFAULT_ITEM_ANIMATE_TYPE\n  const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n  const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n  const actualDelay = delay * 1000\n  const actualDuration = duration * 1000\n\n  const className = useStyle({\n    ...exitedBoxAnimationProperties[animationType],\n    transition: `all 0ms`,\n    '&.show': {\n      ...enteredBoxAnimationProperties[animationType],\n      transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms`,\n    },\n    '&:not(.show) > div > div': {\n      ...exitedBoxAnimationProperties[itemAnimationType],\n      transition: `all 0ms !important`,\n    },\n    '&.show > div > div': {\n      ...enteredBoxAnimationProperties[itemAnimationType],\n    },\n  })\n\n  if (reducedMotion) {\n    return ''\n  }\n\n  return className\n}\n\nexport function useItemAnimation(\n  responsiveDuration: ResponsiveValue<number> | undefined,\n  responisveDelay: ResponsiveValue<number> | undefined,\n  responsiveStagger: ResponsiveValue<number> | undefined,\n  index: number,\n) {\n  const reducedMotion = usePrefersReducedMotion()\n  const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n  const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n  const stagger = useMediaQuery(responsiveStagger) || DEFAULT_ITEM_STAGGER_DURATION\n  const delayFromStagger = responsiveStagger == null || index == null ? 0 : stagger * index\n  const actualDelay = (delay + delayFromStagger) * 1000\n  const actualDuration = duration * 1000\n\n  const className = useStyle({\n    transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms !important`,\n  })\n\n  if (reducedMotion) {\n    return ''\n  }\n\n  return className\n}\n","const clamp = (min: number, val: number, max: number): number => Math.min(Math.max(min, val), max)\n\nexport default clamp\n","import { useState, useRef, useCallback, ReactNode, CSSProperties } from 'react'\nimport clamp from '../../../../../utils/clamp'\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nfunction isScrollable(element: HTMLElement) {\n  const { overflow, overflowY, overflowX } =\n    element.ownerDocument.defaultView!.getComputedStyle(element)\n\n  return /(auto|scroll)/.test(overflow + overflowX + overflowY)\n}\n\nfunction getScrollParent(element: HTMLElement): HTMLElement {\n  const { parentElement } = element\n\n  if (!element || !parentElement) return element\n\n  if (isScrollable(element)) return element\n\n  return getScrollParent(parentElement)\n}\n\ntype Props = {\n  strength: number | null | undefined\n  children: (\n    getParallaxProps: <P extends { style?: CSSProperties; [key: string]: unknown }>(props: P) => P,\n  ) => ReactNode\n}\n\nexport default function Parallax({ strength, children, ...rest }: Props): JSX.Element {\n  const container = useRef<HTMLDivElement>(null)\n  const [containerScrollTop, setContainerScrollTop] = useState(strength == null ? 0 : strength)\n  const lastScrollParentScrollTop = useRef(0)\n\n  useIsomorphicLayoutEffect(() => {\n    if (!container.current || strength == null || strength === 0) return undefined\n\n    const containerDocument = container.current.ownerDocument\n    const scrollParent = getScrollParent(container.current)\n    const eventTarget =\n      containerDocument.documentElement === scrollParent\n        ? containerDocument.defaultView!\n        : scrollParent\n\n    lastScrollParentScrollTop.current = scrollParent.scrollTop\n    setContainerScrollTop(strength)\n\n    function handleScroll() {\n      containerDocument.defaultView!.requestAnimationFrame(() => {\n        if (!container.current) return\n\n        const { top: containerTop, bottom: containerBottom } =\n          container.current.getBoundingClientRect()\n        const { top: scrollParentTop, bottom: scrollParentBottom } =\n          scrollParent === containerDocument.documentElement\n            ? { top: 0, bottom: containerDocument.defaultView!.innerHeight }\n            : scrollParent.getBoundingClientRect()\n        const { scrollTop: scrollParentScrollTop } =\n          scrollParent === containerDocument.documentElement\n            ? { scrollTop: containerDocument.defaultView!.pageYOffset }\n            : scrollParent\n        const scrollParentHeight = scrollParentBottom - scrollParentTop\n        const scrollParentScrollDelta = scrollParentScrollTop - lastScrollParentScrollTop.current\n\n        lastScrollParentScrollTop.current = scrollParentScrollTop\n\n        setContainerScrollTop(scrollTop => {\n          const isContainerVisible =\n            containerTop < scrollParentTop + scrollParentHeight && containerBottom > scrollParentTop\n          const containerScrollRemaining =\n            scrollParentScrollDelta > 0 ? 2 * strength! - scrollTop : scrollTop\n          const scrollParentScrollRemaining =\n            scrollParentScrollDelta > 0\n              ? scrollParentTop + containerBottom\n              : scrollParentHeight - containerTop\n          const parallaxRatio = containerScrollRemaining / scrollParentScrollRemaining\n          const containerScrollDelta = isContainerVisible\n            ? parallaxRatio * scrollParentScrollDelta\n            : 0\n\n          return clamp(0, scrollTop + containerScrollDelta, strength! * 2)\n        })\n      })\n    }\n\n    eventTarget.addEventListener('scroll', handleScroll)\n\n    return () => eventTarget.removeEventListener('scroll', handleScroll)\n  }, [strength])\n\n  const getProps = useCallback(\n    ({ style, ...restOfChildrenProps }: any) => ({\n      ...restOfChildrenProps,\n      style: {\n        ...style,\n        position: 'absolute',\n        left: 0,\n        right: 0,\n        top: 0,\n        bottom: 0,\n        ...(strength == null || strength === 0\n          ? {}\n          : {\n              top: -strength,\n              bottom: -strength,\n              transform: `translate3d(0, ${containerScrollTop - strength}px, 0)`,\n            }),\n      },\n    }),\n    [strength, containerScrollTop],\n  )\n\n  return (\n    <div\n      {...rest}\n      ref={container}\n      style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}\n    >\n      {children(getProps)}\n    </div>\n  )\n}\n","import { cx } from '@emotion/css'\nimport { useState, useRef, ComponentPropsWithoutRef, ForwardedRef, forwardRef } from 'react'\nimport ReactPlayer from 'react-player'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nconst Container = forwardRef(function Container(\n  { className, ...restOfProps }: ComponentPropsWithoutRef<'div'>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  return (\n    <div\n      {...restOfProps}\n      ref={ref}\n      className={cx(\n        useStyle({\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          right: 0,\n          bottom: 0,\n          pointerEvents: 'none',\n          overflow: 'hidden',\n        }),\n        className,\n      )}\n    />\n  )\n})\n\nfunction Mask({\n  backgroundColor,\n  visible,\n}: {\n  backgroundColor: string | undefined\n  visible: boolean\n}) {\n  return (\n    <div\n      className={useStyle({\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n        background: backgroundColor,\n        opacity: visible ? 1 : 0,\n        transition: 'opacity 1s',\n      })}\n    />\n  )\n}\n\nconst getScale = (element: HTMLElement, aspectRatio: number, zoom: number) => {\n  const { offsetWidth: width, offsetHeight: height } = element\n  const computedAspectRatio = width / height\n\n  return Math.max(aspectRatio / computedAspectRatio, computedAspectRatio / aspectRatio) * zoom\n}\n\ntype Props = {\n  url?: string\n  aspectRatio?: number\n  zoom?: number\n  opacity?: number\n  maskColor?: string\n}\n\nexport default function BackgroundVideo({\n  url = '',\n  aspectRatio = 16 / 9,\n  zoom = 1,\n  maskColor,\n  opacity,\n}: Props): JSX.Element {\n  const [ready, setReady] = useState(false)\n  const [scale, setScale] = useState(1)\n  const container = useRef<HTMLDivElement>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    const { current: containerEl } = container\n\n    if (!containerEl) return undefined\n\n    const { defaultView } = containerEl.ownerDocument\n    const handleResize = () => setScale(getScale(containerEl, aspectRatio, zoom))\n\n    handleResize()\n\n    defaultView!.addEventListener('resize', handleResize)\n\n    return () => defaultView!.removeEventListener('resize', handleResize)\n  }, [aspectRatio, zoom])\n\n  if (!ReactPlayer.canPlay(url)) return <></>\n\n  return (\n    <Container ref={container}>\n      {container.current && (\n        <ReactPlayer\n          url={url}\n          config={{\n            vimeo: { playerOptions: { background: true } },\n            youtube: {\n              playerVars: {\n                origin: container.current.ownerDocument.defaultView?.location.origin,\n              },\n            },\n            wistia: {\n              options: {\n                endVideoBehavior: 'loop',\n                playbackRateControl: false,\n                playbar: false,\n                playButton: false,\n                volumeControl: false,\n                fullscreenButton: false,\n                muted: true,\n              },\n            },\n          }}\n          playing\n          loop\n          muted\n          controls={false}\n          onReady={() => setReady(true)}\n          style={{\n            transform: `scale3d(${scale}, ${scale}, 1)`,\n            opacity,\n          }}\n          width=\"100%\"\n          height=\"100%\"\n        />\n      )}\n      <Mask backgroundColor={maskColor} visible={!ready} />\n    </Container>\n  )\n}\n","import NextImage from 'next/image'\n\nimport { BackgroundsPropControllerData, BackgroundsData } from '../../../../hooks'\nimport { ResponsiveValue } from '../../../../../prop-controllers'\nimport { ColorValue as Color } from '../../../../utils/types'\nimport { colorToString } from '../../../../utils/colorToString'\nimport Parallax from '../Parallax'\nimport BackgroundVideo from '../BackgroundVideo'\nimport { CSSObject } from '@emotion/css'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\nimport { responsiveStyle } from '../../../../utils/responsive-style'\n\nfunction getColor(color: Color | null | undefined) {\n  if (color == null) return 'black'\n\n  if (color.swatch == null) {\n    return colorToString({ ...color, swatch: { hue: 0, saturation: 0, lightness: 0 } })\n  }\n\n  return colorToString(color)\n}\n\ntype GradientStop = { color: Color | null | undefined; location: number }\n\nconst getStopsStyle = (stops: GradientStop[]) =>\n  stops.map(({ color, location }) => `${getColor(color)} ${location}%`).join(',')\n\nconst absoluteFillStyle: CSSObject = {\n  position: 'absolute',\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n}\n\nconst containerStyle: CSSObject = {\n  ...absoluteFillStyle,\n  borderRadius: 'inherit',\n}\n\ntype Props = { backgrounds: BackgroundsPropControllerData | null | undefined }\n\nexport default function Backgrounds({ backgrounds }: Props): JSX.Element {\n  if (backgrounds == null) return <></>\n\n  return (\n    <>\n      {backgrounds.map(({ value, deviceId }) => {\n        const visibility = backgrounds.map(v => ({\n          deviceId: v.deviceId,\n          value: v.deviceId === deviceId,\n        }))\n\n        return <BackgroundDeviceLayer key={deviceId} layer={value} visibility={visibility} />\n      })}\n    </>\n  )\n}\n\ntype BackgroundLayerProps = {\n  layer: BackgroundsData\n  visibility: ResponsiveValue<boolean>\n}\n\nfunction BackgroundDeviceLayer({ layer, visibility }: BackgroundLayerProps) {\n  const visibilityStyle = responsiveStyle([visibility], ([v]) => ({\n    display: v === true ? 'block' : 'none',\n  }))\n\n  return (\n    <div className={useStyle({ ...containerStyle, ...visibilityStyle, overflow: 'hidden' })}>\n      {[...layer].reverse().map(bg => {\n        if (bg.type === 'color') {\n          return <ColorBackground key={bg.id} color={getColor(bg.payload)} />\n        }\n\n        if (bg.type === 'image' && bg.payload) {\n          return <ImageBackground {...bg.payload} key={bg.id} />\n        }\n\n        if (bg.type === 'gradient' && bg.payload) {\n          return (\n            <GradientBackground\n              {...bg.payload}\n              key={bg.id}\n              gradient={getStopsStyle(bg.payload.stops)}\n            />\n          )\n        }\n\n        if (bg.type === 'video' && bg.payload) {\n          return (\n            <VideoBackground\n              {...bg.payload}\n              key={bg.id}\n              maskColor={getColor(bg.payload.maskColor)}\n            />\n          )\n        }\n\n        return null\n      })}\n    </div>\n  )\n}\n\ntype ColorBackgroundProps = { color: string }\n\nfunction ColorBackground({ color }: ColorBackgroundProps) {\n  return <div className={useStyle({ ...containerStyle, backgroundColor: color })} />\n}\n\nconst ImageBackgroundRepeat = {\n  NoRepeat: 'no-repeat',\n  RepeatX: 'repeat-x',\n  RepeatY: 'repeat-y',\n  Repeat: 'repeat',\n} as const\n\ntype ImageBackgroundRepeat = typeof ImageBackgroundRepeat[keyof typeof ImageBackgroundRepeat]\n\nconst ImageBackgroundSize = {\n  Cover: 'cover',\n  Contain: 'contain',\n  Auto: 'auto',\n} as const\n\ntype ImageBackgroundSize = typeof ImageBackgroundSize[keyof typeof ImageBackgroundSize]\n\ntype ImageBackgroundProps = {\n  publicUrl?: string\n  position: { x: number; y: number }\n  repeat?: ImageBackgroundRepeat\n  size?: ImageBackgroundSize\n  opacity?: number\n  parallax?: number\n}\n\nfunction ImageBackground({\n  publicUrl,\n  position,\n  repeat = ImageBackgroundRepeat.NoRepeat,\n  size = ImageBackgroundSize.Cover,\n  opacity,\n  parallax,\n}: ImageBackgroundProps) {\n  const backgroundPosition = `${position.x}% ${position.y}%`\n  const containerClassName = useStyle(containerStyle)\n\n  if (repeat === 'no-repeat' && size !== 'auto' && publicUrl != null) {\n    return (\n      <Parallax strength={parallax}>\n        {getParallaxProps => (\n          <div {...getParallaxProps({ style: { opacity, overflow: 'hidden' } })}>\n            <NextImage\n              src={publicUrl}\n              layout=\"fill\"\n              objectPosition={backgroundPosition}\n              objectFit={size}\n            />\n          </div>\n        )}\n      </Parallax>\n    )\n  }\n\n  return (\n    <Parallax strength={parallax}>\n      {getParallaxProps => (\n        <div\n          className={containerClassName}\n          {...getParallaxProps({\n            style: {\n              backgroundImage: publicUrl != null ? `url('${publicUrl}')` : undefined,\n              backgroundPosition,\n              backgroundRepeat: repeat,\n              backgroundSize: size,\n              opacity,\n            },\n          })}\n        />\n      )}\n    </Parallax>\n  )\n}\n\ntype GradientBackgroundProps = {\n  gradient: string\n  angle?: number\n  isRadial?: boolean\n}\n\nfunction GradientBackground({\n  gradient,\n  isRadial = false,\n  angle = Math.PI,\n}: GradientBackgroundProps) {\n  return (\n    <div\n      className={useStyle({\n        ...containerStyle,\n        background: isRadial\n          ? `radial-gradient(${gradient})`\n          : `linear-gradient(${angle}rad, ${gradient})`,\n      })}\n    />\n  )\n}\n\nconst BackgroundVideoAspectRatio = {\n  Wide: 'wide',\n  Standard: 'standard',\n} as const\n\ntype BackgroundVideoAspectRatio =\n  typeof BackgroundVideoAspectRatio[keyof typeof BackgroundVideoAspectRatio]\n\nfunction getAspectRatio(aspectRatio: BackgroundVideoAspectRatio | null | undefined): number {\n  switch (aspectRatio) {\n    case 'wide':\n      return 16 / 9\n\n    case 'standard':\n      return 4 / 3\n\n    default:\n      return 16 / 9\n  }\n}\n\ntype VideoBackgroundProps = {\n  url?: string\n  aspectRatio?: BackgroundVideoAspectRatio\n  maskColor: string\n  zoom?: number\n  opacity?: number\n  parallax?: number\n}\n\nfunction VideoBackground({\n  url,\n  aspectRatio,\n  maskColor,\n  zoom,\n  opacity,\n  parallax,\n}: VideoBackgroundProps) {\n  return (\n    <Parallax strength={parallax}>\n      {getParallaxProps => (\n        <div {...getParallaxProps({ className: useStyle(containerStyle) })}>\n          <BackgroundVideo\n            url={url}\n            zoom={zoom}\n            opacity={opacity}\n            aspectRatio={getAspectRatio(aspectRatio)}\n            maskColor={maskColor}\n          />\n        </div>\n      )}\n    </Parallax>\n  )\n}\n","import { cx } from '@emotion/css'\nimport {\n  Children,\n  ComponentPropsWithoutRef,\n  ElementType,\n  forwardRef,\n  ReactElement,\n  Ref,\n  useImperativeHandle,\n  useState,\n} from 'react'\nimport {\n  BackgroundsValue as BackgroundsPropControllerValue,\n  ResponsiveNumberValue,\n  ResponsiveSelectValue,\n} from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useBoxAnimation } from '../../builtin/Box/animations'\nimport { BoxAnimateIn } from '../../builtin/Box/constants'\nimport { useBackgrounds } from '../../hooks'\nimport Backgrounds from './components/Backgrounds'\n\ntype BaseProps = {\n  backgrounds: BackgroundsPropControllerValue | null | undefined\n  children: ReactElement<ElementType>\n  boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  boxAnimateDuration?: ResponsiveNumberValue\n  boxAnimateDelay?: ResponsiveNumberValue\n  itemAnimationType?: ResponsiveSelectValue<BoxAnimateIn>\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport default forwardRef<HTMLDivElement | null, Props>(function BackgroundsContainer(\n  {\n    backgrounds,\n    children,\n    className,\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimationType,\n    ...restOfProps\n  }: Props,\n  ref: Ref<HTMLDivElement | null>,\n) {\n  const [handle, setHandle] = useState<HTMLDivElement | null>(null)\n\n  useImperativeHandle(ref, () => handle, [handle])\n\n  const animationClassName = useBoxAnimation(\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimationType,\n  )\n\n  return (\n    <div\n      {...restOfProps}\n      ref={setHandle}\n      className={cx(\n        useStyle({\n          position: 'relative',\n          width: '100%',\n          margin: '0 auto',\n          '> *': {\n            borderRadius: 'inherit',\n            height: 'inherit',\n          },\n          '> :last-child': {\n            position: 'relative',\n          },\n        }),\n        className,\n        animationClassName,\n      )}\n    >\n      <Backgrounds backgrounds={useBackgrounds(backgrounds)} />\n      {Children.only(children)}\n    </div>\n  )\n})\n","import { cx } from '@emotion/css'\nimport { ComponentPropsWithoutRef } from 'react'\nimport {\n  ResponsiveValue,\n  Length as LengthValue,\n  ResponsiveSelectValue,\n  ResponsiveNumberValue,\n} from '../../prop-controllers'\nimport { useStyle } from '../../runtimes/react/use-style'\nimport { BoxAnimateIn } from '../builtin/Box/constants'\nimport { useItemAnimation } from '../builtin/Box/animations'\nimport { responsiveGridItem } from '../utils/responsive-style'\n\ntype BaseProps = {\n  className?: string\n  grid: ResponsiveValue<{ spans: Array<Array<number>>; count: number }>\n  index: number\n  columnGap?: ResponsiveValue<LengthValue>\n  rowGap?: ResponsiveValue<LengthValue>\n\n  itemAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  itemAnimateDuration?: ResponsiveNumberValue\n  itemAnimateDelay?: ResponsiveNumberValue\n  itemStaggerDuration?: ResponsiveNumberValue\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport function GridItem({\n  grid,\n  index,\n  columnGap,\n  rowGap,\n  className,\n  itemAnimateType,\n  itemAnimateDuration,\n  itemAnimateDelay,\n  itemStaggerDuration,\n  ...restOfProps\n}: Props) {\n  const gridItemClassName = useStyle(responsiveGridItem({ grid, index, columnGap, rowGap }))\n  const animationClassName = useItemAnimation(\n    itemAnimateDuration,\n    itemAnimateDelay,\n    itemStaggerDuration,\n    index,\n  )\n\n  return <div {...restOfProps} className={cx(gridItemClassName, className, animationClassName)} />\n}\n"],"names":["getBackgroundsFileIds","useFiles","getBackgroundsSwatchIds","useSwatches","useMemo","isNonNullable","QUERY","prefersReducedMotion","setPrefersReducedMotion","useState","useEffect","mediaQueryList","window","matchMedia","matches","listener","event","addEventListener","removeEventListener","exitedBoxAnimationProperties","none","opacity","fadeIn","fadeLeft","transform","fadeRight","fadeDown","fadeUp","blurIn","filter","scaleDown","scaleUp","enteredBoxAnimationProperties","responsiveAnimationType","responsiveDuration","responisveDelay","itemResponsiveAnimationType","reducedMotion","usePrefersReducedMotion","animationType","useMediaQuery","DEFAULT_BOX_ANIMATE_TYPE","itemAnimationType","DEFAULT_ITEM_ANIMATE_TYPE","duration","DEFAULT_BOX_ANIMATE_DURATION","delay","DEFAULT_BOX_ANIMATE_DELAY","actualDelay","actualDuration","className","useStyle","transition","responsiveStagger","index","stagger","DEFAULT_ITEM_STAGGER_DURATION","delayFromStagger","element","overflow","overflowY","overflowX","ownerDocument","defaultView","getComputedStyle","test","parentElement","isScrollable","getScrollParent","strength","children","rest","container","useRef","containerScrollTop","setContainerScrollTop","lastScrollParentScrollTop","useIsomorphicLayoutEffect","current","undefined","containerDocument","scrollParent","eventTarget","documentElement","scrollTop","requestAnimationFrame","top","containerTop","bottom","containerBottom","getBoundingClientRect","scrollParentTop","scrollParentBottom","innerHeight","scrollParentScrollTop","pageYOffset","scrollParentHeight","scrollParentScrollDelta","isContainerVisible","containerScrollRemaining","scrollParentScrollRemaining","parallaxRatio","containerScrollDelta","clamp","handleScroll","getProps","useCallback","style","restOfChildrenProps","position","left","right","Container","forwardRef","ref","restOfProps","cx","pointerEvents","backgroundColor","visible","background","getScale","aspectRatio","zoom","offsetWidth","width","offsetHeight","height","computedAspectRatio","Math","max","url","maskColor","ready","setReady","scale","setScale","containerEl","handleResize","ReactPlayer","canPlay","_jsx","_Fragment","vimeo","playerOptions","youtube","playerVars","origin","location","wistia","options","endVideoBehavior","playbackRateControl","playbar","playButton","volumeControl","fullscreenButton","muted","color","swatch","colorToString","hue","saturation","lightness","getStopsStyle","stops","map","getColor","join","absoluteFillStyle","containerStyle","borderRadius","backgrounds","value","deviceId","visibility","v","layer","visibilityStyle","responsiveStyle","display","reverse","bg","type","payload","id","ImageBackgroundRepeat","NoRepeat","RepeatX","RepeatY","Repeat","ImageBackgroundSize","Cover","Contain","Auto","publicUrl","repeat","size","parallax","backgroundPosition","x","y","containerClassName","getParallaxProps","NextImage","backgroundImage","backgroundRepeat","backgroundSize","gradient","isRadial","angle","PI","getAspectRatio","boxAnimateType","boxAnimateDuration","boxAnimateDelay","handle","setHandle","useImperativeHandle","animationClassName","useBoxAnimation","margin","useBackgrounds","Children","only","grid","columnGap","rowGap","itemAnimateType","itemAnimateDuration","itemAnimateDelay","itemStaggerDuration","gridItemClassName","responsiveGridItem","useItemAnimation"],"mappings":"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"}
+{"version":3,"file":"grid-item.cjs.js","sources":["../src/components/hooks/useBackgrounds.ts","../src/components/builtin/Box/animations.tsx","../src/utils/clamp.ts","../src/components/shared/BackgroundsContainer/components/Parallax/index.tsx","../src/components/shared/BackgroundsContainer/components/BackgroundVideo/index.tsx","../src/components/shared/BackgroundsContainer/components/Backgrounds/index.tsx","../src/components/shared/BackgroundsContainer/index.tsx","../src/components/shared/grid-item.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { ColorValue as Color } from '../utils/types'\nimport { ResponsiveValue } from '../../prop-controllers'\nimport { isNonNullable } from '../utils/isNonNullable'\nimport { BackgroundsValue as ResponsiveBackgroundsValue } from '../../prop-controllers/descriptors'\nimport { useFiles, useSwatches } from '../../runtimes/react/hooks/makeswift-api'\nimport {\n  getBackgroundsFileIds,\n  getBackgroundsSwatchIds,\n} from '../../prop-controllers/introspection'\n\ntype BackgroundColorData = Color\n\ntype BackgroundGradientStopData = {\n  id: string\n  location: number\n  color: Color | null | undefined\n}\n\ntype BackgroundGradientData = {\n  angle?: number\n  isRadial?: boolean\n  stops: Array<BackgroundGradientStopData>\n}\n\ntype BackgroundImageData = {\n  publicUrl?: string\n  dimensions?: { width: number; height: number } | null\n  position: {\n    x: number\n    y: number\n  }\n  size?: 'cover' | 'contain' | 'auto'\n  repeat?: 'no-repeat' | 'repeat-x' | 'repeat-y' | 'repeat'\n  opacity?: number\n  parallax?: number\n}\n\ntype BackgroundVideoData = {\n  url?: string\n  maskColor: Color | null | undefined\n  aspectRatio?: 'wide' | 'standard'\n  opacity?: number\n  zoom?: number\n  parallax?: number\n}\n\ntype BackgroundData =\n  | { id: string; type: 'color'; payload: BackgroundColorData | null | undefined }\n  | { id: string; type: 'image'; payload: BackgroundImageData | null | undefined }\n  | { id: string; type: 'gradient'; payload: BackgroundGradientData | null | undefined }\n  | { id: string; type: 'video'; payload: BackgroundVideoData | null | undefined }\n\nexport type BackgroundsData = Array<BackgroundData>\n\nexport type BackgroundsPropControllerData = ResponsiveValue<BackgroundsData>\n\nexport function useBackgrounds(\n  value: ResponsiveBackgroundsValue | null | undefined,\n): BackgroundsPropControllerData | null | undefined {\n  const fileIds = getBackgroundsFileIds(value)\n  const files = useFiles(fileIds)\n  const swatchIds = getBackgroundsSwatchIds(value)\n  const swatches = useSwatches(swatchIds)\n\n  return useMemo(() => {\n    if (value == null) return null\n\n    return value.map(({ value: backgrounds, ...restOfValue }) => ({\n      ...restOfValue,\n      value: backgrounds\n        .map((bg): BackgroundData | null | undefined => {\n          if (bg.type === 'image' && bg.payload != null && bg.payload.imageId != null) {\n            const { imageId, ...restOfPayload } = bg.payload\n            const file = files.find(f => f && f.id === imageId)\n\n            return (\n              file && {\n                id: bg.id,\n                type: 'image',\n                payload: {\n                  ...restOfPayload,\n                  publicUrl: file.publicUrl,\n                  dimensions: file.dimensions,\n                },\n              }\n            )\n          }\n\n          if (bg.type === 'color' && bg.payload != null) {\n            const { swatchId, alpha } = bg.payload\n            const swatch = swatches.filter(isNonNullable).find(s => s && s.id === swatchId)\n\n            return { id: bg.id, type: 'color', payload: { swatch, alpha } }\n          }\n\n          if (bg.type === 'gradient' && bg.payload != null && bg.payload.stops.length > 0) {\n            return {\n              id: bg.id,\n              type: 'gradient',\n              payload: {\n                angle: bg.payload.angle,\n                isRadial: bg.payload.isRadial,\n                stops: bg.payload.stops.map(({ color, ...restOfStop }) => ({\n                  ...restOfStop,\n                  color: color && {\n                    swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n                    alpha: color.alpha,\n                  },\n                })),\n              },\n            }\n          }\n\n          if (bg.type === 'video' && bg.payload != null) {\n            const { maskColor, ...restOfPayload } = bg.payload\n            const swatch = maskColor && swatches.find(s => s && s.id === maskColor.swatchId)\n\n            return {\n              id: bg.id,\n              type: 'video',\n              payload: {\n                ...restOfPayload,\n                maskColor: swatch && maskColor && { swatch, alpha: maskColor.alpha },\n              },\n            }\n          }\n\n          return null\n        })\n        .filter(isNonNullable),\n    }))\n  }, [files, swatches, value])\n}\n","import { CSSObject } from '@emotion/css'\nimport { useEffect, useState } from 'react'\nimport { ResponsiveValue } from '../../../prop-controllers'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useMediaQuery } from '../../hooks'\nimport {\n  BoxAnimateIn,\n  DEFAULT_BOX_ANIMATE_DELAY,\n  DEFAULT_BOX_ANIMATE_DURATION,\n  DEFAULT_BOX_ANIMATE_TYPE,\n  DEFAULT_ITEM_ANIMATE_TYPE,\n  DEFAULT_ITEM_STAGGER_DURATION,\n} from './constants'\n\nconst QUERY = '(prefers-reduced-motion: no-preference)'\n\nfunction usePrefersReducedMotion() {\n  const [prefersReducedMotion, setPrefersReducedMotion] = useState(false)\n\n  useEffect(() => {\n    const mediaQueryList = window.matchMedia(QUERY)\n\n    setPrefersReducedMotion(!window.matchMedia(QUERY).matches)\n\n    const listener = (event: MediaQueryListEvent) => {\n      setPrefersReducedMotion(!event.matches)\n    }\n    mediaQueryList.addEventListener('change', listener)\n    return () => {\n      mediaQueryList.removeEventListener('change', listener)\n    }\n  }, [])\n\n  return prefersReducedMotion\n}\n\nconst exitedBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n  none: { opacity: 1 },\n  fadeIn: { opacity: 0 },\n  fadeLeft: { transform: 'translate3d(60px,0,0)', opacity: 0 },\n  fadeRight: { transform: 'translate3d(-60px,0,0)', opacity: 0 },\n  fadeDown: { transform: 'translate3d(0,-80px,0)', opacity: 0 },\n  fadeUp: { transform: 'translate3d(0,80px,0)', opacity: 0 },\n  blurIn: { filter: 'blur(20px)', opacity: 0 },\n  scaleDown: {\n    transform: 'scale(1.2)',\n    opacity: 0,\n  },\n  scaleUp: {\n    transform: 'scale(.75)',\n    opacity: 0,\n  },\n}\n\nconst enteredBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n  none: { opacity: 1 },\n  fadeIn: { opacity: 1 },\n  fadeLeft: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n  fadeRight: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n  fadeDown: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n  fadeUp: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n  blurIn: { filter: 'blur(0px)', opacity: 1 },\n  scaleDown: {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n  scaleUp: {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n}\n\nexport function useBoxAnimation(\n  responsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n  responsiveDuration: ResponsiveValue<number> | undefined,\n  responisveDelay: ResponsiveValue<number> | undefined,\n  itemResponsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n) {\n  const reducedMotion = usePrefersReducedMotion()\n  const animationType = useMediaQuery(responsiveAnimationType) || DEFAULT_BOX_ANIMATE_TYPE\n  const itemAnimationType = useMediaQuery(itemResponsiveAnimationType) || DEFAULT_ITEM_ANIMATE_TYPE\n  const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n  const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n  const actualDelay = delay * 1000\n  const actualDuration = duration * 1000\n\n  const className = useStyle({\n    ...exitedBoxAnimationProperties[animationType],\n    transition: `all 0ms`,\n    '&.show': {\n      ...enteredBoxAnimationProperties[animationType],\n      transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms`,\n    },\n    '&:not(.show) > div > div': {\n      ...exitedBoxAnimationProperties[itemAnimationType],\n      transition: `all 0ms !important`,\n    },\n    '&.show > div > div': {\n      ...enteredBoxAnimationProperties[itemAnimationType],\n    },\n  })\n\n  if (reducedMotion) {\n    return ''\n  }\n\n  return className\n}\n\nexport function useItemAnimation(\n  responsiveDuration: ResponsiveValue<number> | undefined,\n  responisveDelay: ResponsiveValue<number> | undefined,\n  responsiveStagger: ResponsiveValue<number> | undefined,\n  index: number,\n) {\n  const reducedMotion = usePrefersReducedMotion()\n  const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n  const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n  const stagger = useMediaQuery(responsiveStagger) || DEFAULT_ITEM_STAGGER_DURATION\n  const delayFromStagger = responsiveStagger == null || index == null ? 0 : stagger * index\n  const actualDelay = (delay + delayFromStagger) * 1000\n  const actualDuration = duration * 1000\n\n  const className = useStyle({\n    transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms !important`,\n  })\n\n  if (reducedMotion) {\n    return ''\n  }\n\n  return className\n}\n","const clamp = (min: number, val: number, max: number): number => Math.min(Math.max(min, val), max)\n\nexport default clamp\n","import { useState, useRef, useCallback, ReactNode, CSSProperties } from 'react'\nimport clamp from '../../../../../utils/clamp'\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nfunction isScrollable(element: HTMLElement) {\n  const { overflow, overflowY, overflowX } =\n    element.ownerDocument.defaultView!.getComputedStyle(element)\n\n  return /(auto|scroll)/.test(overflow + overflowX + overflowY)\n}\n\nfunction getScrollParent(element: HTMLElement): HTMLElement {\n  const { parentElement } = element\n\n  if (!element || !parentElement) return element\n\n  if (isScrollable(element)) return element\n\n  return getScrollParent(parentElement)\n}\n\ntype Props = {\n  strength: number | null | undefined\n  children: (\n    getParallaxProps: <P extends { style?: CSSProperties; [key: string]: unknown }>(props: P) => P,\n  ) => ReactNode\n}\n\nexport default function Parallax({ strength, children, ...rest }: Props): JSX.Element {\n  const container = useRef<HTMLDivElement>(null)\n  const [containerScrollTop, setContainerScrollTop] = useState(strength == null ? 0 : strength)\n  const lastScrollParentScrollTop = useRef(0)\n\n  useIsomorphicLayoutEffect(() => {\n    if (!container.current || strength == null || strength === 0) return undefined\n\n    const containerDocument = container.current.ownerDocument\n    const scrollParent = getScrollParent(container.current)\n    const eventTarget =\n      containerDocument.documentElement === scrollParent\n        ? containerDocument.defaultView!\n        : scrollParent\n\n    lastScrollParentScrollTop.current = scrollParent.scrollTop\n    setContainerScrollTop(strength)\n\n    function handleScroll() {\n      containerDocument.defaultView!.requestAnimationFrame(() => {\n        if (!container.current) return\n\n        const { top: containerTop, bottom: containerBottom } =\n          container.current.getBoundingClientRect()\n        const { top: scrollParentTop, bottom: scrollParentBottom } =\n          scrollParent === containerDocument.documentElement\n            ? { top: 0, bottom: containerDocument.defaultView!.innerHeight }\n            : scrollParent.getBoundingClientRect()\n        const { scrollTop: scrollParentScrollTop } =\n          scrollParent === containerDocument.documentElement\n            ? { scrollTop: containerDocument.defaultView!.pageYOffset }\n            : scrollParent\n        const scrollParentHeight = scrollParentBottom - scrollParentTop\n        const scrollParentScrollDelta = scrollParentScrollTop - lastScrollParentScrollTop.current\n\n        lastScrollParentScrollTop.current = scrollParentScrollTop\n\n        setContainerScrollTop(scrollTop => {\n          const isContainerVisible =\n            containerTop < scrollParentTop + scrollParentHeight && containerBottom > scrollParentTop\n          const containerScrollRemaining =\n            scrollParentScrollDelta > 0 ? 2 * strength! - scrollTop : scrollTop\n          const scrollParentScrollRemaining =\n            scrollParentScrollDelta > 0\n              ? scrollParentTop + containerBottom\n              : scrollParentHeight - containerTop\n          const parallaxRatio = containerScrollRemaining / scrollParentScrollRemaining\n          const containerScrollDelta = isContainerVisible\n            ? parallaxRatio * scrollParentScrollDelta\n            : 0\n\n          return clamp(0, scrollTop + containerScrollDelta, strength! * 2)\n        })\n      })\n    }\n\n    eventTarget.addEventListener('scroll', handleScroll)\n\n    return () => eventTarget.removeEventListener('scroll', handleScroll)\n  }, [strength])\n\n  const getProps = useCallback(\n    ({ style, ...restOfChildrenProps }: any) => ({\n      ...restOfChildrenProps,\n      style: {\n        ...style,\n        position: 'absolute',\n        left: 0,\n        right: 0,\n        top: 0,\n        bottom: 0,\n        ...(strength == null || strength === 0\n          ? {}\n          : {\n              top: -strength,\n              bottom: -strength,\n              transform: `translate3d(0, ${containerScrollTop - strength}px, 0)`,\n            }),\n      },\n    }),\n    [strength, containerScrollTop],\n  )\n\n  return (\n    <div\n      {...rest}\n      ref={container}\n      style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}\n    >\n      {children(getProps)}\n    </div>\n  )\n}\n","import { cx } from '@emotion/css'\nimport { useState, useRef, ComponentPropsWithoutRef, ForwardedRef, forwardRef } from 'react'\nimport ReactPlayer from 'react-player'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nconst Container = forwardRef(function Container(\n  { className, ...restOfProps }: ComponentPropsWithoutRef<'div'>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  return (\n    <div\n      {...restOfProps}\n      ref={ref}\n      className={cx(\n        useStyle({\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          right: 0,\n          bottom: 0,\n          pointerEvents: 'none',\n          overflow: 'hidden',\n        }),\n        className,\n      )}\n    />\n  )\n})\n\nfunction Mask({\n  backgroundColor,\n  visible,\n}: {\n  backgroundColor: string | undefined\n  visible: boolean\n}) {\n  return (\n    <div\n      className={useStyle({\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n        background: backgroundColor,\n        opacity: visible ? 1 : 0,\n        transition: 'opacity 1s',\n      })}\n    />\n  )\n}\n\nconst getScale = (element: HTMLElement, aspectRatio: number, zoom: number) => {\n  const { offsetWidth: width, offsetHeight: height } = element\n  const computedAspectRatio = width / height\n\n  return Math.max(aspectRatio / computedAspectRatio, computedAspectRatio / aspectRatio) * zoom\n}\n\ntype Props = {\n  url?: string\n  aspectRatio?: number\n  zoom?: number\n  opacity?: number\n  maskColor?: string\n}\n\nexport default function BackgroundVideo({\n  url = '',\n  aspectRatio = 16 / 9,\n  zoom = 1,\n  maskColor,\n  opacity,\n}: Props): JSX.Element {\n  const [ready, setReady] = useState(false)\n  const [scale, setScale] = useState(1)\n  const container = useRef<HTMLDivElement>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    const { current: containerEl } = container\n\n    if (!containerEl) return undefined\n\n    const { defaultView } = containerEl.ownerDocument\n    const handleResize = () => setScale(getScale(containerEl, aspectRatio, zoom))\n\n    handleResize()\n\n    defaultView!.addEventListener('resize', handleResize)\n\n    return () => defaultView!.removeEventListener('resize', handleResize)\n  }, [aspectRatio, zoom])\n\n  if (!ReactPlayer.canPlay(url)) return <></>\n\n  return (\n    <Container ref={container}>\n      {container.current && (\n        <ReactPlayer\n          url={url}\n          config={{\n            vimeo: { playerOptions: { background: true } },\n            youtube: {\n              playerVars: {\n                origin: container.current.ownerDocument.defaultView?.location.origin,\n              },\n            },\n            wistia: {\n              options: {\n                endVideoBehavior: 'loop',\n                playbackRateControl: false,\n                playbar: false,\n                playButton: false,\n                volumeControl: false,\n                fullscreenButton: false,\n                muted: true,\n              },\n            },\n          }}\n          playing\n          loop\n          muted\n          controls={false}\n          onReady={() => setReady(true)}\n          style={{\n            transform: `scale3d(${scale}, ${scale}, 1)`,\n            opacity,\n          }}\n          width=\"100%\"\n          height=\"100%\"\n        />\n      )}\n      <Mask backgroundColor={maskColor} visible={!ready} />\n    </Container>\n  )\n}\n","import NextImage from 'next/image'\n\nimport { BackgroundsPropControllerData, BackgroundsData } from '../../../../hooks'\nimport { ResponsiveValue } from '../../../../../prop-controllers'\nimport { ColorValue as Color } from '../../../../utils/types'\nimport { colorToString } from '../../../../utils/colorToString'\nimport Parallax from '../Parallax'\nimport BackgroundVideo from '../BackgroundVideo'\nimport { CSSObject } from '@emotion/css'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\nimport { responsiveStyle } from '../../../../utils/responsive-style'\n\nfunction getColor(color: Color | null | undefined) {\n  if (color == null) return 'black'\n\n  if (color.swatch == null) {\n    return colorToString({ ...color, swatch: { hue: 0, saturation: 0, lightness: 0 } })\n  }\n\n  return colorToString(color)\n}\n\ntype GradientStop = { color: Color | null | undefined; location: number }\n\nconst getStopsStyle = (stops: GradientStop[]) =>\n  stops.map(({ color, location }) => `${getColor(color)} ${location}%`).join(',')\n\nconst absoluteFillStyle: CSSObject = {\n  position: 'absolute',\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n}\n\nconst containerStyle: CSSObject = {\n  ...absoluteFillStyle,\n  borderRadius: 'inherit',\n}\n\ntype Props = { backgrounds: BackgroundsPropControllerData | null | undefined }\n\nexport default function Backgrounds({ backgrounds }: Props): JSX.Element {\n  if (backgrounds == null) return <></>\n\n  return (\n    <>\n      {backgrounds.map(({ value, deviceId }) => {\n        const visibility = backgrounds.map(v => ({\n          deviceId: v.deviceId,\n          value: v.deviceId === deviceId,\n        }))\n\n        return <BackgroundDeviceLayer key={deviceId} layer={value} visibility={visibility} />\n      })}\n    </>\n  )\n}\n\ntype BackgroundLayerProps = {\n  layer: BackgroundsData\n  visibility: ResponsiveValue<boolean>\n}\n\nfunction BackgroundDeviceLayer({ layer, visibility }: BackgroundLayerProps) {\n  const visibilityStyle = responsiveStyle([visibility], ([v]) => ({\n    display: v === true ? 'block' : 'none',\n  }))\n\n  return (\n    <div className={useStyle({ ...containerStyle, ...visibilityStyle, overflow: 'hidden' })}>\n      {[...layer].reverse().map(bg => {\n        if (bg.type === 'color') {\n          return <ColorBackground key={bg.id} color={getColor(bg.payload)} />\n        }\n\n        if (bg.type === 'image' && bg.payload) {\n          return <ImageBackground {...bg.payload} key={bg.id} />\n        }\n\n        if (bg.type === 'gradient' && bg.payload) {\n          return (\n            <GradientBackground\n              {...bg.payload}\n              key={bg.id}\n              gradient={getStopsStyle(bg.payload.stops)}\n            />\n          )\n        }\n\n        if (bg.type === 'video' && bg.payload) {\n          return (\n            <VideoBackground\n              {...bg.payload}\n              key={bg.id}\n              maskColor={getColor(bg.payload.maskColor)}\n            />\n          )\n        }\n\n        return null\n      })}\n    </div>\n  )\n}\n\ntype ColorBackgroundProps = { color: string }\n\nfunction ColorBackground({ color }: ColorBackgroundProps) {\n  return <div className={useStyle({ ...containerStyle, backgroundColor: color })} />\n}\n\nconst ImageBackgroundRepeat = {\n  NoRepeat: 'no-repeat',\n  RepeatX: 'repeat-x',\n  RepeatY: 'repeat-y',\n  Repeat: 'repeat',\n} as const\n\ntype ImageBackgroundRepeat = typeof ImageBackgroundRepeat[keyof typeof ImageBackgroundRepeat]\n\nconst ImageBackgroundSize = {\n  Cover: 'cover',\n  Contain: 'contain',\n  Auto: 'auto',\n} as const\n\ntype ImageBackgroundSize = typeof ImageBackgroundSize[keyof typeof ImageBackgroundSize]\n\ntype ImageBackgroundProps = {\n  publicUrl?: string\n  position: { x: number; y: number }\n  repeat?: ImageBackgroundRepeat\n  size?: ImageBackgroundSize\n  opacity?: number\n  parallax?: number\n}\n\nfunction ImageBackground({\n  publicUrl,\n  position,\n  repeat = ImageBackgroundRepeat.NoRepeat,\n  size = ImageBackgroundSize.Cover,\n  opacity,\n  parallax,\n}: ImageBackgroundProps) {\n  const backgroundPosition = `${position.x}% ${position.y}%`\n  const containerClassName = useStyle(containerStyle)\n\n  if (repeat === 'no-repeat' && size !== 'auto' && publicUrl != null) {\n    return (\n      <Parallax strength={parallax}>\n        {getParallaxProps => (\n          <div {...getParallaxProps({ style: { opacity, overflow: 'hidden' } })}>\n            <NextImage\n              src={publicUrl}\n              layout=\"fill\"\n              objectPosition={backgroundPosition}\n              objectFit={size}\n            />\n          </div>\n        )}\n      </Parallax>\n    )\n  }\n\n  return (\n    <Parallax strength={parallax}>\n      {getParallaxProps => (\n        <div\n          className={containerClassName}\n          {...getParallaxProps({\n            style: {\n              backgroundImage: publicUrl != null ? `url('${publicUrl}')` : undefined,\n              backgroundPosition,\n              backgroundRepeat: repeat,\n              backgroundSize: size,\n              opacity,\n            },\n          })}\n        />\n      )}\n    </Parallax>\n  )\n}\n\ntype GradientBackgroundProps = {\n  gradient: string\n  angle?: number\n  isRadial?: boolean\n}\n\nfunction GradientBackground({\n  gradient,\n  isRadial = false,\n  angle = Math.PI,\n}: GradientBackgroundProps) {\n  return (\n    <div\n      className={useStyle({\n        ...containerStyle,\n        background: isRadial\n          ? `radial-gradient(${gradient})`\n          : `linear-gradient(${angle}rad, ${gradient})`,\n      })}\n    />\n  )\n}\n\nconst BackgroundVideoAspectRatio = {\n  Wide: 'wide',\n  Standard: 'standard',\n} as const\n\ntype BackgroundVideoAspectRatio =\n  typeof BackgroundVideoAspectRatio[keyof typeof BackgroundVideoAspectRatio]\n\nfunction getAspectRatio(aspectRatio: BackgroundVideoAspectRatio | null | undefined): number {\n  switch (aspectRatio) {\n    case 'wide':\n      return 16 / 9\n\n    case 'standard':\n      return 4 / 3\n\n    default:\n      return 16 / 9\n  }\n}\n\ntype VideoBackgroundProps = {\n  url?: string\n  aspectRatio?: BackgroundVideoAspectRatio\n  maskColor: string\n  zoom?: number\n  opacity?: number\n  parallax?: number\n}\n\nfunction VideoBackground({\n  url,\n  aspectRatio,\n  maskColor,\n  zoom,\n  opacity,\n  parallax,\n}: VideoBackgroundProps) {\n  return (\n    <Parallax strength={parallax}>\n      {getParallaxProps => (\n        <div {...getParallaxProps({ className: useStyle(containerStyle) })}>\n          <BackgroundVideo\n            url={url}\n            zoom={zoom}\n            opacity={opacity}\n            aspectRatio={getAspectRatio(aspectRatio)}\n            maskColor={maskColor}\n          />\n        </div>\n      )}\n    </Parallax>\n  )\n}\n","import { cx } from '@emotion/css'\nimport {\n  Children,\n  ComponentPropsWithoutRef,\n  ElementType,\n  forwardRef,\n  ReactElement,\n  Ref,\n  useImperativeHandle,\n  useState,\n} from 'react'\nimport {\n  BackgroundsValue as BackgroundsPropControllerValue,\n  ResponsiveNumberValue,\n  ResponsiveSelectValue,\n} from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useBoxAnimation } from '../../builtin/Box/animations'\nimport { BoxAnimateIn } from '../../builtin/Box/constants'\nimport { useBackgrounds } from '../../hooks'\nimport Backgrounds from './components/Backgrounds'\n\ntype BaseProps = {\n  backgrounds: BackgroundsPropControllerValue | null | undefined\n  children: ReactElement<ElementType>\n  boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  boxAnimateDuration?: ResponsiveNumberValue\n  boxAnimateDelay?: ResponsiveNumberValue\n  itemAnimationType?: ResponsiveSelectValue<BoxAnimateIn>\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport default forwardRef<HTMLDivElement | null, Props>(function BackgroundsContainer(\n  {\n    backgrounds,\n    children,\n    className,\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimationType,\n    ...restOfProps\n  }: Props,\n  ref: Ref<HTMLDivElement | null>,\n) {\n  const [handle, setHandle] = useState<HTMLDivElement | null>(null)\n\n  useImperativeHandle(ref, () => handle, [handle])\n\n  const animationClassName = useBoxAnimation(\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimationType,\n  )\n\n  return (\n    <div\n      {...restOfProps}\n      ref={setHandle}\n      className={cx(\n        useStyle({\n          position: 'relative',\n          width: '100%',\n          margin: '0 auto',\n          '> *': {\n            borderRadius: 'inherit',\n            height: 'inherit',\n          },\n          '> :last-child': {\n            position: 'relative',\n          },\n        }),\n        className,\n        animationClassName,\n      )}\n    >\n      <Backgrounds backgrounds={useBackgrounds(backgrounds)} />\n      {Children.only(children)}\n    </div>\n  )\n})\n","import { cx } from '@emotion/css'\nimport { ComponentPropsWithoutRef } from 'react'\nimport {\n  ResponsiveValue,\n  Length as LengthValue,\n  ResponsiveNumberValue,\n} from '../../prop-controllers'\nimport { useStyle } from '../../runtimes/react/use-style'\nimport { useItemAnimation } from '../builtin/Box/animations'\nimport { responsiveGridItem } from '../utils/responsive-style'\n\ntype BaseProps = {\n  className?: string\n  grid: ResponsiveValue<{ spans: Array<Array<number>>; count: number }>\n  index: number\n  columnGap?: ResponsiveValue<LengthValue>\n  rowGap?: ResponsiveValue<LengthValue>\n  itemAnimateDuration?: ResponsiveNumberValue\n  itemAnimateDelay?: ResponsiveNumberValue\n  itemStaggerDuration?: ResponsiveNumberValue\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport function GridItem({\n  grid,\n  index,\n  columnGap,\n  rowGap,\n  className,\n  itemAnimateDuration,\n  itemAnimateDelay,\n  itemStaggerDuration,\n  ...restOfProps\n}: Props) {\n  const gridItemClassName = useStyle(responsiveGridItem({ grid, index, columnGap, rowGap }))\n  const animationClassName = useItemAnimation(\n    itemAnimateDuration,\n    itemAnimateDelay,\n    itemStaggerDuration,\n    index,\n  )\n\n  return <div {...restOfProps} className={cx(gridItemClassName, className, animationClassName)} />\n}\n"],"names":["getBackgroundsFileIds","useFiles","getBackgroundsSwatchIds","useSwatches","useMemo","isNonNullable","QUERY","prefersReducedMotion","setPrefersReducedMotion","useState","useEffect","mediaQueryList","window","matchMedia","matches","listener","event","addEventListener","removeEventListener","exitedBoxAnimationProperties","none","opacity","fadeIn","fadeLeft","transform","fadeRight","fadeDown","fadeUp","blurIn","filter","scaleDown","scaleUp","enteredBoxAnimationProperties","responsiveAnimationType","responsiveDuration","responisveDelay","itemResponsiveAnimationType","reducedMotion","usePrefersReducedMotion","animationType","useMediaQuery","DEFAULT_BOX_ANIMATE_TYPE","itemAnimationType","DEFAULT_ITEM_ANIMATE_TYPE","duration","DEFAULT_BOX_ANIMATE_DURATION","delay","DEFAULT_BOX_ANIMATE_DELAY","actualDelay","actualDuration","className","useStyle","transition","responsiveStagger","index","stagger","DEFAULT_ITEM_STAGGER_DURATION","delayFromStagger","element","overflow","overflowY","overflowX","ownerDocument","defaultView","getComputedStyle","test","parentElement","isScrollable","getScrollParent","strength","children","rest","container","useRef","containerScrollTop","setContainerScrollTop","lastScrollParentScrollTop","useIsomorphicLayoutEffect","current","undefined","containerDocument","scrollParent","eventTarget","documentElement","scrollTop","requestAnimationFrame","top","containerTop","bottom","containerBottom","getBoundingClientRect","scrollParentTop","scrollParentBottom","innerHeight","scrollParentScrollTop","pageYOffset","scrollParentHeight","scrollParentScrollDelta","isContainerVisible","containerScrollRemaining","scrollParentScrollRemaining","parallaxRatio","containerScrollDelta","clamp","handleScroll","getProps","useCallback","style","restOfChildrenProps","position","left","right","Container","forwardRef","ref","restOfProps","cx","pointerEvents","backgroundColor","visible","background","getScale","aspectRatio","zoom","offsetWidth","width","offsetHeight","height","computedAspectRatio","Math","max","url","maskColor","ready","setReady","scale","setScale","containerEl","handleResize","ReactPlayer","canPlay","_jsx","_Fragment","vimeo","playerOptions","youtube","playerVars","origin","location","wistia","options","endVideoBehavior","playbackRateControl","playbar","playButton","volumeControl","fullscreenButton","muted","color","swatch","colorToString","hue","saturation","lightness","getStopsStyle","stops","map","getColor","join","absoluteFillStyle","containerStyle","borderRadius","backgrounds","value","deviceId","visibility","v","layer","visibilityStyle","responsiveStyle","display","reverse","bg","type","payload","id","ImageBackgroundRepeat","NoRepeat","RepeatX","RepeatY","Repeat","ImageBackgroundSize","Cover","Contain","Auto","publicUrl","repeat","size","parallax","backgroundPosition","x","y","containerClassName","getParallaxProps","NextImage","backgroundImage","backgroundRepeat","backgroundSize","gradient","isRadial","angle","PI","getAspectRatio","boxAnimateType","boxAnimateDuration","boxAnimateDelay","handle","setHandle","useImperativeHandle","animationClassName","useBoxAnimation","margin","useBackgrounds","Children","only","grid","columnGap","rowGap","itemAnimateDuration","itemAnimateDelay","itemStaggerDuration","gridItemClassName","responsiveGridItem","useItemAnimation"],"mappings":"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"}

package/dist/grid-item.es.js

@@ -693,7 +693,6 @@ function GridItem(_g) {
     columnGap,
     rowGap,
     className,
-    itemAnimateType,
     itemAnimateDuration,
     itemAnimateDelay,
     itemStaggerDuration
@@ -703,7 +702,6 @@ function GridItem(_g) {
     "columnGap",
     "rowGap",
     "className",
-    "itemAnimateType",
     "itemAnimateDuration",
     "itemAnimateDelay",
     "itemStaggerDuration"

package/dist/grid-item.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid-item.es.js","sources":["../src/components/hooks/useBackgrounds.ts","../src/components/builtin/Box/animations.tsx","../src/utils/clamp.ts","../src/components/shared/BackgroundsContainer/components/Parallax/index.tsx","../src/components/shared/BackgroundsContainer/components/BackgroundVideo/index.tsx","../src/components/shared/BackgroundsContainer/components/Backgrounds/index.tsx","../src/components/shared/BackgroundsContainer/index.tsx","../src/components/shared/grid-item.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { ColorValue as Color } from '../utils/types'\nimport { ResponsiveValue } from '../../prop-controllers'\nimport { isNonNullable } from '../utils/isNonNullable'\nimport { BackgroundsValue as ResponsiveBackgroundsValue } from '../../prop-controllers/descriptors'\nimport { useFiles, useSwatches } from '../../runtimes/react/hooks/makeswift-api'\nimport {\n  getBackgroundsFileIds,\n  getBackgroundsSwatchIds,\n} from '../../prop-controllers/introspection'\n\ntype BackgroundColorData = Color\n\ntype BackgroundGradientStopData = {\n  id: string\n  location: number\n  color: Color | null | undefined\n}\n\ntype BackgroundGradientData = {\n  angle?: number\n  isRadial?: boolean\n  stops: Array<BackgroundGradientStopData>\n}\n\ntype BackgroundImageData = {\n  publicUrl?: string\n  dimensions?: { width: number; height: number } | null\n  position: {\n    x: number\n    y: number\n  }\n  size?: 'cover' | 'contain' | 'auto'\n  repeat?: 'no-repeat' | 'repeat-x' | 'repeat-y' | 'repeat'\n  opacity?: number\n  parallax?: number\n}\n\ntype BackgroundVideoData = {\n  url?: string\n  maskColor: Color | null | undefined\n  aspectRatio?: 'wide' | 'standard'\n  opacity?: number\n  zoom?: number\n  parallax?: number\n}\n\ntype BackgroundData =\n  | { id: string; type: 'color'; payload: BackgroundColorData | null | undefined }\n  | { id: string; type: 'image'; payload: BackgroundImageData | null | undefined }\n  | { id: string; type: 'gradient'; payload: BackgroundGradientData | null | undefined }\n  | { id: string; type: 'video'; payload: BackgroundVideoData | null | undefined }\n\nexport type BackgroundsData = Array<BackgroundData>\n\nexport type BackgroundsPropControllerData = ResponsiveValue<BackgroundsData>\n\nexport function useBackgrounds(\n  value: ResponsiveBackgroundsValue | null | undefined,\n): BackgroundsPropControllerData | null | undefined {\n  const fileIds = getBackgroundsFileIds(value)\n  const files = useFiles(fileIds)\n  const swatchIds = getBackgroundsSwatchIds(value)\n  const swatches = useSwatches(swatchIds)\n\n  return useMemo(() => {\n    if (value == null) return null\n\n    return value.map(({ value: backgrounds, ...restOfValue }) => ({\n      ...restOfValue,\n      value: backgrounds\n        .map((bg): BackgroundData | null | undefined => {\n          if (bg.type === 'image' && bg.payload != null && bg.payload.imageId != null) {\n            const { imageId, ...restOfPayload } = bg.payload\n            const file = files.find(f => f && f.id === imageId)\n\n            return (\n              file && {\n                id: bg.id,\n                type: 'image',\n                payload: {\n                  ...restOfPayload,\n                  publicUrl: file.publicUrl,\n                  dimensions: file.dimensions,\n                },\n              }\n            )\n          }\n\n          if (bg.type === 'color' && bg.payload != null) {\n            const { swatchId, alpha } = bg.payload\n            const swatch = swatches.filter(isNonNullable).find(s => s && s.id === swatchId)\n\n            return { id: bg.id, type: 'color', payload: { swatch, alpha } }\n          }\n\n          if (bg.type === 'gradient' && bg.payload != null && bg.payload.stops.length > 0) {\n            return {\n              id: bg.id,\n              type: 'gradient',\n              payload: {\n                angle: bg.payload.angle,\n                isRadial: bg.payload.isRadial,\n                stops: bg.payload.stops.map(({ color, ...restOfStop }) => ({\n                  ...restOfStop,\n                  color: color && {\n                    swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n                    alpha: color.alpha,\n                  },\n                })),\n              },\n            }\n          }\n\n          if (bg.type === 'video' && bg.payload != null) {\n            const { maskColor, ...restOfPayload } = bg.payload\n            const swatch = maskColor && swatches.find(s => s && s.id === maskColor.swatchId)\n\n            return {\n              id: bg.id,\n              type: 'video',\n              payload: {\n                ...restOfPayload,\n                maskColor: swatch && maskColor && { swatch, alpha: maskColor.alpha },\n              },\n            }\n          }\n\n          return null\n        })\n        .filter(isNonNullable),\n    }))\n  }, [files, swatches, value])\n}\n","import { CSSObject } from '@emotion/css'\nimport { useEffect, useState } from 'react'\nimport { ResponsiveValue } from '../../../prop-controllers'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useMediaQuery } from '../../hooks'\nimport {\n  BoxAnimateIn,\n  DEFAULT_BOX_ANIMATE_DELAY,\n  DEFAULT_BOX_ANIMATE_DURATION,\n  DEFAULT_BOX_ANIMATE_TYPE,\n  DEFAULT_ITEM_ANIMATE_TYPE,\n  DEFAULT_ITEM_STAGGER_DURATION,\n} from './constants'\n\nconst QUERY = '(prefers-reduced-motion: no-preference)'\n\nfunction usePrefersReducedMotion() {\n  const [prefersReducedMotion, setPrefersReducedMotion] = useState(false)\n\n  useEffect(() => {\n    const mediaQueryList = window.matchMedia(QUERY)\n\n    setPrefersReducedMotion(!window.matchMedia(QUERY).matches)\n\n    const listener = (event: MediaQueryListEvent) => {\n      setPrefersReducedMotion(!event.matches)\n    }\n    mediaQueryList.addEventListener('change', listener)\n    return () => {\n      mediaQueryList.removeEventListener('change', listener)\n    }\n  }, [])\n\n  return prefersReducedMotion\n}\n\nconst exitedBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n  none: { opacity: 1 },\n  fadeIn: { opacity: 0 },\n  fadeLeft: { transform: 'translate3d(60px,0,0)', opacity: 0 },\n  fadeRight: { transform: 'translate3d(-60px,0,0)', opacity: 0 },\n  fadeDown: { transform: 'translate3d(0,-80px,0)', opacity: 0 },\n  fadeUp: { transform: 'translate3d(0,80px,0)', opacity: 0 },\n  blurIn: { filter: 'blur(20px)', opacity: 0 },\n  scaleDown: {\n    transform: 'scale(1.2)',\n    opacity: 0,\n  },\n  scaleUp: {\n    transform: 'scale(.75)',\n    opacity: 0,\n  },\n}\n\nconst enteredBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n  none: { opacity: 1 },\n  fadeIn: { opacity: 1 },\n  fadeLeft: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n  fadeRight: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n  fadeDown: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n  fadeUp: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n  blurIn: { filter: 'blur(0px)', opacity: 1 },\n  scaleDown: {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n  scaleUp: {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n}\n\nexport function useBoxAnimation(\n  responsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n  responsiveDuration: ResponsiveValue<number> | undefined,\n  responisveDelay: ResponsiveValue<number> | undefined,\n  itemResponsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n) {\n  const reducedMotion = usePrefersReducedMotion()\n  const animationType = useMediaQuery(responsiveAnimationType) || DEFAULT_BOX_ANIMATE_TYPE\n  const itemAnimationType = useMediaQuery(itemResponsiveAnimationType) || DEFAULT_ITEM_ANIMATE_TYPE\n  const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n  const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n  const actualDelay = delay * 1000\n  const actualDuration = duration * 1000\n\n  const className = useStyle({\n    ...exitedBoxAnimationProperties[animationType],\n    transition: `all 0ms`,\n    '&.show': {\n      ...enteredBoxAnimationProperties[animationType],\n      transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms`,\n    },\n    '&:not(.show) > div > div': {\n      ...exitedBoxAnimationProperties[itemAnimationType],\n      transition: `all 0ms !important`,\n    },\n    '&.show > div > div': {\n      ...enteredBoxAnimationProperties[itemAnimationType],\n    },\n  })\n\n  if (reducedMotion) {\n    return ''\n  }\n\n  return className\n}\n\nexport function useItemAnimation(\n  responsiveDuration: ResponsiveValue<number> | undefined,\n  responisveDelay: ResponsiveValue<number> | undefined,\n  responsiveStagger: ResponsiveValue<number> | undefined,\n  index: number,\n) {\n  const reducedMotion = usePrefersReducedMotion()\n  const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n  const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n  const stagger = useMediaQuery(responsiveStagger) || DEFAULT_ITEM_STAGGER_DURATION\n  const delayFromStagger = responsiveStagger == null || index == null ? 0 : stagger * index\n  const actualDelay = (delay + delayFromStagger) * 1000\n  const actualDuration = duration * 1000\n\n  const className = useStyle({\n    transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms !important`,\n  })\n\n  if (reducedMotion) {\n    return ''\n  }\n\n  return className\n}\n","const clamp = (min: number, val: number, max: number): number => Math.min(Math.max(min, val), max)\n\nexport default clamp\n","import { useState, useRef, useCallback, ReactNode, CSSProperties } from 'react'\nimport clamp from '../../../../../utils/clamp'\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nfunction isScrollable(element: HTMLElement) {\n  const { overflow, overflowY, overflowX } =\n    element.ownerDocument.defaultView!.getComputedStyle(element)\n\n  return /(auto|scroll)/.test(overflow + overflowX + overflowY)\n}\n\nfunction getScrollParent(element: HTMLElement): HTMLElement {\n  const { parentElement } = element\n\n  if (!element || !parentElement) return element\n\n  if (isScrollable(element)) return element\n\n  return getScrollParent(parentElement)\n}\n\ntype Props = {\n  strength: number | null | undefined\n  children: (\n    getParallaxProps: <P extends { style?: CSSProperties; [key: string]: unknown }>(props: P) => P,\n  ) => ReactNode\n}\n\nexport default function Parallax({ strength, children, ...rest }: Props): JSX.Element {\n  const container = useRef<HTMLDivElement>(null)\n  const [containerScrollTop, setContainerScrollTop] = useState(strength == null ? 0 : strength)\n  const lastScrollParentScrollTop = useRef(0)\n\n  useIsomorphicLayoutEffect(() => {\n    if (!container.current || strength == null || strength === 0) return undefined\n\n    const containerDocument = container.current.ownerDocument\n    const scrollParent = getScrollParent(container.current)\n    const eventTarget =\n      containerDocument.documentElement === scrollParent\n        ? containerDocument.defaultView!\n        : scrollParent\n\n    lastScrollParentScrollTop.current = scrollParent.scrollTop\n    setContainerScrollTop(strength)\n\n    function handleScroll() {\n      containerDocument.defaultView!.requestAnimationFrame(() => {\n        if (!container.current) return\n\n        const { top: containerTop, bottom: containerBottom } =\n          container.current.getBoundingClientRect()\n        const { top: scrollParentTop, bottom: scrollParentBottom } =\n          scrollParent === containerDocument.documentElement\n            ? { top: 0, bottom: containerDocument.defaultView!.innerHeight }\n            : scrollParent.getBoundingClientRect()\n        const { scrollTop: scrollParentScrollTop } =\n          scrollParent === containerDocument.documentElement\n            ? { scrollTop: containerDocument.defaultView!.pageYOffset }\n            : scrollParent\n        const scrollParentHeight = scrollParentBottom - scrollParentTop\n        const scrollParentScrollDelta = scrollParentScrollTop - lastScrollParentScrollTop.current\n\n        lastScrollParentScrollTop.current = scrollParentScrollTop\n\n        setContainerScrollTop(scrollTop => {\n          const isContainerVisible =\n            containerTop < scrollParentTop + scrollParentHeight && containerBottom > scrollParentTop\n          const containerScrollRemaining =\n            scrollParentScrollDelta > 0 ? 2 * strength! - scrollTop : scrollTop\n          const scrollParentScrollRemaining =\n            scrollParentScrollDelta > 0\n              ? scrollParentTop + containerBottom\n              : scrollParentHeight - containerTop\n          const parallaxRatio = containerScrollRemaining / scrollParentScrollRemaining\n          const containerScrollDelta = isContainerVisible\n            ? parallaxRatio * scrollParentScrollDelta\n            : 0\n\n          return clamp(0, scrollTop + containerScrollDelta, strength! * 2)\n        })\n      })\n    }\n\n    eventTarget.addEventListener('scroll', handleScroll)\n\n    return () => eventTarget.removeEventListener('scroll', handleScroll)\n  }, [strength])\n\n  const getProps = useCallback(\n    ({ style, ...restOfChildrenProps }: any) => ({\n      ...restOfChildrenProps,\n      style: {\n        ...style,\n        position: 'absolute',\n        left: 0,\n        right: 0,\n        top: 0,\n        bottom: 0,\n        ...(strength == null || strength === 0\n          ? {}\n          : {\n              top: -strength,\n              bottom: -strength,\n              transform: `translate3d(0, ${containerScrollTop - strength}px, 0)`,\n            }),\n      },\n    }),\n    [strength, containerScrollTop],\n  )\n\n  return (\n    <div\n      {...rest}\n      ref={container}\n      style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}\n    >\n      {children(getProps)}\n    </div>\n  )\n}\n","import { cx } from '@emotion/css'\nimport { useState, useRef, ComponentPropsWithoutRef, ForwardedRef, forwardRef } from 'react'\nimport ReactPlayer from 'react-player'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nconst Container = forwardRef(function Container(\n  { className, ...restOfProps }: ComponentPropsWithoutRef<'div'>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  return (\n    <div\n      {...restOfProps}\n      ref={ref}\n      className={cx(\n        useStyle({\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          right: 0,\n          bottom: 0,\n          pointerEvents: 'none',\n          overflow: 'hidden',\n        }),\n        className,\n      )}\n    />\n  )\n})\n\nfunction Mask({\n  backgroundColor,\n  visible,\n}: {\n  backgroundColor: string | undefined\n  visible: boolean\n}) {\n  return (\n    <div\n      className={useStyle({\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n        background: backgroundColor,\n        opacity: visible ? 1 : 0,\n        transition: 'opacity 1s',\n      })}\n    />\n  )\n}\n\nconst getScale = (element: HTMLElement, aspectRatio: number, zoom: number) => {\n  const { offsetWidth: width, offsetHeight: height } = element\n  const computedAspectRatio = width / height\n\n  return Math.max(aspectRatio / computedAspectRatio, computedAspectRatio / aspectRatio) * zoom\n}\n\ntype Props = {\n  url?: string\n  aspectRatio?: number\n  zoom?: number\n  opacity?: number\n  maskColor?: string\n}\n\nexport default function BackgroundVideo({\n  url = '',\n  aspectRatio = 16 / 9,\n  zoom = 1,\n  maskColor,\n  opacity,\n}: Props): JSX.Element {\n  const [ready, setReady] = useState(false)\n  const [scale, setScale] = useState(1)\n  const container = useRef<HTMLDivElement>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    const { current: containerEl } = container\n\n    if (!containerEl) return undefined\n\n    const { defaultView } = containerEl.ownerDocument\n    const handleResize = () => setScale(getScale(containerEl, aspectRatio, zoom))\n\n    handleResize()\n\n    defaultView!.addEventListener('resize', handleResize)\n\n    return () => defaultView!.removeEventListener('resize', handleResize)\n  }, [aspectRatio, zoom])\n\n  if (!ReactPlayer.canPlay(url)) return <></>\n\n  return (\n    <Container ref={container}>\n      {container.current && (\n        <ReactPlayer\n          url={url}\n          config={{\n            vimeo: { playerOptions: { background: true } },\n            youtube: {\n              playerVars: {\n                origin: container.current.ownerDocument.defaultView?.location.origin,\n              },\n            },\n            wistia: {\n              options: {\n                endVideoBehavior: 'loop',\n                playbackRateControl: false,\n                playbar: false,\n                playButton: false,\n                volumeControl: false,\n                fullscreenButton: false,\n                muted: true,\n              },\n            },\n          }}\n          playing\n          loop\n          muted\n          controls={false}\n          onReady={() => setReady(true)}\n          style={{\n            transform: `scale3d(${scale}, ${scale}, 1)`,\n            opacity,\n          }}\n          width=\"100%\"\n          height=\"100%\"\n        />\n      )}\n      <Mask backgroundColor={maskColor} visible={!ready} />\n    </Container>\n  )\n}\n","import NextImage from 'next/image'\n\nimport { BackgroundsPropControllerData, BackgroundsData } from '../../../../hooks'\nimport { ResponsiveValue } from '../../../../../prop-controllers'\nimport { ColorValue as Color } from '../../../../utils/types'\nimport { colorToString } from '../../../../utils/colorToString'\nimport Parallax from '../Parallax'\nimport BackgroundVideo from '../BackgroundVideo'\nimport { CSSObject } from '@emotion/css'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\nimport { responsiveStyle } from '../../../../utils/responsive-style'\n\nfunction getColor(color: Color | null | undefined) {\n  if (color == null) return 'black'\n\n  if (color.swatch == null) {\n    return colorToString({ ...color, swatch: { hue: 0, saturation: 0, lightness: 0 } })\n  }\n\n  return colorToString(color)\n}\n\ntype GradientStop = { color: Color | null | undefined; location: number }\n\nconst getStopsStyle = (stops: GradientStop[]) =>\n  stops.map(({ color, location }) => `${getColor(color)} ${location}%`).join(',')\n\nconst absoluteFillStyle: CSSObject = {\n  position: 'absolute',\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n}\n\nconst containerStyle: CSSObject = {\n  ...absoluteFillStyle,\n  borderRadius: 'inherit',\n}\n\ntype Props = { backgrounds: BackgroundsPropControllerData | null | undefined }\n\nexport default function Backgrounds({ backgrounds }: Props): JSX.Element {\n  if (backgrounds == null) return <></>\n\n  return (\n    <>\n      {backgrounds.map(({ value, deviceId }) => {\n        const visibility = backgrounds.map(v => ({\n          deviceId: v.deviceId,\n          value: v.deviceId === deviceId,\n        }))\n\n        return <BackgroundDeviceLayer key={deviceId} layer={value} visibility={visibility} />\n      })}\n    </>\n  )\n}\n\ntype BackgroundLayerProps = {\n  layer: BackgroundsData\n  visibility: ResponsiveValue<boolean>\n}\n\nfunction BackgroundDeviceLayer({ layer, visibility }: BackgroundLayerProps) {\n  const visibilityStyle = responsiveStyle([visibility], ([v]) => ({\n    display: v === true ? 'block' : 'none',\n  }))\n\n  return (\n    <div className={useStyle({ ...containerStyle, ...visibilityStyle, overflow: 'hidden' })}>\n      {[...layer].reverse().map(bg => {\n        if (bg.type === 'color') {\n          return <ColorBackground key={bg.id} color={getColor(bg.payload)} />\n        }\n\n        if (bg.type === 'image' && bg.payload) {\n          return <ImageBackground {...bg.payload} key={bg.id} />\n        }\n\n        if (bg.type === 'gradient' && bg.payload) {\n          return (\n            <GradientBackground\n              {...bg.payload}\n              key={bg.id}\n              gradient={getStopsStyle(bg.payload.stops)}\n            />\n          )\n        }\n\n        if (bg.type === 'video' && bg.payload) {\n          return (\n            <VideoBackground\n              {...bg.payload}\n              key={bg.id}\n              maskColor={getColor(bg.payload.maskColor)}\n            />\n          )\n        }\n\n        return null\n      })}\n    </div>\n  )\n}\n\ntype ColorBackgroundProps = { color: string }\n\nfunction ColorBackground({ color }: ColorBackgroundProps) {\n  return <div className={useStyle({ ...containerStyle, backgroundColor: color })} />\n}\n\nconst ImageBackgroundRepeat = {\n  NoRepeat: 'no-repeat',\n  RepeatX: 'repeat-x',\n  RepeatY: 'repeat-y',\n  Repeat: 'repeat',\n} as const\n\ntype ImageBackgroundRepeat = typeof ImageBackgroundRepeat[keyof typeof ImageBackgroundRepeat]\n\nconst ImageBackgroundSize = {\n  Cover: 'cover',\n  Contain: 'contain',\n  Auto: 'auto',\n} as const\n\ntype ImageBackgroundSize = typeof ImageBackgroundSize[keyof typeof ImageBackgroundSize]\n\ntype ImageBackgroundProps = {\n  publicUrl?: string\n  position: { x: number; y: number }\n  repeat?: ImageBackgroundRepeat\n  size?: ImageBackgroundSize\n  opacity?: number\n  parallax?: number\n}\n\nfunction ImageBackground({\n  publicUrl,\n  position,\n  repeat = ImageBackgroundRepeat.NoRepeat,\n  size = ImageBackgroundSize.Cover,\n  opacity,\n  parallax,\n}: ImageBackgroundProps) {\n  const backgroundPosition = `${position.x}% ${position.y}%`\n  const containerClassName = useStyle(containerStyle)\n\n  if (repeat === 'no-repeat' && size !== 'auto' && publicUrl != null) {\n    return (\n      <Parallax strength={parallax}>\n        {getParallaxProps => (\n          <div {...getParallaxProps({ style: { opacity, overflow: 'hidden' } })}>\n            <NextImage\n              src={publicUrl}\n              layout=\"fill\"\n              objectPosition={backgroundPosition}\n              objectFit={size}\n            />\n          </div>\n        )}\n      </Parallax>\n    )\n  }\n\n  return (\n    <Parallax strength={parallax}>\n      {getParallaxProps => (\n        <div\n          className={containerClassName}\n          {...getParallaxProps({\n            style: {\n              backgroundImage: publicUrl != null ? `url('${publicUrl}')` : undefined,\n              backgroundPosition,\n              backgroundRepeat: repeat,\n              backgroundSize: size,\n              opacity,\n            },\n          })}\n        />\n      )}\n    </Parallax>\n  )\n}\n\ntype GradientBackgroundProps = {\n  gradient: string\n  angle?: number\n  isRadial?: boolean\n}\n\nfunction GradientBackground({\n  gradient,\n  isRadial = false,\n  angle = Math.PI,\n}: GradientBackgroundProps) {\n  return (\n    <div\n      className={useStyle({\n        ...containerStyle,\n        background: isRadial\n          ? `radial-gradient(${gradient})`\n          : `linear-gradient(${angle}rad, ${gradient})`,\n      })}\n    />\n  )\n}\n\nconst BackgroundVideoAspectRatio = {\n  Wide: 'wide',\n  Standard: 'standard',\n} as const\n\ntype BackgroundVideoAspectRatio =\n  typeof BackgroundVideoAspectRatio[keyof typeof BackgroundVideoAspectRatio]\n\nfunction getAspectRatio(aspectRatio: BackgroundVideoAspectRatio | null | undefined): number {\n  switch (aspectRatio) {\n    case 'wide':\n      return 16 / 9\n\n    case 'standard':\n      return 4 / 3\n\n    default:\n      return 16 / 9\n  }\n}\n\ntype VideoBackgroundProps = {\n  url?: string\n  aspectRatio?: BackgroundVideoAspectRatio\n  maskColor: string\n  zoom?: number\n  opacity?: number\n  parallax?: number\n}\n\nfunction VideoBackground({\n  url,\n  aspectRatio,\n  maskColor,\n  zoom,\n  opacity,\n  parallax,\n}: VideoBackgroundProps) {\n  return (\n    <Parallax strength={parallax}>\n      {getParallaxProps => (\n        <div {...getParallaxProps({ className: useStyle(containerStyle) })}>\n          <BackgroundVideo\n            url={url}\n            zoom={zoom}\n            opacity={opacity}\n            aspectRatio={getAspectRatio(aspectRatio)}\n            maskColor={maskColor}\n          />\n        </div>\n      )}\n    </Parallax>\n  )\n}\n","import { cx } from '@emotion/css'\nimport {\n  Children,\n  ComponentPropsWithoutRef,\n  ElementType,\n  forwardRef,\n  ReactElement,\n  Ref,\n  useImperativeHandle,\n  useState,\n} from 'react'\nimport {\n  BackgroundsValue as BackgroundsPropControllerValue,\n  ResponsiveNumberValue,\n  ResponsiveSelectValue,\n} from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useBoxAnimation } from '../../builtin/Box/animations'\nimport { BoxAnimateIn } from '../../builtin/Box/constants'\nimport { useBackgrounds } from '../../hooks'\nimport Backgrounds from './components/Backgrounds'\n\ntype BaseProps = {\n  backgrounds: BackgroundsPropControllerValue | null | undefined\n  children: ReactElement<ElementType>\n  boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  boxAnimateDuration?: ResponsiveNumberValue\n  boxAnimateDelay?: ResponsiveNumberValue\n  itemAnimationType?: ResponsiveSelectValue<BoxAnimateIn>\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport default forwardRef<HTMLDivElement | null, Props>(function BackgroundsContainer(\n  {\n    backgrounds,\n    children,\n    className,\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimationType,\n    ...restOfProps\n  }: Props,\n  ref: Ref<HTMLDivElement | null>,\n) {\n  const [handle, setHandle] = useState<HTMLDivElement | null>(null)\n\n  useImperativeHandle(ref, () => handle, [handle])\n\n  const animationClassName = useBoxAnimation(\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimationType,\n  )\n\n  return (\n    <div\n      {...restOfProps}\n      ref={setHandle}\n      className={cx(\n        useStyle({\n          position: 'relative',\n          width: '100%',\n          margin: '0 auto',\n          '> *': {\n            borderRadius: 'inherit',\n            height: 'inherit',\n          },\n          '> :last-child': {\n            position: 'relative',\n          },\n        }),\n        className,\n        animationClassName,\n      )}\n    >\n      <Backgrounds backgrounds={useBackgrounds(backgrounds)} />\n      {Children.only(children)}\n    </div>\n  )\n})\n","import { cx } from '@emotion/css'\nimport { ComponentPropsWithoutRef } from 'react'\nimport {\n  ResponsiveValue,\n  Length as LengthValue,\n  ResponsiveSelectValue,\n  ResponsiveNumberValue,\n} from '../../prop-controllers'\nimport { useStyle } from '../../runtimes/react/use-style'\nimport { BoxAnimateIn } from '../builtin/Box/constants'\nimport { useItemAnimation } from '../builtin/Box/animations'\nimport { responsiveGridItem } from '../utils/responsive-style'\n\ntype BaseProps = {\n  className?: string\n  grid: ResponsiveValue<{ spans: Array<Array<number>>; count: number }>\n  index: number\n  columnGap?: ResponsiveValue<LengthValue>\n  rowGap?: ResponsiveValue<LengthValue>\n\n  itemAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  itemAnimateDuration?: ResponsiveNumberValue\n  itemAnimateDelay?: ResponsiveNumberValue\n  itemStaggerDuration?: ResponsiveNumberValue\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport function GridItem({\n  grid,\n  index,\n  columnGap,\n  rowGap,\n  className,\n  itemAnimateType,\n  itemAnimateDuration,\n  itemAnimateDelay,\n  itemStaggerDuration,\n  ...restOfProps\n}: Props) {\n  const gridItemClassName = useStyle(responsiveGridItem({ grid, index, columnGap, rowGap }))\n  const animationClassName = useItemAnimation(\n    itemAnimateDuration,\n    itemAnimateDelay,\n    itemStaggerDuration,\n    index,\n  )\n\n  return <div {...restOfProps} className={cx(gridItemClassName, className, animationClassName)} />\n}\n"],"names":["QUERY","prefersReducedMotion","setPrefersReducedMotion","useState","useEffect","mediaQueryList","window","matchMedia","matches","listener","event","addEventListener","removeEventListener","exitedBoxAnimationProperties","none","opacity","fadeIn","fadeLeft","transform","fadeRight","fadeDown","fadeUp","blurIn","filter","scaleDown","scaleUp","enteredBoxAnimationProperties","responsiveAnimationType","responsiveDuration","responisveDelay","itemResponsiveAnimationType","reducedMotion","usePrefersReducedMotion","animationType","useMediaQuery","DEFAULT_BOX_ANIMATE_TYPE","itemAnimationType","DEFAULT_ITEM_ANIMATE_TYPE","duration","DEFAULT_BOX_ANIMATE_DURATION","delay","DEFAULT_BOX_ANIMATE_DELAY","actualDelay","actualDuration","className","useStyle","transition","responsiveStagger","index","stagger","DEFAULT_ITEM_STAGGER_DURATION","delayFromStagger","element","overflow","overflowY","overflowX","ownerDocument","defaultView","getComputedStyle","test","parentElement","isScrollable","getScrollParent","strength","children","rest","container","useRef","containerScrollTop","setContainerScrollTop","lastScrollParentScrollTop","useIsomorphicLayoutEffect","current","undefined","containerDocument","scrollParent","eventTarget","documentElement","scrollTop","requestAnimationFrame","top","containerTop","bottom","containerBottom","getBoundingClientRect","scrollParentTop","scrollParentBottom","innerHeight","scrollParentScrollTop","pageYOffset","scrollParentHeight","scrollParentScrollDelta","isContainerVisible","containerScrollRemaining","scrollParentScrollRemaining","parallaxRatio","containerScrollDelta","clamp","handleScroll","getProps","useCallback","style","restOfChildrenProps","position","left","right","Container","forwardRef","ref","restOfProps","cx","pointerEvents","backgroundColor","visible","background","getScale","aspectRatio","zoom","offsetWidth","width","offsetHeight","height","computedAspectRatio","Math","max","url","maskColor","ready","setReady","scale","setScale","containerEl","handleResize","ReactPlayer","canPlay","_jsx","_Fragment","vimeo","playerOptions","youtube","playerVars","origin","location","wistia","options","endVideoBehavior","playbackRateControl","playbar","playButton","volumeControl","fullscreenButton","muted","color","swatch","colorToString","hue","saturation","lightness","getStopsStyle","stops","map","getColor","join","absoluteFillStyle","containerStyle","borderRadius","backgrounds","value","deviceId","visibility","v","layer","visibilityStyle","responsiveStyle","display","reverse","bg","type","payload","id","ImageBackgroundRepeat","NoRepeat","RepeatX","RepeatY","Repeat","ImageBackgroundSize","Cover","Contain","Auto","publicUrl","repeat","size","parallax","backgroundPosition","x","y","containerClassName","getParallaxProps","backgroundImage","backgroundRepeat","backgroundSize","gradient","isRadial","angle","PI","getAspectRatio","boxAnimateType","boxAnimateDuration","boxAnimateDelay","handle","setHandle","useImperativeHandle","animationClassName","useBoxAnimation","margin","useBackgrounds","Children","only","grid","columnGap","rowGap","itemAnimateType","itemAnimateDuration","itemAnimateDelay","itemStaggerDuration","gridItemClassName","responsiveGridItem","useItemAnimation"],"mappings":"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"}
+{"version":3,"file":"grid-item.es.js","sources":["../src/components/hooks/useBackgrounds.ts","../src/components/builtin/Box/animations.tsx","../src/utils/clamp.ts","../src/components/shared/BackgroundsContainer/components/Parallax/index.tsx","../src/components/shared/BackgroundsContainer/components/BackgroundVideo/index.tsx","../src/components/shared/BackgroundsContainer/components/Backgrounds/index.tsx","../src/components/shared/BackgroundsContainer/index.tsx","../src/components/shared/grid-item.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport { ColorValue as Color } from '../utils/types'\nimport { ResponsiveValue } from '../../prop-controllers'\nimport { isNonNullable } from '../utils/isNonNullable'\nimport { BackgroundsValue as ResponsiveBackgroundsValue } from '../../prop-controllers/descriptors'\nimport { useFiles, useSwatches } from '../../runtimes/react/hooks/makeswift-api'\nimport {\n  getBackgroundsFileIds,\n  getBackgroundsSwatchIds,\n} from '../../prop-controllers/introspection'\n\ntype BackgroundColorData = Color\n\ntype BackgroundGradientStopData = {\n  id: string\n  location: number\n  color: Color | null | undefined\n}\n\ntype BackgroundGradientData = {\n  angle?: number\n  isRadial?: boolean\n  stops: Array<BackgroundGradientStopData>\n}\n\ntype BackgroundImageData = {\n  publicUrl?: string\n  dimensions?: { width: number; height: number } | null\n  position: {\n    x: number\n    y: number\n  }\n  size?: 'cover' | 'contain' | 'auto'\n  repeat?: 'no-repeat' | 'repeat-x' | 'repeat-y' | 'repeat'\n  opacity?: number\n  parallax?: number\n}\n\ntype BackgroundVideoData = {\n  url?: string\n  maskColor: Color | null | undefined\n  aspectRatio?: 'wide' | 'standard'\n  opacity?: number\n  zoom?: number\n  parallax?: number\n}\n\ntype BackgroundData =\n  | { id: string; type: 'color'; payload: BackgroundColorData | null | undefined }\n  | { id: string; type: 'image'; payload: BackgroundImageData | null | undefined }\n  | { id: string; type: 'gradient'; payload: BackgroundGradientData | null | undefined }\n  | { id: string; type: 'video'; payload: BackgroundVideoData | null | undefined }\n\nexport type BackgroundsData = Array<BackgroundData>\n\nexport type BackgroundsPropControllerData = ResponsiveValue<BackgroundsData>\n\nexport function useBackgrounds(\n  value: ResponsiveBackgroundsValue | null | undefined,\n): BackgroundsPropControllerData | null | undefined {\n  const fileIds = getBackgroundsFileIds(value)\n  const files = useFiles(fileIds)\n  const swatchIds = getBackgroundsSwatchIds(value)\n  const swatches = useSwatches(swatchIds)\n\n  return useMemo(() => {\n    if (value == null) return null\n\n    return value.map(({ value: backgrounds, ...restOfValue }) => ({\n      ...restOfValue,\n      value: backgrounds\n        .map((bg): BackgroundData | null | undefined => {\n          if (bg.type === 'image' && bg.payload != null && bg.payload.imageId != null) {\n            const { imageId, ...restOfPayload } = bg.payload\n            const file = files.find(f => f && f.id === imageId)\n\n            return (\n              file && {\n                id: bg.id,\n                type: 'image',\n                payload: {\n                  ...restOfPayload,\n                  publicUrl: file.publicUrl,\n                  dimensions: file.dimensions,\n                },\n              }\n            )\n          }\n\n          if (bg.type === 'color' && bg.payload != null) {\n            const { swatchId, alpha } = bg.payload\n            const swatch = swatches.filter(isNonNullable).find(s => s && s.id === swatchId)\n\n            return { id: bg.id, type: 'color', payload: { swatch, alpha } }\n          }\n\n          if (bg.type === 'gradient' && bg.payload != null && bg.payload.stops.length > 0) {\n            return {\n              id: bg.id,\n              type: 'gradient',\n              payload: {\n                angle: bg.payload.angle,\n                isRadial: bg.payload.isRadial,\n                stops: bg.payload.stops.map(({ color, ...restOfStop }) => ({\n                  ...restOfStop,\n                  color: color && {\n                    swatch: swatches.filter(isNonNullable).find(s => s && s.id === color.swatchId),\n                    alpha: color.alpha,\n                  },\n                })),\n              },\n            }\n          }\n\n          if (bg.type === 'video' && bg.payload != null) {\n            const { maskColor, ...restOfPayload } = bg.payload\n            const swatch = maskColor && swatches.find(s => s && s.id === maskColor.swatchId)\n\n            return {\n              id: bg.id,\n              type: 'video',\n              payload: {\n                ...restOfPayload,\n                maskColor: swatch && maskColor && { swatch, alpha: maskColor.alpha },\n              },\n            }\n          }\n\n          return null\n        })\n        .filter(isNonNullable),\n    }))\n  }, [files, swatches, value])\n}\n","import { CSSObject } from '@emotion/css'\nimport { useEffect, useState } from 'react'\nimport { ResponsiveValue } from '../../../prop-controllers'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useMediaQuery } from '../../hooks'\nimport {\n  BoxAnimateIn,\n  DEFAULT_BOX_ANIMATE_DELAY,\n  DEFAULT_BOX_ANIMATE_DURATION,\n  DEFAULT_BOX_ANIMATE_TYPE,\n  DEFAULT_ITEM_ANIMATE_TYPE,\n  DEFAULT_ITEM_STAGGER_DURATION,\n} from './constants'\n\nconst QUERY = '(prefers-reduced-motion: no-preference)'\n\nfunction usePrefersReducedMotion() {\n  const [prefersReducedMotion, setPrefersReducedMotion] = useState(false)\n\n  useEffect(() => {\n    const mediaQueryList = window.matchMedia(QUERY)\n\n    setPrefersReducedMotion(!window.matchMedia(QUERY).matches)\n\n    const listener = (event: MediaQueryListEvent) => {\n      setPrefersReducedMotion(!event.matches)\n    }\n    mediaQueryList.addEventListener('change', listener)\n    return () => {\n      mediaQueryList.removeEventListener('change', listener)\n    }\n  }, [])\n\n  return prefersReducedMotion\n}\n\nconst exitedBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n  none: { opacity: 1 },\n  fadeIn: { opacity: 0 },\n  fadeLeft: { transform: 'translate3d(60px,0,0)', opacity: 0 },\n  fadeRight: { transform: 'translate3d(-60px,0,0)', opacity: 0 },\n  fadeDown: { transform: 'translate3d(0,-80px,0)', opacity: 0 },\n  fadeUp: { transform: 'translate3d(0,80px,0)', opacity: 0 },\n  blurIn: { filter: 'blur(20px)', opacity: 0 },\n  scaleDown: {\n    transform: 'scale(1.2)',\n    opacity: 0,\n  },\n  scaleUp: {\n    transform: 'scale(.75)',\n    opacity: 0,\n  },\n}\n\nconst enteredBoxAnimationProperties: { [key in BoxAnimateIn]: CSSObject } = {\n  none: { opacity: 1 },\n  fadeIn: { opacity: 1 },\n  fadeLeft: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n  fadeRight: { transform: 'translate3d(0px,0,0)', opacity: 1 },\n  fadeDown: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n  fadeUp: { transform: 'translate3d(0,0px,0)', opacity: 1 },\n  blurIn: { filter: 'blur(0px)', opacity: 1 },\n  scaleDown: {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n  scaleUp: {\n    transform: 'scale(1)',\n    opacity: 1,\n  },\n}\n\nexport function useBoxAnimation(\n  responsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n  responsiveDuration: ResponsiveValue<number> | undefined,\n  responisveDelay: ResponsiveValue<number> | undefined,\n  itemResponsiveAnimationType: ResponsiveValue<BoxAnimateIn> | undefined,\n) {\n  const reducedMotion = usePrefersReducedMotion()\n  const animationType = useMediaQuery(responsiveAnimationType) || DEFAULT_BOX_ANIMATE_TYPE\n  const itemAnimationType = useMediaQuery(itemResponsiveAnimationType) || DEFAULT_ITEM_ANIMATE_TYPE\n  const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n  const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n  const actualDelay = delay * 1000\n  const actualDuration = duration * 1000\n\n  const className = useStyle({\n    ...exitedBoxAnimationProperties[animationType],\n    transition: `all 0ms`,\n    '&.show': {\n      ...enteredBoxAnimationProperties[animationType],\n      transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms`,\n    },\n    '&:not(.show) > div > div': {\n      ...exitedBoxAnimationProperties[itemAnimationType],\n      transition: `all 0ms !important`,\n    },\n    '&.show > div > div': {\n      ...enteredBoxAnimationProperties[itemAnimationType],\n    },\n  })\n\n  if (reducedMotion) {\n    return ''\n  }\n\n  return className\n}\n\nexport function useItemAnimation(\n  responsiveDuration: ResponsiveValue<number> | undefined,\n  responisveDelay: ResponsiveValue<number> | undefined,\n  responsiveStagger: ResponsiveValue<number> | undefined,\n  index: number,\n) {\n  const reducedMotion = usePrefersReducedMotion()\n  const duration = useMediaQuery(responsiveDuration) || DEFAULT_BOX_ANIMATE_DURATION\n  const delay = useMediaQuery(responisveDelay) || DEFAULT_BOX_ANIMATE_DELAY\n  const stagger = useMediaQuery(responsiveStagger) || DEFAULT_ITEM_STAGGER_DURATION\n  const delayFromStagger = responsiveStagger == null || index == null ? 0 : stagger * index\n  const actualDelay = (delay + delayFromStagger) * 1000\n  const actualDuration = duration * 1000\n\n  const className = useStyle({\n    transition: `transform ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms,filter ${actualDuration}ms cubic-bezier(0.16, 0.84, 0.44, 1) ${actualDelay}ms, opacity ${actualDuration}ms ease ${actualDelay}ms !important`,\n  })\n\n  if (reducedMotion) {\n    return ''\n  }\n\n  return className\n}\n","const clamp = (min: number, val: number, max: number): number => Math.min(Math.max(min, val), max)\n\nexport default clamp\n","import { useState, useRef, useCallback, ReactNode, CSSProperties } from 'react'\nimport clamp from '../../../../../utils/clamp'\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nfunction isScrollable(element: HTMLElement) {\n  const { overflow, overflowY, overflowX } =\n    element.ownerDocument.defaultView!.getComputedStyle(element)\n\n  return /(auto|scroll)/.test(overflow + overflowX + overflowY)\n}\n\nfunction getScrollParent(element: HTMLElement): HTMLElement {\n  const { parentElement } = element\n\n  if (!element || !parentElement) return element\n\n  if (isScrollable(element)) return element\n\n  return getScrollParent(parentElement)\n}\n\ntype Props = {\n  strength: number | null | undefined\n  children: (\n    getParallaxProps: <P extends { style?: CSSProperties; [key: string]: unknown }>(props: P) => P,\n  ) => ReactNode\n}\n\nexport default function Parallax({ strength, children, ...rest }: Props): JSX.Element {\n  const container = useRef<HTMLDivElement>(null)\n  const [containerScrollTop, setContainerScrollTop] = useState(strength == null ? 0 : strength)\n  const lastScrollParentScrollTop = useRef(0)\n\n  useIsomorphicLayoutEffect(() => {\n    if (!container.current || strength == null || strength === 0) return undefined\n\n    const containerDocument = container.current.ownerDocument\n    const scrollParent = getScrollParent(container.current)\n    const eventTarget =\n      containerDocument.documentElement === scrollParent\n        ? containerDocument.defaultView!\n        : scrollParent\n\n    lastScrollParentScrollTop.current = scrollParent.scrollTop\n    setContainerScrollTop(strength)\n\n    function handleScroll() {\n      containerDocument.defaultView!.requestAnimationFrame(() => {\n        if (!container.current) return\n\n        const { top: containerTop, bottom: containerBottom } =\n          container.current.getBoundingClientRect()\n        const { top: scrollParentTop, bottom: scrollParentBottom } =\n          scrollParent === containerDocument.documentElement\n            ? { top: 0, bottom: containerDocument.defaultView!.innerHeight }\n            : scrollParent.getBoundingClientRect()\n        const { scrollTop: scrollParentScrollTop } =\n          scrollParent === containerDocument.documentElement\n            ? { scrollTop: containerDocument.defaultView!.pageYOffset }\n            : scrollParent\n        const scrollParentHeight = scrollParentBottom - scrollParentTop\n        const scrollParentScrollDelta = scrollParentScrollTop - lastScrollParentScrollTop.current\n\n        lastScrollParentScrollTop.current = scrollParentScrollTop\n\n        setContainerScrollTop(scrollTop => {\n          const isContainerVisible =\n            containerTop < scrollParentTop + scrollParentHeight && containerBottom > scrollParentTop\n          const containerScrollRemaining =\n            scrollParentScrollDelta > 0 ? 2 * strength! - scrollTop : scrollTop\n          const scrollParentScrollRemaining =\n            scrollParentScrollDelta > 0\n              ? scrollParentTop + containerBottom\n              : scrollParentHeight - containerTop\n          const parallaxRatio = containerScrollRemaining / scrollParentScrollRemaining\n          const containerScrollDelta = isContainerVisible\n            ? parallaxRatio * scrollParentScrollDelta\n            : 0\n\n          return clamp(0, scrollTop + containerScrollDelta, strength! * 2)\n        })\n      })\n    }\n\n    eventTarget.addEventListener('scroll', handleScroll)\n\n    return () => eventTarget.removeEventListener('scroll', handleScroll)\n  }, [strength])\n\n  const getProps = useCallback(\n    ({ style, ...restOfChildrenProps }: any) => ({\n      ...restOfChildrenProps,\n      style: {\n        ...style,\n        position: 'absolute',\n        left: 0,\n        right: 0,\n        top: 0,\n        bottom: 0,\n        ...(strength == null || strength === 0\n          ? {}\n          : {\n              top: -strength,\n              bottom: -strength,\n              transform: `translate3d(0, ${containerScrollTop - strength}px, 0)`,\n            }),\n      },\n    }),\n    [strength, containerScrollTop],\n  )\n\n  return (\n    <div\n      {...rest}\n      ref={container}\n      style={{ position: 'absolute', top: 0, left: 0, right: 0, bottom: 0 }}\n    >\n      {children(getProps)}\n    </div>\n  )\n}\n","import { cx } from '@emotion/css'\nimport { useState, useRef, ComponentPropsWithoutRef, ForwardedRef, forwardRef } from 'react'\nimport ReactPlayer from 'react-player'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\n\nimport { useIsomorphicLayoutEffect } from '../../../../hooks/useIsomorphicLayoutEffect'\n\nconst Container = forwardRef(function Container(\n  { className, ...restOfProps }: ComponentPropsWithoutRef<'div'>,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  return (\n    <div\n      {...restOfProps}\n      ref={ref}\n      className={cx(\n        useStyle({\n          position: 'absolute',\n          top: 0,\n          left: 0,\n          right: 0,\n          bottom: 0,\n          pointerEvents: 'none',\n          overflow: 'hidden',\n        }),\n        className,\n      )}\n    />\n  )\n})\n\nfunction Mask({\n  backgroundColor,\n  visible,\n}: {\n  backgroundColor: string | undefined\n  visible: boolean\n}) {\n  return (\n    <div\n      className={useStyle({\n        position: 'absolute',\n        top: 0,\n        left: 0,\n        right: 0,\n        bottom: 0,\n        background: backgroundColor,\n        opacity: visible ? 1 : 0,\n        transition: 'opacity 1s',\n      })}\n    />\n  )\n}\n\nconst getScale = (element: HTMLElement, aspectRatio: number, zoom: number) => {\n  const { offsetWidth: width, offsetHeight: height } = element\n  const computedAspectRatio = width / height\n\n  return Math.max(aspectRatio / computedAspectRatio, computedAspectRatio / aspectRatio) * zoom\n}\n\ntype Props = {\n  url?: string\n  aspectRatio?: number\n  zoom?: number\n  opacity?: number\n  maskColor?: string\n}\n\nexport default function BackgroundVideo({\n  url = '',\n  aspectRatio = 16 / 9,\n  zoom = 1,\n  maskColor,\n  opacity,\n}: Props): JSX.Element {\n  const [ready, setReady] = useState(false)\n  const [scale, setScale] = useState(1)\n  const container = useRef<HTMLDivElement>(null)\n\n  useIsomorphicLayoutEffect(() => {\n    const { current: containerEl } = container\n\n    if (!containerEl) return undefined\n\n    const { defaultView } = containerEl.ownerDocument\n    const handleResize = () => setScale(getScale(containerEl, aspectRatio, zoom))\n\n    handleResize()\n\n    defaultView!.addEventListener('resize', handleResize)\n\n    return () => defaultView!.removeEventListener('resize', handleResize)\n  }, [aspectRatio, zoom])\n\n  if (!ReactPlayer.canPlay(url)) return <></>\n\n  return (\n    <Container ref={container}>\n      {container.current && (\n        <ReactPlayer\n          url={url}\n          config={{\n            vimeo: { playerOptions: { background: true } },\n            youtube: {\n              playerVars: {\n                origin: container.current.ownerDocument.defaultView?.location.origin,\n              },\n            },\n            wistia: {\n              options: {\n                endVideoBehavior: 'loop',\n                playbackRateControl: false,\n                playbar: false,\n                playButton: false,\n                volumeControl: false,\n                fullscreenButton: false,\n                muted: true,\n              },\n            },\n          }}\n          playing\n          loop\n          muted\n          controls={false}\n          onReady={() => setReady(true)}\n          style={{\n            transform: `scale3d(${scale}, ${scale}, 1)`,\n            opacity,\n          }}\n          width=\"100%\"\n          height=\"100%\"\n        />\n      )}\n      <Mask backgroundColor={maskColor} visible={!ready} />\n    </Container>\n  )\n}\n","import NextImage from 'next/image'\n\nimport { BackgroundsPropControllerData, BackgroundsData } from '../../../../hooks'\nimport { ResponsiveValue } from '../../../../../prop-controllers'\nimport { ColorValue as Color } from '../../../../utils/types'\nimport { colorToString } from '../../../../utils/colorToString'\nimport Parallax from '../Parallax'\nimport BackgroundVideo from '../BackgroundVideo'\nimport { CSSObject } from '@emotion/css'\nimport { useStyle } from '../../../../../runtimes/react/use-style'\nimport { responsiveStyle } from '../../../../utils/responsive-style'\n\nfunction getColor(color: Color | null | undefined) {\n  if (color == null) return 'black'\n\n  if (color.swatch == null) {\n    return colorToString({ ...color, swatch: { hue: 0, saturation: 0, lightness: 0 } })\n  }\n\n  return colorToString(color)\n}\n\ntype GradientStop = { color: Color | null | undefined; location: number }\n\nconst getStopsStyle = (stops: GradientStop[]) =>\n  stops.map(({ color, location }) => `${getColor(color)} ${location}%`).join(',')\n\nconst absoluteFillStyle: CSSObject = {\n  position: 'absolute',\n  top: 0,\n  right: 0,\n  bottom: 0,\n  left: 0,\n}\n\nconst containerStyle: CSSObject = {\n  ...absoluteFillStyle,\n  borderRadius: 'inherit',\n}\n\ntype Props = { backgrounds: BackgroundsPropControllerData | null | undefined }\n\nexport default function Backgrounds({ backgrounds }: Props): JSX.Element {\n  if (backgrounds == null) return <></>\n\n  return (\n    <>\n      {backgrounds.map(({ value, deviceId }) => {\n        const visibility = backgrounds.map(v => ({\n          deviceId: v.deviceId,\n          value: v.deviceId === deviceId,\n        }))\n\n        return <BackgroundDeviceLayer key={deviceId} layer={value} visibility={visibility} />\n      })}\n    </>\n  )\n}\n\ntype BackgroundLayerProps = {\n  layer: BackgroundsData\n  visibility: ResponsiveValue<boolean>\n}\n\nfunction BackgroundDeviceLayer({ layer, visibility }: BackgroundLayerProps) {\n  const visibilityStyle = responsiveStyle([visibility], ([v]) => ({\n    display: v === true ? 'block' : 'none',\n  }))\n\n  return (\n    <div className={useStyle({ ...containerStyle, ...visibilityStyle, overflow: 'hidden' })}>\n      {[...layer].reverse().map(bg => {\n        if (bg.type === 'color') {\n          return <ColorBackground key={bg.id} color={getColor(bg.payload)} />\n        }\n\n        if (bg.type === 'image' && bg.payload) {\n          return <ImageBackground {...bg.payload} key={bg.id} />\n        }\n\n        if (bg.type === 'gradient' && bg.payload) {\n          return (\n            <GradientBackground\n              {...bg.payload}\n              key={bg.id}\n              gradient={getStopsStyle(bg.payload.stops)}\n            />\n          )\n        }\n\n        if (bg.type === 'video' && bg.payload) {\n          return (\n            <VideoBackground\n              {...bg.payload}\n              key={bg.id}\n              maskColor={getColor(bg.payload.maskColor)}\n            />\n          )\n        }\n\n        return null\n      })}\n    </div>\n  )\n}\n\ntype ColorBackgroundProps = { color: string }\n\nfunction ColorBackground({ color }: ColorBackgroundProps) {\n  return <div className={useStyle({ ...containerStyle, backgroundColor: color })} />\n}\n\nconst ImageBackgroundRepeat = {\n  NoRepeat: 'no-repeat',\n  RepeatX: 'repeat-x',\n  RepeatY: 'repeat-y',\n  Repeat: 'repeat',\n} as const\n\ntype ImageBackgroundRepeat = typeof ImageBackgroundRepeat[keyof typeof ImageBackgroundRepeat]\n\nconst ImageBackgroundSize = {\n  Cover: 'cover',\n  Contain: 'contain',\n  Auto: 'auto',\n} as const\n\ntype ImageBackgroundSize = typeof ImageBackgroundSize[keyof typeof ImageBackgroundSize]\n\ntype ImageBackgroundProps = {\n  publicUrl?: string\n  position: { x: number; y: number }\n  repeat?: ImageBackgroundRepeat\n  size?: ImageBackgroundSize\n  opacity?: number\n  parallax?: number\n}\n\nfunction ImageBackground({\n  publicUrl,\n  position,\n  repeat = ImageBackgroundRepeat.NoRepeat,\n  size = ImageBackgroundSize.Cover,\n  opacity,\n  parallax,\n}: ImageBackgroundProps) {\n  const backgroundPosition = `${position.x}% ${position.y}%`\n  const containerClassName = useStyle(containerStyle)\n\n  if (repeat === 'no-repeat' && size !== 'auto' && publicUrl != null) {\n    return (\n      <Parallax strength={parallax}>\n        {getParallaxProps => (\n          <div {...getParallaxProps({ style: { opacity, overflow: 'hidden' } })}>\n            <NextImage\n              src={publicUrl}\n              layout=\"fill\"\n              objectPosition={backgroundPosition}\n              objectFit={size}\n            />\n          </div>\n        )}\n      </Parallax>\n    )\n  }\n\n  return (\n    <Parallax strength={parallax}>\n      {getParallaxProps => (\n        <div\n          className={containerClassName}\n          {...getParallaxProps({\n            style: {\n              backgroundImage: publicUrl != null ? `url('${publicUrl}')` : undefined,\n              backgroundPosition,\n              backgroundRepeat: repeat,\n              backgroundSize: size,\n              opacity,\n            },\n          })}\n        />\n      )}\n    </Parallax>\n  )\n}\n\ntype GradientBackgroundProps = {\n  gradient: string\n  angle?: number\n  isRadial?: boolean\n}\n\nfunction GradientBackground({\n  gradient,\n  isRadial = false,\n  angle = Math.PI,\n}: GradientBackgroundProps) {\n  return (\n    <div\n      className={useStyle({\n        ...containerStyle,\n        background: isRadial\n          ? `radial-gradient(${gradient})`\n          : `linear-gradient(${angle}rad, ${gradient})`,\n      })}\n    />\n  )\n}\n\nconst BackgroundVideoAspectRatio = {\n  Wide: 'wide',\n  Standard: 'standard',\n} as const\n\ntype BackgroundVideoAspectRatio =\n  typeof BackgroundVideoAspectRatio[keyof typeof BackgroundVideoAspectRatio]\n\nfunction getAspectRatio(aspectRatio: BackgroundVideoAspectRatio | null | undefined): number {\n  switch (aspectRatio) {\n    case 'wide':\n      return 16 / 9\n\n    case 'standard':\n      return 4 / 3\n\n    default:\n      return 16 / 9\n  }\n}\n\ntype VideoBackgroundProps = {\n  url?: string\n  aspectRatio?: BackgroundVideoAspectRatio\n  maskColor: string\n  zoom?: number\n  opacity?: number\n  parallax?: number\n}\n\nfunction VideoBackground({\n  url,\n  aspectRatio,\n  maskColor,\n  zoom,\n  opacity,\n  parallax,\n}: VideoBackgroundProps) {\n  return (\n    <Parallax strength={parallax}>\n      {getParallaxProps => (\n        <div {...getParallaxProps({ className: useStyle(containerStyle) })}>\n          <BackgroundVideo\n            url={url}\n            zoom={zoom}\n            opacity={opacity}\n            aspectRatio={getAspectRatio(aspectRatio)}\n            maskColor={maskColor}\n          />\n        </div>\n      )}\n    </Parallax>\n  )\n}\n","import { cx } from '@emotion/css'\nimport {\n  Children,\n  ComponentPropsWithoutRef,\n  ElementType,\n  forwardRef,\n  ReactElement,\n  Ref,\n  useImperativeHandle,\n  useState,\n} from 'react'\nimport {\n  BackgroundsValue as BackgroundsPropControllerValue,\n  ResponsiveNumberValue,\n  ResponsiveSelectValue,\n} from '../../../prop-controllers/descriptors'\nimport { useStyle } from '../../../runtimes/react/use-style'\nimport { useBoxAnimation } from '../../builtin/Box/animations'\nimport { BoxAnimateIn } from '../../builtin/Box/constants'\nimport { useBackgrounds } from '../../hooks'\nimport Backgrounds from './components/Backgrounds'\n\ntype BaseProps = {\n  backgrounds: BackgroundsPropControllerValue | null | undefined\n  children: ReactElement<ElementType>\n  boxAnimateType?: ResponsiveSelectValue<BoxAnimateIn>\n  boxAnimateDuration?: ResponsiveNumberValue\n  boxAnimateDelay?: ResponsiveNumberValue\n  itemAnimationType?: ResponsiveSelectValue<BoxAnimateIn>\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport default forwardRef<HTMLDivElement | null, Props>(function BackgroundsContainer(\n  {\n    backgrounds,\n    children,\n    className,\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimationType,\n    ...restOfProps\n  }: Props,\n  ref: Ref<HTMLDivElement | null>,\n) {\n  const [handle, setHandle] = useState<HTMLDivElement | null>(null)\n\n  useImperativeHandle(ref, () => handle, [handle])\n\n  const animationClassName = useBoxAnimation(\n    boxAnimateType,\n    boxAnimateDuration,\n    boxAnimateDelay,\n    itemAnimationType,\n  )\n\n  return (\n    <div\n      {...restOfProps}\n      ref={setHandle}\n      className={cx(\n        useStyle({\n          position: 'relative',\n          width: '100%',\n          margin: '0 auto',\n          '> *': {\n            borderRadius: 'inherit',\n            height: 'inherit',\n          },\n          '> :last-child': {\n            position: 'relative',\n          },\n        }),\n        className,\n        animationClassName,\n      )}\n    >\n      <Backgrounds backgrounds={useBackgrounds(backgrounds)} />\n      {Children.only(children)}\n    </div>\n  )\n})\n","import { cx } from '@emotion/css'\nimport { ComponentPropsWithoutRef } from 'react'\nimport {\n  ResponsiveValue,\n  Length as LengthValue,\n  ResponsiveNumberValue,\n} from '../../prop-controllers'\nimport { useStyle } from '../../runtimes/react/use-style'\nimport { useItemAnimation } from '../builtin/Box/animations'\nimport { responsiveGridItem } from '../utils/responsive-style'\n\ntype BaseProps = {\n  className?: string\n  grid: ResponsiveValue<{ spans: Array<Array<number>>; count: number }>\n  index: number\n  columnGap?: ResponsiveValue<LengthValue>\n  rowGap?: ResponsiveValue<LengthValue>\n  itemAnimateDuration?: ResponsiveNumberValue\n  itemAnimateDelay?: ResponsiveNumberValue\n  itemStaggerDuration?: ResponsiveNumberValue\n}\n\ntype Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>\n\nexport function GridItem({\n  grid,\n  index,\n  columnGap,\n  rowGap,\n  className,\n  itemAnimateDuration,\n  itemAnimateDelay,\n  itemStaggerDuration,\n  ...restOfProps\n}: Props) {\n  const gridItemClassName = useStyle(responsiveGridItem({ grid, index, columnGap, rowGap }))\n  const animationClassName = useItemAnimation(\n    itemAnimateDuration,\n    itemAnimateDelay,\n    itemStaggerDuration,\n    index,\n  )\n\n  return <div {...restOfProps} className={cx(gridItemClassName, className, animationClassName)} />\n}\n"],"names":["QUERY","prefersReducedMotion","setPrefersReducedMotion","useState","useEffect","mediaQueryList","window","matchMedia","matches","listener","event","addEventListener","removeEventListener","exitedBoxAnimationProperties","none","opacity","fadeIn","fadeLeft","transform","fadeRight","fadeDown","fadeUp","blurIn","filter","scaleDown","scaleUp","enteredBoxAnimationProperties","responsiveAnimationType","responsiveDuration","responisveDelay","itemResponsiveAnimationType","reducedMotion","usePrefersReducedMotion","animationType","useMediaQuery","DEFAULT_BOX_ANIMATE_TYPE","itemAnimationType","DEFAULT_ITEM_ANIMATE_TYPE","duration","DEFAULT_BOX_ANIMATE_DURATION","delay","DEFAULT_BOX_ANIMATE_DELAY","actualDelay","actualDuration","className","useStyle","transition","responsiveStagger","index","stagger","DEFAULT_ITEM_STAGGER_DURATION","delayFromStagger","element","overflow","overflowY","overflowX","ownerDocument","defaultView","getComputedStyle","test","parentElement","isScrollable","getScrollParent","strength","children","rest","container","useRef","containerScrollTop","setContainerScrollTop","lastScrollParentScrollTop","useIsomorphicLayoutEffect","current","undefined","containerDocument","scrollParent","eventTarget","documentElement","scrollTop","requestAnimationFrame","top","containerTop","bottom","containerBottom","getBoundingClientRect","scrollParentTop","scrollParentBottom","innerHeight","scrollParentScrollTop","pageYOffset","scrollParentHeight","scrollParentScrollDelta","isContainerVisible","containerScrollRemaining","scrollParentScrollRemaining","parallaxRatio","containerScrollDelta","clamp","handleScroll","getProps","useCallback","style","restOfChildrenProps","position","left","right","Container","forwardRef","ref","restOfProps","cx","pointerEvents","backgroundColor","visible","background","getScale","aspectRatio","zoom","offsetWidth","width","offsetHeight","height","computedAspectRatio","Math","max","url","maskColor","ready","setReady","scale","setScale","containerEl","handleResize","ReactPlayer","canPlay","_jsx","_Fragment","vimeo","playerOptions","youtube","playerVars","origin","location","wistia","options","endVideoBehavior","playbackRateControl","playbar","playButton","volumeControl","fullscreenButton","muted","color","swatch","colorToString","hue","saturation","lightness","getStopsStyle","stops","map","getColor","join","absoluteFillStyle","containerStyle","borderRadius","backgrounds","value","deviceId","visibility","v","layer","visibilityStyle","responsiveStyle","display","reverse","bg","type","payload","id","ImageBackgroundRepeat","NoRepeat","RepeatX","RepeatY","Repeat","ImageBackgroundSize","Cover","Contain","Auto","publicUrl","repeat","size","parallax","backgroundPosition","x","y","containerClassName","getParallaxProps","backgroundImage","backgroundRepeat","backgroundSize","gradient","isRadial","angle","PI","getAspectRatio","boxAnimateType","boxAnimateDuration","boxAnimateDelay","handle","setHandle","useImperativeHandle","animationClassName","useBoxAnimation","margin","useBackgrounds","Children","only","grid","columnGap","rowGap","itemAnimateDuration","itemAnimateDelay","itemStaggerDuration","gridItemClassName","responsiveGridItem","useItemAnimation"],"mappings":"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"}

package/dist/index.cjs.js

@@ -1085,7 +1085,7 @@ class Document$1 extends NextDocument__default["default"] {
     });
   }
 }
-const version = "0.0.0-20230110205857";
+const version = "0.0.0-20230110213327";
 function isErrorWithMessage(error) {
   return typeof error === "object" && error !== null && "message" in error && typeof error.message === "string";
 }

package/dist/index.es.js

@@ -1050,7 +1050,7 @@ class Document$1 extends NextDocument {
     });
   }
 }
-const version = "0.0.0-20230110205857";
+const version = "0.0.0-20230110213327";
 function isErrorWithMessage(error) {
   return typeof error === "object" && error !== null && "message" in error && typeof error.message === "string";
 }

package/dist/types/src/components/builtin/Box/Box.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../../../src/components/builtin/Box/Box.tsx"],"names":[],"mappings":";AAKA,OAAO,EACL,cAAc,EACd,6BAA6B,EAC7B,SAAS,EACT,SAAS,EACT,SAAS,EACT,aAAa,EACb,qBAAqB,EACrB,qBAAqB,EACrB,gBAAgB,EACjB,MAAM,uCAAuC,CAAA;AAC9C,OAAO,EAAE,cAAc,EAAoB,MAAM,oBAAoB,CAAA;AAErE,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAM1C,aAAK,KAAK,GAAG;IACX,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,WAAW,CAAC,EAAE,gBAAgB,CAAA;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,6BAA6B,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC1D,aAAa,CAAC,EAAE,6BAA6B,CAC3C,YAAY,GAAG,QAAQ,GAAG,UAAU,GAAG,eAAe,CACvD,CAAA;IACD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,cAAc,CAAC,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACpD,kBAAkB,CAAC,EAAE,qBAAqB,CAAA;IAC1C,eAAe,CAAC,EAAE,qBAAqB,CAAA;IACvC,eAAe,CAAC,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACrD,mBAAmB,CAAC,EAAE,qBAAqB,CAAA;IAC3C,gBAAgB,CAAC,EAAE,qBAAqB,CAAA;IACxC,mBAAmB,CAAC,EAAE,qBAAqB,CAAA;IAC3C,eAAe,CAAC,EAAE,aAAa,CAAA;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB,CAAA;AAED,QAAA,MAAM,GAAG,kGA+KP,CAAA;AAEF,eAAe,GAAG,CAAA"}
+{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../../../../src/components/builtin/Box/Box.tsx"],"names":[],"mappings":";AAcA,OAAO,EACL,cAAc,EACd,6BAA6B,EAC7B,SAAS,EACT,SAAS,EACT,SAAS,EACT,aAAa,EACb,qBAAqB,EACrB,qBAAqB,EACrB,gBAAgB,EACjB,MAAM,uCAAuC,CAAA;AAC9C,OAAO,EAAE,cAAc,EAAoB,MAAM,oBAAoB,CAAA;AAErE,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AAM1C,aAAK,KAAK,GAAG;IACX,EAAE,CAAC,EAAE,cAAc,CAAA;IACnB,WAAW,CAAC,EAAE,gBAAgB,CAAA;IAC9B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,6BAA6B,CAAC,MAAM,GAAG,SAAS,CAAC,CAAA;IAC1D,aAAa,CAAC,EAAE,6BAA6B,CAC3C,YAAY,GAAG,QAAQ,GAAG,UAAU,GAAG,eAAe,CACvD,CAAA;IACD,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,MAAM,CAAC,EAAE,SAAS,CAAA;IAClB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,cAAc,CAAC,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACpD,kBAAkB,CAAC,EAAE,qBAAqB,CAAA;IAC1C,eAAe,CAAC,EAAE,qBAAqB,CAAA;IACvC,eAAe,CAAC,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACrD,mBAAmB,CAAC,EAAE,qBAAqB,CAAA;IAC3C,gBAAgB,CAAC,EAAE,qBAAqB,CAAA;IACxC,mBAAmB,CAAC,EAAE,qBAAqB,CAAA;IAC3C,eAAe,CAAC,EAAE,aAAa,CAAA;IAC/B,QAAQ,CAAC,EAAE,SAAS,CAAA;CACrB,CAAA;AAED,QAAA,MAAM,GAAG,kGAgLP,CAAA;AAEF,eAAe,GAAG,CAAA"}

package/dist/types/src/components/shared/grid-item.d.ts

@@ -1,6 +1,5 @@
 import { ComponentPropsWithoutRef } from 'react';
-import { ResponsiveValue, Length as LengthValue, ResponsiveSelectValue, ResponsiveNumberValue } from '../../prop-controllers';
-import { BoxAnimateIn } from '../builtin/Box/constants';
+import { ResponsiveValue, Length as LengthValue, ResponsiveNumberValue } from '../../prop-controllers';
 declare type BaseProps = {
     className?: string;
     grid: ResponsiveValue<{
@@ -10,12 +9,11 @@ declare type BaseProps = {
     index: number;
     columnGap?: ResponsiveValue<LengthValue>;
     rowGap?: ResponsiveValue<LengthValue>;
-    itemAnimateType?: ResponsiveSelectValue<BoxAnimateIn>;
     itemAnimateDuration?: ResponsiveNumberValue;
     itemAnimateDelay?: ResponsiveNumberValue;
     itemStaggerDuration?: ResponsiveNumberValue;
 };
 declare type Props = BaseProps & Omit<ComponentPropsWithoutRef<'div'>, keyof BaseProps>;
-export declare function GridItem({ grid, index, columnGap, rowGap, className, itemAnimateType, itemAnimateDuration, itemAnimateDelay, itemStaggerDuration, ...restOfProps }: Props): JSX.Element;
+export declare function GridItem({ grid, index, columnGap, rowGap, className, itemAnimateDuration, itemAnimateDelay, itemStaggerDuration, ...restOfProps }: Props): JSX.Element;
 export {};
 //# sourceMappingURL=grid-item.d.ts.map

package/dist/types/src/components/shared/grid-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"grid-item.d.ts","sourceRoot":"","sources":["../../../../../src/components/shared/grid-item.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAChD,OAAO,EACL,eAAe,EACf,MAAM,IAAI,WAAW,EACrB,qBAAqB,EACrB,qBAAqB,EACtB,MAAM,wBAAwB,CAAA;AAE/B,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAIvD,aAAK,SAAS,GAAG;IACf,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,eAAe,CAAC;QAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACrE,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC,CAAA;IACxC,MAAM,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC,CAAA;IAErC,eAAe,CAAC,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAA;IACrD,mBAAmB,CAAC,EAAE,qBAAqB,CAAA;IAC3C,gBAAgB,CAAC,EAAE,qBAAqB,CAAA;IACxC,mBAAmB,CAAC,EAAE,qBAAqB,CAAA;CAC5C,CAAA;AAED,aAAK,KAAK,GAAG,SAAS,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,SAAS,CAAC,CAAA;AAE/E,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,SAAS,EACT,MAAM,EACN,SAAS,EACT,eAAe,EACf,mBAAmB,EACnB,gBAAgB,EAChB,mBAAmB,EACnB,GAAG,WAAW,EACf,EAAE,KAAK,eAUP"}
+{"version":3,"file":"grid-item.d.ts","sourceRoot":"","sources":["../../../../../src/components/shared/grid-item.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,wBAAwB,EAAE,MAAM,OAAO,CAAA;AAChD,OAAO,EACL,eAAe,EACf,MAAM,IAAI,WAAW,EACrB,qBAAqB,EACtB,MAAM,wBAAwB,CAAA;AAK/B,aAAK,SAAS,GAAG;IACf,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,IAAI,EAAE,eAAe,CAAC;QAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAA;IACrE,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC,CAAA;IACxC,MAAM,CAAC,EAAE,eAAe,CAAC,WAAW,CAAC,CAAA;IACrC,mBAAmB,CAAC,EAAE,qBAAqB,CAAA;IAC3C,gBAAgB,CAAC,EAAE,qBAAqB,CAAA;IACxC,mBAAmB,CAAC,EAAE,qBAAqB,CAAA;CAC5C,CAAA;AAED,aAAK,KAAK,GAAG,SAAS,GAAG,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,EAAE,MAAM,SAAS,CAAC,CAAA;AAE/E,wBAAgB,QAAQ,CAAC,EACvB,IAAI,EACJ,KAAK,EACL,SAAS,EACT,MAAM,EACN,SAAS,EACT,mBAAmB,EACnB,gBAAgB,EAChB,mBAAmB,EACnB,GAAG,WAAW,EACf,EAAE,KAAK,eAUP"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@makeswift/runtime",
-  "version": "0.0.0-20230110205857",
+  "version": "0.0.0-20230110213327",
   "license": "MIT",
   "main": "dist/main.cjs",
   "module": "dist/main.es",