@fluentui/react-utilities 0.0.0-nightly8faa94d11420211118.1 → 0.0.0-nightly946f57cad420220203.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.
Files changed (90) hide show
  1. package/CHANGELOG.json +103 -6
  2. package/CHANGELOG.md +22 -6
  3. package/dist/react-utilities.d.ts +178 -85
  4. package/lib/compose/getSlots.d.ts +11 -10
  5. package/lib/compose/getSlots.js +6 -4
  6. package/lib/compose/getSlots.js.map +1 -1
  7. package/lib/compose/resolveShorthand.d.ts +5 -5
  8. package/lib/compose/resolveShorthand.js +3 -3
  9. package/lib/compose/types.d.ts +48 -27
  10. package/lib/compose/types.js.map +1 -1
  11. package/lib/hooks/index.d.ts +1 -1
  12. package/lib/hooks/index.js +1 -1
  13. package/lib/hooks/index.js.map +1 -1
  14. package/lib/hooks/useControllableState.d.ts +16 -6
  15. package/lib/hooks/useControllableState.js +13 -8
  16. package/lib/hooks/useControllableState.js.map +1 -1
  17. package/lib/hooks/useMergedEventCallbacks.d.ts +18 -0
  18. package/lib/hooks/useMergedEventCallbacks.js +26 -0
  19. package/lib/hooks/useMergedEventCallbacks.js.map +1 -0
  20. package/lib/hooks/useOnClickOutside.js.map +1 -1
  21. package/lib/utils/applyTriggerPropsToChildren.d.ts +1 -1
  22. package/lib/utils/applyTriggerPropsToChildren.js +19 -2
  23. package/lib/utils/applyTriggerPropsToChildren.js.map +1 -1
  24. package/lib/utils/getNativeElementProps.d.ts +22 -0
  25. package/lib/utils/getNativeElementProps.js +22 -0
  26. package/lib/utils/getNativeElementProps.js.map +1 -1
  27. package/lib/utils/getReactCallbackName.d.ts +25 -0
  28. package/lib/utils/getReactCallbackName.js +26 -0
  29. package/lib/utils/getReactCallbackName.js.map +1 -0
  30. package/lib/utils/getTriggerChild.d.ts +22 -0
  31. package/lib/utils/getTriggerChild.js +26 -0
  32. package/lib/utils/getTriggerChild.js.map +1 -0
  33. package/lib/utils/index.d.ts +2 -1
  34. package/lib/utils/index.js +2 -1
  35. package/lib/utils/index.js.map +1 -1
  36. package/lib/utils/isFluentTrigger.d.ts +22 -0
  37. package/lib/utils/isFluentTrigger.js +8 -0
  38. package/lib/utils/isFluentTrigger.js.map +1 -0
  39. package/lib/utils/properties.js +40 -20
  40. package/lib/utils/properties.js.map +1 -1
  41. package/lib-commonjs/compose/getSlots.d.ts +11 -10
  42. package/lib-commonjs/compose/getSlots.js +6 -4
  43. package/lib-commonjs/compose/getSlots.js.map +1 -1
  44. package/lib-commonjs/compose/resolveShorthand.d.ts +5 -5
  45. package/lib-commonjs/compose/resolveShorthand.js +3 -3
  46. package/lib-commonjs/compose/types.d.ts +48 -27
  47. package/lib-commonjs/compose/types.js.map +1 -1
  48. package/lib-commonjs/hooks/index.d.ts +1 -1
  49. package/lib-commonjs/hooks/index.js +2 -2
  50. package/lib-commonjs/hooks/index.js.map +1 -1
  51. package/lib-commonjs/hooks/useControllableState.d.ts +16 -6
  52. package/lib-commonjs/hooks/useControllableState.js +13 -8
  53. package/lib-commonjs/hooks/useControllableState.js.map +1 -1
  54. package/lib-commonjs/hooks/useMergedEventCallbacks.d.ts +18 -0
  55. package/lib-commonjs/hooks/useMergedEventCallbacks.js +36 -0
  56. package/lib-commonjs/hooks/useMergedEventCallbacks.js.map +1 -0
  57. package/lib-commonjs/hooks/useOnClickOutside.js.map +1 -1
  58. package/lib-commonjs/utils/applyTriggerPropsToChildren.d.ts +1 -1
  59. package/lib-commonjs/utils/applyTriggerPropsToChildren.js +19 -2
  60. package/lib-commonjs/utils/applyTriggerPropsToChildren.js.map +1 -1
  61. package/lib-commonjs/utils/getNativeElementProps.d.ts +22 -0
  62. package/lib-commonjs/utils/getNativeElementProps.js +25 -1
  63. package/lib-commonjs/utils/getNativeElementProps.js.map +1 -1
  64. package/lib-commonjs/utils/getReactCallbackName.d.ts +25 -0
  65. package/lib-commonjs/utils/getReactCallbackName.js +35 -0
  66. package/lib-commonjs/utils/getReactCallbackName.js.map +1 -0
  67. package/lib-commonjs/utils/getTriggerChild.d.ts +22 -0
  68. package/lib-commonjs/utils/getTriggerChild.js +37 -0
  69. package/lib-commonjs/utils/getTriggerChild.js.map +1 -0
  70. package/lib-commonjs/utils/index.d.ts +2 -1
  71. package/lib-commonjs/utils/index.js +4 -2
  72. package/lib-commonjs/utils/index.js.map +1 -1
  73. package/lib-commonjs/utils/isFluentTrigger.d.ts +22 -0
  74. package/lib-commonjs/utils/isFluentTrigger.js +17 -0
  75. package/lib-commonjs/utils/isFluentTrigger.js.map +1 -0
  76. package/lib-commonjs/utils/properties.js +40 -20
  77. package/lib-commonjs/utils/properties.js.map +1 -1
  78. package/package.json +6 -10
  79. package/lib/hooks/useControllableValue.d.ts +0 -20
  80. package/lib/hooks/useControllableValue.js +0 -57
  81. package/lib/hooks/useControllableValue.js.map +0 -1
  82. package/lib/utils/onlyChild.d.ts +0 -5
  83. package/lib/utils/onlyChild.js +0 -13
  84. package/lib/utils/onlyChild.js.map +0 -1
  85. package/lib-commonjs/hooks/useControllableValue.d.ts +0 -20
  86. package/lib-commonjs/hooks/useControllableValue.js +0 -68
  87. package/lib-commonjs/hooks/useControllableValue.js.map +0 -1
  88. package/lib-commonjs/utils/onlyChild.d.ts +0 -5
  89. package/lib-commonjs/utils/onlyChild.js +0 -23
  90. package/lib-commonjs/utils/onlyChild.js.map +0 -1
