@fluentui/react-motion-components-preview 0.13.0 → 0.14.0

package/lib-commonjs/choreography/Stagger/utils/getStaggerChildMapping.js

@@ -0,0 +1,27 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "getStaggerChildMapping", {
+    enumerable: true,
+    get: function() {
+        return getStaggerChildMapping;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+function getStaggerChildMapping(children) {
+    const childMapping = {};
+    if (children) {
+        _react.Children.toArray(children).forEach((child, index)=>{
+            if (_react.isValidElement(child)) {
+                var _child_key;
+                childMapping[(_child_key = child.key) !== null && _child_key !== void 0 ? _child_key : ''] = {
+                    element: child,
+                    index
+                };
+            }
+        });
+    }
+    return childMapping;
+}

package/lib-commonjs/choreography/Stagger/utils/getStaggerChildMapping.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/choreography/Stagger/utils/getStaggerChildMapping.ts"],"sourcesContent":["import * as React from 'react';\n\nexport type StaggerChildMapping = Record<string, { element: React.ReactElement; index: number }>;\n\n/**\n * Given `children`, return an object mapping key to child element and its index.\n * This allows tracking individual items by identity (via React keys) rather than by position.\n *\n * Uses React.Children.toArray() which:\n * - Automatically provides stable indices (0, 1, 2, ...)\n * - Handles key normalization (e.g., 'a' → '.$a') consistently\n * - Flattens fragments automatically\n * - Generates keys for elements without explicit keys (e.g., '.0', '.1', '.2')\n *\n * @param children - React children to map\n * @returns Object mapping child keys to { element, index }\n */\n// TODO: consider unifying with getChildMapping from react-motion package by making it generic\nexport function getStaggerChildMapping(children: React.ReactNode | undefined): StaggerChildMapping {\n  const childMapping: StaggerChildMapping = {};\n\n  if (children) {\n    React.Children.toArray(children).forEach((child, index) => {\n      if (React.isValidElement(child)) {\n        childMapping[child.key ?? ''] = {\n          element: child,\n          index,\n        };\n      }\n    });\n  }\n\n  return childMapping;\n}\n"],"names":["getStaggerChildMapping","children","childMapping","React","Children","toArray","forEach","child","index","isValidElement","key","element"],"mappings":";;;;+BAkBgBA;;;eAAAA;;;;iEAlBO;AAkBhB,SAASA,uBAAuBC,QAAqC;IAC1E,MAAMC,eAAoC,CAAC;IAE3C,IAAID,UAAU;QACZE,OAAMC,QAAQ,CAACC,OAAO,CAACJ,UAAUK,OAAO,CAAC,CAACC,OAAOC;YAC/C,IAAIL,OAAMM,cAAc,CAACF,QAAQ;oBAClBA;gBAAbL,YAAY,CAACK,CAAAA,aAAAA,MAAMG,GAAG,cAATH,wBAAAA,aAAa,GAAG,GAAG;oBAC9BI,SAASJ;oBACTC;gBACF;YACF;QACF;IACF;IAEA,OAAON;AACT"}

package/lib-commonjs/choreography/Stagger/utils/index.js

@@ -0,0 +1,37 @@
+"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, {
+    DEFAULT_ITEM_DELAY: function() {
+        return _constants.DEFAULT_ITEM_DELAY;
+    },
+    DEFAULT_ITEM_DURATION: function() {
+        return _constants.DEFAULT_ITEM_DURATION;
+    },
+    acceptsDelayProps: function() {
+        return _motionComponentDetection.acceptsDelayProps;
+    },
+    acceptsVisibleProp: function() {
+        return _motionComponentDetection.acceptsVisibleProp;
+    },
+    getStaggerChildMapping: function() {
+        return _getStaggerChildMapping.getStaggerChildMapping;
+    },
+    getStaggerTotalDuration: function() {
+        return _staggercalculations.getStaggerTotalDuration;
+    },
+    staggerItemsVisibilityAtTime: function() {
+        return _staggercalculations.staggerItemsVisibilityAtTime;
+    }
+});
+const _constants = require("./constants");
+const _staggercalculations = require("./stagger-calculations");
+const _motionComponentDetection = require("./motionComponentDetection");
+const _getStaggerChildMapping = require("./getStaggerChildMapping");

