@fluentui/react-button 9.0.0-nightly.f81b28ceb3.1 → 9.0.0-rc.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +495 -24
- package/CHANGELOG.md +114 -14
- package/dist/react-button.d.ts +42 -34
- 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 +7 -7
- package/lib/components/Button/Button.js.map +1 -1
- package/lib/components/Button/Button.types.d.ts +6 -6
- package/lib/components/Button/Button.types.js.map +1 -1
- 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 +13 -9
- package/lib/components/Button/renderButton.js.map +1 -1
- package/lib/components/Button/useButton.d.ts +1 -1
- package/lib/components/Button/useButton.js +22 -25
- package/lib/components/Button/useButton.js.map +1 -1
- package/lib/components/Button/useButtonStyles.d.ts +2 -9
- package/lib/components/Button/useButtonStyles.js +118 -90
- package/lib/components/Button/useButtonStyles.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.js +7 -7
- package/lib/components/CompoundButton/CompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/CompoundButton.types.d.ts +4 -4
- package/lib/components/CompoundButton/CompoundButton.types.js.map +1 -1
- 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 +15 -9
- package/lib/components/CompoundButton/renderCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButton.d.ts +1 -1
- package/lib/components/CompoundButton/useCompoundButton.js +9 -9
- package/lib/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib/components/CompoundButton/useCompoundButtonStyles.d.ts +2 -1
- package/lib/components/CompoundButton/useCompoundButtonStyles.js +52 -48
- package/lib/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.js +7 -7
- package/lib/components/MenuButton/MenuButton.js.map +1 -1
- package/lib/components/MenuButton/MenuButton.types.d.ts +3 -4
- package/lib/components/MenuButton/MenuButton.types.js.map +1 -1
- 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 +13 -9
- package/lib/components/MenuButton/renderMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButton.d.ts +1 -1
- package/lib/components/MenuButton/useMenuButton.js +11 -11
- package/lib/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib/components/MenuButton/useMenuButtonStyles.d.ts +2 -1
- package/lib/components/MenuButton/useMenuButtonStyles.js +8 -6
- package/lib/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.js +7 -7
- package/lib/components/SplitButton/SplitButton.js.map +1 -1
- package/lib/components/SplitButton/SplitButton.types.d.ts +6 -4
- package/lib/components/SplitButton/SplitButton.types.js.map +1 -1
- 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 +9 -7
- package/lib/components/SplitButton/renderSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButton.d.ts +1 -1
- package/lib/components/SplitButton/useSplitButton.js +57 -49
- package/lib/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib/components/SplitButton/useSplitButtonStyles.d.ts +2 -1
- package/lib/components/SplitButton/useSplitButtonStyles.js +38 -34
- package/lib/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.js +7 -7
- package/lib/components/ToggleButton/ToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/ToggleButton.types.d.ts +2 -1
- package/lib/components/ToggleButton/ToggleButton.types.js.map +1 -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 +33 -31
- package/lib/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib/components/ToggleButton/useToggleButtonStyles.d.ts +2 -1
- package/lib/components/ToggleButton/useToggleButtonStyles.js +47 -43
- package/lib/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/Button.js +1 -1
- package/lib-commonjs/Button.js.map +1 -1
- package/lib-commonjs/CompoundButton.js +1 -1
- package/lib-commonjs/CompoundButton.js.map +1 -1
- package/lib-commonjs/MenuButton.js +1 -1
- package/lib-commonjs/MenuButton.js.map +1 -1
- package/lib-commonjs/SplitButton.js +1 -1
- package/lib-commonjs/SplitButton.js.map +1 -1
- package/lib-commonjs/ToggleButton.js +1 -1
- package/lib-commonjs/ToggleButton.js.map +1 -1
- package/lib-commonjs/components/Button/Button.js +8 -8
- package/lib-commonjs/components/Button/Button.js.map +1 -1
- package/lib-commonjs/components/Button/Button.types.d.ts +6 -6
- package/lib-commonjs/components/Button/Button.types.js.map +1 -1
- package/lib-commonjs/components/Button/index.d.ts +2 -2
- package/lib-commonjs/components/Button/index.js +10 -6
- 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 +17 -14
- 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 +26 -29
- package/lib-commonjs/components/Button/useButton.js.map +1 -1
- package/lib-commonjs/components/Button/useButtonStyles.d.ts +2 -9
- package/lib-commonjs/components/Button/useButtonStyles.js +121 -92
- package/lib-commonjs/components/Button/useButtonStyles.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/CompoundButton.js +8 -8
- 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/CompoundButton.types.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/index.d.ts +1 -1
- package/lib-commonjs/components/CompoundButton/index.js +10 -4
- 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 +19 -14
- 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 +12 -13
- package/lib-commonjs/components/CompoundButton/useCompoundButton.js.map +1 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.d.ts +2 -1
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js +58 -53
- package/lib-commonjs/components/CompoundButton/useCompoundButtonStyles.js.map +1 -1
- package/lib-commonjs/components/MenuButton/MenuButton.js +8 -8
- 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/MenuButton.types.js.map +1 -1
- package/lib-commonjs/components/MenuButton/index.d.ts +1 -1
- package/lib-commonjs/components/MenuButton/index.js +10 -4
- 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 +17 -14
- 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 +15 -16
- package/lib-commonjs/components/MenuButton/useMenuButton.js.map +1 -1
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.d.ts +2 -1
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js +12 -9
- package/lib-commonjs/components/MenuButton/useMenuButtonStyles.js.map +1 -1
- package/lib-commonjs/components/SplitButton/SplitButton.js +8 -8
- 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/SplitButton.types.js.map +1 -1
- package/lib-commonjs/components/SplitButton/index.d.ts +1 -1
- package/lib-commonjs/components/SplitButton/index.js +10 -4
- 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 +13 -12
- 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 +61 -54
- package/lib-commonjs/components/SplitButton/useSplitButton.js.map +1 -1
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.d.ts +2 -1
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js +44 -39
- package/lib-commonjs/components/SplitButton/useSplitButtonStyles.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/ToggleButton.js +8 -8
- 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/ToggleButton.types.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/index.d.ts +1 -1
- package/lib-commonjs/components/ToggleButton/index.js +10 -4
- 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 +37 -36
- package/lib-commonjs/components/ToggleButton/useToggleButton.js.map +1 -1
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.d.ts +2 -1
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js +51 -45
- package/lib-commonjs/components/ToggleButton/useToggleButtonStyles.js.map +1 -1
- package/lib-commonjs/index.js +1 -1
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +13 -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
|
@@ -3,28 +3,27 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useMenuButton_unstable = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
9
|
|
|
10
|
-
|
|
10
|
+
const react_icons_1 = /*#__PURE__*/require("@fluentui/react-icons");
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
13
13
|
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
var index_1 = /*#__PURE__*/require("../Button/index");
|
|
14
|
+
const index_1 = /*#__PURE__*/require("../Button/index");
|
|
17
15
|
/**
|
|
18
16
|
* Given user props, returns the final state for a MenuButton.
|
|
19
17
|
*/
|
|
20
18
|
|
|
21
19
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
return
|
|
20
|
+
const useMenuButton_unstable = ({
|
|
21
|
+
menuIcon,
|
|
22
|
+
...props
|
|
23
|
+
}, ref) => {
|
|
24
|
+
const buttonState = index_1.useButton_unstable(props, ref);
|
|
25
|
+
return { // Button state
|
|
26
|
+
...buttonState,
|
|
28
27
|
// State calculated from a set of props
|
|
29
28
|
iconOnly: Boolean(!props.children),
|
|
30
29
|
// Slots definition
|
|
@@ -35,12 +34,12 @@ var useMenuButton = function (_a, ref) {
|
|
|
35
34
|
},
|
|
36
35
|
menuIcon: react_utilities_1.resolveShorthand(menuIcon, {
|
|
37
36
|
defaultProps: {
|
|
38
|
-
children:
|
|
37
|
+
children: React.createElement(react_icons_1.ChevronDownRegular, null)
|
|
39
38
|
},
|
|
40
39
|
required: true
|
|
41
40
|
})
|
|
42
|
-
}
|
|
41
|
+
};
|
|
43
42
|
};
|
|
44
43
|
|
|
45
|
-
exports.
|
|
44
|
+
exports.useMenuButton_unstable = useMenuButton_unstable;
|
|
46
45
|
//# sourceMappingURL=useMenuButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/MenuButton/useMenuButton.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,sBAAsB,GAAG,CACpC;AAAE,EAAA,QAAF;AAAY,KAAG;AAAf,CADoC,EAEpC,GAFoC,KAGjB;AACnB,QAAM,WAAW,GAAG,OAAA,CAAA,kBAAA,CAAmB,KAAnB,EAA0B,GAA1B,CAApB;AACA,SAAO,EACL;AACA,OAAG,WAFE;AAIL;AACA,IAAA,QAAQ,EAAE,OAAO,CAAC,CAAC,KAAK,CAAC,QAAR,CALZ;AAOL;AACA,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,QADI;AAEV,MAAA,IAAI,EAAE,MAFI;AAGV,MAAA,QAAQ,EAAE;AAHA,KARP;AAcL,IAAA,QAAQ,EAAE,iBAAA,CAAA,gBAAA,CAAiB,QAAjB,EAA2B;AACnC,MAAA,YAAY,EAAE;AACZ,QAAA,QAAQ,EAAE,KAAA,CAAA,aAAA,CAAC,aAAA,CAAA,kBAAD,EAAmB,IAAnB;AADE,OADqB;AAInC,MAAA,QAAQ,EAAE;AAJyB,KAA3B;AAdL,GAAP;AAqBD,CA1BM;;AAAM,OAAA,CAAA,sBAAA,GAAsB,sBAAtB","sourcesContent":["import * as React from 'react';\nimport { ChevronDownRegular } from '@fluentui/react-icons';\nimport { resolveShorthand } from '@fluentui/react-utilities';\nimport { useButton_unstable } from '../Button/index';\nimport type { MenuButtonProps, MenuButtonState } from './MenuButton.types';\n\n/**\n * Given user props, returns the final state for a MenuButton.\n */\nexport const useMenuButton_unstable = (\n { menuIcon, ...props }: MenuButtonProps,\n ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>,\n): MenuButtonState => {\n const buttonState = useButton_unstable(props, ref);\n return {\n // Button state\n ...buttonState,\n\n // State calculated from a set of props\n iconOnly: Boolean(!props.children),\n\n // Slots definition\n components: {\n root: 'button',\n icon: 'span',\n menuIcon: 'span',\n },\n\n menuIcon: resolveShorthand(menuIcon, {\n defaultProps: {\n children: <ChevronDownRegular />,\n },\n required: true,\n }),\n };\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
import type { MenuButtonState } from './MenuButton.types';
|
|
2
|
-
export declare const
|
|
2
|
+
export declare const menuButtonClassName = "fui-MenuButton";
|
|
3
|
+
export declare const useMenuButtonStyles_unstable: (state: MenuButtonState) => MenuButtonState;
|
|
@@ -3,13 +3,15 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useMenuButtonStyles_unstable = exports.menuButtonClassName = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const react_1 = /*#__PURE__*/require("@griffel/react");
|
|
9
9
|
|
|
10
|
-
|
|
10
|
+
const useButtonStyles_1 = /*#__PURE__*/require("../Button/useButtonStyles");
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
exports.menuButtonClassName = 'fui-MenuButton';
|
|
13
|
+
|
|
14
|
+
const useMenuIconStyles = /*#__PURE__*/react_1.__styles({
|
|
13
15
|
"small": {
|
|
14
16
|
"Be2twd7": "fe5j1ua",
|
|
15
17
|
"Bqenvij": "fjamq6b",
|
|
@@ -29,16 +31,17 @@ var useMenuIconStyles = /*#__PURE__*/react_make_styles_1.__styles({
|
|
|
29
31
|
"d": [".fe5j1ua{font-size:20px;}", ".fjamq6b{height:20px;}", ".f64fuq3{width:20px;}", ".f1rt2boy{font-size:24px;}", ".frvgh55{height:24px;}", ".fq4mcun{width:24px;}"]
|
|
30
32
|
});
|
|
31
33
|
|
|
32
|
-
|
|
33
|
-
|
|
34
|
+
const useMenuButtonStyles_unstable = state => {
|
|
35
|
+
const menuIconStyles = useMenuIconStyles();
|
|
36
|
+
state.root.className = react_1.mergeClasses(exports.menuButtonClassName, state.root.className);
|
|
34
37
|
|
|
35
38
|
if (state.menuIcon) {
|
|
36
|
-
state.menuIcon.className =
|
|
39
|
+
state.menuIcon.className = react_1.mergeClasses(menuIconStyles[state.size], state.menuIcon.className);
|
|
37
40
|
}
|
|
38
41
|
|
|
39
|
-
useButtonStyles_1.
|
|
42
|
+
useButtonStyles_1.useButtonStyles_unstable(state);
|
|
40
43
|
return state;
|
|
41
44
|
};
|
|
42
45
|
|
|
43
|
-
exports.
|
|
46
|
+
exports.useMenuButtonStyles_unstable = useMenuButtonStyles_unstable;
|
|
44
47
|
//# sourceMappingURL=useMenuButtonStyles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/MenuButton/useMenuButtonStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AAEA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAGa,OAAA,CAAA,mBAAA,GAAsB,gBAAtB;;AAEb,MAAM,iBAAiB,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAA1B;;AAmBO,MAAM,4BAA4B,GAAI,KAAD,IAA4C;AACtF,QAAM,cAAc,GAAG,iBAAiB,EAAxC;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CAAa,OAAA,CAAA,mBAAb,EAAkC,KAAK,CAAC,IAAN,CAAW,SAA7C,CAAvB;;AAEA,MAAI,KAAK,CAAC,QAAV,EAAoB;AAClB,IAAA,KAAK,CAAC,QAAN,CAAe,SAAf,GAA2B,OAAA,CAAA,YAAA,CAAa,cAAc,CAAC,KAAK,CAAC,IAAP,CAA3B,EAAyC,KAAK,CAAC,QAAN,CAAe,SAAxD,CAA3B;AACD;;AAED,EAAA,iBAAA,CAAA,wBAAA,CAAyB,KAAzB;AAEA,SAAO,KAAP;AACD,CAZM;;AAAM,OAAA,CAAA,4BAAA,GAA4B,4BAA5B","sourcesContent":["import { mergeClasses, makeStyles } from '@griffel/react';\nimport { ButtonState } from '../Button/Button.types';\nimport { useButtonStyles_unstable } from '../Button/useButtonStyles';\nimport type { MenuButtonState } from './MenuButton.types';\n\nexport const menuButtonClassName = 'fui-MenuButton';\n\nconst useMenuIconStyles = makeStyles({\n // Size appearance\n small: {\n fontSize: '20px',\n height: '20px',\n width: '20px',\n },\n medium: {\n fontSize: '20px',\n height: '20px',\n width: '20px',\n },\n large: {\n fontSize: '24px',\n height: '24px',\n width: '24px',\n },\n});\n\nexport const useMenuButtonStyles_unstable = (state: MenuButtonState): MenuButtonState => {\n const menuIconStyles = useMenuIconStyles();\n\n state.root.className = mergeClasses(menuButtonClassName, state.root.className);\n\n if (state.menuIcon) {\n state.menuIcon.className = mergeClasses(menuIconStyles[state.size], state.menuIcon.className);\n }\n\n useButtonStyles_unstable(state as ButtonState);\n\n return state;\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -5,23 +5,23 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.SplitButton = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
9
|
|
|
10
|
-
|
|
10
|
+
const renderSplitButton_1 = /*#__PURE__*/require("./renderSplitButton");
|
|
11
11
|
|
|
12
|
-
|
|
12
|
+
const useSplitButton_1 = /*#__PURE__*/require("./useSplitButton");
|
|
13
13
|
|
|
14
|
-
|
|
14
|
+
const useSplitButtonStyles_1 = /*#__PURE__*/require("./useSplitButtonStyles");
|
|
15
15
|
/**
|
|
16
16
|
* SplitButtons are a grouping of two interactive surfaces where the interacting with the first one triggers a primary
|
|
17
17
|
* action, while interacting with the second one opens a menu with secondary actions.
|
|
18
18
|
*/
|
|
19
19
|
|
|
20
20
|
|
|
21
|
-
exports.SplitButton = /*#__PURE__*/React.forwardRef(
|
|
22
|
-
|
|
23
|
-
useSplitButtonStyles_1.
|
|
24
|
-
return renderSplitButton_1.
|
|
21
|
+
exports.SplitButton = /*#__PURE__*/React.forwardRef((props, ref) => {
|
|
22
|
+
const state = useSplitButton_1.useSplitButton_unstable(props, ref);
|
|
23
|
+
useSplitButtonStyles_1.useSplitButtonStyles_unstable(state);
|
|
24
|
+
return renderSplitButton_1.renderSplitButton_unstable(state); // Casting is required due to lack of distributive union to support unions on @types/react
|
|
25
25
|
});
|
|
26
26
|
exports.SplitButton.displayName = 'SplitButton';
|
|
27
27
|
//# sourceMappingURL=SplitButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/SplitButton/SplitButton.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;;AACA,MAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;AAIA;;;AAGG;;;AACU,OAAA,CAAA,WAAA,gBAAqD,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;AAChG,QAAM,KAAK,GAAG,gBAAA,CAAA,uBAAA,CAAwB,KAAxB,EAA+B,GAA/B,CAAd;AAEA,EAAA,sBAAA,CAAA,6BAAA,CAA8B,KAA9B;AAEA,SAAO,mBAAA,CAAA,0BAAA,CAA2B,KAA3B,CAAP,CALgG,CAMhG;AACD,CAPiE,CAArD;AASb,OAAA,CAAA,WAAA,CAAY,WAAZ,GAA0B,aAA1B","sourcesContent":["import * as React from 'react';\nimport { renderSplitButton_unstable } from './renderSplitButton';\nimport { useSplitButton_unstable } from './useSplitButton';\nimport { useSplitButtonStyles_unstable } from './useSplitButtonStyles';\nimport type { SplitButtonProps } from './SplitButton.types';\nimport { ForwardRefComponent } from '@fluentui/react-utilities';\n\n/**\n * SplitButtons are a grouping of two interactive surfaces where the interacting with the first one triggers a primary\n * action, while interacting with the second one opens a menu with secondary actions.\n */\nexport const SplitButton: ForwardRefComponent<SplitButtonProps> = React.forwardRef((props, ref) => {\n const state = useSplitButton_unstable(props, ref);\n\n useSplitButtonStyles_unstable(state);\n\n return renderSplitButton_unstable(state);\n // Casting is required due to lack of distributive union to support unions on @types/react\n}) as ForwardRefComponent<SplitButtonProps>;\n\nSplitButton.displayName = 'SplitButton';\n"],"sourceRoot":"../src/"}
|
|
@@ -1,19 +1,21 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { Button } from '../Button/Button';
|
|
2
|
+
import { MenuButton } from '../MenuButton/MenuButton';
|
|
3
|
+
import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
|
|
2
4
|
import type { ButtonProps, ButtonState } from '../Button/Button.types';
|
|
3
5
|
import type { MenuButtonProps, MenuButtonState } from '../MenuButton/MenuButton.types';
|
|
4
6
|
export declare type SplitButtonSlots = {
|
|
5
7
|
/**
|
|
6
8
|
* Root of the component that wraps the primary action button and menu button.
|
|
7
9
|
*/
|
|
8
|
-
root:
|
|
10
|
+
root: Slot<'div'>;
|
|
9
11
|
/**
|
|
10
12
|
* Button that opens menu with secondary actions in SplitButton.
|
|
11
13
|
*/
|
|
12
|
-
menuButton?:
|
|
14
|
+
menuButton?: Slot<typeof MenuButton>;
|
|
13
15
|
/**
|
|
14
16
|
* Button to perform primary action in SplitButton.
|
|
15
17
|
*/
|
|
16
|
-
primaryActionButton?:
|
|
18
|
+
primaryActionButton?: Slot<typeof Button>;
|
|
17
19
|
};
|
|
18
20
|
export declare type SplitButtonProps = ComponentProps<SplitButtonSlots> & Omit<ButtonProps, 'root'> & Omit<MenuButtonProps, 'root'>;
|
|
19
21
|
export declare type SplitButtonState = ComponentState<SplitButtonSlots> & Omit<ButtonState, 'components' | 'iconOnly' | 'root'> & Omit<MenuButtonState, 'components' | 'iconOnly' | 'root'>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
|
|
@@ -2,4 +2,4 @@ export * from './SplitButton';
|
|
|
2
2
|
export * from './SplitButton.types';
|
|
3
3
|
export * from './renderSplitButton';
|
|
4
4
|
export * from './useSplitButton';
|
|
5
|
-
export {
|
|
5
|
+
export { splitButtonClassName, useSplitButtonStyles_unstable } from './useSplitButtonStyles';
|
|
@@ -3,9 +3,9 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useSplitButtonStyles_unstable = exports.splitButtonClassName = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
|
9
9
|
|
|
10
10
|
tslib_1.__exportStar(require("./SplitButton"), exports);
|
|
11
11
|
|
|
@@ -17,10 +17,16 @@ tslib_1.__exportStar(require("./useSplitButton"), exports);
|
|
|
17
17
|
|
|
18
18
|
var useSplitButtonStyles_1 = /*#__PURE__*/require("./useSplitButtonStyles");
|
|
19
19
|
|
|
20
|
-
Object.defineProperty(exports, "
|
|
20
|
+
Object.defineProperty(exports, "splitButtonClassName", {
|
|
21
21
|
enumerable: true,
|
|
22
22
|
get: function () {
|
|
23
|
-
return useSplitButtonStyles_1.
|
|
23
|
+
return useSplitButtonStyles_1.splitButtonClassName;
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
Object.defineProperty(exports, "useSplitButtonStyles_unstable", {
|
|
27
|
+
enumerable: true,
|
|
28
|
+
get: function () {
|
|
29
|
+
return useSplitButtonStyles_1.useSplitButtonStyles_unstable;
|
|
24
30
|
}
|
|
25
31
|
});
|
|
26
32
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/SplitButton/index.ts"],"names":[],"mappings":";;;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,eAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,IAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,sBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,sBAAA,CAAA,oBAAA;AAAoB;AAApB,CAAA;AAAsB,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,+BAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,sBAAA,CAAA,6BAAA;AAA6B;AAA7B,CAAA","sourcesContent":["export * from './SplitButton';\nexport * from './SplitButton.types';\nexport * from './renderSplitButton';\nexport * from './useSplitButton';\nexport { splitButtonClassName, useSplitButtonStyles_unstable } from './useSplitButtonStyles';\n"],"sourceRoot":"../src/"}
|
|
@@ -2,4 +2,4 @@ import type { SplitButtonState } from './SplitButton.types';
|
|
|
2
2
|
/**
|
|
3
3
|
* Renders a SplitButton component by passing the state defined props to the appropriate slots.
|
|
4
4
|
*/
|
|
5
|
-
export declare const
|
|
5
|
+
export declare const renderSplitButton_unstable: (state: SplitButtonState) => JSX.Element;
|
|
@@ -3,25 +3,26 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.renderSplitButton_unstable = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
9
|
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
10
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
13
11
|
/**
|
|
14
12
|
* Renders a SplitButton component by passing the state defined props to the appropriate slots.
|
|
15
13
|
*/
|
|
16
14
|
|
|
17
15
|
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
return React.createElement(slots.root,
|
|
16
|
+
const renderSplitButton_unstable = state => {
|
|
17
|
+
const {
|
|
18
|
+
slots,
|
|
19
|
+
slotProps
|
|
20
|
+
} = react_utilities_1.getSlots(state);
|
|
21
|
+
return React.createElement(slots.root, { ...slotProps.root
|
|
22
|
+
}, slots.primaryActionButton && React.createElement(slots.primaryActionButton, { ...slotProps.primaryActionButton
|
|
23
|
+
}), slots.menuButton && React.createElement(slots.menuButton, { ...slotProps.menuButton
|
|
24
|
+
}));
|
|
24
25
|
};
|
|
25
26
|
|
|
26
|
-
exports.
|
|
27
|
+
exports.renderSplitButton_unstable = renderSplitButton_unstable;
|
|
27
28
|
//# sourceMappingURL=renderSplitButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/SplitButton/renderSplitButton.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,0BAA0B,GAAI,KAAD,IAA4B;AACpE,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA2B,KAA3B,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EACG,KAAK,CAAC,mBAAN,IAA6B,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,mBAAP,EAA0B,EAAA,GAAK,SAAS,CAAC;AAAf,GAA1B,CADhC,EAEG,KAAK,CAAC,UAAN,IAAoB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,UAAP,EAAiB,EAAA,GAAK,SAAS,CAAC;AAAf,GAAjB,CAFvB,CADF;AAMD,CATM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B","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"],"sourceRoot":"../src/"}
|
|
@@ -5,4 +5,4 @@ import type { SplitButtonProps, SplitButtonState } from './SplitButton.types';
|
|
|
5
5
|
* @param props - User provided props to the SplitButton component.
|
|
6
6
|
* @param ref - User provided ref to be passed to the SplitButton component.
|
|
7
7
|
*/
|
|
8
|
-
export declare const
|
|
8
|
+
export declare const useSplitButton_unstable: (props: SplitButtonProps, ref: React.Ref<HTMLButtonElement | HTMLAnchorElement>) => SplitButtonState;
|
|
@@ -3,15 +3,13 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.
|
|
6
|
+
exports.useSplitButton_unstable = void 0;
|
|
7
7
|
|
|
8
|
-
|
|
8
|
+
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
9
9
|
|
|
10
|
-
|
|
10
|
+
const Button_1 = /*#__PURE__*/require("../Button/Button");
|
|
11
11
|
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
var MenuButton_1 = /*#__PURE__*/require("../MenuButton/MenuButton");
|
|
12
|
+
const MenuButton_1 = /*#__PURE__*/require("../MenuButton/MenuButton");
|
|
15
13
|
/**
|
|
16
14
|
* Given user props, defines default props for the SplitButton and returns processed state.
|
|
17
15
|
* @param props - User provided props to the SplitButton component.
|
|
@@ -19,68 +17,77 @@ var MenuButton_1 = /*#__PURE__*/require("../MenuButton/MenuButton");
|
|
|
19
17
|
*/
|
|
20
18
|
|
|
21
19
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
size = _f === void 0 ? 'medium' : _f;
|
|
40
|
-
var menuButtonShorthand = react_utilities_1.resolveShorthand(menuButton, {
|
|
20
|
+
const useSplitButton_unstable = (props, ref) => {
|
|
21
|
+
const {
|
|
22
|
+
appearance,
|
|
23
|
+
block = false,
|
|
24
|
+
children,
|
|
25
|
+
disabled = false,
|
|
26
|
+
disabledFocusable = false,
|
|
27
|
+
icon,
|
|
28
|
+
iconPosition = 'before',
|
|
29
|
+
menuButton,
|
|
30
|
+
menuIcon,
|
|
31
|
+
primaryActionButton,
|
|
32
|
+
shape = 'rounded',
|
|
33
|
+
size = 'medium'
|
|
34
|
+
} = props;
|
|
35
|
+
const baseId = react_utilities_1.useId('splitButton-');
|
|
36
|
+
const menuButtonShorthand = react_utilities_1.resolveShorthand(menuButton, {
|
|
41
37
|
defaultProps: {
|
|
42
|
-
appearance
|
|
43
|
-
disabled
|
|
44
|
-
disabledFocusable
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
38
|
+
appearance,
|
|
39
|
+
disabled,
|
|
40
|
+
disabledFocusable,
|
|
41
|
+
menuIcon,
|
|
42
|
+
shape,
|
|
43
|
+
size
|
|
44
|
+
},
|
|
45
|
+
required: true
|
|
48
46
|
});
|
|
49
|
-
|
|
47
|
+
const primaryActionButtonShorthand = react_utilities_1.resolveShorthand(primaryActionButton, {
|
|
50
48
|
defaultProps: {
|
|
51
|
-
appearance
|
|
52
|
-
block
|
|
53
|
-
children
|
|
54
|
-
disabled
|
|
55
|
-
disabledFocusable
|
|
56
|
-
icon
|
|
57
|
-
iconPosition
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
49
|
+
appearance,
|
|
50
|
+
block,
|
|
51
|
+
children,
|
|
52
|
+
disabled,
|
|
53
|
+
disabledFocusable,
|
|
54
|
+
icon,
|
|
55
|
+
iconPosition,
|
|
56
|
+
id: baseId + '__primaryActionButton',
|
|
57
|
+
shape,
|
|
58
|
+
size
|
|
59
|
+
},
|
|
60
|
+
required: true
|
|
61
|
+
}); // Resolve menu button's aria-labelledby to be labelled by the primary action button if not a label was not provided
|
|
62
|
+
// by the user.
|
|
63
|
+
|
|
64
|
+
if (menuButtonShorthand && primaryActionButtonShorthand && !menuButtonShorthand['aria-label'] && !menuButtonShorthand['aria-labelledby']) {
|
|
65
|
+
menuButtonShorthand['aria-labelledby'] = primaryActionButtonShorthand.id;
|
|
66
|
+
}
|
|
67
|
+
|
|
62
68
|
return {
|
|
63
69
|
// Props passed at the top-level
|
|
64
|
-
appearance
|
|
65
|
-
block
|
|
66
|
-
disabled
|
|
67
|
-
disabledFocusable
|
|
68
|
-
iconPosition
|
|
69
|
-
shape
|
|
70
|
-
size
|
|
70
|
+
appearance,
|
|
71
|
+
block,
|
|
72
|
+
disabled,
|
|
73
|
+
disabledFocusable,
|
|
74
|
+
iconPosition,
|
|
75
|
+
shape,
|
|
76
|
+
size,
|
|
71
77
|
// Slots definition
|
|
72
78
|
components: {
|
|
73
79
|
root: 'div',
|
|
74
80
|
menuButton: MenuButton_1.MenuButton,
|
|
75
81
|
primaryActionButton: Button_1.Button
|
|
76
82
|
},
|
|
77
|
-
root: react_utilities_1.getNativeElementProps('div',
|
|
78
|
-
ref
|
|
79
|
-
|
|
83
|
+
root: react_utilities_1.getNativeElementProps('div', {
|
|
84
|
+
ref,
|
|
85
|
+
...props
|
|
86
|
+
}),
|
|
80
87
|
menuButton: menuButtonShorthand,
|
|
81
88
|
primaryActionButton: primaryActionButtonShorthand
|
|
82
89
|
};
|
|
83
90
|
};
|
|
84
91
|
|
|
85
|
-
exports.
|
|
92
|
+
exports.useSplitButton_unstable = useSplitButton_unstable;
|
|
86
93
|
//# sourceMappingURL=useSplitButton.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["components/SplitButton/useSplitButton.ts"],"names":[],"mappings":";;;;;;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,QAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,0BAAA,CAAA;AAGA;;;;AAIG;;;AACI,MAAM,uBAAuB,GAAG,CACrC,KADqC,EAErC,GAFqC,KAGjB;AACpB,QAAM;AACJ,IAAA,UADI;AAEJ,IAAA,KAAK,GAAG,KAFJ;AAGJ,IAAA,QAHI;AAIJ,IAAA,QAAQ,GAAG,KAJP;AAKJ,IAAA,iBAAiB,GAAG,KALhB;AAMJ,IAAA,IANI;AAOJ,IAAA,YAAY,GAAG,QAPX;AAQJ,IAAA,UARI;AASJ,IAAA,QATI;AAUJ,IAAA,mBAVI;AAWJ,IAAA,KAAK,GAAG,SAXJ;AAYJ,IAAA,IAAI,GAAG;AAZH,MAaF,KAbJ;AAeA,QAAM,MAAM,GAAG,iBAAA,CAAA,KAAA,CAAM,cAAN,CAAf;AAEA,QAAM,mBAAmB,GAAG,iBAAA,CAAA,gBAAA,CAAiB,UAAjB,EAA6B;AACvD,IAAA,YAAY,EAAE;AACZ,MAAA,UADY;AAEZ,MAAA,QAFY;AAGZ,MAAA,iBAHY;AAIZ,MAAA,QAJY;AAKZ,MAAA,KALY;AAMZ,MAAA;AANY,KADyC;AASvD,IAAA,QAAQ,EAAE;AAT6C,GAA7B,CAA5B;AAYA,QAAM,4BAA4B,GAAG,iBAAA,CAAA,gBAAA,CAAiB,mBAAjB,EAAsC;AACzE,IAAA,YAAY,EAAE;AACZ,MAAA,UADY;AAEZ,MAAA,KAFY;AAGZ,MAAA,QAHY;AAIZ,MAAA,QAJY;AAKZ,MAAA,iBALY;AAMZ,MAAA,IANY;AAOZ,MAAA,YAPY;AAQZ,MAAA,EAAE,EAAE,MAAM,GAAG,uBARD;AASZ,MAAA,KATY;AAUZ,MAAA;AAVY,KAD2D;AAazE,IAAA,QAAQ,EAAE;AAb+D,GAAtC,CAArC,CA9BoB,CA8CpB;AACA;;AACA,MACE,mBAAmB,IACnB,4BADA,IAEA,CAAC,mBAAmB,CAAC,YAAD,CAFpB,IAGA,CAAC,mBAAmB,CAAC,iBAAD,CAJtB,EAKE;AACA,IAAA,mBAAmB,CAAC,iBAAD,CAAnB,GAAyC,4BAA4B,CAAC,EAAtE;AACD;;AAED,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,UAAU,EAAE;AACV,MAAA,IAAI,EAAE,KADI;AAEV,MAAA,UAAU,EAAE,YAAA,CAAA,UAFF;AAGV,MAAA,mBAAmB,EAAE,QAAA,CAAA;AAHX,KAXP;AAiBL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;AAAE,MAAA,GAAF;AAAO,SAAG;AAAV,KAA7B,CAjBD;AAkBL,IAAA,UAAU,EAAE,mBAlBP;AAmBL,IAAA,mBAAmB,EAAE;AAnBhB,GAAP;AAqBD,CAjFM;;AAAM,OAAA,CAAA,uBAAA,GAAuB,uBAAvB","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,\n block = false,\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 block,\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 block,\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"],"sourceRoot":"../src/"}
|
|
@@ -1,2 +1,3 @@
|
|
|
1
1
|
import type { SplitButtonState } from './SplitButton.types';
|
|
2
|
-
export declare const
|
|
2
|
+
export declare const splitButtonClassName = "fui-SplitButton";
|
|
3
|
+
export declare const useSplitButtonStyles_unstable: (state: SplitButtonState) => SplitButtonState;
|