@fluentui/react-button 9.3.3 → 9.3.5
Sign up to get free protection for your applications and to get access to all the features.
- package/.swcrc +30 -0
- package/CHANGELOG.json +97 -1
- package/CHANGELOG.md +31 -2
- package/lib/Button.js.map +1 -1
- package/lib/CompoundButton.js.map +1 -1
- package/lib/MenuButton.js.map +1 -1
- package/lib/SplitButton.js.map +1 -1
- package/lib/ToggleButton.js.map +1 -1
- package/lib/components/Button/Button.js.map +1 -1
- package/lib/components/Button/Button.types.js.map +1 -1
- package/lib/components/Button/index.js.map +1 -1
- package/lib/components/Button/renderButton.js +1 -7
- package/lib/components/Button/renderButton.js.map +1 -1
- package/lib/components/Button/useButton.js +1 -0
- package/lib/components/Button/useButton.js.map +1 -1
- package/lib/components/Button/useButtonStyles.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.types.js.map +1 -1
- package/lib/components/CompoundButton/index.js.map +1 -1
- package/lib/components/CompoundButton/renderCompoundButton.js +1 -11
- package/lib/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButton.js +3 -2
- package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.types.js.map +1 -1
- package/lib/components/MenuButton/index.js.map +1 -1
- package/lib/components/MenuButton/renderMenuButton.js +1 -7
- package/lib/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButton.js +2 -2
- package/lib/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.types.js.map +1 -1
- package/lib/components/SplitButton/index.js.map +1 -1
- package/lib/components/SplitButton/renderSplitButton.js +1 -7
- package/lib/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButton.js +1 -0
- package/lib/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.types.js.map +1 -1
- package/lib/components/ToggleButton/index.js.map +1 -1
- package/lib/components/ToggleButton/renderToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButton.js +1 -0
- package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib/contexts/ButtonContext.js +2 -4
- package/lib/contexts/ButtonContext.js.map +1 -1
- package/lib/contexts/index.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib/utils/index.js.map +1 -1
- package/lib/utils/useToggleState.js.map +1 -1
- package/lib-commonjs/Button.js +5 -4
- package/lib-commonjs/Button.js.map +1 -1
- package/lib-commonjs/CompoundButton.js +5 -4
- package/lib-commonjs/CompoundButton.js.map +1 -1
- package/lib-commonjs/MenuButton.js +5 -4
- package/lib-commonjs/MenuButton.js.map +1 -1
- package/lib-commonjs/SplitButton.js +5 -4
- package/lib-commonjs/SplitButton.js.map +1 -1
- package/lib-commonjs/ToggleButton.js +5 -4
- package/lib-commonjs/ToggleButton.js.map +1 -1
- package/lib-commonjs/components/Button/Button.js +19 -21
- package/lib-commonjs/components/Button/Button.js.map +1 -1
- package/lib-commonjs/components/Button/Button.types.js +3 -2
- package/lib-commonjs/components/Button/Button.types.js.map +1 -1
- package/lib-commonjs/components/Button/index.js +17 -19
- package/lib-commonjs/components/Button/index.js.map +1 -1
- package/lib-commonjs/components/Button/renderButton.js +14 -26
- package/lib-commonjs/components/Button/renderButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButton.js +40 -52
- package/lib-commonjs/components/Button/useButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButtonStyles.js +1129 -471
- package/lib-commonjs/components/Button/useButtonStyles.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.js +19 -21
- package/lib-commonjs/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.types.js +3 -2
- package/lib-commonjs/components/CompoundButton/CompoundButton.types.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/index.js +18 -20
- package/lib-commonjs/components/CompoundButton/index.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.js +14 -30
- package/lib-commonjs/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js +31 -36
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js +315 -184
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.js +19 -22
- package/lib-commonjs/components/MenuButton/MenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.types.js +3 -2
- package/lib-commonjs/components/MenuButton/MenuButton.types.js.map +1 -1
- package/lib-commonjs/components/MenuButton/index.js +18 -20
- package/lib-commonjs/components/MenuButton/index.js.map +1 -1
- package/lib-commonjs/components/MenuButton/renderMenuButton.js +14 -26
- package/lib-commonjs/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButton.js +34 -37
- package/lib-commonjs/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js +166 -106
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.js +19 -22
- package/lib-commonjs/components/SplitButton/SplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.types.js +3 -2
- package/lib-commonjs/components/SplitButton/SplitButton.types.js.map +1 -1
- package/lib-commonjs/components/SplitButton/index.js +18 -20
- package/lib-commonjs/components/SplitButton/index.js.map +1 -1
- package/lib-commonjs/components/SplitButton/renderSplitButton.js +13 -22
- package/lib-commonjs/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButton.js +66 -79
- package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js +263 -106
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.js +19 -21
- package/lib-commonjs/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.types.js +3 -2
- package/lib-commonjs/components/ToggleButton/ToggleButton.types.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/index.js +18 -20
- package/lib-commonjs/components/ToggleButton/index.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/renderToggleButton.js +6 -8
- package/lib-commonjs/components/ToggleButton/renderToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButton.js +14 -16
- package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js +897 -380
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib-commonjs/contexts/ButtonContext.js +18 -19
- package/lib-commonjs/contexts/ButtonContext.js.map +1 -1
- package/lib-commonjs/contexts/index.js +5 -4
- package/lib-commonjs/contexts/index.js.map +1 -1
- package/lib-commonjs/index.js +47 -179
- package/lib-commonjs/index.js.map +1 -1
- package/lib-commonjs/utils/index.js +5 -4
- package/lib-commonjs/utils/index.js.map +1 -1
- package/lib-commonjs/utils/useToggleState.js +40 -40
- package/lib-commonjs/utils/useToggleState.js.map +1 -1
- package/package.json +12 -11
- package/lib-amd/Button.js +0 -6
- package/lib-amd/Button.js.map +0 -1
- package/lib-amd/CompoundButton.js +0 -6
- package/lib-amd/CompoundButton.js.map +0 -1
- package/lib-amd/MenuButton.js +0 -6
- package/lib-amd/MenuButton.js.map +0 -1
- package/lib-amd/SplitButton.js +0 -6
- package/lib-amd/SplitButton.js.map +0 -1
- package/lib-amd/ToggleButton.js +0 -6
- package/lib-amd/ToggleButton.js.map +0 -1
- package/lib-amd/components/Button/Button.js +0 -18
- package/lib-amd/components/Button/Button.js.map +0 -1
- package/lib-amd/components/Button/Button.types.js +0 -5
- package/lib-amd/components/Button/Button.types.js.map +0 -1
- package/lib-amd/components/Button/index.js +0 -11
- package/lib-amd/components/Button/index.js.map +0 -1
- package/lib-amd/components/Button/renderButton.js +0 -18
- package/lib-amd/components/Button/renderButton.js.map +0 -1
- package/lib-amd/components/Button/useButton.js +0 -41
- package/lib-amd/components/Button/useButton.js.map +0 -1
- package/lib-amd/components/Button/useButtonStyles.js +0 -227
- package/lib-amd/components/Button/useButtonStyles.js.map +0 -1
- package/lib-amd/components/CompoundButton/CompoundButton.js +0 -18
- package/lib-amd/components/CompoundButton/CompoundButton.js.map +0 -1
- package/lib-amd/components/CompoundButton/CompoundButton.types.js +0 -5
- package/lib-amd/components/CompoundButton/CompoundButton.types.js.map +0 -1
- package/lib-amd/components/CompoundButton/index.js +0 -12
- package/lib-amd/components/CompoundButton/index.js.map +0 -1
- package/lib-amd/components/CompoundButton/renderCompoundButton.js +0 -20
- package/lib-amd/components/CompoundButton/renderCompoundButton.js.map +0 -1
- package/lib-amd/components/CompoundButton/useCompoundButton.js +0 -27
- package/lib-amd/components/CompoundButton/useCompoundButton.js.map +0 -1
- package/lib-amd/components/CompoundButton/useCompoundButtonStyles.js +0 -216
- package/lib-amd/components/CompoundButton/useCompoundButtonStyles.js.map +0 -1
- package/lib-amd/components/MenuButton/MenuButton.js +0 -19
- package/lib-amd/components/MenuButton/MenuButton.js.map +0 -1
- package/lib-amd/components/MenuButton/MenuButton.types.js +0 -5
- package/lib-amd/components/MenuButton/MenuButton.types.js.map +0 -1
- package/lib-amd/components/MenuButton/index.js +0 -12
- package/lib-amd/components/MenuButton/index.js.map +0 -1
- package/lib-amd/components/MenuButton/renderMenuButton.js +0 -18
- package/lib-amd/components/MenuButton/renderMenuButton.js.map +0 -1
- package/lib-amd/components/MenuButton/useMenuButton.js +0 -30
- package/lib-amd/components/MenuButton/useMenuButton.js.map +0 -1
- package/lib-amd/components/MenuButton/useMenuButtonStyles.js +0 -97
- package/lib-amd/components/MenuButton/useMenuButtonStyles.js.map +0 -1
- package/lib-amd/components/SplitButton/SplitButton.js +0 -19
- package/lib-amd/components/SplitButton/SplitButton.js.map +0 -1
- package/lib-amd/components/SplitButton/SplitButton.types.js +0 -5
- package/lib-amd/components/SplitButton/SplitButton.types.js.map +0 -1
- package/lib-amd/components/SplitButton/index.js +0 -12
- package/lib-amd/components/SplitButton/index.js.map +0 -1
- package/lib-amd/components/SplitButton/renderSplitButton.js +0 -16
- package/lib-amd/components/SplitButton/renderSplitButton.js.map +0 -1
- package/lib-amd/components/SplitButton/useSplitButton.js +0 -67
- package/lib-amd/components/SplitButton/useSplitButton.js.map +0 -1
- package/lib-amd/components/SplitButton/useSplitButtonStyles.js +0 -162
- package/lib-amd/components/SplitButton/useSplitButtonStyles.js.map +0 -1
- package/lib-amd/components/ToggleButton/ToggleButton.js +0 -18
- package/lib-amd/components/ToggleButton/ToggleButton.js.map +0 -1
- package/lib-amd/components/ToggleButton/ToggleButton.types.js +0 -5
- package/lib-amd/components/ToggleButton/ToggleButton.types.js.map +0 -1
- package/lib-amd/components/ToggleButton/index.js +0 -12
- package/lib-amd/components/ToggleButton/index.js.map +0 -1
- package/lib-amd/components/ToggleButton/renderToggleButton.js +0 -7
- package/lib-amd/components/ToggleButton/renderToggleButton.js.map +0 -1
- package/lib-amd/components/ToggleButton/useToggleButton.js +0 -17
- package/lib-amd/components/ToggleButton/useToggleButton.js.map +0 -1
- package/lib-amd/components/ToggleButton/useToggleButtonStyles.js +0 -87
- package/lib-amd/components/ToggleButton/useToggleButtonStyles.js.map +0 -1
- package/lib-amd/contexts/ButtonContext.js +0 -19
- package/lib-amd/contexts/ButtonContext.js.map +0 -1
- package/lib-amd/contexts/index.js +0 -6
- package/lib-amd/contexts/index.js.map +0 -1
- package/lib-amd/index.js +0 -34
- package/lib-amd/index.js.map +0 -1
- package/lib-amd/utils/index.js +0 -6
- package/lib-amd/utils/index.js.map +0 -1
- package/lib-amd/utils/useToggleState.js +0 -27
- package/lib-amd/utils/useToggleState.js.map +0 -1
@@ -1,16 +0,0 @@
|
|
1
|
-
define(["require", "exports", "tslib", "react", "@fluentui/react-utilities"], function (require, exports, tslib_1, React, react_utilities_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
exports.renderSplitButton_unstable = void 0;
|
5
|
-
/**
|
6
|
-
* Renders a SplitButton component by passing the state defined props to the appropriate slots.
|
7
|
-
*/
|
8
|
-
var renderSplitButton_unstable = function (state) {
|
9
|
-
var _a = react_utilities_1.getSlots(state), slots = _a.slots, slotProps = _a.slotProps;
|
10
|
-
return (React.createElement(slots.root, tslib_1.__assign({}, slotProps.root),
|
11
|
-
slots.primaryActionButton && React.createElement(slots.primaryActionButton, tslib_1.__assign({}, slotProps.primaryActionButton)),
|
12
|
-
slots.menuButton && React.createElement(slots.menuButton, tslib_1.__assign({}, slotProps.menuButton))));
|
13
|
-
};
|
14
|
-
exports.renderSplitButton_unstable = renderSplitButton_unstable;
|
15
|
-
});
|
16
|
-
//# sourceMappingURL=renderSplitButton.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"renderSplitButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/renderSplitButton.tsx"],"names":[],"mappings":";;;;IAIA;;OAEG;IACI,IAAM,0BAA0B,GAAG,UAAC,KAAuB;QAC1D,IAAA,KAAuB,0BAAQ,CAAmB,KAAK,CAAC,EAAtD,KAAK,WAAA,EAAE,SAAS,eAAsC,CAAC;QAE/D,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI;YAC3B,KAAK,CAAC,mBAAmB,IAAI,oBAAC,KAAK,CAAC,mBAAmB,uBAAK,SAAS,CAAC,mBAAmB,EAAI;YAC7F,KAAK,CAAC,UAAU,IAAI,oBAAC,KAAK,CAAC,UAAU,uBAAK,SAAS,CAAC,UAAU,EAAI,CACxD,CACd,CAAC;IACJ,CAAC,CAAC;IATW,QAAA,0BAA0B,8BASrC","sourcesContent":["import * as React from 'react';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { SplitButtonSlots, SplitButtonState } from './SplitButton.types';\n\n/**\n * Renders a SplitButton component by passing the state defined props to the appropriate slots.\n */\nexport const renderSplitButton_unstable = (state: SplitButtonState) => {\n const { slots, slotProps } = getSlots<SplitButtonSlots>(state);\n\n return (\n <slots.root {...slotProps.root}>\n {slots.primaryActionButton && <slots.primaryActionButton {...slotProps.primaryActionButton} />}\n {slots.menuButton && <slots.menuButton {...slotProps.menuButton} />}\n </slots.root>\n );\n};\n"]}
|
@@ -1,67 +0,0 @@
|
|
1
|
-
define(["require", "exports", "tslib", "@fluentui/react-utilities", "../Button/Button", "../MenuButton/MenuButton"], function (require, exports, tslib_1, react_utilities_1, Button_1, MenuButton_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
exports.useSplitButton_unstable = void 0;
|
5
|
-
/**
|
6
|
-
* Given user props, defines default props for the SplitButton and returns processed state.
|
7
|
-
* @param props - User provided props to the SplitButton component.
|
8
|
-
* @param ref - User provided ref to be passed to the SplitButton component.
|
9
|
-
*/
|
10
|
-
var useSplitButton_unstable = function (props, ref) {
|
11
|
-
var _a = props.appearance, appearance = _a === void 0 ? 'secondary' : _a, children = props.children, _b = props.disabled, disabled = _b === void 0 ? false : _b, _c = props.disabledFocusable, disabledFocusable = _c === void 0 ? false : _c, icon = props.icon, _d = props.iconPosition, iconPosition = _d === void 0 ? 'before' : _d, menuButton = props.menuButton, menuIcon = props.menuIcon, primaryActionButton = props.primaryActionButton, _e = props.shape, shape = _e === void 0 ? 'rounded' : _e, _f = props.size, size = _f === void 0 ? 'medium' : _f;
|
12
|
-
var baseId = react_utilities_1.useId('splitButton-');
|
13
|
-
var menuButtonShorthand = react_utilities_1.resolveShorthand(menuButton, {
|
14
|
-
defaultProps: {
|
15
|
-
appearance: appearance,
|
16
|
-
disabled: disabled,
|
17
|
-
disabledFocusable: disabledFocusable,
|
18
|
-
menuIcon: menuIcon,
|
19
|
-
shape: shape,
|
20
|
-
size: size,
|
21
|
-
},
|
22
|
-
required: true,
|
23
|
-
});
|
24
|
-
var primaryActionButtonShorthand = react_utilities_1.resolveShorthand(primaryActionButton, {
|
25
|
-
defaultProps: {
|
26
|
-
appearance: appearance,
|
27
|
-
children: children,
|
28
|
-
disabled: disabled,
|
29
|
-
disabledFocusable: disabledFocusable,
|
30
|
-
icon: icon,
|
31
|
-
iconPosition: iconPosition,
|
32
|
-
id: baseId + '__primaryActionButton',
|
33
|
-
shape: shape,
|
34
|
-
size: size,
|
35
|
-
},
|
36
|
-
required: true,
|
37
|
-
});
|
38
|
-
// Resolve menu button's aria-labelledby to be labelled by the primary action button if not a label was not provided
|
39
|
-
// by the user.
|
40
|
-
if (menuButtonShorthand &&
|
41
|
-
primaryActionButtonShorthand &&
|
42
|
-
!menuButtonShorthand['aria-label'] &&
|
43
|
-
!menuButtonShorthand['aria-labelledby']) {
|
44
|
-
menuButtonShorthand['aria-labelledby'] = primaryActionButtonShorthand.id;
|
45
|
-
}
|
46
|
-
return {
|
47
|
-
// Props passed at the top-level
|
48
|
-
appearance: appearance,
|
49
|
-
disabled: disabled,
|
50
|
-
disabledFocusable: disabledFocusable,
|
51
|
-
iconPosition: iconPosition,
|
52
|
-
shape: shape,
|
53
|
-
size: size,
|
54
|
-
// Slots definition
|
55
|
-
components: {
|
56
|
-
root: 'div',
|
57
|
-
menuButton: MenuButton_1.MenuButton,
|
58
|
-
primaryActionButton: Button_1.Button,
|
59
|
-
},
|
60
|
-
root: react_utilities_1.getNativeElementProps('div', tslib_1.__assign({ ref: ref }, props)),
|
61
|
-
menuButton: menuButtonShorthand,
|
62
|
-
primaryActionButton: primaryActionButtonShorthand,
|
63
|
-
};
|
64
|
-
};
|
65
|
-
exports.useSplitButton_unstable = useSplitButton_unstable;
|
66
|
-
});
|
67
|
-
//# sourceMappingURL=useSplitButton.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"useSplitButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/useSplitButton.ts"],"names":[],"mappings":";;;;IAMA;;;;OAIG;IACI,IAAM,uBAAuB,GAAG,UACrC,KAAuB,EACvB,GAAqD;QAGnD,IAAA,KAWE,KAAK,WAXiB,EAAxB,UAAU,mBAAG,WAAW,KAAA,EACxB,QAAQ,GAUN,KAAK,SAVC,EACR,KASE,KAAK,SATS,EAAhB,QAAQ,mBAAG,KAAK,KAAA,EAChB,KAQE,KAAK,kBARkB,EAAzB,iBAAiB,mBAAG,KAAK,KAAA,EACzB,IAAI,GAOF,KAAK,KAPH,EACJ,KAME,KAAK,aANgB,EAAvB,YAAY,mBAAG,QAAQ,KAAA,EACvB,UAAU,GAKR,KAAK,WALG,EACV,QAAQ,GAIN,KAAK,SAJC,EACR,mBAAmB,GAGjB,KAAK,oBAHY,EACnB,KAEE,KAAK,MAFU,EAAjB,KAAK,mBAAG,SAAS,KAAA,EACjB,KACE,KAAK,KADQ,EAAf,IAAI,mBAAG,QAAQ,KAAA,CACP;QAEV,IAAM,MAAM,GAAG,uBAAK,CAAC,cAAc,CAAC,CAAC;QAErC,IAAM,mBAAmB,GAAG,kCAAgB,CAAC,UAAU,EAAE;YACvD,YAAY,EAAE;gBACZ,UAAU,YAAA;gBACV,QAAQ,UAAA;gBACR,iBAAiB,mBAAA;gBACjB,QAAQ,UAAA;gBACR,KAAK,OAAA;gBACL,IAAI,MAAA;aACL;YACD,QAAQ,EAAE,IAAI;SACf,CAAC,CAAC;QAEH,IAAM,4BAA4B,GAAG,kCAAgB,CAAC,mBAAmB,EAAE;YACzE,YAAY,EAAE;gBACZ,UAAU,YAAA;gBACV,QAAQ,UAAA;gBACR,QAAQ,UAAA;gBACR,iBAAiB,mBAAA;gBACjB,IAAI,MAAA;gBACJ,YAAY,cAAA;gBACZ,EAAE,EAAE,MAAM,GAAG,uBAAuB;gBACpC,KAAK,OAAA;gBACL,IAAI,MAAA;aACL;YACD,QAAQ,EAAE,IAAI;SACf,CAAC,CAAC;QAEH,oHAAoH;QACpH,eAAe;QACf,IACE,mBAAmB;YACnB,4BAA4B;YAC5B,CAAC,mBAAmB,CAAC,YAAY,CAAC;YAClC,CAAC,mBAAmB,CAAC,iBAAiB,CAAC,EACvC;YACA,mBAAmB,CAAC,iBAAiB,CAAC,GAAG,4BAA4B,CAAC,EAAE,CAAC;SAC1E;QAED,OAAO;YACL,gCAAgC;YAChC,UAAU,YAAA;YACV,QAAQ,UAAA;YACR,iBAAiB,mBAAA;YACjB,YAAY,cAAA;YACZ,KAAK,OAAA;YACL,IAAI,MAAA;YAEJ,mBAAmB;YACnB,UAAU,EAAE;gBACV,IAAI,EAAE,KAAK;gBACX,UAAU,EAAE,uBAAU;gBACtB,mBAAmB,EAAE,eAAM;aAC5B;YAED,IAAI,EAAE,uCAAqB,CAAC,KAAK,qBAAI,GAAG,KAAA,IAAK,KAAK,EAAG;YACrD,UAAU,EAAE,mBAAmB;YAC/B,mBAAmB,EAAE,4BAA4B;SAClD,CAAC;IACJ,CAAC,CAAC;IA9EW,QAAA,uBAAuB,2BA8ElC","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } from '@fluentui/react-utilities';\nimport { Button } from '../Button/Button';\nimport { MenuButton } from '../MenuButton/MenuButton';\nimport type { SplitButtonProps, SplitButtonState } from './SplitButton.types';\n\n/**\n * Given user props, defines default props for the SplitButton and returns processed state.\n * @param props - User provided props to the SplitButton component.\n * @param ref - User provided ref to be passed to the SplitButton component.\n */\nexport const useSplitButton_unstable = (\n props: SplitButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): SplitButtonState => {\n const {\n appearance = 'secondary',\n children,\n disabled = false,\n disabledFocusable = false,\n icon,\n iconPosition = 'before',\n menuButton,\n menuIcon,\n primaryActionButton,\n shape = 'rounded',\n size = 'medium',\n } = props;\n\n const baseId = useId('splitButton-');\n\n const menuButtonShorthand = resolveShorthand(menuButton, {\n defaultProps: {\n appearance,\n disabled,\n disabledFocusable,\n menuIcon,\n shape,\n size,\n },\n required: true,\n });\n\n const primaryActionButtonShorthand = resolveShorthand(primaryActionButton, {\n defaultProps: {\n appearance,\n children,\n disabled,\n disabledFocusable,\n icon,\n iconPosition,\n id: baseId + '__primaryActionButton',\n shape,\n size,\n },\n required: true,\n });\n\n // Resolve menu button's aria-labelledby to be labelled by the primary action button if not a label was not provided\n // by the user.\n if (\n menuButtonShorthand &&\n primaryActionButtonShorthand &&\n !menuButtonShorthand['aria-label'] &&\n !menuButtonShorthand['aria-labelledby']\n ) {\n menuButtonShorthand['aria-labelledby'] = primaryActionButtonShorthand.id;\n }\n\n return {\n // Props passed at the top-level\n appearance,\n disabled,\n disabledFocusable,\n iconPosition,\n shape,\n size,\n\n // Slots definition\n components: {\n root: 'div',\n menuButton: MenuButton,\n primaryActionButton: Button,\n },\n\n root: getNativeElementProps('div', { ref, ...props }),\n menuButton: menuButtonShorthand,\n primaryActionButton: primaryActionButtonShorthand,\n };\n};\n"]}
|
@@ -1,162 +0,0 @@
|
|
1
|
-
define(["require", "exports", "@griffel/react", "@fluentui/react-tabster", "@fluentui/react-theme"], function (require, exports, react_1, react_tabster_1, react_theme_1) {
|
2
|
-
"use strict";
|
3
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
|
4
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
5
|
-
exports.useSplitButtonStyles_unstable = exports.splitButtonClassNames = void 0;
|
6
|
-
exports.splitButtonClassNames = {
|
7
|
-
root: 'fui-SplitButton',
|
8
|
-
menuButton: 'fui-SplitButton__menuButton',
|
9
|
-
primaryActionButton: 'fui-SplitButton__primaryActionButton',
|
10
|
-
};
|
11
|
-
var useFocusStyles = react_1.makeStyles({
|
12
|
-
primaryActionButton: react_tabster_1.createCustomFocusIndicatorStyle({
|
13
|
-
borderTopRightRadius: 0,
|
14
|
-
borderBottomRightRadius: 0,
|
15
|
-
}),
|
16
|
-
menuButton: react_tabster_1.createCustomFocusIndicatorStyle({
|
17
|
-
borderLeftWidth: 0,
|
18
|
-
borderTopLeftRadius: 0,
|
19
|
-
borderBottomLeftRadius: 0,
|
20
|
-
}),
|
21
|
-
});
|
22
|
-
var useRootStyles = react_1.makeStyles({
|
23
|
-
// Base styles
|
24
|
-
base: (_a = {
|
25
|
-
display: 'inline-flex',
|
26
|
-
justifyContent: 'stretch',
|
27
|
-
position: 'relative',
|
28
|
-
verticalAlign: 'middle'
|
29
|
-
},
|
30
|
-
_a["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
31
|
-
borderTopRightRadius: 0,
|
32
|
-
borderBottomRightRadius: 0,
|
33
|
-
},
|
34
|
-
_a["& ." + exports.splitButtonClassNames.menuButton] = {
|
35
|
-
borderLeftWidth: 0,
|
36
|
-
borderTopLeftRadius: 0,
|
37
|
-
borderBottomLeftRadius: 0,
|
38
|
-
minWidth: 0,
|
39
|
-
},
|
40
|
-
_a),
|
41
|
-
// Appearance variations
|
42
|
-
outline: {
|
43
|
-
/* No styles */
|
44
|
-
},
|
45
|
-
primary: (_b = {},
|
46
|
-
_b["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
47
|
-
borderRightColor: react_theme_1.tokens.colorNeutralForegroundOnBrand,
|
48
|
-
},
|
49
|
-
_b[':hover'] = (_c = {},
|
50
|
-
_c["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
51
|
-
borderRightColor: react_theme_1.tokens.colorNeutralForegroundOnBrand,
|
52
|
-
},
|
53
|
-
_c),
|
54
|
-
_b[':hover:active'] = (_d = {},
|
55
|
-
_d["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
56
|
-
borderRightColor: react_theme_1.tokens.colorNeutralForegroundOnBrand,
|
57
|
-
},
|
58
|
-
_d),
|
59
|
-
_b['@media (forced-colors: active)'] = (_e = {},
|
60
|
-
_e["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
61
|
-
borderRightColor: 'HighlightText',
|
62
|
-
},
|
63
|
-
_e[':hover'] = (_f = {},
|
64
|
-
_f["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
65
|
-
borderRightColor: 'Highlight',
|
66
|
-
},
|
67
|
-
_f),
|
68
|
-
_e[':hover:active'] = (_g = {},
|
69
|
-
_g["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
70
|
-
borderRightColor: 'Highlight',
|
71
|
-
},
|
72
|
-
_g),
|
73
|
-
_e),
|
74
|
-
_b),
|
75
|
-
secondary: {
|
76
|
-
/* The secondary styles are exactly the same as the base styles. */
|
77
|
-
},
|
78
|
-
subtle: (_h = {},
|
79
|
-
_h["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
80
|
-
borderRightColor: react_theme_1.tokens.colorNeutralStroke1,
|
81
|
-
},
|
82
|
-
_h[':hover'] = (_j = {},
|
83
|
-
_j["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
84
|
-
borderRightColor: react_theme_1.tokens.colorNeutralStroke1Hover,
|
85
|
-
},
|
86
|
-
_j),
|
87
|
-
_h[':hover:active'] = (_k = {},
|
88
|
-
_k["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
89
|
-
borderRightColor: react_theme_1.tokens.colorNeutralStroke1Pressed,
|
90
|
-
},
|
91
|
-
_k),
|
92
|
-
_h),
|
93
|
-
transparent: (_l = {},
|
94
|
-
_l["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
95
|
-
borderRightColor: react_theme_1.tokens.colorNeutralStroke1,
|
96
|
-
},
|
97
|
-
_l[':hover'] = (_m = {},
|
98
|
-
_m["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
99
|
-
borderRightColor: react_theme_1.tokens.colorNeutralStroke1Hover,
|
100
|
-
},
|
101
|
-
_m),
|
102
|
-
_l[':hover:active'] = (_o = {},
|
103
|
-
_o["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
104
|
-
borderRightColor: react_theme_1.tokens.colorNeutralStroke1Pressed,
|
105
|
-
},
|
106
|
-
_o),
|
107
|
-
_l),
|
108
|
-
// Shape variations
|
109
|
-
circular: {},
|
110
|
-
rounded: {},
|
111
|
-
square: {},
|
112
|
-
// Disabled styles
|
113
|
-
disabled: (_p = {},
|
114
|
-
_p["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
115
|
-
borderRightColor: react_theme_1.tokens.colorNeutralStrokeDisabled,
|
116
|
-
},
|
117
|
-
_p[':hover'] = (_q = {},
|
118
|
-
_q["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
119
|
-
borderRightColor: react_theme_1.tokens.colorNeutralStrokeDisabled,
|
120
|
-
},
|
121
|
-
_q),
|
122
|
-
_p[':hover:active'] = (_r = {},
|
123
|
-
_r["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
124
|
-
borderRightColor: react_theme_1.tokens.colorNeutralStrokeDisabled,
|
125
|
-
},
|
126
|
-
_r),
|
127
|
-
_p),
|
128
|
-
// Disabled high contrast styles
|
129
|
-
disabledHighContrast: {
|
130
|
-
'@media (forced-colors: active)': (_s = {},
|
131
|
-
_s["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
132
|
-
borderRightColor: 'GrayText',
|
133
|
-
},
|
134
|
-
_s[':hover'] = (_t = {},
|
135
|
-
_t["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
136
|
-
borderRightColor: 'GrayText',
|
137
|
-
},
|
138
|
-
_t),
|
139
|
-
_s[':hover:active'] = (_u = {},
|
140
|
-
_u["& ." + exports.splitButtonClassNames.primaryActionButton] = {
|
141
|
-
borderRightColor: 'GrayText',
|
142
|
-
},
|
143
|
-
_u),
|
144
|
-
_s),
|
145
|
-
},
|
146
|
-
});
|
147
|
-
var useSplitButtonStyles_unstable = function (state) {
|
148
|
-
var rootStyles = useRootStyles();
|
149
|
-
var focusStyles = useFocusStyles();
|
150
|
-
var appearance = state.appearance, disabled = state.disabled, disabledFocusable = state.disabledFocusable;
|
151
|
-
state.root.className = react_1.mergeClasses(exports.splitButtonClassNames.root, rootStyles.base, appearance && rootStyles[appearance], (disabled || disabledFocusable) && rootStyles.disabled, (disabled || disabledFocusable) && rootStyles.disabledHighContrast, state.root.className);
|
152
|
-
if (state.menuButton) {
|
153
|
-
state.menuButton.className = react_1.mergeClasses(exports.splitButtonClassNames.menuButton, focusStyles.menuButton, state.menuButton.className);
|
154
|
-
}
|
155
|
-
if (state.primaryActionButton) {
|
156
|
-
state.primaryActionButton.className = react_1.mergeClasses(exports.splitButtonClassNames.primaryActionButton, focusStyles.primaryActionButton, state.primaryActionButton.className);
|
157
|
-
}
|
158
|
-
return state;
|
159
|
-
};
|
160
|
-
exports.useSplitButtonStyles_unstable = useSplitButtonStyles_unstable;
|
161
|
-
});
|
162
|
-
//# sourceMappingURL=useSplitButtonStyles.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"useSplitButtonStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/SplitButton/useSplitButtonStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { SplitButtonSlots, SplitButtonState } from './SplitButton.types';\n\nexport const splitButtonClassNames: SlotClassNames<SplitButtonSlots> = {\n root: 'fui-SplitButton',\n menuButton: 'fui-SplitButton__menuButton',\n primaryActionButton: 'fui-SplitButton__primaryActionButton',\n};\n\nconst useFocusStyles = makeStyles({\n primaryActionButton: createCustomFocusIndicatorStyle({\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n }),\n\n menuButton: createCustomFocusIndicatorStyle({\n borderLeftWidth: 0,\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n }),\n});\n\nconst useRootStyles = makeStyles({\n // Base styles\n base: {\n display: 'inline-flex',\n justifyContent: 'stretch',\n position: 'relative',\n verticalAlign: 'middle',\n\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderTopRightRadius: 0,\n borderBottomRightRadius: 0,\n },\n\n [`& .${splitButtonClassNames.menuButton}`]: {\n borderLeftWidth: 0,\n borderTopLeftRadius: 0,\n borderBottomLeftRadius: 0,\n minWidth: 0,\n },\n },\n\n // Appearance variations\n outline: {\n /* No styles */\n },\n primary: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralForegroundOnBrand,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralForegroundOnBrand,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralForegroundOnBrand,\n },\n },\n\n '@media (forced-colors: active)': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'HighlightText',\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'Highlight',\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'Highlight',\n },\n },\n },\n },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Hover,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Pressed,\n },\n },\n },\n transparent: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Hover,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStroke1Pressed,\n },\n },\n },\n\n // Shape variations\n circular: {},\n rounded: {},\n square: {},\n\n // Disabled styles\n disabled: {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStrokeDisabled,\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStrokeDisabled,\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: tokens.colorNeutralStrokeDisabled,\n },\n },\n },\n\n // Disabled high contrast styles\n disabledHighContrast: {\n '@media (forced-colors: active)': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'GrayText',\n },\n\n ':hover': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'GrayText',\n },\n },\n\n ':hover:active': {\n [`& .${splitButtonClassNames.primaryActionButton}`]: {\n borderRightColor: 'GrayText',\n },\n },\n },\n },\n});\n\nexport const useSplitButtonStyles_unstable = (state: SplitButtonState): SplitButtonState => {\n const rootStyles = useRootStyles();\n const focusStyles = useFocusStyles();\n\n const { appearance, disabled, disabledFocusable } = state;\n\n state.root.className = mergeClasses(\n splitButtonClassNames.root,\n rootStyles.base,\n appearance && rootStyles[appearance],\n (disabled || disabledFocusable) && rootStyles.disabled,\n (disabled || disabledFocusable) && rootStyles.disabledHighContrast,\n state.root.className,\n );\n\n if (state.menuButton) {\n state.menuButton.className = mergeClasses(\n splitButtonClassNames.menuButton,\n focusStyles.menuButton,\n state.menuButton.className,\n );\n }\n\n if (state.primaryActionButton) {\n state.primaryActionButton.className = mergeClasses(\n splitButtonClassNames.primaryActionButton,\n focusStyles.primaryActionButton,\n state.primaryActionButton.className,\n );\n }\n\n return state;\n};\n"]}
|
@@ -1,18 +0,0 @@
|
|
1
|
-
define(["require", "exports", "react", "./renderToggleButton", "./useToggleButton", "./useToggleButtonStyles", "@fluentui/react-shared-contexts"], function (require, exports, React, renderToggleButton_1, useToggleButton_1, useToggleButtonStyles_1, react_shared_contexts_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
exports.ToggleButton = void 0;
|
5
|
-
/**
|
6
|
-
* ToggleButtons are buttons that toggle between two defined states when triggered.
|
7
|
-
*/
|
8
|
-
exports.ToggleButton = React.forwardRef(function (props, ref) {
|
9
|
-
var state = useToggleButton_1.useToggleButton_unstable(props, ref);
|
10
|
-
useToggleButtonStyles_1.useToggleButtonStyles_unstable(state);
|
11
|
-
var useCustomStyles = react_shared_contexts_1.useCustomStyleHooks_unstable().useToggleButtonStyles_unstable;
|
12
|
-
useCustomStyles(state);
|
13
|
-
return renderToggleButton_1.renderToggleButton_unstable(state);
|
14
|
-
// Casting is required due to lack of distributive union to support unions on @types/react
|
15
|
-
});
|
16
|
-
exports.ToggleButton.displayName = 'ToggleButton';
|
17
|
-
});
|
18
|
-
//# sourceMappingURL=ToggleButton.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"ToggleButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/ToggleButton.tsx"],"names":[],"mappings":";;;;IAQA;;OAEG;IACU,QAAA,YAAY,GAA2C,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QAC9F,IAAM,KAAK,GAAG,0CAAwB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEnD,sDAA8B,CAAC,KAAK,CAAC,CAAC;QAE9B,IAAgC,eAAe,GAAK,oDAA4B,EAAE,+BAAnC,CAAoC;QAC3F,eAAe,CAAC,KAAK,CAAC,CAAC;QAEvB,OAAO,gDAA2B,CAAC,KAAK,CAAC,CAAC;QAC1C,0FAA0F;IAC5F,CAAC,CAA2C,CAAC;IAE7C,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC","sourcesContent":["import * as React from 'react';\nimport { renderToggleButton_unstable } from './renderToggleButton';\nimport { useToggleButton_unstable } from './useToggleButton';\nimport { useToggleButtonStyles_unstable } from './useToggleButtonStyles';\nimport type { ToggleButtonProps } from './ToggleButton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHooks_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * ToggleButtons are buttons that toggle between two defined states when triggered.\n */\nexport const ToggleButton: ForwardRefComponent<ToggleButtonProps> = React.forwardRef((props, ref) => {\n const state = useToggleButton_unstable(props, ref);\n\n useToggleButtonStyles_unstable(state);\n\n const { useToggleButtonStyles_unstable: useCustomStyles } = useCustomStyleHooks_unstable();\n useCustomStyles(state);\n\n return renderToggleButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<ToggleButtonProps>;\n\nToggleButton.displayName = 'ToggleButton';\n"]}
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"ToggleButton.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/ToggleButton.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { ButtonProps, ButtonState } from '../Button/Button.types';\n\nexport type ToggleButtonProps = ButtonProps & {\n /**\n * Defines whether the `ToggleButton` is initially in a checked state or not when rendered.\n *\n * @default false\n */\n defaultChecked?: boolean;\n\n /**\n * Defines the controlled checked state of the `ToggleButton`.\n * If passed, `ToggleButton` ignores the `defaultChecked` property.\n * This should only be used if the checked state is to be controlled at a higher level and there is a plan to pass the\n * correct value based on handling `onClick` events and re-rendering.\n *\n * @default false\n */\n checked?: boolean;\n};\n\nexport type ToggleButtonState = ButtonState & Required<Pick<ToggleButtonProps, 'checked'>>;\n"]}
|
@@ -1,12 +0,0 @@
|
|
1
|
-
define(["require", "exports", "tslib", "./ToggleButton", "./ToggleButton.types", "./renderToggleButton", "./useToggleButton", "./useToggleButtonStyles"], function (require, exports, tslib_1, ToggleButton_1, ToggleButton_types_1, renderToggleButton_1, useToggleButton_1, useToggleButtonStyles_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
exports.useToggleButtonStyles_unstable = exports.toggleButtonClassNames = void 0;
|
5
|
-
tslib_1.__exportStar(ToggleButton_1, exports);
|
6
|
-
tslib_1.__exportStar(ToggleButton_types_1, exports);
|
7
|
-
tslib_1.__exportStar(renderToggleButton_1, exports);
|
8
|
-
tslib_1.__exportStar(useToggleButton_1, exports);
|
9
|
-
Object.defineProperty(exports, "toggleButtonClassNames", { enumerable: true, get: function () { return useToggleButtonStyles_1.toggleButtonClassNames; } });
|
10
|
-
Object.defineProperty(exports, "useToggleButtonStyles_unstable", { enumerable: true, get: function () { return useToggleButtonStyles_1.useToggleButtonStyles_unstable; } });
|
11
|
-
});
|
12
|
-
//# sourceMappingURL=index.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/index.ts"],"names":[],"mappings":";;;;IAAA,8CAA+B;IAC/B,oDAAqC;IACrC,oDAAqC;IACrC,iDAAkC;IACzB,+HAAA,sBAAsB,OAAA;IAAE,uIAAA,8BAA8B,OAAA","sourcesContent":["export * from './ToggleButton';\nexport * from './ToggleButton.types';\nexport * from './renderToggleButton';\nexport * from './useToggleButton';\nexport { toggleButtonClassNames, useToggleButtonStyles_unstable } from './useToggleButtonStyles';\n"]}
|
@@ -1,7 +0,0 @@
|
|
1
|
-
define(["require", "exports", "../Button/renderButton"], function (require, exports, renderButton_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
exports.renderToggleButton_unstable = void 0;
|
5
|
-
Object.defineProperty(exports, "renderToggleButton_unstable", { enumerable: true, get: function () { return renderButton_1.renderButton_unstable; } });
|
6
|
-
});
|
7
|
-
//# sourceMappingURL=renderToggleButton.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"renderToggleButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/renderToggleButton.tsx"],"names":[],"mappings":";;;;IAAS,2HAAA,qBAAqB,OAA+B","sourcesContent":["export { renderButton_unstable as renderToggleButton_unstable } from '../Button/renderButton';\n"]}
|
@@ -1,17 +0,0 @@
|
|
1
|
-
define(["require", "exports", "../../utils/useToggleState", "../Button/useButton"], function (require, exports, useToggleState_1, useButton_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
exports.useToggleButton_unstable = void 0;
|
5
|
-
/**
|
6
|
-
* Given user props, defines default props for the ToggleButton, calls useButtonState and useChecked, and returns
|
7
|
-
* processed state.
|
8
|
-
* @param props - User provided props to the ToggleButton component.
|
9
|
-
* @param ref - User provided ref to be passed to the ToggleButton component.
|
10
|
-
*/
|
11
|
-
var useToggleButton_unstable = function (props, ref) {
|
12
|
-
var buttonState = useButton_1.useButton_unstable(props, ref);
|
13
|
-
return useToggleState_1.useToggleState(props, buttonState);
|
14
|
-
};
|
15
|
-
exports.useToggleButton_unstable = useToggleButton_unstable;
|
16
|
-
});
|
17
|
-
//# sourceMappingURL=useToggleButton.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"useToggleButton.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/useToggleButton.ts"],"names":[],"mappings":";;;;IAKA;;;;;OAKG;IACI,IAAM,wBAAwB,GAAG,UACtC,KAAwB,EACxB,GAAqD;QAErD,IAAM,WAAW,GAAG,8BAAkB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAEnD,OAAO,+BAAc,CAAC,KAAK,EAAE,WAAW,CAAC,CAAC;IAC5C,CAAC,CAAC;IAPW,QAAA,wBAAwB,4BAOnC","sourcesContent":["import * as React from 'react';\nimport { useToggleState } from '../../utils/useToggleState';\nimport { useButton_unstable } from '../Button/useButton';\nimport type { ToggleButtonProps, ToggleButtonState } from './ToggleButton.types';\n\n/**\n * Given user props, defines default props for the ToggleButton, calls useButtonState and useChecked, and returns\n * processed state.\n * @param props - User provided props to the ToggleButton component.\n * @param ref - User provided ref to be passed to the ToggleButton component.\n */\nexport const useToggleButton_unstable = (\n props: ToggleButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): ToggleButtonState => {\n const buttonState = useButton_unstable(props, ref);\n\n return useToggleState(props, buttonState);\n};\n"]}
|
@@ -1,87 +0,0 @@
|
|
1
|
-
define(["require", "exports", "tslib", "@fluentui/react-icons", "@fluentui/react-tabster", "@fluentui/react-theme", "@griffel/react", "../Button/useButtonStyles"], function (require, exports, tslib_1, react_icons_1, react_tabster_1, react_theme_1, react_1, useButtonStyles_1) {
|
2
|
-
"use strict";
|
3
|
-
var _a;
|
4
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
5
|
-
exports.useToggleButtonStyles_unstable = exports.toggleButtonClassNames = void 0;
|
6
|
-
exports.toggleButtonClassNames = {
|
7
|
-
root: 'fui-ToggleButton',
|
8
|
-
icon: 'fui-ToggleButton__icon',
|
9
|
-
};
|
10
|
-
var useRootCheckedStyles = react_1.makeStyles({
|
11
|
-
// Base styles
|
12
|
-
base: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorNeutralBackground1Selected }, react_1.shorthands.borderColor(react_theme_1.tokens.colorNeutralStroke1)), { color: react_theme_1.tokens.colorNeutralForeground1Selected }), react_1.shorthands.borderWidth(react_theme_1.tokens.strokeWidthThin)), (_a = {}, _a["& ." + react_icons_1.iconFilledClassName] = {
|
13
|
-
display: 'inline',
|
14
|
-
}, _a["& ." + react_icons_1.iconRegularClassName] = {
|
15
|
-
display: 'none',
|
16
|
-
}, _a[':hover'] = tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorNeutralBackground1Hover }, react_1.shorthands.borderColor(react_theme_1.tokens.colorNeutralStroke1Hover)), { color: react_theme_1.tokens.colorNeutralForeground1Hover }), _a[':hover:active'] = tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorNeutralBackground1Pressed }, react_1.shorthands.borderColor(react_theme_1.tokens.colorNeutralStroke1Pressed)), { color: react_theme_1.tokens.colorNeutralForeground1Pressed }), _a)),
|
17
|
-
// High contrast styles
|
18
|
-
highContrast: {
|
19
|
-
'@media (forced-colors: active)': tslib_1.__assign(tslib_1.__assign({ backgroundColor: 'Highlight' }, react_1.shorthands.borderColor('Highlight')), { color: 'HighlightText', forcedColorAdjust: 'none', ':hover': tslib_1.__assign(tslib_1.__assign({ backgroundColor: 'HighlightText' }, react_1.shorthands.borderColor('Highlight')), { color: 'Highlight' }), ':hover:active': tslib_1.__assign(tslib_1.__assign({ backgroundColor: 'HighlightText' }, react_1.shorthands.borderColor('Highlight')), { color: 'Highlight' }), ':focus': tslib_1.__assign(tslib_1.__assign({}, react_1.shorthands.border('1px', 'solid', 'HighlightText')), { outlineColor: 'Highlight' }) }),
|
20
|
-
},
|
21
|
-
// Appearance variations
|
22
|
-
outline: tslib_1.__assign(tslib_1.__assign(tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackgroundSelected }, react_1.shorthands.borderColor(react_theme_1.tokens.colorNeutralStroke1)), react_1.shorthands.borderWidth(react_theme_1.tokens.strokeWidthThicker)), { ':hover': {
|
23
|
-
backgroundColor: react_theme_1.tokens.colorTransparentBackgroundHover,
|
24
|
-
}, ':hover:active': {
|
25
|
-
backgroundColor: react_theme_1.tokens.colorTransparentBackgroundPressed,
|
26
|
-
} }), react_tabster_1.createCustomFocusIndicatorStyle(tslib_1.__assign({}, react_1.shorthands.borderColor(react_theme_1.tokens.colorNeutralStroke1)))),
|
27
|
-
primary: tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorBrandBackgroundSelected }, react_1.shorthands.borderColor('transparent')), { color: react_theme_1.tokens.colorNeutralForegroundOnBrand, ':hover': tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorBrandBackgroundHover }, react_1.shorthands.borderColor('transparent')), { color: react_theme_1.tokens.colorNeutralForegroundOnBrand }), ':hover:active': tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorBrandBackgroundPressed }, react_1.shorthands.borderColor('transparent')), { color: react_theme_1.tokens.colorNeutralForegroundOnBrand }) }),
|
28
|
-
secondary: {
|
29
|
-
/* The secondary styles are exactly the same as the base styles. */
|
30
|
-
},
|
31
|
-
subtle: tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorSubtleBackgroundSelected }, react_1.shorthands.borderColor('transparent')), { color: react_theme_1.tokens.colorNeutralForeground2Selected, ':hover': tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorSubtleBackgroundHover }, react_1.shorthands.borderColor('transparent')), { color: react_theme_1.tokens.colorNeutralForeground2Hover }), ':hover:active': tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorSubtleBackgroundPressed }, react_1.shorthands.borderColor('transparent')), { color: react_theme_1.tokens.colorNeutralForeground2Pressed }) }),
|
32
|
-
transparent: tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackgroundSelected }, react_1.shorthands.borderColor('transparent')), { color: react_theme_1.tokens.colorNeutralForeground2BrandSelected, ':hover': tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackgroundHover }, react_1.shorthands.borderColor('transparent')), { color: react_theme_1.tokens.colorNeutralForeground2BrandHover }), ':hover:active': tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackgroundPressed }, react_1.shorthands.borderColor('transparent')), { color: react_theme_1.tokens.colorNeutralForeground2BrandPressed }) }),
|
33
|
-
});
|
34
|
-
var useRootDisabledStyles = react_1.makeStyles({
|
35
|
-
// Base styles
|
36
|
-
base: tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorNeutralBackgroundDisabled }, react_1.shorthands.borderColor(react_theme_1.tokens.colorNeutralStrokeDisabled)), { color: react_theme_1.tokens.colorNeutralForegroundDisabled, ':hover': tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorNeutralBackgroundDisabled }, react_1.shorthands.borderColor(react_theme_1.tokens.colorNeutralStrokeDisabled)), { color: react_theme_1.tokens.colorNeutralForegroundDisabled }), ':hover:active': tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorNeutralBackgroundDisabled }, react_1.shorthands.borderColor(react_theme_1.tokens.colorNeutralStrokeDisabled)), { color: react_theme_1.tokens.colorNeutralForegroundDisabled }) }),
|
37
|
-
// Appearance variations
|
38
|
-
outline: {
|
39
|
-
/* No styles */
|
40
|
-
},
|
41
|
-
primary: tslib_1.__assign(tslib_1.__assign({}, react_1.shorthands.borderColor('transparent')), { ':hover': tslib_1.__assign({}, react_1.shorthands.borderColor('transparent')), ':hover:active': tslib_1.__assign({}, react_1.shorthands.borderColor('transparent')) }),
|
42
|
-
secondary: {
|
43
|
-
/* The secondary styles are exactly the same as the base styles. */
|
44
|
-
},
|
45
|
-
subtle: tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackground }, react_1.shorthands.borderColor('transparent')), { ':hover': tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackgroundHover }, react_1.shorthands.borderColor('transparent')), ':hover:active': tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackgroundPressed }, react_1.shorthands.borderColor('transparent')) }),
|
46
|
-
transparent: tslib_1.__assign(tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackground }, react_1.shorthands.borderColor('transparent')), { ':hover': tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackgroundHover }, react_1.shorthands.borderColor('transparent')), ':hover:active': tslib_1.__assign({ backgroundColor: react_theme_1.tokens.colorTransparentBackgroundPressed }, react_1.shorthands.borderColor('transparent')) }),
|
47
|
-
});
|
48
|
-
var useIconCheckedStyles = react_1.makeStyles({
|
49
|
-
// Appearance variations
|
50
|
-
subtleOrTransparent: {
|
51
|
-
color: react_theme_1.tokens.colorNeutralForeground2BrandSelected,
|
52
|
-
},
|
53
|
-
});
|
54
|
-
var usePrimaryHighContrastStyles = react_1.makeStyles({
|
55
|
-
// Do not use primary variant high contrast styles for toggle buttons
|
56
|
-
// otherwise there isn't enough difference between on/off states
|
57
|
-
base: {
|
58
|
-
'@media (forced-colors: active)': tslib_1.__assign(tslib_1.__assign({ backgroundColor: 'ButtonFace' }, react_1.shorthands.borderColor('ButtonBorder')), { color: 'ButtonText', forcedColorAdjust: 'auto' }),
|
59
|
-
},
|
60
|
-
disabled: {
|
61
|
-
'@media (forced-colors: active)': tslib_1.__assign(tslib_1.__assign({}, react_1.shorthands.borderColor('GrayText')), { color: 'GrayText', ':focus': tslib_1.__assign({}, react_1.shorthands.borderColor('GrayText')) }),
|
62
|
-
},
|
63
|
-
});
|
64
|
-
var useToggleButtonStyles_unstable = function (state) {
|
65
|
-
var rootCheckedStyles = useRootCheckedStyles();
|
66
|
-
var rootDisabledStyles = useRootDisabledStyles();
|
67
|
-
var iconCheckedStyles = useIconCheckedStyles();
|
68
|
-
var primaryHighContrastStyles = usePrimaryHighContrastStyles();
|
69
|
-
var appearance = state.appearance, checked = state.checked, disabled = state.disabled, disabledFocusable = state.disabledFocusable;
|
70
|
-
state.root.className = react_1.mergeClasses(exports.toggleButtonClassNames.root,
|
71
|
-
// Primary high contrast styles
|
72
|
-
appearance === 'primary' && primaryHighContrastStyles.base, appearance === 'primary' && (disabled || disabledFocusable) && primaryHighContrastStyles.disabled,
|
73
|
-
// Checked styles
|
74
|
-
checked && rootCheckedStyles.base, checked && rootCheckedStyles.highContrast, appearance && checked && rootCheckedStyles[appearance],
|
75
|
-
// Disabled styles
|
76
|
-
(disabled || disabledFocusable) && rootDisabledStyles.base, appearance && (disabled || disabledFocusable) && rootDisabledStyles[appearance],
|
77
|
-
// User provided class name
|
78
|
-
state.root.className);
|
79
|
-
if (state.icon) {
|
80
|
-
state.icon.className = react_1.mergeClasses(exports.toggleButtonClassNames.icon, (appearance === 'subtle' || appearance === 'transparent') && iconCheckedStyles.subtleOrTransparent, state.icon.className);
|
81
|
-
}
|
82
|
-
useButtonStyles_1.useButtonStyles_unstable(state);
|
83
|
-
return state;
|
84
|
-
};
|
85
|
-
exports.useToggleButtonStyles_unstable = useToggleButtonStyles_unstable;
|
86
|
-
});
|
87
|
-
//# sourceMappingURL=useToggleButtonStyles.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"useToggleButtonStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-button/src/components/ToggleButton/useToggleButtonStyles.ts"],"names":[],"mappings":"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","sourcesContent":["import { iconFilledClassName, iconRegularClassName } from '@fluentui/react-icons';\nimport { createCustomFocusIndicatorStyle } from '@fluentui/react-tabster';\nimport { tokens } from '@fluentui/react-theme';\nimport { shorthands, mergeClasses, makeStyles } from '@griffel/react';\nimport { useButtonStyles_unstable } from '../Button/useButtonStyles';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { ButtonSlots } from '../Button/Button.types';\nimport type { ToggleButtonState } from './ToggleButton.types';\n\nexport const toggleButtonClassNames: SlotClassNames<ButtonSlots> = {\n root: 'fui-ToggleButton',\n icon: 'fui-ToggleButton__icon',\n};\n\nconst useRootCheckedStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackground1Selected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n color: tokens.colorNeutralForeground1Selected,\n\n ...shorthands.borderWidth(tokens.strokeWidthThin),\n\n [`& .${iconFilledClassName}`]: {\n display: 'inline',\n },\n [`& .${iconRegularClassName}`]: {\n display: 'none',\n },\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackground1Hover,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Hover),\n color: tokens.colorNeutralForeground1Hover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackground1Pressed,\n ...shorthands.borderColor(tokens.colorNeutralStroke1Pressed),\n color: tokens.colorNeutralForeground1Pressed,\n },\n },\n\n // High contrast styles\n highContrast: {\n '@media (forced-colors: active)': {\n backgroundColor: 'Highlight',\n ...shorthands.borderColor('Highlight'),\n color: 'HighlightText',\n forcedColorAdjust: 'none',\n\n ':hover': {\n backgroundColor: 'HighlightText',\n ...shorthands.borderColor('Highlight'),\n color: 'Highlight',\n },\n\n ':hover:active': {\n backgroundColor: 'HighlightText',\n ...shorthands.borderColor('Highlight'),\n color: 'Highlight',\n },\n\n ':focus': {\n ...shorthands.border('1px', 'solid', 'HighlightText'),\n outlineColor: 'Highlight',\n },\n },\n },\n\n // Appearance variations\n outline: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n ...shorthands.borderWidth(tokens.strokeWidthThicker),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n },\n\n ...createCustomFocusIndicatorStyle({\n ...shorthands.borderColor(tokens.colorNeutralStroke1),\n }),\n },\n primary: {\n backgroundColor: tokens.colorBrandBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n\n ':hover': {\n backgroundColor: tokens.colorBrandBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorBrandBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForegroundOnBrand,\n },\n },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n backgroundColor: tokens.colorSubtleBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Selected,\n\n ':hover': {\n backgroundColor: tokens.colorSubtleBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Hover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorSubtleBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2Pressed,\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackgroundSelected,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandSelected,\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandHover,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n color: tokens.colorNeutralForeground2BrandPressed,\n },\n },\n});\n\nconst useRootDisabledStyles = makeStyles({\n // Base styles\n base: {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n\n ':hover': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorNeutralBackgroundDisabled,\n ...shorthands.borderColor(tokens.colorNeutralStrokeDisabled),\n color: tokens.colorNeutralForegroundDisabled,\n },\n },\n\n // Appearance variations\n outline: {\n /* No styles */\n },\n primary: {\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n ...shorthands.borderColor('transparent'),\n },\n },\n secondary: {\n /* The secondary styles are exactly the same as the base styles. */\n },\n subtle: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n },\n },\n transparent: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderColor('transparent'),\n\n ':hover': {\n backgroundColor: tokens.colorTransparentBackgroundHover,\n ...shorthands.borderColor('transparent'),\n },\n\n ':hover:active': {\n backgroundColor: tokens.colorTransparentBackgroundPressed,\n ...shorthands.borderColor('transparent'),\n },\n },\n});\n\nconst useIconCheckedStyles = makeStyles({\n // Appearance variations\n subtleOrTransparent: {\n color: tokens.colorNeutralForeground2BrandSelected,\n },\n});\n\nconst usePrimaryHighContrastStyles = makeStyles({\n // Do not use primary variant high contrast styles for toggle buttons\n // otherwise there isn't enough difference between on/off states\n base: {\n '@media (forced-colors: active)': {\n backgroundColor: 'ButtonFace',\n ...shorthands.borderColor('ButtonBorder'),\n color: 'ButtonText',\n forcedColorAdjust: 'auto',\n },\n },\n\n disabled: {\n '@media (forced-colors: active)': {\n ...shorthands.borderColor('GrayText'),\n color: 'GrayText',\n\n ':focus': {\n ...shorthands.borderColor('GrayText'),\n },\n },\n },\n});\n\nexport const useToggleButtonStyles_unstable = (state: ToggleButtonState): ToggleButtonState => {\n const rootCheckedStyles = useRootCheckedStyles();\n const rootDisabledStyles = useRootDisabledStyles();\n const iconCheckedStyles = useIconCheckedStyles();\n const primaryHighContrastStyles = usePrimaryHighContrastStyles();\n\n const { appearance, checked, disabled, disabledFocusable } = state;\n\n state.root.className = mergeClasses(\n toggleButtonClassNames.root,\n\n // Primary high contrast styles\n appearance === 'primary' && primaryHighContrastStyles.base,\n appearance === 'primary' && (disabled || disabledFocusable) && primaryHighContrastStyles.disabled,\n\n // Checked styles\n checked && rootCheckedStyles.base,\n checked && rootCheckedStyles.highContrast,\n appearance && checked && rootCheckedStyles[appearance],\n\n // Disabled styles\n (disabled || disabledFocusable) && rootDisabledStyles.base,\n appearance && (disabled || disabledFocusable) && rootDisabledStyles[appearance],\n\n // User provided class name\n state.root.className,\n );\n\n if (state.icon) {\n state.icon.className = mergeClasses(\n toggleButtonClassNames.icon,\n (appearance === 'subtle' || appearance === 'transparent') && iconCheckedStyles.subtleOrTransparent,\n state.icon.className,\n );\n }\n\n useButtonStyles_unstable(state);\n\n return state;\n};\n"]}
|
@@ -1,19 +0,0 @@
|
|
1
|
-
define(["require", "exports", "react"], function (require, exports, React) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
exports.useButtonContext = exports.ButtonContextProvider = void 0;
|
5
|
-
var buttonContext = React.createContext(undefined);
|
6
|
-
var buttonContextDefaultValue = {};
|
7
|
-
/**
|
8
|
-
* @internal
|
9
|
-
* Internal context provider used to update default values between internal components
|
10
|
-
*/
|
11
|
-
exports.ButtonContextProvider = buttonContext.Provider;
|
12
|
-
/**
|
13
|
-
* @internal
|
14
|
-
* Internal context hook used to update default values between internal components
|
15
|
-
*/
|
16
|
-
var useButtonContext = function () { var _a; return (_a = React.useContext(buttonContext)) !== null && _a !== void 0 ? _a : buttonContextDefaultValue; };
|
17
|
-
exports.useButtonContext = useButtonContext;
|
18
|
-
});
|
19
|
-
//# sourceMappingURL=ButtonContext.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"ButtonContext.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-button/src/contexts/ButtonContext.ts"],"names":[],"mappings":";;;;IAGA,IAAM,aAAa,GAAG,KAAK,CAAC,aAAa,CAAiC,SAAS,CAAC,CAAC;IAUrF,IAAM,yBAAyB,GAAuB,EAAE,CAAC;IAEzD;;;OAGG;IACU,QAAA,qBAAqB,GAAG,aAAa,CAAC,QAAQ,CAAC;IAE5D;;;OAGG;IACI,IAAM,gBAAgB,GAAG,sBAAM,OAAA,MAAA,KAAK,CAAC,UAAU,CAAC,aAAa,CAAC,mCAAI,yBAAyB,CAAA,EAAA,CAAC;IAAtF,QAAA,gBAAgB,oBAAsE","sourcesContent":["import * as React from 'react';\nimport { ButtonSize } from '../components/Button/Button.types';\n\nconst buttonContext = React.createContext<ButtonContextValue | undefined>(undefined);\n\n/**\n * @internal\n * Internal context value used to update default values between internal components\n */\nexport interface ButtonContextValue {\n size?: ButtonSize;\n}\n\nconst buttonContextDefaultValue: ButtonContextValue = {};\n\n/**\n * @internal\n * Internal context provider used to update default values between internal components\n */\nexport const ButtonContextProvider = buttonContext.Provider;\n\n/**\n * @internal\n * Internal context hook used to update default values between internal components\n */\nexport const useButtonContext = () => React.useContext(buttonContext) ?? buttonContextDefaultValue;\n"]}
|
@@ -1,6 +0,0 @@
|
|
1
|
-
define(["require", "exports", "tslib", "./ButtonContext"], function (require, exports, tslib_1, ButtonContext_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
tslib_1.__exportStar(ButtonContext_1, exports);
|
5
|
-
});
|
6
|
-
//# sourceMappingURL=index.js.map
|
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../packages/react-components/react-button/src/contexts/index.ts"],"names":[],"mappings":";;;IAAA,+CAAgC","sourcesContent":["export * from './ButtonContext';\n"]}
|
package/lib-amd/index.js
DELETED
@@ -1,34 +0,0 @@
|
|
1
|
-
define(["require", "exports", "./Button", "./CompoundButton", "./MenuButton", "./SplitButton", "./ToggleButton", "./utils/index", "./contexts/index"], function (require, exports, Button_1, CompoundButton_1, MenuButton_1, SplitButton_1, ToggleButton_1, index_1, index_2) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
exports.useButtonContext = exports.ButtonContextProvider = exports.useToggleState = exports.useToggleButton_unstable = exports.useToggleButtonStyles_unstable = exports.toggleButtonClassNames = exports.renderToggleButton_unstable = exports.ToggleButton = exports.useSplitButton_unstable = exports.useSplitButtonStyles_unstable = exports.splitButtonClassNames = exports.renderSplitButton_unstable = exports.SplitButton = exports.useMenuButton_unstable = exports.useMenuButtonStyles_unstable = exports.renderMenuButton_unstable = exports.menuButtonClassNames = exports.MenuButton = exports.useCompoundButton_unstable = exports.useCompoundButtonStyles_unstable = exports.renderCompoundButton_unstable = exports.compoundButtonClassNames = exports.CompoundButton = exports.useButton_unstable = exports.useButtonStyles_unstable = exports.renderButton_unstable = exports.buttonClassNames = exports.Button = void 0;
|
5
|
-
Object.defineProperty(exports, "Button", { enumerable: true, get: function () { return Button_1.Button; } });
|
6
|
-
Object.defineProperty(exports, "buttonClassNames", { enumerable: true, get: function () { return Button_1.buttonClassNames; } });
|
7
|
-
Object.defineProperty(exports, "renderButton_unstable", { enumerable: true, get: function () { return Button_1.renderButton_unstable; } });
|
8
|
-
Object.defineProperty(exports, "useButtonStyles_unstable", { enumerable: true, get: function () { return Button_1.useButtonStyles_unstable; } });
|
9
|
-
Object.defineProperty(exports, "useButton_unstable", { enumerable: true, get: function () { return Button_1.useButton_unstable; } });
|
10
|
-
Object.defineProperty(exports, "CompoundButton", { enumerable: true, get: function () { return CompoundButton_1.CompoundButton; } });
|
11
|
-
Object.defineProperty(exports, "compoundButtonClassNames", { enumerable: true, get: function () { return CompoundButton_1.compoundButtonClassNames; } });
|
12
|
-
Object.defineProperty(exports, "renderCompoundButton_unstable", { enumerable: true, get: function () { return CompoundButton_1.renderCompoundButton_unstable; } });
|
13
|
-
Object.defineProperty(exports, "useCompoundButtonStyles_unstable", { enumerable: true, get: function () { return CompoundButton_1.useCompoundButtonStyles_unstable; } });
|
14
|
-
Object.defineProperty(exports, "useCompoundButton_unstable", { enumerable: true, get: function () { return CompoundButton_1.useCompoundButton_unstable; } });
|
15
|
-
Object.defineProperty(exports, "MenuButton", { enumerable: true, get: function () { return MenuButton_1.MenuButton; } });
|
16
|
-
Object.defineProperty(exports, "menuButtonClassNames", { enumerable: true, get: function () { return MenuButton_1.menuButtonClassNames; } });
|
17
|
-
Object.defineProperty(exports, "renderMenuButton_unstable", { enumerable: true, get: function () { return MenuButton_1.renderMenuButton_unstable; } });
|
18
|
-
Object.defineProperty(exports, "useMenuButtonStyles_unstable", { enumerable: true, get: function () { return MenuButton_1.useMenuButtonStyles_unstable; } });
|
19
|
-
Object.defineProperty(exports, "useMenuButton_unstable", { enumerable: true, get: function () { return MenuButton_1.useMenuButton_unstable; } });
|
20
|
-
Object.defineProperty(exports, "SplitButton", { enumerable: true, get: function () { return SplitButton_1.SplitButton; } });
|
21
|
-
Object.defineProperty(exports, "renderSplitButton_unstable", { enumerable: true, get: function () { return SplitButton_1.renderSplitButton_unstable; } });
|
22
|
-
Object.defineProperty(exports, "splitButtonClassNames", { enumerable: true, get: function () { return SplitButton_1.splitButtonClassNames; } });
|
23
|
-
Object.defineProperty(exports, "useSplitButtonStyles_unstable", { enumerable: true, get: function () { return SplitButton_1.useSplitButtonStyles_unstable; } });
|
24
|
-
Object.defineProperty(exports, "useSplitButton_unstable", { enumerable: true, get: function () { return SplitButton_1.useSplitButton_unstable; } });
|
25
|
-
Object.defineProperty(exports, "ToggleButton", { enumerable: true, get: function () { return ToggleButton_1.ToggleButton; } });
|
26
|
-
Object.defineProperty(exports, "renderToggleButton_unstable", { enumerable: true, get: function () { return ToggleButton_1.renderToggleButton_unstable; } });
|
27
|
-
Object.defineProperty(exports, "toggleButtonClassNames", { enumerable: true, get: function () { return ToggleButton_1.toggleButtonClassNames; } });
|
28
|
-
Object.defineProperty(exports, "useToggleButtonStyles_unstable", { enumerable: true, get: function () { return ToggleButton_1.useToggleButtonStyles_unstable; } });
|
29
|
-
Object.defineProperty(exports, "useToggleButton_unstable", { enumerable: true, get: function () { return ToggleButton_1.useToggleButton_unstable; } });
|
30
|
-
Object.defineProperty(exports, "useToggleState", { enumerable: true, get: function () { return index_1.useToggleState; } });
|
31
|
-
Object.defineProperty(exports, "ButtonContextProvider", { enumerable: true, get: function () { return index_2.ButtonContextProvider; } });
|
32
|
-
Object.defineProperty(exports, "useButtonContext", { enumerable: true, get: function () { return index_2.useButtonContext; } });
|
33
|
-
});
|
34
|
-
//# sourceMappingURL=index.js.map
|
package/lib-amd/index.js.map
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-button/src/index.ts"],"names":[],"mappings":";;;;IACE,gGAAA,MAAM,OAAA;IACN,0GAAA,gBAAgB,OAAA;IAChB,+GAAA,qBAAqB,OAAA;IACrB,kHAAA,wBAAwB,OAAA;IACxB,4GAAA,kBAAkB,OAAA;IAIlB,gHAAA,cAAc,OAAA;IACd,0HAAA,wBAAwB,OAAA;IACxB,+HAAA,6BAA6B,OAAA;IAC7B,kIAAA,gCAAgC,OAAA;IAChC,4HAAA,0BAA0B,OAAA;IAI1B,wGAAA,UAAU,OAAA;IACV,kHAAA,oBAAoB,OAAA;IACpB,uHAAA,yBAAyB,OAAA;IACzB,0HAAA,4BAA4B,OAAA;IAC5B,oHAAA,sBAAsB,OAAA;IAItB,0GAAA,WAAW,OAAA;IACX,yHAAA,0BAA0B,OAAA;IAC1B,oHAAA,qBAAqB,OAAA;IACrB,4HAAA,6BAA6B,OAAA;IAC7B,sHAAA,uBAAuB,OAAA;IAIvB,4GAAA,YAAY,OAAA;IACZ,2HAAA,2BAA2B,OAAA;IAC3B,sHAAA,sBAAsB,OAAA;IACtB,8HAAA,8BAA8B,OAAA;IAC9B,wHAAA,wBAAwB,OAAA;IAIjB,uGAAA,cAAc,OAAA;IAEd,8GAAA,qBAAqB,OAAA;IAAE,yGAAA,gBAAgB,OAAA","sourcesContent":["export {\n Button,\n buttonClassNames,\n renderButton_unstable,\n useButtonStyles_unstable,\n useButton_unstable,\n} from './Button';\nexport type { ButtonProps, ButtonSlots, ButtonState } from './Button';\nexport {\n CompoundButton,\n compoundButtonClassNames,\n renderCompoundButton_unstable,\n useCompoundButtonStyles_unstable,\n useCompoundButton_unstable,\n} from './CompoundButton';\nexport type { CompoundButtonProps, CompoundButtonSlots, CompoundButtonState } from './CompoundButton';\nexport {\n MenuButton,\n menuButtonClassNames,\n renderMenuButton_unstable,\n useMenuButtonStyles_unstable,\n useMenuButton_unstable,\n} from './MenuButton';\nexport type { MenuButtonProps, MenuButtonSlots, MenuButtonState } from './MenuButton';\nexport {\n SplitButton,\n renderSplitButton_unstable,\n splitButtonClassNames,\n useSplitButtonStyles_unstable,\n useSplitButton_unstable,\n} from './SplitButton';\nexport type { SplitButtonProps, SplitButtonSlots, SplitButtonState } from './SplitButton';\nexport {\n ToggleButton,\n renderToggleButton_unstable,\n toggleButtonClassNames,\n useToggleButtonStyles_unstable,\n useToggleButton_unstable,\n} from './ToggleButton';\nexport type { ToggleButtonProps, ToggleButtonState } from './ToggleButton';\n\nexport { useToggleState } from './utils/index';\n\nexport { ButtonContextProvider, useButtonContext } from './contexts/index';\nexport type { ButtonContextValue } from './contexts/index';\n"]}
|
package/lib-amd/utils/index.js
DELETED
@@ -1,6 +0,0 @@
|
|
1
|
-
define(["require", "exports", "tslib", "./useToggleState"], function (require, exports, tslib_1, useToggleState_1) {
|
2
|
-
"use strict";
|
3
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
4
|
-
tslib_1.__exportStar(useToggleState_1, exports);
|
5
|
-
});
|
6
|
-
//# sourceMappingURL=index.js.map
|