@fluentui/react-utilities 0.0.0-nightly003de9a95220220111.1 → 0.0.0-nightly0bc161458e20220126.1
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.json +42 -6
- package/CHANGELOG.md +10 -6
- package/dist/react-utilities.d.ts +41 -7
- package/lib/compose/getSlots.d.ts +2 -3
- package/lib/compose/getSlots.js +2 -2
- package/lib/compose/getSlots.js.map +1 -1
- package/lib/compose/types.d.ts +20 -5
- package/lib/compose/types.js.map +1 -1
- package/lib/hooks/index.d.ts +1 -0
- package/lib/hooks/index.js +1 -0
- package/lib/hooks/index.js.map +1 -1
- package/lib/hooks/useTriggerElement.d.ts +18 -0
- package/lib/hooks/useTriggerElement.js +90 -0
- package/lib/hooks/useTriggerElement.js.map +1 -0
- package/lib/utils/getReactCallbackName.d.ts +25 -0
- package/lib/utils/getReactCallbackName.js +26 -0
- package/lib/utils/getReactCallbackName.js.map +1 -0
- package/lib-commonjs/compose/getSlots.d.ts +2 -3
- package/lib-commonjs/compose/getSlots.js +2 -2
- package/lib-commonjs/compose/getSlots.js.map +1 -1
- package/lib-commonjs/compose/types.d.ts +20 -5
- package/lib-commonjs/compose/types.js.map +1 -1
- package/lib-commonjs/hooks/index.d.ts +1 -0
- package/lib-commonjs/hooks/index.js +2 -0
- package/lib-commonjs/hooks/index.js.map +1 -1
- package/lib-commonjs/hooks/useTriggerElement.d.ts +18 -0
- package/lib-commonjs/hooks/useTriggerElement.js +105 -0
- package/lib-commonjs/hooks/useTriggerElement.js.map +1 -0
- package/lib-commonjs/utils/getReactCallbackName.d.ts +25 -0
- package/lib-commonjs/utils/getReactCallbackName.js +35 -0
- package/lib-commonjs/utils/getReactCallbackName.js.map +1 -0
- package/package.json +3 -3
package/CHANGELOG.json
CHANGED
@@ -2,17 +2,41 @@
|
|
2
2
|
"name": "@fluentui/react-utilities",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "
|
6
|
-
"tag": "@fluentui/react-utilities_v0.0.0-
|
7
|
-
"version": "0.0.0-
|
5
|
+
"date": "Wed, 26 Jan 2022 04:16:50 GMT",
|
6
|
+
"tag": "@fluentui/react-utilities_v0.0.0-nightly0bc161458e20220126.1",
|
7
|
+
"version": "0.0.0-nightly0bc161458e20220126.1",
|
8
8
|
"comments": {
|
9
9
|
"prerelease": [
|
10
10
|
{
|
11
11
|
"author": "email not defined",
|
12
12
|
"package": "@fluentui/react-utilities",
|
13
|
-
"commit": "
|
13
|
+
"commit": "68e7ec86018b052c1f95cc84d4a0a2fbe361eb7c",
|
14
14
|
"comment": "Release nightly v9"
|
15
15
|
},
|
16
|
+
{
|
17
|
+
"author": "behowell@microsoft.com",
|
18
|
+
"package": "@fluentui/react-utilities",
|
19
|
+
"commit": "317209bb5cd57c40f35bc42060acb7e3cce5ec95",
|
20
|
+
"comment": "Rename component hooks add the suffix _unstable, as their API has not been finalized yet"
|
21
|
+
},
|
22
|
+
{
|
23
|
+
"author": "behowell@microsoft.com",
|
24
|
+
"package": "@fluentui/react-utilities",
|
25
|
+
"commit": "7cc28ed8320b00f42d91c63882f10316db2205c5",
|
26
|
+
"comment": "getSlots: remove slotNames param, and infer from state.components instead"
|
27
|
+
},
|
28
|
+
{
|
29
|
+
"author": "olfedias@microsoft.com",
|
30
|
+
"package": "@fluentui/react-utilities",
|
31
|
+
"commit": "d2eb57808a403b70845a732a62b55aa64d66b2a0",
|
32
|
+
"comment": "add useTriggerElement() hook"
|
33
|
+
},
|
34
|
+
{
|
35
|
+
"author": "Humberto.Morimoto@microsoft.com",
|
36
|
+
"package": "@fluentui/react-utilities",
|
37
|
+
"commit": "0bc161458eae5ae8d387172430496ce9829b1bb1",
|
38
|
+
"comment": "Adding ComponentSlotProps to allow ref to be passed in composite components."
|
39
|
+
},
|
16
40
|
{
|
17
41
|
"author": "elcraig@microsoft.com",
|
18
42
|
"package": "@fluentui/react-utilities",
|
@@ -22,8 +46,8 @@
|
|
22
46
|
{
|
23
47
|
"author": "beachball",
|
24
48
|
"package": "@fluentui/react-utilities",
|
25
|
-
"comment": "Bump @fluentui/keyboard-keys to v0.0.0-
|
26
|
-
"commit": "
|
49
|
+
"comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightly0bc161458e20220126.1",
|
50
|
+
"commit": "68e7ec86018b052c1f95cc84d4a0a2fbe361eb7c"
|
27
51
|
}
|
28
52
|
],
|
29
53
|
"none": [
|
@@ -33,6 +57,18 @@
|
|
33
57
|
"commit": "3360b45ec159250b1346c91afad7dce138e6bc20",
|
34
58
|
"comment": "Update API file to version generated by typescript 4.3"
|
35
59
|
},
|
60
|
+
{
|
61
|
+
"author": "olfedias@microsoft.com",
|
62
|
+
"package": "@fluentui/react-utilities",
|
63
|
+
"commit": "c061e98be4b4a718c72a144a1f60bb5515824612",
|
64
|
+
"comment": "remove inline-style-expand-shorthand from tsconfigs"
|
65
|
+
},
|
66
|
+
{
|
67
|
+
"author": "martinhochel@microsoft.com",
|
68
|
+
"package": "@fluentui/react-utilities",
|
69
|
+
"commit": "8dfa712156b70414205b87b5b6d099367b0c297d",
|
70
|
+
"comment": "chore: use storybook runner for all vNext packages"
|
71
|
+
},
|
36
72
|
{
|
37
73
|
"author": "seanmonahan@microsoft.com",
|
38
74
|
"package": "@fluentui/react-utilities",
|
package/CHANGELOG.md
CHANGED
@@ -1,19 +1,23 @@
|
|
1
1
|
# Change Log - @fluentui/react-utilities
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Wed, 26 Jan 2022 04:16:50 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
-
## [0.0.0-
|
7
|
+
## [0.0.0-nightly0bc161458e20220126.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v0.0.0-nightly0bc161458e20220126.1)
|
8
8
|
|
9
|
-
|
10
|
-
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-beta.4..@fluentui/react-utilities_v0.0.0-
|
9
|
+
Wed, 26 Jan 2022 04:16:50 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-beta.4..@fluentui/react-utilities_v0.0.0-nightly0bc161458e20220126.1)
|
11
11
|
|
12
12
|
### Changes
|
13
13
|
|
14
|
-
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/
|
14
|
+
- Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/68e7ec86018b052c1f95cc84d4a0a2fbe361eb7c) by email not defined)
|
15
|
+
- Rename component hooks add the suffix _unstable, as their API has not been finalized yet ([PR #21365](https://github.com/microsoft/fluentui/pull/21365) by behowell@microsoft.com)
|
16
|
+
- getSlots: remove slotNames param, and infer from state.components instead ([PR #21134](https://github.com/microsoft/fluentui/pull/21134) by behowell@microsoft.com)
|
17
|
+
- add useTriggerElement() hook ([PR #21225](https://github.com/microsoft/fluentui/pull/21225) by olfedias@microsoft.com)
|
18
|
+
- Adding ComponentSlotProps to allow ref to be passed in composite components. ([PR #20890](https://github.com/microsoft/fluentui/pull/20890) by Humberto.Morimoto@microsoft.com)
|
15
19
|
- [breaking] Remove useControllableValue hook (use useControllableState instead) ([PR #20865](https://github.com/microsoft/fluentui/pull/20865) by elcraig@microsoft.com)
|
16
|
-
- Bump @fluentui/keyboard-keys to v0.0.0-
|
20
|
+
- Bump @fluentui/keyboard-keys to v0.0.0-nightly0bc161458e20220126.1 ([commit](https://github.com/microsoft/fluentui/commit/68e7ec86018b052c1f95cc84d4a0a2fbe361eb7c) by beachball)
|
17
21
|
|
18
22
|
## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v9.0.0-beta.4)
|
19
23
|
|
@@ -75,8 +75,25 @@ export declare type ComponentProps<Shorthands extends ObjectShorthandPropsRecord
|
|
75
75
|
[Key in keyof Shorthands]?: ShorthandProps<NonNullable<Shorthands[Key]>>;
|
76
76
|
}, Primary & 'root'> & PropsWithoutRef<Shorthands[Primary]>;
|
77
77
|
|
78
|
+
/**
|
79
|
+
* Defines the slot props for a slot that supports a Component type.
|
80
|
+
*
|
81
|
+
* For intrinsic/native elements like 'div', use {@link IntrinsicShorthandProps} instead.
|
82
|
+
*
|
83
|
+
* The generic param is the type of a control, i.e. a React component. For example:
|
84
|
+
*
|
85
|
+
* @example
|
86
|
+
* ```
|
87
|
+
* type Props = {...}
|
88
|
+
* const Button: React.FC<Props> = () => {...}
|
89
|
+
* // $ExpectType ...
|
90
|
+
* type SlotProps = ComponentSlotProps<typeof Button>
|
91
|
+
* ```
|
92
|
+
*/
|
93
|
+
export declare type ComponentSlotProps<Component extends React_2.ComponentType> = Component extends React_2.ComponentType<infer Props> ? ObjectShorthandProps<Props> : never;
|
94
|
+
|
78
95
|
export declare type ComponentState<Shorthands extends ObjectShorthandPropsRecord> = {
|
79
|
-
components
|
96
|
+
components: {
|
80
97
|
[Key in keyof Shorthands]-?: React_2.ComponentType<NonNullable<Shorthands[Key]> extends ObjectShorthandProps<infer P> ? P : NonNullable<Shorthands[Key]>> | (NonNullable<Shorthands[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
|
81
98
|
};
|
82
99
|
} & Shorthands;
|
@@ -185,10 +202,9 @@ export declare const getRTLSafeKey: (key: string, dir: 'ltr' | 'rtl') => string;
|
|
185
202
|
* runtime code filtering props in this function.
|
186
203
|
*
|
187
204
|
* @param state - State including slot definitions
|
188
|
-
* @param slotNames - Name of which props are slots
|
189
205
|
* @returns An object containing the `slots` map and `slotProps` map.
|
190
206
|
*/
|
191
|
-
export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R
|
207
|
+
export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>): {
|
192
208
|
slots: Slots<R>;
|
193
209
|
slotProps: SlotProps<R>;
|
194
210
|
};
|
@@ -228,7 +244,7 @@ export declare const inputProperties: Record<string, number>;
|
|
228
244
|
|
229
245
|
/**
|
230
246
|
* Define the slot arguments for a slot that supports one or more intrinsic element types, such as 'div'.
|
231
|
-
* For slots that support custom components, use {@link
|
247
|
+
* For slots that support custom components, use {@link ComponentSlotProps} instead.
|
232
248
|
*
|
233
249
|
* The first param is the slot's default type if no `as` prop is specified.
|
234
250
|
* The second param is an optional union of alternative types that can be specified for the `as` prop.
|
@@ -279,9 +295,8 @@ export declare const liProperties: Record<string, number>;
|
|
279
295
|
export declare const nullRender: () => null;
|
280
296
|
|
281
297
|
/**
|
282
|
-
*
|
283
|
-
*
|
284
|
-
* For intrinsic elements like 'div', use {@link IntrinsicShorthandProps} instead.
|
298
|
+
* Takes the props we want to support for a slot and adds the ability for `children` to be a render function that takes
|
299
|
+
* those props.
|
285
300
|
*/
|
286
301
|
export declare type ObjectShorthandProps<Props extends {
|
287
302
|
children?: React_2.ReactNode;
|
@@ -643,6 +658,25 @@ export declare function useSSRContext(): SSRContextValue;
|
|
643
658
|
*/
|
644
659
|
export declare function useTimeout(): readonly [(fn: () => void, delay: number) => void, () => void];
|
645
660
|
|
661
|
+
/**
|
662
|
+
* A hook that handles "trigger" pattern.
|
663
|
+
*
|
664
|
+
* Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
|
665
|
+
* by reference.
|
666
|
+
*/
|
667
|
+
export declare function useTriggerElement<TriggerProps extends React_2.HTMLProps<unknown>>(options: UseTriggerElementOptions<TriggerProps>): React_2.ReactNode;
|
668
|
+
|
669
|
+
export declare type UseTriggerElementOptions<TriggerProps> = {
|
670
|
+
/** An actual trigger element or render props function. */
|
671
|
+
children: React_2.ReactElement | ((props: TriggerProps) => React_2.ReactNode) | null | undefined;
|
672
|
+
/** A ref to trigger element. */
|
673
|
+
ref: React_2.Ref<unknown> | undefined;
|
674
|
+
/** Props that are passed to a parent component and should be forwarded down. */
|
675
|
+
outerProps: React_2.HTMLProps<unknown>;
|
676
|
+
/** Custom props including callbacks. */
|
677
|
+
overrideProps: TriggerProps;
|
678
|
+
};
|
679
|
+
|
646
680
|
/**
|
647
681
|
* Hook which synchronously executes a callback when the component is about to unmount.
|
648
682
|
*
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import { AsIntrinsicElement, ComponentState,
|
2
|
+
import type { AsIntrinsicElement, ComponentState, ObjectShorthandProps, ObjectShorthandPropsRecord, UnionToIntersection } from './types';
|
3
3
|
export declare type Slots<S extends ObjectShorthandPropsRecord> = {
|
4
4
|
[K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? As : S[K] extends ObjectShorthandProps<infer P> ? React.ElementType<NonNullable<P>> : React.ElementType<NonNullable<S[K]>>;
|
5
5
|
};
|
@@ -21,10 +21,9 @@ declare type SlotProps<S extends ObjectShorthandPropsRecord> = {
|
|
21
21
|
* runtime code filtering props in this function.
|
22
22
|
*
|
23
23
|
* @param state - State including slot definitions
|
24
|
-
* @param slotNames - Name of which props are slots
|
25
24
|
* @returns An object containing the `slots` map and `slotProps` map.
|
26
25
|
*/
|
27
|
-
export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R
|
26
|
+
export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>): {
|
28
27
|
slots: Slots<R>;
|
29
28
|
slotProps: SlotProps<R>;
|
30
29
|
};
|
package/lib/compose/getSlots.js
CHANGED
@@ -16,13 +16,13 @@ import { omit } from '../utils/omit';
|
|
16
16
|
* runtime code filtering props in this function.
|
17
17
|
*
|
18
18
|
* @param state - State including slot definitions
|
19
|
-
* @param slotNames - Name of which props are slots
|
20
19
|
* @returns An object containing the `slots` map and `slotProps` map.
|
21
20
|
*/
|
22
21
|
|
23
|
-
export function getSlots(state
|
22
|
+
export function getSlots(state) {
|
24
23
|
const slots = {};
|
25
24
|
const slotProps = {};
|
25
|
+
const slotNames = Object.keys(state.components);
|
26
26
|
|
27
27
|
for (const slotName of slotNames) {
|
28
28
|
const [slot, props] = getSlot(state, slotName);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/compose/getSlots.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;
|
1
|
+
{"version":3,"sources":["../../src/compose/getSlots.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,SAAS,UAAT,QAA2B,cAA3B;AACA,SAAS,IAAT,QAAqB,eAArB;AA6BA;;;;;;;;;;;;;;;;AAgBG;;AACH,OAAM,SAAU,QAAV,CACJ,KADI,EACoB;AAKxB,QAAM,KAAK,GAAG,EAAd;AACA,QAAM,SAAS,GAAG,EAAlB;AAEA,QAAM,SAAS,GAAgB,MAAM,CAAC,IAAP,CAAY,KAAK,CAAC,UAAlB,CAA/B;;AACA,OAAK,MAAM,QAAX,IAAuB,SAAvB,EAAkC;AAChC,UAAM,CAAC,IAAD,EAAO,KAAP,IAAgB,OAAO,CAAC,KAAD,EAAQ,QAAR,CAA7B;AACA,IAAA,KAAK,CAAC,QAAD,CAAL,GAAkB,IAAlB;AACA,IAAA,SAAS,CAAC,QAAD,CAAT,GAAsB,KAAtB;AACD;;AACD,SAAO;AAAE,IAAA,KAAF;AAAS,IAAA,SAAS,EAAG;AAArB,GAAP;AACD;;AAED,SAAS,OAAT,CACE,KADF,EAEE,QAFF,EAEa;;;AAEX,MAAI,KAAK,CAAC,QAAD,CAAL,KAAoB,SAAxB,EAAmC;AACjC,WAAO,CAAC,UAAD,EAAa,SAAb,CAAP;AACD;;AACD,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,EAAE,EAAE,MAAhB;AAAwB,OAAG;AAA3B,MAAoC,KAAK,CAAC,QAAD,CAA/C;AAEA,QAAM,IAAI,GAAI,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAAhB,MAAiC,SAAjC,IAA8C,OAAO,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAAP,KAAsC,QAApF,GACV,MAAM,KAAI,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAApB,CAAN,IAA0C,KADhC,GAEV,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAFJ;;AAIA,MAAI,OAAO,QAAP,KAAoB,UAAxB,EAAoC;AAClC,UAAM,MAAM,GAAG,QAAf;AACA,WAAO,CACL,KAAK,CAAC,QADD,EAEJ;AACC,MAAA,QAAQ,EAAE,MAAM,CAAC,IAAD,EAAO,IAAP;AADjB,KAFI,CAAP;AAMD;;AAED,QAAM,gBAAgB,GAAG,OAAO,IAAP,KAAgB,QAAhB,KAA4B,CAAA,EAAA,GAAA,KAAK,CAAC,QAAD,CAAL,MAAe,IAAf,IAAe,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAe,EAAA,CAAE,EAA7C,CAAzB;AACA,QAAM,SAAS,GAAI,gBAAgB,GAAG,IAAI,CAAC,KAAK,CAAC,QAAD,CAAN,EAAmB,CAAC,IAAD,CAAnB,CAAP,GAAoC,KAAK,CAAC,QAAD,CAA5E;AAEA,SAAO,CAAC,IAAD,EAAO,SAAP,CAAP;AACD","sourceRoot":""}
|
package/lib/compose/types.d.ts
CHANGED
@@ -12,18 +12,33 @@ export declare type DefaultObjectShorthandProps = ObjectShorthandProps<Pick<Reac
|
|
12
12
|
as?: keyof JSX.IntrinsicElements;
|
13
13
|
}>;
|
14
14
|
/**
|
15
|
-
*
|
16
|
-
*
|
17
|
-
* For intrinsic elements like 'div', use {@link IntrinsicShorthandProps} instead.
|
15
|
+
* Takes the props we want to support for a slot and adds the ability for `children` to be a render function that takes
|
16
|
+
* those props.
|
18
17
|
*/
|
19
18
|
export declare type ObjectShorthandProps<Props extends {
|
20
19
|
children?: React.ReactNode;
|
21
20
|
} = {}> = Props & {
|
22
21
|
children?: Props['children'] | ShorthandRenderFunction<Props>;
|
23
22
|
};
|
23
|
+
/**
|
24
|
+
* Defines the slot props for a slot that supports a Component type.
|
25
|
+
*
|
26
|
+
* For intrinsic/native elements like 'div', use {@link IntrinsicShorthandProps} instead.
|
27
|
+
*
|
28
|
+
* The generic param is the type of a control, i.e. a React component. For example:
|
29
|
+
*
|
30
|
+
* @example
|
31
|
+
* ```
|
32
|
+
* type Props = {...}
|
33
|
+
* const Button: React.FC<Props> = () => {...}
|
34
|
+
* // $ExpectType ...
|
35
|
+
* type SlotProps = ComponentSlotProps<typeof Button>
|
36
|
+
* ```
|
37
|
+
*/
|
38
|
+
export declare type ComponentSlotProps<Component extends React.ComponentType> = Component extends React.ComponentType<infer Props> ? ObjectShorthandProps<Props> : never;
|
24
39
|
/**
|
25
40
|
* Define the slot arguments for a slot that supports one or more intrinsic element types, such as 'div'.
|
26
|
-
* For slots that support custom components, use {@link
|
41
|
+
* For slots that support custom components, use {@link ComponentSlotProps} instead.
|
27
42
|
*
|
28
43
|
* The first param is the slot's default type if no `as` prop is specified.
|
29
44
|
* The second param is an optional union of alternative types that can be specified for the `as` prop.
|
@@ -79,7 +94,7 @@ export declare type ComponentProps<Shorthands extends ObjectShorthandPropsRecord
|
|
79
94
|
[Key in keyof Shorthands]?: ShorthandProps<NonNullable<Shorthands[Key]>>;
|
80
95
|
}, Primary & 'root'> & PropsWithoutRef<Shorthands[Primary]>;
|
81
96
|
export declare type ComponentState<Shorthands extends ObjectShorthandPropsRecord> = {
|
82
|
-
components
|
97
|
+
components: {
|
83
98
|
[Key in keyof Shorthands]-?: React.ComponentType<NonNullable<Shorthands[Key]> extends ObjectShorthandProps<infer P> ? P : NonNullable<Shorthands[Key]>> | (NonNullable<Shorthands[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
|
84
99
|
};
|
85
100
|
} & Shorthands;
|
package/lib/compose/types.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/compose/types.ts"],"names":[],"mappings":"
|
1
|
+
{"version":3,"sources":["../../src/compose/types.ts"],"names":[],"mappings":"WAoKA;AACA;AACA;AACA;AACA","sourceRoot":""}
|
package/lib/hooks/index.d.ts
CHANGED
package/lib/hooks/index.js
CHANGED
@@ -11,6 +11,7 @@ export * from './useOnClickOutside';
|
|
11
11
|
export * from './useOnScrollOutside';
|
12
12
|
export * from './usePrevious';
|
13
13
|
export * from './useTimeout';
|
14
|
+
export * from './useTriggerElement';
|
14
15
|
export * from './useUnmount';
|
15
16
|
export * from './useForceUpdate';
|
16
17
|
//# sourceMappingURL=index.js.map
|
package/lib/hooks/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC"}
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC;AAC3B,cAAc,oBAAoB,CAAC;AACnC,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,6BAA6B,CAAC;AAC5C,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,qBAAqB,CAAC;AACpC,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC"}
|
@@ -0,0 +1,18 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
export declare type UseTriggerElementOptions<TriggerProps> = {
|
3
|
+
/** An actual trigger element or render props function. */
|
4
|
+
children: React.ReactElement | ((props: TriggerProps) => React.ReactNode) | null | undefined;
|
5
|
+
/** A ref to trigger element. */
|
6
|
+
ref: React.Ref<unknown> | undefined;
|
7
|
+
/** Props that are passed to a parent component and should be forwarded down. */
|
8
|
+
outerProps: React.HTMLProps<unknown>;
|
9
|
+
/** Custom props including callbacks. */
|
10
|
+
overrideProps: TriggerProps;
|
11
|
+
};
|
12
|
+
/**
|
13
|
+
* A hook that handles "trigger" pattern.
|
14
|
+
*
|
15
|
+
* Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
|
16
|
+
* by reference.
|
17
|
+
*/
|
18
|
+
export declare function useTriggerElement<TriggerProps extends React.HTMLProps<unknown>>(options: UseTriggerElementOptions<TriggerProps>): React.ReactNode;
|
@@ -0,0 +1,90 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
import { applyTriggerPropsToChildren } from '../utils/applyTriggerPropsToChildren';
|
3
|
+
import { getReactCallbackName } from '../utils/getReactCallbackName';
|
4
|
+
import { onlyChild } from '../utils/onlyChild';
|
5
|
+
import { useEventCallback } from './useEventCallback';
|
6
|
+
import { useMergedRefs } from './useMergedRefs';
|
7
|
+
const CAPTURE_CALLBACK_REGEX = /on[A-Z].+Capture$/;
|
8
|
+
const CALLBACK_REGEX = /on[A-Z].+/;
|
9
|
+
/**
|
10
|
+
* A hook that handles "trigger" pattern.
|
11
|
+
*
|
12
|
+
* Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
|
13
|
+
* by reference.
|
14
|
+
*/
|
15
|
+
|
16
|
+
export function useTriggerElement(options) {
|
17
|
+
const {
|
18
|
+
children,
|
19
|
+
ref,
|
20
|
+
outerProps,
|
21
|
+
overrideProps
|
22
|
+
} = options;
|
23
|
+
let childProps = {};
|
24
|
+
let childRef = null; // child can be a render func, `applyTriggerPropsToChildren`does the same check again
|
25
|
+
// TODO figure out a way to only do this check once
|
26
|
+
|
27
|
+
if ( /*#__PURE__*/React.isValidElement(children)) {
|
28
|
+
const child = onlyChild(children);
|
29
|
+
childProps = child.props;
|
30
|
+
childRef = child.ref;
|
31
|
+
} // Two separate callbacks are needed to handle properly bubble and capture callbacks
|
32
|
+
// "getReactCallbackName()" could return proper callback name, but it's possible only with React 17
|
33
|
+
|
34
|
+
|
35
|
+
const handleBubbleEvent = useEventCallback(ev => {
|
36
|
+
var _a, _b, _c;
|
37
|
+
|
38
|
+
const callbackName = getReactCallbackName(ev);
|
39
|
+
|
40
|
+
if (callbackName) {
|
41
|
+
// Typecast is required as "ev" is "React.SyntheticEvent" while callbacks have stricter typings and accept
|
42
|
+
// "FocusEvent", "ClipboardEvent" and etc.
|
43
|
+
|
44
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
45
|
+
(_a = childProps[callbackName]) === null || _a === void 0 ? void 0 : _a.call(childProps, ev);
|
46
|
+
(_b = overrideProps[callbackName]) === null || _b === void 0 ? void 0 : _b.call(overrideProps, ev);
|
47
|
+
(_c = outerProps[callbackName]) === null || _c === void 0 ? void 0 : _c.call(outerProps, ev);
|
48
|
+
/* eslint-enable @typescript-eslint/no-explicit-any */
|
49
|
+
}
|
50
|
+
});
|
51
|
+
const handleCaptureEvent = useEventCallback(ev => {
|
52
|
+
var _a, _b, _c;
|
53
|
+
|
54
|
+
const callbackName = getReactCallbackName(ev) + 'Capture';
|
55
|
+
|
56
|
+
if (callbackName) {
|
57
|
+
// Typecast is required as "ev" is "React.SyntheticEvent" while callbacks have stricter typings and accept
|
58
|
+
// "FocusEvent", "ClipboardEvent" and etc.
|
59
|
+
|
60
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
61
|
+
(_a = childProps[callbackName]) === null || _a === void 0 ? void 0 : _a.call(childProps, ev);
|
62
|
+
(_b = overrideProps[callbackName]) === null || _b === void 0 ? void 0 : _b.call(overrideProps, ev);
|
63
|
+
(_c = outerProps[callbackName]) === null || _c === void 0 ? void 0 : _c.call(outerProps, ev);
|
64
|
+
/* eslint-enable @typescript-eslint/no-explicit-any */
|
65
|
+
}
|
66
|
+
});
|
67
|
+
const mergedPropEntries = Object.entries({ ...outerProps,
|
68
|
+
...overrideProps,
|
69
|
+
...childProps,
|
70
|
+
// Undocumented, but React supports ref cloning through props
|
71
|
+
ref: useMergedRefs(childRef, ref)
|
72
|
+
}); // TODO: fix me after https://github.com/microsoft/fluentui/issues/21229
|
73
|
+
// Causes TS error:
|
74
|
+
// "Property 'fromEntries' does not exist on type 'ObjectConstructor'"
|
75
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
76
|
+
|
77
|
+
const triggerProps = Object.fromEntries(mergedPropEntries.map(([propName, propValue]) => {
|
78
|
+
if (propName.match(CAPTURE_CALLBACK_REGEX)) {
|
79
|
+
return [propName, handleCaptureEvent];
|
80
|
+
}
|
81
|
+
|
82
|
+
if (propName.match(CALLBACK_REGEX)) {
|
83
|
+
return [propName, handleBubbleEvent];
|
84
|
+
}
|
85
|
+
|
86
|
+
return [propName, propValue];
|
87
|
+
}));
|
88
|
+
return applyTriggerPropsToChildren(children, triggerProps);
|
89
|
+
}
|
90
|
+
//# sourceMappingURL=useTriggerElement.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../src/hooks/useTriggerElement.ts"],"names":[],"mappings":"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","sourceRoot":""}
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
interface ReactSyntheticEvent extends React.SyntheticEvent<unknown> {
|
3
|
+
_reactName?: string;
|
4
|
+
dispatchConfig?: {
|
5
|
+
registrationName: string;
|
6
|
+
phasedRegistrationNames: {
|
7
|
+
bubbled: string;
|
8
|
+
captured: string;
|
9
|
+
};
|
10
|
+
};
|
11
|
+
}
|
12
|
+
declare type NonUndefined<A> = A extends undefined ? never : A;
|
13
|
+
declare type FunctionKeys<T extends object> = {
|
14
|
+
[K in keyof T]-?: NonUndefined<T[K]> extends Function ? K : never;
|
15
|
+
}[keyof T];
|
16
|
+
export declare type ReactCallbackName = FunctionKeys<React.DOMAttributes<unknown>>;
|
17
|
+
/**
|
18
|
+
* React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
|
19
|
+
*
|
20
|
+
* Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
|
21
|
+
* ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
|
22
|
+
* are handled in bubble phase.
|
23
|
+
*/
|
24
|
+
export declare function getReactCallbackName(event: ReactSyntheticEvent): ReactCallbackName | undefined;
|
25
|
+
export {};
|
@@ -0,0 +1,26 @@
|
|
1
|
+
/**
|
2
|
+
* React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
|
3
|
+
*
|
4
|
+
* Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
|
5
|
+
* ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
|
6
|
+
* are handled in bubble phase.
|
7
|
+
*/
|
8
|
+
export function getReactCallbackName(event) {
|
9
|
+
if (event._reactName) {
|
10
|
+
return event._reactName;
|
11
|
+
}
|
12
|
+
|
13
|
+
if (event.dispatchConfig) {
|
14
|
+
if (event.dispatchConfig.registrationName) {
|
15
|
+
return event.dispatchConfig.registrationName;
|
16
|
+
}
|
17
|
+
|
18
|
+
return event.dispatchConfig.phasedRegistrationNames.bubbled;
|
19
|
+
}
|
20
|
+
|
21
|
+
if (process.env.NODE_ENV !== 'production') {
|
22
|
+
// eslint-disable-next-line no-console
|
23
|
+
console.error(['Passed React.SyntheticEvent does not contain ".dispatchConfig" or "._reactName".', 'This should not happen, please report it to https://github.com/microsoft/fluentui']);
|
24
|
+
}
|
25
|
+
}
|
26
|
+
//# sourceMappingURL=getReactCallbackName.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../src/utils/getReactCallbackName.ts"],"names":[],"mappings":"AAwBA;;;;;;AAMG;AACH,OAAM,SAAU,oBAAV,CAA+B,KAA/B,EAAyD;AAC7D,MAAI,KAAK,CAAC,UAAV,EAAsB;AACpB,WAAO,KAAK,CAAC,UAAb;AACD;;AAED,MAAI,KAAK,CAAC,cAAV,EAA0B;AACxB,QAAI,KAAK,CAAC,cAAN,CAAqB,gBAAzB,EAA2C;AACzC,aAAO,KAAK,CAAC,cAAN,CAAqB,gBAA5B;AACD;;AAED,WAAO,KAAK,CAAC,cAAN,CAAqB,uBAArB,CAA6C,OAApD;AACD;;AAED,MAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;AACzC;AACA,IAAA,OAAO,CAAC,KAAR,CAAc,CACZ,kFADY,EAEZ,mFAFY,CAAd;AAID;AACF","sourceRoot":""}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import { AsIntrinsicElement, ComponentState,
|
2
|
+
import type { AsIntrinsicElement, ComponentState, ObjectShorthandProps, ObjectShorthandPropsRecord, UnionToIntersection } from './types';
|
3
3
|
export declare type Slots<S extends ObjectShorthandPropsRecord> = {
|
4
4
|
[K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? As : S[K] extends ObjectShorthandProps<infer P> ? React.ElementType<NonNullable<P>> : React.ElementType<NonNullable<S[K]>>;
|
5
5
|
};
|
@@ -21,10 +21,9 @@ declare type SlotProps<S extends ObjectShorthandPropsRecord> = {
|
|
21
21
|
* runtime code filtering props in this function.
|
22
22
|
*
|
23
23
|
* @param state - State including slot definitions
|
24
|
-
* @param slotNames - Name of which props are slots
|
25
24
|
* @returns An object containing the `slots` map and `slotProps` map.
|
26
25
|
*/
|
27
|
-
export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R
|
26
|
+
export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>): {
|
28
27
|
slots: Slots<R>;
|
29
28
|
slotProps: SlotProps<R>;
|
30
29
|
};
|
@@ -25,14 +25,14 @@ const omit_1 = /*#__PURE__*/require("../utils/omit");
|
|
25
25
|
* runtime code filtering props in this function.
|
26
26
|
*
|
27
27
|
* @param state - State including slot definitions
|
28
|
-
* @param slotNames - Name of which props are slots
|
29
28
|
* @returns An object containing the `slots` map and `slotProps` map.
|
30
29
|
*/
|
31
30
|
|
32
31
|
|
33
|
-
function getSlots(state
|
32
|
+
function getSlots(state) {
|
34
33
|
const slots = {};
|
35
34
|
const slotProps = {};
|
35
|
+
const slotNames = Object.keys(state.components);
|
36
36
|
|
37
37
|
for (const slotName of slotNames) {
|
38
38
|
const [slot, props] = getSlot(state, slotName);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/compose/getSlots.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;
|
1
|
+
{"version":3,"sources":["../../src/compose/getSlots.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,MAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;AA6BA;;;;;;;;;;;;;;;;AAgBG;;;AACH,SAAgB,QAAhB,CACE,KADF,EAC0B;AAKxB,QAAM,KAAK,GAAG,EAAd;AACA,QAAM,SAAS,GAAG,EAAlB;AAEA,QAAM,SAAS,GAAgB,MAAM,CAAC,IAAP,CAAY,KAAK,CAAC,UAAlB,CAA/B;;AACA,OAAK,MAAM,QAAX,IAAuB,SAAvB,EAAkC;AAChC,UAAM,CAAC,IAAD,EAAO,KAAP,IAAgB,OAAO,CAAC,KAAD,EAAQ,QAAR,CAA7B;AACA,IAAA,KAAK,CAAC,QAAD,CAAL,GAAkB,IAAlB;AACA,IAAA,SAAS,CAAC,QAAD,CAAT,GAAsB,KAAtB;AACD;;AACD,SAAO;AAAE,IAAA,KAAF;AAAS,IAAA,SAAS,EAAG;AAArB,GAAP;AACD;;AAhBD,OAAA,CAAA,QAAA,GAAA,QAAA;;AAkBA,SAAS,OAAT,CACE,KADF,EAEE,QAFF,EAEa;;;AAEX,MAAI,KAAK,CAAC,QAAD,CAAL,KAAoB,SAAxB,EAAmC;AACjC,WAAO,CAAC,YAAA,CAAA,UAAD,EAAa,SAAb,CAAP;AACD;;AACD,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,EAAE,EAAE,MAAhB;AAAwB,OAAG;AAA3B,MAAoC,KAAK,CAAC,QAAD,CAA/C;AAEA,QAAM,IAAI,GAAI,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAAhB,MAAiC,SAAjC,IAA8C,OAAO,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAAP,KAAsC,QAApF,GACV,MAAM,KAAI,CAAA,EAAA,GAAA,KAAK,CAAC,UAAN,MAAgB,IAAhB,IAAgB,EAAA,KAAA,KAAA,CAAhB,GAAgB,KAAA,CAAhB,GAAgB,EAAA,CAAG,QAAH,CAApB,CAAN,IAA0C,KADhC,GAEV,KAAK,CAAC,UAAN,CAAiB,QAAjB,CAFJ;;AAIA,MAAI,OAAO,QAAP,KAAoB,UAAxB,EAAoC;AAClC,UAAM,MAAM,GAAG,QAAf;AACA,WAAO,CACL,KAAK,CAAC,QADD,EAEJ;AACC,MAAA,QAAQ,EAAE,MAAM,CAAC,IAAD,EAAO,IAAP;AADjB,KAFI,CAAP;AAMD;;AAED,QAAM,gBAAgB,GAAG,OAAO,IAAP,KAAgB,QAAhB,KAA4B,CAAA,EAAA,GAAA,KAAK,CAAC,QAAD,CAAL,MAAe,IAAf,IAAe,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAe,EAAA,CAAE,EAA7C,CAAzB;AACA,QAAM,SAAS,GAAI,gBAAgB,GAAG,MAAA,CAAA,IAAA,CAAK,KAAK,CAAC,QAAD,CAAV,EAAuB,CAAC,IAAD,CAAvB,CAAH,GAAoC,KAAK,CAAC,QAAD,CAA5E;AAEA,SAAO,CAAC,IAAD,EAAO,SAAP,CAAP;AACD","sourceRoot":""}
|
@@ -12,18 +12,33 @@ export declare type DefaultObjectShorthandProps = ObjectShorthandProps<Pick<Reac
|
|
12
12
|
as?: keyof JSX.IntrinsicElements;
|
13
13
|
}>;
|
14
14
|
/**
|
15
|
-
*
|
16
|
-
*
|
17
|
-
* For intrinsic elements like 'div', use {@link IntrinsicShorthandProps} instead.
|
15
|
+
* Takes the props we want to support for a slot and adds the ability for `children` to be a render function that takes
|
16
|
+
* those props.
|
18
17
|
*/
|
19
18
|
export declare type ObjectShorthandProps<Props extends {
|
20
19
|
children?: React.ReactNode;
|
21
20
|
} = {}> = Props & {
|
22
21
|
children?: Props['children'] | ShorthandRenderFunction<Props>;
|
23
22
|
};
|
23
|
+
/**
|
24
|
+
* Defines the slot props for a slot that supports a Component type.
|
25
|
+
*
|
26
|
+
* For intrinsic/native elements like 'div', use {@link IntrinsicShorthandProps} instead.
|
27
|
+
*
|
28
|
+
* The generic param is the type of a control, i.e. a React component. For example:
|
29
|
+
*
|
30
|
+
* @example
|
31
|
+
* ```
|
32
|
+
* type Props = {...}
|
33
|
+
* const Button: React.FC<Props> = () => {...}
|
34
|
+
* // $ExpectType ...
|
35
|
+
* type SlotProps = ComponentSlotProps<typeof Button>
|
36
|
+
* ```
|
37
|
+
*/
|
38
|
+
export declare type ComponentSlotProps<Component extends React.ComponentType> = Component extends React.ComponentType<infer Props> ? ObjectShorthandProps<Props> : never;
|
24
39
|
/**
|
25
40
|
* Define the slot arguments for a slot that supports one or more intrinsic element types, such as 'div'.
|
26
|
-
* For slots that support custom components, use {@link
|
41
|
+
* For slots that support custom components, use {@link ComponentSlotProps} instead.
|
27
42
|
*
|
28
43
|
* The first param is the slot's default type if no `as` prop is specified.
|
29
44
|
* The second param is an optional union of alternative types that can be specified for the `as` prop.
|
@@ -79,7 +94,7 @@ export declare type ComponentProps<Shorthands extends ObjectShorthandPropsRecord
|
|
79
94
|
[Key in keyof Shorthands]?: ShorthandProps<NonNullable<Shorthands[Key]>>;
|
80
95
|
}, Primary & 'root'> & PropsWithoutRef<Shorthands[Primary]>;
|
81
96
|
export declare type ComponentState<Shorthands extends ObjectShorthandPropsRecord> = {
|
82
|
-
components
|
97
|
+
components: {
|
83
98
|
[Key in keyof Shorthands]-?: React.ComponentType<NonNullable<Shorthands[Key]> extends ObjectShorthandProps<infer P> ? P : NonNullable<Shorthands[Key]>> | (NonNullable<Shorthands[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
|
84
99
|
};
|
85
100
|
} & Shorthands;
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/compose/types.ts"],"names":[],"mappings":";;;;
|
1
|
+
{"version":3,"sources":["../../src/compose/types.ts"],"names":[],"mappings":";;;;IAoKA;AACA;AACA;AACA;AACA","sourceRoot":""}
|
@@ -32,6 +32,8 @@ tslib_1.__exportStar(require("./usePrevious"), exports);
|
|
32
32
|
|
33
33
|
tslib_1.__exportStar(require("./useTimeout"), exports);
|
34
34
|
|
35
|
+
tslib_1.__exportStar(require("./useTriggerElement"), exports);
|
36
|
+
|
35
37
|
tslib_1.__exportStar(require("./useUnmount"), exports);
|
36
38
|
|
37
39
|
tslib_1.__exportStar(require("./useForceUpdate"), exports);
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../src/hooks/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,6BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,sBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA","sourceRoot":""}
|
1
|
+
{"version":3,"sources":["../../src/hooks/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,SAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,6BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,sBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA","sourceRoot":""}
|
@@ -0,0 +1,18 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
export declare type UseTriggerElementOptions<TriggerProps> = {
|
3
|
+
/** An actual trigger element or render props function. */
|
4
|
+
children: React.ReactElement | ((props: TriggerProps) => React.ReactNode) | null | undefined;
|
5
|
+
/** A ref to trigger element. */
|
6
|
+
ref: React.Ref<unknown> | undefined;
|
7
|
+
/** Props that are passed to a parent component and should be forwarded down. */
|
8
|
+
outerProps: React.HTMLProps<unknown>;
|
9
|
+
/** Custom props including callbacks. */
|
10
|
+
overrideProps: TriggerProps;
|
11
|
+
};
|
12
|
+
/**
|
13
|
+
* A hook that handles "trigger" pattern.
|
14
|
+
*
|
15
|
+
* Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
|
16
|
+
* by reference.
|
17
|
+
*/
|
18
|
+
export declare function useTriggerElement<TriggerProps extends React.HTMLProps<unknown>>(options: UseTriggerElementOptions<TriggerProps>): React.ReactNode;
|
@@ -0,0 +1,105 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.useTriggerElement = void 0;
|
7
|
+
|
8
|
+
const React = /*#__PURE__*/require("react");
|
9
|
+
|
10
|
+
const applyTriggerPropsToChildren_1 = /*#__PURE__*/require("../utils/applyTriggerPropsToChildren");
|
11
|
+
|
12
|
+
const getReactCallbackName_1 = /*#__PURE__*/require("../utils/getReactCallbackName");
|
13
|
+
|
14
|
+
const onlyChild_1 = /*#__PURE__*/require("../utils/onlyChild");
|
15
|
+
|
16
|
+
const useEventCallback_1 = /*#__PURE__*/require("./useEventCallback");
|
17
|
+
|
18
|
+
const useMergedRefs_1 = /*#__PURE__*/require("./useMergedRefs");
|
19
|
+
|
20
|
+
const CAPTURE_CALLBACK_REGEX = /on[A-Z].+Capture$/;
|
21
|
+
const CALLBACK_REGEX = /on[A-Z].+/;
|
22
|
+
/**
|
23
|
+
* A hook that handles "trigger" pattern.
|
24
|
+
*
|
25
|
+
* Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
|
26
|
+
* by reference.
|
27
|
+
*/
|
28
|
+
|
29
|
+
function useTriggerElement(options) {
|
30
|
+
const {
|
31
|
+
children,
|
32
|
+
ref,
|
33
|
+
outerProps,
|
34
|
+
overrideProps
|
35
|
+
} = options;
|
36
|
+
let childProps = {};
|
37
|
+
let childRef = null; // child can be a render func, `applyTriggerPropsToChildren`does the same check again
|
38
|
+
// TODO figure out a way to only do this check once
|
39
|
+
|
40
|
+
if (React.isValidElement(children)) {
|
41
|
+
const child = onlyChild_1.onlyChild(children);
|
42
|
+
childProps = child.props;
|
43
|
+
childRef = child.ref;
|
44
|
+
} // Two separate callbacks are needed to handle properly bubble and capture callbacks
|
45
|
+
// "getReactCallbackName()" could return proper callback name, but it's possible only with React 17
|
46
|
+
|
47
|
+
|
48
|
+
const handleBubbleEvent = useEventCallback_1.useEventCallback(ev => {
|
49
|
+
var _a, _b, _c;
|
50
|
+
|
51
|
+
const callbackName = getReactCallbackName_1.getReactCallbackName(ev);
|
52
|
+
|
53
|
+
if (callbackName) {
|
54
|
+
// Typecast is required as "ev" is "React.SyntheticEvent" while callbacks have stricter typings and accept
|
55
|
+
// "FocusEvent", "ClipboardEvent" and etc.
|
56
|
+
|
57
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
58
|
+
(_a = childProps[callbackName]) === null || _a === void 0 ? void 0 : _a.call(childProps, ev);
|
59
|
+
(_b = overrideProps[callbackName]) === null || _b === void 0 ? void 0 : _b.call(overrideProps, ev);
|
60
|
+
(_c = outerProps[callbackName]) === null || _c === void 0 ? void 0 : _c.call(outerProps, ev);
|
61
|
+
/* eslint-enable @typescript-eslint/no-explicit-any */
|
62
|
+
}
|
63
|
+
});
|
64
|
+
const handleCaptureEvent = useEventCallback_1.useEventCallback(ev => {
|
65
|
+
var _a, _b, _c;
|
66
|
+
|
67
|
+
const callbackName = getReactCallbackName_1.getReactCallbackName(ev) + 'Capture';
|
68
|
+
|
69
|
+
if (callbackName) {
|
70
|
+
// Typecast is required as "ev" is "React.SyntheticEvent" while callbacks have stricter typings and accept
|
71
|
+
// "FocusEvent", "ClipboardEvent" and etc.
|
72
|
+
|
73
|
+
/* eslint-disable @typescript-eslint/no-explicit-any */
|
74
|
+
(_a = childProps[callbackName]) === null || _a === void 0 ? void 0 : _a.call(childProps, ev);
|
75
|
+
(_b = overrideProps[callbackName]) === null || _b === void 0 ? void 0 : _b.call(overrideProps, ev);
|
76
|
+
(_c = outerProps[callbackName]) === null || _c === void 0 ? void 0 : _c.call(outerProps, ev);
|
77
|
+
/* eslint-enable @typescript-eslint/no-explicit-any */
|
78
|
+
}
|
79
|
+
});
|
80
|
+
const mergedPropEntries = Object.entries({ ...outerProps,
|
81
|
+
...overrideProps,
|
82
|
+
...childProps,
|
83
|
+
// Undocumented, but React supports ref cloning through props
|
84
|
+
ref: useMergedRefs_1.useMergedRefs(childRef, ref)
|
85
|
+
}); // TODO: fix me after https://github.com/microsoft/fluentui/issues/21229
|
86
|
+
// Causes TS error:
|
87
|
+
// "Property 'fromEntries' does not exist on type 'ObjectConstructor'"
|
88
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
89
|
+
|
90
|
+
const triggerProps = Object.fromEntries(mergedPropEntries.map(([propName, propValue]) => {
|
91
|
+
if (propName.match(CAPTURE_CALLBACK_REGEX)) {
|
92
|
+
return [propName, handleCaptureEvent];
|
93
|
+
}
|
94
|
+
|
95
|
+
if (propName.match(CALLBACK_REGEX)) {
|
96
|
+
return [propName, handleBubbleEvent];
|
97
|
+
}
|
98
|
+
|
99
|
+
return [propName, propValue];
|
100
|
+
}));
|
101
|
+
return applyTriggerPropsToChildren_1.applyTriggerPropsToChildren(children, triggerProps);
|
102
|
+
}
|
103
|
+
|
104
|
+
exports.useTriggerElement = useTriggerElement;
|
105
|
+
//# sourceMappingURL=useTriggerElement.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../src/hooks/useTriggerElement.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,6BAAA,gBAAA,OAAA,CAAA,sCAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,+BAAA,CAAA;;AACA,MAAA,WAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AAiBA,MAAM,sBAAsB,GAAG,mBAA/B;AACA,MAAM,cAAc,GAAG,WAAvB;AAEA;;;;;AAKG;;AACH,SAAgB,iBAAhB,CACE,OADF,EACiD;AAE/C,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA,GAAZ;AAAiB,IAAA,UAAjB;AAA6B,IAAA;AAA7B,MAA+C,OAArD;AAEA,MAAI,UAAU,GAA6B,EAA3C;AACA,MAAI,QAAQ,GAAG,IAAf,CAL+C,CAO/C;AACA;;AACA,MAAI,KAAK,CAAC,cAAN,CAAqB,QAArB,CAAJ,EAAoC;AAClC,UAAM,KAAK,GAAG,WAAA,CAAA,SAAA,CAAU,QAAV,CAAd;AAEA,IAAA,UAAU,GAAG,KAAK,CAAC,KAAnB;AACA,IAAA,QAAQ,GAAK,KAAkD,CAAC,GAAhE;AACD,GAd8C,CAgB/C;AACA;;;AAEA,QAAM,iBAAiB,GAAG,kBAAA,CAAA,gBAAA,CAAkB,EAAD,IAAsC;;;AAC/E,UAAM,YAAY,GAAG,sBAAA,CAAA,oBAAA,CAAqB,EAArB,CAArB;;AAEA,QAAI,YAAJ,EAAkB;AAChB;AACA;;AACA;AACA,OAAA,EAAA,GAAA,UAAU,CAAC,YAAD,CAAV,MAAwB,IAAxB,IAAwB,EAAA,KAAA,KAAA,CAAxB,GAAwB,KAAA,CAAxB,GAAwB,EAAA,CAAA,IAAA,CAAxB,UAAwB,EAAG,EAAH,CAAxB;AACA,OAAA,EAAA,GAAA,aAAa,CAAC,YAAD,CAAb,MAA2B,IAA3B,IAA2B,EAAA,KAAA,KAAA,CAA3B,GAA2B,KAAA,CAA3B,GAA2B,EAAA,CAAA,IAAA,CAA3B,aAA2B,EAAG,EAAH,CAA3B;AACA,OAAA,EAAA,GAAA,UAAU,CAAC,YAAD,CAAV,MAAwB,IAAxB,IAAwB,EAAA,KAAA,KAAA,CAAxB,GAAwB,KAAA,CAAxB,GAAwB,EAAA,CAAA,IAAA,CAAxB,UAAwB,EAAG,EAAH,CAAxB;AACA;AACD;AACF,GAZyB,CAA1B;AAaA,QAAM,kBAAkB,GAAG,kBAAA,CAAA,gBAAA,CAAkB,EAAD,IAAsC;;;AAChF,UAAM,YAAY,GAAK,sBAAA,CAAA,oBAAA,CAAqB,EAArB,IAA2B,SAAlD;;AAEA,QAAI,YAAJ,EAAkB;AAChB;AACA;;AACA;AACA,OAAA,EAAA,GAAA,UAAU,CAAC,YAAD,CAAV,MAAwB,IAAxB,IAAwB,EAAA,KAAA,KAAA,CAAxB,GAAwB,KAAA,CAAxB,GAAwB,EAAA,CAAA,IAAA,CAAxB,UAAwB,EAAG,EAAH,CAAxB;AACA,OAAA,EAAA,GAAA,aAAa,CAAC,YAAD,CAAb,MAA2B,IAA3B,IAA2B,EAAA,KAAA,KAAA,CAA3B,GAA2B,KAAA,CAA3B,GAA2B,EAAA,CAAA,IAAA,CAA3B,aAA2B,EAAG,EAAH,CAA3B;AACA,OAAA,EAAA,GAAA,UAAU,CAAC,YAAD,CAAV,MAAwB,IAAxB,IAAwB,EAAA,KAAA,KAAA,CAAxB,GAAwB,KAAA,CAAxB,GAAwB,EAAA,CAAA,IAAA,CAAxB,UAAwB,EAAG,EAAH,CAAxB;AACA;AACD;AACF,GAZ0B,CAA3B;AAcA,QAAM,iBAAiB,GAAG,MAAM,CAAC,OAAP,CAAe,EACvC,GAAG,UADoC;AAEvC,OAAG,aAFoC;AAGvC,OAAG,UAHoC;AAIvC;AACA,IAAA,GAAG,EAAE,eAAA,CAAA,aAAA,CAAc,QAAd,EAAwB,GAAxB;AALkC,GAAf,CAA1B,CA9C+C,CAsD/C;AACA;AACA;AACA;;AACA,QAAM,YAAY,GAAI,MAAc,CAAC,WAAf,CACpB,iBAAiB,CAAC,GAAlB,CAAsB,CAAC,CAAC,QAAD,EAAW,SAAX,CAAD,KAA0B;AAC9C,QAAI,QAAQ,CAAC,KAAT,CAAe,sBAAf,CAAJ,EAA4C;AAC1C,aAAO,CAAC,QAAD,EAAW,kBAAX,CAAP;AACD;;AAED,QAAI,QAAQ,CAAC,KAAT,CAAe,cAAf,CAAJ,EAAoC;AAClC,aAAO,CAAC,QAAD,EAAW,iBAAX,CAAP;AACD;;AAED,WAAO,CAAC,QAAD,EAAW,SAAX,CAAP;AACD,GAVD,CADoB,CAAtB;AAcA,SAAO,6BAAA,CAAA,2BAAA,CAA4B,QAA5B,EAAsC,YAAtC,CAAP;AACD;;AA1ED,OAAA,CAAA,iBAAA,GAAA,iBAAA","sourceRoot":""}
|
@@ -0,0 +1,25 @@
|
|
1
|
+
import * as React from 'react';
|
2
|
+
interface ReactSyntheticEvent extends React.SyntheticEvent<unknown> {
|
3
|
+
_reactName?: string;
|
4
|
+
dispatchConfig?: {
|
5
|
+
registrationName: string;
|
6
|
+
phasedRegistrationNames: {
|
7
|
+
bubbled: string;
|
8
|
+
captured: string;
|
9
|
+
};
|
10
|
+
};
|
11
|
+
}
|
12
|
+
declare type NonUndefined<A> = A extends undefined ? never : A;
|
13
|
+
declare type FunctionKeys<T extends object> = {
|
14
|
+
[K in keyof T]-?: NonUndefined<T[K]> extends Function ? K : never;
|
15
|
+
}[keyof T];
|
16
|
+
export declare type ReactCallbackName = FunctionKeys<React.DOMAttributes<unknown>>;
|
17
|
+
/**
|
18
|
+
* React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
|
19
|
+
*
|
20
|
+
* Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
|
21
|
+
* ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
|
22
|
+
* are handled in bubble phase.
|
23
|
+
*/
|
24
|
+
export declare function getReactCallbackName(event: ReactSyntheticEvent): ReactCallbackName | undefined;
|
25
|
+
export {};
|
@@ -0,0 +1,35 @@
|
|
1
|
+
"use strict";
|
2
|
+
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
4
|
+
value: true
|
5
|
+
});
|
6
|
+
exports.getReactCallbackName = void 0;
|
7
|
+
/**
|
8
|
+
* React.SyntheticEvent contains name of a callback that should be fired, this function returns it.
|
9
|
+
*
|
10
|
+
* Ideally, it should also distinguish regular and "capture" callbacks, but it's possible only with React 17 as
|
11
|
+
* ".eventPhase" there has proper value, see https://github.com/facebook/react/pull/19244. In React 16 all events
|
12
|
+
* are handled in bubble phase.
|
13
|
+
*/
|
14
|
+
|
15
|
+
function getReactCallbackName(event) {
|
16
|
+
if (event._reactName) {
|
17
|
+
return event._reactName;
|
18
|
+
}
|
19
|
+
|
20
|
+
if (event.dispatchConfig) {
|
21
|
+
if (event.dispatchConfig.registrationName) {
|
22
|
+
return event.dispatchConfig.registrationName;
|
23
|
+
}
|
24
|
+
|
25
|
+
return event.dispatchConfig.phasedRegistrationNames.bubbled;
|
26
|
+
}
|
27
|
+
|
28
|
+
if (process.env.NODE_ENV !== 'production') {
|
29
|
+
// eslint-disable-next-line no-console
|
30
|
+
console.error(['Passed React.SyntheticEvent does not contain ".dispatchConfig" or "._reactName".', 'This should not happen, please report it to https://github.com/microsoft/fluentui']);
|
31
|
+
}
|
32
|
+
}
|
33
|
+
|
34
|
+
exports.getReactCallbackName = getReactCallbackName;
|
35
|
+
//# sourceMappingURL=getReactCallbackName.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../../src/utils/getReactCallbackName.ts"],"names":[],"mappings":";;;;;;AAwBA;;;;;;AAMG;;AACH,SAAgB,oBAAhB,CAAqC,KAArC,EAA+D;AAC7D,MAAI,KAAK,CAAC,UAAV,EAAsB;AACpB,WAAO,KAAK,CAAC,UAAb;AACD;;AAED,MAAI,KAAK,CAAC,cAAV,EAA0B;AACxB,QAAI,KAAK,CAAC,cAAN,CAAqB,gBAAzB,EAA2C;AACzC,aAAO,KAAK,CAAC,cAAN,CAAqB,gBAA5B;AACD;;AAED,WAAO,KAAK,CAAC,cAAN,CAAqB,uBAArB,CAA6C,OAApD;AACD;;AAED,MAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;AACzC;AACA,IAAA,OAAO,CAAC,KAAR,CAAc,CACZ,kFADY,EAEZ,mFAFY,CAAd;AAID;AACF;;AApBD,OAAA,CAAA,oBAAA,GAAA,oBAAA","sourceRoot":""}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-utilities",
|
3
|
-
"version": "0.0.0-
|
3
|
+
"version": "0.0.0-nightly0bc161458e20220126.1",
|
4
4
|
"description": "A set of general React-specific utilities.",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -18,7 +18,7 @@
|
|
18
18
|
"code-style": "just-scripts code-style",
|
19
19
|
"just": "just-scripts",
|
20
20
|
"lint": "just-scripts lint",
|
21
|
-
"test": "jest",
|
21
|
+
"test": "jest --passWithNoTests",
|
22
22
|
"docs": "api-extractor run --config=config/api-extractor.local.json --local",
|
23
23
|
"build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../scripts/typescript/normalize-import --output ./dist/packages/react-utilities/src && yarn docs",
|
24
24
|
"start": "yarn storybook",
|
@@ -33,7 +33,7 @@
|
|
33
33
|
"react-test-renderer": "^16.3.0"
|
34
34
|
},
|
35
35
|
"dependencies": {
|
36
|
-
"@fluentui/keyboard-keys": "0.0.0-
|
36
|
+
"@fluentui/keyboard-keys": "0.0.0-nightly0bc161458e20220126.1",
|
37
37
|
"tslib": "^2.1.0"
|
38
38
|
},
|
39
39
|
"peerDependencies": {
|