@fluentui/react-button 0.0.0-nightly-20230302-0419.1 → 0.0.0-nightly-20230306-0424.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 (25) hide show
  1. package/CHANGELOG.json +21 -15
  2. package/CHANGELOG.md +11 -10
  3. package/lib/components/Button/Button.js +5 -0
  4. package/lib/components/Button/Button.js.map +1 -1
  5. package/lib/components/CompoundButton/CompoundButton.js +5 -0
  6. package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
  7. package/lib/components/MenuButton/MenuButton.js +5 -0
  8. package/lib/components/MenuButton/MenuButton.js.map +1 -1
  9. package/lib/components/SplitButton/SplitButton.js +5 -0
  10. package/lib/components/SplitButton/SplitButton.js.map +1 -1
  11. package/lib/components/ToggleButton/ToggleButton.js +5 -0
  12. package/lib/components/ToggleButton/ToggleButton.js.map +1 -1
  13. package/lib/utils/useToggleState.js.map +1 -1
  14. package/lib-commonjs/components/Button/Button.js +5 -0
  15. package/lib-commonjs/components/Button/Button.js.map +1 -1
  16. package/lib-commonjs/components/CompoundButton/CompoundButton.js +5 -0
  17. package/lib-commonjs/components/CompoundButton/CompoundButton.js.map +1 -1
  18. package/lib-commonjs/components/MenuButton/MenuButton.js +5 -0
  19. package/lib-commonjs/components/MenuButton/MenuButton.js.map +1 -1
  20. package/lib-commonjs/components/SplitButton/SplitButton.js +5 -0
  21. package/lib-commonjs/components/SplitButton/SplitButton.js.map +1 -1
  22. package/lib-commonjs/components/ToggleButton/ToggleButton.js +5 -0
  23. package/lib-commonjs/components/ToggleButton/ToggleButton.js.map +1 -1
  24. package/lib-commonjs/utils/useToggleState.js.map +1 -1
  25. package/package.json +8 -7
package/CHANGELOG.json CHANGED
@@ -2,9 +2,9 @@
2
2
  "name": "@fluentui/react-button",
