@czi-sds/components 22.2.0 → 22.3.0
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 +120 -24
- package/dist/index.cjs.js +1003 -407
- package/dist/index.esm.d.ts +120 -24
- package/dist/index.esm.js +999 -410
- 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,
|
|
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, CardActionArea, 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';
|
|
@@ -226,7 +227,7 @@ var sharedAppTheme = {
|
|
|
226
227
|
fontWeights: {
|
|
227
228
|
bold: 700,
|
|
228
229
|
light: 300,
|
|
229
|
-
medium:
|
|
230
|
+
medium: 500,
|
|
230
231
|
regular: 400,
|
|
231
232
|
semibold: 600,
|
|
232
233
|
},
|
|
@@ -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],
|
|
@@ -1223,23 +1224,37 @@ function makeThemeOptions(appTheme, mode) {
|
|
|
1223
1224
|
},
|
|
1224
1225
|
},
|
|
1225
1226
|
components: {
|
|
1227
|
+
MuiButton: {
|
|
1228
|
+
defaultProps: {
|
|
1229
|
+
disableFocusRipple: true,
|
|
1230
|
+
disableRipple: true,
|
|
1231
|
+
disableTouchRipple: true,
|
|
1232
|
+
},
|
|
1233
|
+
},
|
|
1226
1234
|
MuiButtonBase: {
|
|
1227
1235
|
defaultProps: {
|
|
1228
1236
|
disableRipple: true,
|
|
1237
|
+
disableTouchRipple: true,
|
|
1238
|
+
},
|
|
1239
|
+
},
|
|
1240
|
+
MuiButtonGroup: {
|
|
1241
|
+
defaultProps: {
|
|
1242
|
+
disableFocusRipple: true,
|
|
1243
|
+
disableRipple: true,
|
|
1229
1244
|
},
|
|
1230
|
-
// styleOverrides: {
|
|
1231
|
-
// root: {
|
|
1232
|
-
// "&:hover": {
|
|
1233
|
-
// boxShadow: "none",
|
|
1234
|
-
// },
|
|
1235
|
-
// },
|
|
1236
|
-
// },
|
|
1237
1245
|
},
|
|
1238
1246
|
MuiDrawer: {
|
|
1239
1247
|
defaultProps: {
|
|
1240
1248
|
hideBackdrop: true,
|
|
1241
1249
|
},
|
|
1242
1250
|
},
|
|
1251
|
+
MuiIconButton: {
|
|
1252
|
+
defaultProps: {
|
|
1253
|
+
disableFocusRipple: true,
|
|
1254
|
+
disableRipple: true,
|
|
1255
|
+
disableTouchRipple: true,
|
|
1256
|
+
},
|
|
1257
|
+
},
|
|
1243
1258
|
MuiLink: {
|
|
1244
1259
|
defaultProps: {
|
|
1245
1260
|
underline: "hover",
|
|
@@ -1247,7 +1262,16 @@ function makeThemeOptions(appTheme, mode) {
|
|
|
1247
1262
|
},
|
|
1248
1263
|
MuiTab: {
|
|
1249
1264
|
defaultProps: {
|
|
1265
|
+
disableFocusRipple: true,
|
|
1266
|
+
disableRipple: true,
|
|
1267
|
+
disableTouchRipple: true,
|
|
1268
|
+
},
|
|
1269
|
+
},
|
|
1270
|
+
MuiToggleButton: {
|
|
1271
|
+
defaultProps: {
|
|
1272
|
+
disableFocusRipple: true,
|
|
1250
1273
|
disableRipple: true,
|
|
1274
|
+
disableTouchRipple: true,
|
|
1251
1275
|
},
|
|
1252
1276
|
},
|
|
1253
1277
|
},
|
|
@@ -1512,7 +1536,7 @@ var getBreakpoints = function (_a) {
|
|
|
1512
1536
|
function focusVisibleA11yStyle(props) {
|
|
1513
1537
|
var _a;
|
|
1514
1538
|
var semanticColors = getSemanticColors(props);
|
|
1515
|
-
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 ");
|
|
1516
1540
|
}
|
|
1517
1541
|
|
|
1518
1542
|
var fontBody = function (fontSize, fontWeight, isNarrow) {
|
|
@@ -1525,7 +1549,7 @@ var fontBody = function (fontSize, fontWeight, isNarrow) {
|
|
|
1525
1549
|
return null;
|
|
1526
1550
|
var body = typography.wideStyles.body, narrowBody = typography.narrowStyles.body, bodyFontFamily = typography.fontFamily.body;
|
|
1527
1551
|
if (isNarrow) {
|
|
1528
|
-
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));
|
|
1529
1553
|
}
|
|
1530
1554
|
return themeToCss(body[fontWeight][fontSize], bodyFontFamily);
|
|
1531
1555
|
};
|
|
@@ -1550,8 +1574,8 @@ var fontCaps = function (fontSize, isNarrow) {
|
|
|
1550
1574
|
if (!typography)
|
|
1551
1575
|
return null;
|
|
1552
1576
|
var caps = typography.wideStyles.caps, narrowCaps = typography.narrowStyles.caps, capsFontFamily = typography.fontFamily.caps;
|
|
1553
|
-
return css(templateObject_3$
|
|
1554
|
-
? 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));
|
|
1555
1579
|
};
|
|
1556
1580
|
};
|
|
1557
1581
|
var fontCapsXxs = fontCaps("xxs");
|
|
@@ -1566,7 +1590,7 @@ var fontHeader = function (fontSize, isNarrow) {
|
|
|
1566
1590
|
return null;
|
|
1567
1591
|
var header = typography.wideStyles.header, narrowHeader = typography.narrowStyles.header, headerFontFamily = typography.fontFamily.header;
|
|
1568
1592
|
if (isNarrow) {
|
|
1569
|
-
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));
|
|
1570
1594
|
}
|
|
1571
1595
|
return themeToCss(header.semibold[fontSize], headerFontFamily);
|
|
1572
1596
|
};
|
|
@@ -1589,7 +1613,7 @@ var fontCode = function (fontSize, fontWeight, isNarrow) {
|
|
|
1589
1613
|
return null;
|
|
1590
1614
|
var code = typography.wideStyles.code, narrowCode = typography.narrowStyles.code, codeFontFamily = typography.fontFamily.code;
|
|
1591
1615
|
if (isNarrow) {
|
|
1592
|
-
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));
|
|
1593
1617
|
}
|
|
1594
1618
|
return themeToCss(code[fontWeight][fontSize], codeFontFamily);
|
|
1595
1619
|
};
|
|
@@ -1607,8 +1631,8 @@ var fontTabular = function (fontSize, fontWeight, isNarrow) {
|
|
|
1607
1631
|
if (!typography)
|
|
1608
1632
|
return null;
|
|
1609
1633
|
var tabular = typography.wideStyles.tabular, narrowTabular = typography.narrowStyles.tabular, tabularFontFamily = typography.fontFamily.tabular;
|
|
1610
|
-
return css(templateObject_7$
|
|
1611
|
-
? 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));
|
|
1612
1636
|
};
|
|
1613
1637
|
};
|
|
1614
1638
|
var fontTabularXs = fontTabular("xs", "regular");
|
|
@@ -1617,33 +1641,33 @@ var fontTabularSemiboldXs = fontTabular("xs", "semibold");
|
|
|
1617
1641
|
var fontTabularSemiboldS = fontTabular("s", "semibold");
|
|
1618
1642
|
function themeToCss(fontTheme, fontFamily) {
|
|
1619
1643
|
if (fontFamily === void 0) { fontFamily = "inherit"; }
|
|
1620
|
-
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);
|
|
1621
1645
|
}
|
|
1622
|
-
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;
|
|
1623
1647
|
|
|
1624
|
-
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) {
|
|
1625
1649
|
var spaces = getSpaces(props);
|
|
1626
|
-
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);
|
|
1627
1651
|
});
|
|
1628
|
-
var templateObject_1$
|
|
1652
|
+
var templateObject_1$18, templateObject_2$M;
|
|
1629
1653
|
|
|
1630
1654
|
var AccordionDetails = function (props) {
|
|
1631
1655
|
var children = props.children;
|
|
1632
1656
|
return jsx(StyledAccordionDetails, { children: children });
|
|
1633
1657
|
};
|
|
1634
1658
|
|
|
1635
|
-
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) {
|
|
1636
1660
|
var _a, _b;
|
|
1637
1661
|
var spaces = getSpaces(props);
|
|
1638
1662
|
var semanticColors = getSemanticColors(props);
|
|
1639
|
-
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);
|
|
1640
1664
|
});
|
|
1641
|
-
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) {
|
|
1642
1666
|
var _a;
|
|
1643
1667
|
var semanticColors = getSemanticColors(props);
|
|
1644
|
-
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);
|
|
1645
1669
|
});
|
|
1646
|
-
var templateObject_1$
|
|
1670
|
+
var templateObject_1$17, templateObject_2$L, templateObject_3$B, templateObject_4$u;
|
|
1647
1671
|
|
|
1648
1672
|
var _path$26, _path2$C, _path3$6;
|
|
1649
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); }
|
|
@@ -4353,22 +4377,22 @@ var iconMap = {
|
|
|
4353
4377
|
},
|
|
4354
4378
|
};
|
|
4355
4379
|
|
|
4356
|
-
var doNotForwardProps$
|
|
4380
|
+
var doNotForwardProps$F = ["sdsIcon", "sdsSize", "iconColor"];
|
|
4357
4381
|
/**
|
|
4358
4382
|
* @see https://mui.com/material-ui/icons/#svgicon
|
|
4359
4383
|
*/
|
|
4360
4384
|
var StyledSvgIcon = styled$2(SvgIcon, {
|
|
4361
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4362
|
-
})(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) {
|
|
4363
4387
|
var _a, _b, _c;
|
|
4364
4388
|
var mode = getMode(props);
|
|
4365
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;
|
|
4366
4390
|
var iconSizes = getIconSizes(props);
|
|
4367
4391
|
var colors = getColors(props);
|
|
4368
|
-
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);
|
|
4369
4393
|
});
|
|
4370
|
-
var StyledIcon$1 = styled$2("div")(templateObject_3$
|
|
4371
|
-
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;
|
|
4372
4396
|
|
|
4373
4397
|
/**
|
|
4374
4398
|
* @see https://mui.com/material-ui/icons/#icons
|
|
@@ -4399,24 +4423,24 @@ var StyledAccordion$1 = styled$2(Accordion$1, {
|
|
|
4399
4423
|
shouldForwardProp: function (prop) {
|
|
4400
4424
|
return !sdsPropNames$2.includes(prop.toString());
|
|
4401
4425
|
},
|
|
4402
|
-
})(templateObject_2$
|
|
4426
|
+
})(templateObject_2$J || (templateObject_2$J = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4403
4427
|
var _a, _b;
|
|
4404
4428
|
var useDivider = props.useDivider, togglePosition = props.togglePosition;
|
|
4405
4429
|
var shadows = getShadows(props);
|
|
4406
4430
|
var typography = getTypography(props);
|
|
4407
4431
|
var borders = getBorders(props);
|
|
4408
4432
|
var spaces = getSpaces(props);
|
|
4409
|
-
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));
|
|
4410
4434
|
});
|
|
4411
4435
|
var leftPosition = function (props) {
|
|
4412
4436
|
var _a, _b, _c;
|
|
4413
4437
|
var spaces = getSpaces(props);
|
|
4414
4438
|
var iconSizes = getIconSizes(props);
|
|
4415
|
-
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) +
|
|
4416
4440
|
((_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width) !== null && _b !== void 0 ? _b : 12) +
|
|
4417
4441
|
((_c = spaces === null || spaces === void 0 ? void 0 : spaces.s) !== null && _c !== void 0 ? _c : 8));
|
|
4418
4442
|
};
|
|
4419
|
-
var templateObject_1$
|
|
4443
|
+
var templateObject_1$15, templateObject_2$J, templateObject_3$z;
|
|
4420
4444
|
|
|
4421
4445
|
/**
|
|
4422
4446
|
* @see https://mui.com/material-ui/react-accordion/
|
|
@@ -4432,7 +4456,7 @@ var Accordion = React__default.forwardRef(function (props, ref) {
|
|
|
4432
4456
|
return (jsx(StyledAccordion$1, __assign({ square: true, useDivider: useDivider, togglePosition: togglePosition, expanded: expanded === id, onChange: handleChange(id), ref: ref }, props, { children: children })));
|
|
4433
4457
|
});
|
|
4434
4458
|
|
|
4435
|
-
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) {
|
|
4436
4460
|
var _a;
|
|
4437
4461
|
var colors = getColors(props);
|
|
4438
4462
|
var spaces = getSpaces(props);
|
|
@@ -4459,7 +4483,7 @@ function severityToColor(alertSeverity, colors) {
|
|
|
4459
4483
|
return colors === null || colors === void 0 ? void 0 : colors.green;
|
|
4460
4484
|
}
|
|
4461
4485
|
}
|
|
4462
|
-
var templateObject_1$
|
|
4486
|
+
var templateObject_1$14;
|
|
4463
4487
|
|
|
4464
4488
|
/**
|
|
4465
4489
|
* @see https://mui.com/material-ui/react-alert/
|
|
@@ -4487,6 +4511,20 @@ function filterProps(props, excludeProps) {
|
|
|
4487
4511
|
}
|
|
4488
4512
|
return result;
|
|
4489
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
|
+
};
|
|
4490
4528
|
|
|
4491
4529
|
var _a;
|
|
4492
4530
|
var SDSWarningTypes;
|
|
@@ -4501,6 +4539,8 @@ var SDSWarningTypes;
|
|
|
4501
4539
|
SDSWarningTypes["TooltipSubtitle"] = "tooltipSubtitle";
|
|
4502
4540
|
SDSWarningTypes["TooltipWidth"] = "tooltipWidth";
|
|
4503
4541
|
SDSWarningTypes["TooltipInvertStyle"] = "tooltipInvertStyle";
|
|
4542
|
+
SDSWarningTypes["ContentCardActionsOnlyButtons"] = "contentCardActionsOnlyButtons";
|
|
4543
|
+
SDSWarningTypes["ClickableContentCardNumberOfButtons"] = "clickableContentCardNumberOfButtons";
|
|
4504
4544
|
})(SDSWarningTypes || (SDSWarningTypes = {}));
|
|
4505
4545
|
var SDS_WARNINGS = (_a = {},
|
|
4506
4546
|
_a[SDSWarningTypes.ButtonMinimalIsAllCaps] = {
|
|
@@ -4543,6 +4583,14 @@ var SDS_WARNINGS = (_a = {},
|
|
|
4543
4583
|
hasWarned: false,
|
|
4544
4584
|
message: "Warning: Tooltips using the inverted or sdsStyle prop will be deprecated. Please use hasInvertedStyle instead!",
|
|
4545
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
|
+
},
|
|
4546
4594
|
_a);
|
|
4547
4595
|
var showWarningIfFirstOccurence = function (warningType) {
|
|
4548
4596
|
if (!(warningType in SDS_WARNINGS)) {
|
|
@@ -4560,7 +4608,7 @@ var showWarningIfFirstOccurence = function (warningType) {
|
|
|
4560
4608
|
SDS_WARNINGS[warningType].hasWarned = true;
|
|
4561
4609
|
};
|
|
4562
4610
|
|
|
4563
|
-
var doNotForwardProps$
|
|
4611
|
+
var doNotForwardProps$E = [
|
|
4564
4612
|
"isAllCaps",
|
|
4565
4613
|
"isRounded",
|
|
4566
4614
|
"sdsStyle",
|
|
@@ -4594,16 +4642,17 @@ var ButtonStyles = function (props) {
|
|
|
4594
4642
|
: (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.fillPrimary;
|
|
4595
4643
|
var disabledBackgroundColor = variant === "outlined" ? "transparent" : (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.fillDisabled;
|
|
4596
4644
|
var disabledBorder = variant === "outlined"
|
|
4597
|
-
? "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)
|
|
4598
4646
|
: "none";
|
|
4599
4647
|
var boxshadow = variant === "outlined"
|
|
4600
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)
|
|
4601
4649
|
: "none";
|
|
4602
|
-
|
|
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);
|
|
4603
4652
|
};
|
|
4604
4653
|
var Rounded = function (props) {
|
|
4605
4654
|
var corners = getCorners(props);
|
|
4606
|
-
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);
|
|
4607
4656
|
};
|
|
4608
4657
|
var DestructiveButton = function (props) {
|
|
4609
4658
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
@@ -4622,13 +4671,13 @@ var DestructiveButton = function (props) {
|
|
|
4622
4671
|
var boxshadow = variant === "outlined"
|
|
4623
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)
|
|
4624
4673
|
: "none";
|
|
4625
|
-
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);
|
|
4626
4675
|
};
|
|
4627
4676
|
var StyledButton$3 = styled$2(Button$1, {
|
|
4628
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4629
|
-
})(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) {
|
|
4630
4679
|
var sdsStyle = props.sdsStyle, sdsType = props.sdsType, isAllCaps = props.isAllCaps;
|
|
4631
|
-
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));
|
|
4632
4681
|
});
|
|
4633
4682
|
// Minimal Button Styles
|
|
4634
4683
|
var Minimal = function (props) {
|
|
@@ -4637,60 +4686,60 @@ var Minimal = function (props) {
|
|
|
4637
4686
|
var spaces = getSpaces(props);
|
|
4638
4687
|
var iconSizes = getIconSizes(props);
|
|
4639
4688
|
var semanticColors = getSemanticColors(props);
|
|
4640
|
-
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);
|
|
4641
4690
|
};
|
|
4642
4691
|
var PrimaryMinimalButton = function (props) {
|
|
4643
4692
|
var _a, _b;
|
|
4644
4693
|
var semanticColors = getSemanticColors(props);
|
|
4645
|
-
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);
|
|
4646
4695
|
};
|
|
4647
4696
|
var SecondaryMinimalButton = function (props) {
|
|
4648
4697
|
var _a, _b;
|
|
4649
4698
|
var semanticColors = getSemanticColors(props);
|
|
4650
|
-
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);
|
|
4651
4700
|
};
|
|
4652
4701
|
var StyledMinimalButton = styled$2(Button$1, {
|
|
4653
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4654
|
-
})(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) {
|
|
4655
4704
|
var sdsType = props.sdsType;
|
|
4656
|
-
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));
|
|
4657
4706
|
});
|
|
4658
4707
|
var StyledButtonLegacy = styled$2(Button$1, {
|
|
4659
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4660
|
-
})(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) {
|
|
4661
4710
|
if (!props.isRounded)
|
|
4662
4711
|
return "";
|
|
4663
4712
|
var corners = getCorners(props);
|
|
4664
4713
|
var spaces = getSpaces(props);
|
|
4665
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 ");
|
|
4666
4715
|
});
|
|
4667
|
-
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;
|
|
4668
4717
|
|
|
4669
4718
|
var isDisabled$1 = function (props) {
|
|
4670
4719
|
var _a, _b;
|
|
4671
4720
|
var semanticColors = getSemanticColors(props);
|
|
4672
|
-
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);
|
|
4673
4722
|
};
|
|
4674
4723
|
var primary$2 = function (props) {
|
|
4675
4724
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4676
4725
|
var semanticColors = getSemanticColors(props);
|
|
4677
|
-
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);
|
|
4678
4727
|
};
|
|
4679
4728
|
var secondary$2 = function (props) {
|
|
4680
4729
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4681
4730
|
var semanticColors = getSemanticColors(props);
|
|
4682
|
-
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);
|
|
4683
4732
|
};
|
|
4684
4733
|
var tertiary = function (props) {
|
|
4685
4734
|
var _a, _b, _c, _d, _e, _f;
|
|
4686
4735
|
var semanticColors = getSemanticColors(props);
|
|
4687
|
-
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);
|
|
4688
4737
|
};
|
|
4689
4738
|
var small$1 = function (props) {
|
|
4690
4739
|
var sdsType = props.sdsType;
|
|
4691
4740
|
var iconSizes = getIconSizes(props);
|
|
4692
4741
|
var spaces = getSpaces(props);
|
|
4693
|
-
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"
|
|
4694
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;")
|
|
4695
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;") : "");
|
|
4696
4745
|
};
|
|
@@ -4698,7 +4747,7 @@ var medium$1 = function (props) {
|
|
|
4698
4747
|
var sdsType = props.sdsType;
|
|
4699
4748
|
var iconSizes = getIconSizes(props);
|
|
4700
4749
|
var spaces = getSpaces(props);
|
|
4701
|
-
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"
|
|
4702
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;")
|
|
4703
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;") : "");
|
|
4704
4753
|
};
|
|
@@ -4706,11 +4755,11 @@ var large = function (props) {
|
|
|
4706
4755
|
var sdsType = props.sdsType;
|
|
4707
4756
|
var iconSizes = getIconSizes(props);
|
|
4708
4757
|
var spaces = getSpaces(props);
|
|
4709
|
-
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"
|
|
4710
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;")
|
|
4711
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;") : "");
|
|
4712
4761
|
};
|
|
4713
|
-
var doNotForwardProps$
|
|
4762
|
+
var doNotForwardProps$D = [
|
|
4714
4763
|
"on",
|
|
4715
4764
|
"sdsSize",
|
|
4716
4765
|
"sdsType",
|
|
@@ -4720,12 +4769,12 @@ var doNotForwardProps$w = [
|
|
|
4720
4769
|
"customTheme",
|
|
4721
4770
|
];
|
|
4722
4771
|
var StyledButtonIcon = styled$2(IconButton, {
|
|
4723
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4724
|
-
})(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) {
|
|
4725
4774
|
var disabled = props.disabled, _a = props.sdsSize, sdsSize = _a === void 0 ? "medium" : _a, _b = props.sdsType, sdsType = _b === void 0 ? "primary" : _b;
|
|
4726
|
-
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));
|
|
4727
4776
|
});
|
|
4728
|
-
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;
|
|
4729
4778
|
|
|
4730
4779
|
var ButtonIconSizeToSdsIconSize = {
|
|
4731
4780
|
large: "xl",
|
|
@@ -4778,11 +4827,7 @@ var MUI_VARIANT_MAP = {
|
|
|
4778
4827
|
* @see https://mui.com/material-ui/react-button/
|
|
4779
4828
|
*/
|
|
4780
4829
|
var Button = React__default.forwardRef(function (props, ref) {
|
|
4781
|
-
var _a;
|
|
4782
|
-
var _b = props.sdsStyle, sdsStyle = _b === void 0 ? "square" : _b, sdsType = props.sdsType, _c = props.customTheme, customTheme = _c === void 0 ? "auto" : _c;
|
|
4783
|
-
var muiTheme = useTheme$4();
|
|
4784
|
-
var mode = ((_a = muiTheme === null || muiTheme === void 0 ? void 0 : muiTheme.palette) === null || _a === void 0 ? void 0 : _a.mode) || "light";
|
|
4785
|
-
var componentTheme = customTheme !== "auto" ? customTheme : mode;
|
|
4830
|
+
var _a = props.sdsStyle, sdsStyle = _a === void 0 ? "square" : _a, sdsType = props.sdsType;
|
|
4786
4831
|
if (!sdsStyle || !sdsType) {
|
|
4787
4832
|
showWarningIfFirstOccurence(SDSWarningTypes.ButtonMissingSDSProps);
|
|
4788
4833
|
}
|
|
@@ -4810,7 +4855,7 @@ var Button = React__default.forwardRef(function (props, ref) {
|
|
|
4810
4855
|
"sdsType",
|
|
4811
4856
|
];
|
|
4812
4857
|
var finalProps = filterProps(propsWithDefault, excludedProps);
|
|
4813
|
-
return (jsx(
|
|
4858
|
+
return (jsx(ButtonIcon, __assign({ icon: iconProps === null || iconProps === void 0 ? void 0 : iconProps.icon }, finalProps, { sdsType: sdsType, ref: ref })));
|
|
4814
4859
|
}
|
|
4815
4860
|
else {
|
|
4816
4861
|
showWarningIfFirstOccurence(SDSWarningTypes.ButtonIconMissingIconProp);
|
|
@@ -4818,16 +4863,16 @@ var Button = React__default.forwardRef(function (props, ref) {
|
|
|
4818
4863
|
}
|
|
4819
4864
|
}
|
|
4820
4865
|
case sdsStyle === "minimal":
|
|
4821
|
-
return (jsx(
|
|
4866
|
+
return (jsx(StyledMinimalButton, __assign({ color: "primary", variant: "text" }, propsWithDefault, { ref: ref, "data-style": sdsStyle })));
|
|
4822
4867
|
case sdsStyle === "rounded":
|
|
4823
4868
|
case sdsStyle === "square":
|
|
4824
|
-
return (jsx(
|
|
4869
|
+
return (jsx(StyledButton$3, __assign({ color: "primary", variant: sdsType ? MUI_VARIANT_MAP[sdsType] : "text" }, propsWithDefault, { ref: ref })));
|
|
4825
4870
|
default:
|
|
4826
|
-
return
|
|
4871
|
+
return jsx(StyledButtonLegacy, __assign({}, propsWithDefault, { ref: ref }));
|
|
4827
4872
|
}
|
|
4828
4873
|
});
|
|
4829
4874
|
|
|
4830
|
-
var doNotForwardProps$
|
|
4875
|
+
var doNotForwardProps$C = [
|
|
4831
4876
|
"sdsStyle",
|
|
4832
4877
|
"intent",
|
|
4833
4878
|
"handleSubmit",
|
|
@@ -4838,39 +4883,39 @@ var rounded$3 = function (props) {
|
|
|
4838
4883
|
var _a;
|
|
4839
4884
|
var corners = getCorners(props);
|
|
4840
4885
|
var semanticColors = getSemanticColors(props);
|
|
4841
|
-
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);
|
|
4842
4887
|
};
|
|
4843
4888
|
var applyIntentColor$2 = function (props, intent) {
|
|
4844
4889
|
var _a, _b, _c, _d;
|
|
4845
4890
|
var semanticColors = getSemanticColors(props);
|
|
4846
4891
|
var borders = getBorders(props);
|
|
4847
|
-
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);
|
|
4848
4893
|
};
|
|
4849
4894
|
var disabledStyled$2 = function (props) {
|
|
4850
4895
|
var _a, _b, _c, _d, _e;
|
|
4851
4896
|
var semanticColors = getSemanticColors(props);
|
|
4852
|
-
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);
|
|
4853
4898
|
};
|
|
4854
|
-
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) {
|
|
4855
4900
|
var spaces = getSpaces(props);
|
|
4856
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 ");
|
|
4857
4902
|
});
|
|
4858
4903
|
var StyledSearchBase = styled$2(TextField, {
|
|
4859
4904
|
shouldForwardProp: function (prop) {
|
|
4860
|
-
return !doNotForwardProps$
|
|
4905
|
+
return !doNotForwardProps$C.includes(prop.toString());
|
|
4861
4906
|
},
|
|
4862
|
-
})(templateObject_6$
|
|
4907
|
+
})(templateObject_6$i || (templateObject_6$i = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4863
4908
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
4864
4909
|
var intent = props.intent, disabled = props.disabled, sdsStyle = props.sdsStyle;
|
|
4865
4910
|
var spaces = getSpaces(props);
|
|
4866
4911
|
var iconSizes = getIconSizes(props);
|
|
4867
4912
|
var semanticColors = getSemanticColors(props);
|
|
4868
|
-
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));
|
|
4869
4914
|
});
|
|
4870
|
-
var StyledInputAdornment = styled$2(InputAdornment)(templateObject_7$
|
|
4871
|
-
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;
|
|
4872
4917
|
|
|
4873
|
-
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) {
|
|
4874
4919
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
4875
4920
|
var selected = props.selected;
|
|
4876
4921
|
var fontWeights = getFontWeights(props);
|
|
@@ -4878,7 +4923,7 @@ var StyledMenuItem$1 = styled$2(MenuItem$1)(templateObject_1$V || (templateObjec
|
|
|
4878
4923
|
var semanticColors = getSemanticColors(props);
|
|
4879
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 ");
|
|
4880
4925
|
});
|
|
4881
|
-
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"])));
|
|
4882
4927
|
var disabledStyles$2 = function (props) {
|
|
4883
4928
|
var _a;
|
|
4884
4929
|
var disabled = props.disabled;
|
|
@@ -4887,12 +4932,12 @@ var disabledStyles$2 = function (props) {
|
|
|
4887
4932
|
var semanticColors = getSemanticColors(props);
|
|
4888
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 ");
|
|
4889
4934
|
};
|
|
4890
|
-
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) {
|
|
4891
4936
|
var _a;
|
|
4892
4937
|
var semanticColors = getSemanticColors(props);
|
|
4893
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 ");
|
|
4894
4939
|
}, disabledStyles$2);
|
|
4895
|
-
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) {
|
|
4896
4941
|
var _a;
|
|
4897
4942
|
var disabled = props.disabled;
|
|
4898
4943
|
var spaces = getSpaces(props);
|
|
@@ -4900,20 +4945,20 @@ var StyledMenuItemIcon = styled$2("span")(templateObject_4$m || (templateObject_
|
|
|
4900
4945
|
var semanticColors = getSemanticColors(props);
|
|
4901
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 ");
|
|
4902
4947
|
});
|
|
4903
|
-
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) {
|
|
4904
4949
|
var _a;
|
|
4905
4950
|
var semanticColors = getSemanticColors(props);
|
|
4906
4951
|
var spaces = getSpaces(props);
|
|
4907
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 ");
|
|
4908
4953
|
}, disabledStyles$2);
|
|
4909
|
-
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) {
|
|
4910
4955
|
var spaces = getSpaces(props);
|
|
4911
4956
|
var iconSizes = getIconSizes(props);
|
|
4912
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 ");
|
|
4913
4958
|
});
|
|
4914
4959
|
var StyledCheck = styled$2(Check, {
|
|
4915
4960
|
shouldForwardProp: function (prop) { return prop !== "selected"; },
|
|
4916
|
-
})(templateObject_7$
|
|
4961
|
+
})(templateObject_7$c || (templateObject_7$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4917
4962
|
var _a, _b;
|
|
4918
4963
|
var selected = props.selected, disabled = props.disabled;
|
|
4919
4964
|
var iconSizes = getIconSizes(props);
|
|
@@ -4925,7 +4970,7 @@ var StyledCheck = styled$2(Check, {
|
|
|
4925
4970
|
});
|
|
4926
4971
|
var StyledMinus = styled$2(Remove, {
|
|
4927
4972
|
shouldForwardProp: function (prop) { return prop !== "selected"; },
|
|
4928
|
-
})(templateObject_8$
|
|
4973
|
+
})(templateObject_8$a || (templateObject_8$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4929
4974
|
var _a, _b;
|
|
4930
4975
|
var selected = props.selected, disabled = props.disabled;
|
|
4931
4976
|
var semanticColors = getSemanticColors(props);
|
|
@@ -4935,7 +4980,7 @@ var StyledMinus = styled$2(Remove, {
|
|
|
4935
4980
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.ornamentSelected;
|
|
4936
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 ");
|
|
4937
4982
|
});
|
|
4938
|
-
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;
|
|
4939
4984
|
|
|
4940
4985
|
/**
|
|
4941
4986
|
* @see https://mui.com/material-ui/react-menu/
|
|
@@ -5034,11 +5079,7 @@ var useDetectUserTabbing = function (ref) {
|
|
|
5034
5079
|
* @see https://mui.com/material-ui/react-text-field/
|
|
5035
5080
|
*/
|
|
5036
5081
|
var InputSearch = forwardRef(function InputSearch(props, ref) {
|
|
5037
|
-
var _a;
|
|
5038
|
-
var label = props.label, id = props.id, placeholder = props.placeholder, _b = props.sdsStyle, sdsStyle = _b === void 0 ? "square" : _b, _c = props.intent, intent = _c === void 0 ? "default" : _c, handleSubmit = props.handleSubmit, onChange = props.onChange, disabled = props.disabled, _d = props.customTheme, customTheme = _d === void 0 ? "auto" : _d, rest = __rest(props, ["label", "id", "placeholder", "sdsStyle", "intent", "handleSubmit", "onChange", "disabled", "customTheme"]);
|
|
5039
|
-
var muiTheme = useTheme$4();
|
|
5040
|
-
var mode = ((_a = muiTheme === null || muiTheme === void 0 ? void 0 : muiTheme.palette) === null || _a === void 0 ? void 0 : _a.mode) || "light";
|
|
5041
|
-
var componentTheme = customTheme !== "auto" ? customTheme : mode;
|
|
5082
|
+
var label = props.label, id = props.id, placeholder = props.placeholder, _a = props.sdsStyle, sdsStyle = _a === void 0 ? "square" : _a, _b = props.intent, intent = _b === void 0 ? "default" : _b, handleSubmit = props.handleSubmit, onChange = props.onChange, disabled = props.disabled, rest = __rest(props, ["label", "id", "placeholder", "sdsStyle", "intent", "handleSubmit", "onChange", "disabled"]);
|
|
5042
5083
|
/**
|
|
5043
5084
|
* (masoudmanson): In case that the ref is not provided, we will create a new one.
|
|
5044
5085
|
*/
|
|
@@ -5052,7 +5093,7 @@ var InputSearch = forwardRef(function InputSearch(props, ref) {
|
|
|
5052
5093
|
* user is tabbing, we can apply different styles for :focus and :focus-visible states.
|
|
5053
5094
|
*/
|
|
5054
5095
|
useDetectUserTabbing((ref ? ref : inputRef));
|
|
5055
|
-
var
|
|
5096
|
+
var _c = useState(""), value = _c[0], setValue = _c[1];
|
|
5056
5097
|
var handleChange = function (event) {
|
|
5057
5098
|
setValue(event.target.value);
|
|
5058
5099
|
if (onChange)
|
|
@@ -5088,7 +5129,7 @@ var InputSearch = forwardRef(function InputSearch(props, ref) {
|
|
|
5088
5129
|
console.error("Error: @czi-sds/components component InputText requires id and label props for accessibility.");
|
|
5089
5130
|
return jsx(Fragment, {});
|
|
5090
5131
|
}
|
|
5091
|
-
return (jsxs(
|
|
5132
|
+
return (jsxs(Fragment, { children: [jsx(StyledLabel$3, { htmlFor: id, children: label }), jsx(StyledSearchBase, __assign({ id: id, ref: ref ? ref : inputRef,
|
|
5092
5133
|
// passed to mui Input
|
|
5093
5134
|
InputProps: {
|
|
5094
5135
|
endAdornment: value ? (jsx(StyledInputAdornment, { position: "end", children: jsx(Button, { "aria-label": "clear-button", className: "input-search-clear-icon", onClick: clearInput, sdsType: "tertiary", sdsSize: "small", sdsStyle: "icon", disabled: disabled, icon: "XMarkCircle" }) })) : null,
|
|
@@ -5101,7 +5142,7 @@ var InputSearch = forwardRef(function InputSearch(props, ref) {
|
|
|
5101
5142
|
autoComplete: "one-time-code" }, rest))] }));
|
|
5102
5143
|
});
|
|
5103
5144
|
|
|
5104
|
-
var doNotForwardProps$
|
|
5145
|
+
var doNotForwardProps$B = [
|
|
5105
5146
|
"count",
|
|
5106
5147
|
"keepSearchOnSelect",
|
|
5107
5148
|
"search",
|
|
@@ -5110,18 +5151,18 @@ var doNotForwardProps$u = [
|
|
|
5110
5151
|
"onClickAway",
|
|
5111
5152
|
];
|
|
5112
5153
|
var StyledAutocompleteBase = styled$2(Autocomplete$1, {
|
|
5113
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5114
|
-
})(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) {
|
|
5115
5156
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
5116
5157
|
var search = props.search;
|
|
5117
5158
|
var spaces = getSpaces(props);
|
|
5118
5159
|
var borders = getBorders(props);
|
|
5119
5160
|
var semanticColors = getSemanticColors(props);
|
|
5120
|
-
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 ");
|
|
5121
5162
|
});
|
|
5122
5163
|
var InputBaseWrapper$1 = styled$2("div", {
|
|
5123
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5124
|
-
})(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) {
|
|
5125
5166
|
var search = props.search;
|
|
5126
5167
|
if (!search) {
|
|
5127
5168
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -5131,12 +5172,12 @@ var InputBaseWrapper$1 = styled$2("div", {
|
|
|
5131
5172
|
}
|
|
5132
5173
|
});
|
|
5133
5174
|
var StyledMenuInputSearch$1 = styled$2(InputSearch, {
|
|
5134
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5135
|
-
})(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) {
|
|
5136
5177
|
var search = _a.search;
|
|
5137
5178
|
return (search ? "auto" : "transparent");
|
|
5138
5179
|
});
|
|
5139
|
-
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) {
|
|
5140
5181
|
var _a;
|
|
5141
5182
|
var spaces = getSpaces(props);
|
|
5142
5183
|
var corners = getCorners(props);
|
|
@@ -5145,13 +5186,13 @@ var StyledPaper$3 = styled$2(Paper)(templateObject_4$l || (templateObject_4$l =
|
|
|
5145
5186
|
var semanticColors = getSemanticColors(props);
|
|
5146
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 ");
|
|
5147
5188
|
});
|
|
5148
|
-
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) {
|
|
5149
5190
|
var _a;
|
|
5150
5191
|
var semanticColors = getSemanticColors(props);
|
|
5151
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 ");
|
|
5152
5193
|
});
|
|
5153
|
-
var StyledMenuItemText = styled$2("div")(templateObject_6$
|
|
5154
|
-
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;
|
|
5155
5196
|
|
|
5156
5197
|
var AutocompleteBase = function (props) {
|
|
5157
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;
|
|
@@ -5312,27 +5353,27 @@ var AutocompleteBase = function (props) {
|
|
|
5312
5353
|
}
|
|
5313
5354
|
};
|
|
5314
5355
|
|
|
5315
|
-
var StyledColumn = styled$2("div")(templateObject_1$
|
|
5356
|
+
var StyledColumn = styled$2("div")(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5316
5357
|
var _a;
|
|
5317
5358
|
var _b = props.width, width = _b === void 0 ? 280 : _b;
|
|
5318
5359
|
var spaces = getSpaces(props);
|
|
5319
5360
|
var borders = getBorders(props);
|
|
5320
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 ");
|
|
5321
5362
|
});
|
|
5322
|
-
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) {
|
|
5323
5364
|
var _a;
|
|
5324
5365
|
var spaces = getSpaces(props);
|
|
5325
5366
|
var semanticColors = getSemanticColors(props);
|
|
5326
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 ");
|
|
5327
5368
|
});
|
|
5328
|
-
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) {
|
|
5329
5370
|
var _a, _b;
|
|
5330
5371
|
var spaces = getSpaces(props);
|
|
5331
5372
|
var iconSizes = getIconSizes(props);
|
|
5332
5373
|
var semanticColors = getSemanticColors(props);
|
|
5333
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 ");
|
|
5334
5375
|
});
|
|
5335
|
-
var templateObject_1$
|
|
5376
|
+
var templateObject_1$_, templateObject_2$D, templateObject_3$t;
|
|
5336
5377
|
|
|
5337
5378
|
var AutocompleteGroup = function (props) {
|
|
5338
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"]);
|
|
@@ -5372,7 +5413,7 @@ var AutocompleteGroup = function (props) {
|
|
|
5372
5413
|
}
|
|
5373
5414
|
};
|
|
5374
5415
|
|
|
5375
|
-
var doNotForwardProps$
|
|
5416
|
+
var doNotForwardProps$A = [
|
|
5376
5417
|
"anchorEl",
|
|
5377
5418
|
"count",
|
|
5378
5419
|
"keepSearchOnSelect",
|
|
@@ -5385,9 +5426,9 @@ var doNotForwardProps$t = [
|
|
|
5385
5426
|
];
|
|
5386
5427
|
var StyledPopper$2 = styled$2(Popper, {
|
|
5387
5428
|
shouldForwardProp: function (prop) {
|
|
5388
|
-
return !doNotForwardProps$
|
|
5429
|
+
return !doNotForwardProps$A.includes(prop) || prop === "anchorEl";
|
|
5389
5430
|
},
|
|
5390
|
-
})(templateObject_1$
|
|
5431
|
+
})(templateObject_1$Z || (templateObject_1$Z = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5391
5432
|
var _a;
|
|
5392
5433
|
var corners = getCorners(props);
|
|
5393
5434
|
var shadows = getShadows(props);
|
|
@@ -5397,24 +5438,24 @@ var StyledPopper$2 = styled$2(Popper, {
|
|
|
5397
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 ");
|
|
5398
5439
|
});
|
|
5399
5440
|
var StyledPaper$2 = styled$2(Paper, {
|
|
5400
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5401
|
-
})(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) {
|
|
5402
5443
|
var _a;
|
|
5403
5444
|
var shadows = getShadows(props);
|
|
5404
5445
|
var semanticColors = getSemanticColors(props);
|
|
5405
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 ");
|
|
5406
5447
|
});
|
|
5407
|
-
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"])));
|
|
5408
5449
|
var StyledAutocompleteInput = styled$2(InputSearch, {
|
|
5409
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5410
|
-
})(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) {
|
|
5411
5452
|
var search = _a.search;
|
|
5412
5453
|
return !search && "height: 0; display: none; margin: 0 !important;";
|
|
5413
5454
|
}, function (_a) {
|
|
5414
5455
|
var search = _a.search;
|
|
5415
5456
|
return (search ? "auto" : "transparent");
|
|
5416
5457
|
});
|
|
5417
|
-
var templateObject_1$
|
|
5458
|
+
var templateObject_1$Z, templateObject_2$C, templateObject_3$s, templateObject_4$o;
|
|
5418
5459
|
|
|
5419
5460
|
var AutocompleteMultiColumn = function (props) {
|
|
5420
5461
|
var _a;
|
|
@@ -5596,13 +5637,13 @@ var Autocomplete = function (props) {
|
|
|
5596
5637
|
}
|
|
5597
5638
|
};
|
|
5598
5639
|
|
|
5599
|
-
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"])));
|
|
5600
5641
|
var doNotForwardPropsIconWrapper = ["bannerType"];
|
|
5601
5642
|
var IconWrapper$1 = styled$2("div", {
|
|
5602
5643
|
shouldForwardProp: function (prop) {
|
|
5603
5644
|
return !doNotForwardPropsIconWrapper.includes(prop);
|
|
5604
5645
|
},
|
|
5605
|
-
})(templateObject_2$
|
|
5646
|
+
})(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5606
5647
|
var _a, _b;
|
|
5607
5648
|
var bannerType = props.bannerType;
|
|
5608
5649
|
var iconSizes = getIconSizes(props);
|
|
@@ -5615,7 +5656,7 @@ var StyledButton$2 = styled$2(Button, {
|
|
|
5615
5656
|
shouldForwardProp: function (prop) {
|
|
5616
5657
|
return !doNotForwardPropsButtonIcon.includes(prop);
|
|
5617
5658
|
},
|
|
5618
|
-
})(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) {
|
|
5619
5660
|
var _a, _b;
|
|
5620
5661
|
var bannerType = props.bannerType;
|
|
5621
5662
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5623,7 +5664,7 @@ var StyledButton$2 = styled$2(Button, {
|
|
|
5623
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 ");
|
|
5624
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 ");
|
|
5625
5666
|
});
|
|
5626
|
-
styled$2("div")(templateObject_4$
|
|
5667
|
+
styled$2("div")(templateObject_4$n || (templateObject_4$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), fontBodyS$1);
|
|
5627
5668
|
var primary$1 = function (props) {
|
|
5628
5669
|
var _a, _b;
|
|
5629
5670
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5634,15 +5675,15 @@ var secondary$1 = function (props) {
|
|
|
5634
5675
|
var semanticColors = getSemanticColors(props);
|
|
5635
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 ");
|
|
5636
5677
|
};
|
|
5637
|
-
var doNotForwardProps$
|
|
5678
|
+
var doNotForwardProps$z = ["sdsType", "textChild"];
|
|
5638
5679
|
var StyledBanner = styled$2("div", {
|
|
5639
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5640
|
-
})(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) {
|
|
5641
5682
|
var sdsType = props.sdsType;
|
|
5642
5683
|
var spaces = getSpaces(props);
|
|
5643
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 ");
|
|
5644
5685
|
});
|
|
5645
|
-
var templateObject_1$
|
|
5686
|
+
var templateObject_1$Y, templateObject_2$B, templateObject_3$r, templateObject_4$n, templateObject_5$j;
|
|
5646
5687
|
|
|
5647
5688
|
var Banner = forwardRef(function Banner(props, ref) {
|
|
5648
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"]);
|
|
@@ -5705,16 +5746,16 @@ var ButtonDropdown = React__default.forwardRef(function (props, ref) {
|
|
|
5705
5746
|
* All other props should be passed down to ButtonIcon; otherwise,
|
|
5706
5747
|
* the component won’t function as expected.
|
|
5707
5748
|
*/
|
|
5708
|
-
var doNotForwardProps$
|
|
5749
|
+
var doNotForwardProps$y = ["sdsStage"];
|
|
5709
5750
|
var StyledButtonToggle = styled$2(ButtonIcon, {
|
|
5710
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5711
|
-
})(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) {
|
|
5712
5753
|
var _a;
|
|
5713
5754
|
var sdsStage = props.sdsStage;
|
|
5714
5755
|
var semanticColors = getSemanticColors(props);
|
|
5715
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 ");
|
|
5716
5757
|
});
|
|
5717
|
-
var templateObject_1$
|
|
5758
|
+
var templateObject_1$X;
|
|
5718
5759
|
|
|
5719
5760
|
/**
|
|
5720
5761
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -5730,7 +5771,7 @@ var ButtonToggle = React__default.forwardRef(function (props, ref) {
|
|
|
5730
5771
|
}
|
|
5731
5772
|
});
|
|
5732
5773
|
|
|
5733
|
-
var doNotForwardProps$
|
|
5774
|
+
var doNotForwardProps$x = [
|
|
5734
5775
|
"calloutTitle",
|
|
5735
5776
|
"collapsed",
|
|
5736
5777
|
"severity",
|
|
@@ -5738,8 +5779,8 @@ var doNotForwardProps$q = [
|
|
|
5738
5779
|
"hideBody",
|
|
5739
5780
|
];
|
|
5740
5781
|
var StyledCallout = styled$2(Alert$2, {
|
|
5741
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5742
|
-
})(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) {
|
|
5743
5784
|
var _a, _b, _c, _d, _e;
|
|
5744
5785
|
var _f = props.intent, intent = _f === void 0 ? "info" : _f, sdsStyle = props.sdsStyle, hideBody = props.hideBody, collapsed = props.collapsed;
|
|
5745
5786
|
var spaces = getSpaces(props);
|
|
@@ -5751,12 +5792,12 @@ var StyledCallout = styled$2(Alert$2, {
|
|
|
5751
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";
|
|
5752
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 ");
|
|
5753
5794
|
});
|
|
5754
|
-
var templateObject_1$
|
|
5795
|
+
var templateObject_1$W;
|
|
5755
5796
|
|
|
5756
5797
|
var CALLOUT_TITLE_DISPLAY_NAME = "CalloutTitle";
|
|
5757
5798
|
|
|
5758
|
-
var StyledCalloutTitle = styled$2(AlertTitle)(templateObject_1$
|
|
5759
|
-
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;
|
|
5760
5801
|
|
|
5761
5802
|
var CalloutTitle = function (_a) {
|
|
5762
5803
|
var children = _a.children;
|
|
@@ -5765,24 +5806,24 @@ var CalloutTitle = function (_a) {
|
|
|
5765
5806
|
// Display name required to ensure Callout expand works correctly.
|
|
5766
5807
|
CalloutTitle.displayName = CALLOUT_TITLE_DISPLAY_NAME;
|
|
5767
5808
|
|
|
5768
|
-
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) {
|
|
5769
5810
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a;
|
|
5770
5811
|
var spaces = getSpaces(props);
|
|
5771
5812
|
return "\n margin: ".concat(!hideTitle ? spaces === null || spaces === void 0 ? void 0 : spaces.xs : 0, "px 0 0 0;\n ");
|
|
5772
5813
|
});
|
|
5773
|
-
var templateObject_1$
|
|
5814
|
+
var templateObject_1$U;
|
|
5774
5815
|
|
|
5775
5816
|
var CalloutBody = function (_a) {
|
|
5776
5817
|
var children = _a.children, hideTitle = _a.hideTitle;
|
|
5777
5818
|
return (jsx(StyledCalloutBody, { hideTitle: hideTitle, children: children }));
|
|
5778
5819
|
};
|
|
5779
5820
|
|
|
5780
|
-
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) {
|
|
5781
5822
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a, _b = props.hideBody, hideBody = _b === void 0 ? false : _b;
|
|
5782
5823
|
var spaces = getSpaces(props);
|
|
5783
5824
|
return "\n margin: ".concat(hideTitle && hideBody ? 0 : spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0 0;\n ");
|
|
5784
5825
|
});
|
|
5785
|
-
var templateObject_1$
|
|
5826
|
+
var templateObject_1$T;
|
|
5786
5827
|
|
|
5787
5828
|
var CalloutExtraContent = function (_a) {
|
|
5788
5829
|
var children = _a.children, hideTitle = _a.hideTitle, hideBody = _a.hideBody;
|
|
@@ -5851,25 +5892,25 @@ var dark$1 = function (props) {
|
|
|
5851
5892
|
var _a, _b;
|
|
5852
5893
|
var spaces = getSpaces(props);
|
|
5853
5894
|
var semanticColors = getSemanticColors(props);
|
|
5854
|
-
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);
|
|
5855
5896
|
};
|
|
5856
5897
|
var light$1 = function (props) {
|
|
5857
5898
|
var _a, _b;
|
|
5858
5899
|
var spaces = getSpaces(props);
|
|
5859
5900
|
var semanticColors = getSemanticColors(props);
|
|
5860
|
-
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);
|
|
5861
5902
|
};
|
|
5862
5903
|
var wide = function () {
|
|
5863
|
-
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 "])));
|
|
5864
5905
|
};
|
|
5865
5906
|
var tableStyles = function (props) {
|
|
5866
5907
|
var spaces = getSpaces(props);
|
|
5867
|
-
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);
|
|
5868
5909
|
};
|
|
5869
|
-
var doNotForwardProps$
|
|
5910
|
+
var doNotForwardProps$w = ["hasInvertedStyle"];
|
|
5870
5911
|
var Subtitle$1 = styled$2("div", {
|
|
5871
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5872
|
-
})(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) {
|
|
5873
5914
|
var _a, _b;
|
|
5874
5915
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
5875
5916
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5878,7 +5919,7 @@ var Subtitle$1 = styled$2("div", {
|
|
|
5878
5919
|
var tooltipCss = function (props) {
|
|
5879
5920
|
var _a = props.hasInvertedStyle, hasInvertedStyle = _a === void 0 ? true : _a, inverted = props.inverted, sdsStyle = props.sdsStyle, width = props.width, followCursor = props.followCursor;
|
|
5880
5921
|
var shadows = getShadows(props);
|
|
5881
|
-
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
|
|
5882
5923
|
? dark$1(props)
|
|
5883
5924
|
: light$1(props), width === "wide" && sdsStyle === "light" && wide(), followCursor === true && tableStyles(props));
|
|
5884
5925
|
};
|
|
@@ -5886,7 +5927,7 @@ var arrowCss = function (props) {
|
|
|
5886
5927
|
var _a, _b;
|
|
5887
5928
|
var hasInvertedStyle = props.hasInvertedStyle, inverted = props.inverted, sdsStyle = props.sdsStyle, arrowOffset = props.arrowOffset;
|
|
5888
5929
|
var semanticColors = getSemanticColors(props);
|
|
5889
|
-
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"
|
|
5890
5931
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfaceInverse
|
|
5891
5932
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.surface);
|
|
5892
5933
|
};
|
|
@@ -5894,8 +5935,8 @@ var arrowCss = function (props) {
|
|
|
5894
5935
|
* (masoudmanson): !important is needed to override arrow's
|
|
5895
5936
|
* default placement which is calculated by javascript
|
|
5896
5937
|
*/
|
|
5897
|
-
var StyledPopper$1 = styled$2(Popper)(templateObject_8$
|
|
5898
|
-
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;
|
|
5899
5940
|
|
|
5900
5941
|
/**
|
|
5901
5942
|
* @see https://mui.com/material-ui/react-tooltip/
|
|
@@ -5972,7 +6013,7 @@ function mergeClass$1(_a) {
|
|
|
5972
6013
|
return propClassName ? "".concat(propClassName, " ").concat(className) : className;
|
|
5973
6014
|
}
|
|
5974
6015
|
|
|
5975
|
-
var doNotForwardProps$
|
|
6016
|
+
var doNotForwardProps$v = [
|
|
5976
6017
|
"icon",
|
|
5977
6018
|
"iconVerticalAlign",
|
|
5978
6019
|
"horizontalAlign",
|
|
@@ -6000,8 +6041,8 @@ var verticalAlignToFlexMap = {
|
|
|
6000
6041
|
top: "flex-start",
|
|
6001
6042
|
};
|
|
6002
6043
|
var StyledTableData = styled$2("td", {
|
|
6003
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6004
|
-
})(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) {
|
|
6005
6046
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6006
6047
|
var spaces = getSpaces(props);
|
|
6007
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 ");
|
|
@@ -6012,30 +6053,30 @@ var ShouldWrap = function (lineCount) {
|
|
|
6012
6053
|
var ShouldTruncate = function () {
|
|
6013
6054
|
return "\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n ";
|
|
6014
6055
|
};
|
|
6015
|
-
var StyledCellContent = styled$2("div")(templateObject_2$
|
|
6016
|
-
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"])));
|
|
6017
6058
|
var StyledCellIconWrapper = styled$2("div", {
|
|
6018
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6019
|
-
})(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) {
|
|
6020
6061
|
var _a = props.iconVerticalAlign, iconVerticalAlign = _a === void 0 ? "top" : _a;
|
|
6021
6062
|
var spaces = getSpaces(props);
|
|
6022
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 ");
|
|
6023
6064
|
});
|
|
6024
|
-
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) {
|
|
6025
6066
|
var horizontalAlign = props.horizontalAlign;
|
|
6026
6067
|
return "\n display: flex;\n justify-content: ".concat(horizontalAlign === "left" ? "flex-start" : "flex-end", ";\n ");
|
|
6027
6068
|
});
|
|
6028
6069
|
var PrimaryText = styled$2("div", {
|
|
6029
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6030
|
-
})(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) {
|
|
6031
6072
|
var _a = props.primaryTextWrapLineCount, primaryTextWrapLineCount = _a === void 0 ? 3 : _a;
|
|
6032
6073
|
return "\n display: block;\n ".concat(props.shouldTextWrap
|
|
6033
6074
|
? ShouldWrap(primaryTextWrapLineCount)
|
|
6034
6075
|
: ShouldTruncate(), "\n ");
|
|
6035
6076
|
});
|
|
6036
6077
|
var SecondaryText = styled$2("span", {
|
|
6037
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6038
|
-
})(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) {
|
|
6039
6080
|
var _a;
|
|
6040
6081
|
var _b = props.secondaryTextWrapLineCount, secondaryTextWrapLineCount = _b === void 0 ? 1 : _b;
|
|
6041
6082
|
var spaces = getSpaces(props);
|
|
@@ -6045,8 +6086,8 @@ var SecondaryText = styled$2("span", {
|
|
|
6045
6086
|
: ShouldTruncate(), "\n ");
|
|
6046
6087
|
});
|
|
6047
6088
|
var TertiaryText = styled$2("span", {
|
|
6048
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6049
|
-
})(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) {
|
|
6050
6091
|
var _a;
|
|
6051
6092
|
var _b = props.tertiaryTextWrapLineCount, tertiaryTextWrapLineCount = _b === void 0 ? 1 : _b;
|
|
6052
6093
|
var spaces = getSpaces(props);
|
|
@@ -6055,15 +6096,15 @@ var TertiaryText = styled$2("span", {
|
|
|
6055
6096
|
? ShouldWrap(tertiaryTextWrapLineCount)
|
|
6056
6097
|
: ShouldTruncate(), "\n ");
|
|
6057
6098
|
});
|
|
6058
|
-
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) {
|
|
6059
6100
|
var spaces = getSpaces(props);
|
|
6060
6101
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
6061
6102
|
});
|
|
6062
|
-
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) {
|
|
6063
6104
|
var spaces = getSpaces(props);
|
|
6064
6105
|
return "\n margin-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
6065
6106
|
});
|
|
6066
|
-
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;
|
|
6067
6108
|
|
|
6068
6109
|
var CellBasicContent = function (props) {
|
|
6069
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;
|
|
@@ -6077,15 +6118,15 @@ var CellBasic = forwardRef(function (props, ref) {
|
|
|
6077
6118
|
return (jsx(StyledTableData, __assign({ ref: ref }, props, { children: jsx(CellBasicContent, __assign({}, props)) })));
|
|
6078
6119
|
});
|
|
6079
6120
|
|
|
6080
|
-
var doNotForwardProps$
|
|
6121
|
+
var doNotForwardProps$u = ["horizontalAlign", "verticalAlign"];
|
|
6081
6122
|
var StyledCellComponentData = styled$2("td", {
|
|
6082
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6083
|
-
})(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) {
|
|
6084
6125
|
var spaces = getSpaces(props);
|
|
6085
6126
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6086
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 ");
|
|
6087
6128
|
});
|
|
6088
|
-
var templateObject_1$
|
|
6129
|
+
var templateObject_1$Q;
|
|
6089
6130
|
|
|
6090
6131
|
var CellComponent = forwardRef(function (props, _) {
|
|
6091
6132
|
var children = props.children;
|
|
@@ -6097,7 +6138,7 @@ var contentPositionMapping = {
|
|
|
6097
6138
|
left: "flex-start",
|
|
6098
6139
|
right: "flex-end",
|
|
6099
6140
|
};
|
|
6100
|
-
var doNotForwardProps$
|
|
6141
|
+
var doNotForwardProps$t = [
|
|
6101
6142
|
"active",
|
|
6102
6143
|
"horizontalAlign",
|
|
6103
6144
|
"shouldShowTooltipOnHover",
|
|
@@ -6107,8 +6148,8 @@ var doNotForwardProps$m = [
|
|
|
6107
6148
|
"hover",
|
|
6108
6149
|
];
|
|
6109
6150
|
var StyledSortingIcon = styled$2(Icon, {
|
|
6110
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6111
|
-
})(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) {
|
|
6112
6153
|
var _a;
|
|
6113
6154
|
var _b = props.active, active = _b === void 0 ? false : _b, hideSortIcon = props.hideSortIcon;
|
|
6114
6155
|
var spaces = getSpaces(props);
|
|
@@ -6116,8 +6157,8 @@ var StyledSortingIcon = styled$2(Icon, {
|
|
|
6116
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 ");
|
|
6117
6158
|
});
|
|
6118
6159
|
var StyledTableHeader$1 = styled$2("th", {
|
|
6119
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6120
|
-
})(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) {
|
|
6121
6162
|
var _a, _b, _c, _d, _e, _f;
|
|
6122
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;
|
|
6123
6164
|
var spaces = getSpaces(props);
|
|
@@ -6131,12 +6172,12 @@ var StyledTableHeader$1 = styled$2("th", {
|
|
|
6131
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 ");
|
|
6132
6173
|
});
|
|
6133
6174
|
var StyledCellHeaderContainer = styled$2("div", {
|
|
6134
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6135
|
-
})(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) {
|
|
6136
6177
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a;
|
|
6137
6178
|
return "\n align-items: flex-end;\n width: 100%;\n display: flex;\n justify-content: ".concat(horizontalAlign ? contentPositionMapping[horizontalAlign] : "flex-start", ";\n ");
|
|
6138
6179
|
});
|
|
6139
|
-
var templateObject_1$
|
|
6180
|
+
var templateObject_1$P, templateObject_2$y, templateObject_3$o;
|
|
6140
6181
|
|
|
6141
6182
|
var CellHeaderContent = function (props) {
|
|
6142
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;
|
|
@@ -6156,20 +6197,20 @@ var CellHeader = forwardRef(function (props, ref) {
|
|
|
6156
6197
|
|
|
6157
6198
|
var small = function (props) {
|
|
6158
6199
|
var spaces = getSpaces(props);
|
|
6159
|
-
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));
|
|
6160
6201
|
};
|
|
6161
6202
|
var medium = function (props) {
|
|
6162
6203
|
var spaces = getSpaces(props);
|
|
6163
6204
|
var colors = getColors(props);
|
|
6164
|
-
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);
|
|
6165
6206
|
};
|
|
6166
6207
|
var rounded$2 = function (props) {
|
|
6167
6208
|
var corners = getCorners(props);
|
|
6168
|
-
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);
|
|
6169
6210
|
};
|
|
6170
6211
|
var square$2 = function (props) {
|
|
6171
6212
|
var corners = getCorners(props);
|
|
6172
|
-
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);
|
|
6173
6214
|
};
|
|
6174
6215
|
var success = function (props) {
|
|
6175
6216
|
return createStatusCss(props, "success");
|
|
@@ -6222,7 +6263,7 @@ function createStatusCss(props, status) {
|
|
|
6222
6263
|
},
|
|
6223
6264
|
};
|
|
6224
6265
|
var statusColors = statusToColors[status];
|
|
6225
|
-
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);
|
|
6226
6267
|
}
|
|
6227
6268
|
var statusToCss = {
|
|
6228
6269
|
beta: beta,
|
|
@@ -6232,14 +6273,14 @@ var statusToCss = {
|
|
|
6232
6273
|
success: success,
|
|
6233
6274
|
warning: warning,
|
|
6234
6275
|
};
|
|
6235
|
-
var doNotForwardProps$
|
|
6276
|
+
var doNotForwardProps$s = ["isRounded"];
|
|
6236
6277
|
var StyledChip = styled$2(Chip$1, {
|
|
6237
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6238
|
-
})(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) {
|
|
6239
6280
|
var size = props.size, status = props.status, isRounded = props.isRounded;
|
|
6240
|
-
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));
|
|
6241
6282
|
});
|
|
6242
|
-
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;
|
|
6243
6284
|
|
|
6244
6285
|
/**
|
|
6245
6286
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6257,7 +6298,7 @@ var Chip = function (props) {
|
|
|
6257
6298
|
return jsx(StyledChip, __assign({}, props));
|
|
6258
6299
|
};
|
|
6259
6300
|
|
|
6260
|
-
var doNotForwardProps$
|
|
6301
|
+
var doNotForwardProps$r = [
|
|
6261
6302
|
"anchorEl",
|
|
6262
6303
|
"count",
|
|
6263
6304
|
"keepSearchOnSelect",
|
|
@@ -6271,19 +6312,19 @@ var doNotForwardProps$k = [
|
|
|
6271
6312
|
"isMultiColumn",
|
|
6272
6313
|
];
|
|
6273
6314
|
var StyledHeaderTitle = styled$2("div", {
|
|
6274
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6275
|
-
})(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) {
|
|
6276
6317
|
var _a;
|
|
6277
6318
|
var spaces = getSpaces(props);
|
|
6278
6319
|
var semanticColors = getSemanticColors(props);
|
|
6279
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 ");
|
|
6280
6321
|
});
|
|
6281
|
-
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);
|
|
6282
6323
|
var StyledPopper = styled$2(Popper, {
|
|
6283
6324
|
shouldForwardProp: function (prop) {
|
|
6284
|
-
return !doNotForwardProps$
|
|
6325
|
+
return !doNotForwardProps$r.includes(prop) || prop === "anchorEl";
|
|
6285
6326
|
},
|
|
6286
|
-
})(templateObject_3$
|
|
6327
|
+
})(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6287
6328
|
var _a;
|
|
6288
6329
|
var borders = getBorders(props);
|
|
6289
6330
|
var corners = getCorners(props);
|
|
@@ -6292,8 +6333,8 @@ var StyledPopper = styled$2(Popper, {
|
|
|
6292
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 ");
|
|
6293
6334
|
});
|
|
6294
6335
|
var StyledPaper$1 = styled$2(Paper, {
|
|
6295
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6296
|
-
})(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) {
|
|
6297
6338
|
var _a;
|
|
6298
6339
|
var spaces = getSpaces(props);
|
|
6299
6340
|
var borders = getBorders(props);
|
|
@@ -6301,12 +6342,12 @@ var StyledPaper$1 = styled$2(Paper, {
|
|
|
6301
6342
|
var semanticColors = getSemanticColors(props);
|
|
6302
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 ");
|
|
6303
6344
|
});
|
|
6304
|
-
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) {
|
|
6305
6346
|
var search = props.search;
|
|
6306
6347
|
var spaces = getSpaces(props);
|
|
6307
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 ");
|
|
6308
6349
|
});
|
|
6309
|
-
var templateObject_1$
|
|
6350
|
+
var templateObject_1$N, templateObject_2$w, templateObject_3$m, templateObject_4$j, templateObject_5$f;
|
|
6310
6351
|
|
|
6311
6352
|
// (masoudmanson): Represents the minimum width defined by design specifications
|
|
6312
6353
|
// for the dropdownMenu's popper component
|
|
@@ -6344,7 +6385,7 @@ var DropdownMenu = function (props) {
|
|
|
6344
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] }) })) }) })));
|
|
6345
6386
|
};
|
|
6346
6387
|
|
|
6347
|
-
var doNotForwardProps$
|
|
6388
|
+
var doNotForwardProps$q = [
|
|
6348
6389
|
"intent",
|
|
6349
6390
|
"state",
|
|
6350
6391
|
"sdsType",
|
|
@@ -6372,27 +6413,27 @@ var inputDropdownStyles = function (props) {
|
|
|
6372
6413
|
* The top/bottom padding is set to 1px less than the actual value to account for the border.
|
|
6373
6414
|
*/
|
|
6374
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");
|
|
6375
|
-
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);
|
|
6376
6417
|
};
|
|
6377
6418
|
var minimal$1 = function (props) {
|
|
6378
6419
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
6379
6420
|
var spaces = getSpaces(props);
|
|
6380
6421
|
var semanticColors = getSemanticColors(props);
|
|
6381
|
-
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);
|
|
6382
6423
|
};
|
|
6383
6424
|
var square$1 = function (props) {
|
|
6384
6425
|
var corners = getCorners(props);
|
|
6385
|
-
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);
|
|
6386
6427
|
};
|
|
6387
6428
|
var rounded$1 = function (props) {
|
|
6388
6429
|
var corners = getCorners(props);
|
|
6389
|
-
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);
|
|
6390
6431
|
};
|
|
6391
6432
|
var userInput = function (props) {
|
|
6392
6433
|
var _a, _b, _c, _d;
|
|
6393
6434
|
var sdsStyle = props.sdsStyle;
|
|
6394
6435
|
var semanticColors = getSemanticColors(props);
|
|
6395
|
-
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"
|
|
6396
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 ")
|
|
6397
6438
|
: "");
|
|
6398
6439
|
};
|
|
@@ -6402,7 +6443,7 @@ var isOpen = function (props) {
|
|
|
6402
6443
|
var borders = getBorders(props);
|
|
6403
6444
|
var semanticColors = getSemanticColors(props);
|
|
6404
6445
|
var inputColor = intentToColor$2[intent];
|
|
6405
|
-
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"
|
|
6406
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 ")
|
|
6407
6448
|
: "", inputColor === "accent"
|
|
6408
6449
|
? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.ornamentOpen
|
|
@@ -6410,17 +6451,17 @@ var isOpen = function (props) {
|
|
|
6410
6451
|
? borders === null || borders === void 0 ? void 0 : borders.none
|
|
6411
6452
|
: (_f = borders === null || borders === void 0 ? void 0 : borders[inputColor]) === null || _f === void 0 ? void 0 : _f.open, sdsStyle === "minimal"
|
|
6412
6453
|
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.fillOpen
|
|
6413
|
-
: "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);
|
|
6414
6455
|
};
|
|
6415
6456
|
var applyIntentColor$1 = function (props, intent) {
|
|
6416
6457
|
var _a, _b, _c;
|
|
6417
6458
|
var borders = getBorders(props);
|
|
6418
|
-
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);
|
|
6419
6460
|
};
|
|
6420
6461
|
var isDisabled = function (props) {
|
|
6421
6462
|
var _a, _b, _c, _d;
|
|
6422
6463
|
var semanticColors = getSemanticColors(props);
|
|
6423
|
-
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);
|
|
6424
6465
|
};
|
|
6425
6466
|
/**
|
|
6426
6467
|
* (masoudmanson): `Button as React.ComponentType<InputDropdownProps>` is a
|
|
@@ -6431,10 +6472,10 @@ var isDisabled = function (props) {
|
|
|
6431
6472
|
* to the InputDropdownProps interface.
|
|
6432
6473
|
*/
|
|
6433
6474
|
var StyledInputDropdown = styled$2(Button, {
|
|
6434
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6435
|
-
})(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) {
|
|
6436
6477
|
var disabled = props.disabled, intent = props.intent, state = props.state, value = props.value, sdsStyle = props.sdsStyle;
|
|
6437
|
-
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" &&
|
|
6438
6479
|
sdsStyle !== "minimal" &&
|
|
6439
6480
|
applyIntentColor$1(props, "notice"), intent === "negative" &&
|
|
6440
6481
|
sdsStyle !== "minimal" &&
|
|
@@ -6443,16 +6484,16 @@ var StyledInputDropdown = styled$2(Button, {
|
|
|
6443
6484
|
applyIntentColor$1(props, "positive"), state === "open" && isOpen(props), disabled && isDisabled(props));
|
|
6444
6485
|
});
|
|
6445
6486
|
var StyledDetail = styled$2("span", {
|
|
6446
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6447
|
-
})(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) {
|
|
6448
6489
|
var _a;
|
|
6449
6490
|
var spaces = getSpaces(props);
|
|
6450
6491
|
var semanticColors = getSemanticColors(props);
|
|
6451
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 ");
|
|
6452
6493
|
});
|
|
6453
6494
|
var StyledLabel$2 = styled$2("span", {
|
|
6454
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6455
|
-
})(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) {
|
|
6456
6497
|
var _a, _b;
|
|
6457
6498
|
var details = props.details, counter = props.counter, sdsType = props.sdsType;
|
|
6458
6499
|
var fontWeights = getFontWeights(props);
|
|
@@ -6463,8 +6504,8 @@ var StyledLabel$2 = styled$2("span", {
|
|
|
6463
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 ");
|
|
6464
6505
|
});
|
|
6465
6506
|
var StyledCounter = styled$2("span", {
|
|
6466
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6467
|
-
})(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) {
|
|
6468
6509
|
var _a, _b;
|
|
6469
6510
|
var corners = getCorners(props);
|
|
6470
6511
|
var spaces = getSpaces(props);
|
|
@@ -6472,8 +6513,8 @@ var StyledCounter = styled$2("span", {
|
|
|
6472
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 ");
|
|
6473
6514
|
});
|
|
6474
6515
|
var MinimalDetails = styled$2("div", {
|
|
6475
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6476
|
-
})(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) {
|
|
6477
6518
|
var _a;
|
|
6478
6519
|
var shouldTruncateMinimalDetails = props.shouldTruncateMinimalDetails;
|
|
6479
6520
|
var semanticColors = getSemanticColors(props);
|
|
@@ -6481,23 +6522,23 @@ var MinimalDetails = styled$2("div", {
|
|
|
6481
6522
|
"overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;", "\n ");
|
|
6482
6523
|
});
|
|
6483
6524
|
var LabelWrapper = styled$2("span", {
|
|
6484
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6485
|
-
})(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) {
|
|
6486
6527
|
var isMinimal = _a.isMinimal;
|
|
6487
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 ");
|
|
6488
6529
|
});
|
|
6489
6530
|
var IconWrapper = styled$2("span", {
|
|
6490
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6491
|
-
})(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"])));
|
|
6492
6533
|
function labelStyle(props) {
|
|
6493
6534
|
var _a, _b;
|
|
6494
6535
|
var semanticColors = getSemanticColors(props);
|
|
6495
6536
|
var labelColor = props.sdsType === "value"
|
|
6496
6537
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary
|
|
6497
6538
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textSecondary;
|
|
6498
|
-
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);
|
|
6499
6540
|
}
|
|
6500
|
-
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;
|
|
6501
6542
|
|
|
6502
6543
|
/**
|
|
6503
6544
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -6564,33 +6605,33 @@ var tagSizeS = function (props) {
|
|
|
6564
6605
|
var spaces = getSpaces(props);
|
|
6565
6606
|
var iconSizes = getIconSizes(props);
|
|
6566
6607
|
var semanticColors = getSemanticColors(props);
|
|
6567
|
-
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);
|
|
6568
6609
|
};
|
|
6569
6610
|
var tagSizeL = function (props) {
|
|
6570
6611
|
var _a;
|
|
6571
6612
|
var spaces = getSpaces(props);
|
|
6572
6613
|
var iconSizes = getIconSizes(props);
|
|
6573
6614
|
var semanticColors = getSemanticColors(props);
|
|
6574
|
-
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);
|
|
6575
6616
|
};
|
|
6576
6617
|
var rounded = function (props) {
|
|
6577
6618
|
var corners = getCorners(props);
|
|
6578
6619
|
var spaces = getSpaces(props);
|
|
6579
6620
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6580
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;
|
|
6581
|
-
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);
|
|
6582
6623
|
};
|
|
6583
6624
|
var square = function (props) {
|
|
6584
6625
|
var corners = getCorners(props);
|
|
6585
6626
|
var spaces = getSpaces(props);
|
|
6586
6627
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6587
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;
|
|
6588
|
-
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);
|
|
6589
6630
|
};
|
|
6590
6631
|
var withHover = function (props) {
|
|
6591
6632
|
var _a;
|
|
6592
6633
|
var semanticColors = getSemanticColors(props);
|
|
6593
|
-
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);
|
|
6594
6635
|
};
|
|
6595
6636
|
var primary = function (props) {
|
|
6596
6637
|
return createTypeCss(props, "primary");
|
|
@@ -6659,13 +6700,13 @@ function createTypeCss(props, type) {
|
|
|
6659
6700
|
secondary: generateSecondaryTagColors(intent, colors, semanticColors),
|
|
6660
6701
|
};
|
|
6661
6702
|
var typeColors = typeToColors[type];
|
|
6662
|
-
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);
|
|
6663
6704
|
}
|
|
6664
6705
|
var typeToCss = {
|
|
6665
6706
|
primary: primary,
|
|
6666
6707
|
secondary: secondary,
|
|
6667
6708
|
};
|
|
6668
|
-
var doNotForwardProps$
|
|
6709
|
+
var doNotForwardProps$p = [
|
|
6669
6710
|
"sdsType",
|
|
6670
6711
|
"sdsStyle",
|
|
6671
6712
|
"sdsSize",
|
|
@@ -6673,14 +6714,14 @@ var doNotForwardProps$i = [
|
|
|
6673
6714
|
"hover",
|
|
6674
6715
|
];
|
|
6675
6716
|
var StyledTag$2 = styled$2(Chip$1, {
|
|
6676
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6677
|
-
})(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) {
|
|
6678
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;
|
|
6679
6720
|
var isRounded = sdsStyle === "rounded";
|
|
6680
6721
|
var type = sdsType || "primary";
|
|
6681
|
-
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;");
|
|
6682
6723
|
});
|
|
6683
|
-
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;
|
|
6684
6725
|
|
|
6685
6726
|
/**
|
|
6686
6727
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6694,14 +6735,14 @@ var Tag = function (props) {
|
|
|
6694
6735
|
return jsx(StyledTag$2, __assign({ tagColor: color }, props, { color: "primary" }));
|
|
6695
6736
|
};
|
|
6696
6737
|
|
|
6697
|
-
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) {
|
|
6698
6739
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j;
|
|
6699
6740
|
var spaces = getSpaces(props);
|
|
6700
6741
|
var iconSizes = getIconSizes(props);
|
|
6701
6742
|
var semanticColors = getSemanticColors(props);
|
|
6702
|
-
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);
|
|
6703
6744
|
});
|
|
6704
|
-
var templateObject_1$
|
|
6745
|
+
var templateObject_1$K, templateObject_2$t;
|
|
6705
6746
|
|
|
6706
6747
|
/**
|
|
6707
6748
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6724,12 +6765,12 @@ var Chips = function (_a) {
|
|
|
6724
6765
|
}) }));
|
|
6725
6766
|
};
|
|
6726
6767
|
|
|
6727
|
-
var Wrapper$1 = styled$2("div")(templateObject_1$
|
|
6728
|
-
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) {
|
|
6729
6770
|
var spaces = getSpaces(props);
|
|
6730
6771
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
6731
6772
|
});
|
|
6732
|
-
var templateObject_1$
|
|
6773
|
+
var templateObject_1$J, templateObject_2$s;
|
|
6733
6774
|
|
|
6734
6775
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
6735
6776
|
var ComplexFilter = function (_a) {
|
|
@@ -6818,13 +6859,326 @@ var ComplexFilter = function (_a) {
|
|
|
6818
6859
|
}
|
|
6819
6860
|
};
|
|
6820
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
|
+
];
|
|
6882
|
+
var StyledCard = styled$2(Card, {
|
|
6883
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6884
|
+
})(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6885
|
+
var _a, _b, _c, _d;
|
|
6886
|
+
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;
|
|
6887
|
+
var semanticColors = getSemanticColors(props);
|
|
6888
|
+
var flexDirection = sdsType === "wide" && visualElementType === "image"
|
|
6889
|
+
? imagePosition === "left"
|
|
6890
|
+
? "row"
|
|
6891
|
+
: "row-reverse"
|
|
6892
|
+
: visualElementType === "icon"
|
|
6893
|
+
? "row"
|
|
6894
|
+
: "column";
|
|
6895
|
+
var showDecorativeBorder = visualElementType === "image"
|
|
6896
|
+
? boundingBox && decorativeBorder && imagePadding
|
|
6897
|
+
: boundingBox && decorativeBorder;
|
|
6898
|
+
return css(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n display: flex;\n background-color: ", ";\n flex-direction: ", ";\n box-shadow: none;\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\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" &&
|
|
6899
|
+
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" &&
|
|
6900
|
+
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));
|
|
6901
|
+
});
|
|
6902
|
+
var StyledCardActionArea = styled$2(CardActionArea, {
|
|
6903
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6904
|
+
})(templateObject_6$a || (templateObject_6$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6905
|
+
var _a, _b;
|
|
6906
|
+
var _c = props.imagePosition, imagePosition = _c === void 0 ? "left" : _c, _d = props.sdsType, sdsType = _d === void 0 ? "wide" : _d, visualElementType = props.visualElementType;
|
|
6907
|
+
var semanticColors = getSemanticColors(props);
|
|
6908
|
+
var flexDirection = sdsType === "wide"
|
|
6909
|
+
? imagePosition === "left"
|
|
6910
|
+
? "row"
|
|
6911
|
+
: "row-reverse"
|
|
6912
|
+
: visualElementType === "image"
|
|
6913
|
+
? "column"
|
|
6914
|
+
: "row";
|
|
6915
|
+
return "\n display: flex;\n flex-direction: ".concat(flexDirection, ";\n align-items: 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.backgroundSecondary, ";\n }\n ");
|
|
6916
|
+
});
|
|
6917
|
+
var StyledIconMediaWrapper = styled$2("div", {
|
|
6918
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6919
|
+
})(templateObject_10$2 || (templateObject_10$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6920
|
+
var _a = props.boundingBox, boundingBox = _a === void 0 ? true : _a;
|
|
6921
|
+
var spaces = getSpaces(props);
|
|
6922
|
+
return css(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), boundingBox
|
|
6923
|
+
? 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));
|
|
6924
|
+
});
|
|
6925
|
+
var StyledCardContent = styled$2("div", {
|
|
6926
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6927
|
+
})(templateObject_13$2 || (templateObject_13$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6928
|
+
var _a = props.boundingBox, boundingBox = _a === void 0 ? true : _a, _b = props.clickableCard, clickableCard = _b === void 0 ? false : _b;
|
|
6929
|
+
var spaces = getSpaces(props);
|
|
6930
|
+
return css(templateObject_12$2 || (templateObject_12$2 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n height: ", ";\n min-width: 100px;\n width: 100%;\n\n ", "\n "], ["\n display: flex;\n flex-direction: column;\n height: ", ";\n min-width: 100px;\n width: 100%;\n\n ", "\n "])), clickableCard ? "100%" : "auto", 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));
|
|
6931
|
+
});
|
|
6932
|
+
var StyledContentCardBody = styled$2(CardContent, {
|
|
6933
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
6934
|
+
})(templateObject_14$2 || (templateObject_14$2 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6935
|
+
var _a;
|
|
6936
|
+
var semanticColors = getSemanticColors(props);
|
|
6937
|
+
var spaces = getSpaces(props);
|
|
6938
|
+
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 ");
|
|
6939
|
+
});
|
|
6940
|
+
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"])));
|
|
6941
|
+
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;
|
|
6942
|
+
|
|
6943
|
+
var doNotForwardProps$n = [
|
|
6944
|
+
"visualElement",
|
|
6945
|
+
"sdsType",
|
|
6946
|
+
"imagePosition",
|
|
6947
|
+
"imagePadding",
|
|
6948
|
+
"overlineText",
|
|
6949
|
+
"titleText",
|
|
6950
|
+
"subtitleText",
|
|
6951
|
+
"metadataText",
|
|
6952
|
+
"contentBlock",
|
|
6953
|
+
];
|
|
6954
|
+
var StyledTitleWrapper = styled$3("div", {
|
|
6955
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6956
|
+
})(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6957
|
+
var spaces = getSpaces(props);
|
|
6958
|
+
return "\n display: flex;\n flex-direction: column;\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
6959
|
+
});
|
|
6960
|
+
var StyledOverlineText = styled$3("p", {
|
|
6961
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6962
|
+
})(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontCapsXxxs, function (props) {
|
|
6963
|
+
var _a;
|
|
6964
|
+
var semanticColors = getSemanticColors(props);
|
|
6965
|
+
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 ");
|
|
6966
|
+
});
|
|
6967
|
+
var StyledTitleText = styled$3("p", {
|
|
6968
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6969
|
+
})(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderXl, function (props) {
|
|
6970
|
+
var _a;
|
|
6971
|
+
var semanticColors = getSemanticColors(props);
|
|
6972
|
+
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 ");
|
|
6973
|
+
});
|
|
6974
|
+
var StyledSubtitleText = styled$3("p", {
|
|
6975
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6976
|
+
})(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderM$1, function (props) {
|
|
6977
|
+
var _a;
|
|
6978
|
+
var semanticColors = getSemanticColors(props);
|
|
6979
|
+
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 ");
|
|
6980
|
+
});
|
|
6981
|
+
var StyledMetadataText = styled$3("p", {
|
|
6982
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6983
|
+
})(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6984
|
+
var _a;
|
|
6985
|
+
var semanticColors = getSemanticColors(props);
|
|
6986
|
+
var spaces = getSpaces(props);
|
|
6987
|
+
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 ");
|
|
6988
|
+
});
|
|
6989
|
+
var templateObject_1$H, templateObject_2$q, templateObject_3$i, templateObject_4$f, templateObject_5$b;
|
|
6990
|
+
|
|
6991
|
+
/**
|
|
6992
|
+
* @see https://mui.com/material-ui/react-dialog/
|
|
6993
|
+
*/
|
|
6994
|
+
var ContentCardTitle = forwardRef(function ContentCardTitle(props, ref) {
|
|
6995
|
+
var overlineText = props.overlineText, titleText = props.titleText, subtitleText = props.subtitleText, metadataText = props.metadataText;
|
|
6996
|
+
return (jsxs("div", { ref: ref, children: [jsxs(StyledTitleWrapper, { children: [overlineText && (jsx(StyledOverlineText, { children: overlineText })), titleText && jsx(StyledTitleText, { children: titleText }), subtitleText && (jsx(StyledSubtitleText, { children: subtitleText }))] }), metadataText && (jsx(StyledMetadataText, { children: metadataText }))] }));
|
|
6997
|
+
});
|
|
6998
|
+
|
|
6999
|
+
var doNotForwardProps$m = ["buttonsPosition"];
|
|
7000
|
+
var StyledCardActions = styled$2(CardActions, {
|
|
7001
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
7002
|
+
})(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7003
|
+
var _a = props.buttonsPosition, buttonsPosition = _a === void 0 ? "left" : _a;
|
|
7004
|
+
var spaces = getSpaces(props);
|
|
7005
|
+
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 ");
|
|
7006
|
+
});
|
|
7007
|
+
var templateObject_1$G;
|
|
7008
|
+
|
|
7009
|
+
var isButtonElement = function (child) {
|
|
7010
|
+
if (React__default.isValidElement(child) && child.type === Button) {
|
|
7011
|
+
return true;
|
|
7012
|
+
}
|
|
7013
|
+
else {
|
|
7014
|
+
showWarningIfFirstOccurence(SDSWarningTypes.ContentCardActionsOnlyButtons);
|
|
7015
|
+
return false;
|
|
7016
|
+
}
|
|
7017
|
+
};
|
|
7018
|
+
/**
|
|
7019
|
+
* @see https://mui.com/material-ui/api/card-actions/
|
|
7020
|
+
*/
|
|
7021
|
+
var ContentCardActions = forwardRef(function ContentCardActions(props, ref) {
|
|
7022
|
+
var buttonsPosition = props.buttonsPosition, clickableCard = props.clickableCard, children = props.children;
|
|
7023
|
+
/**
|
|
7024
|
+
* (masoudmanson):
|
|
7025
|
+
* We need to ensure that only SDS buttons are used within the
|
|
7026
|
+
* ContentCardActions component slot. This is to prevent any potential
|
|
7027
|
+
* issues with using other components within the ContentCardActions component slot.
|
|
7028
|
+
*/
|
|
7029
|
+
var validChildren = React__default.Children.toArray(Array.isArray(children) ? children : [children]).filter(isButtonElement);
|
|
7030
|
+
/**
|
|
7031
|
+
* If the card is clickable, it acts as a `<button>` itself and cannot
|
|
7032
|
+
* have `<button>` elements as children. If multiple buttons are provided,
|
|
7033
|
+
* only the first one will be kept, and a warning will be shown.
|
|
7034
|
+
*
|
|
7035
|
+
* Any additional buttons cannot remain as `<button>` elements due to
|
|
7036
|
+
* DOM hierarchy constraints; they will be converted to `<a>` tags instead.
|
|
7037
|
+
*/
|
|
7038
|
+
if (clickableCard) {
|
|
7039
|
+
if (validChildren.length > 1) {
|
|
7040
|
+
showWarningIfFirstOccurence(SDSWarningTypes.ClickableContentCardNumberOfButtons);
|
|
7041
|
+
}
|
|
7042
|
+
/**
|
|
7043
|
+
* (masoudmanson): Since a clickable card can have at most one button,
|
|
7044
|
+
* we select the first button from the validChildren array and ignore the rest.
|
|
7045
|
+
*/
|
|
7046
|
+
var clickableCardButton = validChildren.shift();
|
|
7047
|
+
if (!clickableCardButton) {
|
|
7048
|
+
return null;
|
|
7049
|
+
}
|
|
7050
|
+
return (jsx(StyledCardActions, { ref: ref, buttonsPosition: buttonsPosition, children: [
|
|
7051
|
+
React__default.cloneElement(clickableCardButton, __assign({ component: "a" }, clickableCardButton === null || clickableCardButton === void 0 ? void 0 : clickableCardButton.props)),
|
|
7052
|
+
] }));
|
|
7053
|
+
}
|
|
7054
|
+
return (jsx(StyledCardActions, { ref: ref, buttonsPosition: buttonsPosition, children: validChildren }));
|
|
7055
|
+
});
|
|
7056
|
+
|
|
7057
|
+
var doNotForwardProps$l = [
|
|
7058
|
+
"imagePadding",
|
|
7059
|
+
"boundingBox",
|
|
7060
|
+
"sdsType",
|
|
7061
|
+
"imageSize",
|
|
7062
|
+
"image",
|
|
7063
|
+
"imagePosition",
|
|
7064
|
+
];
|
|
7065
|
+
var StyledImageMediaWrapper = styled$3("div", {
|
|
7066
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$l.includes(prop); },
|
|
7067
|
+
})(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7068
|
+
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;
|
|
7069
|
+
var spaces = getSpaces(props);
|
|
7070
|
+
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
|
|
7071
|
+
? imagePadding
|
|
7072
|
+
? 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"
|
|
7073
|
+
? "padding-right: 0;"
|
|
7074
|
+
: "padding-left: 0;") : css$2(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n padding: 0;\n "], ["\n padding: 0;\n "])))
|
|
7075
|
+
: css$2(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), imagePosition === "left"
|
|
7076
|
+
? "padding-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")
|
|
7077
|
+
: "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
|
|
7078
|
+
? imagePadding
|
|
7079
|
+
? 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 "])))
|
|
7080
|
+
: 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)));
|
|
7081
|
+
});
|
|
7082
|
+
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;
|
|
7083
|
+
|
|
7084
|
+
/**
|
|
7085
|
+
* @see https://mui.com/material-ui/api/card-media/
|
|
7086
|
+
*/
|
|
7087
|
+
var ContentCardImageMedia = forwardRef(function ContentCardImageMedia(props, ref) {
|
|
7088
|
+
var image = props.image, imageSize = props.imageSize, sdsType = props.sdsType;
|
|
7089
|
+
/**
|
|
7090
|
+
* (masoudmanson): These styles makes the image responsive and
|
|
7091
|
+
* ensures the image is the right aspect ratio in different card sizes.
|
|
7092
|
+
*/
|
|
7093
|
+
var imageMediaStyles = {
|
|
7094
|
+
height: "100%",
|
|
7095
|
+
maxHeight: sdsType === "narrow" ? imageSize : "100%",
|
|
7096
|
+
maxWidth: sdsType === "narrow" ? "100%" : imageSize,
|
|
7097
|
+
minHeight: imageSize,
|
|
7098
|
+
minWidth: sdsType === "narrow" ? "unset" : imageSize,
|
|
7099
|
+
width: "100%",
|
|
7100
|
+
};
|
|
7101
|
+
/**
|
|
7102
|
+
* (masoudmanson): We need to make sure the image is wrapped in a CardMedia component.
|
|
7103
|
+
* - If it's a string, wrap it in CardMedia with proper styles.
|
|
7104
|
+
* - If it's already a CardMedia component, clone it and apply the styles.
|
|
7105
|
+
*/
|
|
7106
|
+
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, {
|
|
7107
|
+
component: "img",
|
|
7108
|
+
sx: __assign(__assign({}, image.props.sx), imageMediaStyles),
|
|
7109
|
+
})) : null;
|
|
7110
|
+
return (jsx(StyledImageMediaWrapper, __assign({ ref: ref }, props, { children: imageElement })));
|
|
7111
|
+
});
|
|
7112
|
+
|
|
7113
|
+
var CONTENT_CARD_DEFAULT_IMAGE_MEDIA_SIZE = 300;
|
|
7114
|
+
var CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_LOW_BOUNDARY = 595;
|
|
7115
|
+
var CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_HIGH_BOUNDARY = 605;
|
|
7116
|
+
|
|
7117
|
+
var useResponsiveWidth = function (initialSdsType) {
|
|
7118
|
+
var _a = useState(false), isNarrow = _a[0], setIsNarrow = _a[1];
|
|
7119
|
+
var handleResize = function (width) {
|
|
7120
|
+
if (width < CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_LOW_BOUNDARY && !isNarrow) {
|
|
7121
|
+
setIsNarrow(true);
|
|
7122
|
+
}
|
|
7123
|
+
else if (width > CONTENT_CARD_WIDE_TYPE_MIN_WIDTH_HIGH_BOUNDARY &&
|
|
7124
|
+
isNarrow) {
|
|
7125
|
+
setIsNarrow(false);
|
|
7126
|
+
}
|
|
7127
|
+
};
|
|
7128
|
+
return {
|
|
7129
|
+
dynamicSdsType: isNarrow ? "narrow" : initialSdsType,
|
|
7130
|
+
handleResize: handleResize,
|
|
7131
|
+
isNarrow: isNarrow,
|
|
7132
|
+
};
|
|
7133
|
+
};
|
|
7134
|
+
/**
|
|
7135
|
+
* (masoudmanson): This function is used to add the clickableCard and
|
|
7136
|
+
* buttonsPosition props to the ContentCardActions sub-component.
|
|
7137
|
+
*/
|
|
7138
|
+
var enhanceChildrenWithCardActionsProps = function (children, clickableCard, buttonsPosition) {
|
|
7139
|
+
return React__default.Children.map(children, function (child) {
|
|
7140
|
+
if (React__default.isValidElement(child) && child.type === ContentCardActions) {
|
|
7141
|
+
return React__default.cloneElement(child, __assign(__assign({}, child.props), { buttonsPosition: buttonsPosition, clickableCard: clickableCard }));
|
|
7142
|
+
}
|
|
7143
|
+
return child;
|
|
7144
|
+
});
|
|
7145
|
+
};
|
|
7146
|
+
/**
|
|
7147
|
+
* @see https://mui.com/material-ui/react-card/
|
|
7148
|
+
*/
|
|
7149
|
+
var ContentCard = React__default.forwardRef(function (props, ref) {
|
|
7150
|
+
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;
|
|
7151
|
+
// Force boundingBox to be true when clickableCard is true
|
|
7152
|
+
var boundingBox = clickableCard ? true : propsBoundingBox;
|
|
7153
|
+
var cardRef = useRef(null);
|
|
7154
|
+
var _j = useResponsiveWidth(sdsType), handleResize = _j.handleResize, dynamicSdsType = _j.dynamicSdsType;
|
|
7155
|
+
useEffect(function () {
|
|
7156
|
+
var element = cardRef.current;
|
|
7157
|
+
if (!element)
|
|
7158
|
+
return;
|
|
7159
|
+
var resizeObserver = new ResizeObserver(function (entries) {
|
|
7160
|
+
for (var _i = 0, entries_1 = entries; _i < entries_1.length; _i++) {
|
|
7161
|
+
var entry = entries_1[_i];
|
|
7162
|
+
handleResize(entry.contentRect.width);
|
|
7163
|
+
}
|
|
7164
|
+
});
|
|
7165
|
+
resizeObserver.observe(element);
|
|
7166
|
+
return function () {
|
|
7167
|
+
resizeObserver.disconnect();
|
|
7168
|
+
};
|
|
7169
|
+
}, [handleResize]);
|
|
7170
|
+
var visualElement = visualElementType === "image" && image ? (jsx(ContentCardImageMedia, { imagePadding: imagePadding, boundingBox: boundingBox, sdsType: dynamicSdsType, imageSize: imageSize, image: image, imagePosition: imagePosition })) : visualElementType === "icon" && icon ? (jsx(StyledIconMediaWrapper, { boundingBox: boundingBox, children: icon })) : null;
|
|
7171
|
+
var cardInnerContent = (jsxs(Fragment, { children: [visualElement, jsxs(StyledCardContent, { boundingBox: boundingBox, clickableCard: clickableCard, children: [jsx(ContentCardTitle, { overlineText: overlineText, titleText: titleText, subtitleText: subtitleText, metadataText: metadataText }), jsx(StyledCardContentAligner, { children: enhanceChildrenWithCardActionsProps(children, clickableCard, buttonsPosition) })] })] }));
|
|
7172
|
+
return (jsx(StyledCard, __assign({ ref: mergeRefs([ref, cardRef]) }, props, { sdsType: dynamicSdsType, boundingBox: boundingBox, children: clickableCard ? (jsx(StyledCardActionArea, { sdsType: dynamicSdsType, visualElementType: visualElementType, imagePosition: imagePosition, children: cardInnerContent })) : (cardInnerContent) })));
|
|
7173
|
+
});
|
|
7174
|
+
|
|
6821
7175
|
var DialogContext = createContext({ sdsSize: "m" });
|
|
6822
7176
|
|
|
6823
7177
|
// (thuang): Please keep this in sync with the props used in `ExtraProps`
|
|
6824
|
-
var doNotForwardProps$
|
|
7178
|
+
var doNotForwardProps$k = ["sdsSize"];
|
|
6825
7179
|
var StyledPaper = styled$2(Paper, {
|
|
6826
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6827
|
-
})(templateObject_1$
|
|
7180
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
7181
|
+
})(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n & {\n ", "\n\n ", "\n }\n"], ["\n & {\n ", "\n\n ", "\n }\n"])), paperDimensions, function (props) {
|
|
6828
7182
|
var _a;
|
|
6829
7183
|
var spaces = getSpaces(props);
|
|
6830
7184
|
var corners = getCorners(props);
|
|
@@ -6855,7 +7209,7 @@ function paperDimensions(props) {
|
|
|
6855
7209
|
var _a = sizeToDimensions[sdsSize], width = _a.width, minHeight = _a.minHeight;
|
|
6856
7210
|
return "\n width: ".concat(width, ";\n min-height: ").concat(minHeight, ";\n max-width: revert;\n box-sizing: border-box;\n ");
|
|
6857
7211
|
}
|
|
6858
|
-
var templateObject_1$
|
|
7212
|
+
var templateObject_1$E;
|
|
6859
7213
|
|
|
6860
7214
|
/**
|
|
6861
7215
|
* @see https://mui.com/material-ui/react-paper/
|
|
@@ -6884,15 +7238,15 @@ var Dialog = forwardRef(function Dialog(props, ref) {
|
|
|
6884
7238
|
});
|
|
6885
7239
|
|
|
6886
7240
|
// (thuang): Please keep this in sync with the props used in `DialogActionsExtraProps`
|
|
6887
|
-
var doNotForwardProps$
|
|
7241
|
+
var doNotForwardProps$j = ["buttonPosition"];
|
|
6888
7242
|
var StyledDialogActions = styled$2(DialogActions$1, {
|
|
6889
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6890
|
-
})(templateObject_1$
|
|
7243
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$j.includes(prop); },
|
|
7244
|
+
})(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n padding: 0;\n\n ", "\n"], ["\n padding: 0;\n\n ", "\n"])), function (props) {
|
|
6891
7245
|
var spaces = getSpaces(props);
|
|
6892
7246
|
var _a = props.buttonPosition, buttonPosition = _a === void 0 ? "right" : _a;
|
|
6893
7247
|
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 ");
|
|
6894
7248
|
});
|
|
6895
|
-
var templateObject_1$
|
|
7249
|
+
var templateObject_1$D;
|
|
6896
7250
|
|
|
6897
7251
|
/**
|
|
6898
7252
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -6901,8 +7255,8 @@ var DialogActions = forwardRef(function DialogActions(props, ref) {
|
|
|
6901
7255
|
return jsx(StyledDialogActions, __assign({ ref: ref }, props));
|
|
6902
7256
|
});
|
|
6903
7257
|
|
|
6904
|
-
var StyledDialogContent = styled$2(DialogContent)(templateObject_1$
|
|
6905
|
-
var templateObject_1$
|
|
7258
|
+
var StyledDialogContent = styled$2(DialogContent)(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n ", "\n padding: 0;\n"], ["\n ", "\n padding: 0;\n"])), fontBodyS$1);
|
|
7259
|
+
var templateObject_1$C;
|
|
6906
7260
|
|
|
6907
7261
|
var index = forwardRef(
|
|
6908
7262
|
/**
|
|
@@ -6912,11 +7266,11 @@ function DialogContent(props, ref) {
|
|
|
6912
7266
|
return jsx(StyledDialogContent, __assign({ ref: ref }, props));
|
|
6913
7267
|
});
|
|
6914
7268
|
|
|
6915
|
-
var StyledButton$1 = styled$2(Button)(templateObject_1$
|
|
7269
|
+
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) {
|
|
6916
7270
|
var spaces = getSpaces(props);
|
|
6917
7271
|
return "\n right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxl, "px;\n ");
|
|
6918
7272
|
});
|
|
6919
|
-
var templateObject_1$
|
|
7273
|
+
var templateObject_1$B;
|
|
6920
7274
|
|
|
6921
7275
|
var CloseButton = forwardRef(function CloseButton(props, ref) {
|
|
6922
7276
|
var SDS_SIZE_TO_COMPONENT_SIZE = {
|
|
@@ -6932,27 +7286,27 @@ var CloseButton = forwardRef(function CloseButton(props, ref) {
|
|
|
6932
7286
|
} }));
|
|
6933
7287
|
});
|
|
6934
7288
|
|
|
6935
|
-
var StyledDialogTitle = styled$2(DialogTitle$1)(templateObject_1$
|
|
7289
|
+
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) {
|
|
6936
7290
|
var spaces = getSpaces(props);
|
|
6937
7291
|
return "\n margin-bottom: ".concat((spaces === null || spaces === void 0 ? void 0 : spaces.xl) || 0, "px;\n ");
|
|
6938
7292
|
});
|
|
6939
|
-
var Title = styled$2(Typography)(templateObject_2$
|
|
7293
|
+
var Title = styled$2(Typography)(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderXl, function (props) {
|
|
6940
7294
|
var _a;
|
|
6941
7295
|
var semanticColors = getSemanticColors(props);
|
|
6942
7296
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n ");
|
|
6943
7297
|
});
|
|
6944
|
-
var Subtitle = styled$2(Typography)(templateObject_3$
|
|
7298
|
+
var Subtitle = styled$2(Typography)(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
6945
7299
|
var _a;
|
|
6946
7300
|
var semanticColors = getSemanticColors(props);
|
|
6947
7301
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
6948
7302
|
});
|
|
6949
|
-
var Overline = styled$2(Typography)(templateObject_4$
|
|
7303
|
+
var Overline = styled$2(Typography)(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6950
7304
|
var _a;
|
|
6951
7305
|
var semanticColors = getSemanticColors(props);
|
|
6952
7306
|
var spaces = getSpaces(props);
|
|
6953
7307
|
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 ");
|
|
6954
7308
|
});
|
|
6955
|
-
var templateObject_1$
|
|
7309
|
+
var templateObject_1$A, templateObject_2$o, templateObject_3$g, templateObject_4$d;
|
|
6956
7310
|
|
|
6957
7311
|
/**
|
|
6958
7312
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -6962,20 +7316,20 @@ var DialogTitle = forwardRef(function DialogTitle(props, ref) {
|
|
|
6962
7316
|
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 })] })) })));
|
|
6963
7317
|
});
|
|
6964
7318
|
|
|
6965
|
-
var doNotForwardProps$
|
|
7319
|
+
var doNotForwardProps$i = ["buttonPosition"];
|
|
6966
7320
|
var StyledButtonsWrapper = styled$2("div", {
|
|
6967
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6968
|
-
})(templateObject_1$
|
|
7321
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
7322
|
+
})(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6969
7323
|
var buttonPosition = props.buttonPosition;
|
|
6970
7324
|
return "\n display: flex;\n justify-content: ".concat(buttonPosition === "left" ? "start" : "end", ";\n ");
|
|
6971
7325
|
});
|
|
6972
7326
|
var StyledButton = styled$2(Button, {
|
|
6973
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6974
|
-
})(templateObject_2$
|
|
7327
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
7328
|
+
})(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6975
7329
|
var spaces = getSpaces(props);
|
|
6976
7330
|
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 ");
|
|
6977
7331
|
});
|
|
6978
|
-
var templateObject_1$
|
|
7332
|
+
var templateObject_1$z, templateObject_2$n;
|
|
6979
7333
|
|
|
6980
7334
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
6981
7335
|
var Dropdown = function (props) {
|
|
@@ -7111,11 +7465,11 @@ var intentToColor$1 = {
|
|
|
7111
7465
|
notice: "notice",
|
|
7112
7466
|
positive: "positive",
|
|
7113
7467
|
};
|
|
7114
|
-
var StyledIcon = styled$2(Icon)(templateObject_1$
|
|
7468
|
+
var StyledIcon = styled$2(Icon)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7115
7469
|
var iconSizes = getIconSizes(props);
|
|
7116
7470
|
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 ");
|
|
7117
7471
|
});
|
|
7118
|
-
var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$
|
|
7472
|
+
var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7119
7473
|
var _a;
|
|
7120
7474
|
var _b = props.intent, intent = _b === void 0 ? "default" : _b;
|
|
7121
7475
|
var iconSizes = getIconSizes(props);
|
|
@@ -7123,22 +7477,22 @@ var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$j || (template
|
|
|
7123
7477
|
var borderColor = intentToColor$1[intent];
|
|
7124
7478
|
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 ");
|
|
7125
7479
|
});
|
|
7126
|
-
var StyledCheckboxCheckedIcon = styled$2("div")(templateObject_3$
|
|
7480
|
+
var StyledCheckboxCheckedIcon = styled$2("div")(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7127
7481
|
var _a, _b;
|
|
7128
7482
|
var iconSizes = getIconSizes(props);
|
|
7129
7483
|
var semanticColors = getSemanticColors(props);
|
|
7130
7484
|
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 ");
|
|
7131
7485
|
});
|
|
7132
|
-
var StyledCheckbox = styled$2(Checkbox)(templateObject_4$
|
|
7486
|
+
var StyledCheckbox = styled$2(Checkbox)(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7133
7487
|
var spaces = getSpaces(props);
|
|
7134
7488
|
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 ");
|
|
7135
7489
|
});
|
|
7136
|
-
var StyledLabelContainer$1 = styled$2("span")(templateObject_5$
|
|
7137
|
-
var StyledCheckboxLabel = styled$2("span")(templateObject_6$
|
|
7490
|
+
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"])));
|
|
7491
|
+
var StyledCheckboxLabel = styled$2("span")(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7138
7492
|
var spaces = getSpaces(props);
|
|
7139
7493
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
7140
7494
|
});
|
|
7141
|
-
var StyledCheckboxCaption = styled$2("span")(templateObject_7$
|
|
7495
|
+
var StyledCheckboxCaption = styled$2("span")(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7142
7496
|
var _a;
|
|
7143
7497
|
var semanticColors = getSemanticColors(props);
|
|
7144
7498
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
@@ -7149,7 +7503,7 @@ var disabledStyles$1 = function (props) {
|
|
|
7149
7503
|
var borders = getBorders(props);
|
|
7150
7504
|
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 ");
|
|
7151
7505
|
};
|
|
7152
|
-
var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$
|
|
7506
|
+
var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$3 || (templateObject_8$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7153
7507
|
var _a, _b, _c, _d;
|
|
7154
7508
|
var disabled = props.disabled;
|
|
7155
7509
|
var spaces = getSpaces(props);
|
|
@@ -7157,7 +7511,7 @@ var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$2 ||
|
|
|
7157
7511
|
var borders = getBorders(props);
|
|
7158
7512
|
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 ");
|
|
7159
7513
|
});
|
|
7160
|
-
var templateObject_1$
|
|
7514
|
+
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;
|
|
7161
7515
|
|
|
7162
7516
|
/**
|
|
7163
7517
|
* @see https://mui.com/material-ui/react-checkbox/
|
|
@@ -7192,12 +7546,12 @@ var intentToColor = {
|
|
|
7192
7546
|
notice: "notice",
|
|
7193
7547
|
positive: "positive",
|
|
7194
7548
|
};
|
|
7195
|
-
var StyledRadioDot = styled$2("span")(templateObject_1$
|
|
7549
|
+
var StyledRadioDot = styled$2("span")(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7196
7550
|
var _a;
|
|
7197
7551
|
var semanticColors = getSemanticColors(props);
|
|
7198
7552
|
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 ");
|
|
7199
7553
|
});
|
|
7200
|
-
var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$
|
|
7554
|
+
var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7201
7555
|
var _a;
|
|
7202
7556
|
var _b = props.intent, intent = _b === void 0 ? "default" : _b;
|
|
7203
7557
|
var iconSizes = getIconSizes(props);
|
|
@@ -7205,22 +7559,22 @@ var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$i || (templateObj
|
|
|
7205
7559
|
var borderColor = intentToColor[intent];
|
|
7206
7560
|
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 ");
|
|
7207
7561
|
});
|
|
7208
|
-
var StyledRadioCheckedIcon = styled$2("div")(templateObject_3$
|
|
7562
|
+
var StyledRadioCheckedIcon = styled$2("div")(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7209
7563
|
var _a;
|
|
7210
7564
|
var iconSizes = getIconSizes(props);
|
|
7211
7565
|
var semanticColors = getSemanticColors(props);
|
|
7212
7566
|
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 ");
|
|
7213
7567
|
});
|
|
7214
|
-
var StyledRadioButton = styled$2(Radio)(templateObject_4$
|
|
7568
|
+
var StyledRadioButton = styled$2(Radio)(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7215
7569
|
var spaces = getSpaces(props);
|
|
7216
7570
|
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 ");
|
|
7217
7571
|
});
|
|
7218
|
-
var StyledLabelContainer = styled$2("span")(templateObject_5$
|
|
7219
|
-
var StyledRadioLabel = styled$2("span")(templateObject_6$
|
|
7572
|
+
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"])));
|
|
7573
|
+
var StyledRadioLabel = styled$2("span")(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7220
7574
|
var spaces = getSpaces(props);
|
|
7221
7575
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
7222
7576
|
});
|
|
7223
|
-
var StyledRadioCaption = styled$2("span")(templateObject_7$
|
|
7577
|
+
var StyledRadioCaption = styled$2("span")(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7224
7578
|
var _a;
|
|
7225
7579
|
var semanticColors = getSemanticColors(props);
|
|
7226
7580
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
@@ -7228,16 +7582,16 @@ var StyledRadioCaption = styled$2("span")(templateObject_7$2 || (templateObject_
|
|
|
7228
7582
|
var disabledStyles = function (props) {
|
|
7229
7583
|
var _a, _b, _c, _d, _e;
|
|
7230
7584
|
var semanticColors = getSemanticColors(props);
|
|
7231
|
-
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.
|
|
7585
|
+
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 ");
|
|
7232
7586
|
};
|
|
7233
|
-
var StyledFormControlLabel = styled$2(FormControlLabel)(templateObject_8$
|
|
7587
|
+
var StyledFormControlLabel = styled$2(FormControlLabel)(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7234
7588
|
var _a, _b, _c, _d;
|
|
7235
7589
|
var disabled = props.disabled;
|
|
7236
7590
|
var spaces = getSpaces(props);
|
|
7237
7591
|
var semanticColors = getSemanticColors(props);
|
|
7238
|
-
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.
|
|
7592
|
+
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 ");
|
|
7239
7593
|
});
|
|
7240
|
-
var templateObject_1$
|
|
7594
|
+
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;
|
|
7241
7595
|
|
|
7242
7596
|
/**
|
|
7243
7597
|
* @see https://mui.com/material-ui/react-radio-button/
|
|
@@ -7283,11 +7637,11 @@ var disabledSlider = function (props) {
|
|
|
7283
7637
|
var semanticColors = getSemanticColors(props);
|
|
7284
7638
|
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 ");
|
|
7285
7639
|
};
|
|
7286
|
-
var StyledSlider = styled$2(Slider)(templateObject_1$
|
|
7640
|
+
var StyledSlider = styled$2(Slider)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7287
7641
|
var disabled = props.disabled;
|
|
7288
7642
|
return "\n ".concat(inputSlider(props), "\n ").concat(horizontal(props), "\n ").concat(disabled ? disabledSlider(props) : "", "\n ");
|
|
7289
7643
|
});
|
|
7290
|
-
var templateObject_1$
|
|
7644
|
+
var templateObject_1$w;
|
|
7291
7645
|
|
|
7292
7646
|
/**
|
|
7293
7647
|
* @see https://mui.com/material-ui/react-slider/
|
|
@@ -7302,19 +7656,19 @@ var applyIntentColor = function (props, intent) {
|
|
|
7302
7656
|
var _a, _b, _c, _d;
|
|
7303
7657
|
var borders = getBorders(props);
|
|
7304
7658
|
var semanticColors = getSemanticColors(props);
|
|
7305
|
-
return css(templateObject_1$
|
|
7659
|
+
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);
|
|
7306
7660
|
};
|
|
7307
7661
|
var disabledStyled$1 = function (props) {
|
|
7308
7662
|
var _a, _b, _c;
|
|
7309
7663
|
var borders = getBorders(props);
|
|
7310
7664
|
var semanticColors = getSemanticColors(props);
|
|
7311
|
-
return css(templateObject_2$
|
|
7665
|
+
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);
|
|
7312
7666
|
};
|
|
7313
7667
|
var textArea = function (props) {
|
|
7314
7668
|
var spaces = getSpaces(props);
|
|
7315
|
-
return css(templateObject_3$
|
|
7669
|
+
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);
|
|
7316
7670
|
};
|
|
7317
|
-
var StyledLabel$1 = styled$2("label")(templateObject_4$
|
|
7671
|
+
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) {
|
|
7318
7672
|
var spaces = getSpaces(props);
|
|
7319
7673
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
7320
7674
|
});
|
|
@@ -7322,15 +7676,15 @@ var StyledInputBase = styled$2(TextField, {
|
|
|
7322
7676
|
shouldForwardProp: function (prop) {
|
|
7323
7677
|
return !sdsPropNames$1.includes(prop.toString());
|
|
7324
7678
|
},
|
|
7325
|
-
})(templateObject_6$
|
|
7679
|
+
})(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7326
7680
|
var _a, _b, _c;
|
|
7327
7681
|
var intent = props.intent, sdsType = props.sdsType, disabled = props.disabled;
|
|
7328
7682
|
var spaces = getSpaces(props);
|
|
7329
7683
|
var borders = getBorders(props);
|
|
7330
7684
|
var corners = getCorners(props);
|
|
7331
|
-
return css(templateObject_5$
|
|
7685
|
+
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));
|
|
7332
7686
|
});
|
|
7333
|
-
var templateObject_1$
|
|
7687
|
+
var templateObject_1$v, templateObject_2$k, templateObject_3$d, templateObject_4$a, templateObject_5$7, templateObject_6$6;
|
|
7334
7688
|
|
|
7335
7689
|
/**
|
|
7336
7690
|
* @see https://mui.com/material-ui/react-text-field/
|
|
@@ -7391,11 +7745,11 @@ var toggleOff = function (props) {
|
|
|
7391
7745
|
: (_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 &&
|
|
7392
7746
|
"&: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 ");
|
|
7393
7747
|
};
|
|
7394
|
-
var Toggle = styled$2(Switch)(templateObject_1$
|
|
7748
|
+
var Toggle = styled$2(Switch)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7395
7749
|
var checked = props.checked;
|
|
7396
7750
|
return "\n ".concat(toggle(props), "\n ").concat(checked ? toggleOn(props) : toggleOff(props), "\n ");
|
|
7397
7751
|
});
|
|
7398
|
-
var templateObject_1$
|
|
7752
|
+
var templateObject_1$u;
|
|
7399
7753
|
|
|
7400
7754
|
/**
|
|
7401
7755
|
* @see https://mui.com/material-ui/react-switch/
|
|
@@ -7413,14 +7767,14 @@ var InputToggle = function (props) {
|
|
|
7413
7767
|
return (jsx(Toggle, __assign({ checked: finalChecked, color: "primary", onChange: handleChange, value: labelValue }, rest)));
|
|
7414
7768
|
};
|
|
7415
7769
|
|
|
7416
|
-
var doNotForwardProps$
|
|
7770
|
+
var doNotForwardProps$h = ["sdsStyle", "sdsSize", "fontWeight"];
|
|
7417
7771
|
var defaultStyle = function (props) {
|
|
7418
7772
|
var _a, _b, _c, _d;
|
|
7419
7773
|
var semanticColors = getSemanticColors(props);
|
|
7420
|
-
return css(templateObject_1$
|
|
7774
|
+
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);
|
|
7421
7775
|
};
|
|
7422
7776
|
var dashedStyle = function () {
|
|
7423
|
-
return css(templateObject_2$
|
|
7777
|
+
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 "])));
|
|
7424
7778
|
};
|
|
7425
7779
|
var smallStyle = function (props) {
|
|
7426
7780
|
return fontBodyS$1(props);
|
|
@@ -7430,13 +7784,13 @@ var extraSmallStyle = function (props) {
|
|
|
7430
7784
|
};
|
|
7431
7785
|
var StyledLink = styled$2(Link$1, {
|
|
7432
7786
|
shouldForwardProp: function (prop) {
|
|
7433
|
-
return !doNotForwardProps$
|
|
7787
|
+
return !doNotForwardProps$h.includes(prop.toString());
|
|
7434
7788
|
},
|
|
7435
|
-
})(templateObject_4$
|
|
7789
|
+
})(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) {
|
|
7436
7790
|
var _a = props.fontWeight, fontWeight = _a === void 0 ? "normal" : _a, sdsStyle = props.sdsStyle, _b = props.sdsSize, sdsSize = _b === void 0 ? "s" : _b;
|
|
7437
|
-
return css(templateObject_3$
|
|
7791
|
+
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");
|
|
7438
7792
|
});
|
|
7439
|
-
var templateObject_1$
|
|
7793
|
+
var templateObject_1$t, templateObject_2$j, templateObject_3$c, templateObject_4$9;
|
|
7440
7794
|
|
|
7441
7795
|
/**
|
|
7442
7796
|
* @see https://mui.com/material-ui/react-link/
|
|
@@ -7451,10 +7805,10 @@ var Link = forwardRef(function (props, ref) {
|
|
|
7451
7805
|
});
|
|
7452
7806
|
|
|
7453
7807
|
// (thuang): Please keep this in sync with the props used in `ListExtraProps`
|
|
7454
|
-
var doNotForwardProps$
|
|
7808
|
+
var doNotForwardProps$g = ["marginBottom", "ordered"];
|
|
7455
7809
|
var StyledList = styled$2(List$1, {
|
|
7456
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7457
|
-
})(templateObject_1$
|
|
7810
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
7811
|
+
})(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) {
|
|
7458
7812
|
if (!props.ordered)
|
|
7459
7813
|
return "";
|
|
7460
7814
|
return "\n counter-reset: section;\n ";
|
|
@@ -7472,7 +7826,7 @@ function propsToMarginBottom$1(props) {
|
|
|
7472
7826
|
var marginBottom = props.marginBottom;
|
|
7473
7827
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "s"], "px;\n ");
|
|
7474
7828
|
}
|
|
7475
|
-
var templateObject_1$
|
|
7829
|
+
var templateObject_1$s;
|
|
7476
7830
|
|
|
7477
7831
|
/**
|
|
7478
7832
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7489,10 +7843,10 @@ var fontBodyXs$1 = fontBody("xs");
|
|
|
7489
7843
|
var fontBodyXxs = fontBody("xxs");
|
|
7490
7844
|
var fontBodyXxxs = fontBody("xxxs");
|
|
7491
7845
|
// (thuang): Please keep this in sync with the props used in `ListItemExtraProps`
|
|
7492
|
-
var doNotForwardProps$
|
|
7846
|
+
var doNotForwardProps$f = ["marginBottom", "fontSize", "ordered"];
|
|
7493
7847
|
var StyledListItem = styled$2(ListItem$1, {
|
|
7494
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7495
|
-
})(templateObject_1$
|
|
7848
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
7849
|
+
})(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) {
|
|
7496
7850
|
var ordered = props.ordered;
|
|
7497
7851
|
return "\n align-items: flex-start;\n ".concat(ordered ? "counter-increment: section;" : "", "\n ");
|
|
7498
7852
|
}, function (props) {
|
|
@@ -7523,11 +7877,11 @@ function propsToMarginBottom(props) {
|
|
|
7523
7877
|
var marginBottom = props.marginBottom;
|
|
7524
7878
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "xs"], "px;\n ");
|
|
7525
7879
|
}
|
|
7526
|
-
var ListItemLabel = styled$2("span")(templateObject_2$
|
|
7880
|
+
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) {
|
|
7527
7881
|
var fontWeights = getFontWeights(props);
|
|
7528
7882
|
return "\n font-weight: ".concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n ");
|
|
7529
7883
|
});
|
|
7530
|
-
var templateObject_1$
|
|
7884
|
+
var templateObject_1$r, templateObject_2$i;
|
|
7531
7885
|
|
|
7532
7886
|
/**
|
|
7533
7887
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7537,11 +7891,11 @@ var ListItem = function (props) {
|
|
|
7537
7891
|
};
|
|
7538
7892
|
|
|
7539
7893
|
var fontHeaderM = fontHeader("m");
|
|
7540
|
-
var StyledListSubheader = styled$2(ListSubheader$1)(templateObject_1$
|
|
7894
|
+
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) {
|
|
7541
7895
|
var spaces = getSpaces(props);
|
|
7542
7896
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n ");
|
|
7543
7897
|
});
|
|
7544
|
-
var templateObject_1$
|
|
7898
|
+
var templateObject_1$q;
|
|
7545
7899
|
|
|
7546
7900
|
/**
|
|
7547
7901
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7550,7 +7904,7 @@ var ListSubheader = function (props) {
|
|
|
7550
7904
|
return jsx(StyledListSubheader, __assign({ disableGutters: true }, props));
|
|
7551
7905
|
};
|
|
7552
7906
|
|
|
7553
|
-
var StyledText = styled$2("span")(templateObject_1$
|
|
7907
|
+
var StyledText = styled$2("span")(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7554
7908
|
var spaces = getSpaces(props);
|
|
7555
7909
|
return "\n margin: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
7556
7910
|
});
|
|
@@ -7558,37 +7912,37 @@ var minimal = function (props) {
|
|
|
7558
7912
|
var _a, _b;
|
|
7559
7913
|
var iconSizes = getIconSizes(props);
|
|
7560
7914
|
var semanticColors = getSemanticColors(props);
|
|
7561
|
-
return css(templateObject_2$
|
|
7915
|
+
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);
|
|
7562
7916
|
};
|
|
7563
7917
|
var tag = function (props) {
|
|
7564
7918
|
var _a, _b, _c;
|
|
7565
7919
|
var corners = getCorners(props);
|
|
7566
7920
|
var semanticColors = getSemanticColors(props);
|
|
7567
|
-
return css(templateObject_3$
|
|
7921
|
+
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);
|
|
7568
7922
|
};
|
|
7569
|
-
var doNotForwardProps$
|
|
7923
|
+
var doNotForwardProps$e = ["sdsStyle"];
|
|
7570
7924
|
var StyledLoadingIndicator = styled$2("div", {
|
|
7571
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7572
|
-
})(templateObject_6$
|
|
7925
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$e.includes(prop); },
|
|
7926
|
+
})(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7573
7927
|
var sdsStyle = props.sdsStyle;
|
|
7574
7928
|
var spaces = getSpaces(props);
|
|
7575
|
-
var style = css(templateObject_4$
|
|
7576
|
-
return css(templateObject_5$
|
|
7929
|
+
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);
|
|
7930
|
+
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));
|
|
7577
7931
|
});
|
|
7578
|
-
var templateObject_1$
|
|
7932
|
+
var templateObject_1$p, templateObject_2$h, templateObject_3$b, templateObject_4$8, templateObject_5$6, templateObject_6$5;
|
|
7579
7933
|
|
|
7580
7934
|
var LoadingIndicator = function (_a) {
|
|
7581
7935
|
var ariaLabel = _a["aria-label"], sdsStyle = _a.sdsStyle;
|
|
7582
7936
|
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" })] }));
|
|
7583
7937
|
};
|
|
7584
7938
|
|
|
7585
|
-
var StyledMenu = styled$2(Menu$1)(templateObject_1$
|
|
7939
|
+
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) {
|
|
7586
7940
|
var _a;
|
|
7587
7941
|
var spaces = getSpaces(props);
|
|
7588
7942
|
var semanticColors = getSemanticColors(props);
|
|
7589
7943
|
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 ");
|
|
7590
7944
|
});
|
|
7591
|
-
var templateObject_1$
|
|
7945
|
+
var templateObject_1$o;
|
|
7592
7946
|
|
|
7593
7947
|
var ANCHOR_ORIGIN = {
|
|
7594
7948
|
horizontal: "center",
|
|
@@ -7605,19 +7959,19 @@ var Menu = function (props) {
|
|
|
7605
7959
|
return (jsx(StyledMenu, __assign({ anchorOrigin: ANCHOR_ORIGIN, transformOrigin: TRANSFORM_ORIGIN }, props)));
|
|
7606
7960
|
};
|
|
7607
7961
|
|
|
7608
|
-
var StyledMenuItem = styled$2(MenuItem)(templateObject_1$
|
|
7609
|
-
var doNotForwardProps$
|
|
7962
|
+
var StyledMenuItem = styled$2(MenuItem)(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
7963
|
+
var doNotForwardProps$d = ["search", "InputBaseProps", "keepSearchOnSelect"];
|
|
7610
7964
|
// (thuang): Casting the type to `Autocomplete`
|
|
7611
7965
|
// per https://github.com/mui-org/material-ui/issues/21727#issuecomment-880263271
|
|
7612
7966
|
var StyledAutocomplete = styled$2(Autocomplete$1, {
|
|
7613
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7614
|
-
})(templateObject_2$
|
|
7967
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
7968
|
+
})(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n ", "\n width: 100%;\n"], ["\n ", "\n width: 100%;\n"])), function (_a) {
|
|
7615
7969
|
var search = _a.search;
|
|
7616
7970
|
return !search && "height: 0; margin: 0 !important;";
|
|
7617
7971
|
});
|
|
7618
7972
|
var InputBaseWrapper = styled$2("div", {
|
|
7619
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7620
|
-
})(templateObject_3$
|
|
7973
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
7974
|
+
})(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7621
7975
|
var search = props.search;
|
|
7622
7976
|
if (!search) {
|
|
7623
7977
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -7629,12 +7983,12 @@ var InputBaseWrapper = styled$2("div", {
|
|
|
7629
7983
|
return "\n margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
7630
7984
|
});
|
|
7631
7985
|
var StyledMenuInputSearch = styled$2(InputSearch, {
|
|
7632
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7633
|
-
})(templateObject_4$
|
|
7986
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
7987
|
+
})(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) {
|
|
7634
7988
|
var search = _a.search;
|
|
7635
7989
|
return (search ? "auto" : "transparent");
|
|
7636
7990
|
});
|
|
7637
|
-
var templateObject_1$
|
|
7991
|
+
var templateObject_1$n, templateObject_2$g, templateObject_3$a, templateObject_4$7;
|
|
7638
7992
|
|
|
7639
7993
|
/**
|
|
7640
7994
|
* @see https://mui.com/material-ui/react-autocomplete/
|
|
@@ -7685,6 +8039,80 @@ var MenuSelect = function (props) {
|
|
|
7685
8039
|
}
|
|
7686
8040
|
};
|
|
7687
8041
|
|
|
8042
|
+
var doNotForwardProps$c = ["hasInvertedStyle", "isNarrow"];
|
|
8043
|
+
var StyledFooter = styled$2("footer", {
|
|
8044
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8045
|
+
})(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8046
|
+
var isNarrow = props.isNarrow;
|
|
8047
|
+
var spaces = getSpaces(props);
|
|
8048
|
+
var semanticColors = getSemanticColors(props);
|
|
8049
|
+
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
|
|
8050
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimaryInverse
|
|
8051
|
+
: 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
|
|
8052
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
8053
|
+
: 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));
|
|
8054
|
+
});
|
|
8055
|
+
var StyledLogoWrapper$1 = styled$2("div", {
|
|
8056
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8057
|
+
})(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) {
|
|
8058
|
+
var spaces = getSpaces(props);
|
|
8059
|
+
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);
|
|
8060
|
+
}, fontHeader("l"), fontHeader("l", /* isNarrow */ true), function (props) {
|
|
8061
|
+
var semanticColors = getSemanticColors(props);
|
|
8062
|
+
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
|
|
8063
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
8064
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary);
|
|
8065
|
+
});
|
|
8066
|
+
var StyledNavSection = styled$2("div", {
|
|
8067
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8068
|
+
})(templateObject_9$1 || (templateObject_9$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8069
|
+
var isNarrow = props.isNarrow;
|
|
8070
|
+
var spaces = getSpaces(props);
|
|
8071
|
+
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));
|
|
8072
|
+
});
|
|
8073
|
+
var StyledTopSection = styled$2("div", {
|
|
8074
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8075
|
+
})(templateObject_12$1 || (templateObject_12$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8076
|
+
var isNarrow = props.isNarrow;
|
|
8077
|
+
var semanticColors = getSemanticColors(props);
|
|
8078
|
+
var spaces = getSpaces(props);
|
|
8079
|
+
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
|
|
8080
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryInverse
|
|
8081
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, props.hasInvertedStyle
|
|
8082
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
8083
|
+
: 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));
|
|
8084
|
+
});
|
|
8085
|
+
var StyledLinkSection = styled$2("div", {
|
|
8086
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8087
|
+
})(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) {
|
|
8088
|
+
var isNarrow = props.isNarrow;
|
|
8089
|
+
var spaces = getSpaces(props);
|
|
8090
|
+
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));
|
|
8091
|
+
});
|
|
8092
|
+
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) {
|
|
8093
|
+
var spaces = getSpaces(props);
|
|
8094
|
+
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
8095
|
+
});
|
|
8096
|
+
var StyledImageSection = styled$2("div", {
|
|
8097
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8098
|
+
})(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) {
|
|
8099
|
+
var isNarrow = props.isNarrow;
|
|
8100
|
+
var spaces = getSpaces(props);
|
|
8101
|
+
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));
|
|
8102
|
+
});
|
|
8103
|
+
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) {
|
|
8104
|
+
var spaces = getSpaces(props);
|
|
8105
|
+
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;\n ");
|
|
8106
|
+
});
|
|
8107
|
+
var StyledBottomSection = styled$2("div", {
|
|
8108
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8109
|
+
})(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) {
|
|
8110
|
+
var isNarrow = props.isNarrow;
|
|
8111
|
+
var spaces = getSpaces(props);
|
|
8112
|
+
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));
|
|
8113
|
+
});
|
|
8114
|
+
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;
|
|
8115
|
+
|
|
7688
8116
|
/**
|
|
7689
8117
|
* WARNING: Don't import this directly.
|
|
7690
8118
|
* Use `MuiError` from `@mui/internal-babel-macros/MuiError.macro` instead.
|
|
@@ -13703,6 +14131,143 @@ function useTheme() {
|
|
|
13703
14131
|
return theme[THEME_ID] || theme;
|
|
13704
14132
|
}
|
|
13705
14133
|
|
|
14134
|
+
var doNotForwardProps$b = ["hasInvertedStyle", "isNarrow"];
|
|
14135
|
+
var NarrowNavItemLinkStyles = function (props) {
|
|
14136
|
+
var semanticColors = getSemanticColors(props);
|
|
14137
|
+
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
|
|
14138
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14139
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, props.hasInvertedStyle
|
|
14140
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondaryInverse
|
|
14141
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondary);
|
|
14142
|
+
};
|
|
14143
|
+
var StyledNavItemLink = styled$2(Link, {
|
|
14144
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$b.includes(prop); },
|
|
14145
|
+
})(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) {
|
|
14146
|
+
var isNarrow = props.isNarrow;
|
|
14147
|
+
var semanticColors = getSemanticColors(props);
|
|
14148
|
+
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
|
|
14149
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryInverse
|
|
14150
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, props.hasInvertedStyle
|
|
14151
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14152
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, isNarrow && NarrowNavItemLinkStyles(props));
|
|
14153
|
+
});
|
|
14154
|
+
var templateObject_1$l, templateObject_2$e, templateObject_3$8;
|
|
14155
|
+
|
|
14156
|
+
var NavItem = memo(function (_a) {
|
|
14157
|
+
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow;
|
|
14158
|
+
return (jsx(StyledNavItemLink, __assign({ href: item.url, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, component: item.component }, item.linkProps, { children: item.label }), item.label));
|
|
14159
|
+
});
|
|
14160
|
+
NavItem.displayName = "NavItem";
|
|
14161
|
+
|
|
14162
|
+
var doNotForwardProps$a = ["hasInvertedStyle"];
|
|
14163
|
+
var StyledLinkItemLink = styled$2(Link, {
|
|
14164
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
14165
|
+
})(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBody("xxs", "regular"), function (props) {
|
|
14166
|
+
var semanticColors = getSemanticColors(props);
|
|
14167
|
+
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 ");
|
|
14168
|
+
});
|
|
14169
|
+
var StyledDivider = styled$2(Divider, {
|
|
14170
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
14171
|
+
})(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14172
|
+
var semanticColors = getSemanticColors(props);
|
|
14173
|
+
return "\n border-color: ".concat(props.hasInvertedStyle
|
|
14174
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
14175
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider, ";\n ");
|
|
14176
|
+
});
|
|
14177
|
+
var templateObject_1$k, templateObject_2$d;
|
|
14178
|
+
|
|
14179
|
+
var FooterLink = memo(function (_a) {
|
|
14180
|
+
var link = _a.link, showDivider = _a.showDivider, hasInvertedStyle = _a.hasInvertedStyle;
|
|
14181
|
+
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 }))] }));
|
|
14182
|
+
});
|
|
14183
|
+
FooterLink.displayName = "FooterLink";
|
|
14184
|
+
|
|
14185
|
+
function groupArray(array, groupSize) {
|
|
14186
|
+
var groups = [];
|
|
14187
|
+
for (var i = 0; i < array.length; i += groupSize) {
|
|
14188
|
+
groups.push(array.slice(i, i + groupSize));
|
|
14189
|
+
}
|
|
14190
|
+
return groups;
|
|
14191
|
+
}
|
|
14192
|
+
var MemoizedStyledDivider = memo(StyledDivider);
|
|
14193
|
+
function NavigationFooter(_a) {
|
|
14194
|
+
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"]);
|
|
14195
|
+
var footerRef = useRef(null);
|
|
14196
|
+
var theme = useTheme();
|
|
14197
|
+
var isMdScreen = useMediaQuery(theme.breakpoints.down("md"));
|
|
14198
|
+
var _b = useState({
|
|
14199
|
+
breakpoint: 0,
|
|
14200
|
+
isNarrow: isMdScreen,
|
|
14201
|
+
}), dimensions = _b[0], setDimensions = _b[1];
|
|
14202
|
+
useEffect(function () {
|
|
14203
|
+
setDimensions(function (prev) { return (__assign(__assign({}, prev), { isNarrow: isMdScreen })); });
|
|
14204
|
+
}, [isMdScreen]);
|
|
14205
|
+
var checkScrollable = useCallback(function () {
|
|
14206
|
+
if (!footerRef.current)
|
|
14207
|
+
return;
|
|
14208
|
+
var clientWidth = footerRef.current.clientWidth;
|
|
14209
|
+
var scrollWidth = footerRef.current.scrollWidth;
|
|
14210
|
+
var needsScroll = scrollWidth > clientWidth;
|
|
14211
|
+
setDimensions(function (prev) {
|
|
14212
|
+
var newBreakpoint = needsScroll && !prev.isNarrow
|
|
14213
|
+
? Math.max(prev.breakpoint, clientWidth)
|
|
14214
|
+
: prev.breakpoint;
|
|
14215
|
+
return {
|
|
14216
|
+
breakpoint: newBreakpoint,
|
|
14217
|
+
isNarrow: clientWidth <= newBreakpoint,
|
|
14218
|
+
};
|
|
14219
|
+
});
|
|
14220
|
+
}, []);
|
|
14221
|
+
useEffect(function () {
|
|
14222
|
+
checkScrollable();
|
|
14223
|
+
var resizeObserver = new ResizeObserver(checkScrollable);
|
|
14224
|
+
if (footerRef.current) {
|
|
14225
|
+
resizeObserver.observe(footerRef.current);
|
|
14226
|
+
}
|
|
14227
|
+
return function () { return resizeObserver.disconnect(); };
|
|
14228
|
+
}, [checkScrollable]);
|
|
14229
|
+
var renderImages = useCallback(function () {
|
|
14230
|
+
if (!(images === null || images === void 0 ? void 0 : images.length))
|
|
14231
|
+
return null;
|
|
14232
|
+
if (!dimensions.isNarrow) {
|
|
14233
|
+
return images.map(function (_a) {
|
|
14234
|
+
var image = _a.image, url = _a.url;
|
|
14235
|
+
return (jsx(Link, { href: url, children: image }, url));
|
|
14236
|
+
});
|
|
14237
|
+
}
|
|
14238
|
+
return groupArray(images, 2).map(function (imageGroup, index) { return (jsx(StyledMobileImageRow, { children: imageGroup.map(function (_a) {
|
|
14239
|
+
var image = _a.image, url = _a.url;
|
|
14240
|
+
return (jsx(Link, { href: url, children: image }, url));
|
|
14241
|
+
}) }, index)); });
|
|
14242
|
+
}, [images, dimensions.isNarrow]);
|
|
14243
|
+
var renderLinks = useCallback(function () {
|
|
14244
|
+
if (!(navLinks === null || navLinks === void 0 ? void 0 : navLinks.length))
|
|
14245
|
+
return null;
|
|
14246
|
+
if (!dimensions.isNarrow) {
|
|
14247
|
+
return navLinks.map(function (link, index) { return (jsx(FooterLink, { link: link, showDivider: index < navLinks.length - 1, hasInvertedStyle: hasInvertedStyle }, link.label)); });
|
|
14248
|
+
}
|
|
14249
|
+
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)); });
|
|
14250
|
+
}, [navLinks, dimensions.isNarrow, hasInvertedStyle]);
|
|
14251
|
+
var logoNode = useMemo(function () {
|
|
14252
|
+
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 })] }));
|
|
14253
|
+
return logoUrl ? jsx(Link, { href: logoUrl, children: node }) : node;
|
|
14254
|
+
}, [
|
|
14255
|
+
logo,
|
|
14256
|
+
title,
|
|
14257
|
+
tag,
|
|
14258
|
+
tagColor,
|
|
14259
|
+
logoUrl,
|
|
14260
|
+
dimensions.isNarrow,
|
|
14261
|
+
hasInvertedStyle,
|
|
14262
|
+
]);
|
|
14263
|
+
var navItemsSection = useMemo(function () {
|
|
14264
|
+
if (!(navItems === null || navItems === void 0 ? void 0 : navItems.length))
|
|
14265
|
+
return null;
|
|
14266
|
+
return (jsx(StyledNavSection, { isNarrow: dimensions.isNarrow, children: navItems.map(function (item) { return (jsx(NavItem, { item: item, hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow }, item.label)); }) }));
|
|
14267
|
+
}, [navItems, hasInvertedStyle, dimensions.isNarrow]);
|
|
14268
|
+
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() })] })] })));
|
|
14269
|
+
}
|
|
14270
|
+
|
|
13706
14271
|
var doNotForwardProps$9 = [
|
|
13707
14272
|
"hasInvertedStyle",
|
|
13708
14273
|
"isNarrow",
|
|
@@ -13730,15 +14295,21 @@ var StyledToolbar = styled$2(Toolbar, {
|
|
|
13730
14295
|
var spaces = getSpaces(props);
|
|
13731
14296
|
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));
|
|
13732
14297
|
});
|
|
13733
|
-
var StyledShadowElement = styled$2
|
|
14298
|
+
var StyledShadowElement = styled$2("div", {
|
|
14299
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14300
|
+
})(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13734
14301
|
var shadows = getShadows(props);
|
|
13735
14302
|
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 ");
|
|
13736
14303
|
});
|
|
13737
|
-
var StyledShadowCoverElement = styled$2
|
|
14304
|
+
var StyledShadowCoverElement = styled$2("div", {
|
|
14305
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14306
|
+
})(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13738
14307
|
var colors = getSemanticColors(props);
|
|
13739
14308
|
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 ");
|
|
13740
14309
|
});
|
|
13741
|
-
var StyledHeaderButton = styled$2(Button
|
|
14310
|
+
var StyledHeaderButton = styled$2(Button, {
|
|
14311
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14312
|
+
})(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13742
14313
|
var _a, _b, _c, _d;
|
|
13743
14314
|
var sdsType = props.sdsType, hasInvertedStyle = props.hasInvertedStyle;
|
|
13744
14315
|
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";
|
|
@@ -13746,60 +14317,84 @@ var StyledHeaderButton = styled$2(Button)(templateObject_7$1 || (templateObject_
|
|
|
13746
14317
|
var secondaryButtonStyles = "\n box-shadow: inset 0 0 0 1px ".concat(mode === "light" ? "white" : (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.fillPrimary, ";\n color: ").concat(mode === "light" ? "white" : (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.fillPrimary, ";\n ");
|
|
13747
14318
|
return "\n ".concat(sdsType === "secondary" && hasInvertedStyle ? secondaryButtonStyles : "", "\n ");
|
|
13748
14319
|
});
|
|
14320
|
+
var invertedNarrowButtonStyles = function (props) {
|
|
14321
|
+
var _a, _b, _c, _d;
|
|
14322
|
+
var semanticColors = getSemanticColors(props);
|
|
14323
|
+
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);
|
|
14324
|
+
};
|
|
14325
|
+
var StyledNarrowIconButton = styled$2(Button, {
|
|
14326
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14327
|
+
})(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14328
|
+
var hasInvertedStyle = props.hasInvertedStyle;
|
|
14329
|
+
return css$2(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), hasInvertedStyle && invertedNarrowButtonStyles(props));
|
|
14330
|
+
});
|
|
14331
|
+
var invertedWideButtonStyles = function (props) {
|
|
14332
|
+
var _a, _b;
|
|
14333
|
+
var semanticColors = getSemanticColors(props);
|
|
14334
|
+
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);
|
|
14335
|
+
};
|
|
14336
|
+
var StyledWideIconButton = styled$2(Button, {
|
|
14337
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14338
|
+
})(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14339
|
+
var hasInvertedStyle = props.hasInvertedStyle;
|
|
14340
|
+
return css$2(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), hasInvertedStyle && invertedWideButtonStyles(props));
|
|
14341
|
+
});
|
|
13749
14342
|
var StyledLogoLinkWrapper = styled$2(Link, {
|
|
13750
14343
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
13751
|
-
})(
|
|
14344
|
+
})(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n text-decoration: none !important;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n text-decoration: none !important;\n\n ", "\n"])), function (props) {
|
|
13752
14345
|
var isNarrow = props.isNarrow;
|
|
13753
|
-
return css$2(
|
|
14346
|
+
return css$2(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n width: ", ";\n "], ["\n width: ", ";\n "])), isNarrow ? "100%" : "auto");
|
|
13754
14347
|
});
|
|
13755
|
-
var StyledLogoWrapper = styled$2.div(
|
|
14348
|
+
var StyledLogoWrapper = styled$2.div(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
|
|
13756
14349
|
var NarrowTitleContainer = function (props) {
|
|
13757
14350
|
var spaces = getSpaces(props);
|
|
13758
|
-
return css$2(
|
|
14351
|
+
return css$2(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n p {\n margin-left: ", "px;\n }\n "], ["\n p {\n margin-left: ", "px;\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xs);
|
|
13759
14352
|
};
|
|
13760
14353
|
var StyledTitleContainer = styled$2("div", {
|
|
13761
14354
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
13762
|
-
})(
|
|
14355
|
+
})(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n ", "\n ", "\n\n display: flex;\n align-items: center;\n\n ", "\n"], ["\n ", "\n ", "\n\n display: flex;\n align-items: center;\n\n ", "\n"])), fontHeader("l"), fontHeader("l", true), function (props) {
|
|
13763
14356
|
var isNarrow = props.isNarrow;
|
|
13764
14357
|
var colors = getSemanticColors(props);
|
|
13765
14358
|
var spaces = getSpaces(props);
|
|
13766
|
-
return css$2(
|
|
14359
|
+
return css$2(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n color: ", ";\n margin-right: ", "px;\n width: 100%;\n\n p {\n margin: 0 ", "px 0 ", "px;\n }\n\n ", "\n "], ["\n color: ", ";\n margin-right: ", "px;\n width: 100%;\n\n p {\n margin: 0 ", "px 0 ", "px;\n }\n\n ", "\n "])), props.hasInvertedStyle
|
|
13767
14360
|
? colors === null || colors === void 0 ? void 0 : colors.base.textPrimaryInverse
|
|
13768
14361
|
: colors === null || colors === void 0 ? void 0 : colors.base.textPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.l, isNarrow && NarrowTitleContainer(props));
|
|
13769
14362
|
});
|
|
13770
|
-
var StyledTag = styled$2(Tag)(
|
|
14363
|
+
var StyledTag = styled$2(Tag)(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n margin: 1px 0 0 0;\n .MuiChip-label {\n ", "\n ", "\n }\n\n &:hover {\n text-decoration: none;\n }\n"], ["\n margin: 1px 0 0 0;\n .MuiChip-label {\n ", "\n ", "\n }\n\n &:hover {\n text-decoration: none;\n }\n"])), fontBody("xxxs", "regular"), fontBody("xxxs", "regular", /* isNarrow */ true));
|
|
13771
14364
|
var StyledPrimaryNavContainer = styled$2("div", {
|
|
13772
14365
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
13773
|
-
})(
|
|
14366
|
+
})(templateObject_22 || (templateObject_22 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-grow: 1;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n flex-grow: 1;\n\n ", "\n"])), function (props) {
|
|
13774
14367
|
var showSearch = props.showSearch, primaryNavPosition = props.primaryNavPosition, isNarrow = props.isNarrow;
|
|
13775
14368
|
var spaces = getSpaces(props);
|
|
13776
14369
|
var primaryNavPositionWithSearch = primaryNavPosition === "left" ? "flex-start" : "space-between";
|
|
13777
14370
|
var primaryNavPositionWithoutSearch = primaryNavPosition === "left" ? "flex-start" : "flex-end";
|
|
13778
|
-
return css$2(
|
|
14371
|
+
return css$2(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n flex-direction: ", ";\n gap: ", "px;\n margin-right: ", "px;\n flex: 1;\n justify-content: ", ";\n "], ["\n flex-direction: ", ";\n gap: ", "px;\n margin-right: ", "px;\n flex: 1;\n justify-content: ", ";\n "])), isNarrow ? "column" : "row", spaces === null || spaces === void 0 ? void 0 : spaces.xxl, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, showSearch
|
|
13779
14372
|
? primaryNavPositionWithSearch
|
|
13780
14373
|
: primaryNavPositionWithoutSearch);
|
|
13781
14374
|
});
|
|
13782
14375
|
var StyledSearch = styled$2(InputSearch, {
|
|
13783
14376
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
13784
|
-
})(
|
|
14377
|
+
})(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n margin: 0;\n width: 100%;\n\n .MuiInputBase-input {\n ", "\n ", "\n }\n\n ", "\n"], ["\n margin: 0;\n width: 100%;\n\n .MuiInputBase-input {\n ", "\n ", "\n }\n\n ", "\n"])), fontBody("xs", "regular"), fontBody("m", "regular", /* isNarrow */ true), function (props) {
|
|
13785
14378
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
13786
14379
|
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow;
|
|
13787
14380
|
var spaces = getSpaces(props);
|
|
13788
14381
|
var semanticColors = getSemanticColors(props);
|
|
13789
|
-
return css$2(
|
|
13790
|
-
?
|
|
14382
|
+
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
|
|
14383
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14384
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, hasInvertedStyle
|
|
14385
|
+
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryInverse
|
|
13791
14386
|
: "", hasInvertedStyle
|
|
13792
14387
|
? (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentSecondaryInverse
|
|
13793
14388
|
: "", hasInvertedStyle
|
|
13794
|
-
? (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.
|
|
14389
|
+
? (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderPrimaryHoverInverse
|
|
13795
14390
|
: "", hasInvertedStyle
|
|
13796
14391
|
? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentPrimaryInverse
|
|
13797
14392
|
: "", hasInvertedStyle
|
|
13798
|
-
? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.
|
|
14393
|
+
? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.borderPrimaryPressedInverse
|
|
13799
14394
|
: "", hasInvertedStyle
|
|
13800
14395
|
? (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentPrimaryInverse
|
|
13801
14396
|
: "", hasInvertedStyle
|
|
13802
|
-
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.
|
|
14397
|
+
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.borderPrimaryDisabledInverse
|
|
13803
14398
|
: "", hasInvertedStyle
|
|
13804
14399
|
? (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentDisabledInverse
|
|
13805
14400
|
: "");
|
|
@@ -13811,23 +14406,23 @@ var NarrowButtonStyles = function (props) {
|
|
|
13811
14406
|
var backgroundColor = props.hasInvertedStyle
|
|
13812
14407
|
? colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimaryInverse
|
|
13813
14408
|
: colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimary;
|
|
13814
|
-
return css$2(
|
|
14409
|
+
return css$2(templateObject_25 || (templateObject_25 = __makeTemplateObject(["\n background: ", ";\n gap: ", "px;\n flex-direction: column;\n margin-left: 0;\n margin-top: ", "px;\n padding: ", "px;\n position: sticky;\n bottom: 0;\n\n &::before {\n content: \"\";\n position: absolute;\n height: ", "px;\n width: 100%;\n background: linear-gradient(\n to top,\n ", " 0%,\n ", "00 100%\n );\n top: -", "px;\n }\n\n .MuiButton-icon .MuiSvgIcon-root {\n width: ", "px;\n height: ", "px;\n }\n "], ["\n background: ", ";\n gap: ", "px;\n flex-direction: column;\n margin-left: 0;\n margin-top: ", "px;\n padding: ", "px;\n position: sticky;\n bottom: 0;\n\n &::before {\n content: \"\";\n position: absolute;\n height: ", "px;\n width: 100%;\n background: linear-gradient(\n to top,\n ", " 0%,\n ", "00 100%\n );\n top: -", "px;\n }\n\n .MuiButton-icon .MuiSvgIcon-root {\n width: ", "px;\n height: ", "px;\n }\n "])), backgroundColor, spaces === null || spaces === void 0 ? void 0 : spaces.l, 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, backgroundColor, backgroundColor, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, sizes === null || sizes === void 0 ? void 0 : sizes.l.width, sizes === null || sizes === void 0 ? void 0 : sizes.l.height);
|
|
13815
14410
|
};
|
|
13816
14411
|
var StyledButtonSection = styled$2("section", {
|
|
13817
14412
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
13818
|
-
})(
|
|
14413
|
+
})(templateObject_27 || (templateObject_27 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n\n .MuiButtonBase-root {\n ", "\n }\n\n [data-style=\"minimal\"] {\n ", "\n }\n\n ", "\n"], ["\n display: flex;\n align-items: center;\n\n .MuiButtonBase-root {\n ", "\n }\n\n [data-style=\"minimal\"] {\n ", "\n }\n\n ", "\n"])), fontBody("l", "semibold", /* isNarrow */ true), fontBody("m", "semibold", /* isNarrow */ true), function (props) {
|
|
13819
14414
|
var isNarrow = props.isNarrow;
|
|
13820
14415
|
var spaces = getSpaces(props);
|
|
13821
|
-
return css$2(
|
|
14416
|
+
return css$2(templateObject_26 || (templateObject_26 = __makeTemplateObject(["\n gap: ", "px;\n margin-left: ", "px;\n\n ", "\n "], ["\n gap: ", "px;\n margin-left: ", "px;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m, spaces === null || spaces === void 0 ? void 0 : spaces.xl, isNarrow && NarrowButtonStyles(props));
|
|
13822
14417
|
});
|
|
13823
14418
|
var StyledDrawer$1 = styled$2(Drawer, {
|
|
13824
14419
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
13825
|
-
})(
|
|
14420
|
+
})(templateObject_28 || (templateObject_28 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
13826
14421
|
var colors = getSemanticColors(props);
|
|
13827
14422
|
return "\n .MuiDrawer-paper {\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 width: 100%;\n display: flex;\n flex-direction: column;\n min-height: 100vh;\n justify-content: space-between;\n }\n ");
|
|
13828
14423
|
});
|
|
13829
|
-
var StyledNarrowButton = styled$2(Button)(
|
|
13830
|
-
var templateObject_1$j, templateObject_2$c, templateObject_3$7, templateObject_4$5, templateObject_5$4, templateObject_6$3, templateObject_7$1, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23;
|
|
14424
|
+
var StyledNarrowButton = styled$2(Button)(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n & {\n margin: 0;\n }\n"], ["\n & {\n margin: 0;\n }\n"])));
|
|
14425
|
+
var templateObject_1$j, templateObject_2$c, templateObject_3$7, templateObject_4$5, templateObject_5$4, templateObject_6$3, templateObject_7$1, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17, templateObject_18, templateObject_19, templateObject_20, templateObject_21, templateObject_22, templateObject_23, templateObject_24, templateObject_25, templateObject_26, templateObject_27, templateObject_28, templateObject_29;
|
|
13831
14426
|
|
|
13832
14427
|
var doNotForwardProps$8 = ["active", "hasInvertedStyle", "isNarrow"];
|
|
13833
14428
|
var NarrowPrimaryNavItem = function (props) {
|
|
@@ -13843,7 +14438,7 @@ var NarrowPrimaryNavItem = function (props) {
|
|
|
13843
14438
|
: (_b = colors === null || colors === void 0 ? void 0 : colors.accent) === null || _b === void 0 ? void 0 : _b.border;
|
|
13844
14439
|
var inactiveBorderColor = hasInvertedStyle
|
|
13845
14440
|
? (_c = colors === null || colors === void 0 ? void 0 : colors.neutral) === null || _c === void 0 ? void 0 : _c.fillPrimary
|
|
13846
|
-
: colors === null || colors === void 0 ? void 0 : colors.base.
|
|
14441
|
+
: colors === null || colors === void 0 ? void 0 : colors.base.borderPrimary;
|
|
13847
14442
|
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
|
|
13848
14443
|
? colors === null || colors === void 0 ? void 0 : colors.base.backgroundSecondaryInverse
|
|
13849
14444
|
: colors === null || colors === void 0 ? void 0 : colors.base.backgroundSecondary, spaces === null || spaces === void 0 ? void 0 : spaces.xs, active ? activeBorderColor : inactiveBorderColor);
|
|
@@ -13868,7 +14463,7 @@ var WideStyledLabel = function (props) {
|
|
|
13868
14463
|
: (_b = colors === null || colors === void 0 ? void 0 : colors.accent) === null || _b === void 0 ? void 0 : _b.border;
|
|
13869
14464
|
var inactiveBorderColor = hasInvertedStyle
|
|
13870
14465
|
? colors === null || colors === void 0 ? void 0 : colors.base.borderOnFill
|
|
13871
|
-
: colors === null || colors === void 0 ? void 0 : colors.base.
|
|
14466
|
+
: colors === null || colors === void 0 ? void 0 : colors.base.borderPrimary;
|
|
13872
14467
|
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);
|
|
13873
14468
|
};
|
|
13874
14469
|
var StyledLabel = styled$2("span", {
|
|
@@ -14015,18 +14610,16 @@ function NavigationHeaderSecondaryNav(_a) {
|
|
|
14015
14610
|
}
|
|
14016
14611
|
|
|
14017
14612
|
var NavigationHeader = forwardRef(function (props, ref) {
|
|
14018
|
-
var _a;
|
|
14019
|
-
var activePrimaryNavKey = props.activePrimaryNavKey, buttons = props.buttons, hasInvertedStyle = props.hasInvertedStyle, logo = props.logo, logoUrl = props.logoUrl, 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", "primaryNavItems", "primaryNavPosition", "searchProps", "secondaryNavItems", "setActivePrimaryNavKey", "showSearch", "tag", "tagColor", "title"]);
|
|
14613
|
+
var activePrimaryNavKey = props.activePrimaryNavKey, buttons = props.buttons, hasInvertedStyle = props.hasInvertedStyle, logo = props.logo, logoUrl = props.logoUrl, primaryNavItems = props.primaryNavItems, _a = props.primaryNavPosition, primaryNavPosition = _a === void 0 ? "left" : _a, searchProps = props.searchProps, secondaryNavItems = props.secondaryNavItems, setActivePrimaryNavKey = props.setActivePrimaryNavKey, _b = props.showSearch, showSearch = _b === void 0 ? true : _b, tag = props.tag, tagColor = props.tagColor, title = props.title, rest = __rest(props, ["activePrimaryNavKey", "buttons", "hasInvertedStyle", "logo", "logoUrl", "primaryNavItems", "primaryNavPosition", "searchProps", "secondaryNavItems", "setActivePrimaryNavKey", "showSearch", "tag", "tagColor", "title"]);
|
|
14020
14614
|
var navRef = useRef(null);
|
|
14021
14615
|
var theme = useTheme();
|
|
14022
|
-
var mode = ((_a = theme === null || theme === void 0 ? void 0 : theme.palette) === null || _a === void 0 ? void 0 : _a.mode) || "light";
|
|
14023
14616
|
var isMdScreen = useMediaQuery(theme.breakpoints.down("md"));
|
|
14024
14617
|
useEffect(function () {
|
|
14025
14618
|
setIsNarrow(isMdScreen);
|
|
14026
14619
|
}, [isMdScreen]);
|
|
14027
|
-
var
|
|
14028
|
-
var
|
|
14029
|
-
var
|
|
14620
|
+
var _c = useState(true), drawerOpen = _c[0], setDrawerOpen = _c[1];
|
|
14621
|
+
var _d = useState(isMdScreen), isNarrow = _d[0], setIsNarrow = _d[1];
|
|
14622
|
+
var _e = useState(0), breakpoint = _e[0], setBreakpoint = _e[1];
|
|
14030
14623
|
var checkScrollable = useCallback(function () {
|
|
14031
14624
|
if (!navRef.current)
|
|
14032
14625
|
return;
|
|
@@ -14047,7 +14640,7 @@ var NavigationHeader = forwardRef(function (props, ref) {
|
|
|
14047
14640
|
return function () { return resizeObserver.disconnect(); };
|
|
14048
14641
|
}, [breakpoint, checkScrollable, isMdScreen, isNarrow]);
|
|
14049
14642
|
var renderSearch = function () {
|
|
14050
|
-
return (showSearch && (jsx(StyledSearch, __assign({ id: "nav-bar-search", label: "Search", placeholder: "Search", sdsStyle: "rounded",
|
|
14643
|
+
return (showSearch && (jsx(StyledSearch, __assign({ id: "nav-bar-search", label: "Search", placeholder: "Search", sdsStyle: "rounded", hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow }, searchProps))));
|
|
14051
14644
|
};
|
|
14052
14645
|
var renderLogoNode = function () {
|
|
14053
14646
|
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 })] }));
|
|
@@ -14083,8 +14676,8 @@ var NavigationHeader = forwardRef(function (props, ref) {
|
|
|
14083
14676
|
}
|
|
14084
14677
|
return renderDefaultButton(buttonProps, key, fullWidth);
|
|
14085
14678
|
};
|
|
14086
|
-
var renderNarrowIconButton = function (buttonProps, key, fullWidth) { return (jsx(
|
|
14087
|
-
var renderWideIconButton = function (buttonProps, key) { return (jsx(
|
|
14679
|
+
var renderNarrowIconButton = function (buttonProps, key, fullWidth) { return (jsx(StyledNarrowIconButton, { sx: fullWidth, sdsStyle: "minimal", sdsType: "secondary", isAllCaps: false, startIcon: jsx(Icon, { sdsSize: "s", sdsIcon: "Person" }), hasInvertedStyle: hasInvertedStyle, children: buttonProps.children }, key)); };
|
|
14680
|
+
var renderWideIconButton = function (buttonProps, key) { return (jsx(StyledWideIconButton, { sdsIconProps: { sdsSize: "l" }, sdsStyle: "icon", sdsType: "secondary", icon: buttonProps.icon, "aria-label": String(buttonProps.children), hasInvertedStyle: hasInvertedStyle }, key)); };
|
|
14088
14681
|
var renderDefaultButton = function (buttonProps, key, fullWidth) { return (jsx(StyledHeaderButton, __assign({ sx: fullWidth }, buttonProps, { sdsStyle: "rounded", hasInvertedStyle: hasInvertedStyle }), key)); };
|
|
14089
14682
|
var renderHeaderContent = function () {
|
|
14090
14683
|
var logoNode = renderLogoNode();
|
|
@@ -14092,11 +14685,7 @@ var NavigationHeader = forwardRef(function (props, ref) {
|
|
|
14092
14685
|
var primaryNav = renderPrimaryNav();
|
|
14093
14686
|
var secondaryNav = renderSecondaryNav();
|
|
14094
14687
|
var buttonsNode = renderButtonsNode();
|
|
14095
|
-
return (jsxs(StyledToolbar, { hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: [logoNode, !isNarrow && (jsxs(Fragment, { children: [jsx(StyledPrimaryNavContainer, { primaryNavPosition: primaryNavPosition, showSearch: showSearch, isNarrow: isNarrow, children: primaryNavPosition === "left" ? (jsxs(Fragment, { children: [primaryNav, search] })) : (jsxs(Fragment, { children: [search, primaryNav] })) }), secondaryNav, buttonsNode] })), isNarrow && (jsx(StyledNarrowButton, { sdsType: "secondary", sdsStyle: "icon", icon: drawerOpen ? "XMark" : "LinesHorizontal3", onClick: function () { return setDrawerOpen(function (prev) { return !prev; }); }
|
|
14096
|
-
? mode === "light"
|
|
14097
|
-
? "dark"
|
|
14098
|
-
: "light"
|
|
14099
|
-
: "auto" }))] }));
|
|
14688
|
+
return (jsxs(StyledToolbar, { hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: [logoNode, !isNarrow && (jsxs(Fragment, { children: [jsx(StyledPrimaryNavContainer, { primaryNavPosition: primaryNavPosition, showSearch: showSearch, isNarrow: isNarrow, children: primaryNavPosition === "left" ? (jsxs(Fragment, { children: [primaryNav, search] })) : (jsxs(Fragment, { children: [search, primaryNav] })) }), secondaryNav, buttonsNode] })), isNarrow && (jsx(StyledNarrowButton, { sdsType: "secondary", sdsStyle: "icon", icon: drawerOpen ? "XMark" : "LinesHorizontal3", onClick: function () { return setDrawerOpen(function (prev) { return !prev; }); } }))] }));
|
|
14100
14689
|
};
|
|
14101
14690
|
var headerContent = renderHeaderContent();
|
|
14102
14691
|
var search = renderSearch();
|
|
@@ -14172,7 +14761,7 @@ var StyledTab$1 = styled$2(Tab$1, {
|
|
|
14172
14761
|
var _a, _b, _c;
|
|
14173
14762
|
var spaces = getSpaces(props);
|
|
14174
14763
|
var semanticColors = getSemanticColors(props);
|
|
14175
|
-
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.
|
|
14764
|
+
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 ");
|
|
14176
14765
|
});
|
|
14177
14766
|
var templateObject_1$f, templateObject_2$8;
|
|
14178
14767
|
|
|
@@ -14676,7 +15265,7 @@ var StyledSegmentedControl = styled$2(ToggleButtonGroup, {
|
|
|
14676
15265
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
14677
15266
|
var spaces = getSpaces(props);
|
|
14678
15267
|
var semanticColors = getSemanticColors(props);
|
|
14679
|
-
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.
|
|
15268
|
+
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 ");
|
|
14680
15269
|
});
|
|
14681
15270
|
var StyledToggleButton = styled$2(ToggleButton, {
|
|
14682
15271
|
shouldForwardProp: function (prop) { return !doNotForwardProps$1.includes(prop); },
|
|
@@ -14765,7 +15354,7 @@ var TableRow = forwardRef(function (props, ref) {
|
|
|
14765
15354
|
var StyledTableHeader = styled$2("thead")(templateObject_1$5 || (templateObject_1$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14766
15355
|
var _a;
|
|
14767
15356
|
var semanticColors = getSemanticColors(props);
|
|
14768
|
-
return "\n border-bottom: solid 2px ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.
|
|
15357
|
+
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 ");
|
|
14769
15358
|
});
|
|
14770
15359
|
var templateObject_1$5;
|
|
14771
15360
|
|
|
@@ -14840,7 +15429,7 @@ var StyledTab = styled$2(Tab$1, {
|
|
|
14840
15429
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
14841
15430
|
var spaces = getSpaces(props);
|
|
14842
15431
|
var semanticColors = getSemanticColors(props);
|
|
14843
|
-
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.
|
|
15432
|
+
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 ");
|
|
14844
15433
|
});
|
|
14845
15434
|
function tabFontMixin(props) {
|
|
14846
15435
|
var sdsSize = props.sdsSize;
|
|
@@ -14973,4 +15562,4 @@ var TooltipTableContent = function (props) {
|
|
|
14973
15562
|
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)))); })] })));
|
|
14974
15563
|
};
|
|
14975
15564
|
|
|
14976
|
-
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 };
|
|
15565
|
+
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 };
|