@fluentui/react-button 0.0.0-nightlyfbae36b19b20211111.1 → 0.0.0-nightlyfc5cfdc52420220215.1
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.json +331 -26
- package/CHANGELOG.md +79 -14
- package/dist/react-button.d.ts +31 -33
- package/lib/components/Button/Button.js +6 -6
- package/lib/components/Button/Button.js.map +1 -1
- package/lib/components/Button/Button.types.d.ts +5 -5
- package/lib/components/Button/index.d.ts +2 -2
- package/lib/components/Button/index.js +1 -2
- package/lib/components/Button/index.js.map +1 -1
- package/lib/components/Button/renderButton.d.ts +1 -1
- package/lib/components/Button/renderButton.js +6 -3
- package/lib/components/Button/renderButton.js.map +1 -1
- package/lib/components/Button/useButton.d.ts +1 -1
- package/lib/components/Button/useButton.js +3 -2
- package/lib/components/Button/useButton.js.map +1 -1
- package/lib/components/Button/useButtonStyles.d.ts +1 -9
- package/lib/components/Button/useButtonStyles.js +97 -72
- package/lib/components/Button/useButtonStyles.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.js +6 -6
- package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.types.d.ts +4 -4
- package/lib/components/CompoundButton/index.d.ts +1 -1
- package/lib/components/CompoundButton/index.js +1 -1
- package/lib/components/CompoundButton/index.js.map +1 -1
- package/lib/components/CompoundButton/renderCompoundButton.d.ts +1 -1
- package/lib/components/CompoundButton/renderCompoundButton.js +8 -3
- package/lib/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButton.d.ts +1 -1
- package/lib/components/CompoundButton/useCompoundButton.js +3 -3
- package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButtonStyles.d.ts +1 -1
- package/lib/components/CompoundButton/useCompoundButtonStyles.js +14 -13
- package/lib/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.js +6 -6
- package/lib/components/MenuButton/MenuButton.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.types.d.ts +3 -4
- package/lib/components/MenuButton/index.d.ts +1 -1
- package/lib/components/MenuButton/index.js +1 -1
- package/lib/components/MenuButton/index.js.map +1 -1
- package/lib/components/MenuButton/renderMenuButton.d.ts +1 -1
- package/lib/components/MenuButton/renderMenuButton.js +6 -3
- package/lib/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButton.d.ts +1 -1
- package/lib/components/MenuButton/useMenuButton.js +5 -5
- package/lib/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButtonStyles.d.ts +1 -1
- package/lib/components/MenuButton/useMenuButtonStyles.js +4 -4
- package/lib/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.js +6 -6
- package/lib/components/SplitButton/SplitButton.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.types.d.ts +6 -4
- package/lib/components/SplitButton/index.d.ts +1 -1
- package/lib/components/SplitButton/index.js +1 -1
- package/lib/components/SplitButton/index.js.map +1 -1
- package/lib/components/SplitButton/renderSplitButton.d.ts +1 -1
- package/lib/components/SplitButton/renderSplitButton.js +6 -3
- package/lib/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButton.d.ts +1 -1
- package/lib/components/SplitButton/useSplitButton.js +13 -3
- package/lib/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButtonStyles.d.ts +1 -1
- package/lib/components/SplitButton/useSplitButtonStyles.js +3 -2
- package/lib/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.js +6 -6
- package/lib/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.types.d.ts +2 -1
- package/lib/components/ToggleButton/index.d.ts +1 -1
- package/lib/components/ToggleButton/index.js +1 -1
- package/lib/components/ToggleButton/index.js.map +1 -1
- package/lib/components/ToggleButton/renderToggleButton.d.ts +1 -1
- package/lib/components/ToggleButton/renderToggleButton.js +1 -1
- package/lib/components/ToggleButton/renderToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButton.d.ts +1 -1
- package/lib/components/ToggleButton/useToggleButton.js +8 -4
- package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButtonStyles.d.ts +1 -1
- package/lib/components/ToggleButton/useToggleButtonStyles.js +35 -34
- package/lib/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib-commonjs/components/Button/Button.js +3 -3
- package/lib-commonjs/components/Button/Button.js.map +1 -1
- package/lib-commonjs/components/Button/Button.types.d.ts +5 -5
- package/lib-commonjs/components/Button/index.d.ts +2 -2
- package/lib-commonjs/components/Button/index.js +3 -5
- package/lib-commonjs/components/Button/index.js.map +1 -1
- package/lib-commonjs/components/Button/renderButton.d.ts +1 -1
- package/lib-commonjs/components/Button/renderButton.js +8 -5
- package/lib-commonjs/components/Button/renderButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButton.d.ts +1 -1
- package/lib-commonjs/components/Button/useButton.js +5 -4
- package/lib-commonjs/components/Button/useButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButtonStyles.d.ts +1 -9
- package/lib-commonjs/components/Button/useButtonStyles.js +106 -80
- package/lib-commonjs/components/Button/useButtonStyles.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.js +3 -3
- package/lib-commonjs/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.types.d.ts +4 -4
- package/lib-commonjs/components/CompoundButton/index.d.ts +1 -1
- package/lib-commonjs/components/CompoundButton/index.js +3 -3
- package/lib-commonjs/components/CompoundButton/index.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.d.ts +1 -1
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.js +10 -5
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButton.d.ts +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js +4 -4
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.d.ts +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js +25 -23
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.js +3 -3
- package/lib-commonjs/components/MenuButton/MenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.types.d.ts +3 -4
- package/lib-commonjs/components/MenuButton/index.d.ts +1 -1
- package/lib-commonjs/components/MenuButton/index.js +3 -3
- package/lib-commonjs/components/MenuButton/index.js.map +1 -1
- package/lib-commonjs/components/MenuButton/renderMenuButton.d.ts +1 -1
- package/lib-commonjs/components/MenuButton/renderMenuButton.js +8 -5
- package/lib-commonjs/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButton.d.ts +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButton.js +5 -5
- package/lib-commonjs/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.d.ts +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js +8 -8
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.js +3 -3
- package/lib-commonjs/components/SplitButton/SplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.types.d.ts +6 -4
- package/lib-commonjs/components/SplitButton/index.d.ts +1 -1
- package/lib-commonjs/components/SplitButton/index.js +3 -3
- package/lib-commonjs/components/SplitButton/index.js.map +1 -1
- package/lib-commonjs/components/SplitButton/renderSplitButton.d.ts +1 -1
- package/lib-commonjs/components/SplitButton/renderSplitButton.js +8 -5
- package/lib-commonjs/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButton.d.ts +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButton.js +14 -4
- package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.d.ts +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js +11 -9
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.js +3 -3
- package/lib-commonjs/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.types.d.ts +2 -1
- package/lib-commonjs/components/ToggleButton/index.d.ts +1 -1
- package/lib-commonjs/components/ToggleButton/index.js +3 -3
- package/lib-commonjs/components/ToggleButton/index.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/renderToggleButton.d.ts +1 -1
- package/lib-commonjs/components/ToggleButton/renderToggleButton.js +3 -3
- package/lib-commonjs/components/ToggleButton/renderToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButton.d.ts +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButton.js +9 -5
- package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.d.ts +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js +40 -38
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/package.json +12 -15
- package/lib/common/isConformant.d.ts +0 -4
- package/lib/common/isConformant.js +0 -13
- package/lib/common/isConformant.js.map +0 -1
- package/lib-commonjs/common/isConformant.d.ts +0 -4
- package/lib-commonjs/common/isConformant.js +0 -24
- package/lib-commonjs/common/isConformant.js.map +0 -1
package/dist/react-button.d.ts
CHANGED
@@ -1,11 +1,9 @@
|
|
1
|
-
import {
|
1
|
+
import type { ARIAButtonSlotProps } from '@fluentui/react-aria';
|
2
2
|
import type { ComponentProps } from '@fluentui/react-utilities';
|
3
3
|
import type { ComponentState } from '@fluentui/react-utilities';
|
4
4
|
import { ForwardRefComponent } from '@fluentui/react-utilities';
|
5
|
-
import type { IntrinsicShorthandProps } from '@fluentui/react-utilities';
|
6
|
-
import type { MenuTriggerChildProps } from '@fluentui/react-menu';
|
7
|
-
import type { ObjectShorthandProps } from '@fluentui/react-utilities';
|
8
5
|
import * as React_2 from 'react';
|
6
|
+
import type { Slot } from '@fluentui/react-utilities';
|
9
7
|
|
10
8
|
/**
|
11
9
|
* Buttons give people a way to trigger an action.
|
@@ -14,7 +12,7 @@ export declare const Button: ForwardRefComponent<ButtonProps>;
|
|
14
12
|
|
15
13
|
export declare const buttonClassName = "fui-Button";
|
16
14
|
|
17
|
-
|
15
|
+
declare type ButtonCommons = {
|
18
16
|
/**
|
19
17
|
* A button can have its content and borders styled for greater emphasis or to be subtle.
|
20
18
|
* - 'primary': Emphasizes the button as a primary action.
|
@@ -44,7 +42,7 @@ export declare type ButtonCommons = {
|
|
44
42
|
* A button can format its icon to appear before or after its content.
|
45
43
|
* @default 'before'
|
46
44
|
*/
|
47
|
-
iconPosition
|
45
|
+
iconPosition?: 'before' | 'after';
|
48
46
|
/**
|
49
47
|
* A button can be rounded, circular, or square.
|
50
48
|
* @default 'rounded'
|
@@ -63,11 +61,11 @@ export declare type ButtonSlots = {
|
|
63
61
|
/**
|
64
62
|
* Root of the component that renders as either a `<button>` tag or an `<a>` tag.
|
65
63
|
*/
|
66
|
-
root:
|
64
|
+
root: Slot<ARIAButtonSlotProps>;
|
67
65
|
/**
|
68
66
|
* Icon that renders either before or after the `children` as specified by the `iconPosition` prop.
|
69
67
|
*/
|
70
|
-
icon?:
|
68
|
+
icon?: Slot<'span'>;
|
71
69
|
};
|
72
70
|
|
73
71
|
export declare type ButtonState = ComponentState<ButtonSlots> & ButtonCommons & {
|
@@ -85,17 +83,17 @@ export declare const CompoundButton: ForwardRefComponent<CompoundButtonProps>;
|
|
85
83
|
|
86
84
|
export declare const compoundButtonClassName = "fui-CompoundButton";
|
87
85
|
|
88
|
-
export declare type CompoundButtonProps = ComponentProps<CompoundButtonSlots
|
86
|
+
export declare type CompoundButtonProps = ComponentProps<Partial<CompoundButtonSlots>> & Partial<ButtonCommons>;
|
89
87
|
|
90
88
|
export declare type CompoundButtonSlots = ButtonSlots & {
|
91
89
|
/**
|
92
90
|
* Second line of text that describes the action this button takes.
|
93
91
|
*/
|
94
|
-
secondaryContent?:
|
92
|
+
secondaryContent?: Slot<'span'>;
|
95
93
|
/**
|
96
94
|
* Container that wraps the children and the secondaryContent slot.
|
97
95
|
*/
|
98
|
-
contentContainer:
|
96
|
+
contentContainer: NonNullable<Slot<'span'>>;
|
99
97
|
};
|
100
98
|
|
101
99
|
export declare type CompoundButtonState = ComponentState<CompoundButtonSlots> & Omit<ButtonState, keyof ButtonSlots | 'components'>;
|
@@ -107,13 +105,13 @@ export declare const MenuButton: ForwardRefComponent<MenuButtonProps>;
|
|
107
105
|
|
108
106
|
export declare const menuButtonClassName = "fui-MenuButton";
|
109
107
|
|
110
|
-
export declare type MenuButtonProps = ComponentProps<MenuButtonSlots> & Partial<Omit<ButtonCommons, 'iconPosition'
|
108
|
+
export declare type MenuButtonProps = ComponentProps<MenuButtonSlots> & Partial<Omit<ButtonCommons, 'iconPosition'>>;
|
111
109
|
|
112
110
|
export declare type MenuButtonSlots = ButtonSlots & {
|
113
111
|
/**
|
114
112
|
* Menu icon that indicates that this button has a menu that can be expanded.
|
115
113
|
*/
|
116
|
-
menuIcon?:
|
114
|
+
menuIcon?: Slot<'span'>;
|
117
115
|
};
|
118
116
|
|
119
117
|
export declare type MenuButtonState = ComponentState<MenuButtonSlots> & Omit<ButtonState, keyof ButtonSlots | 'components' | 'iconPosition'>;
|
@@ -121,24 +119,24 @@ export declare type MenuButtonState = ComponentState<MenuButtonSlots> & Omit<But
|
|
121
119
|
/**
|
122
120
|
* Renders a Button component by passing the state defined props to the appropriate slots.
|
123
121
|
*/
|
124
|
-
declare const
|
125
|
-
export {
|
126
|
-
export {
|
122
|
+
declare const renderButton_unstable: (state: ButtonState) => JSX.Element;
|
123
|
+
export { renderButton_unstable }
|
124
|
+
export { renderButton_unstable as renderToggleButton_unstable }
|
127
125
|
|
128
126
|
/**
|
129
127
|
* Renders a CompoundButton component by passing the state defined props to the appropriate slots.
|
130
128
|
*/
|
131
|
-
export declare const
|
129
|
+
export declare const renderCompoundButton_unstable: (state: CompoundButtonState) => JSX.Element;
|
132
130
|
|
133
131
|
/**
|
134
132
|
* Renders a MenuButton component by passing the state defined props to the appropriate slots.
|
135
133
|
*/
|
136
|
-
export declare const
|
134
|
+
export declare const renderMenuButton_unstable: (state: MenuButtonState) => JSX.Element;
|
137
135
|
|
138
136
|
/**
|
139
137
|
* Renders a SplitButton component by passing the state defined props to the appropriate slots.
|
140
138
|
*/
|
141
|
-
export declare const
|
139
|
+
export declare const renderSplitButton_unstable: (state: SplitButtonState) => JSX.Element;
|
142
140
|
|
143
141
|
/**
|
144
142
|
* SplitButtons are a grouping of two interactive surfaces where the interacting with the first one triggers a primary
|
@@ -154,15 +152,15 @@ export declare type SplitButtonSlots = {
|
|
154
152
|
/**
|
155
153
|
* Root of the component that wraps the primary action button and menu button.
|
156
154
|
*/
|
157
|
-
root:
|
155
|
+
root: Slot<'div'>;
|
158
156
|
/**
|
159
157
|
* Button that opens menu with secondary actions in SplitButton.
|
160
158
|
*/
|
161
|
-
menuButton?:
|
159
|
+
menuButton?: Slot<typeof MenuButton>;
|
162
160
|
/**
|
163
161
|
* Button to perform primary action in SplitButton.
|
164
162
|
*/
|
165
|
-
primaryActionButton?:
|
163
|
+
primaryActionButton?: Slot<typeof Button>;
|
166
164
|
};
|
167
165
|
|
168
166
|
export declare type SplitButtonState = ComponentState<SplitButtonSlots> & Omit<ButtonState, 'components' | 'iconOnly' | 'root'> & Omit<MenuButtonState, 'components' | 'iconOnly' | 'root'>;
|
@@ -174,7 +172,7 @@ export declare const ToggleButton: ForwardRefComponent<ToggleButtonProps>;
|
|
174
172
|
|
175
173
|
export declare const toggleButtonClassName = "fui-ToggleButton";
|
176
174
|
|
177
|
-
|
175
|
+
declare type ToggleButtonCommons = {
|
178
176
|
/**
|
179
177
|
* Defines the controlled checked state of the `ToggleButton`.
|
180
178
|
* If passed, `ToggleButton` ignores the `defaultChecked` property.
|
@@ -200,34 +198,34 @@ export declare type ToggleButtonState = ButtonState & ToggleButtonCommons;
|
|
200
198
|
* @param props - User provided props to the Button component.
|
201
199
|
* @param ref - User provided ref to be passed to the Button component.
|
202
200
|
*/
|
203
|
-
export declare const
|
201
|
+
export declare const useButton_unstable: (props: ButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => ButtonState;
|
204
202
|
|
205
|
-
export declare const
|
203
|
+
export declare const useButtonStyles_unstable: (state: ButtonState) => ButtonState;
|
206
204
|
|
207
205
|
/**
|
208
206
|
* Given user props, defines default props for the CompoundButton, calls useButtonState, and returns processed state.
|
209
207
|
* @param props - User provided props to the CompoundButton component.
|
210
208
|
* @param ref - User provided ref to be passed to the CompoundButton component.
|
211
209
|
*/
|
212
|
-
export declare const
|
210
|
+
export declare const useCompoundButton_unstable: ({ contentContainer, secondaryContent, ...props }: CompoundButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => CompoundButtonState;
|
213
211
|
|
214
|
-
export declare const
|
212
|
+
export declare const useCompoundButtonStyles_unstable: (state: CompoundButtonState) => CompoundButtonState;
|
215
213
|
|
216
214
|
/**
|
217
215
|
* Given user props, returns the final state for a MenuButton.
|
218
216
|
*/
|
219
|
-
export declare const
|
217
|
+
export declare const useMenuButton_unstable: ({ menuIcon, ...props }: MenuButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => MenuButtonState;
|
220
218
|
|
221
|
-
export declare const
|
219
|
+
export declare const useMenuButtonStyles_unstable: (state: MenuButtonState) => MenuButtonState;
|
222
220
|
|
223
221
|
/**
|
224
222
|
* Given user props, defines default props for the SplitButton and returns processed state.
|
225
223
|
* @param props - User provided props to the SplitButton component.
|
226
224
|
* @param ref - User provided ref to be passed to the SplitButton component.
|
227
225
|
*/
|
228
|
-
export declare const
|
226
|
+
export declare const useSplitButton_unstable: (props: SplitButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => SplitButtonState;
|
229
227
|
|
230
|
-
export declare const
|
228
|
+
export declare const useSplitButtonStyles_unstable: (state: SplitButtonState) => SplitButtonState;
|
231
229
|
|
232
230
|
/**
|
233
231
|
* Given user props, defines default props for the ToggleButton, calls useButtonState and useChecked, and returns
|
@@ -235,8 +233,8 @@ export declare const useSplitButtonStyles: (state: SplitButtonState) => SplitBut
|
|
235
233
|
* @param props - User provided props to the ToggleButton component.
|
236
234
|
* @param ref - User provided ref to be passed to the ToggleButton component.
|
237
235
|
*/
|
238
|
-
export declare const
|
236
|
+
export declare const useToggleButton_unstable: ({ checked, defaultChecked, ...props }: ToggleButtonProps, ref: React_2.Ref<HTMLButtonElement | HTMLAnchorElement>) => ToggleButtonState;
|
239
237
|
|
240
|
-
export declare const
|
238
|
+
export declare const useToggleButtonStyles_unstable: (state: ToggleButtonState) => ToggleButtonState;
|
241
239
|
|
242
240
|
export { }
|
@@ -1,15 +1,15 @@
|
|
1
1
|
import * as React from 'react';
|
2
|
-
import {
|
3
|
-
import {
|
4
|
-
import {
|
2
|
+
import { renderButton_unstable } from './renderButton';
|
3
|
+
import { useButton_unstable } from './useButton';
|
4
|
+
import { useButtonStyles_unstable } from './useButtonStyles';
|
5
5
|
/**
|
6
6
|
* Buttons give people a way to trigger an action.
|
7
7
|
*/
|
8
8
|
|
9
9
|
export const Button = /*#__PURE__*/React.forwardRef((props, ref) => {
|
10
|
-
const state =
|
11
|
-
|
12
|
-
return
|
10
|
+
const state = useButton_unstable(props, ref);
|
11
|
+
useButtonStyles_unstable(state);
|
12
|
+
return renderButton_unstable(state); // Casting is required due to lack of distributive union to support unions on @types/react
|
13
13
|
});
|
14
14
|
Button.displayName = 'Button';
|
15
15
|
//# sourceMappingURL=Button.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,
|
1
|
+
{"version":3,"sources":["../../../src/components/Button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,kBAAT,QAAmC,aAAnC;AACA,SAAS,wBAAT,QAAyC,mBAAzC;AAIA;;AAEG;;AACH,OAAO,MAAM,MAAM,gBAAqC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AACtF,QAAM,KAAK,GAAG,kBAAkB,CAAC,KAAD,EAAQ,GAAR,CAAhC;AAEA,EAAA,wBAAwB,CAAC,KAAD,CAAxB;AAEA,SAAO,qBAAqB,CAAC,KAAD,CAA5B,CALsF,CAMtF;AACD,CAPuD,CAAjD;AASP,MAAM,CAAC,WAAP,GAAqB,QAArB","sourceRoot":""}
|
@@ -1,14 +1,14 @@
|
|
1
|
-
import {
|
2
|
-
import type { ComponentProps, ComponentState,
|
1
|
+
import type { ARIAButtonSlotProps } from '@fluentui/react-aria';
|
2
|
+
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
3
3
|
export declare type ButtonSlots = {
|
4
4
|
/**
|
5
5
|
* Root of the component that renders as either a `<button>` tag or an `<a>` tag.
|
6
6
|
*/
|
7
|
-
root:
|
7
|
+
root: Slot<ARIAButtonSlotProps>;
|
8
8
|
/**
|
9
9
|
* Icon that renders either before or after the `children` as specified by the `iconPosition` prop.
|
10
10
|
*/
|
11
|
-
icon?:
|
11
|
+
icon?: Slot<'span'>;
|
12
12
|
};
|
13
13
|
export declare type ButtonCommons = {
|
14
14
|
/**
|
@@ -40,7 +40,7 @@ export declare type ButtonCommons = {
|
|
40
40
|
* A button can format its icon to appear before or after its content.
|
41
41
|
* @default 'before'
|
42
42
|
*/
|
43
|
-
iconPosition
|
43
|
+
iconPosition?: 'before' | 'after';
|
44
44
|
/**
|
45
45
|
* A button can be rounded, circular, or square.
|
46
46
|
* @default 'rounded'
|
@@ -1,5 +1,5 @@
|
|
1
1
|
export * from './Button';
|
2
|
-
export
|
2
|
+
export type { ButtonProps, ButtonSlots, ButtonState } from './Button.types';
|
3
3
|
export * from './renderButton';
|
4
4
|
export * from './useButton';
|
5
|
-
export { buttonClassName,
|
5
|
+
export { buttonClassName, useButtonStyles_unstable } from './useButtonStyles';
|
@@ -1,6 +1,5 @@
|
|
1
1
|
export * from './Button';
|
2
|
-
export * from './Button.types';
|
3
2
|
export * from './renderButton';
|
4
3
|
export * from './useButton';
|
5
|
-
export { buttonClassName,
|
4
|
+
export { buttonClassName, useButtonStyles_unstable } from './useButtonStyles';
|
6
5
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Button/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,eAAe,EAAE,wBAAwB,EAAE,MAAM,mBAAmB,CAAC"}
|
@@ -2,4 +2,4 @@ import type { ButtonState } from './Button.types';
|
|
2
2
|
/**
|
3
3
|
* Renders a Button component by passing the state defined props to the appropriate slots.
|
4
4
|
*/
|
5
|
-
export declare const
|
5
|
+
export declare const renderButton_unstable: (state: ButtonState) => JSX.Element;
|
@@ -4,15 +4,18 @@ import { getSlots } from '@fluentui/react-utilities';
|
|
4
4
|
* Renders a Button component by passing the state defined props to the appropriate slots.
|
5
5
|
*/
|
6
6
|
|
7
|
-
export const
|
7
|
+
export const renderButton_unstable = state => {
|
8
8
|
const {
|
9
9
|
slots,
|
10
10
|
slotProps
|
11
|
-
} = getSlots(state
|
11
|
+
} = getSlots(state);
|
12
12
|
const {
|
13
13
|
iconOnly,
|
14
14
|
iconPosition
|
15
15
|
} = state;
|
16
|
-
return /*#__PURE__*/React.createElement(slots.root,
|
16
|
+
return /*#__PURE__*/React.createElement(slots.root, { ...slotProps.root
|
17
|
+
}, iconPosition !== 'after' && slots.icon && /*#__PURE__*/React.createElement(slots.icon, { ...slotProps.icon
|
18
|
+
}), !iconOnly && state.root.children, iconPosition === 'after' && slots.icon && /*#__PURE__*/React.createElement(slots.icon, { ...slotProps.icon
|
19
|
+
}));
|
17
20
|
};
|
18
21
|
//# sourceMappingURL=renderButton.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Button/renderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,
|
1
|
+
{"version":3,"sources":["../../../src/components/Button/renderButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,qBAAqB,GAAI,KAAD,IAAuB;AAC1D,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAc,KAAd,CAArC;AACA,QAAM;AAAE,IAAA,QAAF;AAAY,IAAA;AAAZ,MAA6B,KAAnC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,YAAY,KAAK,OAAjB,IAA4B,KAAK,CAAC,IAAlC,iBAA0C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAD7C,EAEG,CAAC,QAAD,IAAa,KAAK,CAAC,IAAN,CAAW,QAF3B,EAGG,YAAY,KAAK,OAAjB,IAA4B,KAAK,CAAC,IAAlC,iBAA0C,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,CAH7C,CADF;AAOD,CAXM","sourceRoot":""}
|
@@ -5,4 +5,4 @@ import type { ButtonProps, ButtonState } from './Button.types';
|
|
5
5
|
* @param props - User provided props to the Button component.
|
6
6
|
* @param ref - User provided ref to be passed to the Button component.
|
7
7
|
*/
|
8
|
-
export declare const
|
8
|
+
export declare const useButton_unstable: (props: ButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => ButtonState;
|
@@ -6,7 +6,7 @@ import { getNativeElementProps, resolveShorthand } from '@fluentui/react-utiliti
|
|
6
6
|
* @param ref - User provided ref to be passed to the Button component.
|
7
7
|
*/
|
8
8
|
|
9
|
-
export const
|
9
|
+
export const useButton_unstable = (props, ref) => {
|
10
10
|
const {
|
11
11
|
appearance,
|
12
12
|
as,
|
@@ -40,7 +40,8 @@ export const useButton = (props, ref) => {
|
|
40
40
|
defaultProps: {
|
41
41
|
// useARIAButton isn't working with React.Ref<HTMLButtonElement | HTMLAnchorElement>
|
42
42
|
ref: ref,
|
43
|
-
type: 'button'
|
43
|
+
type: 'button' // This is added because the default for type is 'submit'
|
44
|
+
|
44
45
|
}
|
45
46
|
})),
|
46
47
|
icon: iconShorthand
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Button/useButton.ts"],"names":[],"mappings":"AACA,SAAS,aAAT,QAA8B,sBAA9B;
|
1
|
+
{"version":3,"sources":["../../../src/components/Button/useButton.ts"],"names":[],"mappings":"AACA,SAAS,aAAT,QAA8B,sBAA9B;AAEA,SAAS,qBAAT,EAAgC,gBAAhC,QAAwD,2BAAxD;AAGA;;;;AAIG;;AACH,OAAO,MAAM,kBAAkB,GAAG,CAChC,KADgC,EAEhC,GAFgC,KAGjB;AACf,QAAM;AACJ,IAAA,UADI;AAEJ,IAAA,EAFI;AAGJ,IAAA,KAAK,GAAG,KAHJ;AAIJ,IAAA,QAAQ,GAAG,KAJP;AAKJ,IAAA,iBAAiB,GAAG,KALhB;AAMJ,IAAA,IANI;AAOJ,IAAA,YAAY,GAAG,QAPX;AAQJ,IAAA,KAAK,GAAG,SARJ;AASJ,IAAA,IAAI,GAAG;AATH,MAUF,KAVJ;AAWA,QAAM,aAAa,GAAG,gBAAgB,CAAC,IAAD,CAAtC;AAEA,SAAO;AACL;AACA,IAAA,UAFK;AAGL,IAAA,KAHK;AAIL,IAAA,QAJK;AAKL,IAAA,iBALK;AAML,IAAA,YANK;AAOL,IAAA,KAPK;AAQL,IAAA,IARK;AAUL;AACA,IAAA,QAAQ,EAAE,OAAO,CAAC,CAAA,aAAa,KAAA,IAAb,IAAA,aAAa,KAAA,KAAA,CAAb,GAAa,KAAA,CAAb,GAAA,aAAa,CAAE,QAAf,KAA2B,CAAC,KAAK,CAAC,QAAnC,CAXZ;AAaL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,QADI;AAEV,MAAA,IAAI,EAAE;AAFI,KAdP;AAmBL,IAAA,IAAI,EAAE,qBAAqB,CACzB,EAAE,IAAI,QADmB,EAEzB,aAAa,CAAsB,KAAtB,EAA6B;AACxC,MAAA,QAAQ,EAAE,IAD8B;AAExC,MAAA,YAAY,EAAE;AACZ;AACA,QAAA,GAAG,EAAE,GAFO;AAGZ,QAAA,IAAI,EAAE,QAHM,CAGI;;AAHJ;AAF0B,KAA7B,CAFY,CAnBtB;AA8BL,IAAA,IAAI,EAAE;AA9BD,GAAP;AAgCD,CAjDM","sourceRoot":""}
|
@@ -1,11 +1,3 @@
|
|
1
1
|
import type { ButtonState } from './Button.types';
|
2
2
|
export declare const buttonClassName = "fui-Button";
|
3
|
-
export declare const
|
4
|
-
smallest: string;
|
5
|
-
smaller: string;
|
6
|
-
small: string;
|
7
|
-
medium: string;
|
8
|
-
large: string;
|
9
|
-
larger: string;
|
10
|
-
};
|
11
|
-
export declare const useButtonStyles: (state: ButtonState) => ButtonState;
|
3
|
+
export declare const useButtonStyles_unstable: (state: ButtonState) => ButtonState;
|