@fluentui/react-motion-components-preview 0.2.0 → 0.3.1

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export { Collapse, CollapseSnappy, CollapseExaggerated, createCollapsePresence } from './components/Collapse';\nexport { Fade, FadeSnappy, FadeExaggerated } from './components/Fade';\nexport { Scale, ScaleSnappy, ScaleExaggerated } from './components/Scale';\n"],"names":["Collapse","CollapseSnappy","CollapseExaggerated","createCollapsePresence","Fade","FadeSnappy","FadeExaggerated","Scale","ScaleSnappy","ScaleExaggerated"],"rangeMappings":";;","mappings":"AAAA,SAASA,QAAQ,EAAEC,cAAc,EAAEC,mBAAmB,EAAEC,sBAAsB,QAAQ,wBAAwB;AAC9G,SAASC,IAAI,EAAEC,UAAU,EAAEC,eAAe,QAAQ,oBAAoB;AACtE,SAASC,KAAK,EAAEC,WAAW,EAAEC,gBAAgB,QAAQ,qBAAqB"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Collapse,\n  CollapseSnappy,\n  CollapseRelaxed,\n  CollapseDelayed,\n  createCollapsePresence,\n  createCollapseDelayedPresence,\n} from './components/Collapse';\nexport type { CollapseRuntimeParams } from './components/Collapse';\nexport { Fade, FadeSnappy, FadeRelaxed, createFadePresence } from './components/Fade';\nexport { Scale, ScaleSnappy, ScaleRelaxed } from './components/Scale';\n"],"names":["Collapse","CollapseSnappy","CollapseRelaxed","CollapseDelayed","createCollapsePresence","createCollapseDelayedPresence","Fade","FadeSnappy","FadeRelaxed","createFadePresence","Scale","ScaleSnappy","ScaleRelaxed"],"rangeMappings":";;","mappings":"AAAA,SACEA,QAAQ,EACRC,cAAc,EACdC,eAAe,EACfC,eAAe,EACfC,sBAAsB,EACtBC,6BAA6B,QACxB,wBAAwB;AAE/B,SAASC,IAAI,EAAEC,UAAU,EAAEC,WAAW,EAAEC,kBAAkB,QAAQ,oBAAoB;AACtF,SAASC,KAAK,EAAEC,WAAW,EAAEC,YAAY,QAAQ,qBAAqB"}

package/lib/types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["types.ts"],"sourcesContent":["import type { MotionParam, PresenceMotionFn } from '@fluentui/react-motion';\n\n/**\n * This is a factory function that generates a motion function, which has variant params bound into it.\n * The generated motion function accepts other runtime params that aren't locked into the variant, but supplied at runtime.\n * This separation allows the variant to be defined once and reused with different runtime params which may be orthogonal to the variant params.\n * For example, a variant may define the duration and easing of a transition, which are fixed for all instances of the variant,\n * while the runtime params may give access to the target element, which is different for each instance.\n *\n * The generated motion function is also framework-independent, i.e. non-React.\n * It can be turned into a React component using `createPresenceComponent`.\n */\n// TODO: move to @fluentui/react-motion when stable\nexport type PresenceMotionFnCreator<\n  MotionVariantParams extends Record<string, MotionParam> = {},\n  MotionRuntimeParams extends Record<string, MotionParam> = {},\n> = (variantParams?: MotionVariantParams) => PresenceMotionFn<MotionRuntimeParams>;\n"],"names":[],"rangeMappings":";;;;;;;;;;","mappings":"AAEA;;;;;;;;;CASC,GACD,mDAAmD;AACnD,WAGmF"}
+{"version":3,"sources":["../src/types.ts"],"sourcesContent":["import type { MotionParam, PresenceMotion, PresenceMotionFn } from '@fluentui/react-motion';\n\n/**\n * This is a factory function that generates a motion object from variant params, e.g. duration, easing, etc.\n * The generated object defines a presence motion with `enter` and `exit` transitions.\n * This motion object is declarative, i.e. data without side effects,\n * and it is framework-independent, i.e. non-React.\n * It can be turned into a React component using `createPresenceComponent`.\n */\n// TODO: move to @fluentui/react-motion when stable\nexport type PresenceMotionCreator<MotionVariantParams extends Record<string, MotionParam> = {}> = (\n  variantParams?: MotionVariantParams,\n) => PresenceMotion;\n\n/**\n * This is a factory function that generates a motion function, which has variant params bound into it.\n * The generated motion function accepts other runtime params that aren't locked into the variant, but supplied at runtime.\n * This separation allows the variant to be defined once and reused with different runtime params which may be orthogonal to the variant params.\n * For example, a variant may define the duration and easing of a transition, which are fixed for all instances of the variant,\n * while the runtime params may give access to the target element, which is different for each instance.\n *\n * The generated motion function is also framework-independent, i.e. non-React.\n * It can be turned into a React component using `createPresenceComponent`.\n */\n// TODO: move to @fluentui/react-motion when stable\nexport type PresenceMotionFnCreator<\n  MotionVariantParams extends Record<string, MotionParam> = {},\n  MotionRuntimeParams extends Record<string, MotionParam> = {},\n> = (variantParams?: MotionVariantParams) => PresenceMotionFn<MotionRuntimeParams>;\n"],"names":[],"rangeMappings":";;;;;;;;;;","mappings":"AAcA;;;;;;;;;CASC,GACD,mDAAmD;AACnD,WAGmF"}

package/lib-commonjs/components/Collapse/Collapse.js

