@fluentui/react-button 9.7.0 → 9.8.0

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 (137) hide show
  1. package/CHANGELOG.md +33 -2
  2. package/dist/index.d.ts +3 -3
  3. package/lib/Button.js +1 -1
  4. package/lib/Button.js.map +1 -1
  5. package/lib/CompoundButton.js +1 -1
  6. package/lib/CompoundButton.js.map +1 -1
  7. package/lib/MenuButton.js +1 -1
  8. package/lib/MenuButton.js.map +1 -1
  9. package/lib/SplitButton.js +1 -1
  10. package/lib/SplitButton.js.map +1 -1
  11. package/lib/ToggleButton.js +1 -1
  12. package/lib/ToggleButton.js.map +1 -1
  13. package/lib/components/Button/Button.types.js.map +1 -1
  14. package/lib/components/Button/index.js +1 -0
  15. package/lib/components/Button/index.js.map +1 -1
  16. package/lib/components/Button/useButton.js +4 -22
  17. package/lib/components/Button/useButton.js.map +1 -1
  18. package/lib/components/Button/useButtonBase.js +34 -0
  19. package/lib/components/Button/useButtonBase.js.map +1 -0
  20. package/lib/components/CompoundButton/CompoundButton.types.js.map +1 -1
  21. package/lib/components/CompoundButton/index.js +1 -0
  22. package/lib/components/CompoundButton/index.js.map +1 -1
  23. package/lib/components/CompoundButton/useCompoundButton.js +11 -23
  24. package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
  25. package/lib/components/CompoundButton/useCompoundButtonBase.js +31 -0
  26. package/lib/components/CompoundButton/useCompoundButtonBase.js.map +1 -0
  27. package/lib/components/MenuButton/MenuButton.types.js.map +1 -1
  28. package/lib/components/MenuButton/index.js +1 -0
  29. package/lib/components/MenuButton/index.js.map +1 -1
  30. package/lib/components/MenuButton/useMenuButton.js +14 -23
  31. package/lib/components/MenuButton/useMenuButton.js.map +1 -1
  32. package/lib/components/MenuButton/useMenuButtonBase.js +27 -0
  33. package/lib/components/MenuButton/useMenuButtonBase.js.map +1 -0
  34. package/lib/components/SplitButton/SplitButton.types.js.map +1 -1
  35. package/lib/components/SplitButton/index.js +1 -0
  36. package/lib/components/SplitButton/index.js.map +1 -1
  37. package/lib/components/SplitButton/useSplitButton.js +16 -53
  38. package/lib/components/SplitButton/useSplitButton.js.map +1 -1
  39. package/lib/components/SplitButton/useSplitButtonBase.js +57 -0
  40. package/lib/components/SplitButton/useSplitButtonBase.js.map +1 -0
  41. package/lib/components/ToggleButton/ToggleButton.types.js.map +1 -1
  42. package/lib/components/ToggleButton/index.js +1 -0
  43. package/lib/components/ToggleButton/index.js.map +1 -1
  44. package/lib/components/ToggleButton/useToggleButton.js +13 -5
  45. package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
  46. package/lib/components/ToggleButton/useToggleButtonBase.js +13 -0
  47. package/lib/components/ToggleButton/useToggleButtonBase.js.map +1 -0
  48. package/lib/index.js +11 -0
  49. package/lib/index.js.map +1 -1
  50. package/lib-commonjs/Button.js +3 -0
  51. package/lib-commonjs/Button.js.map +1 -1
  52. package/lib-commonjs/CompoundButton.js +3 -0
  53. package/lib-commonjs/CompoundButton.js.map +1 -1
  54. package/lib-commonjs/MenuButton.js +3 -0
  55. package/lib-commonjs/MenuButton.js.map +1 -1
  56. package/lib-commonjs/SplitButton.js +3 -0
  57. package/lib-commonjs/SplitButton.js.map +1 -1
  58. package/lib-commonjs/ToggleButton.js +3 -0
  59. package/lib-commonjs/ToggleButton.js.map +1 -1
  60. package/lib-commonjs/components/Button/Button.types.js.map +1 -1
  61. package/lib-commonjs/components/Button/index.js +4 -0
  62. package/lib-commonjs/components/Button/index.js.map +1 -1
  63. package/lib-commonjs/components/Button/useButton.js +4 -22
  64. package/lib-commonjs/components/Button/useButton.js.map +1 -1
  65. package/lib-commonjs/components/Button/useButtonBase.js +41 -0
  66. package/lib-commonjs/components/Button/useButtonBase.js.map +1 -0
  67. package/lib-commonjs/components/CompoundButton/CompoundButton.types.js.map +1 -1
  68. package/lib-commonjs/components/CompoundButton/index.js +4 -0
  69. package/lib-commonjs/components/CompoundButton/index.js.map +1 -1
  70. package/lib-commonjs/components/CompoundButton/useCompoundButton.js +11 -23
  71. package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
  72. package/lib-commonjs/components/CompoundButton/useCompoundButtonBase.js +38 -0
  73. package/lib-commonjs/components/CompoundButton/useCompoundButtonBase.js.map +1 -0
  74. package/lib-commonjs/components/MenuButton/MenuButton.types.js.map +1 -1
  75. package/lib-commonjs/components/MenuButton/index.js +4 -0
  76. package/lib-commonjs/components/MenuButton/index.js.map +1 -1
  77. package/lib-commonjs/components/MenuButton/useMenuButton.js +14 -23
  78. package/lib-commonjs/components/MenuButton/useMenuButton.js.map +1 -1
  79. package/lib-commonjs/components/MenuButton/useMenuButtonBase.js +36 -0
  80. package/lib-commonjs/components/MenuButton/useMenuButtonBase.js.map +1 -0
  81. package/lib-commonjs/components/SplitButton/SplitButton.types.js.map +1 -1
  82. package/lib-commonjs/components/SplitButton/index.js +4 -0
  83. package/lib-commonjs/components/SplitButton/index.js.map +1 -1
  84. package/lib-commonjs/components/SplitButton/useSplitButton.js +16 -53
  85. package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
  86. package/lib-commonjs/components/SplitButton/useSplitButtonBase.js +64 -0
  87. package/lib-commonjs/components/SplitButton/useSplitButtonBase.js.map +1 -0
  88. package/lib-commonjs/components/ToggleButton/ToggleButton.types.js.map +1 -1
  89. package/lib-commonjs/components/ToggleButton/index.js +4 -0
  90. package/lib-commonjs/components/ToggleButton/index.js.map +1 -1
  91. package/lib-commonjs/components/ToggleButton/useToggleButton.js +12 -4
  92. package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
  93. package/lib-commonjs/components/ToggleButton/useToggleButtonBase.js +19 -0
  94. package/lib-commonjs/components/ToggleButton/useToggleButtonBase.js.map +1 -0
  95. package/lib-commonjs/index.js +11 -0
  96. package/lib-commonjs/index.js.map +1 -1
  97. package/package.json +7 -14
  98. package/lib/components/Button/useButtonStyles.styles.headless.js +0 -36
  99. package/lib/components/Button/useButtonStyles.styles.headless.js.map +0 -1
  100. package/lib/components/Button/useButtonStyles.styles.raw.headless.js +0 -36
  101. package/lib/components/Button/useButtonStyles.styles.raw.headless.js.map +0 -1
  102. package/lib/components/CompoundButton/useCompoundButtonStyles.styles.headless.js +0 -49
  103. package/lib/components/CompoundButton/useCompoundButtonStyles.styles.headless.js.map +0 -1
  104. package/lib/components/CompoundButton/useCompoundButtonStyles.styles.raw.headless.js +0 -49
  105. package/lib/components/CompoundButton/useCompoundButtonStyles.styles.raw.headless.js.map +0 -1
  106. package/lib/components/MenuButton/useMenuButtonStyles.styles.headless.js +0 -44
  107. package/lib/components/MenuButton/useMenuButtonStyles.styles.headless.js.map +0 -1
  108. package/lib/components/MenuButton/useMenuButtonStyles.styles.raw.headless.js +0 -44
  109. package/lib/components/MenuButton/useMenuButtonStyles.styles.raw.headless.js.map +0 -1
  110. package/lib/components/SplitButton/useSplitButtonStyles.styles.headless.js +0 -39
  111. package/lib/components/SplitButton/useSplitButtonStyles.styles.headless.js.map +0 -1
  112. package/lib/components/SplitButton/useSplitButtonStyles.styles.raw.headless.js +0 -39
  113. package/lib/components/SplitButton/useSplitButtonStyles.styles.raw.headless.js.map +0 -1
  114. package/lib/components/ToggleButton/useToggleButtonStyles.styles.headless.js +0 -36
  115. package/lib/components/ToggleButton/useToggleButtonStyles.styles.headless.js.map +0 -1
  116. package/lib/components/ToggleButton/useToggleButtonStyles.styles.raw.headless.js +0 -36
  117. package/lib/components/ToggleButton/useToggleButtonStyles.styles.raw.headless.js.map +0 -1
  118. package/lib-commonjs/components/Button/useButtonStyles.styles.headless.js +0 -52
  119. package/lib-commonjs/components/Button/useButtonStyles.styles.headless.js.map +0 -1
  120. package/lib-commonjs/components/Button/useButtonStyles.styles.raw.headless.js +0 -52
  121. package/lib-commonjs/components/Button/useButtonStyles.styles.raw.headless.js.map +0 -1
  122. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.styles.headless.js +0 -64
  123. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.styles.headless.js.map +0 -1
  124. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.styles.raw.headless.js +0 -64
  125. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.styles.raw.headless.js.map +0 -1
  126. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.styles.headless.js +0 -60
  127. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.styles.headless.js.map +0 -1
  128. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.styles.raw.headless.js +0 -60
  129. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.styles.raw.headless.js.map +0 -1
  130. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.styles.headless.js +0 -55
  131. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.styles.headless.js.map +0 -1
  132. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.styles.raw.headless.js +0 -55
  133. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.styles.raw.headless.js.map +0 -1
  134. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.styles.headless.js +0 -52
  135. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.styles.headless.js.map +0 -1
  136. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.styles.raw.headless.js +0 -52
  137. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.styles.raw.headless.js.map +0 -1
