@czi-sds/components 22.16.1 → 22.16.2
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/dist/index.cjs.d.ts +11 -10
- package/dist/index.cjs.js +708 -623
- package/dist/index.esm.d.ts +11 -10
- package/dist/index.esm.js +708 -623
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +2 -2
package/dist/index.esm.js
CHANGED
|
@@ -1451,9 +1451,9 @@ function createFontFunction(config) {
|
|
|
1451
1451
|
var fontFamily = typography.fontFamily[styleType];
|
|
1452
1452
|
var additionalCss = config.additionalCss || "";
|
|
1453
1453
|
if (isNarrow) {
|
|
1454
|
-
return css(templateObject_1$
|
|
1454
|
+
return css(templateObject_1$1d || (templateObject_1$1d = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), additionalCss, themeToCss(narrowStyles[weight][fontSize], fontFamily));
|
|
1455
1455
|
}
|
|
1456
|
-
return css(templateObject_2$
|
|
1456
|
+
return css(templateObject_2$P || (templateObject_2$P = __makeTemplateObject(["\n ", "\n ", "\n\n ", " {\n ", "\n }\n "], ["\n ", "\n ", "\n\n ", " {\n ", "\n }\n "])), additionalCss, themeToCss(wideStyles[weight][fontSize], fontFamily), (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.down("md"), themeToCss(narrowStyles[weight][fontSize], fontFamily));
|
|
1457
1457
|
};
|
|
1458
1458
|
};
|
|
1459
1459
|
}
|
|
@@ -1557,41 +1557,41 @@ var fontLinkSemiboldXxs = fontLink("xxs", "semibold");
|
|
|
1557
1557
|
var fontLinkSemiboldXxxs = fontLink("xxxs", "semibold");
|
|
1558
1558
|
function themeToCss(fontTheme, fontFamily) {
|
|
1559
1559
|
if (fontFamily === void 0) { fontFamily = "inherit"; }
|
|
1560
|
-
return css(templateObject_3$
|
|
1560
|
+
return css(templateObject_3$F || (templateObject_3$F = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", "px;\n line-height: ", " !important;\n letter-spacing: ", ";\n font-weight: ", ";\n text-transform: ", ";\n ", "\n "], ["\n font-family: ", ";\n font-size: ", "px;\n line-height: ", " !important;\n letter-spacing: ", ";\n font-weight: ", ";\n text-transform: ", ";\n ", "\n "])), fontFamily, fontTheme.fontSize, fontTheme.lineHeight, fontTheme.letterSpacing, fontTheme.fontWeight, fontTheme.textTransform, fontTheme.textDecoration
|
|
1561
1561
|
? "text-decoration: ".concat(fontTheme.textDecoration, ";")
|
|
1562
1562
|
: "");
|
|
1563
1563
|
}
|
|
1564
|
-
var templateObject_1$
|
|
1564
|
+
var templateObject_1$1d, templateObject_2$P, templateObject_3$F;
|
|
1565
1565
|
|
|
1566
|
-
var StyledAccordionDetails$1 = styled$2(AccordionDetails$1)(templateObject_2$
|
|
1566
|
+
var StyledAccordionDetails$1 = styled$2(AccordionDetails$1)(templateObject_2$O || (templateObject_2$O = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
1567
1567
|
var spaces = getSpaces(props);
|
|
1568
|
-
return css(templateObject_1$
|
|
1568
|
+
return css(templateObject_1$1c || (templateObject_1$1c = __makeTemplateObject(["\n padding: ", "px ", "px ", "px;\n "], ["\n padding: ", "px ", "px ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
1569
1569
|
});
|
|
1570
|
-
var templateObject_1$
|
|
1570
|
+
var templateObject_1$1c, templateObject_2$O;
|
|
1571
1571
|
|
|
1572
1572
|
var AccordionDetails = function (props) {
|
|
1573
1573
|
var children = props.children, id = props.id, rest = __rest(props, ["children", "id"]);
|
|
1574
1574
|
return (jsx(StyledAccordionDetails$1, __assign({ id: id }, rest, { children: children })));
|
|
1575
1575
|
};
|
|
1576
1576
|
|
|
1577
|
-
var doNotForwardProps$
|
|
1577
|
+
var doNotForwardProps$K = ["chevronSize", "hasInvertedStyle"];
|
|
1578
1578
|
var StyledAccordionHeader = styled$2(AccordionSummary, {
|
|
1579
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
1580
|
-
})(templateObject_2$
|
|
1579
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$K.includes(prop); },
|
|
1580
|
+
})(templateObject_2$N || (templateObject_2$N = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodySemiboldL, function (props) {
|
|
1581
1581
|
var _a, _b;
|
|
1582
1582
|
var chevronSize = props.chevronSize;
|
|
1583
1583
|
var spaces = getSpaces(props);
|
|
1584
1584
|
var semanticColors = getSemanticColors(props);
|
|
1585
|
-
return css(templateObject_1$
|
|
1585
|
+
return css(templateObject_1$1b || (templateObject_1$1b = __makeTemplateObject(["\n padding: ", "px;\n align-items: flex-start;\n box-sizing: border-box;\n\n .", " {\n margin: 0;\n flex-direction: column;\n padding-right: ", "px;\n\n &.", " {\n margin: 0;\n }\n }\n\n & .", " {\n margin-top: ", "px !important;\n\n svg {\n color: ", ";\n }\n }\n\n &:hover {\n & .", " {\n svg {\n color: ", ";\n }\n }\n }\n "], ["\n padding: ", "px;\n align-items: flex-start;\n box-sizing: border-box;\n\n .", " {\n margin: 0;\n flex-direction: column;\n padding-right: ", "px;\n\n &.", " {\n margin: 0;\n }\n }\n\n & .", " {\n margin-top: ", "px !important;\n\n svg {\n color: ", ";\n }\n }\n\n &:hover {\n & .", " {\n svg {\n color: ", ";\n }\n }\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m, accordionSummaryClasses.content, spaces === null || spaces === void 0 ? void 0 : spaces.s, accordionSummaryClasses.expanded, accordionSummaryClasses.expandIconWrapper, chevronSize === "xs"
|
|
1586
1586
|
? spaces === null || spaces === void 0 ? void 0 : spaces.xs
|
|
1587
1587
|
: spaces === null || spaces === void 0 ? void 0 : spaces.xxs, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentSecondary, accordionSummaryClasses.expandIconWrapper, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondaryHover);
|
|
1588
1588
|
});
|
|
1589
|
-
var StyledSubtitle$1 = styled$2("p")(templateObject_4$
|
|
1589
|
+
var StyledSubtitle$1 = styled$2("p")(templateObject_4$B || (templateObject_4$B = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
1590
1590
|
var _a;
|
|
1591
1591
|
var semanticColors = getSemanticColors(props);
|
|
1592
|
-
return css(templateObject_3$
|
|
1592
|
+
return css(templateObject_3$E || (templateObject_3$E = __makeTemplateObject(["\n color: ", ";\n margin: 0;\n "], ["\n color: ", ";\n margin: 0;\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary);
|
|
1593
1593
|
});
|
|
1594
|
-
var templateObject_1$
|
|
1594
|
+
var templateObject_1$1b, templateObject_2$N, templateObject_3$E, templateObject_4$B;
|
|
1595
1595
|
|
|
1596
1596
|
var _path$2h, _path2$G, _path3$7;
|
|
1597
1597
|
function _extends$2n() { return _extends$2n = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$2n.apply(null, arguments); }
|
|
@@ -4487,22 +4487,22 @@ var iconMap = {
|
|
|
4487
4487
|
},
|
|
4488
4488
|
};
|
|
4489
4489
|
|
|
4490
|
-
var doNotForwardProps$
|
|
4490
|
+
var doNotForwardProps$J = ["sdsIcon", "sdsSize", "iconColor"];
|
|
4491
4491
|
/**
|
|
4492
4492
|
* @see https://mui.com/material-ui/icons/#svgicon
|
|
4493
4493
|
*/
|
|
4494
4494
|
var StyledSvgIcon = styled$2(SvgIcon, {
|
|
4495
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4496
|
-
})(templateObject_2$
|
|
4495
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$J.includes(prop); },
|
|
4496
|
+
})(templateObject_2$M || (templateObject_2$M = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4497
4497
|
var _a, _b, _c;
|
|
4498
4498
|
var mode = getMode(props);
|
|
4499
4499
|
var _d = props.iconColor, iconColor = _d === void 0 ? "indigo" : _d, _e = props.shade, shade = _e === void 0 ? mode === "dark" ? 600 : 500 : _e, sdsSize = props.sdsSize;
|
|
4500
4500
|
var iconSizes = getIconSizes(props);
|
|
4501
4501
|
var colors = getColors(props);
|
|
4502
|
-
return css(templateObject_1$
|
|
4502
|
+
return css(templateObject_1$1a || (templateObject_1$1a = __makeTemplateObject(["\n color: ", ";\n height: ", "px;\n width: ", "px;\n "], ["\n color: ", ";\n height: ", "px;\n width: ", "px;\n "])), (_a = colors === null || colors === void 0 ? void 0 : colors[iconColor]) === null || _a === void 0 ? void 0 : _a[shade], (_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes[sdsSize]) === null || _b === void 0 ? void 0 : _b.height, (_c = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes[sdsSize]) === null || _c === void 0 ? void 0 : _c.width);
|
|
4503
4503
|
});
|
|
4504
|
-
var StyledIcon$2 = styled$2("div")(templateObject_3$
|
|
4505
|
-
var templateObject_1$
|
|
4504
|
+
var StyledIcon$2 = styled$2("div")(templateObject_3$D || (templateObject_3$D = __makeTemplateObject(["\n /* display: contents causes an element's children to appear as if they were direct children of the element's parent, ignoring the element itself. This can be useful when a wrapper element should be ignored when using CSS grid or similar layout techniques. */\n display: contents;\n"], ["\n /* display: contents causes an element's children to appear as if they were direct children of the element's parent, ignoring the element itself. This can be useful when a wrapper element should be ignored when using CSS grid or similar layout techniques. */\n display: contents;\n"])));
|
|
4505
|
+
var templateObject_1$1a, templateObject_2$M, templateObject_3$D;
|
|
4506
4506
|
|
|
4507
4507
|
/**
|
|
4508
4508
|
* @see https://mui.com/material-ui/icons/#icons
|
|
@@ -4533,21 +4533,21 @@ var StyledAccordion$1 = styled$2(Accordion$1, {
|
|
|
4533
4533
|
shouldForwardProp: function (prop) {
|
|
4534
4534
|
return !sdsPropNames$2.includes(prop.toString());
|
|
4535
4535
|
},
|
|
4536
|
-
})(templateObject_2$
|
|
4536
|
+
})(templateObject_2$L || (templateObject_2$L = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4537
4537
|
var _a;
|
|
4538
4538
|
var useDivider = props.useDivider, togglePosition = props.togglePosition;
|
|
4539
4539
|
var shadows = getShadows(props);
|
|
4540
4540
|
var borders = getBorders(props);
|
|
4541
4541
|
var spaces = getSpaces(props);
|
|
4542
|
-
return css(templateObject_1$
|
|
4542
|
+
return css(templateObject_1$19 || (templateObject_1$19 = __makeTemplateObject(["\n &.", " {\n background-color: transparent;\n background-image: none;\n box-shadow: ", ";\n border-bottom: ", ";\n height: fit-content;\n padding: ", "px;\n\n & .", " {\n ", "\n ", "\n padding: 0;\n min-height: unset;\n\n &.", " {\n background-color: unset;\n }\n\n &.", " {\n min-height: unset;\n }\n\n & .MuiAccordionSummary-expandIcon,\n & .", " {\n padding: 0;\n align-self: flex-start;\n }\n }\n\n .", " {\n ", "\n padding: ", "px 0 0 0;\n }\n\n &:before {\n opacity: 0;\n }\n\n &.", " {\n margin: 0;\n }\n\n ", "\n }\n "], ["\n &.", " {\n background-color: transparent;\n background-image: none;\n box-shadow: ", ";\n border-bottom: ", ";\n height: fit-content;\n padding: ", "px;\n\n & .", " {\n ", "\n ", "\n padding: 0;\n min-height: unset;\n\n &.", " {\n background-color: unset;\n }\n\n &.", " {\n min-height: unset;\n }\n\n & .MuiAccordionSummary-expandIcon,\n & .", " {\n padding: 0;\n align-self: flex-start;\n }\n }\n\n .", " {\n ", "\n padding: ", "px 0 0 0;\n }\n\n &:before {\n opacity: 0;\n }\n\n &.", " {\n margin: 0;\n }\n\n ", "\n }\n "])), accordionClasses.root, shadows === null || shadows === void 0 ? void 0 : shadows.none, useDivider ? (_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.divider : "none", spaces === null || spaces === void 0 ? void 0 : spaces.s, accordionSummaryClasses.root, fontBodyMediumS(props), focusVisibleA11yStyle(props), accordionSummaryClasses.focusVisible, accordionSummaryClasses.expanded, accordionSummaryClasses.expandIconWrapper, accordionDetailsClasses.root, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.l, accordionClasses.expanded, togglePosition === "left" && leftPosition(props));
|
|
4543
4543
|
});
|
|
4544
4544
|
var leftPosition = function (props) {
|
|
4545
4545
|
var _a, _b;
|
|
4546
4546
|
var spaces = getSpaces(props);
|
|
4547
4547
|
var iconSizes = getIconSizes(props);
|
|
4548
|
-
return css(templateObject_3$
|
|
4548
|
+
return css(templateObject_3$C || (templateObject_3$C = __makeTemplateObject(["\n &.", " {\n & .", " {\n flex-direction: row-reverse;\n padding: 0;\n\n .", " {\n padding-left: ", "px;\n }\n\n .", " {\n margin: 0;\n transform: rotate(-90deg);\n align-self: flex-start;\n\n &.", " {\n transform: rotate(0deg);\n }\n }\n }\n\n /** This is to adjust the padding of the AccordionDetails when the togglePosition is left\n * The padding-left is the sum of the\n * left padding of the AccordionButton = spaces?.s\n * the width of the expandIcon = iconSizes?.xs.width\n * and the left padding of the AccordionSummary = spaces?.s \n */\n & .", " {\n padding-left: ", "px;\n }\n }\n "], ["\n &.", " {\n & .", " {\n flex-direction: row-reverse;\n padding: 0;\n\n .", " {\n padding-left: ", "px;\n }\n\n .", " {\n margin: 0;\n transform: rotate(-90deg);\n align-self: flex-start;\n\n &.", " {\n transform: rotate(0deg);\n }\n }\n }\n\n /** This is to adjust the padding of the AccordionDetails when the togglePosition is left\n * The padding-left is the sum of the\n * left padding of the AccordionButton = spaces?.s\n * the width of the expandIcon = iconSizes?.xs.width\n * and the left padding of the AccordionSummary = spaces?.s \n */\n & .", " {\n padding-left: ", "px;\n }\n }\n "])), accordionClasses.root, accordionSummaryClasses.root, accordionSummaryClasses.content, spaces === null || spaces === void 0 ? void 0 : spaces.s, accordionSummaryClasses.expandIconWrapper, accordionSummaryClasses.expanded, accordionDetailsClasses.root, ((_a = spaces === null || spaces === void 0 ? void 0 : spaces.s) !== null && _a !== void 0 ? _a : 8) + ((_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width) !== null && _b !== void 0 ? _b : 12));
|
|
4549
4549
|
};
|
|
4550
|
-
var templateObject_1$
|
|
4550
|
+
var templateObject_1$19, templateObject_2$L, templateObject_3$C;
|
|
4551
4551
|
|
|
4552
4552
|
/**
|
|
4553
4553
|
* @see https://mui.com/material-ui/react-accordion/
|
|
@@ -4577,7 +4577,7 @@ var Accordion = React__default.forwardRef(function (props, ref) {
|
|
|
4577
4577
|
return (jsx(StyledAccordion$1, __assign({ square: true, useDivider: useDivider, togglePosition: togglePosition, ref: ref, expanded: expanded === id, onChange: handleChange(id) }, rest, { children: enhancedChildren })));
|
|
4578
4578
|
});
|
|
4579
4579
|
|
|
4580
|
-
var StyledAlert = styled$2(Alert$2)(templateObject_1$
|
|
4580
|
+
var StyledAlert = styled$2(Alert$2)(templateObject_1$18 || (templateObject_1$18 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4581
4581
|
var _a;
|
|
4582
4582
|
var colors = getColors(props);
|
|
4583
4583
|
var spaces = getSpaces(props);
|
|
@@ -4604,7 +4604,7 @@ function severityToColor(alertSeverity, colors) {
|
|
|
4604
4604
|
return colors === null || colors === void 0 ? void 0 : colors.green;
|
|
4605
4605
|
}
|
|
4606
4606
|
}
|
|
4607
|
-
var templateObject_1$
|
|
4607
|
+
var templateObject_1$18;
|
|
4608
4608
|
|
|
4609
4609
|
/**
|
|
4610
4610
|
* @see https://mui.com/material-ui/react-alert/
|
|
@@ -4751,7 +4751,7 @@ var showWarningIfFirstOccurence = function (warningType) {
|
|
|
4751
4751
|
SDS_WARNINGS[warningType].hasWarned = true;
|
|
4752
4752
|
};
|
|
4753
4753
|
|
|
4754
|
-
var doNotForwardProps$
|
|
4754
|
+
var doNotForwardProps$I = [
|
|
4755
4755
|
"isAllCaps",
|
|
4756
4756
|
"isRounded",
|
|
4757
4757
|
"sdsStyle",
|
|
@@ -4791,7 +4791,7 @@ var ButtonStyles = function (props) {
|
|
|
4791
4791
|
var boxshadow = variant === "outlined"
|
|
4792
4792
|
? "inset 0 0 0 1px ".concat((_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _h === void 0 ? void 0 : _h.border)
|
|
4793
4793
|
: "none";
|
|
4794
|
-
return css(templateObject_1$
|
|
4794
|
+
return css(templateObject_1$17 || (templateObject_1$17 = __makeTemplateObject(["\n ", "\n background-color: ", ";\n border: none;\n border-radius: ", "px;\n box-shadow: ", ";\n padding: ", ";\n color: ", ";\n line-height: ", ";\n white-space: nowrap;\n min-width: fit-content;\n\n svg {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n background-color: ", ";\n box-shadow: ", ";\n border: none;\n\n svg {\n color: ", ";\n }\n }\n\n .", ", .", " {\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n max-width: ", "px;\n max-height: ", "px;\n }\n }\n\n .", " {\n margin-right: ", "px;\n margin-left: 0;\n }\n\n .", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n "], ["\n ", "\n background-color: ", ";\n border: none;\n border-radius: ", "px;\n box-shadow: ", ";\n padding: ", ";\n color: ", ";\n line-height: ", ";\n white-space: nowrap;\n min-width: fit-content;\n\n svg {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n background-color: ", ";\n box-shadow: ", ";\n border: none;\n\n svg {\n color: ", ";\n }\n }\n\n .", ", .", " {\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n max-width: ", "px;\n max-height: ", "px;\n }\n }\n\n .", " {\n margin-right: ", "px;\n margin-left: 0;\n }\n\n .", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n "])), fontBodyMediumXs(props), backgroundColor, corners === null || corners === void 0 ? void 0 : corners.l, boxshadow, padding, contentColor, isAllCaps ? "20px" : "unset", ornamentColor, variant === "outlined"
|
|
4795
4795
|
? (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _j === void 0 ? void 0 : _j.textActionHover
|
|
4796
4796
|
: (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.textPrimaryInverse, variant === "outlined"
|
|
4797
4797
|
? (_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _l === void 0 ? void 0 : _l.surfaceSecondary
|
|
@@ -4807,7 +4807,7 @@ var ButtonStyles = function (props) {
|
|
|
4807
4807
|
};
|
|
4808
4808
|
var Rounded = function (props) {
|
|
4809
4809
|
var corners = getCorners(props);
|
|
4810
|
-
return css(templateObject_2$
|
|
4810
|
+
return css(templateObject_2$K || (templateObject_2$K = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.rounded);
|
|
4811
4811
|
};
|
|
4812
4812
|
var DestructiveButton = function (props) {
|
|
4813
4813
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
@@ -4826,13 +4826,13 @@ var DestructiveButton = function (props) {
|
|
|
4826
4826
|
var boxshadow = variant === "outlined"
|
|
4827
4827
|
? "inset 0 0 0 1px ".concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _f === void 0 ? void 0 : _f.border)
|
|
4828
4828
|
: "none";
|
|
4829
|
-
return css(templateObject_3$
|
|
4829
|
+
return css(templateObject_3$B || (templateObject_3$B = __makeTemplateObject(["\n border: none;\n box-shadow: ", ";\n color: ", ";\n background-color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: ", ";\n\n svg {\n color: ", ";\n }\n }\n "], ["\n border: none;\n box-shadow: ", ";\n color: ", ";\n background-color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: ", ";\n\n svg {\n color: ", ";\n }\n }\n "])), boxshadow, contentColor, backgroundColor, ornamentColor, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.textPrimaryInverse, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _h === void 0 ? void 0 : _h.fillHover, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _j === void 0 ? void 0 : _j.fillHover, (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.ornamentPrimaryInverse, (_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _l === void 0 ? void 0 : _l.textPrimaryInverse, (_m = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _m === void 0 ? void 0 : _m.fillPressed, (_o = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _o === void 0 ? void 0 : _o.fillPressed, (_p = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _p === void 0 ? void 0 : _p.ornamentPrimaryInverse, (_q = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _q === void 0 ? void 0 : _q.textDisabled, (_r = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _r === void 0 ? void 0 : _r.fillDisabled, shadows === null || shadows === void 0 ? void 0 : shadows.none, (_s = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _s === void 0 ? void 0 : _s.ornamentDisabled);
|
|
4830
4830
|
};
|
|
4831
4831
|
var StyledButton$3 = styled$2(Button$1, {
|
|
4832
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4833
|
-
})(templateObject_5$
|
|
4832
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$I.includes(prop); },
|
|
4833
|
+
})(templateObject_5$t || (templateObject_5$t = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4834
4834
|
var sdsStyle = props.sdsStyle, sdsType = props.sdsType, isAllCaps = props.isAllCaps;
|
|
4835
|
-
return css(templateObject_4$
|
|
4835
|
+
return css(templateObject_4$A || (templateObject_4$A = __makeTemplateObject(["\n ", "\n\n ", "\n ", "\n ", "\n "], ["\n ", "\n\n ", "\n ", "\n ", "\n "])), isAllCaps ? fontCapsXxs(props) : fontBodySemiboldXs(props), ButtonStyles(props), sdsStyle === "rounded" && Rounded(props), sdsType === "destructive" && DestructiveButton(props));
|
|
4836
4836
|
});
|
|
4837
4837
|
// Minimal Button Styles
|
|
4838
4838
|
var Minimal = function (props) {
|
|
@@ -4842,60 +4842,60 @@ var Minimal = function (props) {
|
|
|
4842
4842
|
var iconSizes = getIconSizes(props);
|
|
4843
4843
|
var semanticColors = getSemanticColors(props);
|
|
4844
4844
|
var corners = getCorners(props);
|
|
4845
|
-
return css(templateObject_6$
|
|
4845
|
+
return css(templateObject_6$p || (templateObject_6$p = __makeTemplateObject(["\n ", "\n ", "\n\n min-width: fit-content;\n padding: ", "px ", "px;\n border-radius: ", "px;\n\n &:hover,\n &:focus-visible {\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n .", ", .", " {\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n max-width: ", "px;\n max-height: ", "px;\n }\n }\n\n .", " {\n margin-right: ", "px;\n margin-left: 0;\n }\n\n .", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n "], ["\n ", "\n ", "\n\n min-width: fit-content;\n padding: ", "px ", "px;\n border-radius: ", "px;\n\n &:hover,\n &:focus-visible {\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n .", ", .", " {\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n max-width: ", "px;\n max-height: ", "px;\n }\n }\n\n .", " {\n margin-right: ", "px;\n margin-left: 0;\n }\n\n .", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n "])), focusVisibleA11yStyle(props), isAllCaps ? fontCapsXxs(props) : fontBodyMediumXs(props), isAllCaps ? spaces === null || spaces === void 0 ? void 0 : spaces.s : 7, spaces === null || spaces === void 0 ? void 0 : spaces.s, corners === null || corners === void 0 ? void 0 : corners.l, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.textActionHover, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.ornamentHover, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillHover, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.textActionPressed, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.fillHover, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _f === void 0 ? void 0 : _f.ornamentPressed, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.textDisabled, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentDisabled, buttonClasses.startIcon, buttonClasses.endIcon, (_j = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s) === null || _j === void 0 ? void 0 : _j.width, (_k = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s) === null || _k === void 0 ? void 0 : _k.width, (_l = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s) === null || _l === void 0 ? void 0 : _l.width, buttonClasses.startIcon, spaces === null || spaces === void 0 ? void 0 : spaces.xs, buttonClasses.endIcon, spaces === null || spaces === void 0 ? void 0 : spaces.xs);
|
|
4846
4846
|
};
|
|
4847
4847
|
var PrimaryMinimalButton = function (props) {
|
|
4848
4848
|
var _a, _b;
|
|
4849
4849
|
var semanticColors = getSemanticColors(props);
|
|
4850
|
-
return css(templateObject_7$
|
|
4850
|
+
return css(templateObject_7$k || (templateObject_7$k = __makeTemplateObject(["\n ", "\n color: ", ";\n\n svg {\n color: ", ";\n }\n "], ["\n ", "\n color: ", ";\n\n svg {\n color: ", ";\n }\n "])), Minimal(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.textAction, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.ornament);
|
|
4851
4851
|
};
|
|
4852
4852
|
var SecondaryMinimalButton = function (props) {
|
|
4853
4853
|
var _a, _b;
|
|
4854
4854
|
var semanticColors = getSemanticColors(props);
|
|
4855
|
-
return css(templateObject_8$
|
|
4855
|
+
return css(templateObject_8$i || (templateObject_8$i = __makeTemplateObject(["\n ", "\n color: ", ";\n\n svg {\n color: ", ";\n }\n "], ["\n ", "\n color: ", ";\n\n svg {\n color: ", ";\n }\n "])), Minimal(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimary);
|
|
4856
4856
|
};
|
|
4857
4857
|
var StyledMinimalButton = styled$2(Button$1, {
|
|
4858
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4859
|
-
})(templateObject_10$
|
|
4858
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$I.includes(prop); },
|
|
4859
|
+
})(templateObject_10$b || (templateObject_10$b = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4860
4860
|
var sdsType = props.sdsType;
|
|
4861
|
-
return css(templateObject_9$
|
|
4861
|
+
return css(templateObject_9$f || (templateObject_9$f = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), sdsType === "primary" && PrimaryMinimalButton(props), sdsType === "secondary" && SecondaryMinimalButton(props));
|
|
4862
4862
|
});
|
|
4863
4863
|
var StyledButtonLegacy = styled$2(Button$1, {
|
|
4864
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4865
|
-
})(templateObject_11$
|
|
4864
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$I.includes(prop); },
|
|
4865
|
+
})(templateObject_11$9 || (templateObject_11$9 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4866
4866
|
if (!props.isRounded)
|
|
4867
4867
|
return "";
|
|
4868
4868
|
var corners = getCorners(props);
|
|
4869
4869
|
var spaces = getSpaces(props);
|
|
4870
4870
|
return "\n border-radius: ".concat(corners === null || corners === void 0 ? void 0 : corners.rounded, "px;\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n ");
|
|
4871
4871
|
});
|
|
4872
|
-
var templateObject_1$
|
|
4872
|
+
var templateObject_1$17, templateObject_2$K, templateObject_3$B, templateObject_4$A, templateObject_5$t, templateObject_6$p, templateObject_7$k, templateObject_8$i, templateObject_9$f, templateObject_10$b, templateObject_11$9;
|
|
4873
4873
|
|
|
4874
4874
|
var isDisabled$1 = function (props) {
|
|
4875
4875
|
var _a, _b;
|
|
4876
4876
|
var semanticColors = getSemanticColors(props);
|
|
4877
|
-
return css(templateObject_1$
|
|
4877
|
+
return css(templateObject_1$16 || (templateObject_1$16 = __makeTemplateObject(["\n color: ", ";\n\n svg {\n color: ", ";\n }\n "], ["\n color: ", ";\n\n svg {\n color: ", ";\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentDisabled, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentDisabled);
|
|
4878
4878
|
};
|
|
4879
4879
|
var primary$2 = function (props) {
|
|
4880
4880
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4881
4881
|
var semanticColors = getSemanticColors(props);
|
|
4882
|
-
return css(templateObject_2$
|
|
4882
|
+
return css(templateObject_2$J || (templateObject_2$J = __makeTemplateObject(["\n color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n "], ["\n color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.ornament, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.ornament, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillHover, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.ornamentHover, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.ornamentHover, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.fillPressed, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _g === void 0 ? void 0 : _g.ornamentPressed, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _h === void 0 ? void 0 : _h.ornamentPressed);
|
|
4883
4883
|
};
|
|
4884
4884
|
var secondary$2 = function (props) {
|
|
4885
4885
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4886
4886
|
var semanticColors = getSemanticColors(props);
|
|
4887
|
-
return css(templateObject_3$
|
|
4887
|
+
return css(templateObject_3$A || (templateObject_3$A = __makeTemplateObject(["\n color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n "], ["\n color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentSecondary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondary, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillHover, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.ornamentHover, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.ornamentHover, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.fillPressed, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _g === void 0 ? void 0 : _g.ornamentPressed, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _h === void 0 ? void 0 : _h.ornamentPressed);
|
|
4888
4888
|
};
|
|
4889
4889
|
var tertiary = function (props) {
|
|
4890
4890
|
var _a, _b, _c, _d, _e, _f;
|
|
4891
4891
|
var semanticColors = getSemanticColors(props);
|
|
4892
|
-
return css(templateObject_4$
|
|
4892
|
+
return css(templateObject_4$z || (templateObject_4$z = __makeTemplateObject(["\n color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: none;\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n background: none;\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n "], ["\n color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: none;\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n background: none;\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentSecondary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondary, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.ornamentSecondaryHover, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentSecondaryHover, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.ornamentSecondaryPressed, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentSecondaryPressed);
|
|
4893
4893
|
};
|
|
4894
4894
|
var small$1 = function (props) {
|
|
4895
4895
|
var sdsType = props.sdsType;
|
|
4896
4896
|
var iconSizes = getIconSizes(props);
|
|
4897
4897
|
var spaces = getSpaces(props);
|
|
4898
|
-
return css(templateObject_5$
|
|
4898
|
+
return css(templateObject_5$s || (templateObject_5$s = __makeTemplateObject(["\n ", "\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "], ["\n ", "\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "])), sdsType !== "tertiary"
|
|
4899
4899
|
? "margin: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px 0;")
|
|
4900
4900
|
: "", iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, sdsType !== "tertiary" ? "margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;") : "");
|
|
4901
4901
|
};
|
|
@@ -4903,7 +4903,7 @@ var medium$1 = function (props) {
|
|
|
4903
4903
|
var sdsType = props.sdsType;
|
|
4904
4904
|
var iconSizes = getIconSizes(props);
|
|
4905
4905
|
var spaces = getSpaces(props);
|
|
4906
|
-
return css(templateObject_6$
|
|
4906
|
+
return css(templateObject_6$o || (templateObject_6$o = __makeTemplateObject(["\n ", "\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "], ["\n ", "\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "])), sdsType !== "tertiary"
|
|
4907
4907
|
? "margin: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px 0;")
|
|
4908
4908
|
: "", iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.width, sdsType !== "tertiary" ? "margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;") : "");
|
|
4909
4909
|
};
|
|
@@ -4911,11 +4911,11 @@ var large = function (props) {
|
|
|
4911
4911
|
var sdsType = props.sdsType;
|
|
4912
4912
|
var iconSizes = getIconSizes(props);
|
|
4913
4913
|
var spaces = getSpaces(props);
|
|
4914
|
-
return css(templateObject_7$
|
|
4914
|
+
return css(templateObject_7$j || (templateObject_7$j = __makeTemplateObject(["\n ", "\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "], ["\n ", "\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "])), sdsType !== "tertiary"
|
|
4915
4915
|
? "margin: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px 0;")
|
|
4916
4916
|
: "", iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xl.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xl.height, sdsType !== "tertiary" ? "margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;") : "");
|
|
4917
4917
|
};
|
|
4918
|
-
var doNotForwardProps$
|
|
4918
|
+
var doNotForwardProps$H = [
|
|
4919
4919
|
"on",
|
|
4920
4920
|
"sdsSize",
|
|
4921
4921
|
"sdsType",
|
|
@@ -4925,12 +4925,12 @@ var doNotForwardProps$G = [
|
|
|
4925
4925
|
"customTheme",
|
|
4926
4926
|
];
|
|
4927
4927
|
var StyledButtonIcon = styled$2(IconButton, {
|
|
4928
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4929
|
-
})(templateObject_9$
|
|
4928
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$H.includes(prop); },
|
|
4929
|
+
})(templateObject_9$e || (templateObject_9$e = __makeTemplateObject(["\n padding: 0;\n ", "\n\n ", "\n"], ["\n padding: 0;\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4930
4930
|
var disabled = props.disabled, _a = props.sdsSize, sdsSize = _a === void 0 ? "medium" : _a, _b = props.sdsType, sdsType = _b === void 0 ? "primary" : _b;
|
|
4931
|
-
return css(templateObject_8$
|
|
4931
|
+
return css(templateObject_8$h || (templateObject_8$h = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), sdsType === "primary" && primary$2(props), sdsType === "secondary" && secondary$2(props), sdsType === "tertiary" && tertiary(props), disabled && isDisabled$1(props), sdsSize === "small" && small$1(props), sdsSize === "medium" && medium$1(props), sdsSize === "large" && large(props));
|
|
4932
4932
|
});
|
|
4933
|
-
var templateObject_1$
|
|
4933
|
+
var templateObject_1$16, templateObject_2$J, templateObject_3$A, templateObject_4$z, templateObject_5$s, templateObject_6$o, templateObject_7$j, templateObject_8$h, templateObject_9$e;
|
|
4934
4934
|
|
|
4935
4935
|
var ButtonIconSizeToSdsIconSize = {
|
|
4936
4936
|
large: "xl",
|
|
@@ -5028,7 +5028,7 @@ var Button = React__default.forwardRef(function (props, ref) {
|
|
|
5028
5028
|
}
|
|
5029
5029
|
});
|
|
5030
5030
|
|
|
5031
|
-
var doNotForwardProps$
|
|
5031
|
+
var doNotForwardProps$G = [
|
|
5032
5032
|
"sdsStyle",
|
|
5033
5033
|
"intent",
|
|
5034
5034
|
"handleSubmit",
|
|
@@ -5039,40 +5039,40 @@ var rounded$3 = function (props) {
|
|
|
5039
5039
|
var _a;
|
|
5040
5040
|
var corners = getCorners(props);
|
|
5041
5041
|
var semanticColors = getSemanticColors(props);
|
|
5042
|
-
return css(templateObject_1$
|
|
5042
|
+
return css(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n .", " {\n border-radius: ", "px;\n\n .", " {\n border-radius: ", "px;\n border: 1px solid ", ";\n }\n }\n "], ["\n .", " {\n border-radius: ", "px;\n\n .", " {\n border-radius: ", "px;\n border: 1px solid ", ";\n }\n }\n "])), outlinedInputClasses.root, corners === null || corners === void 0 ? void 0 : corners.rounded, outlinedInputClasses.notchedOutline, corners === null || corners === void 0 ? void 0 : corners.rounded, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimary);
|
|
5043
5043
|
};
|
|
5044
5044
|
var applyIntentColor$2 = function (props, intent) {
|
|
5045
5045
|
var _a, _b, _c, _d;
|
|
5046
5046
|
var semanticColors = getSemanticColors(props);
|
|
5047
5047
|
var borders = getBorders(props);
|
|
5048
|
-
return css(templateObject_2$
|
|
5048
|
+
return css(templateObject_2$I || (templateObject_2$I = __makeTemplateObject(["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "], ["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "])), outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _a === void 0 ? void 0 : _a.default, outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _c === void 0 ? void 0 : _c.default, inputAdornmentClasses.root, buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentSecondaryPressed);
|
|
5049
5049
|
};
|
|
5050
5050
|
var disabledStyled$2 = function (props) {
|
|
5051
5051
|
var _a, _b, _c, _d, _e;
|
|
5052
5052
|
var semanticColors = getSemanticColors(props);
|
|
5053
|
-
return css(templateObject_3$
|
|
5053
|
+
return css(templateObject_3$z || (templateObject_3$z = __makeTemplateObject(["\n .", " {\n .", " {\n border: 1px solid ", " !important;\n }\n\n .", " svg {\n color: ", ";\n }\n\n &:hover {\n background-color: unset;\n\n .", " {\n border: 1px solid ", ";\n }\n\n .", " svg {\n color: ", " !important;\n }\n }\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n "], ["\n .", " {\n .", " {\n border: 1px solid ", " !important;\n }\n\n .", " svg {\n color: ", ";\n }\n\n &:hover {\n background-color: unset;\n\n .", " {\n border: 1px solid ", ";\n }\n\n .", " svg {\n color: ", " !important;\n }\n }\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n "])), outlinedInputClasses.disabled, outlinedInputClasses.notchedOutline, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryDisabled, inputAdornmentClasses.root, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentDisabled, outlinedInputClasses.notchedOutline, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderPrimaryDisabled, inputAdornmentClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentDisabled, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textDisabled);
|
|
5054
5054
|
};
|
|
5055
|
-
var StyledLabel$
|
|
5055
|
+
var StyledLabel$4 = styled$2("label")(templateObject_4$y || (templateObject_4$y = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyM$1, function (props) {
|
|
5056
5056
|
var spaces = getSpaces(props);
|
|
5057
5057
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n position: absolute;\n overflow: hidden;\n clip: rect(0 0 0 0);\n height: 1px;\n width: 1px;\n margin: -1px; \n padding: 0; \n border: 0;\n ");
|
|
5058
5058
|
});
|
|
5059
5059
|
var StyledSearchBase = styled$2(TextField, {
|
|
5060
5060
|
shouldForwardProp: function (prop) {
|
|
5061
|
-
return !doNotForwardProps$
|
|
5061
|
+
return !doNotForwardProps$G.includes(prop.toString());
|
|
5062
5062
|
},
|
|
5063
|
-
})(templateObject_6$
|
|
5063
|
+
})(templateObject_6$n || (templateObject_6$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5064
5064
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
5065
5065
|
var intent = props.intent, disabled = props.disabled, sdsStyle = props.sdsStyle;
|
|
5066
5066
|
var spaces = getSpaces(props);
|
|
5067
5067
|
var iconSizes = getIconSizes(props);
|
|
5068
5068
|
var semanticColors = getSemanticColors(props);
|
|
5069
5069
|
var corners = getCorners(props);
|
|
5070
|
-
return css(templateObject_5$
|
|
5070
|
+
return css(templateObject_5$r || (templateObject_5$r = __makeTemplateObject(["\n margin-top: ", "px;\n margin-bottom: ", "px;\n margin-right: ", "px;\n min-width: 120px;\n display: block;\n\n [type=\"search\"]::-webkit-search-cancel-button {\n -webkit-appearance: none;\n appearance: none;\n }\n\n & .input-search-clear-icon {\n cursor: pointer;\n\n svg {\n height: ", "px;\n width: ", "px;\n }\n }\n\n .", " {\n padding: 0 ", "px;\n border-radius: ", "px;\n width: 100%;\n\n .", " {\n padding-right: ", "px;\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n\n .MuiInputAdornment-positionEnd {\n position: absolute;\n right: ", "px;\n }\n\n .", " {\n border: 1px solid ", ";\n }\n\n &:hover .input-search-clear-icon,\n &:focus-within .input-search-clear-icon {\n svg {\n color: ", " !important;\n }\n\n &:hover {\n svg {\n color: ", " !important;\n }\n }\n\n &:active {\n svg {\n color: ", " !important;\n }\n }\n }\n }\n\n .", " {\n ", "\n padding: ", "px ", "px;\n height: unset;\n box-sizing: border-box;\n }\n\n .", ":hover {\n background-color: ", ";\n\n & .", ":last-of-type {\n svg {\n color: ", ";\n }\n }\n .", " {\n border: 1px solid ", ";\n }\n }\n\n .", ".", " {\n outline: none;\n\n .", " {\n border: 1px solid ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n\n &.user-is-tabbing .", ":focus-within {\n outline: 2px solid ", ";\n outline-offset: 1px;\n }\n\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n margin-top: ", "px;\n margin-bottom: ", "px;\n margin-right: ", "px;\n min-width: 120px;\n display: block;\n\n [type=\"search\"]::-webkit-search-cancel-button {\n -webkit-appearance: none;\n appearance: none;\n }\n\n & .input-search-clear-icon {\n cursor: pointer;\n\n svg {\n height: ", "px;\n width: ", "px;\n }\n }\n\n .", " {\n padding: 0 ", "px;\n border-radius: ", "px;\n width: 100%;\n\n .", " {\n padding-right: ", "px;\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n\n .MuiInputAdornment-positionEnd {\n position: absolute;\n right: ", "px;\n }\n\n .", " {\n border: 1px solid ", ";\n }\n\n &:hover .input-search-clear-icon,\n &:focus-within .input-search-clear-icon {\n svg {\n color: ", " !important;\n }\n\n &:hover {\n svg {\n color: ", " !important;\n }\n }\n\n &:active {\n svg {\n color: ", " !important;\n }\n }\n }\n }\n\n .", " {\n ", "\n padding: ", "px ", "px;\n height: unset;\n box-sizing: border-box;\n }\n\n .", ":hover {\n background-color: ", ";\n\n & .", ":last-of-type {\n svg {\n color: ", ";\n }\n }\n .", " {\n border: 1px solid ", ";\n }\n }\n\n .", ".", " {\n outline: none;\n\n .", " {\n border: 1px solid ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n\n &.user-is-tabbing .", ":focus-within {\n outline: 2px solid ", ";\n outline-offset: 1px;\n }\n\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.xl, (_a = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs) === null || _a === void 0 ? void 0 : _a.height, (_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs) === null || _b === void 0 ? void 0 : _b.width, outlinedInputClasses.root, spaces === null || spaces === void 0 ? void 0 : spaces.m, corners === null || corners === void 0 ? void 0 : corners.l, outlinedInputClasses.input, spaces === null || spaces === void 0 ? void 0 : spaces.l, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textTertiary, spaces === null || spaces === void 0 ? void 0 : spaces.m, outlinedInputClasses.notchedOutline, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.borderPrimary, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.ornamentSecondary, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentSecondaryHover, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _g === void 0 ? void 0 : _g.fillPressed, inputBaseClasses.inputSizeSmall, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.s, outlinedInputClasses.root, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.fillHover, buttonBaseClasses.root, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.ornamentSecondary, outlinedInputClasses.notchedOutline, (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.borderPrimaryHover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _l === void 0 ? void 0 : _l.border, inputAdornmentClasses.root, buttonBaseClasses.root, (_m = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _m === void 0 ? void 0 : _m.ornamentSecondaryPressed, outlinedInputClasses.root, (_o = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _o === void 0 ? void 0 : _o.borderPrimaryHover, sdsStyle === "rounded" && rounded$3(props), intent === "negative" && applyIntentColor$2(props, "negative"), intent === "notice" && applyIntentColor$2(props, "notice"), intent === "positive" && applyIntentColor$2(props, "positive"), disabled && disabledStyled$2(props));
|
|
5071
5071
|
});
|
|
5072
|
-
var StyledInputAdornment = styled$2(InputAdornment)(templateObject_7$
|
|
5073
|
-
var templateObject_1$
|
|
5072
|
+
var StyledInputAdornment = styled$2(InputAdornment)(templateObject_7$i || (templateObject_7$i = __makeTemplateObject(["\n position: relative;\n height: unset;\n margin: 0;\n"], ["\n position: relative;\n height: unset;\n margin: 0;\n"])));
|
|
5073
|
+
var templateObject_1$15, templateObject_2$I, templateObject_3$z, templateObject_4$y, templateObject_5$r, templateObject_6$n, templateObject_7$i;
|
|
5074
5074
|
|
|
5075
|
-
var StyledMenuItem$1 = styled$2(MenuItem$1)(templateObject_1$
|
|
5075
|
+
var StyledMenuItem$1 = styled$2(MenuItem$1)(templateObject_1$14 || (templateObject_1$14 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5076
5076
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
5077
5077
|
var selected = props.selected;
|
|
5078
5078
|
var spaces = getSpaces(props);
|
|
@@ -5080,7 +5080,7 @@ var StyledMenuItem$1 = styled$2(MenuItem$1)(templateObject_1$13 || (templateObje
|
|
|
5080
5080
|
var semanticColors = getSemanticColors(props);
|
|
5081
5081
|
return "\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px !important;\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.m, "px;\n min-height: unset;\n opacity: 1;\n\n &.MuiAutocomplete-option {\n min-height: unset;\n }\n\n &.MuiButtonBase-root {\n background-color: transparent;\n opacity: 1;\n\n &:hover, &.").concat(menuItemClasses.focusVisible, " {\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.fillHover, ";\n\n &[aria-selected=\"true\"] {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n }\n }\n }\n\n &.").concat(menuItemClasses.root, " .MuiSvgIcon-root {\n align-self: flex-start;\n }\n\n &.").concat(menuItemClasses.root, " .").concat(menuItemClasses.disabled, " {\n opacity: 1 !important;\n }\n\n &.MuiAutocomplete-option[aria-selected=\"true\"] {\n background-color: unset !important;\n\n &:hover {\n background-color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillHover, " !important;\n }\n\n ").concat(StyledIcon$1, ", ").concat(DotIcon, " {\n color: ").concat(selected ? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentPrimary : (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.ornamentSecondary, ";\n }\n }\n\n &.MuiAutocomplete-option[aria-disabled=\"true\"] {\n opacity: 1;\n }\n\n &:hover {\n background-color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.fillHover, ";\n ").concat(StyledIcon$1, ", ").concat(DotIcon, " {\n color: ").concat(selected ? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.ornamentPrimary : (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentSecondary, ";\n }\n }\n\n &.Mui-selected.MuiListItem-root.MuiListItem-button {\n background-color: ").concat((_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.surface, ";\n &:hover {\n background-color: ").concat((_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.fillHover, ";\n }\n }\n\n &:active {\n ").concat(StyledIcon$1, ", ").concat(DotIcon, " {\n color: ").concat((_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _l === void 0 ? void 0 : _l.ornamentPrimary, ";\n }\n\n &:active {\n ").concat(StyledIcon$1, ", ").concat(DotIcon, " {\n color: ").concat((_m = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _m === void 0 ? void 0 : _m.ornamentPrimary, ";\n }\n }\n }\n ");
|
|
5082
5082
|
});
|
|
5083
|
-
var ContentWrapper = styled$2("span")(templateObject_2$
|
|
5083
|
+
var ContentWrapper = styled$2("span")(templateObject_2$H || (templateObject_2$H = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n width: 100%;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n width: 100%;\n"])));
|
|
5084
5084
|
var disabledStyles$2 = function (props) {
|
|
5085
5085
|
var _a;
|
|
5086
5086
|
var disabled = props.disabled;
|
|
@@ -5089,12 +5089,12 @@ var disabledStyles$2 = function (props) {
|
|
|
5089
5089
|
var semanticColors = getSemanticColors(props);
|
|
5090
5090
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textDisabled, ";\n cursor: default;\n ");
|
|
5091
5091
|
};
|
|
5092
|
-
var TextWrapper = styled$2("span")(templateObject_3$
|
|
5092
|
+
var TextWrapper = styled$2("span")(templateObject_3$y || (templateObject_3$y = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5093
5093
|
var _a;
|
|
5094
5094
|
var semanticColors = getSemanticColors(props);
|
|
5095
5095
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n display: flex;\n white-space: pre-wrap;\n ");
|
|
5096
5096
|
}, disabledStyles$2);
|
|
5097
|
-
var StyledMenuItemIcon = styled$2("span")(templateObject_4$
|
|
5097
|
+
var StyledMenuItemIcon = styled$2("span")(templateObject_4$x || (templateObject_4$x = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5098
5098
|
var _a;
|
|
5099
5099
|
var disabled = props.disabled;
|
|
5100
5100
|
var spaces = getSpaces(props);
|
|
@@ -5102,18 +5102,18 @@ var StyledMenuItemIcon = styled$2("span")(templateObject_4$w || (templateObject_
|
|
|
5102
5102
|
var semanticColors = getSemanticColors(props);
|
|
5103
5103
|
return "\n margin-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n margin-top: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n\n .MuiSvgIcon-root {\n ").concat(disabled ? "color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentDisabled, ";") : null, ";\n }\n ");
|
|
5104
5104
|
});
|
|
5105
|
-
var ColumnWrapper = styled$2("span")(templateObject_5$
|
|
5105
|
+
var ColumnWrapper = styled$2("span")(templateObject_5$q || (templateObject_5$q = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5106
5106
|
var _a;
|
|
5107
5107
|
var semanticColors = getSemanticColors(props);
|
|
5108
5108
|
var spaces = getSpaces(props);
|
|
5109
5109
|
return "\n text-align: right;\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n ");
|
|
5110
5110
|
}, disabledStyles$2);
|
|
5111
|
-
var StyledIconWrapper$1 = styled$2("span")(templateObject_6$
|
|
5111
|
+
var StyledIconWrapper$1 = styled$2("span")(templateObject_6$m || (templateObject_6$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5112
5112
|
var spaces = getSpaces(props);
|
|
5113
5113
|
var iconSizes = getIconSizes(props);
|
|
5114
5114
|
return "\n display: flex;\n align-self: start;\n margin-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n margin-top: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n ");
|
|
5115
5115
|
});
|
|
5116
|
-
var StyledIcon$1 = styled$2(Icon)(templateObject_7$
|
|
5116
|
+
var StyledIcon$1 = styled$2(Icon)(templateObject_7$h || (templateObject_7$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5117
5117
|
var _a, _b;
|
|
5118
5118
|
var selected = props.selected, disabled = props.disabled;
|
|
5119
5119
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5122,7 +5122,7 @@ var StyledIcon$1 = styled$2(Icon)(templateObject_7$g || (templateObject_7$g = __
|
|
|
5122
5122
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimary;
|
|
5123
5123
|
return "\n color: ".concat(selected ? selectedColor : "transparent", ";\n ");
|
|
5124
5124
|
});
|
|
5125
|
-
var DotIcon = styled$2("svg")(templateObject_8$
|
|
5125
|
+
var DotIcon = styled$2("svg")(templateObject_8$g || (templateObject_8$g = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5126
5126
|
var _a, _b;
|
|
5127
5127
|
var selected = props.selected, disabled = props.disabled;
|
|
5128
5128
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5133,7 +5133,7 @@ var DotIcon = styled$2("svg")(templateObject_8$f || (templateObject_8$f = __make
|
|
|
5133
5133
|
});
|
|
5134
5134
|
styled$2(Remove, {
|
|
5135
5135
|
shouldForwardProp: function (prop) { return prop !== "selected"; },
|
|
5136
|
-
})(templateObject_9$
|
|
5136
|
+
})(templateObject_9$d || (templateObject_9$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5137
5137
|
var _a, _b;
|
|
5138
5138
|
var selected = props.selected, disabled = props.disabled;
|
|
5139
5139
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5143,7 +5143,7 @@ styled$2(Remove, {
|
|
|
5143
5143
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimary;
|
|
5144
5144
|
return "\n color: ".concat(selected ? selectedColor : "transparent", ";\n padding: 0;\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, "px;\n\n &.MuiCheckbox-colorPrimary.Mui-checked:hover {\n background-color: transparent;\n }\n ");
|
|
5145
5145
|
});
|
|
5146
|
-
var templateObject_1$
|
|
5146
|
+
var templateObject_1$14, templateObject_2$H, templateObject_3$y, templateObject_4$x, templateObject_5$q, templateObject_6$m, templateObject_7$h, templateObject_8$g, templateObject_9$d;
|
|
5147
5147
|
|
|
5148
5148
|
/**
|
|
5149
5149
|
* @see https://mui.com/material-ui/react-menu/
|
|
@@ -5300,7 +5300,7 @@ var InputSearch = forwardRef(function InputSearch(props, ref) {
|
|
|
5300
5300
|
console.error("Error: @czi-sds/components component InputText requires id and label props for accessibility.");
|
|
5301
5301
|
return jsx(Fragment, {});
|
|
5302
5302
|
}
|
|
5303
|
-
return (jsxs("div", { className: cn(rootClassName), children: [jsx(StyledLabel$
|
|
5303
|
+
return (jsxs("div", { className: cn(rootClassName), children: [jsx(StyledLabel$4, { htmlFor: id, className: cn(labelClassName), children: label }), jsx(StyledSearchBase, __assign({ id: id, ref: ref ? ref : inputRef, className: cn(inputClassName, className),
|
|
5304
5304
|
// passed to mui Input
|
|
5305
5305
|
InputProps: {
|
|
5306
5306
|
endAdornment: value ? (jsx(StyledInputAdornment, { position: "end", className: cn(endAdornmentClassName), children: jsx(Button, { "aria-label": "clear-button", className: cn("input-search-clear-icon", clearButtonClassName), onClick: clearInput, sdsType: "tertiary", sdsSize: "small", sdsStyle: "icon", disabled: disabled, icon: "XMarkCircle" }) })) : null,
|
|
@@ -5313,7 +5313,7 @@ var InputSearch = forwardRef(function InputSearch(props, ref) {
|
|
|
5313
5313
|
autoComplete: "one-time-code" }, rest))] }));
|
|
5314
5314
|
});
|
|
5315
5315
|
|
|
5316
|
-
var doNotForwardProps$
|
|
5316
|
+
var doNotForwardProps$F = [
|
|
5317
5317
|
"count",
|
|
5318
5318
|
"keepSearchOnSelect",
|
|
5319
5319
|
"search",
|
|
@@ -5323,8 +5323,8 @@ var doNotForwardProps$E = [
|
|
|
5323
5323
|
"hasGroupBy",
|
|
5324
5324
|
];
|
|
5325
5325
|
var StyledAutocompleteBase = styled$2(Autocomplete$1, {
|
|
5326
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5327
|
-
})(templateObject_1$
|
|
5326
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$F.includes(prop); },
|
|
5327
|
+
})(templateObject_1$13 || (templateObject_1$13 = __makeTemplateObject(["\n + .", "\n > .", "\n .", " {\n ", "\n }\n\n ", "\n"], ["\n + .", "\n > .", "\n .", " {\n ", "\n }\n\n ", "\n"])), autocompleteClasses.popper, autocompleteClasses.paper, autocompleteClasses.groupLabel, fontCapsXxxxs, function (props) {
|
|
5328
5328
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
5329
5329
|
var search = props.search, groupBy = props.groupBy;
|
|
5330
5330
|
var spaces = getSpaces(props);
|
|
@@ -5333,8 +5333,8 @@ var StyledAutocompleteBase = styled$2(Autocomplete$1, {
|
|
|
5333
5333
|
return "\n ".concat(!search && "height: 0; margin: 0 !important;", ";\n \n // (masoudmanson): We need to apply the focus styles to the input element\n // when the user is tabbing through the options. To find out more, take a\n // look at the useDetectUserTabbing hook.\n &[data-user-is-tabbing=\"true\"]:focus-within {\n border-radius: 4px;\n outline: 2px solid ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryHover, ";\n outline-offset: 1px;\n }\n\n .MuiFormControl-root {\n outline: none;\n }\n\n .MuiOutlinedInput-root.MuiInputBase-formControl.MuiInputBase-adornedEnd {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n\n .MuiAutocomplete-input {\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n }\n }\n\n & + .").concat(autocompleteClasses.popper, " > .").concat(autocompleteClasses.paper, " {\n .").concat(autocompleteClasses.listbox, " {\n max-height: 40vh;\n padding: 0 ").concat(groupBy ? 0 : spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n\n .").concat(autocompleteClasses.option, " {\n min-height: unset;\n\n &.").concat(autocompleteClasses.focused, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n }\n\n &[aria-selected=\"true\"] {\n background-color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.surface, ";\n }\n\n &[aria-disabled=\"true\"] {\n opacity: 1;\n }\n\n &[aria-selected=\"true\"].").concat(autocompleteClasses.focused, " {\n background-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.fillHover, ";\n }\n }\n\n & > li:last-child .").concat(autocompleteClasses.groupUl, " {\n border-bottom: none;\n margin-bottom: 0;\n padding-bottom: 0;\n }\n }\n\n .").concat(autocompleteClasses.groupLabel, " {\n top: 0;\n color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textSecondary, ";\n background-color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.surface, ";\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n }\n\n .").concat(autocompleteClasses.groupUl, " {\n position: relative;\n margin: 0 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n border-bottom: ").concat((_g = borders === null || borders === void 0 ? void 0 : borders.base) === null || _g === void 0 ? void 0 : _g.divider, ";\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n\n & li:last-of-type {\n position: relative;\n }\n }\n\n .").concat(autocompleteClasses.noOptions, " {\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n }\n\n .").concat(autocompleteClasses.loading, " {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n }\n }\n ");
|
|
5334
5334
|
});
|
|
5335
5335
|
var InputBaseWrapper$1 = styled$2("div", {
|
|
5336
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5337
|
-
})(templateObject_2$
|
|
5336
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$F.includes(prop); },
|
|
5337
|
+
})(templateObject_2$G || (templateObject_2$G = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5338
5338
|
var search = props.search;
|
|
5339
5339
|
if (!search) {
|
|
5340
5340
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -5344,12 +5344,12 @@ var InputBaseWrapper$1 = styled$2("div", {
|
|
|
5344
5344
|
}
|
|
5345
5345
|
});
|
|
5346
5346
|
var StyledMenuInputSearch$1 = styled$2(InputSearch, {
|
|
5347
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5348
|
-
})(templateObject_3$
|
|
5347
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$F.includes(prop); },
|
|
5348
|
+
})(templateObject_3$x || (templateObject_3$x = __makeTemplateObject(["\n margin: 0;\n .MuiInputBase-root {\n width: 100%;\n }\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n"], ["\n margin: 0;\n .MuiInputBase-root {\n width: 100%;\n }\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n"])), function (_a) {
|
|
5349
5349
|
var search = _a.search;
|
|
5350
5350
|
return (search ? "auto" : "transparent");
|
|
5351
5351
|
});
|
|
5352
|
-
var StyledPaper$3 = styled$2(Paper)(templateObject_4$
|
|
5352
|
+
var StyledPaper$3 = styled$2(Paper)(templateObject_4$w || (templateObject_4$w = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5353
5353
|
var _a, _b;
|
|
5354
5354
|
var corners = getCorners(props);
|
|
5355
5355
|
var shadows = getShadows(props);
|
|
@@ -5358,13 +5358,13 @@ var StyledPaper$3 = styled$2(Paper)(templateObject_4$v || (templateObject_4$v =
|
|
|
5358
5358
|
var semanticColors = getSemanticColors(props);
|
|
5359
5359
|
return "\n background-image: none;\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px 0;\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surface, ";\n border: ").concat(borders === null || borders === void 0 ? void 0 : borders.none, ";\n outline: 1px solid ").concat(addOpacityToHex(((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderSecondary) || "#000", 15), ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.l, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n box-sizing: border-box;\n ");
|
|
5360
5360
|
});
|
|
5361
|
-
var StyledMenuItemDetails = styled$2("div")(templateObject_5$
|
|
5361
|
+
var StyledMenuItemDetails = styled$2("div")(templateObject_5$p || (templateObject_5$p = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
5362
5362
|
var _a;
|
|
5363
5363
|
var semanticColors = getSemanticColors(props);
|
|
5364
5364
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n white-space: pre-wrap;\n ");
|
|
5365
5365
|
});
|
|
5366
|
-
var StyledMenuItemText = styled$2("div")(templateObject_6$
|
|
5367
|
-
var templateObject_1$
|
|
5366
|
+
var StyledMenuItemText = styled$2("div")(templateObject_6$l || (templateObject_6$l = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
5367
|
+
var templateObject_1$13, templateObject_2$G, templateObject_3$x, templateObject_4$w, templateObject_5$p, templateObject_6$l;
|
|
5368
5368
|
|
|
5369
5369
|
var AutocompleteBase = function (props) {
|
|
5370
5370
|
var multiple = props.multiple, _a = props.disableCloseOnSelect, disableCloseOnSelect = _a === void 0 ? multiple : _a, _b = props.getOptionLabel, getOptionLabel = _b === void 0 ? defaultGetOptionLabel : _b, _c = props.InputBaseProps, InputBaseProps = _c === void 0 ? EMPTY_OBJECT : _c, _d = props.isOptionEqualToValue, isOptionEqualToValue = _d === void 0 ? defaultIsOptionEqualToValue : _d, _e = props.keepSearchOnSelect, keepSearchOnSelect = _e === void 0 ? false : _e, _f = props.label, label = _f === void 0 ? "Label" : _f, _g = props.loading, loading = _g === void 0 ? false : _g, _h = props.loadingText, loadingText = _h === void 0 ? "" : _h, _j = props.noOptionsText, noOptionsText = _j === void 0 ? "No options" : _j, _k = props.onInputChange, onInputChange = _k === void 0 ? noop : _k, _l = props.renderOption, renderOption = _l === void 0 ? defaultRenderOption : _l, _m = props.renderTags, renderTags = _m === void 0 ? defaultRenderTags : _m, _o = props.search, search = _o === void 0 ? false : _o, _p = props.clearOnBlur, clearOnBlur = _p === void 0 ? false : _p, _q = props.blurOnSelect, blurOnSelect = _q === void 0 ? !multiple : _q, onClickAway = props.onClickAway, onClick = props.onClick, onOpen = props.onOpen, onClose = props.onClose, disabled = props.disabled, _r = props.intent, intent = _r === void 0 ? "default" : _r;
|
|
@@ -5525,17 +5525,17 @@ var AutocompleteBase = function (props) {
|
|
|
5525
5525
|
}
|
|
5526
5526
|
};
|
|
5527
5527
|
|
|
5528
|
-
var StyledColumn = styled$2("div")(templateObject_1$
|
|
5528
|
+
var StyledColumn = styled$2("div")(templateObject_1$12 || (templateObject_1$12 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5529
5529
|
var _a = props.width, width = _a === void 0 ? 280 : _a;
|
|
5530
5530
|
return "\n position: relative;\n width: ".concat(width, "px;\n ");
|
|
5531
5531
|
});
|
|
5532
|
-
var StyledColumnTitle = styled$2("p")(templateObject_2$
|
|
5532
|
+
var StyledColumnTitle = styled$2("p")(templateObject_2$F || (templateObject_2$F = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontCapsXxxxs, function (props) {
|
|
5533
5533
|
var _a;
|
|
5534
5534
|
var spaces = getSpaces(props);
|
|
5535
5535
|
var semanticColors = getSemanticColors(props);
|
|
5536
5536
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n margin: 0;\n ");
|
|
5537
5537
|
});
|
|
5538
|
-
var templateObject_1$
|
|
5538
|
+
var templateObject_1$12, templateObject_2$F;
|
|
5539
5539
|
|
|
5540
5540
|
var AutocompleteGroup = function (props) {
|
|
5541
5541
|
var autocompleteProps = props.autocompleteProps, onValueChange = props.onValueChange, propValue = props.value, multiple = props.multiple, label = props.label, InputBaseProps = props.InputBaseProps, popperOpen = props.popperOpen, inputValue = props.inputValue, PaperComponent = props.PaperComponent, rest = __rest(props, ["autocompleteProps", "onValueChange", "value", "multiple", "label", "InputBaseProps", "popperOpen", "inputValue", "PaperComponent"]);
|
|
@@ -5575,7 +5575,7 @@ var AutocompleteGroup = function (props) {
|
|
|
5575
5575
|
}
|
|
5576
5576
|
};
|
|
5577
5577
|
|
|
5578
|
-
var doNotForwardProps$
|
|
5578
|
+
var doNotForwardProps$E = [
|
|
5579
5579
|
"anchorEl",
|
|
5580
5580
|
"count",
|
|
5581
5581
|
"keepSearchOnSelect",
|
|
@@ -5588,9 +5588,9 @@ var doNotForwardProps$D = [
|
|
|
5588
5588
|
];
|
|
5589
5589
|
var StyledPopper$2 = styled$2(Popper, {
|
|
5590
5590
|
shouldForwardProp: function (prop) {
|
|
5591
|
-
return !doNotForwardProps$
|
|
5591
|
+
return !doNotForwardProps$E.includes(prop) || prop === "anchorEl";
|
|
5592
5592
|
},
|
|
5593
|
-
})(templateObject_1$
|
|
5593
|
+
})(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5594
5594
|
var _a;
|
|
5595
5595
|
var corners = getCorners(props);
|
|
5596
5596
|
var shadows = getShadows(props);
|
|
@@ -5600,39 +5600,39 @@ var StyledPopper$2 = styled$2(Popper, {
|
|
|
5600
5600
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surface, ";\n background-image: none;\n border: ").concat(borders === null || borders === void 0 ? void 0 : borders.none, ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.l, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n box-sizing: border-box;\n z-index: 1400;\n\n .").concat(autocompleteClasses.popper, ".").concat(autocompleteClasses.popperDisablePortal, " {\n position: relative !important;\n transform: none !important;\n \n .MuiPaper-root .").concat(autocompleteClasses.listbox, " {\n padding: 0;\n }\n }\n ");
|
|
5601
5601
|
});
|
|
5602
5602
|
var StyledPaper$2 = styled$2(Paper, {
|
|
5603
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5604
|
-
})(templateObject_2$
|
|
5603
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$E.includes(prop); },
|
|
5604
|
+
})(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5605
5605
|
var _a;
|
|
5606
5606
|
var shadows = getShadows(props);
|
|
5607
5607
|
var semanticColors = getSemanticColors(props);
|
|
5608
5608
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surface, ";\n background-image: none;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.none, ";\n margin: 0;\n border-radius: 0;\n padding-top: 0;\n padding-bottom: 0;\n ");
|
|
5609
5609
|
});
|
|
5610
|
-
var StyledAutocompleteGroupWrapper = styled$2("div")(templateObject_3$
|
|
5610
|
+
var StyledAutocompleteGroupWrapper = styled$2("div")(templateObject_3$w || (templateObject_3$w = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
5611
5611
|
var StyledAutocompleteInput = styled$2(InputSearch, {
|
|
5612
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5613
|
-
})(templateObject_4$
|
|
5612
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$E.includes(prop); },
|
|
5613
|
+
})(templateObject_4$v || (templateObject_4$v = __makeTemplateObject(["\n ", "\n\n margin: 0;\n .MuiInputBase-root {\n width: 100%;\n }\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n"], ["\n ", "\n\n margin: 0;\n .MuiInputBase-root {\n width: 100%;\n }\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n"])), function (_a) {
|
|
5614
5614
|
var search = _a.search;
|
|
5615
5615
|
return !search && "height: 0; display: none; margin: 0 !important;";
|
|
5616
5616
|
}, function (_a) {
|
|
5617
5617
|
var search = _a.search;
|
|
5618
5618
|
return (search ? "auto" : "transparent");
|
|
5619
5619
|
});
|
|
5620
|
-
var templateObject_1$
|
|
5620
|
+
var templateObject_1$11, templateObject_2$E, templateObject_3$w, templateObject_4$v;
|
|
5621
5621
|
|
|
5622
|
-
var StyledVerticalDivider = styled$3("div")(templateObject_1
|
|
5622
|
+
var StyledVerticalDivider = styled$3("div")(templateObject_1$10 || (templateObject_1$10 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5623
5623
|
var _a;
|
|
5624
5624
|
var spaces = getSpaces(props);
|
|
5625
5625
|
var semanticColors = getSemanticColors(props);
|
|
5626
5626
|
return "\n position: relative;\n width: 1px;\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.divider, ";\n margin: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
5627
5627
|
});
|
|
5628
|
-
var StyledColumnIcon = styled$3("span")(templateObject_2$
|
|
5628
|
+
var StyledColumnIcon = styled$3("span")(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5629
5629
|
var _a, _b;
|
|
5630
5630
|
var spaces = getSpaces(props);
|
|
5631
5631
|
var iconSizes = getIconSizes(props);
|
|
5632
5632
|
var semanticColors = getSemanticColors(props);
|
|
5633
5633
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surface, ";\n position: absolute;\n right: -").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n top: -").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n\n svg {\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentDisabled, ";\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width, "px;\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.height, "px;\n }\n ");
|
|
5634
5634
|
});
|
|
5635
|
-
var templateObject_1
|
|
5635
|
+
var templateObject_1$10, templateObject_2$D;
|
|
5636
5636
|
|
|
5637
5637
|
var VerticalDivider = function (_a) {
|
|
5638
5638
|
var icon = _a.icon;
|
|
@@ -5819,13 +5819,13 @@ var Autocomplete = function (props) {
|
|
|
5819
5819
|
}
|
|
5820
5820
|
};
|
|
5821
5821
|
|
|
5822
|
-
var Centered = styled$2("div")(templateObject_1
|
|
5822
|
+
var Centered = styled$2("div")(templateObject_1$$ || (templateObject_1$$ = __makeTemplateObject(["\n flex: 1 1 auto;\n display: flex;\n justify-content: center;\n align-items: center;\n"], ["\n flex: 1 1 auto;\n display: flex;\n justify-content: center;\n align-items: center;\n"])));
|
|
5823
5823
|
var doNotForwardPropsIconWrapper = ["bannerType", "intent"];
|
|
5824
5824
|
var IconWrapper$1 = styled$2("div", {
|
|
5825
5825
|
shouldForwardProp: function (prop) {
|
|
5826
5826
|
return !doNotForwardPropsIconWrapper.includes(prop);
|
|
5827
5827
|
},
|
|
5828
|
-
})(templateObject_2$
|
|
5828
|
+
})(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5829
5829
|
var _a, _b;
|
|
5830
5830
|
var bannerType = props.bannerType, _c = props.intent, intent = _c === void 0 ? "info" : _c;
|
|
5831
5831
|
var spaces = getSpaces(props);
|
|
@@ -5840,7 +5840,7 @@ var StyledButton$2 = styled$2(Button, {
|
|
|
5840
5840
|
shouldForwardProp: function (prop) {
|
|
5841
5841
|
return !doNotForwardPropsButtonIcon.includes(prop);
|
|
5842
5842
|
},
|
|
5843
|
-
})(templateObject_3$
|
|
5843
|
+
})(templateObject_3$v || (templateObject_3$v = __makeTemplateObject(["\n flex: 0 0 auto;\n\n ", "\n"], ["\n flex: 0 0 auto;\n\n ", "\n"])), function (props) {
|
|
5844
5844
|
var _a, _b;
|
|
5845
5845
|
var bannerType = props.bannerType;
|
|
5846
5846
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5848,7 +5848,7 @@ var StyledButton$2 = styled$2(Button, {
|
|
|
5848
5848
|
return "\n svg {\n fill: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentOnFill, ";\n opacity: .65;\n }\n\n svg:hover {\n opacity: 1;\n }\n ");
|
|
5849
5849
|
return "\n svg {\n fill: ".concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimary, ";\n opacity: .55;\n }\n\n svg:hover {\n opacity: 1;\n }\n ");
|
|
5850
5850
|
});
|
|
5851
|
-
styled$2("div")(templateObject_4$
|
|
5851
|
+
styled$2("div")(templateObject_4$u || (templateObject_4$u = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), fontBodyS$1);
|
|
5852
5852
|
var primary$1 = function (props) {
|
|
5853
5853
|
var _a, _b;
|
|
5854
5854
|
var _c = props.intent, intent = _c === void 0 ? "info" : _c;
|
|
@@ -5861,15 +5861,15 @@ var secondary$1 = function (props) {
|
|
|
5861
5861
|
var semanticColors = getSemanticColors(props);
|
|
5862
5862
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _a === void 0 ? void 0 : _a.surfaceSecondary, ";\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, ";\n ");
|
|
5863
5863
|
};
|
|
5864
|
-
var doNotForwardProps$
|
|
5864
|
+
var doNotForwardProps$D = ["sdsType", "textChild", "intent"];
|
|
5865
5865
|
var StyledBanner = styled$2("div", {
|
|
5866
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5867
|
-
})(templateObject_5$
|
|
5866
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$D.includes(prop); },
|
|
5867
|
+
})(templateObject_5$o || (templateObject_5$o = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
5868
5868
|
var sdsType = props.sdsType;
|
|
5869
5869
|
var spaces = getSpaces(props);
|
|
5870
5870
|
return "\n display: flex;\n align-items: center;\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n \n ").concat(sdsType === "primary" ? primary$1(props) : "", "\n ").concat(sdsType === "secondary" ? secondary$1(props) : "", "\n ");
|
|
5871
5871
|
});
|
|
5872
|
-
var templateObject_1
|
|
5872
|
+
var templateObject_1$$, templateObject_2$C, templateObject_3$v, templateObject_4$u, templateObject_5$o;
|
|
5873
5873
|
|
|
5874
5874
|
var Banner = forwardRef(function Banner(props, ref) {
|
|
5875
5875
|
var children = props.children, dismissed = props.dismissed, _a = props.dismissible, dismissible = _a === void 0 ? true : _a, onClose = props.onClose, sdsType = props.sdsType, icon = props.icon, sdsIconProps = props.sdsIconProps, _b = props.intent, intent = _b === void 0 ? "info" : _b, rest = __rest(props, ["children", "dismissed", "dismissible", "onClose", "sdsType", "icon", "sdsIconProps", "intent"]);
|
|
@@ -5941,16 +5941,16 @@ var ButtonDropdown = React__default.forwardRef(function (props, ref) {
|
|
|
5941
5941
|
* All other props should be passed down to ButtonIcon; otherwise,
|
|
5942
5942
|
* the component won’t function as expected.
|
|
5943
5943
|
*/
|
|
5944
|
-
var doNotForwardProps$
|
|
5944
|
+
var doNotForwardProps$C = ["sdsStage"];
|
|
5945
5945
|
var StyledButtonToggle = styled$2(ButtonIcon, {
|
|
5946
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5947
|
-
})(templateObject_1$
|
|
5946
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$C.includes(prop); },
|
|
5947
|
+
})(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5948
5948
|
var _a;
|
|
5949
5949
|
var sdsStage = props.sdsStage;
|
|
5950
5950
|
var semanticColors = getSemanticColors(props);
|
|
5951
5951
|
return "\n background-color: ".concat(sdsStage === "on" ? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.fillOpen : "transparent", ";\n ");
|
|
5952
5952
|
});
|
|
5953
|
-
var templateObject_1$
|
|
5953
|
+
var templateObject_1$_;
|
|
5954
5954
|
|
|
5955
5955
|
/**
|
|
5956
5956
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -5966,7 +5966,7 @@ var ButtonToggle = React__default.forwardRef(function (props, ref) {
|
|
|
5966
5966
|
}
|
|
5967
5967
|
});
|
|
5968
5968
|
|
|
5969
|
-
var doNotForwardProps$
|
|
5969
|
+
var doNotForwardProps$B = [
|
|
5970
5970
|
"calloutTitle",
|
|
5971
5971
|
"collapsed",
|
|
5972
5972
|
"severity",
|
|
@@ -5974,8 +5974,8 @@ var doNotForwardProps$A = [
|
|
|
5974
5974
|
"hideBody",
|
|
5975
5975
|
];
|
|
5976
5976
|
var StyledCallout = styled$2(Alert$2, {
|
|
5977
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5978
|
-
})(templateObject_1$
|
|
5977
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$B.includes(prop); },
|
|
5978
|
+
})(templateObject_1$Z || (templateObject_1$Z = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5979
5979
|
var _a, _b, _c, _d, _e;
|
|
5980
5980
|
var _f = props.intent, intent = _f === void 0 ? "info" : _f, sdsStyle = props.sdsStyle, hideBody = props.hideBody, collapsed = props.collapsed;
|
|
5981
5981
|
var spaces = getSpaces(props);
|
|
@@ -5986,12 +5986,12 @@ var StyledCallout = styled$2(Alert$2, {
|
|
|
5986
5986
|
var backgroundColor = (_d = (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _c === void 0 ? void 0 : _c.surfaceSecondary) !== null && _d !== void 0 ? _d : "white";
|
|
5987
5987
|
return "\n margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0;\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.xl, "px;\n color: ").concat((_e = palette === null || palette === void 0 ? void 0 : palette.text) === null || _e === void 0 ? void 0 : _e.primary, ";\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n background-color: ").concat(backgroundColor, ";\n align-items: ").concat((hideBody && sdsStyle === "expandable" && collapsed) || (hideBody && sdsStyle !== "expandable") ? "center" : "flex-start", ";\n\n .").concat(alertClasses.icon, " {\n margin-top: ").concat((hideBody && sdsStyle === "expandable" && collapsed) || (hideBody && sdsStyle !== "expandable") ? 0 : spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n padding: 0;\n\n path {\n fill: ").concat(iconColor, ";\n }\n }\n\n .").concat(alertClasses.message, " {\n width: 100%;\n padding: 0;\n margin: 0;\n\n .").concat(alertTitleClasses.root, " {\n margin: 0;\n }\n }\n\n .").concat(alertClasses.action, " {\n display: ").concat(sdsStyle === "persistent" ? "none" : "block", ";\n margin: 0 0 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n padding: 0;\n align-items: flex-start;\n\n > button {\n padding: 0;\n }\n }\n ");
|
|
5988
5988
|
});
|
|
5989
|
-
var templateObject_1$
|
|
5989
|
+
var templateObject_1$Z;
|
|
5990
5990
|
|
|
5991
5991
|
var CALLOUT_TITLE_DISPLAY_NAME = "CalloutTitle";
|
|
5992
5992
|
|
|
5993
|
-
var StyledCalloutTitle = styled$2(AlertTitle)(templateObject_1$
|
|
5994
|
-
var templateObject_1$
|
|
5993
|
+
var StyledCalloutTitle = styled$2(AlertTitle)(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n ", "\n margin: 0;\n"], ["\n ", "\n margin: 0;\n"])), fontBodySemiboldXs);
|
|
5994
|
+
var templateObject_1$Y;
|
|
5995
5995
|
|
|
5996
5996
|
var CalloutTitle = function (_a) {
|
|
5997
5997
|
var children = _a.children;
|
|
@@ -6000,24 +6000,24 @@ var CalloutTitle = function (_a) {
|
|
|
6000
6000
|
// Display name required to ensure Callout expand works correctly.
|
|
6001
6001
|
CalloutTitle.displayName = CALLOUT_TITLE_DISPLAY_NAME;
|
|
6002
6002
|
|
|
6003
|
-
var StyledCalloutBody = styled$2("div")(templateObject_1$
|
|
6003
|
+
var StyledCalloutBody = styled$2("div")(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
6004
6004
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a;
|
|
6005
6005
|
var spaces = getSpaces(props);
|
|
6006
6006
|
return "\n margin: ".concat(!hideTitle ? spaces === null || spaces === void 0 ? void 0 : spaces.xs : 0, "px 0 0 0;\n ");
|
|
6007
6007
|
});
|
|
6008
|
-
var templateObject_1$
|
|
6008
|
+
var templateObject_1$X;
|
|
6009
6009
|
|
|
6010
6010
|
var CalloutBody = function (_a) {
|
|
6011
6011
|
var children = _a.children, hideTitle = _a.hideTitle;
|
|
6012
6012
|
return (jsx(StyledCalloutBody, { hideTitle: hideTitle, children: children }));
|
|
6013
6013
|
};
|
|
6014
6014
|
|
|
6015
|
-
var StyledCalloutExtraContent = styled$2("div")(templateObject_1$
|
|
6015
|
+
var StyledCalloutExtraContent = styled$2("div")(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6016
6016
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a, _b = props.hideBody, hideBody = _b === void 0 ? false : _b;
|
|
6017
6017
|
var spaces = getSpaces(props);
|
|
6018
6018
|
return "\n margin: ".concat(hideTitle && hideBody ? 0 : spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0 0;\n ");
|
|
6019
6019
|
});
|
|
6020
|
-
var templateObject_1$
|
|
6020
|
+
var templateObject_1$W;
|
|
6021
6021
|
|
|
6022
6022
|
var CalloutExtraContent = function (_a) {
|
|
6023
6023
|
var children = _a.children, hideTitle = _a.hideTitle, hideBody = _a.hideBody;
|
|
@@ -6086,30 +6086,30 @@ var dark$1 = function (props) {
|
|
|
6086
6086
|
var _a, _b;
|
|
6087
6087
|
var spaces = getSpaces(props);
|
|
6088
6088
|
var semanticColors = getSemanticColors(props);
|
|
6089
|
-
return css$1(templateObject_1$
|
|
6089
|
+
return css$1(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n ", "\n background-color: ", ";\n color: ", ";\n padding: ", "px ", "px;\n "], ["\n ", "\n background-color: ", ";\n color: ", ";\n padding: ", "px ", "px;\n "])), fontHeaderXs(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfaceOnDark, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimaryOnDark, spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
6090
6090
|
};
|
|
6091
6091
|
var light$1 = function (props) {
|
|
6092
6092
|
var _a, _b;
|
|
6093
6093
|
var spaces = getSpaces(props);
|
|
6094
6094
|
var semanticColors = getSemanticColors(props);
|
|
6095
|
-
return css$1(templateObject_2$
|
|
6095
|
+
return css$1(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n ", "\n background-color: ", ";\n color: ", ";\n padding: ", "px ", "px;\n "], ["\n ", "\n background-color: ", ";\n color: ", ";\n padding: ", "px ", "px;\n "])), fontBodyXs$2(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surface, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
6096
6096
|
};
|
|
6097
6097
|
var tableStyles = function (props) {
|
|
6098
6098
|
var spaces = getSpaces(props);
|
|
6099
|
-
return css$1(templateObject_3$
|
|
6099
|
+
return css$1(templateObject_3$u || (templateObject_3$u = __makeTemplateObject(["\n padding: ", "px;\n "], ["\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
6100
6100
|
};
|
|
6101
|
-
var doNotForwardProps$
|
|
6101
|
+
var doNotForwardProps$A = ["hasInvertedStyle", "textAlign"];
|
|
6102
6102
|
var StyledTitle = styled$2("p", {
|
|
6103
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6104
|
-
})(templateObject_4$
|
|
6103
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$A.includes(prop); },
|
|
6104
|
+
})(templateObject_4$t || (templateObject_4$t = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyMediumXs, function (props) {
|
|
6105
6105
|
var _a, _b;
|
|
6106
6106
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
6107
6107
|
var semanticColors = getSemanticColors(props);
|
|
6108
6108
|
return "\n margin: 0;\n color: ".concat(hasInvertedStyle ? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimaryOnDark : (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, ";\n ");
|
|
6109
6109
|
});
|
|
6110
6110
|
var StyledSubtitle = styled$2("p", {
|
|
6111
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6112
|
-
})(templateObject_5$
|
|
6111
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$A.includes(prop); },
|
|
6112
|
+
})(templateObject_5$n || (templateObject_5$n = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6113
6113
|
var _a, _b;
|
|
6114
6114
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
6115
6115
|
var semanticColors = getSemanticColors(props);
|
|
@@ -6121,7 +6121,7 @@ var tooltipCss = function (props) {
|
|
|
6121
6121
|
var shadows = getShadows(props);
|
|
6122
6122
|
var corners = getCorners(props);
|
|
6123
6123
|
var semanticColors = getSemanticColors(props);
|
|
6124
|
-
return css$1(templateObject_6$
|
|
6124
|
+
return css$1(templateObject_6$k || (templateObject_6$k = __makeTemplateObject(["\n &.MuiTooltip-tooltip {\n border-radius: ", "px;\n box-shadow: ", ";\n max-width: ", " !important;\n text-align: ", " !important;\n\n ", "\n\n ", "\n\n ", "\n }\n "], ["\n &.MuiTooltip-tooltip {\n border-radius: ", "px;\n box-shadow: ", ";\n max-width: ", " !important;\n text-align: ", " !important;\n\n ", "\n\n ", "\n\n ", "\n }\n "])), corners === null || corners === void 0 ? void 0 : corners.l, shadows === null || shadows === void 0 ? void 0 : shadows.m, width === "wide" ? "550px" : "250px", textAlign
|
|
6125
6125
|
? textAlign
|
|
6126
6126
|
: width === "wide"
|
|
6127
6127
|
? "left"
|
|
@@ -6134,7 +6134,7 @@ var arrowCss = function (props) {
|
|
|
6134
6134
|
var _a, _b;
|
|
6135
6135
|
var hasInvertedStyle = props.hasInvertedStyle, inverted = props.inverted, sdsStyle = props.sdsStyle, arrowOffset = props.arrowOffset;
|
|
6136
6136
|
var semanticColors = getSemanticColors(props);
|
|
6137
|
-
return css$1(templateObject_7$
|
|
6137
|
+
return css$1(templateObject_7$g || (templateObject_7$g = __makeTemplateObject(["\n &.MuiTooltip-arrow {\n /* (bethbertozzi): !important is needed to fight inline style */\n left: ", "px !important;\n color: ", ";\n &:before {\n box-sizing: border-box;\n width: 12px;\n height: 12px;\n }\n }\n "], ["\n &.MuiTooltip-arrow {\n /* (bethbertozzi): !important is needed to fight inline style */\n left: ", "px !important;\n color: ", ";\n &:before {\n box-sizing: border-box;\n width: 12px;\n height: 12px;\n }\n }\n "])), arrowOffset, hasInvertedStyle || inverted || sdsStyle === "dark"
|
|
6138
6138
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfaceOnDark
|
|
6139
6139
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.surface);
|
|
6140
6140
|
};
|
|
@@ -6142,13 +6142,13 @@ var arrowCss = function (props) {
|
|
|
6142
6142
|
* (masoudmanson): !important is needed to override arrow's
|
|
6143
6143
|
* default placement which is calculated by javascript
|
|
6144
6144
|
*/
|
|
6145
|
-
var StyledPopper$1 = styled$2(Popper)(templateObject_8$
|
|
6146
|
-
var StyledComponentSlotWrapper = styled$2("div")(templateObject_9$
|
|
6145
|
+
var StyledPopper$1 = styled$2(Popper)(templateObject_8$f || (templateObject_8$f = __makeTemplateObject(["\n &[data-popper-placement*=\"top\"] .MuiTooltip-arrow {\n width: 24px !important;\n height: 12px !important;\n margin-bottom: -12px !important;\n &:before {\n transform: rotate(45deg) translate(0px, -2px);\n border-bottom-right-radius: 2px;\n box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.1);\n }\n }\n\n &[data-popper-placement*=\"bottom\"] .MuiTooltip-arrow {\n width: 24px !important;\n height: 12px !important;\n margin-top: -12px !important;\n &:before {\n transform: rotate(45deg) translate(-1px, 2px);\n border-top-left-radius: 2px;\n box-shadow: 0 0 2px 0px rgba(0, 0, 0, 0.1);\n }\n }\n\n &[data-popper-placement*=\"left\"] .MuiTooltip-arrow {\n width: 12px !important;\n height: 16px !important;\n margin-right: -12px !important;\n &:before {\n transform: rotate(45deg) translate(-1px, 1px);\n border-top-right-radius: 2px;\n box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.1);\n }\n }\n\n &[data-popper-placement*=\"right\"] .MuiTooltip-arrow {\n width: 12px !important;\n height: 16px !important;\n margin-left: -12px !important;\n &:before {\n transform: rotate(45deg) translate(4px, 2px);\n border-bottom-left-radius: 2px;\n box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.1);\n }\n }\n"], ["\n &[data-popper-placement*=\"top\"] .MuiTooltip-arrow {\n width: 24px !important;\n height: 12px !important;\n margin-bottom: -12px !important;\n &:before {\n transform: rotate(45deg) translate(0px, -2px);\n border-bottom-right-radius: 2px;\n box-shadow: 0 0 3px 2px rgba(0, 0, 0, 0.1);\n }\n }\n\n &[data-popper-placement*=\"bottom\"] .MuiTooltip-arrow {\n width: 24px !important;\n height: 12px !important;\n margin-top: -12px !important;\n &:before {\n transform: rotate(45deg) translate(-1px, 2px);\n border-top-left-radius: 2px;\n box-shadow: 0 0 2px 0px rgba(0, 0, 0, 0.1);\n }\n }\n\n &[data-popper-placement*=\"left\"] .MuiTooltip-arrow {\n width: 12px !important;\n height: 16px !important;\n margin-right: -12px !important;\n &:before {\n transform: rotate(45deg) translate(-1px, 1px);\n border-top-right-radius: 2px;\n box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.1);\n }\n }\n\n &[data-popper-placement*=\"right\"] .MuiTooltip-arrow {\n width: 12px !important;\n height: 16px !important;\n margin-left: -12px !important;\n &:before {\n transform: rotate(45deg) translate(4px, 2px);\n border-bottom-left-radius: 2px;\n box-shadow: 0 0 4px 0px rgba(0, 0, 0, 0.1);\n }\n }\n"])));
|
|
6146
|
+
var StyledComponentSlotWrapper = styled$2("div")(templateObject_9$c || (templateObject_9$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6147
6147
|
var shouldAddMargin = props.shouldAddMargin;
|
|
6148
6148
|
var spaces = getSpaces(props);
|
|
6149
6149
|
return "\n margin-top: ".concat(shouldAddMargin ? spaces === null || spaces === void 0 ? void 0 : spaces.s : 0, "px;\n ");
|
|
6150
6150
|
});
|
|
6151
|
-
var templateObject_1$
|
|
6151
|
+
var templateObject_1$V, templateObject_2$B, templateObject_3$u, templateObject_4$t, templateObject_5$n, templateObject_6$k, templateObject_7$g, templateObject_8$f, templateObject_9$c;
|
|
6152
6152
|
|
|
6153
6153
|
/**
|
|
6154
6154
|
* @see https://mui.com/material-ui/react-tooltip/
|
|
@@ -6226,7 +6226,7 @@ function mergeClass$1(_a) {
|
|
|
6226
6226
|
return propClassName ? "".concat(propClassName, " ").concat(className) : className;
|
|
6227
6227
|
}
|
|
6228
6228
|
|
|
6229
|
-
var doNotForwardProps$
|
|
6229
|
+
var doNotForwardProps$z = [
|
|
6230
6230
|
"icon",
|
|
6231
6231
|
"iconVerticalAlign",
|
|
6232
6232
|
"horizontalAlign",
|
|
@@ -6256,8 +6256,8 @@ var verticalAlignToFlexMap = {
|
|
|
6256
6256
|
top: "flex-start",
|
|
6257
6257
|
};
|
|
6258
6258
|
var StyledTableData = styled$2("td", {
|
|
6259
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6260
|
-
})(templateObject_1$
|
|
6259
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$z.includes(prop); },
|
|
6260
|
+
})(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
6261
6261
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6262
6262
|
var spaces = getSpaces(props);
|
|
6263
6263
|
return "\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n text-align: ").concat(horizontalAlign, ";\n vertical-align: ").concat(verticalAlignCSSMap[verticalAlign], ";\n overflow: hidden;\n ");
|
|
@@ -6268,30 +6268,30 @@ var ShouldWrap = function (lineCount) {
|
|
|
6268
6268
|
var ShouldTruncate$1 = function () {
|
|
6269
6269
|
return "\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n word-break: break-all;\n ";
|
|
6270
6270
|
};
|
|
6271
|
-
var StyledCellContent = styled$2("div")(templateObject_2$
|
|
6272
|
-
var StyledCellContentWrapper = styled$2("div")(templateObject_3$
|
|
6271
|
+
var StyledCellContent = styled$2("div")(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
6272
|
+
var StyledCellContentWrapper = styled$2("div")(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
6273
6273
|
var StyledCellIconWrapper = styled$2("div", {
|
|
6274
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6275
|
-
})(templateObject_4$
|
|
6274
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$z.includes(prop); },
|
|
6275
|
+
})(templateObject_4$s || (templateObject_4$s = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6276
6276
|
var _a = props.iconVerticalAlign, iconVerticalAlign = _a === void 0 ? "top" : _a;
|
|
6277
6277
|
var spaces = getSpaces(props);
|
|
6278
6278
|
return "\n padding-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n display: flex;\n flex-direction: column;\n justify-content: ").concat(verticalAlignToFlexMap[iconVerticalAlign], ";\n ");
|
|
6279
6279
|
});
|
|
6280
|
-
var PrimaryTextWrapper = styled$2("div")(templateObject_5$
|
|
6280
|
+
var PrimaryTextWrapper = styled$2("div")(templateObject_5$m || (templateObject_5$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6281
6281
|
var horizontalAlign = props.horizontalAlign;
|
|
6282
6282
|
return "\n display: flex;\n justify-content: ".concat(horizontalAlign === "left" ? "flex-start" : "flex-end", ";\n ");
|
|
6283
6283
|
});
|
|
6284
6284
|
var PrimaryText = styled$2("div", {
|
|
6285
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6286
|
-
})(templateObject_6$
|
|
6285
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$z.includes(prop); },
|
|
6286
|
+
})(templateObject_6$j || (templateObject_6$j = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6287
6287
|
var _a = props.primaryTextWrapLineCount, primaryTextWrapLineCount = _a === void 0 ? 3 : _a, _b = props.tabularNums, tabularNums = _b === void 0 ? false : _b;
|
|
6288
6288
|
return "\n display: block;\n font-variant-numeric: ".concat(tabularNums ? TABULAR_NUMS : "normal", ";\n \n ").concat(props.shouldTextWrap
|
|
6289
6289
|
? ShouldWrap(primaryTextWrapLineCount)
|
|
6290
6290
|
: ShouldTruncate$1(), "\n ");
|
|
6291
6291
|
});
|
|
6292
6292
|
var SecondaryText = styled$2("span", {
|
|
6293
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6294
|
-
})(templateObject_7$
|
|
6293
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$z.includes(prop); },
|
|
6294
|
+
})(templateObject_7$f || (templateObject_7$f = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6295
6295
|
var _a;
|
|
6296
6296
|
var _b = props.secondaryTextWrapLineCount, secondaryTextWrapLineCount = _b === void 0 ? 1 : _b, _c = props.tabularNums, tabularNums = _c === void 0 ? false : _c;
|
|
6297
6297
|
var spaces = getSpaces(props);
|
|
@@ -6301,8 +6301,8 @@ var SecondaryText = styled$2("span", {
|
|
|
6301
6301
|
: ShouldTruncate$1(), "\n ");
|
|
6302
6302
|
});
|
|
6303
6303
|
var TertiaryText = styled$2("span", {
|
|
6304
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6305
|
-
})(templateObject_8$
|
|
6304
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$z.includes(prop); },
|
|
6305
|
+
})(templateObject_8$e || (templateObject_8$e = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6306
6306
|
var _a;
|
|
6307
6307
|
var _b = props.tertiaryTextWrapLineCount, tertiaryTextWrapLineCount = _b === void 0 ? 1 : _b, _c = props.tabularNums, tabularNums = _c === void 0 ? false : _c;
|
|
6308
6308
|
var spaces = getSpaces(props);
|
|
@@ -6311,15 +6311,15 @@ var TertiaryText = styled$2("span", {
|
|
|
6311
6311
|
? ShouldWrap(tertiaryTextWrapLineCount)
|
|
6312
6312
|
: ShouldTruncate$1(), "\n ");
|
|
6313
6313
|
});
|
|
6314
|
-
var PrimaryTextComponentSlotBottomWrapper = styled$2("div")(templateObject_9$
|
|
6314
|
+
var PrimaryTextComponentSlotBottomWrapper = styled$2("div")(templateObject_9$b || (templateObject_9$b = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6315
6315
|
var spaces = getSpaces(props);
|
|
6316
6316
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
6317
6317
|
});
|
|
6318
|
-
var PrimaryTextComponentSlotRightWrapper = styled$2("div")(templateObject_10$
|
|
6318
|
+
var PrimaryTextComponentSlotRightWrapper = styled$2("div")(templateObject_10$a || (templateObject_10$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6319
6319
|
var spaces = getSpaces(props);
|
|
6320
6320
|
return "\n margin-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
6321
6321
|
});
|
|
6322
|
-
var templateObject_1$
|
|
6322
|
+
var templateObject_1$U, templateObject_2$A, templateObject_3$t, templateObject_4$s, templateObject_5$m, templateObject_6$j, templateObject_7$f, templateObject_8$e, templateObject_9$b, templateObject_10$a;
|
|
6323
6323
|
|
|
6324
6324
|
var CellBasicContent = function (props) {
|
|
6325
6325
|
var primaryText = props.primaryText, primaryTextWrapLineCount = props.primaryTextWrapLineCount, secondaryText = props.secondaryText, secondaryTextWrapLineCount = props.secondaryTextWrapLineCount, tertiaryText = props.tertiaryText, tertiaryTextWrapLineCount = props.tertiaryTextWrapLineCount, _a = props.shouldTextWrap, shouldTextWrap = _a === void 0 ? true : _a, icon = props.icon, iconVerticalAlign = props.iconVerticalAlign, primaryTextComponentSlotRight = props.primaryTextComponentSlotRight, primaryTextComponentSlotBottom = props.primaryTextComponentSlotBottom, _b = props.horizontalAlign, horizontalAlign = _b === void 0 ? "left" : _b, _c = props.tabularNums, tabularNums = _c === void 0 ? false : _c;
|
|
@@ -6333,15 +6333,15 @@ var CellBasic = forwardRef(function (props, ref) {
|
|
|
6333
6333
|
return (jsx(StyledTableData, __assign({ ref: ref }, props, { children: jsx(CellBasicContent, __assign({}, props)) })));
|
|
6334
6334
|
});
|
|
6335
6335
|
|
|
6336
|
-
var doNotForwardProps$
|
|
6336
|
+
var doNotForwardProps$y = ["horizontalAlign", "verticalAlign"];
|
|
6337
6337
|
var StyledCellComponentData = styled$2("td", {
|
|
6338
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6339
|
-
})(templateObject_1$
|
|
6338
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$y.includes(prop); },
|
|
6339
|
+
})(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
6340
6340
|
var spaces = getSpaces(props);
|
|
6341
6341
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6342
6342
|
return "\n align-items: center;\n text-align: ".concat(horizontalAlign, ";\n vertical-align: ").concat(verticalAlign, ";\n overflow: hidden;\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n ");
|
|
6343
6343
|
});
|
|
6344
|
-
var templateObject_1$
|
|
6344
|
+
var templateObject_1$T;
|
|
6345
6345
|
|
|
6346
6346
|
var CellComponent = forwardRef(function (props, _) {
|
|
6347
6347
|
var children = props.children, rest = __rest(props, ["children"]);
|
|
@@ -6353,7 +6353,7 @@ var contentPositionMapping = {
|
|
|
6353
6353
|
left: "flex-start",
|
|
6354
6354
|
right: "flex-end",
|
|
6355
6355
|
};
|
|
6356
|
-
var doNotForwardProps$
|
|
6356
|
+
var doNotForwardProps$x = [
|
|
6357
6357
|
"active",
|
|
6358
6358
|
"horizontalAlign",
|
|
6359
6359
|
"shouldShowTooltipOnHover",
|
|
@@ -6364,8 +6364,8 @@ var doNotForwardProps$w = [
|
|
|
6364
6364
|
"shouldTruncate",
|
|
6365
6365
|
];
|
|
6366
6366
|
var StyledSortingIcon = styled$2(Icon, {
|
|
6367
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6368
|
-
})(templateObject_1$
|
|
6367
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$x.includes(prop); },
|
|
6368
|
+
})(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6369
6369
|
var _a;
|
|
6370
6370
|
var _b = props.active, active = _b === void 0 ? false : _b, hideSortIcon = props.hideSortIcon;
|
|
6371
6371
|
var spaces = getSpaces(props);
|
|
@@ -6376,8 +6376,8 @@ var ShouldTruncate = function () {
|
|
|
6376
6376
|
return "\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n word-break: break-all;\n ";
|
|
6377
6377
|
};
|
|
6378
6378
|
var StyledTableHeader$1 = styled$2("th", {
|
|
6379
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6380
|
-
})(templateObject_2$
|
|
6379
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$x.includes(prop); },
|
|
6380
|
+
})(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontHeaderS, focusVisibleA11yStyle, function (props) {
|
|
6381
6381
|
var _a, _b, _c, _d, _e, _f;
|
|
6382
6382
|
var _g = props.active, active = _g === void 0 ? false : _g, _h = props.horizontalAlign, horizontalAlign = _h === void 0 ? "left" : _h, _j = props.hover, hover = _j === void 0 ? true : _j;
|
|
6383
6383
|
var spaces = getSpaces(props);
|
|
@@ -6391,18 +6391,18 @@ var StyledTableHeader$1 = styled$2("th", {
|
|
|
6391
6391
|
return "\n color: ".concat(defaultColor, ";\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n text-align: ").concat(horizontalAlign, ";\n min-width: 96px;\n cursor: ").concat(hover ? "pointer" : "default", ";\n vertical-align: bottom;\n\n & .MuiButtonBase-root {\n outline: none;\n }\n\n &:hover {\n color: ").concat(hover ? hoverColor : defaultColor, ";\n\n & .MuiButtonBase-root {\n color: ").concat(hoverColor, ";\n opacity: 1;\n }\n\n & svg {\n color: ").concat(active ? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.ornamentHover : (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentSecondaryHover, ";\n }\n }\n ");
|
|
6392
6392
|
});
|
|
6393
6393
|
var StyledCellHeaderText = styled$2("div", {
|
|
6394
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6395
|
-
})(templateObject_3$
|
|
6394
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$x.includes(prop); },
|
|
6395
|
+
})(templateObject_3$s || (templateObject_3$s = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderS, function (props) {
|
|
6396
6396
|
var _a = props.shouldTruncate, shouldTruncate = _a === void 0 ? false : _a;
|
|
6397
6397
|
return "\n ".concat(shouldTruncate && ShouldTruncate(), "\n ");
|
|
6398
6398
|
});
|
|
6399
6399
|
var StyledCellHeaderContainer = styled$2("div", {
|
|
6400
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6401
|
-
})(templateObject_4$
|
|
6400
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$x.includes(prop); },
|
|
6401
|
+
})(templateObject_4$r || (templateObject_4$r = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6402
6402
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a;
|
|
6403
6403
|
return "\n align-items: flex-end;\n width: 100%;\n display: flex;\n justify-content: ".concat(horizontalAlign ? contentPositionMapping[horizontalAlign] : "flex-start", ";\n ");
|
|
6404
6404
|
});
|
|
6405
|
-
var templateObject_1$
|
|
6405
|
+
var templateObject_1$S, templateObject_2$z, templateObject_3$s, templateObject_4$r;
|
|
6406
6406
|
|
|
6407
6407
|
var CellHeaderContent = function (props) {
|
|
6408
6408
|
var active = props.active, children = props.children, _a = props.direction, direction = _a === void 0 ? "desc" : _a, _b = props.hideSortIcon, hideSortIcon = _b === void 0 ? false : _b, horizontalAlign = props.horizontalAlign, hover = props.hover, _c = props.shouldTruncate, shouldTruncate = _c === void 0 ? false : _c;
|
|
@@ -6422,20 +6422,20 @@ var CellHeader = forwardRef(function (props, ref) {
|
|
|
6422
6422
|
|
|
6423
6423
|
var small = function (props) {
|
|
6424
6424
|
var spaces = getSpaces(props);
|
|
6425
|
-
return css(templateObject_1$
|
|
6425
|
+
return css(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n height: ", "px;\n padding: ", "px ", "px;\n\n .MuiChip-label {\n ", "\n padding: 0;\n }\n "], ["\n height: ", "px;\n padding: ", "px ", "px;\n\n .MuiChip-label {\n ", "\n padding: 0;\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.xs, fontCapsXxxxs(props));
|
|
6426
6426
|
};
|
|
6427
6427
|
var medium = function (props) {
|
|
6428
6428
|
var spaces = getSpaces(props);
|
|
6429
6429
|
var colors = getColors(props);
|
|
6430
|
-
return css(templateObject_2$
|
|
6430
|
+
return css(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n margin: 0 ", "px;\n height: 24px;\n\n background-color: ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n .MuiChip-label {\n ", "\n color: white;\n padding-left: ", "px;\n }\n\n .MuiChip-deleteIcon {\n color: white;\n padding-right: ", "px;\n margin: 0 0 0 -", "px;\n height: ", "px;\n width: ", "px;\n\n &:hover,\n &:focus-visible {\n color: white;\n }\n }\n "], ["\n margin: 0 ", "px;\n height: 24px;\n\n background-color: ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n .MuiChip-label {\n ", "\n color: white;\n padding-left: ", "px;\n }\n\n .MuiChip-deleteIcon {\n color: white;\n padding-right: ", "px;\n margin: 0 0 0 -", "px;\n height: ", "px;\n width: ", "px;\n\n &:hover,\n &:focus-visible {\n color: white;\n }\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s, colors === null || colors === void 0 ? void 0 : colors.blue[400], colors === null || colors === void 0 ? void 0 : colors.blue[500], colors === null || colors === void 0 ? void 0 : colors.blue[600], fontHeaderXs(props), spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.l);
|
|
6431
6431
|
};
|
|
6432
6432
|
var rounded$2 = function (props) {
|
|
6433
6433
|
var corners = getCorners(props);
|
|
6434
|
-
return css(templateObject_3$
|
|
6434
|
+
return css(templateObject_3$r || (templateObject_3$r = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.rounded);
|
|
6435
6435
|
};
|
|
6436
6436
|
var square$2 = function (props) {
|
|
6437
6437
|
var corners = getCorners(props);
|
|
6438
|
-
return css(templateObject_4$
|
|
6438
|
+
return css(templateObject_4$q || (templateObject_4$q = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.m);
|
|
6439
6439
|
};
|
|
6440
6440
|
var success = function (props) {
|
|
6441
6441
|
return createStatusCss(props, "success");
|
|
@@ -6488,7 +6488,7 @@ function createStatusCss(props, status) {
|
|
|
6488
6488
|
},
|
|
6489
6489
|
};
|
|
6490
6490
|
var statusColors = statusToColors[status];
|
|
6491
|
-
return css(templateObject_5$
|
|
6491
|
+
return css(templateObject_5$l || (templateObject_5$l = __makeTemplateObject(["\n background-color: ", ";\n\n .MuiChip-label {\n color: ", ";\n }\n "], ["\n background-color: ", ";\n\n .MuiChip-label {\n color: ", ";\n }\n "])), statusColors.light, statusColors.dark);
|
|
6492
6492
|
}
|
|
6493
6493
|
var statusToCss = {
|
|
6494
6494
|
beta: beta,
|
|
@@ -6498,14 +6498,14 @@ var statusToCss = {
|
|
|
6498
6498
|
success: success,
|
|
6499
6499
|
warning: warning,
|
|
6500
6500
|
};
|
|
6501
|
-
var doNotForwardProps$
|
|
6501
|
+
var doNotForwardProps$w = ["isRounded"];
|
|
6502
6502
|
var StyledChip = styled$2(Chip$1, {
|
|
6503
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6504
|
-
})(templateObject_7$
|
|
6503
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$w.includes(prop); },
|
|
6504
|
+
})(templateObject_7$e || (templateObject_7$e = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
6505
6505
|
var size = props.size, status = props.status, isRounded = props.isRounded;
|
|
6506
|
-
return css(templateObject_6$
|
|
6506
|
+
return css(templateObject_6$i || (templateObject_6$i = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), isRounded && rounded$2(props), !isRounded && square$2(props), size === "small" && small(props), size === "medium" && medium(props), status && statusToCss[status](props));
|
|
6507
6507
|
});
|
|
6508
|
-
var templateObject_1$
|
|
6508
|
+
var templateObject_1$R, templateObject_2$y, templateObject_3$r, templateObject_4$q, templateObject_5$l, templateObject_6$i, templateObject_7$e;
|
|
6509
6509
|
|
|
6510
6510
|
/**
|
|
6511
6511
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6523,7 +6523,7 @@ var Chip = function (props) {
|
|
|
6523
6523
|
return jsx(StyledChip, __assign({}, props));
|
|
6524
6524
|
};
|
|
6525
6525
|
|
|
6526
|
-
var doNotForwardProps$
|
|
6526
|
+
var doNotForwardProps$v = [
|
|
6527
6527
|
"anchorEl",
|
|
6528
6528
|
"count",
|
|
6529
6529
|
"keepSearchOnSelect",
|
|
@@ -6538,25 +6538,25 @@ var doNotForwardProps$u = [
|
|
|
6538
6538
|
"titleValue",
|
|
6539
6539
|
];
|
|
6540
6540
|
var StyledHeaderTitle = styled$2("div", {
|
|
6541
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6542
|
-
})(templateObject_1$
|
|
6541
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6542
|
+
})(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyMediumXs, function (props) {
|
|
6543
6543
|
var _a;
|
|
6544
6544
|
var spaces = getSpaces(props);
|
|
6545
6545
|
var semanticColors = getSemanticColors(props);
|
|
6546
6546
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n padding-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n ");
|
|
6547
6547
|
});
|
|
6548
6548
|
var StyledDropdownMenuAutocompleteWrapper = styled$2("div", {
|
|
6549
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6550
|
-
})(templateObject_2$
|
|
6549
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6550
|
+
})(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6551
6551
|
var search = props.search, titleValue = props.titleValue;
|
|
6552
6552
|
var spaces = getSpaces(props);
|
|
6553
6553
|
return "\n & .SdsAutocompleteMultiColumn-wrapper {\n padding: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n }\n\n & .").concat(autocompleteClasses.popper, ", & .MuiPopper-root,\n .base-Popper-root {\n position: relative !important;\n transform: none !important;\n width: 100% !important;\n box-shadow: none;\n padding: ").concat(!search && !titleValue ? spaces === null || spaces === void 0 ? void 0 : spaces.xs : 0, "px 0 0;\n border: none;\n outline: none !important;\n\n .MuiAutocomplete-listbox {\n outline: none !important;\n }\n\n .").concat(autocompleteClasses.paper, ", .MuiPaper-root {\n box-shadow: none !important;\n border: none !important;\n border-radius: 0;\n margin: 0;\n padding: 0;\n outline: none !important;\n }\n }\n ");
|
|
6554
6554
|
});
|
|
6555
6555
|
var StyledPopper = styled$2(Popper, {
|
|
6556
6556
|
shouldForwardProp: function (prop) {
|
|
6557
|
-
return !doNotForwardProps$
|
|
6557
|
+
return !doNotForwardProps$v.includes(prop) || prop === "anchorEl";
|
|
6558
6558
|
},
|
|
6559
|
-
})(templateObject_3$
|
|
6559
|
+
})(templateObject_3$q || (templateObject_3$q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6560
6560
|
var _a;
|
|
6561
6561
|
var borders = getBorders(props);
|
|
6562
6562
|
var corners = getCorners(props);
|
|
@@ -6565,8 +6565,8 @@ var StyledPopper = styled$2(Popper, {
|
|
|
6565
6565
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surface, ";\n background-image: none;\n border: ").concat(borders === null || borders === void 0 ? void 0 : borders.none, ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.l, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n box-sizing: border-box;\n z-index: 1400;\n ");
|
|
6566
6566
|
});
|
|
6567
6567
|
var StyledPaper$1 = styled$2(Paper, {
|
|
6568
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6569
|
-
})(templateObject_4$
|
|
6568
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6569
|
+
})(templateObject_4$p || (templateObject_4$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6570
6570
|
var _a, _b, _c, _d;
|
|
6571
6571
|
var spaces = getSpaces(props);
|
|
6572
6572
|
var shadows = getShadows(props);
|
|
@@ -6574,14 +6574,14 @@ var StyledPaper$1 = styled$2(Paper, {
|
|
|
6574
6574
|
var corners = getCorners(props);
|
|
6575
6575
|
return "\n box-shadow: ".concat(shadows === null || shadows === void 0 ? void 0 : shadows.none, " !important;\n border: none !important;\n outline: 1px solid ").concat(addOpacityToHex(((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderSecondary) || "#000000", 15), ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.l, "px;\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.surface, ";\n background-image: none;\n margin: 0;\n padding: 0 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px 0;\n overflow: hidden;\n\n .MuiAutocomplete-root,\n .MuiFormControl-root.MuiTextField-root {\n margin-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n\n & .MuiInputBase-root.MuiOutlinedInput-root {\n border-radius: 0;\n }\n\n & fieldset {\n border-left: none !important;\n border-right: none !important;\n border-top: none !important;\n border-bottom: 1px solid ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.divider, ";\n border-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.divider, " !important;\n border-radius: 0;\n }\n }\n\n // (masoudmanson): Remove margin-right and margin-bottom for the single column autocomplete\n // as it has been added to the parent container\n .MuiAutocomplete-root .MuiFormControl-root.MuiTextField-root {\n margin-right: 0;\n margin-bottom: 0;\n }\n ");
|
|
6576
6576
|
});
|
|
6577
|
-
var StyledDropdownMenuHeader = styled$2("div")(templateObject_5$
|
|
6577
|
+
var StyledDropdownMenuHeader = styled$2("div")(templateObject_5$k || (templateObject_5$k = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6578
6578
|
var _a;
|
|
6579
6579
|
var search = props.search;
|
|
6580
6580
|
var spaces = getSpaces(props);
|
|
6581
6581
|
var semanticColors = getSemanticColors(props);
|
|
6582
6582
|
return "\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px ").concat(search ? spaces === null || spaces === void 0 ? void 0 : spaces.xs : spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ").concat(search && "border-bottom: solid 1px ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.divider, ";"), "\n ");
|
|
6583
6583
|
});
|
|
6584
|
-
var templateObject_1$
|
|
6584
|
+
var templateObject_1$Q, templateObject_2$x, templateObject_3$q, templateObject_4$p, templateObject_5$k;
|
|
6585
6585
|
|
|
6586
6586
|
// (masoudmanson): Represents the minimum width defined by design specifications
|
|
6587
6587
|
// for the dropdownMenu's popper component
|
|
@@ -6617,7 +6617,7 @@ var DropdownMenu = function (props) {
|
|
|
6617
6617
|
sx: dropdownMenuPopperSx, children: jsx(PaperComponent, { children: jsx(ClickAwayListener, __assign({ onClickAway: onClickAway }, ClickAwayListenerProps, { children: jsxs(StyledDropdownMenuAutocompleteWrapper, { search: search, titleValue: !!(title || headerComponentSlot), children: [(title || headerComponentSlot) && (jsxs(StyledDropdownMenuHeader, { search: search, children: [title && jsx(StyledHeaderTitle, { children: title }), headerComponentSlot && jsx(Fragment, { children: headerComponentSlot })] })), anchorEl && (jsx(Autocomplete, __assign({ label: label, search: search, title: title, open: open, options: options, PopperBaseProps: DEFAULT_POPPER_BASE_PROPS, disablePortal: true, onClickAway: noop, onClick: noop, onOpen: onOpen, onClose: onClose }, rest, { InputBaseProps: DefaultInputBaseProps }))), children] }) })) }) })));
|
|
6618
6618
|
};
|
|
6619
6619
|
|
|
6620
|
-
var doNotForwardProps$
|
|
6620
|
+
var doNotForwardProps$u = [
|
|
6621
6621
|
"intent",
|
|
6622
6622
|
"state",
|
|
6623
6623
|
"sdsType",
|
|
@@ -6641,27 +6641,27 @@ var inputDropdownStyles = function (props) {
|
|
|
6641
6641
|
var _m = props.width, width = _m === void 0 ? "auto" : _m;
|
|
6642
6642
|
var spaces = getSpaces(props);
|
|
6643
6643
|
var semanticColors = getSemanticColors(props);
|
|
6644
|
-
return css(templateObject_1$
|
|
6644
|
+
return css(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n ", "\n\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n cursor: pointer;\n padding: ", "px ", "px;\n justify-content: start;\n width: ", ";\n min-width: 90px !important;\n\n &.MuiButton-text {\n &:hover {\n color: ", ";\n }\n\n .styled-label {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n ", " {\n margin-left: ", "px;\n }\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: ", ";\n box-shadow: inset 0 0 0 1px ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n background-color: transparent;\n box-shadow: inset 0 0 0 1px ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n }\n\n &:focus {\n background-color: transparent;\n outline-offset: -1px;\n }\n "], ["\n ", "\n\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n cursor: pointer;\n padding: ", "px ", "px;\n justify-content: start;\n width: ", ";\n min-width: 90px !important;\n\n &.MuiButton-text {\n &:hover {\n color: ", ";\n }\n\n .styled-label {\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n ", " {\n margin-left: ", "px;\n }\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: ", ";\n box-shadow: inset 0 0 0 1px ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n background-color: transparent;\n box-shadow: inset 0 0 0 1px ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n }\n\n &:focus {\n background-color: transparent;\n outline-offset: -1px;\n }\n "])), labelStyle(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.m, /^\d+$/.test(width) ? "".concat(width, "px") : width, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, IconWrapper, spaces === null || spaces === void 0 ? void 0 : spaces.m, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.ornamentSecondary, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.fillHover, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.borderPrimaryHover, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textPrimary, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.ornamentSecondaryHover, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.textPrimary, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _j === void 0 ? void 0 : _j.border, (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.textPrimary, (_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _l === void 0 ? void 0 : _l.ornamentSecondaryPressed);
|
|
6645
6645
|
};
|
|
6646
6646
|
var minimal$1 = function (props) {
|
|
6647
6647
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
6648
6648
|
var spaces = getSpaces(props);
|
|
6649
6649
|
var semanticColors = getSemanticColors(props);
|
|
6650
|
-
return css(templateObject_2$
|
|
6650
|
+
return css(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n ", "\n ", "\n\n /* this is needed to left align the label text */\n align-items: flex-start;\n border: none !important;\n flex-direction: column;\n padding: ", "px ", "px;\n box-shadow: none !important;\n background-color: transparent;\n min-width: auto;\n\n span {\n color: ", ";\n }\n\n /* Nesting to increase CSS specificity for style override */\n &.MuiButton-text {\n .styled-label {\n margin: 0;\n }\n\n & > span {\n ", "\n margin-left: 0;\n }\n\n ", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: ", ";\n border: none;\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n background-color: ", ";\n border: none;\n }\n "], ["\n ", "\n ", "\n\n /* this is needed to left align the label text */\n align-items: flex-start;\n border: none !important;\n flex-direction: column;\n padding: ", "px ", "px;\n box-shadow: none !important;\n background-color: transparent;\n min-width: auto;\n\n span {\n color: ", ";\n }\n\n /* Nesting to increase CSS specificity for style override */\n &.MuiButton-text {\n .styled-label {\n margin: 0;\n }\n\n & > span {\n ", "\n margin-left: 0;\n }\n\n ", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: ", ";\n border: none;\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n background-color: ", ";\n border: none;\n }\n "])), labelStyle(props), focusVisibleA11yStyle(props), spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.s, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, labelFontBodyS(props), IconWrapper, spaces === null || spaces === void 0 ? void 0 : spaces.xs, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondary, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillHover, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.textPrimary, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.ornamentSecondaryHover, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textPrimary, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.fillHover);
|
|
6651
6651
|
};
|
|
6652
6652
|
var square$1 = function (props) {
|
|
6653
6653
|
var corners = getCorners(props);
|
|
6654
|
-
return css(templateObject_3$
|
|
6654
|
+
return css(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n border-radius: ", "px;\n min-width: auto;\n background-color: transparent;\n "], ["\n border-radius: ", "px;\n min-width: auto;\n background-color: transparent;\n "])), corners === null || corners === void 0 ? void 0 : corners.l);
|
|
6655
6655
|
};
|
|
6656
6656
|
var rounded$1 = function (props) {
|
|
6657
6657
|
var corners = getCorners(props);
|
|
6658
|
-
return css(templateObject_4$
|
|
6658
|
+
return css(templateObject_4$o || (templateObject_4$o = __makeTemplateObject(["\n border-radius: ", "px;\n min-width: auto;\n background-color: transparent;\n "], ["\n border-radius: ", "px;\n min-width: auto;\n background-color: transparent;\n "])), corners === null || corners === void 0 ? void 0 : corners.rounded);
|
|
6659
6659
|
};
|
|
6660
6660
|
var userInput = function (props) {
|
|
6661
6661
|
var _a, _b, _c, _d;
|
|
6662
6662
|
var _e = props.sdsStyle, sdsStyle = _e === void 0 ? "square" : _e;
|
|
6663
6663
|
var semanticColors = getSemanticColors(props);
|
|
6664
|
-
return css(templateObject_5$
|
|
6664
|
+
return css(templateObject_5$j || (templateObject_5$j = __makeTemplateObject(["\n & .styled-label {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n ", "\n "], ["\n & .styled-label {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n ", "\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, sdsStyle === "minimal"
|
|
6665
6665
|
? "\n border: none;\n color: ".concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimary, ";\n\n .styled-label {\n color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.textPrimary, ";\n }\n ")
|
|
6666
6666
|
: "");
|
|
6667
6667
|
};
|
|
@@ -6670,7 +6670,7 @@ var isOpen = function (props) {
|
|
|
6670
6670
|
var _j = props.sdsStyle, sdsStyle = _j === void 0 ? "square" : _j, _k = props.intent, intent = _k === void 0 ? "default" : _k;
|
|
6671
6671
|
var semanticColors = getSemanticColors(props);
|
|
6672
6672
|
var inputColor = intentToColor$2[intent];
|
|
6673
|
-
return css(templateObject_6$
|
|
6673
|
+
return css(templateObject_6$h || (templateObject_6$h = __makeTemplateObject(["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n ", "\n\n path {\n fill: ", ";\n }\n\n box-shadow: ", ";\n\n background-color: ", ";\n\n &:hover {\n path {\n fill: ", ";\n }\n\n border-color: ", ";\n }\n "], ["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n ", "\n\n path {\n fill: ", ";\n }\n\n box-shadow: ", ";\n\n background-color: ", ";\n\n &:hover {\n path {\n fill: ", ";\n }\n\n border-color: ", ";\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, sdsStyle === "minimal"
|
|
6674
6674
|
? "\n & > span, \n &:hover > span { \n color: ".concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, "; \n }\n\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimary, "; \n ")
|
|
6675
6675
|
: "", (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentSecondaryPressed, sdsStyle === "minimal"
|
|
6676
6676
|
? "none"
|
|
@@ -6681,12 +6681,12 @@ var isOpen = function (props) {
|
|
|
6681
6681
|
var applyIntentColor$1 = function (props, intent) {
|
|
6682
6682
|
var _a, _b, _c;
|
|
6683
6683
|
var semanticColors = getSemanticColors(props);
|
|
6684
|
-
return css(templateObject_7$
|
|
6684
|
+
return css(templateObject_7$d || (templateObject_7$d = __makeTemplateObject(["\n box-shadow: inset 0 0 0 1px ", ";\n\n &:hover {\n box-shadow: inset 0 0 0 1px ", ";\n }\n\n &:active {\n box-shadow: inset 0 0 0 1px ", ";\n }\n "], ["\n box-shadow: inset 0 0 0 1px ", ";\n\n &:hover {\n box-shadow: inset 0 0 0 1px ", ";\n }\n\n &:active {\n box-shadow: inset 0 0 0 1px ", ";\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _a === void 0 ? void 0 : _a.border, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderPrimaryHover, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderPrimaryPressed);
|
|
6685
6685
|
};
|
|
6686
6686
|
var isDisabled = function (props) {
|
|
6687
6687
|
var _a, _b, _c, _d, _e, _f;
|
|
6688
6688
|
var semanticColors = getSemanticColors(props);
|
|
6689
|
-
return css(templateObject_8$
|
|
6689
|
+
return css(templateObject_8$d || (templateObject_8$d = __makeTemplateObject(["\n cursor: default;\n box-shadow: inset 0 0 0 1px ", ";\n\n span {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label,\n ", ", ", " {\n color: ", ";\n }\n\n ", " {\n background-color: ", ";\n color: ", ";\n }\n }\n\n path {\n fill: ", ";\n }\n "], ["\n cursor: default;\n box-shadow: inset 0 0 0 1px ", ";\n\n span {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label,\n ", ", ", " {\n color: ", ";\n }\n\n ", " {\n background-color: ", ";\n color: ", ";\n }\n }\n\n path {\n fill: ", ";\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryDisabled, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textDisabled, MinimalDetails, StyledDetail, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textDisabled, StyledCounter, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.backgroundTertiary, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textDisabled, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentDisabled);
|
|
6690
6690
|
};
|
|
6691
6691
|
/**
|
|
6692
6692
|
* (masoudmanson): `Button as React.ComponentType<InputDropdownProps>` is a
|
|
@@ -6697,10 +6697,10 @@ var isDisabled = function (props) {
|
|
|
6697
6697
|
* to the InputDropdownProps interface.
|
|
6698
6698
|
*/
|
|
6699
6699
|
var StyledInputDropdown = styled$2(Button, {
|
|
6700
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6701
|
-
})(templateObject_10$
|
|
6700
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6701
|
+
})(templateObject_10$9 || (templateObject_10$9 = __makeTemplateObject(["\n ", "\n ", "\n outline-offset: 1px !important;\n\n /* (thuang): in Minimal it's a different value */\n align-items: center;\n /* (thuang): in Minimal it's a different value */\n flex-direction: row;\n\n justify-content: space-between;\n\n ", "\n"], ["\n ", "\n ", "\n outline-offset: 1px !important;\n\n /* (thuang): in Minimal it's a different value */\n align-items: center;\n /* (thuang): in Minimal it's a different value */\n flex-direction: row;\n\n justify-content: space-between;\n\n ", "\n"])), labelFontBodyXs, focusVisibleA11yStyle, function (props) {
|
|
6702
6702
|
var disabled = props.disabled, intent = props.intent, state = props.state, value = props.value, _a = props.sdsStyle, sdsStyle = _a === void 0 ? "square" : _a;
|
|
6703
|
-
return css(templateObject_9$
|
|
6703
|
+
return css(templateObject_9$a || (templateObject_9$a = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), inputDropdownStyles(props), sdsStyle === "minimal" && minimal$1(props), sdsStyle === "square" && square$1(props), sdsStyle === "rounded" && rounded$1(props), value && userInput(props), intent === "notice" &&
|
|
6704
6704
|
sdsStyle !== "minimal" &&
|
|
6705
6705
|
applyIntentColor$1(props, "notice"), intent === "negative" &&
|
|
6706
6706
|
sdsStyle !== "minimal" &&
|
|
@@ -6709,15 +6709,15 @@ var StyledInputDropdown = styled$2(Button, {
|
|
|
6709
6709
|
applyIntentColor$1(props, "positive"), state === "open" && isOpen(props), disabled && isDisabled(props));
|
|
6710
6710
|
});
|
|
6711
6711
|
var StyledDetail = styled$2("span", {
|
|
6712
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6713
|
-
})(templateObject_11$
|
|
6712
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6713
|
+
})(templateObject_11$8 || (templateObject_11$8 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6714
6714
|
var _a;
|
|
6715
6715
|
var spaces = getSpaces(props);
|
|
6716
6716
|
var semanticColors = getSemanticColors(props);
|
|
6717
6717
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n ");
|
|
6718
6718
|
});
|
|
6719
|
-
var StyledLabel$
|
|
6720
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6719
|
+
var StyledLabel$3 = styled$2("span", {
|
|
6720
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6721
6721
|
})(templateObject_12$5 || (templateObject_12$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6722
6722
|
var _a, _b;
|
|
6723
6723
|
var details = props.details, counter = props.counter, sdsType = props.sdsType;
|
|
@@ -6729,7 +6729,7 @@ var StyledLabel$2 = styled$2("span", {
|
|
|
6729
6729
|
return "\n color: ".concat(labelColor, ";\n\n font-weight: ").concat(sdsType === "label" ? fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold : fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.regular, ";\n ");
|
|
6730
6730
|
});
|
|
6731
6731
|
var StyledCounter = styled$2("span", {
|
|
6732
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6732
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6733
6733
|
})(templateObject_13$5 || (templateObject_13$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6734
6734
|
var _a, _b;
|
|
6735
6735
|
var corners = getCorners(props);
|
|
@@ -6738,7 +6738,7 @@ var StyledCounter = styled$2("span", {
|
|
|
6738
6738
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.backgroundTertiary, ";\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.textAction, ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.rounded, "px;\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n height: 18px;\n min-width: 18px;\n display: flex;\n align-items: center;\n justify-content: center;\n ");
|
|
6739
6739
|
});
|
|
6740
6740
|
var MinimalDetails = styled$2("div", {
|
|
6741
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6741
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6742
6742
|
})(templateObject_14$5 || (templateObject_14$5 = __makeTemplateObject(["\n ", "\n text-align: left;\n width: 100%;\n\n ", "\n"], ["\n ", "\n text-align: left;\n width: 100%;\n\n ", "\n"])), labelFontBodyS, function (props) {
|
|
6743
6743
|
var _a;
|
|
6744
6744
|
var shouldTruncateMinimalDetails = props.shouldTruncateMinimalDetails;
|
|
@@ -6747,10 +6747,10 @@ var MinimalDetails = styled$2("div", {
|
|
|
6747
6747
|
"overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;", "\n ");
|
|
6748
6748
|
});
|
|
6749
6749
|
var LabelWrapper = styled$2("span", {
|
|
6750
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6750
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6751
6751
|
})(templateObject_15$5 || (templateObject_15$5 = __makeTemplateObject(["\n align-items: center;\n display: inline-flex;\n justify-content: space-between;\n width: 100%;\n\n & > div {\n align-items: center;\n display: inline-flex;\n justify-content: start;\n width: 100%;\n overflow: hidden;\n }\n"], ["\n align-items: center;\n display: inline-flex;\n justify-content: space-between;\n width: 100%;\n\n & > div {\n align-items: center;\n display: inline-flex;\n justify-content: start;\n width: 100%;\n overflow: hidden;\n }\n"])));
|
|
6752
6752
|
var IconWrapper = styled$2("span", {
|
|
6753
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6753
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6754
6754
|
})(templateObject_16$4 || (templateObject_16$4 = __makeTemplateObject(["\n margin-left: auto;\n display: flex;\n align-items: center;\n justify-self: end;\n"], ["\n margin-left: auto;\n display: flex;\n align-items: center;\n justify-self: end;\n"])));
|
|
6755
6755
|
function labelStyle(props) {
|
|
6756
6756
|
var _a, _b;
|
|
@@ -6760,7 +6760,7 @@ function labelStyle(props) {
|
|
|
6760
6760
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textSecondary;
|
|
6761
6761
|
return css(templateObject_17$4 || (templateObject_17$4 = __makeTemplateObject(["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n "], ["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n "])), labelColor);
|
|
6762
6762
|
}
|
|
6763
|
-
var templateObject_1$
|
|
6763
|
+
var templateObject_1$P, templateObject_2$w, templateObject_3$p, templateObject_4$o, templateObject_5$j, templateObject_6$h, templateObject_7$d, templateObject_8$d, templateObject_9$a, templateObject_10$9, templateObject_11$8, templateObject_12$5, templateObject_13$5, templateObject_14$5, templateObject_15$5, templateObject_16$4, templateObject_17$4;
|
|
6764
6764
|
|
|
6765
6765
|
var VALID_SDS_STYLES = ["minimal", "square", "rounded"];
|
|
6766
6766
|
var validateSdsStyle = function (sdsStyle) {
|
|
@@ -6782,7 +6782,7 @@ var InputDropdown = function (props) {
|
|
|
6782
6782
|
var shouldRenderMinimalDetails = isMinimal && sdsType === "label";
|
|
6783
6783
|
var shouldRenderCounter = multiple && counter !== undefined && counter !== "0" && !isMinimal;
|
|
6784
6784
|
var rootClassName = classes.root, labelClassName = classes.label, contentWrapperClassName = classes.contentWrapper, labelDetailsWrapperClassName = classes.labelDetailsWrapper, detailsClassName = classes.details, counterClassName = classes.counter, iconWrapperClassName = classes.iconWrapper, chevronIconClassName = classes.chevronIcon, minimalDetailsClassName = classes.minimalDetails;
|
|
6785
|
-
return (jsxs(StyledInputDropdown, __assign({}, props, { className: cn(rootClassName, className), sdsStyle: sdsStyle, "aria-label": "Dropdown input", children: [jsxs(LabelWrapper, { className: cn(contentWrapperClassName), children: [jsxs("div", { className: cn(labelDetailsWrapperClassName), children: [jsx(StyledLabel$
|
|
6785
|
+
return (jsxs(StyledInputDropdown, __assign({}, props, { className: cn(rootClassName, className), sdsStyle: sdsStyle, "aria-label": "Dropdown input", children: [jsxs(LabelWrapper, { className: cn(contentWrapperClassName), children: [jsxs("div", { className: cn(labelDetailsWrapperClassName), children: [jsx(StyledLabel$3, { className: cn("styled-label", labelClassName), details: details, counter: counter, sdsType: sdsType, children: renderLabelText({
|
|
6786
6786
|
counter: counter,
|
|
6787
6787
|
details: details,
|
|
6788
6788
|
isMinimal: isMinimal,
|
|
@@ -6830,15 +6830,15 @@ function renderDetailsText(_a) {
|
|
|
6830
6830
|
}
|
|
6831
6831
|
}
|
|
6832
6832
|
|
|
6833
|
-
var doNotForwardProps$
|
|
6833
|
+
var doNotForwardProps$t = ["buttonPosition"];
|
|
6834
6834
|
var StyledButtonsWrapper = styled$2("div", {
|
|
6835
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6836
|
-
})(templateObject_1$
|
|
6835
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$t.includes(prop); },
|
|
6836
|
+
})(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6837
6837
|
var buttonPosition = props.buttonPosition;
|
|
6838
6838
|
var spaces = getSpaces(props);
|
|
6839
6839
|
return "\n display: flex;\n justify-content: ".concat(buttonPosition === "left" ? "start" : "end", ";\n width: 100%;\n\n & > div {\n gap: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px 0;\n display: flex;\n align-items: center;\n flex-direction: row;\n width: 100%;\n\n & > button {\n width: 100%;\n }\n }\n ");
|
|
6840
6840
|
});
|
|
6841
|
-
var templateObject_1$
|
|
6841
|
+
var templateObject_1$O;
|
|
6842
6842
|
|
|
6843
6843
|
// Custom hook for managing dropdown state
|
|
6844
6844
|
function useDropdownState(propValue, multiple, options) {
|
|
@@ -7130,33 +7130,33 @@ var tagSizeS = function (props) {
|
|
|
7130
7130
|
var spaces = getSpaces(props);
|
|
7131
7131
|
var iconSizes = getIconSizes(props);
|
|
7132
7132
|
var semanticColors = getSemanticColors(props);
|
|
7133
|
-
return css(templateObject_1$
|
|
7133
|
+
return css(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n height: unset;\n margin: 0 ", "px ", "px 0;\n\n .MuiChip-label {\n ", "\n padding: 0;\n }\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n margin: 0 ", "px 0 -", "px;\n }\n\n .MuiChip-deleteIcon {\n ", "\n color: ", ";\n margin: 0 0 0 ", "px;\n height: ", "px;\n width: ", "px;\n }\n "], ["\n height: unset;\n margin: 0 ", "px ", "px 0;\n\n .MuiChip-label {\n ", "\n padding: 0;\n }\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n margin: 0 ", "px 0 -", "px;\n }\n\n .MuiChip-deleteIcon {\n ", "\n color: ", ";\n margin: 0 0 0 ", "px;\n height: ", "px;\n width: ", "px;\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.xs, fontBodyXxxs$1(props), iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, fontHeaderXs(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentPrimaryInverse, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width);
|
|
7134
7134
|
};
|
|
7135
7135
|
var tagSizeL = function (props) {
|
|
7136
7136
|
var _a;
|
|
7137
7137
|
var spaces = getSpaces(props);
|
|
7138
7138
|
var iconSizes = getIconSizes(props);
|
|
7139
7139
|
var semanticColors = getSemanticColors(props);
|
|
7140
|
-
return css(templateObject_2$
|
|
7140
|
+
return css(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n height: unset;\n margin: 0 ", "px ", "px 0;\n\n .MuiChip-label {\n ", "\n padding: 0;\n }\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n margin: 0 ", "px 0 -", "px;\n }\n\n .MuiChip-deleteIcon {\n ", "\n color: ", ";\n margin: 0 0 0 ", "px;\n height: ", "px;\n width: ", "px;\n }\n "], ["\n height: unset;\n margin: 0 ", "px ", "px 0;\n\n .MuiChip-label {\n ", "\n padding: 0;\n }\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n margin: 0 ", "px 0 -", "px;\n }\n\n .MuiChip-deleteIcon {\n ", "\n color: ", ";\n margin: 0 0 0 ", "px;\n height: ", "px;\n width: ", "px;\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.xs, fontBodyXs$2(props), iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.width, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, fontHeaderXs(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentPrimaryInverse, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width);
|
|
7141
7141
|
};
|
|
7142
7142
|
var rounded = function (props) {
|
|
7143
7143
|
var corners = getCorners(props);
|
|
7144
7144
|
var spaces = getSpaces(props);
|
|
7145
7145
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
7146
7146
|
var topBottomPadding = sdsSize === "s" ? spaces === null || spaces === void 0 ? void 0 : spaces.xxxs : icon ? spaces === null || spaces === void 0 ? void 0 : spaces.xxs : spaces === null || spaces === void 0 ? void 0 : spaces.xs;
|
|
7147
|
-
return css(templateObject_3$
|
|
7147
|
+
return css(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n border-radius: ", "px;\n padding: ", "px ", "px;\n\n &:after {\n border-radius: ", "px;\n }\n "], ["\n border-radius: ", "px;\n padding: ", "px ", "px;\n\n &:after {\n border-radius: ", "px;\n }\n "])), corners === null || corners === void 0 ? void 0 : corners.rounded, topBottomPadding, spaces === null || spaces === void 0 ? void 0 : spaces.s, corners === null || corners === void 0 ? void 0 : corners.rounded);
|
|
7148
7148
|
};
|
|
7149
7149
|
var square = function (props) {
|
|
7150
7150
|
var corners = getCorners(props);
|
|
7151
7151
|
var spaces = getSpaces(props);
|
|
7152
7152
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
7153
7153
|
var topBottomPadding = sdsSize === "s" ? spaces === null || spaces === void 0 ? void 0 : spaces.xxxs : icon ? spaces === null || spaces === void 0 ? void 0 : spaces.xxs : spaces === null || spaces === void 0 ? void 0 : spaces.xs;
|
|
7154
|
-
return css(templateObject_4$
|
|
7154
|
+
return css(templateObject_4$n || (templateObject_4$n = __makeTemplateObject(["\n border-radius: ", "px;\n padding: ", "px ", "px;\n\n &:after {\n border-radius: ", "px;\n }\n "], ["\n border-radius: ", "px;\n padding: ", "px ", "px;\n\n &:after {\n border-radius: ", "px;\n }\n "])), corners === null || corners === void 0 ? void 0 : corners.m, topBottomPadding, spaces === null || spaces === void 0 ? void 0 : spaces.s, corners === null || corners === void 0 ? void 0 : corners.m);
|
|
7155
7155
|
};
|
|
7156
7156
|
var withHover = function (props) {
|
|
7157
7157
|
var _a;
|
|
7158
7158
|
var semanticColors = getSemanticColors(props);
|
|
7159
|
-
return css(templateObject_5$
|
|
7159
|
+
return css(templateObject_5$i || (templateObject_5$i = __makeTemplateObject(["\n &:hover {\n cursor: pointer;\n }\n\n &:hover,\n &:focus-visible {\n color: ", ";\n }\n "], ["\n &:hover {\n cursor: pointer;\n }\n\n &:hover,\n &:focus-visible {\n color: ", ";\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimaryInverse);
|
|
7160
7160
|
};
|
|
7161
7161
|
var primary = function (props) {
|
|
7162
7162
|
return createTypeCss(props, "primary");
|
|
@@ -7225,13 +7225,13 @@ function createTypeCss(props, type) {
|
|
|
7225
7225
|
secondary: generateSecondaryTagColors(intent, colors, semanticColors),
|
|
7226
7226
|
};
|
|
7227
7227
|
var typeColors = typeToColors[type];
|
|
7228
|
-
return css(templateObject_6$
|
|
7228
|
+
return css(templateObject_6$g || (templateObject_6$g = __makeTemplateObject(["\n ", "\n\n background-color: ", ";\n position: relative;\n\n .MuiChip-label {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n\n &:hover,\n &:active {\n .MuiChip-label {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n &.Mui-focusVisible {\n background-color: ", ";\n }x\n "], ["\n ", "\n\n background-color: ", ";\n position: relative;\n\n .MuiChip-label {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n\n &:hover,\n &:active {\n .MuiChip-label {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n &.Mui-focusVisible {\n background-color: ", ";\n }x\n "])), focusVisibleA11yStyle(props), typeColors.background, typeColors.label, typeColors.iconColor, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimaryInverse, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimaryInverse, typeColors.backgroundHover, typeColors.backgroundClicked, typeColors.backgroundHover);
|
|
7229
7229
|
}
|
|
7230
7230
|
var typeToCss = {
|
|
7231
7231
|
primary: primary,
|
|
7232
7232
|
secondary: secondary,
|
|
7233
7233
|
};
|
|
7234
|
-
var doNotForwardProps$
|
|
7234
|
+
var doNotForwardProps$s = [
|
|
7235
7235
|
"sdsType",
|
|
7236
7236
|
"sdsStyle",
|
|
7237
7237
|
"sdsSize",
|
|
@@ -7239,14 +7239,14 @@ var doNotForwardProps$r = [
|
|
|
7239
7239
|
"hover",
|
|
7240
7240
|
];
|
|
7241
7241
|
var StyledTag$4 = styled$2(Chip$1, {
|
|
7242
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7243
|
-
})(templateObject_8$
|
|
7242
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$s.includes(prop); },
|
|
7243
|
+
})(templateObject_8$c || (templateObject_8$c = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
7244
7244
|
var _a = props.hover, hover = _a === void 0 ? true : _a, sdsType = props.sdsType, sdsStyle = props.sdsStyle, _b = props.sdsSize, sdsSize = _b === void 0 ? "s" : _b;
|
|
7245
7245
|
var isRounded = sdsStyle === "rounded";
|
|
7246
7246
|
var type = sdsType || "primary";
|
|
7247
|
-
return css(templateObject_7$
|
|
7247
|
+
return css(templateObject_7$c || (templateObject_7$c = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n "])), sdsSize === "l" ? tagSizeL(props) : tagSizeS(props), typeToCss[type](props), isRounded ? rounded(props) : square(props), hover ? withHover(props) : "pointer-events: none;");
|
|
7248
7248
|
});
|
|
7249
|
-
var templateObject_1$
|
|
7249
|
+
var templateObject_1$N, templateObject_2$v, templateObject_3$o, templateObject_4$n, templateObject_5$i, templateObject_6$g, templateObject_7$c, templateObject_8$c;
|
|
7250
7250
|
|
|
7251
7251
|
/**
|
|
7252
7252
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -7260,14 +7260,14 @@ var Tag = function (props) {
|
|
|
7260
7260
|
return jsx(StyledTag$4, __assign({ tagColor: color }, props, { color: "primary" }));
|
|
7261
7261
|
};
|
|
7262
7262
|
|
|
7263
|
-
var StyledTag$3 = styled$2(Tag)(templateObject_2$
|
|
7263
|
+
var StyledTag$3 = styled$2(Tag)(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7264
7264
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
7265
7265
|
var spaces = getSpaces(props);
|
|
7266
7266
|
var iconSizes = getIconSizes(props);
|
|
7267
7267
|
var semanticColors = getSemanticColors(props);
|
|
7268
|
-
return css(templateObject_1$
|
|
7268
|
+
return css(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n padding: ", "px ", "px;\n background-color: ", ";\n\n .MuiChip-label {\n ", "\n z-index: auto;\n }\n\n .MuiChip-deleteIcon {\n margin: 0 0 0 ", "px;\n width: ", "px !important;\n height: ", "px !important;\n }\n\n .MuiSvgIcon-root {\n margin: 0;\n width: ", "px !important;\n height: ", "px !important;\n }\n\n svg {\n z-index: auto;\n }\n\n &:hover,\n &:focus,\n &:focus-within {\n background-color: ", ";\n\n .MuiChip-label {\n color: ", " !important;\n }\n\n .MuiChip-deleteIcon svg {\n fill: ", " !important;\n }\n }\n\n &:active {\n background-color: ", ";\n }\n\n &:after {\n display: none;\n }\n "], ["\n padding: ", "px ", "px;\n background-color: ", ";\n\n .MuiChip-label {\n ", "\n z-index: auto;\n }\n\n .MuiChip-deleteIcon {\n margin: 0 0 0 ", "px;\n width: ", "px !important;\n height: ", "px !important;\n }\n\n .MuiSvgIcon-root {\n margin: 0;\n width: ", "px !important;\n height: ", "px !important;\n }\n\n svg {\n z-index: auto;\n }\n\n &:hover,\n &:focus,\n &:focus-within {\n background-color: ", ";\n\n .MuiChip-label {\n color: ", " !important;\n }\n\n .MuiChip-deleteIcon svg {\n fill: ", " !important;\n }\n }\n\n &:active {\n background-color: ", ";\n }\n\n &:after {\n display: none;\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.s, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.fillPrimary, fontHeaderXs(props), spaces === null || spaces === void 0 ? void 0 : spaces.s, (_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs) === null || _b === void 0 ? void 0 : _b.width, (_c = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs) === null || _c === void 0 ? void 0 : _c.height, (_d = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs) === null || _d === void 0 ? void 0 : _d.width, (_e = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs) === null || _e === void 0 ? void 0 : _e.height, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _f === void 0 ? void 0 : _f.fillHover, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.textPrimaryInverse, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentPrimaryInverse, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _j === void 0 ? void 0 : _j.fillPressed);
|
|
7269
7269
|
});
|
|
7270
|
-
var templateObject_1$
|
|
7270
|
+
var templateObject_1$M, templateObject_2$u;
|
|
7271
7271
|
|
|
7272
7272
|
/**
|
|
7273
7273
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -7334,12 +7334,12 @@ var Chips = function (_a) {
|
|
|
7334
7334
|
return (jsx(Fragment, { children: chipLabels.map(function (label) { return (jsx(TagFilter, { label: label, onDelete: function () { return onDelete(label); }, onClick: function () { return onDelete(label); } }, label)); }) }));
|
|
7335
7335
|
};
|
|
7336
7336
|
|
|
7337
|
-
var Wrapper = styled$2("div")(templateObject_1$
|
|
7338
|
-
var StyledChipsWrapper = styled$2("div")(templateObject_2$
|
|
7337
|
+
var Wrapper = styled$2("div")(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n min-width: 150px;\n"], ["\n min-width: 150px;\n"])));
|
|
7338
|
+
var StyledChipsWrapper = styled$2("div")(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7339
7339
|
var spaces = getSpaces(props);
|
|
7340
7340
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
7341
7341
|
});
|
|
7342
|
-
var templateObject_1$
|
|
7342
|
+
var templateObject_1$L, templateObject_2$t;
|
|
7343
7343
|
|
|
7344
7344
|
// Helper function to remove item from array
|
|
7345
7345
|
var removeItemFromArray = function (arr, tag) {
|
|
@@ -7469,7 +7469,7 @@ var ComplexFilter = function (_a) {
|
|
|
7469
7469
|
return (jsxs(Wrapper, { children: [jsx(Dropdown, __assign({ label: label, multiple: multiple, search: search, value: value, onChange: handleDropdownChange, options: options, InputDropdownProps: __assign({}, InputDropdownProps), buttons: true }, rest)), jsx(StyledChipsWrapper, { children: jsx(Chips, { value: value, multiple: multiple, onDelete: handleDelete }) })] }));
|
|
7470
7470
|
};
|
|
7471
7471
|
|
|
7472
|
-
var doNotForwardProps$
|
|
7472
|
+
var doNotForwardProps$r = [
|
|
7473
7473
|
"visualElement",
|
|
7474
7474
|
"sdsType",
|
|
7475
7475
|
"imagePosition",
|
|
@@ -7493,8 +7493,8 @@ var doNotForwardProps$q = [
|
|
|
7493
7493
|
"classes",
|
|
7494
7494
|
];
|
|
7495
7495
|
var StyledCard = styled$2(Card, {
|
|
7496
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7497
|
-
})(templateObject_5$
|
|
7496
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
7497
|
+
})(templateObject_5$h || (templateObject_5$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7498
7498
|
var _a, _b, _c, _d;
|
|
7499
7499
|
var _e = props.imagePosition, imagePosition = _e === void 0 ? "left" : _e, _f = props.sdsType, sdsType = _f === void 0 ? "wide" : _f, _g = props.boundingBox, boundingBox = _g === void 0 ? true : _g, _h = props.decorativeBorder, decorativeBorder = _h === void 0 ? false : _h, _j = props.imagePadding, imagePadding = _j === void 0 ? false : _j, visualElementType = props.visualElementType, _k = props.clickableCard, clickableCard = _k === void 0 ? false : _k;
|
|
7500
7500
|
var semanticColors = getSemanticColors(props);
|
|
@@ -7510,13 +7510,13 @@ var StyledCard = styled$2(Card, {
|
|
|
7510
7510
|
var showDecorativeBorder = visualElementType === "image"
|
|
7511
7511
|
? boundingBox && decorativeBorder && imagePadding
|
|
7512
7512
|
: boundingBox && decorativeBorder;
|
|
7513
|
-
return css(templateObject_4$
|
|
7514
|
-
showDecorativeBorder && css(templateObject_2$
|
|
7515
|
-
showDecorativeBorder && css(templateObject_3$
|
|
7513
|
+
return css(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n display: flex;\n background-color: transparent;\n background-image: none;\n flex-direction: ", ";\n overflow: auto;\n box-shadow: none;\n border-radius: ", "px;\n\n .MuiCardActionArea-focusHighlight {\n background: transparent;\n }\n\n &:hover,\n &:active {\n box-shadow: ", " !important;\n }\n\n ", "\n\n ", "\n\n ", "\n "], ["\n display: flex;\n background-color: transparent;\n background-image: none;\n flex-direction: ", ";\n overflow: auto;\n box-shadow: none;\n border-radius: ", "px;\n\n .MuiCardActionArea-focusHighlight {\n background: transparent;\n }\n\n &:hover,\n &:active {\n box-shadow: ", " !important;\n }\n\n ", "\n\n ", "\n\n ", "\n "])), flexDirection, corners === null || corners === void 0 ? void 0 : corners.xl, clickableCard ? shadows === null || shadows === void 0 ? void 0 : shadows.l : shadows === null || shadows === void 0 ? void 0 : shadows.none, boundingBox && css(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n border: 1px solid ", ";\n background-color: ", ";\n "], ["\n border: 1px solid ", ";\n background-color: ", ";\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderSecondary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.backgroundPrimary), sdsType === "wide" &&
|
|
7514
|
+
showDecorativeBorder && css(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n border-left: 4px solid ", ";\n "], ["\n border-left: 4px solid ", ";\n "])), (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.border), sdsType === "narrow" &&
|
|
7515
|
+
showDecorativeBorder && css(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n border-top: 4px solid ", ";\n "], ["\n border-top: 4px solid ", ";\n "])), (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.border));
|
|
7516
7516
|
});
|
|
7517
7517
|
var StyledCardActionArea = styled$2(Button, {
|
|
7518
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7519
|
-
})(templateObject_6$
|
|
7518
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
7519
|
+
})(templateObject_6$f || (templateObject_6$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7520
7520
|
var _a, _b;
|
|
7521
7521
|
var _c = props.imagePosition, imagePosition = _c === void 0 ? "left" : _c, _d = props.cardSdsType, cardSdsType = _d === void 0 ? "wide" : _d, visualElementType = props.visualElementType;
|
|
7522
7522
|
var semanticColors = getSemanticColors(props);
|
|
@@ -7530,22 +7530,22 @@ var StyledCardActionArea = styled$2(Button, {
|
|
|
7530
7530
|
return "\n display: flex;\n flex-direction: ".concat(flexDirection, ";\n align-items: unset;\n height: 100%;\n width: 100%;\n padding: 0;\n margin: 0;\n overflow: auto;\n text-align: unset;\n\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.backgroundPrimary, ";\n\n &:hover,\n &:active {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.surface, ";\n }\n ");
|
|
7531
7531
|
});
|
|
7532
7532
|
var StyledIconMediaWrapper = styled$2("div", {
|
|
7533
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7534
|
-
})(templateObject_10$
|
|
7533
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
7534
|
+
})(templateObject_10$8 || (templateObject_10$8 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7535
7535
|
var _a = props.boundingBox, boundingBox = _a === void 0 ? true : _a;
|
|
7536
7536
|
var spaces = getSpaces(props);
|
|
7537
|
-
return css(templateObject_9$
|
|
7538
|
-
? css(templateObject_7$
|
|
7537
|
+
return css(templateObject_9$9 || (templateObject_9$9 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), boundingBox
|
|
7538
|
+
? css(templateObject_7$b || (templateObject_7$b = __makeTemplateObject(["\n padding: ", "px 0 ", "px ", "px;\n "], ["\n padding: ", "px 0 ", "px ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl, spaces === null || spaces === void 0 ? void 0 : spaces.xl, spaces === null || spaces === void 0 ? void 0 : spaces.xl) : css(templateObject_8$b || (templateObject_8$b = __makeTemplateObject(["\n padding-right: ", "px;\n "], ["\n padding-right: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
7539
7539
|
});
|
|
7540
7540
|
var StyledCardContent = styled$2("div", {
|
|
7541
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7541
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
7542
7542
|
})(templateObject_13$4 || (templateObject_13$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7543
7543
|
var _a = props.boundingBox, boundingBox = _a === void 0 ? true : _a;
|
|
7544
7544
|
var spaces = getSpaces(props);
|
|
7545
|
-
return css(templateObject_12$4 || (templateObject_12$4 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n height: 100%;\n\n ", "\n "], ["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n height: 100%;\n\n ", "\n "])), boundingBox && css(templateObject_11$
|
|
7545
|
+
return css(templateObject_12$4 || (templateObject_12$4 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n height: 100%;\n\n ", "\n "], ["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n height: 100%;\n\n ", "\n "])), boundingBox && css(templateObject_11$7 || (templateObject_11$7 = __makeTemplateObject(["\n padding: ", "px;\n "], ["\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
7546
7546
|
});
|
|
7547
7547
|
var StyledContentCardBody = styled$2(CardContent, {
|
|
7548
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7548
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
7549
7549
|
})(templateObject_14$4 || (templateObject_14$4 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyS$1, function (props) {
|
|
7550
7550
|
var _a;
|
|
7551
7551
|
var semanticColors = getSemanticColors(props);
|
|
@@ -7553,9 +7553,9 @@ var StyledContentCardBody = styled$2(CardContent, {
|
|
|
7553
7553
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n margin: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px 0 0;\n padding: 0;\n ");
|
|
7554
7554
|
});
|
|
7555
7555
|
var StyledCardContentAligner = styled$2("div")(templateObject_15$4 || (templateObject_15$4 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n height: 100%;\n"])));
|
|
7556
|
-
var templateObject_1$
|
|
7556
|
+
var templateObject_1$K, templateObject_2$s, templateObject_3$n, templateObject_4$m, templateObject_5$h, templateObject_6$f, templateObject_7$b, templateObject_8$b, templateObject_9$9, templateObject_10$8, templateObject_11$7, templateObject_12$4, templateObject_13$4, templateObject_14$4, templateObject_15$4;
|
|
7557
7557
|
|
|
7558
|
-
var doNotForwardProps$
|
|
7558
|
+
var doNotForwardProps$q = [
|
|
7559
7559
|
"visualElement",
|
|
7560
7560
|
"sdsType",
|
|
7561
7561
|
"imagePosition",
|
|
@@ -7567,41 +7567,41 @@ var doNotForwardProps$p = [
|
|
|
7567
7567
|
"contentBlock",
|
|
7568
7568
|
];
|
|
7569
7569
|
var StyledTitleWrapper = styled$3("div", {
|
|
7570
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7571
|
-
})(templateObject_1$
|
|
7570
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
7571
|
+
})(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7572
7572
|
var spaces = getSpaces(props);
|
|
7573
7573
|
return "\n display: flex;\n flex-direction: column;\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
7574
7574
|
});
|
|
7575
7575
|
var StyledOverlineText = styled$3("p", {
|
|
7576
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7577
|
-
})(templateObject_2$
|
|
7576
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
7577
|
+
})(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontCapsXxxs, function (props) {
|
|
7578
7578
|
var _a;
|
|
7579
7579
|
var semanticColors = getSemanticColors(props);
|
|
7580
7580
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n margin: 0;\n ");
|
|
7581
7581
|
});
|
|
7582
7582
|
var StyledTitleText = styled$3("p", {
|
|
7583
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7584
|
-
})(templateObject_3$
|
|
7583
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
7584
|
+
})(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderXl, function (props) {
|
|
7585
7585
|
var _a;
|
|
7586
7586
|
var semanticColors = getSemanticColors(props);
|
|
7587
7587
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n margin: 0;\n ");
|
|
7588
7588
|
});
|
|
7589
7589
|
var StyledSubtitleText = styled$3("p", {
|
|
7590
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7591
|
-
})(templateObject_4$
|
|
7590
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
7591
|
+
})(templateObject_4$l || (templateObject_4$l = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderM$1, function (props) {
|
|
7592
7592
|
var _a;
|
|
7593
7593
|
var semanticColors = getSemanticColors(props);
|
|
7594
7594
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n margin: 0;\n ");
|
|
7595
7595
|
});
|
|
7596
7596
|
var StyledMetadataText = styled$3("p", {
|
|
7597
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7598
|
-
})(templateObject_5$
|
|
7597
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
7598
|
+
})(templateObject_5$g || (templateObject_5$g = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7599
7599
|
var _a;
|
|
7600
7600
|
var semanticColors = getSemanticColors(props);
|
|
7601
7601
|
var spaces = getSpaces(props);
|
|
7602
7602
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n margin: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px 0 0 0;\n ");
|
|
7603
7603
|
});
|
|
7604
|
-
var templateObject_1$
|
|
7604
|
+
var templateObject_1$J, templateObject_2$r, templateObject_3$m, templateObject_4$l, templateObject_5$g;
|
|
7605
7605
|
|
|
7606
7606
|
var createTextComponent = function (StyledComponent) {
|
|
7607
7607
|
return function (_a) {
|
|
@@ -7621,15 +7621,15 @@ var ContentCardTitle = forwardRef(function ContentCardTitle(props, ref) {
|
|
|
7621
7621
|
return (jsxs("div", { ref: ref, children: [jsxs(StyledTitleWrapper, { className: cn(cardHeader), children: [jsx(OverlineText, { text: overlineText, className: cardOverline }), jsx(TitleText, { text: titleText, className: cardTitle }), jsx(SubtitleText, { text: subtitleText, className: cardSubtitle })] }), jsx(MetadataText, { text: metadataText, className: cardMetadata })] }));
|
|
7622
7622
|
});
|
|
7623
7623
|
|
|
7624
|
-
var doNotForwardProps$
|
|
7624
|
+
var doNotForwardProps$p = ["buttonsPosition"];
|
|
7625
7625
|
var StyledCardActions = styled$2(CardActions, {
|
|
7626
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7627
|
-
})(templateObject_1$
|
|
7626
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$p.includes(prop); },
|
|
7627
|
+
})(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7628
7628
|
var _a = props.buttonsPosition, buttonsPosition = _a === void 0 ? "left" : _a;
|
|
7629
7629
|
var spaces = getSpaces(props);
|
|
7630
7630
|
return "\n margin: 0;\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px 0 0;\n display: flex;\n gap: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n justify-content: ").concat(buttonsPosition === "right" ? "flex-end" : "flex-start", ";\n\n & > * {\n margin: 0 !important;\n }\n ");
|
|
7631
7631
|
});
|
|
7632
|
-
var templateObject_1$
|
|
7632
|
+
var templateObject_1$I;
|
|
7633
7633
|
|
|
7634
7634
|
var isButtonElement = function (child) {
|
|
7635
7635
|
if (React__default.isValidElement(child) && child.type === Button) {
|
|
@@ -7680,7 +7680,7 @@ var ContentCardActions = forwardRef(function ContentCardActions(props, ref) {
|
|
|
7680
7680
|
return (jsx(StyledCardActions, { ref: ref, buttonsPosition: buttonsPosition, className: cn(cardActions), children: validChildren }));
|
|
7681
7681
|
});
|
|
7682
7682
|
|
|
7683
|
-
var doNotForwardProps$
|
|
7683
|
+
var doNotForwardProps$o = [
|
|
7684
7684
|
"imagePadding",
|
|
7685
7685
|
"boundingBox",
|
|
7686
7686
|
"sdsType",
|
|
@@ -7689,23 +7689,23 @@ var doNotForwardProps$n = [
|
|
|
7689
7689
|
"imagePosition",
|
|
7690
7690
|
];
|
|
7691
7691
|
var StyledImageMediaWrapper = styled$3("div", {
|
|
7692
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7693
|
-
})(templateObject_9$
|
|
7692
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
7693
|
+
})(templateObject_9$8 || (templateObject_9$8 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7694
7694
|
var _a = props.imagePadding, imagePadding = _a === void 0 ? false : _a, _b = props.boundingBox, boundingBox = _b === void 0 ? true : _b, _c = props.sdsType, sdsType = _c === void 0 ? "wide" : _c, _d = props.imagePosition, imagePosition = _d === void 0 ? "left" : _d;
|
|
7695
7695
|
var spaces = getSpaces(props);
|
|
7696
|
-
return css$2(templateObject_8$
|
|
7696
|
+
return css$2(templateObject_8$a || (templateObject_8$a = __makeTemplateObject(["\n display: flex;\n align-items: start;\n\n ", "\n\n ", "\n "], ["\n display: flex;\n align-items: start;\n\n ", "\n\n ", "\n "])), boundingBox
|
|
7697
7697
|
? imagePadding
|
|
7698
|
-
? css$2(templateObject_1$
|
|
7698
|
+
? css$2(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n padding: ", "px;\n ", "\n "], ["\n padding: ", "px;\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl, imagePosition === "left"
|
|
7699
7699
|
? "padding-right: 0;"
|
|
7700
|
-
: "padding-left: 0;") : css$2(templateObject_2$
|
|
7701
|
-
: css$2(templateObject_3$
|
|
7700
|
+
: "padding-left: 0;") : css$2(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n padding: 0;\n "], ["\n padding: 0;\n "])))
|
|
7701
|
+
: css$2(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), imagePosition === "left"
|
|
7702
7702
|
? "padding-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")
|
|
7703
|
-
: "padding-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")), sdsType === "narrow" && css$2(templateObject_7$
|
|
7703
|
+
: "padding-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")), sdsType === "narrow" && css$2(templateObject_7$a || (templateObject_7$a = __makeTemplateObject(["\n ", "\n\n justify-content: center;\n "], ["\n ", "\n\n justify-content: center;\n "])), boundingBox
|
|
7704
7704
|
? imagePadding
|
|
7705
|
-
? css$2(templateObject_4$
|
|
7706
|
-
: css$2(templateObject_6$
|
|
7705
|
+
? css$2(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n padding: ", "px;\n padding-bottom: 0;\n "], ["\n padding: ", "px;\n padding-bottom: 0;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl) : css$2(templateObject_5$f || (templateObject_5$f = __makeTemplateObject(["\n padding: 0;\n "], ["\n padding: 0;\n "])))
|
|
7706
|
+
: css$2(templateObject_6$e || (templateObject_6$e = __makeTemplateObject(["\n padding-bottom: ", "px;\n "], ["\n padding-bottom: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl)));
|
|
7707
7707
|
});
|
|
7708
|
-
var templateObject_1$
|
|
7708
|
+
var templateObject_1$H, templateObject_2$q, templateObject_3$l, templateObject_4$k, templateObject_5$f, templateObject_6$e, templateObject_7$a, templateObject_8$a, templateObject_9$8;
|
|
7709
7709
|
|
|
7710
7710
|
/**
|
|
7711
7711
|
* @see https://mui.com/material-ui/api/card-media/
|
|
@@ -7816,10 +7816,10 @@ var ContentCard = React__default.forwardRef(function (props, ref) {
|
|
|
7816
7816
|
});
|
|
7817
7817
|
|
|
7818
7818
|
// (thuang): Please keep this in sync with the props used in `ExtraProps`
|
|
7819
|
-
var doNotForwardProps$
|
|
7819
|
+
var doNotForwardProps$n = ["sdsSize"];
|
|
7820
7820
|
var StyledPaper = styled$2(Paper, {
|
|
7821
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7822
|
-
})(templateObject_1$
|
|
7821
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
7822
|
+
})(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n & {\n ", "\n\n ", "\n }\n"], ["\n & {\n ", "\n\n ", "\n }\n"])), paperDimensions, function (props) {
|
|
7823
7823
|
var _a, _b;
|
|
7824
7824
|
var sdsSize = props.sdsSize;
|
|
7825
7825
|
var spaces = getSpaces(props);
|
|
@@ -7852,7 +7852,7 @@ function paperDimensions(props) {
|
|
|
7852
7852
|
var _b = sizeToDimensions[sdsSize], width = _b.width, minHeight = _b.minHeight;
|
|
7853
7853
|
return "\n width: ".concat(width, ";\n min-height: ").concat(minHeight, ";\n max-width: revert;\n box-sizing: border-box;\n ");
|
|
7854
7854
|
}
|
|
7855
|
-
var templateObject_1$
|
|
7855
|
+
var templateObject_1$G;
|
|
7856
7856
|
|
|
7857
7857
|
/**
|
|
7858
7858
|
* @see https://mui.com/material-ui/react-paper/
|
|
@@ -7862,14 +7862,14 @@ var DialogPaper = forwardRef(function DialogPaper(props, ref) {
|
|
|
7862
7862
|
return jsx(StyledPaper, __assign({ sdsSize: sdsSize, ref: ref }, rest));
|
|
7863
7863
|
});
|
|
7864
7864
|
|
|
7865
|
-
var StyledButton$1 = styled$2(Button)(templateObject_1$
|
|
7865
|
+
var StyledButton$1 = styled$2(Button)(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n position: absolute;\n\n ", "\n"], ["\n position: absolute;\n\n ", "\n"])), function (props) {
|
|
7866
7866
|
var sdsSize = props.sdsSize;
|
|
7867
7867
|
var isSmall = sdsSize === "small" || sdsSize === "medium";
|
|
7868
7868
|
var spaces = getSpaces(props);
|
|
7869
7869
|
var right = isSmall ? spaces === null || spaces === void 0 ? void 0 : spaces.xl : spaces === null || spaces === void 0 ? void 0 : spaces.xxl;
|
|
7870
7870
|
return "\n right: ".concat(right, "px;\n ");
|
|
7871
7871
|
});
|
|
7872
|
-
var templateObject_1$
|
|
7872
|
+
var templateObject_1$F;
|
|
7873
7873
|
|
|
7874
7874
|
var SDS_SIZE_TO_COMPONENT_SIZE = {
|
|
7875
7875
|
l: "large",
|
|
@@ -7884,18 +7884,18 @@ var CloseButton = forwardRef(function CloseButton(props, ref) {
|
|
|
7884
7884
|
return (jsx(StyledButton$1, __assign({ "aria-label": "Close", ref: ref, onClick: onClick, sdsSize: size, icon: "XMark", sdsStyle: "icon", sdsType: "tertiary", className: className }, rest)));
|
|
7885
7885
|
});
|
|
7886
7886
|
|
|
7887
|
-
var doNotForwardProps$
|
|
7887
|
+
var doNotForwardProps$m = ["sdsSize"];
|
|
7888
7888
|
var StyledDialogTitle = styled$2(DialogTitle$1, {
|
|
7889
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7890
|
-
})(templateObject_1$
|
|
7889
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
7890
|
+
})(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n padding: 0;\n ", "\n"], ["\n padding: 0;\n ", "\n"])), function (props) {
|
|
7891
7891
|
var sdsSize = props.sdsSize;
|
|
7892
7892
|
var isSmall = sdsSize === "xs" || sdsSize === "s";
|
|
7893
7893
|
var spaces = getSpaces(props);
|
|
7894
7894
|
return "\n margin-bottom: ".concat(isSmall ? spaces === null || spaces === void 0 ? void 0 : spaces.l : spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;\n ");
|
|
7895
7895
|
});
|
|
7896
7896
|
var Title = styled$2(Typography, {
|
|
7897
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7898
|
-
})(templateObject_2$
|
|
7897
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
7898
|
+
})(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7899
7899
|
var _a;
|
|
7900
7900
|
var sdsSize = props.sdsSize;
|
|
7901
7901
|
var isSmall = sdsSize === "xs" || sdsSize === "s";
|
|
@@ -7906,8 +7906,8 @@ var Title = styled$2(Typography, {
|
|
|
7906
7906
|
];
|
|
7907
7907
|
});
|
|
7908
7908
|
var Subtitle = styled$2(Typography, {
|
|
7909
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7910
|
-
})(templateObject_3$
|
|
7909
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
7910
|
+
})(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7911
7911
|
var _a;
|
|
7912
7912
|
var sdsSize = props.sdsSize;
|
|
7913
7913
|
var isSmall = sdsSize === "xs" || sdsSize === "s";
|
|
@@ -7918,8 +7918,8 @@ var Subtitle = styled$2(Typography, {
|
|
|
7918
7918
|
];
|
|
7919
7919
|
});
|
|
7920
7920
|
var Overline = styled$2(Typography, {
|
|
7921
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7922
|
-
})(templateObject_4$
|
|
7921
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
7922
|
+
})(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7923
7923
|
var _a;
|
|
7924
7924
|
var sdsSize = props.sdsSize;
|
|
7925
7925
|
var isSmall = sdsSize === "xs" || sdsSize === "s";
|
|
@@ -7930,7 +7930,7 @@ var Overline = styled$2(Typography, {
|
|
|
7930
7930
|
"\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n padding-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n "),
|
|
7931
7931
|
];
|
|
7932
7932
|
});
|
|
7933
|
-
var templateObject_1$
|
|
7933
|
+
var templateObject_1$E, templateObject_2$p, templateObject_3$k, templateObject_4$j;
|
|
7934
7934
|
|
|
7935
7935
|
var DialogTitle = forwardRef(function DialogTitle(props, ref) {
|
|
7936
7936
|
var children = props.children, title = props.title, subtitle = props.subtitle, overline = props.overline, onClose = props.onClose, sdsSize = props.sdsSize, _a = props.classes, classes = _a === void 0 ? EMPTY_OBJECT : _a, rest = __rest(props, ["children", "title", "subtitle", "overline", "onClose", "sdsSize", "classes"]);
|
|
@@ -7939,16 +7939,16 @@ var DialogTitle = forwardRef(function DialogTitle(props, ref) {
|
|
|
7939
7939
|
});
|
|
7940
7940
|
|
|
7941
7941
|
// (thuang): Please keep this in sync with the props used in `DialogActionsExtraProps`
|
|
7942
|
-
var doNotForwardProps$
|
|
7942
|
+
var doNotForwardProps$l = ["buttonPosition", "sdsSize"];
|
|
7943
7943
|
var StyledDialogActions = styled$2(DialogActions$1, {
|
|
7944
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7945
|
-
})(templateObject_1$
|
|
7944
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$l.includes(prop); },
|
|
7945
|
+
})(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n padding: 0;\n\n ", "\n"], ["\n padding: 0;\n\n ", "\n"])), function (props) {
|
|
7946
7946
|
var spaces = getSpaces(props);
|
|
7947
7947
|
var _a = props.buttonPosition, buttonPosition = _a === void 0 ? "right" : _a, sdsSize = props.sdsSize;
|
|
7948
7948
|
var isSmall = sdsSize === "xs" || sdsSize === "s";
|
|
7949
7949
|
return "\n justify-content: ".concat(buttonPosition === "right" ? "flex-end" : "flex-start", ";;\n\n margin-top: ").concat(isSmall ? spaces === null || spaces === void 0 ? void 0 : spaces.xl : spaces === null || spaces === void 0 ? void 0 : spaces.xxl, "px;\n\n &.").concat(dialogActionsClasses.spacing, " > :not(:first-of-type) {\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n }\n ");
|
|
7950
7950
|
});
|
|
7951
|
-
var templateObject_1$
|
|
7951
|
+
var templateObject_1$D;
|
|
7952
7952
|
|
|
7953
7953
|
/**
|
|
7954
7954
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -7985,11 +7985,11 @@ var Dialog = forwardRef(function Dialog(props, ref) {
|
|
|
7985
7985
|
}) })));
|
|
7986
7986
|
});
|
|
7987
7987
|
|
|
7988
|
-
var doNotForwardProps$
|
|
7988
|
+
var doNotForwardProps$k = ["sdsSize"];
|
|
7989
7989
|
var StyledDialogContent = styled$2(DialogContent, {
|
|
7990
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7991
|
-
})(templateObject_1$
|
|
7992
|
-
var templateObject_1$
|
|
7990
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
7991
|
+
})(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n ", "\n padding: 0;\n"], ["\n ", "\n padding: 0;\n"])), fontBodyS$1);
|
|
7992
|
+
var templateObject_1$C;
|
|
7993
7993
|
|
|
7994
7994
|
var index = forwardRef(
|
|
7995
7995
|
/**
|
|
@@ -8034,7 +8034,7 @@ var overlayContentPositionJustifyMapping = {
|
|
|
8034
8034
|
"bottom-right": "flex-end",
|
|
8035
8035
|
};
|
|
8036
8036
|
|
|
8037
|
-
var doNotForwardProps$
|
|
8037
|
+
var doNotForwardProps$j = [
|
|
8038
8038
|
"heroHeight",
|
|
8039
8039
|
"overlayContainerMinMargin",
|
|
8040
8040
|
"backgroundFillColor",
|
|
@@ -8044,28 +8044,28 @@ var getResponsivePadding = function (props) {
|
|
|
8044
8044
|
var overlayContainerMinMargin = props.overlayContainerMinMargin;
|
|
8045
8045
|
var spaces = getSpaces(props);
|
|
8046
8046
|
var breakpoints = getBreakpoints(props);
|
|
8047
|
-
return css(templateObject_1$
|
|
8047
|
+
return css(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n padding: ", "px\n ", ";\n\n ", " {\n padding: ", "px\n ", ";\n }\n\n ", " {\n padding: ", "px\n ", ";\n }\n "], ["\n padding: ", "px\n ", ";\n\n ", " {\n padding: ", "px\n ", ";\n }\n\n ", " {\n padding: ", "px\n ", ";\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxl, (overlayContainerMinMargin === null || overlayContainerMinMargin === void 0 ? void 0 : overlayContainerMinMargin.small) || HeroMargins.SMALL, breakpoints === null || breakpoints === void 0 ? void 0 : breakpoints.up("md"), spaces === null || spaces === void 0 ? void 0 : spaces.xxl, (overlayContainerMinMargin === null || overlayContainerMinMargin === void 0 ? void 0 : overlayContainerMinMargin.medium) || HeroMargins.MEDIUM, breakpoints === null || breakpoints === void 0 ? void 0 : breakpoints.up("lg"), spaces === null || spaces === void 0 ? void 0 : spaces.xxl, (overlayContainerMinMargin === null || overlayContainerMinMargin === void 0 ? void 0 : overlayContainerMinMargin.large) || HeroMargins.LARGE);
|
|
8048
8048
|
};
|
|
8049
8049
|
// Main Hero Container
|
|
8050
8050
|
var StyledHeroContainer = styled$2("section", {
|
|
8051
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8052
|
-
})(templateObject_3$
|
|
8051
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$j.includes(prop); },
|
|
8052
|
+
})(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8053
8053
|
var _a = props.heroHeight, heroHeight = _a === void 0 ? "fit-content" : _a, overlayContentPosition = props.overlayContentPosition, backgroundFillColor = props.backgroundFillColor;
|
|
8054
8054
|
var breakpoints = getBreakpoints(props);
|
|
8055
|
-
return css(templateObject_2$
|
|
8055
|
+
return css(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n ", "\n display: flex;\n position: relative;\n overflow: hidden;\n height: ", ";\n width: 100%;\n flex-direction: column;\n align-items: ", ";\n justify-content: ", ";\n ", "\n\n ", " {\n height: fit-content;\n }\n "], ["\n ", "\n display: flex;\n position: relative;\n overflow: hidden;\n height: ", ";\n width: 100%;\n flex-direction: column;\n align-items: ", ";\n justify-content: ", ";\n ", "\n\n ", " {\n height: fit-content;\n }\n "])), getResponsivePadding(props), heroHeight, overlayContentPosition
|
|
8056
8056
|
? overlayContentPositionAlignMapping[overlayContentPosition]
|
|
8057
8057
|
: "center", overlayContentPosition
|
|
8058
8058
|
? overlayContentPositionJustifyMapping[overlayContentPosition]
|
|
8059
8059
|
: "center", backgroundFillColor ? "background-color: ".concat(backgroundFillColor, ";") : "", breakpoints === null || breakpoints === void 0 ? void 0 : breakpoints.down("md"));
|
|
8060
8060
|
});
|
|
8061
|
-
var BackgroundFillContainer = styled$2("div")(templateObject_4$
|
|
8062
|
-
var OverlayContent = styled$2("div")(templateObject_6$
|
|
8061
|
+
var BackgroundFillContainer = styled$2("div")(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 0;\n overflow: hidden;\n\n img,\n video {\n width: 100%;\n height: 100%;\n object-fit: cover;\n object-position: center;\n }\n"], ["\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n z-index: 0;\n overflow: hidden;\n\n img,\n video {\n width: 100%;\n height: 100%;\n object-fit: cover;\n object-position: center;\n }\n"])));
|
|
8062
|
+
var OverlayContent = styled$2("div")(templateObject_6$d || (templateObject_6$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8063
8063
|
var textAlignment = props.textAlignment, _a = props.overlayContentWidth, overlayContentWidth = _a === void 0 ? "100%" : _a;
|
|
8064
|
-
return css(templateObject_5$
|
|
8064
|
+
return css(templateObject_5$e || (templateObject_5$e = __makeTemplateObject(["\n position: relative;\n z-index: 1;\n display: flex;\n flex-direction: column;\n align-items: ", ";\n text-align: ", ";\n width: ", ";\n "], ["\n position: relative;\n z-index: 1;\n display: flex;\n flex-direction: column;\n align-items: ", ";\n text-align: ", ";\n width: ", ";\n "])), textAlignment
|
|
8065
8065
|
? textAlignmentMapping[textAlignment]
|
|
8066
8066
|
: "start", textAlignment, overlayContentWidth);
|
|
8067
8067
|
});
|
|
8068
|
-
var HeroTitle = styled$2("h1")(templateObject_8$
|
|
8068
|
+
var HeroTitle = styled$2("h1")(templateObject_8$9 || (templateObject_8$9 = __makeTemplateObject(["\n ", "\n\n ", "\n\n margin: 0;\n padding: 0;\n"], ["\n ", "\n\n ", "\n\n margin: 0;\n padding: 0;\n"])), function (props) {
|
|
8069
8069
|
var _a = props.headerFontSize, headerFontSize = _a === void 0 ? "m" : _a;
|
|
8070
8070
|
if (headerFontSize === "s") {
|
|
8071
8071
|
return fontHeaderS(props);
|
|
@@ -8080,22 +8080,22 @@ var HeroTitle = styled$2("h1")(templateObject_8$8 || (templateObject_8$8 = __mak
|
|
|
8080
8080
|
var _a, _b;
|
|
8081
8081
|
var hasInvertTextColor = props.hasInvertTextColor;
|
|
8082
8082
|
var semanticColors = getSemanticColors(props);
|
|
8083
|
-
return css(templateObject_7$
|
|
8083
|
+
return css(templateObject_7$9 || (templateObject_7$9 = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), hasInvertTextColor
|
|
8084
8084
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimaryInverse
|
|
8085
8085
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary);
|
|
8086
8086
|
});
|
|
8087
|
-
var HeroCaption = styled$2("p")(templateObject_10$
|
|
8087
|
+
var HeroCaption = styled$2("p")(templateObject_10$7 || (templateObject_10$7 = __makeTemplateObject(["\n ", "\n\n ", "\n\n padding: 0;\n"], ["\n ", "\n\n ", "\n\n padding: 0;\n"])), fontBodyXxxs$1, function (props) {
|
|
8088
8088
|
var _a, _b;
|
|
8089
8089
|
var hasInvertTextColor = props.hasInvertTextColor;
|
|
8090
8090
|
var semanticColors = getSemanticColors(props);
|
|
8091
8091
|
var spaces = getSpaces(props);
|
|
8092
|
-
return css(templateObject_9$
|
|
8092
|
+
return css(templateObject_9$7 || (templateObject_9$7 = __makeTemplateObject(["\n color: ", ";\n\n margin: ", "px 0 0;\n "], ["\n color: ", ";\n\n margin: ", "px 0 0;\n "])), hasInvertTextColor
|
|
8093
8093
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimaryInverse
|
|
8094
8094
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
8095
8095
|
});
|
|
8096
8096
|
var ContentSlot = styled$2("div")(templateObject_12$3 || (templateObject_12$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8097
8097
|
var spaces = getSpaces(props);
|
|
8098
|
-
return css(templateObject_11$
|
|
8098
|
+
return css(templateObject_11$6 || (templateObject_11$6 = __makeTemplateObject(["\n margin: ", "px 0 0;\n width: 100%;\n height: 100%;\n "], ["\n margin: ", "px 0 0;\n width: 100%;\n height: 100%;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l);
|
|
8099
8099
|
});
|
|
8100
8100
|
var DarkeningMask = styled$2("div")(templateObject_14$3 || (templateObject_14$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8101
8101
|
var _a = props.darkeningMaskColor, darkeningMaskColor = _a === void 0 ? "#000000" : _a, _b = props.darkeningMaskOpacity, darkeningMaskOpacity = _b === void 0 ? 0 : _b;
|
|
@@ -8132,7 +8132,7 @@ var OverlayMedia = styled$2("div")(templateObject_21$2 || (templateObject_21$2 =
|
|
|
8132
8132
|
: overlayMediaMargin === null || overlayMediaMargin === void 0 ? void 0 : overlayMediaMargin.small
|
|
8133
8133
|
: "0");
|
|
8134
8134
|
});
|
|
8135
|
-
var templateObject_1$
|
|
8135
|
+
var templateObject_1$B, templateObject_2$o, templateObject_3$j, templateObject_4$i, templateObject_5$e, templateObject_6$d, templateObject_7$9, templateObject_8$9, templateObject_9$7, templateObject_10$7, templateObject_11$6, templateObject_12$3, templateObject_13$3, templateObject_14$3, templateObject_15$3, templateObject_16$3, templateObject_17$3, templateObject_18$3, templateObject_19$2, templateObject_20$2, templateObject_21$2;
|
|
8136
8136
|
|
|
8137
8137
|
var Hero = React__default.forwardRef(function (props, ref) {
|
|
8138
8138
|
var heroHeight = props.heroHeight, children = props.children, headerText = props.headerText, captionText = props.captionText, headerFontSize = props.headerFontSize, hasInvertTextColor = props.hasInvertTextColor, overlayContentWidth = props.overlayContentWidth, textAlignment = props.textAlignment, darkeningMask = props.darkeningMask, _a = props.darkeningMaskColor, darkeningMaskColor = _a === void 0 ? "#000000" : _a, _b = props.darkeningMaskOpacity, darkeningMaskOpacity = _b === void 0 ? 0 : _b, darkeningVignette = props.darkeningVignette, overlayMedia = props.overlayMedia, overlayMediaPosition = props.overlayMediaPosition, overlayMediaMaxHeight = props.overlayMediaMaxHeight, overlayMediaMaxWidth = props.overlayMediaMaxWidth, overlayMediaMargin = props.overlayMediaMargin, backgroundFill = props.backgroundFill, rest = __rest(props, ["heroHeight", "children", "headerText", "captionText", "headerFontSize", "hasInvertTextColor", "overlayContentWidth", "textAlignment", "darkeningMask", "darkeningMaskColor", "darkeningMaskOpacity", "darkeningVignette", "overlayMedia", "overlayMediaPosition", "overlayMediaMaxHeight", "overlayMediaMaxWidth", "overlayMediaMargin", "backgroundFill"]);
|
|
@@ -8149,11 +8149,11 @@ var intentToColor$1 = {
|
|
|
8149
8149
|
notice: "notice",
|
|
8150
8150
|
positive: "positive",
|
|
8151
8151
|
};
|
|
8152
|
-
var StyledIcon = styled$2(Icon)(templateObject_1$
|
|
8152
|
+
var StyledIcon = styled$2(Icon)(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8153
8153
|
var iconSizes = getIconSizes(props);
|
|
8154
8154
|
return "\n height: ".concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width, "px;\n ");
|
|
8155
8155
|
});
|
|
8156
|
-
var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$
|
|
8156
|
+
var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8157
8157
|
var _a;
|
|
8158
8158
|
var _b = props.intent, intent = _b === void 0 ? "default" : _b;
|
|
8159
8159
|
var iconSizes = getIconSizes(props);
|
|
@@ -8161,22 +8161,22 @@ var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$m || (template
|
|
|
8161
8161
|
var borderColor = intentToColor$1[intent];
|
|
8162
8162
|
return "\n height: ".concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, "px;\n border: ").concat((_a = borders === null || borders === void 0 ? void 0 : borders[borderColor]) === null || _a === void 0 ? void 0 : _a.default, ";\n border-radius: 2px;\n ");
|
|
8163
8163
|
});
|
|
8164
|
-
var StyledCheckboxCheckedIcon = styled$2("div")(templateObject_3$
|
|
8164
|
+
var StyledCheckboxCheckedIcon = styled$2("div")(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8165
8165
|
var _a, _b;
|
|
8166
8166
|
var iconSizes = getIconSizes(props);
|
|
8167
8167
|
var semanticColors = getSemanticColors(props);
|
|
8168
8168
|
return "\n display: flex;\n align-items: center;\n justify-content: center;\n height: ".concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, "px;\n border-radius: 2px;\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.ornament, ";\n\n ").concat(StyledIcon, " {\n fill: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimaryInverse, ";\n }\n ");
|
|
8169
8169
|
});
|
|
8170
|
-
var StyledCheckbox = styled$2(Checkbox)(templateObject_4$
|
|
8170
|
+
var StyledCheckbox = styled$2(Checkbox)(templateObject_4$h || (templateObject_4$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8171
8171
|
var spaces = getSpaces(props);
|
|
8172
8172
|
return "\n &.".concat(checkboxClasses.root, " {\n ").concat(focusVisibleA11yStyle(props), "\n \n padding: 0;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n border-radius: 0;\n\n &:hover {\n background-color: transparent;\n }\n }\n ");
|
|
8173
8173
|
});
|
|
8174
|
-
var StyledLabelContainer$1 = styled$2("span")(templateObject_5$
|
|
8175
|
-
var StyledCheckboxLabel = styled$2("span")(templateObject_6$
|
|
8174
|
+
var StyledLabelContainer$1 = styled$2("span")(templateObject_5$d || (templateObject_5$d = __makeTemplateObject(["\n display: flex;\n justify-content: start;\n flex-direction: column;\n"], ["\n display: flex;\n justify-content: start;\n flex-direction: column;\n"])));
|
|
8175
|
+
var StyledCheckboxLabel = styled$2("span")(templateObject_6$c || (templateObject_6$c = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
8176
8176
|
var spaces = getSpaces(props);
|
|
8177
8177
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
8178
8178
|
});
|
|
8179
|
-
var StyledCheckboxCaption = styled$2("span")(templateObject_7$
|
|
8179
|
+
var StyledCheckboxCaption = styled$2("span")(templateObject_7$8 || (templateObject_7$8 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
8180
8180
|
var _a;
|
|
8181
8181
|
var semanticColors = getSemanticColors(props);
|
|
8182
8182
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
@@ -8187,7 +8187,7 @@ var disabledStyles$1 = function (props) {
|
|
|
8187
8187
|
var borders = getBorders(props);
|
|
8188
8188
|
return "\n user-select: none;\n\n ".concat(StyledCheckboxDefaultIcon, " {\n border: ").concat((_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.disabled, ";\n }\n\n ").concat(StyledCheckboxCheckedIcon, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentDisabled, ";\n }\n\n ").concat(StyledCheckboxCaption, " {\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textDisabled, ";\n }\n\n &:hover, &:active {\n ").concat(StyledCheckboxDefaultIcon, " {\n border: ").concat((_d = borders === null || borders === void 0 ? void 0 : borders.base) === null || _d === void 0 ? void 0 : _d.disabled, ";\n }\n\n ").concat(StyledCheckboxCheckedIcon, " {\n background-color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.ornamentDisabled, ";\n }\n }\n ");
|
|
8189
8189
|
};
|
|
8190
|
-
var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$
|
|
8190
|
+
var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$8 || (templateObject_8$8 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8191
8191
|
var _a, _b, _c, _d, _e;
|
|
8192
8192
|
var disabled = props.disabled;
|
|
8193
8193
|
var spaces = getSpaces(props);
|
|
@@ -8195,7 +8195,7 @@ var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$7 ||
|
|
|
8195
8195
|
var borders = getBorders(props);
|
|
8196
8196
|
return "\n align-items: start;\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n margin-left: 0;\n margin-right: 0;\n width: fit-content;\n\n &:hover {\n ").concat(StyledCheckboxDefaultIcon, " {\n border: ").concat((_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.hover, ";\n background-color: ").concat(disabled ? "transparent" : (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n }\n\n ").concat(StyledCheckboxCheckedIcon, " {\n background-color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.fillHover, ";\n }\n }\n\n &:active {\n ").concat(StyledCheckboxDefaultIcon, " {\n border: ").concat((_d = borders === null || borders === void 0 ? void 0 : borders.base) === null || _d === void 0 ? void 0 : _d.pressed, ";\n }\n\n ").concat(StyledCheckboxCheckedIcon, " {\n background-color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.fillPressed, ";\n }\n }\n\n ").concat(disabled && disabledStyles$1(props), "\n ");
|
|
8197
8197
|
});
|
|
8198
|
-
var templateObject_1$
|
|
8198
|
+
var templateObject_1$A, templateObject_2$n, templateObject_3$i, templateObject_4$h, templateObject_5$d, templateObject_6$c, templateObject_7$8, templateObject_8$8;
|
|
8199
8199
|
|
|
8200
8200
|
/**
|
|
8201
8201
|
* @see https://mui.com/material-ui/react-checkbox/
|
|
@@ -8227,12 +8227,12 @@ var intentToColor = {
|
|
|
8227
8227
|
notice: "notice",
|
|
8228
8228
|
positive: "positive",
|
|
8229
8229
|
};
|
|
8230
|
-
var StyledRadioDot = styled$2("span")(templateObject_1$
|
|
8230
|
+
var StyledRadioDot = styled$2("span")(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8231
8231
|
var _a;
|
|
8232
8232
|
var semanticColors = getSemanticColors(props);
|
|
8233
8233
|
return "\n height: 6px;\n width: 6px;\n border-radius: 50%;\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentPrimaryInverse, ";\n ");
|
|
8234
8234
|
});
|
|
8235
|
-
var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$
|
|
8235
|
+
var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8236
8236
|
var _a;
|
|
8237
8237
|
var _b = props.intent, intent = _b === void 0 ? "default" : _b;
|
|
8238
8238
|
var iconSizes = getIconSizes(props);
|
|
@@ -8240,22 +8240,22 @@ var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$l || (templateObj
|
|
|
8240
8240
|
var borderColor = intentToColor[intent];
|
|
8241
8241
|
return "\n height: ".concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, "px;\n border: ").concat((_a = borders === null || borders === void 0 ? void 0 : borders[borderColor]) === null || _a === void 0 ? void 0 : _a.default, ";\n border-radius: 50%;\n ");
|
|
8242
8242
|
});
|
|
8243
|
-
var StyledRadioCheckedIcon = styled$2("div")(templateObject_3$
|
|
8243
|
+
var StyledRadioCheckedIcon = styled$2("div")(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8244
8244
|
var _a;
|
|
8245
8245
|
var iconSizes = getIconSizes(props);
|
|
8246
8246
|
var semanticColors = getSemanticColors(props);
|
|
8247
8247
|
return "\n display: flex;\n align-items: center;\n justify-content: center;\n height: ".concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, "px;\n border-radius: 50%;\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.fillPrimary, ";\n ");
|
|
8248
8248
|
});
|
|
8249
|
-
var StyledRadioButton = styled$2(Radio)(templateObject_4$
|
|
8249
|
+
var StyledRadioButton = styled$2(Radio)(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8250
8250
|
var spaces = getSpaces(props);
|
|
8251
8251
|
return "\n &.".concat(radioClasses.root, " {\n ").concat(focusVisibleA11yStyle(props), "\n margin: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px 0 0;\n padding: 0;\n }\n ");
|
|
8252
8252
|
});
|
|
8253
|
-
var StyledLabelContainer = styled$2("span")(templateObject_5$
|
|
8254
|
-
var StyledRadioLabel = styled$2("span")(templateObject_6$
|
|
8253
|
+
var StyledLabelContainer = styled$2("span")(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n display: flex;\n justify-content: start;\n flex-direction: column;\n"], ["\n display: flex;\n justify-content: start;\n flex-direction: column;\n"])));
|
|
8254
|
+
var StyledRadioLabel = styled$2("span")(templateObject_6$b || (templateObject_6$b = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
8255
8255
|
var spaces = getSpaces(props);
|
|
8256
8256
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
8257
8257
|
});
|
|
8258
|
-
var StyledRadioCaption = styled$2("span")(templateObject_7$
|
|
8258
|
+
var StyledRadioCaption = styled$2("span")(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
8259
8259
|
var _a;
|
|
8260
8260
|
var semanticColors = getSemanticColors(props);
|
|
8261
8261
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
@@ -8265,14 +8265,14 @@ var disabledStyles = function (props) {
|
|
|
8265
8265
|
var semanticColors = getSemanticColors(props);
|
|
8266
8266
|
return "\n user-select: none;\n\n ".concat(StyledRadioCaption, " {\n color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textDisabled, ";\n }\n\n ").concat(StyledRadioDefaultIcon, " {\n border: 1px solid ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderPrimaryDisabled, ";\n }\n\n ").concat(StyledRadioCheckedIcon, " {\n background-color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.ornamentDisabled, ";\n }\n\n &:hover, &:active {\n ").concat(StyledRadioDefaultIcon, " {\n border: 1px solid ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.borderPrimaryDisabled, ";\n }\n\n ").concat(StyledRadioCheckedIcon, " {\n background-color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.ornamentDisabled, ";\n }\n }\n ");
|
|
8267
8267
|
};
|
|
8268
|
-
var StyledFormControlLabel = styled$2(FormControlLabel)(templateObject_8$
|
|
8268
|
+
var StyledFormControlLabel = styled$2(FormControlLabel)(templateObject_8$7 || (templateObject_8$7 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8269
8269
|
var _a, _b, _c, _d, _e;
|
|
8270
8270
|
var disabled = props.disabled;
|
|
8271
8271
|
var spaces = getSpaces(props);
|
|
8272
8272
|
var semanticColors = getSemanticColors(props);
|
|
8273
8273
|
return "\n align-items: start;\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n margin-left: 0;\n margin-right: 0;\n width: fit-content;\n\n &:hover {\n ").concat(StyledRadioDefaultIcon, " {\n border: 1px solid ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryHover, "; \n background-color: ").concat(disabled ? "transparent" : (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n }\n\n ").concat(StyledRadioCheckedIcon, " {\n background-color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.fillHover, ";\n }\n }\n\n &:active {\n ").concat(StyledRadioDefaultIcon, " {\n border: 1px solid ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.borderPrimaryPressed, ";\n }\n\n ").concat(StyledRadioCheckedIcon, " {\n background-color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.fillPressed, ";\n }\n }\n\n ").concat(disabled && disabledStyles(props), "\n ");
|
|
8274
8274
|
});
|
|
8275
|
-
var templateObject_1$
|
|
8275
|
+
var templateObject_1$z, templateObject_2$m, templateObject_3$h, templateObject_4$g, templateObject_5$c, templateObject_6$b, templateObject_7$7, templateObject_8$7;
|
|
8276
8276
|
|
|
8277
8277
|
/**
|
|
8278
8278
|
* @see https://mui.com/material-ui/react-radio-button/
|
|
@@ -8319,11 +8319,11 @@ var disabledSlider = function (props) {
|
|
|
8319
8319
|
var semanticColors = getSemanticColors(props);
|
|
8320
8320
|
return "\n .".concat(sliderClasses.track, " {\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.fillDisabled, ";\n }\n\n .").concat(sliderClasses.thumb, ".").concat(sliderClasses.disabled, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillDisabled, ";\n }\n\n .").concat(sliderClasses.valueLabel, " {\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textDisabled, ";\n background-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.backgroundSecondary, ";\n \n & * {\n color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textDisabled, ";\n }\n }\n\n .").concat(sliderClasses.markLabel, " {\n color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textDisabled, ";\n }\n\n .").concat(sliderClasses.mark, " {\n background-color: ").concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.fillPrimary, ";\n }\n ");
|
|
8321
8321
|
};
|
|
8322
|
-
var StyledSlider = styled$2(Slider)(templateObject_1$
|
|
8322
|
+
var StyledSlider = styled$2(Slider)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
8323
8323
|
var disabled = props.disabled;
|
|
8324
8324
|
return "\n ".concat(inputSlider(props), "\n ").concat(horizontal(props), "\n ").concat(disabled ? disabledSlider(props) : "", "\n ");
|
|
8325
8325
|
});
|
|
8326
|
-
var templateObject_1$
|
|
8326
|
+
var templateObject_1$y;
|
|
8327
8327
|
|
|
8328
8328
|
/**
|
|
8329
8329
|
* @see https://mui.com/material-ui/react-slider/
|
|
@@ -8350,19 +8350,19 @@ var applyIntentColor = function (props, intent) {
|
|
|
8350
8350
|
var _a, _b, _c, _d;
|
|
8351
8351
|
var borders = getBorders(props);
|
|
8352
8352
|
var semanticColors = getSemanticColors(props);
|
|
8353
|
-
return css(templateObject_1$
|
|
8353
|
+
return css(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "], ["\n .", " .", " {\n border: ", ";\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", " {\n .", " {\n border: ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "])), outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _a === void 0 ? void 0 : _a.default, outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _c === void 0 ? void 0 : _c.default, inputAdornmentClasses.root, buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _d === void 0 ? void 0 : _d.ornament);
|
|
8354
8354
|
};
|
|
8355
8355
|
var disabledStyled$1 = function (props) {
|
|
8356
8356
|
var _a, _b, _c;
|
|
8357
8357
|
var borders = getBorders(props);
|
|
8358
8358
|
var semanticColors = getSemanticColors(props);
|
|
8359
|
-
return css(templateObject_2$
|
|
8359
|
+
return css(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n .", " {\n .", " {\n border: ", ";\n opacity: 1;\n }\n\n &:hover .", " {\n border: ", ";\n background-color: unset;\n opacity: 1;\n }\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n "], ["\n .", " {\n .", " {\n border: ", ";\n opacity: 1;\n }\n\n &:hover .", " {\n border: ", ";\n background-color: unset;\n opacity: 1;\n }\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n "])), outlinedInputClasses.disabled, outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.disabled, outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.disabled, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textDisabled);
|
|
8360
8360
|
};
|
|
8361
8361
|
var textArea = function (props) {
|
|
8362
8362
|
var spaces = getSpaces(props);
|
|
8363
|
-
return css(templateObject_3$
|
|
8363
|
+
return css(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n .", " {\n padding: ", "px;\n\n > .", " {\n padding: ", "px ", "px ", "px;\n resize: both;\n }\n }\n "], ["\n .", " {\n padding: ", "px;\n\n > .", " {\n padding: ", "px ", "px ", "px;\n resize: both;\n }\n }\n "])), outlinedInputClasses.multiline, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, outlinedInputClasses.inputMultiline, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
8364
8364
|
};
|
|
8365
|
-
var StyledLabel$
|
|
8365
|
+
var StyledLabel$2 = styled$2("label")(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n display: block;\n ", "\n\n ", "\n"], ["\n display: block;\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
8366
8366
|
var spaces = getSpaces(props);
|
|
8367
8367
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
8368
8368
|
});
|
|
@@ -8370,16 +8370,16 @@ var StyledInputBase = styled$2(TextField, {
|
|
|
8370
8370
|
shouldForwardProp: function (prop) {
|
|
8371
8371
|
return !sdsPropNames$1.includes(prop.toString());
|
|
8372
8372
|
},
|
|
8373
|
-
})(templateObject_6$
|
|
8373
|
+
})(templateObject_6$a || (templateObject_6$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8374
8374
|
var _a, _b, _c, _d, _e;
|
|
8375
8375
|
var intent = props.intent, sdsType = props.sdsType, disabled = props.disabled;
|
|
8376
8376
|
var spaces = getSpaces(props);
|
|
8377
8377
|
var borders = getBorders(props);
|
|
8378
8378
|
var corners = getCorners(props);
|
|
8379
8379
|
var semanticColors = getSemanticColors(props);
|
|
8380
|
-
return css(templateObject_5$
|
|
8380
|
+
return css(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n margin-bottom: ", "px;\n margin-right: ", "px;\n display: block;\n\n .", " {\n width: 100%;\n }\n\n .", " {\n ", "\n padding: ", "px ", "px;\n height: unset;\n box-sizing: border-box;\n }\n\n .", " {\n border-radius: ", "px;\n border: ", ";\n }\n\n .", " {\n outline: none;\n border-radius: 4px;\n width: 100%;\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n\n &.user-is-tabbing .", " {\n ", "\n }\n\n .", ":hover\n .", " {\n border: ", ";\n background-color: ", ";\n }\n\n .", ".", "\n .", " {\n border: ", ";\n }\n\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n margin-bottom: ", "px;\n margin-right: ", "px;\n display: block;\n\n .", " {\n width: 100%;\n }\n\n .", " {\n ", "\n padding: ", "px ", "px;\n height: unset;\n box-sizing: border-box;\n }\n\n .", " {\n border-radius: ", "px;\n border: ", ";\n }\n\n .", " {\n outline: none;\n border-radius: 4px;\n width: 100%;\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n\n &.user-is-tabbing .", " {\n ", "\n }\n\n .", ":hover\n .", " {\n border: ", ";\n background-color: ", ";\n }\n\n .", ".", "\n .", " {\n border: ", ";\n }\n\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.m, outlinedInputClasses.root, outlinedInputClasses.inputSizeSmall, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.m, outlinedInputClasses.notchedOutline, corners === null || corners === void 0 ? void 0 : corners.l, (_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.default, outlinedInputClasses.input, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textTertiary, outlinedInputClasses.input, focusVisibleA11yStyle(props), outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders.base) === null || _c === void 0 ? void 0 : _c.hover, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.fillHover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_e = borders === null || borders === void 0 ? void 0 : borders.accent) === null || _e === void 0 ? void 0 : _e.default, sdsType === "textArea" && textArea(props), intent === "negative" && applyIntentColor(props, "negative"), intent === "notice" && applyIntentColor(props, "notice"), intent === "positive" && applyIntentColor(props, "positive"), disabled && disabledStyled$1(props));
|
|
8381
8381
|
});
|
|
8382
|
-
var templateObject_1$
|
|
8382
|
+
var templateObject_1$x, templateObject_2$l, templateObject_3$g, templateObject_4$f, templateObject_5$b, templateObject_6$a;
|
|
8383
8383
|
|
|
8384
8384
|
/**
|
|
8385
8385
|
* @see https://mui.com/material-ui/react-text-field/
|
|
@@ -8408,7 +8408,7 @@ var InputText = forwardRef(function InputText(props, ref) {
|
|
|
8408
8408
|
console.error("Error: @czi-sds/components component InputText requires id and label props for accessibility.");
|
|
8409
8409
|
return jsx(Fragment, {});
|
|
8410
8410
|
}
|
|
8411
|
-
var finalLabel = typeof label === "string" ? (jsx(StyledLabel$
|
|
8411
|
+
var finalLabel = typeof label === "string" ? (jsx(StyledLabel$2, { htmlFor: id, className: cn(labelClassName), children: label })) : (label);
|
|
8412
8412
|
return (jsxs("div", { className: cn(rootClassName), children: [!hideLabel && finalLabel, jsx(StyledInputBase, __assign({ className: cn(inputClassName, className), ref: ref ? ref : inputRef, inputProps: inputProps, type: "text", multiline: sdsType === "textArea", minRows: sdsType === "textArea" ? 4 : 2, id: id, intent: intent, variant: "outlined", size: "small", placeholder: placeholder, sdsType: sdsType }, rest))] }));
|
|
8413
8413
|
});
|
|
8414
8414
|
|
|
@@ -8440,11 +8440,11 @@ var toggleOff = function (props) {
|
|
|
8440
8440
|
: (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentSecondary, ";\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n }\n\n .").concat(switchClasses.switchBase, " {\n right: unset;\n left: 0;\n transform: unset;\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n\n .MuiIconButton-label {\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n }\n\n &:after {\n color: ").concat(disabled ? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textDisabled : (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textSecondary, ";\n content: ").concat(JSON.stringify(value), ";\n }\n\n &:hover {\n background-color: ").concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.fillHover, ";\n }\n }\n\n &:hover {\n .").concat(switchClasses.switchBase, " {\n &:after {\n color: ").concat(disabled ? (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.textDisabled : (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.textPrimary, ";\n }\n }\n }\n\n .").concat(switchClasses.track, " {\n background-color: transparent !important;\n opacity: 1 !important;\n }\n\n ").concat(!disabled &&
|
|
8441
8441
|
"&:hover {\n outline: ".concat((_k = borders === null || borders === void 0 ? void 0 : borders.base) === null || _k === void 0 ? void 0 : _k.hover, ";\n\n .").concat(switchClasses.thumb, " {\n color: ").concat((_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _l === void 0 ? void 0 : _l.ornamentSecondaryHover, ";\n }\n }"), "\n ");
|
|
8442
8442
|
};
|
|
8443
|
-
var Toggle = styled$2(Switch)(templateObject_1$
|
|
8443
|
+
var Toggle = styled$2(Switch)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
8444
8444
|
var checked = props.checked;
|
|
8445
8445
|
return "\n ".concat(toggle(props), "\n ").concat(checked ? toggleOn(props) : toggleOff(props), "\n ");
|
|
8446
8446
|
});
|
|
8447
|
-
var templateObject_1$
|
|
8447
|
+
var templateObject_1$w;
|
|
8448
8448
|
|
|
8449
8449
|
/**
|
|
8450
8450
|
* @see https://mui.com/material-ui/react-switch/
|
|
@@ -8462,14 +8462,14 @@ var InputToggle = function (props) {
|
|
|
8462
8462
|
return (jsx(Toggle, __assign({ checked: finalChecked, color: "primary", onChange: handleChange, value: labelValue }, rest)));
|
|
8463
8463
|
};
|
|
8464
8464
|
|
|
8465
|
-
var doNotForwardProps$
|
|
8465
|
+
var doNotForwardProps$i = ["sdsStyle", "sdsSize", "fontWeight"];
|
|
8466
8466
|
var defaultStyle = function (props) {
|
|
8467
8467
|
var _a, _b, _c, _d;
|
|
8468
8468
|
var semanticColors = getSemanticColors(props);
|
|
8469
|
-
return css(templateObject_1$
|
|
8469
|
+
return css(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n color: ", ";\n position: relative;\n text-decoration: none;\n text-underline-offset: 2.5px;\n\n &:hover {\n color: ", ";\n text-decoration: underline;\n }\n\n &:focus {\n color: ", ";\n text-decoration: underline;\n }\n\n &:active {\n color: ", ";\n text-decoration: underline;\n }\n "], ["\n color: ", ";\n position: relative;\n text-decoration: none;\n text-underline-offset: 2.5px;\n\n &:hover {\n color: ", ";\n text-decoration: underline;\n }\n\n &:focus {\n color: ", ";\n text-decoration: underline;\n }\n\n &:active {\n color: ", ";\n text-decoration: underline;\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.textAction, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.textActionHover, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.textActionHover, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.textActionPressed);
|
|
8470
8470
|
};
|
|
8471
8471
|
var dashedStyle = function () {
|
|
8472
|
-
return css(templateObject_2$
|
|
8472
|
+
return css(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n color: inherit;\n position: relative;\n text-decoration: underline dashed;\n text-underline-offset: 2.5px;\n\n &:hover,\n &:focus,\n &:active,\n &:focus-visible {\n text-decoration-style: solid;\n }\n "], ["\n color: inherit;\n position: relative;\n text-decoration: underline dashed;\n text-underline-offset: 2.5px;\n\n &:hover,\n &:focus,\n &:active,\n &:focus-visible {\n text-decoration-style: solid;\n }\n "])));
|
|
8473
8473
|
};
|
|
8474
8474
|
var smallStyle = function (props) {
|
|
8475
8475
|
return fontBodyS$1(props);
|
|
@@ -8479,13 +8479,13 @@ var extraSmallStyle = function (props) {
|
|
|
8479
8479
|
};
|
|
8480
8480
|
var StyledLink = styled$2(Link$1, {
|
|
8481
8481
|
shouldForwardProp: function (prop) {
|
|
8482
|
-
return !doNotForwardProps$
|
|
8482
|
+
return !doNotForwardProps$i.includes(prop.toString());
|
|
8483
8483
|
},
|
|
8484
|
-
})(templateObject_4$
|
|
8484
|
+
})(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n all: unset;\n\n ", "\n\n ", "\n"], ["\n all: unset;\n\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
8485
8485
|
var _a = props.fontWeight, fontWeight = _a === void 0 ? "normal" : _a, _b = props.sdsStyle, sdsStyle = _b === void 0 ? "default" : _b, _c = props.sdsSize, sdsSize = _c === void 0 ? "s" : _c;
|
|
8486
|
-
return css(templateObject_3$
|
|
8486
|
+
return css(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n\n font-weight: ", ";\n display: inline-block;\n cursor: pointer;\n "], ["\n ", "\n ", "\n ", "\n ", "\n\n font-weight: ", ";\n display: inline-block;\n cursor: pointer;\n "])), sdsStyle === "default" && defaultStyle(props), sdsStyle === "dashed" && dashedStyle(), sdsSize === "s" && smallStyle(props), sdsSize === "xs" && extraSmallStyle(props), fontWeight === "normal" ? "400" : "600");
|
|
8487
8487
|
});
|
|
8488
|
-
var templateObject_1$
|
|
8488
|
+
var templateObject_1$v, templateObject_2$k, templateObject_3$f, templateObject_4$e;
|
|
8489
8489
|
|
|
8490
8490
|
/**
|
|
8491
8491
|
* @see https://mui.com/material-ui/react-link/
|
|
@@ -8496,10 +8496,10 @@ var Link = forwardRef(function (props, ref) {
|
|
|
8496
8496
|
});
|
|
8497
8497
|
|
|
8498
8498
|
// (thuang): Please keep this in sync with the props used in `ListExtraProps`
|
|
8499
|
-
var doNotForwardProps$
|
|
8499
|
+
var doNotForwardProps$h = ["marginBottom", "ordered"];
|
|
8500
8500
|
var StyledList = styled$2(List$1, {
|
|
8501
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8502
|
-
})(templateObject_1$
|
|
8501
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$h.includes(prop); },
|
|
8502
|
+
})(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n .MuiListSubheader-root {\n ", "\n }\n\n ", "\n"], ["\n .MuiListSubheader-root {\n ", "\n }\n\n ", "\n"])), propsToMarginBottom$1, function (props) {
|
|
8503
8503
|
if (!props.ordered)
|
|
8504
8504
|
return "";
|
|
8505
8505
|
return "\n counter-reset: section;\n ";
|
|
@@ -8517,7 +8517,7 @@ function propsToMarginBottom$1(props) {
|
|
|
8517
8517
|
var marginBottom = props.marginBottom;
|
|
8518
8518
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "s"], "px;\n ");
|
|
8519
8519
|
}
|
|
8520
|
-
var templateObject_1$
|
|
8520
|
+
var templateObject_1$u;
|
|
8521
8521
|
|
|
8522
8522
|
/**
|
|
8523
8523
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -8534,10 +8534,10 @@ var fontBodyXs$1 = fontBody("xs");
|
|
|
8534
8534
|
var fontBodyXxs = fontBody("xxs");
|
|
8535
8535
|
var fontBodyXxxs = fontBody("xxxs");
|
|
8536
8536
|
// (thuang): Please keep this in sync with the props used in `ListItemExtraProps`
|
|
8537
|
-
var doNotForwardProps$
|
|
8537
|
+
var doNotForwardProps$g = ["marginBottom", "fontSize", "ordered"];
|
|
8538
8538
|
var StyledListItem = styled$2(ListItem$1, {
|
|
8539
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8540
|
-
})(templateObject_1$
|
|
8539
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
8540
|
+
})(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n ", "\n ", "\n\n padding: 0;\n\n ", "\n\n &:before {\n display: inline-block;\n\n ", "\n }\n"], ["\n ", "\n ", "\n\n padding: 0;\n\n ", "\n\n &:before {\n display: inline-block;\n\n ", "\n }\n"])), propsToMarginBottom, propsToFontBody, function (props) {
|
|
8541
8541
|
var ordered = props.ordered;
|
|
8542
8542
|
return "\n align-items: flex-start;\n ".concat(ordered ? "counter-increment: section;" : "", "\n ");
|
|
8543
8543
|
}, function (props) {
|
|
@@ -8568,11 +8568,11 @@ function propsToMarginBottom(props) {
|
|
|
8568
8568
|
var marginBottom = props.marginBottom;
|
|
8569
8569
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "xs"], "px;\n ");
|
|
8570
8570
|
}
|
|
8571
|
-
var ListItemLabel = styled$2("span")(templateObject_2$
|
|
8571
|
+
var ListItemLabel = styled$2("span")(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n margin-right: 5px;\n\n ", "\n"], ["\n margin-right: 5px;\n\n ", "\n"])), function (props) {
|
|
8572
8572
|
var fontWeights = getFontWeights(props);
|
|
8573
8573
|
return "\n font-weight: ".concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n ");
|
|
8574
8574
|
});
|
|
8575
|
-
var templateObject_1$
|
|
8575
|
+
var templateObject_1$t, templateObject_2$j;
|
|
8576
8576
|
|
|
8577
8577
|
/**
|
|
8578
8578
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -8582,11 +8582,11 @@ var ListItem = function (props) {
|
|
|
8582
8582
|
};
|
|
8583
8583
|
|
|
8584
8584
|
var fontHeaderM = fontHeader("m");
|
|
8585
|
-
var StyledListSubheader = styled$2(ListSubheader$1)(templateObject_1$
|
|
8585
|
+
var StyledListSubheader = styled$2(ListSubheader$1)(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n &.MuiListSubheader-root {\n ", "\n\n line-height: unset;\n color: unset;\n\n ", "\n }\n"], ["\n &.MuiListSubheader-root {\n ", "\n\n line-height: unset;\n color: unset;\n\n ", "\n }\n"])), fontHeaderM, function (props) {
|
|
8586
8586
|
var spaces = getSpaces(props);
|
|
8587
8587
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n ");
|
|
8588
8588
|
});
|
|
8589
|
-
var templateObject_1$
|
|
8589
|
+
var templateObject_1$s;
|
|
8590
8590
|
|
|
8591
8591
|
/**
|
|
8592
8592
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -8595,7 +8595,7 @@ var ListSubheader = function (props) {
|
|
|
8595
8595
|
return jsx(StyledListSubheader, __assign({ disableGutters: true }, props));
|
|
8596
8596
|
};
|
|
8597
8597
|
|
|
8598
|
-
var StyledText = styled$2("span")(templateObject_1$
|
|
8598
|
+
var StyledText = styled$2("span")(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8599
8599
|
var spaces = getSpaces(props);
|
|
8600
8600
|
return "\n margin: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
8601
8601
|
});
|
|
@@ -8603,38 +8603,38 @@ var minimal = function (props) {
|
|
|
8603
8603
|
var _a, _b;
|
|
8604
8604
|
var iconSizes = getIconSizes(props);
|
|
8605
8605
|
var semanticColors = getSemanticColors(props);
|
|
8606
|
-
return css(templateObject_2$
|
|
8606
|
+
return css(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n ", "\n\n color: ", ";\n\n svg {\n height: ", "px;\n width: ", "px;\n\n path {\n fill: ", ";\n }\n }\n "], ["\n ", "\n\n color: ", ";\n\n svg {\n height: ", "px;\n width: ", "px;\n\n path {\n fill: ", ";\n }\n }\n "])), fontBodyS$1(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondary);
|
|
8607
8607
|
};
|
|
8608
8608
|
var tag = function (props) {
|
|
8609
8609
|
var _a, _b, _c;
|
|
8610
8610
|
var corners = getCorners(props);
|
|
8611
8611
|
var semanticColors = getSemanticColors(props);
|
|
8612
|
-
return css(templateObject_3$
|
|
8612
|
+
return css(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n ", "\n\n background-color: ", ";\n border-radius: ", "px;\n color: ", ";\n\n svg {\n path {\n fill: ", ";\n }\n }\n "], ["\n ", "\n\n background-color: ", ";\n border-radius: ", "px;\n color: ", ";\n\n svg {\n path {\n fill: ", ";\n }\n }\n "])), fontCapsXxxxs(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.surfaceSecondary, corners === null || corners === void 0 ? void 0 : corners.rounded, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.textAction, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.ornament);
|
|
8613
8613
|
};
|
|
8614
|
-
var doNotForwardProps$
|
|
8614
|
+
var doNotForwardProps$f = ["sdsStyle"];
|
|
8615
8615
|
var StyledLoadingIndicator = styled$2("div", {
|
|
8616
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8617
|
-
})(templateObject_6$
|
|
8616
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
8617
|
+
})(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8618
8618
|
var sdsStyle = props.sdsStyle;
|
|
8619
8619
|
var spaces = getSpaces(props);
|
|
8620
|
-
var style = css(templateObject_4$
|
|
8621
|
-
return css(templateObject_5$
|
|
8620
|
+
var style = css(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n padding: ", "px;\n "], ["\n display: inline-flex;\n align-items: center;\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxs);
|
|
8621
|
+
return css(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n "])), style, sdsStyle === "minimal" && minimal(props), sdsStyle === "tag" && tag(props));
|
|
8622
8622
|
});
|
|
8623
|
-
var templateObject_1$
|
|
8623
|
+
var templateObject_1$r, templateObject_2$i, templateObject_3$e, templateObject_4$d, templateObject_5$a, templateObject_6$9;
|
|
8624
8624
|
|
|
8625
8625
|
var LoadingIndicator = function (_a) {
|
|
8626
8626
|
var ariaLabel = _a["aria-label"], sdsStyle = _a.sdsStyle;
|
|
8627
8627
|
return (jsxs(StyledLoadingIndicator, { sdsStyle: sdsStyle, "aria-label": "Loading", children: [jsx(Icon, { sdsIcon: "Loading", sdsSize: "l" }), jsx(StyledText, { "aria-label": ariaLabel, "aria-live": "polite", role: "status", children: "Loading" })] }));
|
|
8628
8628
|
};
|
|
8629
8629
|
|
|
8630
|
-
var StyledMenu = styled$2(Menu$1)(templateObject_1$
|
|
8630
|
+
var StyledMenu = styled$2(Menu$1)(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n & {\n .", " {\n ", "\n }\n\n .MuiList-padding {\n padding: 0;\n }\n }\n"], ["\n & {\n .", " {\n ", "\n }\n\n .MuiList-padding {\n padding: 0;\n }\n }\n"])), menuClasses.paper, function (props) {
|
|
8631
8631
|
var _a;
|
|
8632
8632
|
var spaces = getSpaces(props);
|
|
8633
8633
|
var corners = getCorners(props);
|
|
8634
8634
|
var semanticColors = getSemanticColors(props);
|
|
8635
8635
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surface, ";\n background-image: none;\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.l, "px;\n ");
|
|
8636
8636
|
});
|
|
8637
|
-
var templateObject_1$
|
|
8637
|
+
var templateObject_1$q;
|
|
8638
8638
|
|
|
8639
8639
|
var ANCHOR_ORIGIN = {
|
|
8640
8640
|
horizontal: "center",
|
|
@@ -8651,19 +8651,19 @@ var Menu = function (props) {
|
|
|
8651
8651
|
return (jsx(StyledMenu, __assign({ anchorOrigin: ANCHOR_ORIGIN, transformOrigin: TRANSFORM_ORIGIN }, props)));
|
|
8652
8652
|
};
|
|
8653
8653
|
|
|
8654
|
-
var StyledMenuItem = styled$2(MenuItem)(templateObject_1$
|
|
8655
|
-
var doNotForwardProps$
|
|
8654
|
+
var StyledMenuItem = styled$2(MenuItem)(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
8655
|
+
var doNotForwardProps$e = ["search", "InputBaseProps", "keepSearchOnSelect"];
|
|
8656
8656
|
// (thuang): Casting the type to `Autocomplete`
|
|
8657
8657
|
// per https://github.com/mui-org/material-ui/issues/21727#issuecomment-880263271
|
|
8658
8658
|
var StyledAutocomplete = styled$2(Autocomplete$1, {
|
|
8659
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8660
|
-
})(templateObject_2$
|
|
8659
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$e.includes(prop); },
|
|
8660
|
+
})(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n ", "\n width: 100%;\n"], ["\n ", "\n width: 100%;\n"])), function (_a) {
|
|
8661
8661
|
var search = _a.search;
|
|
8662
8662
|
return !search && "height: 0; margin: 0 !important;";
|
|
8663
8663
|
});
|
|
8664
8664
|
var InputBaseWrapper = styled$2("div", {
|
|
8665
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8666
|
-
})(templateObject_3$
|
|
8665
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$e.includes(prop); },
|
|
8666
|
+
})(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8667
8667
|
var search = props.search;
|
|
8668
8668
|
if (!search) {
|
|
8669
8669
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -8675,12 +8675,12 @@ var InputBaseWrapper = styled$2("div", {
|
|
|
8675
8675
|
return "\n margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
8676
8676
|
});
|
|
8677
8677
|
var StyledMenuInputSearch = styled$2(InputSearch, {
|
|
8678
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8679
|
-
})(templateObject_4$
|
|
8678
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$e.includes(prop); },
|
|
8679
|
+
})(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n && {\n margin: 0;\n\n .", " {\n width: 100%;\n padding: 0;\n padding-right: 14px !important;\n }\n\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n }\n"], ["\n && {\n margin: 0;\n\n .", " {\n width: 100%;\n padding: 0;\n padding-right: 14px !important;\n }\n\n /* (thuang): Works with attribute inputMode: \"none\" to hide mobile keyboard */\n caret-color: ", ";\n }\n"])), inputBaseClasses.root, function (_a) {
|
|
8680
8680
|
var search = _a.search;
|
|
8681
8681
|
return (search ? "auto" : "transparent");
|
|
8682
8682
|
});
|
|
8683
|
-
var templateObject_1$
|
|
8683
|
+
var templateObject_1$p, templateObject_2$h, templateObject_3$d, templateObject_4$c;
|
|
8684
8684
|
|
|
8685
8685
|
/**
|
|
8686
8686
|
* @see https://mui.com/material-ui/react-autocomplete/
|
|
@@ -8731,55 +8731,55 @@ var MenuSelect = function (props) {
|
|
|
8731
8731
|
}
|
|
8732
8732
|
};
|
|
8733
8733
|
|
|
8734
|
-
var doNotForwardProps$
|
|
8734
|
+
var doNotForwardProps$d = ["hasInvertedStyle", "isNarrow"];
|
|
8735
8735
|
var StyledFooter = styled$2("footer", {
|
|
8736
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8737
|
-
})(templateObject_3$
|
|
8736
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8737
|
+
})(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8738
8738
|
var isNarrow = props.isNarrow;
|
|
8739
8739
|
var spaces = getSpaces(props);
|
|
8740
8740
|
var semanticColors = getSemanticColors(props);
|
|
8741
|
-
return css$2(templateObject_2$
|
|
8741
|
+
return css$2(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n background: ", ";\n padding: ", "px ", "px;\n\n ", "\n "], ["\n background: ", ";\n padding: ", "px ", "px;\n\n ", "\n "])), props.hasInvertedStyle
|
|
8742
8742
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimaryDark
|
|
8743
|
-
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.xl, isNarrow && css$2(templateObject_1$
|
|
8743
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.xl, isNarrow && css$2(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n border-top: 1px solid\n ", ";\n padding: ", "px ", "px ", "px ", "px;\n "], ["\n border-top: 1px solid\n ", ";\n padding: ", "px ", "px ", "px ", "px;\n "])), props.hasInvertedStyle
|
|
8744
8744
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerOnDark
|
|
8745
8745
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider, spaces === null || spaces === void 0 ? void 0 : spaces.xl, spaces === null || spaces === void 0 ? void 0 : spaces.xl, spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8746
8746
|
});
|
|
8747
8747
|
var StyledLogoWrapper$1 = styled$2("div", {
|
|
8748
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8749
|
-
})(templateObject_6$
|
|
8748
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8749
|
+
})(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n ", "\n\n p {\n margin: 0;\n padding: 0;\n ", "\n }\n"], ["\n ", "\n\n p {\n margin: 0;\n padding: 0;\n ", "\n }\n"])), function (props) {
|
|
8750
8750
|
var spaces = getSpaces(props);
|
|
8751
|
-
return css$2(templateObject_4$
|
|
8751
|
+
return css$2(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: ", "px;\n\n a {\n text-decoration: none;\n }\n\n .MuiChip-root {\n margin: 0;\n }\n "], ["\n display: flex;\n align-items: center;\n gap: ", "px;\n\n a {\n text-decoration: none;\n }\n\n .MuiChip-root {\n margin: 0;\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s);
|
|
8752
8752
|
}, function (props) {
|
|
8753
8753
|
var isNarrow = props.isNarrow;
|
|
8754
8754
|
var semanticColors = getSemanticColors(props);
|
|
8755
8755
|
return [
|
|
8756
8756
|
isNarrow ? fontHeader("l", "semibold", true) : fontHeaderL,
|
|
8757
|
-
css$2(templateObject_5$
|
|
8757
|
+
css$2(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n color: ", ";\n white-space: nowrap;\n "], ["\n color: ", ";\n white-space: nowrap;\n "])), props.hasInvertedStyle
|
|
8758
8758
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
8759
8759
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary),
|
|
8760
8760
|
];
|
|
8761
8761
|
});
|
|
8762
8762
|
var StyledNavSection = styled$2("div", {
|
|
8763
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8764
|
-
})(templateObject_9$
|
|
8763
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8764
|
+
})(templateObject_9$6 || (templateObject_9$6 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8765
8765
|
var isNarrow = props.isNarrow;
|
|
8766
8766
|
var spaces = getSpaces(props);
|
|
8767
|
-
return css$2(templateObject_8$
|
|
8767
|
+
return css$2(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n padding-left: ", "px;\n gap: ", "px;\n\n ", "\n "], ["\n display: flex;\n align-items: center;\n padding-left: ", "px;\n gap: ", "px;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.l, isNarrow && css$2(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n flex-direction: column;\n gap: 0;\n margin-top: ", "px;\n width: 100%;\n padding-left: 0;\n "], ["\n flex-direction: column;\n gap: 0;\n margin-top: ", "px;\n width: 100%;\n padding-left: 0;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l));
|
|
8768
8768
|
});
|
|
8769
8769
|
var StyledTopSection = styled$2("div", {
|
|
8770
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8770
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8771
8771
|
})(templateObject_12$2 || (templateObject_12$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8772
8772
|
var isNarrow = props.isNarrow;
|
|
8773
8773
|
var semanticColors = getSemanticColors(props);
|
|
8774
8774
|
var spaces = getSpaces(props);
|
|
8775
|
-
return css$2(templateObject_11$
|
|
8775
|
+
return css$2(templateObject_11$5 || (templateObject_11$5 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-bottom: ", "px;\n\n a:hover {\n text-decoration: none;\n }\n\n color: ", ";\n\n &:hover {\n color: ", ";\n text-decoration: none;\n }\n\n ", "\n "], ["\n align-items: center;\n display: flex;\n justify-content: space-between;\n margin-bottom: ", "px;\n\n a:hover {\n text-decoration: none;\n }\n\n color: ", ";\n\n &:hover {\n color: ", ";\n text-decoration: none;\n }\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, props.hasInvertedStyle
|
|
8776
8776
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryOnDark
|
|
8777
8777
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, props.hasInvertedStyle
|
|
8778
8778
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
8779
|
-
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, isNarrow && css$2(templateObject_10$
|
|
8779
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, isNarrow && css$2(templateObject_10$6 || (templateObject_10$6 = __makeTemplateObject(["\n flex-direction: column;\n "], ["\n flex-direction: column;\n "]))));
|
|
8780
8780
|
});
|
|
8781
8781
|
var StyledLinkSection = styled$2("div", {
|
|
8782
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8782
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8783
8783
|
})(templateObject_15$2 || (templateObject_15$2 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n\n .MuiDivider-root {\n height: 18px;\n }\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n\n .MuiDivider-root {\n height: 18px;\n }\n\n ", "\n"])), function (props) {
|
|
8784
8784
|
var isNarrow = props.isNarrow;
|
|
8785
8785
|
var spaces = getSpaces(props);
|
|
@@ -8790,7 +8790,7 @@ var StyledMobileLinkRow = styled$2.div(templateObject_16$2 || (templateObject_16
|
|
|
8790
8790
|
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n ");
|
|
8791
8791
|
});
|
|
8792
8792
|
var StyledImageSection = styled$2("div", {
|
|
8793
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8793
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8794
8794
|
})(templateObject_19$1 || (templateObject_19$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n\n ", "\n"])), function (props) {
|
|
8795
8795
|
var isNarrow = props.isNarrow;
|
|
8796
8796
|
var spaces = getSpaces(props);
|
|
@@ -8801,13 +8801,13 @@ var StyledMobileImageRow = styled$2.div(templateObject_20$1 || (templateObject_2
|
|
|
8801
8801
|
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;\n ");
|
|
8802
8802
|
});
|
|
8803
8803
|
var StyledBottomSection = styled$2("div", {
|
|
8804
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
8804
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8805
8805
|
})(templateObject_23$1 || (templateObject_23$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n justify-content: space-between;\n\n a:hover {\n text-decoration: none;\n }\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n justify-content: space-between;\n\n a:hover {\n text-decoration: none;\n }\n\n ", "\n"])), function (props) {
|
|
8806
8806
|
var isNarrow = props.isNarrow;
|
|
8807
8807
|
var spaces = getSpaces(props);
|
|
8808
8808
|
return css$2(templateObject_22$1 || (templateObject_22$1 = __makeTemplateObject(["\n margin-top: ", "px;\n\n ", "\n "], ["\n margin-top: ", "px;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, isNarrow && css$2(templateObject_21$1 || (templateObject_21$1 = __makeTemplateObject(["\n flex-direction: column-reverse;\n "], ["\n flex-direction: column-reverse;\n "]))));
|
|
8809
8809
|
});
|
|
8810
|
-
var templateObject_1$
|
|
8810
|
+
var templateObject_1$o, templateObject_2$g, templateObject_3$c, templateObject_4$b, templateObject_5$9, templateObject_6$8, templateObject_7$6, templateObject_8$6, templateObject_9$6, templateObject_10$6, templateObject_11$5, templateObject_12$2, templateObject_13$2, templateObject_14$2, templateObject_15$2, templateObject_16$2, templateObject_17$2, templateObject_18$2, templateObject_19$1, templateObject_20$1, templateObject_21$1, templateObject_22$1, templateObject_23$1;
|
|
8811
8811
|
|
|
8812
8812
|
/**
|
|
8813
8813
|
* WARNING: Don't import this directly.
|
|
@@ -14769,24 +14769,24 @@ function useTheme() {
|
|
|
14769
14769
|
return theme[THEME_ID] || theme;
|
|
14770
14770
|
}
|
|
14771
14771
|
|
|
14772
|
-
var doNotForwardProps$
|
|
14772
|
+
var doNotForwardProps$c = ["hasInvertedStyle", "isNarrow"];
|
|
14773
14773
|
var NarrowNavItemLinkStyles = function (props) {
|
|
14774
14774
|
var semanticColors = getSemanticColors(props);
|
|
14775
14775
|
var spaces = getSpaces(props);
|
|
14776
|
-
return css$2(templateObject_1$
|
|
14776
|
+
return css$2(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n text-align: center;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: ", "px;\n\n &:hover {\n color: ", ";\n background: ", ";\n }\n "], ["\n text-align: center;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: ", "px;\n\n &:hover {\n color: ", ";\n background: ", ";\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s, props.hasInvertedStyle
|
|
14777
14777
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
14778
14778
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, props.hasInvertedStyle
|
|
14779
14779
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondaryOnDark
|
|
14780
14780
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondary);
|
|
14781
14781
|
};
|
|
14782
14782
|
var StyledNavItemLink = styled$2(Link, {
|
|
14783
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
14784
|
-
})(templateObject_3$
|
|
14783
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
14784
|
+
})(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyMediumS, function (props) {
|
|
14785
14785
|
var isNarrow = props.isNarrow;
|
|
14786
14786
|
var semanticColors = getSemanticColors(props);
|
|
14787
14787
|
var spaces = getSpaces(props);
|
|
14788
14788
|
var corners = getCorners(props);
|
|
14789
|
-
return css$2(templateObject_2$
|
|
14789
|
+
return css$2(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n color: ", ";\n background-color: transparent;\n white-space: nowrap;\n padding: ", "px ", "px;\n border-radius: ", "px;\n\n &:hover {\n color: ", ";\n background-color: ", ";\n text-decoration: none;\n }\n\n ", "\n "], ["\n color: ", ";\n background-color: transparent;\n white-space: nowrap;\n padding: ", "px ", "px;\n border-radius: ", "px;\n\n &:hover {\n color: ", ";\n background-color: ", ";\n text-decoration: none;\n }\n\n ", "\n "])), props.hasInvertedStyle
|
|
14790
14790
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryOnDark
|
|
14791
14791
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, spaces === null || spaces === void 0 ? void 0 : spaces.m, corners === null || corners === void 0 ? void 0 : corners.l, props.hasInvertedStyle
|
|
14792
14792
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
@@ -14794,7 +14794,7 @@ var StyledNavItemLink = styled$2(Link, {
|
|
|
14794
14794
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHoverOnDark
|
|
14795
14795
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHover, isNarrow && NarrowNavItemLinkStyles(props));
|
|
14796
14796
|
});
|
|
14797
|
-
var templateObject_1$
|
|
14797
|
+
var templateObject_1$n, templateObject_2$f, templateObject_3$b;
|
|
14798
14798
|
|
|
14799
14799
|
var NavItem = memo(function (_a) {
|
|
14800
14800
|
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow;
|
|
@@ -14802,30 +14802,30 @@ var NavItem = memo(function (_a) {
|
|
|
14802
14802
|
});
|
|
14803
14803
|
NavItem.displayName = "NavItem";
|
|
14804
14804
|
|
|
14805
|
-
var doNotForwardProps$
|
|
14805
|
+
var doNotForwardProps$b = ["hasInvertedStyle", "showDivider"];
|
|
14806
14806
|
var StyledLinkItemLink = styled$2(Link, {
|
|
14807
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
14808
|
-
})(templateObject_3$
|
|
14807
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$b.includes(prop); },
|
|
14808
|
+
})(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
14809
14809
|
var showDivider = props.showDivider, hasInvertedStyle = props.hasInvertedStyle;
|
|
14810
14810
|
var spaces = getSpaces(props);
|
|
14811
14811
|
var semanticColors = getSemanticColors(props);
|
|
14812
|
-
return css$2(templateObject_2$
|
|
14812
|
+
return css$2(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n color: ", ";\n white-space: nowrap;\n position: relative;\n\n &:hover {\n color: ", ";\n text-decoration: none;\n }\n\n ", "\n "], ["\n color: ", ";\n white-space: nowrap;\n position: relative;\n\n &:hover {\n color: ", ";\n text-decoration: none;\n }\n\n ", "\n "])), hasInvertedStyle
|
|
14813
14813
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryOnDark
|
|
14814
14814
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, hasInvertedStyle
|
|
14815
14815
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
14816
|
-
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, showDivider && css$2(templateObject_1$
|
|
14816
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, showDivider && css$2(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n &:after {\n content: \"\";\n position: absolute;\n top: 0;\n right: -", "px;\n display: block;\n height: 100%;\n width: 1px;\n margin-left: ", "px;\n background-color: ", ";\n }\n "], ["\n &:after {\n content: \"\";\n position: absolute;\n top: 0;\n right: -", "px;\n display: block;\n height: 100%;\n width: 1px;\n margin-left: ", "px;\n background-color: ", ";\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.s, hasInvertedStyle
|
|
14817
14817
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerOnDark
|
|
14818
14818
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider));
|
|
14819
14819
|
});
|
|
14820
14820
|
var StyledDivider$1 = styled$2(Divider, {
|
|
14821
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
14822
|
-
})(templateObject_4$
|
|
14821
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$b.includes(prop); },
|
|
14822
|
+
})(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14823
14823
|
var semanticColors = getSemanticColors(props);
|
|
14824
14824
|
return "\n border-color: ".concat(props.hasInvertedStyle
|
|
14825
14825
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerOnDark
|
|
14826
14826
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider, ";\n ");
|
|
14827
14827
|
});
|
|
14828
|
-
var templateObject_1$
|
|
14828
|
+
var templateObject_1$m, templateObject_2$e, templateObject_3$a, templateObject_4$a;
|
|
14829
14829
|
|
|
14830
14830
|
var FooterLink = memo(forwardRef(function (_a, ref) {
|
|
14831
14831
|
var link = _a.link, showDivider = _a.showDivider, hasInvertedStyle = _a.hasInvertedStyle;
|
|
@@ -14988,7 +14988,7 @@ function NavigationFooter(_a) {
|
|
|
14988
14988
|
return (jsxs(StyledFooter, __assign({ ref: footerRef, hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow }, rest, { children: [jsxs(StyledTopSection, { isNarrow: dimensions.isNarrow, hasInvertedStyle: hasInvertedStyle, children: [logoNode, navItemsSection] }), jsx(MemoizedStyledDivider, { hasInvertedStyle: hasInvertedStyle }), jsxs(StyledBottomSection, { isNarrow: dimensions.isNarrow, children: [jsx(StyledLinkSection, { isNarrow: dimensions.isNarrow, children: renderLinks() }), jsx(StyledImageSection, { isNarrow: dimensions.isNarrow, children: renderImages() })] })] })));
|
|
14989
14989
|
}
|
|
14990
14990
|
|
|
14991
|
-
var doNotForwardProps$
|
|
14991
|
+
var doNotForwardProps$a = [
|
|
14992
14992
|
"hasInvertedStyle",
|
|
14993
14993
|
"isNarrow",
|
|
14994
14994
|
"primaryNavPosition",
|
|
@@ -15000,19 +15000,19 @@ var doNotForwardProps$9 = [
|
|
|
15000
15000
|
"hasIcon",
|
|
15001
15001
|
"sectionProps",
|
|
15002
15002
|
];
|
|
15003
|
-
var StyledTopComponentSlot = styled$2("div")(templateObject_1$
|
|
15003
|
+
var StyledTopComponentSlot = styled$2("div")(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n position: sticky;\n top: 0;\n z-index: 1300;\n"], ["\n position: sticky;\n top: 0;\n z-index: 1300;\n"])));
|
|
15004
15004
|
var StyledAppBar = styled$2(AppBar, {
|
|
15005
15005
|
shouldForwardProp: function (prop) {
|
|
15006
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15006
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15007
15007
|
},
|
|
15008
|
-
})(templateObject_2$
|
|
15008
|
+
})(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15009
15009
|
var _a, _b;
|
|
15010
15010
|
var colors = getSemanticColors(props);
|
|
15011
15011
|
return "\n background-color: ".concat(props.hasInvertedStyle ? colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimaryDark : colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimary, ";\n background-image: none;\n max-width: 100%;\n overflow-x: auto;\n z-index: ").concat(((_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.zIndex) === null || _b === void 0 ? void 0 : _b.drawer) ? props.theme.zIndex.drawer + 10 : 1210, ";\n ");
|
|
15012
15012
|
});
|
|
15013
15013
|
var NarrowToolbar = function (props) {
|
|
15014
15014
|
var semanticColors = getSemanticColors(props);
|
|
15015
|
-
return css$2(templateObject_3$
|
|
15015
|
+
return css$2(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n border-bottom: 1px solid\n ", ";\n background-color: ", ";\n background-image: none;\n box-shadow: none;\n position: sticky !important;\n top: 0;\n justify-content: space-between;\n "], ["\n border-bottom: 1px solid\n ", ";\n background-color: ", ";\n background-image: none;\n box-shadow: none;\n position: sticky !important;\n top: 0;\n justify-content: space-between;\n "])), props.hasInvertedStyle
|
|
15016
15016
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerOnDark
|
|
15017
15017
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider, props.hasInvertedStyle
|
|
15018
15018
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimaryDark
|
|
@@ -15020,51 +15020,51 @@ var NarrowToolbar = function (props) {
|
|
|
15020
15020
|
};
|
|
15021
15021
|
var StyledToolbar = styled$2(Toolbar, {
|
|
15022
15022
|
shouldForwardProp: function (prop) {
|
|
15023
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15023
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15024
15024
|
},
|
|
15025
|
-
})(templateObject_5$
|
|
15025
|
+
})(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15026
15026
|
var isNarrow = props.isNarrow;
|
|
15027
15027
|
var spaces = getSpaces(props);
|
|
15028
|
-
return css$2(templateObject_4$
|
|
15028
|
+
return css$2(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n &.MuiToolbar-root {\n min-height: 48px;\n max-height: 48px;\n padding: ", "px ", "px;\n\n ", "\n }\n "], ["\n &.MuiToolbar-root {\n min-height: 48px;\n max-height: 48px;\n padding: ", "px ", "px;\n\n ", "\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.l, isNarrow && NarrowToolbar(props));
|
|
15029
15029
|
});
|
|
15030
15030
|
styled$2("div", {
|
|
15031
15031
|
shouldForwardProp: function (prop) {
|
|
15032
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15032
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15033
15033
|
},
|
|
15034
|
-
})(templateObject_6$
|
|
15034
|
+
})(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15035
15035
|
var shadows = getShadows(props);
|
|
15036
15036
|
return "\n box-shadow: ".concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n height: 10px;\n display: block;\n position: fixed;\n width: 100%;\n top: 46px;\n left: 0;\n ");
|
|
15037
15037
|
});
|
|
15038
15038
|
styled$2("div", {
|
|
15039
15039
|
shouldForwardProp: function (prop) {
|
|
15040
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15040
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15041
15041
|
},
|
|
15042
|
-
})(templateObject_7$
|
|
15042
|
+
})(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15043
15043
|
var colors = getSemanticColors(props);
|
|
15044
15044
|
return "\n background: ".concat(props.hasInvertedStyle ? colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimaryDark : colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimary, ";\n height: 10px;\n display: block;\n position: absolute;\n width: 100%;\n top: 56px;\n left: 0;\n ");
|
|
15045
15045
|
});
|
|
15046
15046
|
var StyledHeaderButton = styled$2(Button, {
|
|
15047
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
15048
|
-
})(templateObject_9$
|
|
15047
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
15048
|
+
})(templateObject_9$5 || (templateObject_9$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15049
15049
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
15050
15050
|
var sdsType = props.sdsType, hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow;
|
|
15051
15051
|
var mode = ((_b = (_a = props === null || props === void 0 ? void 0 : props.theme) === null || _a === void 0 ? void 0 : _a.palette) === null || _b === void 0 ? void 0 : _b.mode) || "light";
|
|
15052
15052
|
var semanticColors = getSemanticColors(props);
|
|
15053
15053
|
var secondaryButtonStyles = "\n box-shadow: inset 0 0 0 1px ".concat(mode === "light" ? "white" : (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.fillPrimary, ";\n color: ").concat(mode === "light" ? "white" : (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.fillPrimary, ";\n &:hover {\n background-color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.fillHover, ";\n box-shadow: inset 0 0 0 1px ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _f === void 0 ? void 0 : _f.fillHover, ";\n color: ").concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.textPrimaryOnDark, ";\n }\n ");
|
|
15054
|
-
return css$2(templateObject_8$
|
|
15054
|
+
return css$2(templateObject_8$5 || (templateObject_8$5 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), sdsType === "secondary" && hasInvertedStyle
|
|
15055
15055
|
? secondaryButtonStyles
|
|
15056
15056
|
: "", isNarrow && fontBodyL$1(props));
|
|
15057
15057
|
});
|
|
15058
15058
|
var invertedNarrowButtonStyles = function (props) {
|
|
15059
15059
|
var _a, _b, _c, _d;
|
|
15060
15060
|
var semanticColors = getSemanticColors(props);
|
|
15061
|
-
return css$2(templateObject_10$
|
|
15061
|
+
return css$2(templateObject_10$5 || (templateObject_10$5 = __makeTemplateObject(["\n color: ", ";\n svg {\n fill: ", ";\n }\n\n &:hover,\n &:focus,\n &:active,\n &:focus-within {\n color: ", ";\n svg {\n fill: ", ";\n }\n }\n "], ["\n color: ", ";\n svg {\n fill: ", ";\n }\n\n &:hover,\n &:focus,\n &:active,\n &:focus-within {\n color: ", ";\n svg {\n fill: ", ";\n }\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimaryOnDark, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimaryOnDark, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimaryOnDark, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentPrimaryOnDark);
|
|
15062
15062
|
};
|
|
15063
15063
|
var StyledNarrowIconButton = styled$2(Button, {
|
|
15064
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
15064
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
15065
15065
|
})(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15066
15066
|
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow;
|
|
15067
|
-
return css$2(templateObject_11$
|
|
15067
|
+
return css$2(templateObject_11$4 || (templateObject_11$4 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), hasInvertedStyle && invertedNarrowButtonStyles(props), isNarrow && fontBodyL$1(props));
|
|
15068
15068
|
});
|
|
15069
15069
|
var invertedWideButtonStyles = function (props) {
|
|
15070
15070
|
var _a, _b;
|
|
@@ -15072,14 +15072,14 @@ var invertedWideButtonStyles = function (props) {
|
|
|
15072
15072
|
return css$2(templateObject_13$1 || (templateObject_13$1 = __makeTemplateObject(["\n svg {\n fill: ", ";\n }\n\n &:hover,\n &:focus,\n &:active,\n &:focus-within {\n svg {\n fill: ", ";\n }\n }\n "], ["\n svg {\n fill: ", ";\n }\n\n &:hover,\n &:focus,\n &:active,\n &:focus-within {\n svg {\n fill: ", ";\n }\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentSecondaryOnDark, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimaryOnDark);
|
|
15073
15073
|
};
|
|
15074
15074
|
var StyledWideIconButton = styled$2(Button, {
|
|
15075
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
15075
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
15076
15076
|
})(templateObject_15$1 || (templateObject_15$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15077
15077
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
15078
15078
|
return css$2(templateObject_14$1 || (templateObject_14$1 = __makeTemplateObject(["\n ", "\n margin: 0;\n "], ["\n ", "\n margin: 0;\n "])), hasInvertedStyle && invertedWideButtonStyles(props));
|
|
15079
15079
|
});
|
|
15080
15080
|
var StyledLogoLinkWrapper = styled$2(Link, {
|
|
15081
15081
|
shouldForwardProp: function (prop) {
|
|
15082
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15082
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15083
15083
|
},
|
|
15084
15084
|
})(templateObject_17$1 || (templateObject_17$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n text-decoration: none !important;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n text-decoration: none !important;\n\n ", "\n"])), function (props) {
|
|
15085
15085
|
var isNarrow = props.isNarrow;
|
|
@@ -15091,7 +15091,7 @@ var NarrowTitleContainer = function () {
|
|
|
15091
15091
|
};
|
|
15092
15092
|
var StyledTitleContainer = styled$2("div", {
|
|
15093
15093
|
shouldForwardProp: function (prop) {
|
|
15094
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15094
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15095
15095
|
},
|
|
15096
15096
|
})(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n\n ", "\n"], ["\n display: flex;\n align-items: center;\n\n ", "\n"])), function (props) {
|
|
15097
15097
|
var isNarrow = props.isNarrow;
|
|
@@ -15103,7 +15103,7 @@ var StyledTitleContainer = styled$2("div", {
|
|
|
15103
15103
|
});
|
|
15104
15104
|
var StyledTitleTagWrapper = styled$2("div", {
|
|
15105
15105
|
shouldForwardProp: function (prop) {
|
|
15106
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15106
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15107
15107
|
},
|
|
15108
15108
|
})(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15109
15109
|
var spaces = getSpaces(props);
|
|
@@ -15112,7 +15112,7 @@ var StyledTitleTagWrapper = styled$2("div", {
|
|
|
15112
15112
|
var StyledTag$2 = styled$2(Tag)(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
|
|
15113
15113
|
var StyledPrimaryNavContainer = styled$2("div", {
|
|
15114
15114
|
shouldForwardProp: function (prop) {
|
|
15115
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15115
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15116
15116
|
},
|
|
15117
15117
|
})(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-grow: 1;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n flex-grow: 1;\n\n ", "\n"])), function (props) {
|
|
15118
15118
|
var showSearch = props.showSearch, primaryNavPosition = props.primaryNavPosition, isNarrow = props.isNarrow;
|
|
@@ -15124,7 +15124,7 @@ var StyledPrimaryNavContainer = styled$2("div", {
|
|
|
15124
15124
|
: primaryNavPositionWithoutSearch);
|
|
15125
15125
|
});
|
|
15126
15126
|
var StyledSearch = styled$2(InputSearch, {
|
|
15127
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
15127
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
15128
15128
|
})(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n margin: 0;\n width: 100%;\n\n ", "\n"], ["\n margin: 0;\n width: 100%;\n\n ", "\n"])), function (props) {
|
|
15129
15129
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
15130
15130
|
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow;
|
|
@@ -15163,7 +15163,7 @@ var NarrowButtonStyles = function (props) {
|
|
|
15163
15163
|
};
|
|
15164
15164
|
var StyledButtonSection = styled$2("section", {
|
|
15165
15165
|
shouldForwardProp: function (prop) {
|
|
15166
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15166
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15167
15167
|
},
|
|
15168
15168
|
})(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n z-index: 100;\n\n ", "\n"], ["\n display: flex;\n align-items: center;\n z-index: 100;\n\n ", "\n"])), function (props) {
|
|
15169
15169
|
var isNarrow = props.isNarrow;
|
|
@@ -15172,7 +15172,7 @@ var StyledButtonSection = styled$2("section", {
|
|
|
15172
15172
|
});
|
|
15173
15173
|
var StyledDrawer$1 = styled$2(Drawer, {
|
|
15174
15174
|
shouldForwardProp: function (prop) {
|
|
15175
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15175
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle", "topOffset"], false).includes(prop);
|
|
15176
15176
|
},
|
|
15177
15177
|
})(templateObject_32 || (templateObject_32 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15178
15178
|
var colors = getSemanticColors(props);
|
|
@@ -15181,14 +15181,14 @@ var StyledDrawer$1 = styled$2(Drawer, {
|
|
|
15181
15181
|
});
|
|
15182
15182
|
var StyledDrawerContent = styled$2("div", {
|
|
15183
15183
|
shouldForwardProp: function (prop) {
|
|
15184
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15184
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15185
15185
|
},
|
|
15186
15186
|
})(templateObject_34 || (templateObject_34 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15187
15187
|
var spaces = getSpaces(props);
|
|
15188
15188
|
return css$2(templateObject_33 || (templateObject_33 = __makeTemplateObject(["\n padding: 0 ", "px;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n "], ["\n padding: 0 ", "px;\n flex-grow: 1;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l);
|
|
15189
15189
|
});
|
|
15190
15190
|
var StyledNarrowButton = styled$2(Button, {
|
|
15191
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
15191
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
15192
15192
|
})(templateObject_36 || (templateObject_36 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15193
15193
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
15194
15194
|
return css$2(templateObject_35 || (templateObject_35 = __makeTemplateObject(["\n ", "\n margin: 0;\n "], ["\n ", "\n margin: 0;\n "])), hasInvertedStyle && invertedWideButtonStyles(props));
|
|
@@ -15209,7 +15209,7 @@ var DrawerAccordionStyles = function (props) {
|
|
|
15209
15209
|
};
|
|
15210
15210
|
var StyledAccordion = styled$2(Accordion, {
|
|
15211
15211
|
shouldForwardProp: function (prop) {
|
|
15212
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15212
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15213
15213
|
},
|
|
15214
15214
|
})(templateObject_41 || (templateObject_41 = __makeTemplateObject(["\n padding: 0 !important;\n width: 100%;\n min-width: unset;\n\n .MuiAccordionSummary-content {\n ", "\n }\n\n .MuiAccordionDetails-root .MuiButtonBase-root .primary-text {\n ", "\n }\n\n ", "\n"], ["\n padding: 0 !important;\n width: 100%;\n min-width: unset;\n\n .MuiAccordionSummary-content {\n ", "\n }\n\n .MuiAccordionDetails-root .MuiButtonBase-root .primary-text {\n ", "\n }\n\n ", "\n"])), fontBodyMediumL, fontBodyS$1, function (props) {
|
|
15215
15215
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
@@ -15250,7 +15250,7 @@ var StyledAccordion = styled$2(Accordion, {
|
|
|
15250
15250
|
});
|
|
15251
15251
|
var StyledSectionDivider = styled$2(Divider, {
|
|
15252
15252
|
shouldForwardProp: function (prop) {
|
|
15253
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15253
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15254
15254
|
},
|
|
15255
15255
|
})(templateObject_42 || (templateObject_42 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15256
15256
|
var semanticColors = getSemanticColors(props);
|
|
@@ -15262,31 +15262,31 @@ var StyledSectionDivider = styled$2(Divider, {
|
|
|
15262
15262
|
// Hover Drawer Components for sdsStyle="drawer"
|
|
15263
15263
|
var StyledMegaMenuDrawer = styled$2(Drawer, {
|
|
15264
15264
|
shouldForwardProp: function (prop) {
|
|
15265
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15265
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle", "topOffset"], false).includes(prop);
|
|
15266
15266
|
},
|
|
15267
15267
|
})(templateObject_44 || (templateObject_44 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15268
15268
|
var hasInvertedStyle = props.hasInvertedStyle, _a = props.topOffset, topOffset = _a === void 0 ? 0 : _a;
|
|
15269
15269
|
var semanticColors = getSemanticColors(props);
|
|
15270
15270
|
var spaces = getSpaces(props);
|
|
15271
|
-
return css$2(templateObject_43 || (templateObject_43 = __makeTemplateObject(["\n pointer-events: none;\n top: ", "px;\n\n .MuiDrawer-paper {\n background-color: ", ";\n height: auto;\n max-height: calc(100vh - ", "px);\n overflow: visible;\n pointer-events: auto;\n box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.1);\n background-image: none;\n padding: ", "px ", "px\n ", "px;\n transform: translateY(48px);\n top: ", "px;\n }\n\n .MuiBackdrop-root {\n background-color: rgba(0, 0, 0, 0
|
|
15271
|
+
return css$2(templateObject_43 || (templateObject_43 = __makeTemplateObject(["\n pointer-events: none;\n top: ", "px;\n\n .MuiDrawer-paper {\n background-color: ", ";\n height: auto;\n max-height: calc(100vh - ", "px);\n overflow: visible;\n pointer-events: auto;\n box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.1);\n background-image: none;\n padding: ", "px ", "px\n ", "px;\n transform: translateY(48px);\n top: ", "px;\n }\n\n .MuiBackdrop-root {\n background-color: rgba(0, 0, 0, 0);\n backdrop-filter: blur(2px);\n top: ", "px;\n }\n "], ["\n pointer-events: none;\n top: ", "px;\n\n .MuiDrawer-paper {\n background-color: ", ";\n height: auto;\n max-height: calc(100vh - ", "px);\n overflow: visible;\n pointer-events: auto;\n box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.1);\n background-image: none;\n padding: ", "px ", "px\n ", "px;\n transform: translateY(48px);\n top: ", "px;\n }\n\n .MuiBackdrop-root {\n background-color: rgba(0, 0, 0, 0);\n backdrop-filter: blur(2px);\n top: ", "px;\n }\n "])), topOffset, hasInvertedStyle
|
|
15272
15272
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimaryDark
|
|
15273
15273
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimary, topOffset, (spaces === null || spaces === void 0 ? void 0 : spaces.xl) ? (spaces === null || spaces === void 0 ? void 0 : spaces.xl) + 48 : 48, spaces === null || spaces === void 0 ? void 0 : spaces.xl, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, topOffset, topOffset);
|
|
15274
15274
|
});
|
|
15275
15275
|
var StyledMegaMenuContent = styled$2("div", {
|
|
15276
15276
|
shouldForwardProp: function (prop) {
|
|
15277
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15277
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15278
15278
|
},
|
|
15279
15279
|
})(templateObject_46 || (templateObject_46 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15280
15280
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
15281
15281
|
var semanticColors = getSemanticColors(props);
|
|
15282
15282
|
var spaces = getSpaces(props);
|
|
15283
|
-
return css$2(templateObject_45 || (templateObject_45 = __makeTemplateObject(["\n background-color: ", ";\n display: flex;\n flex-wrap: wrap;\n gap: ", "px;\n width: 100%;\n max-width: 1200px;\n margin: 0 auto;\n justify-content: center;\n transition: opacity
|
|
15283
|
+
return css$2(templateObject_45 || (templateObject_45 = __makeTemplateObject(["\n background-color: ", ";\n display: flex;\n flex-wrap: wrap;\n gap: ", "px;\n width: 100%;\n max-width: 1200px;\n margin: 0 auto;\n justify-content: center;\n transition: opacity 150ms ease-in-out;\n "], ["\n background-color: ", ";\n display: flex;\n flex-wrap: wrap;\n gap: ", "px;\n width: 100%;\n max-width: 1200px;\n margin: 0 auto;\n justify-content: center;\n transition: opacity 150ms ease-in-out;\n "])), hasInvertedStyle
|
|
15284
15284
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimaryDark
|
|
15285
15285
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.xxl);
|
|
15286
15286
|
});
|
|
15287
15287
|
var StyledHoverDrawerColumn = styled$2("div", {
|
|
15288
15288
|
shouldForwardProp: function (prop) {
|
|
15289
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15289
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle", "totalColumns"], false).includes(prop);
|
|
15290
15290
|
},
|
|
15291
15291
|
})(templateObject_48 || (templateObject_48 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15292
15292
|
var spaces = getSpaces(props);
|
|
@@ -15312,7 +15312,7 @@ var StyledContentWrapper = styled$2("div")(templateObject_50 || (templateObject_
|
|
|
15312
15312
|
});
|
|
15313
15313
|
var StyledHoverDrawerColumnHeader = styled$2("div", {
|
|
15314
15314
|
shouldForwardProp: function (prop) {
|
|
15315
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15315
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15316
15316
|
},
|
|
15317
15317
|
})(templateObject_52 || (templateObject_52 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15318
15318
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
@@ -15324,7 +15324,7 @@ var StyledHoverDrawerColumnHeader = styled$2("div", {
|
|
|
15324
15324
|
});
|
|
15325
15325
|
var StyledHoverDrawerItem = styled$2(Button, {
|
|
15326
15326
|
shouldForwardProp: function (prop) {
|
|
15327
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15327
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15328
15328
|
},
|
|
15329
15329
|
})(templateObject_54 || (templateObject_54 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15330
15330
|
var _a;
|
|
@@ -15332,13 +15332,13 @@ var StyledHoverDrawerItem = styled$2(Button, {
|
|
|
15332
15332
|
var semanticColors = getSemanticColors(props);
|
|
15333
15333
|
var corners = getCorners(props);
|
|
15334
15334
|
var spaces = getSpaces(props);
|
|
15335
|
-
return css$2(templateObject_53 || (templateObject_53 = __makeTemplateObject(["\n border: none;\n outline: none;\n background: transparent;\n box-shadow: none;\n justify-content: flex-start;\n text-align: left;\n padding: ", "px ", "px;\n margin-bottom: ", "px;\n border-radius: ", "px;\n min-height: auto;\n width: 100%;\n white-space: wrap;\n\n &:hover {\n border: none;\n outline: none;\n box-shadow: none;\n cursor: pointer;\n background: ", ";\n svg {\n color: ", ";\n }\n }\n "], ["\n border: none;\n outline: none;\n background: transparent;\n box-shadow: none;\n justify-content: flex-start;\n text-align: left;\n padding: ", "px ", "px;\n margin-bottom: ", "px;\n border-radius: ", "px;\n min-height: auto;\n width: 100%;\n white-space: wrap;\n\n &:hover {\n border: none;\n outline: none;\n box-shadow: none;\n cursor: pointer;\n background: ", ";\n svg {\n color: ", ";\n }\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.l, hasDetails ? spaces === null || spaces === void 0 ? void 0 : spaces.
|
|
15335
|
+
return css$2(templateObject_53 || (templateObject_53 = __makeTemplateObject(["\n border: none;\n outline: none;\n background: transparent;\n box-shadow: none;\n justify-content: flex-start;\n text-align: left;\n padding: ", "px ", "px;\n margin-bottom: ", "px;\n border-radius: ", "px;\n min-height: auto;\n width: 100%;\n white-space: wrap;\n\n &:hover {\n border: none;\n outline: none;\n box-shadow: none;\n cursor: pointer;\n background: ", ";\n svg {\n color: ", ";\n }\n }\n "], ["\n border: none;\n outline: none;\n background: transparent;\n box-shadow: none;\n justify-content: flex-start;\n text-align: left;\n padding: ", "px ", "px;\n margin-bottom: ", "px;\n border-radius: ", "px;\n min-height: auto;\n width: 100%;\n white-space: wrap;\n\n &:hover {\n border: none;\n outline: none;\n box-shadow: none;\n cursor: pointer;\n background: ", ";\n svg {\n color: ", ";\n }\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.l, hasDetails ? spaces === null || spaces === void 0 ? void 0 : spaces.l : 0, corners === null || corners === void 0 ? void 0 : corners.xl, hasInvertedStyle
|
|
15336
15336
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHoverOnDark
|
|
15337
15337
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHover, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.ornament);
|
|
15338
15338
|
});
|
|
15339
15339
|
var StyledHoverDrawerItemContent = styled$2("div", {
|
|
15340
15340
|
shouldForwardProp: function (prop) {
|
|
15341
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15341
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15342
15342
|
},
|
|
15343
15343
|
})(templateObject_56 || (templateObject_56 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15344
15344
|
var spaces = getSpaces(props);
|
|
@@ -15346,7 +15346,7 @@ var StyledHoverDrawerItemContent = styled$2("div", {
|
|
|
15346
15346
|
});
|
|
15347
15347
|
var StyledHoverDrawerItemIcon = styled$2("div", {
|
|
15348
15348
|
shouldForwardProp: function (prop) {
|
|
15349
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15349
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15350
15350
|
},
|
|
15351
15351
|
})(templateObject_58 || (templateObject_58 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15352
15352
|
var _a, _b;
|
|
@@ -15357,14 +15357,14 @@ var StyledHoverDrawerItemIcon = styled$2("div", {
|
|
|
15357
15357
|
});
|
|
15358
15358
|
var StyledHoverDrawerItemText = styled$2("div", {
|
|
15359
15359
|
shouldForwardProp: function (prop) {
|
|
15360
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15360
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15361
15361
|
},
|
|
15362
15362
|
})(templateObject_60 || (templateObject_60 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function () {
|
|
15363
15363
|
return css$2(templateObject_59 || (templateObject_59 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 2px;\n flex: 1;\n min-width: 0;\n "], ["\n display: flex;\n flex-direction: column;\n gap: 2px;\n flex: 1;\n min-width: 0;\n "])));
|
|
15364
15364
|
});
|
|
15365
15365
|
var EmptyIcon = styled$2("div", {
|
|
15366
15366
|
shouldForwardProp: function (prop) {
|
|
15367
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15367
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15368
15368
|
},
|
|
15369
15369
|
})(templateObject_62 || (templateObject_62 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15370
15370
|
var _a, _b, _c, _d;
|
|
@@ -15375,7 +15375,7 @@ var EmptyIcon = styled$2("div", {
|
|
|
15375
15375
|
});
|
|
15376
15376
|
var StyledHoverDrawerItemTitle = styled$2("div", {
|
|
15377
15377
|
shouldForwardProp: function (prop) {
|
|
15378
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15378
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15379
15379
|
},
|
|
15380
15380
|
})(templateObject_64 || (templateObject_64 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15381
15381
|
var hasInvertedStyle = props.hasInvertedStyle, hasDetails = props.hasDetails;
|
|
@@ -15388,7 +15388,7 @@ var StyledHoverDrawerItemTitle = styled$2("div", {
|
|
|
15388
15388
|
});
|
|
15389
15389
|
var StyledHoverDrawerItemDetails = styled$2("div", {
|
|
15390
15390
|
shouldForwardProp: function (prop) {
|
|
15391
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15391
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15392
15392
|
},
|
|
15393
15393
|
})(templateObject_66 || (templateObject_66 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15394
15394
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
@@ -15399,12 +15399,12 @@ var StyledHoverDrawerItemDetails = styled$2("div", {
|
|
|
15399
15399
|
});
|
|
15400
15400
|
var StyledHoverDrawerActions = styled$2("div", {
|
|
15401
15401
|
shouldForwardProp: function (prop) {
|
|
15402
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15402
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15403
15403
|
},
|
|
15404
15404
|
})(templateObject_68 || (templateObject_68 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15405
15405
|
var spaces = getSpaces(props);
|
|
15406
15406
|
var isNarrow = props.isNarrow;
|
|
15407
|
-
return css$2(templateObject_67 || (templateObject_67 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n gap: ", "px;\n margin-top: ", "px;\n padding-left: ", ";\n flex-wrap: wrap;\n "], ["\n display: flex;\n flex-direction: row;\n gap: ", "px;\n margin-top: ", "px;\n padding-left: ", ";\n flex-wrap: wrap;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.
|
|
15407
|
+
return css$2(templateObject_67 || (templateObject_67 = __makeTemplateObject(["\n display: flex;\n flex-direction: row;\n gap: ", "px;\n margin-top: ", "px;\n padding-left: ", ";\n flex-wrap: wrap;\n "], ["\n display: flex;\n flex-direction: row;\n gap: ", "px;\n margin-top: ", "px;\n padding-left: ", ";\n flex-wrap: wrap;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.l, isNarrow
|
|
15408
15408
|
? "calc(".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px + ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px)")
|
|
15409
15409
|
: "calc(".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxl, "px + ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px)"));
|
|
15410
15410
|
});
|
|
@@ -15425,12 +15425,12 @@ var StyledButton = styled$2(Button)(templateObject_70 || (templateObject_70 = __
|
|
|
15425
15425
|
});
|
|
15426
15426
|
var StyledHoverDrawerContainer = styled$2("div", {
|
|
15427
15427
|
shouldForwardProp: function (prop) {
|
|
15428
|
-
return !__spreadArray(__spreadArray([], doNotForwardProps$
|
|
15428
|
+
return !__spreadArray(__spreadArray([], doNotForwardProps$a, true), ["sdsStyle"], false).includes(prop);
|
|
15429
15429
|
},
|
|
15430
15430
|
})(templateObject_71 || (templateObject_71 = __makeTemplateObject(["\n position: relative;\n"], ["\n position: relative;\n"])));
|
|
15431
|
-
var templateObject_1$
|
|
15431
|
+
var templateObject_1$l, templateObject_2$d, templateObject_3$9, templateObject_4$9, templateObject_5$8, templateObject_6$7, templateObject_7$5, templateObject_8$5, templateObject_9$5, templateObject_10$5, templateObject_11$4, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16$1, templateObject_17$1, templateObject_18$1, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29, templateObject_30, templateObject_31, templateObject_32, templateObject_33, templateObject_34, templateObject_35, templateObject_36, templateObject_37, templateObject_38, templateObject_39, templateObject_40, templateObject_41, templateObject_42, templateObject_43, templateObject_44, templateObject_45, templateObject_46, templateObject_47, templateObject_48, templateObject_49, templateObject_50, templateObject_51, templateObject_52, templateObject_53, templateObject_54, templateObject_55, templateObject_56, templateObject_57, templateObject_58, templateObject_59, templateObject_60, templateObject_61, templateObject_62, templateObject_63, templateObject_64, templateObject_65, templateObject_66, templateObject_67, templateObject_68, templateObject_69, templateObject_70, templateObject_71;
|
|
15432
15432
|
|
|
15433
|
-
var doNotForwardProps$
|
|
15433
|
+
var doNotForwardProps$9 = [
|
|
15434
15434
|
"active",
|
|
15435
15435
|
"hasInvertedStyle",
|
|
15436
15436
|
"isNarrow",
|
|
@@ -15450,21 +15450,21 @@ var NarrowPrimaryNavItem = function (props) {
|
|
|
15450
15450
|
var ChevronHoverColor = hasInvertedStyle
|
|
15451
15451
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentSecondaryHoverOnDark
|
|
15452
15452
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.ornamentSecondaryHover;
|
|
15453
|
-
return css(templateObject_5$
|
|
15454
|
-
? css(templateObject_1$
|
|
15453
|
+
return css(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n border-radius: ", "px;\n justify-content: start;\n padding: ", "px ", "px;\n ", "\n width: 100%;\n\n &:hover {\n ", "\n box-shadow: none;\n\n ", " {\n color: ", ";\n }\n\n svg {\n color: ", " !important;\n }\n }\n "], ["\n border-radius: ", "px;\n justify-content: start;\n padding: ", "px ", "px;\n ", "\n width: 100%;\n\n &:hover {\n ", "\n box-shadow: none;\n\n ", " {\n color: ", ";\n }\n\n svg {\n color: ", " !important;\n }\n }\n "])), corners === null || corners === void 0 ? void 0 : corners.l, spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.l, innerSdsStyle === "drawer"
|
|
15454
|
+
? css(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n background-color: transparent !important;\n "], ["\n background-color: transparent !important;\n "]))) : css(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n background-color: ", ";\n "], ["\n background-color: ", ";\n "])), active
|
|
15455
15455
|
? hasInvertedStyle
|
|
15456
15456
|
? (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillPressedOnDark
|
|
15457
15457
|
: (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillPressed
|
|
15458
15458
|
: "transparent"), innerSdsStyle === "drawer"
|
|
15459
|
-
? css(templateObject_3$
|
|
15459
|
+
? css(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n background: transparent !important;\n "], ["\n background: transparent !important;\n "]))) : css(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n background: ", ";\n "], ["\n background: ", ";\n "])), hasInvertedStyle
|
|
15460
15460
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHoverOnDark
|
|
15461
|
-
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHover), StyledLabel, hasInvertedStyle
|
|
15461
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHover), StyledLabel$1, hasInvertedStyle
|
|
15462
15462
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
15463
15463
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, ChevronHoverColor);
|
|
15464
15464
|
};
|
|
15465
|
-
|
|
15466
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
15467
|
-
})(templateObject_7$
|
|
15465
|
+
styled$2(Button, {
|
|
15466
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
15467
|
+
})(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n min-width: fit-content;\n\n ", "\n"], ["\n display: flex;\n align-items: center;\n min-width: fit-content;\n\n ", "\n"])), function (props) {
|
|
15468
15468
|
var _a, _b, _c;
|
|
15469
15469
|
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow, active = props.active;
|
|
15470
15470
|
var spaces = getSpaces(props);
|
|
@@ -15479,21 +15479,113 @@ var PrimaryNavItem = styled$2(Button, {
|
|
|
15479
15479
|
var ChevronOpenColor = hasInvertedStyle
|
|
15480
15480
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.ornamentSecondaryPressedOnDark
|
|
15481
15481
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.ornamentSecondaryPressed;
|
|
15482
|
-
return css(templateObject_6$
|
|
15482
|
+
return css(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n border: none;\n padding: ", "px ", "px;\n border-radius: ", "px;\n background-color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", " !important;\n box-shadow: none;\n\n ", " {\n color: ", ";\n }\n\n svg {\n color: ", " !important;\n }\n }\n\n ", "\n "], ["\n border: none;\n padding: ", "px ", "px;\n border-radius: ", "px;\n background-color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", " !important;\n box-shadow: none;\n\n ", " {\n color: ", ";\n }\n\n svg {\n color: ", " !important;\n }\n }\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, spaces === null || spaces === void 0 ? void 0 : spaces.m, corners === null || corners === void 0 ? void 0 : corners.l, active
|
|
15483
15483
|
? hasInvertedStyle
|
|
15484
15484
|
? (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillPressedOnDark
|
|
15485
15485
|
: (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillPressed
|
|
15486
15486
|
: "transparent", active ? ChevronOpenColor : ChevronDefaultColor, hasInvertedStyle
|
|
15487
15487
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHoverOnDark
|
|
15488
|
-
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHover, StyledLabel, hasInvertedStyle
|
|
15488
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHover, StyledLabel$1, hasInvertedStyle
|
|
15489
15489
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
15490
15490
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, ChevronHoverColor, isNarrow && NarrowPrimaryNavItem(props));
|
|
15491
15491
|
});
|
|
15492
|
-
var StyledTag$1 = styled$2(Tag)(templateObject_8$
|
|
15492
|
+
var StyledTag$1 = styled$2(Tag)(templateObject_8$4 || (templateObject_8$4 = __makeTemplateObject(["\n margin: 0;\n"], ["\n margin: 0;\n"])));
|
|
15493
15493
|
var NarrowStyledLabel = function (props) {
|
|
15494
15494
|
var active = props.active;
|
|
15495
|
-
return css(templateObject_9$
|
|
15495
|
+
return css(templateObject_9$4 || (templateObject_9$4 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), active ? fontBodySemiboldL(props) : fontBodyMediumL(props));
|
|
15496
|
+
};
|
|
15497
|
+
var StyledLabel$1 = styled$2("span", {
|
|
15498
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
15499
|
+
})(templateObject_11$3 || (templateObject_11$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
15500
|
+
var hasInvertedStyle = props.hasInvertedStyle, active = props.active, isNarrow = props.isNarrow;
|
|
15501
|
+
var spaces = getSpaces(props);
|
|
15502
|
+
var colors = getSemanticColors(props);
|
|
15503
|
+
var activeColor = hasInvertedStyle
|
|
15504
|
+
? colors === null || colors === void 0 ? void 0 : colors.base.textPrimaryOnDark
|
|
15505
|
+
: colors === null || colors === void 0 ? void 0 : colors.base.textPrimary;
|
|
15506
|
+
var inactiveColor = hasInvertedStyle
|
|
15507
|
+
? colors === null || colors === void 0 ? void 0 : colors.base.textSecondaryOnDark
|
|
15508
|
+
: colors === null || colors === void 0 ? void 0 : colors.base.textSecondary;
|
|
15509
|
+
return [
|
|
15510
|
+
active ? fontBodySemiboldS(props) : fontBodyMediumS(props),
|
|
15511
|
+
css(templateObject_10$4 || (templateObject_10$4 = __makeTemplateObject(["\n position: relative;\n display: flex;\n align-items: center;\n gap: ", "px;\n color: ", ";\n\n /* TODO: Double check with Connor! */\n /* ", " {\n margin-right: -", "px;margin-right\n } */\n\n ", "\n "], ["\n position: relative;\n display: flex;\n align-items: center;\n gap: ", "px;\n color: ", ";\n\n /* TODO: Double check with Connor! */\n /* ", " {\n margin-right: -", "px;margin-right\n } */\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xs, active ? activeColor : inactiveColor, StyledTag$1, spaces === null || spaces === void 0 ? void 0 : spaces.s, isNarrow && NarrowStyledLabel(props)),
|
|
15512
|
+
];
|
|
15513
|
+
});
|
|
15514
|
+
var templateObject_1$k, templateObject_2$c, templateObject_3$8, templateObject_4$8, templateObject_5$7, templateObject_6$6, templateObject_7$4, templateObject_8$4, templateObject_9$4, templateObject_10$4, templateObject_11$3;
|
|
15515
|
+
|
|
15516
|
+
var doNotForwardProps$8 = [
|
|
15517
|
+
"active",
|
|
15518
|
+
"hasInvertedStyle",
|
|
15519
|
+
"isNarrow",
|
|
15520
|
+
"hasSection",
|
|
15521
|
+
"innerSdsStyle",
|
|
15522
|
+
"defaultUrl",
|
|
15523
|
+
"hasDetails",
|
|
15524
|
+
"hasIcon",
|
|
15525
|
+
"sectionProps",
|
|
15526
|
+
"navVariant",
|
|
15527
|
+
"itemType",
|
|
15528
|
+
];
|
|
15529
|
+
var NarrowNavItemStyles = function (props) {
|
|
15530
|
+
var _a, _b, _c;
|
|
15531
|
+
var active = props.active, hasInvertedStyle = props.hasInvertedStyle, innerSdsStyle = props.innerSdsStyle, navVariant = props.navVariant;
|
|
15532
|
+
var spaces = getSpaces(props);
|
|
15533
|
+
var semanticColors = getSemanticColors(props);
|
|
15534
|
+
var corners = getCorners(props);
|
|
15535
|
+
var ChevronHoverColor = hasInvertedStyle
|
|
15536
|
+
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentSecondaryHoverOnDark
|
|
15537
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.ornamentSecondaryHover;
|
|
15538
|
+
return css(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n ", "\n border-radius: ", "px;\n padding: ", "px\n ", "px;\n ", "\n ", "\n width: 100%;\n\n &:hover {\n ", "\n box-shadow: none;\n\n ", " {\n color: ", ";\n }\n\n svg {\n color: ", " !important;\n }\n }\n "], ["\n ", "\n border-radius: ", "px;\n padding: ", "px\n ", "px;\n ", "\n ", "\n width: 100%;\n\n &:hover {\n ", "\n box-shadow: none;\n\n ", " {\n color: ", ";\n }\n\n svg {\n color: ", " !important;\n }\n }\n "])), active ? fontBodySemiboldL(props) : fontBodyMediumL(props), corners === null || corners === void 0 ? void 0 : corners.l, spaces === null || spaces === void 0 ? void 0 : spaces.s, navVariant === "primary" ? spaces === null || spaces === void 0 ? void 0 : spaces.l : spaces === null || spaces === void 0 ? void 0 : spaces.m, navVariant === "primary" ? "justify-content: start;" : "", innerSdsStyle === "drawer"
|
|
15539
|
+
? css(templateObject_1$j || (templateObject_1$j = __makeTemplateObject(["\n background-color: transparent !important;\n "], ["\n background-color: transparent !important;\n "]))) : css(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n background-color: ", ";\n "], ["\n background-color: ", ";\n "])), active
|
|
15540
|
+
? hasInvertedStyle
|
|
15541
|
+
? (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillPressedOnDark
|
|
15542
|
+
: (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillPressed
|
|
15543
|
+
: "transparent"), innerSdsStyle === "drawer"
|
|
15544
|
+
? css(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n background: transparent !important;\n "], ["\n background: transparent !important;\n "]))) : css(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n background: ", ";\n "], ["\n background: ", ";\n "])), hasInvertedStyle
|
|
15545
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHoverOnDark
|
|
15546
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHover), navVariant === "primary" && StyledLabel, hasInvertedStyle
|
|
15547
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
15548
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, ChevronHoverColor);
|
|
15496
15549
|
};
|
|
15550
|
+
var UnifiedNavItem = styled$2(Button, {
|
|
15551
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$8.includes(prop); },
|
|
15552
|
+
})(templateObject_8$3 || (templateObject_8$3 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n min-width: fit-content;\n border: none;\n background: transparent;\n\n ", "\n"], ["\n display: flex;\n align-items: center;\n min-width: fit-content;\n border: none;\n background: transparent;\n\n ", "\n"])), function (props) {
|
|
15553
|
+
var _a, _b, _c;
|
|
15554
|
+
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow, active = props.active, navVariant = props.navVariant;
|
|
15555
|
+
var spaces = getSpaces(props);
|
|
15556
|
+
var semanticColors = getSemanticColors(props);
|
|
15557
|
+
var corners = getCorners(props);
|
|
15558
|
+
var textDefaultColor = hasInvertedStyle
|
|
15559
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryOnDark
|
|
15560
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary;
|
|
15561
|
+
var textActiveColor = hasInvertedStyle
|
|
15562
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
15563
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary;
|
|
15564
|
+
var ChevronDefaultColor = hasInvertedStyle
|
|
15565
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.ornamentSecondaryOnDark
|
|
15566
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.ornamentSecondary;
|
|
15567
|
+
var ChevronHoverColor = hasInvertedStyle
|
|
15568
|
+
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.ornamentSecondaryHoverOnDark
|
|
15569
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.ornamentSecondaryHover;
|
|
15570
|
+
var ChevronOpenColor = hasInvertedStyle
|
|
15571
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.ornamentSecondaryPressedOnDark
|
|
15572
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.ornamentSecondaryPressed;
|
|
15573
|
+
return [
|
|
15574
|
+
navVariant === "secondary" &&
|
|
15575
|
+
(active ? fontBodySemiboldS(props) : fontBodyMediumS(props)),
|
|
15576
|
+
css(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n padding: ", "px ", "px;\n border-radius: ", "px;\n background-color: ", ";\n\n ", "\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", " !important;\n box-shadow: none;\n\n ", " {\n color: ", ";\n }\n\n svg {\n color: ", " !important;\n }\n }\n\n ", "\n "], ["\n padding: ", "px ", "px;\n border-radius: ", "px;\n background-color: ", ";\n\n ", "\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", " !important;\n box-shadow: none;\n\n ", " {\n color: ", ";\n }\n\n svg {\n color: ", " !important;\n }\n }\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, spaces === null || spaces === void 0 ? void 0 : spaces.m, corners === null || corners === void 0 ? void 0 : corners.l, active
|
|
15577
|
+
? hasInvertedStyle
|
|
15578
|
+
? (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillPressedOnDark
|
|
15579
|
+
: (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillPressed
|
|
15580
|
+
: "transparent", navVariant === "secondary"
|
|
15581
|
+
? css(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n gap: ", "px;\n color: ", ";\n justify-content: flex-start;\n width: fit-content;\n "], ["\n gap: ", "px;\n color: ", ";\n justify-content: flex-start;\n width: fit-content;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xs, active ? textActiveColor : textDefaultColor) : "", active ? ChevronOpenColor : ChevronDefaultColor, hasInvertedStyle
|
|
15582
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHoverOnDark
|
|
15583
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHover, navVariant === "primary" && StyledLabel, hasInvertedStyle
|
|
15584
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryOnDark
|
|
15585
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, ChevronHoverColor, isNarrow && NarrowNavItemStyles(props)),
|
|
15586
|
+
];
|
|
15587
|
+
});
|
|
15588
|
+
// StyledLabel for primary nav items (secondary nav doesn't use this)
|
|
15497
15589
|
var StyledLabel = styled$2("span", {
|
|
15498
15590
|
shouldForwardProp: function (prop) { return !doNotForwardProps$8.includes(prop); },
|
|
15499
15591
|
})(templateObject_11$2 || (templateObject_11$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
@@ -15508,7 +15600,7 @@ var StyledLabel = styled$2("span", {
|
|
|
15508
15600
|
: colors === null || colors === void 0 ? void 0 : colors.base.textSecondary;
|
|
15509
15601
|
return [
|
|
15510
15602
|
active ? fontBodySemiboldS(props) : fontBodyMediumS(props),
|
|
15511
|
-
css(templateObject_10$3 || (templateObject_10$3 = __makeTemplateObject(["\n position: relative;\n display: flex;\n align-items: center;\n gap: ", "px;\n color: ", ";\n\n
|
|
15603
|
+
css(templateObject_10$3 || (templateObject_10$3 = __makeTemplateObject(["\n position: relative;\n display: flex;\n align-items: center;\n gap: ", "px;\n color: ", ";\n\n ", "\n "], ["\n position: relative;\n display: flex;\n align-items: center;\n gap: ", "px;\n color: ", ";\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xs, active ? activeColor : inactiveColor, isNarrow && css(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), active ? fontBodySemiboldL(props) : fontBodyMediumL(props))),
|
|
15512
15604
|
];
|
|
15513
15605
|
});
|
|
15514
15606
|
var templateObject_1$j, templateObject_2$b, templateObject_3$7, templateObject_4$7, templateObject_5$6, templateObject_6$5, templateObject_7$3, templateObject_8$3, templateObject_9$3, templateObject_10$3, templateObject_11$2;
|
|
@@ -15800,41 +15892,32 @@ function AccordionNavItem(props) {
|
|
|
15800
15892
|
}) })] }, accordionId));
|
|
15801
15893
|
}
|
|
15802
15894
|
|
|
15803
|
-
|
|
15804
|
-
|
|
15805
|
-
|
|
15806
|
-
|
|
15807
|
-
|
|
15808
|
-
var
|
|
15895
|
+
/**
|
|
15896
|
+
* Custom hook to manage navigation drawer and dropdown state
|
|
15897
|
+
* Includes hover delay logic for smooth drawer transitions
|
|
15898
|
+
*/
|
|
15899
|
+
function useNavigationState() {
|
|
15900
|
+
var _a = useState(null), anchorEl = _a[0], setAnchorEl = _a[1];
|
|
15901
|
+
var _b = useState(null), activeDropdownKey = _b[0], setActiveDropdownKey = _b[1];
|
|
15902
|
+
var _c = useState(null), activeDrawerKey = _c[0], setActiveDrawerKey = _c[1];
|
|
15809
15903
|
var buttonRef = useRef(null);
|
|
15810
|
-
var
|
|
15904
|
+
var _d = useState("100%"), menuWidth = _d[0], setMenuWidth = _d[1];
|
|
15811
15905
|
var hoverTimeoutRef = useRef(null);
|
|
15812
|
-
var
|
|
15813
|
-
var
|
|
15906
|
+
var hoverEnterTimeoutRef = useRef(null);
|
|
15907
|
+
var _e = useState(null), contentKey = _e[0], setContentKey = _e[1];
|
|
15908
|
+
var _f = useState(false), isContentFading = _f[0], setIsContentFading = _f[1];
|
|
15814
15909
|
var open = Boolean(anchorEl);
|
|
15815
15910
|
var drawerOpen = activeDrawerKey !== null;
|
|
15816
|
-
// Helper function to wrap dropdown items' onClick handlers
|
|
15817
|
-
// This automatically sets the parent dropdown as active when an item is clicked
|
|
15818
|
-
var wrapDropdownItemsWithActiveKey = function (dropdownItems, parentKey) {
|
|
15819
|
-
return dropdownItems.map(function (item) {
|
|
15820
|
-
var originalOnClick = item.onClick;
|
|
15821
|
-
return __assign(__assign({}, item), { onClick: function (e) {
|
|
15822
|
-
// Call original onClick if it exists
|
|
15823
|
-
originalOnClick === null || originalOnClick === void 0 ? void 0 : originalOnClick(e);
|
|
15824
|
-
// Set the active key to the parent dropdown's key
|
|
15825
|
-
onChange(parentKey);
|
|
15826
|
-
} });
|
|
15827
|
-
});
|
|
15828
|
-
};
|
|
15829
15911
|
function onClose() {
|
|
15830
15912
|
setAnchorEl(null);
|
|
15831
15913
|
setActiveDropdownKey(null);
|
|
15832
|
-
// Close mobile drawer when in narrow mode
|
|
15833
|
-
if (isNarrow) {
|
|
15834
|
-
onCloseProp === null || onCloseProp === void 0 ? void 0 : onCloseProp();
|
|
15835
|
-
}
|
|
15836
15914
|
}
|
|
15837
15915
|
function onDrawerClose() {
|
|
15916
|
+
// Clear any pending hover enter timeout
|
|
15917
|
+
if (hoverEnterTimeoutRef.current) {
|
|
15918
|
+
clearTimeout(hoverEnterTimeoutRef.current);
|
|
15919
|
+
}
|
|
15920
|
+
// Clear any existing close timeout
|
|
15838
15921
|
if (hoverTimeoutRef.current) {
|
|
15839
15922
|
clearTimeout(hoverTimeoutRef.current);
|
|
15840
15923
|
}
|
|
@@ -15844,20 +15927,28 @@ function NavigationHeaderPrimaryNav(_a) {
|
|
|
15844
15927
|
}, 200);
|
|
15845
15928
|
}
|
|
15846
15929
|
function onDrawerOpen(key) {
|
|
15930
|
+
// Clear any pending close timeout
|
|
15847
15931
|
if (hoverTimeoutRef.current) {
|
|
15848
15932
|
clearTimeout(hoverTimeoutRef.current);
|
|
15849
15933
|
}
|
|
15850
|
-
// If drawer is already open with different content,
|
|
15934
|
+
// If drawer is already open with different content, add a delay before changing
|
|
15851
15935
|
if (activeDrawerKey !== null && activeDrawerKey !== key) {
|
|
15852
|
-
|
|
15853
|
-
|
|
15854
|
-
|
|
15855
|
-
|
|
15856
|
-
|
|
15857
|
-
|
|
15936
|
+
// Clear any pending hover enter timeout
|
|
15937
|
+
if (hoverEnterTimeoutRef.current) {
|
|
15938
|
+
clearTimeout(hoverEnterTimeoutRef.current);
|
|
15939
|
+
}
|
|
15940
|
+
// Wait 100ms before changing content
|
|
15941
|
+
hoverEnterTimeoutRef.current = setTimeout(function () {
|
|
15942
|
+
setIsContentFading(true);
|
|
15943
|
+
setTimeout(function () {
|
|
15944
|
+
setActiveDrawerKey(key);
|
|
15945
|
+
setContentKey(key);
|
|
15946
|
+
setIsContentFading(false);
|
|
15947
|
+
}, 100);
|
|
15948
|
+
}, 100);
|
|
15858
15949
|
}
|
|
15859
15950
|
else {
|
|
15860
|
-
// First time opening or reopening same drawer
|
|
15951
|
+
// First time opening or reopening same drawer - open immediately
|
|
15861
15952
|
setActiveDrawerKey(key);
|
|
15862
15953
|
setContentKey(key);
|
|
15863
15954
|
setIsContentFading(false);
|
|
@@ -15868,19 +15959,18 @@ function NavigationHeaderPrimaryNav(_a) {
|
|
|
15868
15959
|
clearTimeout(hoverTimeoutRef.current);
|
|
15869
15960
|
}
|
|
15870
15961
|
}
|
|
15962
|
+
// Cleanup timeouts on unmount
|
|
15871
15963
|
useEffect(function () {
|
|
15872
15964
|
return function () {
|
|
15873
15965
|
if (hoverTimeoutRef.current) {
|
|
15874
15966
|
clearTimeout(hoverTimeoutRef.current);
|
|
15875
15967
|
}
|
|
15968
|
+
if (hoverEnterTimeoutRef.current) {
|
|
15969
|
+
clearTimeout(hoverEnterTimeoutRef.current);
|
|
15970
|
+
}
|
|
15876
15971
|
};
|
|
15877
15972
|
}, []);
|
|
15878
|
-
//
|
|
15879
|
-
useEffect(function () {
|
|
15880
|
-
if (sdsStyle === "drawer" && onDrawerStateChange) {
|
|
15881
|
-
onDrawerStateChange(drawerOpen);
|
|
15882
|
-
}
|
|
15883
|
-
}, [drawerOpen, sdsStyle, onDrawerStateChange]);
|
|
15973
|
+
// Update menu width when button ref changes
|
|
15884
15974
|
useEffect(function () {
|
|
15885
15975
|
var button = buttonRef.current;
|
|
15886
15976
|
if (!button) {
|
|
@@ -15888,6 +15978,59 @@ function NavigationHeaderPrimaryNav(_a) {
|
|
|
15888
15978
|
}
|
|
15889
15979
|
setMenuWidth(button.offsetWidth);
|
|
15890
15980
|
}, []);
|
|
15981
|
+
return {
|
|
15982
|
+
// State
|
|
15983
|
+
anchorEl: anchorEl,
|
|
15984
|
+
activeDropdownKey: activeDropdownKey,
|
|
15985
|
+
activeDrawerKey: activeDrawerKey,
|
|
15986
|
+
contentKey: contentKey,
|
|
15987
|
+
isContentFading: isContentFading,
|
|
15988
|
+
open: open,
|
|
15989
|
+
drawerOpen: drawerOpen,
|
|
15990
|
+
buttonRef: buttonRef,
|
|
15991
|
+
menuWidth: menuWidth,
|
|
15992
|
+
// Actions
|
|
15993
|
+
setAnchorEl: setAnchorEl,
|
|
15994
|
+
setActiveDropdownKey: setActiveDropdownKey,
|
|
15995
|
+
setActiveDrawerKey: setActiveDrawerKey,
|
|
15996
|
+
setContentKey: setContentKey,
|
|
15997
|
+
onClose: onClose,
|
|
15998
|
+
onDrawerClose: onDrawerClose,
|
|
15999
|
+
onDrawerOpen: onDrawerOpen,
|
|
16000
|
+
cancelDrawerClose: cancelDrawerClose,
|
|
16001
|
+
};
|
|
16002
|
+
}
|
|
16003
|
+
|
|
16004
|
+
function NavigationHeaderPrimaryNav(_a) {
|
|
16005
|
+
var menuProps = _a.menuProps, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow, items = _a.items, onChange = _a.onChange, value = _a.value, _b = _a.sdsStyle, sdsStyle = _b === void 0 ? "dropdown" : _b, expandedAccordion = _a.expandedAccordion, setExpandedAccordion = _a.setExpandedAccordion, accordionRefs = _a.accordionRefs, scrollToAccordion = _a.scrollToAccordion, onDrawerStateChange = _a.onDrawerStateChange, _c = _a.topOffset, topOffset = _c === void 0 ? 0 : _c, onCloseProp = _a.onClose;
|
|
16006
|
+
var theme = useTheme$4();
|
|
16007
|
+
var _d = useNavigationState(), anchorEl = _d.anchorEl, activeDropdownKey = _d.activeDropdownKey, activeDrawerKey = _d.activeDrawerKey, contentKey = _d.contentKey, isContentFading = _d.isContentFading, open = _d.open, drawerOpen = _d.drawerOpen, buttonRef = _d.buttonRef, menuWidth = _d.menuWidth, setAnchorEl = _d.setAnchorEl, setActiveDropdownKey = _d.setActiveDropdownKey, setActiveDrawerKey = _d.setActiveDrawerKey, setContentKey = _d.setContentKey, handleClose = _d.onClose, onDrawerClose = _d.onDrawerClose, onDrawerOpen = _d.onDrawerOpen, cancelDrawerClose = _d.cancelDrawerClose;
|
|
16008
|
+
// Helper function to wrap dropdown items' onClick handlers
|
|
16009
|
+
// This automatically sets the parent dropdown as active when an item is clicked
|
|
16010
|
+
var wrapDropdownItemsWithActiveKey = function (dropdownItems, parentKey) {
|
|
16011
|
+
return dropdownItems.map(function (item) {
|
|
16012
|
+
var originalOnClick = item.onClick;
|
|
16013
|
+
return __assign(__assign({}, item), { onClick: function (e) {
|
|
16014
|
+
// Call original onClick if it exists
|
|
16015
|
+
originalOnClick === null || originalOnClick === void 0 ? void 0 : originalOnClick(e);
|
|
16016
|
+
// Set the active key to the parent dropdown's key
|
|
16017
|
+
onChange(parentKey);
|
|
16018
|
+
} });
|
|
16019
|
+
});
|
|
16020
|
+
};
|
|
16021
|
+
function onClose() {
|
|
16022
|
+
handleClose();
|
|
16023
|
+
// Close mobile drawer when in narrow mode
|
|
16024
|
+
if (isNarrow) {
|
|
16025
|
+
onCloseProp === null || onCloseProp === void 0 ? void 0 : onCloseProp();
|
|
16026
|
+
}
|
|
16027
|
+
}
|
|
16028
|
+
// Notify parent when drawer state changes (only for drawer style)
|
|
16029
|
+
useEffect(function () {
|
|
16030
|
+
if (sdsStyle === "drawer" && onDrawerStateChange) {
|
|
16031
|
+
onDrawerStateChange(drawerOpen);
|
|
16032
|
+
}
|
|
16033
|
+
}, [drawerOpen, sdsStyle, onDrawerStateChange]);
|
|
15891
16034
|
var renderDrawerItem = function (item, key, label, parentOnClick, rest) {
|
|
15892
16035
|
var isDrawerOpen = drawerOpen && activeDrawerKey === key;
|
|
15893
16036
|
var isActive = key === value || isDrawerOpen;
|
|
@@ -15898,18 +16041,18 @@ function NavigationHeaderPrimaryNav(_a) {
|
|
|
15898
16041
|
onChange(key);
|
|
15899
16042
|
parentOnClick === null || parentOnClick === void 0 ? void 0 : parentOnClick(e);
|
|
15900
16043
|
};
|
|
15901
|
-
return (jsx(StyledHoverDrawerContainer, { onMouseEnter: function () { return onDrawerOpen(key); }, onMouseLeave: onDrawerClose, children: jsx(
|
|
16044
|
+
return (jsx(StyledHoverDrawerContainer, { onMouseEnter: function () { return onDrawerOpen(key); }, onMouseLeave: onDrawerClose, children: jsx(UnifiedNavItem, __assign({}, rest, { itemType: item.itemType, active: isActive, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, sdsStyle: "minimal", onClick: handleClick, innerSdsStyle: sdsStyle, navVariant: "primary", component: componentProp, href: defaultUrl, target: target, rel: rel, children: jsxs(StyledLabel, { itemType: item.itemType, active: isActive, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, navVariant: "primary", children: [jsx(StyledLabelTextWrapper$1, { active: isActive, isNarrow: isNarrow, children: label }), jsx(StyledLabelTextWrapperShadow$1, { "aria-hidden": "true", isNarrow: isNarrow, children: label }), jsx(Icon, { sdsIcon: isDrawerOpen ? "ChevronUp" : "ChevronDown", sdsSize: "xs" })] }) })) }, key));
|
|
15902
16045
|
};
|
|
15903
16046
|
var renderDropdownItem = function (item, key, label, parentOnClick, rest) {
|
|
15904
16047
|
var _a, _b;
|
|
15905
16048
|
var isDropdownOpen = open && activeDropdownKey === key;
|
|
15906
16049
|
var isActive = key === value || isDropdownOpen;
|
|
15907
|
-
return (jsxs(Fragment$1, { children: [jsx(
|
|
16050
|
+
return (jsxs(Fragment$1, { children: [jsx(UnifiedNavItem, __assign({}, rest, { itemType: item.itemType, ref: buttonRef, active: isActive, onClick: function (e) {
|
|
15908
16051
|
setAnchorEl(e.currentTarget);
|
|
15909
16052
|
setActiveDropdownKey(key);
|
|
15910
16053
|
onChange(key);
|
|
15911
16054
|
parentOnClick === null || parentOnClick === void 0 ? void 0 : parentOnClick(e);
|
|
15912
|
-
}, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, sdsStyle: "minimal", innerSdsStyle: sdsStyle, children: jsxs(StyledLabel, { itemType: item.itemType, active: isActive, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: [jsx(StyledLabelTextWrapper$1, { active: isActive, isNarrow: isNarrow, children: label }), jsx(StyledLabelTextWrapperShadow$1, { "aria-hidden": "true", isNarrow: isNarrow, children: label }), jsx(Icon, { sdsIcon: isDropdownOpen ? "ChevronUp" : "ChevronDown", sdsSize: "xs" })] }) })), jsx(Menu, __assign({ anchorEl: anchorEl, open: isDropdownOpen, onClose: onClose, slotProps: {
|
|
16055
|
+
}, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, sdsStyle: "minimal", innerSdsStyle: sdsStyle, navVariant: "primary", children: jsxs(StyledLabel, { itemType: item.itemType, active: isActive, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, navVariant: "primary", children: [jsx(StyledLabelTextWrapper$1, { active: isActive, isNarrow: isNarrow, children: label }), jsx(StyledLabelTextWrapperShadow$1, { "aria-hidden": "true", isNarrow: isNarrow, children: label }), jsx(Icon, { sdsIcon: isDropdownOpen ? "ChevronUp" : "ChevronDown", sdsSize: "xs" })] }) })), jsx(Menu, __assign({ anchorEl: anchorEl, open: isDropdownOpen, onClose: onClose, slotProps: {
|
|
15913
16056
|
paper: {
|
|
15914
16057
|
style: {
|
|
15915
16058
|
marginTop: (_b = (_a = theme === null || theme === void 0 ? void 0 : theme.app) === null || _a === void 0 ? void 0 : _a.spacing) === null || _b === void 0 ? void 0 : _b.s,
|
|
@@ -15950,11 +16093,11 @@ function NavigationHeaderPrimaryNav(_a) {
|
|
|
15950
16093
|
};
|
|
15951
16094
|
var renderTextItem = function (item, key, label, tag, tagColor, rest) {
|
|
15952
16095
|
var isActive = key === value;
|
|
15953
|
-
return (jsx(
|
|
16096
|
+
return (jsx(UnifiedNavItem, __assign({}, rest, { active: isActive, sdsStyle: "minimal", onClick: function (e) {
|
|
15954
16097
|
var _a;
|
|
15955
16098
|
onChange(key);
|
|
15956
16099
|
(_a = item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, e);
|
|
15957
|
-
}, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, innerSdsStyle: sdsStyle, children: jsxs(StyledLabel, { active: isActive, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: [jsx(StyledLabelTextWrapper$1, { active: isActive, isNarrow: isNarrow, children: label }), jsx(StyledLabelTextWrapperShadow$1, { "aria-hidden": "true", isNarrow: isNarrow, children: label }), tag && (jsx(StyledTag$1, { label: tag, color: tagColor, hover: false }))] }) }), key));
|
|
16100
|
+
}, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, innerSdsStyle: sdsStyle, navVariant: "primary", children: jsxs(StyledLabel, { active: isActive, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, navVariant: "primary", children: [jsx(StyledLabelTextWrapper$1, { active: isActive, isNarrow: isNarrow, children: label }), jsx(StyledLabelTextWrapperShadow$1, { "aria-hidden": "true", isNarrow: isNarrow, children: label }), tag && (jsx(StyledTag$1, { label: tag, color: tagColor, hover: false }))] }) }), key));
|
|
15958
16101
|
};
|
|
15959
16102
|
// Get the active drawer item for rendering shared content
|
|
15960
16103
|
var activeDrawerItem = items.find(function (item) { return item.itemType === "dropdown" && item.key === contentKey; });
|
|
@@ -15981,7 +16124,7 @@ function NavigationHeaderPrimaryNav(_a) {
|
|
|
15981
16124
|
}) }), sdsStyle === "drawer" && !isNarrow && (jsx(StyledMegaMenuDrawer, { anchor: "top", open: drawerOpen, onClose: function () {
|
|
15982
16125
|
setActiveDrawerKey(null);
|
|
15983
16126
|
setContentKey(null);
|
|
15984
|
-
}, hasInvertedStyle: hasInvertedStyle, hideBackdrop: false, disableScrollLock: true, transitionDuration:
|
|
16127
|
+
}, hasInvertedStyle: hasInvertedStyle, hideBackdrop: false, disableScrollLock: true, transitionDuration: 100, topOffset: topOffset, SlideProps: {
|
|
15985
16128
|
onMouseEnter: cancelDrawerClose,
|
|
15986
16129
|
onMouseLeave: onDrawerClose,
|
|
15987
16130
|
}, children: jsx(StyledMegaMenuContent, { hasInvertedStyle: hasInvertedStyle, style: {
|
|
@@ -16058,7 +16201,7 @@ var NarrowStyledTextItem = function (props) {
|
|
|
16058
16201
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHoverOnDark
|
|
16059
16202
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.fillHover);
|
|
16060
16203
|
};
|
|
16061
|
-
|
|
16204
|
+
styled$2(Button, {
|
|
16062
16205
|
shouldForwardProp: function (prop) {
|
|
16063
16206
|
return !ButtonDoNotForwardProps.includes(prop);
|
|
16064
16207
|
},
|
|
@@ -16101,99 +16244,39 @@ var templateObject_1$g, templateObject_2$8, templateObject_3$4, templateObject_4
|
|
|
16101
16244
|
|
|
16102
16245
|
function NavigationHeaderSecondaryNav(_a) {
|
|
16103
16246
|
var menuProps = _a.menuProps, items = _a.items, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow, _b = _a.sdsStyle, sdsStyle = _b === void 0 ? "dropdown" : _b, expandedAccordion = _a.expandedAccordion, setExpandedAccordion = _a.setExpandedAccordion, accordionRefs = _a.accordionRefs, scrollToAccordion = _a.scrollToAccordion, onDrawerStateChange = _a.onDrawerStateChange, _c = _a.topOffset, topOffset = _c === void 0 ? 0 : _c, onCloseProp = _a.onClose;
|
|
16104
|
-
var _d = useState(null), anchorEl = _d[0], setAnchorEl = _d[1];
|
|
16105
|
-
var _e = useState(null), activeDropdownKey = _e[0], setActiveDropdownKey = _e[1];
|
|
16106
|
-
var _f = useState(null), activeDrawerKey = _f[0], setActiveDrawerKey = _f[1];
|
|
16107
16247
|
var theme = useTheme$4();
|
|
16108
|
-
var
|
|
16109
|
-
var _g = useState(null), contentKey = _g[0], setContentKey = _g[1];
|
|
16110
|
-
var _h = useState(false), isContentFading = _h[0], setIsContentFading = _h[1];
|
|
16111
|
-
var open = Boolean(anchorEl);
|
|
16112
|
-
var drawerOpen = activeDrawerKey !== null;
|
|
16248
|
+
var _d = useNavigationState(), anchorEl = _d.anchorEl, activeDropdownKey = _d.activeDropdownKey, activeDrawerKey = _d.activeDrawerKey, contentKey = _d.contentKey, isContentFading = _d.isContentFading, open = _d.open, drawerOpen = _d.drawerOpen, buttonRef = _d.buttonRef, menuWidth = _d.menuWidth, setAnchorEl = _d.setAnchorEl, setActiveDropdownKey = _d.setActiveDropdownKey, setActiveDrawerKey = _d.setActiveDrawerKey, setContentKey = _d.setContentKey, handleClose = _d.onClose, onDrawerClose = _d.onDrawerClose, onDrawerOpen = _d.onDrawerOpen, cancelDrawerClose = _d.cancelDrawerClose;
|
|
16113
16249
|
function onClose() {
|
|
16114
|
-
|
|
16115
|
-
setActiveDropdownKey(null);
|
|
16250
|
+
handleClose();
|
|
16116
16251
|
// Close mobile drawer when in narrow mode
|
|
16117
16252
|
if (isNarrow) {
|
|
16118
16253
|
onCloseProp === null || onCloseProp === void 0 ? void 0 : onCloseProp();
|
|
16119
16254
|
}
|
|
16120
16255
|
}
|
|
16121
|
-
function onDrawerClose() {
|
|
16122
|
-
if (hoverTimeoutRef.current) {
|
|
16123
|
-
clearTimeout(hoverTimeoutRef.current);
|
|
16124
|
-
}
|
|
16125
|
-
hoverTimeoutRef.current = setTimeout(function () {
|
|
16126
|
-
setActiveDrawerKey(null);
|
|
16127
|
-
setContentKey(null);
|
|
16128
|
-
}, 200);
|
|
16129
|
-
}
|
|
16130
|
-
function onDrawerOpen(key) {
|
|
16131
|
-
if (hoverTimeoutRef.current) {
|
|
16132
|
-
clearTimeout(hoverTimeoutRef.current);
|
|
16133
|
-
}
|
|
16134
|
-
// If drawer is already open with different content, fade out then change
|
|
16135
|
-
if (activeDrawerKey !== null && activeDrawerKey !== key) {
|
|
16136
|
-
setIsContentFading(true);
|
|
16137
|
-
setTimeout(function () {
|
|
16138
|
-
setActiveDrawerKey(key);
|
|
16139
|
-
setContentKey(key);
|
|
16140
|
-
setIsContentFading(false);
|
|
16141
|
-
}, 150);
|
|
16142
|
-
}
|
|
16143
|
-
else {
|
|
16144
|
-
// First time opening or reopening same drawer
|
|
16145
|
-
setActiveDrawerKey(key);
|
|
16146
|
-
setContentKey(key);
|
|
16147
|
-
setIsContentFading(false);
|
|
16148
|
-
}
|
|
16149
|
-
}
|
|
16150
|
-
function cancelDrawerClose() {
|
|
16151
|
-
if (hoverTimeoutRef.current) {
|
|
16152
|
-
clearTimeout(hoverTimeoutRef.current);
|
|
16153
|
-
}
|
|
16154
|
-
}
|
|
16155
|
-
useEffect(function () {
|
|
16156
|
-
return function () {
|
|
16157
|
-
if (hoverTimeoutRef.current) {
|
|
16158
|
-
clearTimeout(hoverTimeoutRef.current);
|
|
16159
|
-
}
|
|
16160
|
-
};
|
|
16161
|
-
}, []);
|
|
16162
16256
|
// Notify parent when drawer state changes (only for drawer style)
|
|
16163
16257
|
useEffect(function () {
|
|
16164
16258
|
if (sdsStyle === "drawer" && onDrawerStateChange) {
|
|
16165
16259
|
onDrawerStateChange(drawerOpen);
|
|
16166
16260
|
}
|
|
16167
16261
|
}, [drawerOpen, sdsStyle, onDrawerStateChange]);
|
|
16168
|
-
var
|
|
16169
|
-
|
|
16170
|
-
|
|
16171
|
-
var button = buttonRef.current;
|
|
16172
|
-
if (!button) {
|
|
16173
|
-
return;
|
|
16174
|
-
}
|
|
16175
|
-
setMenuWidth(button.offsetWidth);
|
|
16176
|
-
}, []);
|
|
16177
|
-
var renderDrawerItem = function (item, itemKey, label, tag, tagColor, rest) {
|
|
16178
|
-
var isDrawerOpen = drawerOpen && activeDrawerKey === itemKey;
|
|
16179
|
-
var defaultUrl = item.defaultUrl, component = item.component, target = item.target, rel = item.rel, onClick = item.onClick;
|
|
16262
|
+
var renderDrawerItem = function (item, key, label, parentOnClick, rest) {
|
|
16263
|
+
var isDrawerOpen = drawerOpen && activeDrawerKey === key;
|
|
16264
|
+
var defaultUrl = item.defaultUrl, component = item.component, target = item.target, rel = item.rel;
|
|
16180
16265
|
// If defaultUrl is provided without a component, default to anchor tag
|
|
16181
16266
|
var componentProp = defaultUrl && !component ? "a" : component;
|
|
16182
|
-
|
|
16183
|
-
|
|
16184
|
-
|
|
16267
|
+
var handleClick = function (e) {
|
|
16268
|
+
parentOnClick === null || parentOnClick === void 0 ? void 0 : parentOnClick(e);
|
|
16269
|
+
};
|
|
16270
|
+
return (jsx(StyledHoverDrawerContainer, { onMouseEnter: function () { return onDrawerOpen(key); }, onMouseLeave: onDrawerClose, children: jsxs(UnifiedNavItem, __assign({}, rest, { hasInvertedStyle: hasInvertedStyle, active: isDrawerOpen, isNarrow: isNarrow, sdsStyle: "minimal", innerSdsStyle: sdsStyle, navVariant: "secondary", onClick: handleClick, component: componentProp, href: defaultUrl, target: target, rel: rel, children: [jsx(StyledLabelTextWrapper$1, { active: isDrawerOpen, isNarrow: isNarrow, children: label }), jsx(StyledLabelTextWrapperShadow$1, { "aria-hidden": "true", isNarrow: isNarrow, children: label }), jsx(Icon, { sdsIcon: isDrawerOpen ? "ChevronUp" : "ChevronDown", sdsSize: "xs" })] })) }, key));
|
|
16185
16271
|
};
|
|
16186
|
-
var renderDropdownItem = function (item,
|
|
16272
|
+
var renderDropdownItem = function (item, key, label, parentOnClick, rest) {
|
|
16187
16273
|
var _a, _b;
|
|
16188
|
-
var isDropdownOpen = open && activeDropdownKey ===
|
|
16189
|
-
return (jsxs(Fragment$1, { children: [jsxs(
|
|
16190
|
-
|
|
16191
|
-
|
|
16192
|
-
|
|
16193
|
-
|
|
16194
|
-
setActiveDropdownKey(itemKey);
|
|
16195
|
-
(_a = item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, event);
|
|
16196
|
-
}, children: [jsx(StyledLabelTextWrapper$1, { active: isDropdownOpen, isNarrow: isNarrow, children: label }), jsx(StyledLabelTextWrapperShadow$1, { "aria-hidden": "true", isNarrow: isNarrow, children: label }), tag && (jsx(StyledTag, { label: tag, color: tagColor, hover: false })), jsx(Icon, { sdsIcon: isDropdownOpen ? "ChevronUp" : "ChevronDown", sdsSize: "xs" })] })), jsx(Menu, __assign({ anchorEl: anchorEl, open: isDropdownOpen, onClose: onClose, slotProps: {
|
|
16274
|
+
var isDropdownOpen = open && activeDropdownKey === key;
|
|
16275
|
+
return (jsxs(Fragment$1, { children: [jsxs(UnifiedNavItem, __assign({}, rest, { ref: buttonRef, hasInvertedStyle: hasInvertedStyle, active: isDropdownOpen, isNarrow: isNarrow, sdsStyle: "minimal", innerSdsStyle: sdsStyle, navVariant: "secondary", onClick: function (e) {
|
|
16276
|
+
setAnchorEl(e.currentTarget);
|
|
16277
|
+
setActiveDropdownKey(key);
|
|
16278
|
+
parentOnClick === null || parentOnClick === void 0 ? void 0 : parentOnClick(e);
|
|
16279
|
+
}, children: [jsx(StyledLabelTextWrapper$1, { active: isDropdownOpen, isNarrow: isNarrow, children: label }), jsx(StyledLabelTextWrapperShadow$1, { "aria-hidden": "true", isNarrow: isNarrow, children: label }), jsx(Icon, { sdsIcon: isDropdownOpen ? "ChevronUp" : "ChevronDown", sdsSize: "xs" })] })), jsx(Menu, __assign({ anchorEl: anchorEl, open: isDropdownOpen, onClose: onClose, slotProps: {
|
|
16197
16280
|
paper: {
|
|
16198
16281
|
style: {
|
|
16199
16282
|
marginTop: (_b = (_a = theme === null || theme === void 0 ? void 0 : theme.app) === null || _a === void 0 ? void 0 : _a.spacing) === null || _b === void 0 ? void 0 : _b.s,
|
|
@@ -16213,51 +16296,53 @@ function NavigationHeaderSecondaryNav(_a) {
|
|
|
16213
16296
|
var sectionItems = groupedItems[section];
|
|
16214
16297
|
var showDivider = hasMultipleSections && sectionIndex > 0;
|
|
16215
16298
|
return (jsxs("div", { children: [showDivider && (jsx(StyledDivider, { hasSection: !!section, isNarrow: isNarrow, hasInvertedStyle: hasInvertedStyle })), section && hasMultipleSections && (jsx(StyledSectionHeader, { isNarrow: isNarrow, hasInvertedStyle: hasInvertedStyle, children: section })), sectionItems.map(function (subItem) {
|
|
16216
|
-
var subLabel = subItem.label, onClick = subItem.onClick;
|
|
16217
|
-
return (jsx(MenuItem, { onClick: function (e) {
|
|
16299
|
+
var subLabel = subItem.label, onClick = subItem.onClick, sectionSubItemRestProps = __rest(subItem, ["label", "onClick"]);
|
|
16300
|
+
return (jsx(MenuItem, __assign({ onClick: function (e) {
|
|
16218
16301
|
onClick === null || onClick === void 0 ? void 0 : onClick(e);
|
|
16219
16302
|
onClose();
|
|
16220
|
-
}, sdsType: "action", sx: { minWidth: menuWidth }, children: subLabel }, "menu-item-".concat(subLabel)));
|
|
16303
|
+
}, sdsType: "action", sx: { minWidth: menuWidth } }, sectionSubItemRestProps, { icon: undefined, children: subLabel }), "menu-item-".concat(subLabel)));
|
|
16221
16304
|
})] }, "section-".concat(section || "default")));
|
|
16222
16305
|
});
|
|
16223
|
-
})() }))] },
|
|
16306
|
+
})() }))] }, key));
|
|
16224
16307
|
};
|
|
16225
|
-
var renderAccordionItem = function (item,
|
|
16308
|
+
var renderAccordionItem = function (item, _key) {
|
|
16309
|
+
var _a;
|
|
16310
|
+
var labelKebabCase = (_a = item.label) === null || _a === void 0 ? void 0 : _a.toString().toLowerCase().replace(" ", "-");
|
|
16226
16311
|
var accordionId = "".concat(labelKebabCase, "-dropdown");
|
|
16227
|
-
return (jsx(AccordionNavItem, { accordionId: accordionId, label: label, items: item.items, expandedAccordion: expandedAccordion, setExpandedAccordion: setExpandedAccordion, accordionRefs: accordionRefs, scrollToAccordion: scrollToAccordion, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, chevronSize: "s", onClose: onClose, sdsStyle: sdsStyle, sectionProps: item.sectionProps }, accordionId));
|
|
16312
|
+
return (jsx(AccordionNavItem, { accordionId: accordionId, label: item.label, items: item.items, expandedAccordion: expandedAccordion, setExpandedAccordion: setExpandedAccordion, accordionRefs: accordionRefs, scrollToAccordion: scrollToAccordion, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, chevronSize: isNarrow ? "s" : "xs", onClose: onClose, sdsStyle: sdsStyle, sectionProps: item.sectionProps }, accordionId));
|
|
16228
16313
|
};
|
|
16229
|
-
var renderTextItem = function (
|
|
16230
|
-
return (jsxs(
|
|
16314
|
+
var renderTextItem = function (item, key, label, tag, tagColor, rest) {
|
|
16315
|
+
return (jsxs(UnifiedNavItem, __assign({}, rest, { onClick: function (e) {
|
|
16316
|
+
var _a;
|
|
16317
|
+
(_a = item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, e);
|
|
16318
|
+
}, hasInvertedStyle: hasInvertedStyle, active: false, isNarrow: isNarrow, sdsStyle: "minimal", navVariant: "secondary", children: [label, tag && (jsx(StyledTag, { label: tag, color: tagColor, hover: false }))] }), key));
|
|
16231
16319
|
};
|
|
16232
16320
|
// Get the active drawer item for rendering shared content
|
|
16233
|
-
var activeDrawerItem = items.find(function (item
|
|
16234
|
-
|
|
16235
|
-
|
|
16236
|
-
var itemKey = String(key || "".concat(labelKebabCase, "-").concat(index));
|
|
16237
|
-
return item.itemType === "dropdown" && itemKey === contentKey;
|
|
16238
|
-
});
|
|
16239
|
-
return (jsxs(Fragment, { children: [jsx(StyledSection, { isNarrow: isNarrow, children: items.map(function (item, index) {
|
|
16240
|
-
var itemType = item.itemType, label = item.label, key = item.key, tag = item.tag, tagColor = item.tagColor, rest = __rest(item, ["itemType", "label", "key", "tag", "tagColor"]);
|
|
16241
|
-
var labelKebabCase = label === null || label === void 0 ? void 0 : label.toString().toLowerCase().replace(" ", "-");
|
|
16242
|
-
var itemKey = String(key || "".concat(labelKebabCase, "-").concat(index));
|
|
16321
|
+
var activeDrawerItem = items.find(function (item) { return item.itemType === "dropdown" && item.key === contentKey; });
|
|
16322
|
+
return (jsxs(Fragment, { children: [jsx(StyledSection, { isNarrow: isNarrow, children: items.map(function (item) {
|
|
16323
|
+
var key = item.key, label = item.label, tag = item.tag, tagColor = item.tagColor, parentOnClick = item.onClick, rest = __rest(item, ["key", "label", "tag", "tagColor", "onClick"]);
|
|
16243
16324
|
// Drawer style (hover-based)
|
|
16244
|
-
if (itemType === "dropdown" &&
|
|
16245
|
-
|
|
16325
|
+
if (item.itemType === "dropdown" &&
|
|
16326
|
+
!isNarrow &&
|
|
16327
|
+
sdsStyle === "drawer") {
|
|
16328
|
+
return renderDrawerItem(item, key, label, parentOnClick, rest);
|
|
16246
16329
|
}
|
|
16247
16330
|
// Dropdown style (click-based)
|
|
16248
|
-
if (itemType === "dropdown" &&
|
|
16249
|
-
|
|
16331
|
+
if (item.itemType === "dropdown" &&
|
|
16332
|
+
!isNarrow &&
|
|
16333
|
+
sdsStyle === "dropdown") {
|
|
16334
|
+
return renderDropdownItem(item, key, label, parentOnClick, rest);
|
|
16250
16335
|
}
|
|
16251
16336
|
// Narrow/Accordion style
|
|
16252
|
-
if (itemType === "dropdown" && isNarrow) {
|
|
16253
|
-
return renderAccordionItem(item
|
|
16337
|
+
if (item.itemType === "dropdown" && isNarrow) {
|
|
16338
|
+
return renderAccordionItem(item);
|
|
16254
16339
|
}
|
|
16255
16340
|
// Simple text item
|
|
16256
|
-
return renderTextItem(item
|
|
16341
|
+
return renderTextItem(item, key, label, "tag" in item ? tag : undefined, "tagColor" in item ? tagColor : undefined, rest);
|
|
16257
16342
|
}) }), sdsStyle === "drawer" && !isNarrow && (jsx(StyledMegaMenuDrawer, { anchor: "top", open: drawerOpen, onClose: function () {
|
|
16258
16343
|
setActiveDrawerKey(null);
|
|
16259
16344
|
setContentKey(null);
|
|
16260
|
-
}, hasInvertedStyle: hasInvertedStyle, hideBackdrop: false, disableScrollLock: true, transitionDuration:
|
|
16345
|
+
}, hasInvertedStyle: hasInvertedStyle, hideBackdrop: false, disableScrollLock: true, transitionDuration: 100, topOffset: topOffset, SlideProps: {
|
|
16261
16346
|
onMouseEnter: cancelDrawerClose,
|
|
16262
16347
|
onMouseLeave: onDrawerClose,
|
|
16263
16348
|
}, children: jsx(StyledMegaMenuContent, { hasInvertedStyle: hasInvertedStyle, style: {
|