@fluentui/react-motion-components-preview 0.4.8 → 0.5.0

package/CHANGELOG.md

@@ -1,9 +1,18 @@
 # Change Log - @fluentui/react-motion-components-preview
 
-This log was last generated on Wed, 22 Jan 2025 14:00:19 GMT and should not be manually modified.
+This log was last generated on Wed, 14 May 2025 18:45:46 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [0.5.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion-components-preview_v0.5.0)
+
+Wed, 14 May 2025 18:45:46 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-motion-components-preview_v0.4.3..@fluentui/react-motion-components-preview_v0.5.0)
+
+### Minor changes
+
+- refactor(motion): simplify Fade & Scale variant creation with createPresenceComponentVariant ([PR #34042](https://github.com/microsoft/fluentui/pull/34042) by robertpenner@microsoft.com)
+
 ## [0.4.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion-components-preview_v0.4.3)
 
 Wed, 22 Jan 2025 14:00:19 GMT 

package/dist/index.d.ts

@@ -1,6 +1,5 @@
 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. */
@@ -57,39 +56,24 @@ export declare const createCollapseDelayedPresence: PresenceMotionFnCreator<Coll
 /** 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 Fade: PresenceComponent<FadeVariantParams>;
 
-export declare const FadeRelaxed: PresenceComponent<    {}>;
+export declare const FadeRelaxed: PresenceComponent<FadeVariantParams>;
 
-export declare const FadeSnappy: PresenceComponent<    {}>;
+export declare const FadeSnappy: PresenceComponent<FadeVariantParams>;
 
 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. */
+    duration?: number;
+    /** Easing curve for the enter transition (fade-in). Defaults to the `curveEasyEase` value.  */
+    easing?: string;
+    /** Time (ms) for the exit transition (fade-out). Defaults to the `duration` param for symmetry. */
     exitDuration?: number;
-    /** Easing curve for the exit transition (fade-out). Defaults to the `enterEasing` param for symmetry.  */
+    /** Easing curve for the exit transition (fade-out). Defaults to the `easing` 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.
@@ -103,26 +87,25 @@ declare type PresenceMotionCreator<MotionVariantParams extends Record<string, Mo
 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 Scale: PresenceComponent<ScaleVariantParams>;
 
-export declare const ScaleRelaxed: PresenceComponent<ScaleRuntimeParams_unstable>;
+export declare const ScaleRelaxed: PresenceComponent<ScaleVariantParams>;
 
-declare type ScaleRuntimeParams_unstable = {
-    /** Whether to animate the opacity. Defaults to `true`. */
-    animateOpacity?: boolean;
-};
-
-export declare const ScaleSnappy: PresenceComponent<ScaleRuntimeParams_unstable>;
+export declare const ScaleSnappy: PresenceComponent<ScaleVariantParams>;
 
-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. */
+declare type ScaleVariantParams = {
+    /** Time (ms) for the enter transition (scale-in). Defaults to the `durationNormal` value (200 ms). */
+    duration?: number;
+    /** Easing curve for the enter transition (scale-in). Defaults to the `curveDecelerateMid` value.  */
+    easing?: string;
+    /** Time (ms) for the exit transition (scale-out). Defaults to the `duration` param for symmetry. */
     exitDuration?: number;
-    /** Easing curve for the exit transition. Defaults to the `enterEasing` param for symmetry.  */
+    /** Easing curve for the exit transition (scale-out). Defaults to the `curveAccelerateMid` value.  */
     exitEasing?: string;
+    /** The scale value to animate from. Defaults to `0.9`. */
+    fromScale?: number;
+    /** Whether to animate the opacity. Defaults to `true`. */
+    animateOpacity?: boolean;
 };
 
 export { }

package/lib/components/Fade/Fade.js

@@ -1,21 +1,23 @@
-import { motionTokens, createPresenceComponent } from '@fluentui/react-motion';
+import { motionTokens, createPresenceComponent, createPresenceComponentVariant } 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 } = {})=>({
+/** Define a presence motion for fade in/out  */ export const fadePresenceFn = ({ duration = motionTokens.durationNormal, easing = motionTokens.curveEasyEase, exitDuration = duration, exitEasing = easing })=>{
+    return {
         enter: fadeAtom({
             direction: 'enter',
-            duration: enterDuration,
-            easing: enterEasing
+            duration,
+            easing
         }),
         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
-}));
+    };
+};
+/** A React component that applies fade in/out transitions to its children. */ export const Fade = createPresenceComponent(fadePresenceFn);
+export const FadeSnappy = createPresenceComponentVariant(Fade, {
+    duration: motionTokens.durationFast
+});
+export const FadeRelaxed = createPresenceComponentVariant(Fade, {
+    duration: motionTokens.durationGentle
+});

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

