331 lines
11 KiB
JavaScript
331 lines
11 KiB
JavaScript
'use client';
|
|
"use strict";
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
function _export(target, all) {
|
|
for(var name in all)Object.defineProperty(target, name, {
|
|
enumerable: true,
|
|
get: all[name]
|
|
});
|
|
}
|
|
_export(exports, {
|
|
compoundButtonClassNames: function() {
|
|
return compoundButtonClassNames;
|
|
},
|
|
useCompoundButtonStyles_unstable: function() {
|
|
return useCompoundButtonStyles_unstable;
|
|
}
|
|
});
|
|
const _react = require("@griffel/react");
|
|
const _useButtonStylesstyles = require("../Button/useButtonStyles.styles");
|
|
const compoundButtonClassNames = {
|
|
root: 'fui-CompoundButton',
|
|
icon: 'fui-CompoundButton__icon',
|
|
contentContainer: 'fui-CompoundButton__contentContainer',
|
|
secondaryContent: 'fui-CompoundButton__secondaryContent'
|
|
};
|
|
const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
base: {
|
|
Bqenvij: "f11ysow2",
|
|
J657lq: "f1um431h",
|
|
Jlnjib: "fte7hqw",
|
|
Bo7webf: "frw79jk"
|
|
},
|
|
highContrast: {
|
|
m3fafd: "ffcivv0",
|
|
pus4l6: "f1wchxtt"
|
|
},
|
|
outline: {},
|
|
primary: {
|
|
J657lq: "foe7gw6",
|
|
Jlnjib: "fvxlz81",
|
|
Bo7webf: "f16twlsn",
|
|
D126e9: "fsglouz"
|
|
},
|
|
secondary: {},
|
|
subtle: {
|
|
J657lq: "f1um431h",
|
|
Jlnjib: "fte7hqw",
|
|
Bo7webf: "frw79jk",
|
|
m3fafd: "f13lnigs",
|
|
pus4l6: "f1ba77l5"
|
|
},
|
|
transparent: {
|
|
J657lq: "f1um431h",
|
|
Jlnjib: "f1wn9xqz",
|
|
Bo7webf: "f1juxwb4"
|
|
},
|
|
small: {
|
|
Byoj8tv: 0,
|
|
uwmqm3: 0,
|
|
z189sj: 0,
|
|
z8tnut: 0,
|
|
B0ocmuz: "f1ge6w2w",
|
|
Be2twd7: "fkhj508",
|
|
Bg96gwp: "f1i3iumi"
|
|
},
|
|
medium: {
|
|
Byoj8tv: 0,
|
|
uwmqm3: 0,
|
|
z189sj: 0,
|
|
z8tnut: 0,
|
|
B0ocmuz: "fnnf4v2",
|
|
Be2twd7: "fkhj508",
|
|
Bg96gwp: "f1i3iumi"
|
|
},
|
|
large: {
|
|
Byoj8tv: 0,
|
|
uwmqm3: 0,
|
|
z189sj: 0,
|
|
z8tnut: 0,
|
|
B0ocmuz: "f14s4sho",
|
|
Be2twd7: "fod5ikn",
|
|
Bg96gwp: "faaz57k"
|
|
},
|
|
disabled: {
|
|
J657lq: "f1rlv8bf",
|
|
Jlnjib: "fd1dbtm",
|
|
Bo7webf: "f1x3eb98"
|
|
},
|
|
disabledHighContrast: {
|
|
D126e9: "fbqh1p7",
|
|
m3fafd: "fu2tbix",
|
|
pus4l6: "f1g2tosm"
|
|
}
|
|
}, {
|
|
d: [
|
|
".f11ysow2{height:auto;}",
|
|
".f1um431h .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForeground2);}",
|
|
".foe7gw6 .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForegroundOnBrand);}",
|
|
[
|
|
".f1ge6w2w{padding:var(--spacingHorizontalS) var(--spacingHorizontalS) var(--spacingHorizontalMNudge) var(--spacingHorizontalS);}",
|
|
{
|
|
p: -1
|
|
}
|
|
],
|
|
".fkhj508{font-size:var(--fontSizeBase300);}",
|
|
".f1i3iumi{line-height:var(--lineHeightBase300);}",
|
|
[
|
|
".fnnf4v2{padding:14px var(--spacingHorizontalM) var(--spacingHorizontalL) var(--spacingHorizontalM);}",
|
|
{
|
|
p: -1
|
|
}
|
|
],
|
|
[
|
|
".f14s4sho{padding:18px var(--spacingHorizontalL) var(--spacingHorizontalXL) var(--spacingHorizontalL);}",
|
|
{
|
|
p: -1
|
|
}
|
|
],
|
|
".fod5ikn{font-size:var(--fontSizeBase400);}",
|
|
".faaz57k{line-height:var(--lineHeightBase400);}",
|
|
".f1rlv8bf .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForegroundDisabled);}"
|
|
],
|
|
h: [
|
|
".fte7hqw:hover .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForeground2Hover);}",
|
|
".frw79jk:hover:active .fui-CompoundButton__secondaryContent,.frw79jk:active:focus-visible .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForeground2Pressed);}",
|
|
".fvxlz81:hover .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForegroundOnBrand);}",
|
|
".f16twlsn:hover:active .fui-CompoundButton__secondaryContent,.f16twlsn:active:focus-visible .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForegroundOnBrand);}",
|
|
".f1wn9xqz:hover .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForeground2BrandHover);}",
|
|
".f1juxwb4:hover:active .fui-CompoundButton__secondaryContent,.f1juxwb4:active:focus-visible .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForeground2BrandPressed);}",
|
|
".fd1dbtm:hover .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForegroundDisabled);}",
|
|
".f1x3eb98:hover:active .fui-CompoundButton__secondaryContent,.f1x3eb98:active:focus-visible .fui-CompoundButton__secondaryContent{color:var(--colorNeutralForegroundDisabled);}"
|
|
],
|
|
m: [
|
|
[
|
|
"@media (forced-colors: active){.ffcivv0:hover .fui-CompoundButton__secondaryContent{color:Highlight;}}",
|
|
{
|
|
m: "(forced-colors: active)"
|
|
}
|
|
],
|
|
[
|
|
"@media (forced-colors: active){.f1wchxtt:hover:active .fui-CompoundButton__secondaryContent,.f1wchxtt:active:focus-visible .fui-CompoundButton__secondaryContent{color:Highlight;}}",
|
|
{
|
|
m: "(forced-colors: active)"
|
|
}
|
|
],
|
|
[
|
|
"@media (forced-colors: active){.fsglouz .fui-CompoundButton__secondaryContent{color:HighlightText;}}",
|
|
{
|
|
m: "(forced-colors: active)"
|
|
}
|
|
],
|
|
[
|
|
"@media (forced-colors: active){.f13lnigs:hover .fui-CompoundButton__secondaryContent{color:Canvas;}}",
|
|
{
|
|
m: "(forced-colors: active)"
|
|
}
|
|
],
|
|
[
|
|
"@media (forced-colors: active){.f1ba77l5:hover:active .fui-CompoundButton__secondaryContent,.f1ba77l5:active:focus-visible .fui-CompoundButton__secondaryContent{color:Canvas;}}",
|
|
{
|
|
m: "(forced-colors: active)"
|
|
}
|
|
],
|
|
[
|
|
"@media (forced-colors: active){.fbqh1p7 .fui-CompoundButton__secondaryContent{color:GrayText;}}",
|
|
{
|
|
m: "(forced-colors: active)"
|
|
}
|
|
],
|
|
[
|
|
"@media (forced-colors: active){.fu2tbix:hover .fui-CompoundButton__secondaryContent{color:GrayText;}}",
|
|
{
|
|
m: "(forced-colors: active)"
|
|
}
|
|
],
|
|
[
|
|
"@media (forced-colors: active){.f1g2tosm:hover:active .fui-CompoundButton__secondaryContent,.f1g2tosm:active:focus-visible .fui-CompoundButton__secondaryContent{color:GrayText;}}",
|
|
{
|
|
m: "(forced-colors: active)"
|
|
}
|
|
]
|
|
]
|
|
});
|
|
const useRootIconOnlyStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
small: {
|
|
Byoj8tv: 0,
|
|
uwmqm3: 0,
|
|
z189sj: 0,
|
|
z8tnut: 0,
|
|
B0ocmuz: "f1t35pdg",
|
|
B2u0y6b: "ft5vyj6",
|
|
Bf4jedk: "f17suaiq"
|
|
},
|
|
medium: {
|
|
Byoj8tv: 0,
|
|
uwmqm3: 0,
|
|
z189sj: 0,
|
|
z8tnut: 0,
|
|
B0ocmuz: "f1r1wyb6",
|
|
B2u0y6b: "fdczgix",
|
|
Bf4jedk: "fjdcg9m"
|
|
},
|
|
large: {
|
|
Byoj8tv: 0,
|
|
uwmqm3: 0,
|
|
z189sj: 0,
|
|
z8tnut: 0,
|
|
B0ocmuz: "f1bnz8pu",
|
|
B2u0y6b: "fww51uw",
|
|
Bf4jedk: "f1qhsl2h"
|
|
}
|
|
}, {
|
|
d: [
|
|
[
|
|
".f1t35pdg{padding:var(--spacingHorizontalXS);}",
|
|
{
|
|
p: -1
|
|
}
|
|
],
|
|
".ft5vyj6{max-width:48px;}",
|
|
".f17suaiq{min-width:48px;}",
|
|
[
|
|
".f1r1wyb6{padding:var(--spacingHorizontalSNudge);}",
|
|
{
|
|
p: -1
|
|
}
|
|
],
|
|
".fdczgix{max-width:52px;}",
|
|
".fjdcg9m{min-width:52px;}",
|
|
[
|
|
".f1bnz8pu{padding:var(--spacingHorizontalS);}",
|
|
{
|
|
p: -1
|
|
}
|
|
],
|
|
".fww51uw{max-width:56px;}",
|
|
".f1qhsl2h{min-width:56px;}"
|
|
]
|
|
});
|
|
const useIconStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
base: {
|
|
Be2twd7: "fndrnj9",
|
|
Bqenvij: "fbhnoac",
|
|
a9b677: "feqmc2u"
|
|
},
|
|
before: {
|
|
t21cq0: [
|
|
"fkujibs",
|
|
"f199hnxi"
|
|
]
|
|
},
|
|
after: {
|
|
Frg6f3: [
|
|
"f199hnxi",
|
|
"fkujibs"
|
|
]
|
|
}
|
|
}, {
|
|
d: [
|
|
".fndrnj9{font-size:40px;}",
|
|
".fbhnoac{height:40px;}",
|
|
".feqmc2u{width:40px;}",
|
|
".fkujibs{margin-right:var(--spacingHorizontalM);}",
|
|
".f199hnxi{margin-left:var(--spacingHorizontalM);}"
|
|
]
|
|
});
|
|
const useContentContainerStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
base: {
|
|
mc9l5x: "f22iagw",
|
|
Beiy3e4: "f1vx9l62",
|
|
fsow6f: [
|
|
"f1o700av",
|
|
"fes3tcz"
|
|
]
|
|
}
|
|
}, {
|
|
d: [
|
|
".f22iagw{display:flex;}",
|
|
".f1vx9l62{flex-direction:column;}",
|
|
".f1o700av{text-align:left;}",
|
|
".fes3tcz{text-align:right;}"
|
|
]
|
|
});
|
|
const useSecondaryContentStyles = /*#__PURE__*/ (0, _react.__styles)({
|
|
base: {
|
|
Bg96gwp: "flkuc6h",
|
|
Bhrd7zp: "figsok6"
|
|
},
|
|
small: {
|
|
Be2twd7: "fy9rknc"
|
|
},
|
|
medium: {
|
|
Be2twd7: "fy9rknc"
|
|
},
|
|
large: {
|
|
Be2twd7: "fkhj508"
|
|
}
|
|
}, {
|
|
d: [
|
|
".flkuc6h{line-height:100%;}",
|
|
".figsok6{font-weight:var(--fontWeightRegular);}",
|
|
".fy9rknc{font-size:var(--fontSizeBase200);}",
|
|
".fkhj508{font-size:var(--fontSizeBase300);}"
|
|
]
|
|
});
|
|
const useCompoundButtonStyles_unstable = (state)=>{
|
|
'use no memo';
|
|
const rootStyles = useRootStyles();
|
|
const rootIconOnlyStyles = useRootIconOnlyStyles();
|
|
const iconStyles = useIconStyles();
|
|
const contentContainerStyles = useContentContainerStyles();
|
|
const secondaryContentStyles = useSecondaryContentStyles();
|
|
const { appearance, disabled, disabledFocusable, iconOnly, iconPosition, size } = state;
|
|
state.root.className = (0, _react.mergeClasses)(compoundButtonClassNames.root, // Root styles
|
|
rootStyles.base, rootStyles.highContrast, appearance && rootStyles[appearance], rootStyles[size], // Disabled styles
|
|
(disabled || disabledFocusable) && rootStyles.disabled, (disabled || disabledFocusable) && rootStyles.disabledHighContrast, // Icon-only styles
|
|
iconOnly && rootIconOnlyStyles[size], // User provided class name
|
|
state.root.className);
|
|
state.contentContainer.className = (0, _react.mergeClasses)(compoundButtonClassNames.contentContainer, contentContainerStyles.base, state.contentContainer.className);
|
|
if (state.icon) {
|
|
state.icon.className = (0, _react.mergeClasses)(compoundButtonClassNames.icon, iconStyles.base, state.root.children !== undefined && state.root.children !== null && iconStyles[iconPosition], state.icon.className);
|
|
}
|
|
if (state.secondaryContent) {
|
|
state.secondaryContent.className = (0, _react.mergeClasses)(compoundButtonClassNames.secondaryContent, secondaryContentStyles.base, secondaryContentStyles[size], state.secondaryContent.className);
|
|
}
|
|
(0, _useButtonStylesstyles.useButtonStyles_unstable)(state);
|
|
return state;
|
|
};
|