Initial commit

node_modules/@fluentui/react-motion-components-preview/CHANGELOG.md

@@ -0,0 +1,84 @@
+# Change Log - @fluentui/react-motion-components-preview
+
+This log was last generated on Wed, 22 Jan 2025 13:55:30 GMT and should not be manually modified.
+
+<!-- Start content -->
+
+## [0.4.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion-components-preview_v0.4.3)
+
+Wed, 22 Jan 2025 13:55:30 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-motion-components-preview_v0.4.0..@fluentui/react-motion-components-preview_v0.4.3)
+
+### Patches
+
+- refactor(Collapse): streamline motion atom functions ([PR #33463](https://github.com/microsoft/fluentui/pull/33463) by robertpenner@microsoft.com)
+
+## [0.4.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion-components-preview_v0.4.0)
+
+Mon, 09 Dec 2024 17:38:13 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-motion-components-preview_v0.3.2..@fluentui/react-motion-components-preview_v0.4.0)
+
+### Minor changes
+
+- feat(Collapse): add margin to whitespace animation ([PR #33405](https://github.com/microsoft/fluentui/pull/33405) by robertpenner@microsoft.com)
+
+### Patches
+
+- feat(motion): Refactor scale, migrate to new variant structure ([PR #33341](https://github.com/microsoft/fluentui/pull/33341) by olkatruk@microsoft.com)
+
+## [0.3.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion-components-preview_v0.3.2)
+
+Fri, 06 Dec 2024 12:53:40 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-motion-components-preview_v0.3.0..@fluentui/react-motion-components-preview_v0.3.2)
+
+### Patches
+
+- chore: remove usage of "export *"  ([PR #33380](https://github.com/microsoft/fluentui/pull/33380) by olfedias@microsoft.com)
+
+## [0.3.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion-components-preview_v0.3.0)
+
+Mon, 11 Nov 2024 10:00:46 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-motion-components-preview_v0.2.0..@fluentui/react-motion-components-preview_v0.3.0)
+
+### Minor changes
+
+- feat: add CollapseDelayed motion component variant ([PR #33069](https://github.com/microsoft/fluentui/pull/33069) by robertpenner@microsoft.com)
+- Rename motion component variants ...Exaggerated to ...Relaxed ([PR #33182](https://github.com/microsoft/fluentui/pull/33182) by olkatruk@microsoft.com)
+
+### Patches
+
+- refactor: migrate Fade motion component to new variant structure ([PR #33080](https://github.com/microsoft/fluentui/pull/33080) by robertpenner@microsoft.com)
+- fix: handle content padding in Collapse ([PR #33063](https://github.com/microsoft/fluentui/pull/33063) by robertpenner@microsoft.com)
+- chore: replace npm-scripts and just-scrtips with nx inferred tasks ([PR #33074](https://github.com/microsoft/fluentui/pull/33074) by martinhochel@microsoft.com)
+
+## [0.2.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion-components-preview_v0.2.0)
+
+Tue, 15 Oct 2024 17:17:49 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-motion-components-preview_v0.1.1..@fluentui/react-motion-components-preview_v0.2.0)
+
+### Minor changes
+
+- refactor: simplify motion component variant creation ([PR #32939](https://github.com/microsoft/fluentui/pull/32939) by robertpenner@microsoft.com)
+- feat: add Collapse orientation parameter & horizontal implementation ([PR #32998](https://github.com/microsoft/fluentui/pull/32998) by robertpenner@microsoft.com)
+
+### Patches
+
+- fix: Collapse should only effect opacity when animateOpacity is true ([PR #32999](https://github.com/microsoft/fluentui/pull/32999) by robertpenner@microsoft.com)
+
+## [0.1.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion-components-preview_v0.1.1)
+
+Tue, 23 Jul 2024 20:13:12 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-motion-components-preview_v0.1.0..@fluentui/react-motion-components-preview_v0.1.1)
+
+### Patches
+
+- feat: add Fade motion component ([PR #32020](https://github.com/microsoft/fluentui/pull/32020) by olkatruk@microsoft.com)
+- feat(motion): add Scale motion component ([PR #32021](https://github.com/microsoft/fluentui/pull/32021) by olkatruk@microsoft.com)
+
+## [0.1.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion-components-preview_v0.1.0)
+
+Mon, 15 Jul 2024 17:25:37 GMT
+
+### Minor changes
+
+- feat: release preview package ([PR #31998](https://github.com/microsoft/fluentui/pull/31998) by olkatruk@microsoft.com)

node_modules/@fluentui/react-motion-components-preview/LICENSE

@@ -0,0 +1,15 @@
+@fluentui/react-motion-components-preview
+
+Copyright (c) Microsoft Corporation
+
+All rights reserved.
+
+MIT License
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the ""Software""), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED _AS IS_, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+Note: Usage of the fonts and icons referenced in Fluent UI React is subject to the terms listed at https://aka.ms/fluentui-assets-license

node_modules/@fluentui/react-motion-components-preview/README.md

@@ -0,0 +1,5 @@
+# @fluentui/react-motion-components-preview
+
+**React Motion Components for [Fluent UI React](https://react.fluentui.dev/)**
+
+These are not production-ready components and **should never be used in product**. This space is useful for testing new components whose APIs might change before final release.

node_modules/@fluentui/react-motion-components-preview/dist/index.d.ts

@@ -0,0 +1,128 @@
+import type { MotionParam } from '@fluentui/react-motion';
+import { PresenceComponent } from '@fluentui/react-motion';
+import type { PresenceMotion } from '@fluentui/react-motion';
+import type { PresenceMotionFn } from '@fluentui/react-motion';
+
+/** A React component that applies collapse/expand transitions to its children. */
+export declare const Collapse: PresenceComponent<CollapseRuntimeParams>;
+
+export declare const CollapseDelayed: PresenceComponent<CollapseRuntimeParams>;
+
+declare type CollapseDelayedVariantParams = {
+    /** Time (ms) for the size expand. Defaults to the durationNormal value (200 ms). */
+    enterSizeDuration?: number;
+    /** Time (ms) for the fade-in. Defaults to the enterSizeDuration param, to sync fade-in with expand. */
+    enterOpacityDuration?: number;
+    /** Time (ms) for the size collapse. Defaults to the enterSizeDuration param, for temporal symmetry.. */
+    exitSizeDuration?: number;
+    /** Defaults to the exitSizeDuration param, to sync the fade-out with the collapse. */
+    exitOpacityDuration?: number;
+    /** Time (ms) between the size expand start and the fade-in start. Defaults to `0`.  */
+    enterDelay?: number;
+    /** Time (ms) between the fade-out start and the size collapse start. Defaults to `0`.  */
+    exitDelay?: number;
+    /** Easing curve for the enter transition, shared by size and opacity. Defaults to the easeEaseMax value.  */
+    enterEasing?: string;
+    /** Easing curve for the exit transition, shared by size and opacity. Defaults to the enterEasing param. */
+    exitEasing?: string;
+};
+
+declare type CollapseOrientation = 'horizontal' | 'vertical';
+
+export declare const CollapseRelaxed: PresenceComponent<CollapseRuntimeParams>;
+
+export declare type CollapseRuntimeParams = {
+    /** Whether to animate the opacity. Defaults to `true`. */
+    animateOpacity?: boolean;
+    /** The orientation of the size animation. Defaults to `'vertical'` to expand/collapse the height. */
+    orientation?: CollapseOrientation;
+};
+
+export declare const CollapseSnappy: PresenceComponent<CollapseRuntimeParams>;
+
+declare type CollapseVariantParams = {
+    /** Time (ms) for the enter transition (expand). Defaults to the `durationNormal` value (200 ms). */
+    enterDuration?: number;
+    /** Easing curve for the enter transition (expand). Defaults to the `easeEaseMax` value.  */
+    enterEasing?: string;
+    /** Time (ms) for the exit transition (collapse). Defaults to the `enterDuration` param for symmetry. */
+    exitDuration?: number;
+    /** Easing curve for the exit transition (collapse). Defaults to the `enterEasing` param for symmetry.  */
+    exitEasing?: string;
+};
+
+/** Define a presence motion for collapse/expand that can stagger the size and opacity motions by a given delay. */
+export declare const createCollapseDelayedPresence: PresenceMotionFnCreator<CollapseDelayedVariantParams, CollapseRuntimeParams>;
+
+/** Defines a presence motion for collapse/expand. */
+export declare const createCollapsePresence: PresenceMotionFnCreator<CollapseVariantParams, CollapseRuntimeParams>;
+
+/** Define a presence motion for fade in/out  */
+export declare const createFadePresence: PresenceMotionCreator<FadeVariantParams>;
+
+/** Define a presence motion for scale in/out */
+export declare const createScalePresence: PresenceMotionFnCreator<ScaleVariantParams_unstable, ScaleRuntimeParams_unstable>;
+
+/** A React component that applies fade in/out transitions to its children. */
+export declare const Fade: PresenceComponent<    {}>;
+
+export declare const FadeRelaxed: PresenceComponent<    {}>;
+
+export declare const FadeSnappy: PresenceComponent<    {}>;
+
+declare type FadeVariantParams = {
+    /** Time (ms) for the enter transition (fade-in). Defaults to the `durationNormal` value (200 ms). */
+    enterDuration?: number;
+    /** Easing curve for the enter transition (fade-in). Defaults to the `easeEase` value.  */
+    enterEasing?: string;
+    /** Time (ms) for the exit transition (fade-out). Defaults to the `enterDuration` param for symmetry. */
+    exitDuration?: number;
+    /** Easing curve for the exit transition (fade-out). Defaults to the `enterEasing` param for symmetry.  */
+    exitEasing?: string;
+};
+
+/**
+ * This is a factory function that generates a motion object from variant params, e.g. duration, easing, etc.
+ * The generated object defines a presence motion with `enter` and `exit` transitions.
+ * This motion object is declarative, i.e. data without side effects,
+ * and it is framework-independent, i.e. non-React.
+ * It can be turned into a React component using `createPresenceComponent`.
+ */
+declare type PresenceMotionCreator<MotionVariantParams extends Record<string, MotionParam> = {}> = (variantParams?: MotionVariantParams) => PresenceMotion;
+
+/**
+ * This is a factory function that generates a motion function, which has variant params bound into it.
+ * The generated motion function accepts other runtime params that aren't locked into the variant, but supplied at runtime.
+ * This separation allows the variant to be defined once and reused with different runtime params which may be orthogonal to the variant params.
+ * For example, a variant may define the duration and easing of a transition, which are fixed for all instances of the variant,
+ * while the runtime params may give access to the target element, which is different for each instance.
+ *
+ * The generated motion function is also framework-independent, i.e. non-React.
+ * It can be turned into a React component using `createPresenceComponent`.
+ */
+declare type PresenceMotionFnCreator<MotionVariantParams extends Record<string, MotionParam> = {}, MotionRuntimeParams extends Record<string, MotionParam> = {}> = (variantParams?: MotionVariantParams) => PresenceMotionFn<MotionRuntimeParams>;
+
+/** A React component that applies scale in/out transitions to its children. */
+export declare const Scale: PresenceComponent<ScaleRuntimeParams_unstable>;
+
+export declare const ScaleRelaxed: PresenceComponent<ScaleRuntimeParams_unstable>;
+
+declare type ScaleRuntimeParams_unstable = {
+    /** Whether to animate the opacity. Defaults to `true`. */
+    animateOpacity?: boolean;
+};
+
+export declare const ScaleSnappy: PresenceComponent<ScaleRuntimeParams_unstable>;
+
+declare type ScaleVariantParams_unstable = {
+    /** Time (ms) for the enter transition. Defaults to the `durationNormal` value (200 ms). */
+    enterDuration?: number;
+    /** Easing curve for the enter transition. Defaults to the `easeEaseMax` value.  */
+    enterEasing?: string;
+    /** Time (ms) for the exit transition. Defaults to the `enterDuration` param for symmetry. */
+    exitDuration?: number;
+    /** Easing curve for the exit transition. Defaults to the `enterEasing` param for symmetry.  */
+    exitEasing?: string;
+};
+
+export { }

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/atoms/fade-atom.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});
+Object.defineProperty(exports, "fadeAtom", {
+    enumerable: true,
+    get: function() {
+        return fadeAtom;
+    }
+});
+const _reactmotion = require("@fluentui/react-motion");
+const fadeAtom = ({ direction, duration, easing = _reactmotion.motionTokens.curveLinear, fromValue = 0 })=>{
+    const keyframes = [
+        {
+            opacity: fromValue
+        },
+        {
+            opacity: 1
+        }
+    ];
+    if (direction === 'exit') {
+        keyframes.reverse();
+    }
+    return {
+        keyframes,
+        duration,
+        easing
+    };
+};

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/atoms/fade-atom.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/fade-atom.ts"],"sourcesContent":["import { AtomMotion, PresenceDirection, motionTokens } from '@fluentui/react-motion';\n\ninterface FadeAtomParams {\n  direction: PresenceDirection;\n  duration: number;\n  easing?: string;\n  fromValue?: number;\n}\n\n/**\n * Generates a motion atom object for a fade in or fade out.\n * @param direction - The functional direction of the motion: 'enter' or 'exit'.\n * @param duration - The duration of the motion in milliseconds.\n * @param easing - The easing curve for the motion. Defaults to `motionTokens.curveLinear`.\n * @param fromValue - The starting opacity value. Defaults to 0.\n * @returns A motion atom object with opacity keyframes and the supplied duration and easing.\n */\nexport const fadeAtom = ({\n  direction,\n  duration,\n  easing = motionTokens.curveLinear,\n  fromValue = 0,\n}: FadeAtomParams): AtomMotion => {\n  const keyframes = [{ opacity: fromValue }, { opacity: 1 }];\n  if (direction === 'exit') {\n    keyframes.reverse();\n  }\n  return {\n    keyframes,\n    duration,\n    easing,\n  };\n};\n"],"names":["fadeAtom","direction","duration","easing","motionTokens","curveLinear","fromValue","keyframes","opacity","reverse"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAiBaA;;;eAAAA;;;6BAjB+C;AAiBrD,MAAMA,WAAW,CAAC,EACvBC,SAAS,EACTC,QAAQ,EACRC,SAASC,yBAAY,CAACC,WAAW,EACjCC,YAAY,CAAC,EACE;IACf,MAAMC,YAAY;QAAC;YAAEC,SAASF;QAAU;QAAG;YAAEE,SAAS;QAAE;KAAE;IAC1D,IAAIP,cAAc,QAAQ;QACxBM,UAAUE,OAAO;IACnB;IACA,OAAO;QACLF;QACAL;QACAC;IACF;AACF"}

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Collapse/Collapse.js

@@ -0,0 +1,115 @@
+"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, {
+    Collapse: function() {
+        return Collapse;
+    },
+    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 _collapseatoms = require("./collapse-atoms");
+const _fadeatom = require("../../atoms/fade-atom");
+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 = [
+            (0, _collapseatoms.sizeEnterAtom)({
+                orientation,
+                duration: enterSizeDuration,
+                easing: enterEasing,
+                element
+            }),
+            (0, _collapseatoms.whitespaceAtom)({
+                direction: 'enter',
+                orientation,
+                duration: enterSizeDuration,
+                easing: enterEasing
+            })
+        ];
+        // Fade in only if animateOpacity is true. Otherwise, leave opacity unaffected.
+        if (animateOpacity) {
+            enterAtoms.push({
+                ...(0, _fadeatom.fadeAtom)({
+                    direction: 'enter',
+                    duration: enterOpacityDuration,
+                    easing: enterEasing
+                }),
+                delay: enterDelay,
+                fill: 'both'
+            });
+        }
+        // ----- 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 true. Otherwise, leave opacity unaffected.
+        if (animateOpacity) {
+            exitAtoms.push((0, _fadeatom.fadeAtom)({
+                direction: 'exit',
+                duration: exitOpacityDuration,
+                easing: exitEasing
+            }));
+        }
+        exitAtoms.push((0, _collapseatoms.sizeExitAtom)({
+            orientation,
+            duration: exitSizeDuration,
+            easing: exitEasing,
+            element,
+            delay: exitDelay
+        }), (0, _collapseatoms.whitespaceAtom)({
+            direction: 'exit',
+            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 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
+}));

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Collapse/collapse-atoms.js

@@ -0,0 +1,118 @@
+"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, {
+    sizeEnterAtom: function() {
+        return sizeEnterAtom;
+    },
+    sizeExitAtom: function() {
+        return sizeExitAtom;
+    },
+    whitespaceAtom: function() {
+        return whitespaceAtom;
+    }
+});
+// ----- 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 includes padding and margin.
+const whitespaceValuesForOrientation = (orientation)=>{
+    // horizontal whitespace collapse
+    if (orientation === 'horizontal') {
+        return {
+            paddingStart: 'paddingInlineStart',
+            paddingEnd: 'paddingInlineEnd',
+            marginStart: 'marginInlineStart',
+            marginEnd: 'marginInlineEnd'
+        };
+    }
+    // vertical whitespace collapse
+    return {
+        paddingStart: 'paddingBlockStart',
+        paddingEnd: 'paddingBlockEnd',
+        marginStart: 'marginBlockStart',
+        marginEnd: 'marginBlockEnd'
+    };
+};
+const whitespaceAtom = ({ direction, orientation, duration, easing, delay = 0 })=>{
+    const { paddingStart, paddingEnd, marginStart, marginEnd } = whitespaceValuesForOrientation(orientation);
+    // The keyframe with zero whitespace is at the start for enter and at the end for exit.
+    const offset = direction === 'enter' ? 0 : 1;
+    const keyframes = [
+        {
+            [paddingStart]: '0',
+            [paddingEnd]: '0',
+            [marginStart]: '0',
+            [marginEnd]: '0',
+            offset
+        }
+    ];
+    const atom = {
+        keyframes,
+        duration,
+        easing,
+        delay
+    };
+    if (direction === 'exit') {
+        atom.fill = 'forwards';
+    }
+    return atom;
+};

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Collapse/collapse-types.js

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

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Collapse/collapse-types.js.map

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

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Collapse/index.js

@@ -0,0 +1,31 @@
+"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, {
+    Collapse: function() {
+        return _Collapse.Collapse;
+    },
+    CollapseDelayed: function() {
+        return _Collapse.CollapseDelayed;
+    },
+    CollapseRelaxed: function() {
+        return _Collapse.CollapseRelaxed;
+    },
+    CollapseSnappy: function() {
+        return _Collapse.CollapseSnappy;
+    },
+    createCollapseDelayedPresence: function() {
+        return _Collapse.createCollapseDelayedPresence;
+    },
+    createCollapsePresence: function() {
+        return _Collapse.createCollapsePresence;
+    }
+});
+const _Collapse = require("./Collapse");

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Collapse/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Collapse/index.ts"],"sourcesContent":["export {\n  Collapse,\n  CollapseDelayed,\n  CollapseRelaxed,\n  CollapseSnappy,\n  createCollapseDelayedPresence,\n  createCollapsePresence,\n} from './Collapse';\nexport type { CollapseRuntimeParams } from './collapse-types';\n"],"names":["Collapse","CollapseDelayed","CollapseRelaxed","CollapseSnappy","createCollapseDelayedPresence","createCollapsePresence"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IACEA,QAAQ;eAARA,kBAAQ;;IACRC,eAAe;eAAfA,yBAAe;;IACfC,eAAe;eAAfA,yBAAe;;IACfC,cAAc;eAAdA,wBAAc;;IACdC,6BAA6B;eAA7BA,uCAA6B;;IAC7BC,sBAAsB;eAAtBA,gCAAsB;;;0BACjB"}

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Fade/Fade.js

@@ -0,0 +1,45 @@
+"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, {
+    Fade: function() {
+        return Fade;
+    },
+    FadeRelaxed: function() {
+        return FadeRelaxed;
+    },
+    FadeSnappy: function() {
+        return FadeSnappy;
+    },
+    createFadePresence: function() {
+        return createFadePresence;
+    }
+});
+const _reactmotion = require("@fluentui/react-motion");
+const _fadeatom = require("../../atoms/fade-atom");
+const createFadePresence = ({ enterDuration = _reactmotion.motionTokens.durationNormal, enterEasing = _reactmotion.motionTokens.curveEasyEase, exitDuration = enterDuration, exitEasing = enterEasing } = {})=>({
+        enter: (0, _fadeatom.fadeAtom)({
+            direction: 'enter',
+            duration: enterDuration,
+            easing: enterEasing
+        }),
+        exit: (0, _fadeatom.fadeAtom)({
+            direction: 'exit',
+            duration: exitDuration,
+            easing: exitEasing
+        })
+    });
+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
+}));

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Fade/Fade.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Fade/Fade.ts"],"sourcesContent":["import { motionTokens, createPresenceComponent } from '@fluentui/react-motion';\nimport type { PresenceMotionCreator } from '../../types';\nimport { fadeAtom } from '../../atoms/fade-atom';\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: fadeAtom({ direction: 'enter', duration: enterDuration, easing: enterEasing }),\n  exit: fadeAtom({ direction: 'exit', duration: exitDuration, easing: exitEasing }),\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","fadeAtom","direction","duration","easing","exit","createPresenceComponent","durationFast","durationGentle"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA8BaA,IAAI;eAAJA;;IAIAC,WAAW;eAAXA;;IAFAC,UAAU;eAAVA;;IAbAC,kBAAkB;eAAlBA;;;6BAnByC;0BAE7B;AAiBlB,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,OAAOC,IAAAA,kBAAQ,EAAC;YAAEC,WAAW;YAASC,UAAUV;YAAeW,QAAQR;QAAY;QACnFS,MAAMJ,IAAAA,kBAAQ,EAAC;YAAEC,WAAW;YAAQC,UAAUL;YAAcM,QAAQL;QAAW;IACjF,CAAA;AAGO,MAAMV,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"}

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Fade/index.js

@@ -0,0 +1,25 @@
+"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, {
+    Fade: function() {
+        return _Fade.Fade;
+    },
+    FadeRelaxed: function() {
+        return _Fade.FadeRelaxed;
+    },
+    FadeSnappy: function() {
+        return _Fade.FadeSnappy;
+    },
+    createFadePresence: function() {
+        return _Fade.createFadePresence;
+    }
+});
+const _Fade = require("./Fade");

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Fade/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Fade/index.ts"],"sourcesContent":["export { Fade, FadeRelaxed, FadeSnappy, createFadePresence } from './Fade';\n"],"names":["Fade","FadeRelaxed","FadeSnappy","createFadePresence"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,IAAI;eAAJA,UAAI;;IAAEC,WAAW;eAAXA,iBAAW;;IAAEC,UAAU;eAAVA,gBAAU;;IAAEC,kBAAkB;eAAlBA,wBAAkB;;;sBAAQ"}

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Scale/Scale.js

@@ -0,0 +1,78 @@
+"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, {
+    Scale: function() {
+        return Scale;
+    },
+    ScaleRelaxed: function() {
+        return ScaleRelaxed;
+    },
+    ScaleSnappy: function() {
+        return ScaleSnappy;
+    },
+    createScalePresence: function() {
+        return createScalePresence;
+    }
+});
+const _reactmotion = require("@fluentui/react-motion");
+const createScalePresence = ({ enterDuration = _reactmotion.motionTokens.durationGentle, enterEasing = _reactmotion.motionTokens.curveDecelerateMax, exitDuration = _reactmotion.motionTokens.durationNormal, exitEasing = _reactmotion.motionTokens.curveAccelerateMax } = {})=>({ animateOpacity = true })=>{
+        const fromOpacity = animateOpacity ? 0 : 1;
+        const toOpacity = 1;
+        const fromScale = 0.9; // Could be a custom param in the future
+        const toScale = 1;
+        const enterKeyframes = [
+            {
+                opacity: fromOpacity,
+                transform: `scale3d(${fromScale}, ${fromScale}, 1)`,
+                visibility: 'visible'
+            },
+            {
+                opacity: toOpacity,
+                transform: `scale3d(${toScale}, ${toScale}, 1)`
+            }
+        ];
+        const exitKeyframes = [
+            {
+                opacity: toOpacity,
+                transform: `scale3d(${toScale}, ${toScale}, 1)`
+            },
+            {
+                opacity: fromOpacity,
+                transform: `scale3d(${fromScale}, ${fromScale}, 1)`,
+                visibility: 'hidden'
+            }
+        ];
+        return {
+            enter: {
+                duration: enterDuration,
+                easing: enterEasing,
+                keyframes: enterKeyframes
+            },
+            exit: {
+                duration: exitDuration,
+                easing: exitEasing,
+                keyframes: exitKeyframes
+            }
+        };
+    };
+const Scale = (0, _reactmotion.createPresenceComponent)(createScalePresence());
+const ScaleSnappy = (0, _reactmotion.createPresenceComponent)(createScalePresence({
+    enterDuration: _reactmotion.motionTokens.durationNormal,
+    enterEasing: _reactmotion.motionTokens.curveDecelerateMax,
+    exitDuration: _reactmotion.motionTokens.durationFast,
+    exitEasing: _reactmotion.motionTokens.curveAccelerateMax
+}));
+const ScaleRelaxed = (0, _reactmotion.createPresenceComponent)(createScalePresence({
+    enterDuration: _reactmotion.motionTokens.durationSlow,
+    enterEasing: _reactmotion.motionTokens.curveDecelerateMax,
+    exitDuration: _reactmotion.motionTokens.durationGentle,
+    exitEasing: _reactmotion.motionTokens.curveAccelerateMax
+}));

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Scale/Scale.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Scale/Scale.ts"],"sourcesContent":["import { motionTokens, createPresenceComponent } from '@fluentui/react-motion';\nimport { PresenceMotionFnCreator } from '../../types';\nimport { ScaleRuntimeParams_unstable, ScaleVariantParams_unstable } from './Scale.types';\n\n/** Define a presence motion for scale in/out */\nexport const createScalePresence: PresenceMotionFnCreator<ScaleVariantParams_unstable, ScaleRuntimeParams_unstable> =\n  ({\n    enterDuration = motionTokens.durationGentle,\n    enterEasing = motionTokens.curveDecelerateMax,\n    exitDuration = motionTokens.durationNormal,\n    exitEasing = motionTokens.curveAccelerateMax,\n  } = {}) =>\n  ({ 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    return {\n      enter: {\n        duration: enterDuration,\n        easing: enterEasing,\n        keyframes: enterKeyframes,\n      },\n      exit: { duration: exitDuration, easing: exitEasing, keyframes: exitKeyframes },\n    };\n  };\n\n/** A React component that applies scale in/out transitions to its children. */\nexport const Scale = createPresenceComponent(createScalePresence());\n\nexport const ScaleSnappy = createPresenceComponent(\n  createScalePresence({\n    enterDuration: motionTokens.durationNormal,\n    enterEasing: motionTokens.curveDecelerateMax,\n    exitDuration: motionTokens.durationFast,\n    exitEasing: motionTokens.curveAccelerateMax,\n  }),\n);\n\nexport const ScaleRelaxed = createPresenceComponent(\n  createScalePresence({\n    enterDuration: motionTokens.durationSlow,\n    enterEasing: motionTokens.curveDecelerateMax,\n    exitDuration: motionTokens.durationGentle,\n    exitEasing: motionTokens.curveAccelerateMax,\n  }),\n);\n"],"names":["Scale","ScaleRelaxed","ScaleSnappy","createScalePresence","enterDuration","motionTokens","durationGentle","enterEasing","curveDecelerateMax","exitDuration","durationNormal","exitEasing","curveAccelerateMax","animateOpacity","fromOpacity","toOpacity","fromScale","toScale","enterKeyframes","opacity","transform","visibility","exitKeyframes","enter","duration","easing","keyframes","exit","createPresenceComponent","durationFast","durationSlow"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAsCaA,KAAK;eAALA;;IAWAC,YAAY;eAAZA;;IATAC,WAAW;eAAXA;;IAnCAC,mBAAmB;eAAnBA;;;6BALyC;AAK/C,MAAMA,sBACX,CAAC,EACCC,gBAAgBC,yBAAY,CAACC,cAAc,EAC3CC,cAAcF,yBAAY,CAACG,kBAAkB,EAC7CC,eAAeJ,yBAAY,CAACK,cAAc,EAC1CC,aAAaN,yBAAY,CAACO,kBAAkB,EAC7C,GAAG,CAAC,CAAC,GACN,CAAC,EAAEC,iBAAiB,IAAI,EAAE;QACxB,MAAMC,cAAcD,iBAAiB,IAAI;QACzC,MAAME,YAAY;QAClB,MAAMC,YAAY,KAAK,wCAAwC;QAC/D,MAAMC,UAAU;QAEhB,MAAMC,iBAAiB;YACrB;gBAAEC,SAASL;gBAAaM,WAAW,CAAC,QAAQ,EAAEJ,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;gBAAEK,YAAY;YAAU;YACnG;gBAAEF,SAASJ;gBAAWK,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;YAAC;SACvE;QAED,MAAMK,gBAAgB;YACpB;gBAAEH,SAASJ;gBAAWK,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;YAAC;YACtE;gBAAEE,SAASL;gBAAaM,WAAW,CAAC,QAAQ,EAAEJ,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;gBAAEK,YAAY;YAAS;SACnG;QACD,OAAO;YACLE,OAAO;gBACLC,UAAUpB;gBACVqB,QAAQlB;gBACRmB,WAAWR;YACb;YACAS,MAAM;gBAAEH,UAAUf;gBAAcgB,QAAQd;gBAAYe,WAAWJ;YAAc;QAC/E;IACF;AAGK,MAAMtB,QAAQ4B,IAAAA,oCAAuB,EAACzB;AAEtC,MAAMD,cAAc0B,IAAAA,oCAAuB,EAChDzB,oBAAoB;IAClBC,eAAeC,yBAAY,CAACK,cAAc;IAC1CH,aAAaF,yBAAY,CAACG,kBAAkB;IAC5CC,cAAcJ,yBAAY,CAACwB,YAAY;IACvClB,YAAYN,yBAAY,CAACO,kBAAkB;AAC7C;AAGK,MAAMX,eAAe2B,IAAAA,oCAAuB,EACjDzB,oBAAoB;IAClBC,eAAeC,yBAAY,CAACyB,YAAY;IACxCvB,aAAaF,yBAAY,CAACG,kBAAkB;IAC5CC,cAAcJ,yBAAY,CAACC,cAAc;IACzCK,YAAYN,yBAAY,CAACO,kBAAkB;AAC7C"}

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Scale/Scale.types.js

@@ -0,0 +1,5 @@
+// eslint-disable-next-line @typescript-eslint/naming-convention
+"use strict";
+Object.defineProperty(exports, "__esModule", {
+    value: true
+});

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Scale/Scale.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Scale/Scale.types.ts"],"sourcesContent":["// eslint-disable-next-line @typescript-eslint/naming-convention\nexport type ScaleVariantParams_unstable = {\n  /** Time (ms) for the enter transition. Defaults to the `durationNormal` value (200 ms). */\n  enterDuration?: number;\n\n  /** Easing curve for the enter transition. Defaults to the `easeEaseMax` value.  */\n  enterEasing?: string;\n\n  /** Time (ms) for the exit transition. Defaults to the `enterDuration` param for symmetry. */\n  exitDuration?: number;\n\n  /** Easing curve for the exit transition. Defaults to the `enterEasing` param for symmetry.  */\n  exitEasing?: string;\n};\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport type ScaleRuntimeParams_unstable = {\n  /** Whether to animate the opacity. Defaults to `true`. */\n  animateOpacity?: boolean;\n};\n"],"names":[],"rangeMappings":"","mappings":"AAAA,gEAAgE"}

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Scale/index.js

@@ -0,0 +1,25 @@
+"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, {
+    Scale: function() {
+        return _Scale.Scale;
+    },
+    ScaleRelaxed: function() {
+        return _Scale.ScaleRelaxed;
+    },
+    ScaleSnappy: function() {
+        return _Scale.ScaleSnappy;
+    },
+    createScalePresence: function() {
+        return _Scale.createScalePresence;
+    }
+});
+const _Scale = require("./Scale");

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/components/Scale/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Scale/index.ts"],"sourcesContent":["export { Scale, ScaleRelaxed, ScaleSnappy, createScalePresence } from './Scale';\n"],"names":["Scale","ScaleRelaxed","ScaleSnappy","createScalePresence"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,KAAK;eAALA,YAAK;;IAAEC,YAAY;eAAZA,mBAAY;;IAAEC,WAAW;eAAXA,kBAAW;;IAAEC,mBAAmB;eAAnBA,0BAAmB;;;uBAAQ"}

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/index.js

@@ -0,0 +1,57 @@
+"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, {
+    Collapse: function() {
+        return _Collapse.Collapse;
+    },
+    CollapseDelayed: function() {
+        return _Collapse.CollapseDelayed;
+    },
+    CollapseRelaxed: function() {
+        return _Collapse.CollapseRelaxed;
+    },
+    CollapseSnappy: function() {
+        return _Collapse.CollapseSnappy;
+    },
+    Fade: function() {
+        return _Fade.Fade;
+    },
+    FadeRelaxed: function() {
+        return _Fade.FadeRelaxed;
+    },
+    FadeSnappy: function() {
+        return _Fade.FadeSnappy;
+    },
+    Scale: function() {
+        return _Scale.Scale;
+    },
+    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;
+    },
+    createScalePresence: function() {
+        return _Scale.createScalePresence;
+    }
+});
+const _Collapse = require("./components/Collapse");
+const _Fade = require("./components/Fade");
+const _Scale = require("./components/Scale");

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/index.js.map

