@fluentui/react-button 9.0.0-nightly.f81b28ceb3.1 → 9.0.0-rc.4
Sign up to get free protection for your applications and to get access to all the features.
- 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;
|