package/lib-commonjs/choreography/Stagger/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/choreography/Stagger/utils/index.ts"],"sourcesContent":["export { DEFAULT_ITEM_DELAY, DEFAULT_ITEM_DURATION } from './constants';\nexport { getStaggerTotalDuration, staggerItemsVisibilityAtTime } from './stagger-calculations';\nexport type { StaggerItemsVisibilityAtTimeParams } from './stagger-calculations';\nexport { acceptsVisibleProp, acceptsDelayProps } from './motionComponentDetection';\nexport { getStaggerChildMapping } from './getStaggerChildMapping';\nexport type { StaggerChildMapping } from './getStaggerChildMapping';\n"],"names":["DEFAULT_ITEM_DELAY","DEFAULT_ITEM_DURATION","acceptsDelayProps","acceptsVisibleProp","getStaggerChildMapping","getStaggerTotalDuration","staggerItemsVisibilityAtTime"],"mappings":";;;;;;;;;;;IAASA,kBAAkB;eAAlBA,6BAAkB;;IAAEC,qBAAqB;eAArBA,gCAAqB;;IAGrBC,iBAAiB;eAAjBA,2CAAiB;;IAArCC,kBAAkB;eAAlBA,4CAAkB;;IAClBC,sBAAsB;eAAtBA,8CAAsB;;IAHtBC,uBAAuB;eAAvBA,4CAAuB;;IAAEC,4BAA4B;eAA5BA,iDAA4B;;;2BADJ;qCACY;0CAEhB;wCACf"}

package/lib-commonjs/choreography/Stagger/utils/motionComponentDetection.js

@@ -0,0 +1,48 @@
+"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, {
+    acceptsDelayProps: function() {
+        return acceptsDelayProps;
+    },
+    acceptsVisibleProp: function() {
+        return acceptsVisibleProp;
+    },
+    isMotionComponent: function() {
+        return isMotionComponent;
+    },
+    isPresenceComponent: function() {
+        return isPresenceComponent;
+    }
+});
+const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
+const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
+function isMotionComponent(element) {
+    if (!(element === null || element === void 0 ? void 0 : element.type) || typeof element.type !== 'function') {
+        return false;
+    }
+    // Check if the component has the MOTION_DEFINITION symbol (internal to createMotionComponent)
+    const symbols = Object.getOwnPropertySymbols(element.type);
+    return symbols.some((sym)=>sym.description === 'MOTION_DEFINITION');
+}
+function isPresenceComponent(element) {
+    if (!(element === null || element === void 0 ? void 0 : element.type) || typeof element.type !== 'function') {
+        return false;
+    }
+    // Check if the component has the PRESENCE_MOTION_DEFINITION symbol (internal to createPresenceComponent)
+    const symbols = Object.getOwnPropertySymbols(element.type);
+    return symbols.some((sym)=>sym.description === 'PRESENCE_MOTION_DEFINITION');
+}
+function acceptsDelayProps(element) {
+    return isPresenceComponent(element) || isMotionComponent(element);
+}
+function acceptsVisibleProp(element) {
+    return isPresenceComponent(element);
+}