@@ -0,0 +1 @@
+{"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, createScalePresence } from './components/Scale';\n"],"names":["Collapse","CollapseDelayed","CollapseRelaxed","CollapseSnappy","Fade","FadeRelaxed","FadeSnappy","Scale","ScaleRelaxed","ScaleSnappy","createCollapseDelayedPresence","createCollapsePresence","createFadePresence","createScalePresence"],"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;;IACfC,mBAAmB;eAAnBA,0BAAmB;;;0BAHvD;sBAE2D;uBACI"}

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/types.js

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

node_modules/@fluentui/react-motion-components-preview/lib-commonjs/types.js.map

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

node_modules/@fluentui/react-motion-components-preview/lib/atoms/fade-atom.js

@@ -0,0 +1,26 @@
+import { motionTokens } from '@fluentui/react-motion';
+/**
+ * Generates a motion atom object for a fade in or fade out.
+ * @param direction - The functional direction of the motion: 'enter' or 'exit'.
+ * @param duration - The duration of the motion in milliseconds.
+ * @param easing - The easing curve for the motion. Defaults to `motionTokens.curveLinear`.
+ * @param fromValue - The starting opacity value. Defaults to 0.
+ * @returns A motion atom object with opacity keyframes and the supplied duration and easing.
+ */ export const fadeAtom = ({ direction, duration, easing = motionTokens.curveLinear, fromValue = 0 })=>{
+    const keyframes = [
+        {
+            opacity: fromValue
+        },
+        {
+            opacity: 1
+        }
+    ];
+    if (direction === 'exit') {
+        keyframes.reverse();
+    }
+    return {
+        keyframes,
+        duration,
+        easing
+    };
+};