@@ -1 +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"}
+{"version":3,"sources":["../src/components/Fade/Fade.ts"],"sourcesContent":["import {\n  motionTokens,\n  createPresenceComponent,\n  PresenceMotionFn,\n  createPresenceComponentVariant,\n} from '@fluentui/react-motion';\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  duration?: number;\n\n  /** Easing curve for the enter transition (fade-in). Defaults to the `curveEasyEase` value.  */\n  easing?: string;\n\n  /** Time (ms) for the exit transition (fade-out). Defaults to the `duration` param for symmetry. */\n  exitDuration?: number;\n\n  /** Easing curve for the exit transition (fade-out). Defaults to the `easing` param for symmetry.  */\n  exitEasing?: string;\n};\n\n/** Define a presence motion for fade in/out  */\nexport const fadePresenceFn: PresenceMotionFn<FadeVariantParams> = ({\n  duration = motionTokens.durationNormal,\n  easing = motionTokens.curveEasyEase,\n  exitDuration = duration,\n  exitEasing = easing,\n}) => {\n  return {\n    enter: fadeAtom({ direction: 'enter', duration, easing }),\n    exit: fadeAtom({ direction: 'exit', duration: exitDuration, easing: exitEasing }),\n  };\n};\n\n/** A React component that applies fade in/out transitions to its children. */\nexport const Fade = createPresenceComponent(fadePresenceFn);\n\nexport const FadeSnappy = createPresenceComponentVariant(Fade, { duration: motionTokens.durationFast });\n\nexport const FadeRelaxed = createPresenceComponentVariant(Fade, { duration: motionTokens.durationGentle });\n"],"names":["motionTokens","createPresenceComponent","createPresenceComponentVariant","fadeAtom","fadePresenceFn","duration","durationNormal","easing","curveEasyEase","exitDuration","exitEasing","enter","direction","exit","Fade","FadeSnappy","durationFast","FadeRelaxed","durationGentle"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SACEA,YAAY,EACZC,uBAAuB,EAEvBC,8BAA8B,QACzB,yBAAyB;AAChC,SAASC,QAAQ,QAAQ,wBAAwB;AAgBjD,8CAA8C,GAC9C,OAAO,MAAMC,iBAAsD,CAAC,EAClEC,WAAWL,aAAaM,cAAc,EACtCC,SAASP,aAAaQ,aAAa,EACnCC,eAAeJ,QAAQ,EACvBK,aAAaH,MAAM,EACpB;IACC,OAAO;QACLI,OAAOR,SAAS;YAAES,WAAW;YAASP;YAAUE;QAAO;QACvDM,MAAMV,SAAS;YAAES,WAAW;YAAQP,UAAUI;YAAcF,QAAQG;QAAW;IACjF;AACF,EAAE;AAEF,4EAA4E,GAC5E,OAAO,MAAMI,OAAOb,wBAAwBG,gBAAgB;AAE5D,OAAO,MAAMW,aAAab,+BAA+BY,MAAM;IAAET,UAAUL,aAAagB,YAAY;AAAC,GAAG;AAExG,OAAO,MAAMC,cAAcf,+BAA+BY,MAAM;IAAET,UAAUL,aAAakB,cAAc;AAAC,GAAG"}

package/lib/components/Fade/index.js

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

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

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

package/lib/components/Scale/Scale.js

@@ -1,54 +1,53 @@
-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
-            }
-        };
+import { motionTokens, createPresenceComponent, createPresenceComponentVariant } from '@fluentui/react-motion';
+/** Define a presence motion for scale in/out */ const scalePresenceFn = ({ duration = motionTokens.durationNormal, easing = motionTokens.curveDecelerateMid, exitDuration = duration, exitEasing = motionTokens.curveAccelerateMid, fromScale = 0.9, animateOpacity = true })=>{
+    const fromOpacity = animateOpacity ? 0 : 1;
+    const toOpacity = 1;
+    const toScale = 1;
+    // TODO: use fadeAtom
+    // TODO: make scaleAtom
+    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,
+            easing,
+            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,
+};
+/** A React component that applies scale in/out transitions to its children. */ export const Scale = createPresenceComponent(scalePresenceFn);
+export const ScaleSnappy = createPresenceComponentVariant(Scale, {
+    duration: motionTokens.durationFast,
+    easing: motionTokens.curveDecelerateMax,
     exitEasing: motionTokens.curveAccelerateMax
-}));
-export const ScaleRelaxed = createPresenceComponent(createScalePresence({
-    enterDuration: motionTokens.durationSlow,
-    enterEasing: motionTokens.curveDecelerateMax,
-    exitDuration: motionTokens.durationGentle,
-    exitEasing: motionTokens.curveAccelerateMax
-}));
+});
+export const ScaleRelaxed = createPresenceComponentVariant(Scale, {
+    duration: motionTokens.durationGentle,
+    easing: motionTokens.curveDecelerateMid,
+    exitEasing: motionTokens.curveAccelerateMid
+});

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

