@fluentui/react-button 9.0.0-nightly.f81b28ceb3.1 → 9.0.0-rc.11

Sign up to get free protection for your applications and to get access to all the features.
Files changed (224) hide show
  1. package/CHANGELOG.json +914 -24
  2. package/CHANGELOG.md +388 -180
  3. package/README.md +80 -18
  4. package/dist/{react-button.d.ts → index.d.ts} +72 -59
  5. package/{lib → dist}/tsdoc-metadata.json +0 -0
  6. package/lib/Button.js.map +1 -1
  7. package/lib/CompoundButton.js.map +1 -1
  8. package/lib/MenuButton.js.map +1 -1
  9. package/lib/SplitButton.js.map +1 -1
  10. package/lib/ToggleButton.js.map +1 -1
  11. package/lib/components/Button/Button.js +7 -7
  12. package/lib/components/Button/Button.js.map +1 -1
  13. package/lib/components/Button/Button.types.js.map +1 -1
  14. package/lib/components/Button/index.js +1 -2
  15. package/lib/components/Button/index.js.map +1 -1
  16. package/lib/components/Button/renderButton.js +13 -9
  17. package/lib/components/Button/renderButton.js.map +1 -1
  18. package/lib/components/Button/useButton.js +20 -25
  19. package/lib/components/Button/useButton.js.map +1 -1
  20. package/lib/components/Button/useButtonStyles.js +240 -165
  21. package/lib/components/Button/useButtonStyles.js.map +1 -1
  22. package/lib/components/CompoundButton/CompoundButton.js +7 -7
  23. package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
  24. package/lib/components/CompoundButton/CompoundButton.types.js.map +1 -1
  25. package/lib/components/CompoundButton/index.js +1 -1
  26. package/lib/components/CompoundButton/index.js.map +1 -1
  27. package/lib/components/CompoundButton/renderCompoundButton.js +15 -9
  28. package/lib/components/CompoundButton/renderCompoundButton.js.map +1 -1
  29. package/lib/components/CompoundButton/useCompoundButton.js +13 -8
  30. package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
  31. package/lib/components/CompoundButton/useCompoundButtonStyles.js +96 -75
  32. package/lib/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
  33. package/lib/components/MenuButton/MenuButton.js +9 -8
  34. package/lib/components/MenuButton/MenuButton.js.map +1 -1
  35. package/lib/components/MenuButton/MenuButton.types.js.map +1 -1
  36. package/lib/components/MenuButton/index.js +1 -1
  37. package/lib/components/MenuButton/index.js.map +1 -1
  38. package/lib/components/MenuButton/renderMenuButton.js +13 -9
  39. package/lib/components/MenuButton/renderMenuButton.js.map +1 -1
  40. package/lib/components/MenuButton/useMenuButton.js +11 -11
  41. package/lib/components/MenuButton/useMenuButton.js.map +1 -1
  42. package/lib/components/MenuButton/useMenuButtonStyles.js +39 -17
  43. package/lib/components/MenuButton/useMenuButtonStyles.js.map +1 -1
  44. package/lib/components/SplitButton/SplitButton.js +8 -8
  45. package/lib/components/SplitButton/SplitButton.js.map +1 -1
  46. package/lib/components/SplitButton/SplitButton.types.js.map +1 -1
  47. package/lib/components/SplitButton/index.js +1 -1
  48. package/lib/components/SplitButton/index.js.map +1 -1
  49. package/lib/components/SplitButton/renderSplitButton.js +9 -7
  50. package/lib/components/SplitButton/renderSplitButton.js.map +1 -1
  51. package/lib/components/SplitButton/useSplitButton.js +54 -49
  52. package/lib/components/SplitButton/useSplitButton.js.map +1 -1
  53. package/lib/components/SplitButton/useSplitButtonStyles.js +46 -39
  54. package/lib/components/SplitButton/useSplitButtonStyles.js.map +1 -1
  55. package/lib/components/ToggleButton/ToggleButton.js +7 -7
  56. package/lib/components/ToggleButton/ToggleButton.js.map +1 -1
  57. package/lib/components/ToggleButton/ToggleButton.types.js.map +1 -1
  58. package/lib/components/ToggleButton/index.js +1 -1
  59. package/lib/components/ToggleButton/index.js.map +1 -1
  60. package/lib/components/ToggleButton/renderToggleButton.js +1 -1
  61. package/lib/components/ToggleButton/renderToggleButton.js.map +1 -1
  62. package/lib/components/ToggleButton/useToggleButton.js +5 -41
  63. package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
  64. package/lib/components/ToggleButton/useToggleButtonStyles.js +110 -86
  65. package/lib/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
  66. package/lib/index.js +6 -5
  67. package/lib/index.js.map +1 -1
  68. package/lib/utils/index.js +2 -0
  69. package/lib/utils/index.js.map +1 -0
  70. package/lib/utils/useToggleState.js +37 -0
  71. package/lib/utils/useToggleState.js.map +1 -0
  72. package/lib-commonjs/Button.js +1 -1
  73. package/lib-commonjs/Button.js.map +1 -1
  74. package/lib-commonjs/CompoundButton.js +1 -1
  75. package/lib-commonjs/CompoundButton.js.map +1 -1
  76. package/lib-commonjs/MenuButton.js +1 -1
  77. package/lib-commonjs/MenuButton.js.map +1 -1
  78. package/lib-commonjs/SplitButton.js +1 -1
  79. package/lib-commonjs/SplitButton.js.map +1 -1
  80. package/lib-commonjs/ToggleButton.js +1 -1
  81. package/lib-commonjs/ToggleButton.js.map +1 -1
  82. package/lib-commonjs/components/Button/Button.js +8 -8
  83. package/lib-commonjs/components/Button/Button.js.map +1 -1
  84. package/lib-commonjs/components/Button/Button.types.js.map +1 -1
  85. package/lib-commonjs/components/Button/index.js +10 -6
  86. package/lib-commonjs/components/Button/index.js.map +1 -1
  87. package/lib-commonjs/components/Button/renderButton.js +17 -14
  88. package/lib-commonjs/components/Button/renderButton.js.map +1 -1
  89. package/lib-commonjs/components/Button/useButton.js +24 -29
  90. package/lib-commonjs/components/Button/useButton.js.map +1 -1
  91. package/lib-commonjs/components/Button/useButtonStyles.js +243 -166
  92. package/lib-commonjs/components/Button/useButtonStyles.js.map +1 -1
  93. package/lib-commonjs/components/CompoundButton/CompoundButton.js +8 -8
  94. package/lib-commonjs/components/CompoundButton/CompoundButton.js.map +1 -1
  95. package/lib-commonjs/components/CompoundButton/CompoundButton.types.js.map +1 -1
  96. package/lib-commonjs/components/CompoundButton/index.js +10 -4
  97. package/lib-commonjs/components/CompoundButton/index.js.map +1 -1
  98. package/lib-commonjs/components/CompoundButton/renderCompoundButton.js +19 -14
  99. package/lib-commonjs/components/CompoundButton/renderCompoundButton.js.map +1 -1
  100. package/lib-commonjs/components/CompoundButton/useCompoundButton.js +16 -12
  101. package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
  102. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js +99 -77
  103. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
  104. package/lib-commonjs/components/MenuButton/MenuButton.js +10 -9
  105. package/lib-commonjs/components/MenuButton/MenuButton.js.map +1 -1
  106. package/lib-commonjs/components/MenuButton/MenuButton.types.js.map +1 -1
  107. package/lib-commonjs/components/MenuButton/index.js +10 -4
  108. package/lib-commonjs/components/MenuButton/index.js.map +1 -1
  109. package/lib-commonjs/components/MenuButton/renderMenuButton.js +17 -14
  110. package/lib-commonjs/components/MenuButton/renderMenuButton.js.map +1 -1
  111. package/lib-commonjs/components/MenuButton/useMenuButton.js +15 -16
  112. package/lib-commonjs/components/MenuButton/useMenuButton.js.map +1 -1
  113. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js +43 -19
  114. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js.map +1 -1
  115. package/lib-commonjs/components/SplitButton/SplitButton.js +9 -9
  116. package/lib-commonjs/components/SplitButton/SplitButton.js.map +1 -1
  117. package/lib-commonjs/components/SplitButton/SplitButton.types.js.map +1 -1
  118. package/lib-commonjs/components/SplitButton/index.js +10 -4
  119. package/lib-commonjs/components/SplitButton/index.js.map +1 -1
  120. package/lib-commonjs/components/SplitButton/renderSplitButton.js +13 -12
  121. package/lib-commonjs/components/SplitButton/renderSplitButton.js.map +1 -1
  122. package/lib-commonjs/components/SplitButton/useSplitButton.js +58 -54
  123. package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
  124. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js +50 -42
  125. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js.map +1 -1
  126. package/lib-commonjs/components/ToggleButton/ToggleButton.js +8 -8
  127. package/lib-commonjs/components/ToggleButton/ToggleButton.js.map +1 -1
  128. package/lib-commonjs/components/ToggleButton/ToggleButton.types.js.map +1 -1
  129. package/lib-commonjs/components/ToggleButton/index.js +10 -4
  130. package/lib-commonjs/components/ToggleButton/index.js.map +1 -1
  131. package/lib-commonjs/components/ToggleButton/renderToggleButton.js +3 -3
  132. package/lib-commonjs/components/ToggleButton/renderToggleButton.js.map +1 -1
  133. package/lib-commonjs/components/ToggleButton/useToggleButton.js +7 -45
  134. package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
  135. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js +114 -86
  136. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
  137. package/lib-commonjs/index.js +169 -6
  138. package/lib-commonjs/index.js.map +1 -1
  139. package/lib-commonjs/utils/index.js +10 -0
  140. package/lib-commonjs/utils/index.js.map +1 -0
  141. package/lib-commonjs/utils/useToggleState.js +48 -0
  142. package/lib-commonjs/utils/useToggleState.js.map +1 -0
  143. package/package.json +22 -27
  144. package/dist/demo/index.html +0 -71
  145. package/dist/demo/react-dom.development.js +0 -21413
  146. package/dist/demo/react.development.js +0 -3155
  147. package/lib/Button.d.ts +0 -1
  148. package/lib/CompoundButton.d.ts +0 -1
  149. package/lib/MenuButton.d.ts +0 -1
  150. package/lib/SplitButton.d.ts +0 -1
  151. package/lib/ToggleButton.d.ts +0 -1
  152. package/lib/common/isConformant.d.ts +0 -4
  153. package/lib/common/isConformant.js +0 -13
  154. package/lib/common/isConformant.js.map +0 -1
  155. package/lib/components/Button/Button.d.ts +0 -6
  156. package/lib/components/Button/Button.types.d.ts +0 -62
  157. package/lib/components/Button/index.d.ts +0 -5
  158. package/lib/components/Button/renderButton.d.ts +0 -5
  159. package/lib/components/Button/useButton.d.ts +0 -8
  160. package/lib/components/Button/useButtonStyles.d.ts +0 -10
  161. package/lib/components/CompoundButton/CompoundButton.d.ts +0 -6
  162. package/lib/components/CompoundButton/CompoundButton.types.d.ts +0 -14
  163. package/lib/components/CompoundButton/index.d.ts +0 -5
  164. package/lib/components/CompoundButton/renderCompoundButton.d.ts +0 -5
  165. package/lib/components/CompoundButton/useCompoundButton.d.ts +0 -8
  166. package/lib/components/CompoundButton/useCompoundButtonStyles.d.ts +0 -2
  167. package/lib/components/MenuButton/MenuButton.d.ts +0 -6
  168. package/lib/components/MenuButton/MenuButton.types.d.ts +0 -11
  169. package/lib/components/MenuButton/index.d.ts +0 -5
  170. package/lib/components/MenuButton/renderMenuButton.d.ts +0 -5
  171. package/lib/components/MenuButton/useMenuButton.d.ts +0 -6
  172. package/lib/components/MenuButton/useMenuButtonStyles.d.ts +0 -2
  173. package/lib/components/SplitButton/SplitButton.d.ts +0 -7
  174. package/lib/components/SplitButton/SplitButton.types.d.ts +0 -19
  175. package/lib/components/SplitButton/index.d.ts +0 -5
  176. package/lib/components/SplitButton/renderSplitButton.d.ts +0 -5
  177. package/lib/components/SplitButton/useSplitButton.d.ts +0 -8
  178. package/lib/components/SplitButton/useSplitButtonStyles.d.ts +0 -2
  179. package/lib/components/ToggleButton/ToggleButton.d.ts +0 -6
  180. package/lib/components/ToggleButton/ToggleButton.types.d.ts +0 -19
  181. package/lib/components/ToggleButton/index.d.ts +0 -5
  182. package/lib/components/ToggleButton/renderToggleButton.d.ts +0 -1
  183. package/lib/components/ToggleButton/useToggleButton.d.ts +0 -9
  184. package/lib/components/ToggleButton/useToggleButtonStyles.d.ts +0 -2
  185. package/lib/index.d.ts +0 -5
  186. package/lib-commonjs/Button.d.ts +0 -1
  187. package/lib-commonjs/CompoundButton.d.ts +0 -1
  188. package/lib-commonjs/MenuButton.d.ts +0 -1
  189. package/lib-commonjs/SplitButton.d.ts +0 -1
  190. package/lib-commonjs/ToggleButton.d.ts +0 -1
  191. package/lib-commonjs/common/isConformant.d.ts +0 -4
  192. package/lib-commonjs/common/isConformant.js +0 -24
  193. package/lib-commonjs/common/isConformant.js.map +0 -1
  194. package/lib-commonjs/components/Button/Button.d.ts +0 -6
  195. package/lib-commonjs/components/Button/Button.types.d.ts +0 -62
  196. package/lib-commonjs/components/Button/index.d.ts +0 -5
  197. package/lib-commonjs/components/Button/renderButton.d.ts +0 -5
  198. package/lib-commonjs/components/Button/useButton.d.ts +0 -8
  199. package/lib-commonjs/components/Button/useButtonStyles.d.ts +0 -10
  200. package/lib-commonjs/components/CompoundButton/CompoundButton.d.ts +0 -6
  201. package/lib-commonjs/components/CompoundButton/CompoundButton.types.d.ts +0 -14
  202. package/lib-commonjs/components/CompoundButton/index.d.ts +0 -5
  203. package/lib-commonjs/components/CompoundButton/renderCompoundButton.d.ts +0 -5
  204. package/lib-commonjs/components/CompoundButton/useCompoundButton.d.ts +0 -8
  205. package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.d.ts +0 -2
  206. package/lib-commonjs/components/MenuButton/MenuButton.d.ts +0 -6
  207. package/lib-commonjs/components/MenuButton/MenuButton.types.d.ts +0 -11
  208. package/lib-commonjs/components/MenuButton/index.d.ts +0 -5
  209. package/lib-commonjs/components/MenuButton/renderMenuButton.d.ts +0 -5
  210. package/lib-commonjs/components/MenuButton/useMenuButton.d.ts +0 -6
  211. package/lib-commonjs/components/MenuButton/useMenuButtonStyles.d.ts +0 -2
  212. package/lib-commonjs/components/SplitButton/SplitButton.d.ts +0 -7
  213. package/lib-commonjs/components/SplitButton/SplitButton.types.d.ts +0 -19
  214. package/lib-commonjs/components/SplitButton/index.d.ts +0 -5
  215. package/lib-commonjs/components/SplitButton/renderSplitButton.d.ts +0 -5
  216. package/lib-commonjs/components/SplitButton/useSplitButton.d.ts +0 -8
  217. package/lib-commonjs/components/SplitButton/useSplitButtonStyles.d.ts +0 -2
  218. package/lib-commonjs/components/ToggleButton/ToggleButton.d.ts +0 -6
  219. package/lib-commonjs/components/ToggleButton/ToggleButton.types.d.ts +0 -19
  220. package/lib-commonjs/components/ToggleButton/index.d.ts +0 -5
  221. package/lib-commonjs/components/ToggleButton/renderToggleButton.d.ts +0 -1
  222. package/lib-commonjs/components/ToggleButton/useToggleButton.d.ts +0 -9
  223. package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.d.ts +0 -2
  224. package/lib-commonjs/index.d.ts +0 -5