node_modules/@fluentui/react-motion-components-preview/lib/atoms/fade-atom.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/atoms/fade-atom.ts"],"sourcesContent":["import { AtomMotion, PresenceDirection, motionTokens } from '@fluentui/react-motion';\n\ninterface FadeAtomParams {\n  direction: PresenceDirection;\n  duration: number;\n  easing?: string;\n  fromValue?: number;\n}\n\n/**\n * Generates a motion atom object for a fade in or fade out.\n * @param direction - The functional direction of the motion: 'enter' or 'exit'.\n * @param duration - The duration of the motion in milliseconds.\n * @param easing - The easing curve for the motion. Defaults to `motionTokens.curveLinear`.\n * @param fromValue - The starting opacity value. Defaults to 0.\n * @returns A motion atom object with opacity keyframes and the supplied duration and easing.\n */\nexport const fadeAtom = ({\n  direction,\n  duration,\n  easing = motionTokens.curveLinear,\n  fromValue = 0,\n}: FadeAtomParams): AtomMotion => {\n  const keyframes = [{ opacity: fromValue }, { opacity: 1 }];\n  if (direction === 'exit') {\n    keyframes.reverse();\n  }\n  return {\n    keyframes,\n    duration,\n    easing,\n  };\n};\n"],"names":["motionTokens","fadeAtom","direction","duration","easing","curveLinear","fromValue","keyframes","opacity","reverse"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAAwCA,YAAY,QAAQ,yBAAyB;AASrF;;;;;;;CAOC,GACD,OAAO,MAAMC,WAAW,CAAC,EACvBC,SAAS,EACTC,QAAQ,EACRC,SAASJ,aAAaK,WAAW,EACjCC,YAAY,CAAC,EACE;IACf,MAAMC,YAAY;QAAC;YAAEC,SAASF;QAAU;QAAG;YAAEE,SAAS;QAAE;KAAE;IAC1D,IAAIN,cAAc,QAAQ;QACxBK,UAAUE,OAAO;IACnB;IACA,OAAO;QACLF;QACAJ;QACAC;IACF;AACF,EAAE"}