@@ -12,106 +12,97 @@ _export(exports, {
     Collapse: function() {
         return Collapse;
     },
-    CollapseExaggerated: function() {
-        return CollapseExaggerated;
+    CollapseDelayed: function() {
+        return CollapseDelayed;
+    },
+    CollapseRelaxed: function() {
+        return CollapseRelaxed;
     },
     CollapseSnappy: function() {
         return CollapseSnappy;
     },
+    createCollapseDelayedPresence: function() {
+        return createCollapseDelayedPresence;
+    },
     createCollapsePresence: function() {
         return createCollapsePresence;
     }
 });
 const _reactmotion = require("@fluentui/react-motion");
-const createCollapsePresence = ({ enterDuration = _reactmotion.motionTokens.durationNormal, enterEasing = _reactmotion.motionTokens.curveEasyEaseMax, exitDuration = enterDuration, exitEasing = enterEasing } = {})=>({ element, animateOpacity = true, orientation = 'vertical' })=>{
-        const fromOpacity = 0;
-        const toOpacity = 1;
-        const fromSize = '0'; // Could be a custom param in the future to start with partially expanded width or height
-        const measuredSize = orientation === 'horizontal' ? element.scrollWidth : element.scrollHeight;
-        const toSize = `${measuredSize}px`;
-        // use generic names for size and overflow, handling vertical or horizontal orientation
-        const sizeName = orientation === 'horizontal' ? 'maxWidth' : 'maxHeight';
-        const overflowName = orientation === 'horizontal' ? 'overflowX' : 'overflowY';
-        // The enter transition is an array of up to 2 motion atoms: size and opacity.
+const _collapseatoms = require("./collapse-atoms");
+const createCollapseDelayedPresence = ({ // enter
+enterSizeDuration = _reactmotion.motionTokens.durationNormal, enterOpacityDuration = enterSizeDuration, enterEasing = _reactmotion.motionTokens.curveEasyEaseMax, enterDelay = 0, // exit: durations and easing default to enter values for symmetry
+exitSizeDuration = enterSizeDuration, exitOpacityDuration = enterOpacityDuration, exitEasing = enterEasing, exitDelay = 0 } = {})=>({ element, animateOpacity = true, orientation = 'vertical' })=>{
+        // ----- ENTER -----
+        // The enter transition is an array of up to 3 motion atoms: size, whitespace and opacity.
         const enterAtoms = [
-            // Expand size (height or width)
-            {
-                keyframes: [
-                    {
-                        [sizeName]: fromSize,
-                        [overflowName]: 'hidden'
-                    },
-                    {
-                        [sizeName]: toSize,
-                        offset: 0.9999,
-                        [overflowName]: 'hidden'
-                    },
-                    {
-                        [sizeName]: 'unset',
-                        [overflowName]: 'unset'
-                    }
-                ],
-                duration: enterDuration,
+            (0, _collapseatoms.sizeEnterAtom)({
+                orientation,
+                duration: enterSizeDuration,
+                easing: enterEasing,
+                element
+            }),
+            (0, _collapseatoms.whitespaceEnterAtom)({
+                orientation,
+                duration: enterSizeDuration,
                 easing: enterEasing
-            }
+            })
         ];
         // Fade in only if animateOpacity is true. Otherwise, leave opacity unaffected.
         if (animateOpacity) {
-            enterAtoms.push({
-                keyframes: [
-                    {
-                        opacity: fromOpacity
-                    },
-                    {
-                        opacity: toOpacity
-                    }
-                ],
-                duration: enterDuration,
+            enterAtoms.push((0, _collapseatoms.opacityEnterAtom)({
+                duration: enterOpacityDuration,
                 easing: enterEasing,
-                fill: 'both'
-            });
+                delay: enterDelay
+            }));
         }
-        // The exit transition is an array of up to 2 motion atoms: opacity and size.
+        // ----- EXIT -----
+        // The exit transition is an array of up to 3 motion atoms: opacity, size and whitespace.
         const exitAtoms = [];
-        // Fade out only if animateOpacity is false. Otherwise, leave opacity unaffected.
+        // Fade out only if animateOpacity is true. Otherwise, leave opacity unaffected.
         if (animateOpacity) {
-            exitAtoms.push({
-                keyframes: [
-                    {
-                        opacity: toOpacity
-                    },
-                    {
-                        opacity: fromOpacity
-                    }
-                ],
-                duration: exitDuration,
+            exitAtoms.push((0, _collapseatoms.opacityExitAtom)({
+                duration: exitOpacityDuration,
                 easing: exitEasing
-            });
+            }));
         }
-        exitAtoms.push({
-            keyframes: [
-                {
-                    [sizeName]: toSize,
-                    [overflowName]: 'hidden'
-                },
-                {
-                    [sizeName]: fromSize,
-                    [overflowName]: 'hidden'
-                }
-            ],
-            duration: exitDuration,
+        exitAtoms.push((0, _collapseatoms.sizeExitAtom)({
+            orientation,
+            duration: exitSizeDuration,
             easing: exitEasing,
-            fill: 'both'
-        });
+            element,
+            delay: exitDelay
+        }));
+        exitAtoms.push((0, _collapseatoms.whitespaceExitAtom)({
+            orientation,
+            duration: exitSizeDuration,
+            easing: exitEasing,
+            delay: exitDelay
+        }));
         return {
             enter: enterAtoms,
             exit: exitAtoms
         };
     };
+const createCollapsePresence = ({ enterDuration = _reactmotion.motionTokens.durationNormal, enterEasing = _reactmotion.motionTokens.curveEasyEaseMax, exitDuration = enterDuration, exitEasing = enterEasing } = {})=>// Implement a regular collapse as a special case of the delayed collapse,
+    // where the delays are zero, and the size and opacity durations are equal.
+    createCollapseDelayedPresence({
+        enterSizeDuration: enterDuration,
+        enterEasing,
+        exitSizeDuration: exitDuration,
+        exitEasing
+    });
 const Collapse = (0, _reactmotion.createPresenceComponent)(createCollapsePresence());
 const CollapseSnappy = (0, _reactmotion.createPresenceComponent)(createCollapsePresence({
     enterDuration: _reactmotion.motionTokens.durationFast
 }));
-const CollapseExaggerated = (0, _reactmotion.createPresenceComponent)(createCollapsePresence({
+const CollapseRelaxed = (0, _reactmotion.createPresenceComponent)(createCollapsePresence({
     enterDuration: _reactmotion.motionTokens.durationSlower
 }));
+const CollapseDelayed = (0, _reactmotion.createPresenceComponent)(createCollapseDelayedPresence({
+    enterSizeDuration: _reactmotion.motionTokens.durationNormal,
+    enterOpacityDuration: _reactmotion.motionTokens.durationSlower,
+    enterDelay: _reactmotion.motionTokens.durationNormal,
+    exitDelay: _reactmotion.motionTokens.durationSlower,
+    enterEasing: _reactmotion.motionTokens.curveEasyEase
+}));

package/lib-commonjs/components/Collapse/Collapse.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Collapse.ts"],"sourcesContent":["import { motionTokens, createPresenceComponent, AtomMotion } from '@fluentui/react-motion';\nimport type { PresenceMotionFnCreator } from '../../types';\n\ntype CollapseOrientation = 'horizontal' | 'vertical';\n\ntype CollapseVariantParams = {\n  /** Time (ms) for the enter transition (expand). Defaults to the `durationNormal` value (200 ms). */\n  enterDuration?: number;\n\n  /** Easing curve for the enter transition (expand). Defaults to the `easeEaseMax` value.  */\n  enterEasing?: string;\n\n  /** Time (ms) for the exit transition (collapse). Defaults to the `enterDuration` param for symmetry. */\n  exitDuration?: number;\n\n  /** Easing curve for the exit transition (collapse). Defaults to the `enterEasing` param for symmetry.  */\n  exitEasing?: string;\n};\n\ntype CollapseRuntimeParams = {\n  /** Whether to animate the opacity. Defaults to `true`. */\n  animateOpacity?: boolean;\n\n  /** The orientation of the size animation. Defaults to `'vertical'` to expand/collapse the height. */\n  orientation?: CollapseOrientation;\n};\n\n/** Define a presence motion for collapse/expand */\nexport const createCollapsePresence: PresenceMotionFnCreator<CollapseVariantParams, CollapseRuntimeParams> =\n  ({\n    enterDuration = motionTokens.durationNormal,\n    enterEasing = motionTokens.curveEasyEaseMax,\n    exitDuration = enterDuration,\n    exitEasing = enterEasing,\n  } = {}) =>\n  ({ element, animateOpacity = true, orientation = 'vertical' }) => {\n    const fromOpacity = 0;\n    const toOpacity = 1;\n    const fromSize = '0'; // Could be a custom param in the future to start with partially expanded width or height\n    const measuredSize = orientation === 'horizontal' ? element.scrollWidth : element.scrollHeight;\n    const toSize = `${measuredSize}px`;\n    // use generic names for size and overflow, handling vertical or horizontal orientation\n    const sizeName = orientation === 'horizontal' ? 'maxWidth' : 'maxHeight';\n    const overflowName = orientation === 'horizontal' ? 'overflowX' : 'overflowY';\n\n    // The enter transition is an array of up to 2 motion atoms: size and opacity.\n    const enterAtoms: AtomMotion[] = [\n      // Expand size (height or width)\n      {\n        keyframes: [\n          {\n            [sizeName]: fromSize,\n            [overflowName]: 'hidden',\n          },\n          { [sizeName]: toSize, offset: 0.9999, [overflowName]: 'hidden' },\n          { [sizeName]: 'unset', [overflowName]: 'unset' },\n        ],\n        duration: enterDuration,\n        easing: enterEasing,\n      },\n    ];\n    // Fade in only if animateOpacity is true. Otherwise, leave opacity unaffected.\n    if (animateOpacity) {\n      enterAtoms.push({\n        keyframes: [{ opacity: fromOpacity }, { opacity: toOpacity }],\n        duration: enterDuration,\n        easing: enterEasing,\n        fill: 'both',\n      });\n    }\n\n    // The exit transition is an array of up to 2 motion atoms: opacity and size.\n    const exitAtoms: AtomMotion[] = [];\n    // Fade out only if animateOpacity is false. Otherwise, leave opacity unaffected.\n    if (animateOpacity) {\n      exitAtoms.push({\n        keyframes: [{ opacity: toOpacity }, { opacity: fromOpacity }],\n        duration: exitDuration,\n        easing: exitEasing,\n      });\n    }\n    exitAtoms.push(\n      // Collapse size (height or width)\n      {\n        keyframes: [\n          { [sizeName]: toSize, [overflowName]: 'hidden' },\n          { [sizeName]: fromSize, [overflowName]: 'hidden' },\n        ],\n        duration: exitDuration,\n        easing: exitEasing,\n        fill: 'both',\n      },\n    );\n\n    return {\n      enter: enterAtoms,\n      exit: exitAtoms,\n    };\n  };\n\n/** A React component that applies collapse/expand transitions to its children. */\nexport const Collapse = createPresenceComponent(createCollapsePresence());\n\nexport const CollapseSnappy = createPresenceComponent(\n  createCollapsePresence({ enterDuration: motionTokens.durationFast }),\n);\n\nexport const CollapseExaggerated = createPresenceComponent(\n  createCollapsePresence({ enterDuration: motionTokens.durationSlower }),\n);\n"],"names":["Collapse","CollapseExaggerated","CollapseSnappy","createCollapsePresence","enterDuration","motionTokens","durationNormal","enterEasing","curveEasyEaseMax","exitDuration","exitEasing","element","animateOpacity","orientation","fromOpacity","toOpacity","fromSize","measuredSize","scrollWidth","scrollHeight","toSize","sizeName","overflowName","enterAtoms","keyframes","offset","duration","easing","push","opacity","fill","exitAtoms","enter","exit","createPresenceComponent","durationFast","durationSlower"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAqGaA,QAAAA;eAAAA;;IAMAC,mBAAAA;eAAAA;;IAJAC,cAAAA;eAAAA;;IA3EAC,sBAAAA;eAAAA;;;6BA5BqD;AA4B3D,MAAMA,yBACX,CAAC,EACCC,gBAAgBC,yBAAAA,CAAaC,cAAc,EAC3CC,cAAcF,yBAAAA,CAAaG,gBAAgB,EAC3CC,eAAeL,aAAa,EAC5BM,aAAaH,WAAW,EACzB,GAAG,CAAC,CAAC,GACN,CAAC,EAAEI,OAAO,EAAEC,iBAAiB,IAAI,EAAEC,cAAc,UAAU,EAAE;QAC3D,MAAMC,cAAc;QACpB,MAAMC,YAAY;QAClB,MAAMC,WAAW,KAAK,yFAAyF;QAC/G,MAAMC,eAAeJ,gBAAgB,eAAeF,QAAQO,WAAW,GAAGP,QAAQQ,YAAY;QAC9F,MAAMC,SAAS,CAAC,EAAEH,aAAa,EAAE,CAAC;QAClC,uFAAuF;QACvF,MAAMI,WAAWR,gBAAgB,eAAe,aAAa;QAC7D,MAAMS,eAAeT,gBAAgB,eAAe,cAAc;QAElE,8EAA8E;QAC9E,MAAMU,aAA2B;YAC/B,gCAAgC;YAChC;gBACEC,WAAW;oBACT;wBACE,CAACH,SAAS,EAAEL;wBACZ,CAACM,aAAa,EAAE;oBAClB;oBACA;wBAAE,CAACD,SAAS,EAAED;wBAAQK,QAAQ;wBAAQ,CAACH,aAAa,EAAE;oBAAS;oBAC/D;wBAAE,CAACD,SAAS,EAAE;wBAAS,CAACC,aAAa,EAAE;oBAAQ;iBAChD;gBACDI,UAAUtB;gBACVuB,QAAQpB;YACV;SACD;QACD,+EAA+E;QAC/E,IAAIK,gBAAgB;YAClBW,WAAWK,IAAI,CAAC;gBACdJ,WAAW;oBAAC;wBAAEK,SAASf;oBAAY;oBAAG;wBAAEe,SAASd;oBAAU;iBAAE;gBAC7DW,UAAUtB;gBACVuB,QAAQpB;gBACRuB,MAAM;YACR;QACF;QAEA,6EAA6E;QAC7E,MAAMC,YAA0B,EAAE;QAClC,iFAAiF;QACjF,IAAInB,gBAAgB;YAClBmB,UAAUH,IAAI,CAAC;gBACbJ,WAAW;oBAAC;wBAAEK,SAASd;oBAAU;oBAAG;wBAAEc,SAASf;oBAAY;iBAAE;gBAC7DY,UAAUjB;gBACVkB,QAAQjB;YACV;QACF;QACAqB,UAAUH,IAAI,CAEZ;YACEJ,WAAW;gBACT;oBAAE,CAACH,SAAS,EAAED;oBAAQ,CAACE,aAAa,EAAE;gBAAS;gBAC/C;oBAAE,CAACD,SAAS,EAAEL;oBAAU,CAACM,aAAa,EAAE;gBAAS;aAClD;YACDI,UAAUjB;YACVkB,QAAQjB;YACRoB,MAAM;QACR;QAGF,OAAO;YACLE,OAAOT;YACPU,MAAMF;QACR;IACF;AAGK,MAAM/B,WAAWkC,IAAAA,oCAAAA,EAAwB/B;AAEzC,MAAMD,iBAAiBgC,IAAAA,oCAAAA,EAC5B/B,uBAAuB;IAAEC,eAAeC,yBAAAA,CAAa8B,YAAY;AAAC;AAG7D,MAAMlC,sBAAsBiC,IAAAA,oCAAAA,EACjC/B,uBAAuB;IAAEC,eAAeC,yBAAAA,CAAa+B,cAAc;AAAC"}
+{"version":3,"sources":["../src/components/Collapse/Collapse.ts"],"sourcesContent":["import { motionTokens, createPresenceComponent, AtomMotion } from '@fluentui/react-motion';\nimport type { PresenceMotionFnCreator } from '../../types';\nimport type { CollapseDelayedVariantParams, CollapseRuntimeParams, CollapseVariantParams } from './collapse-types';\nimport {\n  sizeEnterAtom,\n  whitespaceEnterAtom,\n  opacityEnterAtom,\n  opacityExitAtom,\n  sizeExitAtom,\n  whitespaceExitAtom,\n} from './collapse-atoms';\n\n/** Define a presence motion for collapse/expand that can stagger the size and opacity motions by a given delay. */\nexport const createCollapseDelayedPresence: PresenceMotionFnCreator<\n  CollapseDelayedVariantParams,\n  CollapseRuntimeParams\n> =\n  ({\n    // enter\n    enterSizeDuration = motionTokens.durationNormal,\n    enterOpacityDuration = enterSizeDuration, // in sync with size duration by default\n    enterEasing = motionTokens.curveEasyEaseMax,\n    enterDelay = 0,\n\n    // exit: durations and easing default to enter values for symmetry\n    exitSizeDuration = enterSizeDuration,\n    exitOpacityDuration = enterOpacityDuration,\n    exitEasing = enterEasing,\n    exitDelay = 0,\n  } = {}) =>\n  ({ element, animateOpacity = true, orientation = 'vertical' }) => {\n    // ----- ENTER -----\n    // The enter transition is an array of up to 3 motion atoms: size, whitespace and opacity.\n    const enterAtoms: AtomMotion[] = [\n      sizeEnterAtom({\n        orientation,\n        duration: enterSizeDuration,\n        easing: enterEasing,\n        element,\n      }),\n      whitespaceEnterAtom({\n        orientation,\n        duration: enterSizeDuration,\n        easing: enterEasing,\n      }),\n    ];\n    // Fade in only if animateOpacity is true. Otherwise, leave opacity unaffected.\n    if (animateOpacity) {\n      enterAtoms.push(\n        opacityEnterAtom({\n          duration: enterOpacityDuration,\n          easing: enterEasing,\n          delay: enterDelay,\n        }),\n      );\n    }\n\n    // ----- EXIT -----\n    // The exit transition is an array of up to 3 motion atoms: opacity, size and whitespace.\n    const exitAtoms: AtomMotion[] = [];\n    // Fade out only if animateOpacity is true. Otherwise, leave opacity unaffected.\n    if (animateOpacity) {\n      exitAtoms.push(\n        opacityExitAtom({\n          duration: exitOpacityDuration,\n          easing: exitEasing,\n        }),\n      );\n    }\n    exitAtoms.push(\n      sizeExitAtom({\n        orientation,\n        duration: exitSizeDuration,\n        easing: exitEasing,\n        element,\n        delay: exitDelay,\n      }),\n    );\n    exitAtoms.push(\n      whitespaceExitAtom({\n        orientation,\n        duration: exitSizeDuration,\n        easing: exitEasing,\n        delay: exitDelay,\n      }),\n    );\n\n    return {\n      enter: enterAtoms,\n      exit: exitAtoms,\n    };\n  };\n\n/** Defines a presence motion for collapse/expand. */\nexport const createCollapsePresence: PresenceMotionFnCreator<CollapseVariantParams, CollapseRuntimeParams> = ({\n  enterDuration = motionTokens.durationNormal,\n  enterEasing = motionTokens.curveEasyEaseMax,\n  exitDuration = enterDuration,\n  exitEasing = enterEasing,\n} = {}) =>\n  // Implement a regular collapse as a special case of the delayed collapse,\n  // where the delays are zero, and the size and opacity durations are equal.\n  createCollapseDelayedPresence({\n    enterSizeDuration: enterDuration,\n    enterEasing,\n    exitSizeDuration: exitDuration,\n    exitEasing,\n  });\n\n/** A React component that applies collapse/expand transitions to its children. */\nexport const Collapse = createPresenceComponent(createCollapsePresence());\n\nexport const CollapseSnappy = createPresenceComponent(\n  createCollapsePresence({ enterDuration: motionTokens.durationFast }),\n);\n\nexport const CollapseRelaxed = createPresenceComponent(\n  createCollapsePresence({ enterDuration: motionTokens.durationSlower }),\n);\n\nexport const CollapseDelayed = createPresenceComponent(\n  createCollapseDelayedPresence({\n    enterSizeDuration: motionTokens.durationNormal,\n    enterOpacityDuration: motionTokens.durationSlower,\n    enterDelay: motionTokens.durationNormal,\n    exitDelay: motionTokens.durationSlower,\n    enterEasing: motionTokens.curveEasyEase,\n  }),\n);\n"],"names":["Collapse","CollapseDelayed","CollapseRelaxed","CollapseSnappy","createCollapseDelayedPresence","createCollapsePresence","enterSizeDuration","motionTokens","durationNormal","enterOpacityDuration","enterEasing","curveEasyEaseMax","enterDelay","exitSizeDuration","exitOpacityDuration","exitEasing","exitDelay","element","animateOpacity","orientation","enterAtoms","sizeEnterAtom","duration","easing","whitespaceEnterAtom","push","opacityEnterAtom","delay","exitAtoms","opacityExitAtom","sizeExitAtom","whitespaceExitAtom","enter","exit","enterDuration","exitDuration","createPresenceComponent","durationFast","durationSlower","curveEasyEase"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA8GaA,QAAQ;eAARA;;IAUAC,eAAe;eAAfA;;IAJAC,eAAe;eAAfA;;IAJAC,cAAc;eAAdA;;IAnGAC,6BAA6B;eAA7BA;;IAiFAC,sBAAsB;eAAtBA;;;6BA9FqD;+BAU3D;AAGA,MAAMD,gCAIX,CAAC,EACC,QAAQ;AACRE,oBAAoBC,yBAAY,CAACC,cAAc,EAC/CC,uBAAuBH,iBAAiB,EACxCI,cAAcH,yBAAY,CAACI,gBAAgB,EAC3CC,aAAa,CAAC,EAEd,kEAAkE;AAClEC,mBAAmBP,iBAAiB,EACpCQ,sBAAsBL,oBAAoB,EAC1CM,aAAaL,WAAW,EACxBM,YAAY,CAAC,EACd,GAAG,CAAC,CAAC,GACN,CAAC,EAAEC,OAAO,EAAEC,iBAAiB,IAAI,EAAEC,cAAc,UAAU,EAAE;QAC3D,oBAAoB;QACpB,0FAA0F;QAC1F,MAAMC,aAA2B;YAC/BC,IAAAA,4BAAa,EAAC;gBACZF;gBACAG,UAAUhB;gBACViB,QAAQb;gBACRO;YACF;YACAO,IAAAA,kCAAmB,EAAC;gBAClBL;gBACAG,UAAUhB;gBACViB,QAAQb;YACV;SACD;QACD,+EAA+E;QAC/E,IAAIQ,gBAAgB;YAClBE,WAAWK,IAAI,CACbC,IAAAA,+BAAgB,EAAC;gBACfJ,UAAUb;gBACVc,QAAQb;gBACRiB,OAAOf;YACT;QAEJ;QAEA,mBAAmB;QACnB,yFAAyF;QACzF,MAAMgB,YAA0B,EAAE;QAClC,gFAAgF;QAChF,IAAIV,gBAAgB;YAClBU,UAAUH,IAAI,CACZI,IAAAA,8BAAe,EAAC;gBACdP,UAAUR;gBACVS,QAAQR;YACV;QAEJ;QACAa,UAAUH,IAAI,CACZK,IAAAA,2BAAY,EAAC;YACXX;YACAG,UAAUT;YACVU,QAAQR;YACRE;YACAU,OAAOX;QACT;QAEFY,UAAUH,IAAI,CACZM,IAAAA,iCAAkB,EAAC;YACjBZ;YACAG,UAAUT;YACVU,QAAQR;YACRY,OAAOX;QACT;QAGF,OAAO;YACLgB,OAAOZ;YACPa,MAAML;QACR;IACF;AAGK,MAAMvB,yBAAgG,CAAC,EAC5G6B,gBAAgB3B,yBAAY,CAACC,cAAc,EAC3CE,cAAcH,yBAAY,CAACI,gBAAgB,EAC3CwB,eAAeD,aAAa,EAC5BnB,aAAaL,WAAW,EACzB,GAAG,CAAC,CAAC,GACJ,0EAA0E;IAC1E,2EAA2E;IAC3EN,8BAA8B;QAC5BE,mBAAmB4B;QACnBxB;QACAG,kBAAkBsB;QAClBpB;IACF;AAGK,MAAMf,WAAWoC,IAAAA,oCAAuB,EAAC/B;AAEzC,MAAMF,iBAAiBiC,IAAAA,oCAAuB,EACnD/B,uBAAuB;IAAE6B,eAAe3B,yBAAY,CAAC8B,YAAY;AAAC;AAG7D,MAAMnC,kBAAkBkC,IAAAA,oCAAuB,EACpD/B,uBAAuB;IAAE6B,eAAe3B,yBAAY,CAAC+B,cAAc;AAAC;AAG/D,MAAMrC,kBAAkBmC,IAAAA,oCAAuB,EACpDhC,8BAA8B;IAC5BE,mBAAmBC,yBAAY,CAACC,cAAc;IAC9CC,sBAAsBF,yBAAY,CAAC+B,cAAc;IACjD1B,YAAYL,yBAAY,CAACC,cAAc;IACvCQ,WAAWT,yBAAY,CAAC+B,cAAc;IACtC5B,aAAaH,yBAAY,CAACgC,aAAa;AACzC"}

package/lib-commonjs/components/Collapse/collapse-atoms.js

@@ -0,0 +1,149 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+function _export(target, all) {
+    for(var name in all)Object.defineProperty(target, name, {
+        enumerable: true,
+        get: all[name]
+    });
+}
+_export(exports, {
+    opacityEnterAtom: function() {
+        return opacityEnterAtom;
+    },
+    opacityExitAtom: function() {
+        return opacityExitAtom;
+    },
+    sizeEnterAtom: function() {
+        return sizeEnterAtom;
+    },
+    sizeExitAtom: function() {
+        return sizeExitAtom;
+    },
+    whitespaceEnterAtom: function() {
+        return whitespaceEnterAtom;
+    },
+    whitespaceExitAtom: function() {
+        return whitespaceExitAtom;
+    }
+});
+// ----- SIZE -----
+const sizeValuesForOrientation = (orientation, element)=>{
+    const sizeName = orientation === 'horizontal' ? 'maxWidth' : 'maxHeight';
+    const overflowName = orientation === 'horizontal' ? 'overflowX' : 'overflowY';
+    const measuredSize = orientation === 'horizontal' ? element.scrollWidth : element.scrollHeight;
+    const toSize = `${measuredSize}px`;
+    return {
+        sizeName,
+        overflowName,
+        toSize
+    };
+};
+const sizeEnterAtom = ({ orientation, duration, easing, element, fromSize = '0' })=>{
+    const { sizeName, overflowName, toSize } = sizeValuesForOrientation(orientation, element);
+    return {
+        keyframes: [
+            {
+                [sizeName]: fromSize,
+                [overflowName]: 'hidden'
+            },
+            {
+                [sizeName]: toSize,
+                offset: 0.9999,
+                [overflowName]: 'hidden'
+            },
+            {
+                [sizeName]: 'unset',
+                [overflowName]: 'unset'
+            }
+        ],
+        duration,
+        easing
+    };
+};
+const sizeExitAtom = ({ orientation, duration, easing, element, delay = 0, fromSize = '0' })=>{
+    const { sizeName, overflowName, toSize } = sizeValuesForOrientation(orientation, element);
+    return {
+        keyframes: [
+            {
+                [sizeName]: toSize,
+                [overflowName]: 'hidden'
+            },
+            {
+                [sizeName]: fromSize,
+                [overflowName]: 'hidden'
+            }
+        ],
+        duration,
+        easing,
+        fill: 'both',
+        delay
+    };
+};
+// ----- WHITESPACE -----
+// Whitespace animation currently includes padding, but could be extended to handle margin.
+const whitespaceValuesForOrientation = (orientation)=>{
+    const paddingStart = orientation === 'horizontal' ? 'paddingLeft' : 'paddingTop';
+    const paddingEnd = orientation === 'horizontal' ? 'paddingRight' : 'paddingBottom';
+    return {
+        paddingStart,
+        paddingEnd
+    };
+};
+const whitespaceEnterAtom = ({ orientation, duration, easing })=>{
+    const { paddingStart, paddingEnd } = whitespaceValuesForOrientation(orientation);
+    return {
+        keyframes: [
+            {
+                [paddingStart]: '0',
+                [paddingEnd]: '0',
+                offset: 0
+            }
+        ],
+        duration,
+        easing
+    };
+};
+const whitespaceExitAtom = ({ orientation, duration, easing, delay = 0 })=>{
+    const { paddingStart, paddingEnd } = whitespaceValuesForOrientation(orientation);
+    return {
+        keyframes: [
+            {
+                [paddingStart]: '0',
+                [paddingEnd]: '0',
+                offset: 1
+            }
+        ],
+        duration,
+        easing,
+        fill: 'forwards',
+        delay
+    };
+};
+const opacityEnterAtom = ({ duration, easing, delay = 0, fromOpacity = 0, toOpacity = 1 })=>({
+        keyframes: [
+            {
+                opacity: fromOpacity
+            },
+            {
+                opacity: toOpacity
+            }
+        ],
+        duration,
+        easing,
+        delay,
+        fill: 'both'
+    });
+const opacityExitAtom = ({ duration, easing, fromOpacity = 0, toOpacity = 1 })=>({
+        keyframes: [
+            {
+                opacity: toOpacity
+            },
+            {
+                opacity: fromOpacity
+            }
+        ],
+        duration,
+        easing
+    });

package/lib-commonjs/components/Collapse/collapse-atoms.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Collapse/collapse-atoms.ts"],"sourcesContent":["import { AtomMotion } from '@fluentui/react-motion/src/types';\nimport type { CollapseOrientation } from './collapse-types';\n\n// ----- SIZE -----\n\nconst sizeValuesForOrientation = (orientation: CollapseOrientation, element: Element) => {\n  const sizeName = orientation === 'horizontal' ? 'maxWidth' : 'maxHeight';\n  const overflowName = orientation === 'horizontal' ? 'overflowX' : 'overflowY';\n  const measuredSize = orientation === 'horizontal' ? element.scrollWidth : element.scrollHeight;\n  const toSize = `${measuredSize}px`;\n  return { sizeName, overflowName, toSize };\n};\n\nexport const sizeEnterAtom = ({\n  orientation,\n  duration,\n  easing,\n  element,\n  fromSize = '0',\n}: {\n  orientation: CollapseOrientation;\n  duration: number;\n  easing: string;\n  element: HTMLElement;\n  fromSize?: string;\n}): AtomMotion => {\n  const { sizeName, overflowName, toSize } = sizeValuesForOrientation(orientation, element);\n\n  return {\n    keyframes: [\n      { [sizeName]: fromSize, [overflowName]: 'hidden' },\n      { [sizeName]: toSize, offset: 0.9999, [overflowName]: 'hidden' },\n      { [sizeName]: 'unset', [overflowName]: 'unset' },\n    ],\n    duration,\n    easing,\n  };\n};\n\nexport const sizeExitAtom = ({\n  orientation,\n  duration,\n  easing,\n  element,\n  delay = 0,\n  fromSize = '0',\n}: {\n  orientation: CollapseOrientation;\n  duration: number;\n  easing: string;\n  element: HTMLElement;\n  delay?: number;\n  fromSize?: string;\n}): AtomMotion => {\n  const { sizeName, overflowName, toSize } = sizeValuesForOrientation(orientation, element);\n\n  return {\n    keyframes: [\n      { [sizeName]: toSize, [overflowName]: 'hidden' },\n      { [sizeName]: fromSize, [overflowName]: 'hidden' },\n    ],\n    duration,\n    easing,\n    fill: 'both',\n    delay,\n  };\n};\n\n// ----- WHITESPACE -----\n\n// Whitespace animation currently includes padding, but could be extended to handle margin.\nconst whitespaceValuesForOrientation = (orientation: CollapseOrientation) => {\n  const paddingStart = orientation === 'horizontal' ? 'paddingLeft' : 'paddingTop';\n  const paddingEnd = orientation === 'horizontal' ? 'paddingRight' : 'paddingBottom';\n  return { paddingStart, paddingEnd };\n};\n\n// Because a height of zero does not eliminate padding,\n// we will create keyframes to animate it to zero.\n// TODO: consider collapsing margin, perhaps as an option.\nexport const whitespaceEnterAtom = ({\n  orientation,\n  duration,\n  easing,\n}: {\n  orientation: CollapseOrientation;\n  duration: number;\n  easing: string;\n}): AtomMotion => {\n  const { paddingStart, paddingEnd } = whitespaceValuesForOrientation(orientation);\n  return {\n    keyframes: [{ [paddingStart]: '0', [paddingEnd]: '0', offset: 0 }],\n    duration,\n    easing,\n  };\n};\n\nexport const whitespaceExitAtom = ({\n  orientation,\n  duration,\n  easing,\n  delay = 0,\n}: {\n  orientation: CollapseOrientation;\n  duration: number;\n  easing: string;\n  delay?: number;\n}): AtomMotion => {\n  const { paddingStart, paddingEnd } = whitespaceValuesForOrientation(orientation);\n  return {\n    keyframes: [{ [paddingStart]: '0', [paddingEnd]: '0', offset: 1 }],\n    duration,\n    easing,\n    fill: 'forwards',\n    delay,\n  };\n};\n\n// ----- OPACITY -----\n\nexport const opacityEnterAtom = ({\n  duration,\n  easing,\n  delay = 0,\n  fromOpacity = 0,\n  toOpacity = 1,\n}: {\n  duration: number;\n  easing: string;\n  delay?: number;\n  fromOpacity?: number;\n  toOpacity?: number;\n}): AtomMotion => ({\n  keyframes: [{ opacity: fromOpacity }, { opacity: toOpacity }],\n  duration,\n  easing,\n  delay,\n  fill: 'both',\n});\n\nexport const opacityExitAtom = ({\n  duration,\n  easing,\n  fromOpacity = 0,\n  toOpacity = 1,\n}: {\n  duration: number;\n  easing: string;\n  fromOpacity?: number;\n  toOpacity?: number;\n}): AtomMotion => ({\n  keyframes: [{ opacity: toOpacity }, { opacity: fromOpacity }],\n  duration,\n  easing,\n});\n"],"names":["opacityEnterAtom","opacityExitAtom","sizeEnterAtom","sizeExitAtom","whitespaceEnterAtom","whitespaceExitAtom","sizeValuesForOrientation","orientation","element","sizeName","overflowName","measuredSize","scrollWidth","scrollHeight","toSize","duration","easing","fromSize","keyframes","offset","delay","fill","whitespaceValuesForOrientation","paddingStart","paddingEnd","fromOpacity","toOpacity","opacity"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAwHaA,gBAAgB;eAAhBA;;IAoBAC,eAAe;eAAfA;;IA/HAC,aAAa;eAAbA;;IA0BAC,YAAY;eAAZA;;IAyCAC,mBAAmB;eAAnBA;;IAiBAC,kBAAkB;eAAlBA;;;AA9Fb,mBAAmB;AAEnB,MAAMC,2BAA2B,CAACC,aAAkCC;IAClE,MAAMC,WAAWF,gBAAgB,eAAe,aAAa;IAC7D,MAAMG,eAAeH,gBAAgB,eAAe,cAAc;IAClE,MAAMI,eAAeJ,gBAAgB,eAAeC,QAAQI,WAAW,GAAGJ,QAAQK,YAAY;IAC9F,MAAMC,SAAS,CAAC,EAAEH,aAAa,EAAE,CAAC;IAClC,OAAO;QAAEF;QAAUC;QAAcI;IAAO;AAC1C;AAEO,MAAMZ,gBAAgB,CAAC,EAC5BK,WAAW,EACXQ,QAAQ,EACRC,MAAM,EACNR,OAAO,EACPS,WAAW,GAAG,EAOf;IACC,MAAM,EAAER,QAAQ,EAAEC,YAAY,EAAEI,MAAM,EAAE,GAAGR,yBAAyBC,aAAaC;IAEjF,OAAO;QACLU,WAAW;YACT;gBAAE,CAACT,SAAS,EAAEQ;gBAAU,CAACP,aAAa,EAAE;YAAS;YACjD;gBAAE,CAACD,SAAS,EAAEK;gBAAQK,QAAQ;gBAAQ,CAACT,aAAa,EAAE;YAAS;YAC/D;gBAAE,CAACD,SAAS,EAAE;gBAAS,CAACC,aAAa,EAAE;YAAQ;SAChD;QACDK;QACAC;IACF;AACF;AAEO,MAAMb,eAAe,CAAC,EAC3BI,WAAW,EACXQ,QAAQ,EACRC,MAAM,EACNR,OAAO,EACPY,QAAQ,CAAC,EACTH,WAAW,GAAG,EAQf;IACC,MAAM,EAAER,QAAQ,EAAEC,YAAY,EAAEI,MAAM,EAAE,GAAGR,yBAAyBC,aAAaC;IAEjF,OAAO;QACLU,WAAW;YACT;gBAAE,CAACT,SAAS,EAAEK;gBAAQ,CAACJ,aAAa,EAAE;YAAS;YAC/C;gBAAE,CAACD,SAAS,EAAEQ;gBAAU,CAACP,aAAa,EAAE;YAAS;SAClD;QACDK;QACAC;QACAK,MAAM;QACND;IACF;AACF;AAEA,yBAAyB;AAEzB,2FAA2F;AAC3F,MAAME,iCAAiC,CAACf;IACtC,MAAMgB,eAAehB,gBAAgB,eAAe,gBAAgB;IACpE,MAAMiB,aAAajB,gBAAgB,eAAe,iBAAiB;IACnE,OAAO;QAAEgB;QAAcC;IAAW;AACpC;AAKO,MAAMpB,sBAAsB,CAAC,EAClCG,WAAW,EACXQ,QAAQ,EACRC,MAAM,EAKP;IACC,MAAM,EAAEO,YAAY,EAAEC,UAAU,EAAE,GAAGF,+BAA+Bf;IACpE,OAAO;QACLW,WAAW;YAAC;gBAAE,CAACK,aAAa,EAAE;gBAAK,CAACC,WAAW,EAAE;gBAAKL,QAAQ;YAAE;SAAE;QAClEJ;QACAC;IACF;AACF;AAEO,MAAMX,qBAAqB,CAAC,EACjCE,WAAW,EACXQ,QAAQ,EACRC,MAAM,EACNI,QAAQ,CAAC,EAMV;IACC,MAAM,EAAEG,YAAY,EAAEC,UAAU,EAAE,GAAGF,+BAA+Bf;IACpE,OAAO;QACLW,WAAW;YAAC;gBAAE,CAACK,aAAa,EAAE;gBAAK,CAACC,WAAW,EAAE;gBAAKL,QAAQ;YAAE;SAAE;QAClEJ;QACAC;QACAK,MAAM;QACND;IACF;AACF;AAIO,MAAMpB,mBAAmB,CAAC,EAC/Be,QAAQ,EACRC,MAAM,EACNI,QAAQ,CAAC,EACTK,cAAc,CAAC,EACfC,YAAY,CAAC,EAOd,GAAkB,CAAA;QACjBR,WAAW;YAAC;gBAAES,SAASF;YAAY;YAAG;gBAAEE,SAASD;YAAU;SAAE;QAC7DX;QACAC;QACAI;QACAC,MAAM;IACR,CAAA;AAEO,MAAMpB,kBAAkB,CAAC,EAC9Bc,QAAQ,EACRC,MAAM,EACNS,cAAc,CAAC,EACfC,YAAY,CAAC,EAMd,GAAkB,CAAA;QACjBR,WAAW;YAAC;gBAAES,SAASD;YAAU;YAAG;gBAAEC,SAASF;YAAY;SAAE;QAC7DV;QACAC;IACF,CAAA"}

package/lib-commonjs/components/Collapse/collapse-types.js

@@ -0,0 +1,4 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

package/lib-commonjs/components/Collapse/collapse-types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"rangeMappings":"","mappings":""}

package/lib-commonjs/components/Collapse/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Collapse';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
+{"version":3,"sources":["../src/components/Collapse/index.ts"],"sourcesContent":["export * from './Collapse';\nexport type { CollapseRuntimeParams } from './collapse-types';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}

package/lib-commonjs/components/Fade/Fade.js

@@ -12,50 +12,47 @@ _export(exports, {
     Fade: function() {
         return Fade;
     },
-    FadeExaggerated: function() {
-        return FadeExaggerated;
+    FadeRelaxed: function() {
+        return FadeRelaxed;
     },
     FadeSnappy: function() {
         return FadeSnappy;
-    }
-});
-const _reactmotion = require("@fluentui/react-motion");
-const duration = _reactmotion.motionTokens.durationNormal;
-const easing = _reactmotion.motionTokens.curveEasyEase;
-/** Define a presence motion for fade in/out  */ const fadeMotion = {
-    enter: {
-        duration,
-        easing,
-        keyframes: [
-            {
-                opacity: 0
-            },
-            {
-                opacity: 1
-            }
-        ]
     },
-    exit: {
-        duration,
-        easing,
-        keyframes: [
-            {
-                opacity: 1
-            },
-            {
-                opacity: 0
-            }
-        ]
-    }
-};
-const Fade = (0, _reactmotion.createPresenceComponent)(fadeMotion);
-const FadeSnappy = (0, _reactmotion.createPresenceComponentVariant)(Fade, {
-    all: {
-        duration: _reactmotion.motionTokens.durationFast
-    }
-});
-const FadeExaggerated = (0, _reactmotion.createPresenceComponentVariant)(Fade, {
-    all: {
-        duration: _reactmotion.motionTokens.durationGentle
+    createFadePresence: function() {
+        return createFadePresence;
     }
 });
+const _reactmotion = require("@fluentui/react-motion");
+const createFadePresence = ({ enterDuration = _reactmotion.motionTokens.durationNormal, enterEasing = _reactmotion.motionTokens.curveEasyEase, exitDuration = enterDuration, exitEasing = enterEasing } = {})=>({
+        enter: {
+            duration: enterDuration,
+            easing: enterEasing,
+            keyframes: [
+                {
+                    opacity: 0
+                },
+                {
+                    opacity: 1
+                }
+            ]
+        },
+        exit: {
+            duration: exitDuration,
+            easing: exitEasing,
+            keyframes: [
+                {
+                    opacity: 1
+                },
+                {
+                    opacity: 0
+                }
+            ]
+        }
+    });
+const Fade = (0, _reactmotion.createPresenceComponent)(createFadePresence());
+const FadeSnappy = (0, _reactmotion.createPresenceComponent)(createFadePresence({
+    enterDuration: _reactmotion.motionTokens.durationFast
+}));
+const FadeRelaxed = (0, _reactmotion.createPresenceComponent)(createFadePresence({
+    enterDuration: _reactmotion.motionTokens.durationGentle
+}));

package/lib-commonjs/components/Fade/Fade.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Fade.ts"],"sourcesContent":["import {\n  motionTokens,\n  PresenceMotion,\n  createPresenceComponent,\n  createPresenceComponentVariant,\n} from '@fluentui/react-motion';\n\nconst duration = motionTokens.durationNormal;\nconst easing = motionTokens.curveEasyEase;\n\n/** Define a presence motion for fade in/out  */\nconst fadeMotion: PresenceMotion = {\n  enter: { duration, easing, keyframes: [{ opacity: 0 }, { opacity: 1 }] },\n  exit: { duration, easing, keyframes: [{ opacity: 1 }, { opacity: 0 }] },\n};\n\n/** A React component that applies fade in/out transitions to its children. */\nexport const Fade = createPresenceComponent(fadeMotion);\n\nexport const FadeSnappy = createPresenceComponentVariant(Fade, { all: { duration: motionTokens.durationFast } });\n\nexport const FadeExaggerated = createPresenceComponentVariant(Fade, { all: { duration: motionTokens.durationGentle } });\n"],"names":["Fade","FadeExaggerated","FadeSnappy","duration","motionTokens","durationNormal","easing","curveEasyEase","fadeMotion","enter","keyframes","opacity","exit","createPresenceComponent","createPresenceComponentVariant","all","durationFast","durationGentle"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAiBaA,IAAAA;eAAAA;;IAIAC,eAAAA;eAAAA;;IAFAC,UAAAA;eAAAA;;;6BAdN;AAEP,MAAMC,WAAWC,yBAAAA,CAAaC,cAAc;AAC5C,MAAMC,SAASF,yBAAAA,CAAaG,aAAa;AAEzC,8CAA8C,GAC9C,MAAMC,aAA6B;IACjCC,OAAO;QAAEN;QAAUG;QAAQI,WAAW;YAAC;gBAAEC,SAAS;YAAE;YAAG;gBAAEA,SAAS;YAAE;SAAE;IAAC;IACvEC,MAAM;QAAET;QAAUG;QAAQI,WAAW;YAAC;gBAAEC,SAAS;YAAE;YAAG;gBAAEA,SAAS;YAAE;SAAE;IAAC;AACxE;AAGO,MAAMX,OAAOa,IAAAA,oCAAAA,EAAwBL;AAErC,MAAMN,aAAaY,IAAAA,2CAAAA,EAA+Bd,MAAM;IAAEe,KAAK;QAAEZ,UAAUC,yBAAAA,CAAaY,YAAY;IAAC;AAAE;AAEvG,MAAMf,kBAAkBa,IAAAA,2CAAAA,EAA+Bd,MAAM;IAAEe,KAAK;QAAEZ,UAAUC,yBAAAA,CAAaa,cAAc;IAAC;AAAE"}
+{"version":3,"sources":["../src/components/Fade/Fade.ts"],"sourcesContent":["import { motionTokens, createPresenceComponent } from '@fluentui/react-motion';\nimport type { PresenceMotionCreator } from '../../types';\n\ntype FadeVariantParams = {\n  /** Time (ms) for the enter transition (fade-in). Defaults to the `durationNormal` value (200 ms). */\n  enterDuration?: number;\n\n  /** Easing curve for the enter transition (fade-in). Defaults to the `easeEase` value.  */\n  enterEasing?: string;\n\n  /** Time (ms) for the exit transition (fade-out). Defaults to the `enterDuration` param for symmetry. */\n  exitDuration?: number;\n\n  /** Easing curve for the exit transition (fade-out). Defaults to the `enterEasing` param for symmetry.  */\n  exitEasing?: string;\n};\n\n/** Define a presence motion for fade in/out  */\nexport const createFadePresence: PresenceMotionCreator<FadeVariantParams> = ({\n  enterDuration = motionTokens.durationNormal,\n  enterEasing = motionTokens.curveEasyEase,\n  exitDuration = enterDuration,\n  exitEasing = enterEasing,\n} = {}) => ({\n  enter: { duration: enterDuration, easing: enterEasing, keyframes: [{ opacity: 0 }, { opacity: 1 }] },\n  exit: { duration: exitDuration, easing: exitEasing, keyframes: [{ opacity: 1 }, { opacity: 0 }] },\n});\n\n/** A React component that applies fade in/out transitions to its children. */\nexport const Fade = createPresenceComponent(createFadePresence());\n\nexport const FadeSnappy = createPresenceComponent(createFadePresence({ enterDuration: motionTokens.durationFast }));\n\nexport const FadeRelaxed = createPresenceComponent(createFadePresence({ enterDuration: motionTokens.durationGentle }));\n"],"names":["Fade","FadeRelaxed","FadeSnappy","createFadePresence","enterDuration","motionTokens","durationNormal","enterEasing","curveEasyEase","exitDuration","exitEasing","enter","duration","easing","keyframes","opacity","exit","createPresenceComponent","durationFast","durationGentle"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA6BaA,IAAI;eAAJA;;IAIAC,WAAW;eAAXA;;IAFAC,UAAU;eAAVA;;IAbAC,kBAAkB;eAAlBA;;;6BAlByC;AAkB/C,MAAMA,qBAA+D,CAAC,EAC3EC,gBAAgBC,yBAAY,CAACC,cAAc,EAC3CC,cAAcF,yBAAY,CAACG,aAAa,EACxCC,eAAeL,aAAa,EAC5BM,aAAaH,WAAW,EACzB,GAAG,CAAC,CAAC,GAAM,CAAA;QACVI,OAAO;YAAEC,UAAUR;YAAeS,QAAQN;YAAaO,WAAW;gBAAC;oBAAEC,SAAS;gBAAE;gBAAG;oBAAEA,SAAS;gBAAE;aAAE;QAAC;QACnGC,MAAM;YAAEJ,UAAUH;YAAcI,QAAQH;YAAYI,WAAW;gBAAC;oBAAEC,SAAS;gBAAE;gBAAG;oBAAEA,SAAS;gBAAE;aAAE;QAAC;IAClG,CAAA;AAGO,MAAMf,OAAOiB,IAAAA,oCAAuB,EAACd;AAErC,MAAMD,aAAae,IAAAA,oCAAuB,EAACd,mBAAmB;IAAEC,eAAeC,yBAAY,CAACa,YAAY;AAAC;AAEzG,MAAMjB,cAAcgB,IAAAA,oCAAuB,EAACd,mBAAmB;IAAEC,eAAeC,yBAAY,CAACc,cAAc;AAAC"}

package/lib-commonjs/components/Fade/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Fade';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
+{"version":3,"sources":["../src/components/Fade/index.ts"],"sourcesContent":["export * from './Fade';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}

package/lib-commonjs/components/Scale/Scale.js

@@ -12,8 +12,8 @@ _export(exports, {
     Scale: function() {
         return Scale;
     },
-    ScaleExaggerated: function() {
-        return ScaleExaggerated;
+    ScaleRelaxed: function() {
+        return ScaleRelaxed;
     },
     ScaleSnappy: function() {
         return ScaleSnappy;
@@ -71,7 +71,7 @@ const ScaleSnappy = (0, _reactmotion.createPresenceComponentVariant)(Scale, {
         easing: _reactmotion.motionTokens.curveAccelerateMax
     }
 });
-const ScaleExaggerated = (0, _reactmotion.createPresenceComponentVariant)(Scale, {
+const ScaleRelaxed = (0, _reactmotion.createPresenceComponentVariant)(Scale, {
     enter: {
         duration: _reactmotion.motionTokens.durationSlow,
         easing: _reactmotion.motionTokens.curveDecelerateMax

package/lib-commonjs/components/Scale/Scale.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Scale.ts"],"sourcesContent":["import {\n  motionTokens,\n  PresenceMotionFn,\n  createPresenceComponent,\n  createPresenceComponentVariant,\n} from '@fluentui/react-motion';\n\n/** Define a presence motion for scale in/out */\nconst scaleMotion: PresenceMotionFn<{ animateOpacity?: boolean }> = ({ animateOpacity = true }) => {\n  const fromOpacity = animateOpacity ? 0 : 1;\n  const toOpacity = 1;\n  const fromScale = 0.9; // Could be a custom param in the future\n  const toScale = 1;\n\n  const enterKeyframes = [\n    { opacity: fromOpacity, transform: `scale3d(${fromScale}, ${fromScale}, 1)`, visibility: 'visible' },\n    { opacity: toOpacity, transform: `scale3d(${toScale}, ${toScale}, 1)` },\n  ];\n\n  const exitKeyframes = [\n    { opacity: toOpacity, transform: `scale3d(${toScale}, ${toScale}, 1)` },\n    { opacity: fromOpacity, transform: `scale3d(${fromScale}, ${fromScale}, 1)`, visibility: 'hidden' },\n  ];\n\n  return {\n    enter: {\n      duration: motionTokens.durationGentle,\n      easing: motionTokens.curveDecelerateMax,\n      keyframes: enterKeyframes,\n    },\n    exit: { duration: motionTokens.durationNormal, easing: motionTokens.curveAccelerateMax, keyframes: exitKeyframes },\n  };\n};\n\n/** A React component that applies scale in/out transitions to its children. */\nexport const Scale = createPresenceComponent(scaleMotion);\n\nexport const ScaleSnappy = createPresenceComponentVariant(Scale, {\n  enter: { duration: motionTokens.durationNormal, easing: motionTokens.curveDecelerateMax },\n  exit: { duration: motionTokens.durationFast, easing: motionTokens.curveAccelerateMax },\n});\n\nexport const ScaleExaggerated = createPresenceComponentVariant(Scale, {\n  enter: { duration: motionTokens.durationSlow, easing: motionTokens.curveDecelerateMax },\n  exit: { duration: motionTokens.durationGentle, easing: motionTokens.curveAccelerateMax },\n});\n"],"names":["Scale","ScaleExaggerated","ScaleSnappy","scaleMotion","animateOpacity","fromOpacity","toOpacity","fromScale","toScale","enterKeyframes","opacity","transform","visibility","exitKeyframes","enter","duration","motionTokens","durationGentle","easing","curveDecelerateMax","keyframes","exit","durationNormal","curveAccelerateMax","createPresenceComponent","createPresenceComponentVariant","durationFast","durationSlow"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAmCaA,KAAAA;eAAAA;;IAOAC,gBAAAA;eAAAA;;IALAC,WAAAA;eAAAA;;;6BAhCN;AAEP,8CAA8C,GAC9C,MAAMC,cAA8D,CAAC,EAAEC,iBAAiB,IAAI,EAAE;IAC5F,MAAMC,cAAcD,iBAAiB,IAAI;IACzC,MAAME,YAAY;IAClB,MAAMC,YAAY,KAAK,wCAAwC;IAC/D,MAAMC,UAAU;IAEhB,MAAMC,iBAAiB;QACrB;YAAEC,SAASL;YAAaM,WAAW,CAAC,QAAQ,EAAEJ,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;YAAEK,YAAY;QAAU;QACnG;YAAEF,SAASJ;YAAWK,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;QAAC;KACvE;IAED,MAAMK,gBAAgB;QACpB;YAAEH,SAASJ;YAAWK,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;QAAC;QACtE;YAAEE,SAASL;YAAaM,WAAW,CAAC,QAAQ,EAAEJ,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;YAAEK,YAAY;QAAS;KACnG;IAED,OAAO;QACLE,OAAO;YACLC,UAAUC,yBAAAA,CAAaC,cAAc;YACrCC,QAAQF,yBAAAA,CAAaG,kBAAkB;YACvCC,WAAWX;QACb;QACAY,MAAM;YAAEN,UAAUC,yBAAAA,CAAaM,cAAc;YAAEJ,QAAQF,yBAAAA,CAAaO,kBAAkB;YAAEH,WAAWP;QAAc;IACnH;AACF;AAGO,MAAMb,QAAQwB,IAAAA,oCAAAA,EAAwBrB;AAEtC,MAAMD,cAAcuB,IAAAA,2CAAAA,EAA+BzB,OAAO;IAC/Dc,OAAO;QAAEC,UAAUC,yBAAAA,CAAaM,cAAc;QAAEJ,QAAQF,yBAAAA,CAAaG,kBAAkB;IAAC;IACxFE,MAAM;QAAEN,UAAUC,yBAAAA,CAAaU,YAAY;QAAER,QAAQF,yBAAAA,CAAaO,kBAAkB;IAAC;AACvF;AAEO,MAAMtB,mBAAmBwB,IAAAA,2CAAAA,EAA+BzB,OAAO;IACpEc,OAAO;QAAEC,UAAUC,yBAAAA,CAAaW,YAAY;QAAET,QAAQF,yBAAAA,CAAaG,kBAAkB;IAAC;IACtFE,MAAM;QAAEN,UAAUC,yBAAAA,CAAaC,cAAc;QAAEC,QAAQF,yBAAAA,CAAaO,kBAAkB;IAAC;AACzF"}
+{"version":3,"sources":["../src/components/Scale/Scale.ts"],"sourcesContent":["import {\n  motionTokens,\n  PresenceMotionFn,\n  createPresenceComponent,\n  createPresenceComponentVariant,\n} from '@fluentui/react-motion';\n\n/** Define a presence motion for scale in/out */\nconst scaleMotion: PresenceMotionFn<{ animateOpacity?: boolean }> = ({ animateOpacity = true }) => {\n  const fromOpacity = animateOpacity ? 0 : 1;\n  const toOpacity = 1;\n  const fromScale = 0.9; // Could be a custom param in the future\n  const toScale = 1;\n\n  const enterKeyframes = [\n    { opacity: fromOpacity, transform: `scale3d(${fromScale}, ${fromScale}, 1)`, visibility: 'visible' },\n    { opacity: toOpacity, transform: `scale3d(${toScale}, ${toScale}, 1)` },\n  ];\n\n  const exitKeyframes = [\n    { opacity: toOpacity, transform: `scale3d(${toScale}, ${toScale}, 1)` },\n    { opacity: fromOpacity, transform: `scale3d(${fromScale}, ${fromScale}, 1)`, visibility: 'hidden' },\n  ];\n\n  return {\n    enter: {\n      duration: motionTokens.durationGentle,\n      easing: motionTokens.curveDecelerateMax,\n      keyframes: enterKeyframes,\n    },\n    exit: { duration: motionTokens.durationNormal, easing: motionTokens.curveAccelerateMax, keyframes: exitKeyframes },\n  };\n};\n\n/** A React component that applies scale in/out transitions to its children. */\nexport const Scale = createPresenceComponent(scaleMotion);\n\nexport const ScaleSnappy = createPresenceComponentVariant(Scale, {\n  enter: { duration: motionTokens.durationNormal, easing: motionTokens.curveDecelerateMax },\n  exit: { duration: motionTokens.durationFast, easing: motionTokens.curveAccelerateMax },\n});\n\nexport const ScaleRelaxed = createPresenceComponentVariant(Scale, {\n  enter: { duration: motionTokens.durationSlow, easing: motionTokens.curveDecelerateMax },\n  exit: { duration: motionTokens.durationGentle, easing: motionTokens.curveAccelerateMax },\n});\n"],"names":["Scale","ScaleRelaxed","ScaleSnappy","scaleMotion","animateOpacity","fromOpacity","toOpacity","fromScale","toScale","enterKeyframes","opacity","transform","visibility","exitKeyframes","enter","duration","motionTokens","durationGentle","easing","curveDecelerateMax","keyframes","exit","durationNormal","curveAccelerateMax","createPresenceComponent","createPresenceComponentVariant","durationFast","durationSlow"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAmCaA,KAAK;eAALA;;IAOAC,YAAY;eAAZA;;IALAC,WAAW;eAAXA;;;6BAhCN;AAEP,8CAA8C,GAC9C,MAAMC,cAA8D,CAAC,EAAEC,iBAAiB,IAAI,EAAE;IAC5F,MAAMC,cAAcD,iBAAiB,IAAI;IACzC,MAAME,YAAY;IAClB,MAAMC,YAAY,KAAK,wCAAwC;IAC/D,MAAMC,UAAU;IAEhB,MAAMC,iBAAiB;QACrB;YAAEC,SAASL;YAAaM,WAAW,CAAC,QAAQ,EAAEJ,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;YAAEK,YAAY;QAAU;QACnG;YAAEF,SAASJ;YAAWK,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;QAAC;KACvE;IAED,MAAMK,gBAAgB;QACpB;YAAEH,SAASJ;YAAWK,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;QAAC;QACtE;YAAEE,SAASL;YAAaM,WAAW,CAAC,QAAQ,EAAEJ,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;YAAEK,YAAY;QAAS;KACnG;IAED,OAAO;QACLE,OAAO;YACLC,UAAUC,yBAAY,CAACC,cAAc;YACrCC,QAAQF,yBAAY,CAACG,kBAAkB;YACvCC,WAAWX;QACb;QACAY,MAAM;YAAEN,UAAUC,yBAAY,CAACM,cAAc;YAAEJ,QAAQF,yBAAY,CAACO,kBAAkB;YAAEH,WAAWP;QAAc;IACnH;AACF;AAGO,MAAMb,QAAQwB,IAAAA,oCAAuB,EAACrB;AAEtC,MAAMD,cAAcuB,IAAAA,2CAA8B,EAACzB,OAAO;IAC/Dc,OAAO;QAAEC,UAAUC,yBAAY,CAACM,cAAc;QAAEJ,QAAQF,yBAAY,CAACG,kBAAkB;IAAC;IACxFE,MAAM;QAAEN,UAAUC,yBAAY,CAACU,YAAY;QAAER,QAAQF,yBAAY,CAACO,kBAAkB;IAAC;AACvF;AAEO,MAAMtB,eAAewB,IAAAA,2CAA8B,EAACzB,OAAO;IAChEc,OAAO;QAAEC,UAAUC,yBAAY,CAACW,YAAY;QAAET,QAAQF,yBAAY,CAACG,kBAAkB;IAAC;IACtFE,MAAM;QAAEN,UAAUC,yBAAY,CAACC,cAAc;QAAEC,QAAQF,yBAAY,CAACO,kBAAkB;IAAC;AACzF"}

package/lib-commonjs/components/Scale/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export * from './Scale';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}
+{"version":3,"sources":["../src/components/Scale/index.ts"],"sourcesContent":["export * from './Scale';\n"],"names":[],"rangeMappings":";;;;;","mappings":";;;;;uBAAc"}

package/lib-commonjs/index.js

@@ -12,8 +12,11 @@ _export(exports, {
     Collapse: function() {
         return _Collapse.Collapse;
     },
-    CollapseExaggerated: function() {
-        return _Collapse.CollapseExaggerated;
+    CollapseDelayed: function() {
+        return _Collapse.CollapseDelayed;
+    },
+    CollapseRelaxed: function() {
+        return _Collapse.CollapseRelaxed;
     },
     CollapseSnappy: function() {
         return _Collapse.CollapseSnappy;
@@ -21,8 +24,8 @@ _export(exports, {
     Fade: function() {
         return _Fade.Fade;
     },
-    FadeExaggerated: function() {
-        return _Fade.FadeExaggerated;
+    FadeRelaxed: function() {
+        return _Fade.FadeRelaxed;
     },
     FadeSnappy: function() {
         return _Fade.FadeSnappy;
@@ -30,14 +33,20 @@ _export(exports, {
     Scale: function() {
         return _Scale.Scale;
     },
-    ScaleExaggerated: function() {
-        return _Scale.ScaleExaggerated;
+    ScaleRelaxed: function() {
+        return _Scale.ScaleRelaxed;
     },
     ScaleSnappy: function() {
         return _Scale.ScaleSnappy;
     },
+    createCollapseDelayedPresence: function() {
+        return _Collapse.createCollapseDelayedPresence;
+    },
     createCollapsePresence: function() {
         return _Collapse.createCollapsePresence;
+    },
+    createFadePresence: function() {
+        return _Fade.createFadePresence;
     }
 });
 const _Collapse = require("./components/Collapse");

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"sourcesContent":["export { Collapse, CollapseSnappy, CollapseExaggerated, createCollapsePresence } from './components/Collapse';\nexport { Fade, FadeSnappy, FadeExaggerated } from './components/Fade';\nexport { Scale, ScaleSnappy, ScaleExaggerated } from './components/Scale';\n"],"names":["Collapse","CollapseExaggerated","CollapseSnappy","Fade","FadeExaggerated","FadeSnappy","Scale","ScaleExaggerated","ScaleSnappy","createCollapsePresence"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,QAAQ;eAARA,kBAAQ;;IAAkBC,mBAAmB;eAAnBA,6BAAmB;;IAAnCC,cAAc;eAAdA,wBAAc;;IACxBC,IAAI;eAAJA,UAAI;;IAAcC,eAAe;eAAfA,qBAAe;;IAA3BC,UAAU;eAAVA,gBAAU;;IAChBC,KAAK;eAALA,YAAK;;IAAeC,gBAAgB;eAAhBA,uBAAgB;;IAA7BC,WAAW;eAAXA,kBAAW;;IAF6BC,sBAAsB;eAAtBA,gCAAsB;;;0BAAQ;sBACpC;uBACG"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Collapse,\n  CollapseSnappy,\n  CollapseRelaxed,\n  CollapseDelayed,\n  createCollapsePresence,\n  createCollapseDelayedPresence,\n} from './components/Collapse';\nexport type { CollapseRuntimeParams } from './components/Collapse';\nexport { Fade, FadeSnappy, FadeRelaxed, createFadePresence } from './components/Fade';\nexport { Scale, ScaleSnappy, ScaleRelaxed } from './components/Scale';\n"],"names":["Collapse","CollapseDelayed","CollapseRelaxed","CollapseSnappy","Fade","FadeRelaxed","FadeSnappy","Scale","ScaleRelaxed","ScaleSnappy","createCollapseDelayedPresence","createCollapsePresence","createFadePresence"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IACEA,QAAQ;eAARA,kBAAQ;;IAGRC,eAAe;eAAfA,yBAAe;;IADfC,eAAe;eAAfA,yBAAe;;IADfC,cAAc;eAAdA,wBAAc;;IAOPC,IAAI;eAAJA,UAAI;;IAAcC,WAAW;eAAXA,iBAAW;;IAAvBC,UAAU;eAAVA,gBAAU;;IAChBC,KAAK;eAALA,YAAK;;IAAeC,YAAY;eAAZA,mBAAY;;IAAzBC,WAAW;eAAXA,kBAAW;;IAJzBC,6BAA6B;eAA7BA,uCAA6B;;IAD7BC,sBAAsB;eAAtBA,gCAAsB;;IAIgBC,kBAAkB;eAAlBA,wBAAkB;;;0BAFnD;sBAE2D;uBACjB"}