3
3
  "entries": [
4
4
  {
5
- "date": "Thu, 02 Mar 2023 04:26:34 GMT",
6
- "tag": "@fluentui/react-button_v0.0.0-nightly-20230302-0419.1",
7
- "version": "0.0.0-nightly-20230302-0419.1",
5
+ "date": "Mon, 06 Mar 2023 04:33:12 GMT",
6
+ "tag": "@fluentui/react-button_v0.0.0-nightly-20230306-0424.1",
7
+ "version": "0.0.0-nightly-20230306-0424.1",
8
8
  "comments": {
9
9
  "prerelease": [
10
10
  {
@@ -16,38 +16,44 @@
16
16
  {
17
17
  "author": "beachball",
18
18
  "package": "@fluentui/react-button",
19
- "comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightly-20230302-0419.1",
20
- "commit": "d9553f50e6b7a448d4825354c6f585b060c69a7e"
19
+ "comment": "Bump @fluentui/keyboard-keys to v0.0.0-nightly-20230306-0424.1",
20
+ "commit": "21155fb094f73d947066cedf7577d2483dfab473"
21
21
  },
22
22
  {
23
23
  "author": "beachball",
24
24
  "package": "@fluentui/react-button",
25
- "comment": "Bump @fluentui/react-aria to v0.0.0-nightly-20230302-0419.1",
26
- "commit": "d9553f50e6b7a448d4825354c6f585b060c69a7e"
25
+ "comment": "Bump @fluentui/react-aria to v0.0.0-nightly-20230306-0424.1",
26
+ "commit": "21155fb094f73d947066cedf7577d2483dfab473"
27
27
  },
28
28
  {
29
29
  "author": "beachball",
30
30
  "package": "@fluentui/react-button",
31
- "comment": "Bump @fluentui/react-tabster to v0.0.0-nightly-20230302-0419.1",
32
- "commit": "d9553f50e6b7a448d4825354c6f585b060c69a7e"
31
+ "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230306-0424.1",
32
+ "commit": "21155fb094f73d947066cedf7577d2483dfab473"
33
33
  },
34
34
  {
35
35
  "author": "beachball",
36
36
  "package": "@fluentui/react-button",
37
- "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20230302-0419.1",
38
- "commit": "d9553f50e6b7a448d4825354c6f585b060c69a7e"
37
+ "comment": "Bump @fluentui/react-tabster to v0.0.0-nightly-20230306-0424.1",
38
+ "commit": "21155fb094f73d947066cedf7577d2483dfab473"
39
39
  },
40
40
  {
41
41
  "author": "beachball",
42
42
  "package": "@fluentui/react-button",
43
- "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20230302-0419.1",
44
- "commit": "d9553f50e6b7a448d4825354c6f585b060c69a7e"
43
+ "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20230306-0424.1",
44
+ "commit": "21155fb094f73d947066cedf7577d2483dfab473"
45
45
  },
46
46
  {
47
47
  "author": "beachball",
48
48
  "package": "@fluentui/react-button",
49
- "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230302-0419.1",
50
- "commit": "d9553f50e6b7a448d4825354c6f585b060c69a7e"
49
+ "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20230306-0424.1",
50
+ "commit": "21155fb094f73d947066cedf7577d2483dfab473"
51
+ },
52
+ {
53
+ "author": "beachball",
54
+ "package": "@fluentui/react-button",
55
+ "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230306-0424.1",
56
+ "commit": "21155fb094f73d947066cedf7577d2483dfab473"
51
57
  }
52
58
  ]
53
59
  }
package/CHANGELOG.md CHANGED
@@ -1,23 +1,24 @@
1
1
  # Change Log - @fluentui/react-button
2
2
 
3
- This log was last generated on Thu, 02 Mar 2023 04:26:34 GMT and should not be manually modified.
3
+ This log was last generated on Mon, 06 Mar 2023 04:33:12 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
- ## [0.0.0-nightly-20230302-0419.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v0.0.0-nightly-20230302-0419.1)
7
+ ## [0.0.0-nightly-20230306-0424.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v0.0.0-nightly-20230306-0424.1)
8
8
 
9
- Thu, 02 Mar 2023 04:26:34 GMT
10
- [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.2.5..@fluentui/react-button_v0.0.0-nightly-20230302-0419.1)
9
+ Mon, 06 Mar 2023 04:33:12 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.2.5..@fluentui/react-button_v0.0.0-nightly-20230306-0424.1)
11
11
 
12
12
  ### Changes
13
13
 
14
14
  - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
15
- - Bump @fluentui/keyboard-keys to v0.0.0-nightly-20230302-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/d9553f50e6b7a448d4825354c6f585b060c69a7e) by beachball)
16
- - Bump @fluentui/react-aria to v0.0.0-nightly-20230302-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/d9553f50e6b7a448d4825354c6f585b060c69a7e) by beachball)
17
- - Bump @fluentui/react-tabster to v0.0.0-nightly-20230302-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/d9553f50e6b7a448d4825354c6f585b060c69a7e) by beachball)
18
- - Bump @fluentui/react-theme to v0.0.0-nightly-20230302-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/d9553f50e6b7a448d4825354c6f585b060c69a7e) by beachball)
19
- - Bump @fluentui/react-utilities to v0.0.0-nightly-20230302-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/d9553f50e6b7a448d4825354c6f585b060c69a7e) by beachball)
20
- - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230302-0419.1 ([commit](https://github.com/microsoft/fluentui/commit/d9553f50e6b7a448d4825354c6f585b060c69a7e) by beachball)
15
+ - Bump @fluentui/keyboard-keys to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
16
+ - Bump @fluentui/react-aria to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
17
+ - Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
18
+ - Bump @fluentui/react-tabster to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
19
+ - Bump @fluentui/react-theme to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
20
+ - Bump @fluentui/react-utilities to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
21
+ - Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230306-0424.1 ([commit](https://github.com/microsoft/fluentui/commit/21155fb094f73d947066cedf7577d2483dfab473) by beachball)
21
22
 
22
23
  ## [9.2.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.2.5)
23
24
 
package/lib/components/Button/Button.js CHANGED
@@ -2,12 +2,17 @@ import * as React from 'react';
2
2
  import { renderButton_unstable } from './renderButton';
3
3
  import { useButton_unstable } from './useButton';
4
4
  import { useButtonStyles_unstable } from './useButtonStyles';
5
+ import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
5
6
  /**
6
7
  * Buttons give people a way to trigger an action.
7
8
  */
8
9
  export const Button = /*#__PURE__*/React.forwardRef((props, ref) => {
9
10
  const state = useButton_unstable(props, ref);
10
11
  useButtonStyles_unstable(state);
12
+ const {
13
+ useButtonStyles_unstable: useCustomStyles
14
+ } = useCustomStyleHooks_unstable();
15
+ useCustomStyles(state);
11
16
  return renderButton_unstable(state);
12
17
  // Casting is required due to lack of distributive union to support unions on @types/react
13
18
  });
package/lib/components/Button/Button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","renderButton_unstable","useButton_unstable","useButtonStyles_unstable","Button","forwardRef","props","ref","state","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderButton_unstable } from './renderButton';\nimport { useButton_unstable } from './useButton';\nimport { useButtonStyles_unstable } from './useButtonStyles';\nimport type { ButtonProps } from './Button.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Buttons give people a way to trigger an action.\n */\nexport const Button: ForwardRefComponent<ButtonProps> = React.forwardRef((props, ref) => {\n const state = useButton_unstable(props, ref);\n\n useButtonStyles_unstable(state);\n\n return renderButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ButtonProps>;\n\nButton.displayName = 'Button';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,kBAAkB,QAAQ,aAAa;AAChD,SAASC,wBAAwB,QAAQ,mBAAmB;AAI5D;;;AAGA,OAAO,MAAMC,MAAM,gBAAqCJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtF,MAAMC,KAAK,GAAGN,kBAAkB,CAACI,KAAK,EAAEC,GAAG,CAAC;EAE5CJ,wBAAwB,CAACK,KAAK,CAAC;EAE/B,OAAOP,qBAAqB,CAACO,KAAK,CAAC;EACnC;AACF,CAAC,CAAqC;;AAEtCJ,MAAM,CAACK,WAAW,GAAG,QAAQ"}
1
+ {"version":3,"names":["React","renderButton_unstable","useButton_unstable","useButtonStyles_unstable","useCustomStyleHooks_unstable","Button","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderButton_unstable } from './renderButton';\nimport { useButton_unstable } from './useButton';\nimport { useButtonStyles_unstable } from './useButtonStyles';\nimport type { ButtonProps } from './Button.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Buttons give people a way to trigger an action.\n */\nexport const Button: ForwardRefComponent<ButtonProps> = React.forwardRef((props, ref) => {\n const state = useButton_unstable(props, ref);\n\n useButtonStyles_unstable(state);\n\n const { useButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ButtonProps>;\n\nButton.displayName = 'Button';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,kBAAkB,QAAQ,aAAa;AAChD,SAASC,wBAAwB,QAAQ,mBAAmB;AAG5D,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;AAGA,OAAO,MAAMC,MAAM,gBAAqCL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtF,MAAMC,KAAK,GAAGP,kBAAkB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAE5CL,wBAAwB,CAACM,KAAK,CAAC;EAE/B,MAAM;IAAEN,wBAAwB,EAAEO;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EACpFM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOR,qBAAqB,CAACQ,KAAK,CAAC;EACnC;AACF,CAAC,CAAqC;;AAEtCJ,MAAM,CAACM,WAAW,GAAG,QAAQ"}
package/lib/components/CompoundButton/CompoundButton.js CHANGED
@@ -2,12 +2,17 @@ import * as React from 'react';
2
2
  import { renderCompoundButton_unstable } from './renderCompoundButton';
3
3
  import { useCompoundButton_unstable } from './useCompoundButton';
4
4
  import { useCompoundButtonStyles_unstable } from './useCompoundButtonStyles';
5
+ import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
5
6
  /**
6
7
  * CompoundButtons are buttons that can have secondary content that adds extra information to the user.
7
8
  */
8
9
  export const CompoundButton = /*#__PURE__*/React.forwardRef((props, ref) => {
9
10
  const state = useCompoundButton_unstable(props, ref);
10
11
  useCompoundButtonStyles_unstable(state);
12
+ const {
13
+ useCompoundButtonStyles_unstable: useCustomStyles
14
+ } = useCustomStyleHooks_unstable();
15
+ useCustomStyles(state);
11
16
  return renderCompoundButton_unstable(state);
12
17
  // Casting is required due to lack of distributive union to support unions on @types/react
13
18
  });
package/lib/components/CompoundButton/CompoundButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","renderCompoundButton_unstable","useCompoundButton_unstable","useCompoundButtonStyles_unstable","CompoundButton","forwardRef","props","ref","state","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/CompoundButton/CompoundButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderCompoundButton_unstable } from './renderCompoundButton';\nimport { useCompoundButton_unstable } from './useCompoundButton';\nimport { useCompoundButtonStyles_unstable } from './useCompoundButtonStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { CompoundButtonProps } from './CompoundButton.types';\n\n/**\n * CompoundButtons are buttons that can have secondary content that adds extra information to the user.\n */\nexport const CompoundButton: ForwardRefComponent<CompoundButtonProps> = React.forwardRef((props, ref) => {\n const state = useCompoundButton_unstable(props, ref);\n\n useCompoundButtonStyles_unstable(state);\n\n return renderCompoundButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<CompoundButtonProps>;\n\nCompoundButton.displayName = 'CompoundButton';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,gCAAgC,QAAQ,2BAA2B;AAI5E;;;AAGA,OAAO,MAAMC,cAAc,gBAA6CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtG,MAAMC,KAAK,GAAGN,0BAA0B,CAACI,KAAK,EAAEC,GAAG,CAAC;EAEpDJ,gCAAgC,CAACK,KAAK,CAAC;EAEvC,OAAOP,6BAA6B,CAACO,KAAK,CAAC;EAC3C;AACF,CAAC,CAA6C;;AAE9CJ,cAAc,CAACK,WAAW,GAAG,gBAAgB"}
1
+ {"version":3,"names":["React","renderCompoundButton_unstable","useCompoundButton_unstable","useCompoundButtonStyles_unstable","useCustomStyleHooks_unstable","CompoundButton","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/CompoundButton/CompoundButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderCompoundButton_unstable } from './renderCompoundButton';\nimport { useCompoundButton_unstable } from './useCompoundButton';\nimport { useCompoundButtonStyles_unstable } from './useCompoundButtonStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { CompoundButtonProps } from './CompoundButton.types';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * CompoundButtons are buttons that can have secondary content that adds extra information to the user.\n */\nexport const CompoundButton: ForwardRefComponent<CompoundButtonProps> = React.forwardRef((props, ref) => {\n const state = useCompoundButton_unstable(props, ref);\n\n useCompoundButtonStyles_unstable(state);\n\n const { useCompoundButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderCompoundButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<CompoundButtonProps>;\n\nCompoundButton.displayName = 'CompoundButton';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,6BAA6B,QAAQ,wBAAwB;AACtE,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,gCAAgC,QAAQ,2BAA2B;AAG5E,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;AAGA,OAAO,MAAMC,cAAc,gBAA6CL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtG,MAAMC,KAAK,GAAGP,0BAA0B,CAACK,KAAK,EAAEC,GAAG,CAAC;EAEpDL,gCAAgC,CAACM,KAAK,CAAC;EAEvC,MAAM;IAAEN,gCAAgC,EAAEO;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EAC5FM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOR,6BAA6B,CAACQ,KAAK,CAAC;EAC3C;AACF,CAAC,CAA6C;;AAE9CJ,cAAc,CAACM,WAAW,GAAG,gBAAgB"}
package/lib/components/MenuButton/MenuButton.js CHANGED
@@ -2,6 +2,7 @@ import * as React from 'react';
2
2
  import { renderMenuButton_unstable } from './renderMenuButton';
3
3
  import { useMenuButton_unstable } from './useMenuButton';
4
4
  import { useMenuButtonStyles_unstable } from './useMenuButtonStyles';
5
+ import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
5
6
  /**
6
7
  * MenuButtons are buttons that have a chevron icon after the button contents and are usually clicked to open/close
7
8
  * menus.
@@ -9,6 +10,10 @@ import { useMenuButtonStyles_unstable } from './useMenuButtonStyles';
9
10
  export const MenuButton = /*#__PURE__*/React.forwardRef((props, ref) => {
10
11
  const state = useMenuButton_unstable(props, ref);
11
12
  useMenuButtonStyles_unstable(state);
13
+ const {
14
+ useMenuButtonStyles_unstable: useCustomStyles
15
+ } = useCustomStyleHooks_unstable();
16
+ useCustomStyles(state);
12
17
  return renderMenuButton_unstable(state);
13
18
  // Casting is required due to lack of distributive union to support unions on @types/react
14
19
  });
package/lib/components/MenuButton/MenuButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","renderMenuButton_unstable","useMenuButton_unstable","useMenuButtonStyles_unstable","MenuButton","forwardRef","props","ref","state","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/MenuButton/MenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderMenuButton_unstable } from './renderMenuButton';\nimport { useMenuButton_unstable } from './useMenuButton';\nimport { useMenuButtonStyles_unstable } from './useMenuButtonStyles';\nimport type { MenuButtonProps } from './MenuButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * MenuButtons are buttons that have a chevron icon after the button contents and are usually clicked to open/close\n * menus.\n */\nexport const MenuButton: ForwardRefComponent<MenuButtonProps> = React.forwardRef((props, ref) => {\n const state = useMenuButton_unstable(props, ref);\n\n useMenuButtonStyles_unstable(state);\n\n return renderMenuButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<MenuButtonProps>;\n\nMenuButton.displayName = 'MenuButton';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,yBAAyB,QAAQ,oBAAoB;AAC9D,SAASC,sBAAsB,QAAQ,iBAAiB;AACxD,SAASC,4BAA4B,QAAQ,uBAAuB;AAIpE;;;;AAIA,OAAO,MAAMC,UAAU,gBAAyCJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC9F,MAAMC,KAAK,GAAGN,sBAAsB,CAACI,KAAK,EAAEC,GAAG,CAAC;EAEhDJ,4BAA4B,CAACK,KAAK,CAAC;EAEnC,OAAOP,yBAAyB,CAACO,KAAK,CAAC;EACvC;AACF,CAAC,CAAyC;;AAE1CJ,UAAU,CAACK,WAAW,GAAG,YAAY"}
1
+ {"version":3,"names":["React","renderMenuButton_unstable","useMenuButton_unstable","useMenuButtonStyles_unstable","useCustomStyleHooks_unstable","MenuButton","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/MenuButton/MenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderMenuButton_unstable } from './renderMenuButton';\nimport { useMenuButton_unstable } from './useMenuButton';\nimport { useMenuButtonStyles_unstable } from './useMenuButtonStyles';\nimport type { MenuButtonProps } from './MenuButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * MenuButtons are buttons that have a chevron icon after the button contents and are usually clicked to open/close\n * menus.\n */\nexport const MenuButton: ForwardRefComponent<MenuButtonProps> = React.forwardRef((props, ref) => {\n const state = useMenuButton_unstable(props, ref);\n\n useMenuButtonStyles_unstable(state);\n\n const { useMenuButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderMenuButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<MenuButtonProps>;\n\nMenuButton.displayName = 'MenuButton';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,yBAAyB,QAAQ,oBAAoB;AAC9D,SAASC,sBAAsB,QAAQ,iBAAiB;AACxD,SAASC,4BAA4B,QAAQ,uBAAuB;AAGpE,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;;AAIA,OAAO,MAAMC,UAAU,gBAAyCL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC9F,MAAMC,KAAK,GAAGP,sBAAsB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAEhDL,4BAA4B,CAACM,KAAK,CAAC;EAEnC,MAAM;IAAEN,4BAA4B,EAAEO;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EACxFM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOR,yBAAyB,CAACQ,KAAK,CAAC;EACvC;AACF,CAAC,CAAyC;;AAE1CJ,UAAU,CAACM,WAAW,GAAG,YAAY"}
package/lib/components/SplitButton/SplitButton.js CHANGED
@@ -2,6 +2,7 @@ import * as React from 'react';
2
2
  import { renderSplitButton_unstable } from './renderSplitButton';
3
3
  import { useSplitButton_unstable } from './useSplitButton';
4
4
  import { useSplitButtonStyles_unstable } from './useSplitButtonStyles';
5
+ import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
5
6
  /**
6
7
  * SplitButtons are a grouping of two interactive surfaces where interacting with the first one triggers a primary
7
8
  * action, while interacting with the second one opens a menu with secondary actions.
@@ -9,6 +10,10 @@ import { useSplitButtonStyles_unstable } from './useSplitButtonStyles';
9
10
  export const SplitButton = /*#__PURE__*/React.forwardRef((props, ref) => {
10
11
  const state = useSplitButton_unstable(props, ref);
11
12
  useSplitButtonStyles_unstable(state);
13
+ const {
14
+ useSplitButtonStyles_unstable: useCustomStyles
15
+ } = useCustomStyleHooks_unstable();
16
+ useCustomStyles(state);
12
17
  return renderSplitButton_unstable(state);
13
18
  // Casting is required due to lack of distributive union to support unions on @types/react
14
19
  });
package/lib/components/SplitButton/SplitButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","renderSplitButton_unstable","useSplitButton_unstable","useSplitButtonStyles_unstable","SplitButton","forwardRef","props","ref","state","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderSplitButton_unstable } from './renderSplitButton';\nimport { useSplitButton_unstable } from './useSplitButton';\nimport { useSplitButtonStyles_unstable } from './useSplitButtonStyles';\nimport type { SplitButtonProps } from './SplitButton.types';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * SplitButtons are a grouping of two interactive surfaces where interacting with the first one triggers a primary\n * action, while interacting with the second one opens a menu with secondary actions.\n */\nexport const SplitButton: ForwardRefComponent<SplitButtonProps> = React.forwardRef((props, ref) => {\n const state = useSplitButton_unstable(props, ref);\n\n useSplitButtonStyles_unstable(state);\n\n return renderSplitButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<SplitButtonProps>;\n\nSplitButton.displayName = 'SplitButton';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,6BAA6B,QAAQ,wBAAwB;AAItE;;;;AAIA,OAAO,MAAMC,WAAW,gBAA0CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGN,uBAAuB,CAACI,KAAK,EAAEC,GAAG,CAAC;EAEjDJ,6BAA6B,CAACK,KAAK,CAAC;EAEpC,OAAOP,0BAA0B,CAACO,KAAK,CAAC;EACxC;AACF,CAAC,CAA0C;;AAE3CJ,WAAW,CAACK,WAAW,GAAG,aAAa"}
1
+ {"version":3,"names":["React","renderSplitButton_unstable","useSplitButton_unstable","useSplitButtonStyles_unstable","useCustomStyleHooks_unstable","SplitButton","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderSplitButton_unstable } from './renderSplitButton';\nimport { useSplitButton_unstable } from './useSplitButton';\nimport { useSplitButtonStyles_unstable } from './useSplitButtonStyles';\nimport type { SplitButtonProps } from './SplitButton.types';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * SplitButtons are a grouping of two interactive surfaces where interacting with the first one triggers a primary\n * action, while interacting with the second one opens a menu with secondary actions.\n */\nexport const SplitButton: ForwardRefComponent<SplitButtonProps> = React.forwardRef((props, ref) => {\n const state = useSplitButton_unstable(props, ref);\n\n useSplitButtonStyles_unstable(state);\n\n const { useSplitButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderSplitButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<SplitButtonProps>;\n\nSplitButton.displayName = 'SplitButton';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,0BAA0B,QAAQ,qBAAqB;AAChE,SAASC,uBAAuB,QAAQ,kBAAkB;AAC1D,SAASC,6BAA6B,QAAQ,wBAAwB;AAGtE,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;;AAIA,OAAO,MAAMC,WAAW,gBAA0CL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGP,uBAAuB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAEjDL,6BAA6B,CAACM,KAAK,CAAC;EAEpC,MAAM;IAAEN,6BAA6B,EAAEO;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EACzFM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOR,0BAA0B,CAACQ,KAAK,CAAC;EACxC;AACF,CAAC,CAA0C;;AAE3CJ,WAAW,CAACM,WAAW,GAAG,aAAa"}
package/lib/components/ToggleButton/ToggleButton.js CHANGED
@@ -2,12 +2,17 @@ import * as React from 'react';
2
2
  import { renderToggleButton_unstable } from './renderToggleButton';
3
3
  import { useToggleButton_unstable } from './useToggleButton';
4
4
  import { useToggleButtonStyles_unstable } from './useToggleButtonStyles';
5
+ import { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';
5
6
  /**
6
7
  * ToggleButtons are buttons that toggle between two defined states when triggered.
7
8
  */
8
9
  export const ToggleButton = /*#__PURE__*/React.forwardRef((props, ref) => {
9
10
  const state = useToggleButton_unstable(props, ref);
10
11
  useToggleButtonStyles_unstable(state);
12
+ const {
13
+ useToggleButtonStyles_unstable: useCustomStyles
14
+ } = useCustomStyleHooks_unstable();
15
+ useCustomStyles(state);
11
16
  return renderToggleButton_unstable(state);
12
17
  // Casting is required due to lack of distributive union to support unions on @types/react
13
18
  });
package/lib/components/ToggleButton/ToggleButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","renderToggleButton_unstable","useToggleButton_unstable","useToggleButtonStyles_unstable","ToggleButton","forwardRef","props","ref","state","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderToggleButton_unstable } from './renderToggleButton';\nimport { useToggleButton_unstable } from './useToggleButton';\nimport { useToggleButtonStyles_unstable } from './useToggleButtonStyles';\nimport type { ToggleButtonProps } from './ToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * ToggleButtons are buttons that toggle between two defined states when triggered.\n */\nexport const ToggleButton: ForwardRefComponent<ToggleButtonProps> = React.forwardRef((props, ref) => {\n const state = useToggleButton_unstable(props, ref);\n\n useToggleButtonStyles_unstable(state);\n\n return renderToggleButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToggleButtonProps>;\n\nToggleButton.displayName = 'ToggleButton';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,2BAA2B,QAAQ,sBAAsB;AAClE,SAASC,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,8BAA8B,QAAQ,yBAAyB;AAIxE;;;AAGA,OAAO,MAAMC,YAAY,gBAA2CJ,KAAK,CAACK,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAClG,MAAMC,KAAK,GAAGN,wBAAwB,CAACI,KAAK,EAAEC,GAAG,CAAC;EAElDJ,8BAA8B,CAACK,KAAK,CAAC;EAErC,OAAOP,2BAA2B,CAACO,KAAK,CAAC;EACzC;AACF,CAAC,CAA2C;;AAE5CJ,YAAY,CAACK,WAAW,GAAG,cAAc"}
1
+ {"version":3,"names":["React","renderToggleButton_unstable","useToggleButton_unstable","useToggleButtonStyles_unstable","useCustomStyleHooks_unstable","ToggleButton","forwardRef","props","ref","state","useCustomStyles","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderToggleButton_unstable } from './renderToggleButton';\nimport { useToggleButton_unstable } from './useToggleButton';\nimport { useToggleButtonStyles_unstable } from './useToggleButtonStyles';\nimport type { ToggleButtonProps } from './ToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToggleButtons are buttons that toggle between two defined states when triggered.\n */\nexport const ToggleButton: ForwardRefComponent<ToggleButtonProps> = React.forwardRef((props, ref) => {\n const state = useToggleButton_unstable(props, ref);\n\n useToggleButtonStyles_unstable(state);\n\n const { useToggleButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderToggleButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToggleButtonProps>;\n\nToggleButton.displayName = 'ToggleButton';\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,2BAA2B,QAAQ,sBAAsB;AAClE,SAASC,wBAAwB,QAAQ,mBAAmB;AAC5D,SAASC,8BAA8B,QAAQ,yBAAyB;AAGxE,SAASC,4BAA4B,QAAQ,iCAAiC;AAE9E;;;AAGA,OAAO,MAAMC,YAAY,gBAA2CL,KAAK,CAACM,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAClG,MAAMC,KAAK,GAAGP,wBAAwB,CAACK,KAAK,EAAEC,GAAG,CAAC;EAElDL,8BAA8B,CAACM,KAAK,CAAC;EAErC,MAAM;IAAEN,8BAA8B,EAAEO;EAAe,CAAE,GAAGN,4BAA4B,EAAE;EAC1FM,eAAe,CAACD,KAAK,CAAC;EAEtB,OAAOR,2BAA2B,CAACQ,KAAK,CAAC;EACzC;AACF,CAAC,CAA2C;;AAE5CJ,YAAY,CAACM,WAAW,GAAG,cAAc"}
package/lib/utils/useToggleState.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","mergeCallbacks","useControllableState","useEventCallback","useToggleState","props","state","checked","defaultChecked","disabled","disabledFocusable","onClick","role","root","checkedValue","setCheckedValue","defaultState","initialState","isCheckboxTypeRole","onToggleClick","useCallback","ev","defaultPrevented"],"sources":["../../../../../../../../packages/react-components/react-button/src/utils/useToggleState.ts"],"sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport type { ButtonState } from '../Button';\nimport type { ToggleButtonProps, ToggleButtonState } from '../ToggleButton';\n\nexport function useToggleState<\n TToggleButtonProps extends Pick<ToggleButtonProps, 'checked' | 'defaultChecked' | 'disabled' | 'disabledFocusable'>,\n TButtonState extends Pick<ButtonState, 'root'>,\n TToggleButtonState extends Pick<ToggleButtonState, 'checked' | 'root'>\n>(props: TToggleButtonProps, state: TButtonState): TToggleButtonState {\n const { checked, defaultChecked, disabled, disabledFocusable } = props;\n const { onClick, role } = state.root;\n\n const [checkedValue, setCheckedValue] = useControllableState({\n state: checked,\n defaultState: defaultChecked,\n initialState: false,\n });\n\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n const onToggleClick = React.useCallback(\n ev => {\n if (!disabled && !disabledFocusable) {\n if (ev.defaultPrevented) {\n return;\n }\n\n setCheckedValue(!checkedValue);\n }\n },\n [checkedValue, disabled, disabledFocusable, setCheckedValue],\n );\n\n return {\n ...state,\n\n checked: checkedValue,\n\n root: {\n ...state.root,\n [isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed']: checkedValue,\n onClick: useEventCallback(\n mergeCallbacks(onClick as React.MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>, onToggleClick),\n ),\n },\n } as TToggleButtonState;\n}\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,cAAc,EAAEC,oBAAoB,EAAEC,gBAAgB,QAAQ,2BAA2B;AAIlG,OAAM,SAAUC,cAAcA,CAI5BC,KAAyB,EAAEC,KAAmB;EAC9C,MAAM;IAAEC,OAAO;IAAEC,cAAc;IAAEC,QAAQ;IAAEC;EAAiB,CAAE,GAAGL,KAAK;EACtE,MAAM;IAAEM,OAAO;IAAEC;EAAI,CAAE,GAAGN,KAAK,CAACO,IAAI;EAEpC,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGb,oBAAoB,CAAC;IAC3DI,KAAK,EAAEC,OAAO;IACdS,YAAY,EAAER,cAAc;IAC5BS,YAAY,EAAE;GACf,CAAC;EAEF,MAAMC,kBAAkB,GAAGN,IAAI,KAAK,kBAAkB,IAAIA,IAAI,KAAK,UAAU;EAE7E,MAAMO,aAAa,GAAGnB,KAAK,CAACoB,WAAW,CACrCC,EAAE,IAAG;IACH,IAAI,CAACZ,QAAQ,IAAI,CAACC,iBAAiB,EAAE;MACnC,IAAIW,EAAE,CAACC,gBAAgB,EAAE;QACvB;;MAGFP,eAAe,CAAC,CAACD,YAAY,CAAC;;EAElC,CAAC,EACD,CAACA,YAAY,EAAEL,QAAQ,EAAEC,iBAAiB,EAAEK,eAAe,CAAC,CAC7D;EAED,OAAO;IACL,GAAGT,KAAK;IAERC,OAAO,EAAEO,YAAY;IAErBD,IAAI,EAAE;MACJ,GAAGP,KAAK,CAACO,IAAI;MACb,CAACK,kBAAkB,GAAG,cAAc,GAAG,cAAc,GAAGJ,YAAY;MACpEH,OAAO,EAAER,gBAAgB,CACvBF,cAAc,CAACU,OAAyE,EAAEQ,aAAa,CAAC;;GAGvF;AACzB"}
1
+ {"version":3,"names":["React","mergeCallbacks","useControllableState","useEventCallback","useToggleState","props","state","checked","defaultChecked","disabled","disabledFocusable","onClick","role","root","checkedValue","setCheckedValue","defaultState","initialState","isCheckboxTypeRole","onToggleClick","useCallback","ev","defaultPrevented"],"sources":["../../../../../../../../packages/react-components/react-button/src/utils/useToggleState.ts"],"sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport type { ButtonState } from '../Button';\nimport type { ToggleButtonProps, ToggleButtonState } from '../ToggleButton';\n\nexport function useToggleState<\n TToggleButtonProps extends Pick<ToggleButtonProps, 'checked' | 'defaultChecked' | 'disabled' | 'disabledFocusable'>,\n TButtonState extends Pick<ButtonState, 'root'>,\n TToggleButtonState extends Pick<ToggleButtonState, 'checked' | 'root'>,\n>(props: TToggleButtonProps, state: TButtonState): TToggleButtonState {\n const { checked, defaultChecked, disabled, disabledFocusable } = props;\n const { onClick, role } = state.root;\n\n const [checkedValue, setCheckedValue] = useControllableState({\n state: checked,\n defaultState: defaultChecked,\n initialState: false,\n });\n\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n const onToggleClick = React.useCallback(\n ev => {\n if (!disabled && !disabledFocusable) {\n if (ev.defaultPrevented) {\n return;\n }\n\n setCheckedValue(!checkedValue);\n }\n },\n [checkedValue, disabled, disabledFocusable, setCheckedValue],\n );\n\n return {\n ...state,\n\n checked: checkedValue,\n\n root: {\n ...state.root,\n [isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed']: checkedValue,\n onClick: useEventCallback(\n mergeCallbacks(onClick as React.MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>, onToggleClick),\n ),\n },\n } as TToggleButtonState;\n}\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,cAAc,EAAEC,oBAAoB,EAAEC,gBAAgB,QAAQ,2BAA2B;AAIlG,OAAM,SAAUC,cAAcA,CAI5BC,KAAyB,EAAEC,KAAmB;EAC9C,MAAM;IAAEC,OAAO;IAAEC,cAAc;IAAEC,QAAQ;IAAEC;EAAiB,CAAE,GAAGL,KAAK;EACtE,MAAM;IAAEM,OAAO;IAAEC;EAAI,CAAE,GAAGN,KAAK,CAACO,IAAI;EAEpC,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGb,oBAAoB,CAAC;IAC3DI,KAAK,EAAEC,OAAO;IACdS,YAAY,EAAER,cAAc;IAC5BS,YAAY,EAAE;GACf,CAAC;EAEF,MAAMC,kBAAkB,GAAGN,IAAI,KAAK,kBAAkB,IAAIA,IAAI,KAAK,UAAU;EAE7E,MAAMO,aAAa,GAAGnB,KAAK,CAACoB,WAAW,CACrCC,EAAE,IAAG;IACH,IAAI,CAACZ,QAAQ,IAAI,CAACC,iBAAiB,EAAE;MACnC,IAAIW,EAAE,CAACC,gBAAgB,EAAE;QACvB;;MAGFP,eAAe,CAAC,CAACD,YAAY,CAAC;;EAElC,CAAC,EACD,CAACA,YAAY,EAAEL,QAAQ,EAAEC,iBAAiB,EAAEK,eAAe,CAAC,CAC7D;EAED,OAAO;IACL,GAAGT,KAAK;IAERC,OAAO,EAAEO,YAAY;IAErBD,IAAI,EAAE;MACJ,GAAGP,KAAK,CAACO,IAAI;MACb,CAACK,kBAAkB,GAAG,cAAc,GAAG,cAAc,GAAGJ,YAAY;MACpEH,OAAO,EAAER,gBAAgB,CACvBF,cAAc,CAACU,OAAyE,EAAEQ,aAAa,CAAC;;GAGvF;AACzB"}
package/lib-commonjs/components/Button/Button.js CHANGED
@@ -8,12 +8,17 @@ const React = /*#__PURE__*/require("react");
8
8
  const renderButton_1 = /*#__PURE__*/require("./renderButton");
9
9
  const useButton_1 = /*#__PURE__*/require("./useButton");
10
10
  const useButtonStyles_1 = /*#__PURE__*/require("./useButtonStyles");
11
+ const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
11
12
  /**
12
13
  * Buttons give people a way to trigger an action.
13
14
  */
14
15
  exports.Button = /*#__PURE__*/React.forwardRef((props, ref) => {
15
16
  const state = useButton_1.useButton_unstable(props, ref);
16
17
  useButtonStyles_1.useButtonStyles_unstable(state);
18
+ const {
19
+ useButtonStyles_unstable: useCustomStyles
20
+ } = react_shared_contexts_1.useCustomStyleHooks_unstable();
21
+ useCustomStyles(state);
17
22
  return renderButton_1.renderButton_unstable(state);
18
23
  // Casting is required due to lack of distributive union to support unions on @types/react
19
24
  });
package/lib-commonjs/components/Button/Button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","renderButton_1","useButton_1","useButtonStyles_1","exports","Button","forwardRef","props","ref","state","useButton_unstable","useButtonStyles_unstable","renderButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderButton_unstable } from './renderButton';\nimport { useButton_unstable } from './useButton';\nimport { useButtonStyles_unstable } from './useButtonStyles';\nimport type { ButtonProps } from './Button.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * Buttons give people a way to trigger an action.\n */\nexport const Button: ForwardRefComponent<ButtonProps> = React.forwardRef((props, ref) => {\n const state = useButton_unstable(props, ref);\n\n useButtonStyles_unstable(state);\n\n return renderButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ButtonProps>;\n\nButton.displayName = 'Button';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,cAAA,gBAAAD,OAAA;AACA,MAAAE,WAAA,gBAAAF,OAAA;AACA,MAAAG,iBAAA,gBAAAH,OAAA;AAIA;;;AAGaI,OAAA,CAAAC,MAAM,gBAAqCN,KAAK,CAACO,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtF,MAAMC,KAAK,GAAGP,WAAA,CAAAQ,kBAAkB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAE5CL,iBAAA,CAAAQ,wBAAwB,CAACF,KAAK,CAAC;EAE/B,OAAOR,cAAA,CAAAW,qBAAqB,CAACH,KAAK,CAAC;EACnC;AACF,CAAC,CAAqC;;AAEtCL,OAAA,CAAAC,MAAM,CAACQ,WAAW,GAAG,QAAQ"}
1
+ {"version":3,"names":["React","require","renderButton_1","useButton_1","useButtonStyles_1","react_shared_contexts_1","exports","Button","forwardRef","props","ref","state","useButton_unstable","useButtonStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderButton_unstable } from './renderButton';\nimport { useButton_unstable } from './useButton';\nimport { useButtonStyles_unstable } from './useButtonStyles';\nimport type { ButtonProps } from './Button.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Buttons give people a way to trigger an action.\n */\nexport const Button: ForwardRefComponent<ButtonProps> = React.forwardRef((props, ref) => {\n const state = useButton_unstable(props, ref);\n\n useButtonStyles_unstable(state);\n\n const { useButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ButtonProps>;\n\nButton.displayName = 'Button';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,cAAA,gBAAAD,OAAA;AACA,MAAAE,WAAA,gBAAAF,OAAA;AACA,MAAAG,iBAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;AAGaK,OAAA,CAAAC,MAAM,gBAAqCP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtF,MAAMC,KAAK,GAAGR,WAAA,CAAAS,kBAAkB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAE5CN,iBAAA,CAAAS,wBAAwB,CAACF,KAAK,CAAC;EAE/B,MAAM;IAAEE,wBAAwB,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EACpFD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOT,cAAA,CAAAc,qBAAqB,CAACL,KAAK,CAAC;EACnC;AACF,CAAC,CAAqC;;AAEtCL,OAAA,CAAAC,MAAM,CAACU,WAAW,GAAG,QAAQ"}
package/lib-commonjs/components/CompoundButton/CompoundButton.js CHANGED
@@ -8,12 +8,17 @@ const React = /*#__PURE__*/require("react");
8
8
  const renderCompoundButton_1 = /*#__PURE__*/require("./renderCompoundButton");
9
9
  const useCompoundButton_1 = /*#__PURE__*/require("./useCompoundButton");
10
10
  const useCompoundButtonStyles_1 = /*#__PURE__*/require("./useCompoundButtonStyles");
11
+ const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
11
12
  /**
12
13
  * CompoundButtons are buttons that can have secondary content that adds extra information to the user.
13
14
  */
14
15
  exports.CompoundButton = /*#__PURE__*/React.forwardRef((props, ref) => {
15
16
  const state = useCompoundButton_1.useCompoundButton_unstable(props, ref);
16
17
  useCompoundButtonStyles_1.useCompoundButtonStyles_unstable(state);
18
+ const {
19
+ useCompoundButtonStyles_unstable: useCustomStyles
20
+ } = react_shared_contexts_1.useCustomStyleHooks_unstable();
21
+ useCustomStyles(state);
17
22
  return renderCompoundButton_1.renderCompoundButton_unstable(state);
18
23
  // Casting is required due to lack of distributive union to support unions on @types/react
19
24
  });
package/lib-commonjs/components/CompoundButton/CompoundButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","renderCompoundButton_1","useCompoundButton_1","useCompoundButtonStyles_1","exports","CompoundButton","forwardRef","props","ref","state","useCompoundButton_unstable","useCompoundButtonStyles_unstable","renderCompoundButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/CompoundButton/CompoundButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderCompoundButton_unstable } from './renderCompoundButton';\nimport { useCompoundButton_unstable } from './useCompoundButton';\nimport { useCompoundButtonStyles_unstable } from './useCompoundButtonStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { CompoundButtonProps } from './CompoundButton.types';\n\n/**\n * CompoundButtons are buttons that can have secondary content that adds extra information to the user.\n */\nexport const CompoundButton: ForwardRefComponent<CompoundButtonProps> = React.forwardRef((props, ref) => {\n const state = useCompoundButton_unstable(props, ref);\n\n useCompoundButtonStyles_unstable(state);\n\n return renderCompoundButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<CompoundButtonProps>;\n\nCompoundButton.displayName = 'CompoundButton';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,sBAAA,gBAAAD,OAAA;AACA,MAAAE,mBAAA,gBAAAF,OAAA;AACA,MAAAG,yBAAA,gBAAAH,OAAA;AAIA;;;AAGaI,OAAA,CAAAC,cAAc,gBAA6CN,KAAK,CAACO,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtG,MAAMC,KAAK,GAAGP,mBAAA,CAAAQ,0BAA0B,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEpDL,yBAAA,CAAAQ,gCAAgC,CAACF,KAAK,CAAC;EAEvC,OAAOR,sBAAA,CAAAW,6BAA6B,CAACH,KAAK,CAAC;EAC3C;AACF,CAAC,CAA6C;;AAE9CL,OAAA,CAAAC,cAAc,CAACQ,WAAW,GAAG,gBAAgB"}
1
+ {"version":3,"names":["React","require","renderCompoundButton_1","useCompoundButton_1","useCompoundButtonStyles_1","react_shared_contexts_1","exports","CompoundButton","forwardRef","props","ref","state","useCompoundButton_unstable","useCompoundButtonStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderCompoundButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/CompoundButton/CompoundButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderCompoundButton_unstable } from './renderCompoundButton';\nimport { useCompoundButton_unstable } from './useCompoundButton';\nimport { useCompoundButtonStyles_unstable } from './useCompoundButtonStyles';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport type { CompoundButtonProps } from './CompoundButton.types';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * CompoundButtons are buttons that can have secondary content that adds extra information to the user.\n */\nexport const CompoundButton: ForwardRefComponent<CompoundButtonProps> = React.forwardRef((props, ref) => {\n const state = useCompoundButton_unstable(props, ref);\n\n useCompoundButtonStyles_unstable(state);\n\n const { useCompoundButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderCompoundButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<CompoundButtonProps>;\n\nCompoundButton.displayName = 'CompoundButton';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,sBAAA,gBAAAD,OAAA;AACA,MAAAE,mBAAA,gBAAAF,OAAA;AACA,MAAAG,yBAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;AAGaK,OAAA,CAAAC,cAAc,gBAA6CP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EACtG,MAAMC,KAAK,GAAGR,mBAAA,CAAAS,0BAA0B,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEpDN,yBAAA,CAAAS,gCAAgC,CAACF,KAAK,CAAC;EAEvC,MAAM;IAAEE,gCAAgC,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EAC5FD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOT,sBAAA,CAAAc,6BAA6B,CAACL,KAAK,CAAC;EAC3C;AACF,CAAC,CAA6C;;AAE9CL,OAAA,CAAAC,cAAc,CAACU,WAAW,GAAG,gBAAgB"}
package/lib-commonjs/components/MenuButton/MenuButton.js CHANGED
@@ -8,6 +8,7 @@ const React = /*#__PURE__*/require("react");
8
8
  const renderMenuButton_1 = /*#__PURE__*/require("./renderMenuButton");
9
9
  const useMenuButton_1 = /*#__PURE__*/require("./useMenuButton");
10
10
  const useMenuButtonStyles_1 = /*#__PURE__*/require("./useMenuButtonStyles");
11
+ const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
11
12
  /**
12
13
  * MenuButtons are buttons that have a chevron icon after the button contents and are usually clicked to open/close
13
14
  * menus.
@@ -15,6 +16,10 @@ const useMenuButtonStyles_1 = /*#__PURE__*/require("./useMenuButtonStyles");
15
16
  exports.MenuButton = /*#__PURE__*/React.forwardRef((props, ref) => {
16
17
  const state = useMenuButton_1.useMenuButton_unstable(props, ref);
17
18
  useMenuButtonStyles_1.useMenuButtonStyles_unstable(state);
19
+ const {
20
+ useMenuButtonStyles_unstable: useCustomStyles
21
+ } = react_shared_contexts_1.useCustomStyleHooks_unstable();
22
+ useCustomStyles(state);
18
23
  return renderMenuButton_1.renderMenuButton_unstable(state);
19
24
  // Casting is required due to lack of distributive union to support unions on @types/react
20
25
  });
package/lib-commonjs/components/MenuButton/MenuButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","renderMenuButton_1","useMenuButton_1","useMenuButtonStyles_1","exports","MenuButton","forwardRef","props","ref","state","useMenuButton_unstable","useMenuButtonStyles_unstable","renderMenuButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/MenuButton/MenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderMenuButton_unstable } from './renderMenuButton';\nimport { useMenuButton_unstable } from './useMenuButton';\nimport { useMenuButtonStyles_unstable } from './useMenuButtonStyles';\nimport type { MenuButtonProps } from './MenuButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * MenuButtons are buttons that have a chevron icon after the button contents and are usually clicked to open/close\n * menus.\n */\nexport const MenuButton: ForwardRefComponent<MenuButtonProps> = React.forwardRef((props, ref) => {\n const state = useMenuButton_unstable(props, ref);\n\n useMenuButtonStyles_unstable(state);\n\n return renderMenuButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<MenuButtonProps>;\n\nMenuButton.displayName = 'MenuButton';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,kBAAA,gBAAAD,OAAA;AACA,MAAAE,eAAA,gBAAAF,OAAA;AACA,MAAAG,qBAAA,gBAAAH,OAAA;AAIA;;;;AAIaI,OAAA,CAAAC,UAAU,gBAAyCN,KAAK,CAACO,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC9F,MAAMC,KAAK,GAAGP,eAAA,CAAAQ,sBAAsB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEhDL,qBAAA,CAAAQ,4BAA4B,CAACF,KAAK,CAAC;EAEnC,OAAOR,kBAAA,CAAAW,yBAAyB,CAACH,KAAK,CAAC;EACvC;AACF,CAAC,CAAyC;;AAE1CL,OAAA,CAAAC,UAAU,CAACQ,WAAW,GAAG,YAAY"}
1
+ {"version":3,"names":["React","require","renderMenuButton_1","useMenuButton_1","useMenuButtonStyles_1","react_shared_contexts_1","exports","MenuButton","forwardRef","props","ref","state","useMenuButton_unstable","useMenuButtonStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderMenuButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/MenuButton/MenuButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderMenuButton_unstable } from './renderMenuButton';\nimport { useMenuButton_unstable } from './useMenuButton';\nimport { useMenuButtonStyles_unstable } from './useMenuButtonStyles';\nimport type { MenuButtonProps } from './MenuButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * MenuButtons are buttons that have a chevron icon after the button contents and are usually clicked to open/close\n * menus.\n */\nexport const MenuButton: ForwardRefComponent<MenuButtonProps> = React.forwardRef((props, ref) => {\n const state = useMenuButton_unstable(props, ref);\n\n useMenuButtonStyles_unstable(state);\n\n const { useMenuButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderMenuButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<MenuButtonProps>;\n\nMenuButton.displayName = 'MenuButton';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,kBAAA,gBAAAD,OAAA;AACA,MAAAE,eAAA,gBAAAF,OAAA;AACA,MAAAG,qBAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;;AAIaK,OAAA,CAAAC,UAAU,gBAAyCP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAC9F,MAAMC,KAAK,GAAGR,eAAA,CAAAS,sBAAsB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEhDN,qBAAA,CAAAS,4BAA4B,CAACF,KAAK,CAAC;EAEnC,MAAM;IAAEE,4BAA4B,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EACxFD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOT,kBAAA,CAAAc,yBAAyB,CAACL,KAAK,CAAC;EACvC;AACF,CAAC,CAAyC;;AAE1CL,OAAA,CAAAC,UAAU,CAACU,WAAW,GAAG,YAAY"}
package/lib-commonjs/components/SplitButton/SplitButton.js CHANGED
@@ -8,6 +8,7 @@ const React = /*#__PURE__*/require("react");
8
8
  const renderSplitButton_1 = /*#__PURE__*/require("./renderSplitButton");
9
9
  const useSplitButton_1 = /*#__PURE__*/require("./useSplitButton");
10
10
  const useSplitButtonStyles_1 = /*#__PURE__*/require("./useSplitButtonStyles");
11
+ const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
11
12
  /**
12
13
  * SplitButtons are a grouping of two interactive surfaces where interacting with the first one triggers a primary
13
14
  * action, while interacting with the second one opens a menu with secondary actions.
@@ -15,6 +16,10 @@ const useSplitButtonStyles_1 = /*#__PURE__*/require("./useSplitButtonStyles");
15
16
  exports.SplitButton = /*#__PURE__*/React.forwardRef((props, ref) => {
16
17
  const state = useSplitButton_1.useSplitButton_unstable(props, ref);
17
18
  useSplitButtonStyles_1.useSplitButtonStyles_unstable(state);
19
+ const {
20
+ useSplitButtonStyles_unstable: useCustomStyles
21
+ } = react_shared_contexts_1.useCustomStyleHooks_unstable();
22
+ useCustomStyles(state);
18
23
  return renderSplitButton_1.renderSplitButton_unstable(state);
19
24
  // Casting is required due to lack of distributive union to support unions on @types/react
20
25
  });
package/lib-commonjs/components/SplitButton/SplitButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","renderSplitButton_1","useSplitButton_1","useSplitButtonStyles_1","exports","SplitButton","forwardRef","props","ref","state","useSplitButton_unstable","useSplitButtonStyles_unstable","renderSplitButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderSplitButton_unstable } from './renderSplitButton';\nimport { useSplitButton_unstable } from './useSplitButton';\nimport { useSplitButtonStyles_unstable } from './useSplitButtonStyles';\nimport type { SplitButtonProps } from './SplitButton.types';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * SplitButtons are a grouping of two interactive surfaces where interacting with the first one triggers a primary\n * action, while interacting with the second one opens a menu with secondary actions.\n */\nexport const SplitButton: ForwardRefComponent<SplitButtonProps> = React.forwardRef((props, ref) => {\n const state = useSplitButton_unstable(props, ref);\n\n useSplitButtonStyles_unstable(state);\n\n return renderSplitButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<SplitButtonProps>;\n\nSplitButton.displayName = 'SplitButton';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,mBAAA,gBAAAD,OAAA;AACA,MAAAE,gBAAA,gBAAAF,OAAA;AACA,MAAAG,sBAAA,gBAAAH,OAAA;AAIA;;;;AAIaI,OAAA,CAAAC,WAAW,gBAA0CN,KAAK,CAACO,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGP,gBAAA,CAAAQ,uBAAuB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEjDL,sBAAA,CAAAQ,6BAA6B,CAACF,KAAK,CAAC;EAEpC,OAAOR,mBAAA,CAAAW,0BAA0B,CAACH,KAAK,CAAC;EACxC;AACF,CAAC,CAA0C;;AAE3CL,OAAA,CAAAC,WAAW,CAACQ,WAAW,GAAG,aAAa"}
1
+ {"version":3,"names":["React","require","renderSplitButton_1","useSplitButton_1","useSplitButtonStyles_1","react_shared_contexts_1","exports","SplitButton","forwardRef","props","ref","state","useSplitButton_unstable","useSplitButtonStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderSplitButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderSplitButton_unstable } from './renderSplitButton';\nimport { useSplitButton_unstable } from './useSplitButton';\nimport { useSplitButtonStyles_unstable } from './useSplitButtonStyles';\nimport type { SplitButtonProps } from './SplitButton.types';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * SplitButtons are a grouping of two interactive surfaces where interacting with the first one triggers a primary\n * action, while interacting with the second one opens a menu with secondary actions.\n */\nexport const SplitButton: ForwardRefComponent<SplitButtonProps> = React.forwardRef((props, ref) => {\n const state = useSplitButton_unstable(props, ref);\n\n useSplitButtonStyles_unstable(state);\n\n const { useSplitButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderSplitButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<SplitButtonProps>;\n\nSplitButton.displayName = 'SplitButton';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,mBAAA,gBAAAD,OAAA;AACA,MAAAE,gBAAA,gBAAAF,OAAA;AACA,MAAAG,sBAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;;AAIaK,OAAA,CAAAC,WAAW,gBAA0CP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAChG,MAAMC,KAAK,GAAGR,gBAAA,CAAAS,uBAAuB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAEjDN,sBAAA,CAAAS,6BAA6B,CAACF,KAAK,CAAC;EAEpC,MAAM;IAAEE,6BAA6B,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EACzFD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOT,mBAAA,CAAAc,0BAA0B,CAACL,KAAK,CAAC;EACxC;AACF,CAAC,CAA0C;;AAE3CL,OAAA,CAAAC,WAAW,CAACU,WAAW,GAAG,aAAa"}
package/lib-commonjs/components/ToggleButton/ToggleButton.js CHANGED
@@ -8,12 +8,17 @@ const React = /*#__PURE__*/require("react");
8
8
  const renderToggleButton_1 = /*#__PURE__*/require("./renderToggleButton");
9
9
  const useToggleButton_1 = /*#__PURE__*/require("./useToggleButton");
10
10
  const useToggleButtonStyles_1 = /*#__PURE__*/require("./useToggleButtonStyles");
11
+ const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
11
12
  /**
12
13
  * ToggleButtons are buttons that toggle between two defined states when triggered.
13
14
  */
14
15
  exports.ToggleButton = /*#__PURE__*/React.forwardRef((props, ref) => {
15
16
  const state = useToggleButton_1.useToggleButton_unstable(props, ref);
16
17
  useToggleButtonStyles_1.useToggleButtonStyles_unstable(state);
18
+ const {
19
+ useToggleButtonStyles_unstable: useCustomStyles
20
+ } = react_shared_contexts_1.useCustomStyleHooks_unstable();
21
+ useCustomStyles(state);
17
22
  return renderToggleButton_1.renderToggleButton_unstable(state);
18
23
  // Casting is required due to lack of distributive union to support unions on @types/react
19
24
  });
package/lib-commonjs/components/ToggleButton/ToggleButton.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","renderToggleButton_1","useToggleButton_1","useToggleButtonStyles_1","exports","ToggleButton","forwardRef","props","ref","state","useToggleButton_unstable","useToggleButtonStyles_unstable","renderToggleButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderToggleButton_unstable } from './renderToggleButton';\nimport { useToggleButton_unstable } from './useToggleButton';\nimport { useToggleButtonStyles_unstable } from './useToggleButtonStyles';\nimport type { ToggleButtonProps } from './ToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * ToggleButtons are buttons that toggle between two defined states when triggered.\n */\nexport const ToggleButton: ForwardRefComponent<ToggleButtonProps> = React.forwardRef((props, ref) => {\n const state = useToggleButton_unstable(props, ref);\n\n useToggleButtonStyles_unstable(state);\n\n return renderToggleButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToggleButtonProps>;\n\nToggleButton.displayName = 'ToggleButton';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,oBAAA,gBAAAD,OAAA;AACA,MAAAE,iBAAA,gBAAAF,OAAA;AACA,MAAAG,uBAAA,gBAAAH,OAAA;AAIA;;;AAGaI,OAAA,CAAAC,YAAY,gBAA2CN,KAAK,CAACO,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAClG,MAAMC,KAAK,GAAGP,iBAAA,CAAAQ,wBAAwB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAElDL,uBAAA,CAAAQ,8BAA8B,CAACF,KAAK,CAAC;EAErC,OAAOR,oBAAA,CAAAW,2BAA2B,CAACH,KAAK,CAAC;EACzC;AACF,CAAC,CAA2C;;AAE5CL,OAAA,CAAAC,YAAY,CAACQ,WAAW,GAAG,cAAc"}
1
+ {"version":3,"names":["React","require","renderToggleButton_1","useToggleButton_1","useToggleButtonStyles_1","react_shared_contexts_1","exports","ToggleButton","forwardRef","props","ref","state","useToggleButton_unstable","useToggleButtonStyles_unstable","useCustomStyles","useCustomStyleHooks_unstable","renderToggleButton_unstable","displayName"],"sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/ToggleButton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { renderToggleButton_unstable } from './renderToggleButton';\nimport { useToggleButton_unstable } from './useToggleButton';\nimport { useToggleButtonStyles_unstable } from './useToggleButtonStyles';\nimport type { ToggleButtonProps } from './ToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToggleButtons are buttons that toggle between two defined states when triggered.\n */\nexport const ToggleButton: ForwardRefComponent<ToggleButtonProps> = React.forwardRef((props, ref) => {\n const state = useToggleButton_unstable(props, ref);\n\n useToggleButtonStyles_unstable(state);\n\n const { useToggleButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderToggleButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToggleButtonProps>;\n\nToggleButton.displayName = 'ToggleButton';\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,oBAAA,gBAAAD,OAAA;AACA,MAAAE,iBAAA,gBAAAF,OAAA;AACA,MAAAG,uBAAA,gBAAAH,OAAA;AAGA,MAAAI,uBAAA,gBAAAJ,OAAA;AAEA;;;AAGaK,OAAA,CAAAC,YAAY,gBAA2CP,KAAK,CAACQ,UAAU,CAAC,CAACC,KAAK,EAAEC,GAAG,KAAI;EAClG,MAAMC,KAAK,GAAGR,iBAAA,CAAAS,wBAAwB,CAACH,KAAK,EAAEC,GAAG,CAAC;EAElDN,uBAAA,CAAAS,8BAA8B,CAACF,KAAK,CAAC;EAErC,MAAM;IAAEE,8BAA8B,EAAEC;EAAe,CAAE,GAAGT,uBAAA,CAAAU,4BAA4B,EAAE;EAC1FD,eAAe,CAACH,KAAK,CAAC;EAEtB,OAAOT,oBAAA,CAAAc,2BAA2B,CAACL,KAAK,CAAC;EACzC;AACF,CAAC,CAA2C;;AAE5CL,OAAA,CAAAC,YAAY,CAACU,WAAW,GAAG,cAAc"}
package/lib-commonjs/utils/useToggleState.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"names":["React","require","react_utilities_1","useToggleState","props","state","checked","defaultChecked","disabled","disabledFocusable","onClick","role","root","checkedValue","setCheckedValue","useControllableState","defaultState","initialState","isCheckboxTypeRole","onToggleClick","useCallback","ev","defaultPrevented","useEventCallback","mergeCallbacks","exports"],"sources":["../../../../../../../../packages/react-components/react-button/src/utils/useToggleState.ts"],"sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport type { ButtonState } from '../Button';\nimport type { ToggleButtonProps, ToggleButtonState } from '../ToggleButton';\n\nexport function useToggleState<\n TToggleButtonProps extends Pick<ToggleButtonProps, 'checked' | 'defaultChecked' | 'disabled' | 'disabledFocusable'>,\n TButtonState extends Pick<ButtonState, 'root'>,\n TToggleButtonState extends Pick<ToggleButtonState, 'checked' | 'root'>\n>(props: TToggleButtonProps, state: TButtonState): TToggleButtonState {\n const { checked, defaultChecked, disabled, disabledFocusable } = props;\n const { onClick, role } = state.root;\n\n const [checkedValue, setCheckedValue] = useControllableState({\n state: checked,\n defaultState: defaultChecked,\n initialState: false,\n });\n\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n const onToggleClick = React.useCallback(\n ev => {\n if (!disabled && !disabledFocusable) {\n if (ev.defaultPrevented) {\n return;\n }\n\n setCheckedValue(!checkedValue);\n }\n },\n [checkedValue, disabled, disabledFocusable, setCheckedValue],\n );\n\n return {\n ...state,\n\n checked: checkedValue,\n\n root: {\n ...state.root,\n [isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed']: checkedValue,\n onClick: useEventCallback(\n mergeCallbacks(onClick as React.MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>, onToggleClick),\n ),\n },\n } as TToggleButtonState;\n}\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAIA,SAAgBE,cAAcA,CAI5BC,KAAyB,EAAEC,KAAmB;EAC9C,MAAM;IAAEC,OAAO;IAAEC,cAAc;IAAEC,QAAQ;IAAEC;EAAiB,CAAE,GAAGL,KAAK;EACtE,MAAM;IAAEM,OAAO;IAAEC;EAAI,CAAE,GAAGN,KAAK,CAACO,IAAI;EAEpC,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGZ,iBAAA,CAAAa,oBAAoB,CAAC;IAC3DV,KAAK,EAAEC,OAAO;IACdU,YAAY,EAAET,cAAc;IAC5BU,YAAY,EAAE;GACf,CAAC;EAEF,MAAMC,kBAAkB,GAAGP,IAAI,KAAK,kBAAkB,IAAIA,IAAI,KAAK,UAAU;EAE7E,MAAMQ,aAAa,GAAGnB,KAAK,CAACoB,WAAW,CACrCC,EAAE,IAAG;IACH,IAAI,CAACb,QAAQ,IAAI,CAACC,iBAAiB,EAAE;MACnC,IAAIY,EAAE,CAACC,gBAAgB,EAAE;QACvB;;MAGFR,eAAe,CAAC,CAACD,YAAY,CAAC;;EAElC,CAAC,EACD,CAACA,YAAY,EAAEL,QAAQ,EAAEC,iBAAiB,EAAEK,eAAe,CAAC,CAC7D;EAED,OAAO;IACL,GAAGT,KAAK;IAERC,OAAO,EAAEO,YAAY;IAErBD,IAAI,EAAE;MACJ,GAAGP,KAAK,CAACO,IAAI;MACb,CAACM,kBAAkB,GAAG,cAAc,GAAG,cAAc,GAAGL,YAAY;MACpEH,OAAO,EAAER,iBAAA,CAAAqB,gBAAgB,CACvBrB,iBAAA,CAAAsB,cAAc,CAACd,OAAyE,EAAES,aAAa,CAAC;;GAGvF;AACzB;AA1CAM,OAAA,CAAAtB,cAAA,GAAAA,cAAA"}
1
+ {"version":3,"names":["React","require","react_utilities_1","useToggleState","props","state","checked","defaultChecked","disabled","disabledFocusable","onClick","role","root","checkedValue","setCheckedValue","useControllableState","defaultState","initialState","isCheckboxTypeRole","onToggleClick","useCallback","ev","defaultPrevented","useEventCallback","mergeCallbacks","exports"],"sources":["../../../../../../../../packages/react-components/react-button/src/utils/useToggleState.ts"],"sourcesContent":["import * as React from 'react';\nimport { mergeCallbacks, useControllableState, useEventCallback } from '@fluentui/react-utilities';\nimport type { ButtonState } from '../Button';\nimport type { ToggleButtonProps, ToggleButtonState } from '../ToggleButton';\n\nexport function useToggleState<\n TToggleButtonProps extends Pick<ToggleButtonProps, 'checked' | 'defaultChecked' | 'disabled' | 'disabledFocusable'>,\n TButtonState extends Pick<ButtonState, 'root'>,\n TToggleButtonState extends Pick<ToggleButtonState, 'checked' | 'root'>,\n>(props: TToggleButtonProps, state: TButtonState): TToggleButtonState {\n const { checked, defaultChecked, disabled, disabledFocusable } = props;\n const { onClick, role } = state.root;\n\n const [checkedValue, setCheckedValue] = useControllableState({\n state: checked,\n defaultState: defaultChecked,\n initialState: false,\n });\n\n const isCheckboxTypeRole = role === 'menuitemcheckbox' || role === 'checkbox';\n\n const onToggleClick = React.useCallback(\n ev => {\n if (!disabled && !disabledFocusable) {\n if (ev.defaultPrevented) {\n return;\n }\n\n setCheckedValue(!checkedValue);\n }\n },\n [checkedValue, disabled, disabledFocusable, setCheckedValue],\n );\n\n return {\n ...state,\n\n checked: checkedValue,\n\n root: {\n ...state.root,\n [isCheckboxTypeRole ? 'aria-checked' : 'aria-pressed']: checkedValue,\n onClick: useEventCallback(\n mergeCallbacks(onClick as React.MouseEventHandler<HTMLButtonElement | HTMLAnchorElement>, onToggleClick),\n ),\n },\n } as TToggleButtonState;\n}\n"],"mappings":";;;;;;AAAA,MAAAA,KAAA,gBAAAC,OAAA;AACA,MAAAC,iBAAA,gBAAAD,OAAA;AAIA,SAAgBE,cAAcA,CAI5BC,KAAyB,EAAEC,KAAmB;EAC9C,MAAM;IAAEC,OAAO;IAAEC,cAAc;IAAEC,QAAQ;IAAEC;EAAiB,CAAE,GAAGL,KAAK;EACtE,MAAM;IAAEM,OAAO;IAAEC;EAAI,CAAE,GAAGN,KAAK,CAACO,IAAI;EAEpC,MAAM,CAACC,YAAY,EAAEC,eAAe,CAAC,GAAGZ,iBAAA,CAAAa,oBAAoB,CAAC;IAC3DV,KAAK,EAAEC,OAAO;IACdU,YAAY,EAAET,cAAc;IAC5BU,YAAY,EAAE;GACf,CAAC;EAEF,MAAMC,kBAAkB,GAAGP,IAAI,KAAK,kBAAkB,IAAIA,IAAI,KAAK,UAAU;EAE7E,MAAMQ,aAAa,GAAGnB,KAAK,CAACoB,WAAW,CACrCC,EAAE,IAAG;IACH,IAAI,CAACb,QAAQ,IAAI,CAACC,iBAAiB,EAAE;MACnC,IAAIY,EAAE,CAACC,gBAAgB,EAAE;QACvB;;MAGFR,eAAe,CAAC,CAACD,YAAY,CAAC;;EAElC,CAAC,EACD,CAACA,YAAY,EAAEL,QAAQ,EAAEC,iBAAiB,EAAEK,eAAe,CAAC,CAC7D;EAED,OAAO;IACL,GAAGT,KAAK;IAERC,OAAO,EAAEO,YAAY;IAErBD,IAAI,EAAE;MACJ,GAAGP,KAAK,CAACO,IAAI;MACb,CAACM,kBAAkB,GAAG,cAAc,GAAG,cAAc,GAAGL,YAAY;MACpEH,OAAO,EAAER,iBAAA,CAAAqB,gBAAgB,CACvBrB,iBAAA,CAAAsB,cAAc,CAACd,OAAyE,EAAES,aAAa,CAAC;;GAGvF;AACzB;AA1CAM,OAAA,CAAAtB,cAAA,GAAAA,cAAA"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-button",
3
- "version": "0.0.0-nightly-20230302-0419.1",
3
+ "version": "0.0.0-nightly-20230306-0424.1",
4
4
  "description": "Fluent UI React Button component.",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -28,17 +28,18 @@
28
28
  "@fluentui/a11y-testing": "^0.1.0",
29
29
  "@fluentui/eslint-plugin": "*",
30
30
  "@fluentui/react-conformance": "*",
31
- "@fluentui/react-conformance-griffel": "0.0.0-nightly-20230302-0419.1",
31
+ "@fluentui/react-conformance-griffel": "0.0.0-nightly-20230306-0424.1",
32
32
  "@fluentui/scripts-api-extractor": "*",
33
33
  "@fluentui/scripts-tasks": "*"
34
34
  },
35
35
  "dependencies": {
36
- "@fluentui/keyboard-keys": "0.0.0-nightly-20230302-0419.1",
37
- "@fluentui/react-aria": "0.0.0-nightly-20230302-0419.1",
36
+ "@fluentui/keyboard-keys": "0.0.0-nightly-20230306-0424.1",
37
+ "@fluentui/react-aria": "0.0.0-nightly-20230306-0424.1",
38
38
  "@fluentui/react-icons": "^2.0.175",
39
- "@fluentui/react-tabster": "0.0.0-nightly-20230302-0419.1",
40
- "@fluentui/react-theme": "0.0.0-nightly-20230302-0419.1",
41
- "@fluentui/react-utilities": "0.0.0-nightly-20230302-0419.1",
39
+ "@fluentui/react-shared-contexts": "0.0.0-nightly-20230306-0424.1",
40
+ "@fluentui/react-tabster": "0.0.0-nightly-20230306-0424.1",
41
+ "@fluentui/react-theme": "0.0.0-nightly-20230306-0424.1",
42
+ "@fluentui/react-utilities": "0.0.0-nightly-20230306-0424.1",
42
43
  "@griffel/react": "^1.5.2",
43
44
  "tslib": "^2.1.0"
44
45
  },