node_modules/@fluentui/react-motion-components-preview/lib/components/Collapse/Collapse.js

@@ -0,0 +1,85 @@
+import { motionTokens, createPresenceComponent } from '@fluentui/react-motion';
+import { sizeEnterAtom, sizeExitAtom, whitespaceAtom } from './collapse-atoms';
+import { fadeAtom } from '../../atoms/fade-atom';
+/** Define a presence motion for collapse/expand that can stagger the size and opacity motions by a given delay. */ export const createCollapseDelayedPresence = ({ // enter
+enterSizeDuration = motionTokens.durationNormal, enterOpacityDuration = enterSizeDuration, enterEasing = 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 = [
+            sizeEnterAtom({
+                orientation,
+                duration: enterSizeDuration,
+                easing: enterEasing,
+                element
+            }),
+            whitespaceAtom({
+                direction: 'enter',
+                orientation,
+                duration: enterSizeDuration,
+                easing: enterEasing
+            })
+        ];
+        // Fade in only if animateOpacity is true. Otherwise, leave opacity unaffected.
+        if (animateOpacity) {
+            enterAtoms.push({
+                ...fadeAtom({
+                    direction: 'enter',
+                    duration: enterOpacityDuration,
+                    easing: enterEasing
+                }),
+                delay: enterDelay,
+                fill: 'both'
+            });
+        }
+        // ----- 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 true. Otherwise, leave opacity unaffected.
+        if (animateOpacity) {
+            exitAtoms.push(fadeAtom({
+                direction: 'exit',
+                duration: exitOpacityDuration,
+                easing: exitEasing
+            }));
+        }
+        exitAtoms.push(sizeExitAtom({
+            orientation,
+            duration: exitSizeDuration,
+            easing: exitEasing,
+            element,
+            delay: exitDelay
+        }), whitespaceAtom({
+            direction: 'exit',
+            orientation,
+            duration: exitSizeDuration,
+            easing: exitEasing,
+            delay: exitDelay
+        }));
+        return {
+            enter: enterAtoms,
+            exit: exitAtoms
+        };
+    };
+/** Defines a presence motion for collapse/expand. */ export const createCollapsePresence = ({ enterDuration = motionTokens.durationNormal, enterEasing = 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
+    });
+/** A React component that applies collapse/expand transitions to its children. */ export const Collapse = createPresenceComponent(createCollapsePresence());
+export const CollapseSnappy = createPresenceComponent(createCollapsePresence({
+    enterDuration: motionTokens.durationFast
+}));
+export const CollapseRelaxed = createPresenceComponent(createCollapsePresence({
+    enterDuration: motionTokens.durationSlower
+}));
+export const CollapseDelayed = createPresenceComponent(createCollapseDelayedPresence({
+    enterSizeDuration: motionTokens.durationNormal,
+    enterOpacityDuration: motionTokens.durationSlower,
+    enterDelay: motionTokens.durationNormal,
+    exitDelay: motionTokens.durationSlower,
+    enterEasing: motionTokens.curveEasyEase
+}));

node_modules/@fluentui/react-motion-components-preview/lib/components/Collapse/collapse-atoms.js

@@ -0,0 +1,101 @@
+// ----- 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
+    };
+};
+export 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
+    };
+};
+export 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 includes padding and margin.
+const whitespaceValuesForOrientation = (orientation)=>{
+    // horizontal whitespace collapse
+    if (orientation === 'horizontal') {
+        return {
+            paddingStart: 'paddingInlineStart',
+            paddingEnd: 'paddingInlineEnd',
+            marginStart: 'marginInlineStart',
+            marginEnd: 'marginInlineEnd'
+        };
+    }
+    // vertical whitespace collapse
+    return {
+        paddingStart: 'paddingBlockStart',
+        paddingEnd: 'paddingBlockEnd',
+        marginStart: 'marginBlockStart',
+        marginEnd: 'marginBlockEnd'
+    };
+};
+/**
+ * A collapse animates an element's height to zero,
+ but the zero height does not eliminate padding or margin in the box model.
+ So here we generate keyframes to animate those whitespace properties to zero.
+ */ export const whitespaceAtom = ({ direction, orientation, duration, easing, delay = 0 })=>{
+    const { paddingStart, paddingEnd, marginStart, marginEnd } = whitespaceValuesForOrientation(orientation);
+    // The keyframe with zero whitespace is at the start for enter and at the end for exit.
+    const offset = direction === 'enter' ? 0 : 1;
+    const keyframes = [
+        {
+            [paddingStart]: '0',
+            [paddingEnd]: '0',
+            [marginStart]: '0',
+            [marginEnd]: '0',
+            offset
+        }
+    ];
+    const atom = {
+        keyframes,
+        duration,
+        easing,
+        delay
+    };
+    if (direction === 'exit') {
+        atom.fill = 'forwards';
+    }
+    return atom;
+};

