@fluentui/react-utilities 0.0.0-nightlya0ab3454ed20211208.1 → 0.0.0-nightlya21bfaceec20220202.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 +60 -6
- package/CHANGELOG.md +11 -6
- package/dist/react-utilities.d.ts +91 -50
- package/lib/compose/getSlots.d.ts +7 -8
- package/lib/compose/getSlots.js +2 -2
- package/lib/compose/getSlots.js.map +1 -1
- package/lib/compose/resolveShorthand.d.ts +5 -5
- package/lib/compose/resolveShorthand.js +3 -3
- package/lib/compose/types.d.ts +48 -26
- 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/useOnClickOutside.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/applyTriggerPropsToChildren.d.ts +1 -1
- 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/utils/onlyChild.d.ts +1 -1
- package/lib/utils/properties.js +40 -20
- package/lib/utils/properties.js.map +1 -1
- package/lib-commonjs/compose/getSlots.d.ts +7 -8
- package/lib-commonjs/compose/getSlots.js +2 -2
- package/lib-commonjs/compose/getSlots.js.map +1 -1
- package/lib-commonjs/compose/resolveShorthand.d.ts +5 -5
- package/lib-commonjs/compose/resolveShorthand.js +3 -3
- package/lib-commonjs/compose/types.d.ts +48 -26
- 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/useOnClickOutside.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/applyTriggerPropsToChildren.d.ts +1 -1
- 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/lib-commonjs/utils/onlyChild.d.ts +1 -1
- package/lib-commonjs/utils/properties.js +40 -20
- package/lib-commonjs/utils/properties.js.map +1 -1
- package/package.json +3 -7
package/CHANGELOG.json
CHANGED
@@ -2,17 +2,47 @@
|
|
2
2
|
"name": "@fluentui/react-utilities",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "Wed,
|
6
|
-
"tag": "@fluentui/react-utilities_v0.0.0-
|
7
|
-
"version": "0.0.0-
|
5
|
+
"date": "Wed, 02 Feb 2022 04:13:29 GMT",
|
6
|
+
"tag": "@fluentui/react-utilities_v0.0.0-nightlya21bfaceec20220202.1",
|
7
|
+
"version": "0.0.0-nightlya21bfaceec20220202.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": "e975312642c322c9f393ec8345ead680d9df154a",
|
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
|
+
},
|
40
|
+
{
|
41
|
+
"author": "Humberto.Morimoto@microsoft.com",
|
42
|
+
"package": "@fluentui/react-utilities",
|
43
|
+
"commit": "e0b8e1fa6980077e7b311fd1c72c28d3e4305db0",
|
44
|
+
"comment": "Renaming most *Shorthand* composition types to *SlotProps* so they better reflect what the types do."
|
45
|
+
},
|
16
46
|
{
|
17
47
|
"author": "elcraig@microsoft.com",
|
18
48
|
"package": "@fluentui/react-utilities",
|
@@ -22,16 +52,40 @@
|
|
22
52
|
{
|
23
53
|
"author": "beachball",
|
24
54
|
"package": "@fluentui/react-utilities",
|
25
|
-
"comment": "Bump @fluentui/keyboard-keys to v0.0.0-
|
26
|
-
"commit": "
|
55
|
+
"comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightlya21bfaceec20220202.1",
|
56
|
+
"commit": "e975312642c322c9f393ec8345ead680d9df154a"
|
27
57
|
}
|
28
58
|
],
|
29
59
|
"none": [
|
60
|
+
{
|
61
|
+
"author": "elcraig@microsoft.com",
|
62
|
+
"package": "@fluentui/react-utilities",
|
63
|
+
"commit": "3360b45ec159250b1346c91afad7dce138e6bc20",
|
64
|
+
"comment": "Update API file to version generated by typescript 4.3"
|
65
|
+
},
|
66
|
+
{
|
67
|
+
"author": "olfedias@microsoft.com",
|
68
|
+
"package": "@fluentui/react-utilities",
|
69
|
+
"commit": "c061e98be4b4a718c72a144a1f60bb5515824612",
|
70
|
+
"comment": "remove inline-style-expand-shorthand from tsconfigs"
|
71
|
+
},
|
72
|
+
{
|
73
|
+
"author": "martinhochel@microsoft.com",
|
74
|
+
"package": "@fluentui/react-utilities",
|
75
|
+
"commit": "8dfa712156b70414205b87b5b6d099367b0c297d",
|
76
|
+
"comment": "chore: use storybook runner for all vNext packages"
|
77
|
+
},
|
30
78
|
{
|
31
79
|
"author": "seanmonahan@microsoft.com",
|
32
80
|
"package": "@fluentui/react-utilities",
|
33
81
|
"commit": "6404bef16cebf1f67b9b80a9f6d5f605f9873df1",
|
34
82
|
"comment": "Update getSlots() docs."
|
83
|
+
},
|
84
|
+
{
|
85
|
+
"author": "lingfangao@hotmail.com",
|
86
|
+
"package": "@fluentui/react-utilities",
|
87
|
+
"commit": "a4e048a0e03ddd676670da516e3a6612b26ea500",
|
88
|
+
"comment": "chore: Remove enzyme from react-utilities tests"
|
35
89
|
}
|
36
90
|
]
|
37
91
|
}
|
package/CHANGELOG.md
CHANGED
@@ -1,19 +1,24 @@
|
|
1
1
|
# Change Log - @fluentui/react-utilities
|
2
2
|
|
3
|
-
This log was last generated on Wed,
|
3
|
+
This log was last generated on Wed, 02 Feb 2022 04:13:29 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
-
## [0.0.0-
|
7
|
+
## [0.0.0-nightlya21bfaceec20220202.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v0.0.0-nightlya21bfaceec20220202.1)
|
8
8
|
|
9
|
-
Wed,
|
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, 02 Feb 2022 04:13:29 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-beta.4..@fluentui/react-utilities_v0.0.0-nightlya21bfaceec20220202.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/e975312642c322c9f393ec8345ead680d9df154a) 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)
|
19
|
+
- Renaming most *Shorthand* composition types to *SlotProps* so they better reflect what the types do. ([PR #20891](https://github.com/microsoft/fluentui/pull/20891) by Humberto.Morimoto@microsoft.com)
|
15
20
|
- [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-
|
21
|
+
- Bump @fluentui/keyboard-keys to v0.0.0-nightlya21bfaceec20220202.1 ([commit](https://github.com/microsoft/fluentui/commit/e975312642c322c9f393ec8345ead680d9df154a) by beachball)
|
17
22
|
|
18
23
|
## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v9.0.0-beta.4)
|
19
24
|
|
@@ -11,7 +11,7 @@ export declare const anchorProperties: Record<string, number>;
|
|
11
11
|
/**
|
12
12
|
* Apply the trigger props to the children, either by calling the render function, or cloning with the new props.
|
13
13
|
*/
|
14
|
-
export declare const applyTriggerPropsToChildren: <TTriggerProps>(children: React_2.ReactElement<any, string |
|
14
|
+
export declare const applyTriggerPropsToChildren: <TTriggerProps>(children: React_2.ReactElement<any, string | React_2.JSXElementConstructor<any>> | ((props: TTriggerProps) => React_2.ReactNode) | null | undefined, triggerProps: TTriggerProps) => React_2.ReactNode;
|
15
15
|
|
16
16
|
/**
|
17
17
|
* Helper type for inferring the type of the as prop from a Props type.
|
@@ -71,25 +71,39 @@ export declare const colGroupProperties: Record<string, number>;
|
|
71
71
|
|
72
72
|
export declare const colProperties: Record<string, number>;
|
73
73
|
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
export declare type
|
79
|
-
|
80
|
-
|
81
|
-
};
|
82
|
-
} & Shorthands;
|
74
|
+
/**
|
75
|
+
* Defines the Props type for a component given its slots and the definition of which one is the primary slot,
|
76
|
+
* defaulting to root if one is not provided.
|
77
|
+
*/
|
78
|
+
export declare type ComponentProps<Slots extends SlotPropsRecord, Primary extends keyof Slots = 'root'> = Omit<{
|
79
|
+
[Key in keyof Slots]?: ShorthandProps<NonNullable<Slots[Key]>>;
|
80
|
+
}, Primary & 'root'> & PropsWithoutRef<Slots[Primary]>;
|
83
81
|
|
84
82
|
/**
|
85
|
-
*
|
83
|
+
* Defines the slot props for a slot that supports a Component type.
|
86
84
|
*
|
87
|
-
*
|
88
|
-
*
|
85
|
+
* For intrinsic/native elements like 'div', use {@link IntrinsicSlotProps} instead.
|
86
|
+
*
|
87
|
+
* The generic param is the type of a control, i.e. a React component. For example:
|
88
|
+
*
|
89
|
+
* @example
|
90
|
+
* ```
|
91
|
+
* type Props = {...}
|
92
|
+
* const Button: React.FC<Props> = () => {...}
|
93
|
+
* // $ExpectType ...
|
94
|
+
* type SlotProps = ComponentSlotProps<typeof Button>
|
95
|
+
* ```
|
89
96
|
*/
|
90
|
-
export declare type
|
91
|
-
|
92
|
-
|
97
|
+
export declare type ComponentSlotProps<Component extends React_2.ComponentType> = Component extends React_2.ComponentType<infer Props> ? SlotProps<Props> : never;
|
98
|
+
|
99
|
+
/**
|
100
|
+
* Defines the State object of a component given its slots.
|
101
|
+
*/
|
102
|
+
export declare type ComponentState<Slots extends SlotPropsRecord> = {
|
103
|
+
components: {
|
104
|
+
[Key in keyof Slots]-?: React_2.ComponentType<NonNullable<Slots[Key]> extends SlotProps<infer P> ? P : NonNullable<Slots[Key]>> | (NonNullable<Slots[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
|
105
|
+
};
|
106
|
+
} & Slots;
|
93
107
|
|
94
108
|
/**
|
95
109
|
* Default context value to use in case there is no SSRProvider. This is fine for client-only apps.
|
@@ -185,12 +199,11 @@ export declare const getRTLSafeKey: (key: string, dir: 'ltr' | 'rtl') => string;
|
|
185
199
|
* runtime code filtering props in this function.
|
186
200
|
*
|
187
201
|
* @param state - State including slot definitions
|
188
|
-
* @param slotNames - Name of which props are slots
|
189
202
|
* @returns An object containing the `slots` map and `slotProps` map.
|
190
203
|
*/
|
191
|
-
export declare function getSlots<R extends
|
204
|
+
export declare function getSlots<R extends SlotPropsRecord>(state: ComponentState<R>): {
|
192
205
|
slots: Slots<R>;
|
193
|
-
slotProps:
|
206
|
+
slotProps: ObjectSlotProps<R>;
|
194
207
|
};
|
195
208
|
|
196
209
|
/**
|
@@ -228,23 +241,23 @@ export declare const inputProperties: Record<string, number>;
|
|
228
241
|
|
229
242
|
/**
|
230
243
|
* 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
|
244
|
+
* For slots that support custom components, use {@link ComponentSlotProps} instead.
|
232
245
|
*
|
233
246
|
* The first param is the slot's default type if no `as` prop is specified.
|
234
247
|
* The second param is an optional union of alternative types that can be specified for the `as` prop.
|
235
248
|
*
|
236
249
|
* ```
|
237
|
-
*
|
238
|
-
*
|
239
|
-
*
|
250
|
+
* IntrinsicSlotProps<'div'> // Slot is always div
|
251
|
+
* IntrinsicSlotProps<'button', 'a'> // Defaults to button, but allows as="a" with anchor-specific props
|
252
|
+
* IntrinsicSlotProps<'label', 'span' | 'div'>; // Defaults to label, but allows as="span" or as="div"
|
240
253
|
* ```
|
241
254
|
*/
|
242
|
-
export declare type
|
255
|
+
export declare type IntrinsicSlotProps<DefaultAs extends keyof JSX.IntrinsicElements, AlternateAs extends keyof JSX.IntrinsicElements = never> = IsSingleton<DefaultAs> extends false ? 'Error: first parameter to IntrinsicSlotProps must be a single element type, not a union of types' : ({
|
243
256
|
as?: DefaultAs;
|
244
|
-
} &
|
257
|
+
} & SlotProps<React_2.PropsWithRef<JSX.IntrinsicElements[DefaultAs]>>) | {
|
245
258
|
[As in AlternateAs]: {
|
246
259
|
as: As;
|
247
|
-
} &
|
260
|
+
} & SlotProps<React_2.PropsWithRef<JSX.IntrinsicElements[As]>>;
|
248
261
|
}[AlternateAs];
|
249
262
|
|
250
263
|
/**
|
@@ -278,19 +291,10 @@ export declare const liProperties: Record<string, number>;
|
|
278
291
|
*/
|
279
292
|
export declare const nullRender: () => null;
|
280
293
|
|
281
|
-
|
282
|
-
|
283
|
-
*
|
284
|
-
* For intrinsic elements like 'div', use {@link IntrinsicShorthandProps} instead.
|
285
|
-
*/
|
286
|
-
export declare type ObjectShorthandProps<Props extends {
|
287
|
-
children?: React_2.ReactNode;
|
288
|
-
} = {}> = Props & {
|
289
|
-
children?: Props['children'] | ShorthandRenderFunction<Props>;
|
294
|
+
declare type ObjectSlotProps<S extends SlotPropsRecord> = {
|
295
|
+
[K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? UnionToIntersection<JSX.IntrinsicElements[As]> : NonNullable<S[K]> extends SlotProps<infer P> ? P : never;
|
290
296
|
};
|
291
297
|
|
292
|
-
export declare type ObjectShorthandPropsRecord = Record<string, DefaultObjectShorthandProps | undefined>;
|
293
|
-
|
294
298
|
/**
|
295
299
|
* This is part of a hack to infer the element type from a native element *props* type.
|
296
300
|
* The only place the original element is found in a native props type (at least that's workable
|
@@ -330,13 +334,13 @@ export declare function omit<TObj extends Record<string, any>, Exclusions extend
|
|
330
334
|
/**
|
331
335
|
* Similar to React.Children.only, but drills into fragments rather than treating them as a single child
|
332
336
|
*/
|
333
|
-
export declare const onlyChild: <P>(child:
|
337
|
+
export declare const onlyChild: <P>(child: boolean | React_2.ReactText | React_2.ReactFragment | React_2.ReactPortal | React_2.ReactElement<P, string | React_2.JSXElementConstructor<any>> | null | undefined) => React_2.ReactElement<P, string | React_2.JSXElementConstructor<any>>;
|
334
338
|
|
335
339
|
export declare const optionProperties: Record<string, number>;
|
336
340
|
|
337
341
|
/**
|
338
342
|
* Removes the 'ref' prop from the given Props type, leaving unions intact (such as the discriminated union created by
|
339
|
-
*
|
343
|
+
* IntrinsicSlotProps). This allows IntrinsicSlotProps to be used with React.forwardRef.
|
340
344
|
*
|
341
345
|
* The conditional "extends unknown" (always true) exploits a quirk in the way TypeScript handles conditional
|
342
346
|
* types, to prevent unions from being expanded.
|
@@ -357,12 +361,12 @@ export declare type RefObjectFunction<T> = React_2.RefObject<T> & ((value: T) =>
|
|
357
361
|
export declare function resetIdsForTests(): void;
|
358
362
|
|
359
363
|
/**
|
360
|
-
* Resolves
|
364
|
+
* Resolves shorthands into slot props, to ensure normalization of the signature
|
361
365
|
* being passed down to getSlots method
|
362
|
-
* @param value - the base
|
363
|
-
* @param options - options to resolve
|
366
|
+
* @param value - the base shorthand props
|
367
|
+
* @param options - options to resolve shorthand props
|
364
368
|
*/
|
365
|
-
export declare function resolveShorthand<Props extends
|
369
|
+
export declare function resolveShorthand<Props extends UnknownSlotProps, Required extends boolean = false>(value: ShorthandProps<Props>, options?: ResolveShorthandOptions<Props, Required>): Required extends false ? Props | undefined : Props;
|
366
370
|
|
367
371
|
export declare type ResolveShorthandOptions<Props extends Record<string, any>, Required extends boolean = false> = {
|
368
372
|
required?: Required;
|
@@ -376,9 +380,7 @@ export declare type ResolveShorthandOptions<Props extends Record<string, any>, R
|
|
376
380
|
*/
|
377
381
|
export declare const selectProperties: Record<string, number>;
|
378
382
|
|
379
|
-
export declare type ShorthandProps<Props extends
|
380
|
-
|
381
|
-
export declare type ShorthandRenderFunction<Props> = (Component: React_2.ElementType<Props>, props: Omit<Props, 'children' | 'as'>) => React_2.ReactNode;
|
383
|
+
export declare type ShorthandProps<Props extends UnknownSlotProps> = React_2.ReactChild | React_2.ReactNodeArray | React_2.ReactPortal | number | null | undefined | Props;
|
382
384
|
|
383
385
|
/**
|
384
386
|
* Checks if the keyboard event should preventDefault() for Enter and Spacebar keys
|
@@ -387,12 +389,22 @@ export declare type ShorthandRenderFunction<Props> = (Component: React_2.Element
|
|
387
389
|
*/
|
388
390
|
export declare function shouldPreventDefaultOnKeyDown(e: KeyboardEvent | React_2.KeyboardEvent): boolean;
|
389
391
|
|
390
|
-
|
391
|
-
|
392
|
+
/**
|
393
|
+
* Takes the props we want to support for a slot and adds the ability for `children` to be a render function that takes
|
394
|
+
* those props.
|
395
|
+
*/
|
396
|
+
export declare type SlotProps<Props extends {
|
397
|
+
children?: React_2.ReactNode;
|
398
|
+
} = {}> = Props & {
|
399
|
+
children?: Props['children'] | SlotRenderFunction<Props>;
|
392
400
|
};
|
393
401
|
|
394
|
-
export declare type
|
395
|
-
|
402
|
+
export declare type SlotPropsRecord = Record<string, UnknownSlotProps | undefined>;
|
403
|
+
|
404
|
+
export declare type SlotRenderFunction<Props> = (Component: React_2.ElementType<Props>, props: Omit<Props, 'children' | 'as'>) => React_2.ReactNode;
|
405
|
+
|
406
|
+
export declare type Slots<S extends SlotPropsRecord> = {
|
407
|
+
[K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? As : S[K] extends SlotProps<infer P> ? React_2.ElementType<NonNullable<P>> : React_2.ElementType<NonNullable<S[K]>>;
|
396
408
|
};
|
397
409
|
|
398
410
|
export declare const SSRContext: React_2.Context<SSRContextValue>;
|
@@ -455,6 +467,16 @@ export declare const trProperties: Record<string, number>;
|
|
455
467
|
*/
|
456
468
|
export declare type UnionToIntersection<U> = (U extends unknown ? (x: U) => U : never) extends (x: infer I) => U ? I : never;
|
457
469
|
|
470
|
+
/**
|
471
|
+
* Matches any slot props type.
|
472
|
+
*
|
473
|
+
* This should ONLY be used in type templates as in `extends DefaultObjectSlotProps`;
|
474
|
+
* it shouldn't be used as the type of a slot.
|
475
|
+
*/
|
476
|
+
export declare type UnknownSlotProps = SlotProps<Pick<React_2.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {
|
477
|
+
as?: keyof JSX.IntrinsicElements;
|
478
|
+
}>;
|
479
|
+
|
458
480
|
/**
|
459
481
|
* Hook to store a value and generate callbacks for setting the value to true or false.
|
460
482
|
* The identity of the callbacks will always stay the same.
|
@@ -643,6 +665,25 @@ export declare function useSSRContext(): SSRContextValue;
|
|
643
665
|
*/
|
644
666
|
export declare function useTimeout(): readonly [(fn: () => void, delay: number) => void, () => void];
|
645
667
|
|
668
|
+
/**
|
669
|
+
* A hook that handles "trigger" pattern.
|
670
|
+
*
|
671
|
+
* Clones a passed element or calls render props. Merges props including refs and callbacks, callbacks are kept stable
|
672
|
+
* by reference.
|
673
|
+
*/
|
674
|
+
export declare function useTriggerElement<TriggerProps extends React_2.HTMLProps<unknown>>(options: UseTriggerElementOptions<TriggerProps>): React_2.ReactNode;
|
675
|
+
|
676
|
+
export declare type UseTriggerElementOptions<TriggerProps> = {
|
677
|
+
/** An actual trigger element or render props function. */
|
678
|
+
children: React_2.ReactElement | ((props: TriggerProps) => React_2.ReactNode) | null | undefined;
|
679
|
+
/** A ref to trigger element. */
|
680
|
+
ref: React_2.Ref<unknown> | undefined;
|
681
|
+
/** Props that are passed to a parent component and should be forwarded down. */
|
682
|
+
outerProps: React_2.HTMLProps<unknown>;
|
683
|
+
/** Custom props including callbacks. */
|
684
|
+
overrideProps: TriggerProps;
|
685
|
+
};
|
686
|
+
|
646
687
|
/**
|
647
688
|
* Hook which synchronously executes a callback when the component is about to unmount.
|
648
689
|
*
|
@@ -1,10 +1,10 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import { AsIntrinsicElement, ComponentState,
|
3
|
-
export declare type Slots<S extends
|
4
|
-
[K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? As : S[K] extends
|
2
|
+
import type { AsIntrinsicElement, ComponentState, SlotProps, SlotPropsRecord, UnionToIntersection } from './types';
|
3
|
+
export declare type Slots<S extends SlotPropsRecord> = {
|
4
|
+
[K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? As : S[K] extends SlotProps<infer P> ? React.ElementType<NonNullable<P>> : React.ElementType<NonNullable<S[K]>>;
|
5
5
|
};
|
6
|
-
declare type
|
7
|
-
[K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? UnionToIntersection<JSX.IntrinsicElements[As]> : NonNullable<S[K]> extends
|
6
|
+
declare type ObjectSlotProps<S extends SlotPropsRecord> = {
|
7
|
+
[K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? UnionToIntersection<JSX.IntrinsicElements[As]> : NonNullable<S[K]> extends SlotProps<infer P> ? P : never;
|
8
8
|
};
|
9
9
|
/**
|
10
10
|
* Given the state and an array of slot names, will break out `slots` and `slotProps`
|
@@ -21,11 +21,10 @@ 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
|
26
|
+
export declare function getSlots<R extends SlotPropsRecord>(state: ComponentState<R>): {
|
28
27
|
slots: Slots<R>;
|
29
|
-
slotProps:
|
28
|
+
slotProps: ObjectSlotProps<R>;
|
30
29
|
};
|
31
30
|
export {};
|
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":""}
|
@@ -1,12 +1,12 @@
|
|
1
|
-
import type {
|
1
|
+
import type { UnknownSlotProps, ShorthandProps } from './types';
|
2
2
|
export declare type ResolveShorthandOptions<Props extends Record<string, any>, Required extends boolean = false> = {
|
3
3
|
required?: Required;
|
4
4
|
defaultProps?: Props;
|
5
5
|
};
|
6
6
|
/**
|
7
|
-
* Resolves
|
7
|
+
* Resolves shorthands into slot props, to ensure normalization of the signature
|
8
8
|
* being passed down to getSlots method
|
9
|
-
* @param value - the base
|
10
|
-
* @param options - options to resolve
|
9
|
+
* @param value - the base shorthand props
|
10
|
+
* @param options - options to resolve shorthand props
|
11
11
|
*/
|
12
|
-
export declare function resolveShorthand<Props extends
|
12
|
+
export declare function resolveShorthand<Props extends UnknownSlotProps, Required extends boolean = false>(value: ShorthandProps<Props>, options?: ResolveShorthandOptions<Props, Required>): Required extends false ? Props | undefined : Props;
|
@@ -1,9 +1,9 @@
|
|
1
1
|
import { isValidElement } from 'react';
|
2
2
|
/**
|
3
|
-
* Resolves
|
3
|
+
* Resolves shorthands into slot props, to ensure normalization of the signature
|
4
4
|
* being passed down to getSlots method
|
5
|
-
* @param value - the base
|
6
|
-
* @param options - options to resolve
|
5
|
+
* @param value - the base shorthand props
|
6
|
+
* @param options - options to resolve shorthand props
|
7
7
|
*/
|
8
8
|
|
9
9
|
export function resolveShorthand(value, options) {
|
package/lib/compose/types.d.ts
CHANGED
@@ -1,45 +1,60 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
export declare type
|
3
|
-
export declare type
|
4
|
-
export declare type ShorthandProps<Props extends
|
2
|
+
export declare type SlotRenderFunction<Props> = (Component: React.ElementType<Props>, props: Omit<Props, 'children' | 'as'>) => React.ReactNode;
|
3
|
+
export declare type SlotPropsRecord = Record<string, UnknownSlotProps | undefined>;
|
4
|
+
export declare type ShorthandProps<Props extends UnknownSlotProps> = React.ReactChild | React.ReactNodeArray | React.ReactPortal | number | null | undefined | Props;
|
5
5
|
/**
|
6
|
-
* Matches any
|
6
|
+
* Matches any slot props type.
|
7
7
|
*
|
8
|
-
* This should ONLY be used in type templates as in `extends
|
8
|
+
* This should ONLY be used in type templates as in `extends DefaultObjectSlotProps`;
|
9
9
|
* it shouldn't be used as the type of a slot.
|
10
10
|
*/
|
11
|
-
export declare type
|
11
|
+
export declare type UnknownSlotProps = SlotProps<Pick<React.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {
|
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
|
-
export declare type
|
18
|
+
export declare type SlotProps<Props extends {
|
20
19
|
children?: React.ReactNode;
|
21
20
|
} = {}> = Props & {
|
22
|
-
children?: Props['children'] |
|
21
|
+
children?: Props['children'] | SlotRenderFunction<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 IntrinsicSlotProps} 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> ? SlotProps<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.
|
30
45
|
*
|
31
46
|
* ```
|
32
|
-
*
|
33
|
-
*
|
34
|
-
*
|
47
|
+
* IntrinsicSlotProps<'div'> // Slot is always div
|
48
|
+
* IntrinsicSlotProps<'button', 'a'> // Defaults to button, but allows as="a" with anchor-specific props
|
49
|
+
* IntrinsicSlotProps<'label', 'span' | 'div'>; // Defaults to label, but allows as="span" or as="div"
|
35
50
|
* ```
|
36
51
|
*/
|
37
|
-
export declare type
|
52
|
+
export declare type IntrinsicSlotProps<DefaultAs extends keyof JSX.IntrinsicElements, AlternateAs extends keyof JSX.IntrinsicElements = never> = IsSingleton<DefaultAs> extends false ? 'Error: first parameter to IntrinsicSlotProps must be a single element type, not a union of types' : ({
|
38
53
|
as?: DefaultAs;
|
39
|
-
} &
|
54
|
+
} & SlotProps<React.PropsWithRef<JSX.IntrinsicElements[DefaultAs]>>) | {
|
40
55
|
[As in AlternateAs]: {
|
41
56
|
as: As;
|
42
|
-
} &
|
57
|
+
} & SlotProps<React.PropsWithRef<JSX.IntrinsicElements[As]>>;
|
43
58
|
}[AlternateAs];
|
44
59
|
/**
|
45
60
|
* Evaluates to true if the given type contains exactly one string, or false if it is a union of strings.
|
@@ -69,20 +84,27 @@ export declare type AsIntrinsicElement<As extends keyof JSX.IntrinsicElements> =
|
|
69
84
|
export declare type UnionToIntersection<U> = (U extends unknown ? (x: U) => U : never) extends (x: infer I) => U ? I : never;
|
70
85
|
/**
|
71
86
|
* Removes the 'ref' prop from the given Props type, leaving unions intact (such as the discriminated union created by
|
72
|
-
*
|
87
|
+
* IntrinsicSlotProps). This allows IntrinsicSlotProps to be used with React.forwardRef.
|
73
88
|
*
|
74
89
|
* The conditional "extends unknown" (always true) exploits a quirk in the way TypeScript handles conditional
|
75
90
|
* types, to prevent unions from being expanded.
|
76
91
|
*/
|
77
92
|
export declare type PropsWithoutRef<P> = 'ref' extends keyof P ? (P extends unknown ? Omit<P, 'ref'> : P) : P;
|
78
|
-
|
79
|
-
|
80
|
-
|
81
|
-
|
82
|
-
|
83
|
-
|
93
|
+
/**
|
94
|
+
* Defines the Props type for a component given its slots and the definition of which one is the primary slot,
|
95
|
+
* defaulting to root if one is not provided.
|
96
|
+
*/
|
97
|
+
export declare type ComponentProps<Slots extends SlotPropsRecord, Primary extends keyof Slots = 'root'> = Omit<{
|
98
|
+
[Key in keyof Slots]?: ShorthandProps<NonNullable<Slots[Key]>>;
|
99
|
+
}, Primary & 'root'> & PropsWithoutRef<Slots[Primary]>;
|
100
|
+
/**
|
101
|
+
* Defines the State object of a component given its slots.
|
102
|
+
*/
|
103
|
+
export declare type ComponentState<Slots extends SlotPropsRecord> = {
|
104
|
+
components: {
|
105
|
+
[Key in keyof Slots]-?: React.ComponentType<NonNullable<Slots[Key]> extends SlotProps<infer P> ? P : NonNullable<Slots[Key]>> | (NonNullable<Slots[Key]> extends AsIntrinsicElement<infer As> ? As : keyof JSX.IntrinsicElements);
|
84
106
|
};
|
85
|
-
} &
|
107
|
+
} & Slots;
|
86
108
|
/**
|
87
109
|
* This is part of a hack to infer the element type from a native element *props* type.
|
88
110
|
* The only place the original element is found in a native props type (at least that's workable
|
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":"WAyKA;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"}
|