package/CHANGELOG.json CHANGED
@@ -2,22 +2,119 @@
2
2
  "name": "@fluentui/react-utilities",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 18 Nov 2021 04:18:44 GMT",
6
- "tag": "@fluentui/react-utilities_v0.0.0-nightly8faa94d11420211118.1",
7
- "version": "0.0.0-nightly8faa94d11420211118.1",
5
+ "date": "Thu, 03 Feb 2022 04:16:57 GMT",
6
+ "tag": "@fluentui/react-utilities_v0.0.0-nightly946f57cad420220203.1",
7
+ "version": "0.0.0-nightly946f57cad420220203.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
11
11
  "author": "email not defined",
12
12
  "package": "@fluentui/react-utilities",
13
- "commit": "a449bd93de8007bbeb4346e285638fdfd0f25f4d",
13
+ "commit": "1d230926e10b3b722bd932be1ec39faaf340671c",
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
+ },
46
+ {
47
+ "author": "behowell@microsoft.com",
48
+ "package": "@fluentui/react-utilities",
49
+ "commit": "f30e7585a8d2abd9db06c4076f39a779008b0eca",
50
+ "comment": "Update trigger utilities to handle nested triggers"
51
+ },
52
+ {
53
+ "author": "elcraig@microsoft.com",
54
+ "package": "@fluentui/react-utilities",
55
+ "commit": "39ce3cbcf15ce2619649e1eddccf932736ceac07",
56
+ "comment": "[breaking] Remove useControllableValue hook (use useControllableState instead)"
57
+ },
16
58
  {
17
59
  "author": "beachball",
18
60
  "package": "@fluentui/react-utilities",
19
- "comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightly8faa94d11420211118.1",
20
- "commit": "a449bd93de8007bbeb4346e285638fdfd0f25f4d"
61
+ "comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightly946f57cad420220203.1",
62
+ "commit": "1d230926e10b3b722bd932be1ec39faaf340671c"
63
+ }
64
+ ],
65
+ "none": [
66
+ {
67
+ "author": "elcraig@microsoft.com",
68
+ "package": "@fluentui/react-utilities",
69
+ "commit": "3360b45ec159250b1346c91afad7dce138e6bc20",
70
+ "comment": "Update API file to version generated by typescript 4.3"
71
+ },
72
+ {
73
+ "author": "olfedias@microsoft.com",
74
+ "package": "@fluentui/react-utilities",
75
+ "commit": "c061e98be4b4a718c72a144a1f60bb5515824612",
76
+ "comment": "remove inline-style-expand-shorthand from tsconfigs"
77
+ },
78
+ {
79
+ "author": "martinhochel@microsoft.com",
80
+ "package": "@fluentui/react-utilities",
81
+ "commit": "8dfa712156b70414205b87b5b6d099367b0c297d",
82
+ "comment": "chore: use storybook runner for all vNext packages"
83
+ },
84
+ {
85
+ "author": "seanmonahan@microsoft.com",
86
+ "package": "@fluentui/react-utilities",
87
+ "commit": "6404bef16cebf1f67b9b80a9f6d5f605f9873df1",
88
+ "comment": "Update getSlots() docs."
89
+ },
90
+ {
91
+ "author": "lingfangao@hotmail.com",
92
+ "package": "@fluentui/react-utilities",
93
+ "commit": "a4e048a0e03ddd676670da516e3a6612b26ea500",
94
+ "comment": "chore: Remove enzyme from react-utilities tests"
95
+ }
96
+ ]
97
+ }
98
+ },
99
+ {
100
+ "date": "Thu, 25 Nov 2021 08:34:09 GMT",
101
+ "tag": "@fluentui/react-utilities_v9.0.0-beta.4",
102
+ "version": "9.0.0-beta.4",
103
+ "comments": {
104
+ "none": [
105
+ {
106
+ "author": "lingfangao@hotmail.com",
107
+ "package": "@fluentui/react-utilities",
108
+ "commit": "718e63006d8d07d24efab9c32942041963d78dc7",
109
+ "comment": "Migrate package to use solution style ts-configs"
110
+ }
111
+ ],
112
+ "prerelease": [
113
+ {
114
+ "author": "behowell@microsoft.com",
115
+ "package": "@fluentui/react-utilities",
116
+ "commit": "99adff5a9aab9086e8bc4737040654ab23f0febe",
117
+ "comment": "Update utility types to support specifying a primary slot other than root"
21
118
  }
22
119
  ]
23
120
  }
package/CHANGELOG.md CHANGED
@@ -1,18 +1,34 @@
1
1
  # Change Log - @fluentui/react-utilities
2
2
 
3
- This log was last generated on Thu, 18 Nov 2021 04:18:44 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 03 Feb 2022 04:16:57 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly8faa94d11420211118.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v0.0.0-nightly8faa94d11420211118.1)
7
+ ## [0.0.0-nightly946f57cad420220203.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v0.0.0-nightly946f57cad420220203.1)
8
8
 