node_modules/@fluentui/react-motion-components-preview/lib/components/Collapse/collapse-types.js

@@ -0,0 +1 @@
+export { };

node_modules/@fluentui/react-motion-components-preview/lib/components/Collapse/collapse-types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Collapse/collapse-types.ts"],"sourcesContent":["export type CollapseOrientation = 'horizontal' | 'vertical';\n\n// TODO: reduce duplication between CollapseDelayedVariantParams and CollapseVariantParams\nexport type CollapseDelayedVariantParams = {\n  /** Time (ms) for the size expand. Defaults to the durationNormal value (200 ms). */\n  enterSizeDuration?: number;\n\n  /** Time (ms) for the fade-in. Defaults to the enterSizeDuration param, to sync fade-in with expand. */\n  enterOpacityDuration?: number;\n\n  /** Time (ms) for the size collapse. Defaults to the enterSizeDuration param, for temporal symmetry.. */\n  exitSizeDuration?: number;\n\n  /** Defaults to the exitSizeDuration param, to sync the fade-out with the collapse. */\n  exitOpacityDuration?: number;\n\n  /** Time (ms) between the size expand start and the fade-in start. Defaults to `0`.  */\n  enterDelay?: number;\n\n  /** Time (ms) between the fade-out start and the size collapse start. Defaults to `0`.  */\n  exitDelay?: number;\n\n  /** Easing curve for the enter transition, shared by size and opacity. Defaults to the easeEaseMax value.  */\n  enterEasing?: string;\n\n  /** Easing curve for the exit transition, shared by size and opacity. Defaults to the enterEasing param. */\n  exitEasing?: string;\n};\n\nexport type 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\nexport type 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"],"names":[],"rangeMappings":"","mappings":"AAqCA,WAYE"}