package/lib-commonjs/choreography/Stagger/utils/motionComponentDetection.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/choreography/Stagger/utils/motionComponentDetection.ts"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Checks if a React element has all of the specified props explicitly provided.\n *\n * @param element - React element to inspect\n * @param props - Array of prop names to verify presence on the element\n * @returns true if all props exist on element.props, false otherwise\n *\n * @internal - Exported for testing purposes\n */\n\n/**\n * Checks if a React element is a motion component created by createMotionComponent.\n * Motion components are detected by the presence of the MOTION_DEFINITION symbol on the component.\n *\n * @param element - React element to inspect\n * @returns true when the element's type contains the MOTION_DEFINITION symbol\n *\n * **Note:** This is a heuristic detection. Motion components may or may not support\n * specific props like `delay` or `visible` depending on their implementation.\n *\n * @internal - Exported for testing purposes\n */\nexport function isMotionComponent(element: React.ReactElement): boolean {\n  if (!element?.type || typeof element.type !== 'function') {\n    return false;\n  }\n\n  // Check if the component has the MOTION_DEFINITION symbol (internal to createMotionComponent)\n  const symbols = Object.getOwnPropertySymbols(element.type);\n  return symbols.some(sym => sym.description === 'MOTION_DEFINITION');\n}\n\n/**\n * Checks if a React element is a presence motion component by looking for the PRESENCE_MOTION_DEFINITION symbol.\n * This symbol is added internally by createPresenceComponent and provides reliable detection.\n *\n * @param element - React element to inspect\n * @returns true when the element's type contains the PRESENCE_MOTION_DEFINITION symbol\n *\n * **Presence components** (like Fade, Scale, Slide) are guaranteed to support both `visible` and `delay` props.\n *\n * @internal - Exported for testing purposes\n */\nexport function isPresenceComponent(element: React.ReactElement): boolean {\n  if (!element?.type || typeof element.type !== 'function') {\n    return false;\n  }\n\n  // Check if the component has the PRESENCE_MOTION_DEFINITION symbol (internal to createPresenceComponent)\n  const symbols = Object.getOwnPropertySymbols(element.type);\n  return symbols.some(sym => sym.description === 'PRESENCE_MOTION_DEFINITION');\n}\n\n/**\n * Checks if a React element accepts both `delay` and `exitDelay` props.\n * This uses a best-effort heuristic to detect components that support both delay props.\n *\n * @param element - React element to inspect\n * @returns true when the element likely supports both delay and exitDelay props\n *\n * **Auto-detection includes:**\n * - Presence components (Fade, Scale, etc.) - guaranteed to support both delay and exitDelay\n * - Motion components (.In/.Out variants, custom motion components) - may support both delay props\n * - Elements with explicit delay and exitDelay props already set\n *\n * **When to override:** If auto-detection is incorrect, use explicit `delayMode` prop on Stagger.\n * For example, custom motion components that don't support both props should use `delayMode=\"timing\"`.\n *\n * @internal - Exported for testing purposes\n */\nexport function acceptsDelayProps(element: React.ReactElement): boolean {\n  return isPresenceComponent(element) || isMotionComponent(element);\n}\n\n/**\n * Checks if a React element accepts a `visible` prop.\n * This uses a best-effort heuristic to detect components that support visible props.\n *\n * @param element - React element to inspect\n * @returns true when the element likely supports a `visible` prop\n *\n * **Auto-detection includes:**\n * - Presence components (Fade, Scale, etc.) - guaranteed to support visible\n * - Elements with explicit visible props already set\n *\n * **When to override:** If auto-detection is incorrect, use explicit `hideMode` prop on Stagger.\n * For example, custom components that don't support visible should use `hideMode=\"visibilityStyle\"` or `hideMode=\"unmount\"`.\n *\n * @internal - Exported for testing purposes\n */\nexport function acceptsVisibleProp(element: React.ReactElement): boolean {\n  return isPresenceComponent(element);\n}\n"],"names":["acceptsDelayProps","acceptsVisibleProp","isMotionComponent","isPresenceComponent","element","type","symbols","Object","getOwnPropertySymbols","some","sym","description"],"mappings":";;;;;;;;;;;IAwEgBA,iBAAiB;eAAjBA;;IAoBAC,kBAAkB;eAAlBA;;IApEAC,iBAAiB;eAAjBA;;IAqBAC,mBAAmB;eAAnBA;;;;iEA7CO;AAwBhB,SAASD,kBAAkBE,OAA2B;IAC3D,IAAI,EAACA,oBAAAA,8BAAAA,QAASC,IAAI,KAAI,OAAOD,QAAQC,IAAI,KAAK,YAAY;QACxD,OAAO;IACT;IAEA,8FAA8F;IAC9F,MAAMC,UAAUC,OAAOC,qBAAqB,CAACJ,QAAQC,IAAI;IACzD,OAAOC,QAAQG,IAAI,CAACC,CAAAA,MAAOA,IAAIC,WAAW,KAAK;AACjD;AAaO,SAASR,oBAAoBC,OAA2B;IAC7D,IAAI,EAACA,oBAAAA,8BAAAA,QAASC,IAAI,KAAI,OAAOD,QAAQC,IAAI,KAAK,YAAY;QACxD,OAAO;IACT;IAEA,yGAAyG;IACzG,MAAMC,UAAUC,OAAOC,qBAAqB,CAACJ,QAAQC,IAAI;IACzD,OAAOC,QAAQG,IAAI,CAACC,CAAAA,MAAOA,IAAIC,WAAW,KAAK;AACjD;AAmBO,SAASX,kBAAkBI,OAA2B;IAC3D,OAAOD,oBAAoBC,YAAYF,kBAAkBE;AAC3D;AAkBO,SAASH,mBAAmBG,OAA2B;IAC5D,OAAOD,oBAAoBC;AAC7B"}