9
- Thu, 18 Nov 2021 04:18:44 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-beta.3..@fluentui/react-utilities_v0.0.0-nightly8faa94d11420211118.1)
9
+ Thu, 03 Feb 2022 04:16:57 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-beta.4..@fluentui/react-utilities_v0.0.0-nightly946f57cad420220203.1)
11
11
 
12
12
  ### Changes
13
13
 
14
- - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/a449bd93de8007bbeb4346e285638fdfd0f25f4d) by email not defined)
15
- - Bump @fluentui/keyboard-keys to v0.0.0-nightly8faa94d11420211118.1 ([commit](https://github.com/microsoft/fluentui/commit/a449bd93de8007bbeb4346e285638fdfd0f25f4d) by beachball)
14
+ - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/1d230926e10b3b722bd932be1ec39faaf340671c) 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)
20
+ - Update trigger utilities to handle nested triggers ([PR #21495](https://github.com/microsoft/fluentui/pull/21495) by behowell@microsoft.com)
21
+ - [breaking] Remove useControllableValue hook (use useControllableState instead) ([PR #20865](https://github.com/microsoft/fluentui/pull/20865) by elcraig@microsoft.com)
22
+ - Bump @fluentui/keyboard-keys to v0.0.0-nightly946f57cad420220203.1 ([commit](https://github.com/microsoft/fluentui/commit/1d230926e10b3b722bd932be1ec39faaf340671c) by beachball)
23
+
24
+ ## [9.0.0-beta.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v9.0.0-beta.4)
25
+
26
+ Thu, 25 Nov 2021 08:34:09 GMT
27
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-utilities_v9.0.0-beta.3..@fluentui/react-utilities_v9.0.0-beta.4)
28
+
29
+ ### Changes
30
+
31
+ - Update utility types to support specifying a primary slot other than root ([PR #20617](https://github.com/microsoft/fluentui/pull/20617) by behowell@microsoft.com)
16
32
 
17
33
  ## [9.0.0-beta.3](https://github.com/microsoft/fluentui/tree/@fluentui/react-utilities_v9.0.0-beta.3)
18
34
 
@@ -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 | ((props: any) => React_2.ReactElement<any, string | any | (new (props: any) => React_2.Component<any, any, any>)> | null) | (new (props: any) => React_2.Component<any, any, any>)> | ((props: TTriggerProps) => React_2.ReactNode) | null | undefined, triggerProps: TTriggerProps) => React_2.ReactNode;
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.
@@ -58,8 +58,6 @@ export declare const buttonProperties: Record<string, number>;
58
58
  */
59
59
  export declare function canUseDOM(): boolean;
60
60
 
61
- export declare type ChangeCallback<TElement extends HTMLElement, TValue, TEvent extends React_2.SyntheticEvent<TElement> | undefined> = (ev: TEvent, newValue: TValue | undefined) => void;
62
-
63
61
  /**
64
62
  * Clamps `value` to a number between the min and max.
65
63
  *
@@ -73,26 +71,39 @@ export declare const colGroupProperties: Record<string, number>;
73
71
 
74
72
  export declare const colProperties: Record<string, number>;
75
73
 
76
- export declare type ComponentProps<Shorthands extends ObjectShorthandPropsRecord, Primary extends keyof Shorthands = 'root'> = Omit<{
77
- [Key in keyof Shorthands]?: ShorthandProps<NonNullable<Shorthands[Key]>>;
78
- }, Primary> & PropsWithoutRef<Shorthands[Primary]>;
79
-
80
- export declare type ComponentState<Shorthands extends ObjectShorthandPropsRecord> = {
81
- components?: {
82
- [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);
83
- };
84
- } & 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]>;
85
81
 
86
82
  /**
87
- * Matches any shorthand props type.
83
+ * Defines the slot props for a slot that supports a Component type.
88
84
  *
89
- * This should ONLY be used in type templates as in `extends DefaultObjectShorthandProps`;
90
- * it shouldn't be used as the type of a slot.
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
+ * ```
91
96
  */
92
- export declare type DefaultObjectShorthandProps = ObjectShorthandProps<{
93
- children?: React_2.ReactNode;
94
- as?: keyof JSX.IntrinsicElements;
95
- }>;
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;
96
107
 
97
108
  /**
98
109
  * Default context value to use in case there is no SSRProvider. This is fine for client-only apps.
@@ -101,11 +112,6 @@ export declare type DefaultObjectShorthandProps = ObjectShorthandProps<{
101
112
  */
102
113
  export declare const defaultSSRContextValue: SSRContextValue;
103
114
 
104
- /**
105
- * Default value can be a value or an initializer
106
- */
107
- declare type DefaultValue<TValue> = TValue | (() => TValue);
108
-
109
115
  /**
110
116
  * An array of DIV tag properties and events.
111
117
  *
@@ -113,6 +119,23 @@ declare type DefaultValue<TValue> = TValue | (() => TValue);
113
119
  */
114
120
  export declare const divProperties: Record<string, number>;
115
121
 
122
+ /**
123
+ * Allows a component to be tagged as a FluentUI trigger component.
124
+ *
125
+ * Triggers are special-case components: they attach event listeners and other props on their child,
126
+ * and use them to trigger another component to show. Examples include `MenuTrigger` and `Tooltip`.
127
+ *
128
+ * A component can be tagged as a trigger as follows:
129
+ * ```ts
130
+ * const MyComponent: React.FC<MyComponentProps> & FluentTriggerComponent = ...;
131
+ *
132
+ * MyComponent.isFluentTriggerComponent = true; // MUST also set this to true
133
+ * ```
134
+ */
135
+ export declare type FluentTriggerComponent = {
136
+ isFluentTriggerComponent?: boolean;
137
+ };
138
+
116
139
  /**
117
140
  * An array of FORM tag properties and events.
118
141
  *
@@ -150,6 +173,29 @@ export declare function getNativeElementProps<TAttributes extends React_2.HTMLAt
150
173
  */
151
174
  export declare function getNativeProps<T extends Record<string, any>>(props: Record<string, any>, allowedPropNames: string[] | Record<string, number>, excludedPropNames?: string[]): T;
152
175
 
176
+ /**
177
+ * Splits the native props into ones that go to the `root` slot, and ones that go to the primary slot.
178
+ *
179
+ * This function is only for use with components that have a primary slot other than `root`.
180
+ * Most components should use {@link getNativeElementProps} for their root slot if it is the primary slot.
181
+ *
182
+ * @returns An object containing the native props for the `root` and primary slots.
183
+ */
184
+ export declare const getPartitionedNativeProps: ({ primarySlotTagName, props, excludedPropNames, }: {
185
+ /** The primary slot's element type (e.g. 'div') */
186
+ primarySlotTagName: keyof JSX.IntrinsicElements;
187
+ /** The component's props object */
188
+ props: Pick<React_2.HTMLAttributes<HTMLElement>, 'style' | 'className'>;
189
+ /** List of native props to exclude from the returned value */
190
+ excludedPropNames?: string[] | undefined;
191
+ }) => {
192
+ root: {
193
+ style: React_2.CSSProperties | undefined;
194
+ className: string | undefined;
195
+ };
196
+ primary: React_2.HTMLAttributes<any>;
197
+ };
198
+
153
199
  /**
154
200
  * Finds and swaps a provided key for it's right to left format.
155
201
  */
@@ -164,16 +210,39 @@ export declare const getRTLSafeKey: (key: string, dir: 'ltr' | 'rtl') => string;
164
210
  * Slots will render as null if they are rendered as primitives with undefined children.
165
211
  *
166
212
  * The slotProps will always omit the `as` prop within them, and for slots that are string
167
- * primitives, the props will be filtered according the the slot type. For example, if the
168
- * slot is rendered `as: 'a'`, the props will be filtered for acceptable anchor props.
213
+ * primitives, the props will be filtered according to the slot type by the type system.
214
+ * For example, if the slot is rendered `as: 'a'`, the props will be filtered for acceptable
215
+ * anchor props. Note that this is only enforced at build time by Typescript -- there is no
216
+ * runtime code filtering props in this function.
169
217
  *
170
218
  * @param state - State including slot definitions
171
- * @param slotNames - Name of which props are slots
172
219
  * @returns An object containing the `slots` map and `slotProps` map.
173
220
  */
174
- export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>, slotNames?: (keyof R)[]): {
221
+ export declare function getSlots<R extends SlotPropsRecord>(state: ComponentState<R>): {
175
222
  slots: Slots<R>;
176
- slotProps: SlotProps<R>;
223
+ slotProps: ObjectSlotProps<R>;
224
+ };
225
+
226
+ /**
227
+ * Gets the trigger element of a FluentTriggerComponent (such as Tooltip or MenuTrigger).
228
+ *
229
+ * In the case where the immediate child is itself a FluentTriggerComponent and/or React Fragment,
230
+ * it returns the first descendant that is _not_ a FluentTriggerComponent or Fragment.
231
+ * This allows multiple triggers to be stacked, and still apply their props to the actual trigger element.
232
+ *
233
+ * For example, the following returns `<div id="child" />`:
234
+ * ```jsx
235
+ * getTriggerChild(
236
+ * <Tooltip>
237
+ * <MenuTrigger>
238
+ * <div id="child" />
239
+ * </MenuTrigger>
240
+ * </Tooltip>
241
+ * );
242
+ * ```
243
+ */
244
+ export declare const getTriggerChild: (children: React_2.ReactNode) => React_2.ReactElement & {
245
+ ref?: React_2.Ref<unknown>;
177
246
  };
178
247
 
179
248
  /**
@@ -211,25 +280,31 @@ export declare const inputProperties: Record<string, number>;
211
280
 
212
281
  /**
213
282
  * Define the slot arguments for a slot that supports one or more intrinsic element types, such as 'div'.
214
- * For slots that support custom components, use {@link ObjectShorthandProps} instead.
283
+ * For slots that support custom components, use {@link ComponentSlotProps} instead.
215
284
  *
216
285
  * The first param is the slot's default type if no `as` prop is specified.
217
286
  * The second param is an optional union of alternative types that can be specified for the `as` prop.
218
287
  *
219
288
  * ```
220
- * IntrinsicShorthandProps<'div'> // Slot is always div
221
- * IntrinsicShorthandProps<'button', 'a'> // Defaults to button, but allows as="a" with anchor-specific props
222
- * IntrinsicShorthandProps<'label', 'span' | 'div'>; // Defaults to label, but allows as="span" or as="div"
289
+ * IntrinsicSlotProps<'div'> // Slot is always div
290
+ * IntrinsicSlotProps<'button', 'a'> // Defaults to button, but allows as="a" with anchor-specific props
291
+ * IntrinsicSlotProps<'label', 'span' | 'div'>; // Defaults to label, but allows as="span" or as="div"
223
292
  * ```
224
293
  */
225
- export declare type IntrinsicShorthandProps<DefaultAs extends keyof JSX.IntrinsicElements, AlternateAs extends keyof JSX.IntrinsicElements = never> = IsSingleton<DefaultAs> extends false ? 'Error: first parameter to IntrinsicShorthandProps must be a single element type, not a union of types' : ({
294
+ 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' : ({
226
295
  as?: DefaultAs;
227
- } & ObjectShorthandProps<React_2.PropsWithRef<JSX.IntrinsicElements[DefaultAs]>>) | {
296
+ } & SlotProps<React_2.PropsWithRef<JSX.IntrinsicElements[DefaultAs]>>) | {
228
297
  [As in AlternateAs]: {
229
298
  as: As;
230
- } & ObjectShorthandProps<React_2.PropsWithRef<JSX.IntrinsicElements[As]>>;
299
+ } & SlotProps<React_2.PropsWithRef<JSX.IntrinsicElements[As]>>;
231
300
  }[AlternateAs];
232
301
 
302
+ /**
303
+ * Checks if a given element is a FluentUI trigger (e.g. `MenuTrigger` or `Tooltip`).
304
+ * See the {@link FluentTriggerComponent} type for more info.
305
+ */
306
+ export declare const isFluentTrigger: (element: React_2.ReactElement) => boolean | undefined;
307
+
233
308
  /**
234
309
  * Evaluates to true if the given type contains exactly one string, or false if it is a union of strings.
235
310
  *
@@ -261,19 +336,10 @@ export declare const liProperties: Record<string, number>;
261
336
  */
262
337
  export declare const nullRender: () => null;
263
338
 
264
- /**
265
- * Defines the slot props for a slot that supports a Component type.
266
- *
267
- * For intrinsic elements like 'div', use {@link IntrinsicShorthandProps} instead.
268
- */
269
- export declare type ObjectShorthandProps<Props extends {
270
- children?: React_2.ReactNode;
271
- } = {}> = Props & {
272
- children?: Props['children'] | ShorthandRenderFunction<Props>;
339
+ declare type ObjectSlotProps<S extends SlotPropsRecord> = {
340
+ [K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? UnionToIntersection<JSX.IntrinsicElements[As]> : NonNullable<S[K]> extends SlotProps<infer P> ? P : never;
273
341
  };
274
342
 
275
- export declare type ObjectShorthandPropsRecord = Record<string, DefaultObjectShorthandProps | undefined>;
276
-
277
343
  /**
278
344
  * This is part of a hack to infer the element type from a native element *props* type.
279
345
  * The only place the original element is found in a native props type (at least that's workable
@@ -310,16 +376,11 @@ export declare const olProperties: Record<string, number>;
310
376
  */
311
377
  export declare function omit<TObj extends Record<string, any>, Exclusions extends (keyof TObj)[]>(obj: TObj, exclusions: Exclusions): Omit<TObj, Exclusions[number]>;
312
378
 
313
- /**
314
- * Similar to React.Children.only, but drills into fragments rather than treating them as a single child
315
- */
316
- export declare const onlyChild: <P>(child: string | number | boolean | {} | React_2.ReactNodeArray | React_2.ReactPortal | React_2.ReactElement<P, string | ((props: any) => React_2.ReactElement<any, string | any | (new (props: any) => React_2.Component<any, any, any>)> | null) | (new (props: any) => React_2.Component<any, any, any>)> | null | undefined) => React_2.ReactElement<P, string | ((props: any) => React_2.ReactElement<any, string | any | (new (props: any) => React_2.Component<any, any, any>)> | null) | (new (props: any) => React_2.Component<any, any, any>)>;
317
-
318
379
  export declare const optionProperties: Record<string, number>;
319
380
 
320
381
  /**
321
382
  * Removes the 'ref' prop from the given Props type, leaving unions intact (such as the discriminated union created by
322
- * IntrinsicShorthandProps). This allows IntrinsicShorthandProps to be used with React.forwardRef.
383
+ * IntrinsicSlotProps). This allows IntrinsicSlotProps to be used with React.forwardRef.
323
384
  *
324
385
  * The conditional "extends unknown" (always true) exploits a quirk in the way TypeScript handles conditional
325
386
  * types, to prevent unions from being expanded.
@@ -340,12 +401,12 @@ export declare type RefObjectFunction<T> = React_2.RefObject<T> & ((value: T) =>
340
401
  export declare function resetIdsForTests(): void;
341
402
 
342
403
  /**
343
- * Resolves ShorthandProps into ObjectShorthandProps, to ensure normalization of the signature
404
+ * Resolves shorthands into slot props, to ensure normalization of the signature
344
405
  * being passed down to getSlots method
345
- * @param value - the base ShorthandProps
346
- * @param options - options to resolve ShorthandProps
406
+ * @param value - the base shorthand props
407
+ * @param options - options to resolve shorthand props
347
408
  */
348
- export declare function resolveShorthand<Props extends DefaultObjectShorthandProps, Required extends boolean = false>(value: ShorthandProps<Props>, options?: ResolveShorthandOptions<Props, Required>): Required extends false ? Props | undefined : Props;
409
+ export declare function resolveShorthand<Props extends UnknownSlotProps, Required extends boolean = false>(value: ShorthandProps<Props>, options?: ResolveShorthandOptions<Props, Required>): Required extends false ? Props | undefined : Props;
349
410
 
350
411
  export declare type ResolveShorthandOptions<Props extends Record<string, any>, Required extends boolean = false> = {
351
412
  required?: Required;
@@ -359,9 +420,7 @@ export declare type ResolveShorthandOptions<Props extends Record<string, any>, R
359
420
  */
360
421
  export declare const selectProperties: Record<string, number>;
361
422
 
362
- export declare type ShorthandProps<Props extends DefaultObjectShorthandProps> = React_2.ReactChild | React_2.ReactNodeArray | React_2.ReactPortal | number | null | undefined | Props;
363
-
364
- export declare type ShorthandRenderFunction<Props> = (Component: React_2.ElementType<Props>, props: Omit<Props, 'children' | 'as'>) => React_2.ReactNode;
423
+ export declare type ShorthandProps<Props extends UnknownSlotProps> = React_2.ReactChild | React_2.ReactNodeArray | React_2.ReactPortal | number | null | undefined | Props;
365
424
 
366
425
  /**
367
426
  * Checks if the keyboard event should preventDefault() for Enter and Spacebar keys
@@ -370,12 +429,22 @@ export declare type ShorthandRenderFunction<Props> = (Component: React_2.Element
370
429
  */
371
430
  export declare function shouldPreventDefaultOnKeyDown(e: KeyboardEvent | React_2.KeyboardEvent): boolean;
372
431
 
373
- declare type SlotProps<S extends ObjectShorthandPropsRecord> = {
374
- [K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? UnionToIntersection<JSX.IntrinsicElements[As]> : NonNullable<S[K]> extends ObjectShorthandProps<infer P> ? P : never;
432
+ /**
433
+ * Takes the props we want to support for a slot and adds the ability for `children` to be a render function that takes
434
+ * those props.
435
+ */
436
+ export declare type SlotProps<Props extends {
437
+ children?: React_2.ReactNode;
438
+ } = {}> = Props & {
439
+ children?: Props['children'] | SlotRenderFunction<Props>;
375
440
  };
376
441
 
377
- export declare type Slots<S extends ObjectShorthandPropsRecord> = {
378
- [K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? As : S[K] extends ObjectShorthandProps<infer P> ? React_2.ElementType<NonNullable<P>> : React_2.ElementType<NonNullable<S[K]>>;
442
+ export declare type SlotPropsRecord = Record<string, UnknownSlotProps | undefined>;
443
+
444
+ export declare type SlotRenderFunction<Props> = (Component: React_2.ElementType<Props>, props: Omit<Props, 'children' | 'as'>) => React_2.ReactNode;
445
+
446
+ export declare type Slots<S extends SlotPropsRecord> = {
447
+ [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]>>;
379
448
  };
380
449
 
381
450
  export declare const SSRContext: React_2.Context<SSRContextValue>;
@@ -438,6 +507,16 @@ export declare const trProperties: Record<string, number>;
438
507
  */
439
508
  export declare type UnionToIntersection<U> = (U extends unknown ? (x: U) => U : never) extends (x: infer I) => U ? I : never;
440
509
 
510
+ /**
511
+ * Matches any slot props type.
512
+ *
513
+ * This should ONLY be used in type templates as in `extends DefaultObjectSlotProps`;
514
+ * it shouldn't be used as the type of a slot.
515
+ */
516
+ export declare type UnknownSlotProps = SlotProps<Pick<React_2.HTMLAttributes<HTMLElement>, 'children' | 'className' | 'style'> & {
517
+ as?: keyof JSX.IntrinsicElements;
518
+ }>;
519
+
441
520
  /**
442
521
  * Hook to store a value and generate callbacks for setting the value to true or false.
443
522
  * The identity of the callbacks will always stay the same.
@@ -471,42 +550,37 @@ export declare type UseBooleanCallbacks = {
471
550
  export declare function useConst<T>(initialValue: T | (() => T)): T;
472
551
 
473
552
  /**
474
- * A useState 'like' hook that allows optional user control
475
- * Useful for components which allow uncontrolled and controlled behaviour for users
476
- * @returns - https://reactjs.org/docs/hooks-state.html
553
+ * A `useState`-like hook to manage a value that could be either controlled or uncontrolled,
554
+ * such as a checked state or text input string.
555
+ *
556
+ * Unlike `setState`, it's okay to call the returned updater (dispatch) function for either a
557
+ * controlled or uncontrolled component. Calls will only be respected if the component is uncontrolled.
558
+ *
559
+ * @returns Same as [`useState`](https://reactjs.org/docs/hooks-reference.html#usestate): an array
560
+ * of the current value and an updater (dispatch) function. The updater function is referentially
561
+ * stable (won't change during the component's lifecycle). It can take either a new value, or a
562
+ * function which is passed the previous value and returns the new value. Unlike `setState`, calls
563
+ * to the updater function will only be respected if the component is uncontrolled.
564
+ * @see https://reactjs.org/docs/uncontrolled-components.html
477
565
  */
478
566
  export declare const useControllableState: <State>(options: UseControllableStateOptions<State>) => [State, React_2.Dispatch<React_2.SetStateAction<State>>];
479
567
 
480
568
  export declare type UseControllableStateOptions<State> = {
481
569
  /**
482
- * User provided default state or factory initializer
570
+ * User-provided default state or initializer, for uncontrolled usage.
483
571
  */
484
572
  defaultState?: State | (() => State);
485
573
  /**
486
- * User provided controllable state, undefined state means internal state will be used
574
+ * User-provided controlled state. `undefined` means internal state will be used.
487
575
  */
488
576
  state: State | undefined;
489
577
  /**
490
- * Used to initialize state if all user provided states are undefined
578
+ * Used as the initial state if `state` and `defaultState` are both `undefined`.
579
+ * If `undefined` is the correct initial state, pass that here.
491
580
  */
492
581
  initialState: State;
493
582
  };
494
583
 
495
- /**
496
- * Hook to manage a value that could be either controlled or uncontrolled, such as a checked state or
497
- * text box string.
498
- * @param controlledValue - The controlled value passed in the props. This value will always be used if provided,
499
- * and the internal state will be updated to reflect it.
500
- * @param defaultUncontrolledValue - Initial value for the internal state in the uncontrolled case.
501
- * @returns An array of the current value and an updater callback. Like `React.useState`, the updater
502
- * callback always has the same identity, and it can take either a new value, or a function which
503
- * is passed the previous value and returns the new value.
504
- * @see https://reactjs.org/docs/uncontrolled-components.html
505
- */
506
- export declare function useControllableValue<TValue, TElement extends HTMLElement>(controlledValue: TValue, defaultUncontrolledValue: DefaultValue<TValue>): Readonly<[TValue, (update: React_2.SetStateAction<TValue>) => void]>;
507
-
508
- export declare function useControllableValue<TValue, TElement extends HTMLElement, TEvent extends React_2.SyntheticEvent<TElement> | undefined>(controlledValue: TValue, defaultUncontrolledValue: DefaultValue<TValue>, onChange: ChangeCallback<TElement, TValue, TEvent>): Readonly<[TValue, (update: React_2.SetStateAction<TValue>, ev?: React_2.FormEvent<TElement>) => void]>;
509
-
510
584
  /**
511
585
  * https://reactjs.org/docs/hooks-faq.html#how-to-read-an-often-changing-value-from-usecallback
512
586
  *
@@ -565,6 +639,25 @@ export declare const useIsomorphicLayoutEffect: typeof React_2.useEffect;
565
639
  */
566
640
  export declare function useIsSSR(): boolean;
567
641
 
642
+ /**
643
+ * Combine two event callbacks into a single callback function that calls each one in order.
644
+ *
645
+ * This is useful to add an event listener to an existing element without overwriting the current listener, if any.
646
+ *
647
+ * For example:
648
+ * ```ts
649
+ * state.slot.onChange = useMergedCallbacks(state.slot.onChange, ev => {
650
+ * // Handle onChange
651
+ * });
652
+ * ```
653
+ *
654
+ * @param callback1 - The first callback to be called
655
+ * @param callback2 - The second callback to be called
656
+ *
657
+ * @returns An event callback that calls the callbacks in order, and is stable between renders
658
+ */
659
+ export declare function useMergedEventCallbacks<Args extends unknown[]>(callback1: ((...args: Args) => void) | undefined, callback2: ((...args: Args) => void) | undefined): (...args: Args) => void;
660
+
568
661
  /**
569
662
  * React hook to merge multiple React refs (either MutableRefObjects or ref callbacks) into a single ref callback that
570
663
  * updates all provided refs
@@ -1,10 +1,10 @@
1
1
  import * as React from 'react';
2
- import { AsIntrinsicElement, ComponentState, ObjectShorthandPropsRecord, ObjectShorthandProps, UnionToIntersection } from './types';
3
- export declare type Slots<S extends ObjectShorthandPropsRecord> = {
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]>>;
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 SlotProps<S extends ObjectShorthandPropsRecord> = {
7
- [K in keyof S]-?: NonNullable<S[K]> extends AsIntrinsicElement<infer As> ? UnionToIntersection<JSX.IntrinsicElements[As]> : NonNullable<S[K]> extends ObjectShorthandProps<infer P> ? P : never;
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`
@@ -15,15 +15,16 @@ declare type SlotProps<S extends ObjectShorthandPropsRecord> = {
15
15
  * Slots will render as null if they are rendered as primitives with undefined children.
16
16
  *
17
17
  * The slotProps will always omit the `as` prop within them, and for slots that are string
18
- * primitives, the props will be filtered according the the slot type. For example, if the
19
- * slot is rendered `as: 'a'`, the props will be filtered for acceptable anchor props.
18
+ * primitives, the props will be filtered according to the slot type by the type system.
19
+ * For example, if the slot is rendered `as: 'a'`, the props will be filtered for acceptable
20
+ * anchor props. Note that this is only enforced at build time by Typescript -- there is no
21
+ * runtime code filtering props in this function.
20
22
  *
21
23
  * @param state - State including slot definitions
22
- * @param slotNames - Name of which props are slots
23
24
  * @returns An object containing the `slots` map and `slotProps` map.
24
25
  */
25
- export declare function getSlots<R extends ObjectShorthandPropsRecord>(state: ComponentState<R>, slotNames?: (keyof R)[]): {
26
+ export declare function getSlots<R extends SlotPropsRecord>(state: ComponentState<R>): {
26
27
  slots: Slots<R>;
27
- slotProps: SlotProps<R>;
28
+ slotProps: ObjectSlotProps<R>;
28
29
  };
29
30
  export {};