node_modules/@fluentui/react-motion-components-preview/lib/components/Collapse/index.js

@@ -0,0 +1 @@
+export { Collapse, CollapseDelayed, CollapseRelaxed, CollapseSnappy, createCollapseDelayedPresence, createCollapsePresence } from './Collapse';

node_modules/@fluentui/react-motion-components-preview/lib/components/Collapse/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Collapse/index.ts"],"sourcesContent":["export {\n  Collapse,\n  CollapseDelayed,\n  CollapseRelaxed,\n  CollapseSnappy,\n  createCollapseDelayedPresence,\n  createCollapsePresence,\n} from './Collapse';\nexport type { CollapseRuntimeParams } from './collapse-types';\n"],"names":["Collapse","CollapseDelayed","CollapseRelaxed","CollapseSnappy","createCollapseDelayedPresence","createCollapsePresence"],"rangeMappings":"","mappings":"AAAA,SACEA,QAAQ,EACRC,eAAe,EACfC,eAAe,EACfC,cAAc,EACdC,6BAA6B,EAC7BC,sBAAsB,QACjB,aAAa"}

node_modules/@fluentui/react-motion-components-preview/lib/components/Fade/Fade.js

@@ -0,0 +1,21 @@
+import { motionTokens, createPresenceComponent } from '@fluentui/react-motion';
+import { fadeAtom } from '../../atoms/fade-atom';
+/** Define a presence motion for fade in/out  */ export const createFadePresence = ({ enterDuration = motionTokens.durationNormal, enterEasing = motionTokens.curveEasyEase, exitDuration = enterDuration, exitEasing = enterEasing } = {})=>({
+        enter: fadeAtom({
+            direction: 'enter',
+            duration: enterDuration,
+            easing: enterEasing
+        }),
+        exit: fadeAtom({
+            direction: 'exit',
+            duration: exitDuration,
+            easing: exitEasing
+        })
+    });
+/** A React component that applies fade in/out transitions to its children. */ export const Fade = createPresenceComponent(createFadePresence());
+export const FadeSnappy = createPresenceComponent(createFadePresence({
+    enterDuration: motionTokens.durationFast
+}));
+export const FadeRelaxed = createPresenceComponent(createFadePresence({
+    enterDuration: motionTokens.durationGentle
+}));

