@fluentui/react-button 9.0.0-alpha.88 → 9.0.0-alpha.89

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 (36) hide show
  1. package/CHANGELOG.json +55 -4
  2. package/CHANGELOG.md +19 -4
  3. package/dist/react-button.d.ts +45 -18
  4. package/lib/components/Button/Button.types.d.ts +2 -2
  5. package/lib/components/Button/Button.types.js.map +1 -1
  6. package/lib/components/CompoundButton/CompoundButton.d.ts +16 -2
  7. package/lib/components/CompoundButton/CompoundButton.types.d.ts +3 -4
  8. package/lib/components/CompoundButton/CompoundButton.types.js.map +1 -1
  9. package/lib/components/MenuButton/MenuButton.types.d.ts +1 -2
  10. package/lib/components/MenuButton/MenuButton.types.js.map +1 -1
  11. package/lib/components/ToggleButton/ToggleButton.d.ts +16 -2
  12. package/lib/components/ToggleButton/ToggleButton.types.d.ts +3 -4
  13. package/lib/components/ToggleButton/ToggleButton.types.js.map +1 -1
  14. package/lib/components/ToggleButton/useChecked.d.ts +2 -2
  15. package/lib/components/ToggleButton/useChecked.js.map +1 -1
  16. package/lib-amd/components/Button/Button.types.d.ts +2 -2
  17. package/lib-amd/components/Button/Button.types.js.map +1 -1
  18. package/lib-amd/components/CompoundButton/CompoundButton.d.ts +16 -2
  19. package/lib-amd/components/CompoundButton/CompoundButton.types.d.ts +3 -4
  20. package/lib-amd/components/CompoundButton/CompoundButton.types.js.map +1 -1
  21. package/lib-amd/components/MenuButton/MenuButton.types.d.ts +1 -2
  22. package/lib-amd/components/MenuButton/MenuButton.types.js.map +1 -1
  23. package/lib-amd/components/ToggleButton/ToggleButton.d.ts +16 -2
  24. package/lib-amd/components/ToggleButton/ToggleButton.types.d.ts +3 -4
  25. package/lib-amd/components/ToggleButton/ToggleButton.types.js.map +1 -1
  26. package/lib-amd/components/ToggleButton/useChecked.d.ts +2 -2
  27. package/lib-amd/components/ToggleButton/useChecked.js.map +1 -1
  28. package/lib-commonjs/components/Button/Button.types.d.ts +2 -2
  29. package/lib-commonjs/components/CompoundButton/CompoundButton.d.ts +16 -2
  30. package/lib-commonjs/components/CompoundButton/CompoundButton.types.d.ts +3 -4
  31. package/lib-commonjs/components/MenuButton/MenuButton.types.d.ts +1 -2
  32. package/lib-commonjs/components/ToggleButton/ToggleButton.d.ts +16 -2
  33. package/lib-commonjs/components/ToggleButton/ToggleButton.types.d.ts +3 -4
  34. package/lib-commonjs/components/ToggleButton/useChecked.d.ts +2 -2
  35. package/lib-commonjs/components/ToggleButton/useChecked.js.map +1 -1
  36. package/package.json +7 -7
package/CHANGELOG.json CHANGED
@@ -2,7 +2,58 @@
2
2
  "name": "@fluentui/react-button",
3
3
  "entries": [
4
4
  {
5
- "date": "Mon, 20 Sep 2021 07:35:22 GMT",
5
+ "date": "Tue, 21 Sep 2021 07:40:35 GMT",
6
+ "tag": "@fluentui/react-button_v9.0.0-alpha.89",
7
+ "version": "9.0.0-alpha.89",
8
+ "comments": {
9
+ "prerelease": [
10
+ {
11
+ "author": "gcox@microsoft.com",
12
+ "package": "@fluentui/react-button",
13
+ "comment": "Updating to types over interfaces",
14
+ "commit": "7ac237dbe5b9a3e452581f7478f811f43bba9f19"
15
+ },
16
+ {
17
+ "author": "beachball",
18
+ "package": "@fluentui/react-button",
19
+ "comment": "Bump @fluentui/react-make-styles to v9.0.0-alpha.69",
20
+ "commit": "7ac237dbe5b9a3e452581f7478f811f43bba9f19"
21
+ },
22
+ {
23
+ "author": "beachball",
24
+ "package": "@fluentui/react-button",
25
+ "comment": "Bump @fluentui/react-tabster to v9.0.0-alpha.63",
26
+ "commit": "7ac237dbe5b9a3e452581f7478f811f43bba9f19"
27
+ },
28
+ {
29
+ "author": "beachball",
30
+ "package": "@fluentui/react-button",
31
+ "comment": "Bump @fluentui/babel-make-styles to v9.0.0-alpha.51",
32
+ "commit": "7ac237dbe5b9a3e452581f7478f811f43bba9f19"
33
+ },
34
+ {
35
+ "author": "beachball",
36
+ "package": "@fluentui/react-button",
37
+ "comment": "Bump @fluentui/jest-serializer-make-styles to v9.0.0-alpha.44",
38
+ "commit": "7ac237dbe5b9a3e452581f7478f811f43bba9f19"
39
+ },
40
+ {
41
+ "author": "beachball",
42
+ "package": "@fluentui/react-button",
43
+ "comment": "Bump @fluentui/react-conformance-make-styles to v9.0.0-alpha.13",
44
+ "commit": "7ac237dbe5b9a3e452581f7478f811f43bba9f19"
45
+ },
46
+ {
47
+ "author": "beachball",
48
+ "package": "@fluentui/react-button",
49
+ "comment": "Bump @fluentui/react-menu to v9.0.0-alpha.80",
50
+ "commit": "7ac237dbe5b9a3e452581f7478f811f43bba9f19"
51
+ }
52
+ ]
53
+ }
54
+ },
55
+ {
56
+ "date": "Mon, 20 Sep 2021 07:36:26 GMT",
6
57
  "tag": "@fluentui/react-button_v9.0.0-alpha.88",
7
58
  "version": "9.0.0-alpha.88",
8
59
  "comments": {
@@ -11,12 +62,12 @@
11
62
  "author": "Humberto.Morimoto@microsoft.com",
12
63
  "package": "@fluentui/react-button",
13
64
  "comment": "SplitButton: Re-introducing SplitButton using the latest version of makeStyles.",
14
- "commit": "4560b1fa7c9187216ce734c1f4435c1535fc4884"
65
+ "commit": "b8a304770f77c0353553a152dad34421070400a6"
15
66
  },
16
67
  {
17
68
  "author": "lingfangao@hotmail.com",
18
69
  "package": "@fluentui/react-button",
19
- "commit": "4560b1fa7c9187216ce734c1f4435c1535fc4884",
70
+ "commit": "b8a304770f77c0353553a152dad34421070400a6",
20
71
  "comment": "Bump @fluentui/react-button to v9.0.0-alpha.88"
21
72
  }
22
73
  ],
@@ -25,7 +76,7 @@
25
76
  "author": "lingfangao@hotmail.com",
26
77
  "package": "@fluentui/react-button",
27
78
  "comment": "chore: use versioon eslint-plugin and react-conformance in dev dependencies",
28
- "commit": "4560b1fa7c9187216ce734c1f4435c1535fc4884"
79
+ "commit": "b8a304770f77c0353553a152dad34421070400a6"
29
80
  }
30
81
  ]
31
82
  }
package/CHANGELOG.md CHANGED
@@ -1,18 +1,33 @@
1
1
  # Change Log - @fluentui/react-button
2
2
 
