@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.esm.js
CHANGED
|
@@ -1,9 +1,10 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
3
|
import * as React from 'react';
|
|
4
|
-
import React__default, { forwardRef, useEffect, useRef, useState, useCallback, createElement, useMemo, createContext, Fragment as Fragment$1, useContext } from 'react';
|
|
4
|
+
import React__default, { forwardRef, useEffect, useRef, useState, useCallback, createElement, useMemo, createContext, memo, Fragment as Fragment$1, useContext } from 'react';
|
|
5
5
|
import { css, ThemeContext as ThemeContext$1 } from '@emotion/react';
|
|
6
|
-
import { createTheme as createTheme$2, AccordionDetails as AccordionDetails$1, AccordionSummary, accordionSummaryClasses, SvgIcon, Accordion as Accordion$1, accordionClasses, accordionDetailsClasses, Alert as Alert$2, Button as Button$1, buttonClasses, IconButton, TextField, outlinedInputClasses, inputBaseClasses, buttonBaseClasses, inputAdornmentClasses, InputAdornment, MenuItem as MenuItem$1, menuItemClasses, Autocomplete as Autocomplete$1, autocompleteClasses, Paper, useTheme as useTheme$4, Popper, ClickAwayListener, alertClasses, alertTitleClasses, AlertTitle, Grow, Tooltip as Tooltip$1, Chip as Chip$1, darken as darken$1, Dialog as Dialog$1, DialogActions as DialogActions$1, dialogActionsClasses, DialogContent, DialogTitle as DialogTitle$1, Typography, Checkbox, checkboxClasses, FormControlLabel, Radio, radioClasses, Slider, sliderClasses, Switch, switchClasses, Link as Link$1, List as List$1, ListItem as ListItem$1, ListSubheader as ListSubheader$1, Menu as Menu$1, menuClasses,
|
|
6
|
+
import { createTheme as createTheme$2, AccordionDetails as AccordionDetails$1, AccordionSummary, accordionSummaryClasses, SvgIcon, Accordion as Accordion$1, accordionClasses, accordionDetailsClasses, Alert as Alert$2, Button as Button$1, buttonClasses, IconButton, TextField, outlinedInputClasses, inputBaseClasses, buttonBaseClasses, inputAdornmentClasses, InputAdornment, MenuItem as MenuItem$1, menuItemClasses, Autocomplete as Autocomplete$1, autocompleteClasses, Paper, useTheme as useTheme$4, Popper, ClickAwayListener, alertClasses, alertTitleClasses, AlertTitle, Grow, Tooltip as Tooltip$1, Chip as Chip$1, darken as darken$1, Card, CardContent, styled as styled$3, CardActions, css as css$2, CardMedia, Dialog as Dialog$1, DialogActions as DialogActions$1, dialogActionsClasses, DialogContent, DialogTitle as DialogTitle$1, Typography, Checkbox, checkboxClasses, FormControlLabel, Radio, radioClasses, Slider, sliderClasses, Switch, switchClasses, Link as Link$1, List as List$1, ListItem as ListItem$1, ListSubheader as ListSubheader$1, Menu as Menu$1, menuClasses, Divider, useMediaQuery, AppBar, Toolbar, Drawer, Tabs as Tabs$1, tabsClasses, Tab as Tab$1, Slide, Box as Box$1, drawerClasses, ToggleButtonGroup, toggleButtonClasses, ToggleButton, TableCell, TableContainer, Table as Table$1, TableBody, TableRow as TableRow$1 } from '@mui/material';
|
|
7
|
+
export { CardMedia as ContentCardMedia } from '@mui/material';
|
|
7
8
|
import styled$2 from '@emotion/styled';
|
|
8
9
|
import { Check, Remove, Clear } from '@mui/icons-material';
|
|
9
10
|
import { css as css$1 } from '@emotion/css';
|
|
@@ -967,16 +968,16 @@ var SDSPaletteLight = function (appTheme) {
|
|
|
967
968
|
backgroundSecondary: appTheme.colors.gray[100],
|
|
968
969
|
backgroundSecondaryInverse: appTheme.colors.gray[700],
|
|
969
970
|
backgroundTertiary: appTheme.colors.gray[200],
|
|
970
|
-
border: appTheme.colors.gray[600],
|
|
971
|
-
borderDisabled: appTheme.colors.gray[300],
|
|
972
|
-
borderDisabledInverse: appTheme.colors.gray[600],
|
|
973
|
-
borderHover: appTheme.colors.gray[900],
|
|
974
|
-
borderHoverInverse: appTheme.colors.gray[50],
|
|
975
|
-
borderInverse: appTheme.colors.gray[300],
|
|
976
971
|
borderOnFill: appTheme.colors.gray[50],
|
|
977
|
-
|
|
978
|
-
|
|
979
|
-
|
|
972
|
+
borderPrimary: appTheme.colors.gray[600],
|
|
973
|
+
borderPrimaryDisabled: appTheme.colors.gray[300],
|
|
974
|
+
borderPrimaryDisabledInverse: appTheme.colors.gray[600],
|
|
975
|
+
borderPrimaryHover: appTheme.colors.gray[900],
|
|
976
|
+
borderPrimaryHoverInverse: appTheme.colors.gray[50],
|
|
977
|
+
borderPrimaryInverse: appTheme.colors.gray[300],
|
|
978
|
+
borderPrimaryPressed: appTheme.colors.gray[900],
|
|
979
|
+
borderPrimaryPressedInverse: appTheme.colors.gray[50],
|
|
980
|
+
borderSecondary: appTheme.colors.gray[300],
|
|
980
981
|
divider: appTheme.colors.gray[200],
|
|
981
982
|
dividerInverse: appTheme.colors.gray[600],
|
|
982
983
|
fillDisabled: appTheme.colors.gray[200],
|
|
@@ -1103,16 +1104,16 @@ var SDSPaletteDark = function (appTheme) {
|
|
|
1103
1104
|
backgroundSecondary: appTheme.colors.gray[100],
|
|
1104
1105
|
backgroundSecondaryInverse: appTheme.colors.gray[700],
|
|
1105
1106
|
backgroundTertiary: appTheme.colors.gray[200],
|
|
1106
|
-
border: appTheme.colors.gray[600],
|
|
1107
|
-
borderDisabled: appTheme.colors.gray[300],
|
|
1108
|
-
borderDisabledInverse: appTheme.colors.gray[600],
|
|
1109
|
-
borderHover: appTheme.colors.gray[900],
|
|
1110
|
-
borderHoverInverse: appTheme.colors.gray[50],
|
|
1111
|
-
borderInverse: appTheme.colors.gray[300],
|
|
1112
1107
|
borderOnFill: appTheme.colors.gray[50],
|
|
1113
|
-
|
|
1114
|
-
|
|
1115
|
-
|
|
1108
|
+
borderPrimary: appTheme.colors.gray[600],
|
|
1109
|
+
borderPrimaryDisabled: appTheme.colors.gray[300],
|
|
1110
|
+
borderPrimaryDisabledInverse: appTheme.colors.gray[600],
|
|
1111
|
+
borderPrimaryHover: appTheme.colors.gray[900],
|
|
1112
|
+
borderPrimaryHoverInverse: appTheme.colors.gray[50],
|
|
1113
|
+
borderPrimaryInverse: appTheme.colors.gray[300],
|
|
1114
|
+
borderPrimaryPressed: appTheme.colors.gray[900],
|
|
1115
|
+
borderPrimaryPressedInverse: appTheme.colors.gray[50],
|
|
1116
|
+
borderSecondary: appTheme.colors.gray[300],
|
|
1116
1117
|
divider: appTheme.colors.gray[200],
|
|
1117
1118
|
dividerInverse: appTheme.colors.gray[600],
|
|
1118
1119
|
fillDisabled: appTheme.colors.gray[200],
|
|
@@ -1535,7 +1536,7 @@ var getBreakpoints = function (_a) {
|
|
|
1535
1536
|
function focusVisibleA11yStyle(props) {
|
|
1536
1537
|
var _a;
|
|
1537
1538
|
var semanticColors = getSemanticColors(props);
|
|
1538
|
-
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.
|
|
1539
|
+
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 ");
|
|
1539
1540
|
}
|
|
1540
1541
|
|
|
1541
1542
|
var fontBody = function (fontSize, fontWeight, isNarrow) {
|
|
@@ -1548,7 +1549,7 @@ var fontBody = function (fontSize, fontWeight, isNarrow) {
|
|
|
1548
1549
|
return null;
|
|
1549
1550
|
var body = typography.wideStyles.body, narrowBody = typography.narrowStyles.body, bodyFontFamily = typography.fontFamily.body;
|
|
1550
1551
|
if (isNarrow) {
|
|
1551
|
-
return css(templateObject_1$
|
|
1552
|
+
return 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));
|
|
1552
1553
|
}
|
|
1553
1554
|
return themeToCss(body[fontWeight][fontSize], bodyFontFamily);
|
|
1554
1555
|
};
|
|
@@ -1573,8 +1574,8 @@ var fontCaps = function (fontSize, isNarrow) {
|
|
|
1573
1574
|
if (!typography)
|
|
1574
1575
|
return null;
|
|
1575
1576
|
var caps = typography.wideStyles.caps, narrowCaps = typography.narrowStyles.caps, capsFontFamily = typography.fontFamily.caps;
|
|
1576
|
-
return css(templateObject_3$
|
|
1577
|
-
? css(templateObject_2$
|
|
1577
|
+
return css(templateObject_3$C || (templateObject_3$C = __makeTemplateObject(["\n text-transform: uppercase;\n\n ", "\n "], ["\n text-transform: uppercase;\n\n ", "\n "])), isNarrow
|
|
1578
|
+
? 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));
|
|
1578
1579
|
};
|
|
1579
1580
|
};
|
|
1580
1581
|
var fontCapsXxs = fontCaps("xxs");
|
|
@@ -1589,7 +1590,7 @@ var fontHeader = function (fontSize, isNarrow) {
|
|
|
1589
1590
|
return null;
|
|
1590
1591
|
var header = typography.wideStyles.header, narrowHeader = typography.narrowStyles.header, headerFontFamily = typography.fontFamily.header;
|
|
1591
1592
|
if (isNarrow) {
|
|
1592
|
-
return css(templateObject_4$
|
|
1593
|
+
return 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));
|
|
1593
1594
|
}
|
|
1594
1595
|
return themeToCss(header.semibold[fontSize], headerFontFamily);
|
|
1595
1596
|
};
|
|
@@ -1612,7 +1613,7 @@ var fontCode = function (fontSize, fontWeight, isNarrow) {
|
|
|
1612
1613
|
return null;
|
|
1613
1614
|
var code = typography.wideStyles.code, narrowCode = typography.narrowStyles.code, codeFontFamily = typography.fontFamily.code;
|
|
1614
1615
|
if (isNarrow) {
|
|
1615
|
-
return css(templateObject_5$
|
|
1616
|
+
return 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));
|
|
1616
1617
|
}
|
|
1617
1618
|
return themeToCss(code[fontWeight][fontSize], codeFontFamily);
|
|
1618
1619
|
};
|
|
@@ -1630,8 +1631,8 @@ var fontTabular = function (fontSize, fontWeight, isNarrow) {
|
|
|
1630
1631
|
if (!typography)
|
|
1631
1632
|
return null;
|
|
1632
1633
|
var tabular = typography.wideStyles.tabular, narrowTabular = typography.narrowStyles.tabular, tabularFontFamily = typography.fontFamily.tabular;
|
|
1633
|
-
return css(templateObject_7$
|
|
1634
|
-
? css(templateObject_6$
|
|
1634
|
+
return 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
|
|
1635
|
+
? 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));
|
|
1635
1636
|
};
|
|
1636
1637
|
};
|
|
1637
1638
|
var fontTabularXs = fontTabular("xs", "regular");
|
|
@@ -1640,33 +1641,33 @@ var fontTabularSemiboldXs = fontTabular("xs", "semibold");
|
|
|
1640
1641
|
var fontTabularSemiboldS = fontTabular("s", "semibold");
|
|
1641
1642
|
function themeToCss(fontTheme, fontFamily) {
|
|
1642
1643
|
if (fontFamily === void 0) { fontFamily = "inherit"; }
|
|
1643
|
-
return css(templateObject_8$
|
|
1644
|
+
return 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);
|
|
1644
1645
|
}
|
|
1645
|
-
var templateObject_1$
|
|
1646
|
+
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;
|
|
1646
1647
|
|
|
1647
|
-
var StyledAccordionDetails = styled$2(AccordionDetails$1)(templateObject_2$
|
|
1648
|
+
var StyledAccordionDetails = styled$2(AccordionDetails$1)(templateObject_2$M || (templateObject_2$M = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
1648
1649
|
var spaces = getSpaces(props);
|
|
1649
|
-
return css(templateObject_1$
|
|
1650
|
+
return 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);
|
|
1650
1651
|
});
|
|
1651
|
-
var templateObject_1$
|
|
1652
|
+
var templateObject_1$18, templateObject_2$M;
|
|
1652
1653
|
|
|
1653
1654
|
var AccordionDetails = function (props) {
|
|
1654
1655
|
var children = props.children;
|
|
1655
1656
|
return jsx(StyledAccordionDetails, { children: children });
|
|
1656
1657
|
};
|
|
1657
1658
|
|
|
1658
|
-
var StyledAccordionHeader = styled$2(AccordionSummary)(templateObject_2$
|
|
1659
|
+
var StyledAccordionHeader = styled$2(AccordionSummary)(templateObject_2$L || (templateObject_2$L = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderS, function (props) {
|
|
1659
1660
|
var _a, _b;
|
|
1660
1661
|
var spaces = getSpaces(props);
|
|
1661
1662
|
var semanticColors = getSemanticColors(props);
|
|
1662
|
-
return css(templateObject_1$
|
|
1663
|
+
return 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, accordionSummaryClasses.content, accordionSummaryClasses.expanded, 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, accordionSummaryClasses.expandIconWrapper, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondaryHover);
|
|
1663
1664
|
});
|
|
1664
|
-
var StyledSubtitle = styled$2("p")(templateObject_4$
|
|
1665
|
+
var StyledSubtitle = styled$2("p")(templateObject_4$u || (templateObject_4$u = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
1665
1666
|
var _a;
|
|
1666
1667
|
var semanticColors = getSemanticColors(props);
|
|
1667
|
-
return css(templateObject_3$
|
|
1668
|
+
return 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);
|
|
1668
1669
|
});
|
|
1669
|
-
var templateObject_1$
|
|
1670
|
+
var templateObject_1$17, templateObject_2$L, templateObject_3$B, templateObject_4$u;
|
|
1670
1671
|
|
|
1671
1672
|
var _path$26, _path2$C, _path3$6;
|
|
1672
1673
|
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); }
|
|
@@ -4376,22 +4377,22 @@ var iconMap = {
|
|
|
4376
4377
|
},
|
|
4377
4378
|
};
|
|
4378
4379
|
|
|
4379
|
-
var doNotForwardProps$
|
|
4380
|
+
var doNotForwardProps$F = ["sdsIcon", "sdsSize", "iconColor"];
|
|
4380
4381
|
/**
|
|
4381
4382
|
* @see https://mui.com/material-ui/icons/#svgicon
|
|
4382
4383
|
*/
|
|
4383
4384
|
var StyledSvgIcon = styled$2(SvgIcon, {
|
|
4384
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4385
|
-
})(templateObject_2$
|
|
4385
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$F.includes(prop); },
|
|
4386
|
+
})(templateObject_2$K || (templateObject_2$K = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4386
4387
|
var _a, _b, _c;
|
|
4387
4388
|
var mode = getMode(props);
|
|
4388
4389
|
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;
|
|
4389
4390
|
var iconSizes = getIconSizes(props);
|
|
4390
4391
|
var colors = getColors(props);
|
|
4391
|
-
return css(templateObject_1
|
|
4392
|
+
return 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);
|
|
4392
4393
|
});
|
|
4393
|
-
var StyledIcon$1 = styled$2("div")(templateObject_3$
|
|
4394
|
-
var templateObject_1
|
|
4394
|
+
var StyledIcon$1 = styled$2("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"])));
|
|
4395
|
+
var templateObject_1$16, templateObject_2$K, templateObject_3$A;
|
|
4395
4396
|
|
|
4396
4397
|
/**
|
|
4397
4398
|
* @see https://mui.com/material-ui/icons/#icons
|
|
@@ -4422,24 +4423,24 @@ var StyledAccordion$1 = styled$2(Accordion$1, {
|
|
|
4422
4423
|
shouldForwardProp: function (prop) {
|
|
4423
4424
|
return !sdsPropNames$2.includes(prop.toString());
|
|
4424
4425
|
},
|
|
4425
|
-
})(templateObject_2$
|
|
4426
|
+
})(templateObject_2$J || (templateObject_2$J = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4426
4427
|
var _a, _b;
|
|
4427
4428
|
var useDivider = props.useDivider, togglePosition = props.togglePosition;
|
|
4428
4429
|
var shadows = getShadows(props);
|
|
4429
4430
|
var typography = getTypography(props);
|
|
4430
4431
|
var borders = getBorders(props);
|
|
4431
4432
|
var spaces = getSpaces(props);
|
|
4432
|
-
return css(templateObject_1$
|
|
4433
|
+
return 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 "])), 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", accordionSummaryClasses.root, focusVisibleA11yStyle(props), accordionSummaryClasses.focusVisible, accordionSummaryClasses.expanded, accordionSummaryClasses.expandIconWrapper, spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, accordionDetailsClasses.root, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, accordionClasses.expanded, togglePosition === "left" && leftPosition(props));
|
|
4433
4434
|
});
|
|
4434
4435
|
var leftPosition = function (props) {
|
|
4435
4436
|
var _a, _b, _c;
|
|
4436
4437
|
var spaces = getSpaces(props);
|
|
4437
4438
|
var iconSizes = getIconSizes(props);
|
|
4438
|
-
return css(templateObject_3$
|
|
4439
|
+
return 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 "])), accordionClasses.root, accordionSummaryClasses.root, accordionSummaryClasses.content, spaces === null || spaces === void 0 ? void 0 : spaces.s, accordionSummaryClasses.expandIconWrapper, spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, accordionSummaryClasses.expanded, accordionDetailsClasses.root, ((_a = spaces === null || spaces === void 0 ? void 0 : spaces.m) !== null && _a !== void 0 ? _a : 12) +
|
|
4439
4440
|
((_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width) !== null && _b !== void 0 ? _b : 12) +
|
|
4440
4441
|
((_c = spaces === null || spaces === void 0 ? void 0 : spaces.s) !== null && _c !== void 0 ? _c : 8));
|
|
4441
4442
|
};
|
|
4442
|
-
var templateObject_1$
|
|
4443
|
+
var templateObject_1$15, templateObject_2$J, templateObject_3$z;
|
|
4443
4444
|
|
|
4444
4445
|
/**
|
|
4445
4446
|
* @see https://mui.com/material-ui/react-accordion/
|
|
@@ -4455,7 +4456,7 @@ var Accordion = React__default.forwardRef(function (props, ref) {
|
|
|
4455
4456
|
return (jsx(StyledAccordion$1, __assign({ square: true, useDivider: useDivider, togglePosition: togglePosition, expanded: expanded === id, onChange: handleChange(id), ref: ref }, props, { children: children })));
|
|
4456
4457
|
});
|
|
4457
4458
|
|
|
4458
|
-
var StyledAlert = styled$2(Alert$2)(templateObject_1$
|
|
4459
|
+
var StyledAlert = styled$2(Alert$2)(templateObject_1$14 || (templateObject_1$14 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4459
4460
|
var _a;
|
|
4460
4461
|
var colors = getColors(props);
|
|
4461
4462
|
var spaces = getSpaces(props);
|
|
@@ -4482,7 +4483,7 @@ function severityToColor(alertSeverity, colors) {
|
|
|
4482
4483
|
return colors === null || colors === void 0 ? void 0 : colors.green;
|
|
4483
4484
|
}
|
|
4484
4485
|
}
|
|
4485
|
-
var templateObject_1$
|
|
4486
|
+
var templateObject_1$14;
|
|
4486
4487
|
|
|
4487
4488
|
/**
|
|
4488
4489
|
* @see https://mui.com/material-ui/react-alert/
|
|
@@ -4510,6 +4511,20 @@ function filterProps(props, excludeProps) {
|
|
|
4510
4511
|
}
|
|
4511
4512
|
return result;
|
|
4512
4513
|
}
|
|
4514
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
4515
|
+
var mergeRefs = function (refs) {
|
|
4516
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
4517
|
+
return function (element) {
|
|
4518
|
+
refs.forEach(function (ref) {
|
|
4519
|
+
if (typeof ref === "function") {
|
|
4520
|
+
ref(element);
|
|
4521
|
+
}
|
|
4522
|
+
else if (ref != null) {
|
|
4523
|
+
ref.current = element;
|
|
4524
|
+
}
|
|
4525
|
+
});
|
|
4526
|
+
};
|
|
4527
|
+
};
|
|
4513
4528
|
|
|
4514
4529
|
var _a;
|
|
4515
4530
|
var SDSWarningTypes;
|
|
@@ -4524,6 +4539,8 @@ var SDSWarningTypes;
|
|
|
4524
4539
|
SDSWarningTypes["TooltipSubtitle"] = "tooltipSubtitle";
|
|
4525
4540
|
SDSWarningTypes["TooltipWidth"] = "tooltipWidth";
|
|
4526
4541
|
SDSWarningTypes["TooltipInvertStyle"] = "tooltipInvertStyle";
|
|
4542
|
+
SDSWarningTypes["ContentCardActionsOnlyButtons"] = "contentCardActionsOnlyButtons";
|
|
4543
|
+
SDSWarningTypes["ClickableContentCardNumberOfButtons"] = "clickableContentCardNumberOfButtons";
|
|
4527
4544
|
})(SDSWarningTypes || (SDSWarningTypes = {}));
|
|
4528
4545
|
var SDS_WARNINGS = (_a = {},
|
|
4529
4546
|
_a[SDSWarningTypes.ButtonMinimalIsAllCaps] = {
|
|
@@ -4566,6 +4583,14 @@ var SDS_WARNINGS = (_a = {},
|
|
|
4566
4583
|
hasWarned: false,
|
|
4567
4584
|
message: "Warning: Tooltips using the inverted or sdsStyle prop will be deprecated. Please use hasInvertedStyle instead!",
|
|
4568
4585
|
},
|
|
4586
|
+
_a[SDSWarningTypes.ContentCardActionsOnlyButtons] = {
|
|
4587
|
+
hasWarned: false,
|
|
4588
|
+
message: "Warning: Only SDS buttons could be used within ContentCard Actions component slot!",
|
|
4589
|
+
},
|
|
4590
|
+
_a[SDSWarningTypes.ClickableContentCardNumberOfButtons] = {
|
|
4591
|
+
hasWarned: false,
|
|
4592
|
+
message: "Warning: Clickable Content Cards can only have one or no buttons!",
|
|
4593
|
+
},
|
|
4569
4594
|
_a);
|
|
4570
4595
|
var showWarningIfFirstOccurence = function (warningType) {
|
|
4571
4596
|
if (!(warningType in SDS_WARNINGS)) {
|
|
@@ -4583,7 +4608,7 @@ var showWarningIfFirstOccurence = function (warningType) {
|
|
|
4583
4608
|
SDS_WARNINGS[warningType].hasWarned = true;
|
|
4584
4609
|
};
|
|
4585
4610
|
|
|
4586
|
-
var doNotForwardProps$
|
|
4611
|
+
var doNotForwardProps$E = [
|
|
4587
4612
|
"isAllCaps",
|
|
4588
4613
|
"isRounded",
|
|
4589
4614
|
"sdsStyle",
|
|
@@ -4617,16 +4642,17 @@ var ButtonStyles = function (props) {
|
|
|
4617
4642
|
: (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.fillPrimary;
|
|
4618
4643
|
var disabledBackgroundColor = variant === "outlined" ? "transparent" : (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.fillDisabled;
|
|
4619
4644
|
var disabledBorder = variant === "outlined"
|
|
4620
|
-
? "inset 0 0 0 1px ".concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.
|
|
4645
|
+
? "inset 0 0 0 1px ".concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.borderPrimaryDisabled)
|
|
4621
4646
|
: "none";
|
|
4622
4647
|
var boxshadow = variant === "outlined"
|
|
4623
4648
|
? "inset 0 0 0 1px ".concat((_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _h === void 0 ? void 0 : _h.border)
|
|
4624
4649
|
: "none";
|
|
4625
|
-
|
|
4650
|
+
fontBody("xs", "semibold");
|
|
4651
|
+
return 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, buttonClasses.startIcon, 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, buttonClasses.startIcon, spaces === null || spaces === void 0 ? void 0 : spaces.s, buttonClasses.endIcon, spaces === null || spaces === void 0 ? void 0 : spaces.s);
|
|
4626
4652
|
};
|
|
4627
4653
|
var Rounded = function (props) {
|
|
4628
4654
|
var corners = getCorners(props);
|
|
4629
|
-
return css(templateObject_2$
|
|
4655
|
+
return 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);
|
|
4630
4656
|
};
|
|
4631
4657
|
var DestructiveButton = function (props) {
|
|
4632
4658
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
@@ -4645,13 +4671,13 @@ var DestructiveButton = function (props) {
|
|
|
4645
4671
|
var boxshadow = variant === "outlined"
|
|
4646
4672
|
? "inset 0 0 0 1px ".concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _f === void 0 ? void 0 : _f.border)
|
|
4647
4673
|
: "none";
|
|
4648
|
-
return css(templateObject_3$
|
|
4674
|
+
return 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);
|
|
4649
4675
|
};
|
|
4650
4676
|
var StyledButton$3 = styled$2(Button$1, {
|
|
4651
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4652
|
-
})(templateObject_5$
|
|
4677
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$E.includes(prop); },
|
|
4678
|
+
})(templateObject_5$o || (templateObject_5$o = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4653
4679
|
var sdsStyle = props.sdsStyle, sdsType = props.sdsType, isAllCaps = props.isAllCaps;
|
|
4654
|
-
return css(templateObject_4$
|
|
4680
|
+
return 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));
|
|
4655
4681
|
});
|
|
4656
4682
|
// Minimal Button Styles
|
|
4657
4683
|
var Minimal = function (props) {
|
|
@@ -4660,60 +4686,60 @@ var Minimal = function (props) {
|
|
|
4660
4686
|
var spaces = getSpaces(props);
|
|
4661
4687
|
var iconSizes = getIconSizes(props);
|
|
4662
4688
|
var semanticColors = getSemanticColors(props);
|
|
4663
|
-
return css(templateObject_6$
|
|
4689
|
+
return 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, buttonClasses.startIcon, buttonClasses.endIcon, (_j = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s) === null || _j === void 0 ? void 0 : _j.width, (_k = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s) === null || _k === void 0 ? void 0 : _k.width, (_l = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s) === null || _l === void 0 ? void 0 : _l.width, buttonClasses.startIcon, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, buttonClasses.endIcon, spaces === null || spaces === void 0 ? void 0 : spaces.xxs);
|
|
4664
4690
|
};
|
|
4665
4691
|
var PrimaryMinimalButton = function (props) {
|
|
4666
4692
|
var _a, _b;
|
|
4667
4693
|
var semanticColors = getSemanticColors(props);
|
|
4668
|
-
return css(templateObject_7$
|
|
4694
|
+
return 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);
|
|
4669
4695
|
};
|
|
4670
4696
|
var SecondaryMinimalButton = function (props) {
|
|
4671
4697
|
var _a, _b;
|
|
4672
4698
|
var semanticColors = getSemanticColors(props);
|
|
4673
|
-
return css(templateObject_8$
|
|
4699
|
+
return 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);
|
|
4674
4700
|
};
|
|
4675
4701
|
var StyledMinimalButton = styled$2(Button$1, {
|
|
4676
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4677
|
-
})(templateObject_10$
|
|
4702
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$E.includes(prop); },
|
|
4703
|
+
})(templateObject_10$5 || (templateObject_10$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4678
4704
|
var sdsType = props.sdsType;
|
|
4679
|
-
return css(templateObject_9$
|
|
4705
|
+
return css(templateObject_9$7 || (templateObject_9$7 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), sdsType === "primary" && PrimaryMinimalButton(props), sdsType === "secondary" && SecondaryMinimalButton(props));
|
|
4680
4706
|
});
|
|
4681
4707
|
var StyledButtonLegacy = styled$2(Button$1, {
|
|
4682
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4683
|
-
})(templateObject_11$
|
|
4708
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$E.includes(prop); },
|
|
4709
|
+
})(templateObject_11$4 || (templateObject_11$4 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4684
4710
|
if (!props.isRounded)
|
|
4685
4711
|
return "";
|
|
4686
4712
|
var corners = getCorners(props);
|
|
4687
4713
|
var spaces = getSpaces(props);
|
|
4688
4714
|
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 ");
|
|
4689
4715
|
});
|
|
4690
|
-
var templateObject_1$
|
|
4716
|
+
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;
|
|
4691
4717
|
|
|
4692
4718
|
var isDisabled$1 = function (props) {
|
|
4693
4719
|
var _a, _b;
|
|
4694
4720
|
var semanticColors = getSemanticColors(props);
|
|
4695
|
-
return css(templateObject_1$
|
|
4721
|
+
return 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);
|
|
4696
4722
|
};
|
|
4697
4723
|
var primary$2 = function (props) {
|
|
4698
4724
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4699
4725
|
var semanticColors = getSemanticColors(props);
|
|
4700
|
-
return css(templateObject_2$
|
|
4726
|
+
return 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);
|
|
4701
4727
|
};
|
|
4702
4728
|
var secondary$2 = function (props) {
|
|
4703
4729
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4704
4730
|
var semanticColors = getSemanticColors(props);
|
|
4705
|
-
return css(templateObject_3$
|
|
4731
|
+
return 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);
|
|
4706
4732
|
};
|
|
4707
4733
|
var tertiary = function (props) {
|
|
4708
4734
|
var _a, _b, _c, _d, _e, _f;
|
|
4709
4735
|
var semanticColors = getSemanticColors(props);
|
|
4710
|
-
return css(templateObject_4$
|
|
4736
|
+
return 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);
|
|
4711
4737
|
};
|
|
4712
4738
|
var small$1 = function (props) {
|
|
4713
4739
|
var sdsType = props.sdsType;
|
|
4714
4740
|
var iconSizes = getIconSizes(props);
|
|
4715
4741
|
var spaces = getSpaces(props);
|
|
4716
|
-
return css(templateObject_5$
|
|
4742
|
+
return 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"
|
|
4717
4743
|
? "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;")
|
|
4718
4744
|
: "", 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;") : "");
|
|
4719
4745
|
};
|
|
@@ -4721,7 +4747,7 @@ var medium$1 = function (props) {
|
|
|
4721
4747
|
var sdsType = props.sdsType;
|
|
4722
4748
|
var iconSizes = getIconSizes(props);
|
|
4723
4749
|
var spaces = getSpaces(props);
|
|
4724
|
-
return css(templateObject_6$
|
|
4750
|
+
return 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"
|
|
4725
4751
|
? "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;")
|
|
4726
4752
|
: "", 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;") : "");
|
|
4727
4753
|
};
|
|
@@ -4729,11 +4755,11 @@ var large = function (props) {
|
|
|
4729
4755
|
var sdsType = props.sdsType;
|
|
4730
4756
|
var iconSizes = getIconSizes(props);
|
|
4731
4757
|
var spaces = getSpaces(props);
|
|
4732
|
-
return css(templateObject_7$
|
|
4758
|
+
return 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"
|
|
4733
4759
|
? "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;")
|
|
4734
4760
|
: "", 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;") : "");
|
|
4735
4761
|
};
|
|
4736
|
-
var doNotForwardProps$
|
|
4762
|
+
var doNotForwardProps$D = [
|
|
4737
4763
|
"on",
|
|
4738
4764
|
"sdsSize",
|
|
4739
4765
|
"sdsType",
|
|
@@ -4743,12 +4769,12 @@ var doNotForwardProps$w = [
|
|
|
4743
4769
|
"customTheme",
|
|
4744
4770
|
];
|
|
4745
4771
|
var StyledButtonIcon = styled$2(IconButton, {
|
|
4746
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4747
|
-
})(templateObject_9$
|
|
4772
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$D.includes(prop); },
|
|
4773
|
+
})(templateObject_9$6 || (templateObject_9$6 = __makeTemplateObject(["\n padding: 0;\n ", "\n\n ", "\n"], ["\n padding: 0;\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4748
4774
|
var disabled = props.disabled, _a = props.sdsSize, sdsSize = _a === void 0 ? "medium" : _a, _b = props.sdsType, sdsType = _b === void 0 ? "primary" : _b;
|
|
4749
|
-
return css(templateObject_8$
|
|
4775
|
+
return 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));
|
|
4750
4776
|
});
|
|
4751
|
-
var templateObject_1$
|
|
4777
|
+
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;
|
|
4752
4778
|
|
|
4753
4779
|
var ButtonIconSizeToSdsIconSize = {
|
|
4754
4780
|
large: "xl",
|
|
@@ -4846,7 +4872,7 @@ var Button = React__default.forwardRef(function (props, ref) {
|
|
|
4846
4872
|
}
|
|
4847
4873
|
});
|
|
4848
4874
|
|
|
4849
|
-
var doNotForwardProps$
|
|
4875
|
+
var doNotForwardProps$C = [
|
|
4850
4876
|
"sdsStyle",
|
|
4851
4877
|
"intent",
|
|
4852
4878
|
"handleSubmit",
|
|
@@ -4857,39 +4883,39 @@ var rounded$3 = function (props) {
|
|
|
4857
4883
|
var _a;
|
|
4858
4884
|
var corners = getCorners(props);
|
|
4859
4885
|
var semanticColors = getSemanticColors(props);
|
|
4860
|
-
return css(templateObject_1$
|
|
4886
|
+
return 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 "])), outlinedInputClasses.root, corners === null || corners === void 0 ? void 0 : corners.l, 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);
|
|
4861
4887
|
};
|
|
4862
4888
|
var applyIntentColor$2 = function (props, intent) {
|
|
4863
4889
|
var _a, _b, _c, _d;
|
|
4864
4890
|
var semanticColors = getSemanticColors(props);
|
|
4865
4891
|
var borders = getBorders(props);
|
|
4866
|
-
return css(templateObject_2$
|
|
4892
|
+
return 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 "])), outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _a === void 0 ? void 0 : _a.default, outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _c === void 0 ? void 0 : _c.default, inputAdornmentClasses.root, buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _d === void 0 ? void 0 : _d.ornament);
|
|
4867
4893
|
};
|
|
4868
4894
|
var disabledStyled$2 = function (props) {
|
|
4869
4895
|
var _a, _b, _c, _d, _e;
|
|
4870
4896
|
var semanticColors = getSemanticColors(props);
|
|
4871
|
-
return css(templateObject_3$
|
|
4897
|
+
return 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 "])), outlinedInputClasses.disabled, outlinedInputClasses.notchedOutline, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryDisabled, inputAdornmentClasses.root, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentDisabled, outlinedInputClasses.notchedOutline, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderPrimaryDisabled, inputAdornmentClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentDisabled, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textDisabled);
|
|
4872
4898
|
};
|
|
4873
|
-
var StyledLabel$3 = styled$2("label")(templateObject_4$
|
|
4899
|
+
var StyledLabel$3 = styled$2("label")(templateObject_4$r || (templateObject_4$r = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyM$1, function (props) {
|
|
4874
4900
|
var spaces = getSpaces(props);
|
|
4875
4901
|
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 ");
|
|
4876
4902
|
});
|
|
4877
4903
|
var StyledSearchBase = styled$2(TextField, {
|
|
4878
4904
|
shouldForwardProp: function (prop) {
|
|
4879
|
-
return !doNotForwardProps$
|
|
4905
|
+
return !doNotForwardProps$C.includes(prop.toString());
|
|
4880
4906
|
},
|
|
4881
|
-
})(templateObject_6$
|
|
4907
|
+
})(templateObject_6$i || (templateObject_6$i = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4882
4908
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
4883
4909
|
var intent = props.intent, disabled = props.disabled, sdsStyle = props.sdsStyle;
|
|
4884
4910
|
var spaces = getSpaces(props);
|
|
4885
4911
|
var iconSizes = getIconSizes(props);
|
|
4886
4912
|
var semanticColors = getSemanticColors(props);
|
|
4887
|
-
return css(templateObject_5$
|
|
4913
|
+
return 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, outlinedInputClasses.root, spaces === null || spaces === void 0 ? void 0 : spaces.m, outlinedInputClasses.input, spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.m, 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, inputBaseClasses.inputSizeSmall, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.s, outlinedInputClasses.root, buttonBaseClasses.root, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.ornamentSecondaryHover, outlinedInputClasses.notchedOutline, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.borderPrimaryHover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _j === void 0 ? void 0 : _j.border, inputAdornmentClasses.root, buttonBaseClasses.root, (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _k === void 0 ? void 0 : _k.ornamentFocus, 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));
|
|
4888
4914
|
});
|
|
4889
|
-
var StyledInputAdornment = styled$2(InputAdornment)(templateObject_7$
|
|
4890
|
-
var templateObject_1$
|
|
4915
|
+
var StyledInputAdornment = styled$2(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"])));
|
|
4916
|
+
var templateObject_1$11, templateObject_2$G, templateObject_3$w, templateObject_4$r, templateObject_5$m, templateObject_6$i, templateObject_7$d;
|
|
4891
4917
|
|
|
4892
|
-
var StyledMenuItem$1 = styled$2(MenuItem$1)(templateObject_1$
|
|
4918
|
+
var StyledMenuItem$1 = styled$2(MenuItem$1)(templateObject_1$10 || (templateObject_1$10 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4893
4919
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
4894
4920
|
var selected = props.selected;
|
|
4895
4921
|
var fontWeights = getFontWeights(props);
|
|
@@ -4897,7 +4923,7 @@ var StyledMenuItem$1 = styled$2(MenuItem$1)(templateObject_1$V || (templateObjec
|
|
|
4897
4923
|
var semanticColors = getSemanticColors(props);
|
|
4898
4924
|
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(menuItemClasses.focusVisible, " {\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.fillHover, ";\n\n &[aria-selected=\"true\"] {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n }\n }\n }\n\n &.").concat(menuItemClasses.root, " .MuiSvgIcon-root {\n align-self: flex-start;\n }\n\n &.").concat(menuItemClasses.root, " .").concat(menuItemClasses.disabled, " {\n opacity: 1 !important;\n }\n\n &.MuiAutocomplete-option[aria-selected=\"true\"] {\n &: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 ");
|
|
4899
4925
|
});
|
|
4900
|
-
var ContentWrapper = styled$2("span")(templateObject_2$
|
|
4926
|
+
var ContentWrapper = styled$2("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"])));
|
|
4901
4927
|
var disabledStyles$2 = function (props) {
|
|
4902
4928
|
var _a;
|
|
4903
4929
|
var disabled = props.disabled;
|
|
@@ -4906,12 +4932,12 @@ var disabledStyles$2 = function (props) {
|
|
|
4906
4932
|
var semanticColors = getSemanticColors(props);
|
|
4907
4933
|
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 ");
|
|
4908
4934
|
};
|
|
4909
|
-
var TextWrapper = styled$2("span")(templateObject_3$
|
|
4935
|
+
var TextWrapper = styled$2("span")(templateObject_3$v || (templateObject_3$v = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
4910
4936
|
var _a;
|
|
4911
4937
|
var semanticColors = getSemanticColors(props);
|
|
4912
4938
|
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 ");
|
|
4913
4939
|
}, disabledStyles$2);
|
|
4914
|
-
var StyledMenuItemIcon = styled$2("span")(templateObject_4$
|
|
4940
|
+
var StyledMenuItemIcon = styled$2("span")(templateObject_4$q || (templateObject_4$q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4915
4941
|
var _a;
|
|
4916
4942
|
var disabled = props.disabled;
|
|
4917
4943
|
var spaces = getSpaces(props);
|
|
@@ -4919,20 +4945,20 @@ var StyledMenuItemIcon = styled$2("span")(templateObject_4$m || (templateObject_
|
|
|
4919
4945
|
var semanticColors = getSemanticColors(props);
|
|
4920
4946
|
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 ");
|
|
4921
4947
|
});
|
|
4922
|
-
var ColumnWrapper = styled$2("span")(templateObject_5$
|
|
4948
|
+
var ColumnWrapper = styled$2("span")(templateObject_5$l || (templateObject_5$l = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
4923
4949
|
var _a;
|
|
4924
4950
|
var semanticColors = getSemanticColors(props);
|
|
4925
4951
|
var spaces = getSpaces(props);
|
|
4926
4952
|
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 ");
|
|
4927
4953
|
}, disabledStyles$2);
|
|
4928
|
-
var StyledIconWrapper = styled$2("span")(templateObject_6$
|
|
4954
|
+
var StyledIconWrapper = styled$2("span")(templateObject_6$h || (templateObject_6$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4929
4955
|
var spaces = getSpaces(props);
|
|
4930
4956
|
var iconSizes = getIconSizes(props);
|
|
4931
4957
|
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 ");
|
|
4932
4958
|
});
|
|
4933
4959
|
var StyledCheck = styled$2(Check, {
|
|
4934
4960
|
shouldForwardProp: function (prop) { return prop !== "selected"; },
|
|
4935
|
-
})(templateObject_7$
|
|
4961
|
+
})(templateObject_7$c || (templateObject_7$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4936
4962
|
var _a, _b;
|
|
4937
4963
|
var selected = props.selected, disabled = props.disabled;
|
|
4938
4964
|
var iconSizes = getIconSizes(props);
|
|
@@ -4944,7 +4970,7 @@ var StyledCheck = styled$2(Check, {
|
|
|
4944
4970
|
});
|
|
4945
4971
|
var StyledMinus = styled$2(Remove, {
|
|
4946
4972
|
shouldForwardProp: function (prop) { return prop !== "selected"; },
|
|
4947
|
-
})(templateObject_8$
|
|
4973
|
+
})(templateObject_8$a || (templateObject_8$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4948
4974
|
var _a, _b;
|
|
4949
4975
|
var selected = props.selected, disabled = props.disabled;
|
|
4950
4976
|
var semanticColors = getSemanticColors(props);
|
|
@@ -4954,7 +4980,7 @@ var StyledMinus = styled$2(Remove, {
|
|
|
4954
4980
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.ornamentSelected;
|
|
4955
4981
|
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 ");
|
|
4956
4982
|
});
|
|
4957
|
-
var templateObject_1$
|
|
4983
|
+
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;
|
|
4958
4984
|
|
|
4959
4985
|
/**
|
|
4960
4986
|
* @see https://mui.com/material-ui/react-menu/
|
|
@@ -5116,7 +5142,7 @@ var InputSearch = forwardRef(function InputSearch(props, ref) {
|
|
|
5116
5142
|
autoComplete: "one-time-code" }, rest))] }));
|
|
5117
5143
|
});
|
|
5118
5144
|
|
|
5119
|
-
var doNotForwardProps$
|
|
5145
|
+
var doNotForwardProps$B = [
|
|
5120
5146
|
"count",
|
|
5121
5147
|
"keepSearchOnSelect",
|
|
5122
5148
|
"search",
|
|
@@ -5125,18 +5151,18 @@ var doNotForwardProps$u = [
|
|
|
5125
5151
|
"onClickAway",
|
|
5126
5152
|
];
|
|
5127
5153
|
var StyledAutocompleteBase = styled$2(Autocomplete$1, {
|
|
5128
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5129
|
-
})(templateObject_1
|
|
5154
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$B.includes(prop); },
|
|
5155
|
+
})(templateObject_1$$ || (templateObject_1$$ = __makeTemplateObject(["\n + .", "\n > .", "\n .", " {\n ", "\n }\n\n ", "\n"], ["\n + .", "\n > .", "\n .", " {\n ", "\n }\n\n ", "\n"])), autocompleteClasses.popper, autocompleteClasses.paper, autocompleteClasses.groupLabel, fontCapsXxxxs, function (props) {
|
|
5130
5156
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
5131
5157
|
var search = props.search;
|
|
5132
5158
|
var spaces = getSpaces(props);
|
|
5133
5159
|
var borders = getBorders(props);
|
|
5134
5160
|
var semanticColors = getSemanticColors(props);
|
|
5135
|
-
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.
|
|
5161
|
+
return "\n ".concat(!search && "height: 0; margin: 0 !important;", ";\n \n // (masoudmanson): We need to apply the focus styles to the input element\n // when the user is tabbing through the options. To find out more, take a\n // look at the useDetectUserTabbing hook.\n &[data-user-is-tabbing=\"true\"]:focus-within {\n border-radius: 4px;\n outline: 2px solid ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryHover, ";\n outline-offset: 1px;\n }\n\n .MuiFormControl-root {\n outline: none;\n }\n\n .MuiOutlinedInput-root.MuiInputBase-formControl.MuiInputBase-adornedEnd {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n\n .MuiAutocomplete-input {\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n }\n }\n\n & + .").concat(autocompleteClasses.popper, " > .").concat(autocompleteClasses.paper, " {\n .").concat(autocompleteClasses.listbox, " {\n max-height: 40vh;\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0;\n\n .").concat(autocompleteClasses.option, " {\n min-height: unset;\n\n &.").concat(autocompleteClasses.focused, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n }\n\n &[aria-selected=\"true\"] {\n background-color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.surface, ";\n }\n\n &[aria-disabled=\"true\"] {\n opacity: 1;\n }\n\n &[aria-selected=\"true\"].").concat(autocompleteClasses.focused, " {\n background-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.fillHover, ";\n }\n }\n\n & > li:last-child .").concat(autocompleteClasses.groupUl, " {\n border-bottom: none;\n margin-bottom: 0;\n padding-bottom: 0;\n }\n }\n\n .").concat(autocompleteClasses.groupLabel, " {\n top: 0;\n color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textSecondary, ";\n background-color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.surface, ";\n padding: ").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(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(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(autocompleteClasses.loading, " {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0;\n }\n }\n ");
|
|
5136
5162
|
});
|
|
5137
5163
|
var InputBaseWrapper$1 = styled$2("div", {
|
|
5138
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5139
|
-
})(templateObject_2$
|
|
5164
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$B.includes(prop); },
|
|
5165
|
+
})(templateObject_2$E || (templateObject_2$E = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5140
5166
|
var search = props.search;
|
|
5141
5167
|
if (!search) {
|
|
5142
5168
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -5146,12 +5172,12 @@ var InputBaseWrapper$1 = styled$2("div", {
|
|
|
5146
5172
|
}
|
|
5147
5173
|
});
|
|
5148
5174
|
var StyledMenuInputSearch$1 = styled$2(InputSearch, {
|
|
5149
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5150
|
-
})(templateObject_3$
|
|
5175
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$B.includes(prop); },
|
|
5176
|
+
})(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) {
|
|
5151
5177
|
var search = _a.search;
|
|
5152
5178
|
return (search ? "auto" : "transparent");
|
|
5153
5179
|
});
|
|
5154
|
-
var StyledPaper$3 = styled$2(Paper)(templateObject_4$
|
|
5180
|
+
var StyledPaper$3 = styled$2(Paper)(templateObject_4$p || (templateObject_4$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5155
5181
|
var _a;
|
|
5156
5182
|
var spaces = getSpaces(props);
|
|
5157
5183
|
var corners = getCorners(props);
|
|
@@ -5160,13 +5186,13 @@ var StyledPaper$3 = styled$2(Paper)(templateObject_4$l || (templateObject_4$l =
|
|
|
5160
5186
|
var semanticColors = getSemanticColors(props);
|
|
5161
5187
|
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 ");
|
|
5162
5188
|
});
|
|
5163
|
-
var StyledMenuItemDetails = styled$2("div")(templateObject_5$
|
|
5189
|
+
var StyledMenuItemDetails = styled$2("div")(templateObject_5$k || (templateObject_5$k = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
5164
5190
|
var _a;
|
|
5165
5191
|
var semanticColors = getSemanticColors(props);
|
|
5166
5192
|
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 ");
|
|
5167
5193
|
});
|
|
5168
|
-
var StyledMenuItemText = styled$2("div")(templateObject_6$
|
|
5169
|
-
var templateObject_1
|
|
5194
|
+
var StyledMenuItemText = styled$2("div")(templateObject_6$g || (templateObject_6$g = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
5195
|
+
var templateObject_1$$, templateObject_2$E, templateObject_3$u, templateObject_4$p, templateObject_5$k, templateObject_6$g;
|
|
5170
5196
|
|
|
5171
5197
|
var AutocompleteBase = function (props) {
|
|
5172
5198
|
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;
|
|
@@ -5327,27 +5353,27 @@ var AutocompleteBase = function (props) {
|
|
|
5327
5353
|
}
|
|
5328
5354
|
};
|
|
5329
5355
|
|
|
5330
|
-
var StyledColumn = styled$2("div")(templateObject_1$
|
|
5356
|
+
var StyledColumn = styled$2("div")(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5331
5357
|
var _a;
|
|
5332
5358
|
var _b = props.width, width = _b === void 0 ? 280 : _b;
|
|
5333
5359
|
var spaces = getSpaces(props);
|
|
5334
5360
|
var borders = getBorders(props);
|
|
5335
5361
|
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 ");
|
|
5336
5362
|
});
|
|
5337
|
-
var StyledColumnTitle = styled$2("p")(templateObject_2$
|
|
5363
|
+
var StyledColumnTitle = styled$2("p")(templateObject_2$D || (templateObject_2$D = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontCapsXxxxs, function (props) {
|
|
5338
5364
|
var _a;
|
|
5339
5365
|
var spaces = getSpaces(props);
|
|
5340
5366
|
var semanticColors = getSemanticColors(props);
|
|
5341
5367
|
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 ");
|
|
5342
5368
|
});
|
|
5343
|
-
var StyledColumnIcon = styled$2("span")(templateObject_3$
|
|
5369
|
+
var StyledColumnIcon = styled$2("span")(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5344
5370
|
var _a, _b;
|
|
5345
5371
|
var spaces = getSpaces(props);
|
|
5346
5372
|
var iconSizes = getIconSizes(props);
|
|
5347
5373
|
var semanticColors = getSemanticColors(props);
|
|
5348
5374
|
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 ");
|
|
5349
5375
|
});
|
|
5350
|
-
var templateObject_1$
|
|
5376
|
+
var templateObject_1$_, templateObject_2$D, templateObject_3$t;
|
|
5351
5377
|
|
|
5352
5378
|
var AutocompleteGroup = function (props) {
|
|
5353
5379
|
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"]);
|
|
@@ -5387,7 +5413,7 @@ var AutocompleteGroup = function (props) {
|
|
|
5387
5413
|
}
|
|
5388
5414
|
};
|
|
5389
5415
|
|
|
5390
|
-
var doNotForwardProps$
|
|
5416
|
+
var doNotForwardProps$A = [
|
|
5391
5417
|
"anchorEl",
|
|
5392
5418
|
"count",
|
|
5393
5419
|
"keepSearchOnSelect",
|
|
@@ -5400,9 +5426,9 @@ var doNotForwardProps$t = [
|
|
|
5400
5426
|
];
|
|
5401
5427
|
var StyledPopper$2 = styled$2(Popper, {
|
|
5402
5428
|
shouldForwardProp: function (prop) {
|
|
5403
|
-
return !doNotForwardProps$
|
|
5429
|
+
return !doNotForwardProps$A.includes(prop) || prop === "anchorEl";
|
|
5404
5430
|
},
|
|
5405
|
-
})(templateObject_1$
|
|
5431
|
+
})(templateObject_1$Z || (templateObject_1$Z = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5406
5432
|
var _a;
|
|
5407
5433
|
var corners = getCorners(props);
|
|
5408
5434
|
var shadows = getShadows(props);
|
|
@@ -5412,24 +5438,24 @@ var StyledPopper$2 = styled$2(Popper, {
|
|
|
5412
5438
|
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(autocompleteClasses.popper, ".").concat(autocompleteClasses.popperDisablePortal, " {\n position: relative !important;\n transform: none !important;\n \n .MuiPaper-root .").concat(autocompleteClasses.listbox, " {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0;\n }\n }\n ");
|
|
5413
5439
|
});
|
|
5414
5440
|
var StyledPaper$2 = styled$2(Paper, {
|
|
5415
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5416
|
-
})(templateObject_2$
|
|
5441
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$A.includes(prop); },
|
|
5442
|
+
})(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5417
5443
|
var _a;
|
|
5418
5444
|
var shadows = getShadows(props);
|
|
5419
5445
|
var semanticColors = getSemanticColors(props);
|
|
5420
5446
|
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 ");
|
|
5421
5447
|
});
|
|
5422
|
-
var StyledAutocompleteGroupWrapper = styled$2("div")(templateObject_3$
|
|
5448
|
+
var StyledAutocompleteGroupWrapper = styled$2("div")(templateObject_3$s || (templateObject_3$s = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
5423
5449
|
var StyledAutocompleteInput = styled$2(InputSearch, {
|
|
5424
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5425
|
-
})(templateObject_4$
|
|
5450
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$A.includes(prop); },
|
|
5451
|
+
})(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) {
|
|
5426
5452
|
var search = _a.search;
|
|
5427
5453
|
return !search && "height: 0; display: none; margin: 0 !important;";
|
|
5428
5454
|
}, function (_a) {
|
|
5429
5455
|
var search = _a.search;
|
|
5430
5456
|
return (search ? "auto" : "transparent");
|
|
5431
5457
|
});
|
|
5432
|
-
var templateObject_1$
|
|
5458
|
+
var templateObject_1$Z, templateObject_2$C, templateObject_3$s, templateObject_4$o;
|
|
5433
5459
|
|
|
5434
5460
|
var AutocompleteMultiColumn = function (props) {
|
|
5435
5461
|
var _a;
|
|
@@ -5611,13 +5637,13 @@ var Autocomplete = function (props) {
|
|
|
5611
5637
|
}
|
|
5612
5638
|
};
|
|
5613
5639
|
|
|
5614
|
-
var Centered = styled$2("div")(templateObject_1$
|
|
5640
|
+
var Centered = styled$2("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"])));
|
|
5615
5641
|
var doNotForwardPropsIconWrapper = ["bannerType"];
|
|
5616
5642
|
var IconWrapper$1 = styled$2("div", {
|
|
5617
5643
|
shouldForwardProp: function (prop) {
|
|
5618
5644
|
return !doNotForwardPropsIconWrapper.includes(prop);
|
|
5619
5645
|
},
|
|
5620
|
-
})(templateObject_2$
|
|
5646
|
+
})(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5621
5647
|
var _a, _b;
|
|
5622
5648
|
var bannerType = props.bannerType;
|
|
5623
5649
|
var iconSizes = getIconSizes(props);
|
|
@@ -5630,7 +5656,7 @@ var StyledButton$2 = styled$2(Button, {
|
|
|
5630
5656
|
shouldForwardProp: function (prop) {
|
|
5631
5657
|
return !doNotForwardPropsButtonIcon.includes(prop);
|
|
5632
5658
|
},
|
|
5633
|
-
})(templateObject_3$
|
|
5659
|
+
})(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) {
|
|
5634
5660
|
var _a, _b;
|
|
5635
5661
|
var bannerType = props.bannerType;
|
|
5636
5662
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5638,7 +5664,7 @@ var StyledButton$2 = styled$2(Button, {
|
|
|
5638
5664
|
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 ");
|
|
5639
5665
|
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 ");
|
|
5640
5666
|
});
|
|
5641
|
-
styled$2("div")(templateObject_4$
|
|
5667
|
+
styled$2("div")(templateObject_4$n || (templateObject_4$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), fontBodyS$1);
|
|
5642
5668
|
var primary$1 = function (props) {
|
|
5643
5669
|
var _a, _b;
|
|
5644
5670
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5649,15 +5675,15 @@ var secondary$1 = function (props) {
|
|
|
5649
5675
|
var semanticColors = getSemanticColors(props);
|
|
5650
5676
|
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 ");
|
|
5651
5677
|
};
|
|
5652
|
-
var doNotForwardProps$
|
|
5678
|
+
var doNotForwardProps$z = ["sdsType", "textChild"];
|
|
5653
5679
|
var StyledBanner = styled$2("div", {
|
|
5654
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5655
|
-
})(templateObject_5$
|
|
5680
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$z.includes(prop); },
|
|
5681
|
+
})(templateObject_5$j || (templateObject_5$j = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
5656
5682
|
var sdsType = props.sdsType;
|
|
5657
5683
|
var spaces = getSpaces(props);
|
|
5658
5684
|
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 ");
|
|
5659
5685
|
});
|
|
5660
|
-
var templateObject_1$
|
|
5686
|
+
var templateObject_1$Y, templateObject_2$B, templateObject_3$r, templateObject_4$n, templateObject_5$j;
|
|
5661
5687
|
|
|
5662
5688
|
var Banner = forwardRef(function Banner(props, ref) {
|
|
5663
5689
|
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"]);
|
|
@@ -5720,16 +5746,16 @@ var ButtonDropdown = React__default.forwardRef(function (props, ref) {
|
|
|
5720
5746
|
* All other props should be passed down to ButtonIcon; otherwise,
|
|
5721
5747
|
* the component won’t function as expected.
|
|
5722
5748
|
*/
|
|
5723
|
-
var doNotForwardProps$
|
|
5749
|
+
var doNotForwardProps$y = ["sdsStage"];
|
|
5724
5750
|
var StyledButtonToggle = styled$2(ButtonIcon, {
|
|
5725
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5726
|
-
})(templateObject_1$
|
|
5751
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$y.includes(prop); },
|
|
5752
|
+
})(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5727
5753
|
var _a;
|
|
5728
5754
|
var sdsStage = props.sdsStage;
|
|
5729
5755
|
var semanticColors = getSemanticColors(props);
|
|
5730
5756
|
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 ");
|
|
5731
5757
|
});
|
|
5732
|
-
var templateObject_1$
|
|
5758
|
+
var templateObject_1$X;
|
|
5733
5759
|
|
|
5734
5760
|
/**
|
|
5735
5761
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -5745,7 +5771,7 @@ var ButtonToggle = React__default.forwardRef(function (props, ref) {
|
|
|
5745
5771
|
}
|
|
5746
5772
|
});
|
|
5747
5773
|
|
|
5748
|
-
var doNotForwardProps$
|
|
5774
|
+
var doNotForwardProps$x = [
|
|
5749
5775
|
"calloutTitle",
|
|
5750
5776
|
"collapsed",
|
|
5751
5777
|
"severity",
|
|
@@ -5753,8 +5779,8 @@ var doNotForwardProps$q = [
|
|
|
5753
5779
|
"hideBody",
|
|
5754
5780
|
];
|
|
5755
5781
|
var StyledCallout = styled$2(Alert$2, {
|
|
5756
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5757
|
-
})(templateObject_1$
|
|
5782
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$x.includes(prop); },
|
|
5783
|
+
})(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5758
5784
|
var _a, _b, _c, _d, _e;
|
|
5759
5785
|
var _f = props.intent, intent = _f === void 0 ? "info" : _f, sdsStyle = props.sdsStyle, hideBody = props.hideBody, collapsed = props.collapsed;
|
|
5760
5786
|
var spaces = getSpaces(props);
|
|
@@ -5766,12 +5792,12 @@ var StyledCallout = styled$2(Alert$2, {
|
|
|
5766
5792
|
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";
|
|
5767
5793
|
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(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(alertClasses.message, " {\n width: 100%;\n padding: 0;\n margin: 0;\n\n .").concat(alertTitleClasses.root, " {\n margin: 0;\n }\n }\n\n .").concat(alertClasses.action, " {\n display: ").concat(sdsStyle === "persistent" ? "none" : "block", ";\n margin: 0 0 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n padding: 0;\n align-items: flex-start;\n\n > button {\n padding: 0;\n }\n }\n ");
|
|
5768
5794
|
});
|
|
5769
|
-
var templateObject_1$
|
|
5795
|
+
var templateObject_1$W;
|
|
5770
5796
|
|
|
5771
5797
|
var CALLOUT_TITLE_DISPLAY_NAME = "CalloutTitle";
|
|
5772
5798
|
|
|
5773
|
-
var StyledCalloutTitle = styled$2(AlertTitle)(templateObject_1$
|
|
5774
|
-
var templateObject_1$
|
|
5799
|
+
var StyledCalloutTitle = styled$2(AlertTitle)(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n ", "\n margin: 0;\n"], ["\n ", "\n margin: 0;\n"])), fontBodySemiboldXs);
|
|
5800
|
+
var templateObject_1$V;
|
|
5775
5801
|
|
|
5776
5802
|
var CalloutTitle = function (_a) {
|
|
5777
5803
|
var children = _a.children;
|
|
@@ -5780,24 +5806,24 @@ var CalloutTitle = function (_a) {
|
|
|
5780
5806
|
// Display name required to ensure Callout expand works correctly.
|
|
5781
5807
|
CalloutTitle.displayName = CALLOUT_TITLE_DISPLAY_NAME;
|
|
5782
5808
|
|
|
5783
|
-
var StyledCalloutBody = styled$2("p")(templateObject_1$
|
|
5809
|
+
var StyledCalloutBody = styled$2("p")(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5784
5810
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a;
|
|
5785
5811
|
var spaces = getSpaces(props);
|
|
5786
5812
|
return "\n margin: ".concat(!hideTitle ? spaces === null || spaces === void 0 ? void 0 : spaces.xs : 0, "px 0 0 0;\n ");
|
|
5787
5813
|
});
|
|
5788
|
-
var templateObject_1$
|
|
5814
|
+
var templateObject_1$U;
|
|
5789
5815
|
|
|
5790
5816
|
var CalloutBody = function (_a) {
|
|
5791
5817
|
var children = _a.children, hideTitle = _a.hideTitle;
|
|
5792
5818
|
return (jsx(StyledCalloutBody, { hideTitle: hideTitle, children: children }));
|
|
5793
5819
|
};
|
|
5794
5820
|
|
|
5795
|
-
var StyledCalloutExtraContent = styled$2("div")(templateObject_1$
|
|
5821
|
+
var StyledCalloutExtraContent = styled$2("div")(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5796
5822
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a, _b = props.hideBody, hideBody = _b === void 0 ? false : _b;
|
|
5797
5823
|
var spaces = getSpaces(props);
|
|
5798
5824
|
return "\n margin: ".concat(hideTitle && hideBody ? 0 : spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0 0;\n ");
|
|
5799
5825
|
});
|
|
5800
|
-
var templateObject_1$
|
|
5826
|
+
var templateObject_1$T;
|
|
5801
5827
|
|
|
5802
5828
|
var CalloutExtraContent = function (_a) {
|
|
5803
5829
|
var children = _a.children, hideTitle = _a.hideTitle, hideBody = _a.hideBody;
|
|
@@ -5866,25 +5892,25 @@ var dark$1 = function (props) {
|
|
|
5866
5892
|
var _a, _b;
|
|
5867
5893
|
var spaces = getSpaces(props);
|
|
5868
5894
|
var semanticColors = getSemanticColors(props);
|
|
5869
|
-
return css$1(templateObject_1$
|
|
5895
|
+
return css$1(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);
|
|
5870
5896
|
};
|
|
5871
5897
|
var light$1 = function (props) {
|
|
5872
5898
|
var _a, _b;
|
|
5873
5899
|
var spaces = getSpaces(props);
|
|
5874
5900
|
var semanticColors = getSemanticColors(props);
|
|
5875
|
-
return css$1(templateObject_2$
|
|
5901
|
+
return css$1(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);
|
|
5876
5902
|
};
|
|
5877
5903
|
var wide = function () {
|
|
5878
|
-
return css$1(templateObject_3$
|
|
5904
|
+
return css$1(templateObject_3$q || (templateObject_3$q = __makeTemplateObject(["\n max-width: 550px;\n "], ["\n max-width: 550px;\n "])));
|
|
5879
5905
|
};
|
|
5880
5906
|
var tableStyles = function (props) {
|
|
5881
5907
|
var spaces = getSpaces(props);
|
|
5882
|
-
return css$1(templateObject_4$
|
|
5908
|
+
return css$1(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n padding: ", "px;\n "], ["\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
5883
5909
|
};
|
|
5884
|
-
var doNotForwardProps$
|
|
5910
|
+
var doNotForwardProps$w = ["hasInvertedStyle"];
|
|
5885
5911
|
var Subtitle$1 = styled$2("div", {
|
|
5886
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5887
|
-
})(templateObject_5$
|
|
5912
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$w.includes(prop); },
|
|
5913
|
+
})(templateObject_5$i || (templateObject_5$i = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
5888
5914
|
var _a, _b;
|
|
5889
5915
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
5890
5916
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5893,7 +5919,7 @@ var Subtitle$1 = styled$2("div", {
|
|
|
5893
5919
|
var tooltipCss = function (props) {
|
|
5894
5920
|
var _a = props.hasInvertedStyle, hasInvertedStyle = _a === void 0 ? true : _a, inverted = props.inverted, sdsStyle = props.sdsStyle, width = props.width, followCursor = props.followCursor;
|
|
5895
5921
|
var shadows = getShadows(props);
|
|
5896
|
-
return css$1(templateObject_6$
|
|
5922
|
+
return css$1(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
|
|
5897
5923
|
? dark$1(props)
|
|
5898
5924
|
: light$1(props), width === "wide" && sdsStyle === "light" && wide(), followCursor === true && tableStyles(props));
|
|
5899
5925
|
};
|
|
@@ -5901,7 +5927,7 @@ var arrowCss = function (props) {
|
|
|
5901
5927
|
var _a, _b;
|
|
5902
5928
|
var hasInvertedStyle = props.hasInvertedStyle, inverted = props.inverted, sdsStyle = props.sdsStyle, arrowOffset = props.arrowOffset;
|
|
5903
5929
|
var semanticColors = getSemanticColors(props);
|
|
5904
|
-
return css$1(templateObject_7$
|
|
5930
|
+
return css$1(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"
|
|
5905
5931
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfaceInverse
|
|
5906
5932
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.surface);
|
|
5907
5933
|
};
|
|
@@ -5909,8 +5935,8 @@ var arrowCss = function (props) {
|
|
|
5909
5935
|
* (masoudmanson): !important is needed to override arrow's
|
|
5910
5936
|
* default placement which is calculated by javascript
|
|
5911
5937
|
*/
|
|
5912
|
-
var StyledPopper$1 = styled$2(Popper)(templateObject_8$
|
|
5913
|
-
var templateObject_1$
|
|
5938
|
+
var StyledPopper$1 = styled$2(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"])));
|
|
5939
|
+
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;
|
|
5914
5940
|
|
|
5915
5941
|
/**
|
|
5916
5942
|
* @see https://mui.com/material-ui/react-tooltip/
|
|
@@ -5987,7 +6013,7 @@ function mergeClass$1(_a) {
|
|
|
5987
6013
|
return propClassName ? "".concat(propClassName, " ").concat(className) : className;
|
|
5988
6014
|
}
|
|
5989
6015
|
|
|
5990
|
-
var doNotForwardProps$
|
|
6016
|
+
var doNotForwardProps$v = [
|
|
5991
6017
|
"icon",
|
|
5992
6018
|
"iconVerticalAlign",
|
|
5993
6019
|
"horizontalAlign",
|
|
@@ -6015,8 +6041,8 @@ var verticalAlignToFlexMap = {
|
|
|
6015
6041
|
top: "flex-start",
|
|
6016
6042
|
};
|
|
6017
6043
|
var StyledTableData = styled$2("td", {
|
|
6018
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6019
|
-
})(templateObject_1$
|
|
6044
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6045
|
+
})(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
6020
6046
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6021
6047
|
var spaces = getSpaces(props);
|
|
6022
6048
|
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 ");
|
|
@@ -6027,30 +6053,30 @@ var ShouldWrap = function (lineCount) {
|
|
|
6027
6053
|
var ShouldTruncate = function () {
|
|
6028
6054
|
return "\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n ";
|
|
6029
6055
|
};
|
|
6030
|
-
var StyledCellContent = styled$2("div")(templateObject_2$
|
|
6031
|
-
var StyledCellContentWrapper = styled$2("div")(templateObject_3$
|
|
6056
|
+
var StyledCellContent = styled$2("div")(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
6057
|
+
var StyledCellContentWrapper = styled$2("div")(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
6032
6058
|
var StyledCellIconWrapper = styled$2("div", {
|
|
6033
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6034
|
-
})(templateObject_4$
|
|
6059
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6060
|
+
})(templateObject_4$l || (templateObject_4$l = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6035
6061
|
var _a = props.iconVerticalAlign, iconVerticalAlign = _a === void 0 ? "top" : _a;
|
|
6036
6062
|
var spaces = getSpaces(props);
|
|
6037
6063
|
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 ");
|
|
6038
6064
|
});
|
|
6039
|
-
var PrimaryTextWrapper = styled$2("div")(templateObject_5$
|
|
6065
|
+
var PrimaryTextWrapper = styled$2("div")(templateObject_5$h || (templateObject_5$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6040
6066
|
var horizontalAlign = props.horizontalAlign;
|
|
6041
6067
|
return "\n display: flex;\n justify-content: ".concat(horizontalAlign === "left" ? "flex-start" : "flex-end", ";\n ");
|
|
6042
6068
|
});
|
|
6043
6069
|
var PrimaryText = styled$2("div", {
|
|
6044
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6045
|
-
})(templateObject_6$
|
|
6070
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6071
|
+
})(templateObject_6$e || (templateObject_6$e = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6046
6072
|
var _a = props.primaryTextWrapLineCount, primaryTextWrapLineCount = _a === void 0 ? 3 : _a;
|
|
6047
6073
|
return "\n display: block;\n ".concat(props.shouldTextWrap
|
|
6048
6074
|
? ShouldWrap(primaryTextWrapLineCount)
|
|
6049
6075
|
: ShouldTruncate(), "\n ");
|
|
6050
6076
|
});
|
|
6051
6077
|
var SecondaryText = styled$2("span", {
|
|
6052
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6053
|
-
})(templateObject_7$
|
|
6078
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6079
|
+
})(templateObject_7$a || (templateObject_7$a = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6054
6080
|
var _a;
|
|
6055
6081
|
var _b = props.secondaryTextWrapLineCount, secondaryTextWrapLineCount = _b === void 0 ? 1 : _b;
|
|
6056
6082
|
var spaces = getSpaces(props);
|
|
@@ -6060,8 +6086,8 @@ var SecondaryText = styled$2("span", {
|
|
|
6060
6086
|
: ShouldTruncate(), "\n ");
|
|
6061
6087
|
});
|
|
6062
6088
|
var TertiaryText = styled$2("span", {
|
|
6063
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6064
|
-
})(templateObject_8$
|
|
6089
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6090
|
+
})(templateObject_8$8 || (templateObject_8$8 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6065
6091
|
var _a;
|
|
6066
6092
|
var _b = props.tertiaryTextWrapLineCount, tertiaryTextWrapLineCount = _b === void 0 ? 1 : _b;
|
|
6067
6093
|
var spaces = getSpaces(props);
|
|
@@ -6070,15 +6096,15 @@ var TertiaryText = styled$2("span", {
|
|
|
6070
6096
|
? ShouldWrap(tertiaryTextWrapLineCount)
|
|
6071
6097
|
: ShouldTruncate(), "\n ");
|
|
6072
6098
|
});
|
|
6073
|
-
var PrimaryTextComponentSlotBottomWrapper = styled$2("div")(templateObject_9$
|
|
6099
|
+
var PrimaryTextComponentSlotBottomWrapper = styled$2("div")(templateObject_9$5 || (templateObject_9$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6074
6100
|
var spaces = getSpaces(props);
|
|
6075
6101
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
6076
6102
|
});
|
|
6077
|
-
var PrimaryTextComponentSlotRightWrapper = styled$2("div")(templateObject_10$
|
|
6103
|
+
var PrimaryTextComponentSlotRightWrapper = styled$2("div")(templateObject_10$4 || (templateObject_10$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6078
6104
|
var spaces = getSpaces(props);
|
|
6079
6105
|
return "\n margin-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
6080
6106
|
});
|
|
6081
|
-
var templateObject_1$
|
|
6107
|
+
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;
|
|
6082
6108
|
|
|
6083
6109
|
var CellBasicContent = function (props) {
|
|
6084
6110
|
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;
|
|
@@ -6092,15 +6118,15 @@ var CellBasic = forwardRef(function (props, ref) {
|
|
|
6092
6118
|
return (jsx(StyledTableData, __assign({ ref: ref }, props, { children: jsx(CellBasicContent, __assign({}, props)) })));
|
|
6093
6119
|
});
|
|
6094
6120
|
|
|
6095
|
-
var doNotForwardProps$
|
|
6121
|
+
var doNotForwardProps$u = ["horizontalAlign", "verticalAlign"];
|
|
6096
6122
|
var StyledCellComponentData = styled$2("td", {
|
|
6097
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6098
|
-
})(templateObject_1$
|
|
6123
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6124
|
+
})(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
6099
6125
|
var spaces = getSpaces(props);
|
|
6100
6126
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6101
6127
|
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 ");
|
|
6102
6128
|
});
|
|
6103
|
-
var templateObject_1$
|
|
6129
|
+
var templateObject_1$Q;
|
|
6104
6130
|
|
|
6105
6131
|
var CellComponent = forwardRef(function (props, _) {
|
|
6106
6132
|
var children = props.children;
|
|
@@ -6112,7 +6138,7 @@ var contentPositionMapping = {
|
|
|
6112
6138
|
left: "flex-start",
|
|
6113
6139
|
right: "flex-end",
|
|
6114
6140
|
};
|
|
6115
|
-
var doNotForwardProps$
|
|
6141
|
+
var doNotForwardProps$t = [
|
|
6116
6142
|
"active",
|
|
6117
6143
|
"horizontalAlign",
|
|
6118
6144
|
"shouldShowTooltipOnHover",
|
|
@@ -6122,8 +6148,8 @@ var doNotForwardProps$m = [
|
|
|
6122
6148
|
"hover",
|
|
6123
6149
|
];
|
|
6124
6150
|
var StyledSortingIcon = styled$2(Icon, {
|
|
6125
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6126
|
-
})(templateObject_1$
|
|
6151
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$t.includes(prop); },
|
|
6152
|
+
})(templateObject_1$P || (templateObject_1$P = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6127
6153
|
var _a;
|
|
6128
6154
|
var _b = props.active, active = _b === void 0 ? false : _b, hideSortIcon = props.hideSortIcon;
|
|
6129
6155
|
var spaces = getSpaces(props);
|
|
@@ -6131,8 +6157,8 @@ var StyledSortingIcon = styled$2(Icon, {
|
|
|
6131
6157
|
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 ");
|
|
6132
6158
|
});
|
|
6133
6159
|
var StyledTableHeader$1 = styled$2("th", {
|
|
6134
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6135
|
-
})(templateObject_2$
|
|
6160
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$t.includes(prop); },
|
|
6161
|
+
})(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontHeaderS, focusVisibleA11yStyle, function (props) {
|
|
6136
6162
|
var _a, _b, _c, _d, _e, _f;
|
|
6137
6163
|
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;
|
|
6138
6164
|
var spaces = getSpaces(props);
|
|
@@ -6146,12 +6172,12 @@ var StyledTableHeader$1 = styled$2("th", {
|
|
|
6146
6172
|
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 ");
|
|
6147
6173
|
});
|
|
6148
6174
|
var StyledCellHeaderContainer = styled$2("div", {
|
|
6149
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6150
|
-
})(templateObject_3$
|
|
6175
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$t.includes(prop); },
|
|
6176
|
+
})(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6151
6177
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a;
|
|
6152
6178
|
return "\n align-items: flex-end;\n width: 100%;\n display: flex;\n justify-content: ".concat(horizontalAlign ? contentPositionMapping[horizontalAlign] : "flex-start", ";\n ");
|
|
6153
6179
|
});
|
|
6154
|
-
var templateObject_1$
|
|
6180
|
+
var templateObject_1$P, templateObject_2$y, templateObject_3$o;
|
|
6155
6181
|
|
|
6156
6182
|
var CellHeaderContent = function (props) {
|
|
6157
6183
|
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;
|
|
@@ -6171,20 +6197,20 @@ var CellHeader = forwardRef(function (props, ref) {
|
|
|
6171
6197
|
|
|
6172
6198
|
var small = function (props) {
|
|
6173
6199
|
var spaces = getSpaces(props);
|
|
6174
|
-
return css(templateObject_1$
|
|
6200
|
+
return 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));
|
|
6175
6201
|
};
|
|
6176
6202
|
var medium = function (props) {
|
|
6177
6203
|
var spaces = getSpaces(props);
|
|
6178
6204
|
var colors = getColors(props);
|
|
6179
|
-
return css(templateObject_2$
|
|
6205
|
+
return 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);
|
|
6180
6206
|
};
|
|
6181
6207
|
var rounded$2 = function (props) {
|
|
6182
6208
|
var corners = getCorners(props);
|
|
6183
|
-
return css(templateObject_3$
|
|
6209
|
+
return 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);
|
|
6184
6210
|
};
|
|
6185
6211
|
var square$2 = function (props) {
|
|
6186
6212
|
var corners = getCorners(props);
|
|
6187
|
-
return css(templateObject_4$
|
|
6213
|
+
return 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);
|
|
6188
6214
|
};
|
|
6189
6215
|
var success = function (props) {
|
|
6190
6216
|
return createStatusCss(props, "success");
|
|
@@ -6237,7 +6263,7 @@ function createStatusCss(props, status) {
|
|
|
6237
6263
|
},
|
|
6238
6264
|
};
|
|
6239
6265
|
var statusColors = statusToColors[status];
|
|
6240
|
-
return css(templateObject_5$
|
|
6266
|
+
return 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);
|
|
6241
6267
|
}
|
|
6242
6268
|
var statusToCss = {
|
|
6243
6269
|
beta: beta,
|
|
@@ -6247,14 +6273,14 @@ var statusToCss = {
|
|
|
6247
6273
|
success: success,
|
|
6248
6274
|
warning: warning,
|
|
6249
6275
|
};
|
|
6250
|
-
var doNotForwardProps$
|
|
6276
|
+
var doNotForwardProps$s = ["isRounded"];
|
|
6251
6277
|
var StyledChip = styled$2(Chip$1, {
|
|
6252
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6253
|
-
})(templateObject_7$
|
|
6278
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$s.includes(prop); },
|
|
6279
|
+
})(templateObject_7$9 || (templateObject_7$9 = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
6254
6280
|
var size = props.size, status = props.status, isRounded = props.isRounded;
|
|
6255
|
-
return css(templateObject_6$
|
|
6281
|
+
return 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));
|
|
6256
6282
|
});
|
|
6257
|
-
var templateObject_1$
|
|
6283
|
+
var templateObject_1$O, templateObject_2$x, templateObject_3$n, templateObject_4$k, templateObject_5$g, templateObject_6$d, templateObject_7$9;
|
|
6258
6284
|
|
|
6259
6285
|
/**
|
|
6260
6286
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6272,7 +6298,7 @@ var Chip = function (props) {
|
|
|
6272
6298
|
return jsx(StyledChip, __assign({}, props));
|
|
6273
6299
|
};
|
|
6274
6300
|
|
|
6275
|
-
var doNotForwardProps$
|
|
6301
|
+
var doNotForwardProps$r = [
|
|
6276
6302
|
"anchorEl",
|
|
6277
6303
|
"count",
|
|
6278
6304
|
"keepSearchOnSelect",
|
|
@@ -6286,19 +6312,19 @@ var doNotForwardProps$k = [
|
|
|
6286
6312
|
"isMultiColumn",
|
|
6287
6313
|
];
|
|
6288
6314
|
var StyledHeaderTitle = styled$2("div", {
|
|
6289
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6290
|
-
})(templateObject_1$
|
|
6315
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
6316
|
+
})(templateObject_1$N || (templateObject_1$N = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderXs, function (props) {
|
|
6291
6317
|
var _a;
|
|
6292
6318
|
var spaces = getSpaces(props);
|
|
6293
6319
|
var semanticColors = getSemanticColors(props);
|
|
6294
6320
|
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 ");
|
|
6295
6321
|
});
|
|
6296
|
-
var StyledDropdownMenuAutocompleteWrapper = styled$2("div")(templateObject_2$
|
|
6322
|
+
var StyledDropdownMenuAutocompleteWrapper = styled$2("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"])), autocompleteClasses.popper, autocompleteClasses.paper);
|
|
6297
6323
|
var StyledPopper = styled$2(Popper, {
|
|
6298
6324
|
shouldForwardProp: function (prop) {
|
|
6299
|
-
return !doNotForwardProps$
|
|
6325
|
+
return !doNotForwardProps$r.includes(prop) || prop === "anchorEl";
|
|
6300
6326
|
},
|
|
6301
|
-
})(templateObject_3$
|
|
6327
|
+
})(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6302
6328
|
var _a;
|
|
6303
6329
|
var borders = getBorders(props);
|
|
6304
6330
|
var corners = getCorners(props);
|
|
@@ -6307,8 +6333,8 @@ var StyledPopper = styled$2(Popper, {
|
|
|
6307
6333
|
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 ");
|
|
6308
6334
|
});
|
|
6309
6335
|
var StyledPaper$1 = styled$2(Paper, {
|
|
6310
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6311
|
-
})(templateObject_4$
|
|
6336
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
6337
|
+
})(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6312
6338
|
var _a;
|
|
6313
6339
|
var spaces = getSpaces(props);
|
|
6314
6340
|
var borders = getBorders(props);
|
|
@@ -6316,12 +6342,12 @@ var StyledPaper$1 = styled$2(Paper, {
|
|
|
6316
6342
|
var semanticColors = getSemanticColors(props);
|
|
6317
6343
|
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 ");
|
|
6318
6344
|
});
|
|
6319
|
-
var StyledDropdownMenuHeader = styled$2("div")(templateObject_5$
|
|
6345
|
+
var StyledDropdownMenuHeader = styled$2("div")(templateObject_5$f || (templateObject_5$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6320
6346
|
var search = props.search;
|
|
6321
6347
|
var spaces = getSpaces(props);
|
|
6322
6348
|
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 ");
|
|
6323
6349
|
});
|
|
6324
|
-
var templateObject_1$
|
|
6350
|
+
var templateObject_1$N, templateObject_2$w, templateObject_3$m, templateObject_4$j, templateObject_5$f;
|
|
6325
6351
|
|
|
6326
6352
|
// (masoudmanson): Represents the minimum width defined by design specifications
|
|
6327
6353
|
// for the dropdownMenu's popper component
|
|
@@ -6359,7 +6385,7 @@ var DropdownMenu = function (props) {
|
|
|
6359
6385
|
sx: dropdownMenuPopperSx, children: jsx(PaperComponent, { children: jsx(ClickAwayListener, __assign({ onClickAway: onClickAway }, ClickAwayListenerProps, { children: jsxs(StyledDropdownMenuAutocompleteWrapper, { children: [(title || headerComponentSlot) && (jsxs(StyledDropdownMenuHeader, { search: search, children: [title && jsx(StyledHeaderTitle, { children: title }), headerComponentSlot && jsx(Fragment, { children: headerComponentSlot })] })), anchorEl && (jsx(Autocomplete, __assign({ label: label, search: search, title: title, open: open, options: options, PopperBaseProps: DEFAULT_POPPER_BASE_PROPS, disablePortal: true, onClickAway: noop, onClick: noop }, rest, { InputBaseProps: DefaultInputBaseProps }))), children] }) })) }) })));
|
|
6360
6386
|
};
|
|
6361
6387
|
|
|
6362
|
-
var doNotForwardProps$
|
|
6388
|
+
var doNotForwardProps$q = [
|
|
6363
6389
|
"intent",
|
|
6364
6390
|
"state",
|
|
6365
6391
|
"sdsType",
|
|
@@ -6387,27 +6413,27 @@ var inputDropdownStyles = function (props) {
|
|
|
6387
6413
|
* The top/bottom padding is set to 1px less than the actual value to account for the border.
|
|
6388
6414
|
*/
|
|
6389
6415
|
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");
|
|
6390
|
-
return css(templateObject_1$
|
|
6416
|
+
return 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);
|
|
6391
6417
|
};
|
|
6392
6418
|
var minimal$1 = function (props) {
|
|
6393
6419
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
6394
6420
|
var spaces = getSpaces(props);
|
|
6395
6421
|
var semanticColors = getSemanticColors(props);
|
|
6396
|
-
return css(templateObject_2$
|
|
6422
|
+
return 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);
|
|
6397
6423
|
};
|
|
6398
6424
|
var square$1 = function (props) {
|
|
6399
6425
|
var corners = getCorners(props);
|
|
6400
|
-
return css(templateObject_3$
|
|
6426
|
+
return 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);
|
|
6401
6427
|
};
|
|
6402
6428
|
var rounded$1 = function (props) {
|
|
6403
6429
|
var corners = getCorners(props);
|
|
6404
|
-
return css(templateObject_4$
|
|
6430
|
+
return 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);
|
|
6405
6431
|
};
|
|
6406
6432
|
var userInput = function (props) {
|
|
6407
6433
|
var _a, _b, _c, _d;
|
|
6408
6434
|
var sdsStyle = props.sdsStyle;
|
|
6409
6435
|
var semanticColors = getSemanticColors(props);
|
|
6410
|
-
return css(templateObject_5$
|
|
6436
|
+
return 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"
|
|
6411
6437
|
? "\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 ")
|
|
6412
6438
|
: "");
|
|
6413
6439
|
};
|
|
@@ -6417,7 +6443,7 @@ var isOpen = function (props) {
|
|
|
6417
6443
|
var borders = getBorders(props);
|
|
6418
6444
|
var semanticColors = getSemanticColors(props);
|
|
6419
6445
|
var inputColor = intentToColor$2[intent];
|
|
6420
|
-
return css(templateObject_6$
|
|
6446
|
+
return 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"
|
|
6421
6447
|
? "\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 ")
|
|
6422
6448
|
: "", inputColor === "accent"
|
|
6423
6449
|
? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.ornamentOpen
|
|
@@ -6425,17 +6451,17 @@ var isOpen = function (props) {
|
|
|
6425
6451
|
? borders === null || borders === void 0 ? void 0 : borders.none
|
|
6426
6452
|
: (_f = borders === null || borders === void 0 ? void 0 : borders[inputColor]) === null || _f === void 0 ? void 0 : _f.open, sdsStyle === "minimal"
|
|
6427
6453
|
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.fillOpen
|
|
6428
|
-
: "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.
|
|
6454
|
+
: "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);
|
|
6429
6455
|
};
|
|
6430
6456
|
var applyIntentColor$1 = function (props, intent) {
|
|
6431
6457
|
var _a, _b, _c;
|
|
6432
6458
|
var borders = getBorders(props);
|
|
6433
|
-
return css(templateObject_7$
|
|
6459
|
+
return 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);
|
|
6434
6460
|
};
|
|
6435
6461
|
var isDisabled = function (props) {
|
|
6436
6462
|
var _a, _b, _c, _d;
|
|
6437
6463
|
var semanticColors = getSemanticColors(props);
|
|
6438
|
-
return css(templateObject_8$
|
|
6464
|
+
return 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);
|
|
6439
6465
|
};
|
|
6440
6466
|
/**
|
|
6441
6467
|
* (masoudmanson): `Button as React.ComponentType<InputDropdownProps>` is a
|
|
@@ -6446,10 +6472,10 @@ var isDisabled = function (props) {
|
|
|
6446
6472
|
* to the InputDropdownProps interface.
|
|
6447
6473
|
*/
|
|
6448
6474
|
var StyledInputDropdown = styled$2(Button, {
|
|
6449
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6450
|
-
})(templateObject_10$
|
|
6475
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6476
|
+
})(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) {
|
|
6451
6477
|
var disabled = props.disabled, intent = props.intent, state = props.state, value = props.value, sdsStyle = props.sdsStyle;
|
|
6452
|
-
return css(templateObject_9$
|
|
6478
|
+
return 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" &&
|
|
6453
6479
|
sdsStyle !== "minimal" &&
|
|
6454
6480
|
applyIntentColor$1(props, "notice"), intent === "negative" &&
|
|
6455
6481
|
sdsStyle !== "minimal" &&
|
|
@@ -6458,16 +6484,16 @@ var StyledInputDropdown = styled$2(Button, {
|
|
|
6458
6484
|
applyIntentColor$1(props, "positive"), state === "open" && isOpen(props), disabled && isDisabled(props));
|
|
6459
6485
|
});
|
|
6460
6486
|
var StyledDetail = styled$2("span", {
|
|
6461
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6462
|
-
})(templateObject_11$
|
|
6487
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6488
|
+
})(templateObject_11$3 || (templateObject_11$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6463
6489
|
var _a;
|
|
6464
6490
|
var spaces = getSpaces(props);
|
|
6465
6491
|
var semanticColors = getSemanticColors(props);
|
|
6466
6492
|
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 ");
|
|
6467
6493
|
});
|
|
6468
6494
|
var StyledLabel$2 = styled$2("span", {
|
|
6469
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6470
|
-
})(templateObject_12$
|
|
6495
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6496
|
+
})(templateObject_12$3 || (templateObject_12$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6471
6497
|
var _a, _b;
|
|
6472
6498
|
var details = props.details, counter = props.counter, sdsType = props.sdsType;
|
|
6473
6499
|
var fontWeights = getFontWeights(props);
|
|
@@ -6478,8 +6504,8 @@ var StyledLabel$2 = styled$2("span", {
|
|
|
6478
6504
|
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 ");
|
|
6479
6505
|
});
|
|
6480
6506
|
var StyledCounter = styled$2("span", {
|
|
6481
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6482
|
-
})(templateObject_13$
|
|
6507
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6508
|
+
})(templateObject_13$3 || (templateObject_13$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6483
6509
|
var _a, _b;
|
|
6484
6510
|
var corners = getCorners(props);
|
|
6485
6511
|
var spaces = getSpaces(props);
|
|
@@ -6487,8 +6513,8 @@ var StyledCounter = styled$2("span", {
|
|
|
6487
6513
|
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 ");
|
|
6488
6514
|
});
|
|
6489
6515
|
var MinimalDetails = styled$2("div", {
|
|
6490
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6491
|
-
})(templateObject_14$
|
|
6516
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6517
|
+
})(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) {
|
|
6492
6518
|
var _a;
|
|
6493
6519
|
var shouldTruncateMinimalDetails = props.shouldTruncateMinimalDetails;
|
|
6494
6520
|
var semanticColors = getSemanticColors(props);
|
|
@@ -6496,23 +6522,23 @@ var MinimalDetails = styled$2("div", {
|
|
|
6496
6522
|
"overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;", "\n ");
|
|
6497
6523
|
});
|
|
6498
6524
|
var LabelWrapper = styled$2("span", {
|
|
6499
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6500
|
-
})(templateObject_15$
|
|
6525
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6526
|
+
})(templateObject_15$3 || (templateObject_15$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
6501
6527
|
var isMinimal = _a.isMinimal;
|
|
6502
6528
|
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 ");
|
|
6503
6529
|
});
|
|
6504
6530
|
var IconWrapper = styled$2("span", {
|
|
6505
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6506
|
-
})(templateObject_16$
|
|
6531
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
6532
|
+
})(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"])));
|
|
6507
6533
|
function labelStyle(props) {
|
|
6508
6534
|
var _a, _b;
|
|
6509
6535
|
var semanticColors = getSemanticColors(props);
|
|
6510
6536
|
var labelColor = props.sdsType === "value"
|
|
6511
6537
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary
|
|
6512
6538
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textSecondary;
|
|
6513
|
-
return css(templateObject_17$
|
|
6539
|
+
return 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);
|
|
6514
6540
|
}
|
|
6515
|
-
var templateObject_1$
|
|
6541
|
+
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;
|
|
6516
6542
|
|
|
6517
6543
|
/**
|
|
6518
6544
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -6579,33 +6605,33 @@ var tagSizeS = function (props) {
|
|
|
6579
6605
|
var spaces = getSpaces(props);
|
|
6580
6606
|
var iconSizes = getIconSizes(props);
|
|
6581
6607
|
var semanticColors = getSemanticColors(props);
|
|
6582
|
-
return css(templateObject_1$
|
|
6608
|
+
return 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);
|
|
6583
6609
|
};
|
|
6584
6610
|
var tagSizeL = function (props) {
|
|
6585
6611
|
var _a;
|
|
6586
6612
|
var spaces = getSpaces(props);
|
|
6587
6613
|
var iconSizes = getIconSizes(props);
|
|
6588
6614
|
var semanticColors = getSemanticColors(props);
|
|
6589
|
-
return css(templateObject_2$
|
|
6615
|
+
return 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);
|
|
6590
6616
|
};
|
|
6591
6617
|
var rounded = function (props) {
|
|
6592
6618
|
var corners = getCorners(props);
|
|
6593
6619
|
var spaces = getSpaces(props);
|
|
6594
6620
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6595
6621
|
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;
|
|
6596
|
-
return css(templateObject_3$
|
|
6622
|
+
return 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);
|
|
6597
6623
|
};
|
|
6598
6624
|
var square = function (props) {
|
|
6599
6625
|
var corners = getCorners(props);
|
|
6600
6626
|
var spaces = getSpaces(props);
|
|
6601
6627
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6602
6628
|
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;
|
|
6603
|
-
return css(templateObject_4$
|
|
6629
|
+
return 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);
|
|
6604
6630
|
};
|
|
6605
6631
|
var withHover = function (props) {
|
|
6606
6632
|
var _a;
|
|
6607
6633
|
var semanticColors = getSemanticColors(props);
|
|
6608
|
-
return css(templateObject_5$
|
|
6634
|
+
return 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);
|
|
6609
6635
|
};
|
|
6610
6636
|
var primary = function (props) {
|
|
6611
6637
|
return createTypeCss(props, "primary");
|
|
@@ -6674,13 +6700,13 @@ function createTypeCss(props, type) {
|
|
|
6674
6700
|
secondary: generateSecondaryTagColors(intent, colors, semanticColors),
|
|
6675
6701
|
};
|
|
6676
6702
|
var typeColors = typeToColors[type];
|
|
6677
|
-
return css(templateObject_6$
|
|
6703
|
+
return 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);
|
|
6678
6704
|
}
|
|
6679
6705
|
var typeToCss = {
|
|
6680
6706
|
primary: primary,
|
|
6681
6707
|
secondary: secondary,
|
|
6682
6708
|
};
|
|
6683
|
-
var doNotForwardProps$
|
|
6709
|
+
var doNotForwardProps$p = [
|
|
6684
6710
|
"sdsType",
|
|
6685
6711
|
"sdsStyle",
|
|
6686
6712
|
"sdsSize",
|
|
@@ -6688,14 +6714,14 @@ var doNotForwardProps$i = [
|
|
|
6688
6714
|
"hover",
|
|
6689
6715
|
];
|
|
6690
6716
|
var StyledTag$2 = styled$2(Chip$1, {
|
|
6691
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6692
|
-
})(templateObject_8$
|
|
6717
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$p.includes(prop); },
|
|
6718
|
+
})(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
6693
6719
|
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;
|
|
6694
6720
|
var isRounded = sdsStyle === "rounded";
|
|
6695
6721
|
var type = sdsType || "primary";
|
|
6696
|
-
return css(templateObject_7$
|
|
6722
|
+
return 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;");
|
|
6697
6723
|
});
|
|
6698
|
-
var templateObject_1$
|
|
6724
|
+
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;
|
|
6699
6725
|
|
|
6700
6726
|
/**
|
|
6701
6727
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6709,14 +6735,14 @@ var Tag = function (props) {
|
|
|
6709
6735
|
return jsx(StyledTag$2, __assign({ tagColor: color }, props, { color: "primary" }));
|
|
6710
6736
|
};
|
|
6711
6737
|
|
|
6712
|
-
var StyledTag$1 = styled$2(Tag)(templateObject_2$
|
|
6738
|
+
var StyledTag$1 = styled$2(Tag)(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6713
6739
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
6714
6740
|
var spaces = getSpaces(props);
|
|
6715
6741
|
var iconSizes = getIconSizes(props);
|
|
6716
6742
|
var semanticColors = getSemanticColors(props);
|
|
6717
|
-
return css(templateObject_1$
|
|
6743
|
+
return 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);
|
|
6718
6744
|
});
|
|
6719
|
-
var templateObject_1$
|
|
6745
|
+
var templateObject_1$K, templateObject_2$t;
|
|
6720
6746
|
|
|
6721
6747
|
/**
|
|
6722
6748
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6739,12 +6765,12 @@ var Chips = function (_a) {
|
|
|
6739
6765
|
}) }));
|
|
6740
6766
|
};
|
|
6741
6767
|
|
|
6742
|
-
var Wrapper$1 = styled$2("div")(templateObject_1$
|
|
6743
|
-
var StyledChipsWrapper = styled$2("div")(templateObject_2$
|
|
6768
|
+
var Wrapper$1 = styled$2("div")(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n min-width: 150px;\n"], ["\n min-width: 150px;\n"])));
|
|
6769
|
+
var StyledChipsWrapper = styled$2("div")(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6744
6770
|
var spaces = getSpaces(props);
|
|
6745
6771
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
6746
6772
|
});
|
|
6747
|
-
var templateObject_1$
|
|
6773
|
+
var templateObject_1$J, templateObject_2$s;
|
|
6748
6774
|
|
|
6749
6775
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
6750
6776
|
var ComplexFilter = function (_a) {
|
|
@@ -6833,13 +6859,345 @@ var ComplexFilter = function (_a) {
|
|
|
6833
6859
|
}
|
|
6834
6860
|
};
|
|
6835
6861
|
|
|
6862
|
+
var doNotForwardProps$o = [
|
|
6863
|
+
"visualElement",
|
|
6864
|
+
"sdsType",
|
|
6865
|
+
"imagePosition",
|
|
6866
|
+
"imagePadding",
|
|
6867
|
+
"overlineText",
|
|
6868
|
+
"titleText",
|
|
6869
|
+
"subtitleText",
|
|
6870
|
+
"metadataText",
|
|
6871
|
+
"contentBlock",
|
|
6872
|
+
"decorativeBorder",
|
|
6873
|
+
"boundingBox",
|
|
6874
|
+
"buttons",
|
|
6875
|
+
"visualElementType",
|
|
6876
|
+
"image",
|
|
6877
|
+
"icon",
|
|
6878
|
+
"buttonsPosition",
|
|
6879
|
+
"clickableCard",
|
|
6880
|
+
"imageSize",
|
|
6881
|
+
"clickableCardProps",
|
|
6882
|
+
"cardSdsType",
|
|
6883
|
+
"classes",
|
|
6884
|
+
];
|
|
6885
|
+
var StyledCard = styled$2(Card, {
|
|
6886
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6887
|
+
})(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6888
|
+
var _a, _b, _c, _d;
|
|
6889
|
+
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;
|
|
6890
|
+
var semanticColors = getSemanticColors(props);
|
|
6891
|
+
var flexDirection = sdsType === "wide" && visualElementType === "image"
|
|
6892
|
+
? imagePosition === "left"
|
|
6893
|
+
? "row"
|
|
6894
|
+
: "row-reverse"
|
|
6895
|
+
: visualElementType === "icon"
|
|
6896
|
+
? "row"
|
|
6897
|
+
: "column";
|
|
6898
|
+
var showDecorativeBorder = visualElementType === "image"
|
|
6899
|
+
? boundingBox && decorativeBorder && imagePadding
|
|
6900
|
+
: boundingBox && decorativeBorder;
|
|
6901
|
+
return 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 && 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" &&
|
|
6902
|
+
showDecorativeBorder && 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" &&
|
|
6903
|
+
showDecorativeBorder && 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));
|
|
6904
|
+
});
|
|
6905
|
+
var StyledCardActionArea = styled$2(Button, {
|
|
6906
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6907
|
+
})(templateObject_6$a || (templateObject_6$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6908
|
+
var _a, _b;
|
|
6909
|
+
var _c = props.imagePosition, imagePosition = _c === void 0 ? "left" : _c, _d = props.cardSdsType, cardSdsType = _d === void 0 ? "wide" : _d, visualElementType = props.visualElementType;
|
|
6910
|
+
var semanticColors = getSemanticColors(props);
|
|
6911
|
+
var shadows = getShadows(props);
|
|
6912
|
+
var flexDirection = cardSdsType === "wide"
|
|
6913
|
+
? imagePosition === "left"
|
|
6914
|
+
? "row"
|
|
6915
|
+
: "row-reverse"
|
|
6916
|
+
: visualElementType === "image"
|
|
6917
|
+
? "column"
|
|
6918
|
+
: "row";
|
|
6919
|
+
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 ");
|
|
6920
|
+
});
|
|
6921
|
+
var StyledIconMediaWrapper = styled$2("div", {
|
|
6922
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6923
|
+
})(templateObject_10$2 || (templateObject_10$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6924
|
+
var _a = props.boundingBox, boundingBox = _a === void 0 ? true : _a;
|
|
6925
|
+
var spaces = getSpaces(props);
|
|
6926
|
+
return css(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), boundingBox
|
|
6927
|
+
? 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) : 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));
|
|
6928
|
+
});
|
|
6929
|
+
var StyledCardContent = styled$2("div", {
|
|
6930
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6931
|
+
})(templateObject_13$2 || (templateObject_13$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6932
|
+
var _a = props.boundingBox, boundingBox = _a === void 0 ? true : _a;
|
|
6933
|
+
var spaces = getSpaces(props);
|
|
6934
|
+
return 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 && 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));
|
|
6935
|
+
});
|
|
6936
|
+
var StyledContentCardBody = styled$2(CardContent, {
|
|
6937
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6938
|
+
})(templateObject_14$2 || (templateObject_14$2 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6939
|
+
var _a;
|
|
6940
|
+
var semanticColors = getSemanticColors(props);
|
|
6941
|
+
var spaces = getSpaces(props);
|
|
6942
|
+
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 ");
|
|
6943
|
+
});
|
|
6944
|
+
var StyledCardContentAligner = styled$2("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"])));
|
|
6945
|
+
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;
|
|
6946
|
+
|
|
6947
|
+
var doNotForwardProps$n = [
|
|
6948
|
+
"visualElement",
|
|
6949
|
+
"sdsType",
|
|
6950
|
+
"imagePosition",
|
|
6951
|
+
"imagePadding",
|
|
6952
|
+
"overlineText",
|
|
6953
|
+
"titleText",
|
|
6954
|
+
"subtitleText",
|
|
6955
|
+
"metadataText",
|
|
6956
|
+
"contentBlock",
|
|
6957
|
+
];
|
|
6958
|
+
var StyledTitleWrapper = styled$3("div", {
|
|
6959
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6960
|
+
})(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6961
|
+
var spaces = getSpaces(props);
|
|
6962
|
+
return "\n display: flex;\n flex-direction: column;\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
6963
|
+
});
|
|
6964
|
+
var StyledOverlineText = styled$3("p", {
|
|
6965
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6966
|
+
})(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontCapsXxxs, function (props) {
|
|
6967
|
+
var _a;
|
|
6968
|
+
var semanticColors = getSemanticColors(props);
|
|
6969
|
+
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 ");
|
|
6970
|
+
});
|
|
6971
|
+
var StyledTitleText = styled$3("p", {
|
|
6972
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6973
|
+
})(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderXl, function (props) {
|
|
6974
|
+
var _a;
|
|
6975
|
+
var semanticColors = getSemanticColors(props);
|
|
6976
|
+
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 ");
|
|
6977
|
+
});
|
|
6978
|
+
var StyledSubtitleText = styled$3("p", {
|
|
6979
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6980
|
+
})(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderM$1, function (props) {
|
|
6981
|
+
var _a;
|
|
6982
|
+
var semanticColors = getSemanticColors(props);
|
|
6983
|
+
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 ");
|
|
6984
|
+
});
|
|
6985
|
+
var StyledMetadataText = styled$3("p", {
|
|
6986
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6987
|
+
})(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6988
|
+
var _a;
|
|
6989
|
+
var semanticColors = getSemanticColors(props);
|
|
6990
|
+
var spaces = getSpaces(props);
|
|
6991
|
+
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 ");
|
|
6992
|
+
});
|
|
6993
|
+
var templateObject_1$H, templateObject_2$q, templateObject_3$i, templateObject_4$f, templateObject_5$b;
|
|
6994
|
+
|
|
6995
|
+
/**
|
|
6996
|
+
* @see https://mui.com/material-ui/react-dialog/
|
|
6997
|
+
*/
|
|
6998
|
+
var ContentCardTitle = forwardRef(function ContentCardTitle(props, ref) {
|
|
6999
|
+
var overlineText = props.overlineText, titleText = props.titleText, subtitleText = props.subtitleText, metadataText = props.metadataText, _a = props.classes, classes = _a === void 0 ? EMPTY_OBJECT : _a;
|
|
7000
|
+
var cardHeader = classes.cardHeader, cardOverline = classes.cardOverline, cardTitle = classes.cardTitle, cardSubtitle = classes.cardSubtitle, cardMetadata = classes.cardMetadata;
|
|
7001
|
+
return (jsxs("div", { ref: ref, children: [jsxs(StyledTitleWrapper, { className: cardHeader, children: [overlineText && (jsx(StyledOverlineText, { className: cardOverline, children: overlineText })), titleText && (jsx(StyledTitleText, { className: cardTitle, children: titleText })), subtitleText && (jsx(StyledSubtitleText, { className: cardSubtitle, children: subtitleText }))] }), metadataText && (jsx(StyledMetadataText, { className: cardMetadata, children: metadataText }))] }));
|
|
7002
|
+
});
|
|
7003
|
+
|
|
7004
|
+
var doNotForwardProps$m = ["buttonsPosition"];
|
|
7005
|
+
var StyledCardActions = styled$2(CardActions, {
|
|
7006
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
7007
|
+
})(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7008
|
+
var _a = props.buttonsPosition, buttonsPosition = _a === void 0 ? "left" : _a;
|
|
7009
|
+
var spaces = getSpaces(props);
|
|
7010
|
+
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 ");
|
|
7011
|
+
});
|
|
7012
|
+
var templateObject_1$G;
|
|
7013
|
+
|
|
7014
|
+
var isButtonElement = function (child) {
|
|
7015
|
+
if (React__default.isValidElement(child) && child.type === Button) {
|
|
7016
|
+
return true;
|
|
7017
|
+
}
|
|
7018
|
+
else {
|
|
7019
|
+
showWarningIfFirstOccurence(SDSWarningTypes.ContentCardActionsOnlyButtons);
|
|
7020
|
+
return false;
|
|
7021
|
+
}
|
|
7022
|
+
};
|
|
7023
|
+
/**
|
|
7024
|
+
* @see https://mui.com/material-ui/api/card-actions/
|
|
7025
|
+
*/
|
|
7026
|
+
var ContentCardActions = forwardRef(function ContentCardActions(props, ref) {
|
|
7027
|
+
var buttonsPosition = props.buttonsPosition, clickableCard = props.clickableCard, children = props.children, _a = props.classes, classes = _a === void 0 ? EMPTY_OBJECT : _a;
|
|
7028
|
+
var cardActions = classes.cardActions;
|
|
7029
|
+
/**
|
|
7030
|
+
* (masoudmanson):
|
|
7031
|
+
* We need to ensure that only SDS buttons are used within the
|
|
7032
|
+
* ContentCardActions component slot. This is to prevent any potential
|
|
7033
|
+
* issues with using other components within the ContentCardActions component slot.
|
|
7034
|
+
*/
|
|
7035
|
+
var validChildren = React__default.Children.toArray(Array.isArray(children) ? children : [children]).filter(isButtonElement);
|
|
7036
|
+
/**
|
|
7037
|
+
* If the card is clickable, it acts as a `<button>` itself and cannot
|
|
7038
|
+
* have `<button>` elements as children. If multiple buttons are provided,
|
|
7039
|
+
* only the first one will be kept, and a warning will be shown.
|
|
7040
|
+
*
|
|
7041
|
+
* Any additional buttons cannot remain as `<button>` elements due to
|
|
7042
|
+
* DOM hierarchy constraints; they will be converted to `<a>` tags instead.
|
|
7043
|
+
*/
|
|
7044
|
+
if (clickableCard) {
|
|
7045
|
+
if (validChildren.length > 1) {
|
|
7046
|
+
showWarningIfFirstOccurence(SDSWarningTypes.ClickableContentCardNumberOfButtons);
|
|
7047
|
+
}
|
|
7048
|
+
/**
|
|
7049
|
+
* (masoudmanson): Since a clickable card can have at most one button,
|
|
7050
|
+
* we select the first button from the validChildren array and ignore the rest.
|
|
7051
|
+
*/
|
|
7052
|
+
var clickableCardButton = validChildren.shift();
|
|
7053
|
+
if (!clickableCardButton) {
|
|
7054
|
+
return null;
|
|
7055
|
+
}
|
|
7056
|
+
return (jsx(StyledCardActions, { ref: ref, buttonsPosition: buttonsPosition, className: cardActions, children: [
|
|
7057
|
+
React__default.cloneElement(clickableCardButton, __assign({ component: "div" }, clickableCardButton === null || clickableCardButton === void 0 ? void 0 : clickableCardButton.props)),
|
|
7058
|
+
] }));
|
|
7059
|
+
}
|
|
7060
|
+
return (jsx(StyledCardActions, { ref: ref, buttonsPosition: buttonsPosition, className: cardActions, children: validChildren }));
|
|
7061
|
+
});
|
|
7062
|
+
|
|
7063
|
+
var doNotForwardProps$l = [
|
|
7064
|
+
"imagePadding",
|
|
7065
|
+
"boundingBox",
|
|
7066
|
+
"sdsType",
|
|
7067
|
+
"imageSize",
|
|
7068
|
+
"image",
|
|
7069
|
+
"imagePosition",
|
|
7070
|
+
];
|
|
7071
|
+
var StyledImageMediaWrapper = styled$3("div", {
|
|
7072
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$l.includes(prop); },
|
|
7073
|
+
})(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7074
|
+
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;
|
|
7075
|
+
var spaces = getSpaces(props);
|
|
7076
|
+
return css$2(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
|
|
7077
|
+
? imagePadding
|
|
7078
|
+
? css$2(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"
|
|
7079
|
+
? "padding-right: 0;"
|
|
7080
|
+
: "padding-left: 0;") : css$2(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n padding: 0;\n "], ["\n padding: 0;\n "])))
|
|
7081
|
+
: css$2(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), imagePosition === "left"
|
|
7082
|
+
? "padding-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")
|
|
7083
|
+
: "padding-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")), sdsType === "narrow" && css$2(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n ", "\n\n justify-content: center;\n "], ["\n ", "\n\n justify-content: center;\n "])), boundingBox
|
|
7084
|
+
? imagePadding
|
|
7085
|
+
? css$2(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) : css$2(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n padding: 0;\n "], ["\n padding: 0;\n "])))
|
|
7086
|
+
: css$2(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)));
|
|
7087
|
+
});
|
|
7088
|
+
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;
|
|
7089
|
+
|
|
7090
|
+
/**
|
|
7091
|
+
* @see https://mui.com/material-ui/api/card-media/
|
|
7092
|
+
*/
|
|
7093
|
+
var ContentCardImageMedia = forwardRef(function ContentCardImageMedia(props, ref) {
|
|
7094
|
+
var image = props.image, imageSize = props.imageSize, sdsType = props.sdsType, className = props.className;
|
|
7095
|
+
/**
|
|
7096
|
+
* (masoudmanson): These styles makes the image responsive and
|
|
7097
|
+
* ensures the image is the right aspect ratio in different card sizes.
|
|
7098
|
+
*/
|
|
7099
|
+
var imageMediaStyles = {
|
|
7100
|
+
height: "100%",
|
|
7101
|
+
maxHeight: sdsType === "narrow" ? imageSize : "100%",
|
|
7102
|
+
maxWidth: sdsType === "narrow" ? "100%" : imageSize,
|
|
7103
|
+
minHeight: imageSize,
|
|
7104
|
+
minWidth: sdsType === "narrow" ? "unset" : imageSize,
|
|
7105
|
+
width: "100%",
|
|
7106
|
+
};
|
|
7107
|
+
/**
|
|
7108
|
+
* (masoudmanson): We need to make sure the image is wrapped in a CardMedia component.
|
|
7109
|
+
* - If it's a string, wrap it in CardMedia with proper styles.
|
|
7110
|
+
* - If it's already a CardMedia component, clone it and apply the styles.
|
|
7111
|
+
* - If it's a valid element, clone it and apply the styles.
|
|
7112
|
+
* - If it's null, return null.
|
|
7113
|
+
*/
|
|
7114
|
+
var imageElement = typeof image === "string" ? (jsx(CardMedia, { component: "img", src: image, alt: "Content Card Media", sx: __assign({}, imageMediaStyles) })) : React__default.isValidElement(image) && image.type === CardMedia ? (React__default.cloneElement(image, {
|
|
7115
|
+
component: "img",
|
|
7116
|
+
sx: __assign(__assign({}, image.props.sx), imageMediaStyles),
|
|
7117
|
+
})) : React__default.isValidElement(image) ? (React__default.cloneElement(image, {
|
|
7118
|
+
style: __assign(__assign({}, imageMediaStyles), { objectFit: "cover", objectPosition: "center" }),
|
|
7119
|
+
})) : null;
|
|
7120
|
+
return (jsx(StyledImageMediaWrapper, __assign({ ref: ref }, props, { className: className, children: imageElement })));
|
|
7121
|
+
});
|
|
7122
|
+
|
|
7123
|
+
var CONTENT_CARD_DEFAULT_IMAGE_MEDIA_SIZE = 300;
|
|
7124
|
+
var CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_LOW_BOUNDARY = 595;
|
|
7125
|
+
var CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_HIGH_BOUNDARY = 605;
|
|
7126
|
+
|
|
7127
|
+
var useResponsiveWidth = function (initialSdsType) {
|
|
7128
|
+
var _a = useState(false), isNarrow = _a[0], setIsNarrow = _a[1];
|
|
7129
|
+
var handleResize = function (width) {
|
|
7130
|
+
if (width < CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_LOW_BOUNDARY && !isNarrow) {
|
|
7131
|
+
setIsNarrow(true);
|
|
7132
|
+
}
|
|
7133
|
+
else if (width > CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_HIGH_BOUNDARY &&
|
|
7134
|
+
isNarrow) {
|
|
7135
|
+
setIsNarrow(false);
|
|
7136
|
+
}
|
|
7137
|
+
};
|
|
7138
|
+
return {
|
|
7139
|
+
dynamicSdsType: isNarrow ? "narrow" : initialSdsType,
|
|
7140
|
+
handleResize: handleResize,
|
|
7141
|
+
isNarrow: isNarrow,
|
|
7142
|
+
};
|
|
7143
|
+
};
|
|
7144
|
+
/**
|
|
7145
|
+
* (masoudmanson): This function is used to add the clickableCard and
|
|
7146
|
+
* buttonsPosition props to the ContentCardActions sub-component.
|
|
7147
|
+
*/
|
|
7148
|
+
var enhanceChildrenWithCardActionsProps = function (children, clickableCard, buttonsPosition, classes) {
|
|
7149
|
+
return React__default.Children.map(children, function (child) {
|
|
7150
|
+
if (React__default.isValidElement(child) && child.type === ContentCardActions) {
|
|
7151
|
+
return React__default.cloneElement(child, __assign(__assign({}, child.props), { buttonsPosition: buttonsPosition, classes: classes, clickableCard: clickableCard }));
|
|
7152
|
+
}
|
|
7153
|
+
return child;
|
|
7154
|
+
});
|
|
7155
|
+
};
|
|
7156
|
+
/**
|
|
7157
|
+
* @see https://mui.com/material-ui/react-card/
|
|
7158
|
+
*/
|
|
7159
|
+
var ContentCard = React__default.forwardRef(function (props, ref) {
|
|
7160
|
+
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;
|
|
7161
|
+
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;
|
|
7162
|
+
// Force boundingBox to be true when clickableCard is true
|
|
7163
|
+
var boundingBox = clickableCard ? true : propsBoundingBox;
|
|
7164
|
+
var cardRef = useRef(null);
|
|
7165
|
+
var _k = useResponsiveWidth(sdsType), handleResize = _k.handleResize, dynamicSdsType = _k.dynamicSdsType;
|
|
7166
|
+
useEffect(function () {
|
|
7167
|
+
var element = cardRef.current;
|
|
7168
|
+
if (!element)
|
|
7169
|
+
return;
|
|
7170
|
+
var resizeObserver = new ResizeObserver(function (entries) {
|
|
7171
|
+
for (var _i = 0, entries_1 = entries; _i < entries_1.length; _i++) {
|
|
7172
|
+
var entry = entries_1[_i];
|
|
7173
|
+
handleResize(entry.contentRect.width);
|
|
7174
|
+
}
|
|
7175
|
+
});
|
|
7176
|
+
resizeObserver.observe(element);
|
|
7177
|
+
return function () {
|
|
7178
|
+
resizeObserver.disconnect();
|
|
7179
|
+
};
|
|
7180
|
+
}, [handleResize]);
|
|
7181
|
+
var visualElement = visualElementType === "image" && image ? (jsx(ContentCardImageMedia, { imagePadding: imagePadding, boundingBox: boundingBox, sdsType: dynamicSdsType, imageSize: imageSize, image: image, imagePosition: imagePosition, className: cardMedia })) : visualElementType === "icon" && icon ? (jsx(StyledIconMediaWrapper, { boundingBox: boundingBox, className: cardMedia, children: icon })) : null;
|
|
7182
|
+
var cardInnerContent = (jsxs(Fragment, { children: [visualElement, jsxs(StyledCardContent, { boundingBox: boundingBox, clickableCard: clickableCard, className: cardContent, children: [jsx(ContentCardTitle, { overlineText: overlineText, titleText: titleText, subtitleText: subtitleText, metadataText: metadataText, classes: {
|
|
7183
|
+
cardHeader: cardHeader,
|
|
7184
|
+
cardMetadata: cardMetadata,
|
|
7185
|
+
cardOverline: cardOverline,
|
|
7186
|
+
cardSubtitle: cardSubtitle,
|
|
7187
|
+
cardTitle: cardTitle,
|
|
7188
|
+
} }), jsx(StyledCardContentAligner, { children: enhanceChildrenWithCardActionsProps(children, clickableCard, buttonsPosition, {
|
|
7189
|
+
cardActions: cardActions,
|
|
7190
|
+
}) })] })] }));
|
|
7191
|
+
return (jsx(StyledCard, __assign({ ref: mergeRefs([ref, cardRef]) }, props, { sdsType: dynamicSdsType, boundingBox: boundingBox, className: cardPaper, children: clickableCard ? (jsx(StyledCardActionArea, __assign({ sdsStyle: "minimal", cardSdsType: dynamicSdsType, visualElementType: visualElementType, imagePosition: imagePosition, className: clickableCardButton }, clickableCardProps, { children: cardInnerContent }))) : (cardInnerContent) })));
|
|
7192
|
+
});
|
|
7193
|
+
|
|
6836
7194
|
var DialogContext = createContext({ sdsSize: "m" });
|
|
6837
7195
|
|
|
6838
7196
|
// (thuang): Please keep this in sync with the props used in `ExtraProps`
|
|
6839
|
-
var doNotForwardProps$
|
|
7197
|
+
var doNotForwardProps$k = ["sdsSize"];
|
|
6840
7198
|
var StyledPaper = styled$2(Paper, {
|
|
6841
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6842
|
-
})(templateObject_1$
|
|
7199
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
7200
|
+
})(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n & {\n ", "\n\n ", "\n }\n"], ["\n & {\n ", "\n\n ", "\n }\n"])), paperDimensions, function (props) {
|
|
6843
7201
|
var _a;
|
|
6844
7202
|
var spaces = getSpaces(props);
|
|
6845
7203
|
var corners = getCorners(props);
|
|
@@ -6870,7 +7228,7 @@ function paperDimensions(props) {
|
|
|
6870
7228
|
var _a = sizeToDimensions[sdsSize], width = _a.width, minHeight = _a.minHeight;
|
|
6871
7229
|
return "\n width: ".concat(width, ";\n min-height: ").concat(minHeight, ";\n max-width: revert;\n box-sizing: border-box;\n ");
|
|
6872
7230
|
}
|
|
6873
|
-
var templateObject_1$
|
|
7231
|
+
var templateObject_1$E;
|
|
6874
7232
|
|
|
6875
7233
|
/**
|
|
6876
7234
|
* @see https://mui.com/material-ui/react-paper/
|
|
@@ -6899,15 +7257,15 @@ var Dialog = forwardRef(function Dialog(props, ref) {
|
|
|
6899
7257
|
});
|
|
6900
7258
|
|
|
6901
7259
|
// (thuang): Please keep this in sync with the props used in `DialogActionsExtraProps`
|
|
6902
|
-
var doNotForwardProps$
|
|
7260
|
+
var doNotForwardProps$j = ["buttonPosition"];
|
|
6903
7261
|
var StyledDialogActions = styled$2(DialogActions$1, {
|
|
6904
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6905
|
-
})(templateObject_1$
|
|
7262
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$j.includes(prop); },
|
|
7263
|
+
})(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n padding: 0;\n\n ", "\n"], ["\n padding: 0;\n\n ", "\n"])), function (props) {
|
|
6906
7264
|
var spaces = getSpaces(props);
|
|
6907
7265
|
var _a = props.buttonPosition, buttonPosition = _a === void 0 ? "right" : _a;
|
|
6908
7266
|
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(dialogActionsClasses.spacing, " > :not(:first-of-type) {\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n }\n ");
|
|
6909
7267
|
});
|
|
6910
|
-
var templateObject_1$
|
|
7268
|
+
var templateObject_1$D;
|
|
6911
7269
|
|
|
6912
7270
|
/**
|
|
6913
7271
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -6916,8 +7274,8 @@ var DialogActions = forwardRef(function DialogActions(props, ref) {
|
|
|
6916
7274
|
return jsx(StyledDialogActions, __assign({ ref: ref }, props));
|
|
6917
7275
|
});
|
|
6918
7276
|
|
|
6919
|
-
var StyledDialogContent = styled$2(DialogContent)(templateObject_1$
|
|
6920
|
-
var templateObject_1$
|
|
7277
|
+
var StyledDialogContent = styled$2(DialogContent)(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n ", "\n padding: 0;\n"], ["\n ", "\n padding: 0;\n"])), fontBodyS$1);
|
|
7278
|
+
var templateObject_1$C;
|
|
6921
7279
|
|
|
6922
7280
|
var index = forwardRef(
|
|
6923
7281
|
/**
|
|
@@ -6927,11 +7285,11 @@ function DialogContent(props, ref) {
|
|
|
6927
7285
|
return jsx(StyledDialogContent, __assign({ ref: ref }, props));
|
|
6928
7286
|
});
|
|
6929
7287
|
|
|
6930
|
-
var StyledButton$1 = styled$2(Button)(templateObject_1$
|
|
7288
|
+
var StyledButton$1 = styled$2(Button)(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n position: absolute;\n\n ", "\n"], ["\n position: absolute;\n\n ", "\n"])), function (props) {
|
|
6931
7289
|
var spaces = getSpaces(props);
|
|
6932
7290
|
return "\n right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxl, "px;\n ");
|
|
6933
7291
|
});
|
|
6934
|
-
var templateObject_1$
|
|
7292
|
+
var templateObject_1$B;
|
|
6935
7293
|
|
|
6936
7294
|
var CloseButton = forwardRef(function CloseButton(props, ref) {
|
|
6937
7295
|
var SDS_SIZE_TO_COMPONENT_SIZE = {
|
|
@@ -6947,27 +7305,27 @@ var CloseButton = forwardRef(function CloseButton(props, ref) {
|
|
|
6947
7305
|
} }));
|
|
6948
7306
|
});
|
|
6949
7307
|
|
|
6950
|
-
var StyledDialogTitle = styled$2(DialogTitle$1)(templateObject_1$
|
|
7308
|
+
var StyledDialogTitle = styled$2(DialogTitle$1)(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n padding: 0;\n ", "\n"], ["\n padding: 0;\n ", "\n"])), function (props) {
|
|
6951
7309
|
var spaces = getSpaces(props);
|
|
6952
7310
|
return "\n margin-bottom: ".concat((spaces === null || spaces === void 0 ? void 0 : spaces.xl) || 0, "px;\n ");
|
|
6953
7311
|
});
|
|
6954
|
-
var Title = styled$2(Typography)(templateObject_2$
|
|
7312
|
+
var Title = styled$2(Typography)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderXl, function (props) {
|
|
6955
7313
|
var _a;
|
|
6956
7314
|
var semanticColors = getSemanticColors(props);
|
|
6957
7315
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n ");
|
|
6958
7316
|
});
|
|
6959
|
-
var Subtitle = styled$2(Typography)(templateObject_3$
|
|
7317
|
+
var Subtitle = styled$2(Typography)(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
6960
7318
|
var _a;
|
|
6961
7319
|
var semanticColors = getSemanticColors(props);
|
|
6962
7320
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
6963
7321
|
});
|
|
6964
|
-
var Overline = styled$2(Typography)(templateObject_4$
|
|
7322
|
+
var Overline = styled$2(Typography)(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6965
7323
|
var _a;
|
|
6966
7324
|
var semanticColors = getSemanticColors(props);
|
|
6967
7325
|
var spaces = getSpaces(props);
|
|
6968
7326
|
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 ");
|
|
6969
7327
|
});
|
|
6970
|
-
var templateObject_1$
|
|
7328
|
+
var templateObject_1$A, templateObject_2$o, templateObject_3$g, templateObject_4$d;
|
|
6971
7329
|
|
|
6972
7330
|
/**
|
|
6973
7331
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -6977,20 +7335,20 @@ var DialogTitle = forwardRef(function DialogTitle(props, ref) {
|
|
|
6977
7335
|
return (jsx(StyledDialogTitle, __assign({ ref: ref }, rest, { children: children || (jsxs(Fragment, { children: [onClose && (jsx(CloseButton, { sdsStyle: "icon", icon: "XMark", onClick: onClose })), jsx(Overline, { children: overline }), jsx(Title, { children: title }), jsx(Subtitle, { children: subtitle })] })) })));
|
|
6978
7336
|
});
|
|
6979
7337
|
|
|
6980
|
-
var doNotForwardProps$
|
|
7338
|
+
var doNotForwardProps$i = ["buttonPosition"];
|
|
6981
7339
|
var StyledButtonsWrapper = styled$2("div", {
|
|
6982
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6983
|
-
})(templateObject_1$
|
|
7340
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
7341
|
+
})(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6984
7342
|
var buttonPosition = props.buttonPosition;
|
|
6985
7343
|
return "\n display: flex;\n justify-content: ".concat(buttonPosition === "left" ? "start" : "end", ";\n ");
|
|
6986
7344
|
});
|
|
6987
7345
|
var StyledButton = styled$2(Button, {
|
|
6988
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6989
|
-
})(templateObject_2$
|
|
7346
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
7347
|
+
})(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6990
7348
|
var spaces = getSpaces(props);
|
|
6991
7349
|
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 ");
|
|
6992
7350
|
});
|
|
6993
|
-
var templateObject_1$
|
|
7351
|
+
var templateObject_1$z, templateObject_2$n;
|
|
6994
7352
|
|
|
6995
7353
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
6996
7354
|
var Dropdown = function (props) {
|
|
@@ -7126,11 +7484,11 @@ var intentToColor$1 = {
|
|
|
7126
7484
|
notice: "notice",
|
|
7127
7485
|
positive: "positive",
|
|
7128
7486
|
};
|
|
7129
|
-
var StyledIcon = styled$2(Icon)(templateObject_1$
|
|
7487
|
+
var StyledIcon = styled$2(Icon)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7130
7488
|
var iconSizes = getIconSizes(props);
|
|
7131
7489
|
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 ");
|
|
7132
7490
|
});
|
|
7133
|
-
var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$
|
|
7491
|
+
var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7134
7492
|
var _a;
|
|
7135
7493
|
var _b = props.intent, intent = _b === void 0 ? "default" : _b;
|
|
7136
7494
|
var iconSizes = getIconSizes(props);
|
|
@@ -7138,22 +7496,22 @@ var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$j || (template
|
|
|
7138
7496
|
var borderColor = intentToColor$1[intent];
|
|
7139
7497
|
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 ");
|
|
7140
7498
|
});
|
|
7141
|
-
var StyledCheckboxCheckedIcon = styled$2("div")(templateObject_3$
|
|
7499
|
+
var StyledCheckboxCheckedIcon = styled$2("div")(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7142
7500
|
var _a, _b;
|
|
7143
7501
|
var iconSizes = getIconSizes(props);
|
|
7144
7502
|
var semanticColors = getSemanticColors(props);
|
|
7145
7503
|
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 ");
|
|
7146
7504
|
});
|
|
7147
|
-
var StyledCheckbox = styled$2(Checkbox)(templateObject_4$
|
|
7505
|
+
var StyledCheckbox = styled$2(Checkbox)(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7148
7506
|
var spaces = getSpaces(props);
|
|
7149
7507
|
return "\n &.".concat(checkboxClasses.root, " {\n ").concat(focusVisibleA11yStyle(props), "\n \n padding: 0;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n border-radius: 0;\n\n &:hover {\n background-color: transparent;\n }\n }\n ");
|
|
7150
7508
|
});
|
|
7151
|
-
var StyledLabelContainer$1 = styled$2("span")(templateObject_5$
|
|
7152
|
-
var StyledCheckboxLabel = styled$2("span")(templateObject_6$
|
|
7509
|
+
var StyledLabelContainer$1 = styled$2("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"])));
|
|
7510
|
+
var StyledCheckboxLabel = styled$2("span")(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7153
7511
|
var spaces = getSpaces(props);
|
|
7154
7512
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
7155
7513
|
});
|
|
7156
|
-
var StyledCheckboxCaption = styled$2("span")(templateObject_7$
|
|
7514
|
+
var StyledCheckboxCaption = styled$2("span")(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7157
7515
|
var _a;
|
|
7158
7516
|
var semanticColors = getSemanticColors(props);
|
|
7159
7517
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
@@ -7164,7 +7522,7 @@ var disabledStyles$1 = function (props) {
|
|
|
7164
7522
|
var borders = getBorders(props);
|
|
7165
7523
|
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 ");
|
|
7166
7524
|
};
|
|
7167
|
-
var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$
|
|
7525
|
+
var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$3 || (templateObject_8$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7168
7526
|
var _a, _b, _c, _d;
|
|
7169
7527
|
var disabled = props.disabled;
|
|
7170
7528
|
var spaces = getSpaces(props);
|
|
@@ -7172,7 +7530,7 @@ var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$2 ||
|
|
|
7172
7530
|
var borders = getBorders(props);
|
|
7173
7531
|
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 ");
|
|
7174
7532
|
});
|
|
7175
|
-
var templateObject_1$
|
|
7533
|
+
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;
|
|
7176
7534
|
|
|
7177
7535
|
/**
|
|
7178
7536
|
* @see https://mui.com/material-ui/react-checkbox/
|
|
@@ -7207,12 +7565,12 @@ var intentToColor = {
|
|
|
7207
7565
|
notice: "notice",
|
|
7208
7566
|
positive: "positive",
|
|
7209
7567
|
};
|
|
7210
|
-
var StyledRadioDot = styled$2("span")(templateObject_1$
|
|
7568
|
+
var StyledRadioDot = styled$2("span")(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7211
7569
|
var _a;
|
|
7212
7570
|
var semanticColors = getSemanticColors(props);
|
|
7213
7571
|
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 ");
|
|
7214
7572
|
});
|
|
7215
|
-
var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$
|
|
7573
|
+
var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7216
7574
|
var _a;
|
|
7217
7575
|
var _b = props.intent, intent = _b === void 0 ? "default" : _b;
|
|
7218
7576
|
var iconSizes = getIconSizes(props);
|
|
@@ -7220,22 +7578,22 @@ var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$i || (templateObj
|
|
|
7220
7578
|
var borderColor = intentToColor[intent];
|
|
7221
7579
|
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 ");
|
|
7222
7580
|
});
|
|
7223
|
-
var StyledRadioCheckedIcon = styled$2("div")(templateObject_3$
|
|
7581
|
+
var StyledRadioCheckedIcon = styled$2("div")(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7224
7582
|
var _a;
|
|
7225
7583
|
var iconSizes = getIconSizes(props);
|
|
7226
7584
|
var semanticColors = getSemanticColors(props);
|
|
7227
7585
|
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 ");
|
|
7228
7586
|
});
|
|
7229
|
-
var StyledRadioButton = styled$2(Radio)(templateObject_4$
|
|
7587
|
+
var StyledRadioButton = styled$2(Radio)(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7230
7588
|
var spaces = getSpaces(props);
|
|
7231
7589
|
return "\n &.".concat(radioClasses.root, " {\n ").concat(focusVisibleA11yStyle(props), "\n margin: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px 0 0;\n padding: 0;\n }\n ");
|
|
7232
7590
|
});
|
|
7233
|
-
var StyledLabelContainer = styled$2("span")(templateObject_5$
|
|
7234
|
-
var StyledRadioLabel = styled$2("span")(templateObject_6$
|
|
7591
|
+
var StyledLabelContainer = styled$2("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"])));
|
|
7592
|
+
var StyledRadioLabel = styled$2("span")(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7235
7593
|
var spaces = getSpaces(props);
|
|
7236
7594
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
7237
7595
|
});
|
|
7238
|
-
var StyledRadioCaption = styled$2("span")(templateObject_7$
|
|
7596
|
+
var StyledRadioCaption = styled$2("span")(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7239
7597
|
var _a;
|
|
7240
7598
|
var semanticColors = getSemanticColors(props);
|
|
7241
7599
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
@@ -7243,16 +7601,16 @@ var StyledRadioCaption = styled$2("span")(templateObject_7$2 || (templateObject_
|
|
|
7243
7601
|
var disabledStyles = function (props) {
|
|
7244
7602
|
var _a, _b, _c, _d, _e;
|
|
7245
7603
|
var semanticColors = getSemanticColors(props);
|
|
7246
|
-
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.
|
|
7604
|
+
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 ");
|
|
7247
7605
|
};
|
|
7248
|
-
var StyledFormControlLabel = styled$2(FormControlLabel)(templateObject_8$
|
|
7606
|
+
var StyledFormControlLabel = styled$2(FormControlLabel)(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7249
7607
|
var _a, _b, _c, _d;
|
|
7250
7608
|
var disabled = props.disabled;
|
|
7251
7609
|
var spaces = getSpaces(props);
|
|
7252
7610
|
var semanticColors = getSemanticColors(props);
|
|
7253
|
-
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.
|
|
7611
|
+
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 ");
|
|
7254
7612
|
});
|
|
7255
|
-
var templateObject_1$
|
|
7613
|
+
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;
|
|
7256
7614
|
|
|
7257
7615
|
/**
|
|
7258
7616
|
* @see https://mui.com/material-ui/react-radio-button/
|
|
@@ -7298,11 +7656,11 @@ var disabledSlider = function (props) {
|
|
|
7298
7656
|
var semanticColors = getSemanticColors(props);
|
|
7299
7657
|
return "\n .".concat(sliderClasses.track, " {\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.fillDisabled, ";\n }\n\n .").concat(sliderClasses.thumb, ".").concat(sliderClasses.disabled, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillDisabled, ";\n }\n\n .").concat(sliderClasses.valueLabel, " {\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textDisabled, ";\n background-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.backgroundSecondary, ";\n \n & * {\n color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textDisabled, ";\n }\n }\n\n .").concat(sliderClasses.markLabel, " {\n color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textDisabled, "\n }\n\n .").concat(sliderClasses.mark, " {\n background-color: ").concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.fillPrimary, ";\n }\n ");
|
|
7300
7658
|
};
|
|
7301
|
-
var StyledSlider = styled$2(Slider)(templateObject_1$
|
|
7659
|
+
var StyledSlider = styled$2(Slider)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7302
7660
|
var disabled = props.disabled;
|
|
7303
7661
|
return "\n ".concat(inputSlider(props), "\n ").concat(horizontal(props), "\n ").concat(disabled ? disabledSlider(props) : "", "\n ");
|
|
7304
7662
|
});
|
|
7305
|
-
var templateObject_1$
|
|
7663
|
+
var templateObject_1$w;
|
|
7306
7664
|
|
|
7307
7665
|
/**
|
|
7308
7666
|
* @see https://mui.com/material-ui/react-slider/
|
|
@@ -7317,19 +7675,19 @@ var applyIntentColor = function (props, intent) {
|
|
|
7317
7675
|
var _a, _b, _c, _d;
|
|
7318
7676
|
var borders = getBorders(props);
|
|
7319
7677
|
var semanticColors = getSemanticColors(props);
|
|
7320
|
-
return css(templateObject_1$
|
|
7678
|
+
return 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 "])), outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _a === void 0 ? void 0 : _a.default, outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _c === void 0 ? void 0 : _c.default, inputAdornmentClasses.root, buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _d === void 0 ? void 0 : _d.ornament);
|
|
7321
7679
|
};
|
|
7322
7680
|
var disabledStyled$1 = function (props) {
|
|
7323
7681
|
var _a, _b, _c;
|
|
7324
7682
|
var borders = getBorders(props);
|
|
7325
7683
|
var semanticColors = getSemanticColors(props);
|
|
7326
|
-
return css(templateObject_2$
|
|
7684
|
+
return 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 "])), outlinedInputClasses.disabled, outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.disabled, outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.disabled, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textDisabled);
|
|
7327
7685
|
};
|
|
7328
7686
|
var textArea = function (props) {
|
|
7329
7687
|
var spaces = getSpaces(props);
|
|
7330
|
-
return css(templateObject_3$
|
|
7688
|
+
return 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 "])), outlinedInputClasses.multiline, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, outlinedInputClasses.inputMultiline, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
7331
7689
|
};
|
|
7332
|
-
var StyledLabel$1 = styled$2("label")(templateObject_4$
|
|
7690
|
+
var StyledLabel$1 = styled$2("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) {
|
|
7333
7691
|
var spaces = getSpaces(props);
|
|
7334
7692
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
7335
7693
|
});
|
|
@@ -7337,15 +7695,15 @@ var StyledInputBase = styled$2(TextField, {
|
|
|
7337
7695
|
shouldForwardProp: function (prop) {
|
|
7338
7696
|
return !sdsPropNames$1.includes(prop.toString());
|
|
7339
7697
|
},
|
|
7340
|
-
})(templateObject_6$
|
|
7698
|
+
})(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7341
7699
|
var _a, _b, _c;
|
|
7342
7700
|
var intent = props.intent, sdsType = props.sdsType, disabled = props.disabled;
|
|
7343
7701
|
var spaces = getSpaces(props);
|
|
7344
7702
|
var borders = getBorders(props);
|
|
7345
7703
|
var corners = getCorners(props);
|
|
7346
|
-
return css(templateObject_5$
|
|
7704
|
+
return 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, outlinedInputClasses.root, outlinedInputClasses.inputSizeSmall, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.m, outlinedInputClasses.notchedOutline, corners === null || corners === void 0 ? void 0 : corners.m, (_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.default, outlinedInputClasses.input, outlinedInputClasses.input, focusVisibleA11yStyle(props), outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders.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));
|
|
7347
7705
|
});
|
|
7348
|
-
var templateObject_1$
|
|
7706
|
+
var templateObject_1$v, templateObject_2$k, templateObject_3$d, templateObject_4$a, templateObject_5$7, templateObject_6$6;
|
|
7349
7707
|
|
|
7350
7708
|
/**
|
|
7351
7709
|
* @see https://mui.com/material-ui/react-text-field/
|
|
@@ -7406,11 +7764,11 @@ var toggleOff = function (props) {
|
|
|
7406
7764
|
: (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentSecondary, ";\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n }\n\n .").concat(switchClasses.switchBase, " {\n right: unset;\n left: 0;\n transform: unset;\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n\n .MuiIconButton-label {\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n }\n\n &:after {\n color: ").concat(disabled ? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textDisabled : (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textSecondary, ";\n content: \"").concat(value, "\";\n }\n }\n\n &:hover {\n .").concat(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(switchClasses.track, " {\n background-color: transparent !important;\n opacity: 1 !important;\n }\n\n ").concat(!disabled &&
|
|
7407
7765
|
"&: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(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 ");
|
|
7408
7766
|
};
|
|
7409
|
-
var Toggle = styled$2(Switch)(templateObject_1$
|
|
7767
|
+
var Toggle = styled$2(Switch)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7410
7768
|
var checked = props.checked;
|
|
7411
7769
|
return "\n ".concat(toggle(props), "\n ").concat(checked ? toggleOn(props) : toggleOff(props), "\n ");
|
|
7412
7770
|
});
|
|
7413
|
-
var templateObject_1$
|
|
7771
|
+
var templateObject_1$u;
|
|
7414
7772
|
|
|
7415
7773
|
/**
|
|
7416
7774
|
* @see https://mui.com/material-ui/react-switch/
|
|
@@ -7428,14 +7786,14 @@ var InputToggle = function (props) {
|
|
|
7428
7786
|
return (jsx(Toggle, __assign({ checked: finalChecked, color: "primary", onChange: handleChange, value: labelValue }, rest)));
|
|
7429
7787
|
};
|
|
7430
7788
|
|
|
7431
|
-
var doNotForwardProps$
|
|
7789
|
+
var doNotForwardProps$h = ["sdsStyle", "sdsSize", "fontWeight"];
|
|
7432
7790
|
var defaultStyle = function (props) {
|
|
7433
7791
|
var _a, _b, _c, _d;
|
|
7434
7792
|
var semanticColors = getSemanticColors(props);
|
|
7435
|
-
return css(templateObject_1$
|
|
7793
|
+
return 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);
|
|
7436
7794
|
};
|
|
7437
7795
|
var dashedStyle = function () {
|
|
7438
|
-
return css(templateObject_2$
|
|
7796
|
+
return 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 "])));
|
|
7439
7797
|
};
|
|
7440
7798
|
var smallStyle = function (props) {
|
|
7441
7799
|
return fontBodyS$1(props);
|
|
@@ -7445,13 +7803,13 @@ var extraSmallStyle = function (props) {
|
|
|
7445
7803
|
};
|
|
7446
7804
|
var StyledLink = styled$2(Link$1, {
|
|
7447
7805
|
shouldForwardProp: function (prop) {
|
|
7448
|
-
return !doNotForwardProps$
|
|
7806
|
+
return !doNotForwardProps$h.includes(prop.toString());
|
|
7449
7807
|
},
|
|
7450
|
-
})(templateObject_4$
|
|
7808
|
+
})(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) {
|
|
7451
7809
|
var _a = props.fontWeight, fontWeight = _a === void 0 ? "normal" : _a, sdsStyle = props.sdsStyle, _b = props.sdsSize, sdsSize = _b === void 0 ? "s" : _b;
|
|
7452
|
-
return css(templateObject_3$
|
|
7810
|
+
return 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");
|
|
7453
7811
|
});
|
|
7454
|
-
var templateObject_1$
|
|
7812
|
+
var templateObject_1$t, templateObject_2$j, templateObject_3$c, templateObject_4$9;
|
|
7455
7813
|
|
|
7456
7814
|
/**
|
|
7457
7815
|
* @see https://mui.com/material-ui/react-link/
|
|
@@ -7466,10 +7824,10 @@ var Link = forwardRef(function (props, ref) {
|
|
|
7466
7824
|
});
|
|
7467
7825
|
|
|
7468
7826
|
// (thuang): Please keep this in sync with the props used in `ListExtraProps`
|
|
7469
|
-
var doNotForwardProps$
|
|
7827
|
+
var doNotForwardProps$g = ["marginBottom", "ordered"];
|
|
7470
7828
|
var StyledList = styled$2(List$1, {
|
|
7471
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7472
|
-
})(templateObject_1$
|
|
7829
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
7830
|
+
})(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) {
|
|
7473
7831
|
if (!props.ordered)
|
|
7474
7832
|
return "";
|
|
7475
7833
|
return "\n counter-reset: section;\n ";
|
|
@@ -7487,7 +7845,7 @@ function propsToMarginBottom$1(props) {
|
|
|
7487
7845
|
var marginBottom = props.marginBottom;
|
|
7488
7846
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "s"], "px;\n ");
|
|
7489
7847
|
}
|
|
7490
|
-
var templateObject_1$
|
|
7848
|
+
var templateObject_1$s;
|
|
7491
7849
|
|
|
7492
7850
|
/**
|
|
7493
7851
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7504,10 +7862,10 @@ var fontBodyXs$1 = fontBody("xs");
|
|
|
7504
7862
|
var fontBodyXxs = fontBody("xxs");
|
|
7505
7863
|
var fontBodyXxxs = fontBody("xxxs");
|
|
7506
7864
|
// (thuang): Please keep this in sync with the props used in `ListItemExtraProps`
|
|
7507
|
-
var doNotForwardProps$
|
|
7865
|
+
var doNotForwardProps$f = ["marginBottom", "fontSize", "ordered"];
|
|
7508
7866
|
var StyledListItem = styled$2(ListItem$1, {
|
|
7509
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7510
|
-
})(templateObject_1$
|
|
7867
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
7868
|
+
})(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) {
|
|
7511
7869
|
var ordered = props.ordered;
|
|
7512
7870
|
return "\n align-items: flex-start;\n ".concat(ordered ? "counter-increment: section;" : "", "\n ");
|
|
7513
7871
|
}, function (props) {
|
|
@@ -7538,11 +7896,11 @@ function propsToMarginBottom(props) {
|
|
|
7538
7896
|
var marginBottom = props.marginBottom;
|
|
7539
7897
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "xs"], "px;\n ");
|
|
7540
7898
|
}
|
|
7541
|
-
var ListItemLabel = styled$2("span")(templateObject_2$
|
|
7899
|
+
var ListItemLabel = styled$2("span")(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n margin-right: 5px;\n\n ", "\n"], ["\n margin-right: 5px;\n\n ", "\n"])), function (props) {
|
|
7542
7900
|
var fontWeights = getFontWeights(props);
|
|
7543
7901
|
return "\n font-weight: ".concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n ");
|
|
7544
7902
|
});
|
|
7545
|
-
var templateObject_1$
|
|
7903
|
+
var templateObject_1$r, templateObject_2$i;
|
|
7546
7904
|
|
|
7547
7905
|
/**
|
|
7548
7906
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7552,11 +7910,11 @@ var ListItem = function (props) {
|
|
|
7552
7910
|
};
|
|
7553
7911
|
|
|
7554
7912
|
var fontHeaderM = fontHeader("m");
|
|
7555
|
-
var StyledListSubheader = styled$2(ListSubheader$1)(templateObject_1$
|
|
7913
|
+
var StyledListSubheader = styled$2(ListSubheader$1)(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) {
|
|
7556
7914
|
var spaces = getSpaces(props);
|
|
7557
7915
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n ");
|
|
7558
7916
|
});
|
|
7559
|
-
var templateObject_1$
|
|
7917
|
+
var templateObject_1$q;
|
|
7560
7918
|
|
|
7561
7919
|
/**
|
|
7562
7920
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7565,7 +7923,7 @@ var ListSubheader = function (props) {
|
|
|
7565
7923
|
return jsx(StyledListSubheader, __assign({ disableGutters: true }, props));
|
|
7566
7924
|
};
|
|
7567
7925
|
|
|
7568
|
-
var StyledText = styled$2("span")(templateObject_1$
|
|
7926
|
+
var StyledText = styled$2("span")(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7569
7927
|
var spaces = getSpaces(props);
|
|
7570
7928
|
return "\n margin: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
7571
7929
|
});
|
|
@@ -7573,37 +7931,37 @@ var minimal = function (props) {
|
|
|
7573
7931
|
var _a, _b;
|
|
7574
7932
|
var iconSizes = getIconSizes(props);
|
|
7575
7933
|
var semanticColors = getSemanticColors(props);
|
|
7576
|
-
return css(templateObject_2$
|
|
7934
|
+
return 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);
|
|
7577
7935
|
};
|
|
7578
7936
|
var tag = function (props) {
|
|
7579
7937
|
var _a, _b, _c;
|
|
7580
7938
|
var corners = getCorners(props);
|
|
7581
7939
|
var semanticColors = getSemanticColors(props);
|
|
7582
|
-
return css(templateObject_3$
|
|
7940
|
+
return 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);
|
|
7583
7941
|
};
|
|
7584
|
-
var doNotForwardProps$
|
|
7942
|
+
var doNotForwardProps$e = ["sdsStyle"];
|
|
7585
7943
|
var StyledLoadingIndicator = styled$2("div", {
|
|
7586
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7587
|
-
})(templateObject_6$
|
|
7944
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$e.includes(prop); },
|
|
7945
|
+
})(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7588
7946
|
var sdsStyle = props.sdsStyle;
|
|
7589
7947
|
var spaces = getSpaces(props);
|
|
7590
|
-
var style = css(templateObject_4$
|
|
7591
|
-
return css(templateObject_5$
|
|
7948
|
+
var style = 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);
|
|
7949
|
+
return 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));
|
|
7592
7950
|
});
|
|
7593
|
-
var templateObject_1$
|
|
7951
|
+
var templateObject_1$p, templateObject_2$h, templateObject_3$b, templateObject_4$8, templateObject_5$6, templateObject_6$5;
|
|
7594
7952
|
|
|
7595
7953
|
var LoadingIndicator = function (_a) {
|
|
7596
7954
|
var ariaLabel = _a["aria-label"], sdsStyle = _a.sdsStyle;
|
|
7597
7955
|
return (jsxs(StyledLoadingIndicator, { sdsStyle: sdsStyle, "aria-label": "Loading", children: [jsx(Icon, { sdsIcon: "Loading", sdsSize: "l" }), jsx(StyledText, { "aria-label": ariaLabel, "aria-live": "polite", role: "status", children: "Loading" })] }));
|
|
7598
7956
|
};
|
|
7599
7957
|
|
|
7600
|
-
var StyledMenu = styled$2(Menu$1)(templateObject_1$
|
|
7958
|
+
var StyledMenu = styled$2(Menu$1)(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"])), menuClasses.paper, function (props) {
|
|
7601
7959
|
var _a;
|
|
7602
7960
|
var spaces = getSpaces(props);
|
|
7603
7961
|
var semanticColors = getSemanticColors(props);
|
|
7604
7962
|
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 ");
|
|
7605
7963
|
});
|
|
7606
|
-
var templateObject_1$
|
|
7964
|
+
var templateObject_1$o;
|
|
7607
7965
|
|
|
7608
7966
|
var ANCHOR_ORIGIN = {
|
|
7609
7967
|
horizontal: "center",
|
|
@@ -7620,19 +7978,19 @@ var Menu = function (props) {
|
|
|
7620
7978
|
return (jsx(StyledMenu, __assign({ anchorOrigin: ANCHOR_ORIGIN, transformOrigin: TRANSFORM_ORIGIN }, props)));
|
|
7621
7979
|
};
|
|
7622
7980
|
|
|
7623
|
-
var StyledMenuItem = styled$2(MenuItem)(templateObject_1$
|
|
7624
|
-
var doNotForwardProps$
|
|
7981
|
+
var StyledMenuItem = styled$2(MenuItem)(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
7982
|
+
var doNotForwardProps$d = ["search", "InputBaseProps", "keepSearchOnSelect"];
|
|
7625
7983
|
// (thuang): Casting the type to `Autocomplete`
|
|
7626
7984
|
// per https://github.com/mui-org/material-ui/issues/21727#issuecomment-880263271
|
|
7627
7985
|
var StyledAutocomplete = styled$2(Autocomplete$1, {
|
|
7628
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7629
|
-
})(templateObject_2$
|
|
7986
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
7987
|
+
})(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n ", "\n width: 100%;\n"], ["\n ", "\n width: 100%;\n"])), function (_a) {
|
|
7630
7988
|
var search = _a.search;
|
|
7631
7989
|
return !search && "height: 0; margin: 0 !important;";
|
|
7632
7990
|
});
|
|
7633
7991
|
var InputBaseWrapper = styled$2("div", {
|
|
7634
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7635
|
-
})(templateObject_3$
|
|
7992
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
7993
|
+
})(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7636
7994
|
var search = props.search;
|
|
7637
7995
|
if (!search) {
|
|
7638
7996
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -7644,12 +8002,12 @@ var InputBaseWrapper = styled$2("div", {
|
|
|
7644
8002
|
return "\n margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
7645
8003
|
});
|
|
7646
8004
|
var StyledMenuInputSearch = styled$2(InputSearch, {
|
|
7647
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7648
|
-
})(templateObject_4$
|
|
8005
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8006
|
+
})(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"])), inputBaseClasses.root, function (_a) {
|
|
7649
8007
|
var search = _a.search;
|
|
7650
8008
|
return (search ? "auto" : "transparent");
|
|
7651
8009
|
});
|
|
7652
|
-
var templateObject_1$
|
|
8010
|
+
var templateObject_1$n, templateObject_2$g, templateObject_3$a, templateObject_4$7;
|
|
7653
8011
|
|
|
7654
8012
|
/**
|
|
7655
8013
|
* @see https://mui.com/material-ui/react-autocomplete/
|
|
@@ -7700,6 +8058,80 @@ var MenuSelect = function (props) {
|
|
|
7700
8058
|
}
|
|
7701
8059
|
};
|
|
7702
8060
|
|
|
8061
|
+
var doNotForwardProps$c = ["hasInvertedStyle", "isNarrow"];
|
|
8062
|
+
var StyledFooter = styled$2("footer", {
|
|
8063
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8064
|
+
})(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8065
|
+
var isNarrow = props.isNarrow;
|
|
8066
|
+
var spaces = getSpaces(props);
|
|
8067
|
+
var semanticColors = getSemanticColors(props);
|
|
8068
|
+
return css$2(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
|
|
8069
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimaryInverse
|
|
8070
|
+
: 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 && css$2(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
|
|
8071
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
8072
|
+
: 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));
|
|
8073
|
+
});
|
|
8074
|
+
var StyledLogoWrapper$1 = styled$2("div", {
|
|
8075
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8076
|
+
})(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) {
|
|
8077
|
+
var spaces = getSpaces(props);
|
|
8078
|
+
return css$2(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);
|
|
8079
|
+
}, fontHeader("l"), fontHeader("l", /* isNarrow */ true), function (props) {
|
|
8080
|
+
var semanticColors = getSemanticColors(props);
|
|
8081
|
+
return css$2(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n color: ", ";\n white-space: nowrap;\n "], ["\n color: ", ";\n white-space: nowrap;\n "])), props.hasInvertedStyle
|
|
8082
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
8083
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary);
|
|
8084
|
+
});
|
|
8085
|
+
var StyledNavSection = styled$2("div", {
|
|
8086
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8087
|
+
})(templateObject_9$1 || (templateObject_9$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8088
|
+
var isNarrow = props.isNarrow;
|
|
8089
|
+
var spaces = getSpaces(props);
|
|
8090
|
+
return css$2(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 && css$2(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));
|
|
8091
|
+
});
|
|
8092
|
+
var StyledTopSection = styled$2("div", {
|
|
8093
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8094
|
+
})(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8095
|
+
var isNarrow = props.isNarrow;
|
|
8096
|
+
var semanticColors = getSemanticColors(props);
|
|
8097
|
+
var spaces = getSpaces(props);
|
|
8098
|
+
return css$2(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
|
|
8099
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryInverse
|
|
8100
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, props.hasInvertedStyle
|
|
8101
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
8102
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, isNarrow && css$2(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));
|
|
8103
|
+
});
|
|
8104
|
+
var StyledLinkSection = styled$2("div", {
|
|
8105
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8106
|
+
})(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) {
|
|
8107
|
+
var isNarrow = props.isNarrow;
|
|
8108
|
+
var spaces = getSpaces(props);
|
|
8109
|
+
return css$2(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 && css$2(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));
|
|
8110
|
+
});
|
|
8111
|
+
var StyledMobileLinkRow = styled$2.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) {
|
|
8112
|
+
var spaces = getSpaces(props);
|
|
8113
|
+
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
8114
|
+
});
|
|
8115
|
+
var StyledImageSection = styled$2("div", {
|
|
8116
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8117
|
+
})(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) {
|
|
8118
|
+
var isNarrow = props.isNarrow;
|
|
8119
|
+
var spaces = getSpaces(props);
|
|
8120
|
+
return css$2(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 && css$2(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));
|
|
8121
|
+
});
|
|
8122
|
+
var StyledMobileImageRow = styled$2.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) {
|
|
8123
|
+
var spaces = getSpaces(props);
|
|
8124
|
+
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;\n ");
|
|
8125
|
+
});
|
|
8126
|
+
var StyledBottomSection = styled$2("div", {
|
|
8127
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8128
|
+
})(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) {
|
|
8129
|
+
var isNarrow = props.isNarrow;
|
|
8130
|
+
var spaces = getSpaces(props);
|
|
8131
|
+
return css$2(templateObject_22$1 || (templateObject_22$1 = __makeTemplateObject(["\n margin-top: ", "px;\n\n ", "\n "], ["\n margin-top: ", "px;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, isNarrow && css$2(templateObject_21$1 || (templateObject_21$1 = __makeTemplateObject(["\n flex-direction: column-reverse;\n margin-top: ", "px;\n "], ["\n flex-direction: column-reverse;\n margin-top: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8132
|
+
});
|
|
8133
|
+
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;
|
|
8134
|
+
|
|
7703
8135
|
/**
|
|
7704
8136
|
* WARNING: Don't import this directly.
|
|
7705
8137
|
* Use `MuiError` from `@mui/internal-babel-macros/MuiError.macro` instead.
|
|
@@ -13718,11 +14150,150 @@ function useTheme() {
|
|
|
13718
14150
|
return theme[THEME_ID] || theme;
|
|
13719
14151
|
}
|
|
13720
14152
|
|
|
14153
|
+
var doNotForwardProps$b = ["hasInvertedStyle", "isNarrow"];
|
|
14154
|
+
var NarrowNavItemLinkStyles = function (props) {
|
|
14155
|
+
var semanticColors = getSemanticColors(props);
|
|
14156
|
+
return css$2(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
|
|
14157
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14158
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, props.hasInvertedStyle
|
|
14159
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondaryInverse
|
|
14160
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondary);
|
|
14161
|
+
};
|
|
14162
|
+
var StyledNavItemLink = styled$2(Link, {
|
|
14163
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$b.includes(prop); },
|
|
14164
|
+
})(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) {
|
|
14165
|
+
var isNarrow = props.isNarrow;
|
|
14166
|
+
var semanticColors = getSemanticColors(props);
|
|
14167
|
+
return css$2(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
|
|
14168
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryInverse
|
|
14169
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, props.hasInvertedStyle
|
|
14170
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14171
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, isNarrow && NarrowNavItemLinkStyles(props));
|
|
14172
|
+
});
|
|
14173
|
+
var templateObject_1$l, templateObject_2$e, templateObject_3$8;
|
|
14174
|
+
|
|
14175
|
+
var NavItem = memo(function (_a) {
|
|
14176
|
+
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow;
|
|
14177
|
+
return (jsx(StyledNavItemLink, __assign({ href: item.url, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, component: item.component }, item.linkProps, { children: item.label }), item.label));
|
|
14178
|
+
});
|
|
14179
|
+
NavItem.displayName = "NavItem";
|
|
14180
|
+
|
|
14181
|
+
var doNotForwardProps$a = ["hasInvertedStyle"];
|
|
14182
|
+
var StyledLinkItemLink = styled$2(Link, {
|
|
14183
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
14184
|
+
})(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBody("xxs", "regular"), function (props) {
|
|
14185
|
+
var semanticColors = getSemanticColors(props);
|
|
14186
|
+
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 ");
|
|
14187
|
+
});
|
|
14188
|
+
var StyledDivider = styled$2(Divider, {
|
|
14189
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
14190
|
+
})(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14191
|
+
var semanticColors = getSemanticColors(props);
|
|
14192
|
+
return "\n border-color: ".concat(props.hasInvertedStyle
|
|
14193
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
14194
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider, ";\n ");
|
|
14195
|
+
});
|
|
14196
|
+
var templateObject_1$k, templateObject_2$d;
|
|
14197
|
+
|
|
14198
|
+
var FooterLink = memo(function (_a) {
|
|
14199
|
+
var link = _a.link, showDivider = _a.showDivider, hasInvertedStyle = _a.hasInvertedStyle;
|
|
14200
|
+
return (jsxs(Fragment, { children: [jsx(StyledLinkItemLink, __assign({ href: link.url, hasInvertedStyle: hasInvertedStyle, component: link.component }, link.linkProps, { children: link.label }), link.label), showDivider && (jsx(StyledDivider, { orientation: "vertical", flexItem: true, hasInvertedStyle: hasInvertedStyle }))] }));
|
|
14201
|
+
});
|
|
14202
|
+
FooterLink.displayName = "FooterLink";
|
|
14203
|
+
|
|
14204
|
+
function groupArray(array, groupSize) {
|
|
14205
|
+
var groups = [];
|
|
14206
|
+
for (var i = 0; i < array.length; i += groupSize) {
|
|
14207
|
+
groups.push(array.slice(i, i + groupSize));
|
|
14208
|
+
}
|
|
14209
|
+
return groups;
|
|
14210
|
+
}
|
|
14211
|
+
var MemoizedStyledDivider = memo(StyledDivider);
|
|
14212
|
+
function NavigationFooter(_a) {
|
|
14213
|
+
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"]);
|
|
14214
|
+
var footerRef = useRef(null);
|
|
14215
|
+
var theme = useTheme();
|
|
14216
|
+
var isMdScreen = useMediaQuery(theme.breakpoints.down("md"));
|
|
14217
|
+
var _b = useState({
|
|
14218
|
+
breakpoint: 0,
|
|
14219
|
+
isNarrow: isMdScreen,
|
|
14220
|
+
}), dimensions = _b[0], setDimensions = _b[1];
|
|
14221
|
+
useEffect(function () {
|
|
14222
|
+
setDimensions(function (prev) { return (__assign(__assign({}, prev), { isNarrow: isMdScreen })); });
|
|
14223
|
+
}, [isMdScreen]);
|
|
14224
|
+
var checkScrollable = useCallback(function () {
|
|
14225
|
+
if (!footerRef.current)
|
|
14226
|
+
return;
|
|
14227
|
+
var clientWidth = footerRef.current.clientWidth;
|
|
14228
|
+
var scrollWidth = footerRef.current.scrollWidth;
|
|
14229
|
+
var needsScroll = scrollWidth > clientWidth;
|
|
14230
|
+
setDimensions(function (prev) {
|
|
14231
|
+
var newBreakpoint = needsScroll && !prev.isNarrow
|
|
14232
|
+
? Math.max(prev.breakpoint, clientWidth)
|
|
14233
|
+
: prev.breakpoint;
|
|
14234
|
+
return {
|
|
14235
|
+
breakpoint: newBreakpoint,
|
|
14236
|
+
isNarrow: clientWidth <= newBreakpoint,
|
|
14237
|
+
};
|
|
14238
|
+
});
|
|
14239
|
+
}, []);
|
|
14240
|
+
useEffect(function () {
|
|
14241
|
+
checkScrollable();
|
|
14242
|
+
var resizeObserver = new ResizeObserver(checkScrollable);
|
|
14243
|
+
if (footerRef.current) {
|
|
14244
|
+
resizeObserver.observe(footerRef.current);
|
|
14245
|
+
}
|
|
14246
|
+
return function () { return resizeObserver.disconnect(); };
|
|
14247
|
+
}, [checkScrollable]);
|
|
14248
|
+
var renderImages = useCallback(function () {
|
|
14249
|
+
if (!(images === null || images === void 0 ? void 0 : images.length))
|
|
14250
|
+
return null;
|
|
14251
|
+
if (!dimensions.isNarrow) {
|
|
14252
|
+
return images.map(function (_a) {
|
|
14253
|
+
var image = _a.image, url = _a.url;
|
|
14254
|
+
return (jsx(Link, { href: url, children: image }, url));
|
|
14255
|
+
});
|
|
14256
|
+
}
|
|
14257
|
+
return groupArray(images, 2).map(function (imageGroup, index) { return (jsx(StyledMobileImageRow, { children: imageGroup.map(function (_a) {
|
|
14258
|
+
var image = _a.image, url = _a.url;
|
|
14259
|
+
return (jsx(Link, { href: url, children: image }, url));
|
|
14260
|
+
}) }, index)); });
|
|
14261
|
+
}, [images, dimensions.isNarrow]);
|
|
14262
|
+
var renderLinks = useCallback(function () {
|
|
14263
|
+
if (!(navLinks === null || navLinks === void 0 ? void 0 : navLinks.length))
|
|
14264
|
+
return null;
|
|
14265
|
+
if (!dimensions.isNarrow) {
|
|
14266
|
+
return navLinks.map(function (link, index) { return (jsx(FooterLink, { link: link, showDivider: index < navLinks.length - 1, hasInvertedStyle: hasInvertedStyle }, link.label)); });
|
|
14267
|
+
}
|
|
14268
|
+
return groupArray(navLinks, 3).map(function (linkGroup, index) { return (jsx(StyledMobileLinkRow, { children: linkGroup.map(function (link, linkIndex) { return (jsx(FooterLink, { link: link, showDivider: linkIndex < linkGroup.length - 1, hasInvertedStyle: hasInvertedStyle }, link.label)); }) }, index)); });
|
|
14269
|
+
}, [navLinks, dimensions.isNarrow, hasInvertedStyle]);
|
|
14270
|
+
var logoNode = useMemo(function () {
|
|
14271
|
+
var node = (jsxs(StyledLogoWrapper$1, { isNarrow: dimensions.isNarrow, hasInvertedStyle: hasInvertedStyle, children: [logo, jsx("p", { children: title }), tag && jsx(Tag, { tagColor: tagColor, label: tag, hover: false })] }));
|
|
14272
|
+
return logoUrl ? jsx(Link, { href: logoUrl, children: node }) : node;
|
|
14273
|
+
}, [
|
|
14274
|
+
logo,
|
|
14275
|
+
title,
|
|
14276
|
+
tag,
|
|
14277
|
+
tagColor,
|
|
14278
|
+
logoUrl,
|
|
14279
|
+
dimensions.isNarrow,
|
|
14280
|
+
hasInvertedStyle,
|
|
14281
|
+
]);
|
|
14282
|
+
var navItemsSection = useMemo(function () {
|
|
14283
|
+
if (!(navItems === null || navItems === void 0 ? void 0 : navItems.length))
|
|
14284
|
+
return null;
|
|
14285
|
+
return (jsx(StyledNavSection, { isNarrow: dimensions.isNarrow, children: navItems.map(function (item) { return (jsx(NavItem, { item: item, hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow }, item.label)); }) }));
|
|
14286
|
+
}, [navItems, hasInvertedStyle, dimensions.isNarrow]);
|
|
14287
|
+
return (jsxs(StyledFooter, __assign({ ref: footerRef, hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow }, rest, { children: [jsxs(StyledTopSection, { isNarrow: dimensions.isNarrow, hasInvertedStyle: hasInvertedStyle, children: [logoNode, navItemsSection] }), jsx(MemoizedStyledDivider, { hasInvertedStyle: hasInvertedStyle }), jsxs(StyledBottomSection, { isNarrow: dimensions.isNarrow, children: [jsx(StyledLinkSection, { isNarrow: dimensions.isNarrow, children: renderLinks() }), jsx(StyledImageSection, { isNarrow: dimensions.isNarrow, children: renderImages() })] })] })));
|
|
14288
|
+
}
|
|
14289
|
+
|
|
13721
14290
|
var doNotForwardProps$9 = [
|
|
13722
14291
|
"hasInvertedStyle",
|
|
13723
14292
|
"isNarrow",
|
|
13724
14293
|
"primaryNavPosition",
|
|
13725
14294
|
"showSearch",
|
|
14295
|
+
"logoLinkComponent",
|
|
14296
|
+
"logoLinkProps",
|
|
13726
14297
|
];
|
|
13727
14298
|
var StyledHeader = styled$2(AppBar, {
|
|
13728
14299
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
@@ -13745,15 +14316,21 @@ var StyledToolbar = styled$2(Toolbar, {
|
|
|
13745
14316
|
var spaces = getSpaces(props);
|
|
13746
14317
|
return css$2(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));
|
|
13747
14318
|
});
|
|
13748
|
-
var StyledShadowElement = styled$2
|
|
14319
|
+
var StyledShadowElement = styled$2("div", {
|
|
14320
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14321
|
+
})(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13749
14322
|
var shadows = getShadows(props);
|
|
13750
14323
|
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 ");
|
|
13751
14324
|
});
|
|
13752
|
-
var StyledShadowCoverElement = styled$2
|
|
14325
|
+
var StyledShadowCoverElement = styled$2("div", {
|
|
14326
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14327
|
+
})(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13753
14328
|
var colors = getSemanticColors(props);
|
|
13754
14329
|
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 ");
|
|
13755
14330
|
});
|
|
13756
|
-
var StyledHeaderButton = styled$2(Button
|
|
14331
|
+
var StyledHeaderButton = styled$2(Button, {
|
|
14332
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14333
|
+
})(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13757
14334
|
var _a, _b, _c, _d;
|
|
13758
14335
|
var sdsType = props.sdsType, hasInvertedStyle = props.hasInvertedStyle;
|
|
13759
14336
|
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";
|
|
@@ -13766,7 +14343,9 @@ var invertedNarrowButtonStyles = function (props) {
|
|
|
13766
14343
|
var semanticColors = getSemanticColors(props);
|
|
13767
14344
|
return css$2(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);
|
|
13768
14345
|
};
|
|
13769
|
-
var StyledNarrowIconButton = styled$2(Button
|
|
14346
|
+
var StyledNarrowIconButton = styled$2(Button, {
|
|
14347
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14348
|
+
})(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13770
14349
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
13771
14350
|
return css$2(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), hasInvertedStyle && invertedNarrowButtonStyles(props));
|
|
13772
14351
|
});
|
|
@@ -13775,7 +14354,9 @@ var invertedWideButtonStyles = function (props) {
|
|
|
13775
14354
|
var semanticColors = getSemanticColors(props);
|
|
13776
14355
|
return css$2(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);
|
|
13777
14356
|
};
|
|
13778
|
-
var StyledWideIconButton = styled$2(Button
|
|
14357
|
+
var StyledWideIconButton = styled$2(Button, {
|
|
14358
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14359
|
+
})(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13779
14360
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
13780
14361
|
return css$2(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), hasInvertedStyle && invertedWideButtonStyles(props));
|
|
13781
14362
|
});
|
|
@@ -13822,19 +14403,19 @@ var StyledSearch = styled$2(InputSearch, {
|
|
|
13822
14403
|
return css$2(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
|
|
13823
14404
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
13824
14405
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, hasInvertedStyle
|
|
13825
|
-
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.
|
|
14406
|
+
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryInverse
|
|
13826
14407
|
: "", hasInvertedStyle
|
|
13827
14408
|
? (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondaryInverse
|
|
13828
14409
|
: "", hasInvertedStyle
|
|
13829
|
-
? (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.
|
|
14410
|
+
? (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderPrimaryHoverInverse
|
|
13830
14411
|
: "", hasInvertedStyle
|
|
13831
14412
|
? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentPrimaryInverse
|
|
13832
14413
|
: "", hasInvertedStyle
|
|
13833
|
-
? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.
|
|
14414
|
+
? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.borderPrimaryPressedInverse
|
|
13834
14415
|
: "", hasInvertedStyle
|
|
13835
14416
|
? (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentPrimaryInverse
|
|
13836
14417
|
: "", hasInvertedStyle
|
|
13837
|
-
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.
|
|
14418
|
+
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.borderPrimaryDisabledInverse
|
|
13838
14419
|
: "", hasInvertedStyle
|
|
13839
14420
|
? (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentDisabledInverse
|
|
13840
14421
|
: "");
|
|
@@ -13878,7 +14459,7 @@ var NarrowPrimaryNavItem = function (props) {
|
|
|
13878
14459
|
: (_b = colors === null || colors === void 0 ? void 0 : colors.accent) === null || _b === void 0 ? void 0 : _b.border;
|
|
13879
14460
|
var inactiveBorderColor = hasInvertedStyle
|
|
13880
14461
|
? (_c = colors === null || colors === void 0 ? void 0 : colors.neutral) === null || _c === void 0 ? void 0 : _c.fillPrimary
|
|
13881
|
-
: colors === null || colors === void 0 ? void 0 : colors.base.
|
|
14462
|
+
: colors === null || colors === void 0 ? void 0 : colors.base.borderPrimary;
|
|
13882
14463
|
return 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
|
|
13883
14464
|
? colors === null || colors === void 0 ? void 0 : colors.base.backgroundSecondaryInverse
|
|
13884
14465
|
: colors === null || colors === void 0 ? void 0 : colors.base.backgroundSecondary, spaces === null || spaces === void 0 ? void 0 : spaces.xs, active ? activeBorderColor : inactiveBorderColor);
|
|
@@ -13903,7 +14484,7 @@ var WideStyledLabel = function (props) {
|
|
|
13903
14484
|
: (_b = colors === null || colors === void 0 ? void 0 : colors.accent) === null || _b === void 0 ? void 0 : _b.border;
|
|
13904
14485
|
var inactiveBorderColor = hasInvertedStyle
|
|
13905
14486
|
? colors === null || colors === void 0 ? void 0 : colors.base.borderOnFill
|
|
13906
|
-
: colors === null || colors === void 0 ? void 0 : colors.base.
|
|
14487
|
+
: colors === null || colors === void 0 ? void 0 : colors.base.borderPrimary;
|
|
13907
14488
|
return 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);
|
|
13908
14489
|
};
|
|
13909
14490
|
var StyledLabel = styled$2("span", {
|
|
@@ -13959,7 +14540,7 @@ var NarrowStyledTextItem = function (props) {
|
|
|
13959
14540
|
};
|
|
13960
14541
|
var StyledTextItem = styled$2(Button, {
|
|
13961
14542
|
shouldForwardProp: function (prop) { return !ButtonDoNotForwardProps.includes(prop); },
|
|
13962
|
-
})(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n ", "\n\n background: none;\n justify-content: flex-start;\n min-height: 44px;\n width:
|
|
14543
|
+
})(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) {
|
|
13963
14544
|
var _a, _b;
|
|
13964
14545
|
var hasInvertedStyle = props.hasInvertedStyle, open = props.open, isNarrow = props.isNarrow;
|
|
13965
14546
|
var semanticColors = getSemanticColors(props);
|
|
@@ -13985,7 +14566,7 @@ var StyledTextItem = styled$2(Button, {
|
|
|
13985
14566
|
var doNotForwardProps$6 = ["hasInvertedStyle", "isNarrow"];
|
|
13986
14567
|
var StyledAccordion = styled$2(Accordion, {
|
|
13987
14568
|
shouldForwardProp: function (prop) { return !doNotForwardProps$6.includes(prop); },
|
|
13988
|
-
})(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n width:
|
|
14569
|
+
})(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) {
|
|
13989
14570
|
var _a, _b;
|
|
13990
14571
|
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow;
|
|
13991
14572
|
var spaces = getSpaces(props);
|
|
@@ -14019,7 +14600,7 @@ var StyledSubItem = styled$2(MenuItem)(templateObject_7 || (templateObject_7 = _
|
|
|
14019
14600
|
var templateObject_1$g, templateObject_2$9, templateObject_3$4, templateObject_4$3, templateObject_5$2, templateObject_6$1, templateObject_7;
|
|
14020
14601
|
|
|
14021
14602
|
function SecondaryNavItem(_a) {
|
|
14022
|
-
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow;
|
|
14603
|
+
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow, rest = __rest(_a, ["item", "hasInvertedStyle", "isNarrow"]);
|
|
14023
14604
|
var _b = useState(null), anchorEl = _b[0], setAnchorEl = _b[1];
|
|
14024
14605
|
var open = Boolean(anchorEl);
|
|
14025
14606
|
function onClose() {
|
|
@@ -14034,32 +14615,39 @@ function SecondaryNavItem(_a) {
|
|
|
14034
14615
|
}
|
|
14035
14616
|
setMenuWidth(button.offsetWidth);
|
|
14036
14617
|
}, []);
|
|
14037
|
-
return (jsxs(Fragment$1, { children: [item.
|
|
14038
|
-
|
|
14039
|
-
|
|
14040
|
-
|
|
14041
|
-
|
|
14042
|
-
|
|
14043
|
-
|
|
14044
|
-
|
|
14045
|
-
|
|
14618
|
+
return (jsxs(Fragment$1, { children: [item.itemType === "text" && (jsx(StyledTextItem, __assign({ sdsStyle: "minimal", onClick: item.onClick, hasInvertedStyle: hasInvertedStyle, open: open, isNarrow: isNarrow }, rest, { children: item.label }))), item.itemType === "dropdown" && !isNarrow && (jsxs(Fragment, { children: [jsxs(StyledTextItem, { sdsStyle: "minimal", ref: buttonRef, onClick: function (event) { return setAnchorEl(event.currentTarget); }, hasInvertedStyle: hasInvertedStyle, open: open, isNarrow: isNarrow, children: [jsx("span", { children: item.label }), jsx(Icon, { sdsIcon: open ? "ChevronUp" : "ChevronDown", sdsSize: "xs" })] }), jsx(Menu, { anchorEl: anchorEl, open: open, onClose: onClose, children: item.items.map(function (subItem) {
|
|
14619
|
+
var label = subItem.label, onClick = subItem.onClick, subItemRest = __rest(subItem, ["label", "onClick"]);
|
|
14620
|
+
return (jsx(MenuItem, __assign({ onClick: function () {
|
|
14621
|
+
onClick === null || onClick === void 0 ? void 0 : onClick();
|
|
14622
|
+
onClose();
|
|
14623
|
+
} }, subItemRest, { children: label }), label));
|
|
14624
|
+
}) })] })), item.itemType === "dropdown" && isNarrow && (jsxs(StyledAccordion, { id: "".concat(item.label, "-dropdown"), hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: [jsx(AccordionHeader, { children: item.label }), jsx(AccordionDetails, { children: item.items.map(function (subItem) {
|
|
14625
|
+
var label = subItem.label, onClick = subItem.onClick, accordionSubItemRest = __rest(subItem, ["label", "onClick"]);
|
|
14626
|
+
return (jsx(StyledSubItem, __assign({ onClick: function () {
|
|
14627
|
+
onClick === null || onClick === void 0 ? void 0 : onClick();
|
|
14628
|
+
onClose();
|
|
14629
|
+
}, sx: { width: menuWidth } }, accordionSubItemRest, { children: label }), label));
|
|
14630
|
+
}) })] }))] }, item.label));
|
|
14046
14631
|
}
|
|
14047
14632
|
function NavigationHeaderSecondaryNav(_a) {
|
|
14048
14633
|
var items = _a.items, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow;
|
|
14049
|
-
return (jsx(StyledSection, { gap: "l", isNarrow: isNarrow, children: items.map(function (item) {
|
|
14634
|
+
return (jsx(StyledSection, { gap: "l", isNarrow: isNarrow, children: items.map(function (item) {
|
|
14635
|
+
var itemType = item.itemType, label = item.label, rest = __rest(item, ["itemType", "label"]);
|
|
14636
|
+
return (jsx(SecondaryNavItem, __assign({ item: item, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow }, rest), "".concat(label, "-").concat(itemType)));
|
|
14637
|
+
}) }));
|
|
14050
14638
|
}
|
|
14051
14639
|
|
|
14052
14640
|
var NavigationHeader = forwardRef(function (props, ref) {
|
|
14053
|
-
var activePrimaryNavKey = props.activePrimaryNavKey, buttons = props.buttons, hasInvertedStyle = props.hasInvertedStyle, logo = props.logo, logoUrl = props.logoUrl, primaryNavItems = props.primaryNavItems,
|
|
14641
|
+
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"]);
|
|
14054
14642
|
var navRef = useRef(null);
|
|
14055
14643
|
var theme = useTheme();
|
|
14056
14644
|
var isMdScreen = useMediaQuery(theme.breakpoints.down("md"));
|
|
14057
14645
|
useEffect(function () {
|
|
14058
14646
|
setIsNarrow(isMdScreen);
|
|
14059
14647
|
}, [isMdScreen]);
|
|
14060
|
-
var
|
|
14061
|
-
var
|
|
14062
|
-
var
|
|
14648
|
+
var _d = useState(true), drawerOpen = _d[0], setDrawerOpen = _d[1];
|
|
14649
|
+
var _e = useState(isMdScreen), isNarrow = _e[0], setIsNarrow = _e[1];
|
|
14650
|
+
var _f = useState(0), breakpoint = _f[0], setBreakpoint = _f[1];
|
|
14063
14651
|
var checkScrollable = useCallback(function () {
|
|
14064
14652
|
if (!navRef.current)
|
|
14065
14653
|
return;
|
|
@@ -14084,8 +14672,8 @@ var NavigationHeader = forwardRef(function (props, ref) {
|
|
|
14084
14672
|
};
|
|
14085
14673
|
var renderLogoNode = function () {
|
|
14086
14674
|
var logoNode = (jsxs(StyledTitleContainer, { hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: [jsx(StyledLogoWrapper, { children: logo }), jsx("p", { children: title }), tag && jsx(StyledTag, { color: tagColor, label: tag, hover: false })] }));
|
|
14087
|
-
if (logoUrl) {
|
|
14088
|
-
logoNode = (jsx(StyledLogoLinkWrapper, { href: logoUrl, isNarrow: isNarrow, children: logoNode }));
|
|
14675
|
+
if (logoLinkComponent || logoUrl) {
|
|
14676
|
+
logoNode = (jsx(StyledLogoLinkWrapper, __assign({ component: logoLinkComponent, href: logoUrl }, logoLinkProps, { isNarrow: isNarrow, children: logoNode })));
|
|
14089
14677
|
}
|
|
14090
14678
|
return logoNode;
|
|
14091
14679
|
};
|
|
@@ -14201,7 +14789,7 @@ var StyledTab$1 = styled$2(Tab$1, {
|
|
|
14201
14789
|
var _a, _b, _c;
|
|
14202
14790
|
var spaces = getSpaces(props);
|
|
14203
14791
|
var semanticColors = getSemanticColors(props);
|
|
14204
|
-
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.
|
|
14792
|
+
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 ");
|
|
14205
14793
|
});
|
|
14206
14794
|
var templateObject_1$f, templateObject_2$8;
|
|
14207
14795
|
|
|
@@ -14705,7 +15293,7 @@ var StyledSegmentedControl = styled$2(ToggleButtonGroup, {
|
|
|
14705
15293
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
14706
15294
|
var spaces = getSpaces(props);
|
|
14707
15295
|
var semanticColors = getSemanticColors(props);
|
|
14708
|
-
return "\n .".concat(toggleButtonClasses.root, ".").concat(toggleButtonClasses.disabled, " {\n border-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.
|
|
15296
|
+
return "\n .".concat(toggleButtonClasses.root, ".").concat(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(toggleButtonClasses.root, ".").concat(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(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 ");
|
|
14709
15297
|
});
|
|
14710
15298
|
var StyledToggleButton = styled$2(ToggleButton, {
|
|
14711
15299
|
shouldForwardProp: function (prop) { return !doNotForwardProps$1.includes(prop); },
|
|
@@ -14794,7 +15382,7 @@ var TableRow = forwardRef(function (props, ref) {
|
|
|
14794
15382
|
var StyledTableHeader = styled$2("thead")(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14795
15383
|
var _a;
|
|
14796
15384
|
var semanticColors = getSemanticColors(props);
|
|
14797
|
-
return "\n border-bottom: solid 2px ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.
|
|
15385
|
+
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 ");
|
|
14798
15386
|
});
|
|
14799
15387
|
var templateObject_1$5;
|
|
14800
15388
|
|
|
@@ -14869,7 +15457,7 @@ var StyledTab = styled$2(Tab$1, {
|
|
|
14869
15457
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
14870
15458
|
var spaces = getSpaces(props);
|
|
14871
15459
|
var semanticColors = getSemanticColors(props);
|
|
14872
|
-
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.
|
|
15460
|
+
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 ");
|
|
14873
15461
|
});
|
|
14874
15462
|
function tabFontMixin(props) {
|
|
14875
15463
|
var sdsSize = props.sdsSize;
|
|
@@ -15002,4 +15590,4 @@ var TooltipTableContent = function (props) {
|
|
|
15002
15590
|
return (jsxs(TableContainer, __assign({}, rest, { children: [contentAlert && jsx(Alert, { children: contentAlert }), data === null || data === void 0 ? void 0 : data.map(function (section, index) { return (jsxs(Section, { disabled: section.disabled, children: [jsx(SectionLabel, { disabled: section.disabled, label: section.label, children: section.label }), jsx(Table$1, { size: "small", children: jsx(TableBody, { children: section.dataRows.map(function (row, rowIndex) { return (jsxs(TableRow$1, { children: [jsx(RowLabel, { disabled: section.disabled, align: "left", children: row.label }), jsx(RowValue, { disabled: section.disabled, align: itemAlign, children: row.value })] }, row.label + String(rowIndex))); }) }) })] }, "".concat(section.label + String(index)))); })] })));
|
|
15003
15591
|
};
|
|
15004
15592
|
|
|
15005
|
-
export { Accordion, AccordionDetails, AccordionHeader, Alert$1 as Alert, Autocomplete, StyledPopper$2 as AutocompleteMultiColumnStyledPopper, StyledPaper$3 as AutocompleteSingleColumnStyledPaper, Banner, Button, ButtonDropdown, ButtonIcon, ButtonToggle, Callout, CalloutTitle, CellBasic, CellComponent, CellHeader, Chip, ComplexFilter, InputDropdown as ComplexFilterInputDropdown, StyledPopper as ComplexFilterPopper, Dialog, DialogActions, index as DialogContent, DialogContext, DialogPaper, DialogTitle, Overline as DialogTitleOverline, Subtitle as DialogTitleSubtitle, Title as DialogTitleTitle, Dropdown, InputDropdown as DropdownInputDropdown, DropdownMenu, StyledPaper$1 as DropdownPaper, StyledPopper as DropdownPopper, Icon, InputCheckbox, InputDropdown, InputRadio, InputSearch, InputSlider, InputText, InputToggle, Link, List, ListItem, ListItemLabel, ListSubheader, LoadingIndicator, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, Menu, MenuItem, MenuSelect, NavigationHeader, NavigationJumpTo, Notification, Pagination, Panel, SDSChooseTheme, SDSDarkAppTheme, SDSLightAppTheme, SDSPaletteDark, SDSPaletteLight, SegmentedControl, Tab, Table, TableHeader, TableRow, Tabs, Tag, TagFilter, Theme, Tooltip, TooltipCondensed, TooltipTableContent as TooltipTable, defaultAppTheme, defaultTheme$4 as defaultTheme, focusVisibleA11yStyle, fontBody, fontBodyL$1 as fontBodyL, fontBodyM$1 as fontBodyM, fontBodyS$1 as fontBodyS, fontBodySemiboldL, fontBodySemiboldM, fontBodySemiboldS, fontBodySemiboldXs, fontBodySemiboldXxs, fontBodySemiboldXxxs, fontBodyXs$2 as fontBodyXs, fontBodyXxs$1 as fontBodyXxs, fontBodyXxxs$1 as fontBodyXxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontCode, fontCodeS, fontCodeSemiboldS, fontCodeSemiboldXs, fontCodeXs, fontHeader, fontHeaderL, fontHeaderM$1 as fontHeaderM, fontHeaderS, fontHeaderXl, fontHeaderXs, fontHeaderXxl, fontHeaderXxs, fontHeaderXxxs, fontTabular, fontTabularS, fontTabularSemiboldS, fontTabularSemiboldXs, fontTabularXs, getBorders, getBreakpoints, getColors, getCorners, getFontWeights, getIconSizes, getMode, getPalette, getSemanticColors, getShadows, getSpaces, getSpacings, getTypography, makeSdsSemanticAppTheme, makeThemeOptions };
|
|
15593
|
+
export { Accordion, AccordionDetails, AccordionHeader, Alert$1 as Alert, Autocomplete, StyledPopper$2 as AutocompleteMultiColumnStyledPopper, StyledPaper$3 as AutocompleteSingleColumnStyledPaper, Banner, Button, ButtonDropdown, ButtonIcon, ButtonToggle, Callout, CalloutTitle, CellBasic, CellComponent, CellHeader, Chip, ComplexFilter, InputDropdown as ComplexFilterInputDropdown, StyledPopper as ComplexFilterPopper, ContentCard, ContentCardActions, StyledContentCardBody as ContentCardBody, Dialog, DialogActions, index as DialogContent, DialogContext, DialogPaper, DialogTitle, Overline as DialogTitleOverline, Subtitle as DialogTitleSubtitle, Title as DialogTitleTitle, Dropdown, InputDropdown as DropdownInputDropdown, DropdownMenu, StyledPaper$1 as DropdownPaper, StyledPopper as DropdownPopper, Icon, InputCheckbox, InputDropdown, InputRadio, InputSearch, InputSlider, InputText, InputToggle, Link, List, ListItem, ListItemLabel, ListSubheader, LoadingIndicator, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, Menu, MenuItem, MenuSelect, NavigationFooter, NavigationHeader, NavigationJumpTo, Notification, Pagination, Panel, SDSChooseTheme, SDSDarkAppTheme, SDSLightAppTheme, SDSPaletteDark, SDSPaletteLight, SegmentedControl, Tab, Table, TableHeader, TableRow, Tabs, Tag, TagFilter, Theme, Tooltip, TooltipCondensed, TooltipTableContent as TooltipTable, defaultAppTheme, defaultTheme$4 as defaultTheme, focusVisibleA11yStyle, fontBody, fontBodyL$1 as fontBodyL, fontBodyM$1 as fontBodyM, fontBodyS$1 as fontBodyS, fontBodySemiboldL, fontBodySemiboldM, fontBodySemiboldS, fontBodySemiboldXs, fontBodySemiboldXxs, fontBodySemiboldXxxs, fontBodyXs$2 as fontBodyXs, fontBodyXxs$1 as fontBodyXxs, fontBodyXxxs$1 as fontBodyXxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontCode, fontCodeS, fontCodeSemiboldS, fontCodeSemiboldXs, fontCodeXs, fontHeader, fontHeaderL, fontHeaderM$1 as fontHeaderM, fontHeaderS, fontHeaderXl, fontHeaderXs, fontHeaderXxl, fontHeaderXxs, fontHeaderXxxs, fontTabular, fontTabularS, fontTabularSemiboldS, fontTabularSemiboldXs, fontTabularXs, getBorders, getBreakpoints, getColors, getCorners, getFontWeights, getIconSizes, getMode, getPalette, getSemanticColors, getShadows, getSpaces, getSpacings, getTypography, makeSdsSemanticAppTheme, makeThemeOptions };
|