node_modules/@fluentui/react-motion-components-preview/lib/components/Fade/Fade.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Fade/Fade.ts"],"sourcesContent":["import { motionTokens, createPresenceComponent } from '@fluentui/react-motion';\nimport type { PresenceMotionCreator } from '../../types';\nimport { fadeAtom } from '../../atoms/fade-atom';\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: fadeAtom({ direction: 'enter', duration: enterDuration, easing: enterEasing }),\n  exit: fadeAtom({ direction: 'exit', duration: exitDuration, easing: exitEasing }),\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":["motionTokens","createPresenceComponent","fadeAtom","createFadePresence","enterDuration","durationNormal","enterEasing","curveEasyEase","exitDuration","exitEasing","enter","direction","duration","easing","exit","Fade","FadeSnappy","durationFast","FadeRelaxed","durationGentle"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,YAAY,EAAEC,uBAAuB,QAAQ,yBAAyB;AAE/E,SAASC,QAAQ,QAAQ,wBAAwB;AAgBjD,8CAA8C,GAC9C,OAAO,MAAMC,qBAA+D,CAAC,EAC3EC,gBAAgBJ,aAAaK,cAAc,EAC3CC,cAAcN,aAAaO,aAAa,EACxCC,eAAeJ,aAAa,EAC5BK,aAAaH,WAAW,EACzB,GAAG,CAAC,CAAC,GAAM,CAAA;QACVI,OAAOR,SAAS;YAAES,WAAW;YAASC,UAAUR;YAAeS,QAAQP;QAAY;QACnFQ,MAAMZ,SAAS;YAAES,WAAW;YAAQC,UAAUJ;YAAcK,QAAQJ;QAAW;IACjF,CAAA,EAAG;AAEH,4EAA4E,GAC5E,OAAO,MAAMM,OAAOd,wBAAwBE,sBAAsB;AAElE,OAAO,MAAMa,aAAaf,wBAAwBE,mBAAmB;IAAEC,eAAeJ,aAAaiB,YAAY;AAAC,IAAI;AAEpH,OAAO,MAAMC,cAAcjB,wBAAwBE,mBAAmB;IAAEC,eAAeJ,aAAamB,cAAc;AAAC,IAAI"}

node_modules/@fluentui/react-motion-components-preview/lib/components/Fade/index.js

@@ -0,0 +1 @@
+export { Fade, FadeRelaxed, FadeSnappy, createFadePresence } from './Fade';

node_modules/@fluentui/react-motion-components-preview/lib/components/Fade/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Fade/index.ts"],"sourcesContent":["export { Fade, FadeRelaxed, FadeSnappy, createFadePresence } from './Fade';\n"],"names":["Fade","FadeRelaxed","FadeSnappy","createFadePresence"],"rangeMappings":"","mappings":"AAAA,SAASA,IAAI,EAAEC,WAAW,EAAEC,UAAU,EAAEC,kBAAkB,QAAQ,SAAS"}

node_modules/@fluentui/react-motion-components-preview/lib/components/Scale/Scale.js

@@ -0,0 +1,54 @@
+import { motionTokens, createPresenceComponent } from '@fluentui/react-motion';
+/** Define a presence motion for scale in/out */ export const createScalePresence = ({ enterDuration = motionTokens.durationGentle, enterEasing = motionTokens.curveDecelerateMax, exitDuration = motionTokens.durationNormal, exitEasing = motionTokens.curveAccelerateMax } = {})=>({ animateOpacity = true })=>{
+        const fromOpacity = animateOpacity ? 0 : 1;
+        const toOpacity = 1;
+        const fromScale = 0.9; // Could be a custom param in the future
+        const toScale = 1;
+        const enterKeyframes = [
+            {
+                opacity: fromOpacity,
+                transform: `scale3d(${fromScale}, ${fromScale}, 1)`,
+                visibility: 'visible'
+            },
+            {
+                opacity: toOpacity,
+                transform: `scale3d(${toScale}, ${toScale}, 1)`
+            }
+        ];
+        const exitKeyframes = [
+            {
+                opacity: toOpacity,
+                transform: `scale3d(${toScale}, ${toScale}, 1)`
+            },
+            {
+                opacity: fromOpacity,
+                transform: `scale3d(${fromScale}, ${fromScale}, 1)`,
+                visibility: 'hidden'
+            }
+        ];
+        return {
+            enter: {
+                duration: enterDuration,
+                easing: enterEasing,
+                keyframes: enterKeyframes
+            },
+            exit: {
+                duration: exitDuration,
+                easing: exitEasing,
+                keyframes: exitKeyframes
+            }
+        };
+    };
+/** A React component that applies scale in/out transitions to its children. */ export const Scale = createPresenceComponent(createScalePresence());
+export const ScaleSnappy = createPresenceComponent(createScalePresence({
+    enterDuration: motionTokens.durationNormal,
+    enterEasing: motionTokens.curveDecelerateMax,
+    exitDuration: motionTokens.durationFast,
+    exitEasing: motionTokens.curveAccelerateMax
+}));
+export const ScaleRelaxed = createPresenceComponent(createScalePresence({
+    enterDuration: motionTokens.durationSlow,
+    enterEasing: motionTokens.curveDecelerateMax,
+    exitDuration: motionTokens.durationGentle,
+    exitEasing: motionTokens.curveAccelerateMax
+}));

node_modules/@fluentui/react-motion-components-preview/lib/components/Scale/Scale.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Scale/Scale.ts"],"sourcesContent":["import { motionTokens, createPresenceComponent } from '@fluentui/react-motion';\nimport { PresenceMotionFnCreator } from '../../types';\nimport { ScaleRuntimeParams_unstable, ScaleVariantParams_unstable } from './Scale.types';\n\n/** Define a presence motion for scale in/out */\nexport const createScalePresence: PresenceMotionFnCreator<ScaleVariantParams_unstable, ScaleRuntimeParams_unstable> =\n  ({\n    enterDuration = motionTokens.durationGentle,\n    enterEasing = motionTokens.curveDecelerateMax,\n    exitDuration = motionTokens.durationNormal,\n    exitEasing = motionTokens.curveAccelerateMax,\n  } = {}) =>\n  ({ 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    return {\n      enter: {\n        duration: enterDuration,\n        easing: enterEasing,\n        keyframes: enterKeyframes,\n      },\n      exit: { duration: exitDuration, easing: exitEasing, keyframes: exitKeyframes },\n    };\n  };\n\n/** A React component that applies scale in/out transitions to its children. */\nexport const Scale = createPresenceComponent(createScalePresence());\n\nexport const ScaleSnappy = createPresenceComponent(\n  createScalePresence({\n    enterDuration: motionTokens.durationNormal,\n    enterEasing: motionTokens.curveDecelerateMax,\n    exitDuration: motionTokens.durationFast,\n    exitEasing: motionTokens.curveAccelerateMax,\n  }),\n);\n\nexport const ScaleRelaxed = createPresenceComponent(\n  createScalePresence({\n    enterDuration: motionTokens.durationSlow,\n    enterEasing: motionTokens.curveDecelerateMax,\n    exitDuration: motionTokens.durationGentle,\n    exitEasing: motionTokens.curveAccelerateMax,\n  }),\n);\n"],"names":["motionTokens","createPresenceComponent","createScalePresence","enterDuration","durationGentle","enterEasing","curveDecelerateMax","exitDuration","durationNormal","exitEasing","curveAccelerateMax","animateOpacity","fromOpacity","toOpacity","fromScale","toScale","enterKeyframes","opacity","transform","visibility","exitKeyframes","enter","duration","easing","keyframes","exit","Scale","ScaleSnappy","durationFast","ScaleRelaxed","durationSlow"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SAASA,YAAY,EAAEC,uBAAuB,QAAQ,yBAAyB;AAI/E,8CAA8C,GAC9C,OAAO,MAAMC,sBACX,CAAC,EACCC,gBAAgBH,aAAaI,cAAc,EAC3CC,cAAcL,aAAaM,kBAAkB,EAC7CC,eAAeP,aAAaQ,cAAc,EAC1CC,aAAaT,aAAaU,kBAAkB,EAC7C,GAAG,CAAC,CAAC,GACN,CAAC,EAAEC,iBAAiB,IAAI,EAAE;QACxB,MAAMC,cAAcD,iBAAiB,IAAI;QACzC,MAAME,YAAY;QAClB,MAAMC,YAAY,KAAK,wCAAwC;QAC/D,MAAMC,UAAU;QAEhB,MAAMC,iBAAiB;YACrB;gBAAEC,SAASL;gBAAaM,WAAW,CAAC,QAAQ,EAAEJ,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;gBAAEK,YAAY;YAAU;YACnG;gBAAEF,SAASJ;gBAAWK,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;YAAC;SACvE;QAED,MAAMK,gBAAgB;YACpB;gBAAEH,SAASJ;gBAAWK,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;YAAC;YACtE;gBAAEE,SAASL;gBAAaM,WAAW,CAAC,QAAQ,EAAEJ,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;gBAAEK,YAAY;YAAS;SACnG;QACD,OAAO;YACLE,OAAO;gBACLC,UAAUnB;gBACVoB,QAAQlB;gBACRmB,WAAWR;YACb;YACAS,MAAM;gBAAEH,UAAUf;gBAAcgB,QAAQd;gBAAYe,WAAWJ;YAAc;QAC/E;IACF,EAAE;AAEJ,6EAA6E,GAC7E,OAAO,MAAMM,QAAQzB,wBAAwBC,uBAAuB;AAEpE,OAAO,MAAMyB,cAAc1B,wBACzBC,oBAAoB;IAClBC,eAAeH,aAAaQ,cAAc;IAC1CH,aAAaL,aAAaM,kBAAkB;IAC5CC,cAAcP,aAAa4B,YAAY;IACvCnB,YAAYT,aAAaU,kBAAkB;AAC7C,IACA;AAEF,OAAO,MAAMmB,eAAe5B,wBAC1BC,oBAAoB;IAClBC,eAAeH,aAAa8B,YAAY;IACxCzB,aAAaL,aAAaM,kBAAkB;IAC5CC,cAAcP,aAAaI,cAAc;IACzCK,YAAYT,aAAaU,kBAAkB;AAC7C,IACA"}