package/lib-commonjs/choreography/Stagger/utils/stagger-calculations.js

@@ -0,0 +1,76 @@
+"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, {
+    getStaggerTotalDuration: function() {
+        return getStaggerTotalDuration;
+    },
+    staggerItemsVisibilityAtTime: function() {
+        return staggerItemsVisibilityAtTime;
+    }
+});
+const _constants = require("./constants");
+function getStaggerTotalDuration({ itemCount, itemDelay = _constants.DEFAULT_ITEM_DELAY, itemDuration = _constants.DEFAULT_ITEM_DURATION }) {
+    if (itemCount <= 0) {
+        return 0;
+    }
+    if (itemCount <= 1) {
+        return Math.max(0, itemDuration);
+    }
+    const staggerDuration = itemDelay * (itemCount - 1);
+    return Math.max(0, staggerDuration + itemDuration);
+}
+function staggerItemsVisibilityAtTime({ itemCount, elapsed, itemDelay = _constants.DEFAULT_ITEM_DELAY, itemDuration = _constants.DEFAULT_ITEM_DURATION, direction = 'enter', reversed = false }) {
+    // If no items, return the empty state
+    if (itemCount <= 0) {
+        return {
+            itemsVisibility: [],
+            totalDuration: 0
+        };
+    }
+    const totalDuration = getStaggerTotalDuration({
+        itemCount,
+        itemDelay,
+        itemDuration
+    });
+    // Calculate progression through the stagger sequence
+    let completedSteps;
+    if (itemDelay <= 0) {
+        // When itemDelay is 0 or negative, all steps complete immediately
+        completedSteps = itemCount;
+    } else {
+        // Both enter and exit should start their first item immediately, but handle t=0 differently
+        if (elapsed === 0) {
+            // At exactly t=0, for enter we want first item visible, for exit we want all items visible
+            completedSteps = direction === 'enter' ? 1 : 0;
+        } else {
+            // After t=0, both directions should progress at the same rate
+            const stepsFromElapsedTime = Math.floor(elapsed / itemDelay) + 1;
+            completedSteps = Math.min(itemCount, stepsFromElapsedTime);
+        }
+    }
+    const itemsVisibility = Array.from({
+        length: itemCount
+    }, (_, idx)=>{
+        // Calculate based on progression through the sequence (enter pattern)
+        const fromStart = idx < completedSteps;
+        const fromEnd = idx >= itemCount - completedSteps;
+        let itemVisible = reversed ? fromEnd : fromStart;
+        // For exit, invert the enter pattern
+        if (direction === 'exit') {
+            itemVisible = !itemVisible;
+        }
+        return itemVisible;
+    });
+    return {
+        itemsVisibility,
+        totalDuration
+    };
+}

