@fluentui/react-motion 9.3.0 → 9.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,12 +1,27 @@
1
1
  # Change Log - @fluentui/react-motion
2
2
 
3
- This log was last generated on Mon, 15 Jul 2024 17:20:19 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 23 Jul 2024 20:09:18 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.4.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion_v9.4.0)
8
+
9
+ Tue, 23 Jul 2024 20:09:18 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-motion_v9.3.0..@fluentui/react-motion_v9.4.0)
11
+
12
+ ### Minor changes
13
+
14
+ - feat: add presenceMotionSlot() API ([PR #31984](https://github.com/microsoft/fluentui/pull/31984) by olfedias@microsoft.com)
15
+ - Bump @fluentui/react-shared-contexts to v9.20.0 ([PR #32067](https://github.com/microsoft/fluentui/pull/32067) by beachball)
16
+ - Bump @fluentui/react-utilities to v9.18.13 ([PR #32067](https://github.com/microsoft/fluentui/pull/32067) by beachball)
17
+
18
+ ### Patches
19
+
20
+ - fix: improve Web Animations API detection in tests ([PR #32029](https://github.com/microsoft/fluentui/pull/32029) by olfedias@microsoft.com)
21
+
7
22
  ## [9.3.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-motion_v9.3.0)
8
23
 
9
- Mon, 15 Jul 2024 17:20:19 GMT
24
+ Mon, 15 Jul 2024 17:25:35 GMT
10
25
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-motion_v9.2.2..@fluentui/react-motion_v9.3.0)
11
26
 
12
27
  ### Minor changes
package/dist/index.d.ts CHANGED
@@ -1,4 +1,6 @@
1
1
  import * as React_2 from 'react';
2
+ import { SlotComponentType } from '@fluentui/react-utilities';
3
+ import { SlotRenderFunction } from '@fluentui/react-utilities';
2
4
 
3
5
  export declare type AtomMotion = {
4
6
  keyframes: Keyframe[];
@@ -202,6 +204,28 @@ export declare type PresenceMotionFn<MotionParams extends Record<string, MotionP
202
204
  element: HTMLElement;
203
205
  } & MotionParams) => PresenceMotion;
204
206
 
207
+ export declare function presenceMotionSlot<MotionParams extends Record<string, MotionParam> = {}>(motion: PresenceMotionSlotProps<MotionParams> | null | undefined, options: {
208
+ elementType: React_2.FC<PresenceComponentProps & MotionParams>;
209
+ defaultProps: PresenceMotionSlotRenderProps & MotionParams;
210
+ }): SlotComponentType<PresenceMotionSlotRenderProps & MotionParams>;
211
+
212
+ export declare type PresenceMotionSlotProps<MotionParams extends Record<string, MotionParam> = {}> = Pick<PresenceComponentProps, 'imperativeRef' | 'onMotionFinish' | 'onMotionStart'> & {
213
+ /**
214
+ * @deprecated Do not use. Presence Motion Slots do not support intrinsic elements.
215
+ *
216
+ * If you want to override the animation, use the children render function instead.
217
+ */
218
+ as?: keyof JSX.IntrinsicElements;
219
+ children?: SlotRenderFunction<PresenceMotionSlotRenderProps & MotionParams & {
220
+ children: React_2.ReactElement;
221
+ }>;
222
+ };
223
+
224
+ /**
225
+ * @internal
226
+ */
227
+ declare type PresenceMotionSlotRenderProps = Pick<PresenceComponentProps, 'appear' | 'onMotionFinish' | 'onMotionStart' | 'unmountOnExit' | 'visible'>;
228
+
205
229
  /**
206
230
  * @internal
207
231
  *
@@ -1,53 +1,5 @@
1
- var _document_defaultView;
2
1
  import * as React from 'react';
3
- // eslint-disable-next-line no-restricted-globals
4
- const win = typeof document === 'object' ? (_document_defaultView = document.defaultView) === null || _document_defaultView === void 0 ? void 0 : _document_defaultView.window : undefined;
5
- // Heads up! "Element." is a side-effect for minifiers, should be kept as IIFE to avoid leaking after minification.
6
- const SUPPORTS_WEB_ANIMATIONS = /*@__PURE__*/ (()=>win && typeof win.Element.prototype.animate === 'function')();
7
- /**
8
- * In test environments, this hook is used to delay the execution of a callback until the next render. This is necessary
9
- * to ensure that the callback is not executed synchronously, which would cause the test to fail.
10
- *
11
- * @see https://github.com/microsoft/fluentui/issues/31701
12
- */ function useAnimateAtomsInTestEnvironment() {
13
- const [count, setCount] = React.useState(0);
14
- const callbackRef = React.useRef();
15
- React.useEffect(()=>{
16
- if (count > 0) {
17
- var _callbackRef_current;
18
- (_callbackRef_current = callbackRef.current) === null || _callbackRef_current === void 0 ? void 0 : _callbackRef_current.call(callbackRef);
19
- }
20
- }, [
21
- count
22
- ]);
23
- return React.useCallback(()=>{
24
- return {
25
- setMotionEndCallbacks (onfinish) {
26
- callbackRef.current = onfinish;
27
- setCount((v)=>v + 1);
28
- },
29
- set playbackRate (rate){
30
- /* no-op */ },
31
- cancel () {
32
- /* no-op */ },
33
- pause () {
34
- /* no-op */ },
35
- play () {
36
- /* no-op */ },
37
- finish () {
38
- /* no-op */ }
39
- };
40
- }, []);
41
- }
42
- /**
43
- * @internal
44
- */ export function useAnimateAtoms() {
45
- 'use no memo';
46
- if (process.env.NODE_ENV === 'test' && !SUPPORTS_WEB_ANIMATIONS) {
47
- // eslint-disable-next-line react-hooks/rules-of-hooks
48
- return useAnimateAtomsInTestEnvironment();
49
- }
50
- // eslint-disable-next-line react-hooks/rules-of-hooks
2
+ function useAnimateAtomsInSupportedEnvironment() {
51
3
  return React.useCallback((element, value, options)=>{
52
4
  const atoms = Array.isArray(value) ? value : [
53
5
  value
@@ -108,3 +60,58 @@ const SUPPORTS_WEB_ANIMATIONS = /*@__PURE__*/ (()=>win && typeof win.Element.pro
108
60
  };
109
61
  }, []);
110
62
  }
63
+ /**
64
+ * In test environments, this hook is used to delay the execution of a callback until the next render. This is necessary
65
+ * to ensure that the callback is not executed synchronously, which would cause the test to fail.
66
+ *
67
+ * @see https://github.com/microsoft/fluentui/issues/31701
68
+ */ function useAnimateAtomsInTestEnvironment() {
69
+ const [count, setCount] = React.useState(0);
70
+ const callbackRef = React.useRef();
71
+ const realAnimateAtoms = useAnimateAtomsInSupportedEnvironment();
72
+ React.useEffect(()=>{
73
+ if (count > 0) {
74
+ var _callbackRef_current;
75
+ (_callbackRef_current = callbackRef.current) === null || _callbackRef_current === void 0 ? void 0 : _callbackRef_current.call(callbackRef);
76
+ }
77
+ }, [
78
+ count
79
+ ]);
80
+ return React.useCallback((element, value, options)=>{
81
+ const ELEMENT_SUPPORTS_WEB_ANIMATIONS = typeof element.animate === 'function';
82
+ // Heads up!
83
+ // If the environment supports Web Animations API, we can use the native implementation.
84
+ if (ELEMENT_SUPPORTS_WEB_ANIMATIONS) {
85
+ return realAnimateAtoms(element, value, options);
86
+ }
87
+ return {
88
+ setMotionEndCallbacks (onfinish) {
89
+ callbackRef.current = onfinish;
90
+ setCount((v)=>v + 1);
91
+ },
92
+ set playbackRate (rate){
93
+ /* no-op */ },
94
+ cancel () {
95
+ /* no-op */ },
96
+ pause () {
97
+ /* no-op */ },
98
+ play () {
99
+ /* no-op */ },
100
+ finish () {
101
+ /* no-op */ }
102
+ };
103
+ }, [
104
+ realAnimateAtoms
105
+ ]);
106
+ }
107
+ /**
108
+ * @internal
109
+ */ export function useAnimateAtoms() {
110
+ 'use no memo';
111
+ if (process.env.NODE_ENV === 'test') {
112
+ // eslint-disable-next-line react-hooks/rules-of-hooks
113
+ return useAnimateAtomsInTestEnvironment();
114
+ }
115
+ // eslint-disable-next-line react-hooks/rules-of-hooks
116
+ return useAnimateAtomsInSupportedEnvironment();
117
+ }
@@ -1 +1 @@
1
- {"version":3,"sources":["useAnimateAtoms.ts"],"sourcesContent":["import * as React from 'react';\nimport type { AnimationHandle, AtomMotion } from '../types';\n\n// eslint-disable-next-line no-restricted-globals\nconst win = typeof document === 'object' ? document.defaultView?.window : undefined;\n\n// Heads up! \"Element.\" is a side-effect for minifiers, should be kept as IIFE to avoid leaking after minification.\nconst SUPPORTS_WEB_ANIMATIONS = /*@__PURE__*/ (() => win && typeof win.Element.prototype.animate === 'function')();\n\n/**\n * In test environments, this hook is used to delay the execution of a callback until the next render. This is necessary\n * to ensure that the callback is not executed synchronously, which would cause the test to fail.\n *\n * @see https://github.com/microsoft/fluentui/issues/31701\n */\nfunction useAnimateAtomsInTestEnvironment() {\n const [count, setCount] = React.useState(0);\n const callbackRef = React.useRef<() => void>();\n\n React.useEffect(() => {\n if (count > 0) {\n callbackRef.current?.();\n }\n }, [count]);\n\n return React.useCallback((): AnimationHandle => {\n return {\n setMotionEndCallbacks(onfinish: () => void) {\n callbackRef.current = onfinish;\n setCount(v => v + 1);\n },\n\n set playbackRate(rate: number) {\n /* no-op */\n },\n cancel() {\n /* no-op */\n },\n pause() {\n /* no-op */\n },\n play() {\n /* no-op */\n },\n finish() {\n /* no-op */\n },\n };\n }, []);\n}\n\n/**\n * @internal\n */\nexport function useAnimateAtoms() {\n 'use no memo';\n\n if (process.env.NODE_ENV === 'test' && !SUPPORTS_WEB_ANIMATIONS) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useAnimateAtomsInTestEnvironment();\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return React.useCallback(\n (\n element: HTMLElement,\n value: AtomMotion | AtomMotion[],\n options: {\n isReducedMotion: boolean;\n },\n ): AnimationHandle => {\n const atoms = Array.isArray(value) ? value : [value];\n const { isReducedMotion } = options;\n\n const animations = atoms.map(motion => {\n const { keyframes, ...params } = motion;\n const animation = element.animate(keyframes, {\n fill: 'forwards',\n\n ...params,\n ...(isReducedMotion && { duration: 1 }),\n });\n\n animation.persist();\n\n return animation;\n });\n\n return {\n set playbackRate(rate: number) {\n animations.forEach(animation => {\n animation.playbackRate = rate;\n });\n },\n setMotionEndCallbacks(onfinish: () => void, oncancel: () => void) {\n Promise.all(animations.map(animation => animation.finished))\n .then(() => {\n onfinish();\n })\n .catch((err: unknown) => {\n const DOMException = element.ownerDocument.defaultView?.DOMException;\n\n // Ignores \"DOMException: The user aborted a request\" that appears if animations are cancelled\n if (DOMException && err instanceof DOMException && err.name === 'AbortError') {\n oncancel();\n return;\n }\n\n throw err;\n });\n },\n\n cancel: () => {\n animations.forEach(animation => {\n animation.cancel();\n });\n },\n pause: () => {\n animations.forEach(animation => {\n animation.pause();\n });\n },\n play: () => {\n animations.forEach(animation => {\n animation.play();\n });\n },\n finish: () => {\n animations.forEach(animation => {\n animation.finish();\n });\n },\n };\n },\n [],\n );\n}\n"],"names":["document","React","win","defaultView","window","undefined","SUPPORTS_WEB_ANIMATIONS","Element","prototype","animate","useAnimateAtomsInTestEnvironment","count","setCount","useState","callbackRef","useRef","useEffect","current","useCallback","setMotionEndCallbacks","onfinish","v","playbackRate","rate","cancel","pause","play","finish","useAnimateAtoms","process","env","NODE_ENV","element","value","options","atoms","Array","isArray","isReducedMotion","animations","map","motion","keyframes","params","animation","fill","duration","persist","forEach","oncancel","Promise","all","finished","then","catch","err","DOMException","ownerDocument","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["useAnimateAtoms.ts"],"sourcesContent":["import * as React from 'react';\nimport type { AnimationHandle, AtomMotion } from '../types';\n\nfunction useAnimateAtomsInSupportedEnvironment() {\n return React.useCallback(\n (\n element: HTMLElement,\n value: AtomMotion | AtomMotion[],\n options: {\n isReducedMotion: boolean;\n },\n ): AnimationHandle => {\n const atoms = Array.isArray(value) ? value : [value];\n const { isReducedMotion } = options;\n\n const animations = atoms.map(motion => {\n const { keyframes, ...params } = motion;\n const animation = element.animate(keyframes, {\n fill: 'forwards',\n\n ...params,\n ...(isReducedMotion && { duration: 1 }),\n });\n\n animation.persist();\n\n return animation;\n });\n\n return {\n set playbackRate(rate: number) {\n animations.forEach(animation => {\n animation.playbackRate = rate;\n });\n },\n setMotionEndCallbacks(onfinish: () => void, oncancel: () => void) {\n Promise.all(animations.map(animation => animation.finished))\n .then(() => {\n onfinish();\n })\n .catch((err: unknown) => {\n const DOMException = element.ownerDocument.defaultView?.DOMException;\n\n // Ignores \"DOMException: The user aborted a request\" that appears if animations are cancelled\n if (DOMException && err instanceof DOMException && err.name === 'AbortError') {\n oncancel();\n return;\n }\n\n throw err;\n });\n },\n\n cancel: () => {\n animations.forEach(animation => {\n animation.cancel();\n });\n },\n pause: () => {\n animations.forEach(animation => {\n animation.pause();\n });\n },\n play: () => {\n animations.forEach(animation => {\n animation.play();\n });\n },\n finish: () => {\n animations.forEach(animation => {\n animation.finish();\n });\n },\n };\n },\n [],\n );\n}\n\n/**\n * In test environments, this hook is used to delay the execution of a callback until the next render. This is necessary\n * to ensure that the callback is not executed synchronously, which would cause the test to fail.\n *\n * @see https://github.com/microsoft/fluentui/issues/31701\n */\nfunction useAnimateAtomsInTestEnvironment() {\n const [count, setCount] = React.useState(0);\n const callbackRef = React.useRef<() => void>();\n\n const realAnimateAtoms = useAnimateAtomsInSupportedEnvironment();\n\n React.useEffect(() => {\n if (count > 0) {\n callbackRef.current?.();\n }\n }, [count]);\n\n return React.useCallback(\n (\n element: HTMLElement,\n value: AtomMotion | AtomMotion[],\n options: {\n isReducedMotion: boolean;\n },\n ): AnimationHandle => {\n const ELEMENT_SUPPORTS_WEB_ANIMATIONS = typeof element.animate === 'function';\n\n // Heads up!\n // If the environment supports Web Animations API, we can use the native implementation.\n if (ELEMENT_SUPPORTS_WEB_ANIMATIONS) {\n return realAnimateAtoms(element, value, options);\n }\n\n return {\n setMotionEndCallbacks(onfinish: () => void) {\n callbackRef.current = onfinish;\n setCount(v => v + 1);\n },\n\n set playbackRate(rate: number) {\n /* no-op */\n },\n cancel() {\n /* no-op */\n },\n pause() {\n /* no-op */\n },\n play() {\n /* no-op */\n },\n finish() {\n /* no-op */\n },\n };\n },\n [realAnimateAtoms],\n );\n}\n\n/**\n * @internal\n */\nexport function useAnimateAtoms() {\n 'use no memo';\n\n if (process.env.NODE_ENV === 'test') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useAnimateAtomsInTestEnvironment();\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useAnimateAtomsInSupportedEnvironment();\n}\n"],"names":["React","useAnimateAtomsInSupportedEnvironment","useCallback","element","value","options","atoms","Array","isArray","isReducedMotion","animations","map","motion","keyframes","params","animation","animate","fill","duration","persist","playbackRate","rate","forEach","setMotionEndCallbacks","onfinish","oncancel","Promise","all","finished","then","catch","err","DOMException","ownerDocument","defaultView","name","cancel","pause","play","finish","useAnimateAtomsInTestEnvironment","count","setCount","useState","callbackRef","useRef","realAnimateAtoms","useEffect","current","ELEMENT_SUPPORTS_WEB_ANIMATIONS","v","useAnimateAtoms","process","env","NODE_ENV"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,SAASC;IACP,OAAOD,MAAME,WAAW,CACtB,CACEC,SACAC,OACAC;QAIA,MAAMC,QAAQC,MAAMC,OAAO,CAACJ,SAASA,QAAQ;YAACA;SAAM;QACpD,MAAM,EAAEK,eAAe,EAAE,GAAGJ;QAE5B,MAAMK,aAAaJ,MAAMK,GAAG,CAACC,CAAAA;YAC3B,MAAM,EAAEC,SAAS,EAAE,GAAGC,QAAQ,GAAGF;YACjC,MAAMG,YAAYZ,QAAQa,OAAO,CAACH,WAAW;gBAC3CI,MAAM;gBAEN,GAAGH,MAAM;gBACT,GAAIL,mBAAmB;oBAAES,UAAU;gBAAE,CAAC;YACxC;YAEAH,UAAUI,OAAO;YAEjB,OAAOJ;QACT;QAEA,OAAO;YACL,IAAIK,cAAaC,KAAc;gBAC7BX,WAAWY,OAAO,CAACP,CAAAA;oBACjBA,UAAUK,YAAY,GAAGC;gBAC3B;YACF;YACAE,uBAAsBC,QAAoB,EAAEC,QAAoB;gBAC9DC,QAAQC,GAAG,CAACjB,WAAWC,GAAG,CAACI,CAAAA,YAAaA,UAAUa,QAAQ,GACvDC,IAAI,CAAC;oBACJL;gBACF,GACCM,KAAK,CAAC,CAACC;wBACe5B;oBAArB,MAAM6B,gBAAe7B,qCAAAA,QAAQ8B,aAAa,CAACC,WAAW,cAAjC/B,yDAAAA,mCAAmC6B,YAAY;oBAEpE,8FAA8F;oBAC9F,IAAIA,gBAAgBD,eAAeC,gBAAgBD,IAAII,IAAI,KAAK,cAAc;wBAC5EV;wBACA;oBACF;oBAEA,MAAMM;gBACR;YACJ;YAEAK,QAAQ;gBACN1B,WAAWY,OAAO,CAACP,CAAAA;oBACjBA,UAAUqB,MAAM;gBAClB;YACF;YACAC,OAAO;gBACL3B,WAAWY,OAAO,CAACP,CAAAA;oBACjBA,UAAUsB,KAAK;gBACjB;YACF;YACAC,MAAM;gBACJ5B,WAAWY,OAAO,CAACP,CAAAA;oBACjBA,UAAUuB,IAAI;gBAChB;YACF;YACAC,QAAQ;gBACN7B,WAAWY,OAAO,CAACP,CAAAA;oBACjBA,UAAUwB,MAAM;gBAClB;YACF;QACF;IACF,GACA,EAAE;AAEN;AAEA;;;;;CAKC,GACD,SAASC;IACP,MAAM,CAACC,OAAOC,SAAS,GAAG1C,MAAM2C,QAAQ,CAAC;IACzC,MAAMC,cAAc5C,MAAM6C,MAAM;IAEhC,MAAMC,mBAAmB7C;IAEzBD,MAAM+C,SAAS,CAAC;QACd,IAAIN,QAAQ,GAAG;gBACbG;aAAAA,uBAAAA,YAAYI,OAAO,cAAnBJ,2CAAAA,0BAAAA;QACF;IACF,GAAG;QAACH;KAAM;IAEV,OAAOzC,MAAME,WAAW,CACtB,CACEC,SACAC,OACAC;QAIA,MAAM4C,kCAAkC,OAAO9C,QAAQa,OAAO,KAAK;QAEnE,YAAY;QACZ,wFAAwF;QACxF,IAAIiC,iCAAiC;YACnC,OAAOH,iBAAiB3C,SAASC,OAAOC;QAC1C;QAEA,OAAO;YACLkB,uBAAsBC,QAAoB;gBACxCoB,YAAYI,OAAO,GAAGxB;gBACtBkB,SAASQ,CAAAA,IAAKA,IAAI;YACpB;YAEA,IAAI9B,cAAaC,KAAc;YAC7B,SAAS,GACX;YACAe;YACE,SAAS,GACX;YACAC;YACE,SAAS,GACX;YACAC;YACE,SAAS,GACX;YACAC;YACE,SAAS,GACX;QACF;IACF,GACA;QAACO;KAAiB;AAEtB;AAEA;;CAEC,GACD,OAAO,SAASK;IACd;IAEA,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,QAAQ;QACnC,sDAAsD;QACtD,OAAOd;IACT;IAEA,sDAAsD;IACtD,OAAOvC;AACT"}
package/lib/index.js CHANGED
@@ -3,3 +3,4 @@ export { createMotionComponent } from './factories/createMotionComponent';
3
3
  export { createPresenceComponent } from './factories/createPresenceComponent';
4
4
  export { createPresenceComponentVariant } from './factories/createPresenceComponentVariant';
5
5
  export { PresenceGroup } from './components/PresenceGroup';
6
+ export { presenceMotionSlot } from './slots/presenceMotionSlot';
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"sourcesContent":["export { motionTokens, durations, curves } from './motions/motionTokens';\n\nexport { createMotionComponent, type MotionComponentProps } from './factories/createMotionComponent';\nexport {\n createPresenceComponent,\n type PresenceComponentProps,\n type PresenceComponent,\n} from './factories/createPresenceComponent';\nexport { createPresenceComponentVariant } from './factories/createPresenceComponentVariant';\n\nexport { PresenceGroup } from './components/PresenceGroup';\n\nexport type {\n AtomMotion,\n AtomMotionFn,\n PresenceMotion,\n PresenceMotionFn,\n PresenceDirection,\n MotionImperativeRef,\n} from './types';\n"],"names":["motionTokens","durations","curves","createMotionComponent","createPresenceComponent","createPresenceComponentVariant","PresenceGroup"],"rangeMappings":";;;;","mappings":"AAAA,SAASA,YAAY,EAAEC,SAAS,EAAEC,MAAM,QAAQ,yBAAyB;AAEzE,SAASC,qBAAqB,QAAmC,oCAAoC;AACrG,SACEC,uBAAuB,QAGlB,sCAAsC;AAC7C,SAASC,8BAA8B,QAAQ,6CAA6C;AAE5F,SAASC,aAAa,QAAQ,6BAA6B"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export { motionTokens, durations, curves } from './motions/motionTokens';\n\nexport { createMotionComponent, type MotionComponentProps } from './factories/createMotionComponent';\nexport {\n createPresenceComponent,\n type PresenceComponentProps,\n type PresenceComponent,\n} from './factories/createPresenceComponent';\nexport { createPresenceComponentVariant } from './factories/createPresenceComponentVariant';\n\nexport { PresenceGroup } from './components/PresenceGroup';\n\nexport { presenceMotionSlot, type PresenceMotionSlotProps } from './slots/presenceMotionSlot';\n\nexport type {\n AtomMotion,\n AtomMotionFn,\n PresenceMotion,\n PresenceMotionFn,\n PresenceDirection,\n MotionImperativeRef,\n} from './types';\n"],"names":["motionTokens","durations","curves","createMotionComponent","createPresenceComponent","createPresenceComponentVariant","PresenceGroup","presenceMotionSlot"],"rangeMappings":";;;;;","mappings":"AAAA,SAASA,YAAY,EAAEC,SAAS,EAAEC,MAAM,QAAQ,yBAAyB;AAEzE,SAASC,qBAAqB,QAAmC,oCAAoC;AACrG,SACEC,uBAAuB,QAGlB,sCAAsC;AAC7C,SAASC,8BAA8B,QAAQ,6CAA6C;AAE5F,SAASC,aAAa,QAAQ,6BAA6B;AAE3D,SAASC,kBAAkB,QAAsC,6BAA6B"}
@@ -0,0 +1,40 @@
1
+ import { SLOT_ELEMENT_TYPE_SYMBOL, SLOT_RENDER_FUNCTION_SYMBOL } from '@fluentui/react-utilities';
2
+ import * as React from 'react';
3
+ export function presenceMotionSlot(motion, options) {
4
+ // eslint-disable-next-line deprecation/deprecation
5
+ const { as, children, ...rest } = motion !== null && motion !== void 0 ? motion : {};
6
+ if (process.env.NODE_ENV !== 'production') {
7
+ if (typeof as !== 'undefined') {
8
+ throw new Error(`@fluentui/react-motion: "as" property is not supported on motion slots.`);
9
+ }
10
+ }
11
+ if (motion === null) {
12
+ // Heads up!
13
+ // Render function is used there to avoid rendering a motion component and handle unmounting logic
14
+ const isUnmounted = !options.defaultProps.visible && options.defaultProps.unmountOnExit;
15
+ const renderFn = (_, props)=>isUnmounted ? null : /*#__PURE__*/ React.createElement(React.Fragment, null, props.children);
16
+ /**
17
+ * Casting is required here as SlotComponentType is a function, not an object.
18
+ * Although SlotComponentType has a function signature, it is still just an object.
19
+ * This is required to make a slot callable (JSX compatible), this is the exact same approach
20
+ * that is used on `@types/react` components
21
+ */ return {
22
+ [SLOT_RENDER_FUNCTION_SYMBOL]: renderFn,
23
+ [SLOT_ELEMENT_TYPE_SYMBOL]: options.elementType
24
+ };
25
+ }
26
+ /**
27
+ * Casting is required here as SlotComponentType is a function, not an object.
28
+ * Although SlotComponentType has a function signature, it is still just an object.
29
+ * This is required to make a slot callable (JSX compatible), this is the exact same approach
30
+ * that is used on `@types/react` components
31
+ */ const propsWithMetadata = {
32
+ ...options.defaultProps,
33
+ ...rest,
34
+ [SLOT_ELEMENT_TYPE_SYMBOL]: options.elementType
35
+ };
36
+ if (typeof children === 'function') {
37
+ propsWithMetadata[SLOT_RENDER_FUNCTION_SYMBOL] = children;
38
+ }
39
+ return propsWithMetadata;
40
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["presenceMotionSlot.tsx"],"sourcesContent":["import {\n SLOT_ELEMENT_TYPE_SYMBOL,\n SLOT_RENDER_FUNCTION_SYMBOL,\n type SlotComponentType,\n type SlotRenderFunction,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { PresenceComponentProps } from '../factories/createPresenceComponent';\nimport type { MotionParam } from '../types';\n\n/**\n * @internal\n */\ntype PresenceMotionSlotRenderProps = Pick<\n PresenceComponentProps,\n 'appear' | 'onMotionFinish' | 'onMotionStart' | 'unmountOnExit' | 'visible'\n>;\n\nexport type PresenceMotionSlotProps<MotionParams extends Record<string, MotionParam> = {}> = Pick<\n PresenceComponentProps,\n 'imperativeRef' | 'onMotionFinish' | 'onMotionStart'\n> & {\n // FIXME: 'as' property is required by design on the slot AP but it does not support components, only intrinsic\n // elements motion slots do not support intrinsic elements, only custom components.\n /**\n * @deprecated Do not use. Presence Motion Slots do not support intrinsic elements.\n *\n * If you want to override the animation, use the children render function instead.\n */\n as?: keyof JSX.IntrinsicElements;\n\n // TODO: remove once React v18 slot API is modified ComponentProps is not properly adding render function as a\n // possible value for children\n children?: SlotRenderFunction<PresenceMotionSlotRenderProps & MotionParams & { children: React.ReactElement }>;\n};\n\nexport function presenceMotionSlot<MotionParams extends Record<string, MotionParam> = {}>(\n motion: PresenceMotionSlotProps<MotionParams> | null | undefined,\n options: {\n elementType: React.FC<PresenceComponentProps & MotionParams>;\n defaultProps: PresenceMotionSlotRenderProps & MotionParams;\n },\n): SlotComponentType<PresenceMotionSlotRenderProps & MotionParams> {\n // eslint-disable-next-line deprecation/deprecation\n const { as, children, ...rest } = motion ?? {};\n\n if (process.env.NODE_ENV !== 'production') {\n if (typeof as !== 'undefined') {\n throw new Error(`@fluentui/react-motion: \"as\" property is not supported on motion slots.`);\n }\n }\n\n if (motion === null) {\n // Heads up!\n // Render function is used there to avoid rendering a motion component and handle unmounting logic\n const isUnmounted = !options.defaultProps.visible && options.defaultProps.unmountOnExit;\n const renderFn: SlotRenderFunction<\n PresenceMotionSlotRenderProps & MotionParams & { children: React.ReactElement }\n > = (_, props) => (isUnmounted ? null : <>{props.children}</>);\n\n /**\n * Casting is required here as SlotComponentType is a function, not an object.\n * Although SlotComponentType has a function signature, it is still just an object.\n * This is required to make a slot callable (JSX compatible), this is the exact same approach\n * that is used on `@types/react` components\n */\n return {\n [SLOT_RENDER_FUNCTION_SYMBOL]: renderFn,\n [SLOT_ELEMENT_TYPE_SYMBOL]: options.elementType,\n } as SlotComponentType<PresenceMotionSlotRenderProps & MotionParams>;\n }\n\n /**\n * Casting is required here as SlotComponentType is a function, not an object.\n * Although SlotComponentType has a function signature, it is still just an object.\n * This is required to make a slot callable (JSX compatible), this is the exact same approach\n * that is used on `@types/react` components\n */\n const propsWithMetadata = {\n ...options.defaultProps,\n ...rest,\n [SLOT_ELEMENT_TYPE_SYMBOL]: options.elementType,\n } as SlotComponentType<PresenceMotionSlotRenderProps & MotionParams>;\n\n if (typeof children === 'function') {\n propsWithMetadata[SLOT_RENDER_FUNCTION_SYMBOL] = children as SlotRenderFunction<\n PresenceMotionSlotRenderProps & MotionParams\n >;\n }\n\n return propsWithMetadata;\n}\n"],"names":["SLOT_ELEMENT_TYPE_SYMBOL","SLOT_RENDER_FUNCTION_SYMBOL","React","presenceMotionSlot","motion","options","as","children","rest","process","env","NODE_ENV","Error","isUnmounted","defaultProps","visible","unmountOnExit","renderFn","_","props","elementType","propsWithMetadata"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"AAAA,SACEA,wBAAwB,EACxBC,2BAA2B,QAGtB,4BAA4B;AACnC,YAAYC,WAAW,QAAQ;AA+B/B,OAAO,SAASC,mBACdC,MAAgE,EAChEC,OAGC;IAED,mDAAmD;IACnD,MAAM,EAAEC,EAAE,EAAEC,QAAQ,EAAE,GAAGC,MAAM,GAAGJ,mBAAAA,oBAAAA,SAAU,CAAC;IAE7C,IAAIK,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,IAAI,OAAOL,OAAO,aAAa;YAC7B,MAAM,IAAIM,MAAM,CAAC,uEAAuE,CAAC;QAC3F;IACF;IAEA,IAAIR,WAAW,MAAM;QACnB,YAAY;QACZ,kGAAkG;QAClG,MAAMS,cAAc,CAACR,QAAQS,YAAY,CAACC,OAAO,IAAIV,QAAQS,YAAY,CAACE,aAAa;QACvF,MAAMC,WAEF,CAACC,GAAGC,QAAWN,cAAc,qBAAO,0CAAGM,MAAMZ,QAAQ;QAEzD;;;;;KAKC,GACD,OAAO;YACL,CAACN,4BAA4B,EAAEgB;YAC/B,CAACjB,yBAAyB,EAAEK,QAAQe,WAAW;QACjD;IACF;IAEA;;;;;GAKC,GACD,MAAMC,oBAAoB;QACxB,GAAGhB,QAAQS,YAAY;QACvB,GAAGN,IAAI;QACP,CAACR,yBAAyB,EAAEK,QAAQe,WAAW;IACjD;IAEA,IAAI,OAAOb,aAAa,YAAY;QAClCc,iBAAiB,CAACpB,4BAA4B,GAAGM;IAGnD;IAEA,OAAOc;AACT"}
@@ -10,53 +10,7 @@ Object.defineProperty(exports, "useAnimateAtoms", {
10
10
  });
11
11
  const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
12
12
  const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
13
- var _document_defaultView;
14
- // eslint-disable-next-line no-restricted-globals
15
- const win = typeof document === 'object' ? (_document_defaultView = document.defaultView) === null || _document_defaultView === void 0 ? void 0 : _document_defaultView.window : undefined;
16
- // Heads up! "Element." is a side-effect for minifiers, should be kept as IIFE to avoid leaking after minification.
17
- const SUPPORTS_WEB_ANIMATIONS = /*@__PURE__*/ (()=>win && typeof win.Element.prototype.animate === 'function')();
18
- /**
19
- * In test environments, this hook is used to delay the execution of a callback until the next render. This is necessary
20
- * to ensure that the callback is not executed synchronously, which would cause the test to fail.
21
- *
22
- * @see https://github.com/microsoft/fluentui/issues/31701
23
- */ function useAnimateAtomsInTestEnvironment() {
24
- const [count, setCount] = _react.useState(0);
25
- const callbackRef = _react.useRef();
26
- _react.useEffect(()=>{
27
- if (count > 0) {
28
- var _callbackRef_current;
29
- (_callbackRef_current = callbackRef.current) === null || _callbackRef_current === void 0 ? void 0 : _callbackRef_current.call(callbackRef);
30
- }
31
- }, [
32
- count
33
- ]);
34
- return _react.useCallback(()=>{
35
- return {
36
- setMotionEndCallbacks (onfinish) {
37
- callbackRef.current = onfinish;
38
- setCount((v)=>v + 1);
39
- },
40
- set playbackRate (rate){
41
- /* no-op */ },
42
- cancel () {
43
- /* no-op */ },
44
- pause () {
45
- /* no-op */ },
46
- play () {
47
- /* no-op */ },
48
- finish () {
49
- /* no-op */ }
50
- };
51
- }, []);
52
- }
53
- function useAnimateAtoms() {
54
- 'use no memo';
55
- if (process.env.NODE_ENV === 'test' && !SUPPORTS_WEB_ANIMATIONS) {
56
- // eslint-disable-next-line react-hooks/rules-of-hooks
57
- return useAnimateAtomsInTestEnvironment();
58
- }
59
- // eslint-disable-next-line react-hooks/rules-of-hooks
13
+ function useAnimateAtomsInSupportedEnvironment() {
60
14
  return _react.useCallback((element, value, options)=>{
61
15
  const atoms = Array.isArray(value) ? value : [
62
16
  value
@@ -117,3 +71,56 @@ function useAnimateAtoms() {
117
71
  };
118
72
  }, []);
119
73
  }
74
+ /**
75
+ * In test environments, this hook is used to delay the execution of a callback until the next render. This is necessary
76
+ * to ensure that the callback is not executed synchronously, which would cause the test to fail.
77
+ *
78
+ * @see https://github.com/microsoft/fluentui/issues/31701
79
+ */ function useAnimateAtomsInTestEnvironment() {
80
+ const [count, setCount] = _react.useState(0);
81
+ const callbackRef = _react.useRef();
82
+ const realAnimateAtoms = useAnimateAtomsInSupportedEnvironment();
83
+ _react.useEffect(()=>{
84
+ if (count > 0) {
85
+ var _callbackRef_current;
86
+ (_callbackRef_current = callbackRef.current) === null || _callbackRef_current === void 0 ? void 0 : _callbackRef_current.call(callbackRef);
87
+ }
88
+ }, [
89
+ count
90
+ ]);
91
+ return _react.useCallback((element, value, options)=>{
92
+ const ELEMENT_SUPPORTS_WEB_ANIMATIONS = typeof element.animate === 'function';
93
+ // Heads up!
94
+ // If the environment supports Web Animations API, we can use the native implementation.
95
+ if (ELEMENT_SUPPORTS_WEB_ANIMATIONS) {
96
+ return realAnimateAtoms(element, value, options);
97
+ }
98
+ return {
99
+ setMotionEndCallbacks (onfinish) {
100
+ callbackRef.current = onfinish;
101
+ setCount((v)=>v + 1);
102
+ },
103
+ set playbackRate (rate){
104
+ /* no-op */ },
105
+ cancel () {
106
+ /* no-op */ },
107
+ pause () {
108
+ /* no-op */ },
109
+ play () {
110
+ /* no-op */ },
111
+ finish () {
112
+ /* no-op */ }
113
+ };
114
+ }, [
115
+ realAnimateAtoms
116
+ ]);
117
+ }
118
+ function useAnimateAtoms() {
119
+ 'use no memo';
120
+ if (process.env.NODE_ENV === 'test') {
121
+ // eslint-disable-next-line react-hooks/rules-of-hooks
122
+ return useAnimateAtomsInTestEnvironment();
123
+ }
124
+ // eslint-disable-next-line react-hooks/rules-of-hooks
125
+ return useAnimateAtomsInSupportedEnvironment();
126
+ }
@@ -1 +1 @@
1
- {"version":3,"sources":["useAnimateAtoms.ts"],"sourcesContent":["import * as React from 'react';\nimport type { AnimationHandle, AtomMotion } from '../types';\n\n// eslint-disable-next-line no-restricted-globals\nconst win = typeof document === 'object' ? document.defaultView?.window : undefined;\n\n// Heads up! \"Element.\" is a side-effect for minifiers, should be kept as IIFE to avoid leaking after minification.\nconst SUPPORTS_WEB_ANIMATIONS = /*@__PURE__*/ (() => win && typeof win.Element.prototype.animate === 'function')();\n\n/**\n * In test environments, this hook is used to delay the execution of a callback until the next render. This is necessary\n * to ensure that the callback is not executed synchronously, which would cause the test to fail.\n *\n * @see https://github.com/microsoft/fluentui/issues/31701\n */\nfunction useAnimateAtomsInTestEnvironment() {\n const [count, setCount] = React.useState(0);\n const callbackRef = React.useRef<() => void>();\n\n React.useEffect(() => {\n if (count > 0) {\n callbackRef.current?.();\n }\n }, [count]);\n\n return React.useCallback((): AnimationHandle => {\n return {\n setMotionEndCallbacks(onfinish: () => void) {\n callbackRef.current = onfinish;\n setCount(v => v + 1);\n },\n\n set playbackRate(rate: number) {\n /* no-op */\n },\n cancel() {\n /* no-op */\n },\n pause() {\n /* no-op */\n },\n play() {\n /* no-op */\n },\n finish() {\n /* no-op */\n },\n };\n }, []);\n}\n\n/**\n * @internal\n */\nexport function useAnimateAtoms() {\n 'use no memo';\n\n if (process.env.NODE_ENV === 'test' && !SUPPORTS_WEB_ANIMATIONS) {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useAnimateAtomsInTestEnvironment();\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return React.useCallback(\n (\n element: HTMLElement,\n value: AtomMotion | AtomMotion[],\n options: {\n isReducedMotion: boolean;\n },\n ): AnimationHandle => {\n const atoms = Array.isArray(value) ? value : [value];\n const { isReducedMotion } = options;\n\n const animations = atoms.map(motion => {\n const { keyframes, ...params } = motion;\n const animation = element.animate(keyframes, {\n fill: 'forwards',\n\n ...params,\n ...(isReducedMotion && { duration: 1 }),\n });\n\n animation.persist();\n\n return animation;\n });\n\n return {\n set playbackRate(rate: number) {\n animations.forEach(animation => {\n animation.playbackRate = rate;\n });\n },\n setMotionEndCallbacks(onfinish: () => void, oncancel: () => void) {\n Promise.all(animations.map(animation => animation.finished))\n .then(() => {\n onfinish();\n })\n .catch((err: unknown) => {\n const DOMException = element.ownerDocument.defaultView?.DOMException;\n\n // Ignores \"DOMException: The user aborted a request\" that appears if animations are cancelled\n if (DOMException && err instanceof DOMException && err.name === 'AbortError') {\n oncancel();\n return;\n }\n\n throw err;\n });\n },\n\n cancel: () => {\n animations.forEach(animation => {\n animation.cancel();\n });\n },\n pause: () => {\n animations.forEach(animation => {\n animation.pause();\n });\n },\n play: () => {\n animations.forEach(animation => {\n animation.play();\n });\n },\n finish: () => {\n animations.forEach(animation => {\n animation.finish();\n });\n },\n };\n },\n [],\n );\n}\n"],"names":["useAnimateAtoms","document","win","defaultView","window","undefined","SUPPORTS_WEB_ANIMATIONS","Element","prototype","animate","useAnimateAtomsInTestEnvironment","count","setCount","React","useState","callbackRef","useRef","useEffect","current","useCallback","setMotionEndCallbacks","onfinish","v","playbackRate","rate","cancel","pause","play","finish","process","env","NODE_ENV","element","value","options","atoms","Array","isArray","isReducedMotion","animations","map","motion","keyframes","params","animation","fill","duration","persist","forEach","oncancel","Promise","all","finished","then","catch","err","DOMException","ownerDocument","name"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1
+ {"version":3,"sources":["useAnimateAtoms.ts"],"sourcesContent":["import * as React from 'react';\nimport type { AnimationHandle, AtomMotion } from '../types';\n\nfunction useAnimateAtomsInSupportedEnvironment() {\n return React.useCallback(\n (\n element: HTMLElement,\n value: AtomMotion | AtomMotion[],\n options: {\n isReducedMotion: boolean;\n },\n ): AnimationHandle => {\n const atoms = Array.isArray(value) ? value : [value];\n const { isReducedMotion } = options;\n\n const animations = atoms.map(motion => {\n const { keyframes, ...params } = motion;\n const animation = element.animate(keyframes, {\n fill: 'forwards',\n\n ...params,\n ...(isReducedMotion && { duration: 1 }),\n });\n\n animation.persist();\n\n return animation;\n });\n\n return {\n set playbackRate(rate: number) {\n animations.forEach(animation => {\n animation.playbackRate = rate;\n });\n },\n setMotionEndCallbacks(onfinish: () => void, oncancel: () => void) {\n Promise.all(animations.map(animation => animation.finished))\n .then(() => {\n onfinish();\n })\n .catch((err: unknown) => {\n const DOMException = element.ownerDocument.defaultView?.DOMException;\n\n // Ignores \"DOMException: The user aborted a request\" that appears if animations are cancelled\n if (DOMException && err instanceof DOMException && err.name === 'AbortError') {\n oncancel();\n return;\n }\n\n throw err;\n });\n },\n\n cancel: () => {\n animations.forEach(animation => {\n animation.cancel();\n });\n },\n pause: () => {\n animations.forEach(animation => {\n animation.pause();\n });\n },\n play: () => {\n animations.forEach(animation => {\n animation.play();\n });\n },\n finish: () => {\n animations.forEach(animation => {\n animation.finish();\n });\n },\n };\n },\n [],\n );\n}\n\n/**\n * In test environments, this hook is used to delay the execution of a callback until the next render. This is necessary\n * to ensure that the callback is not executed synchronously, which would cause the test to fail.\n *\n * @see https://github.com/microsoft/fluentui/issues/31701\n */\nfunction useAnimateAtomsInTestEnvironment() {\n const [count, setCount] = React.useState(0);\n const callbackRef = React.useRef<() => void>();\n\n const realAnimateAtoms = useAnimateAtomsInSupportedEnvironment();\n\n React.useEffect(() => {\n if (count > 0) {\n callbackRef.current?.();\n }\n }, [count]);\n\n return React.useCallback(\n (\n element: HTMLElement,\n value: AtomMotion | AtomMotion[],\n options: {\n isReducedMotion: boolean;\n },\n ): AnimationHandle => {\n const ELEMENT_SUPPORTS_WEB_ANIMATIONS = typeof element.animate === 'function';\n\n // Heads up!\n // If the environment supports Web Animations API, we can use the native implementation.\n if (ELEMENT_SUPPORTS_WEB_ANIMATIONS) {\n return realAnimateAtoms(element, value, options);\n }\n\n return {\n setMotionEndCallbacks(onfinish: () => void) {\n callbackRef.current = onfinish;\n setCount(v => v + 1);\n },\n\n set playbackRate(rate: number) {\n /* no-op */\n },\n cancel() {\n /* no-op */\n },\n pause() {\n /* no-op */\n },\n play() {\n /* no-op */\n },\n finish() {\n /* no-op */\n },\n };\n },\n [realAnimateAtoms],\n );\n}\n\n/**\n * @internal\n */\nexport function useAnimateAtoms() {\n 'use no memo';\n\n if (process.env.NODE_ENV === 'test') {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useAnimateAtomsInTestEnvironment();\n }\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n return useAnimateAtomsInSupportedEnvironment();\n}\n"],"names":["useAnimateAtoms","useAnimateAtomsInSupportedEnvironment","React","useCallback","element","value","options","atoms","Array","isArray","isReducedMotion","animations","map","motion","keyframes","params","animation","animate","fill","duration","persist","playbackRate","rate","forEach","setMotionEndCallbacks","onfinish","oncancel","Promise","all","finished","then","catch","err","DOMException","ownerDocument","defaultView","name","cancel","pause","play","finish","useAnimateAtomsInTestEnvironment","count","setCount","useState","callbackRef","useRef","realAnimateAtoms","useEffect","current","ELEMENT_SUPPORTS_WEB_ANIMATIONS","v","process","env","NODE_ENV"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
@@ -29,6 +29,9 @@ _export(exports, {
29
29
  },
30
30
  motionTokens: function() {
31
31
  return _motionTokens.motionTokens;
32
+ },
33
+ presenceMotionSlot: function() {
34
+ return _presenceMotionSlot.presenceMotionSlot;
32
35
  }
33
36
  });
34
37
  const _motionTokens = require("./motions/motionTokens");
@@ -36,3 +39,4 @@ const _createMotionComponent = require("./factories/createMotionComponent");
36
39
  const _createPresenceComponent = require("./factories/createPresenceComponent");
37
40
  const _createPresenceComponentVariant = require("./factories/createPresenceComponentVariant");
38
41
  const _PresenceGroup = require("./components/PresenceGroup");
42
+ const _presenceMotionSlot = require("./slots/presenceMotionSlot");
@@ -1 +1 @@
1
- {"version":3,"sources":["index.ts"],"sourcesContent":["export { motionTokens, durations, curves } from './motions/motionTokens';\n\nexport { createMotionComponent, type MotionComponentProps } from './factories/createMotionComponent';\nexport {\n createPresenceComponent,\n type PresenceComponentProps,\n type PresenceComponent,\n} from './factories/createPresenceComponent';\nexport { createPresenceComponentVariant } from './factories/createPresenceComponentVariant';\n\nexport { PresenceGroup } from './components/PresenceGroup';\n\nexport type {\n AtomMotion,\n AtomMotionFn,\n PresenceMotion,\n PresenceMotionFn,\n PresenceDirection,\n MotionImperativeRef,\n} from './types';\n"],"names":["PresenceGroup","createMotionComponent","createPresenceComponent","createPresenceComponentVariant","curves","durations","motionTokens"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAUSA,aAAa;eAAbA,4BAAa;;IARbC,qBAAqB;eAArBA,4CAAqB;;IAE5BC,uBAAuB;eAAvBA,gDAAuB;;IAIhBC,8BAA8B;eAA9BA,8DAA8B;;IARLC,MAAM;eAANA,oBAAM;;IAAjBC,SAAS;eAATA,uBAAS;;IAAvBC,YAAY;eAAZA,0BAAY;;;8BAA2B;uCAEiB;yCAK1D;gDACwC;+BAEjB"}
1
+ {"version":3,"sources":["index.ts"],"sourcesContent":["export { motionTokens, durations, curves } from './motions/motionTokens';\n\nexport { createMotionComponent, type MotionComponentProps } from './factories/createMotionComponent';\nexport {\n createPresenceComponent,\n type PresenceComponentProps,\n type PresenceComponent,\n} from './factories/createPresenceComponent';\nexport { createPresenceComponentVariant } from './factories/createPresenceComponentVariant';\n\nexport { PresenceGroup } from './components/PresenceGroup';\n\nexport { presenceMotionSlot, type PresenceMotionSlotProps } from './slots/presenceMotionSlot';\n\nexport type {\n AtomMotion,\n AtomMotionFn,\n PresenceMotion,\n PresenceMotionFn,\n PresenceDirection,\n MotionImperativeRef,\n} from './types';\n"],"names":["PresenceGroup","createMotionComponent","createPresenceComponent","createPresenceComponentVariant","curves","durations","motionTokens","presenceMotionSlot"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;IAUSA,aAAa;eAAbA,4BAAa;;IARbC,qBAAqB;eAArBA,4CAAqB;;IAE5BC,uBAAuB;eAAvBA,gDAAuB;;IAIhBC,8BAA8B;eAA9BA,8DAA8B;;IARLC,MAAM;eAANA,oBAAM;;IAAjBC,SAAS;eAATA,uBAAS;;IAAvBC,YAAY;eAAZA,0BAAY;;IAYZC,kBAAkB;eAAlBA,sCAAkB;;;8BAZqB;uCAEiB;yCAK1D;gDACwC;+BAEjB;oCAEmC"}
@@ -0,0 +1,51 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "presenceMotionSlot", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return presenceMotionSlot;
9
+ }
10
+ });
11
+ const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
12
+ const _reactutilities = require("@fluentui/react-utilities");
13
+ const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
14
+ function presenceMotionSlot(motion, options) {
15
+ // eslint-disable-next-line deprecation/deprecation
16
+ const { as, children, ...rest } = motion !== null && motion !== void 0 ? motion : {};
17
+ if (process.env.NODE_ENV !== 'production') {
18
+ if (typeof as !== 'undefined') {
19
+ throw new Error(`@fluentui/react-motion: "as" property is not supported on motion slots.`);
20
+ }
21
+ }
22
+ if (motion === null) {
23
+ // Heads up!
24
+ // Render function is used there to avoid rendering a motion component and handle unmounting logic
25
+ const isUnmounted = !options.defaultProps.visible && options.defaultProps.unmountOnExit;
26
+ const renderFn = (_, props)=>isUnmounted ? null : /*#__PURE__*/ _react.createElement(_react.Fragment, null, props.children);
27
+ /**
28
+ * Casting is required here as SlotComponentType is a function, not an object.
29
+ * Although SlotComponentType has a function signature, it is still just an object.
30
+ * This is required to make a slot callable (JSX compatible), this is the exact same approach
31
+ * that is used on `@types/react` components
32
+ */ return {
33
+ [_reactutilities.SLOT_RENDER_FUNCTION_SYMBOL]: renderFn,
34
+ [_reactutilities.SLOT_ELEMENT_TYPE_SYMBOL]: options.elementType
35
+ };
36
+ }
37
+ /**
38
+ * Casting is required here as SlotComponentType is a function, not an object.
39
+ * Although SlotComponentType has a function signature, it is still just an object.
40
+ * This is required to make a slot callable (JSX compatible), this is the exact same approach
41
+ * that is used on `@types/react` components
42
+ */ const propsWithMetadata = {
43
+ ...options.defaultProps,
44
+ ...rest,
45
+ [_reactutilities.SLOT_ELEMENT_TYPE_SYMBOL]: options.elementType
46
+ };
47
+ if (typeof children === 'function') {
48
+ propsWithMetadata[_reactutilities.SLOT_RENDER_FUNCTION_SYMBOL] = children;
49
+ }
50
+ return propsWithMetadata;
51
+ }
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["presenceMotionSlot.tsx"],"sourcesContent":["import {\n SLOT_ELEMENT_TYPE_SYMBOL,\n SLOT_RENDER_FUNCTION_SYMBOL,\n type SlotComponentType,\n type SlotRenderFunction,\n} from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { PresenceComponentProps } from '../factories/createPresenceComponent';\nimport type { MotionParam } from '../types';\n\n/**\n * @internal\n */\ntype PresenceMotionSlotRenderProps = Pick<\n PresenceComponentProps,\n 'appear' | 'onMotionFinish' | 'onMotionStart' | 'unmountOnExit' | 'visible'\n>;\n\nexport type PresenceMotionSlotProps<MotionParams extends Record<string, MotionParam> = {}> = Pick<\n PresenceComponentProps,\n 'imperativeRef' | 'onMotionFinish' | 'onMotionStart'\n> & {\n // FIXME: 'as' property is required by design on the slot AP but it does not support components, only intrinsic\n // elements motion slots do not support intrinsic elements, only custom components.\n /**\n * @deprecated Do not use. Presence Motion Slots do not support intrinsic elements.\n *\n * If you want to override the animation, use the children render function instead.\n */\n as?: keyof JSX.IntrinsicElements;\n\n // TODO: remove once React v18 slot API is modified ComponentProps is not properly adding render function as a\n // possible value for children\n children?: SlotRenderFunction<PresenceMotionSlotRenderProps & MotionParams & { children: React.ReactElement }>;\n};\n\nexport function presenceMotionSlot<MotionParams extends Record<string, MotionParam> = {}>(\n motion: PresenceMotionSlotProps<MotionParams> | null | undefined,\n options: {\n elementType: React.FC<PresenceComponentProps & MotionParams>;\n defaultProps: PresenceMotionSlotRenderProps & MotionParams;\n },\n): SlotComponentType<PresenceMotionSlotRenderProps & MotionParams> {\n // eslint-disable-next-line deprecation/deprecation\n const { as, children, ...rest } = motion ?? {};\n\n if (process.env.NODE_ENV !== 'production') {\n if (typeof as !== 'undefined') {\n throw new Error(`@fluentui/react-motion: \"as\" property is not supported on motion slots.`);\n }\n }\n\n if (motion === null) {\n // Heads up!\n // Render function is used there to avoid rendering a motion component and handle unmounting logic\n const isUnmounted = !options.defaultProps.visible && options.defaultProps.unmountOnExit;\n const renderFn: SlotRenderFunction<\n PresenceMotionSlotRenderProps & MotionParams & { children: React.ReactElement }\n > = (_, props) => (isUnmounted ? null : <>{props.children}</>);\n\n /**\n * Casting is required here as SlotComponentType is a function, not an object.\n * Although SlotComponentType has a function signature, it is still just an object.\n * This is required to make a slot callable (JSX compatible), this is the exact same approach\n * that is used on `@types/react` components\n */\n return {\n [SLOT_RENDER_FUNCTION_SYMBOL]: renderFn,\n [SLOT_ELEMENT_TYPE_SYMBOL]: options.elementType,\n } as SlotComponentType<PresenceMotionSlotRenderProps & MotionParams>;\n }\n\n /**\n * Casting is required here as SlotComponentType is a function, not an object.\n * Although SlotComponentType has a function signature, it is still just an object.\n * This is required to make a slot callable (JSX compatible), this is the exact same approach\n * that is used on `@types/react` components\n */\n const propsWithMetadata = {\n ...options.defaultProps,\n ...rest,\n [SLOT_ELEMENT_TYPE_SYMBOL]: options.elementType,\n } as SlotComponentType<PresenceMotionSlotRenderProps & MotionParams>;\n\n if (typeof children === 'function') {\n propsWithMetadata[SLOT_RENDER_FUNCTION_SYMBOL] = children as SlotRenderFunction<\n PresenceMotionSlotRenderProps & MotionParams\n >;\n }\n\n return propsWithMetadata;\n}\n"],"names":["presenceMotionSlot","motion","options","as","children","rest","process","env","NODE_ENV","Error","isUnmounted","defaultProps","visible","unmountOnExit","renderFn","_","props","React","createElement","Fragment","SLOT_RENDER_FUNCTION_SYMBOL","SLOT_ELEMENT_TYPE_SYMBOL","elementType","propsWithMetadata"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;+BAqCgBA;;;eAAAA;;;;gCAhCT;iEACgB;AA+BhB,SAASA,mBACdC,MAAgE,EAChEC,OAGC;IAED,mDAAmD;IACnD,MAAM,EAAEC,EAAE,EAAEC,QAAQ,EAAE,GAAGC,MAAM,GAAGJ,WAAAA,QAAAA,WAAAA,KAAAA,IAAAA,SAAU,CAAC;IAE7C,IAAIK,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QACzC,IAAI,OAAOL,OAAO,aAAa;YAC7B,MAAM,IAAIM,MAAM,CAAC,uEAAuE,CAAC;QAC3F;IACF;IAEA,IAAIR,WAAW,MAAM;QACnB,YAAY;QACZ,kGAAkG;QAClG,MAAMS,cAAc,CAACR,QAAQS,YAAY,CAACC,OAAO,IAAIV,QAAQS,YAAY,CAACE,aAAa;QACvF,MAAMC,WAEF,CAACC,GAAGC,QAAWN,cAAc,OAAA,WAAA,GAAOO,OAAAC,aAAA,CAAAD,OAAAE,QAAA,EAAA,MAAGH,MAAMZ,QAAQ;QAEzD;;;;;KAKC,GACD,OAAO;YACL,CAACgB,2CAAAA,CAA4B,EAAEN;YAC/B,CAACO,wCAAAA,CAAyB,EAAEnB,QAAQoB,WAAW;QACjD;IACF;IAEA;;;;;GAKC,GACD,MAAMC,oBAAoB;QACxB,GAAGrB,QAAQS,YAAY;QACvB,GAAGN,IAAI;QACP,CAACgB,wCAAAA,CAAyB,EAAEnB,QAAQoB,WAAW;IACjD;IAEA,IAAI,OAAOlB,aAAa,YAAY;QAClCmB,iBAAiB,CAACH,2CAAAA,CAA4B,GAAGhB;IAGnD;IAEA,OAAOmB;AACT"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-motion",
3
- "version": "9.3.0",
3
+ "version": "9.4.0",
4
4
  "description": "A package with utilities & motion definitions using Web Animations API",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -39,8 +39,8 @@
39
39
  "@fluentui/scripts-cypress": "*"
40
40
  },
41
41
  "dependencies": {
42
- "@fluentui/react-shared-contexts": "^9.19.1",
43
- "@fluentui/react-utilities": "^9.18.12",
42
+ "@fluentui/react-shared-contexts": "^9.20.0",
43
+ "@fluentui/react-utilities": "^9.18.13",
44
44
  "@swc/helpers": "^0.5.1",
45
45
  "react-is": "^17.0.2"
46
46
  },