node_modules/@fluentui/react-motion-components-preview/lib/components/Scale/Scale.types.js

@@ -0,0 +1,3 @@
+// eslint-disable-next-line @typescript-eslint/naming-convention
+// eslint-disable-next-line @typescript-eslint/naming-convention
+export { };

node_modules/@fluentui/react-motion-components-preview/lib/components/Scale/Scale.types.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Scale/Scale.types.ts"],"sourcesContent":["// eslint-disable-next-line @typescript-eslint/naming-convention\nexport type ScaleVariantParams_unstable = {\n  /** Time (ms) for the enter transition. Defaults to the `durationNormal` value (200 ms). */\n  enterDuration?: number;\n\n  /** Easing curve for the enter transition. Defaults to the `easeEaseMax` value.  */\n  enterEasing?: string;\n\n  /** Time (ms) for the exit transition. Defaults to the `enterDuration` param for symmetry. */\n  exitDuration?: number;\n\n  /** Easing curve for the exit transition. Defaults to the `enterEasing` param for symmetry.  */\n  exitEasing?: string;\n};\n\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport type ScaleRuntimeParams_unstable = {\n  /** Whether to animate the opacity. Defaults to `true`. */\n  animateOpacity?: boolean;\n};\n"],"names":[],"rangeMappings":";;","mappings":"AAAA,gEAAgE;AAehE,gEAAgE;AAChE,WAGE"}

node_modules/@fluentui/react-motion-components-preview/lib/components/Scale/index.js

@@ -0,0 +1 @@
+export { Scale, ScaleRelaxed, ScaleSnappy, createScalePresence } from './Scale';

node_modules/@fluentui/react-motion-components-preview/lib/components/Scale/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Scale/index.ts"],"sourcesContent":["export { Scale, ScaleRelaxed, ScaleSnappy, createScalePresence } from './Scale';\n"],"names":["Scale","ScaleRelaxed","ScaleSnappy","createScalePresence"],"rangeMappings":"","mappings":"AAAA,SAASA,KAAK,EAAEC,YAAY,EAAEC,WAAW,EAAEC,mBAAmB,QAAQ,UAAU"}

node_modules/@fluentui/react-motion-components-preview/lib/index.js

@@ -0,0 +1,3 @@
+export { Collapse, CollapseSnappy, CollapseRelaxed, CollapseDelayed, createCollapsePresence, createCollapseDelayedPresence } from './components/Collapse';
+export { Fade, FadeSnappy, FadeRelaxed, createFadePresence } from './components/Fade';
+export { Scale, ScaleSnappy, ScaleRelaxed, createScalePresence } from './components/Scale';

node_modules/@fluentui/react-motion-components-preview/lib/index.js.map

@@ -0,0 +1 @@
+{"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, createScalePresence } from './components/Scale';\n"],"names":["Collapse","CollapseSnappy","CollapseRelaxed","CollapseDelayed","createCollapsePresence","createCollapseDelayedPresence","Fade","FadeSnappy","FadeRelaxed","createFadePresence","Scale","ScaleSnappy","ScaleRelaxed","createScalePresence"],"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,EAAEC,mBAAmB,QAAQ,qBAAqB"}

node_modules/@fluentui/react-motion-components-preview/lib/types.js

@@ -0,0 +1,11 @@
+/**
+ * This is a factory function that generates a motion function, which has variant params bound into it.
+ * The generated motion function accepts other runtime params that aren't locked into the variant, but supplied at runtime.
+ * This separation allows the variant to be defined once and reused with different runtime params which may be orthogonal to the variant params.
+ * For example, a variant may define the duration and easing of a transition, which are fixed for all instances of the variant,
+ * while the runtime params may give access to the target element, which is different for each instance.
+ *
+ * The generated motion function is also framework-independent, i.e. non-React.
+ * It can be turned into a React component using `createPresenceComponent`.
+ */ // TODO: move to @fluentui/react-motion when stable
+export { };

node_modules/@fluentui/react-motion-components-preview/lib/types.js.map

@@ -0,0 +1 @@
+{"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"}

node_modules/@fluentui/react-motion-components-preview/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "@fluentui/react-motion-components-preview",
+  "version": "0.4.3",
+  "description": "A preview package for Fluent UI motion components, providing a collection of components",
+  "main": "lib-commonjs/index.js",
+  "module": "lib/index.js",
+  "typings": "./dist/index.d.ts",
+  "sideEffects": false,
+  "files": [
+    "*.md",
+    "dist/*.d.ts",
+    "lib",
+    "lib-commonjs"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/microsoft/fluentui"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "@fluentui/eslint-plugin": "*",
+    "@fluentui/react-conformance": "*",
+    "@fluentui/react-conformance-griffel": "*",
+    "@fluentui/scripts-api-extractor": "*"
+  },
+  "dependencies": {
+    "@fluentui/react-motion": "*",
+    "@swc/helpers": "^0.5.1"
+  },
+  "peerDependencies": {
+    "@types/react": ">=16.14.0 <19.0.0",
+    "@types/react-dom": ">=16.9.0 <19.0.0",
+    "react": ">=16.14.0 <19.0.0",
+    "react-dom": ">=16.14.0 <19.0.0"
+  },
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "node": "./lib-commonjs/index.js",
+      "import": "./lib/index.js",
+      "require": "./lib-commonjs/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "beachball": {
+    "disallowedChangeTypes": [
+      "major",
+      "prerelease"
+    ]
+  }
+}