package/lib/Button.d.ts DELETED
@@ -1 +0,0 @@
1
- export * from './components/Button/index';
@@ -1 +0,0 @@
1
- export * from './components/CompoundButton/index';
@@ -1 +0,0 @@
1
- export * from './components/MenuButton/index';
@@ -1 +0,0 @@
1
- export * from './components/SplitButton/index';
@@ -1 +0,0 @@
1
- export * from './components/ToggleButton/index';
@@ -1,4 +0,0 @@
1
- import type { IsConformantOptions } from '@fluentui/react-conformance';
2
- export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
3
- componentPath?: string;
4
- }): void;
@@ -1,13 +0,0 @@
1
- import { isConformant as baseIsConformant } from '@fluentui/react-conformance';
2
- import makeStylesTests from '@fluentui/react-conformance-make-styles';
3
- export function isConformant(testInfo) {
4
- var defaultOptions = {
5
- asPropHandlesRef: true,
6
- componentPath: module.parent.filename.replace('.test', ''),
7
- disabledTests: ['has-docblock', 'kebab-aria-attributes'],
8
- extraTests: makeStylesTests,
9
- skipAsPropTests: true
10
- };
11
- baseIsConformant(defaultOptions, testInfo);
12
- }
13
- //# sourceMappingURL=isConformant.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":"AAAA,SAAS,YAAY,IAAI,gBAAzB,QAAiD,6BAAjD;AAEA,OAAO,eAAP,MAA4B,yCAA5B;AAEA,OAAM,SAAU,YAAV,CACJ,QADI,EACqF;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D,IAAA,aAAa,EAAE,CAAC,cAAD,EAAiB,uBAAjB,CAH4C;AAI3D,IAAA,UAAU,EAAE,eAJ+C;AAK3D,IAAA,eAAe,EAAE;AAL0C,GAA7D;AAQA,EAAA,gBAAgB,CAAC,cAAD,EAAiB,QAAjB,CAAhB;AACD","sourceRoot":""}
@@ -1,6 +0,0 @@
1
- import type { ButtonProps } from './Button.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * Buttons give people a way to trigger an action.
5
- */
6
- export declare const Button: ForwardRefComponent<ButtonProps>;
@@ -1,62 +0,0 @@
1
- import { ARIAButtonShorthandProps } from '@fluentui/react-aria';
2
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
3
- export declare type ButtonSlots = {
4
- /**
5
- * Root of the component that renders as either a <button> tag.
6
- */
7
- root: ARIAButtonShorthandProps;
8
- /**
9
- * Icon that renders either before or after the `children` as specified by the `iconPosition` prop.
10
- */
11
- icon?: IntrinsicShorthandProps<'span'>;
12
- };
13
- export declare type ButtonCommons = {
14
- /**
15
- * A button can have its content and borders styled for greater emphasis or to be subtle.
16
- * - 'primary': Emphasizes the button as a primary action.
17
- * - 'outline': Removes background styling.
18
- * - 'subtle': Minimizes emphasis to blend into the background until hovered or focused.
19
- * - 'transparent': Removes background and border styling.
20
- */
21
- appearance?: 'primary' | 'outline' | 'subtle' | 'transparent';
22
- /**
23
- * A button can fill the width of its container.
24
- * @default false
25
- */
26
- block: boolean;
27
- /**
28
- * When set, allows the button to be focusable even when it has been disabled. This is used in scenarios where it
29
- * is important to keep a consistent tab order for screen reader and keyboard users. The primary example of this
30
- * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.
31
- * @default false
32
- */
33
- disabledFocusable: boolean;
34
- /**
35
- * A button can show that it cannot be interacted with.
36
- * @default false
37
- */
38
- disabled: boolean;
39
- /**
40
- * A button can format its icon to appear before or after its content.
41
- * @default 'before'
42
- */
43
- iconPosition: 'before' | 'after';
44
- /**
45
- * A button can be rounded, circular, or square.
46
- * @default 'rounded'
47
- */
48
- shape: 'rounded' | 'circular' | 'square';
49
- /**
50
- * A button supports different sizes.
51
- * @default 'medium'
52
- */
53
- size: 'small' | 'medium' | 'large';
54
- };
55
- export declare type ButtonProps = ComponentProps<ButtonSlots> & Partial<ButtonCommons>;
56
- export declare type ButtonState = ComponentState<ButtonSlots> & ButtonCommons & {
57
- /**
58
- * A button can contain only an icon.
59
- * @default false
60
- */
61
- iconOnly: boolean;
62
- };
@@ -1,5 +0,0 @@
1
- export * from './Button';
2
- export * from './Button.types';
3
- export * from './renderButton';
4
- export * from './useButton';
5
- export { useButtonStyles } from './useButtonStyles';
@@ -1,5 +0,0 @@
1
- import type { ButtonState } from './Button.types';
2
- /**
3
- * Renders a Button component by passing the state defined props to the appropriate slots.
4
- */
5
- export declare const renderButton: (state: ButtonState) => JSX.Element;
@@ -1,8 +0,0 @@
1
- import * as React from 'react';
2
- import type { ButtonProps, ButtonState } from './Button.types';
3
- /**
4
- * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.
5
- * @param props - User provided props to the Button component.
6
- * @param ref - User provided ref to be passed to the Button component.
7
- */
8
- export declare const useButton: (props: ButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => ButtonState;
@@ -1,10 +0,0 @@
1
- import type { ButtonState } from './Button.types';
2
- export declare const buttonSpacing: {
3
- smallest: string;
4
- smaller: string;
5
- small: string;
6
- medium: string;
7
- large: string;
8
- larger: string;
9
- };
10
- export declare const useButtonStyles: (state: ButtonState) => ButtonState;
@@ -1,6 +0,0 @@
1
- import type { CompoundButtonProps } from './CompoundButton.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * CompoundButtons are buttons that can have secondary content that adds extra information to the user.
5
- */
6
- export declare const CompoundButton: ForwardRefComponent<CompoundButtonProps>;
@@ -1,14 +0,0 @@
1
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
2
- import type { ButtonCommons, ButtonSlots, ButtonState } from '../Button/Button.types';
3
- export declare type CompoundButtonSlots = ButtonSlots & {
4
- /**
5
- * Second line of text that describes the action this button takes.
6
- */
7
- secondaryContent?: IntrinsicShorthandProps<'span'>;
8
- /**
9
- * Container that wraps the children and the secondaryContent slot.
10
- */
11
- contentContainer: IntrinsicShorthandProps<'span'>;
12
- };
13
- export declare type CompoundButtonProps = ComponentProps<CompoundButtonSlots> & Partial<ButtonCommons>;
14
- export declare type CompoundButtonState = ComponentState<CompoundButtonSlots> & Omit<ButtonState, keyof ButtonSlots | 'components'>;
@@ -1,5 +0,0 @@
1
- export * from './CompoundButton';
2
- export * from './CompoundButton.types';
3
- export * from './renderCompoundButton';
4
- export * from './useCompoundButton';
5
- export { useCompoundButtonStyles } from './useCompoundButtonStyles';
@@ -1,5 +0,0 @@
1
- import type { CompoundButtonState } from './CompoundButton.types';
2
- /**
3
- * Renders a CompoundButton component by passing the state defined props to the appropriate slots.
4
- */
5
- export declare const renderCompoundButton: (state: CompoundButtonState) => JSX.Element;
@@ -1,8 +0,0 @@
1
- import * as React from 'react';
2
- import type { CompoundButtonProps, CompoundButtonState } from './CompoundButton.types';
3
- /**
4
- * Given user props, defines default props for the CompoundButton, calls useButtonState, and returns processed state.
5
- * @param props - User provided props to the CompoundButton component.
6
- * @param ref - User provided ref to be passed to the CompoundButton component.
7
- */
8
- export declare const useCompoundButton: ({ contentContainer, secondaryContent, ...props }: CompoundButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => CompoundButtonState;
@@ -1,2 +0,0 @@
1
- import type { CompoundButtonState } from './CompoundButton.types';
2
- export declare const useCompoundButtonStyles: (state: CompoundButtonState) => CompoundButtonState;
@@ -1,6 +0,0 @@
1
- import type { MenuButtonProps } from './MenuButton.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * MenuButtons are buttons that handle opening and closing a menu when they are triggered.
5
- */
6
- export declare const MenuButton: ForwardRefComponent<MenuButtonProps>;
@@ -1,11 +0,0 @@
1
- import type { MenuTriggerChildProps } from '@fluentui/react-menu';
2
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
3
- import type { ButtonCommons, ButtonSlots, ButtonState } from '../Button/Button.types';
4
- export declare type MenuButtonSlots = ButtonSlots & {
5
- /**
6
- * Menu icon that indicates that this button has a menu that can be expanded.
7
- */
8
- menuIcon?: IntrinsicShorthandProps<'span'>;
9
- };
10
- export declare type MenuButtonProps = ComponentProps<MenuButtonSlots> & Partial<Omit<ButtonCommons, 'iconPosition'>> & Partial<MenuTriggerChildProps>;
11
- export declare type MenuButtonState = ComponentState<MenuButtonSlots> & Omit<ButtonState, keyof ButtonSlots | 'components' | 'iconPosition'>;
@@ -1,5 +0,0 @@
1
- export * from './MenuButton.types';
2
- export * from './MenuButton';
3
- export * from './renderMenuButton';
4
- export * from './useMenuButton';
5
- export { useMenuButtonStyles } from './useMenuButtonStyles';
@@ -1,5 +0,0 @@
1
- import type { MenuButtonState } from './MenuButton.types';
2
- /**
3
- * Renders a MenuButton component by passing the state defined props to the appropriate slots.
4
- */
5
- export declare const renderMenuButton: (state: MenuButtonState) => JSX.Element;
@@ -1,6 +0,0 @@
1
- import * as React from 'react';
2
- import type { MenuButtonProps, MenuButtonState } from './MenuButton.types';
3
- /**
4
- * Given user props, returns the final state for a MenuButton.
5
- */
6
- export declare const useMenuButton: ({ menuIcon, ...props }: MenuButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => MenuButtonState;
@@ -1,2 +0,0 @@
1
- import type { MenuButtonState } from './MenuButton.types';
2
- export declare const useMenuButtonStyles: (state: MenuButtonState) => MenuButtonState;
@@ -1,7 +0,0 @@
1
- import type { SplitButtonProps } from './SplitButton.types';
2
- import { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * SplitButtons are a grouping of two interactive surfaces where the interacting with the first one triggers a primary
5
- * action, while interacting with the second one opens a menu with secondary actions.
6
- */
7
- export declare const SplitButton: ForwardRefComponent<SplitButtonProps>;
@@ -1,19 +0,0 @@
1
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps, ObjectShorthandProps } from '@fluentui/react-utilities';
2
- import type { ButtonProps, ButtonState } from '../Button/Button.types';
3
- import type { MenuButtonProps, MenuButtonState } from '../MenuButton/MenuButton.types';
4
- export declare type SplitButtonSlots = {
5
- /**
6
- * Root of the component that wraps the primary action button and menu button.
7
- */
8
- root: IntrinsicShorthandProps<'div'>;
9
- /**
10
- * Button that opens menu with secondary actions in SplitButton.
11
- */
12
- menuButton?: ObjectShorthandProps<MenuButtonProps>;
13
- /**
14
- * Button to perform primary action in SplitButton.
15
- */
16
- primaryActionButton?: ObjectShorthandProps<ButtonProps>;
17
- };
18
- export declare type SplitButtonProps = ComponentProps<SplitButtonSlots> & Omit<ButtonProps, 'root'> & Omit<MenuButtonProps, 'root'>;
19
- export declare type SplitButtonState = ComponentState<SplitButtonSlots> & Omit<ButtonState, 'components' | 'iconOnly' | 'root'> & Omit<MenuButtonState, 'components' | 'iconOnly' | 'root'>;
@@ -1,5 +0,0 @@
1
- export * from './SplitButton';
2
- export * from './SplitButton.types';
3
- export * from './renderSplitButton';
4
- export * from './useSplitButton';
5
- export { useSplitButtonStyles } from './useSplitButtonStyles';
@@ -1,5 +0,0 @@
1
- import type { SplitButtonState } from './SplitButton.types';
2
- /**
3
- * Renders a SplitButton component by passing the state defined props to the appropriate slots.
4
- */
5
- export declare const renderSplitButton: (state: SplitButtonState) => JSX.Element;
@@ -1,8 +0,0 @@
1
- import * as React from 'react';
2
- import type { SplitButtonProps, SplitButtonState } from './SplitButton.types';
3
- /**
4
- * Given user props, defines default props for the SplitButton and returns processed state.
5
- * @param props - User provided props to the SplitButton component.
6
- * @param ref - User provided ref to be passed to the SplitButton component.
7
- */
8
- export declare const useSplitButton: (props: SplitButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => SplitButtonState;
@@ -1,2 +0,0 @@
1
- import type { SplitButtonState } from './SplitButton.types';
2
- export declare const useSplitButtonStyles: (state: SplitButtonState) => SplitButtonState;
@@ -1,6 +0,0 @@
1
- import type { ToggleButtonProps } from './ToggleButton.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * ToggleButtons are buttons that toggle between two defined states when triggered.
5
- */
6
- export declare const ToggleButton: ForwardRefComponent<ToggleButtonProps>;
@@ -1,19 +0,0 @@
1
- import type { ButtonProps, ButtonState } from '../Button/Button.types';
2
- export declare type ToggleButtonCommons = {
3
- /**
4
- * Defines the controlled checked state of the `ToggleButton`.
5
- * If passed, `ToggleButton` ignores the `defaultChecked` property.
6
- * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the
7
- * correct value based on handling `onClick` events and re-rendering.
8
- * @default false
9
- */
10
- checked: boolean;
11
- };
12
- export declare type ToggleButtonProps = ButtonProps & Partial<ToggleButtonCommons> & {
13
- /**
14
- * Defines whether the `ToggleButton` is initially in a checked state or not when rendered.
15
- * @default false
16
- */
17
- defaultChecked?: boolean;
18
- };
19
- export declare type ToggleButtonState = ButtonState & ToggleButtonCommons;
@@ -1,5 +0,0 @@
1
- export * from './ToggleButton';
2
- export * from './ToggleButton.types';
3
- export * from './renderToggleButton';
4
- export * from './useToggleButton';
5
- export { useToggleButtonStyles } from './useToggleButtonStyles';
@@ -1 +0,0 @@
1
- export { renderButton as renderToggleButton } from '../Button/renderButton';
@@ -1,9 +0,0 @@
1
- import * as React from 'react';
2
- import type { ToggleButtonProps, ToggleButtonState } from './ToggleButton.types';
3
- /**
4
- * Given user props, defines default props for the ToggleButton, calls useButtonState and useChecked, and returns
5
- * processed state.
6
- * @param props - User provided props to the ToggleButton component.
7
- * @param ref - User provided ref to be passed to the ToggleButton component.
8
- */
9
- export declare const useToggleButton: ({ checked, defaultChecked, ...props }: ToggleButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => ToggleButtonState;
@@ -1,2 +0,0 @@
1
- import type { ToggleButtonState } from './ToggleButton.types';
2
- export declare const useToggleButtonStyles: (state: ToggleButtonState) => ToggleButtonState;
package/lib/index.d.ts DELETED
@@ -1,5 +0,0 @@
1
- export * from './Button';
2
- export * from './CompoundButton';
3
- export * from './MenuButton';
4
- export * from './SplitButton';
5
- export * from './ToggleButton';
@@ -1 +0,0 @@
1
- export * from './components/Button/index';
@@ -1 +0,0 @@
1
- export * from './components/CompoundButton/index';
@@ -1 +0,0 @@
1
- export * from './components/MenuButton/index';
@@ -1 +0,0 @@
1
- export * from './components/SplitButton/index';
@@ -1 +0,0 @@
1
- export * from './components/ToggleButton/index';
@@ -1,4 +0,0 @@
1
- import type { IsConformantOptions } from '@fluentui/react-conformance';
2
- export declare function isConformant<TProps = {}>(testInfo: Omit<IsConformantOptions<TProps>, 'componentPath'> & {
3
- componentPath?: string;
4
- }): void;
@@ -1,24 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.isConformant = void 0;
7
-
8
- var react_conformance_1 = /*#__PURE__*/require("@fluentui/react-conformance");
9
-
10
- var react_conformance_make_styles_1 = /*#__PURE__*/require("@fluentui/react-conformance-make-styles");
11
-
12
- function isConformant(testInfo) {
13
- var defaultOptions = {
14
- asPropHandlesRef: true,
15
- componentPath: module.parent.filename.replace('.test', ''),
16
- disabledTests: ['has-docblock', 'kebab-aria-attributes'],
17
- extraTests: react_conformance_make_styles_1.default,
18
- skipAsPropTests: true
19
- };
20
- react_conformance_1.isConformant(defaultOptions, testInfo);
21
- }
22
-
23
- exports.isConformant = isConformant;
24
- //# sourceMappingURL=isConformant.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../../src/common/isConformant.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,mBAAA,gBAAA,OAAA,CAAA,6BAAA,CAAA;;AAEA,IAAA,+BAAA,gBAAA,OAAA,CAAA,yCAAA,CAAA;;AAEA,SAAgB,YAAhB,CACE,QADF,EAC2F;AAEzF,MAAM,cAAc,GAAyC;AAC3D,IAAA,gBAAgB,EAAE,IADyC;AAE3D,IAAA,aAAa,EAAE,MAAO,CAAC,MAAR,CAAgB,QAAhB,CAAyB,OAAzB,CAAiC,OAAjC,EAA0C,EAA1C,CAF4C;AAG3D,IAAA,aAAa,EAAE,CAAC,cAAD,EAAiB,uBAAjB,CAH4C;AAI3D,IAAA,UAAU,EAAE,+BAAA,CAAA,OAJ+C;AAK3D,IAAA,eAAe,EAAE;AAL0C,GAA7D;AAQA,EAAA,mBAAA,CAAA,YAAA,CAAiB,cAAjB,EAAiC,QAAjC;AACD;;AAZD,OAAA,CAAA,YAAA,GAAA,YAAA","sourceRoot":""}
@@ -1,6 +0,0 @@
1
- import type { ButtonProps } from './Button.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * Buttons give people a way to trigger an action.
5
- */
6
- export declare const Button: ForwardRefComponent<ButtonProps>;
@@ -1,62 +0,0 @@
1
- import { ARIAButtonShorthandProps } from '@fluentui/react-aria';
2
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
3
- export declare type ButtonSlots = {
4
- /**
5
- * Root of the component that renders as either a <button> tag.
6
- */
7
- root: ARIAButtonShorthandProps;
8
- /**
9
- * Icon that renders either before or after the `children` as specified by the `iconPosition` prop.
10
- */
11
- icon?: IntrinsicShorthandProps<'span'>;
12
- };
13
- export declare type ButtonCommons = {
14
- /**
15
- * A button can have its content and borders styled for greater emphasis or to be subtle.
16
- * - 'primary': Emphasizes the button as a primary action.
17
- * - 'outline': Removes background styling.
18
- * - 'subtle': Minimizes emphasis to blend into the background until hovered or focused.
19
- * - 'transparent': Removes background and border styling.
20
- */
21
- appearance?: 'primary' | 'outline' | 'subtle' | 'transparent';
22
- /**
23
- * A button can fill the width of its container.
24
- * @default false
25
- */
26
- block: boolean;
27
- /**
28
- * When set, allows the button to be focusable even when it has been disabled. This is used in scenarios where it
29
- * is important to keep a consistent tab order for screen reader and keyboard users. The primary example of this
30
- * pattern is when the disabled button is in a menu or a commandbar and is seldom used for standalone buttons.
31
- * @default false
32
- */
33
- disabledFocusable: boolean;
34
- /**
35
- * A button can show that it cannot be interacted with.
36
- * @default false
37
- */
38
- disabled: boolean;
39
- /**
40
- * A button can format its icon to appear before or after its content.
41
- * @default 'before'
42
- */
43
- iconPosition: 'before' | 'after';
44
- /**
45
- * A button can be rounded, circular, or square.
46
- * @default 'rounded'
47
- */
48
- shape: 'rounded' | 'circular' | 'square';
49
- /**
50
- * A button supports different sizes.
51
- * @default 'medium'
52
- */
53
- size: 'small' | 'medium' | 'large';
54
- };
55
- export declare type ButtonProps = ComponentProps<ButtonSlots> & Partial<ButtonCommons>;
56
- export declare type ButtonState = ComponentState<ButtonSlots> & ButtonCommons & {
57
- /**
58
- * A button can contain only an icon.
59
- * @default false
60
- */
61
- iconOnly: boolean;
62
- };
@@ -1,5 +0,0 @@
1
- export * from './Button';
2
- export * from './Button.types';
3
- export * from './renderButton';
4
- export * from './useButton';
5
- export { useButtonStyles } from './useButtonStyles';
@@ -1,5 +0,0 @@
1
- import type { ButtonState } from './Button.types';
2
- /**
3
- * Renders a Button component by passing the state defined props to the appropriate slots.
4
- */
5
- export declare const renderButton: (state: ButtonState) => JSX.Element;
@@ -1,8 +0,0 @@
1
- import * as React from 'react';
2
- import type { ButtonProps, ButtonState } from './Button.types';
3
- /**
4
- * Given user props, defines default props for the Button, calls useButtonState, and returns processed state.
5
- * @param props - User provided props to the Button component.
6
- * @param ref - User provided ref to be passed to the Button component.
7
- */
8
- export declare const useButton: (props: ButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => ButtonState;
@@ -1,10 +0,0 @@
1
- import type { ButtonState } from './Button.types';
2
- export declare const buttonSpacing: {
3
- smallest: string;
4
- smaller: string;
5
- small: string;
6
- medium: string;
7
- large: string;
8
- larger: string;
9
- };
10
- export declare const useButtonStyles: (state: ButtonState) => ButtonState;
@@ -1,6 +0,0 @@
1
- import type { CompoundButtonProps } from './CompoundButton.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * CompoundButtons are buttons that can have secondary content that adds extra information to the user.
5
- */
6
- export declare const CompoundButton: ForwardRefComponent<CompoundButtonProps>;
@@ -1,14 +0,0 @@
1
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
2
- import type { ButtonCommons, ButtonSlots, ButtonState } from '../Button/Button.types';
3
- export declare type CompoundButtonSlots = ButtonSlots & {
4
- /**
5
- * Second line of text that describes the action this button takes.
6
- */
7
- secondaryContent?: IntrinsicShorthandProps<'span'>;
8
- /**
9
- * Container that wraps the children and the secondaryContent slot.
10
- */
11
- contentContainer: IntrinsicShorthandProps<'span'>;
12
- };
13
- export declare type CompoundButtonProps = ComponentProps<CompoundButtonSlots> & Partial<ButtonCommons>;
14
- export declare type CompoundButtonState = ComponentState<CompoundButtonSlots> & Omit<ButtonState, keyof ButtonSlots | 'components'>;
@@ -1,5 +0,0 @@
1
- export * from './CompoundButton';
2
- export * from './CompoundButton.types';
3
- export * from './renderCompoundButton';
4
- export * from './useCompoundButton';
5
- export { useCompoundButtonStyles } from './useCompoundButtonStyles';
@@ -1,5 +0,0 @@
1
- import type { CompoundButtonState } from './CompoundButton.types';
2
- /**
3
- * Renders a CompoundButton component by passing the state defined props to the appropriate slots.
4
- */
5
- export declare const renderCompoundButton: (state: CompoundButtonState) => JSX.Element;
@@ -1,8 +0,0 @@
1
- import * as React from 'react';
2
- import type { CompoundButtonProps, CompoundButtonState } from './CompoundButton.types';
3
- /**
4
- * Given user props, defines default props for the CompoundButton, calls useButtonState, and returns processed state.
5
- * @param props - User provided props to the CompoundButton component.
6
- * @param ref - User provided ref to be passed to the CompoundButton component.
7
- */
8
- export declare const useCompoundButton: ({ contentContainer, secondaryContent, ...props }: CompoundButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => CompoundButtonState;
@@ -1,2 +0,0 @@
1
- import type { CompoundButtonState } from './CompoundButton.types';
2
- export declare const useCompoundButtonStyles: (state: CompoundButtonState) => CompoundButtonState;
@@ -1,6 +0,0 @@
1
- import type { MenuButtonProps } from './MenuButton.types';
2
- import type { ForwardRefComponent } from '@fluentui/react-utilities';
3
- /**
4
- * MenuButtons are buttons that handle opening and closing a menu when they are triggered.
5
- */
6
- export declare const MenuButton: ForwardRefComponent<MenuButtonProps>;
@@ -1,11 +0,0 @@
1
- import type { MenuTriggerChildProps } from '@fluentui/react-menu';
2
- import type { ComponentProps, ComponentState, IntrinsicShorthandProps } from '@fluentui/react-utilities';
3
- import type { ButtonCommons, ButtonSlots, ButtonState } from '../Button/Button.types';
4
- export declare type MenuButtonSlots = ButtonSlots & {
5
- /**
6
- * Menu icon that indicates that this button has a menu that can be expanded.
7
- */
8
- menuIcon?: IntrinsicShorthandProps<'span'>;
9
- };
10
- export declare type MenuButtonProps = ComponentProps<MenuButtonSlots> & Partial<Omit<ButtonCommons, 'iconPosition'>> & Partial<MenuTriggerChildProps>;
11
- export declare type MenuButtonState = ComponentState<MenuButtonSlots> & Omit<ButtonState, keyof ButtonSlots | 'components' | 'iconPosition'>;
@@ -1,5 +0,0 @@
1
- export * from './MenuButton.types';
2
- export * from './MenuButton';
3
- export * from './renderMenuButton';
4
- export * from './useMenuButton';
5
- export { useMenuButtonStyles } from './useMenuButtonStyles';
@@ -1,5 +0,0 @@
1
- import type { MenuButtonState } from './MenuButton.types';
2
- /**
3
- * Renders a MenuButton component by passing the state defined props to the appropriate slots.
4
- */
5
- export declare const renderMenuButton: (state: MenuButtonState) => JSX.Element;