@czi-sds/components 22.2.1 → 22.3.1
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 +142 -42
- package/dist/index.cjs.js +968 -373
- package/dist/index.esm.d.ts +142 -42
- package/dist/index.esm.js +964 -376
- package/dist/tailwind.json +18 -18
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/variables.css +18 -18
- package/dist/variables.scss +18 -18
- package/package.json +2 -2
package/dist/index.cjs.js
CHANGED
|
@@ -991,16 +991,16 @@ var SDSPaletteLight = function (appTheme) {
|
|
|
991
991
|
backgroundSecondary: appTheme.colors.gray[100],
|
|
992
992
|
backgroundSecondaryInverse: appTheme.colors.gray[700],
|
|
993
993
|
backgroundTertiary: appTheme.colors.gray[200],
|
|
994
|
-
border: appTheme.colors.gray[600],
|
|
995
|
-
borderDisabled: appTheme.colors.gray[300],
|
|
996
|
-
borderDisabledInverse: appTheme.colors.gray[600],
|
|
997
|
-
borderHover: appTheme.colors.gray[900],
|
|
998
|
-
borderHoverInverse: appTheme.colors.gray[50],
|
|
999
|
-
borderInverse: appTheme.colors.gray[300],
|
|
1000
994
|
borderOnFill: appTheme.colors.gray[50],
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
995
|
+
borderPrimary: appTheme.colors.gray[600],
|
|
996
|
+
borderPrimaryDisabled: appTheme.colors.gray[300],
|
|
997
|
+
borderPrimaryDisabledInverse: appTheme.colors.gray[600],
|
|
998
|
+
borderPrimaryHover: appTheme.colors.gray[900],
|
|
999
|
+
borderPrimaryHoverInverse: appTheme.colors.gray[50],
|
|
1000
|
+
borderPrimaryInverse: appTheme.colors.gray[300],
|
|
1001
|
+
borderPrimaryPressed: appTheme.colors.gray[900],
|
|
1002
|
+
borderPrimaryPressedInverse: appTheme.colors.gray[50],
|
|
1003
|
+
borderSecondary: appTheme.colors.gray[300],
|
|
1004
1004
|
divider: appTheme.colors.gray[200],
|
|
1005
1005
|
dividerInverse: appTheme.colors.gray[600],
|
|
1006
1006
|
fillDisabled: appTheme.colors.gray[200],
|
|
@@ -1127,16 +1127,16 @@ var SDSPaletteDark = function (appTheme) {
|
|
|
1127
1127
|
backgroundSecondary: appTheme.colors.gray[100],
|
|
1128
1128
|
backgroundSecondaryInverse: appTheme.colors.gray[700],
|
|
1129
1129
|
backgroundTertiary: appTheme.colors.gray[200],
|
|
1130
|
-
border: appTheme.colors.gray[600],
|
|
1131
|
-
borderDisabled: appTheme.colors.gray[300],
|
|
1132
|
-
borderDisabledInverse: appTheme.colors.gray[600],
|
|
1133
|
-
borderHover: appTheme.colors.gray[900],
|
|
1134
|
-
borderHoverInverse: appTheme.colors.gray[50],
|
|
1135
|
-
borderInverse: appTheme.colors.gray[300],
|
|
1136
1130
|
borderOnFill: appTheme.colors.gray[50],
|
|
1137
|
-
|
|
1138
|
-
|
|
1139
|
-
|
|
1131
|
+
borderPrimary: appTheme.colors.gray[600],
|
|
1132
|
+
borderPrimaryDisabled: appTheme.colors.gray[300],
|
|
1133
|
+
borderPrimaryDisabledInverse: appTheme.colors.gray[600],
|
|
1134
|
+
borderPrimaryHover: appTheme.colors.gray[900],
|
|
1135
|
+
borderPrimaryHoverInverse: appTheme.colors.gray[50],
|
|
1136
|
+
borderPrimaryInverse: appTheme.colors.gray[300],
|
|
1137
|
+
borderPrimaryPressed: appTheme.colors.gray[900],
|
|
1138
|
+
borderPrimaryPressedInverse: appTheme.colors.gray[50],
|
|
1139
|
+
borderSecondary: appTheme.colors.gray[300],
|
|
1140
1140
|
divider: appTheme.colors.gray[200],
|
|
1141
1141
|
dividerInverse: appTheme.colors.gray[600],
|
|
1142
1142
|
fillDisabled: appTheme.colors.gray[200],
|
|
@@ -1559,7 +1559,7 @@ var getBreakpoints = function (_a) {
|
|
|
1559
1559
|
function focusVisibleA11yStyle(props) {
|
|
1560
1560
|
var _a;
|
|
1561
1561
|
var semanticColors = getSemanticColors(props);
|
|
1562
|
-
return "\n &.Mui-focusVisible, &:focus-visible {\n outline: 2px solid ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.
|
|
1562
|
+
return "\n &.Mui-focusVisible, &:focus-visible {\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 ");
|
|
1563
1563
|
}
|
|
1564
1564
|
|
|
1565
1565
|
var fontBody = function (fontSize, fontWeight, isNarrow) {
|
|
@@ -1572,7 +1572,7 @@ var fontBody = function (fontSize, fontWeight, isNarrow) {
|
|
|
1572
1572
|
return null;
|
|
1573
1573
|
var body = typography.wideStyles.body, narrowBody = typography.narrowStyles.body, bodyFontFamily = typography.fontFamily.body;
|
|
1574
1574
|
if (isNarrow) {
|
|
1575
|
-
return react.css(templateObject_1$
|
|
1575
|
+
return react.css(templateObject_1$19 || (templateObject_1$19 = __makeTemplateObject(["\n ", " {\n ", "\n }\n "], ["\n ", " {\n ", "\n }\n "])), (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.down("md"), themeToCss(narrowBody[fontWeight][fontSize], bodyFontFamily));
|
|
1576
1576
|
}
|
|
1577
1577
|
return themeToCss(body[fontWeight][fontSize], bodyFontFamily);
|
|
1578
1578
|
};
|
|
@@ -1597,8 +1597,8 @@ var fontCaps = function (fontSize, isNarrow) {
|
|
|
1597
1597
|
if (!typography)
|
|
1598
1598
|
return null;
|
|
1599
1599
|
var caps = typography.wideStyles.caps, narrowCaps = typography.narrowStyles.caps, capsFontFamily = typography.fontFamily.caps;
|
|
1600
|
-
return react.css(templateObject_3$
|
|
1601
|
-
? react.css(templateObject_2$
|
|
1600
|
+
return react.css(templateObject_3$C || (templateObject_3$C = __makeTemplateObject(["\n text-transform: uppercase;\n\n ", "\n "], ["\n text-transform: uppercase;\n\n ", "\n "])), isNarrow
|
|
1601
|
+
? react.css(templateObject_2$N || (templateObject_2$N = __makeTemplateObject(["\n ", " {\n ", "\n }\n "], ["\n ", " {\n ", "\n }\n "])), (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.down("md"), themeToCss(narrowCaps.semibold[fontSize], capsFontFamily)) : themeToCss(caps.semibold[fontSize], capsFontFamily));
|
|
1602
1602
|
};
|
|
1603
1603
|
};
|
|
1604
1604
|
var fontCapsXxs = fontCaps("xxs");
|
|
@@ -1613,7 +1613,7 @@ var fontHeader = function (fontSize, isNarrow) {
|
|
|
1613
1613
|
return null;
|
|
1614
1614
|
var header = typography.wideStyles.header, narrowHeader = typography.narrowStyles.header, headerFontFamily = typography.fontFamily.header;
|
|
1615
1615
|
if (isNarrow) {
|
|
1616
|
-
return react.css(templateObject_4$
|
|
1616
|
+
return react.css(templateObject_4$v || (templateObject_4$v = __makeTemplateObject(["\n ", " {\n ", "\n }\n "], ["\n ", " {\n ", "\n }\n "])), (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.down("md"), themeToCss(narrowHeader.semibold[fontSize], headerFontFamily));
|
|
1617
1617
|
}
|
|
1618
1618
|
return themeToCss(header.semibold[fontSize], headerFontFamily);
|
|
1619
1619
|
};
|
|
@@ -1636,7 +1636,7 @@ var fontCode = function (fontSize, fontWeight, isNarrow) {
|
|
|
1636
1636
|
return null;
|
|
1637
1637
|
var code = typography.wideStyles.code, narrowCode = typography.narrowStyles.code, codeFontFamily = typography.fontFamily.code;
|
|
1638
1638
|
if (isNarrow) {
|
|
1639
|
-
return react.css(templateObject_5$
|
|
1639
|
+
return react.css(templateObject_5$p || (templateObject_5$p = __makeTemplateObject(["\n ", " {\n ", "\n }\n "], ["\n ", " {\n ", "\n }\n "])), (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.down("md"), themeToCss(narrowCode[fontWeight][fontSize], codeFontFamily));
|
|
1640
1640
|
}
|
|
1641
1641
|
return themeToCss(code[fontWeight][fontSize], codeFontFamily);
|
|
1642
1642
|
};
|
|
@@ -1654,8 +1654,8 @@ var fontTabular = function (fontSize, fontWeight, isNarrow) {
|
|
|
1654
1654
|
if (!typography)
|
|
1655
1655
|
return null;
|
|
1656
1656
|
var tabular = typography.wideStyles.tabular, narrowTabular = typography.narrowStyles.tabular, tabularFontFamily = typography.fontFamily.tabular;
|
|
1657
|
-
return react.css(templateObject_7$
|
|
1658
|
-
? react.css(templateObject_6$
|
|
1657
|
+
return react.css(templateObject_7$g || (templateObject_7$g = __makeTemplateObject(["\n font-variant-numeric: tabular-nums;\n\n ", "\n "], ["\n font-variant-numeric: tabular-nums;\n\n ", "\n "])), isNarrow
|
|
1658
|
+
? react.css(templateObject_6$l || (templateObject_6$l = __makeTemplateObject(["\n ", " {\n ", "\n }\n "], ["\n ", " {\n ", "\n }\n "])), (_b = (_a = props.theme) === null || _a === void 0 ? void 0 : _a.breakpoints) === null || _b === void 0 ? void 0 : _b.down("md"), themeToCss(narrowTabular[fontWeight][fontSize], tabularFontFamily)) : themeToCss(tabular[fontWeight][fontSize], tabularFontFamily));
|
|
1659
1659
|
};
|
|
1660
1660
|
};
|
|
1661
1661
|
var fontTabularXs = fontTabular("xs", "regular");
|
|
@@ -1664,33 +1664,33 @@ var fontTabularSemiboldXs = fontTabular("xs", "semibold");
|
|
|
1664
1664
|
var fontTabularSemiboldS = fontTabular("s", "semibold");
|
|
1665
1665
|
function themeToCss(fontTheme, fontFamily) {
|
|
1666
1666
|
if (fontFamily === void 0) { fontFamily = "inherit"; }
|
|
1667
|
-
return react.css(templateObject_8$
|
|
1667
|
+
return react.css(templateObject_8$d || (templateObject_8$d = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", "px;\n line-height: ", " !important;\n letter-spacing: ", ";\n font-weight: ", ";\n text-transform: ", ";\n "], ["\n font-family: ", ";\n font-size: ", "px;\n line-height: ", " !important;\n letter-spacing: ", ";\n font-weight: ", ";\n text-transform: ", ";\n "])), fontFamily, fontTheme.fontSize, fontTheme.lineHeight, fontTheme.letterSpacing, fontTheme.fontWeight, fontTheme.textTransform);
|
|
1668
1668
|
}
|
|
1669
|
-
var templateObject_1$
|
|
1669
|
+
var templateObject_1$19, templateObject_2$N, templateObject_3$C, templateObject_4$v, templateObject_5$p, templateObject_6$l, templateObject_7$g, templateObject_8$d;
|
|
1670
1670
|
|
|
1671
|
-
var StyledAccordionDetails = styled__default.default(material.AccordionDetails)(templateObject_2$
|
|
1671
|
+
var StyledAccordionDetails = styled__default.default(material.AccordionDetails)(templateObject_2$M || (templateObject_2$M = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
1672
1672
|
var spaces = getSpaces(props);
|
|
1673
|
-
return react.css(templateObject_1$
|
|
1673
|
+
return react.css(templateObject_1$18 || (templateObject_1$18 = __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);
|
|
1674
1674
|
});
|
|
1675
|
-
var templateObject_1$
|
|
1675
|
+
var templateObject_1$18, templateObject_2$M;
|
|
1676
1676
|
|
|
1677
1677
|
var AccordionDetails = function (props) {
|
|
1678
1678
|
var children = props.children;
|
|
1679
1679
|
return jsxRuntime.jsx(StyledAccordionDetails, { children: children });
|
|
1680
1680
|
};
|
|
1681
1681
|
|
|
1682
|
-
var StyledAccordionHeader = styled__default.default(material.AccordionSummary)(templateObject_2$
|
|
1682
|
+
var StyledAccordionHeader = styled__default.default(material.AccordionSummary)(templateObject_2$L || (templateObject_2$L = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderS, function (props) {
|
|
1683
1683
|
var _a, _b;
|
|
1684
1684
|
var spaces = getSpaces(props);
|
|
1685
1685
|
var semanticColors = getSemanticColors(props);
|
|
1686
|
-
return react.css(templateObject_1$
|
|
1686
|
+
return react.css(templateObject_1$17 || (templateObject_1$17 = __makeTemplateObject(["\n padding: ", "px;\n align-items: flex-start;\n box-sizing: border-box;\n\n .", " {\n margin: 0;\n flex-direction: column;\n\n &.", " {\n margin: 0;\n }\n }\n\n & .", " {\n margin-left: ", "px;\n margin-top: ", "px !important;\n align-self: center;\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\n &.", " {\n margin: 0;\n }\n }\n\n & .", " {\n margin-left: ", "px;\n margin-top: ", "px !important;\n align-self: center;\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, material.accordionSummaryClasses.content, material.accordionSummaryClasses.expanded, material.accordionSummaryClasses.expandIconWrapper, spaces === null || spaces === void 0 ? void 0 : spaces.m, 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, material.accordionSummaryClasses.expandIconWrapper, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondaryHover);
|
|
1687
1687
|
});
|
|
1688
|
-
var StyledSubtitle = styled__default.default("p")(templateObject_4$
|
|
1688
|
+
var StyledSubtitle = styled__default.default("p")(templateObject_4$u || (templateObject_4$u = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
1689
1689
|
var _a;
|
|
1690
1690
|
var semanticColors = getSemanticColors(props);
|
|
1691
|
-
return react.css(templateObject_3$
|
|
1691
|
+
return react.css(templateObject_3$B || (templateObject_3$B = __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);
|
|
1692
1692
|
});
|
|
1693
|
-
var templateObject_1$
|
|
1693
|
+
var templateObject_1$17, templateObject_2$L, templateObject_3$B, templateObject_4$u;
|
|
1694
1694
|
|
|
1695
1695
|
var _path$26, _path2$C, _path3$6;
|
|
1696
1696
|
function _extends$2c() { return _extends$2c = 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$2c.apply(null, arguments); }
|
|
@@ -4400,22 +4400,22 @@ var iconMap = {
|
|
|
4400
4400
|
},
|
|
4401
4401
|
};
|
|
4402
4402
|
|
|
4403
|
-
var doNotForwardProps$
|
|
4403
|
+
var doNotForwardProps$F = ["sdsIcon", "sdsSize", "iconColor"];
|
|
4404
4404
|
/**
|
|
4405
4405
|
* @see https://mui.com/material-ui/icons/#svgicon
|
|
4406
4406
|
*/
|
|
4407
4407
|
var StyledSvgIcon = styled__default.default(material.SvgIcon, {
|
|
4408
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4409
|
-
})(templateObject_2$
|
|
4408
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$F.includes(prop); },
|
|
4409
|
+
})(templateObject_2$K || (templateObject_2$K = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4410
4410
|
var _a, _b, _c;
|
|
4411
4411
|
var mode = getMode(props);
|
|
4412
4412
|
var _d = props.iconColor, iconColor = _d === void 0 ? "blue" : _d, _e = props.shade, shade = _e === void 0 ? mode === "dark" ? 600 : 500 : _e, sdsSize = props.sdsSize;
|
|
4413
4413
|
var iconSizes = getIconSizes(props);
|
|
4414
4414
|
var colors = getColors(props);
|
|
4415
|
-
return react.css(templateObject_1
|
|
4415
|
+
return react.css(templateObject_1$16 || (templateObject_1$16 = __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);
|
|
4416
4416
|
});
|
|
4417
|
-
var StyledIcon$1 = styled__default.default("div")(templateObject_3$
|
|
4418
|
-
var templateObject_1
|
|
4417
|
+
var StyledIcon$1 = styled__default.default("div")(templateObject_3$A || (templateObject_3$A = __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"])));
|
|
4418
|
+
var templateObject_1$16, templateObject_2$K, templateObject_3$A;
|
|
4419
4419
|
|
|
4420
4420
|
/**
|
|
4421
4421
|
* @see https://mui.com/material-ui/icons/#icons
|
|
@@ -4446,24 +4446,24 @@ var StyledAccordion$1 = styled__default.default(material.Accordion, {
|
|
|
4446
4446
|
shouldForwardProp: function (prop) {
|
|
4447
4447
|
return !sdsPropNames$2.includes(prop.toString());
|
|
4448
4448
|
},
|
|
4449
|
-
})(templateObject_2$
|
|
4449
|
+
})(templateObject_2$J || (templateObject_2$J = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4450
4450
|
var _a, _b;
|
|
4451
4451
|
var useDivider = props.useDivider, togglePosition = props.togglePosition;
|
|
4452
4452
|
var shadows = getShadows(props);
|
|
4453
4453
|
var typography = getTypography(props);
|
|
4454
4454
|
var borders = getBorders(props);
|
|
4455
4455
|
var spaces = getSpaces(props);
|
|
4456
|
-
return react.css(templateObject_1$
|
|
4456
|
+
return react.css(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n &.", " {\n background-color: transparent;\n background-image: none;\n box-shadow: ", ";\n font-family: ", ";\n border-bottom: ", ";\n height: fit-content;\n\n & .", " {\n ", "\n min-height: 44px;\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 margin-top: ", "px;\n }\n }\n\n .", " {\n ", "\n padding: ", "px;\n padding-top: ", "px;\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 font-family: ", ";\n border-bottom: ", ";\n height: fit-content;\n\n & .", " {\n ", "\n min-height: 44px;\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 margin-top: ", "px;\n }\n }\n\n .", " {\n ", "\n padding: ", "px;\n padding-top: ", "px;\n }\n\n &:before {\n opacity: 0;\n }\n\n &.", " {\n margin: 0;\n }\n\n ", "\n }\n "])), material.accordionClasses.root, shadows === null || shadows === void 0 ? void 0 : shadows.none, (_a = typography === null || typography === void 0 ? void 0 : typography.fontFamily) === null || _a === void 0 ? void 0 : _a.body, useDivider ? (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.divider : "none", material.accordionSummaryClasses.root, focusVisibleA11yStyle(props), material.accordionSummaryClasses.focusVisible, material.accordionSummaryClasses.expanded, material.accordionSummaryClasses.expandIconWrapper, spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, material.accordionDetailsClasses.root, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, material.accordionClasses.expanded, togglePosition === "left" && leftPosition(props));
|
|
4457
4457
|
});
|
|
4458
4458
|
var leftPosition = function (props) {
|
|
4459
4459
|
var _a, _b, _c;
|
|
4460
4460
|
var spaces = getSpaces(props);
|
|
4461
4461
|
var iconSizes = getIconSizes(props);
|
|
4462
|
-
return react.css(templateObject_3$
|
|
4462
|
+
return react.css(templateObject_3$z || (templateObject_3$z = __makeTemplateObject(["\n &.", " {\n & .", " {\n flex-direction: row-reverse;\n\n .", " {\n padding-left: ", "px;\n }\n\n .", " {\n margin: 0;\n transform: rotate(-90deg);\n align-self: flex-start;\n margin-top: ", "px;\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?.m\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\n .", " {\n padding-left: ", "px;\n }\n\n .", " {\n margin: 0;\n transform: rotate(-90deg);\n align-self: flex-start;\n margin-top: ", "px;\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?.m\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 "])), material.accordionClasses.root, material.accordionSummaryClasses.root, material.accordionSummaryClasses.content, spaces === null || spaces === void 0 ? void 0 : spaces.s, material.accordionSummaryClasses.expandIconWrapper, spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, material.accordionSummaryClasses.expanded, material.accordionDetailsClasses.root, ((_a = spaces === null || spaces === void 0 ? void 0 : spaces.m) !== null && _a !== void 0 ? _a : 12) +
|
|
4463
4463
|
((_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width) !== null && _b !== void 0 ? _b : 12) +
|
|
4464
4464
|
((_c = spaces === null || spaces === void 0 ? void 0 : spaces.s) !== null && _c !== void 0 ? _c : 8));
|
|
4465
4465
|
};
|
|
4466
|
-
var templateObject_1$
|
|
4466
|
+
var templateObject_1$15, templateObject_2$J, templateObject_3$z;
|
|
4467
4467
|
|
|
4468
4468
|
/**
|
|
4469
4469
|
* @see https://mui.com/material-ui/react-accordion/
|
|
@@ -4479,7 +4479,7 @@ var Accordion = React__namespace.default.forwardRef(function (props, ref) {
|
|
|
4479
4479
|
return (jsxRuntime.jsx(StyledAccordion$1, __assign({ square: true, useDivider: useDivider, togglePosition: togglePosition, expanded: expanded === id, onChange: handleChange(id), ref: ref }, props, { children: children })));
|
|
4480
4480
|
});
|
|
4481
4481
|
|
|
4482
|
-
var StyledAlert = styled__default.default(material.Alert)(templateObject_1$
|
|
4482
|
+
var StyledAlert = styled__default.default(material.Alert)(templateObject_1$14 || (templateObject_1$14 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4483
4483
|
var _a;
|
|
4484
4484
|
var colors = getColors(props);
|
|
4485
4485
|
var spaces = getSpaces(props);
|
|
@@ -4506,7 +4506,7 @@ function severityToColor(alertSeverity, colors) {
|
|
|
4506
4506
|
return colors === null || colors === void 0 ? void 0 : colors.green;
|
|
4507
4507
|
}
|
|
4508
4508
|
}
|
|
4509
|
-
var templateObject_1$
|
|
4509
|
+
var templateObject_1$14;
|
|
4510
4510
|
|
|
4511
4511
|
/**
|
|
4512
4512
|
* @see https://mui.com/material-ui/react-alert/
|
|
@@ -4534,6 +4534,20 @@ function filterProps(props, excludeProps) {
|
|
|
4534
4534
|
}
|
|
4535
4535
|
return result;
|
|
4536
4536
|
}
|
|
4537
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
4538
|
+
var mergeRefs = function (refs) {
|
|
4539
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
4540
|
+
return function (element) {
|
|
4541
|
+
refs.forEach(function (ref) {
|
|
4542
|
+
if (typeof ref === "function") {
|
|
4543
|
+
ref(element);
|
|
4544
|
+
}
|
|
4545
|
+
else if (ref != null) {
|
|
4546
|
+
ref.current = element;
|
|
4547
|
+
}
|
|
4548
|
+
});
|
|
4549
|
+
};
|
|
4550
|
+
};
|
|
4537
4551
|
|
|
4538
4552
|
var _a;
|
|
4539
4553
|
var SDSWarningTypes;
|
|
@@ -4548,6 +4562,8 @@ var SDSWarningTypes;
|
|
|
4548
4562
|
SDSWarningTypes["TooltipSubtitle"] = "tooltipSubtitle";
|
|
4549
4563
|
SDSWarningTypes["TooltipWidth"] = "tooltipWidth";
|
|
4550
4564
|
SDSWarningTypes["TooltipInvertStyle"] = "tooltipInvertStyle";
|
|
4565
|
+
SDSWarningTypes["ContentCardActionsOnlyButtons"] = "contentCardActionsOnlyButtons";
|
|
4566
|
+
SDSWarningTypes["ClickableContentCardNumberOfButtons"] = "clickableContentCardNumberOfButtons";
|
|
4551
4567
|
})(SDSWarningTypes || (SDSWarningTypes = {}));
|
|
4552
4568
|
var SDS_WARNINGS = (_a = {},
|
|
4553
4569
|
_a[SDSWarningTypes.ButtonMinimalIsAllCaps] = {
|
|
@@ -4590,6 +4606,14 @@ var SDS_WARNINGS = (_a = {},
|
|
|
4590
4606
|
hasWarned: false,
|
|
4591
4607
|
message: "Warning: Tooltips using the inverted or sdsStyle prop will be deprecated. Please use hasInvertedStyle instead!",
|
|
4592
4608
|
},
|
|
4609
|
+
_a[SDSWarningTypes.ContentCardActionsOnlyButtons] = {
|
|
4610
|
+
hasWarned: false,
|
|
4611
|
+
message: "Warning: Only SDS buttons could be used within ContentCard Actions component slot!",
|
|
4612
|
+
},
|
|
4613
|
+
_a[SDSWarningTypes.ClickableContentCardNumberOfButtons] = {
|
|
4614
|
+
hasWarned: false,
|
|
4615
|
+
message: "Warning: Clickable Content Cards can only have one or no buttons!",
|
|
4616
|
+
},
|
|
4593
4617
|
_a);
|
|
4594
4618
|
var showWarningIfFirstOccurence = function (warningType) {
|
|
4595
4619
|
if (!(warningType in SDS_WARNINGS)) {
|
|
@@ -4607,7 +4631,7 @@ var showWarningIfFirstOccurence = function (warningType) {
|
|
|
4607
4631
|
SDS_WARNINGS[warningType].hasWarned = true;
|
|
4608
4632
|
};
|
|
4609
4633
|
|
|
4610
|
-
var doNotForwardProps$
|
|
4634
|
+
var doNotForwardProps$E = [
|
|
4611
4635
|
"isAllCaps",
|
|
4612
4636
|
"isRounded",
|
|
4613
4637
|
"sdsStyle",
|
|
@@ -4641,16 +4665,17 @@ var ButtonStyles = function (props) {
|
|
|
4641
4665
|
: (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.fillPrimary;
|
|
4642
4666
|
var disabledBackgroundColor = variant === "outlined" ? "transparent" : (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.fillDisabled;
|
|
4643
4667
|
var disabledBorder = variant === "outlined"
|
|
4644
|
-
? "inset 0 0 0 1px ".concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.
|
|
4668
|
+
? "inset 0 0 0 1px ".concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.borderPrimaryDisabled)
|
|
4645
4669
|
: "none";
|
|
4646
4670
|
var boxshadow = variant === "outlined"
|
|
4647
4671
|
? "inset 0 0 0 1px ".concat((_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _h === void 0 ? void 0 : _h.border)
|
|
4648
4672
|
: "none";
|
|
4649
|
-
|
|
4673
|
+
fontBody("xs", "semibold");
|
|
4674
|
+
return react.css(templateObject_1$13 || (templateObject_1$13 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n box-shadow: ", ";\n padding: ", ";\n color: ", ";\n line-height: ", ";\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 background-color: ", ";\n border: none;\n box-shadow: ", ";\n padding: ", ";\n color: ", ";\n line-height: ", ";\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 "])), backgroundColor, boxshadow, padding, contentColor, isAllCaps ? "20px" : "unset", ornamentColor, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.textPrimaryInverse, (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _k === void 0 ? void 0 : _k.fillHover, (_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _l === void 0 ? void 0 : _l.borderHover, (_m = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _m === void 0 ? void 0 : _m.ornamentPrimaryInverse, (_o = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _o === void 0 ? void 0 : _o.textPrimaryInverse, (_p = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _p === void 0 ? void 0 : _p.fillPressed, (_q = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _q === void 0 ? void 0 : _q.fillPressed, (_r = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _r === void 0 ? void 0 : _r.ornamentPrimaryInverse, (_s = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _s === void 0 ? void 0 : _s.textDisabled, disabledBackgroundColor, disabledBorder, (_t = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _t === void 0 ? void 0 : _t.ornamentDisabled, material.buttonClasses.startIcon, material.buttonClasses.endIcon, (_u = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l) === null || _u === void 0 ? void 0 : _u.width, (_v = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l) === null || _v === void 0 ? void 0 : _v.width, (_w = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l) === null || _w === void 0 ? void 0 : _w.width, material.buttonClasses.startIcon, spaces === null || spaces === void 0 ? void 0 : spaces.s, material.buttonClasses.endIcon, spaces === null || spaces === void 0 ? void 0 : spaces.s);
|
|
4650
4675
|
};
|
|
4651
4676
|
var Rounded = function (props) {
|
|
4652
4677
|
var corners = getCorners(props);
|
|
4653
|
-
return react.css(templateObject_2$
|
|
4678
|
+
return react.css(templateObject_2$I || (templateObject_2$I = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.l);
|
|
4654
4679
|
};
|
|
4655
4680
|
var DestructiveButton = function (props) {
|
|
4656
4681
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
@@ -4669,13 +4694,13 @@ var DestructiveButton = function (props) {
|
|
|
4669
4694
|
var boxshadow = variant === "outlined"
|
|
4670
4695
|
? "inset 0 0 0 1px ".concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _f === void 0 ? void 0 : _f.border)
|
|
4671
4696
|
: "none";
|
|
4672
|
-
return react.css(templateObject_3$
|
|
4697
|
+
return react.css(templateObject_3$y || (templateObject_3$y = __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);
|
|
4673
4698
|
};
|
|
4674
4699
|
var StyledButton$3 = styled__default.default(material.Button, {
|
|
4675
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4676
|
-
})(templateObject_5$
|
|
4700
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$E.includes(prop); },
|
|
4701
|
+
})(templateObject_5$o || (templateObject_5$o = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4677
4702
|
var sdsStyle = props.sdsStyle, sdsType = props.sdsType, isAllCaps = props.isAllCaps;
|
|
4678
|
-
return react.css(templateObject_4$
|
|
4703
|
+
return react.css(templateObject_4$t || (templateObject_4$t = __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));
|
|
4679
4704
|
});
|
|
4680
4705
|
// Minimal Button Styles
|
|
4681
4706
|
var Minimal = function (props) {
|
|
@@ -4684,60 +4709,60 @@ var Minimal = function (props) {
|
|
|
4684
4709
|
var spaces = getSpaces(props);
|
|
4685
4710
|
var iconSizes = getIconSizes(props);
|
|
4686
4711
|
var semanticColors = getSemanticColors(props);
|
|
4687
|
-
return react.css(templateObject_6$
|
|
4712
|
+
return react.css(templateObject_6$k || (templateObject_6$k = __makeTemplateObject(["\n ", "\n ", "\n\n min-width: unset;\n padding: ", "px ", "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: unset;\n padding: ", "px ", "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 ? fontCapsXxxs(props) : fontBodySemiboldXxs(props), isAllCaps ? spaces === null || spaces === void 0 ? void 0 : spaces.s : 7, 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.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, material.buttonClasses.startIcon, material.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, material.buttonClasses.startIcon, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, material.buttonClasses.endIcon, spaces === null || spaces === void 0 ? void 0 : spaces.xxs);
|
|
4688
4713
|
};
|
|
4689
4714
|
var PrimaryMinimalButton = function (props) {
|
|
4690
4715
|
var _a, _b;
|
|
4691
4716
|
var semanticColors = getSemanticColors(props);
|
|
4692
|
-
return react.css(templateObject_7$
|
|
4717
|
+
return react.css(templateObject_7$f || (templateObject_7$f = __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);
|
|
4693
4718
|
};
|
|
4694
4719
|
var SecondaryMinimalButton = function (props) {
|
|
4695
4720
|
var _a, _b;
|
|
4696
4721
|
var semanticColors = getSemanticColors(props);
|
|
4697
|
-
return react.css(templateObject_8$
|
|
4722
|
+
return react.css(templateObject_8$c || (templateObject_8$c = __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);
|
|
4698
4723
|
};
|
|
4699
4724
|
var StyledMinimalButton = styled__default.default(material.Button, {
|
|
4700
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4701
|
-
})(templateObject_10$
|
|
4725
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$E.includes(prop); },
|
|
4726
|
+
})(templateObject_10$5 || (templateObject_10$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4702
4727
|
var sdsType = props.sdsType;
|
|
4703
|
-
return react.css(templateObject_9$
|
|
4728
|
+
return react.css(templateObject_9$7 || (templateObject_9$7 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), sdsType === "primary" && PrimaryMinimalButton(props), sdsType === "secondary" && SecondaryMinimalButton(props));
|
|
4704
4729
|
});
|
|
4705
4730
|
var StyledButtonLegacy = styled__default.default(material.Button, {
|
|
4706
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4707
|
-
})(templateObject_11$
|
|
4731
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$E.includes(prop); },
|
|
4732
|
+
})(templateObject_11$4 || (templateObject_11$4 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4708
4733
|
if (!props.isRounded)
|
|
4709
4734
|
return "";
|
|
4710
4735
|
var corners = getCorners(props);
|
|
4711
4736
|
var spaces = getSpaces(props);
|
|
4712
4737
|
return "\n border-radius: ".concat(corners === null || corners === void 0 ? void 0 : corners.l, "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 ");
|
|
4713
4738
|
});
|
|
4714
|
-
var templateObject_1$
|
|
4739
|
+
var templateObject_1$13, templateObject_2$I, templateObject_3$y, templateObject_4$t, templateObject_5$o, templateObject_6$k, templateObject_7$f, templateObject_8$c, templateObject_9$7, templateObject_10$5, templateObject_11$4;
|
|
4715
4740
|
|
|
4716
4741
|
var isDisabled$1 = function (props) {
|
|
4717
4742
|
var _a, _b;
|
|
4718
4743
|
var semanticColors = getSemanticColors(props);
|
|
4719
|
-
return react.css(templateObject_1$
|
|
4744
|
+
return react.css(templateObject_1$12 || (templateObject_1$12 = __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);
|
|
4720
4745
|
};
|
|
4721
4746
|
var primary$2 = function (props) {
|
|
4722
4747
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4723
4748
|
var semanticColors = getSemanticColors(props);
|
|
4724
|
-
return react.css(templateObject_2$
|
|
4749
|
+
return react.css(templateObject_2$H || (templateObject_2$H = __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);
|
|
4725
4750
|
};
|
|
4726
4751
|
var secondary$2 = function (props) {
|
|
4727
4752
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4728
4753
|
var semanticColors = getSemanticColors(props);
|
|
4729
|
-
return react.css(templateObject_3$
|
|
4754
|
+
return react.css(templateObject_3$x || (templateObject_3$x = __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);
|
|
4730
4755
|
};
|
|
4731
4756
|
var tertiary = function (props) {
|
|
4732
4757
|
var _a, _b, _c, _d, _e, _f;
|
|
4733
4758
|
var semanticColors = getSemanticColors(props);
|
|
4734
|
-
return react.css(templateObject_4$
|
|
4759
|
+
return react.css(templateObject_4$s || (templateObject_4$s = __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);
|
|
4735
4760
|
};
|
|
4736
4761
|
var small$1 = function (props) {
|
|
4737
4762
|
var sdsType = props.sdsType;
|
|
4738
4763
|
var iconSizes = getIconSizes(props);
|
|
4739
4764
|
var spaces = getSpaces(props);
|
|
4740
|
-
return react.css(templateObject_5$
|
|
4765
|
+
return react.css(templateObject_5$n || (templateObject_5$n = __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"
|
|
4741
4766
|
? "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;")
|
|
4742
4767
|
: "", 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;") : "");
|
|
4743
4768
|
};
|
|
@@ -4745,7 +4770,7 @@ var medium$1 = function (props) {
|
|
|
4745
4770
|
var sdsType = props.sdsType;
|
|
4746
4771
|
var iconSizes = getIconSizes(props);
|
|
4747
4772
|
var spaces = getSpaces(props);
|
|
4748
|
-
return react.css(templateObject_6$
|
|
4773
|
+
return react.css(templateObject_6$j || (templateObject_6$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"
|
|
4749
4774
|
? "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;")
|
|
4750
4775
|
: "", 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;") : "");
|
|
4751
4776
|
};
|
|
@@ -4753,11 +4778,11 @@ var large = function (props) {
|
|
|
4753
4778
|
var sdsType = props.sdsType;
|
|
4754
4779
|
var iconSizes = getIconSizes(props);
|
|
4755
4780
|
var spaces = getSpaces(props);
|
|
4756
|
-
return react.css(templateObject_7$
|
|
4781
|
+
return react.css(templateObject_7$e || (templateObject_7$e = __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"
|
|
4757
4782
|
? "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;")
|
|
4758
4783
|
: "", 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;") : "");
|
|
4759
4784
|
};
|
|
4760
|
-
var doNotForwardProps$
|
|
4785
|
+
var doNotForwardProps$D = [
|
|
4761
4786
|
"on",
|
|
4762
4787
|
"sdsSize",
|
|
4763
4788
|
"sdsType",
|
|
@@ -4767,12 +4792,12 @@ var doNotForwardProps$w = [
|
|
|
4767
4792
|
"customTheme",
|
|
4768
4793
|
];
|
|
4769
4794
|
var StyledButtonIcon = styled__default.default(material.IconButton, {
|
|
4770
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4771
|
-
})(templateObject_9$
|
|
4795
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$D.includes(prop); },
|
|
4796
|
+
})(templateObject_9$6 || (templateObject_9$6 = __makeTemplateObject(["\n padding: 0;\n ", "\n\n ", "\n"], ["\n padding: 0;\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4772
4797
|
var disabled = props.disabled, _a = props.sdsSize, sdsSize = _a === void 0 ? "medium" : _a, _b = props.sdsType, sdsType = _b === void 0 ? "primary" : _b;
|
|
4773
|
-
return react.css(templateObject_8$
|
|
4798
|
+
return react.css(templateObject_8$b || (templateObject_8$b = __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));
|
|
4774
4799
|
});
|
|
4775
|
-
var templateObject_1$
|
|
4800
|
+
var templateObject_1$12, templateObject_2$H, templateObject_3$x, templateObject_4$s, templateObject_5$n, templateObject_6$j, templateObject_7$e, templateObject_8$b, templateObject_9$6;
|
|
4776
4801
|
|
|
4777
4802
|
var ButtonIconSizeToSdsIconSize = {
|
|
4778
4803
|
large: "xl",
|
|
@@ -4870,7 +4895,7 @@ var Button = React__namespace.default.forwardRef(function (props, ref) {
|
|
|
4870
4895
|
}
|
|
4871
4896
|
});
|
|
4872
4897
|
|
|
4873
|
-
var doNotForwardProps$
|
|
4898
|
+
var doNotForwardProps$C = [
|
|
4874
4899
|
"sdsStyle",
|
|
4875
4900
|
"intent",
|
|
4876
4901
|
"handleSubmit",
|
|
@@ -4881,39 +4906,39 @@ var rounded$3 = function (props) {
|
|
|
4881
4906
|
var _a;
|
|
4882
4907
|
var corners = getCorners(props);
|
|
4883
4908
|
var semanticColors = getSemanticColors(props);
|
|
4884
|
-
return react.css(templateObject_1$
|
|
4909
|
+
return react.css(templateObject_1$11 || (templateObject_1$11 = __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 "])), material.outlinedInputClasses.root, corners === null || corners === void 0 ? void 0 : corners.l, material.outlinedInputClasses.notchedOutline, corners === null || corners === void 0 ? void 0 : corners.l, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimary);
|
|
4885
4910
|
};
|
|
4886
4911
|
var applyIntentColor$2 = function (props, intent) {
|
|
4887
4912
|
var _a, _b, _c, _d;
|
|
4888
4913
|
var semanticColors = getSemanticColors(props);
|
|
4889
4914
|
var borders = getBorders(props);
|
|
4890
|
-
return react.css(templateObject_2$
|
|
4915
|
+
return react.css(templateObject_2$G || (templateObject_2$G = __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 "])), material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _a === void 0 ? void 0 : _a.default, material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, material.outlinedInputClasses.root, material.outlinedInputClasses.focused, material.outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _c === void 0 ? void 0 : _c.default, material.inputAdornmentClasses.root, material.buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _d === void 0 ? void 0 : _d.ornament);
|
|
4891
4916
|
};
|
|
4892
4917
|
var disabledStyled$2 = function (props) {
|
|
4893
4918
|
var _a, _b, _c, _d, _e;
|
|
4894
4919
|
var semanticColors = getSemanticColors(props);
|
|
4895
|
-
return react.css(templateObject_3$
|
|
4920
|
+
return react.css(templateObject_3$w || (templateObject_3$w = __makeTemplateObject(["\n .", " {\n .", " {\n border: 1px solid ", " !important;\n }\n\n .", " svg {\n color: ", ";\n }\n\n &:hover {\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 .", " {\n border: 1px solid ", ";\n }\n\n .", " svg {\n color: ", " !important;\n }\n }\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n "])), material.outlinedInputClasses.disabled, material.outlinedInputClasses.notchedOutline, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryDisabled, material.inputAdornmentClasses.root, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentDisabled, material.outlinedInputClasses.notchedOutline, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderPrimaryDisabled, material.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);
|
|
4896
4921
|
};
|
|
4897
|
-
var StyledLabel$3 = styled__default.default("label")(templateObject_4$
|
|
4922
|
+
var StyledLabel$3 = styled__default.default("label")(templateObject_4$r || (templateObject_4$r = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyM$1, function (props) {
|
|
4898
4923
|
var spaces = getSpaces(props);
|
|
4899
4924
|
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 ");
|
|
4900
4925
|
});
|
|
4901
4926
|
var StyledSearchBase = styled__default.default(material.TextField, {
|
|
4902
4927
|
shouldForwardProp: function (prop) {
|
|
4903
|
-
return !doNotForwardProps$
|
|
4928
|
+
return !doNotForwardProps$C.includes(prop.toString());
|
|
4904
4929
|
},
|
|
4905
|
-
})(templateObject_6$
|
|
4930
|
+
})(templateObject_6$i || (templateObject_6$i = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4906
4931
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
4907
4932
|
var intent = props.intent, disabled = props.disabled, sdsStyle = props.sdsStyle;
|
|
4908
4933
|
var spaces = getSpaces(props);
|
|
4909
4934
|
var iconSizes = getIconSizes(props);
|
|
4910
4935
|
var semanticColors = getSemanticColors(props);
|
|
4911
|
-
return react.css(templateObject_5$
|
|
4936
|
+
return react.css(templateObject_5$m || (templateObject_5$m = __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 width: 100%;\n\n .", " {\n padding-right: ", "px;\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 & .", ":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 width: 100%;\n\n .", " {\n padding-right: ", "px;\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 & .", ":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, material.outlinedInputClasses.root, spaces === null || spaces === void 0 ? void 0 : spaces.m, material.outlinedInputClasses.input, spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.m, material.outlinedInputClasses.notchedOutline, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderPrimary, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentSecondary, (_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.accent) === null || _f === void 0 ? void 0 : _f.fillPressed, material.inputBaseClasses.inputSizeSmall, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.s, material.outlinedInputClasses.root, material.buttonBaseClasses.root, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.ornamentSecondaryHover, material.outlinedInputClasses.notchedOutline, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.borderPrimaryHover, material.outlinedInputClasses.root, material.outlinedInputClasses.focused, material.outlinedInputClasses.notchedOutline, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _j === void 0 ? void 0 : _j.border, material.inputAdornmentClasses.root, material.buttonBaseClasses.root, (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _k === void 0 ? void 0 : _k.ornamentFocus, material.outlinedInputClasses.root, (_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _l === void 0 ? void 0 : _l.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));
|
|
4912
4937
|
});
|
|
4913
|
-
var StyledInputAdornment = styled__default.default(material.InputAdornment)(templateObject_7$
|
|
4914
|
-
var templateObject_1$
|
|
4938
|
+
var StyledInputAdornment = styled__default.default(material.InputAdornment)(templateObject_7$d || (templateObject_7$d = __makeTemplateObject(["\n position: relative;\n height: unset;\n margin: 0;\n"], ["\n position: relative;\n height: unset;\n margin: 0;\n"])));
|
|
4939
|
+
var templateObject_1$11, templateObject_2$G, templateObject_3$w, templateObject_4$r, templateObject_5$m, templateObject_6$i, templateObject_7$d;
|
|
4915
4940
|
|
|
4916
|
-
var StyledMenuItem$1 = styled__default.default(material.MenuItem)(templateObject_1$
|
|
4941
|
+
var StyledMenuItem$1 = styled__default.default(material.MenuItem)(templateObject_1$10 || (templateObject_1$10 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4917
4942
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
4918
4943
|
var selected = props.selected;
|
|
4919
4944
|
var fontWeights = getFontWeights(props);
|
|
@@ -4921,7 +4946,7 @@ var StyledMenuItem$1 = styled__default.default(material.MenuItem)(templateObject
|
|
|
4921
4946
|
var semanticColors = getSemanticColors(props);
|
|
4922
4947
|
return "\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px !important;\n min-height: unset;\n opacity: 1;\n\n &.MuiAutocomplete-option {\n min-height: unset;\n }\n \n .primary-text {\n font-weight: ").concat(selected ? fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold : fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.regular, ";\n }\n\n &.MuiButtonBase-root {\n background-color: transparent;\n opacity: 1;\n\n &:hover, &.").concat(material.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(material.menuItemClasses.root, " .MuiSvgIcon-root {\n align-self: flex-start;\n }\n\n &.").concat(material.menuItemClasses.root, " .").concat(material.menuItemClasses.disabled, " {\n opacity: 1 !important;\n }\n\n &.MuiAutocomplete-option[aria-selected=\"true\"] {\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 svg.check-icon {\n color: ").concat(selected ? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.ornamentSelected : (_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 svg.check-icon {\n color: ").concat(selected ? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _g === void 0 ? void 0 : _g.ornamentHover : (_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 .primary-text {\n font-weight: ").concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n }\n }\n\n &:active {\n svg.check-icon {\n color: ").concat((_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _l === void 0 ? void 0 : _l.ornamentPressed, ";\n }\n\n &:active {\n svg.check-icon {\n color: ").concat((_m = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _m === void 0 ? void 0 : _m.ornamentPressed, ";\n }\n\n .primary-text {\n font-weight: ").concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n }\n }\n }\n ");
|
|
4923
4948
|
});
|
|
4924
|
-
var ContentWrapper = styled__default.default("span")(templateObject_2$
|
|
4949
|
+
var ContentWrapper = styled__default.default("span")(templateObject_2$F || (templateObject_2$F = __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"])));
|
|
4925
4950
|
var disabledStyles$2 = function (props) {
|
|
4926
4951
|
var _a;
|
|
4927
4952
|
var disabled = props.disabled;
|
|
@@ -4930,12 +4955,12 @@ var disabledStyles$2 = function (props) {
|
|
|
4930
4955
|
var semanticColors = getSemanticColors(props);
|
|
4931
4956
|
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 ");
|
|
4932
4957
|
};
|
|
4933
|
-
var TextWrapper = styled__default.default("span")(templateObject_3$
|
|
4958
|
+
var TextWrapper = styled__default.default("span")(templateObject_3$v || (templateObject_3$v = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
4934
4959
|
var _a;
|
|
4935
4960
|
var semanticColors = getSemanticColors(props);
|
|
4936
4961
|
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 ");
|
|
4937
4962
|
}, disabledStyles$2);
|
|
4938
|
-
var StyledMenuItemIcon = styled__default.default("span")(templateObject_4$
|
|
4963
|
+
var StyledMenuItemIcon = styled__default.default("span")(templateObject_4$q || (templateObject_4$q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4939
4964
|
var _a;
|
|
4940
4965
|
var disabled = props.disabled;
|
|
4941
4966
|
var spaces = getSpaces(props);
|
|
@@ -4943,20 +4968,20 @@ var StyledMenuItemIcon = styled__default.default("span")(templateObject_4$m || (
|
|
|
4943
4968
|
var semanticColors = getSemanticColors(props);
|
|
4944
4969
|
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 ");
|
|
4945
4970
|
});
|
|
4946
|
-
var ColumnWrapper = styled__default.default("span")(templateObject_5$
|
|
4971
|
+
var ColumnWrapper = styled__default.default("span")(templateObject_5$l || (templateObject_5$l = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
4947
4972
|
var _a;
|
|
4948
4973
|
var semanticColors = getSemanticColors(props);
|
|
4949
4974
|
var spaces = getSpaces(props);
|
|
4950
4975
|
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 ");
|
|
4951
4976
|
}, disabledStyles$2);
|
|
4952
|
-
var StyledIconWrapper = styled__default.default("span")(templateObject_6$
|
|
4977
|
+
var StyledIconWrapper = styled__default.default("span")(templateObject_6$h || (templateObject_6$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4953
4978
|
var spaces = getSpaces(props);
|
|
4954
4979
|
var iconSizes = getIconSizes(props);
|
|
4955
4980
|
return "\n align-self: start;\n margin-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "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 ");
|
|
4956
4981
|
});
|
|
4957
4982
|
var StyledCheck = styled__default.default(iconsMaterial.Check, {
|
|
4958
4983
|
shouldForwardProp: function (prop) { return prop !== "selected"; },
|
|
4959
|
-
})(templateObject_7$
|
|
4984
|
+
})(templateObject_7$c || (templateObject_7$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4960
4985
|
var _a, _b;
|
|
4961
4986
|
var selected = props.selected, disabled = props.disabled;
|
|
4962
4987
|
var iconSizes = getIconSizes(props);
|
|
@@ -4968,7 +4993,7 @@ var StyledCheck = styled__default.default(iconsMaterial.Check, {
|
|
|
4968
4993
|
});
|
|
4969
4994
|
var StyledMinus = styled__default.default(iconsMaterial.Remove, {
|
|
4970
4995
|
shouldForwardProp: function (prop) { return prop !== "selected"; },
|
|
4971
|
-
})(templateObject_8$
|
|
4996
|
+
})(templateObject_8$a || (templateObject_8$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4972
4997
|
var _a, _b;
|
|
4973
4998
|
var selected = props.selected, disabled = props.disabled;
|
|
4974
4999
|
var semanticColors = getSemanticColors(props);
|
|
@@ -4978,7 +5003,7 @@ var StyledMinus = styled__default.default(iconsMaterial.Remove, {
|
|
|
4978
5003
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.ornamentSelected;
|
|
4979
5004
|
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 ");
|
|
4980
5005
|
});
|
|
4981
|
-
var templateObject_1$
|
|
5006
|
+
var templateObject_1$10, templateObject_2$F, templateObject_3$v, templateObject_4$q, templateObject_5$l, templateObject_6$h, templateObject_7$c, templateObject_8$a;
|
|
4982
5007
|
|
|
4983
5008
|
/**
|
|
4984
5009
|
* @see https://mui.com/material-ui/react-menu/
|
|
@@ -5140,7 +5165,7 @@ var InputSearch = React.forwardRef(function InputSearch(props, ref) {
|
|
|
5140
5165
|
autoComplete: "one-time-code" }, rest))] }));
|
|
5141
5166
|
});
|
|
5142
5167
|
|
|
5143
|
-
var doNotForwardProps$
|
|
5168
|
+
var doNotForwardProps$B = [
|
|
5144
5169
|
"count",
|
|
5145
5170
|
"keepSearchOnSelect",
|
|
5146
5171
|
"search",
|
|
@@ -5149,18 +5174,18 @@ var doNotForwardProps$u = [
|
|
|
5149
5174
|
"onClickAway",
|
|
5150
5175
|
];
|
|
5151
5176
|
var StyledAutocompleteBase = styled__default.default(material.Autocomplete, {
|
|
5152
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5153
|
-
})(templateObject_1
|
|
5177
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$B.includes(prop); },
|
|
5178
|
+
})(templateObject_1$$ || (templateObject_1$$ = __makeTemplateObject(["\n + .", "\n > .", "\n .", " {\n ", "\n }\n\n ", "\n"], ["\n + .", "\n > .", "\n .", " {\n ", "\n }\n\n ", "\n"])), material.autocompleteClasses.popper, material.autocompleteClasses.paper, material.autocompleteClasses.groupLabel, fontCapsXxxxs, function (props) {
|
|
5154
5179
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
5155
5180
|
var search = props.search;
|
|
5156
5181
|
var spaces = getSpaces(props);
|
|
5157
5182
|
var borders = getBorders(props);
|
|
5158
5183
|
var semanticColors = getSemanticColors(props);
|
|
5159
|
-
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.
|
|
5184
|
+
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(material.autocompleteClasses.popper, " > .").concat(material.autocompleteClasses.paper, " {\n .").concat(material.autocompleteClasses.listbox, " {\n max-height: 40vh;\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0;\n\n .").concat(material.autocompleteClasses.option, " {\n min-height: unset;\n\n &.").concat(material.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(material.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(material.autocompleteClasses.groupUl, " {\n border-bottom: none;\n margin-bottom: 0;\n padding-bottom: 0;\n }\n }\n\n .").concat(material.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: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n }\n\n .").concat(material.autocompleteClasses.groupUl, " {\n position: relative;\n margin: 0 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "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-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n\n & li:last-of-type {\n position: relative;\n }\n }\n\n .").concat(material.autocompleteClasses.noOptions, " {\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 margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n }\n\n .").concat(material.autocompleteClasses.loading, " {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0;\n }\n }\n ");
|
|
5160
5185
|
});
|
|
5161
5186
|
var InputBaseWrapper$1 = styled__default.default("div", {
|
|
5162
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5163
|
-
})(templateObject_2$
|
|
5187
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$B.includes(prop); },
|
|
5188
|
+
})(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5164
5189
|
var search = props.search;
|
|
5165
5190
|
if (!search) {
|
|
5166
5191
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -5170,12 +5195,12 @@ var InputBaseWrapper$1 = styled__default.default("div", {
|
|
|
5170
5195
|
}
|
|
5171
5196
|
});
|
|
5172
5197
|
var StyledMenuInputSearch$1 = styled__default.default(InputSearch, {
|
|
5173
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5174
|
-
})(templateObject_3$
|
|
5198
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$B.includes(prop); },
|
|
5199
|
+
})(templateObject_3$u || (templateObject_3$u = __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) {
|
|
5175
5200
|
var search = _a.search;
|
|
5176
5201
|
return (search ? "auto" : "transparent");
|
|
5177
5202
|
});
|
|
5178
|
-
var StyledPaper$3 = styled__default.default(material.Paper)(templateObject_4$
|
|
5203
|
+
var StyledPaper$3 = styled__default.default(material.Paper)(templateObject_4$p || (templateObject_4$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5179
5204
|
var _a;
|
|
5180
5205
|
var spaces = getSpaces(props);
|
|
5181
5206
|
var corners = getCorners(props);
|
|
@@ -5184,13 +5209,13 @@ var StyledPaper$3 = styled__default.default(material.Paper)(templateObject_4$l |
|
|
|
5184
5209
|
var semanticColors = getSemanticColors(props);
|
|
5185
5210
|
return "\n background-image: none;\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ;\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 border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.m, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n box-sizing: border-box;\n ");
|
|
5186
5211
|
});
|
|
5187
|
-
var StyledMenuItemDetails = styled__default.default("div")(templateObject_5$
|
|
5212
|
+
var StyledMenuItemDetails = styled__default.default("div")(templateObject_5$k || (templateObject_5$k = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
5188
5213
|
var _a;
|
|
5189
5214
|
var semanticColors = getSemanticColors(props);
|
|
5190
5215
|
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 ");
|
|
5191
5216
|
});
|
|
5192
|
-
var StyledMenuItemText = styled__default.default("div")(templateObject_6$
|
|
5193
|
-
var templateObject_1
|
|
5217
|
+
var StyledMenuItemText = styled__default.default("div")(templateObject_6$g || (templateObject_6$g = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
5218
|
+
var templateObject_1$$, templateObject_2$E, templateObject_3$u, templateObject_4$p, templateObject_5$k, templateObject_6$g;
|
|
5194
5219
|
|
|
5195
5220
|
var AutocompleteBase = function (props) {
|
|
5196
5221
|
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;
|
|
@@ -5351,27 +5376,27 @@ var AutocompleteBase = function (props) {
|
|
|
5351
5376
|
}
|
|
5352
5377
|
};
|
|
5353
5378
|
|
|
5354
|
-
var StyledColumn = styled__default.default("div")(templateObject_1$
|
|
5379
|
+
var StyledColumn = styled__default.default("div")(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5355
5380
|
var _a;
|
|
5356
5381
|
var _b = props.width, width = _b === void 0 ? 280 : _b;
|
|
5357
5382
|
var spaces = getSpaces(props);
|
|
5358
5383
|
var borders = getBorders(props);
|
|
5359
5384
|
return "\n position: relative;\n width: ".concat(width, "px;\n\n &:not(:last-child) {\n border-right: ").concat((_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.divider, ";\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n }\n\n // (masoudmanson): This code hides the relation icon of the last column\n &:last-of-type {\n .SdsAutocompleteMultiColumn-column-relation-icon {\n display: none;\n }\n }\n ");
|
|
5360
5385
|
});
|
|
5361
|
-
var StyledColumnTitle = styled__default.default("p")(templateObject_2$
|
|
5386
|
+
var StyledColumnTitle = styled__default.default("p")(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontCapsXxxxs, function (props) {
|
|
5362
5387
|
var _a;
|
|
5363
5388
|
var spaces = getSpaces(props);
|
|
5364
5389
|
var semanticColors = getSemanticColors(props);
|
|
5365
5390
|
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.s, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n margin: 0;\n ");
|
|
5366
5391
|
});
|
|
5367
|
-
var StyledColumnIcon = styled__default.default("span")(templateObject_3$
|
|
5392
|
+
var StyledColumnIcon = styled__default.default("span")(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5368
5393
|
var _a, _b;
|
|
5369
5394
|
var spaces = getSpaces(props);
|
|
5370
5395
|
var iconSizes = getIconSizes(props);
|
|
5371
5396
|
var semanticColors = getSemanticColors(props);
|
|
5372
5397
|
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: -2px;\n padding-bottom: 2px;\n\n svg {\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondary, ";\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 ");
|
|
5373
5398
|
});
|
|
5374
|
-
var templateObject_1$
|
|
5399
|
+
var templateObject_1$_, templateObject_2$D, templateObject_3$t;
|
|
5375
5400
|
|
|
5376
5401
|
var AutocompleteGroup = function (props) {
|
|
5377
5402
|
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"]);
|
|
@@ -5411,7 +5436,7 @@ var AutocompleteGroup = function (props) {
|
|
|
5411
5436
|
}
|
|
5412
5437
|
};
|
|
5413
5438
|
|
|
5414
|
-
var doNotForwardProps$
|
|
5439
|
+
var doNotForwardProps$A = [
|
|
5415
5440
|
"anchorEl",
|
|
5416
5441
|
"count",
|
|
5417
5442
|
"keepSearchOnSelect",
|
|
@@ -5424,9 +5449,9 @@ var doNotForwardProps$t = [
|
|
|
5424
5449
|
];
|
|
5425
5450
|
var StyledPopper$2 = styled__default.default(material.Popper, {
|
|
5426
5451
|
shouldForwardProp: function (prop) {
|
|
5427
|
-
return !doNotForwardProps$
|
|
5452
|
+
return !doNotForwardProps$A.includes(prop) || prop === "anchorEl";
|
|
5428
5453
|
},
|
|
5429
|
-
})(templateObject_1$
|
|
5454
|
+
})(templateObject_1$Z || (templateObject_1$Z = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5430
5455
|
var _a;
|
|
5431
5456
|
var corners = getCorners(props);
|
|
5432
5457
|
var shadows = getShadows(props);
|
|
@@ -5436,24 +5461,24 @@ var StyledPopper$2 = styled__default.default(material.Popper, {
|
|
|
5436
5461
|
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.m, "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.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n box-sizing: border-box;\n z-index: 1400;\n\n .").concat(material.autocompleteClasses.popper, ".").concat(material.autocompleteClasses.popperDisablePortal, " {\n position: relative !important;\n transform: none !important;\n \n .MuiPaper-root .").concat(material.autocompleteClasses.listbox, " {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0;\n }\n }\n ");
|
|
5437
5462
|
});
|
|
5438
5463
|
var StyledPaper$2 = styled__default.default(material.Paper, {
|
|
5439
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5440
|
-
})(templateObject_2$
|
|
5464
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$A.includes(prop); },
|
|
5465
|
+
})(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5441
5466
|
var _a;
|
|
5442
5467
|
var shadows = getShadows(props);
|
|
5443
5468
|
var semanticColors = getSemanticColors(props);
|
|
5444
5469
|
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 ");
|
|
5445
5470
|
});
|
|
5446
|
-
var StyledAutocompleteGroupWrapper = styled__default.default("div")(templateObject_3$
|
|
5471
|
+
var StyledAutocompleteGroupWrapper = styled__default.default("div")(templateObject_3$s || (templateObject_3$s = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
5447
5472
|
var StyledAutocompleteInput = styled__default.default(InputSearch, {
|
|
5448
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5449
|
-
})(templateObject_4$
|
|
5473
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$A.includes(prop); },
|
|
5474
|
+
})(templateObject_4$o || (templateObject_4$o = __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) {
|
|
5450
5475
|
var search = _a.search;
|
|
5451
5476
|
return !search && "height: 0; display: none; margin: 0 !important;";
|
|
5452
5477
|
}, function (_a) {
|
|
5453
5478
|
var search = _a.search;
|
|
5454
5479
|
return (search ? "auto" : "transparent");
|
|
5455
5480
|
});
|
|
5456
|
-
var templateObject_1$
|
|
5481
|
+
var templateObject_1$Z, templateObject_2$C, templateObject_3$s, templateObject_4$o;
|
|
5457
5482
|
|
|
5458
5483
|
var AutocompleteMultiColumn = function (props) {
|
|
5459
5484
|
var _a;
|
|
@@ -5635,13 +5660,13 @@ var Autocomplete = function (props) {
|
|
|
5635
5660
|
}
|
|
5636
5661
|
};
|
|
5637
5662
|
|
|
5638
|
-
var Centered = styled__default.default("div")(templateObject_1$
|
|
5663
|
+
var Centered = styled__default.default("div")(templateObject_1$Y || (templateObject_1$Y = __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"])));
|
|
5639
5664
|
var doNotForwardPropsIconWrapper = ["bannerType"];
|
|
5640
5665
|
var IconWrapper$1 = styled__default.default("div", {
|
|
5641
5666
|
shouldForwardProp: function (prop) {
|
|
5642
5667
|
return !doNotForwardPropsIconWrapper.includes(prop);
|
|
5643
5668
|
},
|
|
5644
|
-
})(templateObject_2$
|
|
5669
|
+
})(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5645
5670
|
var _a, _b;
|
|
5646
5671
|
var bannerType = props.bannerType;
|
|
5647
5672
|
var iconSizes = getIconSizes(props);
|
|
@@ -5654,7 +5679,7 @@ var StyledButton$2 = styled__default.default(Button, {
|
|
|
5654
5679
|
shouldForwardProp: function (prop) {
|
|
5655
5680
|
return !doNotForwardPropsButtonIcon.includes(prop);
|
|
5656
5681
|
},
|
|
5657
|
-
})(templateObject_3$
|
|
5682
|
+
})(templateObject_3$r || (templateObject_3$r = __makeTemplateObject(["\n flex: 0 0 auto;\n\n ", "\n"], ["\n flex: 0 0 auto;\n\n ", "\n"])), function (props) {
|
|
5658
5683
|
var _a, _b;
|
|
5659
5684
|
var bannerType = props.bannerType;
|
|
5660
5685
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5662,7 +5687,7 @@ var StyledButton$2 = styled__default.default(Button, {
|
|
|
5662
5687
|
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 ");
|
|
5663
5688
|
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 ");
|
|
5664
5689
|
});
|
|
5665
|
-
styled__default.default("div")(templateObject_4$
|
|
5690
|
+
styled__default.default("div")(templateObject_4$n || (templateObject_4$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), fontBodyS$1);
|
|
5666
5691
|
var primary$1 = function (props) {
|
|
5667
5692
|
var _a, _b;
|
|
5668
5693
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5673,15 +5698,15 @@ var secondary$1 = function (props) {
|
|
|
5673
5698
|
var semanticColors = getSemanticColors(props);
|
|
5674
5699
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.info) === 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 ");
|
|
5675
5700
|
};
|
|
5676
|
-
var doNotForwardProps$
|
|
5701
|
+
var doNotForwardProps$z = ["sdsType", "textChild"];
|
|
5677
5702
|
var StyledBanner = styled__default.default("div", {
|
|
5678
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5679
|
-
})(templateObject_5$
|
|
5703
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$z.includes(prop); },
|
|
5704
|
+
})(templateObject_5$j || (templateObject_5$j = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
5680
5705
|
var sdsType = props.sdsType;
|
|
5681
5706
|
var spaces = getSpaces(props);
|
|
5682
5707
|
return "\n display: flex;\n align-items: center;\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n \n ").concat(sdsType === "primary" ? primary$1(props) : "", "\n ").concat(sdsType === "secondary" ? secondary$1(props) : "", "\n ");
|
|
5683
5708
|
});
|
|
5684
|
-
var templateObject_1$
|
|
5709
|
+
var templateObject_1$Y, templateObject_2$B, templateObject_3$r, templateObject_4$n, templateObject_5$j;
|
|
5685
5710
|
|
|
5686
5711
|
var Banner = React.forwardRef(function Banner(props, ref) {
|
|
5687
5712
|
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, rest = __rest(props, ["children", "dismissed", "dismissible", "onClose", "sdsType", "icon", "sdsIconProps"]);
|
|
@@ -5744,16 +5769,16 @@ var ButtonDropdown = React__namespace.default.forwardRef(function (props, ref) {
|
|
|
5744
5769
|
* All other props should be passed down to ButtonIcon; otherwise,
|
|
5745
5770
|
* the component won’t function as expected.
|
|
5746
5771
|
*/
|
|
5747
|
-
var doNotForwardProps$
|
|
5772
|
+
var doNotForwardProps$y = ["sdsStage"];
|
|
5748
5773
|
var StyledButtonToggle = styled__default.default(ButtonIcon, {
|
|
5749
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5750
|
-
})(templateObject_1$
|
|
5774
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$y.includes(prop); },
|
|
5775
|
+
})(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5751
5776
|
var _a;
|
|
5752
5777
|
var sdsStage = props.sdsStage;
|
|
5753
5778
|
var semanticColors = getSemanticColors(props);
|
|
5754
5779
|
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 ");
|
|
5755
5780
|
});
|
|
5756
|
-
var templateObject_1$
|
|
5781
|
+
var templateObject_1$X;
|
|
5757
5782
|
|
|
5758
5783
|
/**
|
|
5759
5784
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -5769,7 +5794,7 @@ var ButtonToggle = React__namespace.default.forwardRef(function (props, ref) {
|
|
|
5769
5794
|
}
|
|
5770
5795
|
});
|
|
5771
5796
|
|
|
5772
|
-
var doNotForwardProps$
|
|
5797
|
+
var doNotForwardProps$x = [
|
|
5773
5798
|
"calloutTitle",
|
|
5774
5799
|
"collapsed",
|
|
5775
5800
|
"severity",
|
|
@@ -5777,8 +5802,8 @@ var doNotForwardProps$q = [
|
|
|
5777
5802
|
"hideBody",
|
|
5778
5803
|
];
|
|
5779
5804
|
var StyledCallout = styled__default.default(material.Alert, {
|
|
5780
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5781
|
-
})(templateObject_1$
|
|
5805
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$x.includes(prop); },
|
|
5806
|
+
})(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5782
5807
|
var _a, _b, _c, _d, _e;
|
|
5783
5808
|
var _f = props.intent, intent = _f === void 0 ? "info" : _f, sdsStyle = props.sdsStyle, hideBody = props.hideBody, collapsed = props.collapsed;
|
|
5784
5809
|
var spaces = getSpaces(props);
|
|
@@ -5790,12 +5815,12 @@ var StyledCallout = styled__default.default(material.Alert, {
|
|
|
5790
5815
|
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";
|
|
5791
5816
|
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.m, "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(material.alertClasses.icon, " {\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.width, "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(material.alertClasses.message, " {\n width: 100%;\n padding: 0;\n margin: 0;\n\n .").concat(material.alertTitleClasses.root, " {\n margin: 0;\n }\n }\n\n .").concat(material.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 ");
|
|
5792
5817
|
});
|
|
5793
|
-
var templateObject_1$
|
|
5818
|
+
var templateObject_1$W;
|
|
5794
5819
|
|
|
5795
5820
|
var CALLOUT_TITLE_DISPLAY_NAME = "CalloutTitle";
|
|
5796
5821
|
|
|
5797
|
-
var StyledCalloutTitle = styled__default.default(material.AlertTitle)(templateObject_1$
|
|
5798
|
-
var templateObject_1$
|
|
5822
|
+
var StyledCalloutTitle = styled__default.default(material.AlertTitle)(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n ", "\n margin: 0;\n"], ["\n ", "\n margin: 0;\n"])), fontBodySemiboldXs);
|
|
5823
|
+
var templateObject_1$V;
|
|
5799
5824
|
|
|
5800
5825
|
var CalloutTitle = function (_a) {
|
|
5801
5826
|
var children = _a.children;
|
|
@@ -5804,24 +5829,24 @@ var CalloutTitle = function (_a) {
|
|
|
5804
5829
|
// Display name required to ensure Callout expand works correctly.
|
|
5805
5830
|
CalloutTitle.displayName = CALLOUT_TITLE_DISPLAY_NAME;
|
|
5806
5831
|
|
|
5807
|
-
var StyledCalloutBody = styled__default.default("p")(templateObject_1$
|
|
5832
|
+
var StyledCalloutBody = styled__default.default("p")(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5808
5833
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a;
|
|
5809
5834
|
var spaces = getSpaces(props);
|
|
5810
5835
|
return "\n margin: ".concat(!hideTitle ? spaces === null || spaces === void 0 ? void 0 : spaces.xs : 0, "px 0 0 0;\n ");
|
|
5811
5836
|
});
|
|
5812
|
-
var templateObject_1$
|
|
5837
|
+
var templateObject_1$U;
|
|
5813
5838
|
|
|
5814
5839
|
var CalloutBody = function (_a) {
|
|
5815
5840
|
var children = _a.children, hideTitle = _a.hideTitle;
|
|
5816
5841
|
return (jsxRuntime.jsx(StyledCalloutBody, { hideTitle: hideTitle, children: children }));
|
|
5817
5842
|
};
|
|
5818
5843
|
|
|
5819
|
-
var StyledCalloutExtraContent = styled__default.default("div")(templateObject_1$
|
|
5844
|
+
var StyledCalloutExtraContent = styled__default.default("div")(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5820
5845
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a, _b = props.hideBody, hideBody = _b === void 0 ? false : _b;
|
|
5821
5846
|
var spaces = getSpaces(props);
|
|
5822
5847
|
return "\n margin: ".concat(hideTitle && hideBody ? 0 : spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0 0;\n ");
|
|
5823
5848
|
});
|
|
5824
|
-
var templateObject_1$
|
|
5849
|
+
var templateObject_1$T;
|
|
5825
5850
|
|
|
5826
5851
|
var CalloutExtraContent = function (_a) {
|
|
5827
5852
|
var children = _a.children, hideTitle = _a.hideTitle, hideBody = _a.hideBody;
|
|
@@ -5890,25 +5915,25 @@ var dark$1 = function (props) {
|
|
|
5890
5915
|
var _a, _b;
|
|
5891
5916
|
var spaces = getSpaces(props);
|
|
5892
5917
|
var semanticColors = getSemanticColors(props);
|
|
5893
|
-
return css.css(templateObject_1$
|
|
5918
|
+
return css.css(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n ", "\n background-color: ", ";\n color: ", ";\n text-align: center;\n max-width: 250px;\n padding: ", "px ", "px;\n "], ["\n ", "\n background-color: ", ";\n color: ", ";\n text-align: center;\n max-width: 250px;\n padding: ", "px ", "px;\n "])), fontHeaderXs(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfaceInverse, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimaryInverse, spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.l);
|
|
5894
5919
|
};
|
|
5895
5920
|
var light$1 = function (props) {
|
|
5896
5921
|
var _a, _b;
|
|
5897
5922
|
var spaces = getSpaces(props);
|
|
5898
5923
|
var semanticColors = getSemanticColors(props);
|
|
5899
|
-
return css.css(templateObject_2$
|
|
5924
|
+
return css.css(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n ", "\n background-color: ", ";\n color: ", ";\n text-align: left;\n max-width: 250px;\n padding: ", "px ", "px;\n "], ["\n ", "\n background-color: ", ";\n color: ", ";\n text-align: left;\n max-width: 250px;\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.l);
|
|
5900
5925
|
};
|
|
5901
5926
|
var wide = function () {
|
|
5902
|
-
return css.css(templateObject_3$
|
|
5927
|
+
return css.css(templateObject_3$q || (templateObject_3$q = __makeTemplateObject(["\n max-width: 550px;\n "], ["\n max-width: 550px;\n "])));
|
|
5903
5928
|
};
|
|
5904
5929
|
var tableStyles = function (props) {
|
|
5905
5930
|
var spaces = getSpaces(props);
|
|
5906
|
-
return css.css(templateObject_4$
|
|
5931
|
+
return css.css(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n padding: ", "px;\n "], ["\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
5907
5932
|
};
|
|
5908
|
-
var doNotForwardProps$
|
|
5933
|
+
var doNotForwardProps$w = ["hasInvertedStyle"];
|
|
5909
5934
|
var Subtitle$1 = styled__default.default("div", {
|
|
5910
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5911
|
-
})(templateObject_5$
|
|
5935
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$w.includes(prop); },
|
|
5936
|
+
})(templateObject_5$i || (templateObject_5$i = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
5912
5937
|
var _a, _b;
|
|
5913
5938
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
5914
5939
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5917,7 +5942,7 @@ var Subtitle$1 = styled__default.default("div", {
|
|
|
5917
5942
|
var tooltipCss = function (props) {
|
|
5918
5943
|
var _a = props.hasInvertedStyle, hasInvertedStyle = _a === void 0 ? true : _a, inverted = props.inverted, sdsStyle = props.sdsStyle, width = props.width, followCursor = props.followCursor;
|
|
5919
5944
|
var shadows = getShadows(props);
|
|
5920
|
-
return css.css(templateObject_6$
|
|
5945
|
+
return css.css(templateObject_6$f || (templateObject_6$f = __makeTemplateObject(["\n &.MuiTooltip-tooltip {\n box-shadow: ", ";\n\n ", "\n ", "\n\n ", "\n }\n "], ["\n &.MuiTooltip-tooltip {\n box-shadow: ", ";\n\n ", "\n ", "\n\n ", "\n }\n "])), shadows === null || shadows === void 0 ? void 0 : shadows.m, sdsStyle === "dark" || inverted || hasInvertedStyle
|
|
5921
5946
|
? dark$1(props)
|
|
5922
5947
|
: light$1(props), width === "wide" && sdsStyle === "light" && wide(), followCursor === true && tableStyles(props));
|
|
5923
5948
|
};
|
|
@@ -5925,7 +5950,7 @@ var arrowCss = function (props) {
|
|
|
5925
5950
|
var _a, _b;
|
|
5926
5951
|
var hasInvertedStyle = props.hasInvertedStyle, inverted = props.inverted, sdsStyle = props.sdsStyle, arrowOffset = props.arrowOffset;
|
|
5927
5952
|
var semanticColors = getSemanticColors(props);
|
|
5928
|
-
return css.css(templateObject_7$
|
|
5953
|
+
return css.css(templateObject_7$b || (templateObject_7$b = __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"
|
|
5929
5954
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfaceInverse
|
|
5930
5955
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.surface);
|
|
5931
5956
|
};
|
|
@@ -5933,8 +5958,8 @@ var arrowCss = function (props) {
|
|
|
5933
5958
|
* (masoudmanson): !important is needed to override arrow's
|
|
5934
5959
|
* default placement which is calculated by javascript
|
|
5935
5960
|
*/
|
|
5936
|
-
var StyledPopper$1 = styled__default.default(material.Popper)(templateObject_8$
|
|
5937
|
-
var templateObject_1$
|
|
5961
|
+
var StyledPopper$1 = styled__default.default(material.Popper)(templateObject_8$9 || (templateObject_8$9 = __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"])));
|
|
5962
|
+
var templateObject_1$S, templateObject_2$A, templateObject_3$q, templateObject_4$m, templateObject_5$i, templateObject_6$f, templateObject_7$b, templateObject_8$9;
|
|
5938
5963
|
|
|
5939
5964
|
/**
|
|
5940
5965
|
* @see https://mui.com/material-ui/react-tooltip/
|
|
@@ -6011,7 +6036,7 @@ function mergeClass$1(_a) {
|
|
|
6011
6036
|
return propClassName ? "".concat(propClassName, " ").concat(className) : className;
|
|
6012
6037
|
}
|
|
6013
6038
|
|
|
6014
|
-
var doNotForwardProps$
|
|
6039
|
+
var doNotForwardProps$v = [
|
|
6015
6040
|
"icon",
|
|
6016
6041
|
"iconVerticalAlign",
|
|
6017
6042
|
"horizontalAlign",
|
|
@@ -6039,8 +6064,8 @@ var verticalAlignToFlexMap = {
|
|
|
6039
6064
|
top: "flex-start",
|
|
6040
6065
|
};
|
|
6041
6066
|
var StyledTableData = styled__default.default("td", {
|
|
6042
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6043
|
-
})(templateObject_1$
|
|
6067
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6068
|
+
})(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
6044
6069
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6045
6070
|
var spaces = getSpaces(props);
|
|
6046
6071
|
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 ");
|
|
@@ -6051,30 +6076,30 @@ var ShouldWrap = function (lineCount) {
|
|
|
6051
6076
|
var ShouldTruncate = function () {
|
|
6052
6077
|
return "\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n ";
|
|
6053
6078
|
};
|
|
6054
|
-
var StyledCellContent = styled__default.default("div")(templateObject_2$
|
|
6055
|
-
var StyledCellContentWrapper = styled__default.default("div")(templateObject_3$
|
|
6079
|
+
var StyledCellContent = styled__default.default("div")(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
6080
|
+
var StyledCellContentWrapper = styled__default.default("div")(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
6056
6081
|
var StyledCellIconWrapper = styled__default.default("div", {
|
|
6057
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6058
|
-
})(templateObject_4$
|
|
6082
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6083
|
+
})(templateObject_4$l || (templateObject_4$l = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6059
6084
|
var _a = props.iconVerticalAlign, iconVerticalAlign = _a === void 0 ? "top" : _a;
|
|
6060
6085
|
var spaces = getSpaces(props);
|
|
6061
6086
|
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 ");
|
|
6062
6087
|
});
|
|
6063
|
-
var PrimaryTextWrapper = styled__default.default("div")(templateObject_5$
|
|
6088
|
+
var PrimaryTextWrapper = styled__default.default("div")(templateObject_5$h || (templateObject_5$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6064
6089
|
var horizontalAlign = props.horizontalAlign;
|
|
6065
6090
|
return "\n display: flex;\n justify-content: ".concat(horizontalAlign === "left" ? "flex-start" : "flex-end", ";\n ");
|
|
6066
6091
|
});
|
|
6067
6092
|
var PrimaryText = styled__default.default("div", {
|
|
6068
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6069
|
-
})(templateObject_6$
|
|
6093
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6094
|
+
})(templateObject_6$e || (templateObject_6$e = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6070
6095
|
var _a = props.primaryTextWrapLineCount, primaryTextWrapLineCount = _a === void 0 ? 3 : _a;
|
|
6071
6096
|
return "\n display: block;\n ".concat(props.shouldTextWrap
|
|
6072
6097
|
? ShouldWrap(primaryTextWrapLineCount)
|
|
6073
6098
|
: ShouldTruncate(), "\n ");
|
|
6074
6099
|
});
|
|
6075
6100
|
var SecondaryText = styled__default.default("span", {
|
|
6076
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6077
|
-
})(templateObject_7$
|
|
6101
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6102
|
+
})(templateObject_7$a || (templateObject_7$a = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6078
6103
|
var _a;
|
|
6079
6104
|
var _b = props.secondaryTextWrapLineCount, secondaryTextWrapLineCount = _b === void 0 ? 1 : _b;
|
|
6080
6105
|
var spaces = getSpaces(props);
|
|
@@ -6084,8 +6109,8 @@ var SecondaryText = styled__default.default("span", {
|
|
|
6084
6109
|
: ShouldTruncate(), "\n ");
|
|
6085
6110
|
});
|
|
6086
6111
|
var TertiaryText = styled__default.default("span", {
|
|
6087
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6088
|
-
})(templateObject_8$
|
|
6112
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6113
|
+
})(templateObject_8$8 || (templateObject_8$8 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6089
6114
|
var _a;
|
|
6090
6115
|
var _b = props.tertiaryTextWrapLineCount, tertiaryTextWrapLineCount = _b === void 0 ? 1 : _b;
|
|
6091
6116
|
var spaces = getSpaces(props);
|
|
@@ -6094,15 +6119,15 @@ var TertiaryText = styled__default.default("span", {
|
|
|
6094
6119
|
? ShouldWrap(tertiaryTextWrapLineCount)
|
|
6095
6120
|
: ShouldTruncate(), "\n ");
|
|
6096
6121
|
});
|
|
6097
|
-
var PrimaryTextComponentSlotBottomWrapper = styled__default.default("div")(templateObject_9$
|
|
6122
|
+
var PrimaryTextComponentSlotBottomWrapper = styled__default.default("div")(templateObject_9$5 || (templateObject_9$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6098
6123
|
var spaces = getSpaces(props);
|
|
6099
6124
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
6100
6125
|
});
|
|
6101
|
-
var PrimaryTextComponentSlotRightWrapper = styled__default.default("div")(templateObject_10$
|
|
6126
|
+
var PrimaryTextComponentSlotRightWrapper = styled__default.default("div")(templateObject_10$4 || (templateObject_10$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6102
6127
|
var spaces = getSpaces(props);
|
|
6103
6128
|
return "\n margin-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
6104
6129
|
});
|
|
6105
|
-
var templateObject_1$
|
|
6130
|
+
var templateObject_1$R, templateObject_2$z, templateObject_3$p, templateObject_4$l, templateObject_5$h, templateObject_6$e, templateObject_7$a, templateObject_8$8, templateObject_9$5, templateObject_10$4;
|
|
6106
6131
|
|
|
6107
6132
|
var CellBasicContent = function (props) {
|
|
6108
6133
|
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;
|
|
@@ -6116,15 +6141,15 @@ var CellBasic = React.forwardRef(function (props, ref) {
|
|
|
6116
6141
|
return (jsxRuntime.jsx(StyledTableData, __assign({ ref: ref }, props, { children: jsxRuntime.jsx(CellBasicContent, __assign({}, props)) })));
|
|
6117
6142
|
});
|
|
6118
6143
|
|
|
6119
|
-
var doNotForwardProps$
|
|
6144
|
+
var doNotForwardProps$u = ["horizontalAlign", "verticalAlign"];
|
|
6120
6145
|
var StyledCellComponentData = styled__default.default("td", {
|
|
6121
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6122
|
-
})(templateObject_1$
|
|
6146
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6147
|
+
})(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
6123
6148
|
var spaces = getSpaces(props);
|
|
6124
6149
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6125
6150
|
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 ");
|
|
6126
6151
|
});
|
|
6127
|
-
var templateObject_1$
|
|
6152
|
+
var templateObject_1$Q;
|
|
6128
6153
|
|
|
6129
6154
|
var CellComponent = React.forwardRef(function (props, _) {
|
|
6130
6155
|
var children = props.children;
|
|
@@ -6136,7 +6161,7 @@ var contentPositionMapping = {
|
|
|
6136
6161
|
left: "flex-start",
|
|
6137
6162
|
right: "flex-end",
|
|
6138
6163
|
};
|
|
6139
|
-
var doNotForwardProps$
|
|
6164
|
+
var doNotForwardProps$t = [
|
|
6140
6165
|
"active",
|
|
6141
6166
|
"horizontalAlign",
|
|
6142
6167
|
"shouldShowTooltipOnHover",
|
|
@@ -6146,8 +6171,8 @@ var doNotForwardProps$m = [
|
|
|
6146
6171
|
"hover",
|
|
6147
6172
|
];
|
|
6148
6173
|
var StyledSortingIcon = styled__default.default(Icon, {
|
|
6149
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6150
|
-
})(templateObject_1$
|
|
6174
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$t.includes(prop); },
|
|
6175
|
+
})(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6151
6176
|
var _a;
|
|
6152
6177
|
var _b = props.active, active = _b === void 0 ? false : _b, hideSortIcon = props.hideSortIcon;
|
|
6153
6178
|
var spaces = getSpaces(props);
|
|
@@ -6155,8 +6180,8 @@ var StyledSortingIcon = styled__default.default(Icon, {
|
|
|
6155
6180
|
return "\n margin-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n margin-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n color: ").concat(active ? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.ornament : "transparent", ";\n display: ").concat(hideSortIcon ? (active ? "block" : "none") : "block", ";\n outline: none !important;\n ");
|
|
6156
6181
|
});
|
|
6157
6182
|
var StyledTableHeader$1 = styled__default.default("th", {
|
|
6158
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6159
|
-
})(templateObject_2$
|
|
6183
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$t.includes(prop); },
|
|
6184
|
+
})(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontHeaderS, focusVisibleA11yStyle, function (props) {
|
|
6160
6185
|
var _a, _b, _c, _d, _e, _f;
|
|
6161
6186
|
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;
|
|
6162
6187
|
var spaces = getSpaces(props);
|
|
@@ -6170,12 +6195,12 @@ var StyledTableHeader$1 = styled__default.default("th", {
|
|
|
6170
6195
|
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 ");
|
|
6171
6196
|
});
|
|
6172
6197
|
var StyledCellHeaderContainer = styled__default.default("div", {
|
|
6173
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6174
|
-
})(templateObject_3$
|
|
6198
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$t.includes(prop); },
|
|
6199
|
+
})(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6175
6200
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a;
|
|
6176
6201
|
return "\n align-items: flex-end;\n width: 100%;\n display: flex;\n justify-content: ".concat(horizontalAlign ? contentPositionMapping[horizontalAlign] : "flex-start", ";\n ");
|
|
6177
6202
|
});
|
|
6178
|
-
var templateObject_1$
|
|
6203
|
+
var templateObject_1$P, templateObject_2$y, templateObject_3$o;
|
|
6179
6204
|
|
|
6180
6205
|
var CellHeaderContent = function (props) {
|
|
6181
6206
|
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;
|
|
@@ -6195,20 +6220,20 @@ var CellHeader = React.forwardRef(function (props, ref) {
|
|
|
6195
6220
|
|
|
6196
6221
|
var small = function (props) {
|
|
6197
6222
|
var spaces = getSpaces(props);
|
|
6198
|
-
return react.css(templateObject_1$
|
|
6223
|
+
return react.css(templateObject_1$O || (templateObject_1$O = __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));
|
|
6199
6224
|
};
|
|
6200
6225
|
var medium = function (props) {
|
|
6201
6226
|
var spaces = getSpaces(props);
|
|
6202
6227
|
var colors = getColors(props);
|
|
6203
|
-
return react.css(templateObject_2$
|
|
6228
|
+
return react.css(templateObject_2$x || (templateObject_2$x = __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);
|
|
6204
6229
|
};
|
|
6205
6230
|
var rounded$2 = function (props) {
|
|
6206
6231
|
var corners = getCorners(props);
|
|
6207
|
-
return react.css(templateObject_3$
|
|
6232
|
+
return react.css(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.l);
|
|
6208
6233
|
};
|
|
6209
6234
|
var square$2 = function (props) {
|
|
6210
6235
|
var corners = getCorners(props);
|
|
6211
|
-
return react.css(templateObject_4$
|
|
6236
|
+
return react.css(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.m);
|
|
6212
6237
|
};
|
|
6213
6238
|
var success = function (props) {
|
|
6214
6239
|
return createStatusCss(props, "success");
|
|
@@ -6261,7 +6286,7 @@ function createStatusCss(props, status) {
|
|
|
6261
6286
|
},
|
|
6262
6287
|
};
|
|
6263
6288
|
var statusColors = statusToColors[status];
|
|
6264
|
-
return react.css(templateObject_5$
|
|
6289
|
+
return react.css(templateObject_5$g || (templateObject_5$g = __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);
|
|
6265
6290
|
}
|
|
6266
6291
|
var statusToCss = {
|
|
6267
6292
|
beta: beta,
|
|
@@ -6271,14 +6296,14 @@ var statusToCss = {
|
|
|
6271
6296
|
success: success,
|
|
6272
6297
|
warning: warning,
|
|
6273
6298
|
};
|
|
6274
|
-
var doNotForwardProps$
|
|
6299
|
+
var doNotForwardProps$s = ["isRounded"];
|
|
6275
6300
|
var StyledChip = styled__default.default(material.Chip, {
|
|
6276
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6277
|
-
})(templateObject_7$
|
|
6301
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$s.includes(prop); },
|
|
6302
|
+
})(templateObject_7$9 || (templateObject_7$9 = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
6278
6303
|
var size = props.size, status = props.status, isRounded = props.isRounded;
|
|
6279
|
-
return react.css(templateObject_6$
|
|
6304
|
+
return react.css(templateObject_6$d || (templateObject_6$d = __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));
|
|
6280
6305
|
});
|
|
6281
|
-
var templateObject_1$
|
|
6306
|
+
var templateObject_1$O, templateObject_2$x, templateObject_3$n, templateObject_4$k, templateObject_5$g, templateObject_6$d, templateObject_7$9;
|
|
6282
6307
|
|
|
6283
6308
|
/**
|
|
6284
6309
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6296,7 +6321,7 @@ var Chip = function (props) {
|
|
|
6296
6321
|
return jsxRuntime.jsx(StyledChip, __assign({}, props));
|
|
6297
6322
|
};
|
|
6298
6323
|
|
|
6299
|
-
var doNotForwardProps$
|
|
6324
|
+
var doNotForwardProps$r = [
|
|
6300
6325
|
"anchorEl",
|
|
6301
6326
|
"count",
|
|
6302
6327
|
"keepSearchOnSelect",
|
|
@@ -6310,19 +6335,19 @@ var doNotForwardProps$k = [
|
|
|
6310
6335
|
"isMultiColumn",
|
|
6311
6336
|
];
|
|
6312
6337
|
var StyledHeaderTitle = styled__default.default("div", {
|
|
6313
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6314
|
-
})(templateObject_1$
|
|
6338
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
6339
|
+
})(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderXs, function (props) {
|
|
6315
6340
|
var _a;
|
|
6316
6341
|
var spaces = getSpaces(props);
|
|
6317
6342
|
var semanticColors = getSemanticColors(props);
|
|
6318
6343
|
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 ");
|
|
6319
6344
|
});
|
|
6320
|
-
var StyledDropdownMenuAutocompleteWrapper = styled__default.default("div")(templateObject_2$
|
|
6345
|
+
var StyledDropdownMenuAutocompleteWrapper = styled__default.default("div")(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n & .", ", & .MuiPopper-root,\n .base-Popper-root {\n position: relative !important;\n transform: none !important;\n width: 100% !important;\n box-shadow: none;\n padding: 0;\n border: none;\n\n .", ", .MuiPaper-root {\n box-shadow: none !important;\n border: none !important;\n border-radius: 0;\n margin: 0;\n padding: 0;\n }\n }\n"], ["\n & .", ", & .MuiPopper-root,\n .base-Popper-root {\n position: relative !important;\n transform: none !important;\n width: 100% !important;\n box-shadow: none;\n padding: 0;\n border: none;\n\n .", ", .MuiPaper-root {\n box-shadow: none !important;\n border: none !important;\n border-radius: 0;\n margin: 0;\n padding: 0;\n }\n }\n"])), material.autocompleteClasses.popper, material.autocompleteClasses.paper);
|
|
6321
6346
|
var StyledPopper = styled__default.default(material.Popper, {
|
|
6322
6347
|
shouldForwardProp: function (prop) {
|
|
6323
|
-
return !doNotForwardProps$
|
|
6348
|
+
return !doNotForwardProps$r.includes(prop) || prop === "anchorEl";
|
|
6324
6349
|
},
|
|
6325
|
-
})(templateObject_3$
|
|
6350
|
+
})(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6326
6351
|
var _a;
|
|
6327
6352
|
var borders = getBorders(props);
|
|
6328
6353
|
var corners = getCorners(props);
|
|
@@ -6331,8 +6356,8 @@ var StyledPopper = styled__default.default(material.Popper, {
|
|
|
6331
6356
|
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.m, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n box-sizing: border-box;\n z-index: 1400;\n ");
|
|
6332
6357
|
});
|
|
6333
6358
|
var StyledPaper$1 = styled__default.default(material.Paper, {
|
|
6334
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6335
|
-
})(templateObject_4$
|
|
6359
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
6360
|
+
})(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6336
6361
|
var _a;
|
|
6337
6362
|
var spaces = getSpaces(props);
|
|
6338
6363
|
var borders = getBorders(props);
|
|
@@ -6340,12 +6365,12 @@ var StyledPaper$1 = styled__default.default(material.Paper, {
|
|
|
6340
6365
|
var semanticColors = getSemanticColors(props);
|
|
6341
6366
|
return "\n box-shadow: ".concat(shadows === null || shadows === void 0 ? void 0 : shadows.none, " !important;\n border: ").concat(borders === null || borders === void 0 ? void 0 : borders.none, ";\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 margin: 0;\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n\n .MuiAutocomplete-root,\n .MuiFormControl-root.MuiTextField-root {\n margin-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\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 ");
|
|
6342
6367
|
});
|
|
6343
|
-
var StyledDropdownMenuHeader = styled__default.default("div")(templateObject_5$
|
|
6368
|
+
var StyledDropdownMenuHeader = styled__default.default("div")(templateObject_5$f || (templateObject_5$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6344
6369
|
var search = props.search;
|
|
6345
6370
|
var spaces = getSpaces(props);
|
|
6346
6371
|
return "\n display: flex;\n align-items: center;\n justify-content: space-between;\n margin-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n margin-bottom: ").concat(search ? spaces === null || spaces === void 0 ? void 0 : spaces.s : spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n ");
|
|
6347
6372
|
});
|
|
6348
|
-
var templateObject_1$
|
|
6373
|
+
var templateObject_1$N, templateObject_2$w, templateObject_3$m, templateObject_4$j, templateObject_5$f;
|
|
6349
6374
|
|
|
6350
6375
|
// (masoudmanson): Represents the minimum width defined by design specifications
|
|
6351
6376
|
// for the dropdownMenu's popper component
|
|
@@ -6383,7 +6408,7 @@ var DropdownMenu = function (props) {
|
|
|
6383
6408
|
sx: dropdownMenuPopperSx, children: jsxRuntime.jsx(PaperComponent, { children: jsxRuntime.jsx(material.ClickAwayListener, __assign({ onClickAway: onClickAway }, ClickAwayListenerProps, { children: jsxRuntime.jsxs(StyledDropdownMenuAutocompleteWrapper, { children: [(title || headerComponentSlot) && (jsxRuntime.jsxs(StyledDropdownMenuHeader, { search: search, children: [title && jsxRuntime.jsx(StyledHeaderTitle, { children: title }), headerComponentSlot && jsxRuntime.jsx(jsxRuntime.Fragment, { children: headerComponentSlot })] })), anchorEl && (jsxRuntime.jsx(Autocomplete, __assign({ label: label, search: search, title: title, open: open, options: options, PopperBaseProps: DEFAULT_POPPER_BASE_PROPS, disablePortal: true, onClickAway: noop, onClick: noop }, rest, { InputBaseProps: DefaultInputBaseProps }))), children] }) })) }) })));
|
|
6384
6409
|
};
|
|
6385
6410
|
|
|
6386
|
-
var doNotForwardProps$
|
|
6411
|
+
var doNotForwardProps$q = [
|
|
6387
6412
|
"intent",
|
|
6388
6413
|
"state",
|
|
6389
6414
|
"sdsType",
|
|
@@ -6411,27 +6436,27 @@ var inputDropdownStyles = function (props) {
|
|
|
6411
6436
|
* The top/bottom padding is set to 1px less than the actual value to account for the border.
|
|
6412
6437
|
*/
|
|
6413
6438
|
var padding = "".concat(((_a = spaces === null || spaces === void 0 ? void 0 : spaces.xs) !== null && _a !== void 0 ? _a : 6) - 1, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px");
|
|
6414
|
-
return react.css(templateObject_1$
|
|
6439
|
+
return react.css(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n ", "\n\n border: ", ";\n box-shadow: none !important;\n cursor: pointer;\n padding: ", ";\n justify-content: start;\n\n &.MuiButton-text {\n &:hover {\n color: ", ";\n }\n\n .styled-label {\n margin-left: ", "px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n svg {\n margin-right: ", "px;\n margin-left: ", "px;\n }\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: transparent;\n border: ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n background-color: transparent;\n border: ", ";\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: ", ";\n box-shadow: none !important;\n cursor: pointer;\n padding: ", ";\n justify-content: start;\n\n &.MuiButton-text {\n &:hover {\n color: ", ";\n }\n\n .styled-label {\n margin-left: ", "px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n }\n\n svg {\n margin-right: ", "px;\n margin-left: ", "px;\n }\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: transparent;\n border: ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n background-color: transparent;\n border: ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n }\n\n &:focus {\n background-color: transparent;\n outline-offset: -1px;\n }\n "])), labelStyle(props), (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.default, padding, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.l, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentSecondary, (_e = borders === null || borders === void 0 ? void 0 : borders.base) === null || _e === void 0 ? void 0 : _e.hover, (_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 = borders === null || borders === void 0 ? void 0 : borders.base) === null || _j === void 0 ? void 0 : _j.pressed, (_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);
|
|
6415
6440
|
};
|
|
6416
6441
|
var minimal$1 = function (props) {
|
|
6417
6442
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
6418
6443
|
var spaces = getSpaces(props);
|
|
6419
6444
|
var semanticColors = getSemanticColors(props);
|
|
6420
|
-
return react.css(templateObject_2$
|
|
6445
|
+
return react.css(templateObject_2$v || (templateObject_2$v = __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 background-color: transparent;\n\n /* Nesting to increase CSS specificity for style override */\n &.MuiButton-text {\n .styled-label {\n margin: 0;\n }\n }\n\n span {\n color: ", ";\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 &.MuiButton-root.MuiButton-text > span {\n ", "\n margin-left: 0;\n }\n\n &.MuiButton-root.MuiButton-text svg {\n margin-left: ", "px;\n margin-right: 0;\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 background-color: transparent;\n\n /* Nesting to increase CSS specificity for style override */\n &.MuiButton-text {\n .styled-label {\n margin: 0;\n }\n }\n\n span {\n color: ", ";\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 &.MuiButton-root.MuiButton-text > span {\n ", "\n margin-left: 0;\n }\n\n &.MuiButton-root.MuiButton-text svg {\n margin-left: ", "px;\n margin-right: 0;\n }\n "])), labelStyle(props), focusVisibleA11yStyle(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, 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, (_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, labelFontBodyS(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs);
|
|
6421
6446
|
};
|
|
6422
6447
|
var square$1 = function (props) {
|
|
6423
6448
|
var corners = getCorners(props);
|
|
6424
|
-
return react.css(templateObject_3$
|
|
6449
|
+
return react.css(templateObject_3$l || (templateObject_3$l = __makeTemplateObject(["\n border-radius: ", "px;\n min-width: 90px;\n background-color: transparent;\n "], ["\n border-radius: ", "px;\n min-width: 90px;\n background-color: transparent;\n "])), corners === null || corners === void 0 ? void 0 : corners.m);
|
|
6425
6450
|
};
|
|
6426
6451
|
var rounded$1 = function (props) {
|
|
6427
6452
|
var corners = getCorners(props);
|
|
6428
|
-
return react.css(templateObject_4$
|
|
6453
|
+
return react.css(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n border-radius: ", "px;\n min-width: 90px;\n background-color: transparent;\n "], ["\n border-radius: ", "px;\n min-width: 90px;\n background-color: transparent;\n "])), corners === null || corners === void 0 ? void 0 : corners.l);
|
|
6429
6454
|
};
|
|
6430
6455
|
var userInput = function (props) {
|
|
6431
6456
|
var _a, _b, _c, _d;
|
|
6432
6457
|
var sdsStyle = props.sdsStyle;
|
|
6433
6458
|
var semanticColors = getSemanticColors(props);
|
|
6434
|
-
return react.css(templateObject_5$
|
|
6459
|
+
return react.css(templateObject_5$e || (templateObject_5$e = __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"
|
|
6435
6460
|
? "\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 ")
|
|
6436
6461
|
: "");
|
|
6437
6462
|
};
|
|
@@ -6441,7 +6466,7 @@ var isOpen = function (props) {
|
|
|
6441
6466
|
var borders = getBorders(props);
|
|
6442
6467
|
var semanticColors = getSemanticColors(props);
|
|
6443
6468
|
var inputColor = intentToColor$2[intent];
|
|
6444
|
-
return react.css(templateObject_6$
|
|
6469
|
+
return react.css(templateObject_6$c || (templateObject_6$c = __makeTemplateObject(["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n ", "\n\n path {\n fill: ", ";\n }\n\n border: ", ";\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 border: ", ";\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"
|
|
6445
6470
|
? "\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 ")
|
|
6446
6471
|
: "", inputColor === "accent"
|
|
6447
6472
|
? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.ornamentOpen
|
|
@@ -6449,17 +6474,17 @@ var isOpen = function (props) {
|
|
|
6449
6474
|
? borders === null || borders === void 0 ? void 0 : borders.none
|
|
6450
6475
|
: (_f = borders === null || borders === void 0 ? void 0 : borders[inputColor]) === null || _f === void 0 ? void 0 : _f.open, sdsStyle === "minimal"
|
|
6451
6476
|
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.fillOpen
|
|
6452
|
-
: "transparent", (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentSecondaryHover, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.
|
|
6477
|
+
: "transparent", (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentSecondaryHover, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.borderPrimaryHover);
|
|
6453
6478
|
};
|
|
6454
6479
|
var applyIntentColor$1 = function (props, intent) {
|
|
6455
6480
|
var _a, _b, _c;
|
|
6456
6481
|
var borders = getBorders(props);
|
|
6457
|
-
return react.css(templateObject_7$
|
|
6482
|
+
return react.css(templateObject_7$8 || (templateObject_7$8 = __makeTemplateObject(["\n border: ", ";\n\n &:hover {\n border: ", ";\n }\n\n &:active {\n border: ", ";\n }\n "], ["\n border: ", ";\n\n &:hover {\n border: ", ";\n }\n\n &:active {\n border: ", ";\n }\n "])), (_a = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _a === void 0 ? void 0 : _a.default, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, (_c = borders === null || borders === void 0 ? void 0 : borders.base) === null || _c === void 0 ? void 0 : _c.pressed);
|
|
6458
6483
|
};
|
|
6459
6484
|
var isDisabled = function (props) {
|
|
6460
6485
|
var _a, _b, _c, _d;
|
|
6461
6486
|
var semanticColors = getSemanticColors(props);
|
|
6462
|
-
return react.css(templateObject_8$
|
|
6487
|
+
return react.css(templateObject_8$7 || (templateObject_8$7 = __makeTemplateObject(["\n cursor: default;\n border-color: ", ";\n\n span {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n path {\n fill: ", ";\n }\n "], ["\n cursor: default;\n border-color: ", ";\n\n span {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\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, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textDisabled, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentDisabled);
|
|
6463
6488
|
};
|
|
6464
6489
|
/**
|
|
6465
6490
|
* (masoudmanson): `Button as React.ComponentType<InputDropdownProps>` is a
|
|
@@ -6470,10 +6495,10 @@ var isDisabled = function (props) {
|
|
|
6470
6495
|
* to the InputDropdownProps interface.
|
|
6471
6496
|
*/
|
|
6472
6497
|
var StyledInputDropdown = styled__default.default(Button, {
|
|
6473
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6474
|
-
})(templateObject_10$
|
|
6498
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6499
|
+
})(templateObject_10$3 || (templateObject_10$3 = __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) {
|
|
6475
6500
|
var disabled = props.disabled, intent = props.intent, state = props.state, value = props.value, sdsStyle = props.sdsStyle;
|
|
6476
|
-
return react.css(templateObject_9$
|
|
6501
|
+
return react.css(templateObject_9$4 || (templateObject_9$4 = __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" &&
|
|
6477
6502
|
sdsStyle !== "minimal" &&
|
|
6478
6503
|
applyIntentColor$1(props, "notice"), intent === "negative" &&
|
|
6479
6504
|
sdsStyle !== "minimal" &&
|
|
@@ -6482,16 +6507,16 @@ var StyledInputDropdown = styled__default.default(Button, {
|
|
|
6482
6507
|
applyIntentColor$1(props, "positive"), state === "open" && isOpen(props), disabled && isDisabled(props));
|
|
6483
6508
|
});
|
|
6484
6509
|
var StyledDetail = styled__default.default("span", {
|
|
6485
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6486
|
-
})(templateObject_11$
|
|
6510
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6511
|
+
})(templateObject_11$3 || (templateObject_11$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6487
6512
|
var _a;
|
|
6488
6513
|
var spaces = getSpaces(props);
|
|
6489
6514
|
var semanticColors = getSemanticColors(props);
|
|
6490
6515
|
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 ");
|
|
6491
6516
|
});
|
|
6492
6517
|
var StyledLabel$2 = styled__default.default("span", {
|
|
6493
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6494
|
-
})(templateObject_12$
|
|
6518
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6519
|
+
})(templateObject_12$3 || (templateObject_12$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6495
6520
|
var _a, _b;
|
|
6496
6521
|
var details = props.details, counter = props.counter, sdsType = props.sdsType;
|
|
6497
6522
|
var fontWeights = getFontWeights(props);
|
|
@@ -6502,8 +6527,8 @@ var StyledLabel$2 = styled__default.default("span", {
|
|
|
6502
6527
|
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 ");
|
|
6503
6528
|
});
|
|
6504
6529
|
var StyledCounter = styled__default.default("span", {
|
|
6505
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6506
|
-
})(templateObject_13$
|
|
6530
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6531
|
+
})(templateObject_13$3 || (templateObject_13$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6507
6532
|
var _a, _b;
|
|
6508
6533
|
var corners = getCorners(props);
|
|
6509
6534
|
var spaces = getSpaces(props);
|
|
@@ -6511,8 +6536,8 @@ var StyledCounter = styled__default.default("span", {
|
|
|
6511
6536
|
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.l, "px;\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
6512
6537
|
});
|
|
6513
6538
|
var MinimalDetails = styled__default.default("div", {
|
|
6514
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6515
|
-
})(templateObject_14$
|
|
6539
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6540
|
+
})(templateObject_14$3 || (templateObject_14$3 = __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) {
|
|
6516
6541
|
var _a;
|
|
6517
6542
|
var shouldTruncateMinimalDetails = props.shouldTruncateMinimalDetails;
|
|
6518
6543
|
var semanticColors = getSemanticColors(props);
|
|
@@ -6520,23 +6545,23 @@ var MinimalDetails = styled__default.default("div", {
|
|
|
6520
6545
|
"overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;", "\n ");
|
|
6521
6546
|
});
|
|
6522
6547
|
var LabelWrapper = styled__default.default("span", {
|
|
6523
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6524
|
-
})(templateObject_15$
|
|
6548
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6549
|
+
})(templateObject_15$3 || (templateObject_15$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
6525
6550
|
var isMinimal = _a.isMinimal;
|
|
6526
6551
|
return "\n align-items: ".concat(isMinimal ? "center" : undefined, ";\n display: ").concat(isMinimal ? "inline-flex" : "contents", ";\n justify-content: ").concat(isMinimal ? "space-between" : undefined, ";\n width: 100%;\n ");
|
|
6527
6552
|
});
|
|
6528
6553
|
var IconWrapper = styled__default.default("span", {
|
|
6529
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6530
|
-
})(templateObject_16$
|
|
6554
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6555
|
+
})(templateObject_16$2 || (templateObject_16$2 = __makeTemplateObject(["\n margin-left: auto;\n display: flex;\n align-items: center;\n"], ["\n margin-left: auto;\n display: flex;\n align-items: center;\n"])));
|
|
6531
6556
|
function labelStyle(props) {
|
|
6532
6557
|
var _a, _b;
|
|
6533
6558
|
var semanticColors = getSemanticColors(props);
|
|
6534
6559
|
var labelColor = props.sdsType === "value"
|
|
6535
6560
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary
|
|
6536
6561
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textSecondary;
|
|
6537
|
-
return react.css(templateObject_17$
|
|
6562
|
+
return react.css(templateObject_17$2 || (templateObject_17$2 = __makeTemplateObject(["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n "], ["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n "])), labelColor);
|
|
6538
6563
|
}
|
|
6539
|
-
var templateObject_1$
|
|
6564
|
+
var templateObject_1$M, templateObject_2$v, templateObject_3$l, templateObject_4$i, templateObject_5$e, templateObject_6$c, templateObject_7$8, templateObject_8$7, templateObject_9$4, templateObject_10$3, templateObject_11$3, templateObject_12$3, templateObject_13$3, templateObject_14$3, templateObject_15$3, templateObject_16$2, templateObject_17$2;
|
|
6540
6565
|
|
|
6541
6566
|
/**
|
|
6542
6567
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -6603,33 +6628,33 @@ var tagSizeS = function (props) {
|
|
|
6603
6628
|
var spaces = getSpaces(props);
|
|
6604
6629
|
var iconSizes = getIconSizes(props);
|
|
6605
6630
|
var semanticColors = getSemanticColors(props);
|
|
6606
|
-
return react.css(templateObject_1$
|
|
6631
|
+
return react.css(templateObject_1$L || (templateObject_1$L = __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);
|
|
6607
6632
|
};
|
|
6608
6633
|
var tagSizeL = function (props) {
|
|
6609
6634
|
var _a;
|
|
6610
6635
|
var spaces = getSpaces(props);
|
|
6611
6636
|
var iconSizes = getIconSizes(props);
|
|
6612
6637
|
var semanticColors = getSemanticColors(props);
|
|
6613
|
-
return react.css(templateObject_2$
|
|
6638
|
+
return react.css(templateObject_2$u || (templateObject_2$u = __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);
|
|
6614
6639
|
};
|
|
6615
6640
|
var rounded = function (props) {
|
|
6616
6641
|
var corners = getCorners(props);
|
|
6617
6642
|
var spaces = getSpaces(props);
|
|
6618
6643
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6619
6644
|
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;
|
|
6620
|
-
return react.css(templateObject_3$
|
|
6645
|
+
return react.css(templateObject_3$k || (templateObject_3$k = __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.l, topBottomPadding, spaces === null || spaces === void 0 ? void 0 : spaces.s, corners === null || corners === void 0 ? void 0 : corners.l);
|
|
6621
6646
|
};
|
|
6622
6647
|
var square = function (props) {
|
|
6623
6648
|
var corners = getCorners(props);
|
|
6624
6649
|
var spaces = getSpaces(props);
|
|
6625
6650
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6626
6651
|
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;
|
|
6627
|
-
return react.css(templateObject_4$
|
|
6652
|
+
return react.css(templateObject_4$h || (templateObject_4$h = __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);
|
|
6628
6653
|
};
|
|
6629
6654
|
var withHover = function (props) {
|
|
6630
6655
|
var _a;
|
|
6631
6656
|
var semanticColors = getSemanticColors(props);
|
|
6632
|
-
return react.css(templateObject_5$
|
|
6657
|
+
return react.css(templateObject_5$d || (templateObject_5$d = __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);
|
|
6633
6658
|
};
|
|
6634
6659
|
var primary = function (props) {
|
|
6635
6660
|
return createTypeCss(props, "primary");
|
|
@@ -6698,13 +6723,13 @@ function createTypeCss(props, type) {
|
|
|
6698
6723
|
secondary: generateSecondaryTagColors(intent, colors, semanticColors),
|
|
6699
6724
|
};
|
|
6700
6725
|
var typeColors = typeToColors[type];
|
|
6701
|
-
return react.css(templateObject_6$
|
|
6726
|
+
return react.css(templateObject_6$b || (templateObject_6$b = __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);
|
|
6702
6727
|
}
|
|
6703
6728
|
var typeToCss = {
|
|
6704
6729
|
primary: primary,
|
|
6705
6730
|
secondary: secondary,
|
|
6706
6731
|
};
|
|
6707
|
-
var doNotForwardProps$
|
|
6732
|
+
var doNotForwardProps$p = [
|
|
6708
6733
|
"sdsType",
|
|
6709
6734
|
"sdsStyle",
|
|
6710
6735
|
"sdsSize",
|
|
@@ -6712,14 +6737,14 @@ var doNotForwardProps$i = [
|
|
|
6712
6737
|
"hover",
|
|
6713
6738
|
];
|
|
6714
6739
|
var StyledTag$2 = styled__default.default(material.Chip, {
|
|
6715
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6716
|
-
})(templateObject_8$
|
|
6740
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$p.includes(prop); },
|
|
6741
|
+
})(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
6717
6742
|
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;
|
|
6718
6743
|
var isRounded = sdsStyle === "rounded";
|
|
6719
6744
|
var type = sdsType || "primary";
|
|
6720
|
-
return react.css(templateObject_7$
|
|
6745
|
+
return react.css(templateObject_7$7 || (templateObject_7$7 = __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;");
|
|
6721
6746
|
});
|
|
6722
|
-
var templateObject_1$
|
|
6747
|
+
var templateObject_1$L, templateObject_2$u, templateObject_3$k, templateObject_4$h, templateObject_5$d, templateObject_6$b, templateObject_7$7, templateObject_8$6;
|
|
6723
6748
|
|
|
6724
6749
|
/**
|
|
6725
6750
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6733,14 +6758,14 @@ var Tag = function (props) {
|
|
|
6733
6758
|
return jsxRuntime.jsx(StyledTag$2, __assign({ tagColor: color }, props, { color: "primary" }));
|
|
6734
6759
|
};
|
|
6735
6760
|
|
|
6736
|
-
var StyledTag$1 = styled__default.default(Tag)(templateObject_2$
|
|
6761
|
+
var StyledTag$1 = styled__default.default(Tag)(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6737
6762
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
6738
6763
|
var spaces = getSpaces(props);
|
|
6739
6764
|
var iconSizes = getIconSizes(props);
|
|
6740
6765
|
var semanticColors = getSemanticColors(props);
|
|
6741
|
-
return react.css(templateObject_1$
|
|
6766
|
+
return react.css(templateObject_1$K || (templateObject_1$K = __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);
|
|
6742
6767
|
});
|
|
6743
|
-
var templateObject_1$
|
|
6768
|
+
var templateObject_1$K, templateObject_2$t;
|
|
6744
6769
|
|
|
6745
6770
|
/**
|
|
6746
6771
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6763,12 +6788,12 @@ var Chips = function (_a) {
|
|
|
6763
6788
|
}) }));
|
|
6764
6789
|
};
|
|
6765
6790
|
|
|
6766
|
-
var Wrapper$1 = styled__default.default("div")(templateObject_1$
|
|
6767
|
-
var StyledChipsWrapper = styled__default.default("div")(templateObject_2$
|
|
6791
|
+
var Wrapper$1 = styled__default.default("div")(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n min-width: 150px;\n"], ["\n min-width: 150px;\n"])));
|
|
6792
|
+
var StyledChipsWrapper = styled__default.default("div")(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6768
6793
|
var spaces = getSpaces(props);
|
|
6769
6794
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
6770
6795
|
});
|
|
6771
|
-
var templateObject_1$
|
|
6796
|
+
var templateObject_1$J, templateObject_2$s;
|
|
6772
6797
|
|
|
6773
6798
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
6774
6799
|
var ComplexFilter = function (_a) {
|
|
@@ -6857,13 +6882,345 @@ var ComplexFilter = function (_a) {
|
|
|
6857
6882
|
}
|
|
6858
6883
|
};
|
|
6859
6884
|
|
|
6885
|
+
var doNotForwardProps$o = [
|
|
6886
|
+
"visualElement",
|
|
6887
|
+
"sdsType",
|
|
6888
|
+
"imagePosition",
|
|
6889
|
+
"imagePadding",
|
|
6890
|
+
"overlineText",
|
|
6891
|
+
"titleText",
|
|
6892
|
+
"subtitleText",
|
|
6893
|
+
"metadataText",
|
|
6894
|
+
"contentBlock",
|
|
6895
|
+
"decorativeBorder",
|
|
6896
|
+
"boundingBox",
|
|
6897
|
+
"buttons",
|
|
6898
|
+
"visualElementType",
|
|
6899
|
+
"image",
|
|
6900
|
+
"icon",
|
|
6901
|
+
"buttonsPosition",
|
|
6902
|
+
"clickableCard",
|
|
6903
|
+
"imageSize",
|
|
6904
|
+
"clickableCardProps",
|
|
6905
|
+
"cardSdsType",
|
|
6906
|
+
"classes",
|
|
6907
|
+
];
|
|
6908
|
+
var StyledCard = styled__default.default(material.Card, {
|
|
6909
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6910
|
+
})(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6911
|
+
var _a, _b, _c, _d;
|
|
6912
|
+
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;
|
|
6913
|
+
var semanticColors = getSemanticColors(props);
|
|
6914
|
+
var flexDirection = sdsType === "wide" && visualElementType === "image"
|
|
6915
|
+
? imagePosition === "left"
|
|
6916
|
+
? "row"
|
|
6917
|
+
: "row-reverse"
|
|
6918
|
+
: visualElementType === "icon"
|
|
6919
|
+
? "row"
|
|
6920
|
+
: "column";
|
|
6921
|
+
var showDecorativeBorder = visualElementType === "image"
|
|
6922
|
+
? boundingBox && decorativeBorder && imagePadding
|
|
6923
|
+
: boundingBox && decorativeBorder;
|
|
6924
|
+
return react.css(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n display: flex;\n background-color: ", ";\n flex-direction: ", ";\n box-shadow: none;\n overflow: visible;\n\n .MuiCardActionArea-focusHighlight {\n background: transparent;\n }\n\n ", "\n\n ", "\n\n ", "\n "], ["\n display: flex;\n background-color: ", ";\n flex-direction: ", ";\n box-shadow: none;\n overflow: visible;\n\n .MuiCardActionArea-focusHighlight {\n background: transparent;\n }\n\n ", "\n\n ", "\n\n ", "\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.backgroundPrimary, flexDirection, boundingBox && react.css(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n border: 1px solid ", ";\n "], ["\n border: 1px solid ", ";\n "])), (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderSecondary), sdsType === "wide" &&
|
|
6925
|
+
showDecorativeBorder && react.css(templateObject_2$r || (templateObject_2$r = __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" &&
|
|
6926
|
+
showDecorativeBorder && react.css(templateObject_3$j || (templateObject_3$j = __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));
|
|
6927
|
+
});
|
|
6928
|
+
var StyledCardActionArea = styled__default.default(Button, {
|
|
6929
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6930
|
+
})(templateObject_6$a || (templateObject_6$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6931
|
+
var _a, _b;
|
|
6932
|
+
var _c = props.imagePosition, imagePosition = _c === void 0 ? "left" : _c, _d = props.cardSdsType, cardSdsType = _d === void 0 ? "wide" : _d, visualElementType = props.visualElementType;
|
|
6933
|
+
var semanticColors = getSemanticColors(props);
|
|
6934
|
+
var shadows = getShadows(props);
|
|
6935
|
+
var flexDirection = cardSdsType === "wide"
|
|
6936
|
+
? imagePosition === "left"
|
|
6937
|
+
? "row"
|
|
6938
|
+
: "row-reverse"
|
|
6939
|
+
: visualElementType === "image"
|
|
6940
|
+
? "column"
|
|
6941
|
+
: "row";
|
|
6942
|
+
return "\n display: flex;\n flex-direction: ".concat(flexDirection, ";\n align-items: unset;\n height: 100%;\n padding: 0;\n margin: 0;\n overflow: scroll;\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 box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.l, " !important;\n }\n ");
|
|
6943
|
+
});
|
|
6944
|
+
var StyledIconMediaWrapper = styled__default.default("div", {
|
|
6945
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6946
|
+
})(templateObject_10$2 || (templateObject_10$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6947
|
+
var _a = props.boundingBox, boundingBox = _a === void 0 ? true : _a;
|
|
6948
|
+
var spaces = getSpaces(props);
|
|
6949
|
+
return react.css(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), boundingBox
|
|
6950
|
+
? react.css(templateObject_7$6 || (templateObject_7$6 = __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) : react.css(templateObject_8$5 || (templateObject_8$5 = __makeTemplateObject(["\n padding-right: ", "px;\n "], ["\n padding-right: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
6951
|
+
});
|
|
6952
|
+
var StyledCardContent = styled__default.default("div", {
|
|
6953
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6954
|
+
})(templateObject_13$2 || (templateObject_13$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6955
|
+
var _a = props.boundingBox, boundingBox = _a === void 0 ? true : _a;
|
|
6956
|
+
var spaces = getSpaces(props);
|
|
6957
|
+
return react.css(templateObject_12$2 || (templateObject_12$2 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n\n ", "\n "], ["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n\n ", "\n "])), boundingBox && react.css(templateObject_11$2 || (templateObject_11$2 = __makeTemplateObject(["\n padding: ", "px;\n "], ["\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
6958
|
+
});
|
|
6959
|
+
var StyledContentCardBody = styled__default.default(material.CardContent, {
|
|
6960
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6961
|
+
})(templateObject_14$2 || (templateObject_14$2 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6962
|
+
var _a;
|
|
6963
|
+
var semanticColors = getSemanticColors(props);
|
|
6964
|
+
var spaces = getSpaces(props);
|
|
6965
|
+
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 ");
|
|
6966
|
+
});
|
|
6967
|
+
var StyledCardContentAligner = styled__default.default("div")(templateObject_15$2 || (templateObject_15$2 = __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"])));
|
|
6968
|
+
var templateObject_1$I, templateObject_2$r, templateObject_3$j, templateObject_4$g, templateObject_5$c, templateObject_6$a, templateObject_7$6, templateObject_8$5, templateObject_9$3, templateObject_10$2, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$2, templateObject_15$2;
|
|
6969
|
+
|
|
6970
|
+
var doNotForwardProps$n = [
|
|
6971
|
+
"visualElement",
|
|
6972
|
+
"sdsType",
|
|
6973
|
+
"imagePosition",
|
|
6974
|
+
"imagePadding",
|
|
6975
|
+
"overlineText",
|
|
6976
|
+
"titleText",
|
|
6977
|
+
"subtitleText",
|
|
6978
|
+
"metadataText",
|
|
6979
|
+
"contentBlock",
|
|
6980
|
+
];
|
|
6981
|
+
var StyledTitleWrapper = material.styled("div", {
|
|
6982
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6983
|
+
})(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6984
|
+
var spaces = getSpaces(props);
|
|
6985
|
+
return "\n display: flex;\n flex-direction: column;\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
6986
|
+
});
|
|
6987
|
+
var StyledOverlineText = material.styled("p", {
|
|
6988
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6989
|
+
})(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontCapsXxxs, function (props) {
|
|
6990
|
+
var _a;
|
|
6991
|
+
var semanticColors = getSemanticColors(props);
|
|
6992
|
+
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 ");
|
|
6993
|
+
});
|
|
6994
|
+
var StyledTitleText = material.styled("p", {
|
|
6995
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6996
|
+
})(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderXl, function (props) {
|
|
6997
|
+
var _a;
|
|
6998
|
+
var semanticColors = getSemanticColors(props);
|
|
6999
|
+
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 ");
|
|
7000
|
+
});
|
|
7001
|
+
var StyledSubtitleText = material.styled("p", {
|
|
7002
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
7003
|
+
})(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderM$1, function (props) {
|
|
7004
|
+
var _a;
|
|
7005
|
+
var semanticColors = getSemanticColors(props);
|
|
7006
|
+
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 ");
|
|
7007
|
+
});
|
|
7008
|
+
var StyledMetadataText = material.styled("p", {
|
|
7009
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
7010
|
+
})(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7011
|
+
var _a;
|
|
7012
|
+
var semanticColors = getSemanticColors(props);
|
|
7013
|
+
var spaces = getSpaces(props);
|
|
7014
|
+
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 ");
|
|
7015
|
+
});
|
|
7016
|
+
var templateObject_1$H, templateObject_2$q, templateObject_3$i, templateObject_4$f, templateObject_5$b;
|
|
7017
|
+
|
|
7018
|
+
/**
|
|
7019
|
+
* @see https://mui.com/material-ui/react-dialog/
|
|
7020
|
+
*/
|
|
7021
|
+
var ContentCardTitle = React.forwardRef(function ContentCardTitle(props, ref) {
|
|
7022
|
+
var overlineText = props.overlineText, titleText = props.titleText, subtitleText = props.subtitleText, metadataText = props.metadataText, _a = props.classes, classes = _a === void 0 ? EMPTY_OBJECT : _a;
|
|
7023
|
+
var cardHeader = classes.cardHeader, cardOverline = classes.cardOverline, cardTitle = classes.cardTitle, cardSubtitle = classes.cardSubtitle, cardMetadata = classes.cardMetadata;
|
|
7024
|
+
return (jsxRuntime.jsxs("div", { ref: ref, children: [jsxRuntime.jsxs(StyledTitleWrapper, { className: cardHeader, children: [overlineText && (jsxRuntime.jsx(StyledOverlineText, { className: cardOverline, children: overlineText })), titleText && (jsxRuntime.jsx(StyledTitleText, { className: cardTitle, children: titleText })), subtitleText && (jsxRuntime.jsx(StyledSubtitleText, { className: cardSubtitle, children: subtitleText }))] }), metadataText && (jsxRuntime.jsx(StyledMetadataText, { className: cardMetadata, children: metadataText }))] }));
|
|
7025
|
+
});
|
|
7026
|
+
|
|
7027
|
+
var doNotForwardProps$m = ["buttonsPosition"];
|
|
7028
|
+
var StyledCardActions = styled__default.default(material.CardActions, {
|
|
7029
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
7030
|
+
})(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7031
|
+
var _a = props.buttonsPosition, buttonsPosition = _a === void 0 ? "left" : _a;
|
|
7032
|
+
var spaces = getSpaces(props);
|
|
7033
|
+
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 ");
|
|
7034
|
+
});
|
|
7035
|
+
var templateObject_1$G;
|
|
7036
|
+
|
|
7037
|
+
var isButtonElement = function (child) {
|
|
7038
|
+
if (React__namespace.default.isValidElement(child) && child.type === Button) {
|
|
7039
|
+
return true;
|
|
7040
|
+
}
|
|
7041
|
+
else {
|
|
7042
|
+
showWarningIfFirstOccurence(SDSWarningTypes.ContentCardActionsOnlyButtons);
|
|
7043
|
+
return false;
|
|
7044
|
+
}
|
|
7045
|
+
};
|
|
7046
|
+
/**
|
|
7047
|
+
* @see https://mui.com/material-ui/api/card-actions/
|
|
7048
|
+
*/
|
|
7049
|
+
var ContentCardActions = React.forwardRef(function ContentCardActions(props, ref) {
|
|
7050
|
+
var buttonsPosition = props.buttonsPosition, clickableCard = props.clickableCard, children = props.children, _a = props.classes, classes = _a === void 0 ? EMPTY_OBJECT : _a;
|
|
7051
|
+
var cardActions = classes.cardActions;
|
|
7052
|
+
/**
|
|
7053
|
+
* (masoudmanson):
|
|
7054
|
+
* We need to ensure that only SDS buttons are used within the
|
|
7055
|
+
* ContentCardActions component slot. This is to prevent any potential
|
|
7056
|
+
* issues with using other components within the ContentCardActions component slot.
|
|
7057
|
+
*/
|
|
7058
|
+
var validChildren = React__namespace.default.Children.toArray(Array.isArray(children) ? children : [children]).filter(isButtonElement);
|
|
7059
|
+
/**
|
|
7060
|
+
* If the card is clickable, it acts as a `<button>` itself and cannot
|
|
7061
|
+
* have `<button>` elements as children. If multiple buttons are provided,
|
|
7062
|
+
* only the first one will be kept, and a warning will be shown.
|
|
7063
|
+
*
|
|
7064
|
+
* Any additional buttons cannot remain as `<button>` elements due to
|
|
7065
|
+
* DOM hierarchy constraints; they will be converted to `<a>` tags instead.
|
|
7066
|
+
*/
|
|
7067
|
+
if (clickableCard) {
|
|
7068
|
+
if (validChildren.length > 1) {
|
|
7069
|
+
showWarningIfFirstOccurence(SDSWarningTypes.ClickableContentCardNumberOfButtons);
|
|
7070
|
+
}
|
|
7071
|
+
/**
|
|
7072
|
+
* (masoudmanson): Since a clickable card can have at most one button,
|
|
7073
|
+
* we select the first button from the validChildren array and ignore the rest.
|
|
7074
|
+
*/
|
|
7075
|
+
var clickableCardButton = validChildren.shift();
|
|
7076
|
+
if (!clickableCardButton) {
|
|
7077
|
+
return null;
|
|
7078
|
+
}
|
|
7079
|
+
return (jsxRuntime.jsx(StyledCardActions, { ref: ref, buttonsPosition: buttonsPosition, className: cardActions, children: [
|
|
7080
|
+
React__namespace.default.cloneElement(clickableCardButton, __assign({ component: "div" }, clickableCardButton === null || clickableCardButton === void 0 ? void 0 : clickableCardButton.props)),
|
|
7081
|
+
] }));
|
|
7082
|
+
}
|
|
7083
|
+
return (jsxRuntime.jsx(StyledCardActions, { ref: ref, buttonsPosition: buttonsPosition, className: cardActions, children: validChildren }));
|
|
7084
|
+
});
|
|
7085
|
+
|
|
7086
|
+
var doNotForwardProps$l = [
|
|
7087
|
+
"imagePadding",
|
|
7088
|
+
"boundingBox",
|
|
7089
|
+
"sdsType",
|
|
7090
|
+
"imageSize",
|
|
7091
|
+
"image",
|
|
7092
|
+
"imagePosition",
|
|
7093
|
+
];
|
|
7094
|
+
var StyledImageMediaWrapper = material.styled("div", {
|
|
7095
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$l.includes(prop); },
|
|
7096
|
+
})(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7097
|
+
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;
|
|
7098
|
+
var spaces = getSpaces(props);
|
|
7099
|
+
return material.css(templateObject_8$4 || (templateObject_8$4 = __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
|
|
7100
|
+
? imagePadding
|
|
7101
|
+
? material.css(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n padding: ", "px;\n ", "\n "], ["\n padding: ", "px;\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl, imagePosition === "left"
|
|
7102
|
+
? "padding-right: 0;"
|
|
7103
|
+
: "padding-left: 0;") : material.css(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n padding: 0;\n "], ["\n padding: 0;\n "])))
|
|
7104
|
+
: material.css(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), imagePosition === "left"
|
|
7105
|
+
? "padding-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")
|
|
7106
|
+
: "padding-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")), sdsType === "narrow" && material.css(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n ", "\n\n justify-content: center;\n "], ["\n ", "\n\n justify-content: center;\n "])), boundingBox
|
|
7107
|
+
? imagePadding
|
|
7108
|
+
? material.css(templateObject_4$e || (templateObject_4$e = __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) : material.css(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n padding: 0;\n "], ["\n padding: 0;\n "])))
|
|
7109
|
+
: material.css(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n padding-bottom: ", "px;\n "], ["\n padding-bottom: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl)));
|
|
7110
|
+
});
|
|
7111
|
+
var templateObject_1$F, templateObject_2$p, templateObject_3$h, templateObject_4$e, templateObject_5$a, templateObject_6$9, templateObject_7$5, templateObject_8$4, templateObject_9$2;
|
|
7112
|
+
|
|
7113
|
+
/**
|
|
7114
|
+
* @see https://mui.com/material-ui/api/card-media/
|
|
7115
|
+
*/
|
|
7116
|
+
var ContentCardImageMedia = React.forwardRef(function ContentCardImageMedia(props, ref) {
|
|
7117
|
+
var image = props.image, imageSize = props.imageSize, sdsType = props.sdsType, className = props.className;
|
|
7118
|
+
/**
|
|
7119
|
+
* (masoudmanson): These styles makes the image responsive and
|
|
7120
|
+
* ensures the image is the right aspect ratio in different card sizes.
|
|
7121
|
+
*/
|
|
7122
|
+
var imageMediaStyles = {
|
|
7123
|
+
height: "100%",
|
|
7124
|
+
maxHeight: sdsType === "narrow" ? imageSize : "100%",
|
|
7125
|
+
maxWidth: sdsType === "narrow" ? "100%" : imageSize,
|
|
7126
|
+
minHeight: imageSize,
|
|
7127
|
+
minWidth: sdsType === "narrow" ? "unset" : imageSize,
|
|
7128
|
+
width: "100%",
|
|
7129
|
+
};
|
|
7130
|
+
/**
|
|
7131
|
+
* (masoudmanson): We need to make sure the image is wrapped in a CardMedia component.
|
|
7132
|
+
* - If it's a string, wrap it in CardMedia with proper styles.
|
|
7133
|
+
* - If it's already a CardMedia component, clone it and apply the styles.
|
|
7134
|
+
* - If it's a valid element, clone it and apply the styles.
|
|
7135
|
+
* - If it's null, return null.
|
|
7136
|
+
*/
|
|
7137
|
+
var imageElement = typeof image === "string" ? (jsxRuntime.jsx(material.CardMedia, { component: "img", src: image, alt: "Content Card Media", sx: __assign({}, imageMediaStyles) })) : React__namespace.default.isValidElement(image) && image.type === material.CardMedia ? (React__namespace.default.cloneElement(image, {
|
|
7138
|
+
component: "img",
|
|
7139
|
+
sx: __assign(__assign({}, image.props.sx), imageMediaStyles),
|
|
7140
|
+
})) : React__namespace.default.isValidElement(image) ? (React__namespace.default.cloneElement(image, {
|
|
7141
|
+
style: __assign(__assign({}, imageMediaStyles), { objectFit: "cover", objectPosition: "center" }),
|
|
7142
|
+
})) : null;
|
|
7143
|
+
return (jsxRuntime.jsx(StyledImageMediaWrapper, __assign({ ref: ref }, props, { className: className, children: imageElement })));
|
|
7144
|
+
});
|
|
7145
|
+
|
|
7146
|
+
var CONTENT_CARD_DEFAULT_IMAGE_MEDIA_SIZE = 300;
|
|
7147
|
+
var CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_LOW_BOUNDARY = 595;
|
|
7148
|
+
var CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_HIGH_BOUNDARY = 605;
|
|
7149
|
+
|
|
7150
|
+
var useResponsiveWidth = function (initialSdsType) {
|
|
7151
|
+
var _a = React.useState(false), isNarrow = _a[0], setIsNarrow = _a[1];
|
|
7152
|
+
var handleResize = function (width) {
|
|
7153
|
+
if (width < CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_LOW_BOUNDARY && !isNarrow) {
|
|
7154
|
+
setIsNarrow(true);
|
|
7155
|
+
}
|
|
7156
|
+
else if (width > CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_HIGH_BOUNDARY &&
|
|
7157
|
+
isNarrow) {
|
|
7158
|
+
setIsNarrow(false);
|
|
7159
|
+
}
|
|
7160
|
+
};
|
|
7161
|
+
return {
|
|
7162
|
+
dynamicSdsType: isNarrow ? "narrow" : initialSdsType,
|
|
7163
|
+
handleResize: handleResize,
|
|
7164
|
+
isNarrow: isNarrow,
|
|
7165
|
+
};
|
|
7166
|
+
};
|
|
7167
|
+
/**
|
|
7168
|
+
* (masoudmanson): This function is used to add the clickableCard and
|
|
7169
|
+
* buttonsPosition props to the ContentCardActions sub-component.
|
|
7170
|
+
*/
|
|
7171
|
+
var enhanceChildrenWithCardActionsProps = function (children, clickableCard, buttonsPosition, classes) {
|
|
7172
|
+
return React__namespace.default.Children.map(children, function (child) {
|
|
7173
|
+
if (React__namespace.default.isValidElement(child) && child.type === ContentCardActions) {
|
|
7174
|
+
return React__namespace.default.cloneElement(child, __assign(__assign({}, child.props), { buttonsPosition: buttonsPosition, classes: classes, clickableCard: clickableCard }));
|
|
7175
|
+
}
|
|
7176
|
+
return child;
|
|
7177
|
+
});
|
|
7178
|
+
};
|
|
7179
|
+
/**
|
|
7180
|
+
* @see https://mui.com/material-ui/react-card/
|
|
7181
|
+
*/
|
|
7182
|
+
var ContentCard = React__namespace.default.forwardRef(function (props, ref) {
|
|
7183
|
+
var _a = props.visualElementType, visualElementType = _a === void 0 ? "none" : _a, image = props.image, icon = props.icon, _b = props.imagePadding, imagePadding = _b === void 0 ? false : _b, _c = props.imageSize, imageSize = _c === void 0 ? CONTENT_CARD_DEFAULT_IMAGE_MEDIA_SIZE : _c, overlineText = props.overlineText, titleText = props.titleText, subtitleText = props.subtitleText, metadataText = props.metadataText, _d = props.boundingBox, propsBoundingBox = _d === void 0 ? true : _d, children = props.children, _e = props.sdsType, sdsType = _e === void 0 ? "wide" : _e, _f = props.clickableCard, clickableCard = _f === void 0 ? false : _f, _g = props.imagePosition, imagePosition = _g === void 0 ? "left" : _g, _h = props.buttonsPosition, buttonsPosition = _h === void 0 ? "left" : _h, clickableCardProps = props.clickableCardProps, _j = props.classes, classes = _j === void 0 ? EMPTY_OBJECT : _j;
|
|
7184
|
+
var cardMedia = classes.cardMedia, cardContent = classes.cardContent, cardHeader = classes.cardHeader, cardMetadata = classes.cardMetadata, cardOverline = classes.cardOverline, cardSubtitle = classes.cardSubtitle, cardTitle = classes.cardTitle, cardActions = classes.cardActions, cardPaper = classes.cardPaper, clickableCardButton = classes.clickableCardButton;
|
|
7185
|
+
// Force boundingBox to be true when clickableCard is true
|
|
7186
|
+
var boundingBox = clickableCard ? true : propsBoundingBox;
|
|
7187
|
+
var cardRef = React.useRef(null);
|
|
7188
|
+
var _k = useResponsiveWidth(sdsType), handleResize = _k.handleResize, dynamicSdsType = _k.dynamicSdsType;
|
|
7189
|
+
React.useEffect(function () {
|
|
7190
|
+
var element = cardRef.current;
|
|
7191
|
+
if (!element)
|
|
7192
|
+
return;
|
|
7193
|
+
var resizeObserver = new ResizeObserver(function (entries) {
|
|
7194
|
+
for (var _i = 0, entries_1 = entries; _i < entries_1.length; _i++) {
|
|
7195
|
+
var entry = entries_1[_i];
|
|
7196
|
+
handleResize(entry.contentRect.width);
|
|
7197
|
+
}
|
|
7198
|
+
});
|
|
7199
|
+
resizeObserver.observe(element);
|
|
7200
|
+
return function () {
|
|
7201
|
+
resizeObserver.disconnect();
|
|
7202
|
+
};
|
|
7203
|
+
}, [handleResize]);
|
|
7204
|
+
var visualElement = visualElementType === "image" && image ? (jsxRuntime.jsx(ContentCardImageMedia, { imagePadding: imagePadding, boundingBox: boundingBox, sdsType: dynamicSdsType, imageSize: imageSize, image: image, imagePosition: imagePosition, className: cardMedia })) : visualElementType === "icon" && icon ? (jsxRuntime.jsx(StyledIconMediaWrapper, { boundingBox: boundingBox, className: cardMedia, children: icon })) : null;
|
|
7205
|
+
var cardInnerContent = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [visualElement, jsxRuntime.jsxs(StyledCardContent, { boundingBox: boundingBox, clickableCard: clickableCard, className: cardContent, children: [jsxRuntime.jsx(ContentCardTitle, { overlineText: overlineText, titleText: titleText, subtitleText: subtitleText, metadataText: metadataText, classes: {
|
|
7206
|
+
cardHeader: cardHeader,
|
|
7207
|
+
cardMetadata: cardMetadata,
|
|
7208
|
+
cardOverline: cardOverline,
|
|
7209
|
+
cardSubtitle: cardSubtitle,
|
|
7210
|
+
cardTitle: cardTitle,
|
|
7211
|
+
} }), jsxRuntime.jsx(StyledCardContentAligner, { children: enhanceChildrenWithCardActionsProps(children, clickableCard, buttonsPosition, {
|
|
7212
|
+
cardActions: cardActions,
|
|
7213
|
+
}) })] })] }));
|
|
7214
|
+
return (jsxRuntime.jsx(StyledCard, __assign({ ref: mergeRefs([ref, cardRef]) }, props, { sdsType: dynamicSdsType, boundingBox: boundingBox, className: cardPaper, children: clickableCard ? (jsxRuntime.jsx(StyledCardActionArea, __assign({ sdsStyle: "minimal", cardSdsType: dynamicSdsType, visualElementType: visualElementType, imagePosition: imagePosition, className: clickableCardButton }, clickableCardProps, { children: cardInnerContent }))) : (cardInnerContent) })));
|
|
7215
|
+
});
|
|
7216
|
+
|
|
6860
7217
|
var DialogContext = React.createContext({ sdsSize: "m" });
|
|
6861
7218
|
|
|
6862
7219
|
// (thuang): Please keep this in sync with the props used in `ExtraProps`
|
|
6863
|
-
var doNotForwardProps$
|
|
7220
|
+
var doNotForwardProps$k = ["sdsSize"];
|
|
6864
7221
|
var StyledPaper = styled__default.default(material.Paper, {
|
|
6865
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6866
|
-
})(templateObject_1$
|
|
7222
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
7223
|
+
})(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n & {\n ", "\n\n ", "\n }\n"], ["\n & {\n ", "\n\n ", "\n }\n"])), paperDimensions, function (props) {
|
|
6867
7224
|
var _a;
|
|
6868
7225
|
var spaces = getSpaces(props);
|
|
6869
7226
|
var corners = getCorners(props);
|
|
@@ -6894,7 +7251,7 @@ function paperDimensions(props) {
|
|
|
6894
7251
|
var _a = sizeToDimensions[sdsSize], width = _a.width, minHeight = _a.minHeight;
|
|
6895
7252
|
return "\n width: ".concat(width, ";\n min-height: ").concat(minHeight, ";\n max-width: revert;\n box-sizing: border-box;\n ");
|
|
6896
7253
|
}
|
|
6897
|
-
var templateObject_1$
|
|
7254
|
+
var templateObject_1$E;
|
|
6898
7255
|
|
|
6899
7256
|
/**
|
|
6900
7257
|
* @see https://mui.com/material-ui/react-paper/
|
|
@@ -6923,15 +7280,15 @@ var Dialog = React.forwardRef(function Dialog(props, ref) {
|
|
|
6923
7280
|
});
|
|
6924
7281
|
|
|
6925
7282
|
// (thuang): Please keep this in sync with the props used in `DialogActionsExtraProps`
|
|
6926
|
-
var doNotForwardProps$
|
|
7283
|
+
var doNotForwardProps$j = ["buttonPosition"];
|
|
6927
7284
|
var StyledDialogActions = styled__default.default(material.DialogActions, {
|
|
6928
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6929
|
-
})(templateObject_1$
|
|
7285
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$j.includes(prop); },
|
|
7286
|
+
})(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n padding: 0;\n\n ", "\n"], ["\n padding: 0;\n\n ", "\n"])), function (props) {
|
|
6930
7287
|
var spaces = getSpaces(props);
|
|
6931
7288
|
var _a = props.buttonPosition, buttonPosition = _a === void 0 ? "right" : _a;
|
|
6932
7289
|
return "\n justify-content: ".concat(buttonPosition === "right" ? "flex-end" : "flex-start", ";;\n\n margin-top: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxl, "px;\n\n &.").concat(material.dialogActionsClasses.spacing, " > :not(:first-of-type) {\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n }\n ");
|
|
6933
7290
|
});
|
|
6934
|
-
var templateObject_1$
|
|
7291
|
+
var templateObject_1$D;
|
|
6935
7292
|
|
|
6936
7293
|
/**
|
|
6937
7294
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -6940,8 +7297,8 @@ var DialogActions = React.forwardRef(function DialogActions(props, ref) {
|
|
|
6940
7297
|
return jsxRuntime.jsx(StyledDialogActions, __assign({ ref: ref }, props));
|
|
6941
7298
|
});
|
|
6942
7299
|
|
|
6943
|
-
var StyledDialogContent = styled__default.default(material.DialogContent)(templateObject_1$
|
|
6944
|
-
var templateObject_1$
|
|
7300
|
+
var StyledDialogContent = styled__default.default(material.DialogContent)(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n ", "\n padding: 0;\n"], ["\n ", "\n padding: 0;\n"])), fontBodyS$1);
|
|
7301
|
+
var templateObject_1$C;
|
|
6945
7302
|
|
|
6946
7303
|
var index = React.forwardRef(
|
|
6947
7304
|
/**
|
|
@@ -6951,11 +7308,11 @@ function DialogContent(props, ref) {
|
|
|
6951
7308
|
return jsxRuntime.jsx(StyledDialogContent, __assign({ ref: ref }, props));
|
|
6952
7309
|
});
|
|
6953
7310
|
|
|
6954
|
-
var StyledButton$1 = styled__default.default(Button)(templateObject_1$
|
|
7311
|
+
var StyledButton$1 = styled__default.default(Button)(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n position: absolute;\n\n ", "\n"], ["\n position: absolute;\n\n ", "\n"])), function (props) {
|
|
6955
7312
|
var spaces = getSpaces(props);
|
|
6956
7313
|
return "\n right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxl, "px;\n ");
|
|
6957
7314
|
});
|
|
6958
|
-
var templateObject_1$
|
|
7315
|
+
var templateObject_1$B;
|
|
6959
7316
|
|
|
6960
7317
|
var CloseButton = React.forwardRef(function CloseButton(props, ref) {
|
|
6961
7318
|
var SDS_SIZE_TO_COMPONENT_SIZE = {
|
|
@@ -6971,27 +7328,27 @@ var CloseButton = React.forwardRef(function CloseButton(props, ref) {
|
|
|
6971
7328
|
} }));
|
|
6972
7329
|
});
|
|
6973
7330
|
|
|
6974
|
-
var StyledDialogTitle = styled__default.default(material.DialogTitle)(templateObject_1$
|
|
7331
|
+
var StyledDialogTitle = styled__default.default(material.DialogTitle)(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n padding: 0;\n ", "\n"], ["\n padding: 0;\n ", "\n"])), function (props) {
|
|
6975
7332
|
var spaces = getSpaces(props);
|
|
6976
7333
|
return "\n margin-bottom: ".concat((spaces === null || spaces === void 0 ? void 0 : spaces.xl) || 0, "px;\n ");
|
|
6977
7334
|
});
|
|
6978
|
-
var Title = styled__default.default(material.Typography)(templateObject_2$
|
|
7335
|
+
var Title = styled__default.default(material.Typography)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderXl, function (props) {
|
|
6979
7336
|
var _a;
|
|
6980
7337
|
var semanticColors = getSemanticColors(props);
|
|
6981
7338
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n ");
|
|
6982
7339
|
});
|
|
6983
|
-
var Subtitle = styled__default.default(material.Typography)(templateObject_3$
|
|
7340
|
+
var Subtitle = styled__default.default(material.Typography)(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
6984
7341
|
var _a;
|
|
6985
7342
|
var semanticColors = getSemanticColors(props);
|
|
6986
7343
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
6987
7344
|
});
|
|
6988
|
-
var Overline = styled__default.default(material.Typography)(templateObject_4$
|
|
7345
|
+
var Overline = styled__default.default(material.Typography)(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6989
7346
|
var _a;
|
|
6990
7347
|
var semanticColors = getSemanticColors(props);
|
|
6991
7348
|
var spaces = getSpaces(props);
|
|
6992
7349
|
return "\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 ");
|
|
6993
7350
|
});
|
|
6994
|
-
var templateObject_1$
|
|
7351
|
+
var templateObject_1$A, templateObject_2$o, templateObject_3$g, templateObject_4$d;
|
|
6995
7352
|
|
|
6996
7353
|
/**
|
|
6997
7354
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -7001,20 +7358,20 @@ var DialogTitle = React.forwardRef(function DialogTitle(props, ref) {
|
|
|
7001
7358
|
return (jsxRuntime.jsx(StyledDialogTitle, __assign({ ref: ref }, rest, { children: children || (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [onClose && (jsxRuntime.jsx(CloseButton, { sdsStyle: "icon", icon: "XMark", onClick: onClose })), jsxRuntime.jsx(Overline, { children: overline }), jsxRuntime.jsx(Title, { children: title }), jsxRuntime.jsx(Subtitle, { children: subtitle })] })) })));
|
|
7002
7359
|
});
|
|
7003
7360
|
|
|
7004
|
-
var doNotForwardProps$
|
|
7361
|
+
var doNotForwardProps$i = ["buttonPosition"];
|
|
7005
7362
|
var StyledButtonsWrapper = styled__default.default("div", {
|
|
7006
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7007
|
-
})(templateObject_1$
|
|
7363
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
7364
|
+
})(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7008
7365
|
var buttonPosition = props.buttonPosition;
|
|
7009
7366
|
return "\n display: flex;\n justify-content: ".concat(buttonPosition === "left" ? "start" : "end", ";\n ");
|
|
7010
7367
|
});
|
|
7011
7368
|
var StyledButton = styled__default.default(Button, {
|
|
7012
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7013
|
-
})(templateObject_2$
|
|
7369
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
7370
|
+
})(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7014
7371
|
var spaces = getSpaces(props);
|
|
7015
7372
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n ");
|
|
7016
7373
|
});
|
|
7017
|
-
var templateObject_1$
|
|
7374
|
+
var templateObject_1$z, templateObject_2$n;
|
|
7018
7375
|
|
|
7019
7376
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
7020
7377
|
var Dropdown = function (props) {
|
|
@@ -7150,11 +7507,11 @@ var intentToColor$1 = {
|
|
|
7150
7507
|
notice: "notice",
|
|
7151
7508
|
positive: "positive",
|
|
7152
7509
|
};
|
|
7153
|
-
var StyledIcon = styled__default.default(Icon)(templateObject_1$
|
|
7510
|
+
var StyledIcon = styled__default.default(Icon)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7154
7511
|
var iconSizes = getIconSizes(props);
|
|
7155
7512
|
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 ");
|
|
7156
7513
|
});
|
|
7157
|
-
var StyledCheckboxDefaultIcon = styled__default.default("span")(templateObject_2$
|
|
7514
|
+
var StyledCheckboxDefaultIcon = styled__default.default("span")(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7158
7515
|
var _a;
|
|
7159
7516
|
var _b = props.intent, intent = _b === void 0 ? "default" : _b;
|
|
7160
7517
|
var iconSizes = getIconSizes(props);
|
|
@@ -7162,22 +7519,22 @@ var StyledCheckboxDefaultIcon = styled__default.default("span")(templateObject_2
|
|
|
7162
7519
|
var borderColor = intentToColor$1[intent];
|
|
7163
7520
|
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 ");
|
|
7164
7521
|
});
|
|
7165
|
-
var StyledCheckboxCheckedIcon = styled__default.default("div")(templateObject_3$
|
|
7522
|
+
var StyledCheckboxCheckedIcon = styled__default.default("div")(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7166
7523
|
var _a, _b;
|
|
7167
7524
|
var iconSizes = getIconSizes(props);
|
|
7168
7525
|
var semanticColors = getSemanticColors(props);
|
|
7169
7526
|
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.fillPrimary, ";\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\n &:hover {\n background-color: red;\n }\n ");
|
|
7170
7527
|
});
|
|
7171
|
-
var StyledCheckbox = styled__default.default(material.Checkbox)(templateObject_4$
|
|
7528
|
+
var StyledCheckbox = styled__default.default(material.Checkbox)(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7172
7529
|
var spaces = getSpaces(props);
|
|
7173
7530
|
return "\n &.".concat(material.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 ");
|
|
7174
7531
|
});
|
|
7175
|
-
var StyledLabelContainer$1 = styled__default.default("span")(templateObject_5$
|
|
7176
|
-
var StyledCheckboxLabel = styled__default.default("span")(templateObject_6$
|
|
7532
|
+
var StyledLabelContainer$1 = styled__default.default("span")(templateObject_5$9 || (templateObject_5$9 = __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"])));
|
|
7533
|
+
var StyledCheckboxLabel = styled__default.default("span")(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7177
7534
|
var spaces = getSpaces(props);
|
|
7178
7535
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
7179
7536
|
});
|
|
7180
|
-
var StyledCheckboxCaption = styled__default.default("span")(templateObject_7$
|
|
7537
|
+
var StyledCheckboxCaption = styled__default.default("span")(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7181
7538
|
var _a;
|
|
7182
7539
|
var semanticColors = getSemanticColors(props);
|
|
7183
7540
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
@@ -7188,7 +7545,7 @@ var disabledStyles$1 = function (props) {
|
|
|
7188
7545
|
var borders = getBorders(props);
|
|
7189
7546
|
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 ");
|
|
7190
7547
|
};
|
|
7191
|
-
var StyledFormControlLabel$1 = styled__default.default(material.FormControlLabel)(templateObject_8$
|
|
7548
|
+
var StyledFormControlLabel$1 = styled__default.default(material.FormControlLabel)(templateObject_8$3 || (templateObject_8$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7192
7549
|
var _a, _b, _c, _d;
|
|
7193
7550
|
var disabled = props.disabled;
|
|
7194
7551
|
var spaces = getSpaces(props);
|
|
@@ -7196,7 +7553,7 @@ var StyledFormControlLabel$1 = styled__default.default(material.FormControlLabel
|
|
|
7196
7553
|
var borders = getBorders(props);
|
|
7197
7554
|
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 }\n\n ").concat(StyledCheckboxCheckedIcon, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n }\n }\n\n &:active {\n ").concat(StyledCheckboxDefaultIcon, " {\n border: ").concat((_c = borders === null || borders === void 0 ? void 0 : borders.base) === null || _c === void 0 ? void 0 : _c.pressed, ";\n }\n\n ").concat(StyledCheckboxCheckedIcon, " {\n background-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.fillPressed, ";\n }\n }\n\n ").concat(disabled && disabledStyles$1(props), "\n ");
|
|
7198
7555
|
});
|
|
7199
|
-
var templateObject_1$
|
|
7556
|
+
var templateObject_1$y, templateObject_2$m, templateObject_3$f, templateObject_4$c, templateObject_5$9, templateObject_6$8, templateObject_7$4, templateObject_8$3;
|
|
7200
7557
|
|
|
7201
7558
|
/**
|
|
7202
7559
|
* @see https://mui.com/material-ui/react-checkbox/
|
|
@@ -7231,12 +7588,12 @@ var intentToColor = {
|
|
|
7231
7588
|
notice: "notice",
|
|
7232
7589
|
positive: "positive",
|
|
7233
7590
|
};
|
|
7234
|
-
var StyledRadioDot = styled__default.default("span")(templateObject_1$
|
|
7591
|
+
var StyledRadioDot = styled__default.default("span")(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7235
7592
|
var _a;
|
|
7236
7593
|
var semanticColors = getSemanticColors(props);
|
|
7237
7594
|
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 ");
|
|
7238
7595
|
});
|
|
7239
|
-
var StyledRadioDefaultIcon = styled__default.default("span")(templateObject_2$
|
|
7596
|
+
var StyledRadioDefaultIcon = styled__default.default("span")(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7240
7597
|
var _a;
|
|
7241
7598
|
var _b = props.intent, intent = _b === void 0 ? "default" : _b;
|
|
7242
7599
|
var iconSizes = getIconSizes(props);
|
|
@@ -7244,22 +7601,22 @@ var StyledRadioDefaultIcon = styled__default.default("span")(templateObject_2$i
|
|
|
7244
7601
|
var borderColor = intentToColor[intent];
|
|
7245
7602
|
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 ");
|
|
7246
7603
|
});
|
|
7247
|
-
var StyledRadioCheckedIcon = styled__default.default("div")(templateObject_3$
|
|
7604
|
+
var StyledRadioCheckedIcon = styled__default.default("div")(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7248
7605
|
var _a;
|
|
7249
7606
|
var iconSizes = getIconSizes(props);
|
|
7250
7607
|
var semanticColors = getSemanticColors(props);
|
|
7251
7608
|
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 ");
|
|
7252
7609
|
});
|
|
7253
|
-
var StyledRadioButton = styled__default.default(material.Radio)(templateObject_4$
|
|
7610
|
+
var StyledRadioButton = styled__default.default(material.Radio)(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7254
7611
|
var spaces = getSpaces(props);
|
|
7255
7612
|
return "\n &.".concat(material.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 ");
|
|
7256
7613
|
});
|
|
7257
|
-
var StyledLabelContainer = styled__default.default("span")(templateObject_5$
|
|
7258
|
-
var StyledRadioLabel = styled__default.default("span")(templateObject_6$
|
|
7614
|
+
var StyledLabelContainer = styled__default.default("span")(templateObject_5$8 || (templateObject_5$8 = __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"])));
|
|
7615
|
+
var StyledRadioLabel = styled__default.default("span")(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7259
7616
|
var spaces = getSpaces(props);
|
|
7260
7617
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
7261
7618
|
});
|
|
7262
|
-
var StyledRadioCaption = styled__default.default("span")(templateObject_7$
|
|
7619
|
+
var StyledRadioCaption = styled__default.default("span")(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7263
7620
|
var _a;
|
|
7264
7621
|
var semanticColors = getSemanticColors(props);
|
|
7265
7622
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
@@ -7267,16 +7624,16 @@ var StyledRadioCaption = styled__default.default("span")(templateObject_7$2 || (
|
|
|
7267
7624
|
var disabledStyles = function (props) {
|
|
7268
7625
|
var _a, _b, _c, _d, _e;
|
|
7269
7626
|
var semanticColors = getSemanticColors(props);
|
|
7270
|
-
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.
|
|
7627
|
+
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 ");
|
|
7271
7628
|
};
|
|
7272
|
-
var StyledFormControlLabel = styled__default.default(material.FormControlLabel)(templateObject_8$
|
|
7629
|
+
var StyledFormControlLabel = styled__default.default(material.FormControlLabel)(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7273
7630
|
var _a, _b, _c, _d;
|
|
7274
7631
|
var disabled = props.disabled;
|
|
7275
7632
|
var spaces = getSpaces(props);
|
|
7276
7633
|
var semanticColors = getSemanticColors(props);
|
|
7277
|
-
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.
|
|
7634
|
+
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 }\n\n ").concat(StyledRadioCheckedIcon, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n }\n }\n\n &:active {\n ").concat(StyledRadioDefaultIcon, " {\n border: 1px solid ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderPrimaryPressed, ";\n }\n\n ").concat(StyledRadioCheckedIcon, " {\n background-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.fillPressed, ";\n }\n }\n\n ").concat(disabled && disabledStyles(props), "\n ");
|
|
7278
7635
|
});
|
|
7279
|
-
var templateObject_1$
|
|
7636
|
+
var templateObject_1$x, templateObject_2$l, templateObject_3$e, templateObject_4$b, templateObject_5$8, templateObject_6$7, templateObject_7$3, templateObject_8$2;
|
|
7280
7637
|
|
|
7281
7638
|
/**
|
|
7282
7639
|
* @see https://mui.com/material-ui/react-radio-button/
|
|
@@ -7322,11 +7679,11 @@ var disabledSlider = function (props) {
|
|
|
7322
7679
|
var semanticColors = getSemanticColors(props);
|
|
7323
7680
|
return "\n .".concat(material.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(material.sliderClasses.thumb, ".").concat(material.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(material.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(material.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(material.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 ");
|
|
7324
7681
|
};
|
|
7325
|
-
var StyledSlider = styled__default.default(material.Slider)(templateObject_1$
|
|
7682
|
+
var StyledSlider = styled__default.default(material.Slider)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7326
7683
|
var disabled = props.disabled;
|
|
7327
7684
|
return "\n ".concat(inputSlider(props), "\n ").concat(horizontal(props), "\n ").concat(disabled ? disabledSlider(props) : "", "\n ");
|
|
7328
7685
|
});
|
|
7329
|
-
var templateObject_1$
|
|
7686
|
+
var templateObject_1$w;
|
|
7330
7687
|
|
|
7331
7688
|
/**
|
|
7332
7689
|
* @see https://mui.com/material-ui/react-slider/
|
|
@@ -7341,19 +7698,19 @@ var applyIntentColor = function (props, intent) {
|
|
|
7341
7698
|
var _a, _b, _c, _d;
|
|
7342
7699
|
var borders = getBorders(props);
|
|
7343
7700
|
var semanticColors = getSemanticColors(props);
|
|
7344
|
-
return react.css(templateObject_1$
|
|
7701
|
+
return react.css(templateObject_1$v || (templateObject_1$v = __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 "])), material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _a === void 0 ? void 0 : _a.default, material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, material.outlinedInputClasses.root, material.outlinedInputClasses.focused, material.outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _c === void 0 ? void 0 : _c.default, material.inputAdornmentClasses.root, material.buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _d === void 0 ? void 0 : _d.ornament);
|
|
7345
7702
|
};
|
|
7346
7703
|
var disabledStyled$1 = function (props) {
|
|
7347
7704
|
var _a, _b, _c;
|
|
7348
7705
|
var borders = getBorders(props);
|
|
7349
7706
|
var semanticColors = getSemanticColors(props);
|
|
7350
|
-
return react.css(templateObject_2$
|
|
7707
|
+
return react.css(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n .", " {\n .", " {\n border: ", ";\n opacity: 1;\n }\n\n &:hover .", " {\n border: ", ";\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 opacity: 1;\n }\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n "])), material.outlinedInputClasses.disabled, material.outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.disabled, material.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);
|
|
7351
7708
|
};
|
|
7352
7709
|
var textArea = function (props) {
|
|
7353
7710
|
var spaces = getSpaces(props);
|
|
7354
|
-
return react.css(templateObject_3$
|
|
7711
|
+
return react.css(templateObject_3$d || (templateObject_3$d = __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 "])), material.outlinedInputClasses.multiline, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, material.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);
|
|
7355
7712
|
};
|
|
7356
|
-
var StyledLabel$1 = styled__default.default("label")(templateObject_4$
|
|
7713
|
+
var StyledLabel$1 = styled__default.default("label")(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n display: block;\n ", "\n\n ", "\n"], ["\n display: block;\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
7357
7714
|
var spaces = getSpaces(props);
|
|
7358
7715
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
7359
7716
|
});
|
|
@@ -7361,15 +7718,15 @@ var StyledInputBase = styled__default.default(material.TextField, {
|
|
|
7361
7718
|
shouldForwardProp: function (prop) {
|
|
7362
7719
|
return !sdsPropNames$1.includes(prop.toString());
|
|
7363
7720
|
},
|
|
7364
|
-
})(templateObject_6$
|
|
7721
|
+
})(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7365
7722
|
var _a, _b, _c;
|
|
7366
7723
|
var intent = props.intent, sdsType = props.sdsType, disabled = props.disabled;
|
|
7367
7724
|
var spaces = getSpaces(props);
|
|
7368
7725
|
var borders = getBorders(props);
|
|
7369
7726
|
var corners = getCorners(props);
|
|
7370
|
-
return react.css(templateObject_5$
|
|
7727
|
+
return react.css(templateObject_5$7 || (templateObject_5$7 = __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\n &.user-is-tabbing .", " {\n ", "\n }\n\n .", ":hover\n .", " {\n border: ", ";\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\n &.user-is-tabbing .", " {\n ", "\n }\n\n .", ":hover\n .", " {\n border: ", ";\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, material.outlinedInputClasses.root, material.outlinedInputClasses.inputSizeSmall, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.m, material.outlinedInputClasses.notchedOutline, corners === null || corners === void 0 ? void 0 : corners.m, (_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.default, material.outlinedInputClasses.input, material.outlinedInputClasses.input, focusVisibleA11yStyle(props), material.outlinedInputClasses.root, material.outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, material.outlinedInputClasses.root, material.outlinedInputClasses.focused, material.outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders.accent) === null || _c === void 0 ? void 0 : _c.default, sdsType === "textArea" && textArea(props), intent === "negative" && applyIntentColor(props, "negative"), intent === "notice" && applyIntentColor(props, "notice"), intent === "positive" && applyIntentColor(props, "positive"), disabled && disabledStyled$1(props));
|
|
7371
7728
|
});
|
|
7372
|
-
var templateObject_1$
|
|
7729
|
+
var templateObject_1$v, templateObject_2$k, templateObject_3$d, templateObject_4$a, templateObject_5$7, templateObject_6$6;
|
|
7373
7730
|
|
|
7374
7731
|
/**
|
|
7375
7732
|
* @see https://mui.com/material-ui/react-text-field/
|
|
@@ -7430,11 +7787,11 @@ var toggleOff = function (props) {
|
|
|
7430
7787
|
: (_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(material.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(value, "\";\n }\n }\n\n &:hover {\n .").concat(material.switchClasses.switchBase, " {\n &:after {\n color: ").concat(disabled ? (_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.textPrimary, ";\n }\n }\n }\n\n .").concat(material.switchClasses.track, " {\n background-color: transparent !important;\n opacity: 1 !important;\n }\n\n ").concat(!disabled &&
|
|
7431
7788
|
"&:hover {\n outline: ".concat((_j = borders === null || borders === void 0 ? void 0 : borders.base) === null || _j === void 0 ? void 0 : _j.hover, ";\n\n .").concat(material.switchClasses.thumb, " {\n color: ").concat((_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.ornamentSecondaryHover, ";\n }\n }"), "\n ");
|
|
7432
7789
|
};
|
|
7433
|
-
var Toggle = styled__default.default(material.Switch)(templateObject_1$
|
|
7790
|
+
var Toggle = styled__default.default(material.Switch)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7434
7791
|
var checked = props.checked;
|
|
7435
7792
|
return "\n ".concat(toggle(props), "\n ").concat(checked ? toggleOn(props) : toggleOff(props), "\n ");
|
|
7436
7793
|
});
|
|
7437
|
-
var templateObject_1$
|
|
7794
|
+
var templateObject_1$u;
|
|
7438
7795
|
|
|
7439
7796
|
/**
|
|
7440
7797
|
* @see https://mui.com/material-ui/react-switch/
|
|
@@ -7452,14 +7809,14 @@ var InputToggle = function (props) {
|
|
|
7452
7809
|
return (jsxRuntime.jsx(Toggle, __assign({ checked: finalChecked, color: "primary", onChange: handleChange, value: labelValue }, rest)));
|
|
7453
7810
|
};
|
|
7454
7811
|
|
|
7455
|
-
var doNotForwardProps$
|
|
7812
|
+
var doNotForwardProps$h = ["sdsStyle", "sdsSize", "fontWeight"];
|
|
7456
7813
|
var defaultStyle = function (props) {
|
|
7457
7814
|
var _a, _b, _c, _d;
|
|
7458
7815
|
var semanticColors = getSemanticColors(props);
|
|
7459
|
-
return react.css(templateObject_1$
|
|
7816
|
+
return react.css(templateObject_1$t || (templateObject_1$t = __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);
|
|
7460
7817
|
};
|
|
7461
7818
|
var dashedStyle = function () {
|
|
7462
|
-
return react.css(templateObject_2$
|
|
7819
|
+
return react.css(templateObject_2$j || (templateObject_2$j = __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 "])));
|
|
7463
7820
|
};
|
|
7464
7821
|
var smallStyle = function (props) {
|
|
7465
7822
|
return fontBodyS$1(props);
|
|
@@ -7469,13 +7826,13 @@ var extraSmallStyle = function (props) {
|
|
|
7469
7826
|
};
|
|
7470
7827
|
var StyledLink = styled__default.default(material.Link, {
|
|
7471
7828
|
shouldForwardProp: function (prop) {
|
|
7472
|
-
return !doNotForwardProps$
|
|
7829
|
+
return !doNotForwardProps$h.includes(prop.toString());
|
|
7473
7830
|
},
|
|
7474
|
-
})(templateObject_4$
|
|
7831
|
+
})(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n all: unset;\n\n ", "\n\n ", "\n"], ["\n all: unset;\n\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
7475
7832
|
var _a = props.fontWeight, fontWeight = _a === void 0 ? "normal" : _a, sdsStyle = props.sdsStyle, _b = props.sdsSize, sdsSize = _b === void 0 ? "s" : _b;
|
|
7476
|
-
return react.css(templateObject_3$
|
|
7833
|
+
return react.css(templateObject_3$c || (templateObject_3$c = __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");
|
|
7477
7834
|
});
|
|
7478
|
-
var templateObject_1$
|
|
7835
|
+
var templateObject_1$t, templateObject_2$j, templateObject_3$c, templateObject_4$9;
|
|
7479
7836
|
|
|
7480
7837
|
/**
|
|
7481
7838
|
* @see https://mui.com/material-ui/react-link/
|
|
@@ -7490,10 +7847,10 @@ var Link = React.forwardRef(function (props, ref) {
|
|
|
7490
7847
|
});
|
|
7491
7848
|
|
|
7492
7849
|
// (thuang): Please keep this in sync with the props used in `ListExtraProps`
|
|
7493
|
-
var doNotForwardProps$
|
|
7850
|
+
var doNotForwardProps$g = ["marginBottom", "ordered"];
|
|
7494
7851
|
var StyledList = styled__default.default(material.List, {
|
|
7495
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7496
|
-
})(templateObject_1$
|
|
7852
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
7853
|
+
})(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n .MuiListSubheader-root {\n ", "\n }\n\n ", "\n"], ["\n .MuiListSubheader-root {\n ", "\n }\n\n ", "\n"])), propsToMarginBottom$1, function (props) {
|
|
7497
7854
|
if (!props.ordered)
|
|
7498
7855
|
return "";
|
|
7499
7856
|
return "\n counter-reset: section;\n ";
|
|
@@ -7511,7 +7868,7 @@ function propsToMarginBottom$1(props) {
|
|
|
7511
7868
|
var marginBottom = props.marginBottom;
|
|
7512
7869
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "s"], "px;\n ");
|
|
7513
7870
|
}
|
|
7514
|
-
var templateObject_1$
|
|
7871
|
+
var templateObject_1$s;
|
|
7515
7872
|
|
|
7516
7873
|
/**
|
|
7517
7874
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7528,10 +7885,10 @@ var fontBodyXs$1 = fontBody("xs");
|
|
|
7528
7885
|
var fontBodyXxs = fontBody("xxs");
|
|
7529
7886
|
var fontBodyXxxs = fontBody("xxxs");
|
|
7530
7887
|
// (thuang): Please keep this in sync with the props used in `ListItemExtraProps`
|
|
7531
|
-
var doNotForwardProps$
|
|
7888
|
+
var doNotForwardProps$f = ["marginBottom", "fontSize", "ordered"];
|
|
7532
7889
|
var StyledListItem = styled__default.default(material.ListItem, {
|
|
7533
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7534
|
-
})(templateObject_1$
|
|
7890
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
7891
|
+
})(templateObject_1$r || (templateObject_1$r = __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) {
|
|
7535
7892
|
var ordered = props.ordered;
|
|
7536
7893
|
return "\n align-items: flex-start;\n ".concat(ordered ? "counter-increment: section;" : "", "\n ");
|
|
7537
7894
|
}, function (props) {
|
|
@@ -7562,11 +7919,11 @@ function propsToMarginBottom(props) {
|
|
|
7562
7919
|
var marginBottom = props.marginBottom;
|
|
7563
7920
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "xs"], "px;\n ");
|
|
7564
7921
|
}
|
|
7565
|
-
var ListItemLabel = styled__default.default("span")(templateObject_2$
|
|
7922
|
+
var ListItemLabel = styled__default.default("span")(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n margin-right: 5px;\n\n ", "\n"], ["\n margin-right: 5px;\n\n ", "\n"])), function (props) {
|
|
7566
7923
|
var fontWeights = getFontWeights(props);
|
|
7567
7924
|
return "\n font-weight: ".concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n ");
|
|
7568
7925
|
});
|
|
7569
|
-
var templateObject_1$
|
|
7926
|
+
var templateObject_1$r, templateObject_2$i;
|
|
7570
7927
|
|
|
7571
7928
|
/**
|
|
7572
7929
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7576,11 +7933,11 @@ var ListItem = function (props) {
|
|
|
7576
7933
|
};
|
|
7577
7934
|
|
|
7578
7935
|
var fontHeaderM = fontHeader("m");
|
|
7579
|
-
var StyledListSubheader = styled__default.default(material.ListSubheader)(templateObject_1$
|
|
7936
|
+
var StyledListSubheader = styled__default.default(material.ListSubheader)(templateObject_1$q || (templateObject_1$q = __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) {
|
|
7580
7937
|
var spaces = getSpaces(props);
|
|
7581
7938
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n ");
|
|
7582
7939
|
});
|
|
7583
|
-
var templateObject_1$
|
|
7940
|
+
var templateObject_1$q;
|
|
7584
7941
|
|
|
7585
7942
|
/**
|
|
7586
7943
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7589,7 +7946,7 @@ var ListSubheader = function (props) {
|
|
|
7589
7946
|
return jsxRuntime.jsx(StyledListSubheader, __assign({ disableGutters: true }, props));
|
|
7590
7947
|
};
|
|
7591
7948
|
|
|
7592
|
-
var StyledText = styled__default.default("span")(templateObject_1$
|
|
7949
|
+
var StyledText = styled__default.default("span")(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7593
7950
|
var spaces = getSpaces(props);
|
|
7594
7951
|
return "\n margin: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
7595
7952
|
});
|
|
@@ -7597,37 +7954,37 @@ var minimal = function (props) {
|
|
|
7597
7954
|
var _a, _b;
|
|
7598
7955
|
var iconSizes = getIconSizes(props);
|
|
7599
7956
|
var semanticColors = getSemanticColors(props);
|
|
7600
|
-
return react.css(templateObject_2$
|
|
7957
|
+
return react.css(templateObject_2$h || (templateObject_2$h = __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);
|
|
7601
7958
|
};
|
|
7602
7959
|
var tag = function (props) {
|
|
7603
7960
|
var _a, _b, _c;
|
|
7604
7961
|
var corners = getCorners(props);
|
|
7605
7962
|
var semanticColors = getSemanticColors(props);
|
|
7606
|
-
return react.css(templateObject_3$
|
|
7963
|
+
return react.css(templateObject_3$b || (templateObject_3$b = __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.info) === null || _a === void 0 ? void 0 : _a.surfaceSecondary, corners === null || corners === void 0 ? void 0 : corners.l, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.info) === null || _b === void 0 ? void 0 : _b.text, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.info) === null || _c === void 0 ? void 0 : _c.ornament);
|
|
7607
7964
|
};
|
|
7608
|
-
var doNotForwardProps$
|
|
7965
|
+
var doNotForwardProps$e = ["sdsStyle"];
|
|
7609
7966
|
var StyledLoadingIndicator = styled__default.default("div", {
|
|
7610
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7611
|
-
})(templateObject_6$
|
|
7967
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$e.includes(prop); },
|
|
7968
|
+
})(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7612
7969
|
var sdsStyle = props.sdsStyle;
|
|
7613
7970
|
var spaces = getSpaces(props);
|
|
7614
|
-
var style = react.css(templateObject_4$
|
|
7615
|
-
return react.css(templateObject_5$
|
|
7971
|
+
var style = react.css(templateObject_4$8 || (templateObject_4$8 = __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);
|
|
7972
|
+
return react.css(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n "])), style, sdsStyle === "minimal" && minimal(props), sdsStyle === "tag" && tag(props));
|
|
7616
7973
|
});
|
|
7617
|
-
var templateObject_1$
|
|
7974
|
+
var templateObject_1$p, templateObject_2$h, templateObject_3$b, templateObject_4$8, templateObject_5$6, templateObject_6$5;
|
|
7618
7975
|
|
|
7619
7976
|
var LoadingIndicator = function (_a) {
|
|
7620
7977
|
var ariaLabel = _a["aria-label"], sdsStyle = _a.sdsStyle;
|
|
7621
7978
|
return (jsxRuntime.jsxs(StyledLoadingIndicator, { sdsStyle: sdsStyle, "aria-label": "Loading", children: [jsxRuntime.jsx(Icon, { sdsIcon: "Loading", sdsSize: "l" }), jsxRuntime.jsx(StyledText, { "aria-label": ariaLabel, "aria-live": "polite", role: "status", children: "Loading" })] }));
|
|
7622
7979
|
};
|
|
7623
7980
|
|
|
7624
|
-
var StyledMenu = styled__default.default(material.Menu)(templateObject_1$
|
|
7981
|
+
var StyledMenu = styled__default.default(material.Menu)(templateObject_1$o || (templateObject_1$o = __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"])), material.menuClasses.paper, function (props) {
|
|
7625
7982
|
var _a;
|
|
7626
7983
|
var spaces = getSpaces(props);
|
|
7627
7984
|
var semanticColors = getSemanticColors(props);
|
|
7628
7985
|
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 ");
|
|
7629
7986
|
});
|
|
7630
|
-
var templateObject_1$
|
|
7987
|
+
var templateObject_1$o;
|
|
7631
7988
|
|
|
7632
7989
|
var ANCHOR_ORIGIN = {
|
|
7633
7990
|
horizontal: "center",
|
|
@@ -7644,19 +8001,19 @@ var Menu = function (props) {
|
|
|
7644
8001
|
return (jsxRuntime.jsx(StyledMenu, __assign({ anchorOrigin: ANCHOR_ORIGIN, transformOrigin: TRANSFORM_ORIGIN }, props)));
|
|
7645
8002
|
};
|
|
7646
8003
|
|
|
7647
|
-
var StyledMenuItem = styled__default.default(MenuItem)(templateObject_1$
|
|
7648
|
-
var doNotForwardProps$
|
|
8004
|
+
var StyledMenuItem = styled__default.default(MenuItem)(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
8005
|
+
var doNotForwardProps$d = ["search", "InputBaseProps", "keepSearchOnSelect"];
|
|
7649
8006
|
// (thuang): Casting the type to `Autocomplete`
|
|
7650
8007
|
// per https://github.com/mui-org/material-ui/issues/21727#issuecomment-880263271
|
|
7651
8008
|
var StyledAutocomplete = styled__default.default(material.Autocomplete, {
|
|
7652
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7653
|
-
})(templateObject_2$
|
|
8009
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8010
|
+
})(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n ", "\n width: 100%;\n"], ["\n ", "\n width: 100%;\n"])), function (_a) {
|
|
7654
8011
|
var search = _a.search;
|
|
7655
8012
|
return !search && "height: 0; margin: 0 !important;";
|
|
7656
8013
|
});
|
|
7657
8014
|
var InputBaseWrapper = styled__default.default("div", {
|
|
7658
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7659
|
-
})(templateObject_3$
|
|
8015
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8016
|
+
})(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7660
8017
|
var search = props.search;
|
|
7661
8018
|
if (!search) {
|
|
7662
8019
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -7668,12 +8025,12 @@ var InputBaseWrapper = styled__default.default("div", {
|
|
|
7668
8025
|
return "\n margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
7669
8026
|
});
|
|
7670
8027
|
var StyledMenuInputSearch = styled__default.default(InputSearch, {
|
|
7671
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7672
|
-
})(templateObject_4$
|
|
8028
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8029
|
+
})(templateObject_4$7 || (templateObject_4$7 = __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"])), material.inputBaseClasses.root, function (_a) {
|
|
7673
8030
|
var search = _a.search;
|
|
7674
8031
|
return (search ? "auto" : "transparent");
|
|
7675
8032
|
});
|
|
7676
|
-
var templateObject_1$
|
|
8033
|
+
var templateObject_1$n, templateObject_2$g, templateObject_3$a, templateObject_4$7;
|
|
7677
8034
|
|
|
7678
8035
|
/**
|
|
7679
8036
|
* @see https://mui.com/material-ui/react-autocomplete/
|
|
@@ -7724,6 +8081,80 @@ var MenuSelect = function (props) {
|
|
|
7724
8081
|
}
|
|
7725
8082
|
};
|
|
7726
8083
|
|
|
8084
|
+
var doNotForwardProps$c = ["hasInvertedStyle", "isNarrow"];
|
|
8085
|
+
var StyledFooter = styled__default.default("footer", {
|
|
8086
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8087
|
+
})(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8088
|
+
var isNarrow = props.isNarrow;
|
|
8089
|
+
var spaces = getSpaces(props);
|
|
8090
|
+
var semanticColors = getSemanticColors(props);
|
|
8091
|
+
return material.css(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n background: ", ";\n padding: ", "px ", "px ", "px\n ", "px;\n\n ", "\n "], ["\n background: ", ";\n padding: ", "px ", "px ", "px\n ", "px;\n\n ", "\n "])), props.hasInvertedStyle
|
|
8092
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimaryInverse
|
|
8093
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, spaces === null || spaces === void 0 ? void 0 : spaces.xl, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, isNarrow && material.css(templateObject_1$m || (templateObject_1$m = __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
|
|
8094
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
8095
|
+
: 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));
|
|
8096
|
+
});
|
|
8097
|
+
var StyledLogoWrapper$1 = styled__default.default("div", {
|
|
8098
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8099
|
+
})(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n ", "\n\n p {\n ", "\n ", "\n\n ", "\n }\n"], ["\n ", "\n\n p {\n ", "\n ", "\n\n ", "\n }\n"])), function (props) {
|
|
8100
|
+
var spaces = getSpaces(props);
|
|
8101
|
+
return material.css(templateObject_4$6 || (templateObject_4$6 = __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);
|
|
8102
|
+
}, fontHeader("l"), fontHeader("l", /* isNarrow */ true), function (props) {
|
|
8103
|
+
var semanticColors = getSemanticColors(props);
|
|
8104
|
+
return material.css(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n color: ", ";\n white-space: nowrap;\n "], ["\n color: ", ";\n white-space: nowrap;\n "])), props.hasInvertedStyle
|
|
8105
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
8106
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary);
|
|
8107
|
+
});
|
|
8108
|
+
var StyledNavSection = styled__default.default("div", {
|
|
8109
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8110
|
+
})(templateObject_9$1 || (templateObject_9$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8111
|
+
var isNarrow = props.isNarrow;
|
|
8112
|
+
var spaces = getSpaces(props);
|
|
8113
|
+
return material.css(templateObject_8$1 || (templateObject_8$1 = __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.xxl, isNarrow && material.css(templateObject_7$2 || (templateObject_7$2 = __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.xl));
|
|
8114
|
+
});
|
|
8115
|
+
var StyledTopSection = styled__default.default("div", {
|
|
8116
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8117
|
+
})(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8118
|
+
var isNarrow = props.isNarrow;
|
|
8119
|
+
var semanticColors = getSemanticColors(props);
|
|
8120
|
+
var spaces = getSpaces(props);
|
|
8121
|
+
return material.css(templateObject_11$1 || (templateObject_11$1 = __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.xl, props.hasInvertedStyle
|
|
8122
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryInverse
|
|
8123
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, props.hasInvertedStyle
|
|
8124
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
8125
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, isNarrow && material.css(templateObject_10$1 || (templateObject_10$1 = __makeTemplateObject(["\n flex-direction: column;\n margin-bottom: ", "px;\n "], ["\n flex-direction: column;\n margin-bottom: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8126
|
+
});
|
|
8127
|
+
var StyledLinkSection = styled__default.default("div", {
|
|
8128
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8129
|
+
})(templateObject_15$1 || (templateObject_15$1 = __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) {
|
|
8130
|
+
var isNarrow = props.isNarrow;
|
|
8131
|
+
var spaces = getSpaces(props);
|
|
8132
|
+
return material.css(templateObject_14$1 || (templateObject_14$1 = __makeTemplateObject(["\n gap: ", "px;\n\n ", "\n "], ["\n gap: ", "px;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s, isNarrow && material.css(templateObject_13$1 || (templateObject_13$1 = __makeTemplateObject(["\n margin-top: ", "px;\n flex-direction: column;\n "], ["\n margin-top: ", "px;\n flex-direction: column;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8133
|
+
});
|
|
8134
|
+
var StyledMobileLinkRow = styled__default.default.div(templateObject_16$1 || (templateObject_16$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n\n ", "\n"])), function (props) {
|
|
8135
|
+
var spaces = getSpaces(props);
|
|
8136
|
+
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
8137
|
+
});
|
|
8138
|
+
var StyledImageSection = styled__default.default("div", {
|
|
8139
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8140
|
+
})(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) {
|
|
8141
|
+
var isNarrow = props.isNarrow;
|
|
8142
|
+
var spaces = getSpaces(props);
|
|
8143
|
+
return material.css(templateObject_18$1 || (templateObject_18$1 = __makeTemplateObject(["\n padding-left: ", "px;\n gap: ", "px;\n\n ", "\n "], ["\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.xxl, isNarrow && material.css(templateObject_17$1 || (templateObject_17$1 = __makeTemplateObject(["\n padding-left: 0;\n gap: ", "px;\n flex-direction: column;\n justify-content: center;\n "], ["\n padding-left: 0;\n gap: ", "px;\n flex-direction: column;\n justify-content: center;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8144
|
+
});
|
|
8145
|
+
var StyledMobileImageRow = styled__default.default.div(templateObject_20$1 || (templateObject_20$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n\n ", "\n"])), function (props) {
|
|
8146
|
+
var spaces = getSpaces(props);
|
|
8147
|
+
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;\n ");
|
|
8148
|
+
});
|
|
8149
|
+
var StyledBottomSection = styled__default.default("div", {
|
|
8150
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8151
|
+
})(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) {
|
|
8152
|
+
var isNarrow = props.isNarrow;
|
|
8153
|
+
var spaces = getSpaces(props);
|
|
8154
|
+
return material.css(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 && material.css(templateObject_21$1 || (templateObject_21$1 = __makeTemplateObject(["\n flex-direction: column-reverse;\n margin-top: ", "px;\n "], ["\n flex-direction: column-reverse;\n margin-top: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8155
|
+
});
|
|
8156
|
+
var templateObject_1$m, templateObject_2$f, templateObject_3$9, templateObject_4$6, templateObject_5$5, templateObject_6$4, templateObject_7$2, templateObject_8$1, templateObject_9$1, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16$1, templateObject_17$1, templateObject_18$1, templateObject_19$1, templateObject_20$1, templateObject_21$1, templateObject_22$1, templateObject_23$1;
|
|
8157
|
+
|
|
7727
8158
|
/**
|
|
7728
8159
|
* WARNING: Don't import this directly.
|
|
7729
8160
|
* Use `MuiError` from `@mui/internal-babel-macros/MuiError.macro` instead.
|
|
@@ -13742,11 +14173,150 @@ function useTheme() {
|
|
|
13742
14173
|
return theme[THEME_ID] || theme;
|
|
13743
14174
|
}
|
|
13744
14175
|
|
|
14176
|
+
var doNotForwardProps$b = ["hasInvertedStyle", "isNarrow"];
|
|
14177
|
+
var NarrowNavItemLinkStyles = function (props) {
|
|
14178
|
+
var semanticColors = getSemanticColors(props);
|
|
14179
|
+
return material.css(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n min-height: 48px;\n text-align: center;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:hover {\n color: ", ";\n background: ", ";\n }\n "], ["\n min-height: 48px;\n text-align: center;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:hover {\n color: ", ";\n background: ", ";\n }\n "])), props.hasInvertedStyle
|
|
14180
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14181
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, props.hasInvertedStyle
|
|
14182
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondaryInverse
|
|
14183
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondary);
|
|
14184
|
+
};
|
|
14185
|
+
var StyledNavItemLink = styled__default.default(Link, {
|
|
14186
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$b.includes(prop); },
|
|
14187
|
+
})(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontHeader("m"), fontBody("s", "regular", /* isNarrow */ true), function (props) {
|
|
14188
|
+
var isNarrow = props.isNarrow;
|
|
14189
|
+
var semanticColors = getSemanticColors(props);
|
|
14190
|
+
return material.css(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n color: ", ";\n white-space: nowrap;\n\n &:hover {\n color: ", ";\n text-decoration: none;\n font-weight: 600;\n }\n\n ", "\n "], ["\n color: ", ";\n white-space: nowrap;\n\n &:hover {\n color: ", ";\n text-decoration: none;\n font-weight: 600;\n }\n\n ", "\n "])), props.hasInvertedStyle
|
|
14191
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryInverse
|
|
14192
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, props.hasInvertedStyle
|
|
14193
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14194
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, isNarrow && NarrowNavItemLinkStyles(props));
|
|
14195
|
+
});
|
|
14196
|
+
var templateObject_1$l, templateObject_2$e, templateObject_3$8;
|
|
14197
|
+
|
|
14198
|
+
var NavItem = React.memo(function (_a) {
|
|
14199
|
+
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow;
|
|
14200
|
+
return (jsxRuntime.jsx(StyledNavItemLink, __assign({ href: item.url, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, component: item.component }, item.linkProps, { children: item.label }), item.label));
|
|
14201
|
+
});
|
|
14202
|
+
NavItem.displayName = "NavItem";
|
|
14203
|
+
|
|
14204
|
+
var doNotForwardProps$a = ["hasInvertedStyle"];
|
|
14205
|
+
var StyledLinkItemLink = styled__default.default(Link, {
|
|
14206
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
14207
|
+
})(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBody("xxs", "regular"), function (props) {
|
|
14208
|
+
var semanticColors = getSemanticColors(props);
|
|
14209
|
+
return "\n color: ".concat(props.hasInvertedStyle ? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryInverse : semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, ";\n white-space: nowrap;\n\n &:hover {\n color: ").concat(props.hasInvertedStyle ? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse : semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, ";\n text-decoration: none;\n }\n ");
|
|
14210
|
+
});
|
|
14211
|
+
var StyledDivider = styled__default.default(material.Divider, {
|
|
14212
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
14213
|
+
})(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14214
|
+
var semanticColors = getSemanticColors(props);
|
|
14215
|
+
return "\n border-color: ".concat(props.hasInvertedStyle
|
|
14216
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
14217
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider, ";\n ");
|
|
14218
|
+
});
|
|
14219
|
+
var templateObject_1$k, templateObject_2$d;
|
|
14220
|
+
|
|
14221
|
+
var FooterLink = React.memo(function (_a) {
|
|
14222
|
+
var link = _a.link, showDivider = _a.showDivider, hasInvertedStyle = _a.hasInvertedStyle;
|
|
14223
|
+
return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(StyledLinkItemLink, __assign({ href: link.url, hasInvertedStyle: hasInvertedStyle, component: link.component }, link.linkProps, { children: link.label }), link.label), showDivider && (jsxRuntime.jsx(StyledDivider, { orientation: "vertical", flexItem: true, hasInvertedStyle: hasInvertedStyle }))] }));
|
|
14224
|
+
});
|
|
14225
|
+
FooterLink.displayName = "FooterLink";
|
|
14226
|
+
|
|
14227
|
+
function groupArray(array, groupSize) {
|
|
14228
|
+
var groups = [];
|
|
14229
|
+
for (var i = 0; i < array.length; i += groupSize) {
|
|
14230
|
+
groups.push(array.slice(i, i + groupSize));
|
|
14231
|
+
}
|
|
14232
|
+
return groups;
|
|
14233
|
+
}
|
|
14234
|
+
var MemoizedStyledDivider = React.memo(StyledDivider);
|
|
14235
|
+
function NavigationFooter(_a) {
|
|
14236
|
+
var hasInvertedStyle = _a.hasInvertedStyle, images = _a.images, logo = _a.logo, logoUrl = _a.logoUrl, navItems = _a.navItems, navLinks = _a.navLinks, tag = _a.tag, tagColor = _a.tagColor, title = _a.title, rest = __rest(_a, ["hasInvertedStyle", "images", "logo", "logoUrl", "navItems", "navLinks", "tag", "tagColor", "title"]);
|
|
14237
|
+
var footerRef = React.useRef(null);
|
|
14238
|
+
var theme = useTheme();
|
|
14239
|
+
var isMdScreen = material.useMediaQuery(theme.breakpoints.down("md"));
|
|
14240
|
+
var _b = React.useState({
|
|
14241
|
+
breakpoint: 0,
|
|
14242
|
+
isNarrow: isMdScreen,
|
|
14243
|
+
}), dimensions = _b[0], setDimensions = _b[1];
|
|
14244
|
+
React.useEffect(function () {
|
|
14245
|
+
setDimensions(function (prev) { return (__assign(__assign({}, prev), { isNarrow: isMdScreen })); });
|
|
14246
|
+
}, [isMdScreen]);
|
|
14247
|
+
var checkScrollable = React.useCallback(function () {
|
|
14248
|
+
if (!footerRef.current)
|
|
14249
|
+
return;
|
|
14250
|
+
var clientWidth = footerRef.current.clientWidth;
|
|
14251
|
+
var scrollWidth = footerRef.current.scrollWidth;
|
|
14252
|
+
var needsScroll = scrollWidth > clientWidth;
|
|
14253
|
+
setDimensions(function (prev) {
|
|
14254
|
+
var newBreakpoint = needsScroll && !prev.isNarrow
|
|
14255
|
+
? Math.max(prev.breakpoint, clientWidth)
|
|
14256
|
+
: prev.breakpoint;
|
|
14257
|
+
return {
|
|
14258
|
+
breakpoint: newBreakpoint,
|
|
14259
|
+
isNarrow: clientWidth <= newBreakpoint,
|
|
14260
|
+
};
|
|
14261
|
+
});
|
|
14262
|
+
}, []);
|
|
14263
|
+
React.useEffect(function () {
|
|
14264
|
+
checkScrollable();
|
|
14265
|
+
var resizeObserver = new ResizeObserver(checkScrollable);
|
|
14266
|
+
if (footerRef.current) {
|
|
14267
|
+
resizeObserver.observe(footerRef.current);
|
|
14268
|
+
}
|
|
14269
|
+
return function () { return resizeObserver.disconnect(); };
|
|
14270
|
+
}, [checkScrollable]);
|
|
14271
|
+
var renderImages = React.useCallback(function () {
|
|
14272
|
+
if (!(images === null || images === void 0 ? void 0 : images.length))
|
|
14273
|
+
return null;
|
|
14274
|
+
if (!dimensions.isNarrow) {
|
|
14275
|
+
return images.map(function (_a) {
|
|
14276
|
+
var image = _a.image, url = _a.url;
|
|
14277
|
+
return (jsxRuntime.jsx(Link, { href: url, children: image }, url));
|
|
14278
|
+
});
|
|
14279
|
+
}
|
|
14280
|
+
return groupArray(images, 2).map(function (imageGroup, index) { return (jsxRuntime.jsx(StyledMobileImageRow, { children: imageGroup.map(function (_a) {
|
|
14281
|
+
var image = _a.image, url = _a.url;
|
|
14282
|
+
return (jsxRuntime.jsx(Link, { href: url, children: image }, url));
|
|
14283
|
+
}) }, index)); });
|
|
14284
|
+
}, [images, dimensions.isNarrow]);
|
|
14285
|
+
var renderLinks = React.useCallback(function () {
|
|
14286
|
+
if (!(navLinks === null || navLinks === void 0 ? void 0 : navLinks.length))
|
|
14287
|
+
return null;
|
|
14288
|
+
if (!dimensions.isNarrow) {
|
|
14289
|
+
return navLinks.map(function (link, index) { return (jsxRuntime.jsx(FooterLink, { link: link, showDivider: index < navLinks.length - 1, hasInvertedStyle: hasInvertedStyle }, link.label)); });
|
|
14290
|
+
}
|
|
14291
|
+
return groupArray(navLinks, 3).map(function (linkGroup, index) { return (jsxRuntime.jsx(StyledMobileLinkRow, { children: linkGroup.map(function (link, linkIndex) { return (jsxRuntime.jsx(FooterLink, { link: link, showDivider: linkIndex < linkGroup.length - 1, hasInvertedStyle: hasInvertedStyle }, link.label)); }) }, index)); });
|
|
14292
|
+
}, [navLinks, dimensions.isNarrow, hasInvertedStyle]);
|
|
14293
|
+
var logoNode = React.useMemo(function () {
|
|
14294
|
+
var node = (jsxRuntime.jsxs(StyledLogoWrapper$1, { isNarrow: dimensions.isNarrow, hasInvertedStyle: hasInvertedStyle, children: [logo, jsxRuntime.jsx("p", { children: title }), tag && jsxRuntime.jsx(Tag, { tagColor: tagColor, label: tag, hover: false })] }));
|
|
14295
|
+
return logoUrl ? jsxRuntime.jsx(Link, { href: logoUrl, children: node }) : node;
|
|
14296
|
+
}, [
|
|
14297
|
+
logo,
|
|
14298
|
+
title,
|
|
14299
|
+
tag,
|
|
14300
|
+
tagColor,
|
|
14301
|
+
logoUrl,
|
|
14302
|
+
dimensions.isNarrow,
|
|
14303
|
+
hasInvertedStyle,
|
|
14304
|
+
]);
|
|
14305
|
+
var navItemsSection = React.useMemo(function () {
|
|
14306
|
+
if (!(navItems === null || navItems === void 0 ? void 0 : navItems.length))
|
|
14307
|
+
return null;
|
|
14308
|
+
return (jsxRuntime.jsx(StyledNavSection, { isNarrow: dimensions.isNarrow, children: navItems.map(function (item) { return (jsxRuntime.jsx(NavItem, { item: item, hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow }, item.label)); }) }));
|
|
14309
|
+
}, [navItems, hasInvertedStyle, dimensions.isNarrow]);
|
|
14310
|
+
return (jsxRuntime.jsxs(StyledFooter, __assign({ ref: footerRef, hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow }, rest, { children: [jsxRuntime.jsxs(StyledTopSection, { isNarrow: dimensions.isNarrow, hasInvertedStyle: hasInvertedStyle, children: [logoNode, navItemsSection] }), jsxRuntime.jsx(MemoizedStyledDivider, { hasInvertedStyle: hasInvertedStyle }), jsxRuntime.jsxs(StyledBottomSection, { isNarrow: dimensions.isNarrow, children: [jsxRuntime.jsx(StyledLinkSection, { isNarrow: dimensions.isNarrow, children: renderLinks() }), jsxRuntime.jsx(StyledImageSection, { isNarrow: dimensions.isNarrow, children: renderImages() })] })] })));
|
|
14311
|
+
}
|
|
14312
|
+
|
|
13745
14313
|
var doNotForwardProps$9 = [
|
|
13746
14314
|
"hasInvertedStyle",
|
|
13747
14315
|
"isNarrow",
|
|
13748
14316
|
"primaryNavPosition",
|
|
13749
14317
|
"showSearch",
|
|
14318
|
+
"logoLinkComponent",
|
|
14319
|
+
"logoLinkProps",
|
|
13750
14320
|
];
|
|
13751
14321
|
var StyledHeader = styled__default.default(material.AppBar, {
|
|
13752
14322
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
@@ -13769,15 +14339,21 @@ var StyledToolbar = styled__default.default(material.Toolbar, {
|
|
|
13769
14339
|
var spaces = getSpaces(props);
|
|
13770
14340
|
return material.css(templateObject_3$7 || (templateObject_3$7 = __makeTemplateObject(["\n &.MuiToolbar-root {\n min-height: 56px;\n max-height: 56px;\n padding: ", "px ", "px;\n\n ", "\n }\n "], ["\n &.MuiToolbar-root {\n min-height: 56px;\n max-height: 56px;\n padding: ", "px ", "px;\n\n ", "\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.xl, isNarrow && NarrowToolbar(props));
|
|
13771
14341
|
});
|
|
13772
|
-
var StyledShadowElement = styled__default.default
|
|
14342
|
+
var StyledShadowElement = styled__default.default("div", {
|
|
14343
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14344
|
+
})(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13773
14345
|
var shadows = getShadows(props);
|
|
13774
14346
|
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 z-index: 100;\n ");
|
|
13775
14347
|
});
|
|
13776
|
-
var StyledShadowCoverElement = styled__default.default
|
|
14348
|
+
var StyledShadowCoverElement = styled__default.default("div", {
|
|
14349
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14350
|
+
})(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13777
14351
|
var colors = getSemanticColors(props);
|
|
13778
14352
|
return "\n background: ".concat(props.hasInvertedStyle ? colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimaryInverse : 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 z-index: 100;\n ");
|
|
13779
14353
|
});
|
|
13780
|
-
var StyledHeaderButton = styled__default.default(Button
|
|
14354
|
+
var StyledHeaderButton = styled__default.default(Button, {
|
|
14355
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14356
|
+
})(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13781
14357
|
var _a, _b, _c, _d;
|
|
13782
14358
|
var sdsType = props.sdsType, hasInvertedStyle = props.hasInvertedStyle;
|
|
13783
14359
|
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";
|
|
@@ -13790,7 +14366,9 @@ var invertedNarrowButtonStyles = function (props) {
|
|
|
13790
14366
|
var semanticColors = getSemanticColors(props);
|
|
13791
14367
|
return material.css(templateObject_8 || (templateObject_8 = __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.textPrimaryInverse, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimaryInverse, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimaryInverse, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentPrimaryInverse);
|
|
13792
14368
|
};
|
|
13793
|
-
var StyledNarrowIconButton = styled__default.default(Button
|
|
14369
|
+
var StyledNarrowIconButton = styled__default.default(Button, {
|
|
14370
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14371
|
+
})(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13794
14372
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
13795
14373
|
return material.css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), hasInvertedStyle && invertedNarrowButtonStyles(props));
|
|
13796
14374
|
});
|
|
@@ -13799,7 +14377,9 @@ var invertedWideButtonStyles = function (props) {
|
|
|
13799
14377
|
var semanticColors = getSemanticColors(props);
|
|
13800
14378
|
return material.css(templateObject_11 || (templateObject_11 = __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.ornamentSecondaryInverse, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimaryInverse);
|
|
13801
14379
|
};
|
|
13802
|
-
var StyledWideIconButton = styled__default.default(Button
|
|
14380
|
+
var StyledWideIconButton = styled__default.default(Button, {
|
|
14381
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14382
|
+
})(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13803
14383
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
13804
14384
|
return material.css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), hasInvertedStyle && invertedWideButtonStyles(props));
|
|
13805
14385
|
});
|
|
@@ -13846,19 +14426,19 @@ var StyledSearch = styled__default.default(InputSearch, {
|
|
|
13846
14426
|
return material.css(templateObject_23 || (templateObject_23 = __makeTemplateObject(["\n max-width: ", ";\n padding: ", ";\n .MuiInputBase-root {\n color: ", ";\n fieldset {\n border-color: ", ";\n }\n\n .MuiInputAdornment-root {\n .MuiButtonBase-root:last-of-type {\n svg {\n color: ", ";\n }\n }\n }\n\n &:hover {\n fieldset {\n border-color: ", " !important;\n }\n\n .MuiInputAdornment-root {\n .MuiButtonBase-root:last-of-type {\n svg {\n color: ", ";\n }\n }\n }\n }\n\n &.Mui-focused {\n fieldset {\n border-color: ", " !important;\n }\n\n .MuiInputAdornment-root {\n .MuiButtonBase-root:last-of-type {\n svg {\n color: ", ";\n }\n }\n }\n }\n\n &.Mui-disabled {\n fieldset {\n border-color: ", " !important;\n }\n\n .MuiInputAdornment-root {\n .MuiButtonBase-root:last-of-type {\n svg {\n color: ", ";\n }\n }\n }\n }\n }\n "], ["\n max-width: ", ";\n padding: ", ";\n .MuiInputBase-root {\n color: ", ";\n fieldset {\n border-color: ", ";\n }\n\n .MuiInputAdornment-root {\n .MuiButtonBase-root:last-of-type {\n svg {\n color: ", ";\n }\n }\n }\n\n &:hover {\n fieldset {\n border-color: ", " !important;\n }\n\n .MuiInputAdornment-root {\n .MuiButtonBase-root:last-of-type {\n svg {\n color: ", ";\n }\n }\n }\n }\n\n &.Mui-focused {\n fieldset {\n border-color: ", " !important;\n }\n\n .MuiInputAdornment-root {\n .MuiButtonBase-root:last-of-type {\n svg {\n color: ", ";\n }\n }\n }\n }\n\n &.Mui-disabled {\n fieldset {\n border-color: ", " !important;\n }\n\n .MuiInputAdornment-root {\n .MuiButtonBase-root:last-of-type {\n svg {\n color: ", ";\n }\n }\n }\n }\n }\n "])), isNarrow ? "100%" : "320px", isNarrow ? "".concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px") : "", hasInvertedStyle
|
|
13847
14427
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
13848
14428
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, hasInvertedStyle
|
|
13849
|
-
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.
|
|
14429
|
+
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryInverse
|
|
13850
14430
|
: "", hasInvertedStyle
|
|
13851
14431
|
? (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondaryInverse
|
|
13852
14432
|
: "", hasInvertedStyle
|
|
13853
|
-
? (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.
|
|
14433
|
+
? (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderPrimaryHoverInverse
|
|
13854
14434
|
: "", hasInvertedStyle
|
|
13855
14435
|
? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentPrimaryInverse
|
|
13856
14436
|
: "", hasInvertedStyle
|
|
13857
|
-
? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.
|
|
14437
|
+
? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.borderPrimaryPressedInverse
|
|
13858
14438
|
: "", hasInvertedStyle
|
|
13859
14439
|
? (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentPrimaryInverse
|
|
13860
14440
|
: "", hasInvertedStyle
|
|
13861
|
-
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.
|
|
14441
|
+
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.borderPrimaryDisabledInverse
|
|
13862
14442
|
: "", hasInvertedStyle
|
|
13863
14443
|
? (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentDisabledInverse
|
|
13864
14444
|
: "");
|
|
@@ -13902,7 +14482,7 @@ var NarrowPrimaryNavItem = function (props) {
|
|
|
13902
14482
|
: (_b = colors === null || colors === void 0 ? void 0 : colors.accent) === null || _b === void 0 ? void 0 : _b.border;
|
|
13903
14483
|
var inactiveBorderColor = hasInvertedStyle
|
|
13904
14484
|
? (_c = colors === null || colors === void 0 ? void 0 : colors.neutral) === null || _c === void 0 ? void 0 : _c.fillPrimary
|
|
13905
|
-
: colors === null || colors === void 0 ? void 0 : colors.base.
|
|
14485
|
+
: colors === null || colors === void 0 ? void 0 : colors.base.borderPrimary;
|
|
13906
14486
|
return react.css(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n border-left: ", "px solid\n ", ";\n border-radius: 0;\n justify-content: start;\n padding: ", "px 0 ", "px\n ", "px;\n background: ", ";\n width: 100%;\n\n &:hover {\n box-shadow: none;\n background: ", ";\n border-left: ", "px solid\n ", ";\n }\n "], ["\n border-left: ", "px solid\n ", ";\n border-radius: 0;\n justify-content: start;\n padding: ", "px 0 ", "px\n ", "px;\n background: ", ";\n width: 100%;\n\n &:hover {\n box-shadow: none;\n background: ", ";\n border-left: ", "px solid\n ", ";\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xs, active ? activeBorderColor : "transparent", spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.m, ((_d = spaces === null || spaces === void 0 ? void 0 : spaces.l) !== null && _d !== void 0 ? _d : 0) + ((_e = spaces === null || spaces === void 0 ? void 0 : spaces.xxxs) !== null && _e !== void 0 ? _e : 0), active ? activeBackgroundColor : "transparent", hasInvertedStyle
|
|
13907
14487
|
? colors === null || colors === void 0 ? void 0 : colors.base.backgroundSecondaryInverse
|
|
13908
14488
|
: colors === null || colors === void 0 ? void 0 : colors.base.backgroundSecondary, spaces === null || spaces === void 0 ? void 0 : spaces.xs, active ? activeBorderColor : inactiveBorderColor);
|
|
@@ -13927,7 +14507,7 @@ var WideStyledLabel = function (props) {
|
|
|
13927
14507
|
: (_b = colors === null || colors === void 0 ? void 0 : colors.accent) === null || _b === void 0 ? void 0 : _b.border;
|
|
13928
14508
|
var inactiveBorderColor = hasInvertedStyle
|
|
13929
14509
|
? colors === null || colors === void 0 ? void 0 : colors.base.borderOnFill
|
|
13930
|
-
: colors === null || colors === void 0 ? void 0 : colors.base.
|
|
14510
|
+
: colors === null || colors === void 0 ? void 0 : colors.base.borderPrimary;
|
|
13931
14511
|
return react.css(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n border-bottom: solid 2px transparent;\n border-bottom-color: ", ";\n padding-bottom: ", "px;\n\n &:hover {\n border-bottom-color: ", ";\n }\n "], ["\n border-bottom: solid 2px transparent;\n border-bottom-color: ", ";\n padding-bottom: ", "px;\n\n &:hover {\n border-bottom-color: ", ";\n }\n "])), active ? activeBorderColor : "transparent", spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, active ? activeBorderColor : inactiveBorderColor);
|
|
13932
14512
|
};
|
|
13933
14513
|
var StyledLabel = styled__default.default("span", {
|
|
@@ -13983,7 +14563,7 @@ var NarrowStyledTextItem = function (props) {
|
|
|
13983
14563
|
};
|
|
13984
14564
|
var StyledTextItem = styled__default.default(Button, {
|
|
13985
14565
|
shouldForwardProp: function (prop) { return !ButtonDoNotForwardProps.includes(prop); },
|
|
13986
|
-
})(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n ", "\n\n background: none;\n justify-content: flex-start;\n min-height: 44px;\n width:
|
|
14566
|
+
})(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n ", "\n\n background: none;\n justify-content: flex-start;\n min-height: 44px;\n width: fit-content;\n min-width: unset;\n\n ", "\n"], ["\n ", "\n\n background: none;\n justify-content: flex-start;\n min-height: 44px;\n width: fit-content;\n min-width: unset;\n\n ", "\n"])), fontHeaderS, function (props) {
|
|
13987
14567
|
var _a, _b;
|
|
13988
14568
|
var hasInvertedStyle = props.hasInvertedStyle, open = props.open, isNarrow = props.isNarrow;
|
|
13989
14569
|
var semanticColors = getSemanticColors(props);
|
|
@@ -14009,7 +14589,7 @@ var StyledTextItem = styled__default.default(Button, {
|
|
|
14009
14589
|
var doNotForwardProps$6 = ["hasInvertedStyle", "isNarrow"];
|
|
14010
14590
|
var StyledAccordion = styled__default.default(Accordion, {
|
|
14011
14591
|
shouldForwardProp: function (prop) { return !doNotForwardProps$6.includes(prop); },
|
|
14012
|
-
})(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n width:
|
|
14592
|
+
})(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n width: fit-content;\n min-width: unset;\n\n .MuiAccordionDetails-root .MuiButtonBase-root .primary-text {\n ", "\n }\n\n ", "\n"], ["\n width: fit-content;\n min-width: unset;\n\n .MuiAccordionDetails-root .MuiButtonBase-root .primary-text {\n ", "\n }\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
14013
14593
|
var _a, _b;
|
|
14014
14594
|
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow;
|
|
14015
14595
|
var spaces = getSpaces(props);
|
|
@@ -14043,7 +14623,7 @@ var StyledSubItem = styled__default.default(MenuItem)(templateObject_7 || (templ
|
|
|
14043
14623
|
var templateObject_1$g, templateObject_2$9, templateObject_3$4, templateObject_4$3, templateObject_5$2, templateObject_6$1, templateObject_7;
|
|
14044
14624
|
|
|
14045
14625
|
function SecondaryNavItem(_a) {
|
|
14046
|
-
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow;
|
|
14626
|
+
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow, rest = __rest(_a, ["item", "hasInvertedStyle", "isNarrow"]);
|
|
14047
14627
|
var _b = React.useState(null), anchorEl = _b[0], setAnchorEl = _b[1];
|
|
14048
14628
|
var open = Boolean(anchorEl);
|
|
14049
14629
|
function onClose() {
|
|
@@ -14058,32 +14638,39 @@ function SecondaryNavItem(_a) {
|
|
|
14058
14638
|
}
|
|
14059
14639
|
setMenuWidth(button.offsetWidth);
|
|
14060
14640
|
}, []);
|
|
14061
|
-
return (jsxRuntime.jsxs(React.Fragment, { children: [item.
|
|
14062
|
-
|
|
14063
|
-
|
|
14064
|
-
|
|
14065
|
-
|
|
14066
|
-
|
|
14067
|
-
|
|
14068
|
-
|
|
14069
|
-
|
|
14641
|
+
return (jsxRuntime.jsxs(React.Fragment, { children: [item.itemType === "text" && (jsxRuntime.jsx(StyledTextItem, __assign({ sdsStyle: "minimal", onClick: item.onClick, hasInvertedStyle: hasInvertedStyle, open: open, isNarrow: isNarrow }, rest, { children: item.label }))), item.itemType === "dropdown" && !isNarrow && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(StyledTextItem, { sdsStyle: "minimal", ref: buttonRef, onClick: function (event) { return setAnchorEl(event.currentTarget); }, hasInvertedStyle: hasInvertedStyle, open: open, isNarrow: isNarrow, children: [jsxRuntime.jsx("span", { children: item.label }), jsxRuntime.jsx(Icon, { sdsIcon: open ? "ChevronUp" : "ChevronDown", sdsSize: "xs" })] }), jsxRuntime.jsx(Menu, { anchorEl: anchorEl, open: open, onClose: onClose, children: item.items.map(function (subItem) {
|
|
14642
|
+
var label = subItem.label, onClick = subItem.onClick, subItemRest = __rest(subItem, ["label", "onClick"]);
|
|
14643
|
+
return (jsxRuntime.jsx(MenuItem, __assign({ onClick: function () {
|
|
14644
|
+
onClick === null || onClick === void 0 ? void 0 : onClick();
|
|
14645
|
+
onClose();
|
|
14646
|
+
} }, subItemRest, { children: label }), label));
|
|
14647
|
+
}) })] })), item.itemType === "dropdown" && isNarrow && (jsxRuntime.jsxs(StyledAccordion, { id: "".concat(item.label, "-dropdown"), hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: [jsxRuntime.jsx(AccordionHeader, { children: item.label }), jsxRuntime.jsx(AccordionDetails, { children: item.items.map(function (subItem) {
|
|
14648
|
+
var label = subItem.label, onClick = subItem.onClick, accordionSubItemRest = __rest(subItem, ["label", "onClick"]);
|
|
14649
|
+
return (jsxRuntime.jsx(StyledSubItem, __assign({ onClick: function () {
|
|
14650
|
+
onClick === null || onClick === void 0 ? void 0 : onClick();
|
|
14651
|
+
onClose();
|
|
14652
|
+
}, sx: { width: menuWidth } }, accordionSubItemRest, { children: label }), label));
|
|
14653
|
+
}) })] }))] }, item.label));
|
|
14070
14654
|
}
|
|
14071
14655
|
function NavigationHeaderSecondaryNav(_a) {
|
|
14072
14656
|
var items = _a.items, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow;
|
|
14073
|
-
return (jsxRuntime.jsx(StyledSection, { gap: "l", isNarrow: isNarrow, children: items.map(function (item) {
|
|
14657
|
+
return (jsxRuntime.jsx(StyledSection, { gap: "l", isNarrow: isNarrow, children: items.map(function (item) {
|
|
14658
|
+
var itemType = item.itemType, label = item.label, rest = __rest(item, ["itemType", "label"]);
|
|
14659
|
+
return (jsxRuntime.jsx(SecondaryNavItem, __assign({ item: item, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow }, rest), "".concat(label, "-").concat(itemType)));
|
|
14660
|
+
}) }));
|
|
14074
14661
|
}
|
|
14075
14662
|
|
|
14076
14663
|
var NavigationHeader = React.forwardRef(function (props, ref) {
|
|
14077
|
-
var activePrimaryNavKey = props.activePrimaryNavKey, buttons = props.buttons, hasInvertedStyle = props.hasInvertedStyle, logo = props.logo, logoUrl = props.logoUrl, primaryNavItems = props.primaryNavItems,
|
|
14664
|
+
var activePrimaryNavKey = props.activePrimaryNavKey, buttons = props.buttons, hasInvertedStyle = props.hasInvertedStyle, logo = props.logo, logoUrl = props.logoUrl, _a = props.logoLinkComponent, logoLinkComponent = _a === void 0 ? "a" : _a, logoLinkProps = props.logoLinkProps, primaryNavItems = props.primaryNavItems, _b = props.primaryNavPosition, primaryNavPosition = _b === void 0 ? "left" : _b, searchProps = props.searchProps, secondaryNavItems = props.secondaryNavItems, setActivePrimaryNavKey = props.setActivePrimaryNavKey, _c = props.showSearch, showSearch = _c === void 0 ? true : _c, tag = props.tag, tagColor = props.tagColor, title = props.title, rest = __rest(props, ["activePrimaryNavKey", "buttons", "hasInvertedStyle", "logo", "logoUrl", "logoLinkComponent", "logoLinkProps", "primaryNavItems", "primaryNavPosition", "searchProps", "secondaryNavItems", "setActivePrimaryNavKey", "showSearch", "tag", "tagColor", "title"]);
|
|
14078
14665
|
var navRef = React.useRef(null);
|
|
14079
14666
|
var theme = useTheme();
|
|
14080
14667
|
var isMdScreen = material.useMediaQuery(theme.breakpoints.down("md"));
|
|
14081
14668
|
React.useEffect(function () {
|
|
14082
14669
|
setIsNarrow(isMdScreen);
|
|
14083
14670
|
}, [isMdScreen]);
|
|
14084
|
-
var
|
|
14085
|
-
var
|
|
14086
|
-
var
|
|
14671
|
+
var _d = React.useState(true), drawerOpen = _d[0], setDrawerOpen = _d[1];
|
|
14672
|
+
var _e = React.useState(isMdScreen), isNarrow = _e[0], setIsNarrow = _e[1];
|
|
14673
|
+
var _f = React.useState(0), breakpoint = _f[0], setBreakpoint = _f[1];
|
|
14087
14674
|
var checkScrollable = React.useCallback(function () {
|
|
14088
14675
|
if (!navRef.current)
|
|
14089
14676
|
return;
|
|
@@ -14108,8 +14695,8 @@ var NavigationHeader = React.forwardRef(function (props, ref) {
|
|
|
14108
14695
|
};
|
|
14109
14696
|
var renderLogoNode = function () {
|
|
14110
14697
|
var logoNode = (jsxRuntime.jsxs(StyledTitleContainer, { hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: [jsxRuntime.jsx(StyledLogoWrapper, { children: logo }), jsxRuntime.jsx("p", { children: title }), tag && jsxRuntime.jsx(StyledTag, { color: tagColor, label: tag, hover: false })] }));
|
|
14111
|
-
if (logoUrl) {
|
|
14112
|
-
logoNode = (jsxRuntime.jsx(StyledLogoLinkWrapper, { href: logoUrl, isNarrow: isNarrow, children: logoNode }));
|
|
14698
|
+
if (logoLinkComponent || logoUrl) {
|
|
14699
|
+
logoNode = (jsxRuntime.jsx(StyledLogoLinkWrapper, __assign({ component: logoLinkComponent, href: logoUrl }, logoLinkProps, { isNarrow: isNarrow, children: logoNode })));
|
|
14113
14700
|
}
|
|
14114
14701
|
return logoNode;
|
|
14115
14702
|
};
|
|
@@ -14225,7 +14812,7 @@ var StyledTab$1 = styled__default.default(material.Tab, {
|
|
|
14225
14812
|
var _a, _b, _c;
|
|
14226
14813
|
var spaces = getSpaces(props);
|
|
14227
14814
|
var semanticColors = getSemanticColors(props);
|
|
14228
|
-
return "\n ".concat(focusVisibleA11yStyle(props), "\n box-sizing: border-box;\n max-width: 180px;\n padding-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n margin: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n align-items: start;\n min-height: unset;\n max-height: unset;\n text-transform: none;\n &:last-child {\n margin-bottom: 0;\n }\n &:before {\n content: \"\";\n position: absolute;\n left: -").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n width: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n height: 100%;\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.
|
|
14815
|
+
return "\n ".concat(focusVisibleA11yStyle(props), "\n box-sizing: border-box;\n max-width: 180px;\n padding-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n margin: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n align-items: start;\n min-height: unset;\n max-height: unset;\n text-transform: none;\n &:last-child {\n margin-bottom: 0;\n }\n &:before {\n content: \"\";\n position: absolute;\n left: -").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n width: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n height: 100%;\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimary, ";\n display: none;\n border-radius: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n }\n &:hover {\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, ";\n &:before {\n display: block;\n }\n }\n &.Mui-selected {\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimary, ";\n font-weight: 600;\n }\n &.MuiButtonBase-root {\n white-space: nowrap;\n padding: 0;\n overflow: visible;\n }\n ");
|
|
14229
14816
|
});
|
|
14230
14817
|
var templateObject_1$f, templateObject_2$8;
|
|
14231
14818
|
|
|
@@ -14729,7 +15316,7 @@ var StyledSegmentedControl = styled__default.default(material.ToggleButtonGroup,
|
|
|
14729
15316
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
14730
15317
|
var spaces = getSpaces(props);
|
|
14731
15318
|
var semanticColors = getSemanticColors(props);
|
|
14732
|
-
return "\n .".concat(material.toggleButtonClasses.root, ".").concat(material.toggleButtonClasses.disabled, " {\n border-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.
|
|
15319
|
+
return "\n .".concat(material.toggleButtonClasses.root, ".").concat(material.toggleButtonClasses.disabled, " {\n border-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimary, ";\n }\n\n .").concat(material.toggleButtonClasses.root, ".").concat(material.toggleButtonClasses.selected, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillOpen, ";\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.ornamentSelected, ";\n border-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.borderPrimary, ";\n\n &:hover {\n background-color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.fillHover, ";\n color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentSecondaryHover, ";\n }\n }\n\n .").concat(material.toggleButtonClasses.root, " {\n ").concat(focusVisibleA11yStyle(props), "\n background-color: transparent;\n border-color: ").concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.borderPrimary, ";\n line-height: 0px;\n color: ").concat((_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentPrimary, ";\n padding: ").concat(((_j = spaces === null || spaces === void 0 ? void 0 : spaces.xs) !== null && _j !== void 0 ? _j : 6) - 1, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n\n &:hover {\n border-color: ").concat((_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.borderPrimary, ";\n background-color: ").concat((_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _l === void 0 ? void 0 : _l.fillHover, ";\n }\n }\n ");
|
|
14733
15320
|
});
|
|
14734
15321
|
var StyledToggleButton = styled__default.default(material.ToggleButton, {
|
|
14735
15322
|
shouldForwardProp: function (prop) { return !doNotForwardProps$1.includes(prop); },
|
|
@@ -14818,7 +15405,7 @@ var TableRow = React.forwardRef(function (props, ref) {
|
|
|
14818
15405
|
var StyledTableHeader = styled__default.default("thead")(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14819
15406
|
var _a;
|
|
14820
15407
|
var semanticColors = getSemanticColors(props);
|
|
14821
|
-
return "\n border-bottom: solid 2px ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.
|
|
15408
|
+
return "\n border-bottom: solid 2px ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderSecondary, ";\n ");
|
|
14822
15409
|
});
|
|
14823
15410
|
var templateObject_1$5;
|
|
14824
15411
|
|
|
@@ -14893,7 +15480,7 @@ var StyledTab = styled__default.default(material.Tab, {
|
|
|
14893
15480
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
14894
15481
|
var spaces = getSpaces(props);
|
|
14895
15482
|
var semanticColors = getSemanticColors(props);
|
|
14896
|
-
return "\n margin-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;\n padding-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n\n color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n\n &:hover, :focus {\n box-shadow: 0 2px 0 0 ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.
|
|
15483
|
+
return "\n margin-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;\n padding-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n\n color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n\n &:hover, :focus {\n box-shadow: 0 2px 0 0 ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderPrimary, ";\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimary, ";\n }\n\n &.Mui-selected {\n color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.textPrimary, ";\n\n &:hover {\n color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textPrimary, ";\n }\n }\n\n &:active {\n color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textPrimary, ";\n }\n\n &:disabled {\n color: ").concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.textDisabled, ";\n }\n ");
|
|
14897
15484
|
});
|
|
14898
15485
|
function tabFontMixin(props) {
|
|
14899
15486
|
var sdsSize = props.sdsSize;
|
|
@@ -15026,6 +15613,10 @@ var TooltipTableContent = function (props) {
|
|
|
15026
15613
|
return (jsxRuntime.jsxs(material.TableContainer, __assign({}, rest, { children: [contentAlert && jsxRuntime.jsx(Alert, { children: contentAlert }), data === null || data === void 0 ? void 0 : data.map(function (section, index) { return (jsxRuntime.jsxs(Section, { disabled: section.disabled, children: [jsxRuntime.jsx(SectionLabel, { disabled: section.disabled, label: section.label, children: section.label }), jsxRuntime.jsx(material.Table, { size: "small", children: jsxRuntime.jsx(material.TableBody, { children: section.dataRows.map(function (row, rowIndex) { return (jsxRuntime.jsxs(material.TableRow, { children: [jsxRuntime.jsx(RowLabel, { disabled: section.disabled, align: "left", children: row.label }), jsxRuntime.jsx(RowValue, { disabled: section.disabled, align: itemAlign, children: row.value })] }, row.label + String(rowIndex))); }) }) })] }, "".concat(section.label + String(index)))); })] })));
|
|
15027
15614
|
};
|
|
15028
15615
|
|
|
15616
|
+
Object.defineProperty(exports, "ContentCardMedia", {
|
|
15617
|
+
enumerable: true,
|
|
15618
|
+
get: function () { return material.CardMedia; }
|
|
15619
|
+
});
|
|
15029
15620
|
exports.Accordion = Accordion;
|
|
15030
15621
|
exports.AccordionDetails = AccordionDetails;
|
|
15031
15622
|
exports.AccordionHeader = AccordionHeader;
|
|
@@ -15047,6 +15638,9 @@ exports.Chip = Chip;
|
|
|
15047
15638
|
exports.ComplexFilter = ComplexFilter;
|
|
15048
15639
|
exports.ComplexFilterInputDropdown = InputDropdown;
|
|
15049
15640
|
exports.ComplexFilterPopper = StyledPopper;
|
|
15641
|
+
exports.ContentCard = ContentCard;
|
|
15642
|
+
exports.ContentCardActions = ContentCardActions;
|
|
15643
|
+
exports.ContentCardBody = StyledContentCardBody;
|
|
15050
15644
|
exports.Dialog = Dialog;
|
|
15051
15645
|
exports.DialogActions = DialogActions;
|
|
15052
15646
|
exports.DialogContent = index;
|
|
@@ -15079,6 +15673,7 @@ exports.MINIMUM_DROPDOWN_MENU_POPPER_WIDTH = MINIMUM_DROPDOWN_MENU_POPPER_WIDTH;
|
|
|
15079
15673
|
exports.Menu = Menu;
|
|
15080
15674
|
exports.MenuItem = MenuItem;
|
|
15081
15675
|
exports.MenuSelect = MenuSelect;
|
|
15676
|
+
exports.NavigationFooter = NavigationFooter;
|
|
15082
15677
|
exports.NavigationHeader = NavigationHeader;
|
|
15083
15678
|
exports.NavigationJumpTo = NavigationJumpTo;
|
|
15084
15679
|
exports.Notification = Notification;
|