@@ -1 +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"}
+{"version":3,"sources":["../src/components/Scale/Scale.ts"],"sourcesContent":["import {\n  motionTokens,\n  createPresenceComponent,\n  PresenceMotionFn,\n  createPresenceComponentVariant,\n} from '@fluentui/react-motion';\n\ntype ScaleVariantParams = {\n  /** Time (ms) for the enter transition (scale-in). Defaults to the `durationNormal` value (200 ms). */\n  duration?: number;\n\n  /** Easing curve for the enter transition (scale-in). Defaults to the `curveDecelerateMid` value.  */\n  easing?: string;\n\n  /** Time (ms) for the exit transition (scale-out). Defaults to the `duration` param for symmetry. */\n  exitDuration?: number;\n\n  /** Easing curve for the exit transition (scale-out). Defaults to the `curveAccelerateMid` value.  */\n  exitEasing?: string;\n\n  /** The scale value to animate from. Defaults to `0.9`. */\n  fromScale?: number;\n\n  /** Whether to animate the opacity. Defaults to `true`. */\n  animateOpacity?: boolean;\n};\n\n/** Define a presence motion for scale in/out */\nconst scalePresenceFn: PresenceMotionFn<ScaleVariantParams> = ({\n  duration = motionTokens.durationNormal,\n  easing = motionTokens.curveDecelerateMid,\n  exitDuration = duration,\n  exitEasing = motionTokens.curveAccelerateMid,\n  fromScale = 0.9,\n  animateOpacity = true,\n}) => {\n  const fromOpacity = animateOpacity ? 0 : 1;\n  const toOpacity = 1;\n  const toScale = 1;\n\n  // TODO: use fadeAtom\n  // TODO: make scaleAtom\n  const enterKeyframes = [\n    { opacity: fromOpacity, transform: `scale3d(${fromScale}, ${fromScale}, 1)`, visibility: 'visible' },\n    { opacity: toOpacity, transform: `scale3d(${toScale}, ${toScale}, 1)` },\n  ];\n\n  const exitKeyframes = [\n    { opacity: toOpacity, transform: `scale3d(${toScale}, ${toScale}, 1)` },\n    { opacity: fromOpacity, transform: `scale3d(${fromScale}, ${fromScale}, 1)`, visibility: 'hidden' },\n  ];\n\n  return {\n    enter: {\n      duration,\n      easing,\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(scalePresenceFn);\n\nexport const ScaleSnappy = createPresenceComponentVariant(Scale, {\n  duration: motionTokens.durationFast,\n  easing: motionTokens.curveDecelerateMax,\n  exitEasing: motionTokens.curveAccelerateMax,\n});\n\nexport const ScaleRelaxed = createPresenceComponentVariant(Scale, {\n  duration: motionTokens.durationGentle,\n  easing: motionTokens.curveDecelerateMid,\n  exitEasing: motionTokens.curveAccelerateMid,\n});\n"],"names":["motionTokens","createPresenceComponent","createPresenceComponentVariant","scalePresenceFn","duration","durationNormal","easing","curveDecelerateMid","exitDuration","exitEasing","curveAccelerateMid","fromScale","animateOpacity","fromOpacity","toOpacity","toScale","enterKeyframes","opacity","transform","visibility","exitKeyframes","enter","keyframes","exit","Scale","ScaleSnappy","durationFast","curveDecelerateMax","curveAccelerateMax","ScaleRelaxed","durationGentle"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SACEA,YAAY,EACZC,uBAAuB,EAEvBC,8BAA8B,QACzB,yBAAyB;AAsBhC,8CAA8C,GAC9C,MAAMC,kBAAwD,CAAC,EAC7DC,WAAWJ,aAAaK,cAAc,EACtCC,SAASN,aAAaO,kBAAkB,EACxCC,eAAeJ,QAAQ,EACvBK,aAAaT,aAAaU,kBAAkB,EAC5CC,YAAY,GAAG,EACfC,iBAAiB,IAAI,EACtB;IACC,MAAMC,cAAcD,iBAAiB,IAAI;IACzC,MAAME,YAAY;IAClB,MAAMC,UAAU;IAEhB,qBAAqB;IACrB,uBAAuB;IACvB,MAAMC,iBAAiB;QACrB;YAAEC,SAASJ;YAAaK,WAAW,CAAC,QAAQ,EAAEP,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;YAAEQ,YAAY;QAAU;QACnG;YAAEF,SAASH;YAAWI,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;QAAC;KACvE;IAED,MAAMK,gBAAgB;QACpB;YAAEH,SAASH;YAAWI,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;QAAC;QACtE;YAAEE,SAASJ;YAAaK,WAAW,CAAC,QAAQ,EAAEP,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;YAAEQ,YAAY;QAAS;KACnG;IAED,OAAO;QACLE,OAAO;YACLjB;YACAE;YACAgB,WAAWN;QACb;QACAO,MAAM;YAAEnB,UAAUI;YAAcF,QAAQG;YAAYa,WAAWF;QAAc;IAC/E;AACF;AAEA,6EAA6E,GAC7E,OAAO,MAAMI,QAAQvB,wBAAwBE,iBAAiB;AAE9D,OAAO,MAAMsB,cAAcvB,+BAA+BsB,OAAO;IAC/DpB,UAAUJ,aAAa0B,YAAY;IACnCpB,QAAQN,aAAa2B,kBAAkB;IACvClB,YAAYT,aAAa4B,kBAAkB;AAC7C,GAAG;AAEH,OAAO,MAAMC,eAAe3B,+BAA+BsB,OAAO;IAChEpB,UAAUJ,aAAa8B,cAAc;IACrCxB,QAAQN,aAAaO,kBAAkB;IACvCE,YAAYT,aAAaU,kBAAkB;AAC7C,GAAG"}

package/lib/components/Scale/index.js

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

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

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

package/lib/index.js

@@ -1,3 +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';
+export { Fade, FadeSnappy, FadeRelaxed } from './components/Fade';
+export { Scale, ScaleSnappy, ScaleRelaxed } from './components/Scale';

package/lib/index.js.map

@@ -1 +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"}
+{"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 } from './components/Fade';\nexport { Scale, ScaleSnappy, ScaleRelaxed } from './components/Scale';\n"],"names":["Collapse","CollapseSnappy","CollapseRelaxed","CollapseDelayed","createCollapsePresence","createCollapseDelayedPresence","Fade","FadeSnappy","FadeRelaxed","Scale","ScaleSnappy","ScaleRelaxed"],"rangeMappings":";;","mappings":"AAAA,SACEA,QAAQ,EACRC,cAAc,EACdC,eAAe,EACfC,eAAe,EACfC,sBAAsB,EACtBC,6BAA6B,QACxB,wBAAwB;AAE/B,SAASC,IAAI,EAAEC,UAAU,EAAEC,WAAW,QAAQ,oBAAoB;AAClE,SAASC,KAAK,EAAEC,WAAW,EAAEC,YAAY,QAAQ,qBAAqB"}

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

@@ -18,28 +18,30 @@ _export(exports, {
     FadeSnappy: function() {
         return FadeSnappy;
     },
-    createFadePresence: function() {
-        return createFadePresence;
+    fadePresenceFn: function() {
+        return fadePresenceFn;
     }
 });
 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 } = {})=>({
+const fadePresenceFn = ({ duration = _reactmotion.motionTokens.durationNormal, easing = _reactmotion.motionTokens.curveEasyEase, exitDuration = duration, exitEasing = easing })=>{
+    return {
         enter: (0, _fadeatom.fadeAtom)({
             direction: 'enter',
-            duration: enterDuration,
-            easing: enterEasing
+            duration,
+            easing
         }),
         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
-}));
+    };
+};
+const Fade = (0, _reactmotion.createPresenceComponent)(fadePresenceFn);
+const FadeSnappy = (0, _reactmotion.createPresenceComponentVariant)(Fade, {
+    duration: _reactmotion.motionTokens.durationFast
+});
+const FadeRelaxed = (0, _reactmotion.createPresenceComponentVariant)(Fade, {
+    duration: _reactmotion.motionTokens.durationGentle
+});

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