package/lib-commonjs/choreography/Stagger/utils/stagger-calculations.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/choreography/Stagger/utils/stagger-calculations.ts"],"sourcesContent":["import type { StaggerProps } from '../stagger-types';\nimport { DEFAULT_ITEM_DELAY, DEFAULT_ITEM_DURATION } from './constants';\n\n/**\n * Calculate the total stagger duration — from the moment the stagger begins\n * until the final item's animation completes.\n *\n * Uses the formula:\n *   max(0, itemDelay * (itemCount - 1) + itemDuration)\n *\n * @param params.itemCount    Total number of items to stagger\n * @param params.itemDelay    Milliseconds between the start of each item (default: DEFAULT_ITEM_DELAY)\n * @param params.itemDuration Milliseconds each item's animation lasts (default: DEFAULT_ITEM_DURATION)\n * @returns                   Total duration in milliseconds (never negative)\n */\nexport function getStaggerTotalDuration({\n  itemCount,\n  itemDelay = DEFAULT_ITEM_DELAY,\n  itemDuration = DEFAULT_ITEM_DURATION,\n}: {\n  itemCount: number;\n} & Pick<StaggerProps, 'itemDelay' | 'itemDuration'>): number {\n  if (itemCount <= 0) {\n    return 0;\n  }\n  if (itemCount <= 1) {\n    return Math.max(0, itemDuration);\n  }\n  const staggerDuration = itemDelay * (itemCount - 1);\n  return Math.max(0, staggerDuration + itemDuration);\n}\n\nexport interface StaggerItemsVisibilityAtTimeParams\n  extends Pick<StaggerProps, 'itemDelay' | 'itemDuration' | 'reversed'> {\n  itemCount: number;\n  elapsed: number;\n  direction?: 'enter' | 'exit';\n}\n\n/**\n * Returns visibility flags plus timing metrics for a stagger sequence.\n */\nexport function staggerItemsVisibilityAtTime({\n  itemCount,\n  elapsed,\n  itemDelay = DEFAULT_ITEM_DELAY,\n  itemDuration = DEFAULT_ITEM_DURATION,\n  direction = 'enter',\n  reversed = false,\n}: StaggerItemsVisibilityAtTimeParams): {\n  itemsVisibility: boolean[];\n  totalDuration: number;\n} {\n  // If no items, return the empty state\n  if (itemCount <= 0) {\n    return { itemsVisibility: [], totalDuration: 0 };\n  }\n\n  const totalDuration = getStaggerTotalDuration({ itemCount, itemDelay, itemDuration });\n\n  // Calculate progression through the stagger sequence\n  let completedSteps: number;\n  if (itemDelay <= 0) {\n    // When itemDelay is 0 or negative, all steps complete immediately\n    completedSteps = itemCount;\n  } else {\n    // Both enter and exit should start their first item immediately, but handle t=0 differently\n    if (elapsed === 0) {\n      // At exactly t=0, for enter we want first item visible, for exit we want all items visible\n      completedSteps = direction === 'enter' ? 1 : 0;\n    } else {\n      // After t=0, both directions should progress at the same rate\n      const stepsFromElapsedTime = Math.floor(elapsed / itemDelay) + 1;\n      completedSteps = Math.min(itemCount, stepsFromElapsedTime);\n    }\n  }\n\n  const itemsVisibility = Array.from({ length: itemCount }, (_, idx) => {\n    // Calculate based on progression through the sequence (enter pattern)\n    const fromStart = idx < completedSteps;\n    const fromEnd = idx >= itemCount - completedSteps;\n\n    let itemVisible = reversed ? fromEnd : fromStart;\n\n    // For exit, invert the enter pattern\n    if (direction === 'exit') {\n      itemVisible = !itemVisible;\n    }\n\n    return itemVisible;\n  });\n\n  return { itemsVisibility, totalDuration };\n}\n"],"names":["getStaggerTotalDuration","staggerItemsVisibilityAtTime","itemCount","itemDelay","DEFAULT_ITEM_DELAY","itemDuration","DEFAULT_ITEM_DURATION","Math","max","staggerDuration","elapsed","direction","reversed","itemsVisibility","totalDuration","completedSteps","stepsFromElapsedTime","floor","min","Array","from","length","_","idx","fromStart","fromEnd","itemVisible"],"mappings":";;;;;;;;;;;IAegBA,uBAAuB;eAAvBA;;IA2BAC,4BAA4B;eAA5BA;;;2BAzC0C;AAcnD,SAASD,wBAAwB,EACtCE,SAAS,EACTC,YAAYC,6BAAkB,EAC9BC,eAAeC,gCAAqB,EAGc;IAClD,IAAIJ,aAAa,GAAG;QAClB,OAAO;IACT;IACA,IAAIA,aAAa,GAAG;QAClB,OAAOK,KAAKC,GAAG,CAAC,GAAGH;IACrB;IACA,MAAMI,kBAAkBN,YAAaD,CAAAA,YAAY,CAAA;IACjD,OAAOK,KAAKC,GAAG,CAAC,GAAGC,kBAAkBJ;AACvC;AAYO,SAASJ,6BAA6B,EAC3CC,SAAS,EACTQ,OAAO,EACPP,YAAYC,6BAAkB,EAC9BC,eAAeC,gCAAqB,EACpCK,YAAY,OAAO,EACnBC,WAAW,KAAK,EACmB;IAInC,sCAAsC;IACtC,IAAIV,aAAa,GAAG;QAClB,OAAO;YAAEW,iBAAiB,EAAE;YAAEC,eAAe;QAAE;IACjD;IAEA,MAAMA,gBAAgBd,wBAAwB;QAAEE;QAAWC;QAAWE;IAAa;IAEnF,qDAAqD;IACrD,IAAIU;IACJ,IAAIZ,aAAa,GAAG;QAClB,kEAAkE;QAClEY,iBAAiBb;IACnB,OAAO;QACL,4FAA4F;QAC5F,IAAIQ,YAAY,GAAG;YACjB,2FAA2F;YAC3FK,iBAAiBJ,cAAc,UAAU,IAAI;QAC/C,OAAO;YACL,8DAA8D;YAC9D,MAAMK,uBAAuBT,KAAKU,KAAK,CAACP,UAAUP,aAAa;YAC/DY,iBAAiBR,KAAKW,GAAG,CAAChB,WAAWc;QACvC;IACF;IAEA,MAAMH,kBAAkBM,MAAMC,IAAI,CAAC;QAAEC,QAAQnB;IAAU,GAAG,CAACoB,GAAGC;QAC5D,sEAAsE;QACtE,MAAMC,YAAYD,MAAMR;QACxB,MAAMU,UAAUF,OAAOrB,YAAYa;QAEnC,IAAIW,cAAcd,WAAWa,UAAUD;QAEvC,qCAAqC;QACrC,IAAIb,cAAc,QAAQ;YACxBe,cAAc,CAACA;QACjB;QAEA,OAAOA;IACT;IAEA,OAAO;QAAEb;QAAiBC;IAAc;AAC1C"}

package/lib-commonjs/index.js

@@ -54,6 +54,9 @@ _export(exports, {
     SlideSnappy: function() {
         return _Slide.SlideSnappy;
     },
+    Stagger: function() {
+        return _Stagger.Stagger;
+    },
     blurAtom: function() {
         return _bluratom.blurAtom;
     },
@@ -76,6 +79,7 @@ const _Scale = require("./components/Scale");
 const _Slide = require("./components/Slide");
 const _Blur = require("./components/Blur");
 const _Rotate = require("./components/Rotate");
+const _Stagger = require("./choreography/Stagger");
 const _bluratom = require("./atoms/blur-atom");
 const _fadeatom = require("./atoms/fade-atom");
 const _rotateatom = require("./atoms/rotate-atom");

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Collapse,\n  CollapseSnappy,\n  CollapseRelaxed,\n  CollapseDelayed,\n  type CollapseParams,\n  type CollapseDurations,\n} from './components/Collapse';\nexport { Fade, FadeSnappy, FadeRelaxed, type FadeParams } from './components/Fade';\nexport { Scale, ScaleSnappy, ScaleRelaxed, type ScaleParams } from './components/Scale';\nexport { Slide, SlideSnappy, SlideRelaxed, type SlideParams } from './components/Slide';\nexport { Blur, type BlurParams } from './components/Blur';\nexport { Rotate, type RotateParams } from './components/Rotate';\n\n// Motion Atoms\nexport { blurAtom } from './atoms/blur-atom';\nexport { fadeAtom } from './atoms/fade-atom';\nexport { rotateAtom } from './atoms/rotate-atom';\nexport { scaleAtom } from './atoms/scale-atom';\nexport { slideAtom } from './atoms/slide-atom';\n// TODO: consider whether to export some or all collapse atoms\n"],"names":["Blur","Collapse","CollapseDelayed","CollapseRelaxed","CollapseSnappy","Fade","FadeRelaxed","FadeSnappy","Rotate","Scale","ScaleRelaxed","ScaleSnappy","Slide","SlideRelaxed","SlideSnappy","blurAtom","fadeAtom","rotateAtom","scaleAtom","slideAtom"],"mappings":";;;;;;;;;;;IAWSA,IAAI;eAAJA,UAAI;;IAVXC,QAAQ;eAARA,kBAAQ;;IAGRC,eAAe;eAAfA,yBAAe;;IADfC,eAAe;eAAfA,yBAAe;;IADfC,cAAc;eAAdA,wBAAc;;IAMPC,IAAI;eAAJA,UAAI;;IAAcC,WAAW;eAAXA,iBAAW;;IAAvBC,UAAU;eAAVA,gBAAU;;IAIhBC,MAAM;eAANA,cAAM;;IAHNC,KAAK;eAALA,YAAK;;IAAeC,YAAY;eAAZA,mBAAY;;IAAzBC,WAAW;eAAXA,kBAAW;;IAClBC,KAAK;eAALA,YAAK;;IAAeC,YAAY;eAAZA,mBAAY;;IAAzBC,WAAW;eAAXA,kBAAW;;IAKlBC,QAAQ;eAARA,kBAAQ;;IACRC,QAAQ;eAARA,kBAAQ;;IACRC,UAAU;eAAVA,sBAAU;;IACVC,SAAS;eAATA,oBAAS;;IACTC,SAAS;eAATA,oBAAS;;;0BAZX;sBACwD;uBACI;uBACA;sBAC7B;wBACI;0BAGjB;0BACA;4BACE;2BACD;2BACA;CAC1B,8DAA8D"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Collapse,\n  CollapseSnappy,\n  CollapseRelaxed,\n  CollapseDelayed,\n  type CollapseParams,\n  type CollapseDurations,\n} from './components/Collapse';\nexport { Fade, FadeSnappy, FadeRelaxed, type FadeParams } from './components/Fade';\nexport { Scale, ScaleSnappy, ScaleRelaxed, type ScaleParams } from './components/Scale';\nexport { Slide, SlideSnappy, SlideRelaxed, type SlideParams } from './components/Slide';\nexport { Blur, type BlurParams } from './components/Blur';\nexport { Rotate, type RotateParams } from './components/Rotate';\nexport { Stagger, type StaggerProps } from './choreography/Stagger';\n\n// Motion Atoms\nexport { blurAtom } from './atoms/blur-atom';\nexport { fadeAtom } from './atoms/fade-atom';\nexport { rotateAtom } from './atoms/rotate-atom';\nexport { scaleAtom } from './atoms/scale-atom';\nexport { slideAtom } from './atoms/slide-atom';\n// TODO: consider whether to export some or all collapse atoms\n"],"names":["Blur","Collapse","CollapseDelayed","CollapseRelaxed","CollapseSnappy","Fade","FadeRelaxed","FadeSnappy","Rotate","Scale","ScaleRelaxed","ScaleSnappy","Slide","SlideRelaxed","SlideSnappy","Stagger","blurAtom","fadeAtom","rotateAtom","scaleAtom","slideAtom"],"mappings":";;;;;;;;;;;IAWSA,IAAI;eAAJA,UAAI;;IAVXC,QAAQ;eAARA,kBAAQ;;IAGRC,eAAe;eAAfA,yBAAe;;IADfC,eAAe;eAAfA,yBAAe;;IADfC,cAAc;eAAdA,wBAAc;;IAMPC,IAAI;eAAJA,UAAI;;IAAcC,WAAW;eAAXA,iBAAW;;IAAvBC,UAAU;eAAVA,gBAAU;;IAIhBC,MAAM;eAANA,cAAM;;IAHNC,KAAK;eAALA,YAAK;;IAAeC,YAAY;eAAZA,mBAAY;;IAAzBC,WAAW;eAAXA,kBAAW;;IAClBC,KAAK;eAALA,YAAK;;IAAeC,YAAY;eAAZA,mBAAY;;IAAzBC,WAAW;eAAXA,kBAAW;;IAGlBC,OAAO;eAAPA,gBAAO;;IAGPC,QAAQ;eAARA,kBAAQ;;IACRC,QAAQ;eAARA,kBAAQ;;IACRC,UAAU;eAAVA,sBAAU;;IACVC,SAAS;eAATA,oBAAS;;IACTC,SAAS;eAATA,oBAAS;;;0BAbX;sBACwD;uBACI;uBACA;sBAC7B;wBACI;yBACC;0BAGlB;0BACA;4BACE;2BACD;2BACA;CAC1B,8DAA8D"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-motion-components-preview",
-  "version": "0.13.0",
+  "version": "0.14.0",
   "description": "A preview package for Fluent UI motion components, providing a collection of components",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -25,6 +25,7 @@
   },
   "dependencies": {
     "@fluentui/react-motion": "*",
+    "@fluentui/react-utilities": "*",
     "@swc/helpers": "^0.5.1"
   },
   "peerDependencies": {