@fluentui/react-migration-v8-v9 1.0.2 → 1.0.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 +37 -1
- package/CHANGELOG.md +21 -2
- package/lib/components/Button/ActionButtonShim.js +18 -0
- package/lib/components/Button/ActionButtonShim.js.map +1 -0
- package/lib/components/Button/ButtonShim.js +25 -0
- package/lib/components/Button/ButtonShim.js.map +1 -0
- package/lib/components/Button/CommandButtonShim.js +5 -0
- package/lib/components/Button/CommandButtonShim.js.map +1 -0
- package/lib/components/Button/CompoundButtonShim.js +21 -0
- package/lib/components/Button/CompoundButtonShim.js.map +1 -0
- package/lib/components/Button/DefaultButtonShim.js +12 -0
- package/lib/components/Button/DefaultButtonShim.js.map +1 -0
- package/lib/components/Button/MenuButtonShim.js +23 -0
- package/lib/components/Button/MenuButtonShim.js.map +1 -0
- package/lib/components/Button/PrimaryButtonShim.js +13 -0
- package/lib/components/Button/PrimaryButtonShim.js.map +1 -0
- package/lib/components/Button/ToggleButtonShim.js +20 -0
- package/lib/components/Button/ToggleButtonShim.js.map +1 -0
- package/lib/components/Button/index.js +10 -0
- package/lib/components/Button/index.js.map +1 -0
- package/lib/components/Button/shimButtonProps.js +24 -0
- package/lib/components/Button/shimButtonProps.js.map +1 -0
- package/lib/components/Menu/MenuShim.js +49 -0
- package/lib/components/Menu/MenuShim.js.map +1 -0
- package/lib/components/Menu/index.js +3 -0
- package/lib/components/Menu/index.js.map +1 -0
- package/lib/components/Menu/shimMenuProps.js +33 -0
- package/lib/components/Menu/shimMenuProps.js.map +1 -0
- package/lib/components/Stack/StackItemShim.js +177 -0
- package/lib/components/Stack/StackItemShim.js.map +1 -0
- package/lib/components/Stack/StackShim.js +260 -0
- package/lib/components/Stack/StackShim.js.map +1 -0
- package/lib/components/Stack/index.js +3 -0
- package/lib/components/Stack/index.js.map +1 -0
- package/lib/components/Stack/stackUtils.js +168 -0
- package/lib/components/Stack/stackUtils.js.map +1 -0
- package/lib/components/Theme/index.js +5 -0
- package/lib/components/Theme/index.js.map +1 -0
- package/lib/components/Theme/themeDuplicates.js +859 -0
- package/lib/components/Theme/themeDuplicates.js.map +1 -0
- package/lib/components/Theme/v8ThemeShim.js +313 -0
- package/lib/components/Theme/v8ThemeShim.js.map +1 -0
- package/lib/components/Theme/v9BrandVariantsShim.js +77 -0
- package/lib/components/Theme/v9BrandVariantsShim.js.map +1 -0
- package/lib/components/Theme/v9ThemeShim.js +195 -0
- package/lib/components/Theme/v9ThemeShim.js.map +1 -0
- package/lib/index.js +5 -0
- package/lib/index.js.map +1 -0
- package/lib/stories/DefaultButtonShim/index.js +51 -0
- package/lib/stories/DefaultButtonShim/index.js.map +1 -0
- package/lib-amd/components/Button/ActionButtonShim.js +14 -0
- package/lib-amd/components/Button/ActionButtonShim.js.map +1 -0
- package/lib-amd/components/Button/ButtonShim.js +17 -0
- package/lib-amd/components/Button/ButtonShim.js.map +1 -0
- package/lib-amd/components/Button/CommandButtonShim.js +7 -0
- package/lib-amd/components/Button/CommandButtonShim.js.map +1 -0
- package/lib-amd/components/Button/CompoundButtonShim.js +15 -0
- package/lib-amd/components/Button/CompoundButtonShim.js.map +1 -0
- package/lib-amd/components/Button/DefaultButtonShim.js +12 -0
- package/lib-amd/components/Button/DefaultButtonShim.js.map +1 -0
- package/lib-amd/components/Button/MenuButtonShim.js +20 -0
- package/lib-amd/components/Button/MenuButtonShim.js.map +1 -0
- package/lib-amd/components/Button/PrimaryButtonShim.js +12 -0
- package/lib-amd/components/Button/PrimaryButtonShim.js.map +1 -0
- package/lib-amd/components/Button/ToggleButtonShim.js +14 -0
- package/lib-amd/components/Button/ToggleButtonShim.js.map +1 -0
- package/lib-amd/components/Button/index.js +14 -0
- package/lib-amd/components/Button/index.js.map +1 -0
- package/lib-amd/components/Button/shimButtonProps.js +19 -0
- package/lib-amd/components/Button/shimButtonProps.js.map +1 -0
- package/lib-amd/components/Menu/MenuShim.js +42 -0
- package/lib-amd/components/Menu/MenuShim.js.map +1 -0
- package/lib-amd/components/Menu/index.js +7 -0
- package/lib-amd/components/Menu/index.js.map +1 -0
- package/lib-amd/components/Menu/shimMenuProps.js +30 -0
- package/lib-amd/components/Menu/shimMenuProps.js.map +1 -0
- package/lib-amd/components/Stack/StackItemShim.js +150 -0
- package/lib-amd/components/Stack/StackItemShim.js.map +1 -0
- package/lib-amd/components/Stack/StackShim.js +242 -0
- package/lib-amd/components/Stack/StackShim.js.map +1 -0
- package/lib-amd/components/Stack/index.js +7 -0
- package/lib-amd/components/Stack/index.js.map +1 -0
- package/lib-amd/components/Stack/stackUtils.js +168 -0
- package/lib-amd/components/Stack/stackUtils.js.map +1 -0
- package/lib-amd/components/Theme/index.js +9 -0
- package/lib-amd/components/Theme/index.js.map +1 -0
- package/lib-amd/components/Theme/themeDuplicates.js +864 -0
- package/lib-amd/components/Theme/themeDuplicates.js.map +1 -0
- package/lib-amd/components/Theme/v8ThemeShim.js +140 -0
- package/lib-amd/components/Theme/v8ThemeShim.js.map +1 -0
- package/lib-amd/components/Theme/v9BrandVariantsShim.js +75 -0
- package/lib-amd/components/Theme/v9BrandVariantsShim.js.map +1 -0
- package/lib-amd/components/Theme/v9ThemeShim.js +188 -0
- package/lib-amd/components/Theme/v9ThemeShim.js.map +1 -0
- package/lib-amd/index.js +38 -0
- package/lib-amd/index.js.map +1 -0
- package/lib-amd/stories/DefaultButtonShim/index.js +44 -0
- package/lib-amd/stories/DefaultButtonShim/index.js.map +1 -0
- package/lib-commonjs/components/Button/ActionButtonShim.js +28 -0
- package/lib-commonjs/components/Button/ActionButtonShim.js.map +1 -0
- package/lib-commonjs/components/Button/ButtonShim.js +37 -0
- package/lib-commonjs/components/Button/ButtonShim.js.map +1 -0
- package/lib-commonjs/components/Button/CommandButtonShim.js +19 -0
- package/lib-commonjs/components/Button/CommandButtonShim.js.map +1 -0
- package/lib-commonjs/components/Button/CompoundButtonShim.js +31 -0
- package/lib-commonjs/components/Button/CompoundButtonShim.js.map +1 -0
- package/lib-commonjs/components/Button/DefaultButtonShim.js +21 -0
- package/lib-commonjs/components/Button/DefaultButtonShim.js.map +1 -0
- package/lib-commonjs/components/Button/MenuButtonShim.js +32 -0
- package/lib-commonjs/components/Button/MenuButtonShim.js.map +1 -0
- package/lib-commonjs/components/Button/PrimaryButtonShim.js +22 -0
- package/lib-commonjs/components/Button/PrimaryButtonShim.js.map +1 -0
- package/lib-commonjs/components/Button/ToggleButtonShim.js +30 -0
- package/lib-commonjs/components/Button/ToggleButtonShim.js.map +1 -0
- package/lib-commonjs/components/Button/index.js +26 -0
- package/lib-commonjs/components/Button/index.js.map +1 -0
- package/lib-commonjs/components/Button/shimButtonProps.js +35 -0
- package/lib-commonjs/components/Button/shimButtonProps.js.map +1 -0
- package/lib-commonjs/components/Menu/MenuShim.js +58 -0
- package/lib-commonjs/components/Menu/MenuShim.js.map +1 -0
- package/lib-commonjs/components/Menu/index.js +12 -0
- package/lib-commonjs/components/Menu/index.js.map +1 -0
- package/lib-commonjs/components/Menu/shimMenuProps.js +53 -0
- package/lib-commonjs/components/Menu/shimMenuProps.js.map +1 -0
- package/lib-commonjs/components/Stack/StackItemShim.js +188 -0
- package/lib-commonjs/components/Stack/StackItemShim.js.map +1 -0
- package/lib-commonjs/components/Stack/StackShim.js +273 -0
- package/lib-commonjs/components/Stack/StackShim.js.map +1 -0
- package/lib-commonjs/components/Stack/index.js +12 -0
- package/lib-commonjs/components/Stack/index.js.map +1 -0
- package/lib-commonjs/components/Stack/stackUtils.js +182 -0
- package/lib-commonjs/components/Stack/stackUtils.js.map +1 -0
- package/lib-commonjs/components/Theme/index.js +16 -0
- package/lib-commonjs/components/Theme/index.js.map +1 -0
- package/lib-commonjs/components/Theme/themeDuplicates.js +865 -0
- package/lib-commonjs/components/Theme/themeDuplicates.js.map +1 -0
- package/lib-commonjs/components/Theme/v8ThemeShim.js +324 -0
- package/lib-commonjs/components/Theme/v8ThemeShim.js.map +1 -0
- package/lib-commonjs/components/Theme/v9BrandVariantsShim.js +87 -0
- package/lib-commonjs/components/Theme/v9BrandVariantsShim.js.map +1 -0
- package/lib-commonjs/components/Theme/v9ThemeShim.js +206 -0
- package/lib-commonjs/components/Theme/v9ThemeShim.js.map +1 -0
- package/lib-commonjs/index.js +211 -0
- package/lib-commonjs/index.js.map +1 -0
- package/lib-commonjs/stories/DefaultButtonShim/index.js +64 -0
- package/lib-commonjs/stories/DefaultButtonShim/index.js.map +1 -0
- package/package.json +3 -3
package/lib-amd/index.js
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
define(["require", "exports", "./components/Button/index", "./components/Menu/index", "./components/Stack/index", "./components/Theme/index"], function (require, exports, index_1, index_2, index_3, index_4) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.whiteAlpha = exports.white = exports.sharedColors = exports.hcHyperlink = exports.hcHighlightText = exports.hcHighlight = exports.hcDisabled = exports.hcCanvasText = exports.hcCanvas = exports.hcButtonText = exports.hcButtonFace = exports.grey14Alpha = exports.grey = exports.createV9Theme = exports.createV8Theme = exports.createBrandVariants = exports.brandWeb = exports.blackAlpha = exports.black = exports.StackShim = exports.StackItemShim = exports.shimMenuProps = exports.MenuItemShim = exports.ToggleButtonShim = exports.shimButtonProps = exports.PrimaryButtonShim = exports.MenuButtonShim = exports.DefaultButtonShim = exports.CompoundButtonShim = exports.CommandButtonShim = exports.ButtonShim = exports.ActionButtonShim = void 0;
|
|
5
|
+
Object.defineProperty(exports, "ActionButtonShim", { enumerable: true, get: function () { return index_1.ActionButtonShim; } });
|
|
6
|
+
Object.defineProperty(exports, "ButtonShim", { enumerable: true, get: function () { return index_1.ButtonShim; } });
|
|
7
|
+
Object.defineProperty(exports, "CommandButtonShim", { enumerable: true, get: function () { return index_1.CommandButtonShim; } });
|
|
8
|
+
Object.defineProperty(exports, "CompoundButtonShim", { enumerable: true, get: function () { return index_1.CompoundButtonShim; } });
|
|
9
|
+
Object.defineProperty(exports, "DefaultButtonShim", { enumerable: true, get: function () { return index_1.DefaultButtonShim; } });
|
|
10
|
+
Object.defineProperty(exports, "MenuButtonShim", { enumerable: true, get: function () { return index_1.MenuButtonShim; } });
|
|
11
|
+
Object.defineProperty(exports, "PrimaryButtonShim", { enumerable: true, get: function () { return index_1.PrimaryButtonShim; } });
|
|
12
|
+
Object.defineProperty(exports, "shimButtonProps", { enumerable: true, get: function () { return index_1.shimButtonProps; } });
|
|
13
|
+
Object.defineProperty(exports, "ToggleButtonShim", { enumerable: true, get: function () { return index_1.ToggleButtonShim; } });
|
|
14
|
+
Object.defineProperty(exports, "MenuItemShim", { enumerable: true, get: function () { return index_2.MenuItemShim; } });
|
|
15
|
+
Object.defineProperty(exports, "shimMenuProps", { enumerable: true, get: function () { return index_2.shimMenuProps; } });
|
|
16
|
+
Object.defineProperty(exports, "StackItemShim", { enumerable: true, get: function () { return index_3.StackItemShim; } });
|
|
17
|
+
Object.defineProperty(exports, "StackShim", { enumerable: true, get: function () { return index_3.StackShim; } });
|
|
18
|
+
Object.defineProperty(exports, "black", { enumerable: true, get: function () { return index_4.black; } });
|
|
19
|
+
Object.defineProperty(exports, "blackAlpha", { enumerable: true, get: function () { return index_4.blackAlpha; } });
|
|
20
|
+
Object.defineProperty(exports, "brandWeb", { enumerable: true, get: function () { return index_4.brandWeb; } });
|
|
21
|
+
Object.defineProperty(exports, "createBrandVariants", { enumerable: true, get: function () { return index_4.createBrandVariants; } });
|
|
22
|
+
Object.defineProperty(exports, "createV8Theme", { enumerable: true, get: function () { return index_4.createV8Theme; } });
|
|
23
|
+
Object.defineProperty(exports, "createV9Theme", { enumerable: true, get: function () { return index_4.createV9Theme; } });
|
|
24
|
+
Object.defineProperty(exports, "grey", { enumerable: true, get: function () { return index_4.grey; } });
|
|
25
|
+
Object.defineProperty(exports, "grey14Alpha", { enumerable: true, get: function () { return index_4.grey14Alpha; } });
|
|
26
|
+
Object.defineProperty(exports, "hcButtonFace", { enumerable: true, get: function () { return index_4.hcButtonFace; } });
|
|
27
|
+
Object.defineProperty(exports, "hcButtonText", { enumerable: true, get: function () { return index_4.hcButtonText; } });
|
|
28
|
+
Object.defineProperty(exports, "hcCanvas", { enumerable: true, get: function () { return index_4.hcCanvas; } });
|
|
29
|
+
Object.defineProperty(exports, "hcCanvasText", { enumerable: true, get: function () { return index_4.hcCanvasText; } });
|
|
30
|
+
Object.defineProperty(exports, "hcDisabled", { enumerable: true, get: function () { return index_4.hcDisabled; } });
|
|
31
|
+
Object.defineProperty(exports, "hcHighlight", { enumerable: true, get: function () { return index_4.hcHighlight; } });
|
|
32
|
+
Object.defineProperty(exports, "hcHighlightText", { enumerable: true, get: function () { return index_4.hcHighlightText; } });
|
|
33
|
+
Object.defineProperty(exports, "hcHyperlink", { enumerable: true, get: function () { return index_4.hcHyperlink; } });
|
|
34
|
+
Object.defineProperty(exports, "sharedColors", { enumerable: true, get: function () { return index_4.sharedColors; } });
|
|
35
|
+
Object.defineProperty(exports, "white", { enumerable: true, get: function () { return index_4.white; } });
|
|
36
|
+
Object.defineProperty(exports, "whiteAlpha", { enumerable: true, get: function () { return index_4.whiteAlpha; } });
|
|
37
|
+
});
|
|
38
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["index.ts"],"names":[],"mappings":";;;;IACE,yGAAA,gBAAgB,OAAA;IAChB,mGAAA,UAAU,OAAA;IACV,0GAAA,iBAAiB,OAAA;IACjB,2GAAA,kBAAkB,OAAA;IAClB,0GAAA,iBAAiB,OAAA;IACjB,uGAAA,cAAc,OAAA;IACd,0GAAA,iBAAiB,OAAA;IACjB,wGAAA,eAAe,OAAA;IACf,yGAAA,gBAAgB,OAAA;IAGT,qGAAA,YAAY,OAAA;IAAE,sGAAA,aAAa,OAAA;IAE3B,sGAAA,aAAa,OAAA;IAAE,kGAAA,SAAS,OAAA;IAG/B,8FAAA,KAAK,OAAA;IACL,mGAAA,UAAU,OAAA;IACV,iGAAA,QAAQ,OAAA;IACR,4GAAA,mBAAmB,OAAA;IACnB,sGAAA,aAAa,OAAA;IACb,sGAAA,aAAa,OAAA;IACb,6FAAA,IAAI,OAAA;IACJ,oGAAA,WAAW,OAAA;IACX,qGAAA,YAAY,OAAA;IACZ,qGAAA,YAAY,OAAA;IACZ,iGAAA,QAAQ,OAAA;IACR,qGAAA,YAAY,OAAA;IACZ,mGAAA,UAAU,OAAA;IACV,oGAAA,WAAW,OAAA;IACX,wGAAA,eAAe,OAAA;IACf,oGAAA,WAAW,OAAA;IACX,qGAAA,YAAY,OAAA;IACZ,8FAAA,KAAK,OAAA;IACL,mGAAA,UAAU,OAAA","sourcesContent":["export {\n ActionButtonShim,\n ButtonShim,\n CommandButtonShim,\n CompoundButtonShim,\n DefaultButtonShim,\n MenuButtonShim,\n PrimaryButtonShim,\n shimButtonProps,\n ToggleButtonShim,\n} from './components/Button/index';\n\nexport { MenuItemShim, shimMenuProps } from './components/Menu/index';\n\nexport { StackItemShim, StackShim } from './components/Stack/index';\n\nexport {\n black,\n blackAlpha,\n brandWeb,\n createBrandVariants,\n createV8Theme,\n createV9Theme,\n grey,\n grey14Alpha,\n hcButtonFace,\n hcButtonText,\n hcCanvas,\n hcCanvasText,\n hcDisabled,\n hcHighlight,\n hcHighlightText,\n hcHyperlink,\n sharedColors,\n white,\n whiteAlpha,\n} from './components/Theme/index';\n\nexport type {\n AlphaColors,\n ColorVariants,\n GlobalSharedColors,\n Greys,\n TextAlignment,\n TextAlignments,\n} from './components/Theme/index';\n"]}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
define(["require", "exports", "tslib", "react", "./Description.md", "@fluentui/react", "@fluentui/react-components", "../../components/Button/index"], function (require, exports, tslib_1, React, Description_md_1, react_1, react_components_1, index_1) {
|
|
2
|
+
"use strict";
|
|
3
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
+
exports.Default = void 0;
|
|
5
|
+
var useStyles = react_components_1.makeStyles({
|
|
6
|
+
root: {
|
|
7
|
+
display: 'grid',
|
|
8
|
+
gridTemplateColumns: 'auto auto auto',
|
|
9
|
+
gridTemplateRows: '1fr',
|
|
10
|
+
width: 'fit-content',
|
|
11
|
+
alignContent: 'center',
|
|
12
|
+
alignItems: 'center',
|
|
13
|
+
justifyItems: 'center',
|
|
14
|
+
columnGap: '10px',
|
|
15
|
+
rowGap: '10px',
|
|
16
|
+
},
|
|
17
|
+
componentName: tslib_1.__assign({ justifySelf: 'end' }, react_components_1.shorthands.margin(0, '10px', 0, 0)),
|
|
18
|
+
});
|
|
19
|
+
var Default = function () {
|
|
20
|
+
var styles = useStyles();
|
|
21
|
+
return (React.createElement("div", { className: styles.root },
|
|
22
|
+
React.createElement("h3", null, "v8"),
|
|
23
|
+
React.createElement("h3", null, "DefaultButtonShim"),
|
|
24
|
+
React.createElement("h3", null, "v9"),
|
|
25
|
+
React.createElement(react_1.DefaultButton, null, "Default"),
|
|
26
|
+
React.createElement(react_components_1.FluentProvider, { theme: react_components_1.webLightTheme },
|
|
27
|
+
React.createElement(index_1.DefaultButtonShim, null, "Default")),
|
|
28
|
+
React.createElement(react_components_1.FluentProvider, { theme: react_components_1.webLightTheme },
|
|
29
|
+
React.createElement(react_components_1.Button, null, "Default"))));
|
|
30
|
+
};
|
|
31
|
+
exports.Default = Default;
|
|
32
|
+
exports.default = {
|
|
33
|
+
title: 'Migration Shims/Button/DefaultButtonShim',
|
|
34
|
+
component: index_1.DefaultButtonShim,
|
|
35
|
+
parameters: {
|
|
36
|
+
docs: {
|
|
37
|
+
description: {
|
|
38
|
+
component: [Description_md_1.default].join('\n'),
|
|
39
|
+
},
|
|
40
|
+
},
|
|
41
|
+
},
|
|
42
|
+
};
|
|
43
|
+
});
|
|
44
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["stories/DefaultButtonShim/index.tsx"],"names":[],"mappings":";;;;IAQA,IAAM,SAAS,GAAG,6BAAU,CAAC;QAC3B,IAAI,EAAE;YACJ,OAAO,EAAE,MAAM;YACf,mBAAmB,EAAE,gBAAgB;YACrC,gBAAgB,EAAE,KAAK;YACvB,KAAK,EAAE,aAAa;YACpB,YAAY,EAAE,QAAQ;YACtB,UAAU,EAAE,QAAQ;YACpB,YAAY,EAAE,QAAQ;YACtB,SAAS,EAAE,MAAM;YACjB,MAAM,EAAE,MAAM;SACf;QACD,aAAa,qBACX,WAAW,EAAE,KAAK,IACf,6BAAU,CAAC,MAAM,CAAC,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC,CACtC;KACF,CAAC,CAAC;IAEI,IAAM,OAAO,GAAG;QACrB,IAAM,MAAM,GAAG,SAAS,EAAE,CAAC;QAE3B,OAAO,CACL,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI;YACzB,qCAAW;YACX,oDAA0B;YAC1B,qCAAW;YACX,oBAAC,qBAAa,kBAAwB;YACtC,oBAAC,iCAAc,IAAC,KAAK,EAAE,gCAAa;gBAClC,oBAAC,yBAAiB,kBAA4B,CAC/B;YACjB,oBAAC,iCAAc,IAAC,KAAK,EAAE,gCAAa;gBAClC,oBAAC,yBAAM,kBAAiB,CACT,CACb,CACP,CAAC;IACJ,CAAC,CAAC;IAjBW,QAAA,OAAO,WAiBlB;IAEF,kBAAe;QACb,KAAK,EAAE,0CAA0C;QACjD,SAAS,EAAE,yBAAiB;QAC5B,UAAU,EAAE;YACV,IAAI,EAAE;gBACJ,WAAW,EAAE;oBACX,SAAS,EAAE,CAAC,wBAAa,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC;iBACtC;aACF;SACF;KACF,CAAC","sourcesContent":["import * as React from 'react';\n\nimport descriptionMd from './Description.md';\n\nimport { DefaultButton } from '@fluentui/react';\nimport { FluentProvider, Button, webLightTheme, makeStyles, shorthands } from '@fluentui/react-components';\nimport { DefaultButtonShim } from '../../components/Button/index';\n\nconst useStyles = makeStyles({\n root: {\n display: 'grid',\n gridTemplateColumns: 'auto auto auto',\n gridTemplateRows: '1fr',\n width: 'fit-content',\n alignContent: 'center',\n alignItems: 'center',\n justifyItems: 'center',\n columnGap: '10px',\n rowGap: '10px',\n },\n componentName: {\n justifySelf: 'end',\n ...shorthands.margin(0, '10px', 0, 0),\n },\n});\n\nexport const Default = () => {\n const styles = useStyles();\n\n return (\n <div className={styles.root}>\n <h3>v8</h3>\n <h3>DefaultButtonShim</h3>\n <h3>v9</h3>\n <DefaultButton>Default</DefaultButton>\n <FluentProvider theme={webLightTheme}>\n <DefaultButtonShim>Default</DefaultButtonShim>\n </FluentProvider>\n <FluentProvider theme={webLightTheme}>\n <Button>Default</Button>\n </FluentProvider>\n </div>\n );\n};\n\nexport default {\n title: 'Migration Shims/Button/DefaultButtonShim',\n component: DefaultButtonShim,\n parameters: {\n docs: {\n description: {\n component: [descriptionMd].join('\\n'),\n },\n },\n },\n};\n"]}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ActionButtonShim = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const react_components_1 = /*#__PURE__*/require("@fluentui/react-components");
|
|
11
|
+
|
|
12
|
+
const shimButtonProps_1 = /*#__PURE__*/require("./shimButtonProps");
|
|
13
|
+
/**
|
|
14
|
+
* Shims a v8 ActionButton to render a v9 Button
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
exports.ActionButtonShim = /*#__PURE__*/React.forwardRef((props, _ref) => {
|
|
19
|
+
const variantProps = { ...props,
|
|
20
|
+
variantClassName: 'ms-Button--action ms-Button--command'
|
|
21
|
+
};
|
|
22
|
+
const shimProps = shimButtonProps_1.shimButtonProps(variantProps);
|
|
23
|
+
return React.createElement(react_components_1.Button, { ...props,
|
|
24
|
+
...shimProps,
|
|
25
|
+
appearance: "transparent"
|
|
26
|
+
});
|
|
27
|
+
});
|
|
28
|
+
//# sourceMappingURL=ActionButtonShim.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/ActionButtonShim.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAIA,MAAA,kBAAA,gBAAA,OAAA,CAAA,4BAAA,CAAA;;AAEA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAEA;;AAEG;;;AACU,OAAA,CAAA,gBAAA,gBAET,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,IAAR,KAAgB;EACnC,MAAM,YAAY,GAAG,EACnB,GAAG,KADgB;IAEnB,gBAAgB,EAAE;EAFC,CAArB;EAKA,MAAM,SAAS,GAAG,iBAAA,CAAA,eAAA,CAAgB,YAAhB,CAAlB;EAEA,OAAO,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,MAAD,EAAO,EAAA,GAAM,KAAN;IAAsD,GAAM,SAA5D;IAAuE,UAAU,EAAC;EAAlF,CAAP,CAAP;AACD,CATG,CAFS","sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims a v8 ActionButton to render a v9 Button\n */\nexport const ActionButtonShim: React.ForwardRefExoticComponent<\n IButtonProps & React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: 'ms-Button--action ms-Button--command',\n };\n\n const shimProps = shimButtonProps(variantProps);\n\n return <Button {...(props as React.RefAttributes<HTMLButtonElement>)} {...shimProps} appearance=\"transparent\" />;\n});\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ButtonShim = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const react_components_1 = /*#__PURE__*/require("@fluentui/react-components");
|
|
11
|
+
|
|
12
|
+
const shimButtonProps_1 = /*#__PURE__*/require("./shimButtonProps");
|
|
13
|
+
|
|
14
|
+
const ToggleButtonShim_1 = /*#__PURE__*/require("./ToggleButtonShim");
|
|
15
|
+
|
|
16
|
+
const CompoundButtonShim_1 = /*#__PURE__*/require("./CompoundButtonShim");
|
|
17
|
+
|
|
18
|
+
exports.ButtonShim = /*#__PURE__*/React.forwardRef((props, _ref) => {
|
|
19
|
+
var _a;
|
|
20
|
+
|
|
21
|
+
const shimProps = shimButtonProps_1.shimButtonProps(props);
|
|
22
|
+
|
|
23
|
+
if (props.toggle) {
|
|
24
|
+
return React.createElement(ToggleButtonShim_1.ToggleButtonShim, { ...props
|
|
25
|
+
}, props.children);
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
if (props.secondaryText || ((_a = props.onRenderDescription) === null || _a === void 0 ? void 0 : _a.call(props, props))) {
|
|
29
|
+
return React.createElement(CompoundButtonShim_1.CompoundButtonShim, { ...props
|
|
30
|
+
});
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
return React.createElement(react_components_1.Button, { ...props,
|
|
34
|
+
...shimProps
|
|
35
|
+
});
|
|
36
|
+
});
|
|
37
|
+
//# sourceMappingURL=ButtonShim.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/ButtonShim.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAIA,MAAA,kBAAA,gBAAA,OAAA,CAAA,4BAAA,CAAA;;AAEA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;;AACA,MAAA,oBAAA,gBAAA,OAAA,CAAA,sBAAA,CAAA;;AAEa,OAAA,CAAA,UAAA,gBAET,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,IAAR,KAAgB;;;EACnC,MAAM,SAAS,GAAG,iBAAA,CAAA,eAAA,CAAgB,KAAhB,CAAlB;;EAEA,IAAI,KAAK,CAAC,MAAV,EAAkB;IAChB,OAAO,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,gBAAD,EAAiB,EAAA,GAAK;IAAL,CAAjB,EAA8B,KAAK,CAAC,QAApC,CAAP;EACD;;EACD,IAAI,KAAK,CAAC,aAAN,KAAuB,CAAA,EAAA,GAAA,KAAK,CAAC,mBAAN,MAAyB,IAAzB,IAAyB,EAAA,KAAA,KAAA,CAAzB,GAAyB,KAAA,CAAzB,GAAyB,EAAA,CAAA,IAAA,CAAzB,KAAyB,EAAG,KAAH,CAAhD,CAAJ,EAA+D;IAC7D,OAAO,KAAA,CAAA,aAAA,CAAC,oBAAA,CAAA,kBAAD,EAAmB,EAAA,GAAK;IAAL,CAAnB,CAAP;EACD;;EAED,OAAO,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,MAAD,EAAO,EAAA,GAAM,KAAN;IAAsD,GAAM;EAA5D,CAAP,CAAP;AACD,CAXG,CAFS","sourcesContent":["import * as React from 'react';\n\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport { Button } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\nimport { ToggleButtonShim } from './ToggleButtonShim';\nimport { CompoundButtonShim } from './CompoundButtonShim';\n\nexport const ButtonShim: React.ForwardRefExoticComponent<\n IBaseButtonProps & React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const shimProps = shimButtonProps(props);\n\n if (props.toggle) {\n return <ToggleButtonShim {...props}>{props.children}</ToggleButtonShim>;\n }\n if (props.secondaryText || props.onRenderDescription?.(props)) {\n return <CompoundButtonShim {...props} />;\n }\n\n return <Button {...(props as React.RefAttributes<HTMLButtonElement>)} {...shimProps} />;\n});\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.CommandButtonShim = void 0;
|
|
7
|
+
/**
|
|
8
|
+
* Shims v8 CommandButtonShim to render a v9 Button
|
|
9
|
+
*/
|
|
10
|
+
|
|
11
|
+
var ActionButtonShim_1 = /*#__PURE__*/require("./ActionButtonShim");
|
|
12
|
+
|
|
13
|
+
Object.defineProperty(exports, "CommandButtonShim", {
|
|
14
|
+
enumerable: true,
|
|
15
|
+
get: function () {
|
|
16
|
+
return ActionButtonShim_1.ActionButtonShim;
|
|
17
|
+
}
|
|
18
|
+
});
|
|
19
|
+
//# sourceMappingURL=CommandButtonShim.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/CommandButtonShim.tsx"],"names":[],"mappings":";;;;;;AAAA;;AAEG;;AACH,IAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,kBAAA,CAAA,gBAAA;EAAgB;AAAhB,CAAA","sourcesContent":["/**\n * Shims v8 CommandButtonShim to render a v9 Button\n */\nexport { ActionButtonShim as CommandButtonShim } from './ActionButtonShim';\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.CompoundButtonShim = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const react_components_1 = /*#__PURE__*/require("@fluentui/react-components");
|
|
11
|
+
|
|
12
|
+
const shimButtonProps_1 = /*#__PURE__*/require("./shimButtonProps");
|
|
13
|
+
/**
|
|
14
|
+
* Shims v8 CompoundButton to render a v9 CompoundButton
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
exports.CompoundButtonShim = /*#__PURE__*/React.forwardRef((props, _ref) => {
|
|
19
|
+
var _a;
|
|
20
|
+
|
|
21
|
+
const variantProps = { ...props,
|
|
22
|
+
variantClassName: props.primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound'
|
|
23
|
+
};
|
|
24
|
+
const shimProps = { ...shimButtonProps_1.shimButtonProps(variantProps),
|
|
25
|
+
secondaryContent: props.secondaryText || ((_a = props.onRenderDescription) === null || _a === void 0 ? void 0 : _a.call(props, props))
|
|
26
|
+
};
|
|
27
|
+
return React.createElement(react_components_1.CompoundButton, { ...props,
|
|
28
|
+
...shimProps
|
|
29
|
+
});
|
|
30
|
+
});
|
|
31
|
+
//# sourceMappingURL=CompoundButtonShim.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/CompoundButtonShim.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAIA,MAAA,kBAAA,gBAAA,OAAA,CAAA,4BAAA,CAAA;;AAGA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAEA;;AAEG;;;AACU,OAAA,CAAA,kBAAA,gBAET,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,IAAR,KAAgB;;;EACnC,MAAM,YAAY,GAAG,EACnB,GAAG,KADgB;IAEnB,gBAAgB,EAAE,KAAK,CAAC,OAAN,GAAgB,4BAAhB,GAA+C;EAF9C,CAArB;EAKA,MAAM,SAAS,GAAwB,EACrC,GAAG,iBAAA,CAAA,eAAA,CAAgB,YAAhB,CADkC;IAErC,gBAAgB,EAAE,KAAK,CAAC,aAAN,KAAuB,CAAA,EAAA,GAAA,KAAK,CAAC,mBAAN,MAAyB,IAAzB,IAAyB,EAAA,KAAA,KAAA,CAAzB,GAAyB,KAAA,CAAzB,GAAyB,EAAA,CAAA,IAAA,CAAzB,KAAyB,EAAG,KAAH,CAAhD;EAFmB,CAAvC;EAKA,OAAO,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,cAAD,EAAe,EAAA,GAAM,KAAN;IAAsD,GAAM;EAA5D,CAAf,CAAP;AACD,CAZG,CAFS","sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { CompoundButton } from '@fluentui/react-components';\nimport type { CompoundButtonProps } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 CompoundButton to render a v9 CompoundButton\n */\nexport const CompoundButtonShim: React.ForwardRefExoticComponent<\n IButtonProps & React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: props.primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound',\n };\n\n const shimProps: CompoundButtonProps = {\n ...shimButtonProps(variantProps),\n secondaryContent: props.secondaryText || props.onRenderDescription?.(props),\n };\n\n return <CompoundButton {...(props as React.RefAttributes<HTMLButtonElement>)} {...shimProps} />;\n});\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.DefaultButtonShim = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const ButtonShim_1 = /*#__PURE__*/require("./ButtonShim");
|
|
11
|
+
/**
|
|
12
|
+
* Shims a v8 DefaultButton to render a v9 Button
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
exports.DefaultButtonShim = /*#__PURE__*/React.forwardRef((props, _ref) => {
|
|
17
|
+
return React.createElement(ButtonShim_1.ButtonShim, { ...props,
|
|
18
|
+
variantClassName: props.primary ? 'ms-Button--primary' : 'ms-Button--default'
|
|
19
|
+
});
|
|
20
|
+
});
|
|
21
|
+
//# sourceMappingURL=DefaultButtonShim.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/DefaultButtonShim.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAIA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;AAEG;;;AACU,OAAA,CAAA,iBAAA,gBAET,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,IAAR,KAAgB;EACnC,OAAO,KAAA,CAAA,aAAA,CAAC,YAAA,CAAA,UAAD,EAAW,EAAA,GAAK,KAAL;IAAY,gBAAgB,EAAE,KAAK,CAAC,OAAN,GAAgB,oBAAhB,GAAuC;EAArE,CAAX,CAAP;AACD,CAFG,CAFS","sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims a v8 DefaultButton to render a v9 Button\n */\nexport const DefaultButtonShim: React.ForwardRefExoticComponent<\n IButtonProps & React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n return <ButtonShim {...props} variantClassName={props.primary ? 'ms-Button--primary' : 'ms-Button--default'} />;\n});\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.MenuButtonShim = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const react_components_1 = /*#__PURE__*/require("@fluentui/react-components");
|
|
11
|
+
|
|
12
|
+
const index_1 = /*#__PURE__*/require("../Menu/index");
|
|
13
|
+
|
|
14
|
+
const shimButtonProps_1 = /*#__PURE__*/require("./shimButtonProps");
|
|
15
|
+
|
|
16
|
+
exports.MenuButtonShim = /*#__PURE__*/React.forwardRef((props, _ref) => {
|
|
17
|
+
var _a;
|
|
18
|
+
|
|
19
|
+
const variantProps = { ...props,
|
|
20
|
+
variantClassName: props.primary ? 'ms-Button--primary' : 'ms-Button--default'
|
|
21
|
+
};
|
|
22
|
+
const shimProps = { ...shimButtonProps_1.shimButtonProps(variantProps)
|
|
23
|
+
};
|
|
24
|
+
const shimmedMenuProps = props.menuProps ? index_1.shimMenuProps(props.menuProps) : {};
|
|
25
|
+
return React.createElement(react_components_1.Menu, { ...shimmedMenuProps
|
|
26
|
+
}, React.createElement(react_components_1.MenuTrigger, null, React.createElement(react_components_1.MenuButton, { ...shimProps
|
|
27
|
+
})), React.createElement(react_components_1.MenuPopover, null, React.createElement(react_components_1.MenuList, null, (_a = props.menuProps) === null || _a === void 0 ? void 0 : _a.items.map(item => // key is added through item spread
|
|
28
|
+
// eslint-disable-next-line react/jsx-key
|
|
29
|
+
React.createElement(index_1.MenuItemShim, { ...item
|
|
30
|
+
})))));
|
|
31
|
+
});
|
|
32
|
+
//# sourceMappingURL=MenuButtonShim.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/MenuButtonShim.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAGA,MAAA,kBAAA,gBAAA,OAAA,CAAA,4BAAA,CAAA;;AAEA,MAAA,OAAA,gBAAA,OAAA,CAAA,eAAA,CAAA;;AAEA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;;AAEa,OAAA,CAAA,cAAA,gBAET,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,IAAR,KAAgB;;;EACnC,MAAM,YAAY,GAAG,EACnB,GAAG,KADgB;IAEnB,gBAAgB,EAAE,KAAK,CAAC,OAAN,GAAgB,oBAAhB,GAAuC;EAFtC,CAArB;EAKA,MAAM,SAAS,GAAoB,EACjC,GAAG,iBAAA,CAAA,eAAA,CAAgB,YAAhB;EAD8B,CAAnC;EAIA,MAAM,gBAAgB,GAAG,KAAK,CAAC,SAAN,GAAkB,OAAA,CAAA,aAAA,CAAc,KAAK,CAAC,SAApB,CAAlB,GAAmD,EAA5E;EAEA,OACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,IAAD,EAAK,EAAA,GAAK;EAAL,CAAL,EACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,WAAD,EAAY,IAAZ,EACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,UAAD,EAAW,EAAA,GAAK;EAAL,CAAX,CADF,CADF,EAIE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,WAAD,EAAY,IAAZ,EACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,QAAD,EAAS,IAAT,EACG,CAAA,EAAA,GAAA,KAAK,CAAC,SAAN,MAAe,IAAf,IAAe,EAAA,KAAA,KAAA,CAAf,GAAe,KAAA,CAAf,GAAe,EAAA,CAAE,KAAF,CAAQ,GAAR,CAAY,IAAI,IAC9B;EACA;EACA,KAAA,CAAA,aAAA,CAAC,OAAA,CAAA,YAAD,EAAa,EAAA,GAAK;EAAL,CAAb,CAHc,CADlB,CADF,CAJF,CADF;AAgBD,CA5BG,CAFS","sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { MenuButton, Menu, MenuList, MenuPopover, MenuTrigger } from '@fluentui/react-components';\nimport type { MenuButtonProps } from '@fluentui/react-components';\nimport { MenuItemShim, shimMenuProps } from '../Menu/index';\n\nimport { shimButtonProps } from './shimButtonProps';\n\nexport const MenuButtonShim: React.ForwardRefExoticComponent<\n IButtonProps & React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: props.primary ? 'ms-Button--primary' : 'ms-Button--default',\n };\n\n const shimProps: MenuButtonProps = {\n ...shimButtonProps(variantProps),\n };\n\n const shimmedMenuProps = props.menuProps ? shimMenuProps(props.menuProps) : {};\n\n return (\n <Menu {...shimmedMenuProps}>\n <MenuTrigger>\n <MenuButton {...shimProps} />\n </MenuTrigger>\n <MenuPopover>\n <MenuList>\n {props.menuProps?.items.map(item => (\n // key is added through item spread\n // eslint-disable-next-line react/jsx-key\n <MenuItemShim {...item} />\n ))}\n </MenuList>\n </MenuPopover>\n </Menu>\n );\n});\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.PrimaryButtonShim = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const ButtonShim_1 = /*#__PURE__*/require("./ButtonShim");
|
|
11
|
+
/**
|
|
12
|
+
* Shims v8 PrimaryButton to render a v9 Button
|
|
13
|
+
*/
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
exports.PrimaryButtonShim = /*#__PURE__*/React.forwardRef((props, _ref) => {
|
|
17
|
+
return React.createElement(ButtonShim_1.ButtonShim, { ...props,
|
|
18
|
+
primary: true,
|
|
19
|
+
variantClassName: "ms-Button--primary"
|
|
20
|
+
});
|
|
21
|
+
});
|
|
22
|
+
//# sourceMappingURL=PrimaryButtonShim.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/PrimaryButtonShim.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAGA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;AAEG;;;AACU,OAAA,CAAA,iBAAA,gBAET,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,IAAR,KAAgB;EACnC,OAAO,KAAA,CAAA,aAAA,CAAC,YAAA,CAAA,UAAD,EAAW,EAAA,GAAK,KAAL;IAAY,OAAO,EAAA,IAAnB;IAAoB,gBAAgB,EAAC;EAArC,CAAX,CAAP;AACD,CAFG,CAFS","sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\nimport { ButtonShim } from './ButtonShim';\n\n/**\n * Shims v8 PrimaryButton to render a v9 Button\n */\nexport const PrimaryButtonShim: React.ForwardRefExoticComponent<\n IButtonProps & React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n return <ButtonShim {...props} primary variantClassName=\"ms-Button--primary\" />;\n});\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.ToggleButtonShim = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const react_components_1 = /*#__PURE__*/require("@fluentui/react-components");
|
|
11
|
+
|
|
12
|
+
const shimButtonProps_1 = /*#__PURE__*/require("./shimButtonProps");
|
|
13
|
+
/**
|
|
14
|
+
* Shims v8 ToggleButton to render a v9 ToggleButton
|
|
15
|
+
*/
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
exports.ToggleButtonShim = /*#__PURE__*/React.forwardRef((props, _ref) => {
|
|
19
|
+
const variantProps = { ...props,
|
|
20
|
+
variantClassName: props.primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound'
|
|
21
|
+
};
|
|
22
|
+
const shimProps = { ...shimButtonProps_1.shimButtonProps(variantProps),
|
|
23
|
+
checked: props.checked,
|
|
24
|
+
defaultChecked: props.defaultChecked
|
|
25
|
+
};
|
|
26
|
+
return React.createElement(react_components_1.ToggleButton, { ...props,
|
|
27
|
+
...shimProps
|
|
28
|
+
});
|
|
29
|
+
});
|
|
30
|
+
//# sourceMappingURL=ToggleButtonShim.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/ToggleButtonShim.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAIA,MAAA,kBAAA,gBAAA,OAAA,CAAA,4BAAA,CAAA;;AAGA,MAAA,iBAAA,gBAAA,OAAA,CAAA,mBAAA,CAAA;AAEA;;AAEG;;;AACU,OAAA,CAAA,gBAAA,gBAET,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,IAAR,KAAgB;EACnC,MAAM,YAAY,GAAG,EACnB,GAAG,KADgB;IAEnB,gBAAgB,EAAE,KAAK,CAAC,OAAN,GAAgB,4BAAhB,GAA+C;EAF9C,CAArB;EAKA,MAAM,SAAS,GAAsB,EACnC,GAAG,iBAAA,CAAA,eAAA,CAAgB,YAAhB,CADgC;IAEnC,OAAO,EAAE,KAAK,CAAC,OAFoB;IAGnC,cAAc,EAAE,KAAK,CAAC;EAHa,CAArC;EAMA,OAAO,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,YAAD,EAAa,EAAA,GAAM,KAAN;IAAsD,GAAM;EAA5D,CAAb,CAAP;AACD,CAbG,CAFS","sourcesContent":["import * as React from 'react';\n\nimport type { IButtonProps } from '@fluentui/react';\n\nimport { ToggleButton } from '@fluentui/react-components';\nimport type { ToggleButtonProps } from '@fluentui/react-components';\n\nimport { shimButtonProps } from './shimButtonProps';\n\n/**\n * Shims v8 ToggleButton to render a v9 ToggleButton\n */\nexport const ToggleButtonShim: React.ForwardRefExoticComponent<\n IButtonProps & React.RefAttributes<HTMLButtonElement>\n> = React.forwardRef((props, _ref) => {\n const variantProps = {\n ...props,\n variantClassName: props.primary ? 'ms-Button--compoundPrimary' : 'ms-Button--compound',\n };\n\n const shimProps: ToggleButtonProps = {\n ...shimButtonProps(variantProps),\n checked: props.checked,\n defaultChecked: props.defaultChecked,\n };\n\n return <ToggleButton {...(props as React.RefAttributes<HTMLButtonElement>)} {...shimProps} />;\n});\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
|
|
7
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
|
8
|
+
|
|
9
|
+
tslib_1.__exportStar(require("./ActionButtonShim"), exports);
|
|
10
|
+
|
|
11
|
+
tslib_1.__exportStar(require("./ButtonShim"), exports);
|
|
12
|
+
|
|
13
|
+
tslib_1.__exportStar(require("./CommandButtonShim"), exports);
|
|
14
|
+
|
|
15
|
+
tslib_1.__exportStar(require("./CompoundButtonShim"), exports);
|
|
16
|
+
|
|
17
|
+
tslib_1.__exportStar(require("./DefaultButtonShim"), exports);
|
|
18
|
+
|
|
19
|
+
tslib_1.__exportStar(require("./MenuButtonShim"), exports);
|
|
20
|
+
|
|
21
|
+
tslib_1.__exportStar(require("./PrimaryButtonShim"), exports);
|
|
22
|
+
|
|
23
|
+
tslib_1.__exportStar(require("./shimButtonProps"), exports);
|
|
24
|
+
|
|
25
|
+
tslib_1.__exportStar(require("./ToggleButtonShim"), exports);
|
|
26
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,sBAAA,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,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './ActionButtonShim';\nexport * from './ButtonShim';\nexport * from './CommandButtonShim';\nexport * from './CompoundButtonShim';\nexport * from './DefaultButtonShim';\nexport * from './MenuButtonShim';\nexport * from './PrimaryButtonShim';\nexport * from './shimButtonProps';\nexport * from './ToggleButtonShim';\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.shimButtonProps = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const react_1 = /*#__PURE__*/require("@fluentui/react");
|
|
11
|
+
|
|
12
|
+
const shimButtonProps = props => {
|
|
13
|
+
var _a; //TODO: Icon shim. This still renders the v8 icon.
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
const icon = props.onRenderIcon ? props.onRenderIcon(props) : props.iconProps ? React.createElement(react_1.Icon, { ...props.iconProps
|
|
17
|
+
}) : undefined;
|
|
18
|
+
const variantClassName = ((_a = props.variantClassName) !== null && _a !== void 0 ? _a : props.primary) ? 'ms-Button--primary' : 'ms-Button--default';
|
|
19
|
+
const className = [props.baseClassName, variantClassName, props.className].filter(Boolean).join(' ');
|
|
20
|
+
return { // spread incoming props to propagate HTML properties not part of IBaseButtonProps
|
|
21
|
+
...props,
|
|
22
|
+
appearance: props.primary ? 'primary' : undefined,
|
|
23
|
+
className,
|
|
24
|
+
disabled: props.disabled,
|
|
25
|
+
disabledFocusable: props.allowDisabledFocus,
|
|
26
|
+
'aria-hidden': props.ariaHidden,
|
|
27
|
+
'aria-label': props.ariaLabel,
|
|
28
|
+
icon,
|
|
29
|
+
key: props.key || props.uniqueId,
|
|
30
|
+
children: props.onRenderChildren ? props.onRenderChildren(props) : props.onRenderText ? props.onRenderText(props) : props.text || props.children
|
|
31
|
+
};
|
|
32
|
+
};
|
|
33
|
+
|
|
34
|
+
exports.shimButtonProps = shimButtonProps;
|
|
35
|
+
//# sourceMappingURL=shimButtonProps.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Button/shimButtonProps.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,OAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AAKO,MAAM,eAAe,GAAI,KAAD,IAAkF;SAAA,CAC/G;;;EACA,MAAM,IAAI,GAAG,KAAK,CAAC,YAAN,GACX,KAAK,CAAC,YAAN,CAAmB,KAAnB,CADW,GAET,KAAK,CAAC,SAAN,GACF,KAAA,CAAA,aAAA,CAAC,OAAA,CAAA,IAAD,EAAK,EAAA,GAAK,KAAK,CAAC;EAAX,CAAL,CADE,GAEA,SAJJ;EAMA,MAAM,gBAAgB,GAAG,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,gBAAN,MAAsB,IAAtB,IAAsB,EAAA,KAAA,KAAA,CAAtB,GAAsB,EAAtB,GAA0B,KAAK,CAAC,OAAhC,IAA0C,oBAA1C,GAAiE,oBAA1F;EACA,MAAM,SAAS,GAAG,CAAC,KAAK,CAAC,aAAP,EAAsB,gBAAtB,EAAwC,KAAK,CAAC,SAA9C,EAAyD,MAAzD,CAAgE,OAAhE,EAAyE,IAAzE,CAA8E,GAA9E,CAAlB;EAEA,OAAO,EACL;IACA,GAAG,KAFE;IAGL,UAAU,EAAE,KAAK,CAAC,OAAN,GAAgB,SAAhB,GAA4B,SAHnC;IAIL,SAJK;IAKL,QAAQ,EAAE,KAAK,CAAC,QALX;IAML,iBAAiB,EAAE,KAAK,CAAC,kBANpB;IAOL,eAAe,KAAK,CAAC,UAPhB;IAQL,cAAc,KAAK,CAAC,SARf;IASL,IATK;IAUL,GAAG,EAAE,KAAK,CAAC,GAAN,IAAa,KAAK,CAAC,QAVnB;IAWL,QAAQ,EAAE,KAAK,CAAC,gBAAN,GACN,KAAK,CAAC,gBAAN,CAAuB,KAAvB,CADM,GAEN,KAAK,CAAC,YAAN,GACA,KAAK,CAAC,YAAN,CAAmB,KAAnB,CADA,GAEA,KAAK,CAAC,IAAN,IAAc,KAAK,CAAC;EAfnB,CAAP;AAiBD,CA5BM;;AAAM,OAAA,CAAA,eAAA,GAAe,eAAf","sourcesContent":["import * as React from 'react';\n\nimport { Icon } from '@fluentui/react';\nimport type { IBaseButtonProps } from '@fluentui/react';\n\nimport type { ButtonProps } from '@fluentui/react-components';\n\nexport const shimButtonProps = (props: IBaseButtonProps & React.RefAttributes<HTMLButtonElement>): ButtonProps => {\n //TODO: Icon shim. This still renders the v8 icon.\n const icon = props.onRenderIcon ? (\n props.onRenderIcon(props)\n ) : props.iconProps ? (\n <Icon {...props.iconProps} />\n ) : undefined;\n\n const variantClassName = props.variantClassName ?? props.primary ? 'ms-Button--primary' : 'ms-Button--default';\n const className = [props.baseClassName, variantClassName, props.className].filter(Boolean).join(' ');\n\n return {\n // spread incoming props to propagate HTML properties not part of IBaseButtonProps\n ...props,\n appearance: props.primary ? 'primary' : undefined,\n className,\n disabled: props.disabled,\n disabledFocusable: props.allowDisabledFocus,\n 'aria-hidden': props.ariaHidden,\n 'aria-label': props.ariaLabel,\n icon,\n key: props.key || props.uniqueId,\n children: props.onRenderChildren\n ? props.onRenderChildren(props)\n : props.onRenderText\n ? props.onRenderText(props)\n : props.text || props.children,\n } as ButtonProps;\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.MenuItemShim = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const react_1 = /*#__PURE__*/require("@fluentui/react");
|
|
11
|
+
|
|
12
|
+
const react_components_1 = /*#__PURE__*/require("@fluentui/react-components");
|
|
13
|
+
|
|
14
|
+
const shimMenuProps_1 = /*#__PURE__*/require("./shimMenuProps");
|
|
15
|
+
|
|
16
|
+
const MenuItemShim = props => {
|
|
17
|
+
var _a, _b;
|
|
18
|
+
|
|
19
|
+
if (props.itemType === react_1.ContextualMenuItemType.Divider) {
|
|
20
|
+
const shimProps = shimMenuProps_1.shimMenuItemProps(props);
|
|
21
|
+
return React.createElement(react_components_1.MenuDivider, { ...shimProps
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
if (props.itemType === react_1.ContextualMenuItemType.Section) {
|
|
26
|
+
const shimProps = shimMenuProps_1.shimMenuHeaderProps(props);
|
|
27
|
+
return React.createElement(react_components_1.MenuGroup, null, React.createElement(react_components_1.MenuGroupHeader, null, shimProps.children), (_a = props.subMenuProps) === null || _a === void 0 ? void 0 : _a.items.map(item => // key is added through item spread
|
|
28
|
+
// eslint-disable-next-line react/jsx-key
|
|
29
|
+
React.createElement(exports.MenuItemShim, { ...item
|
|
30
|
+
})));
|
|
31
|
+
}
|
|
32
|
+
|
|
33
|
+
if (props.canCheck) {
|
|
34
|
+
const shimProps = shimMenuProps_1.shimMenuItemCheckboxProps(props);
|
|
35
|
+
return React.createElement(react_components_1.MenuItemCheckbox, { ...shimProps
|
|
36
|
+
});
|
|
37
|
+
} // Nested Menu to handle submenus
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
if (((_b = props.subMenuProps) === null || _b === void 0 ? void 0 : _b.items) && props.subMenuProps.items.length > 0) {
|
|
41
|
+
const shimmedMenuProps = shimMenuProps_1.shimMenuProps(props.subMenuProps);
|
|
42
|
+
const shimmedItemProps = shimMenuProps_1.shimMenuItemProps(props);
|
|
43
|
+
return React.createElement(react_components_1.Menu, { ...shimmedMenuProps
|
|
44
|
+
}, React.createElement(react_components_1.MenuTrigger, null, React.createElement(react_components_1.MenuItem, { ...shimmedItemProps,
|
|
45
|
+
hasSubmenu: true
|
|
46
|
+
})), React.createElement(react_components_1.MenuPopover, null, React.createElement(react_components_1.MenuList, null, props.subMenuProps.items.map(item => // key is added through item spread
|
|
47
|
+
// eslint-disable-next-line react/jsx-key
|
|
48
|
+
React.createElement(exports.MenuItemShim, { ...item
|
|
49
|
+
})))));
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
const shimProps = shimMenuProps_1.shimMenuItemProps(props);
|
|
53
|
+
return React.createElement(react_components_1.MenuItem, { ...shimProps
|
|
54
|
+
});
|
|
55
|
+
};
|
|
56
|
+
|
|
57
|
+
exports.MenuItemShim = MenuItemShim;
|
|
58
|
+
//# sourceMappingURL=MenuShim.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Menu/MenuShim.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,OAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AAEA,MAAA,kBAAA,gBAAA,OAAA,CAAA,4BAAA,CAAA;;AAaA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AAEO,MAAM,YAAY,GAAI,KAAD,IAA+B;;;EACzD,IAAI,KAAK,CAAC,QAAN,KAAmB,OAAA,CAAA,sBAAA,CAAuB,OAA9C,EAAuD;IACrD,MAAM,SAAS,GAAG,eAAA,CAAA,iBAAA,CAAkB,KAAlB,CAAlB;IACA,OAAO,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,WAAD,EAAY,EAAA,GAAM;IAAN,CAAZ,CAAP;EACD;;EAED,IAAI,KAAK,CAAC,QAAN,KAAmB,OAAA,CAAA,sBAAA,CAAuB,OAA9C,EAAuD;IACrD,MAAM,SAAS,GAAG,eAAA,CAAA,mBAAA,CAAoB,KAApB,CAAlB;IACA,OACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,SAAD,EAAU,IAAV,EACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,eAAD,EAAgB,IAAhB,EAAkB,SAAS,CAAC,QAA5B,CADF,EAGG,CAAA,EAAA,GAAA,KAAK,CAAC,YAAN,MAAkB,IAAlB,IAAkB,EAAA,KAAA,KAAA,CAAlB,GAAkB,KAAA,CAAlB,G,GAAoB,K,CAAM,G,CAAI,IAAI,IACjC;IACA;IACA,KAAA,CAAA,aAAA,CAAC,OAAA,CAAA,YAAD,EAAa,EAAA,GAAK;IAAL,CAAb,C,CANJ,CADF;EAWD;;EAED,IAAI,KAAK,CAAC,QAAV,EAAoB;IAClB,MAAM,SAAS,GAAG,eAAA,CAAA,yBAAA,CAA0B,KAA1B,CAAlB;IACA,OAAO,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,gBAAD,EAAiB,EAAA,GAAK;IAAL,CAAjB,CAAP;EACD,CAxBwD,CA0BzD;;;EACA,IAAI,CAAA,CAAA,EAAA,GAAA,KAAK,CAAC,YAAN,MAAkB,IAAlB,IAAkB,EAAA,KAAA,KAAA,CAAlB,GAAkB,KAAA,CAAlB,GAAkB,EAAA,CAAE,KAApB,KAA6B,KAAK,CAAC,YAAN,CAAmB,KAAnB,CAAyB,MAAzB,GAAkC,CAAnE,EAAsE;IACpE,MAAM,gBAAgB,GAAG,eAAA,CAAA,aAAA,CAAc,KAAK,CAAC,YAApB,CAAzB;IACA,MAAM,gBAAgB,GAAG,eAAA,CAAA,iBAAA,CAAkB,KAAlB,CAAzB;IAEA,OACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,IAAD,EAAK,EAAA,GAAK;IAAL,CAAL,EACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,WAAD,EAAY,IAAZ,EACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,QAAD,EAAS,EAAA,GAAK,gBAAL;MAAuB,UAAU,EAAA;IAAjC,CAAT,CADF,CADF,EAIE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,WAAD,EAAY,IAAZ,EACE,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,QAAD,EAAS,IAAT,EACG,KAAK,CAAC,YAAN,CAAmB,KAAnB,CAAyB,GAAzB,CAA6B,IAAI,IAChC;IACA;IACA,KAAA,CAAA,aAAA,CAAC,OAAA,CAAA,YAAD,EAAa,EAAA,GAAK;IAAL,CAAb,CAHD,CADH,CADF,CAJF,CADF;EAgBD;;EAED,MAAM,SAAS,GAAG,eAAA,CAAA,iBAAA,CAAkB,KAAlB,CAAlB;EACA,OAAO,KAAA,CAAA,aAAA,CAAC,kBAAA,CAAA,QAAD,EAAS,EAAA,GAAK;EAAL,CAAT,CAAP;AACD,CAnDM;;AAAM,OAAA,CAAA,YAAA,GAAY,YAAZ","sourcesContent":["import * as React from 'react';\n\nimport { ContextualMenuItemType } from '@fluentui/react';\nimport type { IContextualMenuItem } from '@fluentui/react';\nimport {\n MenuItem,\n MenuDivider,\n MenuGroup,\n MenuGroupHeader,\n MenuTrigger,\n Menu,\n MenuList,\n MenuPopover,\n MenuItemCheckbox,\n MenuDividerProps,\n} from '@fluentui/react-components';\n\nimport { shimMenuHeaderProps, shimMenuItemCheckboxProps, shimMenuItemProps, shimMenuProps } from './shimMenuProps';\n\nexport const MenuItemShim = (props: IContextualMenuItem) => {\n if (props.itemType === ContextualMenuItemType.Divider) {\n const shimProps = shimMenuItemProps(props);\n return <MenuDivider {...(shimProps as MenuDividerProps)} />;\n }\n\n if (props.itemType === ContextualMenuItemType.Section) {\n const shimProps = shimMenuHeaderProps(props);\n return (\n <MenuGroup>\n <MenuGroupHeader>{shimProps.children}</MenuGroupHeader>\n {/* //TODO: sectionProps handling */}\n {props.subMenuProps?.items.map(item => (\n // key is added through item spread\n // eslint-disable-next-line react/jsx-key\n <MenuItemShim {...item} />\n ))}\n </MenuGroup>\n );\n }\n\n if (props.canCheck) {\n const shimProps = shimMenuItemCheckboxProps(props);\n return <MenuItemCheckbox {...shimProps} />;\n }\n\n // Nested Menu to handle submenus\n if (props.subMenuProps?.items && props.subMenuProps.items.length > 0) {\n const shimmedMenuProps = shimMenuProps(props.subMenuProps);\n const shimmedItemProps = shimMenuItemProps(props);\n\n return (\n <Menu {...shimmedMenuProps}>\n <MenuTrigger>\n <MenuItem {...shimmedItemProps} hasSubmenu />\n </MenuTrigger>\n <MenuPopover>\n <MenuList>\n {props.subMenuProps.items.map(item => (\n // key is added through item spread\n // eslint-disable-next-line react/jsx-key\n <MenuItemShim {...item} />\n ))}\n </MenuList>\n </MenuPopover>\n </Menu>\n );\n }\n\n const shimProps = shimMenuItemProps(props);\n return <MenuItem {...shimProps} />;\n};\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
|
|
7
|
+
const tslib_1 = /*#__PURE__*/require("tslib");
|
|
8
|
+
|
|
9
|
+
tslib_1.__exportStar(require("./MenuShim"), exports);
|
|
10
|
+
|
|
11
|
+
tslib_1.__exportStar(require("./shimMenuProps"), exports);
|
|
12
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Menu/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,YAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './MenuShim';\nexport * from './shimMenuProps';\n"],"sourceRoot":"../src/"}
|
|
@@ -0,0 +1,53 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.shimMenuHeaderProps = exports.shimMenuItemCheckboxProps = exports.shimMenuItemProps = exports.shimMenuProps = void 0;
|
|
7
|
+
|
|
8
|
+
const React = /*#__PURE__*/require("react");
|
|
9
|
+
|
|
10
|
+
const react_1 = /*#__PURE__*/require("@fluentui/react");
|
|
11
|
+
|
|
12
|
+
const shimMenuProps = props => {
|
|
13
|
+
return {
|
|
14
|
+
hasIcons: props === null || props === void 0 ? void 0 : props.items.some(i => i.iconProps),
|
|
15
|
+
hasCheckmarks: props === null || props === void 0 ? void 0 : props.items.some(i => i.canCheck || i.checked)
|
|
16
|
+
};
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
exports.shimMenuProps = shimMenuProps;
|
|
20
|
+
|
|
21
|
+
const shimMenuItemProps = props => {
|
|
22
|
+
//TODO: Handle menuItem.onRenderIcon
|
|
23
|
+
const icon = props.iconProps ? React.createElement(react_1.Icon, { ...props.iconProps
|
|
24
|
+
}) : undefined;
|
|
25
|
+
return { ...props,
|
|
26
|
+
'aria-label': props.ariaLabel,
|
|
27
|
+
children: props.text,
|
|
28
|
+
icon,
|
|
29
|
+
secondaryContent: props.secondaryText
|
|
30
|
+
};
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
exports.shimMenuItemProps = shimMenuItemProps;
|
|
34
|
+
|
|
35
|
+
const shimMenuItemCheckboxProps = props => {
|
|
36
|
+
return { ...exports.shimMenuItemProps(props),
|
|
37
|
+
name: props.text || 'name',
|
|
38
|
+
value: props.value || 'value'
|
|
39
|
+
};
|
|
40
|
+
};
|
|
41
|
+
|
|
42
|
+
exports.shimMenuItemCheckboxProps = shimMenuItemCheckboxProps;
|
|
43
|
+
|
|
44
|
+
const shimMenuHeaderProps = props => {
|
|
45
|
+
var _a;
|
|
46
|
+
|
|
47
|
+
return {
|
|
48
|
+
children: (_a = props.sectionProps) === null || _a === void 0 ? void 0 : _a.title
|
|
49
|
+
};
|
|
50
|
+
};
|
|
51
|
+
|
|
52
|
+
exports.shimMenuHeaderProps = shimMenuHeaderProps;
|
|
53
|
+
//# sourceMappingURL=shimMenuProps.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["components/Menu/shimMenuProps.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,OAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AAIO,MAAM,aAAa,GAAI,KAAD,IAAoD;EAC/E,OAAO;IACL,QAAQ,EAAE,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAP,CAAa,IAAb,CAAkB,CAAC,IAAI,CAAC,CAAC,SAAzB,CADL;IAEL,aAAa,EAAE,KAAK,KAAA,IAAL,IAAA,KAAK,KAAA,KAAA,CAAL,GAAK,KAAA,CAAL,GAAA,KAAK,CAAE,KAAP,CAAa,IAAb,CAAkB,CAAC,IAAI,CAAC,CAAC,QAAF,IAAc,CAAC,CAAC,OAAvC;EAFV,CAAP;AAID,CALM;;AAAM,OAAA,CAAA,aAAA,GAAa,aAAb;;AAON,MAAM,iBAAiB,GAAI,KAAD,IAA8C;EAC7E;EACA,MAAM,IAAI,GAAG,KAAK,CAAC,SAAN,GAAkB,KAAA,CAAA,aAAA,CAAC,OAAA,CAAA,IAAD,EAAK,EAAA,GAAK,KAAK,CAAC;EAAX,CAAL,CAAlB,GAAkD,SAA/D;EAEA,OAAO,EACL,GAAG,KADE;IAEL,cAAc,KAAK,CAAC,SAFf;IAGL,QAAQ,EAAE,KAAK,CAAC,IAHX;IAIL,IAJK;IAKL,gBAAgB,EAAE,KAAK,CAAC;EALnB,CAAP;AAOD,CAXM;;AAAM,OAAA,CAAA,iBAAA,GAAiB,iBAAjB;;AAaN,MAAM,yBAAyB,GAAI,KAAD,IAAsD;EAC7F,OAAO,EACL,GAAG,OAAA,CAAA,iBAAA,CAAkB,KAAlB,CADE;IAEL,IAAI,EAAE,KAAK,CAAC,IAAN,IAAc,MAFf;IAGL,KAAK,EAAE,KAAK,CAAC,KAAN,IAAe;EAHjB,CAAP;AAKD,CANM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB;;AAQN,MAAM,mBAAmB,GAAI,KAAD,IAAqD;;;EACtF,OAAO;IACL,QAAQ,EAAE,CAAA,EAAA,GAAA,KAAK,CAAC,YAAN,MAAkB,IAAlB,IAAkB,EAAA,KAAA,KAAA,CAAlB,GAAkB,KAAA,CAAlB,GAAkB,EAAA,CAAE;EADzB,CAAP;AAGD,CAJM;;AAAM,OAAA,CAAA,mBAAA,GAAmB,mBAAnB","sourcesContent":["import * as React from 'react';\n\nimport { Icon } from '@fluentui/react';\nimport type { IContextualMenuItem, IContextualMenuProps } from '@fluentui/react';\nimport type { MenuItemProps, MenuGroupHeaderProps, MenuItemCheckboxProps, MenuProps } from '@fluentui/react-menu';\n\nexport const shimMenuProps = (props: IContextualMenuProps): Partial<MenuProps> => {\n return {\n hasIcons: props?.items.some(i => i.iconProps),\n hasCheckmarks: props?.items.some(i => i.canCheck || i.checked),\n };\n};\n\nexport const shimMenuItemProps = (props: IContextualMenuItem): MenuItemProps => {\n //TODO: Handle menuItem.onRenderIcon\n const icon = props.iconProps ? <Icon {...props.iconProps} /> : undefined;\n\n return {\n ...props,\n 'aria-label': props.ariaLabel,\n children: props.text,\n icon,\n secondaryContent: props.secondaryText,\n } as MenuItemProps;\n};\n\nexport const shimMenuItemCheckboxProps = (props: IContextualMenuItem): MenuItemCheckboxProps => {\n return {\n ...shimMenuItemProps(props),\n name: props.text || 'name',\n value: props.value || 'value',\n };\n};\n\nexport const shimMenuHeaderProps = (props: IContextualMenuItem): MenuGroupHeaderProps => {\n return {\n children: props.sectionProps?.title,\n };\n};\n"],"sourceRoot":"../src/"}
|