@@ -1 +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"}
+{"version":3,"sources":["../src/components/Fade/Fade.ts"],"sourcesContent":["import {\n  motionTokens,\n  createPresenceComponent,\n  PresenceMotionFn,\n  createPresenceComponentVariant,\n} from '@fluentui/react-motion';\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  duration?: number;\n\n  /** Easing curve for the enter transition (fade-in). Defaults to the `curveEasyEase` value.  */\n  easing?: string;\n\n  /** Time (ms) for the exit transition (fade-out). Defaults to the `duration` param for symmetry. */\n  exitDuration?: number;\n\n  /** Easing curve for the exit transition (fade-out). Defaults to the `easing` param for symmetry.  */\n  exitEasing?: string;\n};\n\n/** Define a presence motion for fade in/out  */\nexport const fadePresenceFn: PresenceMotionFn<FadeVariantParams> = ({\n  duration = motionTokens.durationNormal,\n  easing = motionTokens.curveEasyEase,\n  exitDuration = duration,\n  exitEasing = easing,\n}) => {\n  return {\n    enter: fadeAtom({ direction: 'enter', duration, easing }),\n    exit: fadeAtom({ direction: 'exit', duration: exitDuration, easing: exitEasing }),\n  };\n};\n\n/** A React component that applies fade in/out transitions to its children. */\nexport const Fade = createPresenceComponent(fadePresenceFn);\n\nexport const FadeSnappy = createPresenceComponentVariant(Fade, { duration: motionTokens.durationFast });\n\nexport const FadeRelaxed = createPresenceComponentVariant(Fade, { duration: motionTokens.durationGentle });\n"],"names":["Fade","FadeRelaxed","FadeSnappy","fadePresenceFn","duration","motionTokens","durationNormal","easing","curveEasyEase","exitDuration","exitEasing","enter","fadeAtom","direction","exit","createPresenceComponent","createPresenceComponentVariant","durationFast","durationGentle"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAoCaA,IAAI;eAAJA;;IAIAC,WAAW;eAAXA;;IAFAC,UAAU;eAAVA;;IAfAC,cAAc;eAAdA;;;6BAlBN;0BACkB;AAiBlB,MAAMA,iBAAsD,CAAC,EAClEC,WAAWC,yBAAY,CAACC,cAAc,EACtCC,SAASF,yBAAY,CAACG,aAAa,EACnCC,eAAeL,QAAQ,EACvBM,aAAaH,MAAM,EACpB;IACC,OAAO;QACLI,OAAOC,IAAAA,kBAAQ,EAAC;YAAEC,WAAW;YAAST;YAAUG;QAAO;QACvDO,MAAMF,IAAAA,kBAAQ,EAAC;YAAEC,WAAW;YAAQT,UAAUK;YAAcF,QAAQG;QAAW;IACjF;AACF;AAGO,MAAMV,OAAOe,IAAAA,oCAAuB,EAACZ;AAErC,MAAMD,aAAac,IAAAA,2CAA8B,EAAChB,MAAM;IAAEI,UAAUC,yBAAY,CAACY,YAAY;AAAC;AAE9F,MAAMhB,cAAce,IAAAA,2CAA8B,EAAChB,MAAM;IAAEI,UAAUC,yBAAY,CAACa,cAAc;AAAC"}

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

@@ -17,9 +17,6 @@ _export(exports, {
     },
     FadeSnappy: function() {
         return _Fade.FadeSnappy;
-    },
-    createFadePresence: function() {
-        return _Fade.createFadePresence;
     }
 });
 const _Fade = require("./Fade");

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

@@ -1 +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"}
+{"version":3,"sources":["../src/components/Fade/index.ts"],"sourcesContent":["export { Fade, FadeRelaxed, FadeSnappy } from './Fade';\n"],"names":["Fade","FadeRelaxed","FadeSnappy"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,IAAI;eAAJA,UAAI;;IAAEC,WAAW;eAAXA,iBAAW;;IAAEC,UAAU;eAAVA,gBAAU;;;sBAAQ"}

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

@@ -17,62 +17,58 @@ _export(exports, {
     },
     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
-            }
-        };
+/** Define a presence motion for scale in/out */ const scalePresenceFn = ({ duration = _reactmotion.motionTokens.durationNormal, easing = _reactmotion.motionTokens.curveDecelerateMid, exitDuration = duration, exitEasing = _reactmotion.motionTokens.curveAccelerateMid, fromScale = 0.9, animateOpacity = true })=>{
+    const fromOpacity = animateOpacity ? 0 : 1;
+    const toOpacity = 1;
+    const toScale = 1;
+    // TODO: use fadeAtom
+    // TODO: make scaleAtom
+    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,
+            easing,
+            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,
+};
+const Scale = (0, _reactmotion.createPresenceComponent)(scalePresenceFn);
+const ScaleSnappy = (0, _reactmotion.createPresenceComponentVariant)(Scale, {
+    duration: _reactmotion.motionTokens.durationFast,
+    easing: _reactmotion.motionTokens.curveDecelerateMax,
     exitEasing: _reactmotion.motionTokens.curveAccelerateMax
-}));
+});
+const ScaleRelaxed = (0, _reactmotion.createPresenceComponentVariant)(Scale, {
+    duration: _reactmotion.motionTokens.durationGentle,
+    easing: _reactmotion.motionTokens.curveDecelerateMid,
+    exitEasing: _reactmotion.motionTokens.curveAccelerateMid
+});

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