package/CHANGELOG.md CHANGED
@@ -1,12 +1,43 @@
1
1
  # Change Log - @fluentui/react-button
2
2
 
3
- This log was last generated on Fri, 05 Dec 2025 22:36:22 GMT and should not be manually modified.
3
+ This log was last generated on Thu, 22 Jan 2026 17:01:46 GMT and should not be manually modified.
4
4
 
5
5
  <!-- Start content -->
6
6
 
7
+ ## [9.8.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.8.0)
8
+
9
+ Thu, 22 Jan 2026 17:01:46 GMT
10
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.7.1..@fluentui/react-button_v9.8.0)
11
+
12
+ ### Minor changes
13
+
14
+ - feat: add base hooks for button components ([PR #35631](https://github.com/microsoft/fluentui/pull/35631) by dmytrokirpa@microsoft.com)
15
+ - Bump @fluentui/react-aria to v9.17.8 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
16
+ - Bump @fluentui/react-jsx-runtime to v9.3.5 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
17
+ - Bump @fluentui/react-shared-contexts to v9.26.1 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
18
+ - Bump @fluentui/react-tabster to v9.26.12 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
19
+ - Bump @fluentui/react-theme to v9.2.1 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
20
+ - Bump @fluentui/react-utilities to v9.26.1 ([PR #35574](https://github.com/microsoft/fluentui/pull/35574) by beachball)
21
+
22
+ ### Patches
23
+
24
+ - chore: remove experimental style hooks ([PR #35620](https://github.com/microsoft/fluentui/pull/35620) by dmytrokirpa@microsoft.com)
25
+
26
+ ## [9.7.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.7.1)
27
+
28
+ Wed, 17 Dec 2025 18:10:11 GMT
29
+ [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.7.0..@fluentui/react-button_v9.7.1)
30
+
31
+ ### Patches
32
+
33
+ - Bump @fluentui/react-aria to v9.17.7 ([PR #35582](https://github.com/microsoft/fluentui/pull/35582) by beachball)
34
+ - Bump @fluentui/react-jsx-runtime to v9.3.4 ([PR #35582](https://github.com/microsoft/fluentui/pull/35582) by beachball)
35
+ - Bump @fluentui/react-tabster to v9.26.11 ([PR #35582](https://github.com/microsoft/fluentui/pull/35582) by beachball)
36
+ - Bump @fluentui/react-utilities to v9.26.0 ([PR #35582](https://github.com/microsoft/fluentui/pull/35582) by beachball)
37
+
7
38
  ## [9.7.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-button_v9.7.0)
8
39
 
9
- Fri, 05 Dec 2025 22:36:22 GMT
40
+ Fri, 05 Dec 2025 22:38:44 GMT
10
41
  [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-button_v9.6.12..@fluentui/react-button_v9.7.0)
11
42
 
12
43
  ### Minor changes
package/dist/index.d.ts CHANGED
@@ -236,14 +236,14 @@ export declare const useButtonStyles_unstable: (state: ButtonState) => ButtonSta
236
236
  * @param props - User provided props to the CompoundButton component.
237
237
  * @param ref - User provided ref to be passed to the CompoundButton component.
238
238
  */
239
- export declare const useCompoundButton_unstable: ({ contentContainer, secondaryContent, ...props }: CompoundButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => CompoundButtonState;
239
+ export declare const useCompoundButton_unstable: (props: CompoundButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => CompoundButtonState;
240
240
 
241
241
  export declare const useCompoundButtonStyles_unstable: (state: CompoundButtonState) => CompoundButtonState;
242
242
 
243
243
  /**
244
244
  * Given user props, returns the final state for a MenuButton.
245
245
  */
246
- export declare const useMenuButton_unstable: ({ menuIcon, ...props }: MenuButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => MenuButtonState;
246
+ export declare const useMenuButton_unstable: (props: MenuButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => MenuButtonState;
247
247
 
248
248
  export declare const useMenuButtonStyles_unstable: (state: MenuButtonState) => MenuButtonState;
249
249
 
@@ -257,7 +257,7 @@ export declare const useSplitButton_unstable: (props: SplitButtonProps, ref: Rea
257
257
  export declare const useSplitButtonStyles_unstable: (state: SplitButtonState) => SplitButtonState;
258
258
 
259
259
  /**
260
- * Given user props, defines default props for the ToggleButton, calls useButtonState and useChecked, and returns
260
+ * Given user props, defines default props for the ToggleButton, calls `useToggleButtonBase_unstable` and adds design-related props, and returns
261
261
  * processed state.
262
262
  * @param props - User provided props to the ToggleButton component.
263
263
  * @param ref - User provided ref to be passed to the ToggleButton component.
package/lib/Button.js CHANGED
@@ -1 +1 @@
1
- export { Button, buttonClassNames, renderButton_unstable, useButtonStyles_unstable, useButton_unstable } from './components/Button/index';
1
+ export { Button, buttonClassNames, renderButton_unstable, useButtonStyles_unstable, useButton_unstable, useButtonBase_unstable } from './components/Button/index';
package/lib/Button.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/Button.tsx"],"sourcesContent":["export type { ButtonProps, ButtonSlots, ButtonState } from './components/Button/index';\nexport {\n Button,\n buttonClassNames,\n renderButton_unstable,\n useButtonStyles_unstable,\n useButton_unstable,\n} from './components/Button/index';\n"],"names":["Button","buttonClassNames","renderButton_unstable","useButtonStyles_unstable","useButton_unstable"],"mappings":"AACA,SACEA,MAAM,EACNC,gBAAgB,EAChBC,qBAAqB,EACrBC,wBAAwB,EACxBC,kBAAkB,QACb,4BAA4B"}
1
+ {"version":3,"sources":["../src/Button.tsx"],"sourcesContent":["export type {\n ButtonBaseProps,\n ButtonProps,\n ButtonSlots,\n ButtonBaseState,\n ButtonState,\n} from './components/Button/index';\nexport {\n Button,\n buttonClassNames,\n renderButton_unstable,\n useButtonStyles_unstable,\n useButton_unstable,\n useButtonBase_unstable,\n} from './components/Button/index';\n"],"names":["Button","buttonClassNames","renderButton_unstable","useButtonStyles_unstable","useButton_unstable","useButtonBase_unstable"],"mappings":"AAOA,SACEA,MAAM,EACNC,gBAAgB,EAChBC,qBAAqB,EACrBC,wBAAwB,EACxBC,kBAAkB,EAClBC,sBAAsB,QACjB,4BAA4B"}
@@ -1 +1 @@
1
- export { CompoundButton, compoundButtonClassNames, renderCompoundButton_unstable, useCompoundButtonStyles_unstable, useCompoundButton_unstable } from './components/CompoundButton/index';
1
+ export { CompoundButton, compoundButtonClassNames, renderCompoundButton_unstable, useCompoundButtonStyles_unstable, useCompoundButton_unstable, useCompoundButtonBase_unstable } from './components/CompoundButton/index';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/CompoundButton.ts"],"sourcesContent":["export type { CompoundButtonProps, CompoundButtonSlots, CompoundButtonState } from './components/CompoundButton/index';\nexport {\n CompoundButton,\n compoundButtonClassNames,\n renderCompoundButton_unstable,\n useCompoundButtonStyles_unstable,\n useCompoundButton_unstable,\n} from './components/CompoundButton/index';\n"],"names":["CompoundButton","compoundButtonClassNames","renderCompoundButton_unstable","useCompoundButtonStyles_unstable","useCompoundButton_unstable"],"mappings":"AACA,SACEA,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,QACrB,oCAAoC"}
1
+ {"version":3,"sources":["../src/CompoundButton.ts"],"sourcesContent":["export type {\n CompoundButtonBaseProps,\n CompoundButtonProps,\n CompoundButtonSlots,\n CompoundButtonBaseState,\n CompoundButtonState,\n} from './components/CompoundButton/index';\nexport {\n CompoundButton,\n compoundButtonClassNames,\n renderCompoundButton_unstable,\n useCompoundButtonStyles_unstable,\n useCompoundButton_unstable,\n useCompoundButtonBase_unstable,\n} from './components/CompoundButton/index';\n"],"names":["CompoundButton","compoundButtonClassNames","renderCompoundButton_unstable","useCompoundButtonStyles_unstable","useCompoundButton_unstable","useCompoundButtonBase_unstable"],"mappings":"AAOA,SACEA,cAAc,EACdC,wBAAwB,EACxBC,6BAA6B,EAC7BC,gCAAgC,EAChCC,0BAA0B,EAC1BC,8BAA8B,QACzB,oCAAoC"}
package/lib/MenuButton.js CHANGED
@@ -1 +1 @@
1
- export { MenuButton, menuButtonClassNames, renderMenuButton_unstable, useMenuButtonStyles_unstable, useMenuButton_unstable } from './components/MenuButton/index';
1
+ export { MenuButton, menuButtonClassNames, renderMenuButton_unstable, useMenuButtonStyles_unstable, useMenuButton_unstable, useMenuButtonBase_unstable } from './components/MenuButton/index';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/MenuButton.ts"],"sourcesContent":["export type { MenuButtonProps, MenuButtonSlots, MenuButtonState } from './components/MenuButton/index';\nexport {\n MenuButton,\n menuButtonClassNames,\n renderMenuButton_unstable,\n useMenuButtonStyles_unstable,\n useMenuButton_unstable,\n} from './components/MenuButton/index';\n"],"names":["MenuButton","menuButtonClassNames","renderMenuButton_unstable","useMenuButtonStyles_unstable","useMenuButton_unstable"],"mappings":"AACA,SACEA,UAAU,EACVC,oBAAoB,EACpBC,yBAAyB,EACzBC,4BAA4B,EAC5BC,sBAAsB,QACjB,gCAAgC"}
1
+ {"version":3,"sources":["../src/MenuButton.ts"],"sourcesContent":["export type {\n MenuButtonBaseProps,\n MenuButtonProps,\n MenuButtonSlots,\n MenuButtonBaseState,\n MenuButtonState,\n} from './components/MenuButton/index';\nexport {\n MenuButton,\n menuButtonClassNames,\n renderMenuButton_unstable,\n useMenuButtonStyles_unstable,\n useMenuButton_unstable,\n useMenuButtonBase_unstable,\n} from './components/MenuButton/index';\n"],"names":["MenuButton","menuButtonClassNames","renderMenuButton_unstable","useMenuButtonStyles_unstable","useMenuButton_unstable","useMenuButtonBase_unstable"],"mappings":"AAOA,SACEA,UAAU,EACVC,oBAAoB,EACpBC,yBAAyB,EACzBC,4BAA4B,EAC5BC,sBAAsB,EACtBC,0BAA0B,QACrB,gCAAgC"}
@@ -1 +1 @@
1
- export { SplitButton, renderSplitButton_unstable, splitButtonClassNames, useSplitButtonStyles_unstable, useSplitButton_unstable } from './components/SplitButton/index';
1
+ export { SplitButton, renderSplitButton_unstable, splitButtonClassNames, useSplitButtonStyles_unstable, useSplitButton_unstable, useSplitButtonBase_unstable } from './components/SplitButton/index';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/SplitButton.ts"],"sourcesContent":["export type { SplitButtonProps, SplitButtonSlots, SplitButtonState } from './components/SplitButton/index';\nexport {\n SplitButton,\n renderSplitButton_unstable,\n splitButtonClassNames,\n useSplitButtonStyles_unstable,\n useSplitButton_unstable,\n} from './components/SplitButton/index';\n"],"names":["SplitButton","renderSplitButton_unstable","splitButtonClassNames","useSplitButtonStyles_unstable","useSplitButton_unstable"],"mappings":"AACA,SACEA,WAAW,EACXC,0BAA0B,EAC1BC,qBAAqB,EACrBC,6BAA6B,EAC7BC,uBAAuB,QAClB,iCAAiC"}
1
+ {"version":3,"sources":["../src/SplitButton.ts"],"sourcesContent":["export type {\n SplitButtonBaseProps,\n SplitButtonProps,\n SplitButtonSlots,\n SplitButtonBaseState,\n SplitButtonState,\n} from './components/SplitButton/index';\nexport {\n SplitButton,\n renderSplitButton_unstable,\n splitButtonClassNames,\n useSplitButtonStyles_unstable,\n useSplitButton_unstable,\n useSplitButtonBase_unstable,\n} from './components/SplitButton/index';\n"],"names":["SplitButton","renderSplitButton_unstable","splitButtonClassNames","useSplitButtonStyles_unstable","useSplitButton_unstable","useSplitButtonBase_unstable"],"mappings":"AAOA,SACEA,WAAW,EACXC,0BAA0B,EAC1BC,qBAAqB,EACrBC,6BAA6B,EAC7BC,uBAAuB,EACvBC,2BAA2B,QACtB,iCAAiC"}
@@ -1 +1 @@
1
- export { ToggleButton, renderToggleButton_unstable, toggleButtonClassNames, useToggleButtonStyles_unstable, useToggleButton_unstable } from './components/ToggleButton/index';
1
+ export { ToggleButton, renderToggleButton_unstable, toggleButtonClassNames, useToggleButtonStyles_unstable, useToggleButton_unstable, useToggleButtonBase_unstable } from './components/ToggleButton/index';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/ToggleButton.ts"],"sourcesContent":["export type { ToggleButtonProps, ToggleButtonState } from './components/ToggleButton/index';\nexport {\n ToggleButton,\n renderToggleButton_unstable,\n toggleButtonClassNames,\n useToggleButtonStyles_unstable,\n useToggleButton_unstable,\n} from './components/ToggleButton/index';\n"],"names":["ToggleButton","renderToggleButton_unstable","toggleButtonClassNames","useToggleButtonStyles_unstable","useToggleButton_unstable"],"mappings":"AACA,SACEA,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,QACnB,kCAAkC"}
1
+ {"version":3,"sources":["../src/ToggleButton.ts"],"sourcesContent":["export type {\n ToggleButtonBaseProps,\n ToggleButtonProps,\n ToggleButtonBaseState,\n ToggleButtonState,\n} from './components/ToggleButton/index';\nexport {\n ToggleButton,\n renderToggleButton_unstable,\n toggleButtonClassNames,\n useToggleButtonStyles_unstable,\n useToggleButton_unstable,\n useToggleButtonBase_unstable,\n} from './components/ToggleButton/index';\n"],"names":["ToggleButton","renderToggleButton_unstable","toggleButtonClassNames","useToggleButtonStyles_unstable","useToggleButton_unstable","useToggleButtonBase_unstable"],"mappings":"AAMA,SACEA,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,EACxBC,4BAA4B,QACvB,kCAAkC"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Button/Button.types.ts"],"sourcesContent":["import type { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type ButtonSlots = {\n /**\n * Root of the component that renders as either a `<button>` tag or an `<a>` tag.\n */\n root: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;\n\n /**\n * Icon that renders either before or after the `children` as specified by the `iconPosition` prop.\n */\n icon?: Slot<'span'>;\n};\n\n/**\n * A button supports different sizes.\n */\nexport type ButtonSize = 'small' | 'medium' | 'large';\n\nexport type ButtonProps = ComponentProps<ButtonSlots> & {\n /**\n * A button can have its content and borders styled for greater emphasis or to be subtle.\n * - 'secondary' (default): Gives emphasis to the button in such a way that it indicates a secondary action.\n * - 'primary': Emphasizes the button as a primary action.\n * - 'outline': Removes background styling.\n * - 'subtle': Minimizes emphasis to blend into the background until hovered or focused.\n * - 'transparent': Removes background and border styling.\n *\n * @default 'secondary'\n */\n appearance?: 'secondary' | 'primary' | 'outline' | 'subtle' | 'transparent';\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 *\n * @default false\n */\n disabledFocusable?: boolean;\n\n /**\n * A button can show that it cannot be interacted with.\n *\n * @default false\n */\n disabled?: boolean;\n\n /**\n * A button can format its icon to appear before or after its content.\n *\n * @default 'before'\n */\n iconPosition?: 'before' | 'after';\n\n /**\n * A button can be rounded, circular, or square.\n *\n * @default 'rounded'\n */\n shape?: 'rounded' | 'circular' | 'square';\n\n /**\n * A button supports different sizes.\n *\n * @default 'medium'\n */\n size?: ButtonSize;\n};\n\nexport type ButtonState = ComponentState<ButtonSlots> &\n Required<Pick<ButtonProps, 'appearance' | 'disabledFocusable' | 'disabled' | 'iconPosition' | 'shape' | 'size'>> & {\n /**\n * A button can contain only an icon.\n *\n * @default false\n */\n iconOnly: boolean;\n };\n"],"names":[],"mappings":"AAuEA,WAQI"}
1
+ {"version":3,"sources":["../src/components/Button/Button.types.ts"],"sourcesContent":["import type { ARIAButtonSlotProps } from '@fluentui/react-aria';\nimport type { ComponentProps, ComponentState, DistributiveOmit, Slot } from '@fluentui/react-utilities';\n\nexport type ButtonSlots = {\n /**\n * Root of the component that renders as either a `<button>` tag or an `<a>` tag.\n */\n root: NonNullable<Slot<ARIAButtonSlotProps<'a'>>>;\n\n /**\n * Icon that renders either before or after the `children` as specified by the `iconPosition` prop.\n */\n icon?: Slot<'span'>;\n};\n\n/**\n * A button supports different sizes.\n */\nexport type ButtonSize = 'small' | 'medium' | 'large';\n\nexport type ButtonProps = ComponentProps<ButtonSlots> & {\n /**\n * A button can have its content and borders styled for greater emphasis or to be subtle.\n * - 'secondary' (default): Gives emphasis to the button in such a way that it indicates a secondary action.\n * - 'primary': Emphasizes the button as a primary action.\n * - 'outline': Removes background styling.\n * - 'subtle': Minimizes emphasis to blend into the background until hovered or focused.\n * - 'transparent': Removes background and border styling.\n *\n * @default 'secondary'\n */\n appearance?: 'secondary' | 'primary' | 'outline' | 'subtle' | 'transparent';\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 *\n * @default false\n */\n disabledFocusable?: boolean;\n\n /**\n * A button can show that it cannot be interacted with.\n *\n * @default false\n */\n disabled?: boolean;\n\n /**\n * A button can format its icon to appear before or after its content.\n *\n * @default 'before'\n */\n iconPosition?: 'before' | 'after';\n\n /**\n * A button can be rounded, circular, or square.\n *\n * @default 'rounded'\n */\n shape?: 'rounded' | 'circular' | 'square';\n\n /**\n * A button supports different sizes.\n *\n * @default 'medium'\n */\n size?: ButtonSize;\n};\n\n/**\n * Internal use only: lists prop names related to Button design for use within Button components.\n *\n * @internal\n */\nexport type ButtonDesignPropNames = 'appearance' | 'size' | 'shape';\n\nexport type ButtonBaseProps = DistributiveOmit<ButtonProps, ButtonDesignPropNames>;\n\nexport type ButtonState = ComponentState<ButtonSlots> &\n Required<Pick<ButtonProps, 'appearance' | 'disabledFocusable' | 'disabled' | 'iconPosition' | 'shape' | 'size'>> & {\n /**\n * A button can contain only an icon.\n *\n * @default false\n */\n iconOnly: boolean;\n };\n\nexport type ButtonBaseState = DistributiveOmit<ButtonState, ButtonDesignPropNames>;\n"],"names":[],"mappings":"AA0FA,WAAmF"}
@@ -1,4 +1,5 @@
1
1
  export { Button } from './Button';
2
2
  export { renderButton_unstable } from './renderButton';
3
3
  export { useButton_unstable } from './useButton';
4
+ export { useButtonBase_unstable } from './useButtonBase';
4
5
  export { buttonClassNames, useButtonStyles_unstable } from './useButtonStyles.styles';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Button/index.ts"],"sourcesContent":["export { Button } from './Button';\n// Explicit exports to omit ButtonCommons\nexport type { ButtonProps, ButtonSlots, ButtonState } from './Button.types';\nexport { renderButton_unstable } from './renderButton';\nexport { useButton_unstable } from './useButton';\nexport { buttonClassNames, useButtonStyles_unstable } from './useButtonStyles.styles';\n"],"names":["Button","renderButton_unstable","useButton_unstable","buttonClassNames","useButtonStyles_unstable"],"mappings":"AAAA,SAASA,MAAM,QAAQ,WAAW;AAGlC,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,kBAAkB,QAAQ,cAAc;AACjD,SAASC,gBAAgB,EAAEC,wBAAwB,QAAQ,2BAA2B"}
1
+ {"version":3,"sources":["../src/components/Button/index.ts"],"sourcesContent":["export { Button } from './Button';\n// Explicit exports to omit ButtonCommons\nexport type { ButtonBaseProps, ButtonProps, ButtonSlots, ButtonBaseState, ButtonState } from './Button.types';\nexport { renderButton_unstable } from './renderButton';\nexport { useButton_unstable } from './useButton';\nexport { useButtonBase_unstable } from './useButtonBase';\nexport { buttonClassNames, useButtonStyles_unstable } from './useButtonStyles.styles';\n"],"names":["Button","renderButton_unstable","useButton_unstable","useButtonBase_unstable","buttonClassNames","useButtonStyles_unstable"],"mappings":"AAAA,SAASA,MAAM,QAAQ,WAAW;AAGlC,SAASC,qBAAqB,QAAQ,iBAAiB;AACvD,SAASC,kBAAkB,QAAQ,cAAc;AACjD,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,gBAAgB,EAAEC,wBAAwB,QAAQ,2BAA2B"}
@@ -1,38 +1,20 @@
1
1
  'use client';
2
2
  import * as React from 'react';
3
- import { useARIAButtonProps } from '@fluentui/react-aria';
4
- import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
5
3
  import { useButtonContext } from '../../contexts/ButtonContext';
4
+ import { useButtonBase_unstable } from './useButtonBase';
6
5
  /**
7
6
  * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.
8
7
  * @param props - User provided props to the Button component.
9
8
  * @param ref - User provided ref to be passed to the Button component.
10
9
  */ export const useButton_unstable = (props, ref)=>{
11
10
  const { size: contextSize } = useButtonContext();
12
- const { appearance = 'secondary', as = 'button', disabled = false, disabledFocusable = false, icon, iconPosition = 'before', shape = 'rounded', size = contextSize !== null && contextSize !== void 0 ? contextSize : 'medium' } = props;
13
- const iconShorthand = slot.optional(icon, {
14
- elementType: 'span'
15
- });
11
+ const { appearance = 'secondary', shape = 'rounded', size = contextSize !== null && contextSize !== void 0 ? contextSize : 'medium' } = props;
12
+ const state = useButtonBase_unstable(props, ref);
16
13
  return {
17
14
  // Props passed at the top-level
18
15
  appearance,
19
- disabled,
20
- disabledFocusable,
21
- iconPosition,
22
16
  shape,
23
17
  size,
24
- iconOnly: Boolean((iconShorthand === null || iconShorthand === void 0 ? void 0 : iconShorthand.children) && !props.children),
25
- components: {
26
- root: 'button',
27
- icon: 'span'
28
- },
29
- root: slot.always(getIntrinsicElementProps(as, useARIAButtonProps(props.as, props)), {
30
- elementType: 'button',
31
- defaultProps: {
32
- ref: ref,
33
- type: as === 'button' ? 'button' : undefined
34
- }
35
- }),
36
- icon: iconShorthand
18
+ ...state
37
19
  };
38
20
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/Button/useButton.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ARIAButtonSlotProps, useARIAButtonProps } from '@fluentui/react-aria';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useButtonContext } from '../../contexts/ButtonContext';\nimport type { ButtonProps, ButtonState } from './Button.types';\n\n/**\n * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.\n * @param props - User provided props to the Button component.\n * @param ref - User provided ref to be passed to the Button component.\n */\nexport const useButton_unstable = (\n props: ButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ButtonState => {\n const { size: contextSize } = useButtonContext();\n const {\n appearance = 'secondary',\n as = 'button',\n disabled = false,\n disabledFocusable = false,\n icon,\n iconPosition = 'before',\n shape = 'rounded',\n size = contextSize ?? 'medium',\n } = props;\n const iconShorthand = slot.optional(icon, { elementType: 'span' });\n return {\n // Props passed at the top-level\n appearance,\n disabled,\n disabledFocusable,\n iconPosition,\n shape,\n size, // State calculated from a set of props\n iconOnly: Boolean(iconShorthand?.children && !props.children), // Slots definition\n components: { root: 'button', icon: 'span' },\n root: slot.always<ARIAButtonSlotProps<'a'>>(getIntrinsicElementProps(as, useARIAButtonProps(props.as, props)), {\n elementType: 'button',\n defaultProps: {\n ref: ref as React.Ref<HTMLButtonElement & HTMLAnchorElement>,\n type: as === 'button' ? 'button' : undefined,\n },\n }),\n icon: iconShorthand,\n };\n};\n"],"names":["React","useARIAButtonProps","getIntrinsicElementProps","slot","useButtonContext","useButton_unstable","props","ref","size","contextSize","appearance","as","disabled","disabledFocusable","icon","iconPosition","shape","iconShorthand","optional","elementType","iconOnly","Boolean","children","components","root","always","defaultProps","type","undefined"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAA8BC,kBAAkB,QAAQ,uBAAuB;AAC/E,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,SAASC,gBAAgB,QAAQ,+BAA+B;AAGhE;;;;CAIC,GACD,OAAO,MAAMC,qBAAqB,CAChCC,OACAC;IAEA,MAAM,EAAEC,MAAMC,WAAW,EAAE,GAAGL;IAC9B,MAAM,EACJM,aAAa,WAAW,EACxBC,KAAK,QAAQ,EACbC,WAAW,KAAK,EAChBC,oBAAoB,KAAK,EACzBC,IAAI,EACJC,eAAe,QAAQ,EACvBC,QAAQ,SAAS,EACjBR,OAAOC,wBAAAA,yBAAAA,cAAe,QAAQ,EAC/B,GAAGH;IACJ,MAAMW,gBAAgBd,KAAKe,QAAQ,CAACJ,MAAM;QAAEK,aAAa;IAAO;IAChE,OAAO;QACL,gCAAgC;QAChCT;QACAE;QACAC;QACAE;QACAC;QACAR;QACAY,UAAUC,QAAQJ,CAAAA,0BAAAA,oCAAAA,cAAeK,QAAQ,KAAI,CAAChB,MAAMgB,QAAQ;QAC5DC,YAAY;YAAEC,MAAM;YAAUV,MAAM;QAAO;QAC3CU,MAAMrB,KAAKsB,MAAM,CAA2BvB,yBAAyBS,IAAIV,mBAAmBK,MAAMK,EAAE,EAAEL,SAAS;YAC7Ga,aAAa;YACbO,cAAc;gBACZnB,KAAKA;gBACLoB,MAAMhB,OAAO,WAAW,WAAWiB;YACrC;QACF;QACAd,MAAMG;IACR;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/Button/useButton.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useButtonContext } from '../../contexts/ButtonContext';\nimport type { ButtonProps, ButtonState } from './Button.types';\nimport { useButtonBase_unstable } from './useButtonBase';\n\n/**\n * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.\n * @param props - User provided props to the Button component.\n * @param ref - User provided ref to be passed to the Button component.\n */\nexport const useButton_unstable = (\n props: ButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ButtonState => {\n const { size: contextSize } = useButtonContext();\n const { appearance = 'secondary', shape = 'rounded', size = contextSize ?? 'medium' } = props;\n const state = useButtonBase_unstable(props, ref);\n\n return {\n // Props passed at the top-level\n appearance,\n shape,\n size,\n ...state,\n };\n};\n"],"names":["React","useButtonContext","useButtonBase_unstable","useButton_unstable","props","ref","size","contextSize","appearance","shape","state"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,gBAAgB,QAAQ,+BAA+B;AAEhE,SAASC,sBAAsB,QAAQ,kBAAkB;AAEzD;;;;CAIC,GACD,OAAO,MAAMC,qBAAqB,CAChCC,OACAC;IAEA,MAAM,EAAEC,MAAMC,WAAW,EAAE,GAAGN;IAC9B,MAAM,EAAEO,aAAa,WAAW,EAAEC,QAAQ,SAAS,EAAEH,OAAOC,wBAAAA,yBAAAA,cAAe,QAAQ,EAAE,GAAGH;IACxF,MAAMM,QAAQR,uBAAuBE,OAAOC;IAE5C,OAAO;QACL,gCAAgC;QAChCG;QACAC;QACAH;QACA,GAAGI,KAAK;IACV;AACF,EAAE"}
@@ -0,0 +1,34 @@
1
+ 'use client';
2
+ import * as React from 'react';
3
+ import { useARIAButtonProps } from '@fluentui/react-aria';
4
+ import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
5
+ /**
6
+ * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.
7
+ * @param props - User provided props to the Button component.
8
+ * @param ref - User provided ref to be passed to the Button component.
9
+ */ export const useButtonBase_unstable = (props, ref)=>{
10
+ const { as = 'button', disabled = false, disabledFocusable = false, icon, iconPosition = 'before' } = props;
11
+ const iconShorthand = slot.optional(icon, {
12
+ elementType: 'span'
13
+ });
14
+ return {
15
+ // Props passed at the top-level
16
+ disabled,
17
+ disabledFocusable,
18
+ iconPosition,
19
+ iconOnly: Boolean((iconShorthand === null || iconShorthand === void 0 ? void 0 : iconShorthand.children) && !props.children),
20
+ // Slots definition
21
+ components: {
22
+ root: 'button',
23
+ icon: 'span'
24
+ },
25
+ root: slot.always(getIntrinsicElementProps(as, useARIAButtonProps(props.as, props)), {
26
+ elementType: 'button',
27
+ defaultProps: {
28
+ ref: ref,
29
+ type: as === 'button' ? 'button' : undefined
30
+ }
31
+ }),
32
+ icon: iconShorthand
33
+ };
34
+ };
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/Button/useButtonBase.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ARIAButtonSlotProps, useARIAButtonProps } from '@fluentui/react-aria';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { ButtonBaseProps, ButtonBaseState } from './Button.types';\n\n/**\n * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.\n * @param props - User provided props to the Button component.\n * @param ref - User provided ref to be passed to the Button component.\n */\nexport const useButtonBase_unstable = (\n props: ButtonBaseProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ButtonBaseState => {\n const { as = 'button', disabled = false, disabledFocusable = false, icon, iconPosition = 'before' } = props;\n const iconShorthand = slot.optional(icon, { elementType: 'span' });\n return {\n // Props passed at the top-level\n disabled,\n disabledFocusable,\n iconPosition,\n iconOnly: Boolean(iconShorthand?.children && !props.children),\n // Slots definition\n components: { root: 'button', icon: 'span' },\n root: slot.always<ARIAButtonSlotProps<'a'>>(getIntrinsicElementProps(as, useARIAButtonProps(props.as, props)), {\n elementType: 'button',\n defaultProps: {\n ref: ref as React.Ref<HTMLButtonElement & HTMLAnchorElement>,\n type: as === 'button' ? 'button' : undefined,\n },\n }),\n icon: iconShorthand,\n };\n};\n"],"names":["React","useARIAButtonProps","getIntrinsicElementProps","slot","useButtonBase_unstable","props","ref","as","disabled","disabledFocusable","icon","iconPosition","iconShorthand","optional","elementType","iconOnly","Boolean","children","components","root","always","defaultProps","type","undefined"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAA8BC,kBAAkB,QAAQ,uBAAuB;AAC/E,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAG3E;;;;CAIC,GACD,OAAO,MAAMC,yBAAyB,CACpCC,OACAC;IAEA,MAAM,EAAEC,KAAK,QAAQ,EAAEC,WAAW,KAAK,EAAEC,oBAAoB,KAAK,EAAEC,IAAI,EAAEC,eAAe,QAAQ,EAAE,GAAGN;IACtG,MAAMO,gBAAgBT,KAAKU,QAAQ,CAACH,MAAM;QAAEI,aAAa;IAAO;IAChE,OAAO;QACL,gCAAgC;QAChCN;QACAC;QACAE;QACAI,UAAUC,QAAQJ,CAAAA,0BAAAA,oCAAAA,cAAeK,QAAQ,KAAI,CAACZ,MAAMY,QAAQ;QAC5D,mBAAmB;QACnBC,YAAY;YAAEC,MAAM;YAAUT,MAAM;QAAO;QAC3CS,MAAMhB,KAAKiB,MAAM,CAA2BlB,yBAAyBK,IAAIN,mBAAmBI,MAAME,EAAE,EAAEF,SAAS;YAC7GS,aAAa;YACbO,cAAc;gBACZf,KAAKA;gBACLgB,MAAMf,OAAO,WAAW,WAAWgB;YACrC;QACF;QACAb,MAAME;IACR;AACF,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CompoundButton/CompoundButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { ButtonProps, ButtonSlots, ButtonState } from '../Button/Button.types';\n\nexport type CompoundButtonSlots = ButtonSlots & {\n /**\n * Second line of text that describes the action this button takes.\n */\n secondaryContent?: Slot<'span'>;\n\n /**\n * Container that wraps the children and the secondaryContent slot.\n */\n contentContainer: NonNullable<Slot<'span'>>;\n};\n\nexport type CompoundButtonProps = ComponentProps<Partial<CompoundButtonSlots>> &\n Pick<ButtonProps, 'appearance' | 'disabledFocusable' | 'disabled' | 'iconPosition' | 'shape' | 'size'>;\n\nexport type CompoundButtonState = ComponentState<CompoundButtonSlots> &\n Omit<ButtonState, keyof ButtonSlots | 'components'>;\n"],"names":[],"mappings":"AAkBA,WACsD"}
1
+ {"version":3,"sources":["../src/components/CompoundButton/CompoundButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, DistributiveOmit, Slot } from '@fluentui/react-utilities';\nimport type { ButtonDesignPropNames, ButtonProps, ButtonSlots, ButtonState } from '../Button/Button.types';\n\nexport type CompoundButtonSlots = ButtonSlots & {\n /**\n * Second line of text that describes the action this button takes.\n */\n secondaryContent?: Slot<'span'>;\n\n /**\n * Container that wraps the children and the secondaryContent slot.\n */\n contentContainer: NonNullable<Slot<'span'>>;\n};\n\nexport type CompoundButtonProps = ComponentProps<Partial<CompoundButtonSlots>> &\n Pick<ButtonProps, 'appearance' | 'disabledFocusable' | 'disabled' | 'iconPosition' | 'shape' | 'size'>;\n\nexport type CompoundButtonBaseProps = DistributiveOmit<CompoundButtonProps, ButtonDesignPropNames>;\n\nexport type CompoundButtonState = ComponentState<CompoundButtonSlots> &\n Omit<ButtonState, keyof ButtonSlots | 'components'>;\n\nexport type CompoundButtonBaseState = DistributiveOmit<CompoundButtonState, ButtonDesignPropNames>;\n"],"names":[],"mappings":"AAuBA,WAAmG"}
@@ -1,4 +1,5 @@
1
1
  export { CompoundButton } from './CompoundButton';
2
2
  export { renderCompoundButton_unstable } from './renderCompoundButton';
3
3
  export { useCompoundButton_unstable } from './useCompoundButton';
4
+ export { useCompoundButtonBase_unstable } from './useCompoundButtonBase';
4
5
  export { compoundButtonClassNames, useCompoundButtonStyles_unstable } from './useCompoundButtonStyles.styles';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CompoundButton/index.ts"],"sourcesContent":["export { CompoundButton } from './CompoundButton';\nexport type { CompoundButtonProps, CompoundButtonSlots, CompoundButtonState } from './CompoundButton.types';\nexport { renderCompoundButton_unstable } from './renderCompoundButton';\nexport { useCompoundButton_unstable } from './useCompoundButton';\nexport { compoundButtonClassNames, useCompoundButtonStyles_unstable } from './useCompoundButtonStyles.styles';\n"],"names":["CompoundButton","renderCompoundButton_unstable","useCompoundButton_unstable","compoundButtonClassNames","useCompoundButtonStyles_unstable"],"mappings":"AAAA,SAASA,cAAc,QAAQ,mBAAmB;AAElD,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,wBAAwB,EAAEC,gCAAgC,QAAQ,mCAAmC"}
1
+ {"version":3,"sources":["../src/components/CompoundButton/index.ts"],"sourcesContent":["export { CompoundButton } from './CompoundButton';\nexport type {\n CompoundButtonBaseProps,\n CompoundButtonProps,\n CompoundButtonSlots,\n CompoundButtonBaseState,\n CompoundButtonState,\n} from './CompoundButton.types';\nexport { renderCompoundButton_unstable } from './renderCompoundButton';\nexport { useCompoundButton_unstable } from './useCompoundButton';\nexport { useCompoundButtonBase_unstable } from './useCompoundButtonBase';\nexport { compoundButtonClassNames, useCompoundButtonStyles_unstable } from './useCompoundButtonStyles.styles';\n"],"names":["CompoundButton","renderCompoundButton_unstable","useCompoundButton_unstable","useCompoundButtonBase_unstable","compoundButtonClassNames","useCompoundButtonStyles_unstable"],"mappings":"AAAA,SAASA,cAAc,QAAQ,mBAAmB;AAQlD,SAASC,6BAA6B,QAAQ,yBAAyB;AACvE,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,8BAA8B,QAAQ,0BAA0B;AACzE,SAASC,wBAAwB,EAAEC,gCAAgC,QAAQ,mCAAmC"}
@@ -1,31 +1,19 @@
1
1
  'use client';
2
2
  import * as React from 'react';
3
- import { slot } from '@fluentui/react-utilities';
4
- import { useButton_unstable } from '../Button/index';
3
+ import { useCompoundButtonBase_unstable } from './useCompoundButtonBase';
4
+ import { useButtonContext } from '../../contexts';
5
5
  /**
6
6
  * Given user props, defines default props for the CompoundButton, calls useButtonState, and returns processed state.
7
7
  * @param props - User provided props to the CompoundButton component.
8
8
  * @param ref - User provided ref to be passed to the CompoundButton component.
9
- */ export const useCompoundButton_unstable = ({ contentContainer, secondaryContent, ...props }, ref)=>{
10
- var _state_icon, _state_secondaryContent;
11
- const state = {
12
- // Button state
13
- ...useButton_unstable(props, ref),
14
- // Slots definition
15
- components: {
16
- root: 'button',
17
- icon: 'span',
18
- contentContainer: 'span',
19
- secondaryContent: 'span'
20
- },
21
- contentContainer: slot.always(contentContainer, {
22
- elementType: 'span'
23
- }),
24
- secondaryContent: slot.optional(secondaryContent, {
25
- elementType: 'span'
26
- })
9
+ */ export const useCompoundButton_unstable = (props, ref)=>{
10
+ const { size: contextSize } = useButtonContext();
11
+ const { appearance = 'secondary', shape = 'rounded', size = contextSize !== null && contextSize !== void 0 ? contextSize : 'medium' } = props;
12
+ const state = useCompoundButtonBase_unstable(props, ref);
13
+ return {
14
+ appearance,
15
+ size,
16
+ shape,
17
+ ...state
27
18
  };
28
- // Recalculate iconOnly to take into account secondaryContent.
29
- state.iconOnly = Boolean(((_state_icon = state.icon) === null || _state_icon === void 0 ? void 0 : _state_icon.children) && !props.children && !((_state_secondaryContent = state.secondaryContent) === null || _state_secondaryContent === void 0 ? void 0 : _state_secondaryContent.children));
30
- return state;
31
19
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/CompoundButton/useCompoundButton.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\nimport { useButton_unstable } from '../Button/index';\nimport type { CompoundButtonProps, CompoundButtonState } from './CompoundButton.types';\n\n/**\n * Given user props, defines default props for the CompoundButton, calls useButtonState, and returns processed state.\n * @param props - User provided props to the CompoundButton component.\n * @param ref - User provided ref to be passed to the CompoundButton component.\n */\nexport const useCompoundButton_unstable = (\n { contentContainer, secondaryContent, ...props }: CompoundButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): CompoundButtonState => {\n const state: CompoundButtonState = {\n // Button state\n ...useButton_unstable(props, ref),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n contentContainer: 'span',\n secondaryContent: 'span',\n },\n contentContainer: slot.always(contentContainer, { elementType: 'span' }),\n secondaryContent: slot.optional(secondaryContent, { elementType: 'span' }),\n };\n\n // Recalculate iconOnly to take into account secondaryContent.\n state.iconOnly = Boolean(state.icon?.children && !props.children && !state.secondaryContent?.children);\n\n return state;\n};\n"],"names":["React","slot","useButton_unstable","useCompoundButton_unstable","contentContainer","secondaryContent","props","ref","state","components","root","icon","always","elementType","optional","iconOnly","Boolean","children"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,4BAA4B;AACjD,SAASC,kBAAkB,QAAQ,kBAAkB;AAGrD;;;;CAIC,GACD,OAAO,MAAMC,6BAA6B,CACxC,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAE,GAAGC,OAA4B,EACrEC;QAkByBC,aAA4CA;IAhBrE,MAAMA,QAA6B;QACjC,eAAe;QACf,GAAGN,mBAAmBI,OAAOC,IAAI;QAEjC,mBAAmB;QACnBE,YAAY;YACVC,MAAM;YACNC,MAAM;YACNP,kBAAkB;YAClBC,kBAAkB;QACpB;QACAD,kBAAkBH,KAAKW,MAAM,CAACR,kBAAkB;YAAES,aAAa;QAAO;QACtER,kBAAkBJ,KAAKa,QAAQ,CAACT,kBAAkB;YAAEQ,aAAa;QAAO;IAC1E;IAEA,8DAA8D;IAC9DL,MAAMO,QAAQ,GAAGC,QAAQR,EAAAA,cAAAA,MAAMG,IAAI,cAAVH,kCAAAA,YAAYS,QAAQ,KAAI,CAACX,MAAMW,QAAQ,IAAI,GAACT,0BAAAA,MAAMH,gBAAgB,cAAtBG,8CAAAA,wBAAwBS,QAAQ;IAErG,OAAOT;AACT,EAAE"}
1
+ {"version":3,"sources":["../src/components/CompoundButton/useCompoundButton.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport type { CompoundButtonProps, CompoundButtonState } from './CompoundButton.types';\nimport { useCompoundButtonBase_unstable } from './useCompoundButtonBase';\nimport { useButtonContext } from '../../contexts';\n\n/**\n * Given user props, defines default props for the CompoundButton, calls useButtonState, and returns processed state.\n * @param props - User provided props to the CompoundButton component.\n * @param ref - User provided ref to be passed to the CompoundButton component.\n */\nexport const useCompoundButton_unstable = (\n props: CompoundButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): CompoundButtonState => {\n const { size: contextSize } = useButtonContext();\n const { appearance = 'secondary', shape = 'rounded', size = contextSize ?? 'medium' } = props;\n const state = useCompoundButtonBase_unstable(props, ref);\n\n return {\n appearance,\n size,\n shape,\n ...state,\n };\n};\n"],"names":["React","useCompoundButtonBase_unstable","useButtonContext","useCompoundButton_unstable","props","ref","size","contextSize","appearance","shape","state"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAE/B,SAASC,8BAA8B,QAAQ,0BAA0B;AACzE,SAASC,gBAAgB,QAAQ,iBAAiB;AAElD;;;;CAIC,GACD,OAAO,MAAMC,6BAA6B,CACxCC,OACAC;IAEA,MAAM,EAAEC,MAAMC,WAAW,EAAE,GAAGL;IAC9B,MAAM,EAAEM,aAAa,WAAW,EAAEC,QAAQ,SAAS,EAAEH,OAAOC,wBAAAA,yBAAAA,cAAe,QAAQ,EAAE,GAAGH;IACxF,MAAMM,QAAQT,+BAA+BG,OAAOC;IAEpD,OAAO;QACLG;QACAF;QACAG;QACA,GAAGC,KAAK;IACV;AACF,EAAE"}
@@ -0,0 +1,31 @@
1
+ 'use client';
2
+ import * as React from 'react';
3
+ import { slot } from '@fluentui/react-utilities';
4
+ import { useButtonBase_unstable } from '../Button/index';
5
+ /**
6
+ * Given user props, defines default props for the CompoundButton, calls useButtonState, and returns processed state.
7
+ * @param props - User provided props to the CompoundButton component.
8
+ * @param ref - User provided ref to be passed to the CompoundButton component.
9
+ */ export const useCompoundButtonBase_unstable = ({ contentContainer, secondaryContent, ...props }, ref)=>{
10
+ var _state_icon, _state_secondaryContent;
11
+ const state = {
12
+ // Button state
13
+ ...useButtonBase_unstable(props, ref),
14
+ // Slots definition
15
+ components: {
16
+ root: 'button',
17
+ icon: 'span',
18
+ contentContainer: 'span',
19
+ secondaryContent: 'span'
20
+ },
21
+ contentContainer: slot.always(contentContainer, {
22
+ elementType: 'span'
23
+ }),
24
+ secondaryContent: slot.optional(secondaryContent, {
25
+ elementType: 'span'
26
+ })
27
+ };
28
+ // Recalculate iconOnly to take into account secondaryContent.
29
+ state.iconOnly = Boolean(((_state_icon = state.icon) === null || _state_icon === void 0 ? void 0 : _state_icon.children) && !props.children && !((_state_secondaryContent = state.secondaryContent) === null || _state_secondaryContent === void 0 ? void 0 : _state_secondaryContent.children));
30
+ return state;
31
+ };
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/CompoundButton/useCompoundButtonBase.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\nimport { useButtonBase_unstable } from '../Button/index';\nimport type { CompoundButtonBaseProps, CompoundButtonBaseState } from './CompoundButton.types';\n\n/**\n * Given user props, defines default props for the CompoundButton, calls useButtonState, and returns processed state.\n * @param props - User provided props to the CompoundButton component.\n * @param ref - User provided ref to be passed to the CompoundButton component.\n */\nexport const useCompoundButtonBase_unstable = (\n { contentContainer, secondaryContent, ...props }: CompoundButtonBaseProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): CompoundButtonBaseState => {\n const state: CompoundButtonBaseState = {\n // Button state\n ...useButtonBase_unstable(props, ref),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n contentContainer: 'span',\n secondaryContent: 'span',\n },\n contentContainer: slot.always(contentContainer, { elementType: 'span' }),\n secondaryContent: slot.optional(secondaryContent, { elementType: 'span' }),\n };\n\n // Recalculate iconOnly to take into account secondaryContent.\n state.iconOnly = Boolean(state.icon?.children && !props.children && !state.secondaryContent?.children);\n\n return state;\n};\n"],"names":["React","slot","useButtonBase_unstable","useCompoundButtonBase_unstable","contentContainer","secondaryContent","props","ref","state","components","root","icon","always","elementType","optional","iconOnly","Boolean","children"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,4BAA4B;AACjD,SAASC,sBAAsB,QAAQ,kBAAkB;AAGzD;;;;CAIC,GACD,OAAO,MAAMC,iCAAiC,CAC5C,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAE,GAAGC,OAAgC,EACzEC;QAkByBC,aAA4CA;IAhBrE,MAAMA,QAAiC;QACrC,eAAe;QACf,GAAGN,uBAAuBI,OAAOC,IAAI;QAErC,mBAAmB;QACnBE,YAAY;YACVC,MAAM;YACNC,MAAM;YACNP,kBAAkB;YAClBC,kBAAkB;QACpB;QACAD,kBAAkBH,KAAKW,MAAM,CAACR,kBAAkB;YAAES,aAAa;QAAO;QACtER,kBAAkBJ,KAAKa,QAAQ,CAACT,kBAAkB;YAAEQ,aAAa;QAAO;IAC1E;IAEA,8DAA8D;IAC9DL,MAAMO,QAAQ,GAAGC,QAAQR,EAAAA,cAAAA,MAAMG,IAAI,cAAVH,kCAAAA,YAAYS,QAAQ,KAAI,CAACX,MAAMW,QAAQ,IAAI,GAACT,0BAAAA,MAAMH,gBAAgB,cAAtBG,8CAAAA,wBAAwBS,QAAQ;IAErG,OAAOT;AACT,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuButton/MenuButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { ButtonProps, ButtonSlots, ButtonState } from '../Button/Button.types';\n\nexport type MenuButtonSlots = ButtonSlots & {\n /**\n * Menu icon that indicates that this button has a menu that can be expanded.\n */\n menuIcon?: Slot<'span'>;\n};\n\nexport type MenuButtonProps = ComponentProps<MenuButtonSlots> &\n Pick<ButtonProps, 'appearance' | 'disabledFocusable' | 'disabled' | 'shape' | 'size'>;\n\nexport type MenuButtonState = ComponentState<MenuButtonSlots> &\n Omit<ButtonState, keyof ButtonSlots | 'components' | 'iconPosition'>;\n"],"names":[],"mappings":"AAaA,WACuE"}
1
+ {"version":3,"sources":["../src/components/MenuButton/MenuButton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, DistributiveOmit, Slot } from '@fluentui/react-utilities';\nimport type { ButtonDesignPropNames, ButtonProps, ButtonSlots, ButtonState } from '../Button/Button.types';\n\nexport type MenuButtonSlots = ButtonSlots & {\n /**\n * Menu icon that indicates that this button has a menu that can be expanded.\n */\n menuIcon?: Slot<'span'>;\n};\n\nexport type MenuButtonProps = ComponentProps<MenuButtonSlots> &\n Pick<ButtonProps, 'appearance' | 'disabledFocusable' | 'disabled' | 'shape' | 'size'>;\n\nexport type MenuButtonBaseProps = DistributiveOmit<MenuButtonProps, ButtonDesignPropNames>;\nexport type MenuButtonState = ComponentState<MenuButtonSlots> &\n Omit<ButtonState, keyof ButtonSlots | 'components' | 'iconPosition'>;\n\nexport type MenuButtonBaseState = DistributiveOmit<MenuButtonState, ButtonDesignPropNames>;\n"],"names":[],"mappings":"AAiBA,WAA2F"}
@@ -1,4 +1,5 @@
1
1
  export { MenuButton } from './MenuButton';
2
2
  export { renderMenuButton_unstable } from './renderMenuButton';
3
3
  export { useMenuButton_unstable } from './useMenuButton';
4
+ export { useMenuButtonBase_unstable } from './useMenuButtonBase';
4
5
  export { menuButtonClassNames, useMenuButtonStyles_unstable } from './useMenuButtonStyles.styles';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuButton/index.ts"],"sourcesContent":["export type { MenuButtonProps, MenuButtonSlots, MenuButtonState } from './MenuButton.types';\nexport { MenuButton } from './MenuButton';\nexport { renderMenuButton_unstable } from './renderMenuButton';\nexport { useMenuButton_unstable } from './useMenuButton';\nexport { menuButtonClassNames, useMenuButtonStyles_unstable } from './useMenuButtonStyles.styles';\n"],"names":["MenuButton","renderMenuButton_unstable","useMenuButton_unstable","menuButtonClassNames","useMenuButtonStyles_unstable"],"mappings":"AACA,SAASA,UAAU,QAAQ,eAAe;AAC1C,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,oBAAoB,EAAEC,4BAA4B,QAAQ,+BAA+B"}
1
+ {"version":3,"sources":["../src/components/MenuButton/index.ts"],"sourcesContent":["export type {\n MenuButtonBaseProps,\n MenuButtonProps,\n MenuButtonSlots,\n MenuButtonBaseState,\n MenuButtonState,\n} from './MenuButton.types';\nexport { MenuButton } from './MenuButton';\nexport { renderMenuButton_unstable } from './renderMenuButton';\nexport { useMenuButton_unstable } from './useMenuButton';\nexport { useMenuButtonBase_unstable } from './useMenuButtonBase';\nexport { menuButtonClassNames, useMenuButtonStyles_unstable } from './useMenuButtonStyles.styles';\n"],"names":["MenuButton","renderMenuButton_unstable","useMenuButton_unstable","useMenuButtonBase_unstable","menuButtonClassNames","useMenuButtonStyles_unstable"],"mappings":"AAOA,SAASA,UAAU,QAAQ,eAAe;AAC1C,SAASC,yBAAyB,QAAQ,qBAAqB;AAC/D,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,oBAAoB,EAAEC,4BAA4B,QAAQ,+BAA+B"}
@@ -1,32 +1,23 @@
1
1
  'use client';
2
2
  import * as React from 'react';
3
3
  import { ChevronDownRegular } from '@fluentui/react-icons';
4
- import { slot } from '@fluentui/react-utilities';
5
- import { useButton_unstable } from '../Button/index';
4
+ import { useButtonContext } from '../../contexts';
5
+ import { useMenuButtonBase_unstable } from './useMenuButtonBase';
6
6
  /**
7
7
  * Given user props, returns the final state for a MenuButton.
8
- */ export const useMenuButton_unstable = ({ menuIcon, ...props }, ref)=>{
8
+ */ export const useMenuButton_unstable = (props, ref)=>{
9
9
  'use no memo';
10
- const buttonState = useButton_unstable(props, ref);
11
- // force aria-expanded to be a boolean, not a string
12
- buttonState.root['aria-expanded'] = props['aria-expanded'] ? props['aria-expanded'] === 'true' || props['aria-expanded'] === true : false;
10
+ const { size: contextSize } = useButtonContext();
11
+ const { appearance = 'secondary', shape = 'rounded', size = contextSize !== null && contextSize !== void 0 ? contextSize : 'medium' } = props;
12
+ const state = useMenuButtonBase_unstable(props, ref);
13
13
  return {
14
- // Button state
15
- ...buttonState,
16
- // State calculated from a set of props
17
- iconOnly: Boolean(!props.children),
18
- // Slots definition
19
- components: {
20
- root: 'button',
21
- icon: 'span',
22
- menuIcon: 'span'
23
- },
24
- menuIcon: slot.optional(menuIcon, {
25
- defaultProps: {
26
- children: /*#__PURE__*/ React.createElement(ChevronDownRegular, null)
27
- },
28
- renderByDefault: true,
29
- elementType: 'span'
30
- })
14
+ appearance,
15
+ size,
16
+ shape,
17
+ ...state,
18
+ menuIcon: {
19
+ children: /*#__PURE__*/ React.createElement(ChevronDownRegular, null),
20
+ ...state.menuIcon
21
+ }
31
22
  };
32
23
  };
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/MenuButton/useMenuButton.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ChevronDownRegular } from '@fluentui/react-icons';\nimport { slot } from '@fluentui/react-utilities';\nimport { useButton_unstable } from '../Button/index';\nimport type { MenuButtonProps, MenuButtonState } from './MenuButton.types';\n\n/**\n * Given user props, returns the final state for a MenuButton.\n */\nexport const useMenuButton_unstable = (\n { menuIcon, ...props }: MenuButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): MenuButtonState => {\n 'use no memo';\n\n const buttonState = useButton_unstable(props, ref);\n // force aria-expanded to be a boolean, not a string\n buttonState.root['aria-expanded'] = props['aria-expanded']\n ? props['aria-expanded'] === 'true' || props['aria-expanded'] === true\n : false;\n\n return {\n // Button state\n ...buttonState,\n\n // State calculated from a set of props\n iconOnly: Boolean(!props.children),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n menuIcon: 'span',\n },\n\n menuIcon: slot.optional(menuIcon, {\n defaultProps: {\n children: <ChevronDownRegular />,\n },\n renderByDefault: true,\n elementType: 'span',\n }),\n };\n};\n"],"names":["React","ChevronDownRegular","slot","useButton_unstable","useMenuButton_unstable","menuIcon","props","ref","buttonState","root","iconOnly","Boolean","children","components","icon","optional","defaultProps","renderByDefault","elementType"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,wBAAwB;AAC3D,SAASC,IAAI,QAAQ,4BAA4B;AACjD,SAASC,kBAAkB,QAAQ,kBAAkB;AAGrD;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CACpC,EAAEC,QAAQ,EAAE,GAAGC,OAAwB,EACvCC;IAEA;IAEA,MAAMC,cAAcL,mBAAmBG,OAAOC;IAC9C,oDAAoD;IACpDC,YAAYC,IAAI,CAAC,gBAAgB,GAAGH,KAAK,CAAC,gBAAgB,GACtDA,KAAK,CAAC,gBAAgB,KAAK,UAAUA,KAAK,CAAC,gBAAgB,KAAK,OAChE;IAEJ,OAAO;QACL,eAAe;QACf,GAAGE,WAAW;QAEd,uCAAuC;QACvCE,UAAUC,QAAQ,CAACL,MAAMM,QAAQ;QAEjC,mBAAmB;QACnBC,YAAY;YACVJ,MAAM;YACNK,MAAM;YACNT,UAAU;QACZ;QAEAA,UAAUH,KAAKa,QAAQ,CAACV,UAAU;YAChCW,cAAc;gBACZJ,wBAAU,oBAACX;YACb;YACAgB,iBAAiB;YACjBC,aAAa;QACf;IACF;AACF,EAAE"}
1
+ {"version":3,"sources":["../src/components/MenuButton/useMenuButton.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { ChevronDownRegular } from '@fluentui/react-icons';\nimport type { MenuButtonProps, MenuButtonState } from './MenuButton.types';\nimport { useButtonContext } from '../../contexts';\nimport { useMenuButtonBase_unstable } from './useMenuButtonBase';\n\n/**\n * Given user props, returns the final state for a MenuButton.\n */\nexport const useMenuButton_unstable = (\n props: MenuButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): MenuButtonState => {\n 'use no memo';\n\n const { size: contextSize } = useButtonContext();\n const { appearance = 'secondary', shape = 'rounded', size = contextSize ?? 'medium' } = props;\n const state = useMenuButtonBase_unstable(props, ref);\n\n return {\n appearance,\n size,\n shape,\n ...state,\n menuIcon: {\n children: <ChevronDownRegular />,\n ...state.menuIcon,\n },\n };\n};\n"],"names":["React","ChevronDownRegular","useButtonContext","useMenuButtonBase_unstable","useMenuButton_unstable","props","ref","size","contextSize","appearance","shape","state","menuIcon","children"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,kBAAkB,QAAQ,wBAAwB;AAE3D,SAASC,gBAAgB,QAAQ,iBAAiB;AAClD,SAASC,0BAA0B,QAAQ,sBAAsB;AAEjE;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CACpCC,OACAC;IAEA;IAEA,MAAM,EAAEC,MAAMC,WAAW,EAAE,GAAGN;IAC9B,MAAM,EAAEO,aAAa,WAAW,EAAEC,QAAQ,SAAS,EAAEH,OAAOC,wBAAAA,yBAAAA,cAAe,QAAQ,EAAE,GAAGH;IACxF,MAAMM,QAAQR,2BAA2BE,OAAOC;IAEhD,OAAO;QACLG;QACAF;QACAG;QACA,GAAGC,KAAK;QACRC,UAAU;YACRC,wBAAU,oBAACZ;YACX,GAAGU,MAAMC,QAAQ;QACnB;IACF;AACF,EAAE"}
@@ -0,0 +1,27 @@
1
+ 'use client';
2
+ import * as React from 'react';
3
+ import { slot } from '@fluentui/react-utilities';
4
+ import { useButtonBase_unstable } from '../Button/index';
5
+ /**
6
+ * Given user props, returns the final state for a MenuButton.
7
+ */ export const useMenuButtonBase_unstable = ({ menuIcon, ...props }, ref)=>{
8
+ 'use no memo';
9
+ const buttonState = useButtonBase_unstable(props, ref);
10
+ // force aria-expanded to be a boolean, not a string
11
+ buttonState.root['aria-expanded'] = props['aria-expanded'] ? props['aria-expanded'] === 'true' || props['aria-expanded'] === true : false;
12
+ return {
13
+ ...buttonState,
14
+ // State calculated from a set of props
15
+ iconOnly: Boolean(!props.children),
16
+ // Slots definition
17
+ components: {
18
+ root: 'button',
19
+ icon: 'span',
20
+ menuIcon: 'span'
21
+ },
22
+ menuIcon: slot.optional(menuIcon, {
23
+ elementType: 'span',
24
+ renderByDefault: true
25
+ })
26
+ };
27
+ };
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/components/MenuButton/useMenuButtonBase.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { slot } from '@fluentui/react-utilities';\nimport { useButtonBase_unstable } from '../Button/index';\nimport type { MenuButtonBaseProps, MenuButtonBaseState } from './MenuButton.types';\n\n/**\n * Given user props, returns the final state for a MenuButton.\n */\nexport const useMenuButtonBase_unstable = (\n { menuIcon, ...props }: MenuButtonBaseProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): MenuButtonBaseState => {\n 'use no memo';\n\n const buttonState = useButtonBase_unstable(props, ref);\n // force aria-expanded to be a boolean, not a string\n buttonState.root['aria-expanded'] = props['aria-expanded']\n ? props['aria-expanded'] === 'true' || props['aria-expanded'] === true\n : false;\n\n return {\n ...buttonState,\n\n // State calculated from a set of props\n iconOnly: Boolean(!props.children),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n menuIcon: 'span',\n },\n\n menuIcon: slot.optional(menuIcon, {\n elementType: 'span',\n renderByDefault: true,\n }),\n };\n};\n"],"names":["React","slot","useButtonBase_unstable","useMenuButtonBase_unstable","menuIcon","props","ref","buttonState","root","iconOnly","Boolean","children","components","icon","optional","elementType","renderByDefault"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,IAAI,QAAQ,4BAA4B;AACjD,SAASC,sBAAsB,QAAQ,kBAAkB;AAGzD;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CACxC,EAAEC,QAAQ,EAAE,GAAGC,OAA4B,EAC3CC;IAEA;IAEA,MAAMC,cAAcL,uBAAuBG,OAAOC;IAClD,oDAAoD;IACpDC,YAAYC,IAAI,CAAC,gBAAgB,GAAGH,KAAK,CAAC,gBAAgB,GACtDA,KAAK,CAAC,gBAAgB,KAAK,UAAUA,KAAK,CAAC,gBAAgB,KAAK,OAChE;IAEJ,OAAO;QACL,GAAGE,WAAW;QAEd,uCAAuC;QACvCE,UAAUC,QAAQ,CAACL,MAAMM,QAAQ;QAEjC,mBAAmB;QACnBC,YAAY;YACVJ,MAAM;YACNK,MAAM;YACNT,UAAU;QACZ;QAEAA,UAAUH,KAAKa,QAAQ,CAACV,UAAU;YAChCW,aAAa;YACbC,iBAAiB;QACnB;IACF;AACF,EAAE"}
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/SplitButton/SplitButton.types.ts"],"sourcesContent":["import { Button } from '../Button/Button';\nimport { MenuButton } from '../MenuButton/MenuButton';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { ButtonProps, ButtonState } from '../Button/Button.types';\nimport type { MenuButtonProps, MenuButtonState } from '../MenuButton/MenuButton.types';\n\nexport type SplitButtonSlots = {\n /**\n * Root of the component that wraps the primary action button and menu button.\n */\n root: NonNullable<Slot<'div'>>;\n\n /**\n * Button that opens menu with secondary actions in SplitButton.\n */\n menuButton?: Slot<typeof MenuButton>;\n /**\n * Button to perform primary action in SplitButton.\n */\n primaryActionButton?: Slot<typeof Button>;\n};\n\nexport type SplitButtonProps = ComponentProps<SplitButtonSlots> &\n Omit<ButtonProps, 'root' | 'as'> &\n Omit<MenuButtonProps, 'root' | 'as'>;\n\nexport type SplitButtonState = ComponentState<SplitButtonSlots> &\n Omit<ButtonState, 'components' | 'iconOnly' | 'root'> &\n Omit<MenuButtonState, 'components' | 'iconOnly' | 'root'>;\n"],"names":[],"mappings":"AA0BA,WAE4D"}
1
+ {"version":3,"sources":["../src/components/SplitButton/SplitButton.types.ts"],"sourcesContent":["import { Button } from '../Button/Button';\nimport { MenuButton } from '../MenuButton/MenuButton';\nimport type { ComponentProps, ComponentState, DistributiveOmit, Slot } from '@fluentui/react-utilities';\nimport type { ButtonDesignPropNames, ButtonProps, ButtonState } from '../Button/Button.types';\nimport type { MenuButtonProps, MenuButtonState } from '../MenuButton/MenuButton.types';\n\nexport type SplitButtonSlots = {\n /**\n * Root of the component that wraps the primary action button and menu button.\n */\n root: NonNullable<Slot<'div'>>;\n\n /**\n * Button that opens menu with secondary actions in SplitButton.\n */\n menuButton?: Slot<typeof MenuButton>;\n /**\n * Button to perform primary action in SplitButton.\n */\n primaryActionButton?: Slot<typeof Button>;\n};\n\nexport type SplitButtonProps = ComponentProps<SplitButtonSlots> &\n Omit<ButtonProps, 'root' | 'as'> &\n Omit<MenuButtonProps, 'root' | 'as'>;\n\nexport type SplitButtonBaseProps = DistributiveOmit<SplitButtonProps, ButtonDesignPropNames>;\n\nexport type SplitButtonState = ComponentState<SplitButtonSlots> &\n Omit<ButtonState, 'components' | 'iconOnly' | 'root'> &\n Omit<MenuButtonState, 'components' | 'iconOnly' | 'root'>;\n\nexport type SplitButtonBaseState = DistributiveOmit<SplitButtonState, ButtonDesignPropNames>;\n"],"names":[],"mappings":"AAgCA,WAA6F"}
@@ -1,4 +1,5 @@
1
1
  export { SplitButton } from './SplitButton';
2
2
  export { renderSplitButton_unstable } from './renderSplitButton';
3
3
  export { useSplitButton_unstable } from './useSplitButton';
4
+ export { useSplitButtonBase_unstable } from './useSplitButtonBase';
4
5
  export { splitButtonClassNames, useSplitButtonStyles_unstable } from './useSplitButtonStyles.styles';
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/components/SplitButton/index.ts"],"sourcesContent":["export { SplitButton } from './SplitButton';\nexport type { SplitButtonProps, SplitButtonSlots, SplitButtonState } from './SplitButton.types';\nexport { renderSplitButton_unstable } from './renderSplitButton';\nexport { useSplitButton_unstable } from './useSplitButton';\nexport { splitButtonClassNames, useSplitButtonStyles_unstable } from './useSplitButtonStyles.styles';\n"],"names":["SplitButton","renderSplitButton_unstable","useSplitButton_unstable","splitButtonClassNames","useSplitButtonStyles_unstable"],"mappings":"AAAA,SAASA,WAAW,QAAQ,gBAAgB;AAE5C,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,qBAAqB,EAAEC,6BAA6B,QAAQ,gCAAgC"}
1
+ {"version":3,"sources":["../src/components/SplitButton/index.ts"],"sourcesContent":["export { SplitButton } from './SplitButton';\nexport type {\n SplitButtonBaseProps,\n SplitButtonProps,\n SplitButtonSlots,\n SplitButtonBaseState,\n SplitButtonState,\n} from './SplitButton.types';\nexport { renderSplitButton_unstable } from './renderSplitButton';\nexport { useSplitButton_unstable } from './useSplitButton';\nexport { useSplitButtonBase_unstable } from './useSplitButtonBase';\nexport { splitButtonClassNames, useSplitButtonStyles_unstable } from './useSplitButtonStyles.styles';\n"],"names":["SplitButton","renderSplitButton_unstable","useSplitButton_unstable","useSplitButtonBase_unstable","splitButtonClassNames","useSplitButtonStyles_unstable"],"mappings":"AAAA,SAASA,WAAW,QAAQ,gBAAgB;AAQ5C,SAASC,0BAA0B,QAAQ,sBAAsB;AACjE,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,qBAAqB,EAAEC,6BAA6B,QAAQ,gCAAgC"}