3
- This log was last generated on Mon, 20 Sep 2021 07:35:22 GMT and should not be manually modified.
3
+ This log was last generated on Tue, 21 Sep 2021 07:40:35 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.0.0-alpha.89](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-alpha.89)
8
+
9
+ Tue, 21 Sep 2021 07:40:35 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-alpha.88..@fluentui/react-button_v9.0.0-alpha.89)
11
+
12
+ ### Changes
13
+
14
+ - Updating to types over interfaces ([PR #19880](https://github.com/microsoft/fluentui/pull/19880) by gcox@microsoft.com)
15
+ - Bump @fluentui/react-make-styles to v9.0.0-alpha.69 ([PR #19880](https://github.com/microsoft/fluentui/pull/19880) by beachball)
16
+ - Bump @fluentui/react-tabster to v9.0.0-alpha.63 ([PR #19880](https://github.com/microsoft/fluentui/pull/19880) by beachball)
17
+ - Bump @fluentui/babel-make-styles to v9.0.0-alpha.51 ([PR #19880](https://github.com/microsoft/fluentui/pull/19880) by beachball)
18
+ - Bump @fluentui/jest-serializer-make-styles to v9.0.0-alpha.44 ([PR #19880](https://github.com/microsoft/fluentui/pull/19880) by beachball)
19
+ - Bump @fluentui/react-conformance-make-styles to v9.0.0-alpha.13 ([PR #19880](https://github.com/microsoft/fluentui/pull/19880) by beachball)
20
+ - Bump @fluentui/react-menu to v9.0.0-alpha.80 ([PR #19880](https://github.com/microsoft/fluentui/pull/19880) by beachball)
21
+
7
22
  ## [9.0.0-alpha.88](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-alpha.88)
8
23
 
9
- Mon, 20 Sep 2021 07:35:22 GMT
24
+ Mon, 20 Sep 2021 07:36:26 GMT
10
25
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.0.0-alpha.87..@fluentui/react-button_v9.0.0-alpha.88)
11
26
 
12
27
  ### Changes
13
28
 
14
- - SplitButton: Re-introducing SplitButton using the latest version of makeStyles. ([PR #18290](https://github.com/microsoft/fluentui/pull/18290) by Humberto.Morimoto@microsoft.com)
15
- - Bump @fluentui/react-button to v9.0.0-alpha.88 ([PR #18290](https://github.com/microsoft/fluentui/pull/18290) by lingfangao@hotmail.com)
29
+ - SplitButton: Re-introducing SplitButton using the latest version of makeStyles. ([PR #19844](https://github.com/microsoft/fluentui/pull/19844) by Humberto.Morimoto@microsoft.com)
30
+ - Bump @fluentui/react-button to v9.0.0-alpha.88 ([PR #19844](https://github.com/microsoft/fluentui/pull/19844) by lingfangao@hotmail.com)
16
31
 
17
32
  ## [9.0.0-alpha.87](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.0.0-alpha.87)
18
33
 
package/dist/react-button.d.ts CHANGED
@@ -1,8 +1,8 @@
1
- import type { ComponentPropsCompat } from '@fluentui/react-utilities';
1
+ import { ComponentPropsCompat } from '@fluentui/react-utilities';
2
2
  import type { ComponentStateCompat } from '@fluentui/react-utilities';
3
3
  import type { MenuTriggerChildProps } from '@fluentui/react-menu';
4
4
  import * as React_2 from 'react';
5
- import type { ShorthandPropsCompat } from '@fluentui/react-utilities';
5
+ import { ShorthandPropsCompat } from '@fluentui/react-utilities';
6
6
 
7
7
  /**
8
8
  * Buttons give people a way to trigger an action.
@@ -84,7 +84,7 @@ export declare type ButtonShorthandPropsCompat = 'icon';
84
84
  */
85
85
  export declare const buttonShorthandPropsCompat: ButtonShorthandPropsCompat[];
86
86
 
87
- export declare interface ButtonState extends ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> {
87
+ export declare type ButtonState = ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> & {
88
88
  /**
89
89
  * A button can contain only an icon.
90
90
  * @default false
@@ -94,25 +94,40 @@ export declare interface ButtonState extends ComponentStateCompat<ButtonProps, B
94
94
  * Ref to the root element
95
95
  */
96
96
  ref: React_2.Ref<HTMLElement>;
97
- }
97
+ };
98
98
 
99
- export declare interface CheckedState {
99
+ export declare type CheckedState = {
100
100
  checked?: boolean;
101
101
  defaultChecked?: boolean;
102
102
  onClick?: React_2.DOMAttributes<HTMLElement>['onClick'];
103
103
  role?: string;
104
104
  'aria-checked'?: React_2.AriaAttributes['aria-pressed'];
105
105
  'aria-pressed'?: React_2.AriaAttributes['aria-pressed'];
106
- }
106
+ };
107
107
 
108
108
  /**
109
109
  * CompoundButtons are buttons that can have secondary content that adds extra information to the user.
110
110
  */
111
- export declare const CompoundButton: React_2.ForwardRefExoticComponent<CompoundButtonProps & React_2.RefAttributes<HTMLElement>>;
111
+ export declare const CompoundButton: React_2.ForwardRefExoticComponent<ComponentPropsCompat & React_2.ButtonHTMLAttributes<HTMLElement> & {
112
+ icon?: ShorthandPropsCompat<React_2.HTMLAttributes<HTMLElement>>;
113
+ block?: boolean | undefined;
114
+ circular?: boolean | undefined;
115
+ disabled?: boolean | undefined;
116
+ disabledFocusable?: boolean | undefined;
117
+ iconPosition?: "before" | "after" | undefined;
118
+ outline?: boolean | undefined;
119
+ primary?: boolean | undefined;
120
+ size?: "small" | "medium" | "large" | undefined;
121
+ subtle?: boolean | undefined;
122
+ transparent?: boolean | undefined;
123
+ } & {
124
+ secondaryContent?: ShorthandPropsCompat<React_2.HTMLAttributes<HTMLElement>>;
125
+ contentContainer?: ShorthandPropsCompat<React_2.HTMLAttributes<HTMLElement>>;
126
+ } & React_2.RefAttributes<HTMLElement>>;
112
127
 
113
128
  export declare type CompoundButtonDefaultedProps = ButtonDefaultedProps | 'contentContainer' | 'secondaryContent';
114
129
 
115
- export declare interface CompoundButtonProps extends ButtonProps {
130
+ export declare type CompoundButtonProps = ButtonProps & {
116
131
  /**
117
132
  * Second line of text that describes the action this button takes.
118
133
  */
@@ -121,7 +136,7 @@ export declare interface CompoundButtonProps extends ButtonProps {
121
136
  * Container that wraps the children and secondaryContent slots.
122
137
  */
123
138
  contentContainer?: ShorthandPropsCompat<React_2.HTMLAttributes<HTMLElement>>;
124
- }
139
+ };
125
140
 
126
141
  export declare type CompoundButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'contentContainer' | 'secondaryContent';
127
142
 
@@ -130,8 +145,7 @@ export declare type CompoundButtonShorthandPropsCompat = ButtonShorthandPropsCom
130
145
  */
131
146
  export declare const compoundButtonShorthandPropsCompat: CompoundButtonShorthandPropsCompat[];
132
147
 
133
- export declare interface CompoundButtonState extends ButtonState, ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps> {
134
- }
148
+ export declare type CompoundButtonState = ButtonState & ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps>;
135
149
 
136
150
  /**
137
151
  * MenuButtons are buttons that handle opening and closing a menu when they are triggered.
@@ -154,8 +168,7 @@ export declare type MenuButtonShorthandPropsCompat = ButtonShorthandPropsCompat
154
168
  */
155
169
  export declare const menuButtonShorthandPropsCompat: MenuButtonShorthandPropsCompat[];
156
170
 
157
- export declare interface MenuButtonState extends Omit<ButtonState, 'iconPosition'>, ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps> {
158
- }
171
+ export declare type MenuButtonState = Omit<ButtonState, 'iconPosition'> & ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps>;
159
172
 
160
173
  /**
161
174
  * Renders a Button component by passing the state defined props to the appropriate slots.
@@ -220,11 +233,26 @@ export declare interface SplitButtonState extends ComponentStateCompat<SplitButt
220
233
  /**
221
234
  * ToggleButtons are buttons that toggle between two defined states when triggered.
222
235
  */
223
- export declare const ToggleButton: React_2.ForwardRefExoticComponent<ToggleButtonProps & React_2.RefAttributes<HTMLElement>>;
236
+ export declare const ToggleButton: React_2.ForwardRefExoticComponent<ComponentPropsCompat & React_2.ButtonHTMLAttributes<HTMLElement> & {
237
+ icon?: ShorthandPropsCompat<React_2.HTMLAttributes<HTMLElement>>;
238
+ block?: boolean | undefined;
239
+ circular?: boolean | undefined;
240
+ disabled?: boolean | undefined;
241
+ disabledFocusable?: boolean | undefined;
242
+ iconPosition?: "before" | "after" | undefined;
243
+ outline?: boolean | undefined;
244
+ primary?: boolean | undefined;
245
+ size?: "small" | "medium" | "large" | undefined;
246
+ subtle?: boolean | undefined;
247
+ transparent?: boolean | undefined;
248
+ } & {
249
+ checked?: boolean | undefined;
250
+ defaultChecked?: boolean | undefined;
251
+ } & React_2.RefAttributes<HTMLElement>>;
224
252
 
225
253
  export declare type ToggleButtonDefaultedProps = ButtonDefaultedProps;
226
254
 
227
- export declare interface ToggleButtonProps extends ButtonProps {
255
+ export declare type ToggleButtonProps = ButtonProps & {
228
256
  /**
229
257
  * Defines the controlled checked state of the `ToggleButton`.
230
258
  * Mutually exclusive to `defaultChecked`.
@@ -239,12 +267,11 @@ export declare interface ToggleButtonProps extends ButtonProps {
239
267
  * @default false
240
268
  */
241
269
  defaultChecked?: boolean;
242
- }
270
+ };
243
271
 
244
272
  export declare type ToggleButtonShorthandPropsCompat = ButtonShorthandPropsCompat;
245
273
 
246
- export declare interface ToggleButtonState extends ButtonState, ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps> {
247
- }
274
+ export declare type ToggleButtonState = ButtonState & ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps>;
248
275
 
249
276
  /**
250
277
  * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.
package/lib/components/Button/Button.types.d.ts CHANGED
@@ -67,7 +67,7 @@ export declare type ButtonProps = ComponentPropsCompat & React.ButtonHTMLAttribu
67
67
  };
68
68
  export declare type ButtonShorthandPropsCompat = 'icon';
69
69
  export declare type ButtonDefaultedProps = 'icon' | 'size';
70
- export interface ButtonState extends ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> {
70
+ export declare type ButtonState = ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> & {
71
71
  /**
72
72
  * A button can contain only an icon.
73
73
  * @default false
@@ -77,4 +77,4 @@ export interface ButtonState extends ComponentStateCompat<ButtonProps, ButtonSho
77
77
  * Ref to the root element
78
78
  */
79
79
  ref: React.Ref<HTMLElement>;
80
- }
80
+ };
package/lib/components/Button/Button.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.types.js","sourceRoot":"../src/","sources":["components/Button/Button.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentPropsCompat, ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\n\nexport type ButtonProps = ComponentPropsCompat &\n React.ButtonHTMLAttributes<HTMLElement> & {\n /**\n * Icon slot that, if specified, renders an icon either before or after the `children` as specified by the\n * `iconPosition` prop.\n */\n icon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n\n // /**\n // * Loader slot that, if specified, renders a `loader` before the `icon` and `children` while the `loading` flag\n // * is set to `true`.\n // */\n // loader?: ShorthandPropsCompat<React.HTMLAttributes<HTMLSpanElement>>;\n\n /**\n * A button can fill the width of its container.\n * @default false\n */\n block?: boolean;\n\n /**\n * A button can have completely rounded corners.\n * @default false\n */\n circular?: boolean;\n\n /**\n * A button can show that it cannot be interacted with.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * When set, allows the button to be focusable even when it has been disabled. This is used in scenarios where it\n * is important to keep a consistent tab order for screen reader and keyboard users. The primary example of this\n * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.\n * @default false\n */\n disabledFocusable?: boolean;\n\n /**\n * A button can format its icon to appear before or after its content.\n * @default 'before'\n */\n iconPosition?: 'before' | 'after';\n\n // /**\n // * A button can show a loading indicator if it is waiting for another action to happen before allowing itself to\n // * be interacted with.\n // * @default false\n // */\n // loading?: boolean;\n\n /**\n * A button can be styled such that it has no background styling and is just emphasized through the styling of\n * its content and borders.\n * Mutually exclusive with `primary`, `subtle` and `transparent`.\n * @default false\n */\n outline?: boolean;\n\n /**\n * A button can be styled to emphasize that it represents the primary action.\n * Mutually exclusive with `outline`, `subtle` and `transparent`.\n * @default false\n */\n primary?: boolean;\n\n /**\n * A button supports different sizes.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n\n /**\n * A button can be styled to blend into its background and become less emphasized.\n * @default false\n * Mutually exclusive with `outline`, `primary` and `transparent`.\n */\n subtle?: boolean;\n\n /**\n * A button can be styled such that it has no background or border styling and is just emphasized through its\n * content styling.\n * Mutually exclusive with `outline`, `primary` and `subtle`.\n * @default false\n */\n transparent?: boolean;\n };\n\nexport type ButtonShorthandPropsCompat = 'icon';\n\nexport type ButtonDefaultedProps = 'icon' | 'size';\n\nexport interface ButtonState\n extends ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> {\n /**\n * A button can contain only an icon.\n * @default false\n */\n iconOnly?: boolean;\n\n /**\n * Ref to the root element\n */\n ref: React.Ref<HTMLElement>;\n}\n"]}
1
+ {"version":3,"file":"Button.types.js","sourceRoot":"../src/","sources":["components/Button/Button.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentPropsCompat, ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\n\nexport type ButtonProps = ComponentPropsCompat &\n React.ButtonHTMLAttributes<HTMLElement> & {\n /**\n * Icon slot that, if specified, renders an icon either before or after the `children` as specified by the\n * `iconPosition` prop.\n */\n icon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n\n // /**\n // * Loader slot that, if specified, renders a `loader` before the `icon` and `children` while the `loading` flag\n // * is set to `true`.\n // */\n // loader?: ShorthandPropsCompat<React.HTMLAttributes<HTMLSpanElement>>;\n\n /**\n * A button can fill the width of its container.\n * @default false\n */\n block?: boolean;\n\n /**\n * A button can have completely rounded corners.\n * @default false\n */\n circular?: boolean;\n\n /**\n * A button can show that it cannot be interacted with.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * When set, allows the button to be focusable even when it has been disabled. This is used in scenarios where it\n * is important to keep a consistent tab order for screen reader and keyboard users. The primary example of this\n * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.\n * @default false\n */\n disabledFocusable?: boolean;\n\n /**\n * A button can format its icon to appear before or after its content.\n * @default 'before'\n */\n iconPosition?: 'before' | 'after';\n\n // /**\n // * A button can show a loading indicator if it is waiting for another action to happen before allowing itself to\n // * be interacted with.\n // * @default false\n // */\n // loading?: boolean;\n\n /**\n * A button can be styled such that it has no background styling and is just emphasized through the styling of\n * its content and borders.\n * Mutually exclusive with `primary`, `subtle` and `transparent`.\n * @default false\n */\n outline?: boolean;\n\n /**\n * A button can be styled to emphasize that it represents the primary action.\n * Mutually exclusive with `outline`, `subtle` and `transparent`.\n * @default false\n */\n primary?: boolean;\n\n /**\n * A button supports different sizes.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n\n /**\n * A button can be styled to blend into its background and become less emphasized.\n * @default false\n * Mutually exclusive with `outline`, `primary` and `transparent`.\n */\n subtle?: boolean;\n\n /**\n * A button can be styled such that it has no background or border styling and is just emphasized through its\n * content styling.\n * Mutually exclusive with `outline`, `primary` and `subtle`.\n * @default false\n */\n transparent?: boolean;\n };\n\nexport type ButtonShorthandPropsCompat = 'icon';\n\nexport type ButtonDefaultedProps = 'icon' | 'size';\n\nexport type ButtonState = ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> & {\n /**\n * A button can contain only an icon.\n * @default false\n */\n iconOnly?: boolean;\n\n /**\n * Ref to the root element\n */\n ref: React.Ref<HTMLElement>;\n};\n"]}
package/lib/components/CompoundButton/CompoundButton.d.ts CHANGED
@@ -1,6 +1,20 @@
1
1
  import * as React from 'react';
2
- import type { CompoundButtonProps } from './CompoundButton.types';
3
2
  /**
4
3
  * CompoundButtons are buttons that can have secondary content that adds extra information to the user.
5
4
  */
6
- export declare const CompoundButton: React.ForwardRefExoticComponent<CompoundButtonProps & React.RefAttributes<HTMLElement>>;
5
+ export declare const CompoundButton: React.ForwardRefExoticComponent<import("@fluentui/react-utilities").ComponentPropsCompat & React.ButtonHTMLAttributes<HTMLElement> & {
6
+ icon?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
7
+ block?: boolean | undefined;
8
+ circular?: boolean | undefined;
9
+ disabled?: boolean | undefined;
10
+ disabledFocusable?: boolean | undefined;
11
+ iconPosition?: "before" | "after" | undefined;
12
+ outline?: boolean | undefined;
13
+ primary?: boolean | undefined;
14
+ size?: "small" | "medium" | "large" | undefined;
15
+ subtle?: boolean | undefined;
16
+ transparent?: boolean | undefined;
17
+ } & {
18
+ secondaryContent?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
19
+ contentContainer?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
20
+ } & React.RefAttributes<HTMLElement>>;
package/lib/components/CompoundButton/CompoundButton.types.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';
3
3
  import type { ButtonDefaultedProps, ButtonProps, ButtonShorthandPropsCompat, ButtonState } from '../Button/Button.types';
4
- export interface CompoundButtonProps extends ButtonProps {
4
+ export declare type CompoundButtonProps = ButtonProps & {
5
5
  /**
6
6
  * Second line of text that describes the action this button takes.
7
7
  */
@@ -10,8 +10,7 @@ export interface CompoundButtonProps extends ButtonProps {
10
10
  * Container that wraps the children and secondaryContent slots.
11
11
  */
12
12
  contentContainer?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
13
- }
13
+ };
14
14
  export declare type CompoundButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'contentContainer' | 'secondaryContent';
15
15
  export declare type CompoundButtonDefaultedProps = ButtonDefaultedProps | 'contentContainer' | 'secondaryContent';
16
- export interface CompoundButtonState extends ButtonState, ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps> {
17
- }
16
+ export declare type CompoundButtonState = ButtonState & ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps>;
package/lib/components/CompoundButton/CompoundButton.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"CompoundButton.types.js","sourceRoot":"../src/","sources":["components/CompoundButton/CompoundButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport interface CompoundButtonProps extends ButtonProps {\n /**\n * Second line of text that describes the action this button takes.\n */\n secondaryContent?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n\n /**\n * Container that wraps the children and secondaryContent slots.\n */\n contentContainer?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n}\n\nexport type CompoundButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'contentContainer' | 'secondaryContent';\n\nexport type CompoundButtonDefaultedProps = ButtonDefaultedProps | 'contentContainer' | 'secondaryContent';\n\nexport interface CompoundButtonState\n extends ButtonState,\n ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps> {}\n"]}
1
+ {"version":3,"file":"CompoundButton.types.js","sourceRoot":"../src/","sources":["components/CompoundButton/CompoundButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport type CompoundButtonProps = ButtonProps & {\n /**\n * Second line of text that describes the action this button takes.\n */\n secondaryContent?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n\n /**\n * Container that wraps the children and secondaryContent slots.\n */\n contentContainer?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n};\n\nexport type CompoundButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'contentContainer' | 'secondaryContent';\n\nexport type CompoundButtonDefaultedProps = ButtonDefaultedProps | 'contentContainer' | 'secondaryContent';\n\nexport type CompoundButtonState = ButtonState &\n ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps>;\n"]}
package/lib/components/MenuButton/MenuButton.types.d.ts CHANGED
@@ -10,5 +10,4 @@ export declare type MenuButtonProps = Omit<ButtonProps, 'iconPosition'> & Partia
10
10
  };
11
11
  export declare type MenuButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'menuIcon';
12
12
  export declare type MenuButtonDefaultedProps = ButtonDefaultedProps | 'menuIcon';
13
- export interface MenuButtonState extends Omit<ButtonState, 'iconPosition'>, ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps> {
14
- }
13
+ export declare type MenuButtonState = Omit<ButtonState, 'iconPosition'> & ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps>;
package/lib/components/MenuButton/MenuButton.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MenuButton.types.js","sourceRoot":"../src/","sources":["components/MenuButton/MenuButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { MenuTriggerChildProps } from '@fluentui/react-menu';\nimport type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport type MenuButtonProps = Omit<ButtonProps, 'iconPosition'> &\n Partial<Omit<MenuTriggerChildProps, 'ref'>> & {\n /**\n * Menu icon that indicates that this button has a menu that can be expanded.\n */\n menuIcon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n };\n\nexport type MenuButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'menuIcon';\n\nexport type MenuButtonDefaultedProps = ButtonDefaultedProps | 'menuIcon';\n\nexport interface MenuButtonState\n extends Omit<ButtonState, 'iconPosition'>,\n ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps> {}\n"]}
1
+ {"version":3,"file":"MenuButton.types.js","sourceRoot":"../src/","sources":["components/MenuButton/MenuButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { MenuTriggerChildProps } from '@fluentui/react-menu';\nimport type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport type MenuButtonProps = Omit<ButtonProps, 'iconPosition'> &\n Partial<Omit<MenuTriggerChildProps, 'ref'>> & {\n /**\n * Menu icon that indicates that this button has a menu that can be expanded.\n */\n menuIcon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n };\n\nexport type MenuButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'menuIcon';\n\nexport type MenuButtonDefaultedProps = ButtonDefaultedProps | 'menuIcon';\n\nexport type MenuButtonState = Omit<ButtonState, 'iconPosition'> &\n ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps>;\n"]}
package/lib/components/ToggleButton/ToggleButton.d.ts CHANGED
@@ -1,6 +1,20 @@
1
1
  import * as React from 'react';
2
- import type { ToggleButtonProps } from './ToggleButton.types';
3
2
  /**
4
3
  * ToggleButtons are buttons that toggle between two defined states when triggered.
5
4
  */
6
- export declare const ToggleButton: React.ForwardRefExoticComponent<ToggleButtonProps & React.RefAttributes<HTMLElement>>;
5
+ export declare const ToggleButton: React.ForwardRefExoticComponent<import("@fluentui/react-utilities").ComponentPropsCompat & React.ButtonHTMLAttributes<HTMLElement> & {
6
+ icon?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
7
+ block?: boolean | undefined;
8
+ circular?: boolean | undefined;
9
+ disabled?: boolean | undefined;
10
+ disabledFocusable?: boolean | undefined;
11
+ iconPosition?: "before" | "after" | undefined;
12
+ outline?: boolean | undefined;
13
+ primary?: boolean | undefined;
14
+ size?: "small" | "medium" | "large" | undefined;
15
+ subtle?: boolean | undefined;
16
+ transparent?: boolean | undefined;
17
+ } & {
18
+ checked?: boolean | undefined;
19
+ defaultChecked?: boolean | undefined;
20
+ } & React.RefAttributes<HTMLElement>>;
package/lib/components/ToggleButton/ToggleButton.types.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { ComponentStateCompat } from '@fluentui/react-utilities';
2
2
  import type { ButtonDefaultedProps, ButtonProps, ButtonShorthandPropsCompat, ButtonState } from '../Button/Button.types';
3
- export interface ToggleButtonProps extends ButtonProps {
3
+ export declare type ToggleButtonProps = ButtonProps & {
4
4
  /**
5
5
  * Defines the controlled checked state of the `ToggleButton`.
6
6
  * Mutually exclusive to `defaultChecked`.
@@ -15,8 +15,7 @@ export interface ToggleButtonProps extends ButtonProps {
15
15
  * @default false
16
16
  */
17
17
  defaultChecked?: boolean;
18
- }
18
+ };
19
19
  export declare type ToggleButtonShorthandPropsCompat = ButtonShorthandPropsCompat;
20
20
  export declare type ToggleButtonDefaultedProps = ButtonDefaultedProps;
21
- export interface ToggleButtonState extends ButtonState, ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps> {
22
- }
21
+ export declare type ToggleButtonState = ButtonState & ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps>;
package/lib/components/ToggleButton/ToggleButton.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ToggleButton.types.js","sourceRoot":"../src/","sources":["components/ToggleButton/ToggleButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentStateCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport interface ToggleButtonProps extends ButtonProps {\n /**\n * Defines the controlled checked state of the `ToggleButton`.\n * Mutually exclusive to `defaultChecked`.\n * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n * correct value based on handling `onClick` events and re-rendering.\n * @default false\n */\n checked?: boolean;\n\n /**\n * Defines whether the `ToggleButton` is initially in a checked state or not when rendered.\n * Mutually exclusive to `checked`.\n * @default false\n */\n defaultChecked?: boolean;\n}\n\nexport type ToggleButtonShorthandPropsCompat = ButtonShorthandPropsCompat;\n\nexport type ToggleButtonDefaultedProps = ButtonDefaultedProps;\n\nexport interface ToggleButtonState\n extends ButtonState,\n ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps> {}\n"]}
1
+ {"version":3,"file":"ToggleButton.types.js","sourceRoot":"../src/","sources":["components/ToggleButton/ToggleButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentStateCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport type ToggleButtonProps = ButtonProps & {\n /**\n * Defines the controlled checked state of the `ToggleButton`.\n * Mutually exclusive to `defaultChecked`.\n * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n * correct value based on handling `onClick` events and re-rendering.\n * @default false\n */\n checked?: boolean;\n\n /**\n * Defines whether the `ToggleButton` is initially in a checked state or not when rendered.\n * Mutually exclusive to `checked`.\n * @default false\n */\n defaultChecked?: boolean;\n};\n\nexport type ToggleButtonShorthandPropsCompat = ButtonShorthandPropsCompat;\n\nexport type ToggleButtonDefaultedProps = ButtonDefaultedProps;\n\nexport type ToggleButtonState = ButtonState &\n ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps>;\n"]}
package/lib/components/ToggleButton/useChecked.d.ts CHANGED
@@ -1,12 +1,12 @@
1
1
  import * as React from 'react';
2
- export interface CheckedState {
2
+ export declare type CheckedState = {
3
3
  checked?: boolean;
4
4
  defaultChecked?: boolean;
5
5
  onClick?: React.DOMAttributes<HTMLElement>['onClick'];
6
6
  role?: string;
7
7
  'aria-checked'?: React.AriaAttributes['aria-pressed'];
8
8
  'aria-pressed'?: React.AriaAttributes['aria-pressed'];
9
- }
9
+ };
10
10
  /**
11
11
  * The useToggle hook processes adds the correct toggled state and acccessibility as needed.
12
12
  * @param state - state to read and augment.
package/lib/components/ToggleButton/useChecked.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["components/ToggleButton/useChecked.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,oBAAT,QAAqC,2BAArC;AAYA;;;AAGG;;AACH,OAAO,IAAM,UAAU,GAAG,UAA8B,KAA9B,EAA2C;AAC3D,MAAA,OAAO,GAAoC,KAAK,CAAzC,OAAP;AAAA,MAAS,OAAO,GAA2B,KAAK,CAAhC,OAAhB;AAAA,MAAkB,cAAc,GAAW,KAAK,CAAhB,cAAhC;AAAA,MAAkC,IAAI,GAAK,KAAK,CAAV,IAAtC;;AACF,MAAA,EAAA,GAAkC,oBAAoB,CAAC,OAAD,EAAU,cAAV,CAAtD;AAAA,MAAC,YAAY,GAAA,EAAA,CAAA,CAAA,CAAb;AAAA,MAAe,eAAe,GAAA,EAAA,CAAA,CAAA,CAA9B,CAF6D,CAInE;;;AACA,EAAA,KAAK,CAAC,OAAN,GAAgB,YAAhB,CALmE,CAOnE;;AACA,MAAM,kBAAkB,GAAG,IAAI,KAAK,kBAAT,IAA+B,IAAI,KAAK,UAAnE;AAEA,EAAA,KAAK,CAAC,kBAAkB,GAAG,cAAH,GAAoB,cAAvC,CAAL,GAA8D,CAAC,CAAC,YAAhE;AAEA,EAAA,KAAK,CAAC,OAAN,GAAgB,KAAK,CAAC,WAAN,CACd,UAAC,EAAD,EAAoD;AAClD,QAAI,OAAJ,EAAa;AACX,MAAA,OAAO,CAAC,EAAD,CAAP;;AAEA,UAAI,EAAE,CAAC,gBAAP,EAAyB;AACvB;AACD;AACF;;AAED,IAAA,eAAe,CAAC,CAAC,YAAF,CAAf;AACD,GAXa,EAYd,CAAC,YAAD,EAAe,eAAf,EAAgC,OAAhC,CAZc,CAAhB;AAcD,CA1BM","sourcesContent":["import * as React from 'react';\nimport { useControllableValue } from '@fluentui/react-utilities';\n\nexport interface CheckedState {\n checked?: boolean;\n defaultChecked?: boolean;\n onClick?: React.DOMAttributes<HTMLElement>['onClick'];\n\n role?: string;\n 'aria-checked'?: React.AriaAttributes['aria-pressed'];\n 'aria-pressed'?: React.AriaAttributes['aria-pressed'];\n}\n\n/**\n * The useToggle hook processes adds the correct toggled state and acccessibility as needed.\n * @param state - state to read and augment.\n */\nexport const useChecked = <TState extends CheckedState>(state: TState) => {\n const { onClick, checked, defaultChecked, role } = state;\n const [checkedValue, setCheckedValue] = useControllableValue(checked, defaultChecked);\n\n // Ensure the state is the correct controlled/uncontrolled value.\n state.checked = checkedValue;\n\n // Ensure the right aria value is set to represent the checked state.\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n state[isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed'] = !!checkedValue;\n\n state.onClick = React.useCallback(\n (ev: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (onClick) {\n onClick(ev);\n\n if (ev.defaultPrevented) {\n return;\n }\n }\n\n setCheckedValue(!checkedValue);\n },\n [checkedValue, setCheckedValue, onClick],\n );\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["components/ToggleButton/useChecked.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,oBAAT,QAAqC,2BAArC;AAYA;;;AAGG;;AACH,OAAO,IAAM,UAAU,GAAG,UAA8B,KAA9B,EAA2C;AAC3D,MAAA,OAAO,GAAoC,KAAK,CAAzC,OAAP;AAAA,MAAS,OAAO,GAA2B,KAAK,CAAhC,OAAhB;AAAA,MAAkB,cAAc,GAAW,KAAK,CAAhB,cAAhC;AAAA,MAAkC,IAAI,GAAK,KAAK,CAAV,IAAtC;;AACF,MAAA,EAAA,GAAkC,oBAAoB,CAAC,OAAD,EAAU,cAAV,CAAtD;AAAA,MAAC,YAAY,GAAA,EAAA,CAAA,CAAA,CAAb;AAAA,MAAe,eAAe,GAAA,EAAA,CAAA,CAAA,CAA9B,CAF6D,CAInE;;;AACA,EAAA,KAAK,CAAC,OAAN,GAAgB,YAAhB,CALmE,CAOnE;;AACA,MAAM,kBAAkB,GAAG,IAAI,KAAK,kBAAT,IAA+B,IAAI,KAAK,UAAnE;AAEA,EAAA,KAAK,CAAC,kBAAkB,GAAG,cAAH,GAAoB,cAAvC,CAAL,GAA8D,CAAC,CAAC,YAAhE;AAEA,EAAA,KAAK,CAAC,OAAN,GAAgB,KAAK,CAAC,WAAN,CACd,UAAC,EAAD,EAAoD;AAClD,QAAI,OAAJ,EAAa;AACX,MAAA,OAAO,CAAC,EAAD,CAAP;;AAEA,UAAI,EAAE,CAAC,gBAAP,EAAyB;AACvB;AACD;AACF;;AAED,IAAA,eAAe,CAAC,CAAC,YAAF,CAAf;AACD,GAXa,EAYd,CAAC,YAAD,EAAe,eAAf,EAAgC,OAAhC,CAZc,CAAhB;AAcD,CA1BM","sourcesContent":["import * as React from 'react';\nimport { useControllableValue } from '@fluentui/react-utilities';\n\nexport type CheckedState = {\n checked?: boolean;\n defaultChecked?: boolean;\n onClick?: React.DOMAttributes<HTMLElement>['onClick'];\n\n role?: string;\n 'aria-checked'?: React.AriaAttributes['aria-pressed'];\n 'aria-pressed'?: React.AriaAttributes['aria-pressed'];\n};\n\n/**\n * The useToggle hook processes adds the correct toggled state and acccessibility as needed.\n * @param state - state to read and augment.\n */\nexport const useChecked = <TState extends CheckedState>(state: TState) => {\n const { onClick, checked, defaultChecked, role } = state;\n const [checkedValue, setCheckedValue] = useControllableValue(checked, defaultChecked);\n\n // Ensure the state is the correct controlled/uncontrolled value.\n state.checked = checkedValue;\n\n // Ensure the right aria value is set to represent the checked state.\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n state[isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed'] = !!checkedValue;\n\n state.onClick = React.useCallback(\n (ev: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (onClick) {\n onClick(ev);\n\n if (ev.defaultPrevented) {\n return;\n }\n }\n\n setCheckedValue(!checkedValue);\n },\n [checkedValue, setCheckedValue, onClick],\n );\n};\n"],"sourceRoot":"../src/"}
package/lib-amd/components/Button/Button.types.d.ts CHANGED
@@ -67,7 +67,7 @@ export declare type ButtonProps = ComponentPropsCompat & React.ButtonHTMLAttribu
67
67
  };
68
68
  export declare type ButtonShorthandPropsCompat = 'icon';
69
69
  export declare type ButtonDefaultedProps = 'icon' | 'size';
70
- export interface ButtonState extends ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> {
70
+ export declare type ButtonState = ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> & {
71
71
  /**
72
72
  * A button can contain only an icon.
73
73
  * @default false
@@ -77,4 +77,4 @@ export interface ButtonState extends ComponentStateCompat<ButtonProps, ButtonSho
77
77
  * Ref to the root element
78
78
  */
79
79
  ref: React.Ref<HTMLElement>;
80
- }
80
+ };
package/lib-amd/components/Button/Button.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Button.types.js","sourceRoot":"../src/","sources":["components/Button/Button.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentPropsCompat, ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\n\nexport type ButtonProps = ComponentPropsCompat &\n React.ButtonHTMLAttributes<HTMLElement> & {\n /**\n * Icon slot that, if specified, renders an icon either before or after the `children` as specified by the\n * `iconPosition` prop.\n */\n icon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n\n // /**\n // * Loader slot that, if specified, renders a `loader` before the `icon` and `children` while the `loading` flag\n // * is set to `true`.\n // */\n // loader?: ShorthandPropsCompat<React.HTMLAttributes<HTMLSpanElement>>;\n\n /**\n * A button can fill the width of its container.\n * @default false\n */\n block?: boolean;\n\n /**\n * A button can have completely rounded corners.\n * @default false\n */\n circular?: boolean;\n\n /**\n * A button can show that it cannot be interacted with.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * When set, allows the button to be focusable even when it has been disabled. This is used in scenarios where it\n * is important to keep a consistent tab order for screen reader and keyboard users. The primary example of this\n * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.\n * @default false\n */\n disabledFocusable?: boolean;\n\n /**\n * A button can format its icon to appear before or after its content.\n * @default 'before'\n */\n iconPosition?: 'before' | 'after';\n\n // /**\n // * A button can show a loading indicator if it is waiting for another action to happen before allowing itself to\n // * be interacted with.\n // * @default false\n // */\n // loading?: boolean;\n\n /**\n * A button can be styled such that it has no background styling and is just emphasized through the styling of\n * its content and borders.\n * Mutually exclusive with `primary`, `subtle` and `transparent`.\n * @default false\n */\n outline?: boolean;\n\n /**\n * A button can be styled to emphasize that it represents the primary action.\n * Mutually exclusive with `outline`, `subtle` and `transparent`.\n * @default false\n */\n primary?: boolean;\n\n /**\n * A button supports different sizes.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n\n /**\n * A button can be styled to blend into its background and become less emphasized.\n * @default false\n * Mutually exclusive with `outline`, `primary` and `transparent`.\n */\n subtle?: boolean;\n\n /**\n * A button can be styled such that it has no background or border styling and is just emphasized through its\n * content styling.\n * Mutually exclusive with `outline`, `primary` and `subtle`.\n * @default false\n */\n transparent?: boolean;\n };\n\nexport type ButtonShorthandPropsCompat = 'icon';\n\nexport type ButtonDefaultedProps = 'icon' | 'size';\n\nexport interface ButtonState\n extends ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> {\n /**\n * A button can contain only an icon.\n * @default false\n */\n iconOnly?: boolean;\n\n /**\n * Ref to the root element\n */\n ref: React.Ref<HTMLElement>;\n}\n"]}
1
+ {"version":3,"file":"Button.types.js","sourceRoot":"../src/","sources":["components/Button/Button.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentPropsCompat, ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\n\nexport type ButtonProps = ComponentPropsCompat &\n React.ButtonHTMLAttributes<HTMLElement> & {\n /**\n * Icon slot that, if specified, renders an icon either before or after the `children` as specified by the\n * `iconPosition` prop.\n */\n icon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n\n // /**\n // * Loader slot that, if specified, renders a `loader` before the `icon` and `children` while the `loading` flag\n // * is set to `true`.\n // */\n // loader?: ShorthandPropsCompat<React.HTMLAttributes<HTMLSpanElement>>;\n\n /**\n * A button can fill the width of its container.\n * @default false\n */\n block?: boolean;\n\n /**\n * A button can have completely rounded corners.\n * @default false\n */\n circular?: boolean;\n\n /**\n * A button can show that it cannot be interacted with.\n * @default false\n */\n disabled?: boolean;\n\n /**\n * When set, allows the button to be focusable even when it has been disabled. This is used in scenarios where it\n * is important to keep a consistent tab order for screen reader and keyboard users. The primary example of this\n * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.\n * @default false\n */\n disabledFocusable?: boolean;\n\n /**\n * A button can format its icon to appear before or after its content.\n * @default 'before'\n */\n iconPosition?: 'before' | 'after';\n\n // /**\n // * A button can show a loading indicator if it is waiting for another action to happen before allowing itself to\n // * be interacted with.\n // * @default false\n // */\n // loading?: boolean;\n\n /**\n * A button can be styled such that it has no background styling and is just emphasized through the styling of\n * its content and borders.\n * Mutually exclusive with `primary`, `subtle` and `transparent`.\n * @default false\n */\n outline?: boolean;\n\n /**\n * A button can be styled to emphasize that it represents the primary action.\n * Mutually exclusive with `outline`, `subtle` and `transparent`.\n * @default false\n */\n primary?: boolean;\n\n /**\n * A button supports different sizes.\n * @default 'medium'\n */\n size?: 'small' | 'medium' | 'large';\n\n /**\n * A button can be styled to blend into its background and become less emphasized.\n * @default false\n * Mutually exclusive with `outline`, `primary` and `transparent`.\n */\n subtle?: boolean;\n\n /**\n * A button can be styled such that it has no background or border styling and is just emphasized through its\n * content styling.\n * Mutually exclusive with `outline`, `primary` and `subtle`.\n * @default false\n */\n transparent?: boolean;\n };\n\nexport type ButtonShorthandPropsCompat = 'icon';\n\nexport type ButtonDefaultedProps = 'icon' | 'size';\n\nexport type ButtonState = ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> & {\n /**\n * A button can contain only an icon.\n * @default false\n */\n iconOnly?: boolean;\n\n /**\n * Ref to the root element\n */\n ref: React.Ref<HTMLElement>;\n};\n"]}
package/lib-amd/components/CompoundButton/CompoundButton.d.ts CHANGED
@@ -1,6 +1,20 @@
1
1
  import * as React from 'react';
2
- import type { CompoundButtonProps } from './CompoundButton.types';
3
2
  /**
4
3
  * CompoundButtons are buttons that can have secondary content that adds extra information to the user.
5
4
  */
6
- export declare const CompoundButton: React.ForwardRefExoticComponent<CompoundButtonProps & React.RefAttributes<HTMLElement>>;
5
+ export declare const CompoundButton: React.ForwardRefExoticComponent<import("@fluentui/react-utilities").ComponentPropsCompat & React.ButtonHTMLAttributes<HTMLElement> & {
6
+ icon?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
7
+ block?: boolean | undefined;
8
+ circular?: boolean | undefined;
9
+ disabled?: boolean | undefined;
10
+ disabledFocusable?: boolean | undefined;
11
+ iconPosition?: "before" | "after" | undefined;
12
+ outline?: boolean | undefined;
13
+ primary?: boolean | undefined;
14
+ size?: "small" | "medium" | "large" | undefined;
15
+ subtle?: boolean | undefined;
16
+ transparent?: boolean | undefined;
17
+ } & {
18
+ secondaryContent?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
19
+ contentContainer?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
20
+ } & React.RefAttributes<HTMLElement>>;
package/lib-amd/components/CompoundButton/CompoundButton.types.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';
3
3
  import type { ButtonDefaultedProps, ButtonProps, ButtonShorthandPropsCompat, ButtonState } from '../Button/Button.types';
4
- export interface CompoundButtonProps extends ButtonProps {
4
+ export declare type CompoundButtonProps = ButtonProps & {
5
5
  /**
6
6
  * Second line of text that describes the action this button takes.
7
7
  */
@@ -10,8 +10,7 @@ export interface CompoundButtonProps extends ButtonProps {
10
10
  * Container that wraps the children and secondaryContent slots.
11
11
  */
12
12
  contentContainer?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
13
- }
13
+ };
14
14
  export declare type CompoundButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'contentContainer' | 'secondaryContent';
15
15
  export declare type CompoundButtonDefaultedProps = ButtonDefaultedProps | 'contentContainer' | 'secondaryContent';
16
- export interface CompoundButtonState extends ButtonState, ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps> {
17
- }
16
+ export declare type CompoundButtonState = ButtonState & ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps>;
package/lib-amd/components/CompoundButton/CompoundButton.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"CompoundButton.types.js","sourceRoot":"../src/","sources":["components/CompoundButton/CompoundButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport interface CompoundButtonProps extends ButtonProps {\n /**\n * Second line of text that describes the action this button takes.\n */\n secondaryContent?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n\n /**\n * Container that wraps the children and secondaryContent slots.\n */\n contentContainer?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n}\n\nexport type CompoundButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'contentContainer' | 'secondaryContent';\n\nexport type CompoundButtonDefaultedProps = ButtonDefaultedProps | 'contentContainer' | 'secondaryContent';\n\nexport interface CompoundButtonState\n extends ButtonState,\n ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps> {}\n"]}
1
+ {"version":3,"file":"CompoundButton.types.js","sourceRoot":"../src/","sources":["components/CompoundButton/CompoundButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport type CompoundButtonProps = ButtonProps & {\n /**\n * Second line of text that describes the action this button takes.\n */\n secondaryContent?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n\n /**\n * Container that wraps the children and secondaryContent slots.\n */\n contentContainer?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n};\n\nexport type CompoundButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'contentContainer' | 'secondaryContent';\n\nexport type CompoundButtonDefaultedProps = ButtonDefaultedProps | 'contentContainer' | 'secondaryContent';\n\nexport type CompoundButtonState = ButtonState &\n ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps>;\n"]}
package/lib-amd/components/MenuButton/MenuButton.types.d.ts CHANGED
@@ -10,5 +10,4 @@ export declare type MenuButtonProps = Omit<ButtonProps, 'iconPosition'> & Partia
10
10
  };
11
11
  export declare type MenuButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'menuIcon';
12
12
  export declare type MenuButtonDefaultedProps = ButtonDefaultedProps | 'menuIcon';
13
- export interface MenuButtonState extends Omit<ButtonState, 'iconPosition'>, ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps> {
14
- }
13
+ export declare type MenuButtonState = Omit<ButtonState, 'iconPosition'> & ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps>;
package/lib-amd/components/MenuButton/MenuButton.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"MenuButton.types.js","sourceRoot":"../src/","sources":["components/MenuButton/MenuButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { MenuTriggerChildProps } from '@fluentui/react-menu';\nimport type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport type MenuButtonProps = Omit<ButtonProps, 'iconPosition'> &\n Partial<Omit<MenuTriggerChildProps, 'ref'>> & {\n /**\n * Menu icon that indicates that this button has a menu that can be expanded.\n */\n menuIcon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n };\n\nexport type MenuButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'menuIcon';\n\nexport type MenuButtonDefaultedProps = ButtonDefaultedProps | 'menuIcon';\n\nexport interface MenuButtonState\n extends Omit<ButtonState, 'iconPosition'>,\n ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps> {}\n"]}
1
+ {"version":3,"file":"MenuButton.types.js","sourceRoot":"../src/","sources":["components/MenuButton/MenuButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import * as React from 'react';\nimport type { MenuTriggerChildProps } from '@fluentui/react-menu';\nimport type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport type MenuButtonProps = Omit<ButtonProps, 'iconPosition'> &\n Partial<Omit<MenuTriggerChildProps, 'ref'>> & {\n /**\n * Menu icon that indicates that this button has a menu that can be expanded.\n */\n menuIcon?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;\n };\n\nexport type MenuButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'menuIcon';\n\nexport type MenuButtonDefaultedProps = ButtonDefaultedProps | 'menuIcon';\n\nexport type MenuButtonState = Omit<ButtonState, 'iconPosition'> &\n ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps>;\n"]}
package/lib-amd/components/ToggleButton/ToggleButton.d.ts CHANGED
@@ -1,6 +1,20 @@
1
1
  import * as React from 'react';
2
- import type { ToggleButtonProps } from './ToggleButton.types';
3
2
  /**
4
3
  * ToggleButtons are buttons that toggle between two defined states when triggered.
5
4
  */
6
- export declare const ToggleButton: React.ForwardRefExoticComponent<ToggleButtonProps & React.RefAttributes<HTMLElement>>;
5
+ export declare const ToggleButton: React.ForwardRefExoticComponent<import("@fluentui/react-utilities").ComponentPropsCompat & React.ButtonHTMLAttributes<HTMLElement> & {
6
+ icon?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
7
+ block?: boolean | undefined;
8
+ circular?: boolean | undefined;
9
+ disabled?: boolean | undefined;
10
+ disabledFocusable?: boolean | undefined;
11
+ iconPosition?: "before" | "after" | undefined;
12
+ outline?: boolean | undefined;
13
+ primary?: boolean | undefined;
14
+ size?: "small" | "medium" | "large" | undefined;
15
+ subtle?: boolean | undefined;
16
+ transparent?: boolean | undefined;
17
+ } & {
18
+ checked?: boolean | undefined;
19
+ defaultChecked?: boolean | undefined;
20
+ } & React.RefAttributes<HTMLElement>>;
package/lib-amd/components/ToggleButton/ToggleButton.types.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { ComponentStateCompat } from '@fluentui/react-utilities';
2
2
  import type { ButtonDefaultedProps, ButtonProps, ButtonShorthandPropsCompat, ButtonState } from '../Button/Button.types';
3
- export interface ToggleButtonProps extends ButtonProps {
3
+ export declare type ToggleButtonProps = ButtonProps & {
4
4
  /**
5
5
  * Defines the controlled checked state of the `ToggleButton`.
6
6
  * Mutually exclusive to `defaultChecked`.
@@ -15,8 +15,7 @@ export interface ToggleButtonProps extends ButtonProps {
15
15
  * @default false
16
16
  */
17
17
  defaultChecked?: boolean;
18
- }
18
+ };
19
19
  export declare type ToggleButtonShorthandPropsCompat = ButtonShorthandPropsCompat;
20
20
  export declare type ToggleButtonDefaultedProps = ButtonDefaultedProps;
21
- export interface ToggleButtonState extends ButtonState, ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps> {
22
- }
21
+ export declare type ToggleButtonState = ButtonState & ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps>;
package/lib-amd/components/ToggleButton/ToggleButton.types.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ToggleButton.types.js","sourceRoot":"../src/","sources":["components/ToggleButton/ToggleButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentStateCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport interface ToggleButtonProps extends ButtonProps {\n /**\n * Defines the controlled checked state of the `ToggleButton`.\n * Mutually exclusive to `defaultChecked`.\n * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n * correct value based on handling `onClick` events and re-rendering.\n * @default false\n */\n checked?: boolean;\n\n /**\n * Defines whether the `ToggleButton` is initially in a checked state or not when rendered.\n * Mutually exclusive to `checked`.\n * @default false\n */\n defaultChecked?: boolean;\n}\n\nexport type ToggleButtonShorthandPropsCompat = ButtonShorthandPropsCompat;\n\nexport type ToggleButtonDefaultedProps = ButtonDefaultedProps;\n\nexport interface ToggleButtonState\n extends ButtonState,\n ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps> {}\n"]}
1
+ {"version":3,"file":"ToggleButton.types.js","sourceRoot":"../src/","sources":["components/ToggleButton/ToggleButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ComponentStateCompat } from '@fluentui/react-utilities';\nimport type {\n ButtonDefaultedProps,\n ButtonProps,\n ButtonShorthandPropsCompat,\n ButtonState,\n} from '../Button/Button.types';\n\nexport type ToggleButtonProps = ButtonProps & {\n /**\n * Defines the controlled checked state of the `ToggleButton`.\n * Mutually exclusive to `defaultChecked`.\n * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n * correct value based on handling `onClick` events and re-rendering.\n * @default false\n */\n checked?: boolean;\n\n /**\n * Defines whether the `ToggleButton` is initially in a checked state or not when rendered.\n * Mutually exclusive to `checked`.\n * @default false\n */\n defaultChecked?: boolean;\n};\n\nexport type ToggleButtonShorthandPropsCompat = ButtonShorthandPropsCompat;\n\nexport type ToggleButtonDefaultedProps = ButtonDefaultedProps;\n\nexport type ToggleButtonState = ButtonState &\n ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps>;\n"]}
package/lib-amd/components/ToggleButton/useChecked.d.ts CHANGED
@@ -1,12 +1,12 @@
1
1
  import * as React from 'react';
2
- export interface CheckedState {
2
+ export declare type CheckedState = {
3
3
  checked?: boolean;
4
4
  defaultChecked?: boolean;
5
5
  onClick?: React.DOMAttributes<HTMLElement>['onClick'];
6
6
  role?: string;
7
7
  'aria-checked'?: React.AriaAttributes['aria-pressed'];
8
8
  'aria-pressed'?: React.AriaAttributes['aria-pressed'];
9
- }
9
+ };
10
10
  /**
11
11
  * The useToggle hook processes adds the correct toggled state and acccessibility as needed.
12
12
  * @param state - state to read and augment.
package/lib-amd/components/ToggleButton/useChecked.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"useChecked.js","sourceRoot":"../src/","sources":["components/ToggleButton/useChecked.ts"],"names":[],"mappings":";;;;IAaA;;;OAGG;IACI,IAAM,UAAU,GAAG,UAA8B,KAAa;QAC3D,IAAA,OAAO,GAAoC,KAAK,QAAzC,EAAE,OAAO,GAA2B,KAAK,QAAhC,EAAE,cAAc,GAAW,KAAK,eAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;QACnD,IAAA,KAAkC,sCAAoB,CAAC,OAAO,EAAE,cAAc,CAAC,EAA9E,YAAY,QAAA,EAAE,eAAe,QAAiD,CAAC;QAEtF,iEAAiE;QACjE,KAAK,CAAC,OAAO,GAAG,YAAY,CAAC;QAE7B,qEAAqE;QACrE,IAAM,kBAAkB,GAAG,IAAI,KAAK,kBAAkB,IAAI,IAAI,KAAK,UAAU,CAAC;QAE9E,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,YAAY,CAAC;QAE7E,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,WAAW,CAC/B,UAAC,EAAmD;YAClD,IAAI,OAAO,EAAE;gBACX,OAAO,CAAC,EAAE,CAAC,CAAC;gBAEZ,IAAI,EAAE,CAAC,gBAAgB,EAAE;oBACvB,OAAO;iBACR;aACF;YAED,eAAe,CAAC,CAAC,YAAY,CAAC,CAAC;QACjC,CAAC,EACD,CAAC,YAAY,EAAE,eAAe,EAAE,OAAO,CAAC,CACzC,CAAC;IACJ,CAAC,CAAC;IA1BW,QAAA,UAAU,cA0BrB","sourcesContent":["import * as React from 'react';\nimport { useControllableValue } from '@fluentui/react-utilities';\n\nexport interface CheckedState {\n checked?: boolean;\n defaultChecked?: boolean;\n onClick?: React.DOMAttributes<HTMLElement>['onClick'];\n\n role?: string;\n 'aria-checked'?: React.AriaAttributes['aria-pressed'];\n 'aria-pressed'?: React.AriaAttributes['aria-pressed'];\n}\n\n/**\n * The useToggle hook processes adds the correct toggled state and acccessibility as needed.\n * @param state - state to read and augment.\n */\nexport const useChecked = <TState extends CheckedState>(state: TState) => {\n const { onClick, checked, defaultChecked, role } = state;\n const [checkedValue, setCheckedValue] = useControllableValue(checked, defaultChecked);\n\n // Ensure the state is the correct controlled/uncontrolled value.\n state.checked = checkedValue;\n\n // Ensure the right aria value is set to represent the checked state.\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n state[isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed'] = !!checkedValue;\n\n state.onClick = React.useCallback(\n (ev: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (onClick) {\n onClick(ev);\n\n if (ev.defaultPrevented) {\n return;\n }\n }\n\n setCheckedValue(!checkedValue);\n },\n [checkedValue, setCheckedValue, onClick],\n );\n};\n"]}
1
+ {"version":3,"file":"useChecked.js","sourceRoot":"../src/","sources":["components/ToggleButton/useChecked.ts"],"names":[],"mappings":";;;;IAaA;;;OAGG;IACI,IAAM,UAAU,GAAG,UAA8B,KAAa;QAC3D,IAAA,OAAO,GAAoC,KAAK,QAAzC,EAAE,OAAO,GAA2B,KAAK,QAAhC,EAAE,cAAc,GAAW,KAAK,eAAhB,EAAE,IAAI,GAAK,KAAK,KAAV,CAAW;QACnD,IAAA,KAAkC,sCAAoB,CAAC,OAAO,EAAE,cAAc,CAAC,EAA9E,YAAY,QAAA,EAAE,eAAe,QAAiD,CAAC;QAEtF,iEAAiE;QACjE,KAAK,CAAC,OAAO,GAAG,YAAY,CAAC;QAE7B,qEAAqE;QACrE,IAAM,kBAAkB,GAAG,IAAI,KAAK,kBAAkB,IAAI,IAAI,KAAK,UAAU,CAAC;QAE9E,KAAK,CAAC,kBAAkB,CAAC,CAAC,CAAC,cAAc,CAAC,CAAC,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC,YAAY,CAAC;QAE7E,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,WAAW,CAC/B,UAAC,EAAmD;YAClD,IAAI,OAAO,EAAE;gBACX,OAAO,CAAC,EAAE,CAAC,CAAC;gBAEZ,IAAI,EAAE,CAAC,gBAAgB,EAAE;oBACvB,OAAO;iBACR;aACF;YAED,eAAe,CAAC,CAAC,YAAY,CAAC,CAAC;QACjC,CAAC,EACD,CAAC,YAAY,EAAE,eAAe,EAAE,OAAO,CAAC,CACzC,CAAC;IACJ,CAAC,CAAC;IA1BW,QAAA,UAAU,cA0BrB","sourcesContent":["import * as React from 'react';\nimport { useControllableValue } from '@fluentui/react-utilities';\n\nexport type CheckedState = {\n checked?: boolean;\n defaultChecked?: boolean;\n onClick?: React.DOMAttributes<HTMLElement>['onClick'];\n\n role?: string;\n 'aria-checked'?: React.AriaAttributes['aria-pressed'];\n 'aria-pressed'?: React.AriaAttributes['aria-pressed'];\n};\n\n/**\n * The useToggle hook processes adds the correct toggled state and acccessibility as needed.\n * @param state - state to read and augment.\n */\nexport const useChecked = <TState extends CheckedState>(state: TState) => {\n const { onClick, checked, defaultChecked, role } = state;\n const [checkedValue, setCheckedValue] = useControllableValue(checked, defaultChecked);\n\n // Ensure the state is the correct controlled/uncontrolled value.\n state.checked = checkedValue;\n\n // Ensure the right aria value is set to represent the checked state.\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n state[isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed'] = !!checkedValue;\n\n state.onClick = React.useCallback(\n (ev: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (onClick) {\n onClick(ev);\n\n if (ev.defaultPrevented) {\n return;\n }\n }\n\n setCheckedValue(!checkedValue);\n },\n [checkedValue, setCheckedValue, onClick],\n );\n};\n"]}
package/lib-commonjs/components/Button/Button.types.d.ts CHANGED
@@ -67,7 +67,7 @@ export declare type ButtonProps = ComponentPropsCompat & React.ButtonHTMLAttribu
67
67
  };
68
68
  export declare type ButtonShorthandPropsCompat = 'icon';
69
69
  export declare type ButtonDefaultedProps = 'icon' | 'size';
70
- export interface ButtonState extends ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> {
70
+ export declare type ButtonState = ComponentStateCompat<ButtonProps, ButtonShorthandPropsCompat, ButtonDefaultedProps> & {
71
71
  /**
72
72
  * A button can contain only an icon.
73
73
  * @default false
@@ -77,4 +77,4 @@ export interface ButtonState extends ComponentStateCompat<ButtonProps, ButtonSho
77
77
  * Ref to the root element
78
78
  */
79
79
  ref: React.Ref<HTMLElement>;
80
- }
80
+ };
package/lib-commonjs/components/CompoundButton/CompoundButton.d.ts CHANGED
@@ -1,6 +1,20 @@
1
1
  import * as React from 'react';
2
- import type { CompoundButtonProps } from './CompoundButton.types';
3
2
  /**
4
3
  * CompoundButtons are buttons that can have secondary content that adds extra information to the user.
5
4
  */
6
- export declare const CompoundButton: React.ForwardRefExoticComponent<CompoundButtonProps & React.RefAttributes<HTMLElement>>;
5
+ export declare const CompoundButton: React.ForwardRefExoticComponent<import("@fluentui/react-utilities").ComponentPropsCompat & React.ButtonHTMLAttributes<HTMLElement> & {
6
+ icon?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
7
+ block?: boolean | undefined;
8
+ circular?: boolean | undefined;
9
+ disabled?: boolean | undefined;
10
+ disabledFocusable?: boolean | undefined;
11
+ iconPosition?: "before" | "after" | undefined;
12
+ outline?: boolean | undefined;
13
+ primary?: boolean | undefined;
14
+ size?: "small" | "medium" | "large" | undefined;
15
+ subtle?: boolean | undefined;
16
+ transparent?: boolean | undefined;
17
+ } & {
18
+ secondaryContent?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
19
+ contentContainer?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
20
+ } & React.RefAttributes<HTMLElement>>;
package/lib-commonjs/components/CompoundButton/CompoundButton.types.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as React from 'react';
2
2
  import type { ComponentStateCompat, ShorthandPropsCompat } from '@fluentui/react-utilities';
3
3
  import type { ButtonDefaultedProps, ButtonProps, ButtonShorthandPropsCompat, ButtonState } from '../Button/Button.types';
4
- export interface CompoundButtonProps extends ButtonProps {
4
+ export declare type CompoundButtonProps = ButtonProps & {
5
5
  /**
6
6
  * Second line of text that describes the action this button takes.
7
7
  */
@@ -10,8 +10,7 @@ export interface CompoundButtonProps extends ButtonProps {
10
10
  * Container that wraps the children and secondaryContent slots.
11
11
  */
12
12
  contentContainer?: ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
13
- }
13
+ };
14
14
  export declare type CompoundButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'contentContainer' | 'secondaryContent';
15
15
  export declare type CompoundButtonDefaultedProps = ButtonDefaultedProps | 'contentContainer' | 'secondaryContent';
16
- export interface CompoundButtonState extends ButtonState, ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps> {
17
- }
16
+ export declare type CompoundButtonState = ButtonState & ComponentStateCompat<CompoundButtonProps, CompoundButtonShorthandPropsCompat, CompoundButtonDefaultedProps>;
package/lib-commonjs/components/MenuButton/MenuButton.types.d.ts CHANGED
@@ -10,5 +10,4 @@ export declare type MenuButtonProps = Omit<ButtonProps, 'iconPosition'> & Partia
10
10
  };
11
11
  export declare type MenuButtonShorthandPropsCompat = ButtonShorthandPropsCompat | 'menuIcon';
12
12
  export declare type MenuButtonDefaultedProps = ButtonDefaultedProps | 'menuIcon';
13
- export interface MenuButtonState extends Omit<ButtonState, 'iconPosition'>, ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps> {
14
- }
13
+ export declare type MenuButtonState = Omit<ButtonState, 'iconPosition'> & ComponentStateCompat<MenuButtonProps, MenuButtonShorthandPropsCompat, MenuButtonDefaultedProps>;
package/lib-commonjs/components/ToggleButton/ToggleButton.d.ts CHANGED
@@ -1,6 +1,20 @@
1
1
  import * as React from 'react';
2
- import type { ToggleButtonProps } from './ToggleButton.types';
3
2
  /**
4
3
  * ToggleButtons are buttons that toggle between two defined states when triggered.
5
4
  */
6
- export declare const ToggleButton: React.ForwardRefExoticComponent<ToggleButtonProps & React.RefAttributes<HTMLElement>>;
5
+ export declare const ToggleButton: React.ForwardRefExoticComponent<import("@fluentui/react-utilities").ComponentPropsCompat & React.ButtonHTMLAttributes<HTMLElement> & {
6
+ icon?: import("@fluentui/react-utilities").ShorthandPropsCompat<React.HTMLAttributes<HTMLElement>>;
7
+ block?: boolean | undefined;
8
+ circular?: boolean | undefined;
9
+ disabled?: boolean | undefined;
10
+ disabledFocusable?: boolean | undefined;
11
+ iconPosition?: "before" | "after" | undefined;
12
+ outline?: boolean | undefined;
13
+ primary?: boolean | undefined;
14
+ size?: "small" | "medium" | "large" | undefined;
15
+ subtle?: boolean | undefined;
16
+ transparent?: boolean | undefined;
17
+ } & {
18
+ checked?: boolean | undefined;
19
+ defaultChecked?: boolean | undefined;
20
+ } & React.RefAttributes<HTMLElement>>;
package/lib-commonjs/components/ToggleButton/ToggleButton.types.d.ts CHANGED
@@ -1,6 +1,6 @@
1
1
  import type { ComponentStateCompat } from '@fluentui/react-utilities';
2
2
  import type { ButtonDefaultedProps, ButtonProps, ButtonShorthandPropsCompat, ButtonState } from '../Button/Button.types';
3
- export interface ToggleButtonProps extends ButtonProps {
3
+ export declare type ToggleButtonProps = ButtonProps & {
4
4
  /**
5
5
  * Defines the controlled checked state of the `ToggleButton`.
6
6
  * Mutually exclusive to `defaultChecked`.
@@ -15,8 +15,7 @@ export interface ToggleButtonProps extends ButtonProps {
15
15
  * @default false
16
16
  */
17
17
  defaultChecked?: boolean;
18
- }
18
+ };
19
19
  export declare type ToggleButtonShorthandPropsCompat = ButtonShorthandPropsCompat;
20
20
  export declare type ToggleButtonDefaultedProps = ButtonDefaultedProps;
21
- export interface ToggleButtonState extends ButtonState, ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps> {
22
- }
21
+ export declare type ToggleButtonState = ButtonState & ComponentStateCompat<ToggleButtonProps, ToggleButtonShorthandPropsCompat, ToggleButtonDefaultedProps>;
package/lib-commonjs/components/ToggleButton/useChecked.d.ts CHANGED
@@ -1,12 +1,12 @@
1
1
  import * as React from 'react';
2
- export interface CheckedState {
2
+ export declare type CheckedState = {
3
3
  checked?: boolean;
4
4
  defaultChecked?: boolean;
5
5
  onClick?: React.DOMAttributes<HTMLElement>['onClick'];
6
6
  role?: string;
7
7
  'aria-checked'?: React.AriaAttributes['aria-pressed'];
8
8
  'aria-pressed'?: React.AriaAttributes['aria-pressed'];
9
- }
9
+ };
10
10
  /**
11
11
  * The useToggle hook processes adds the correct toggled state and acccessibility as needed.
12
12
  * @param state - state to read and augment.
package/lib-commonjs/components/ToggleButton/useChecked.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["components/ToggleButton/useChecked.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAYA;;;AAGG;;;AACI,IAAM,UAAU,GAAG,UAA8B,KAA9B,EAA2C;AAC3D,MAAA,OAAO,GAAoC,KAAK,CAAzC,OAAP;AAAA,MAAS,OAAO,GAA2B,KAAK,CAAhC,OAAhB;AAAA,MAAkB,cAAc,GAAW,KAAK,CAAhB,cAAhC;AAAA,MAAkC,IAAI,GAAK,KAAK,CAAV,IAAtC;;AACF,MAAA,EAAA,GAAkC,iBAAA,CAAA,oBAAA,CAAqB,OAArB,EAA8B,cAA9B,CAAlC;AAAA,MAAC,YAAY,GAAA,EAAA,CAAA,CAAA,CAAb;AAAA,MAAe,eAAe,GAAA,EAAA,CAAA,CAAA,CAA9B,CAF6D,CAInE;;;AACA,EAAA,KAAK,CAAC,OAAN,GAAgB,YAAhB,CALmE,CAOnE;;AACA,MAAM,kBAAkB,GAAG,IAAI,KAAK,kBAAT,IAA+B,IAAI,KAAK,UAAnE;AAEA,EAAA,KAAK,CAAC,kBAAkB,GAAG,cAAH,GAAoB,cAAvC,CAAL,GAA8D,CAAC,CAAC,YAAhE;AAEA,EAAA,KAAK,CAAC,OAAN,GAAgB,KAAK,CAAC,WAAN,CACd,UAAC,EAAD,EAAoD;AAClD,QAAI,OAAJ,EAAa;AACX,MAAA,OAAO,CAAC,EAAD,CAAP;;AAEA,UAAI,EAAE,CAAC,gBAAP,EAAyB;AACvB;AACD;AACF;;AAED,IAAA,eAAe,CAAC,CAAC,YAAF,CAAf;AACD,GAXa,EAYd,CAAC,YAAD,EAAe,eAAf,EAAgC,OAAhC,CAZc,CAAhB;AAcD,CA1BM;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","sourcesContent":["import * as React from 'react';\nimport { useControllableValue } from '@fluentui/react-utilities';\n\nexport interface CheckedState {\n checked?: boolean;\n defaultChecked?: boolean;\n onClick?: React.DOMAttributes<HTMLElement>['onClick'];\n\n role?: string;\n 'aria-checked'?: React.AriaAttributes['aria-pressed'];\n 'aria-pressed'?: React.AriaAttributes['aria-pressed'];\n}\n\n/**\n * The useToggle hook processes adds the correct toggled state and acccessibility as needed.\n * @param state - state to read and augment.\n */\nexport const useChecked = <TState extends CheckedState>(state: TState) => {\n const { onClick, checked, defaultChecked, role } = state;\n const [checkedValue, setCheckedValue] = useControllableValue(checked, defaultChecked);\n\n // Ensure the state is the correct controlled/uncontrolled value.\n state.checked = checkedValue;\n\n // Ensure the right aria value is set to represent the checked state.\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n state[isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed'] = !!checkedValue;\n\n state.onClick = React.useCallback(\n (ev: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (onClick) {\n onClick(ev);\n\n if (ev.defaultPrevented) {\n return;\n }\n }\n\n setCheckedValue(!checkedValue);\n },\n [checkedValue, setCheckedValue, onClick],\n );\n};\n"],"sourceRoot":"../src/"}
1
+ {"version":3,"sources":["components/ToggleButton/useChecked.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,IAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAYA;;;AAGG;;;AACI,IAAM,UAAU,GAAG,UAA8B,KAA9B,EAA2C;AAC3D,MAAA,OAAO,GAAoC,KAAK,CAAzC,OAAP;AAAA,MAAS,OAAO,GAA2B,KAAK,CAAhC,OAAhB;AAAA,MAAkB,cAAc,GAAW,KAAK,CAAhB,cAAhC;AAAA,MAAkC,IAAI,GAAK,KAAK,CAAV,IAAtC;;AACF,MAAA,EAAA,GAAkC,iBAAA,CAAA,oBAAA,CAAqB,OAArB,EAA8B,cAA9B,CAAlC;AAAA,MAAC,YAAY,GAAA,EAAA,CAAA,CAAA,CAAb;AAAA,MAAe,eAAe,GAAA,EAAA,CAAA,CAAA,CAA9B,CAF6D,CAInE;;;AACA,EAAA,KAAK,CAAC,OAAN,GAAgB,YAAhB,CALmE,CAOnE;;AACA,MAAM,kBAAkB,GAAG,IAAI,KAAK,kBAAT,IAA+B,IAAI,KAAK,UAAnE;AAEA,EAAA,KAAK,CAAC,kBAAkB,GAAG,cAAH,GAAoB,cAAvC,CAAL,GAA8D,CAAC,CAAC,YAAhE;AAEA,EAAA,KAAK,CAAC,OAAN,GAAgB,KAAK,CAAC,WAAN,CACd,UAAC,EAAD,EAAoD;AAClD,QAAI,OAAJ,EAAa;AACX,MAAA,OAAO,CAAC,EAAD,CAAP;;AAEA,UAAI,EAAE,CAAC,gBAAP,EAAyB;AACvB;AACD;AACF;;AAED,IAAA,eAAe,CAAC,CAAC,YAAF,CAAf;AACD,GAXa,EAYd,CAAC,YAAD,EAAe,eAAf,EAAgC,OAAhC,CAZc,CAAhB;AAcD,CA1BM;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","sourcesContent":["import * as React from 'react';\nimport { useControllableValue } from '@fluentui/react-utilities';\n\nexport type CheckedState = {\n checked?: boolean;\n defaultChecked?: boolean;\n onClick?: React.DOMAttributes<HTMLElement>['onClick'];\n\n role?: string;\n 'aria-checked'?: React.AriaAttributes['aria-pressed'];\n 'aria-pressed'?: React.AriaAttributes['aria-pressed'];\n};\n\n/**\n * The useToggle hook processes adds the correct toggled state and acccessibility as needed.\n * @param state - state to read and augment.\n */\nexport const useChecked = <TState extends CheckedState>(state: TState) => {\n const { onClick, checked, defaultChecked, role } = state;\n const [checkedValue, setCheckedValue] = useControllableValue(checked, defaultChecked);\n\n // Ensure the state is the correct controlled/uncontrolled value.\n state.checked = checkedValue;\n\n // Ensure the right aria value is set to represent the checked state.\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n state[isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed'] = !!checkedValue;\n\n state.onClick = React.useCallback(\n (ev: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {\n if (onClick) {\n onClick(ev);\n\n if (ev.defaultPrevented) {\n return;\n }\n }\n\n setCheckedValue(!checkedValue);\n },\n [checkedValue, setCheckedValue, onClick],\n );\n};\n"],"sourceRoot":"../src/"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-button",
3
- "version": "9.0.0-alpha.88",
3
+ "version": "9.0.0-alpha.89",
4
4
  "description": "Fluent UI React Button component.",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -26,12 +26,12 @@
26
26
  },
27
27
  "devDependencies": {
28
28
  "@fluentui/a11y-testing": "^0.1.0",
29
- "@fluentui/babel-make-styles": "9.0.0-alpha.50",
29
+ "@fluentui/babel-make-styles": "9.0.0-alpha.51",
30
30
  "@fluentui/eslint-plugin": "*",
31
- "@fluentui/jest-serializer-make-styles": "9.0.0-alpha.43",
31
+ "@fluentui/jest-serializer-make-styles": "9.0.0-alpha.44",
32
32
  "@fluentui/react-conformance": "*",
33
- "@fluentui/react-conformance-make-styles": "9.0.0-alpha.12",
34
- "@fluentui/react-menu": "9.0.0-alpha.79",
33
+ "@fluentui/react-conformance-make-styles": "9.0.0-alpha.13",
34
+ "@fluentui/react-menu": "9.0.0-alpha.80",
35
35
  "@fluentui/scripts": "^1.0.0",
36
36
  "@types/enzyme": "3.10.3",
37
37
  "@types/enzyme-adapter-react-16": "1.0.3",
@@ -47,8 +47,8 @@
47
47
  "dependencies": {
48
48
  "@fluentui/keyboard-keys": "9.0.0-alpha.3",
49
49
  "@fluentui/react-icons": "^1.1.136",
50
- "@fluentui/react-make-styles": "9.0.0-alpha.68",
51
- "@fluentui/react-tabster": "9.0.0-alpha.62",
50
+ "@fluentui/react-make-styles": "9.0.0-alpha.69",
51
+ "@fluentui/react-tabster": "9.0.0-alpha.63",
52
52
  "@fluentui/react-utilities": "9.0.0-alpha.49",
53
53
  "tslib": "^2.1.0"
54
54
  },