@@ -1 +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"}
+{"version":3,"sources":["../src/components/Scale/Scale.ts"],"sourcesContent":["import {\n  motionTokens,\n  createPresenceComponent,\n  PresenceMotionFn,\n  createPresenceComponentVariant,\n} from '@fluentui/react-motion';\n\ntype ScaleVariantParams = {\n  /** Time (ms) for the enter transition (scale-in). Defaults to the `durationNormal` value (200 ms). */\n  duration?: number;\n\n  /** Easing curve for the enter transition (scale-in). Defaults to the `curveDecelerateMid` value.  */\n  easing?: string;\n\n  /** Time (ms) for the exit transition (scale-out). Defaults to the `duration` param for symmetry. */\n  exitDuration?: number;\n\n  /** Easing curve for the exit transition (scale-out). Defaults to the `curveAccelerateMid` value.  */\n  exitEasing?: string;\n\n  /** The scale value to animate from. Defaults to `0.9`. */\n  fromScale?: number;\n\n  /** Whether to animate the opacity. Defaults to `true`. */\n  animateOpacity?: boolean;\n};\n\n/** Define a presence motion for scale in/out */\nconst scalePresenceFn: PresenceMotionFn<ScaleVariantParams> = ({\n  duration = motionTokens.durationNormal,\n  easing = motionTokens.curveDecelerateMid,\n  exitDuration = duration,\n  exitEasing = motionTokens.curveAccelerateMid,\n  fromScale = 0.9,\n  animateOpacity = true,\n}) => {\n  const fromOpacity = animateOpacity ? 0 : 1;\n  const toOpacity = 1;\n  const toScale = 1;\n\n  // TODO: use fadeAtom\n  // TODO: make scaleAtom\n  const enterKeyframes = [\n    { opacity: fromOpacity, transform: `scale3d(${fromScale}, ${fromScale}, 1)`, visibility: 'visible' },\n    { opacity: toOpacity, transform: `scale3d(${toScale}, ${toScale}, 1)` },\n  ];\n\n  const exitKeyframes = [\n    { opacity: toOpacity, transform: `scale3d(${toScale}, ${toScale}, 1)` },\n    { opacity: fromOpacity, transform: `scale3d(${fromScale}, ${fromScale}, 1)`, visibility: 'hidden' },\n  ];\n\n  return {\n    enter: {\n      duration,\n      easing,\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(scalePresenceFn);\n\nexport const ScaleSnappy = createPresenceComponentVariant(Scale, {\n  duration: motionTokens.durationFast,\n  easing: motionTokens.curveDecelerateMax,\n  exitEasing: motionTokens.curveAccelerateMax,\n});\n\nexport const ScaleRelaxed = createPresenceComponentVariant(Scale, {\n  duration: motionTokens.durationGentle,\n  easing: motionTokens.curveDecelerateMid,\n  exitEasing: motionTokens.curveAccelerateMid,\n});\n"],"names":["Scale","ScaleRelaxed","ScaleSnappy","scalePresenceFn","duration","motionTokens","durationNormal","easing","curveDecelerateMid","exitDuration","exitEasing","curveAccelerateMid","fromScale","animateOpacity","fromOpacity","toOpacity","toScale","enterKeyframes","opacity","transform","visibility","exitKeyframes","enter","keyframes","exit","createPresenceComponent","createPresenceComponentVariant","durationFast","curveDecelerateMax","curveAccelerateMax","durationGentle"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IA+DaA,KAAK;eAALA;;IAQAC,YAAY;eAAZA;;IANAC,WAAW;eAAXA;;;6BA5DN;AAsBP,8CAA8C,GAC9C,MAAMC,kBAAwD,CAAC,EAC7DC,WAAWC,yBAAY,CAACC,cAAc,EACtCC,SAASF,yBAAY,CAACG,kBAAkB,EACxCC,eAAeL,QAAQ,EACvBM,aAAaL,yBAAY,CAACM,kBAAkB,EAC5CC,YAAY,GAAG,EACfC,iBAAiB,IAAI,EACtB;IACC,MAAMC,cAAcD,iBAAiB,IAAI;IACzC,MAAME,YAAY;IAClB,MAAMC,UAAU;IAEhB,qBAAqB;IACrB,uBAAuB;IACvB,MAAMC,iBAAiB;QACrB;YAAEC,SAASJ;YAAaK,WAAW,CAAC,QAAQ,EAAEP,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;YAAEQ,YAAY;QAAU;QACnG;YAAEF,SAASH;YAAWI,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;QAAC;KACvE;IAED,MAAMK,gBAAgB;QACpB;YAAEH,SAASH;YAAWI,WAAW,CAAC,QAAQ,EAAEH,QAAQ,EAAE,EAAEA,QAAQ,IAAI,CAAC;QAAC;QACtE;YAAEE,SAASJ;YAAaK,WAAW,CAAC,QAAQ,EAAEP,UAAU,EAAE,EAAEA,UAAU,IAAI,CAAC;YAAEQ,YAAY;QAAS;KACnG;IAED,OAAO;QACLE,OAAO;YACLlB;YACAG;YACAgB,WAAWN;QACb;QACAO,MAAM;YAAEpB,UAAUK;YAAcF,QAAQG;YAAYa,WAAWF;QAAc;IAC/E;AACF;AAGO,MAAMrB,QAAQyB,IAAAA,oCAAuB,EAACtB;AAEtC,MAAMD,cAAcwB,IAAAA,2CAA8B,EAAC1B,OAAO;IAC/DI,UAAUC,yBAAY,CAACsB,YAAY;IACnCpB,QAAQF,yBAAY,CAACuB,kBAAkB;IACvClB,YAAYL,yBAAY,CAACwB,kBAAkB;AAC7C;AAEO,MAAM5B,eAAeyB,IAAAA,2CAA8B,EAAC1B,OAAO;IAChEI,UAAUC,yBAAY,CAACyB,cAAc;IACrCvB,QAAQF,yBAAY,CAACG,kBAAkB;IACvCE,YAAYL,yBAAY,CAACM,kBAAkB;AAC7C"}

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

@@ -17,9 +17,6 @@ _export(exports, {
     },
     ScaleSnappy: function() {
         return _Scale.ScaleSnappy;
-    },
-    createScalePresence: function() {
-        return _Scale.createScalePresence;
     }
 });
 const _Scale = require("./Scale");

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

@@ -1 +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"}
+{"version":3,"sources":["../src/components/Scale/index.ts"],"sourcesContent":["export { Scale, ScaleRelaxed, ScaleSnappy } from './Scale';\n"],"names":["Scale","ScaleRelaxed","ScaleSnappy"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAASA,KAAK;eAALA,YAAK;;IAAEC,YAAY;eAAZA,mBAAY;;IAAEC,WAAW;eAAXA,kBAAW;;;uBAAQ"}

package/lib-commonjs/index.js

@@ -44,12 +44,6 @@ _export(exports, {
     },
     createCollapsePresence: function() {
         return _Collapse.createCollapsePresence;
-    },
-    createFadePresence: function() {
-        return _Fade.createFadePresence;
-    },
-    createScalePresence: function() {
-        return _Scale.createScalePresence;
     }
 });
 const _Collapse = require("./components/Collapse");

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  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"}
+{"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 } from './components/Fade';\nexport { Scale, ScaleSnappy, ScaleRelaxed } from './components/Scale';\n"],"names":["Collapse","CollapseDelayed","CollapseRelaxed","CollapseSnappy","Fade","FadeRelaxed","FadeSnappy","Scale","ScaleRelaxed","ScaleSnappy","createCollapseDelayedPresence","createCollapsePresence"],"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;;;0BAEjB;sBAEuC;uBACG"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-motion-components-preview",
-  "version": "0.4.8",
+  "version": "0.5.0",
   "description": "A preview package for Fluent UI motion components, providing a collection of components",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",

package/lib/components/Scale/Scale.types.js

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

package/lib/components/Scale/Scale.types.js.map

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

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

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

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

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