@czi-sds/components 22.3.1 → 22.3.3
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 +34 -12
- package/dist/index.cjs.js +446 -286
- package/dist/index.esm.d.ts +34 -12
- package/dist/index.esm.js +447 -287
- package/dist/tailwind.json +51 -45
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/variables.css +51 -45
- package/dist/variables.scss +51 -45
- package/package.json +2 -2
package/dist/index.esm.js
CHANGED
|
@@ -3,7 +3,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
import React__default, { forwardRef, useEffect, useRef, useState, useCallback, createElement, useMemo, createContext, memo, Fragment as Fragment$1, useContext } from 'react';
|
|
5
5
|
import { css, ThemeContext as ThemeContext$1 } from '@emotion/react';
|
|
6
|
-
import { createTheme as createTheme$2, AccordionDetails as AccordionDetails$1, AccordionSummary, accordionSummaryClasses, SvgIcon, Accordion as Accordion$1, accordionClasses, accordionDetailsClasses, Alert as Alert$2, Button as Button$1, buttonClasses, IconButton, TextField, outlinedInputClasses, inputBaseClasses, buttonBaseClasses, inputAdornmentClasses, InputAdornment, MenuItem as MenuItem$1, menuItemClasses, Autocomplete as Autocomplete$1, autocompleteClasses, Paper, useTheme as useTheme$4, Popper, ClickAwayListener, alertClasses, alertTitleClasses, AlertTitle, Grow, Tooltip as Tooltip$1, Chip as Chip$1, darken as darken$1, Card, CardContent, styled as styled$3, CardActions, css as css$2, CardMedia, Dialog as Dialog$1, DialogActions as DialogActions$1, dialogActionsClasses, DialogContent, DialogTitle as DialogTitle$1, Typography, Checkbox, checkboxClasses, FormControlLabel, Radio, radioClasses, Slider, sliderClasses, Switch, switchClasses, Link as Link$1, List as List$1, ListItem as ListItem$1, ListSubheader as ListSubheader$1, Menu as Menu$1, menuClasses, Divider, useMediaQuery, AppBar, Toolbar, Drawer, Tabs as Tabs$1, tabsClasses, Tab as Tab$1, Slide, Box as Box$1, drawerClasses, ToggleButtonGroup, toggleButtonClasses, ToggleButton, TableCell, TableContainer, Table as Table$1, TableBody, TableRow as TableRow$1 } from '@mui/material';
|
|
6
|
+
import { createTheme as createTheme$2, AccordionDetails as AccordionDetails$1, AccordionSummary, accordionSummaryClasses, SvgIcon, Accordion as Accordion$1, accordionClasses, accordionDetailsClasses, Alert as Alert$2, Button as Button$1, buttonClasses, IconButton, TextField, outlinedInputClasses, inputBaseClasses, buttonBaseClasses, inputAdornmentClasses, InputAdornment, MenuItem as MenuItem$1, menuItemClasses, Autocomplete as Autocomplete$1, autocompleteClasses, Paper, useTheme as useTheme$4, Popper, ClickAwayListener, alertClasses, alertTitleClasses, AlertTitle, Grow, Tooltip as Tooltip$1, Chip as Chip$1, darken as darken$1, Card, CardContent, styled as styled$3, CardActions, css as css$2, CardMedia, Dialog as Dialog$1, DialogActions as DialogActions$1, dialogActionsClasses, DialogContent, DialogTitle as DialogTitle$1, Typography, Checkbox, checkboxClasses, FormControlLabel, Radio, radioClasses, Slider, sliderClasses, Switch, switchClasses, Link as Link$1, List as List$1, ListItem as ListItem$1, ListSubheader as ListSubheader$1, Menu as Menu$1, menuClasses, Divider, useMediaQuery, AppBar, Toolbar, Drawer, useScrollTrigger, 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
7
|
export { CardMedia as ContentCardMedia } from '@mui/material';
|
|
8
8
|
import styled$2 from '@emotion/styled';
|
|
9
9
|
import { Check, Remove, Clear } from '@mui/icons-material';
|
|
@@ -1005,6 +1005,8 @@ var SDSPaletteLight = function (appTheme) {
|
|
|
1005
1005
|
textPrimaryInverse: appTheme.colors.gray[50],
|
|
1006
1006
|
textSecondary: appTheme.colors.gray[600],
|
|
1007
1007
|
textSecondaryInverse: appTheme.colors.gray[300],
|
|
1008
|
+
textTertiary: appTheme.colors.gray[400],
|
|
1009
|
+
textTertiaryInverse: appTheme.colors.gray[500],
|
|
1008
1010
|
},
|
|
1009
1011
|
beta: {
|
|
1010
1012
|
border: appTheme.colors.purple[600],
|
|
@@ -1141,6 +1143,8 @@ var SDSPaletteDark = function (appTheme) {
|
|
|
1141
1143
|
textPrimaryInverse: appTheme.colors.gray[50],
|
|
1142
1144
|
textSecondary: appTheme.colors.gray[600],
|
|
1143
1145
|
textSecondaryInverse: appTheme.colors.gray[300],
|
|
1146
|
+
textTertiary: appTheme.colors.gray[400],
|
|
1147
|
+
textTertiaryInverse: appTheme.colors.gray[500],
|
|
1144
1148
|
},
|
|
1145
1149
|
beta: {
|
|
1146
1150
|
border: appTheme.colors.purple[600],
|
|
@@ -1549,7 +1553,7 @@ var fontBody = function (fontSize, fontWeight, isNarrow) {
|
|
|
1549
1553
|
return null;
|
|
1550
1554
|
var body = typography.wideStyles.body, narrowBody = typography.narrowStyles.body, bodyFontFamily = typography.fontFamily.body;
|
|
1551
1555
|
if (isNarrow) {
|
|
1552
|
-
return css(templateObject_1$
|
|
1556
|
+
return css(templateObject_1$1a || (templateObject_1$1a = __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));
|
|
1553
1557
|
}
|
|
1554
1558
|
return themeToCss(body[fontWeight][fontSize], bodyFontFamily);
|
|
1555
1559
|
};
|
|
@@ -1574,7 +1578,7 @@ var fontCaps = function (fontSize, isNarrow) {
|
|
|
1574
1578
|
if (!typography)
|
|
1575
1579
|
return null;
|
|
1576
1580
|
var caps = typography.wideStyles.caps, narrowCaps = typography.narrowStyles.caps, capsFontFamily = typography.fontFamily.caps;
|
|
1577
|
-
return css(templateObject_3$
|
|
1581
|
+
return css(templateObject_3$D || (templateObject_3$D = __makeTemplateObject(["\n text-transform: uppercase;\n\n ", "\n "], ["\n text-transform: uppercase;\n\n ", "\n "])), isNarrow
|
|
1578
1582
|
? 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));
|
|
1579
1583
|
};
|
|
1580
1584
|
};
|
|
@@ -1590,7 +1594,7 @@ var fontHeader = function (fontSize, isNarrow) {
|
|
|
1590
1594
|
return null;
|
|
1591
1595
|
var header = typography.wideStyles.header, narrowHeader = typography.narrowStyles.header, headerFontFamily = typography.fontFamily.header;
|
|
1592
1596
|
if (isNarrow) {
|
|
1593
|
-
return css(templateObject_4$
|
|
1597
|
+
return css(templateObject_4$w || (templateObject_4$w = __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));
|
|
1594
1598
|
}
|
|
1595
1599
|
return themeToCss(header.semibold[fontSize], headerFontFamily);
|
|
1596
1600
|
};
|
|
@@ -1643,13 +1647,13 @@ function themeToCss(fontTheme, fontFamily) {
|
|
|
1643
1647
|
if (fontFamily === void 0) { fontFamily = "inherit"; }
|
|
1644
1648
|
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);
|
|
1645
1649
|
}
|
|
1646
|
-
var templateObject_1$
|
|
1650
|
+
var templateObject_1$1a, templateObject_2$N, templateObject_3$D, templateObject_4$w, templateObject_5$p, templateObject_6$l, templateObject_7$g, templateObject_8$d;
|
|
1647
1651
|
|
|
1648
1652
|
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) {
|
|
1649
1653
|
var spaces = getSpaces(props);
|
|
1650
|
-
return css(templateObject_1$
|
|
1654
|
+
return css(templateObject_1$19 || (templateObject_1$19 = __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);
|
|
1651
1655
|
});
|
|
1652
|
-
var templateObject_1$
|
|
1656
|
+
var templateObject_1$19, templateObject_2$M;
|
|
1653
1657
|
|
|
1654
1658
|
var AccordionDetails = function (props) {
|
|
1655
1659
|
var children = props.children;
|
|
@@ -1660,14 +1664,14 @@ var StyledAccordionHeader = styled$2(AccordionSummary)(templateObject_2$L || (te
|
|
|
1660
1664
|
var _a, _b;
|
|
1661
1665
|
var spaces = getSpaces(props);
|
|
1662
1666
|
var semanticColors = getSemanticColors(props);
|
|
1663
|
-
return css(templateObject_1$
|
|
1667
|
+
return css(templateObject_1$18 || (templateObject_1$18 = __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);
|
|
1664
1668
|
});
|
|
1665
|
-
var StyledSubtitle = styled$2("p")(templateObject_4$
|
|
1669
|
+
var StyledSubtitle = styled$2("p")(templateObject_4$v || (templateObject_4$v = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
1666
1670
|
var _a;
|
|
1667
1671
|
var semanticColors = getSemanticColors(props);
|
|
1668
|
-
return css(templateObject_3$
|
|
1672
|
+
return css(templateObject_3$C || (templateObject_3$C = __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);
|
|
1669
1673
|
});
|
|
1670
|
-
var templateObject_1$
|
|
1674
|
+
var templateObject_1$18, templateObject_2$L, templateObject_3$C, templateObject_4$v;
|
|
1671
1675
|
|
|
1672
1676
|
var _path$26, _path2$C, _path3$6;
|
|
1673
1677
|
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); }
|
|
@@ -4389,10 +4393,10 @@ var StyledSvgIcon = styled$2(SvgIcon, {
|
|
|
4389
4393
|
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;
|
|
4390
4394
|
var iconSizes = getIconSizes(props);
|
|
4391
4395
|
var colors = getColors(props);
|
|
4392
|
-
return css(templateObject_1$
|
|
4396
|
+
return css(templateObject_1$17 || (templateObject_1$17 = __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);
|
|
4393
4397
|
});
|
|
4394
|
-
var StyledIcon$1 = styled$2("div")(templateObject_3$
|
|
4395
|
-
var templateObject_1$
|
|
4398
|
+
var StyledIcon$1 = styled$2("div")(templateObject_3$B || (templateObject_3$B = __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"])));
|
|
4399
|
+
var templateObject_1$17, templateObject_2$K, templateObject_3$B;
|
|
4396
4400
|
|
|
4397
4401
|
/**
|
|
4398
4402
|
* @see https://mui.com/material-ui/icons/#icons
|
|
@@ -4430,17 +4434,17 @@ var StyledAccordion$1 = styled$2(Accordion$1, {
|
|
|
4430
4434
|
var typography = getTypography(props);
|
|
4431
4435
|
var borders = getBorders(props);
|
|
4432
4436
|
var spaces = getSpaces(props);
|
|
4433
|
-
return css(templateObject_1$
|
|
4437
|
+
return css(templateObject_1$16 || (templateObject_1$16 = __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));
|
|
4434
4438
|
});
|
|
4435
4439
|
var leftPosition = function (props) {
|
|
4436
4440
|
var _a, _b, _c;
|
|
4437
4441
|
var spaces = getSpaces(props);
|
|
4438
4442
|
var iconSizes = getIconSizes(props);
|
|
4439
|
-
return css(templateObject_3$
|
|
4443
|
+
return css(templateObject_3$A || (templateObject_3$A = __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) +
|
|
4440
4444
|
((_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width) !== null && _b !== void 0 ? _b : 12) +
|
|
4441
4445
|
((_c = spaces === null || spaces === void 0 ? void 0 : spaces.s) !== null && _c !== void 0 ? _c : 8));
|
|
4442
4446
|
};
|
|
4443
|
-
var templateObject_1$
|
|
4447
|
+
var templateObject_1$16, templateObject_2$J, templateObject_3$A;
|
|
4444
4448
|
|
|
4445
4449
|
/**
|
|
4446
4450
|
* @see https://mui.com/material-ui/react-accordion/
|
|
@@ -4456,7 +4460,7 @@ var Accordion = React__default.forwardRef(function (props, ref) {
|
|
|
4456
4460
|
return (jsx(StyledAccordion$1, __assign({ square: true, useDivider: useDivider, togglePosition: togglePosition, expanded: expanded === id, onChange: handleChange(id), ref: ref }, props, { children: children })));
|
|
4457
4461
|
});
|
|
4458
4462
|
|
|
4459
|
-
var StyledAlert = styled$2(Alert$2)(templateObject_1$
|
|
4463
|
+
var StyledAlert = styled$2(Alert$2)(templateObject_1$15 || (templateObject_1$15 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4460
4464
|
var _a;
|
|
4461
4465
|
var colors = getColors(props);
|
|
4462
4466
|
var spaces = getSpaces(props);
|
|
@@ -4483,7 +4487,7 @@ function severityToColor(alertSeverity, colors) {
|
|
|
4483
4487
|
return colors === null || colors === void 0 ? void 0 : colors.green;
|
|
4484
4488
|
}
|
|
4485
4489
|
}
|
|
4486
|
-
var templateObject_1$
|
|
4490
|
+
var templateObject_1$15;
|
|
4487
4491
|
|
|
4488
4492
|
/**
|
|
4489
4493
|
* @see https://mui.com/material-ui/react-alert/
|
|
@@ -4648,11 +4652,10 @@ var ButtonStyles = function (props) {
|
|
|
4648
4652
|
? "inset 0 0 0 1px ".concat((_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _h === void 0 ? void 0 : _h.border)
|
|
4649
4653
|
: "none";
|
|
4650
4654
|
fontBody("xs", "semibold");
|
|
4651
|
-
return css(templateObject_1$
|
|
4655
|
+
return css(templateObject_1$14 || (templateObject_1$14 = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n box-shadow: ", ";\n padding: ", ";\n color: ", ";\n line-height: ", ";\n white-space: nowrap;\n min-width: fit-content;\n\n svg {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n background-color: ", ";\n box-shadow: ", ";\n border: none;\n\n svg {\n color: ", ";\n }\n }\n\n .", ", .", " {\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n max-width: ", "px;\n max-height: ", "px;\n }\n }\n\n .", " {\n margin-right: ", "px;\n margin-left: 0;\n }\n\n .", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n "], ["\n background-color: ", ";\n border: none;\n box-shadow: ", ";\n padding: ", ";\n color: ", ";\n line-height: ", ";\n white-space: nowrap;\n min-width: fit-content;\n\n svg {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n background-color: ", ";\n box-shadow: ", ";\n border: none;\n\n svg {\n color: ", ";\n }\n }\n\n .", ", .", " {\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n max-width: ", "px;\n max-height: ", "px;\n }\n }\n\n .", " {\n margin-right: ", "px;\n margin-left: 0;\n }\n\n .", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n "])), 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);
|
|
4652
4656
|
};
|
|
4653
|
-
var Rounded = function (
|
|
4654
|
-
|
|
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);
|
|
4657
|
+
var Rounded = function () {
|
|
4658
|
+
return css(templateObject_2$I || (templateObject_2$I = __makeTemplateObject(["\n border-radius: 100px;\n "], ["\n border-radius: 100px;\n "])));
|
|
4656
4659
|
};
|
|
4657
4660
|
var DestructiveButton = function (props) {
|
|
4658
4661
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
@@ -4671,13 +4674,13 @@ var DestructiveButton = function (props) {
|
|
|
4671
4674
|
var boxshadow = variant === "outlined"
|
|
4672
4675
|
? "inset 0 0 0 1px ".concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _f === void 0 ? void 0 : _f.border)
|
|
4673
4676
|
: "none";
|
|
4674
|
-
return css(templateObject_3$
|
|
4677
|
+
return css(templateObject_3$z || (templateObject_3$z = __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);
|
|
4675
4678
|
};
|
|
4676
4679
|
var StyledButton$3 = styled$2(Button$1, {
|
|
4677
4680
|
shouldForwardProp: function (prop) { return !doNotForwardProps$E.includes(prop); },
|
|
4678
4681
|
})(templateObject_5$o || (templateObject_5$o = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4679
4682
|
var sdsStyle = props.sdsStyle, sdsType = props.sdsType, isAllCaps = props.isAllCaps;
|
|
4680
|
-
return css(templateObject_4$
|
|
4683
|
+
return css(templateObject_4$u || (templateObject_4$u = __makeTemplateObject(["\n ", "\n\n ", "\n ", "\n ", "\n "], ["\n ", "\n\n ", "\n ", "\n ", "\n "])), isAllCaps ? fontCapsXxs(props) : fontBodySemiboldXs(props), ButtonStyles(props), sdsStyle === "rounded" && Rounded(), sdsType === "destructive" && DestructiveButton(props));
|
|
4681
4684
|
});
|
|
4682
4685
|
// Minimal Button Styles
|
|
4683
4686
|
var Minimal = function (props) {
|
|
@@ -4686,7 +4689,7 @@ var Minimal = function (props) {
|
|
|
4686
4689
|
var spaces = getSpaces(props);
|
|
4687
4690
|
var iconSizes = getIconSizes(props);
|
|
4688
4691
|
var semanticColors = getSemanticColors(props);
|
|
4689
|
-
return css(templateObject_6$k || (templateObject_6$k = __makeTemplateObject(["\n ", "\n ", "\n\n min-width:
|
|
4692
|
+
return css(templateObject_6$k || (templateObject_6$k = __makeTemplateObject(["\n ", "\n ", "\n\n min-width: fit-content;\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: fit-content;\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);
|
|
4690
4693
|
};
|
|
4691
4694
|
var PrimaryMinimalButton = function (props) {
|
|
4692
4695
|
var _a, _b;
|
|
@@ -4713,12 +4716,12 @@ var StyledButtonLegacy = styled$2(Button$1, {
|
|
|
4713
4716
|
var spaces = getSpaces(props);
|
|
4714
4717
|
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 ");
|
|
4715
4718
|
});
|
|
4716
|
-
var templateObject_1$
|
|
4719
|
+
var templateObject_1$14, templateObject_2$I, templateObject_3$z, templateObject_4$u, templateObject_5$o, templateObject_6$k, templateObject_7$f, templateObject_8$c, templateObject_9$7, templateObject_10$5, templateObject_11$4;
|
|
4717
4720
|
|
|
4718
4721
|
var isDisabled$1 = function (props) {
|
|
4719
4722
|
var _a, _b;
|
|
4720
4723
|
var semanticColors = getSemanticColors(props);
|
|
4721
|
-
return css(templateObject_1$
|
|
4724
|
+
return css(templateObject_1$13 || (templateObject_1$13 = __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);
|
|
4722
4725
|
};
|
|
4723
4726
|
var primary$2 = function (props) {
|
|
4724
4727
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
@@ -4728,12 +4731,12 @@ var primary$2 = function (props) {
|
|
|
4728
4731
|
var secondary$2 = function (props) {
|
|
4729
4732
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4730
4733
|
var semanticColors = getSemanticColors(props);
|
|
4731
|
-
return css(templateObject_3$
|
|
4734
|
+
return css(templateObject_3$y || (templateObject_3$y = __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);
|
|
4732
4735
|
};
|
|
4733
4736
|
var tertiary = function (props) {
|
|
4734
4737
|
var _a, _b, _c, _d, _e, _f;
|
|
4735
4738
|
var semanticColors = getSemanticColors(props);
|
|
4736
|
-
return css(templateObject_4$
|
|
4739
|
+
return css(templateObject_4$t || (templateObject_4$t = __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);
|
|
4737
4740
|
};
|
|
4738
4741
|
var small$1 = function (props) {
|
|
4739
4742
|
var sdsType = props.sdsType;
|
|
@@ -4774,7 +4777,7 @@ var StyledButtonIcon = styled$2(IconButton, {
|
|
|
4774
4777
|
var disabled = props.disabled, _a = props.sdsSize, sdsSize = _a === void 0 ? "medium" : _a, _b = props.sdsType, sdsType = _b === void 0 ? "primary" : _b;
|
|
4775
4778
|
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));
|
|
4776
4779
|
});
|
|
4777
|
-
var templateObject_1$
|
|
4780
|
+
var templateObject_1$13, templateObject_2$H, templateObject_3$y, templateObject_4$t, templateObject_5$n, templateObject_6$j, templateObject_7$e, templateObject_8$b, templateObject_9$6;
|
|
4778
4781
|
|
|
4779
4782
|
var ButtonIconSizeToSdsIconSize = {
|
|
4780
4783
|
large: "xl",
|
|
@@ -4883,7 +4886,7 @@ var rounded$3 = function (props) {
|
|
|
4883
4886
|
var _a;
|
|
4884
4887
|
var corners = getCorners(props);
|
|
4885
4888
|
var semanticColors = getSemanticColors(props);
|
|
4886
|
-
return css(templateObject_1$
|
|
4889
|
+
return css(templateObject_1$12 || (templateObject_1$12 = __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);
|
|
4887
4890
|
};
|
|
4888
4891
|
var applyIntentColor$2 = function (props, intent) {
|
|
4889
4892
|
var _a, _b, _c, _d;
|
|
@@ -4894,9 +4897,9 @@ var applyIntentColor$2 = function (props, intent) {
|
|
|
4894
4897
|
var disabledStyled$2 = function (props) {
|
|
4895
4898
|
var _a, _b, _c, _d, _e;
|
|
4896
4899
|
var semanticColors = getSemanticColors(props);
|
|
4897
|
-
return css(templateObject_3$
|
|
4900
|
+
return css(templateObject_3$x || (templateObject_3$x = __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);
|
|
4898
4901
|
};
|
|
4899
|
-
var StyledLabel$3 = styled$2("label")(templateObject_4$
|
|
4902
|
+
var StyledLabel$3 = styled$2("label")(templateObject_4$s || (templateObject_4$s = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyM$1, function (props) {
|
|
4900
4903
|
var spaces = getSpaces(props);
|
|
4901
4904
|
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 ");
|
|
4902
4905
|
});
|
|
@@ -4905,17 +4908,17 @@ var StyledSearchBase = styled$2(TextField, {
|
|
|
4905
4908
|
return !doNotForwardProps$C.includes(prop.toString());
|
|
4906
4909
|
},
|
|
4907
4910
|
})(templateObject_6$i || (templateObject_6$i = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4908
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
4911
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
4909
4912
|
var intent = props.intent, disabled = props.disabled, sdsStyle = props.sdsStyle;
|
|
4910
4913
|
var spaces = getSpaces(props);
|
|
4911
4914
|
var iconSizes = getIconSizes(props);
|
|
4912
4915
|
var semanticColors = getSemanticColors(props);
|
|
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, (
|
|
4916
|
+
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 &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n\n .MuiInputAdornment-positionEnd {\n position: absolute;\n right: ", "px;\n }\n\n .", " {\n border: 1px solid ", ";\n }\n\n &:hover .input-search-clear-icon,\n &:focus-within .input-search-clear-icon {\n svg {\n color: ", " !important;\n }\n\n &:hover {\n svg {\n color: ", " !important;\n }\n }\n\n &:active {\n svg {\n color: ", " !important;\n }\n }\n }\n }\n\n .", " {\n ", "\n padding: ", "px ", "px;\n height: unset;\n box-sizing: border-box;\n }\n\n .", ":hover {\n & .", ":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 &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n\n .MuiInputAdornment-positionEnd {\n position: absolute;\n right: ", "px;\n }\n\n .", " {\n border: 1px solid ", ";\n }\n\n &:hover .input-search-clear-icon,\n &:focus-within .input-search-clear-icon {\n svg {\n color: ", " !important;\n }\n\n &:hover {\n svg {\n color: ", " !important;\n }\n }\n\n &:active {\n svg {\n color: ", " !important;\n }\n }\n }\n }\n\n .", " {\n ", "\n padding: ", "px ", "px;\n height: unset;\n box-sizing: border-box;\n }\n\n .", ":hover {\n & .", ":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, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textTertiary, spaces === null || spaces === void 0 ? void 0 : spaces.m, outlinedInputClasses.notchedOutline, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.borderPrimary, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.ornamentSecondary, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentSecondaryHover, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _g === void 0 ? void 0 : _g.fillPressed, inputBaseClasses.inputSizeSmall, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.s, outlinedInputClasses.root, buttonBaseClasses.root, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentSecondaryHover, outlinedInputClasses.notchedOutline, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.borderPrimaryHover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _k === void 0 ? void 0 : _k.border, inputAdornmentClasses.root, buttonBaseClasses.root, (_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _l === void 0 ? void 0 : _l.ornamentFocus, outlinedInputClasses.root, (_m = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _m === void 0 ? void 0 : _m.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));
|
|
4914
4917
|
});
|
|
4915
4918
|
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$
|
|
4919
|
+
var templateObject_1$12, templateObject_2$G, templateObject_3$x, templateObject_4$s, templateObject_5$m, templateObject_6$i, templateObject_7$d;
|
|
4917
4920
|
|
|
4918
|
-
var StyledMenuItem$1 = styled$2(MenuItem$1)(templateObject_1$
|
|
4921
|
+
var StyledMenuItem$1 = styled$2(MenuItem$1)(templateObject_1$11 || (templateObject_1$11 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4919
4922
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
4920
4923
|
var selected = props.selected;
|
|
4921
4924
|
var fontWeights = getFontWeights(props);
|
|
@@ -4932,12 +4935,12 @@ var disabledStyles$2 = function (props) {
|
|
|
4932
4935
|
var semanticColors = getSemanticColors(props);
|
|
4933
4936
|
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 ");
|
|
4934
4937
|
};
|
|
4935
|
-
var TextWrapper = styled$2("span")(templateObject_3$
|
|
4938
|
+
var TextWrapper = styled$2("span")(templateObject_3$w || (templateObject_3$w = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
4936
4939
|
var _a;
|
|
4937
4940
|
var semanticColors = getSemanticColors(props);
|
|
4938
4941
|
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 ");
|
|
4939
4942
|
}, disabledStyles$2);
|
|
4940
|
-
var StyledMenuItemIcon = styled$2("span")(templateObject_4$
|
|
4943
|
+
var StyledMenuItemIcon = styled$2("span")(templateObject_4$r || (templateObject_4$r = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4941
4944
|
var _a;
|
|
4942
4945
|
var disabled = props.disabled;
|
|
4943
4946
|
var spaces = getSpaces(props);
|
|
@@ -4980,7 +4983,7 @@ var StyledMinus = styled$2(Remove, {
|
|
|
4980
4983
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.ornamentSelected;
|
|
4981
4984
|
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 ");
|
|
4982
4985
|
});
|
|
4983
|
-
var templateObject_1$
|
|
4986
|
+
var templateObject_1$11, templateObject_2$F, templateObject_3$w, templateObject_4$r, templateObject_5$l, templateObject_6$h, templateObject_7$c, templateObject_8$a;
|
|
4984
4987
|
|
|
4985
4988
|
/**
|
|
4986
4989
|
* @see https://mui.com/material-ui/react-menu/
|
|
@@ -5152,7 +5155,7 @@ var doNotForwardProps$B = [
|
|
|
5152
5155
|
];
|
|
5153
5156
|
var StyledAutocompleteBase = styled$2(Autocomplete$1, {
|
|
5154
5157
|
shouldForwardProp: function (prop) { return !doNotForwardProps$B.includes(prop); },
|
|
5155
|
-
})(templateObject_1
|
|
5158
|
+
})(templateObject_1$10 || (templateObject_1$10 = __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) {
|
|
5156
5159
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
5157
5160
|
var search = props.search;
|
|
5158
5161
|
var spaces = getSpaces(props);
|
|
@@ -5173,11 +5176,11 @@ var InputBaseWrapper$1 = styled$2("div", {
|
|
|
5173
5176
|
});
|
|
5174
5177
|
var StyledMenuInputSearch$1 = styled$2(InputSearch, {
|
|
5175
5178
|
shouldForwardProp: function (prop) { return !doNotForwardProps$B.includes(prop); },
|
|
5176
|
-
})(templateObject_3$
|
|
5179
|
+
})(templateObject_3$v || (templateObject_3$v = __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) {
|
|
5177
5180
|
var search = _a.search;
|
|
5178
5181
|
return (search ? "auto" : "transparent");
|
|
5179
5182
|
});
|
|
5180
|
-
var StyledPaper$3 = styled$2(Paper)(templateObject_4$
|
|
5183
|
+
var StyledPaper$3 = styled$2(Paper)(templateObject_4$q || (templateObject_4$q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5181
5184
|
var _a;
|
|
5182
5185
|
var spaces = getSpaces(props);
|
|
5183
5186
|
var corners = getCorners(props);
|
|
@@ -5192,7 +5195,7 @@ var StyledMenuItemDetails = styled$2("div")(templateObject_5$k || (templateObjec
|
|
|
5192
5195
|
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 ");
|
|
5193
5196
|
});
|
|
5194
5197
|
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
|
|
5198
|
+
var templateObject_1$10, templateObject_2$E, templateObject_3$v, templateObject_4$q, templateObject_5$k, templateObject_6$g;
|
|
5196
5199
|
|
|
5197
5200
|
var AutocompleteBase = function (props) {
|
|
5198
5201
|
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;
|
|
@@ -5353,7 +5356,7 @@ var AutocompleteBase = function (props) {
|
|
|
5353
5356
|
}
|
|
5354
5357
|
};
|
|
5355
5358
|
|
|
5356
|
-
var StyledColumn = styled$2("div")(templateObject_1
|
|
5359
|
+
var StyledColumn = styled$2("div")(templateObject_1$$ || (templateObject_1$$ = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5357
5360
|
var _a;
|
|
5358
5361
|
var _b = props.width, width = _b === void 0 ? 280 : _b;
|
|
5359
5362
|
var spaces = getSpaces(props);
|
|
@@ -5366,14 +5369,14 @@ var StyledColumnTitle = styled$2("p")(templateObject_2$D || (templateObject_2$D
|
|
|
5366
5369
|
var semanticColors = getSemanticColors(props);
|
|
5367
5370
|
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 ");
|
|
5368
5371
|
});
|
|
5369
|
-
var StyledColumnIcon = styled$2("span")(templateObject_3$
|
|
5372
|
+
var StyledColumnIcon = styled$2("span")(templateObject_3$u || (templateObject_3$u = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5370
5373
|
var _a, _b;
|
|
5371
5374
|
var spaces = getSpaces(props);
|
|
5372
5375
|
var iconSizes = getIconSizes(props);
|
|
5373
5376
|
var semanticColors = getSemanticColors(props);
|
|
5374
5377
|
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 ");
|
|
5375
5378
|
});
|
|
5376
|
-
var templateObject_1
|
|
5379
|
+
var templateObject_1$$, templateObject_2$D, templateObject_3$u;
|
|
5377
5380
|
|
|
5378
5381
|
var AutocompleteGroup = function (props) {
|
|
5379
5382
|
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"]);
|
|
@@ -5428,7 +5431,7 @@ var StyledPopper$2 = styled$2(Popper, {
|
|
|
5428
5431
|
shouldForwardProp: function (prop) {
|
|
5429
5432
|
return !doNotForwardProps$A.includes(prop) || prop === "anchorEl";
|
|
5430
5433
|
},
|
|
5431
|
-
})(templateObject_1$
|
|
5434
|
+
})(templateObject_1$_ || (templateObject_1$_ = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5432
5435
|
var _a;
|
|
5433
5436
|
var corners = getCorners(props);
|
|
5434
5437
|
var shadows = getShadows(props);
|
|
@@ -5445,17 +5448,17 @@ var StyledPaper$2 = styled$2(Paper, {
|
|
|
5445
5448
|
var semanticColors = getSemanticColors(props);
|
|
5446
5449
|
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 ");
|
|
5447
5450
|
});
|
|
5448
|
-
var StyledAutocompleteGroupWrapper = styled$2("div")(templateObject_3$
|
|
5451
|
+
var StyledAutocompleteGroupWrapper = styled$2("div")(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
5449
5452
|
var StyledAutocompleteInput = styled$2(InputSearch, {
|
|
5450
5453
|
shouldForwardProp: function (prop) { return !doNotForwardProps$A.includes(prop); },
|
|
5451
|
-
})(templateObject_4$
|
|
5454
|
+
})(templateObject_4$p || (templateObject_4$p = __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) {
|
|
5452
5455
|
var search = _a.search;
|
|
5453
5456
|
return !search && "height: 0; display: none; margin: 0 !important;";
|
|
5454
5457
|
}, function (_a) {
|
|
5455
5458
|
var search = _a.search;
|
|
5456
5459
|
return (search ? "auto" : "transparent");
|
|
5457
5460
|
});
|
|
5458
|
-
var templateObject_1$
|
|
5461
|
+
var templateObject_1$_, templateObject_2$C, templateObject_3$t, templateObject_4$p;
|
|
5459
5462
|
|
|
5460
5463
|
var AutocompleteMultiColumn = function (props) {
|
|
5461
5464
|
var _a;
|
|
@@ -5637,7 +5640,7 @@ var Autocomplete = function (props) {
|
|
|
5637
5640
|
}
|
|
5638
5641
|
};
|
|
5639
5642
|
|
|
5640
|
-
var Centered = styled$2("div")(templateObject_1$
|
|
5643
|
+
var Centered = styled$2("div")(templateObject_1$Z || (templateObject_1$Z = __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"])));
|
|
5641
5644
|
var doNotForwardPropsIconWrapper = ["bannerType"];
|
|
5642
5645
|
var IconWrapper$1 = styled$2("div", {
|
|
5643
5646
|
shouldForwardProp: function (prop) {
|
|
@@ -5656,7 +5659,7 @@ var StyledButton$2 = styled$2(Button, {
|
|
|
5656
5659
|
shouldForwardProp: function (prop) {
|
|
5657
5660
|
return !doNotForwardPropsButtonIcon.includes(prop);
|
|
5658
5661
|
},
|
|
5659
|
-
})(templateObject_3$
|
|
5662
|
+
})(templateObject_3$s || (templateObject_3$s = __makeTemplateObject(["\n flex: 0 0 auto;\n\n ", "\n"], ["\n flex: 0 0 auto;\n\n ", "\n"])), function (props) {
|
|
5660
5663
|
var _a, _b;
|
|
5661
5664
|
var bannerType = props.bannerType;
|
|
5662
5665
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5664,7 +5667,7 @@ var StyledButton$2 = styled$2(Button, {
|
|
|
5664
5667
|
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 ");
|
|
5665
5668
|
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 ");
|
|
5666
5669
|
});
|
|
5667
|
-
styled$2("div")(templateObject_4$
|
|
5670
|
+
styled$2("div")(templateObject_4$o || (templateObject_4$o = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), fontBodyS$1);
|
|
5668
5671
|
var primary$1 = function (props) {
|
|
5669
5672
|
var _a, _b;
|
|
5670
5673
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5683,7 +5686,7 @@ var StyledBanner = styled$2("div", {
|
|
|
5683
5686
|
var spaces = getSpaces(props);
|
|
5684
5687
|
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 ");
|
|
5685
5688
|
});
|
|
5686
|
-
var templateObject_1$
|
|
5689
|
+
var templateObject_1$Z, templateObject_2$B, templateObject_3$s, templateObject_4$o, templateObject_5$j;
|
|
5687
5690
|
|
|
5688
5691
|
var Banner = forwardRef(function Banner(props, ref) {
|
|
5689
5692
|
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"]);
|
|
@@ -5749,13 +5752,13 @@ var ButtonDropdown = React__default.forwardRef(function (props, ref) {
|
|
|
5749
5752
|
var doNotForwardProps$y = ["sdsStage"];
|
|
5750
5753
|
var StyledButtonToggle = styled$2(ButtonIcon, {
|
|
5751
5754
|
shouldForwardProp: function (prop) { return !doNotForwardProps$y.includes(prop); },
|
|
5752
|
-
})(templateObject_1$
|
|
5755
|
+
})(templateObject_1$Y || (templateObject_1$Y = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5753
5756
|
var _a;
|
|
5754
5757
|
var sdsStage = props.sdsStage;
|
|
5755
5758
|
var semanticColors = getSemanticColors(props);
|
|
5756
5759
|
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 ");
|
|
5757
5760
|
});
|
|
5758
|
-
var templateObject_1$
|
|
5761
|
+
var templateObject_1$Y;
|
|
5759
5762
|
|
|
5760
5763
|
/**
|
|
5761
5764
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -5780,7 +5783,7 @@ var doNotForwardProps$x = [
|
|
|
5780
5783
|
];
|
|
5781
5784
|
var StyledCallout = styled$2(Alert$2, {
|
|
5782
5785
|
shouldForwardProp: function (prop) { return !doNotForwardProps$x.includes(prop); },
|
|
5783
|
-
})(templateObject_1$
|
|
5786
|
+
})(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5784
5787
|
var _a, _b, _c, _d, _e;
|
|
5785
5788
|
var _f = props.intent, intent = _f === void 0 ? "info" : _f, sdsStyle = props.sdsStyle, hideBody = props.hideBody, collapsed = props.collapsed;
|
|
5786
5789
|
var spaces = getSpaces(props);
|
|
@@ -5792,12 +5795,12 @@ var StyledCallout = styled$2(Alert$2, {
|
|
|
5792
5795
|
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";
|
|
5793
5796
|
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 ");
|
|
5794
5797
|
});
|
|
5795
|
-
var templateObject_1$
|
|
5798
|
+
var templateObject_1$X;
|
|
5796
5799
|
|
|
5797
5800
|
var CALLOUT_TITLE_DISPLAY_NAME = "CalloutTitle";
|
|
5798
5801
|
|
|
5799
|
-
var StyledCalloutTitle = styled$2(AlertTitle)(templateObject_1$
|
|
5800
|
-
var templateObject_1$
|
|
5802
|
+
var StyledCalloutTitle = styled$2(AlertTitle)(templateObject_1$W || (templateObject_1$W = __makeTemplateObject(["\n ", "\n margin: 0;\n"], ["\n ", "\n margin: 0;\n"])), fontBodySemiboldXs);
|
|
5803
|
+
var templateObject_1$W;
|
|
5801
5804
|
|
|
5802
5805
|
var CalloutTitle = function (_a) {
|
|
5803
5806
|
var children = _a.children;
|
|
@@ -5806,24 +5809,24 @@ var CalloutTitle = function (_a) {
|
|
|
5806
5809
|
// Display name required to ensure Callout expand works correctly.
|
|
5807
5810
|
CalloutTitle.displayName = CALLOUT_TITLE_DISPLAY_NAME;
|
|
5808
5811
|
|
|
5809
|
-
var StyledCalloutBody = styled$2("p")(templateObject_1$
|
|
5812
|
+
var StyledCalloutBody = styled$2("p")(templateObject_1$V || (templateObject_1$V = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5810
5813
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a;
|
|
5811
5814
|
var spaces = getSpaces(props);
|
|
5812
5815
|
return "\n margin: ".concat(!hideTitle ? spaces === null || spaces === void 0 ? void 0 : spaces.xs : 0, "px 0 0 0;\n ");
|
|
5813
5816
|
});
|
|
5814
|
-
var templateObject_1$
|
|
5817
|
+
var templateObject_1$V;
|
|
5815
5818
|
|
|
5816
5819
|
var CalloutBody = function (_a) {
|
|
5817
5820
|
var children = _a.children, hideTitle = _a.hideTitle;
|
|
5818
5821
|
return (jsx(StyledCalloutBody, { hideTitle: hideTitle, children: children }));
|
|
5819
5822
|
};
|
|
5820
5823
|
|
|
5821
|
-
var StyledCalloutExtraContent = styled$2("div")(templateObject_1$
|
|
5824
|
+
var StyledCalloutExtraContent = styled$2("div")(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5822
5825
|
var _a = props.hideTitle, hideTitle = _a === void 0 ? false : _a, _b = props.hideBody, hideBody = _b === void 0 ? false : _b;
|
|
5823
5826
|
var spaces = getSpaces(props);
|
|
5824
5827
|
return "\n margin: ".concat(hideTitle && hideBody ? 0 : spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0 0;\n ");
|
|
5825
5828
|
});
|
|
5826
|
-
var templateObject_1$
|
|
5829
|
+
var templateObject_1$U;
|
|
5827
5830
|
|
|
5828
5831
|
var CalloutExtraContent = function (_a) {
|
|
5829
5832
|
var children = _a.children, hideTitle = _a.hideTitle, hideBody = _a.hideBody;
|
|
@@ -5892,7 +5895,7 @@ var dark$1 = function (props) {
|
|
|
5892
5895
|
var _a, _b;
|
|
5893
5896
|
var spaces = getSpaces(props);
|
|
5894
5897
|
var semanticColors = getSemanticColors(props);
|
|
5895
|
-
return css$1(templateObject_1$
|
|
5898
|
+
return css$1(templateObject_1$T || (templateObject_1$T = __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);
|
|
5896
5899
|
};
|
|
5897
5900
|
var light$1 = function (props) {
|
|
5898
5901
|
var _a, _b;
|
|
@@ -5901,11 +5904,11 @@ var light$1 = function (props) {
|
|
|
5901
5904
|
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);
|
|
5902
5905
|
};
|
|
5903
5906
|
var wide = function () {
|
|
5904
|
-
return css$1(templateObject_3$
|
|
5907
|
+
return css$1(templateObject_3$r || (templateObject_3$r = __makeTemplateObject(["\n max-width: 550px;\n "], ["\n max-width: 550px;\n "])));
|
|
5905
5908
|
};
|
|
5906
5909
|
var tableStyles = function (props) {
|
|
5907
5910
|
var spaces = getSpaces(props);
|
|
5908
|
-
return css$1(templateObject_4$
|
|
5911
|
+
return css$1(templateObject_4$n || (templateObject_4$n = __makeTemplateObject(["\n padding: ", "px;\n "], ["\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
5909
5912
|
};
|
|
5910
5913
|
var doNotForwardProps$w = ["hasInvertedStyle"];
|
|
5911
5914
|
var Subtitle$1 = styled$2("div", {
|
|
@@ -5936,7 +5939,7 @@ var arrowCss = function (props) {
|
|
|
5936
5939
|
* default placement which is calculated by javascript
|
|
5937
5940
|
*/
|
|
5938
5941
|
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$
|
|
5942
|
+
var templateObject_1$T, templateObject_2$A, templateObject_3$r, templateObject_4$n, templateObject_5$i, templateObject_6$f, templateObject_7$b, templateObject_8$9;
|
|
5940
5943
|
|
|
5941
5944
|
/**
|
|
5942
5945
|
* @see https://mui.com/material-ui/react-tooltip/
|
|
@@ -6042,7 +6045,7 @@ var verticalAlignToFlexMap = {
|
|
|
6042
6045
|
};
|
|
6043
6046
|
var StyledTableData = styled$2("td", {
|
|
6044
6047
|
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6045
|
-
})(templateObject_1$
|
|
6048
|
+
})(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
6046
6049
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6047
6050
|
var spaces = getSpaces(props);
|
|
6048
6051
|
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 ");
|
|
@@ -6054,10 +6057,10 @@ var ShouldTruncate = function () {
|
|
|
6054
6057
|
return "\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n ";
|
|
6055
6058
|
};
|
|
6056
6059
|
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$
|
|
6060
|
+
var StyledCellContentWrapper = styled$2("div")(templateObject_3$q || (templateObject_3$q = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
6058
6061
|
var StyledCellIconWrapper = styled$2("div", {
|
|
6059
6062
|
shouldForwardProp: function (prop) { return !doNotForwardProps$v.includes(prop); },
|
|
6060
|
-
})(templateObject_4$
|
|
6063
|
+
})(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6061
6064
|
var _a = props.iconVerticalAlign, iconVerticalAlign = _a === void 0 ? "top" : _a;
|
|
6062
6065
|
var spaces = getSpaces(props);
|
|
6063
6066
|
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 ");
|
|
@@ -6104,7 +6107,7 @@ var PrimaryTextComponentSlotRightWrapper = styled$2("div")(templateObject_10$4 |
|
|
|
6104
6107
|
var spaces = getSpaces(props);
|
|
6105
6108
|
return "\n margin-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
6106
6109
|
});
|
|
6107
|
-
var templateObject_1$
|
|
6110
|
+
var templateObject_1$S, templateObject_2$z, templateObject_3$q, templateObject_4$m, templateObject_5$h, templateObject_6$e, templateObject_7$a, templateObject_8$8, templateObject_9$5, templateObject_10$4;
|
|
6108
6111
|
|
|
6109
6112
|
var CellBasicContent = function (props) {
|
|
6110
6113
|
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;
|
|
@@ -6121,12 +6124,12 @@ var CellBasic = forwardRef(function (props, ref) {
|
|
|
6121
6124
|
var doNotForwardProps$u = ["horizontalAlign", "verticalAlign"];
|
|
6122
6125
|
var StyledCellComponentData = styled$2("td", {
|
|
6123
6126
|
shouldForwardProp: function (prop) { return !doNotForwardProps$u.includes(prop); },
|
|
6124
|
-
})(templateObject_1$
|
|
6127
|
+
})(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
6125
6128
|
var spaces = getSpaces(props);
|
|
6126
6129
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
6127
6130
|
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 ");
|
|
6128
6131
|
});
|
|
6129
|
-
var templateObject_1$
|
|
6132
|
+
var templateObject_1$R;
|
|
6130
6133
|
|
|
6131
6134
|
var CellComponent = forwardRef(function (props, _) {
|
|
6132
6135
|
var children = props.children;
|
|
@@ -6149,7 +6152,7 @@ var doNotForwardProps$t = [
|
|
|
6149
6152
|
];
|
|
6150
6153
|
var StyledSortingIcon = styled$2(Icon, {
|
|
6151
6154
|
shouldForwardProp: function (prop) { return !doNotForwardProps$t.includes(prop); },
|
|
6152
|
-
})(templateObject_1$
|
|
6155
|
+
})(templateObject_1$Q || (templateObject_1$Q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6153
6156
|
var _a;
|
|
6154
6157
|
var _b = props.active, active = _b === void 0 ? false : _b, hideSortIcon = props.hideSortIcon;
|
|
6155
6158
|
var spaces = getSpaces(props);
|
|
@@ -6173,11 +6176,11 @@ var StyledTableHeader$1 = styled$2("th", {
|
|
|
6173
6176
|
});
|
|
6174
6177
|
var StyledCellHeaderContainer = styled$2("div", {
|
|
6175
6178
|
shouldForwardProp: function (prop) { return !doNotForwardProps$t.includes(prop); },
|
|
6176
|
-
})(templateObject_3$
|
|
6179
|
+
})(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6177
6180
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a;
|
|
6178
6181
|
return "\n align-items: flex-end;\n width: 100%;\n display: flex;\n justify-content: ".concat(horizontalAlign ? contentPositionMapping[horizontalAlign] : "flex-start", ";\n ");
|
|
6179
6182
|
});
|
|
6180
|
-
var templateObject_1$
|
|
6183
|
+
var templateObject_1$Q, templateObject_2$y, templateObject_3$p;
|
|
6181
6184
|
|
|
6182
6185
|
var CellHeaderContent = function (props) {
|
|
6183
6186
|
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;
|
|
@@ -6197,7 +6200,7 @@ var CellHeader = forwardRef(function (props, ref) {
|
|
|
6197
6200
|
|
|
6198
6201
|
var small = function (props) {
|
|
6199
6202
|
var spaces = getSpaces(props);
|
|
6200
|
-
return css(templateObject_1$
|
|
6203
|
+
return css(templateObject_1$P || (templateObject_1$P = __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));
|
|
6201
6204
|
};
|
|
6202
6205
|
var medium = function (props) {
|
|
6203
6206
|
var spaces = getSpaces(props);
|
|
@@ -6206,11 +6209,11 @@ var medium = function (props) {
|
|
|
6206
6209
|
};
|
|
6207
6210
|
var rounded$2 = function (props) {
|
|
6208
6211
|
var corners = getCorners(props);
|
|
6209
|
-
return css(templateObject_3$
|
|
6212
|
+
return css(templateObject_3$o || (templateObject_3$o = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.l);
|
|
6210
6213
|
};
|
|
6211
6214
|
var square$2 = function (props) {
|
|
6212
6215
|
var corners = getCorners(props);
|
|
6213
|
-
return css(templateObject_4$
|
|
6216
|
+
return css(templateObject_4$l || (templateObject_4$l = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.m);
|
|
6214
6217
|
};
|
|
6215
6218
|
var success = function (props) {
|
|
6216
6219
|
return createStatusCss(props, "success");
|
|
@@ -6280,7 +6283,7 @@ var StyledChip = styled$2(Chip$1, {
|
|
|
6280
6283
|
var size = props.size, status = props.status, isRounded = props.isRounded;
|
|
6281
6284
|
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));
|
|
6282
6285
|
});
|
|
6283
|
-
var templateObject_1$
|
|
6286
|
+
var templateObject_1$P, templateObject_2$x, templateObject_3$o, templateObject_4$l, templateObject_5$g, templateObject_6$d, templateObject_7$9;
|
|
6284
6287
|
|
|
6285
6288
|
/**
|
|
6286
6289
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6313,7 +6316,7 @@ var doNotForwardProps$r = [
|
|
|
6313
6316
|
];
|
|
6314
6317
|
var StyledHeaderTitle = styled$2("div", {
|
|
6315
6318
|
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
6316
|
-
})(templateObject_1$
|
|
6319
|
+
})(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderXs, function (props) {
|
|
6317
6320
|
var _a;
|
|
6318
6321
|
var spaces = getSpaces(props);
|
|
6319
6322
|
var semanticColors = getSemanticColors(props);
|
|
@@ -6324,7 +6327,7 @@ var StyledPopper = styled$2(Popper, {
|
|
|
6324
6327
|
shouldForwardProp: function (prop) {
|
|
6325
6328
|
return !doNotForwardProps$r.includes(prop) || prop === "anchorEl";
|
|
6326
6329
|
},
|
|
6327
|
-
})(templateObject_3$
|
|
6330
|
+
})(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6328
6331
|
var _a;
|
|
6329
6332
|
var borders = getBorders(props);
|
|
6330
6333
|
var corners = getCorners(props);
|
|
@@ -6334,7 +6337,7 @@ var StyledPopper = styled$2(Popper, {
|
|
|
6334
6337
|
});
|
|
6335
6338
|
var StyledPaper$1 = styled$2(Paper, {
|
|
6336
6339
|
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
6337
|
-
})(templateObject_4$
|
|
6340
|
+
})(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6338
6341
|
var _a;
|
|
6339
6342
|
var spaces = getSpaces(props);
|
|
6340
6343
|
var borders = getBorders(props);
|
|
@@ -6347,7 +6350,7 @@ var StyledDropdownMenuHeader = styled$2("div")(templateObject_5$f || (templateOb
|
|
|
6347
6350
|
var spaces = getSpaces(props);
|
|
6348
6351
|
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 ");
|
|
6349
6352
|
});
|
|
6350
|
-
var templateObject_1$
|
|
6353
|
+
var templateObject_1$O, templateObject_2$w, templateObject_3$n, templateObject_4$k, templateObject_5$f;
|
|
6351
6354
|
|
|
6352
6355
|
// (masoudmanson): Represents the minimum width defined by design specifications
|
|
6353
6356
|
// for the dropdownMenu's popper component
|
|
@@ -6413,21 +6416,21 @@ var inputDropdownStyles = function (props) {
|
|
|
6413
6416
|
* The top/bottom padding is set to 1px less than the actual value to account for the border.
|
|
6414
6417
|
*/
|
|
6415
6418
|
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");
|
|
6416
|
-
return css(templateObject_1$
|
|
6419
|
+
return css(templateObject_1$N || (templateObject_1$N = __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);
|
|
6417
6420
|
};
|
|
6418
6421
|
var minimal$1 = function (props) {
|
|
6419
6422
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
6420
6423
|
var spaces = getSpaces(props);
|
|
6421
6424
|
var semanticColors = getSemanticColors(props);
|
|
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
|
|
6425
|
+
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 min-width: fit-content;\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 min-width: fit-content;\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);
|
|
6423
6426
|
};
|
|
6424
6427
|
var square$1 = function (props) {
|
|
6425
6428
|
var corners = getCorners(props);
|
|
6426
|
-
return css(templateObject_3$
|
|
6429
|
+
return css(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n border-radius: ", "px;\n min-width: fit-content;\n background-color: transparent;\n "], ["\n border-radius: ", "px;\n min-width: fit-content;\n background-color: transparent;\n "])), corners === null || corners === void 0 ? void 0 : corners.m);
|
|
6427
6430
|
};
|
|
6428
6431
|
var rounded$1 = function (props) {
|
|
6429
6432
|
var corners = getCorners(props);
|
|
6430
|
-
return css(templateObject_4$
|
|
6433
|
+
return css(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n border-radius: ", "px;\n min-width: fit-content;\n background-color: transparent;\n "], ["\n border-radius: ", "px;\n min-width: fit-content;\n background-color: transparent;\n "])), corners === null || corners === void 0 ? void 0 : corners.l);
|
|
6431
6434
|
};
|
|
6432
6435
|
var userInput = function (props) {
|
|
6433
6436
|
var _a, _b, _c, _d;
|
|
@@ -6538,7 +6541,7 @@ function labelStyle(props) {
|
|
|
6538
6541
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textSecondary;
|
|
6539
6542
|
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);
|
|
6540
6543
|
}
|
|
6541
|
-
var templateObject_1$
|
|
6544
|
+
var templateObject_1$N, templateObject_2$v, templateObject_3$m, templateObject_4$j, 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;
|
|
6542
6545
|
|
|
6543
6546
|
/**
|
|
6544
6547
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -6605,7 +6608,7 @@ var tagSizeS = function (props) {
|
|
|
6605
6608
|
var spaces = getSpaces(props);
|
|
6606
6609
|
var iconSizes = getIconSizes(props);
|
|
6607
6610
|
var semanticColors = getSemanticColors(props);
|
|
6608
|
-
return css(templateObject_1$
|
|
6611
|
+
return css(templateObject_1$M || (templateObject_1$M = __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);
|
|
6609
6612
|
};
|
|
6610
6613
|
var tagSizeL = function (props) {
|
|
6611
6614
|
var _a;
|
|
@@ -6619,14 +6622,14 @@ var rounded = function (props) {
|
|
|
6619
6622
|
var spaces = getSpaces(props);
|
|
6620
6623
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6621
6624
|
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;
|
|
6622
|
-
return css(templateObject_3$
|
|
6625
|
+
return css(templateObject_3$l || (templateObject_3$l = __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);
|
|
6623
6626
|
};
|
|
6624
6627
|
var square = function (props) {
|
|
6625
6628
|
var corners = getCorners(props);
|
|
6626
6629
|
var spaces = getSpaces(props);
|
|
6627
6630
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6628
6631
|
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;
|
|
6629
|
-
return css(templateObject_4$
|
|
6632
|
+
return css(templateObject_4$i || (templateObject_4$i = __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);
|
|
6630
6633
|
};
|
|
6631
6634
|
var withHover = function (props) {
|
|
6632
6635
|
var _a;
|
|
@@ -6721,7 +6724,7 @@ var StyledTag$2 = styled$2(Chip$1, {
|
|
|
6721
6724
|
var type = sdsType || "primary";
|
|
6722
6725
|
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;");
|
|
6723
6726
|
});
|
|
6724
|
-
var templateObject_1$
|
|
6727
|
+
var templateObject_1$M, templateObject_2$u, templateObject_3$l, templateObject_4$i, templateObject_5$d, templateObject_6$b, templateObject_7$7, templateObject_8$6;
|
|
6725
6728
|
|
|
6726
6729
|
/**
|
|
6727
6730
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6740,9 +6743,9 @@ var StyledTag$1 = styled$2(Tag)(templateObject_2$t || (templateObject_2$t = __ma
|
|
|
6740
6743
|
var spaces = getSpaces(props);
|
|
6741
6744
|
var iconSizes = getIconSizes(props);
|
|
6742
6745
|
var semanticColors = getSemanticColors(props);
|
|
6743
|
-
return css(templateObject_1$
|
|
6746
|
+
return css(templateObject_1$L || (templateObject_1$L = __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);
|
|
6744
6747
|
});
|
|
6745
|
-
var templateObject_1$
|
|
6748
|
+
var templateObject_1$L, templateObject_2$t;
|
|
6746
6749
|
|
|
6747
6750
|
/**
|
|
6748
6751
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6765,12 +6768,12 @@ var Chips = function (_a) {
|
|
|
6765
6768
|
}) }));
|
|
6766
6769
|
};
|
|
6767
6770
|
|
|
6768
|
-
var Wrapper$1 = styled$2("div")(templateObject_1$
|
|
6771
|
+
var Wrapper$1 = styled$2("div")(templateObject_1$K || (templateObject_1$K = __makeTemplateObject(["\n min-width: 150px;\n"], ["\n min-width: 150px;\n"])));
|
|
6769
6772
|
var StyledChipsWrapper = styled$2("div")(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6770
6773
|
var spaces = getSpaces(props);
|
|
6771
6774
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
6772
6775
|
});
|
|
6773
|
-
var templateObject_1$
|
|
6776
|
+
var templateObject_1$K, templateObject_2$s;
|
|
6774
6777
|
|
|
6775
6778
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
6776
6779
|
var ComplexFilter = function (_a) {
|
|
@@ -6898,9 +6901,9 @@ var StyledCard = styled$2(Card, {
|
|
|
6898
6901
|
var showDecorativeBorder = visualElementType === "image"
|
|
6899
6902
|
? boundingBox && decorativeBorder && imagePadding
|
|
6900
6903
|
: boundingBox && decorativeBorder;
|
|
6901
|
-
return css(templateObject_4$
|
|
6904
|
+
return css(templateObject_4$h || (templateObject_4$h = __makeTemplateObject(["\n display: flex;\n background-color: transparent;\n background-image: none;\n flex-direction: ", ";\n box-shadow: none;\n overflow: visible;\n\n .MuiCardActionArea-focusHighlight {\n background: transparent;\n }\n\n ", "\n\n ", "\n\n ", "\n "], ["\n display: flex;\n background-color: transparent;\n background-image: none;\n flex-direction: ", ";\n box-shadow: none;\n overflow: visible;\n\n .MuiCardActionArea-focusHighlight {\n background: transparent;\n }\n\n ", "\n\n ", "\n\n ", "\n "])), flexDirection, boundingBox && css(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n border: 1px solid ", ";\n background-color: ", ";\n "], ["\n border: 1px solid ", ";\n background-color: ", ";\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderSecondary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.backgroundPrimary), sdsType === "wide" &&
|
|
6902
6905
|
showDecorativeBorder && css(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n border-left: 4px solid ", ";\n "], ["\n border-left: 4px solid ", ";\n "])), (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.border), sdsType === "narrow" &&
|
|
6903
|
-
showDecorativeBorder && css(templateObject_3$
|
|
6906
|
+
showDecorativeBorder && css(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n border-top: 4px solid ", ";\n "], ["\n border-top: 4px solid ", ";\n "])), (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.border));
|
|
6904
6907
|
});
|
|
6905
6908
|
var StyledCardActionArea = styled$2(Button, {
|
|
6906
6909
|
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
@@ -6916,7 +6919,7 @@ var StyledCardActionArea = styled$2(Button, {
|
|
|
6916
6919
|
: visualElementType === "image"
|
|
6917
6920
|
? "column"
|
|
6918
6921
|
: "row";
|
|
6919
|
-
return "\n display: flex;\n flex-direction: ".concat(flexDirection, ";\n align-items: unset;\n height: 100%;\n padding: 0;\n margin: 0;\n overflow:
|
|
6922
|
+
return "\n display: flex;\n flex-direction: ".concat(flexDirection, ";\n align-items: unset;\n height: 100%;\n padding: 0;\n margin: 0;\n overflow: auto;\n text-align: unset;\n\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.backgroundPrimary, ";\n\n &:hover,\n &:active {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.surface, ";\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.l, " !important;\n }\n ");
|
|
6920
6923
|
});
|
|
6921
6924
|
var StyledIconMediaWrapper = styled$2("div", {
|
|
6922
6925
|
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
@@ -6931,7 +6934,7 @@ var StyledCardContent = styled$2("div", {
|
|
|
6931
6934
|
})(templateObject_13$2 || (templateObject_13$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6932
6935
|
var _a = props.boundingBox, boundingBox = _a === void 0 ? true : _a;
|
|
6933
6936
|
var spaces = getSpaces(props);
|
|
6934
|
-
return css(templateObject_12$2 || (templateObject_12$2 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n\n ", "\n "], ["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n\n ", "\n "])), boundingBox && css(templateObject_11$2 || (templateObject_11$2 = __makeTemplateObject(["\n padding: ", "px;\n "], ["\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
6937
|
+
return css(templateObject_12$2 || (templateObject_12$2 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n height: 100%;\n\n ", "\n "], ["\n display: flex;\n flex-direction: column;\n min-width: 100px;\n width: 100%;\n height: 100%;\n\n ", "\n "])), boundingBox && css(templateObject_11$2 || (templateObject_11$2 = __makeTemplateObject(["\n padding: ", "px;\n "], ["\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
6935
6938
|
});
|
|
6936
6939
|
var StyledContentCardBody = styled$2(CardContent, {
|
|
6937
6940
|
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
@@ -6942,7 +6945,7 @@ var StyledContentCardBody = styled$2(CardContent, {
|
|
|
6942
6945
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n margin: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px 0 0;\n padding: 0;\n ");
|
|
6943
6946
|
});
|
|
6944
6947
|
var StyledCardContentAligner = styled$2("div")(templateObject_15$2 || (templateObject_15$2 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n height: 100%;\n"], ["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n height: 100%;\n"])));
|
|
6945
|
-
var templateObject_1$
|
|
6948
|
+
var templateObject_1$J, templateObject_2$r, templateObject_3$k, templateObject_4$h, templateObject_5$c, templateObject_6$a, templateObject_7$6, templateObject_8$5, templateObject_9$3, templateObject_10$2, templateObject_11$2, templateObject_12$2, templateObject_13$2, templateObject_14$2, templateObject_15$2;
|
|
6946
6949
|
|
|
6947
6950
|
var doNotForwardProps$n = [
|
|
6948
6951
|
"visualElement",
|
|
@@ -6957,7 +6960,7 @@ var doNotForwardProps$n = [
|
|
|
6957
6960
|
];
|
|
6958
6961
|
var StyledTitleWrapper = styled$3("div", {
|
|
6959
6962
|
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6960
|
-
})(templateObject_1$
|
|
6963
|
+
})(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6961
6964
|
var spaces = getSpaces(props);
|
|
6962
6965
|
return "\n display: flex;\n flex-direction: column;\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
6963
6966
|
});
|
|
@@ -6970,14 +6973,14 @@ var StyledOverlineText = styled$3("p", {
|
|
|
6970
6973
|
});
|
|
6971
6974
|
var StyledTitleText = styled$3("p", {
|
|
6972
6975
|
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6973
|
-
})(templateObject_3$
|
|
6976
|
+
})(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderXl, function (props) {
|
|
6974
6977
|
var _a;
|
|
6975
6978
|
var semanticColors = getSemanticColors(props);
|
|
6976
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 ");
|
|
6977
6980
|
});
|
|
6978
6981
|
var StyledSubtitleText = styled$3("p", {
|
|
6979
6982
|
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
6980
|
-
})(templateObject_4$
|
|
6983
|
+
})(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderM$1, function (props) {
|
|
6981
6984
|
var _a;
|
|
6982
6985
|
var semanticColors = getSemanticColors(props);
|
|
6983
6986
|
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 ");
|
|
@@ -6990,7 +6993,7 @@ var StyledMetadataText = styled$3("p", {
|
|
|
6990
6993
|
var spaces = getSpaces(props);
|
|
6991
6994
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n margin: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px 0 0 0;\n ");
|
|
6992
6995
|
});
|
|
6993
|
-
var templateObject_1$
|
|
6996
|
+
var templateObject_1$I, templateObject_2$q, templateObject_3$j, templateObject_4$g, templateObject_5$b;
|
|
6994
6997
|
|
|
6995
6998
|
/**
|
|
6996
6999
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -7004,12 +7007,12 @@ var ContentCardTitle = forwardRef(function ContentCardTitle(props, ref) {
|
|
|
7004
7007
|
var doNotForwardProps$m = ["buttonsPosition"];
|
|
7005
7008
|
var StyledCardActions = styled$2(CardActions, {
|
|
7006
7009
|
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
7007
|
-
})(templateObject_1$
|
|
7010
|
+
})(templateObject_1$H || (templateObject_1$H = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7008
7011
|
var _a = props.buttonsPosition, buttonsPosition = _a === void 0 ? "left" : _a;
|
|
7009
7012
|
var spaces = getSpaces(props);
|
|
7010
7013
|
return "\n margin: 0;\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px 0 0;\n display: flex;\n gap: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n justify-content: ").concat(buttonsPosition === "right" ? "flex-end" : "flex-start", ";\n\n & > * {\n margin: 0 !important;\n }\n ");
|
|
7011
7014
|
});
|
|
7012
|
-
var templateObject_1$
|
|
7015
|
+
var templateObject_1$H;
|
|
7013
7016
|
|
|
7014
7017
|
var isButtonElement = function (child) {
|
|
7015
7018
|
if (React__default.isValidElement(child) && child.type === Button) {
|
|
@@ -7075,17 +7078,17 @@ var StyledImageMediaWrapper = styled$3("div", {
|
|
|
7075
7078
|
var spaces = getSpaces(props);
|
|
7076
7079
|
return css$2(templateObject_8$4 || (templateObject_8$4 = __makeTemplateObject(["\n display: flex;\n align-items: start;\n\n ", "\n\n ", "\n "], ["\n display: flex;\n align-items: start;\n\n ", "\n\n ", "\n "])), boundingBox
|
|
7077
7080
|
? imagePadding
|
|
7078
|
-
? css$2(templateObject_1$
|
|
7081
|
+
? css$2(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n padding: ", "px;\n ", "\n "], ["\n padding: ", "px;\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl, imagePosition === "left"
|
|
7079
7082
|
? "padding-right: 0;"
|
|
7080
7083
|
: "padding-left: 0;") : css$2(templateObject_2$p || (templateObject_2$p = __makeTemplateObject(["\n padding: 0;\n "], ["\n padding: 0;\n "])))
|
|
7081
|
-
: css$2(templateObject_3$
|
|
7084
|
+
: css$2(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), imagePosition === "left"
|
|
7082
7085
|
? "padding-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")
|
|
7083
7086
|
: "padding-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;")), sdsType === "narrow" && css$2(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n ", "\n\n justify-content: center;\n "], ["\n ", "\n\n justify-content: center;\n "])), boundingBox
|
|
7084
7087
|
? imagePadding
|
|
7085
|
-
? css$2(templateObject_4$
|
|
7088
|
+
? css$2(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n padding: ", "px;\n padding-bottom: 0;\n "], ["\n padding: ", "px;\n padding-bottom: 0;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl) : css$2(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n padding: 0;\n "], ["\n padding: 0;\n "])))
|
|
7086
7089
|
: css$2(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n padding-bottom: ", "px;\n "], ["\n padding-bottom: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl)));
|
|
7087
7090
|
});
|
|
7088
|
-
var templateObject_1$
|
|
7091
|
+
var templateObject_1$G, templateObject_2$p, templateObject_3$i, templateObject_4$f, templateObject_5$a, templateObject_6$9, templateObject_7$5, templateObject_8$4, templateObject_9$2;
|
|
7089
7092
|
|
|
7090
7093
|
/**
|
|
7091
7094
|
* @see https://mui.com/material-ui/api/card-media/
|
|
@@ -7188,7 +7191,11 @@ var ContentCard = React__default.forwardRef(function (props, ref) {
|
|
|
7188
7191
|
} }), jsx(StyledCardContentAligner, { children: enhanceChildrenWithCardActionsProps(children, clickableCard, buttonsPosition, {
|
|
7189
7192
|
cardActions: cardActions,
|
|
7190
7193
|
}) })] })] }));
|
|
7191
|
-
return (jsx(StyledCard, __assign({ ref: mergeRefs([ref, cardRef]) }, props, { sdsType: dynamicSdsType, boundingBox: boundingBox, className: cardPaper, children: clickableCard ? (jsx(StyledCardActionArea, __assign({
|
|
7194
|
+
return (jsx(StyledCard, __assign({ ref: mergeRefs([ref, cardRef]) }, props, { sdsType: dynamicSdsType, boundingBox: boundingBox, className: cardPaper, children: clickableCard ? (jsx(StyledCardActionArea, __assign({}, clickableCardProps, {
|
|
7195
|
+
// (masoudmanson): The following props are for internal use only and should not be user editable.
|
|
7196
|
+
// To prevent users from overriding them, we use the spread operator to pass user provided props
|
|
7197
|
+
// to the StyledCardActionArea component on top while hardcoding the rest after it.
|
|
7198
|
+
sdsStyle: "minimal", cardSdsType: dynamicSdsType, visualElementType: visualElementType, imagePosition: imagePosition, className: clickableCardButton, children: cardInnerContent }))) : (cardInnerContent) })));
|
|
7192
7199
|
});
|
|
7193
7200
|
|
|
7194
7201
|
var DialogContext = createContext({ sdsSize: "m" });
|
|
@@ -7197,7 +7204,7 @@ var DialogContext = createContext({ sdsSize: "m" });
|
|
|
7197
7204
|
var doNotForwardProps$k = ["sdsSize"];
|
|
7198
7205
|
var StyledPaper = styled$2(Paper, {
|
|
7199
7206
|
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
7200
|
-
})(templateObject_1$
|
|
7207
|
+
})(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n & {\n ", "\n\n ", "\n }\n"], ["\n & {\n ", "\n\n ", "\n }\n"])), paperDimensions, function (props) {
|
|
7201
7208
|
var _a;
|
|
7202
7209
|
var spaces = getSpaces(props);
|
|
7203
7210
|
var corners = getCorners(props);
|
|
@@ -7228,7 +7235,7 @@ function paperDimensions(props) {
|
|
|
7228
7235
|
var _a = sizeToDimensions[sdsSize], width = _a.width, minHeight = _a.minHeight;
|
|
7229
7236
|
return "\n width: ".concat(width, ";\n min-height: ").concat(minHeight, ";\n max-width: revert;\n box-sizing: border-box;\n ");
|
|
7230
7237
|
}
|
|
7231
|
-
var templateObject_1$
|
|
7238
|
+
var templateObject_1$F;
|
|
7232
7239
|
|
|
7233
7240
|
/**
|
|
7234
7241
|
* @see https://mui.com/material-ui/react-paper/
|
|
@@ -7260,12 +7267,12 @@ var Dialog = forwardRef(function Dialog(props, ref) {
|
|
|
7260
7267
|
var doNotForwardProps$j = ["buttonPosition"];
|
|
7261
7268
|
var StyledDialogActions = styled$2(DialogActions$1, {
|
|
7262
7269
|
shouldForwardProp: function (prop) { return !doNotForwardProps$j.includes(prop); },
|
|
7263
|
-
})(templateObject_1$
|
|
7270
|
+
})(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n padding: 0;\n\n ", "\n"], ["\n padding: 0;\n\n ", "\n"])), function (props) {
|
|
7264
7271
|
var spaces = getSpaces(props);
|
|
7265
7272
|
var _a = props.buttonPosition, buttonPosition = _a === void 0 ? "right" : _a;
|
|
7266
7273
|
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 ");
|
|
7267
7274
|
});
|
|
7268
|
-
var templateObject_1$
|
|
7275
|
+
var templateObject_1$E;
|
|
7269
7276
|
|
|
7270
7277
|
/**
|
|
7271
7278
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -7274,8 +7281,8 @@ var DialogActions = forwardRef(function DialogActions(props, ref) {
|
|
|
7274
7281
|
return jsx(StyledDialogActions, __assign({ ref: ref }, props));
|
|
7275
7282
|
});
|
|
7276
7283
|
|
|
7277
|
-
var StyledDialogContent = styled$2(DialogContent)(templateObject_1$
|
|
7278
|
-
var templateObject_1$
|
|
7284
|
+
var StyledDialogContent = styled$2(DialogContent)(templateObject_1$D || (templateObject_1$D = __makeTemplateObject(["\n ", "\n padding: 0;\n"], ["\n ", "\n padding: 0;\n"])), fontBodyS$1);
|
|
7285
|
+
var templateObject_1$D;
|
|
7279
7286
|
|
|
7280
7287
|
var index = forwardRef(
|
|
7281
7288
|
/**
|
|
@@ -7285,11 +7292,11 @@ function DialogContent(props, ref) {
|
|
|
7285
7292
|
return jsx(StyledDialogContent, __assign({ ref: ref }, props));
|
|
7286
7293
|
});
|
|
7287
7294
|
|
|
7288
|
-
var StyledButton$1 = styled$2(Button)(templateObject_1$
|
|
7295
|
+
var StyledButton$1 = styled$2(Button)(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n position: absolute;\n\n ", "\n"], ["\n position: absolute;\n\n ", "\n"])), function (props) {
|
|
7289
7296
|
var spaces = getSpaces(props);
|
|
7290
7297
|
return "\n right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxl, "px;\n ");
|
|
7291
7298
|
});
|
|
7292
|
-
var templateObject_1$
|
|
7299
|
+
var templateObject_1$C;
|
|
7293
7300
|
|
|
7294
7301
|
var CloseButton = forwardRef(function CloseButton(props, ref) {
|
|
7295
7302
|
var SDS_SIZE_TO_COMPONENT_SIZE = {
|
|
@@ -7305,7 +7312,7 @@ var CloseButton = forwardRef(function CloseButton(props, ref) {
|
|
|
7305
7312
|
} }));
|
|
7306
7313
|
});
|
|
7307
7314
|
|
|
7308
|
-
var StyledDialogTitle = styled$2(DialogTitle$1)(templateObject_1$
|
|
7315
|
+
var StyledDialogTitle = styled$2(DialogTitle$1)(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n padding: 0;\n ", "\n"], ["\n padding: 0;\n ", "\n"])), function (props) {
|
|
7309
7316
|
var spaces = getSpaces(props);
|
|
7310
7317
|
return "\n margin-bottom: ".concat((spaces === null || spaces === void 0 ? void 0 : spaces.xl) || 0, "px;\n ");
|
|
7311
7318
|
});
|
|
@@ -7314,18 +7321,18 @@ var Title = styled$2(Typography)(templateObject_2$o || (templateObject_2$o = __m
|
|
|
7314
7321
|
var semanticColors = getSemanticColors(props);
|
|
7315
7322
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n ");
|
|
7316
7323
|
});
|
|
7317
|
-
var Subtitle = styled$2(Typography)(templateObject_3$
|
|
7324
|
+
var Subtitle = styled$2(Typography)(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7318
7325
|
var _a;
|
|
7319
7326
|
var semanticColors = getSemanticColors(props);
|
|
7320
7327
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
7321
7328
|
});
|
|
7322
|
-
var Overline = styled$2(Typography)(templateObject_4$
|
|
7329
|
+
var Overline = styled$2(Typography)(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
7323
7330
|
var _a;
|
|
7324
7331
|
var semanticColors = getSemanticColors(props);
|
|
7325
7332
|
var spaces = getSpaces(props);
|
|
7326
7333
|
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 ");
|
|
7327
7334
|
});
|
|
7328
|
-
var templateObject_1$
|
|
7335
|
+
var templateObject_1$B, templateObject_2$o, templateObject_3$h, templateObject_4$e;
|
|
7329
7336
|
|
|
7330
7337
|
/**
|
|
7331
7338
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -7338,7 +7345,7 @@ var DialogTitle = forwardRef(function DialogTitle(props, ref) {
|
|
|
7338
7345
|
var doNotForwardProps$i = ["buttonPosition"];
|
|
7339
7346
|
var StyledButtonsWrapper = styled$2("div", {
|
|
7340
7347
|
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
7341
|
-
})(templateObject_1$
|
|
7348
|
+
})(templateObject_1$A || (templateObject_1$A = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7342
7349
|
var buttonPosition = props.buttonPosition;
|
|
7343
7350
|
return "\n display: flex;\n justify-content: ".concat(buttonPosition === "left" ? "start" : "end", ";\n ");
|
|
7344
7351
|
});
|
|
@@ -7348,7 +7355,7 @@ var StyledButton = styled$2(Button, {
|
|
|
7348
7355
|
var spaces = getSpaces(props);
|
|
7349
7356
|
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 ");
|
|
7350
7357
|
});
|
|
7351
|
-
var templateObject_1$
|
|
7358
|
+
var templateObject_1$A, templateObject_2$n;
|
|
7352
7359
|
|
|
7353
7360
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
7354
7361
|
var Dropdown = function (props) {
|
|
@@ -7484,7 +7491,7 @@ var intentToColor$1 = {
|
|
|
7484
7491
|
notice: "notice",
|
|
7485
7492
|
positive: "positive",
|
|
7486
7493
|
};
|
|
7487
|
-
var StyledIcon = styled$2(Icon)(templateObject_1$
|
|
7494
|
+
var StyledIcon = styled$2(Icon)(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7488
7495
|
var iconSizes = getIconSizes(props);
|
|
7489
7496
|
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 ");
|
|
7490
7497
|
});
|
|
@@ -7496,13 +7503,13 @@ var StyledCheckboxDefaultIcon = styled$2("span")(templateObject_2$m || (template
|
|
|
7496
7503
|
var borderColor = intentToColor$1[intent];
|
|
7497
7504
|
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 ");
|
|
7498
7505
|
});
|
|
7499
|
-
var StyledCheckboxCheckedIcon = styled$2("div")(templateObject_3$
|
|
7506
|
+
var StyledCheckboxCheckedIcon = styled$2("div")(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7500
7507
|
var _a, _b;
|
|
7501
7508
|
var iconSizes = getIconSizes(props);
|
|
7502
7509
|
var semanticColors = getSemanticColors(props);
|
|
7503
|
-
return "\n display: flex;\n align-items: center;\n justify-content: center;\n height: ".concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, "px;\n border-radius: 2px;\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.
|
|
7510
|
+
return "\n display: flex;\n align-items: center;\n justify-content: center;\n height: ".concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n width: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, "px;\n border-radius: 2px;\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.ornament, ";\n\n ").concat(StyledIcon, " {\n fill: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.ornamentPrimaryInverse, ";\n }\n\n &:hover {\n background-color: red;\n }\n ");
|
|
7504
7511
|
});
|
|
7505
|
-
var StyledCheckbox = styled$2(Checkbox)(templateObject_4$
|
|
7512
|
+
var StyledCheckbox = styled$2(Checkbox)(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7506
7513
|
var spaces = getSpaces(props);
|
|
7507
7514
|
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 ");
|
|
7508
7515
|
});
|
|
@@ -7530,7 +7537,7 @@ var StyledFormControlLabel$1 = styled$2(FormControlLabel)(templateObject_8$3 ||
|
|
|
7530
7537
|
var borders = getBorders(props);
|
|
7531
7538
|
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 ");
|
|
7532
7539
|
});
|
|
7533
|
-
var templateObject_1$
|
|
7540
|
+
var templateObject_1$z, templateObject_2$m, templateObject_3$g, templateObject_4$d, templateObject_5$9, templateObject_6$8, templateObject_7$4, templateObject_8$3;
|
|
7534
7541
|
|
|
7535
7542
|
/**
|
|
7536
7543
|
* @see https://mui.com/material-ui/react-checkbox/
|
|
@@ -7565,7 +7572,7 @@ var intentToColor = {
|
|
|
7565
7572
|
notice: "notice",
|
|
7566
7573
|
positive: "positive",
|
|
7567
7574
|
};
|
|
7568
|
-
var StyledRadioDot = styled$2("span")(templateObject_1$
|
|
7575
|
+
var StyledRadioDot = styled$2("span")(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7569
7576
|
var _a;
|
|
7570
7577
|
var semanticColors = getSemanticColors(props);
|
|
7571
7578
|
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 ");
|
|
@@ -7578,13 +7585,13 @@ var StyledRadioDefaultIcon = styled$2("span")(templateObject_2$l || (templateObj
|
|
|
7578
7585
|
var borderColor = intentToColor[intent];
|
|
7579
7586
|
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 ");
|
|
7580
7587
|
});
|
|
7581
|
-
var StyledRadioCheckedIcon = styled$2("div")(templateObject_3$
|
|
7588
|
+
var StyledRadioCheckedIcon = styled$2("div")(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7582
7589
|
var _a;
|
|
7583
7590
|
var iconSizes = getIconSizes(props);
|
|
7584
7591
|
var semanticColors = getSemanticColors(props);
|
|
7585
7592
|
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 ");
|
|
7586
7593
|
});
|
|
7587
|
-
var StyledRadioButton = styled$2(Radio)(templateObject_4$
|
|
7594
|
+
var StyledRadioButton = styled$2(Radio)(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7588
7595
|
var spaces = getSpaces(props);
|
|
7589
7596
|
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 ");
|
|
7590
7597
|
});
|
|
@@ -7610,7 +7617,7 @@ var StyledFormControlLabel = styled$2(FormControlLabel)(templateObject_8$2 || (t
|
|
|
7610
7617
|
var semanticColors = getSemanticColors(props);
|
|
7611
7618
|
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 ");
|
|
7612
7619
|
});
|
|
7613
|
-
var templateObject_1$
|
|
7620
|
+
var templateObject_1$y, templateObject_2$l, templateObject_3$f, templateObject_4$c, templateObject_5$8, templateObject_6$7, templateObject_7$3, templateObject_8$2;
|
|
7614
7621
|
|
|
7615
7622
|
/**
|
|
7616
7623
|
* @see https://mui.com/material-ui/react-radio-button/
|
|
@@ -7656,11 +7663,11 @@ var disabledSlider = function (props) {
|
|
|
7656
7663
|
var semanticColors = getSemanticColors(props);
|
|
7657
7664
|
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 ");
|
|
7658
7665
|
};
|
|
7659
|
-
var StyledSlider = styled$2(Slider)(templateObject_1$
|
|
7666
|
+
var StyledSlider = styled$2(Slider)(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
7660
7667
|
var disabled = props.disabled;
|
|
7661
7668
|
return "\n ".concat(inputSlider(props), "\n ").concat(horizontal(props), "\n ").concat(disabled ? disabledSlider(props) : "", "\n ");
|
|
7662
7669
|
});
|
|
7663
|
-
var templateObject_1$
|
|
7670
|
+
var templateObject_1$x;
|
|
7664
7671
|
|
|
7665
7672
|
/**
|
|
7666
7673
|
* @see https://mui.com/material-ui/react-slider/
|
|
@@ -7675,7 +7682,7 @@ var applyIntentColor = function (props, intent) {
|
|
|
7675
7682
|
var _a, _b, _c, _d;
|
|
7676
7683
|
var borders = getBorders(props);
|
|
7677
7684
|
var semanticColors = getSemanticColors(props);
|
|
7678
|
-
return css(templateObject_1$
|
|
7685
|
+
return css(templateObject_1$w || (templateObject_1$w = __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);
|
|
7679
7686
|
};
|
|
7680
7687
|
var disabledStyled$1 = function (props) {
|
|
7681
7688
|
var _a, _b, _c;
|
|
@@ -7685,9 +7692,9 @@ var disabledStyled$1 = function (props) {
|
|
|
7685
7692
|
};
|
|
7686
7693
|
var textArea = function (props) {
|
|
7687
7694
|
var spaces = getSpaces(props);
|
|
7688
|
-
return css(templateObject_3$
|
|
7695
|
+
return css(templateObject_3$e || (templateObject_3$e = __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);
|
|
7689
7696
|
};
|
|
7690
|
-
var StyledLabel$1 = styled$2("label")(templateObject_4$
|
|
7697
|
+
var StyledLabel$1 = styled$2("label")(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n display: block;\n ", "\n\n ", "\n"], ["\n display: block;\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
7691
7698
|
var spaces = getSpaces(props);
|
|
7692
7699
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
7693
7700
|
});
|
|
@@ -7696,14 +7703,15 @@ var StyledInputBase = styled$2(TextField, {
|
|
|
7696
7703
|
return !sdsPropNames$1.includes(prop.toString());
|
|
7697
7704
|
},
|
|
7698
7705
|
})(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7699
|
-
var _a, _b, _c;
|
|
7706
|
+
var _a, _b, _c, _d;
|
|
7700
7707
|
var intent = props.intent, sdsType = props.sdsType, disabled = props.disabled;
|
|
7701
7708
|
var spaces = getSpaces(props);
|
|
7702
7709
|
var borders = getBorders(props);
|
|
7703
7710
|
var corners = getCorners(props);
|
|
7704
|
-
|
|
7711
|
+
var semanticColors = getSemanticColors(props);
|
|
7712
|
+
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 &::placeholder {\n color: ", ";\n opacity: 1;\n }\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 &::placeholder {\n color: ", ";\n opacity: 1;\n }\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, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textTertiary, outlinedInputClasses.input, focusVisibleA11yStyle(props), outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_c = borders === null || borders === void 0 ? void 0 : borders.base) === null || _c === void 0 ? void 0 : _c.hover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_d = borders === null || borders === void 0 ? void 0 : borders.accent) === null || _d === void 0 ? void 0 : _d.default, sdsType === "textArea" && textArea(props), intent === "negative" && applyIntentColor(props, "negative"), intent === "notice" && applyIntentColor(props, "notice"), intent === "positive" && applyIntentColor(props, "positive"), disabled && disabledStyled$1(props));
|
|
7705
7713
|
});
|
|
7706
|
-
var templateObject_1$
|
|
7714
|
+
var templateObject_1$w, templateObject_2$k, templateObject_3$e, templateObject_4$b, templateObject_5$7, templateObject_6$6;
|
|
7707
7715
|
|
|
7708
7716
|
/**
|
|
7709
7717
|
* @see https://mui.com/material-ui/react-text-field/
|
|
@@ -7764,11 +7772,11 @@ var toggleOff = function (props) {
|
|
|
7764
7772
|
: (_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 &&
|
|
7765
7773
|
"&: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 ");
|
|
7766
7774
|
};
|
|
7767
|
-
var Toggle = styled$2(Switch)(templateObject_1$
|
|
7775
|
+
var Toggle = styled$2(Switch)(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7768
7776
|
var checked = props.checked;
|
|
7769
7777
|
return "\n ".concat(toggle(props), "\n ").concat(checked ? toggleOn(props) : toggleOff(props), "\n ");
|
|
7770
7778
|
});
|
|
7771
|
-
var templateObject_1$
|
|
7779
|
+
var templateObject_1$v;
|
|
7772
7780
|
|
|
7773
7781
|
/**
|
|
7774
7782
|
* @see https://mui.com/material-ui/react-switch/
|
|
@@ -7790,7 +7798,7 @@ var doNotForwardProps$h = ["sdsStyle", "sdsSize", "fontWeight"];
|
|
|
7790
7798
|
var defaultStyle = function (props) {
|
|
7791
7799
|
var _a, _b, _c, _d;
|
|
7792
7800
|
var semanticColors = getSemanticColors(props);
|
|
7793
|
-
return css(templateObject_1$
|
|
7801
|
+
return css(templateObject_1$u || (templateObject_1$u = __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);
|
|
7794
7802
|
};
|
|
7795
7803
|
var dashedStyle = function () {
|
|
7796
7804
|
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 "])));
|
|
@@ -7805,11 +7813,11 @@ var StyledLink = styled$2(Link$1, {
|
|
|
7805
7813
|
shouldForwardProp: function (prop) {
|
|
7806
7814
|
return !doNotForwardProps$h.includes(prop.toString());
|
|
7807
7815
|
},
|
|
7808
|
-
})(templateObject_4$
|
|
7816
|
+
})(templateObject_4$a || (templateObject_4$a = __makeTemplateObject(["\n all: unset;\n\n ", "\n\n ", "\n"], ["\n all: unset;\n\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
7809
7817
|
var _a = props.fontWeight, fontWeight = _a === void 0 ? "normal" : _a, sdsStyle = props.sdsStyle, _b = props.sdsSize, sdsSize = _b === void 0 ? "s" : _b;
|
|
7810
|
-
return css(templateObject_3$
|
|
7818
|
+
return css(templateObject_3$d || (templateObject_3$d = __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");
|
|
7811
7819
|
});
|
|
7812
|
-
var templateObject_1$
|
|
7820
|
+
var templateObject_1$u, templateObject_2$j, templateObject_3$d, templateObject_4$a;
|
|
7813
7821
|
|
|
7814
7822
|
/**
|
|
7815
7823
|
* @see https://mui.com/material-ui/react-link/
|
|
@@ -7827,7 +7835,7 @@ var Link = forwardRef(function (props, ref) {
|
|
|
7827
7835
|
var doNotForwardProps$g = ["marginBottom", "ordered"];
|
|
7828
7836
|
var StyledList = styled$2(List$1, {
|
|
7829
7837
|
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
7830
|
-
})(templateObject_1$
|
|
7838
|
+
})(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n .MuiListSubheader-root {\n ", "\n }\n\n ", "\n"], ["\n .MuiListSubheader-root {\n ", "\n }\n\n ", "\n"])), propsToMarginBottom$1, function (props) {
|
|
7831
7839
|
if (!props.ordered)
|
|
7832
7840
|
return "";
|
|
7833
7841
|
return "\n counter-reset: section;\n ";
|
|
@@ -7845,7 +7853,7 @@ function propsToMarginBottom$1(props) {
|
|
|
7845
7853
|
var marginBottom = props.marginBottom;
|
|
7846
7854
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "s"], "px;\n ");
|
|
7847
7855
|
}
|
|
7848
|
-
var templateObject_1$
|
|
7856
|
+
var templateObject_1$t;
|
|
7849
7857
|
|
|
7850
7858
|
/**
|
|
7851
7859
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7865,7 +7873,7 @@ var fontBodyXxxs = fontBody("xxxs");
|
|
|
7865
7873
|
var doNotForwardProps$f = ["marginBottom", "fontSize", "ordered"];
|
|
7866
7874
|
var StyledListItem = styled$2(ListItem$1, {
|
|
7867
7875
|
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
7868
|
-
})(templateObject_1$
|
|
7876
|
+
})(templateObject_1$s || (templateObject_1$s = __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) {
|
|
7869
7877
|
var ordered = props.ordered;
|
|
7870
7878
|
return "\n align-items: flex-start;\n ".concat(ordered ? "counter-increment: section;" : "", "\n ");
|
|
7871
7879
|
}, function (props) {
|
|
@@ -7900,7 +7908,7 @@ var ListItemLabel = styled$2("span")(templateObject_2$i || (templateObject_2$i =
|
|
|
7900
7908
|
var fontWeights = getFontWeights(props);
|
|
7901
7909
|
return "\n font-weight: ".concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n ");
|
|
7902
7910
|
});
|
|
7903
|
-
var templateObject_1$
|
|
7911
|
+
var templateObject_1$s, templateObject_2$i;
|
|
7904
7912
|
|
|
7905
7913
|
/**
|
|
7906
7914
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7910,11 +7918,11 @@ var ListItem = function (props) {
|
|
|
7910
7918
|
};
|
|
7911
7919
|
|
|
7912
7920
|
var fontHeaderM = fontHeader("m");
|
|
7913
|
-
var StyledListSubheader = styled$2(ListSubheader$1)(templateObject_1$
|
|
7921
|
+
var StyledListSubheader = styled$2(ListSubheader$1)(templateObject_1$r || (templateObject_1$r = __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) {
|
|
7914
7922
|
var spaces = getSpaces(props);
|
|
7915
7923
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n ");
|
|
7916
7924
|
});
|
|
7917
|
-
var templateObject_1$
|
|
7925
|
+
var templateObject_1$r;
|
|
7918
7926
|
|
|
7919
7927
|
/**
|
|
7920
7928
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7923,7 +7931,7 @@ var ListSubheader = function (props) {
|
|
|
7923
7931
|
return jsx(StyledListSubheader, __assign({ disableGutters: true }, props));
|
|
7924
7932
|
};
|
|
7925
7933
|
|
|
7926
|
-
var StyledText = styled$2("span")(templateObject_1$
|
|
7934
|
+
var StyledText = styled$2("span")(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7927
7935
|
var spaces = getSpaces(props);
|
|
7928
7936
|
return "\n margin: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
7929
7937
|
});
|
|
@@ -7937,7 +7945,7 @@ var tag = function (props) {
|
|
|
7937
7945
|
var _a, _b, _c;
|
|
7938
7946
|
var corners = getCorners(props);
|
|
7939
7947
|
var semanticColors = getSemanticColors(props);
|
|
7940
|
-
return css(templateObject_3$
|
|
7948
|
+
return css(templateObject_3$c || (templateObject_3$c = __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);
|
|
7941
7949
|
};
|
|
7942
7950
|
var doNotForwardProps$e = ["sdsStyle"];
|
|
7943
7951
|
var StyledLoadingIndicator = styled$2("div", {
|
|
@@ -7945,23 +7953,23 @@ var StyledLoadingIndicator = styled$2("div", {
|
|
|
7945
7953
|
})(templateObject_6$5 || (templateObject_6$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7946
7954
|
var sdsStyle = props.sdsStyle;
|
|
7947
7955
|
var spaces = getSpaces(props);
|
|
7948
|
-
var style = css(templateObject_4$
|
|
7956
|
+
var style = css(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n display: inline-flex;\n align-items: center;\n padding: ", "px;\n "], ["\n display: inline-flex;\n align-items: center;\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxs);
|
|
7949
7957
|
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));
|
|
7950
7958
|
});
|
|
7951
|
-
var templateObject_1$
|
|
7959
|
+
var templateObject_1$q, templateObject_2$h, templateObject_3$c, templateObject_4$9, templateObject_5$6, templateObject_6$5;
|
|
7952
7960
|
|
|
7953
7961
|
var LoadingIndicator = function (_a) {
|
|
7954
7962
|
var ariaLabel = _a["aria-label"], sdsStyle = _a.sdsStyle;
|
|
7955
7963
|
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" })] }));
|
|
7956
7964
|
};
|
|
7957
7965
|
|
|
7958
|
-
var StyledMenu = styled$2(Menu$1)(templateObject_1$
|
|
7966
|
+
var StyledMenu = styled$2(Menu$1)(templateObject_1$p || (templateObject_1$p = __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) {
|
|
7959
7967
|
var _a;
|
|
7960
7968
|
var spaces = getSpaces(props);
|
|
7961
7969
|
var semanticColors = getSemanticColors(props);
|
|
7962
7970
|
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 ");
|
|
7963
7971
|
});
|
|
7964
|
-
var templateObject_1$
|
|
7972
|
+
var templateObject_1$p;
|
|
7965
7973
|
|
|
7966
7974
|
var ANCHOR_ORIGIN = {
|
|
7967
7975
|
horizontal: "center",
|
|
@@ -7978,7 +7986,7 @@ var Menu = function (props) {
|
|
|
7978
7986
|
return (jsx(StyledMenu, __assign({ anchorOrigin: ANCHOR_ORIGIN, transformOrigin: TRANSFORM_ORIGIN }, props)));
|
|
7979
7987
|
};
|
|
7980
7988
|
|
|
7981
|
-
var StyledMenuItem = styled$2(MenuItem)(templateObject_1$
|
|
7989
|
+
var StyledMenuItem = styled$2(MenuItem)(templateObject_1$o || (templateObject_1$o = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
7982
7990
|
var doNotForwardProps$d = ["search", "InputBaseProps", "keepSearchOnSelect"];
|
|
7983
7991
|
// (thuang): Casting the type to `Autocomplete`
|
|
7984
7992
|
// per https://github.com/mui-org/material-ui/issues/21727#issuecomment-880263271
|
|
@@ -7990,7 +7998,7 @@ var StyledAutocomplete = styled$2(Autocomplete$1, {
|
|
|
7990
7998
|
});
|
|
7991
7999
|
var InputBaseWrapper = styled$2("div", {
|
|
7992
8000
|
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
7993
|
-
})(templateObject_3$
|
|
8001
|
+
})(templateObject_3$b || (templateObject_3$b = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7994
8002
|
var search = props.search;
|
|
7995
8003
|
if (!search) {
|
|
7996
8004
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -8003,11 +8011,11 @@ var InputBaseWrapper = styled$2("div", {
|
|
|
8003
8011
|
});
|
|
8004
8012
|
var StyledMenuInputSearch = styled$2(InputSearch, {
|
|
8005
8013
|
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
8006
|
-
})(templateObject_4$
|
|
8014
|
+
})(templateObject_4$8 || (templateObject_4$8 = __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) {
|
|
8007
8015
|
var search = _a.search;
|
|
8008
8016
|
return (search ? "auto" : "transparent");
|
|
8009
8017
|
});
|
|
8010
|
-
var templateObject_1$
|
|
8018
|
+
var templateObject_1$o, templateObject_2$g, templateObject_3$b, templateObject_4$8;
|
|
8011
8019
|
|
|
8012
8020
|
/**
|
|
8013
8021
|
* @see https://mui.com/material-ui/react-autocomplete/
|
|
@@ -8061,13 +8069,13 @@ var MenuSelect = function (props) {
|
|
|
8061
8069
|
var doNotForwardProps$c = ["hasInvertedStyle", "isNarrow"];
|
|
8062
8070
|
var StyledFooter = styled$2("footer", {
|
|
8063
8071
|
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8064
|
-
})(templateObject_3$
|
|
8072
|
+
})(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
8065
8073
|
var isNarrow = props.isNarrow;
|
|
8066
8074
|
var spaces = getSpaces(props);
|
|
8067
8075
|
var semanticColors = getSemanticColors(props);
|
|
8068
8076
|
return css$2(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n background: ", ";\n padding: ", "px ", "px ", "px\n ", "px;\n\n ", "\n "], ["\n background: ", ";\n padding: ", "px ", "px ", "px\n ", "px;\n\n ", "\n "])), props.hasInvertedStyle
|
|
8069
8077
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimaryInverse
|
|
8070
|
-
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, spaces === null || spaces === void 0 ? void 0 : spaces.xl, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, isNarrow && css$2(templateObject_1$
|
|
8078
|
+
: 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$n || (templateObject_1$n = __makeTemplateObject(["\n border-top: 1px solid\n ", ";\n padding: ", "px ", "px ", "px ", "px;\n "], ["\n border-top: 1px solid\n ", ";\n padding: ", "px ", "px ", "px ", "px;\n "])), props.hasInvertedStyle
|
|
8071
8079
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
8072
8080
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider, spaces === null || spaces === void 0 ? void 0 : spaces.xl, spaces === null || spaces === void 0 ? void 0 : spaces.xl, spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8073
8081
|
});
|
|
@@ -8075,7 +8083,7 @@ var StyledLogoWrapper$1 = styled$2("div", {
|
|
|
8075
8083
|
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
8076
8084
|
})(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n ", "\n\n p {\n ", "\n ", "\n\n ", "\n }\n"], ["\n ", "\n\n p {\n ", "\n ", "\n\n ", "\n }\n"])), function (props) {
|
|
8077
8085
|
var spaces = getSpaces(props);
|
|
8078
|
-
return css$2(templateObject_4$
|
|
8086
|
+
return css$2(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n gap: ", "px;\n\n a {\n text-decoration: none;\n }\n\n .MuiChip-root {\n margin: 0;\n }\n "], ["\n display: flex;\n align-items: center;\n gap: ", "px;\n\n a {\n text-decoration: none;\n }\n\n .MuiChip-root {\n margin: 0;\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s);
|
|
8079
8087
|
}, fontHeader("l"), fontHeader("l", /* isNarrow */ true), function (props) {
|
|
8080
8088
|
var semanticColors = getSemanticColors(props);
|
|
8081
8089
|
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
|
|
@@ -8106,11 +8114,11 @@ var StyledLinkSection = styled$2("div", {
|
|
|
8106
8114
|
})(templateObject_15$1 || (templateObject_15$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n\n .MuiDivider-root {\n height: 18px;\n }\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n\n .MuiDivider-root {\n height: 18px;\n }\n\n ", "\n"])), function (props) {
|
|
8107
8115
|
var isNarrow = props.isNarrow;
|
|
8108
8116
|
var spaces = getSpaces(props);
|
|
8109
|
-
return css$2(templateObject_14$1 || (templateObject_14$1 = __makeTemplateObject(["\n gap: ", "px;\n\n ", "\n "], ["\n gap: ", "px;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.
|
|
8117
|
+
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.l, isNarrow && css$2(templateObject_13$1 || (templateObject_13$1 = __makeTemplateObject(["\n margin-top: ", "px;\n flex-direction: column;\n "], ["\n margin-top: ", "px;\n flex-direction: column;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8110
8118
|
});
|
|
8111
|
-
var StyledMobileLinkRow = styled$2.div(templateObject_16$1 || (templateObject_16$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n\n ", "\n"])), function (props) {
|
|
8119
|
+
var StyledMobileLinkRow = styled$2.div(templateObject_16$1 || (templateObject_16$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n\n ", "\n"])), function (props) {
|
|
8112
8120
|
var spaces = getSpaces(props);
|
|
8113
|
-
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.
|
|
8121
|
+
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n ");
|
|
8114
8122
|
});
|
|
8115
8123
|
var StyledImageSection = styled$2("div", {
|
|
8116
8124
|
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
@@ -8119,7 +8127,7 @@ var StyledImageSection = styled$2("div", {
|
|
|
8119
8127
|
var spaces = getSpaces(props);
|
|
8120
8128
|
return css$2(templateObject_18$1 || (templateObject_18$1 = __makeTemplateObject(["\n padding-left: ", "px;\n gap: ", "px;\n\n ", "\n "], ["\n padding-left: ", "px;\n gap: ", "px;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, isNarrow && css$2(templateObject_17$1 || (templateObject_17$1 = __makeTemplateObject(["\n padding-left: 0;\n gap: ", "px;\n flex-direction: column;\n justify-content: center;\n "], ["\n padding-left: 0;\n gap: ", "px;\n flex-direction: column;\n justify-content: center;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8121
8129
|
});
|
|
8122
|
-
var StyledMobileImageRow = styled$2.div(templateObject_20$1 || (templateObject_20$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n\n ", "\n"])), function (props) {
|
|
8130
|
+
var StyledMobileImageRow = styled$2.div(templateObject_20$1 || (templateObject_20$1 = __makeTemplateObject(["\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n\n ", "\n"], ["\n align-items: center;\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n\n ", "\n"])), function (props) {
|
|
8123
8131
|
var spaces = getSpaces(props);
|
|
8124
8132
|
return "\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;\n ");
|
|
8125
8133
|
});
|
|
@@ -8130,7 +8138,7 @@ var StyledBottomSection = styled$2("div", {
|
|
|
8130
8138
|
var spaces = getSpaces(props);
|
|
8131
8139
|
return css$2(templateObject_22$1 || (templateObject_22$1 = __makeTemplateObject(["\n margin-top: ", "px;\n\n ", "\n "], ["\n margin-top: ", "px;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, isNarrow && css$2(templateObject_21$1 || (templateObject_21$1 = __makeTemplateObject(["\n flex-direction: column-reverse;\n margin-top: ", "px;\n "], ["\n flex-direction: column-reverse;\n margin-top: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl));
|
|
8132
8140
|
});
|
|
8133
|
-
var templateObject_1$
|
|
8141
|
+
var templateObject_1$n, templateObject_2$f, templateObject_3$a, templateObject_4$7, templateObject_5$5, templateObject_6$4, templateObject_7$2, templateObject_8$1, templateObject_9$1, templateObject_10$1, templateObject_11$1, templateObject_12$1, templateObject_13$1, templateObject_14$1, templateObject_15$1, templateObject_16$1, templateObject_17$1, templateObject_18$1, templateObject_19$1, templateObject_20$1, templateObject_21$1, templateObject_22$1, templateObject_23$1;
|
|
8134
8142
|
|
|
8135
8143
|
/**
|
|
8136
8144
|
* WARNING: Don't import this directly.
|
|
@@ -14153,7 +14161,7 @@ function useTheme() {
|
|
|
14153
14161
|
var doNotForwardProps$b = ["hasInvertedStyle", "isNarrow"];
|
|
14154
14162
|
var NarrowNavItemLinkStyles = function (props) {
|
|
14155
14163
|
var semanticColors = getSemanticColors(props);
|
|
14156
|
-
return css$2(templateObject_1$
|
|
14164
|
+
return css$2(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n min-height: 48px;\n text-align: center;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:hover {\n color: ", ";\n background: ", ";\n }\n "], ["\n min-height: 48px;\n text-align: center;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n\n &:hover {\n color: ", ";\n background: ", ";\n }\n "])), props.hasInvertedStyle
|
|
14157
14165
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14158
14166
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, props.hasInvertedStyle
|
|
14159
14167
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondaryInverse
|
|
@@ -14161,7 +14169,7 @@ var NarrowNavItemLinkStyles = function (props) {
|
|
|
14161
14169
|
};
|
|
14162
14170
|
var StyledNavItemLink = styled$2(Link, {
|
|
14163
14171
|
shouldForwardProp: function (prop) { return !doNotForwardProps$b.includes(prop); },
|
|
14164
|
-
})(templateObject_3$
|
|
14172
|
+
})(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontHeader("m"), fontBody("s", "regular", /* isNarrow */ true), function (props) {
|
|
14165
14173
|
var isNarrow = props.isNarrow;
|
|
14166
14174
|
var semanticColors = getSemanticColors(props);
|
|
14167
14175
|
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
|
|
@@ -14170,7 +14178,7 @@ var StyledNavItemLink = styled$2(Link, {
|
|
|
14170
14178
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14171
14179
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, isNarrow && NarrowNavItemLinkStyles(props));
|
|
14172
14180
|
});
|
|
14173
|
-
var templateObject_1$
|
|
14181
|
+
var templateObject_1$m, templateObject_2$e, templateObject_3$9;
|
|
14174
14182
|
|
|
14175
14183
|
var NavItem = memo(function (_a) {
|
|
14176
14184
|
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow;
|
|
@@ -14178,39 +14186,102 @@ var NavItem = memo(function (_a) {
|
|
|
14178
14186
|
});
|
|
14179
14187
|
NavItem.displayName = "NavItem";
|
|
14180
14188
|
|
|
14181
|
-
var doNotForwardProps$a = ["hasInvertedStyle"];
|
|
14189
|
+
var doNotForwardProps$a = ["hasInvertedStyle", "showDivider"];
|
|
14182
14190
|
var StyledLinkItemLink = styled$2(Link, {
|
|
14183
14191
|
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
14184
|
-
})(
|
|
14192
|
+
})(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBody("xxs", "regular"), function (props) {
|
|
14193
|
+
var showDivider = props.showDivider, hasInvertedStyle = props.hasInvertedStyle;
|
|
14194
|
+
var spaces = getSpaces(props);
|
|
14185
14195
|
var semanticColors = getSemanticColors(props);
|
|
14186
|
-
return "\n color: "
|
|
14196
|
+
return css$2(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n color: ", ";\n white-space: nowrap;\n position: relative;\n\n &:hover {\n color: ", ";\n text-decoration: none;\n }\n\n ", "\n "], ["\n color: ", ";\n white-space: nowrap;\n position: relative;\n\n &:hover {\n color: ", ";\n text-decoration: none;\n }\n\n ", "\n "])), hasInvertedStyle
|
|
14197
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondaryInverse
|
|
14198
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textSecondary, hasInvertedStyle
|
|
14199
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14200
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, showDivider && css$2(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n &:after {\n content: \"\";\n position: absolute;\n top: 0;\n right: -", "px;\n display: block;\n height: 100%;\n width: 1px;\n margin-left: ", "px;\n background-color: ", ";\n }\n "], ["\n &:after {\n content: \"\";\n position: absolute;\n top: 0;\n right: -", "px;\n display: block;\n height: 100%;\n width: 1px;\n margin-left: ", "px;\n background-color: ", ";\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.s, hasInvertedStyle
|
|
14201
|
+
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
14202
|
+
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider));
|
|
14187
14203
|
});
|
|
14188
14204
|
var StyledDivider = styled$2(Divider, {
|
|
14189
14205
|
shouldForwardProp: function (prop) { return !doNotForwardProps$a.includes(prop); },
|
|
14190
|
-
})(
|
|
14206
|
+
})(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14191
14207
|
var semanticColors = getSemanticColors(props);
|
|
14192
14208
|
return "\n border-color: ".concat(props.hasInvertedStyle
|
|
14193
14209
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
14194
14210
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider, ";\n ");
|
|
14195
14211
|
});
|
|
14196
|
-
var templateObject_1$
|
|
14212
|
+
var templateObject_1$l, templateObject_2$d, templateObject_3$8, templateObject_4$6;
|
|
14197
14213
|
|
|
14198
|
-
var FooterLink = memo(function (_a) {
|
|
14214
|
+
var FooterLink = memo(forwardRef(function (_a, ref) {
|
|
14199
14215
|
var link = _a.link, showDivider = _a.showDivider, hasInvertedStyle = _a.hasInvertedStyle;
|
|
14200
|
-
return (
|
|
14201
|
-
});
|
|
14216
|
+
return (jsx(Fragment, { children: jsx(StyledLinkItemLink, __assign({ ref: ref, href: link.url, hasInvertedStyle: hasInvertedStyle, component: link.component, showDivider: showDivider }, link.linkProps, { children: link.label }), link.label) }));
|
|
14217
|
+
}));
|
|
14202
14218
|
FooterLink.displayName = "FooterLink";
|
|
14203
14219
|
|
|
14204
|
-
|
|
14205
|
-
|
|
14206
|
-
|
|
14207
|
-
|
|
14208
|
-
|
|
14209
|
-
|
|
14210
|
-
|
|
14220
|
+
/**
|
|
14221
|
+
* A custom hook that detects the last item in each row of a wrapped layout.
|
|
14222
|
+
*
|
|
14223
|
+
* Neither CSS Flexbox nor CSS Grid provide a built-in way to identify the last item
|
|
14224
|
+
* in a visually wrapped row. Since items can wrap dynamically based on screen size,
|
|
14225
|
+
* we rely on measuring their vertical positions in the DOM.
|
|
14226
|
+
*
|
|
14227
|
+
* We iterate through the list of items and compare their offsetTop values. If an item
|
|
14228
|
+
* has a higher offsetTop than the previous one, it means it started a new row, so the
|
|
14229
|
+
* previous item was the last in its row.
|
|
14230
|
+
*
|
|
14231
|
+
* A ResizeObserver is used to re-run this logic whenever the container resizes, ensuring it
|
|
14232
|
+
* stays accurate in responsive layouts.
|
|
14233
|
+
*
|
|
14234
|
+
* @param containerRef - A ref to the container element
|
|
14235
|
+
* @param itemRefs - An array of refs to the items
|
|
14236
|
+
* @returns A Set of last items in each row
|
|
14237
|
+
*/
|
|
14238
|
+
var useLastInRow = function (containerRef, itemRefs) {
|
|
14239
|
+
var _a = useState(new Set()), lastItems = _a[0], setLastItems = _a[1];
|
|
14240
|
+
useEffect(function () {
|
|
14241
|
+
var updateLastInRow = function () {
|
|
14242
|
+
var items = itemRefs.current.filter(Boolean);
|
|
14243
|
+
var currentTop = null;
|
|
14244
|
+
var newSet = new Set();
|
|
14245
|
+
items.forEach(function (item, index) {
|
|
14246
|
+
if (currentTop === null) {
|
|
14247
|
+
currentTop = item.offsetTop;
|
|
14248
|
+
}
|
|
14249
|
+
else if (item.offsetTop > currentTop) {
|
|
14250
|
+
newSet.add(index - 1);
|
|
14251
|
+
currentTop = item.offsetTop;
|
|
14252
|
+
}
|
|
14253
|
+
});
|
|
14254
|
+
if (items.length > 0) {
|
|
14255
|
+
newSet.add(items.length - 1);
|
|
14256
|
+
}
|
|
14257
|
+
setLastItems(newSet);
|
|
14258
|
+
};
|
|
14259
|
+
updateLastInRow();
|
|
14260
|
+
var resizeObserver = new ResizeObserver(function () {
|
|
14261
|
+
updateLastInRow();
|
|
14262
|
+
});
|
|
14263
|
+
if (containerRef.current) {
|
|
14264
|
+
resizeObserver.observe(containerRef.current);
|
|
14265
|
+
}
|
|
14266
|
+
return function () { return resizeObserver.disconnect(); };
|
|
14267
|
+
}, [containerRef, itemRefs]);
|
|
14268
|
+
return lastItems;
|
|
14269
|
+
};
|
|
14270
|
+
|
|
14271
|
+
var MobileLinkRow = memo(function (_a) {
|
|
14272
|
+
var links = _a.links, hasInvertedStyle = _a.hasInvertedStyle;
|
|
14273
|
+
var containerRef = useRef(null);
|
|
14274
|
+
var itemRefs = useRef([]);
|
|
14275
|
+
var noDividerIndices = useLastInRow(containerRef, itemRefs);
|
|
14276
|
+
return (jsx(StyledMobileLinkRow, { ref: containerRef, children: links.map(function (link, index) { return (jsx(FooterLink, { link: link, showDivider: !noDividerIndices.has(index), hasInvertedStyle: hasInvertedStyle, ref: function (el) {
|
|
14277
|
+
itemRefs.current[index] = el;
|
|
14278
|
+
} }, link.label)); }) }));
|
|
14279
|
+
});
|
|
14280
|
+
MobileLinkRow.displayName = "MobileLinkRow";
|
|
14281
|
+
|
|
14211
14282
|
var MemoizedStyledDivider = memo(StyledDivider);
|
|
14212
14283
|
function NavigationFooter(_a) {
|
|
14213
|
-
var hasInvertedStyle = _a.hasInvertedStyle, images = _a.images, logo = _a.logo, logoUrl = _a.logoUrl, navItems = _a.navItems, navLinks = _a.navLinks, tag = _a.tag, tagColor = _a.tagColor, title = _a.title, rest = __rest(_a, ["hasInvertedStyle", "images", "logo", "logoUrl", "navItems", "navLinks", "tag", "tagColor", "title"]);
|
|
14284
|
+
var hasInvertedStyle = _a.hasInvertedStyle, images = _a.images, logo = _a.logo, logoUrl = _a.logoUrl, logoComponent = _a.logoComponent, logoLinkProps = _a.logoLinkProps, navItems = _a.navItems, navLinks = _a.navLinks, tag = _a.tag, tagColor = _a.tagColor, title = _a.title, rest = __rest(_a, ["hasInvertedStyle", "images", "logo", "logoUrl", "logoComponent", "logoLinkProps", "navItems", "navLinks", "tag", "tagColor", "title"]);
|
|
14214
14285
|
var footerRef = useRef(null);
|
|
14215
14286
|
var theme = useTheme();
|
|
14216
14287
|
var isMdScreen = useMediaQuery(theme.breakpoints.down("md"));
|
|
@@ -14228,12 +14299,19 @@ function NavigationFooter(_a) {
|
|
|
14228
14299
|
var scrollWidth = footerRef.current.scrollWidth;
|
|
14229
14300
|
var needsScroll = scrollWidth > clientWidth;
|
|
14230
14301
|
setDimensions(function (prev) {
|
|
14231
|
-
var newBreakpoint = needsScroll
|
|
14232
|
-
?
|
|
14302
|
+
var newBreakpoint = needsScroll
|
|
14303
|
+
? prev.breakpoint > scrollWidth
|
|
14304
|
+
? prev.breakpoint
|
|
14305
|
+
: scrollWidth
|
|
14233
14306
|
: prev.breakpoint;
|
|
14307
|
+
var newIsNarrow = prev.isNarrow
|
|
14308
|
+
? clientWidth < newBreakpoint
|
|
14309
|
+
? true
|
|
14310
|
+
: false
|
|
14311
|
+
: needsScroll;
|
|
14234
14312
|
return {
|
|
14235
14313
|
breakpoint: newBreakpoint,
|
|
14236
|
-
isNarrow:
|
|
14314
|
+
isNarrow: newIsNarrow,
|
|
14237
14315
|
};
|
|
14238
14316
|
});
|
|
14239
14317
|
}, []);
|
|
@@ -14248,16 +14326,11 @@ function NavigationFooter(_a) {
|
|
|
14248
14326
|
var renderImages = useCallback(function () {
|
|
14249
14327
|
if (!(images === null || images === void 0 ? void 0 : images.length))
|
|
14250
14328
|
return null;
|
|
14251
|
-
|
|
14252
|
-
|
|
14253
|
-
|
|
14254
|
-
|
|
14255
|
-
|
|
14256
|
-
}
|
|
14257
|
-
return groupArray(images, 2).map(function (imageGroup, index) { return (jsx(StyledMobileImageRow, { children: imageGroup.map(function (_a) {
|
|
14258
|
-
var image = _a.image, url = _a.url;
|
|
14259
|
-
return (jsx(Link, { href: url, children: image }, url));
|
|
14260
|
-
}) }, index)); });
|
|
14329
|
+
var imageElements = images.map(function (_a) {
|
|
14330
|
+
var image = _a.image, url = _a.url, component = _a.component, linkProps = _a.linkProps;
|
|
14331
|
+
return (jsx(Link, __assign({ href: url, component: component }, linkProps, { children: image }), url));
|
|
14332
|
+
});
|
|
14333
|
+
return dimensions.isNarrow ? (jsx(StyledMobileImageRow, { children: imageElements })) : (imageElements);
|
|
14261
14334
|
}, [images, dimensions.isNarrow]);
|
|
14262
14335
|
var renderLinks = useCallback(function () {
|
|
14263
14336
|
if (!(navLinks === null || navLinks === void 0 ? void 0 : navLinks.length))
|
|
@@ -14265,19 +14338,21 @@ function NavigationFooter(_a) {
|
|
|
14265
14338
|
if (!dimensions.isNarrow) {
|
|
14266
14339
|
return navLinks.map(function (link, index) { return (jsx(FooterLink, { link: link, showDivider: index < navLinks.length - 1, hasInvertedStyle: hasInvertedStyle }, link.label)); });
|
|
14267
14340
|
}
|
|
14268
|
-
return
|
|
14341
|
+
return (jsx(MobileLinkRow, { links: navLinks, hasInvertedStyle: hasInvertedStyle }));
|
|
14269
14342
|
}, [navLinks, dimensions.isNarrow, hasInvertedStyle]);
|
|
14270
14343
|
var logoNode = useMemo(function () {
|
|
14271
14344
|
var node = (jsxs(StyledLogoWrapper$1, { isNarrow: dimensions.isNarrow, hasInvertedStyle: hasInvertedStyle, children: [logo, jsx("p", { children: title }), tag && jsx(Tag, { tagColor: tagColor, label: tag, hover: false })] }));
|
|
14272
|
-
return logoUrl ? jsx(Link, { href: logoUrl, children: node }) : node;
|
|
14345
|
+
return logoUrl ? (jsx(Link, __assign({ href: logoUrl, component: logoComponent }, logoLinkProps, { children: node }))) : (node);
|
|
14273
14346
|
}, [
|
|
14347
|
+
dimensions.isNarrow,
|
|
14348
|
+
hasInvertedStyle,
|
|
14274
14349
|
logo,
|
|
14275
14350
|
title,
|
|
14276
14351
|
tag,
|
|
14277
14352
|
tagColor,
|
|
14278
14353
|
logoUrl,
|
|
14279
|
-
|
|
14280
|
-
|
|
14354
|
+
logoComponent,
|
|
14355
|
+
logoLinkProps,
|
|
14281
14356
|
]);
|
|
14282
14357
|
var navItemsSection = useMemo(function () {
|
|
14283
14358
|
if (!(navItems === null || navItems === void 0 ? void 0 : navItems.length))
|
|
@@ -14295,15 +14370,15 @@ var doNotForwardProps$9 = [
|
|
|
14295
14370
|
"logoLinkComponent",
|
|
14296
14371
|
"logoLinkProps",
|
|
14297
14372
|
];
|
|
14298
|
-
var
|
|
14373
|
+
var StyledAppBar = styled$2(AppBar, {
|
|
14299
14374
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14300
|
-
})(templateObject_1$
|
|
14375
|
+
})(templateObject_1$k || (templateObject_1$k = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14301
14376
|
var colors = getSemanticColors(props);
|
|
14302
|
-
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 max-width: 100%;\n max-height: 56px;\n overflow-x: auto;\n ");
|
|
14377
|
+
return "\n background-color: ".concat(props.hasInvertedStyle ? colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimaryInverse : colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimary, ";\n background-image: none;\n max-width: 100%;\n max-height: 56px;\n overflow-x: auto;\n ");
|
|
14303
14378
|
});
|
|
14304
14379
|
var NarrowToolbar = function (props) {
|
|
14305
14380
|
var semanticColors = getSemanticColors(props);
|
|
14306
|
-
return css$2(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n border-bottom: 1px solid\n ", ";\n background: ", ";\n position: sticky !important;\n top: 0;\n z-index: 1000;\n justify-content: space-between;\n "], ["\n border-bottom: 1px solid\n ", ";\n background: ", ";\n position: sticky !important;\n top: 0;\n z-index: 1000;\n justify-content: space-between;\n "])), props.hasInvertedStyle
|
|
14381
|
+
return css$2(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n border-bottom: 1px solid\n ", ";\n background-color: ", ";\n background-image: none;\n box-shadow: none;\n position: sticky !important;\n top: 0;\n z-index: 1000;\n justify-content: space-between;\n "], ["\n border-bottom: 1px solid\n ", ";\n background-color: ", ";\n background-image: none;\n box-shadow: none;\n position: sticky !important;\n top: 0;\n z-index: 1000;\n justify-content: space-between;\n "])), props.hasInvertedStyle
|
|
14307
14382
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.dividerInverse
|
|
14308
14383
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.divider, props.hasInvertedStyle
|
|
14309
14384
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundPrimaryInverse
|
|
@@ -14316,13 +14391,13 @@ var StyledToolbar = styled$2(Toolbar, {
|
|
|
14316
14391
|
var spaces = getSpaces(props);
|
|
14317
14392
|
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));
|
|
14318
14393
|
});
|
|
14319
|
-
|
|
14394
|
+
styled$2("div", {
|
|
14320
14395
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14321
14396
|
})(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14322
14397
|
var shadows = getShadows(props);
|
|
14323
14398
|
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 ");
|
|
14324
14399
|
});
|
|
14325
|
-
|
|
14400
|
+
styled$2("div", {
|
|
14326
14401
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14327
14402
|
})(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14328
14403
|
var colors = getSemanticColors(props);
|
|
@@ -14358,7 +14433,7 @@ var StyledWideIconButton = styled$2(Button, {
|
|
|
14358
14433
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14359
14434
|
})(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14360
14435
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
14361
|
-
return css$2(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), hasInvertedStyle && invertedWideButtonStyles(props));
|
|
14436
|
+
return css$2(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n margin: 0;\n "], ["\n ", "\n margin: 0;\n "])), hasInvertedStyle && invertedWideButtonStyles(props));
|
|
14362
14437
|
});
|
|
14363
14438
|
var StyledLogoLinkWrapper = styled$2(Link, {
|
|
14364
14439
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
@@ -14367,57 +14442,64 @@ var StyledLogoLinkWrapper = styled$2(Link, {
|
|
|
14367
14442
|
return css$2(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n width: ", ";\n "], ["\n width: ", ";\n "])), isNarrow ? "100%" : "auto");
|
|
14368
14443
|
});
|
|
14369
14444
|
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"])));
|
|
14370
|
-
var NarrowTitleContainer = function (
|
|
14371
|
-
|
|
14372
|
-
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);
|
|
14445
|
+
var NarrowTitleContainer = function () {
|
|
14446
|
+
return css$2(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n p {\n margin: 0px;\n margin-block: 0px;\n }\n "], ["\n p {\n margin: 0px;\n margin-block: 0px;\n }\n "])));
|
|
14373
14447
|
};
|
|
14374
14448
|
var StyledTitleContainer = styled$2("div", {
|
|
14375
14449
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14376
|
-
})(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n
|
|
14450
|
+
})(templateObject_19 || (templateObject_19 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n\n ", "\n"], ["\n display: flex;\n align-items: center;\n\n ", "\n"])), function (props) {
|
|
14377
14451
|
var isNarrow = props.isNarrow;
|
|
14378
14452
|
var colors = getSemanticColors(props);
|
|
14379
14453
|
var spaces = getSpaces(props);
|
|
14380
|
-
return css$2(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n color: ", ";\n margin-right: ", "px;\n width: 100%;\n\n
|
|
14454
|
+
return css$2(templateObject_18 || (templateObject_18 = __makeTemplateObject(["\n gap: ", "px;\n color: ", ";\n margin-right: ", "px;\n width: 100%;\n\n ", "\n "], ["\n gap: ", "px;\n color: ", ";\n margin-right: ", "px;\n width: 100%;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, props.hasInvertedStyle
|
|
14381
14455
|
? colors === null || colors === void 0 ? void 0 : colors.base.textPrimaryInverse
|
|
14382
|
-
: colors === null || colors === void 0 ? void 0 : colors.base.textPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.xxl,
|
|
14456
|
+
: colors === null || colors === void 0 ? void 0 : colors.base.textPrimary, spaces === null || spaces === void 0 ? void 0 : spaces.xxl, isNarrow && NarrowTitleContainer());
|
|
14457
|
+
});
|
|
14458
|
+
var StyledTitleTagWrapper = styled$2("div", {
|
|
14459
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14460
|
+
})(templateObject_20 || (templateObject_20 = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontHeader("l"), fontHeader("l", true), function (props) {
|
|
14461
|
+
var spaces = getSpaces(props);
|
|
14462
|
+
return "\n display: flex;\n align-items: center;\n gap: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n\n p {\n white-space: nowrap;\n }\n ");
|
|
14383
14463
|
});
|
|
14384
|
-
var StyledTag = styled$2(Tag)(
|
|
14464
|
+
var StyledTag = styled$2(Tag)(templateObject_21 || (templateObject_21 = __makeTemplateObject(["\n margin: 1px 0 0 0;\n\n .MuiChip-label {\n ", "\n ", "\n }\n\n &:hover {\n text-decoration: none;\n }\n"], ["\n margin: 1px 0 0 0;\n\n .MuiChip-label {\n ", "\n ", "\n }\n\n &:hover {\n text-decoration: none;\n }\n"])), fontBody("xxxs", "regular"), fontBody("xxxs", "regular", /* isNarrow */ true));
|
|
14385
14465
|
var StyledPrimaryNavContainer = styled$2("div", {
|
|
14386
14466
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14387
|
-
})(
|
|
14467
|
+
})(templateObject_23 || (templateObject_23 = __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) {
|
|
14388
14468
|
var showSearch = props.showSearch, primaryNavPosition = props.primaryNavPosition, isNarrow = props.isNarrow;
|
|
14389
14469
|
var spaces = getSpaces(props);
|
|
14390
14470
|
var primaryNavPositionWithSearch = primaryNavPosition === "left" ? "flex-start" : "space-between";
|
|
14391
14471
|
var primaryNavPositionWithoutSearch = primaryNavPosition === "left" ? "flex-start" : "flex-end";
|
|
14392
|
-
return css$2(
|
|
14472
|
+
return css$2(templateObject_22 || (templateObject_22 = __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
|
|
14393
14473
|
? primaryNavPositionWithSearch
|
|
14394
14474
|
: primaryNavPositionWithoutSearch);
|
|
14395
14475
|
});
|
|
14396
14476
|
var StyledSearch = styled$2(InputSearch, {
|
|
14397
14477
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14398
|
-
})(
|
|
14399
|
-
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
14478
|
+
})(templateObject_25 || (templateObject_25 = __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) {
|
|
14479
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
14400
14480
|
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow;
|
|
14401
14481
|
var spaces = getSpaces(props);
|
|
14402
14482
|
var semanticColors = getSemanticColors(props);
|
|
14403
|
-
return css$2(
|
|
14483
|
+
return css$2(templateObject_24 || (templateObject_24 = __makeTemplateObject(["\n max-width: ", ";\n padding: ", ";\n .MuiInputBase-root {\n color: ", ";\n fieldset {\n border-color: ", ";\n }\n\n .MuiInputBase-input {\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\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 .MuiInputBase-input {\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\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
|
|
14404
14484
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimaryInverse
|
|
14405
14485
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary, hasInvertedStyle
|
|
14406
14486
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderPrimaryInverse
|
|
14407
14487
|
: "", hasInvertedStyle
|
|
14408
|
-
? (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.
|
|
14488
|
+
? (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textTertiaryInverse
|
|
14489
|
+
: (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textTertiary, hasInvertedStyle
|
|
14490
|
+
? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.ornamentSecondaryInverse
|
|
14409
14491
|
: "", hasInvertedStyle
|
|
14410
|
-
? (
|
|
14492
|
+
? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.borderPrimaryHoverInverse
|
|
14411
14493
|
: "", hasInvertedStyle
|
|
14412
|
-
? (
|
|
14494
|
+
? (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.ornamentPrimaryInverse
|
|
14413
14495
|
: "", hasInvertedStyle
|
|
14414
|
-
? (
|
|
14496
|
+
? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.borderPrimaryPressedInverse
|
|
14415
14497
|
: "", hasInvertedStyle
|
|
14416
|
-
? (
|
|
14498
|
+
? (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.ornamentPrimaryInverse
|
|
14417
14499
|
: "", hasInvertedStyle
|
|
14418
|
-
? (
|
|
14500
|
+
? (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.borderPrimaryDisabledInverse
|
|
14419
14501
|
: "", hasInvertedStyle
|
|
14420
|
-
? (
|
|
14502
|
+
? (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.ornamentDisabledInverse
|
|
14421
14503
|
: "");
|
|
14422
14504
|
});
|
|
14423
14505
|
var NarrowButtonStyles = function (props) {
|
|
@@ -14427,23 +14509,28 @@ var NarrowButtonStyles = function (props) {
|
|
|
14427
14509
|
var backgroundColor = props.hasInvertedStyle
|
|
14428
14510
|
? colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimaryInverse
|
|
14429
14511
|
: colors === null || colors === void 0 ? void 0 : colors.base.backgroundPrimary;
|
|
14430
|
-
return css$2(
|
|
14512
|
+
return css$2(templateObject_26 || (templateObject_26 = __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);
|
|
14431
14513
|
};
|
|
14432
14514
|
var StyledButtonSection = styled$2("section", {
|
|
14433
14515
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14434
|
-
})(
|
|
14516
|
+
})(templateObject_28 || (templateObject_28 = __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) {
|
|
14435
14517
|
var isNarrow = props.isNarrow;
|
|
14436
14518
|
var spaces = getSpaces(props);
|
|
14437
|
-
return css$2(
|
|
14519
|
+
return css$2(templateObject_27 || (templateObject_27 = __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.xxl, isNarrow && NarrowButtonStyles(props));
|
|
14438
14520
|
});
|
|
14439
14521
|
var StyledDrawer$1 = styled$2(Drawer, {
|
|
14440
14522
|
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14441
|
-
})(
|
|
14523
|
+
})(templateObject_29 || (templateObject_29 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14442
14524
|
var colors = getSemanticColors(props);
|
|
14443
14525
|
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 ");
|
|
14444
14526
|
});
|
|
14445
|
-
var StyledNarrowButton = styled$2(Button
|
|
14446
|
-
|
|
14527
|
+
var StyledNarrowButton = styled$2(Button, {
|
|
14528
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
14529
|
+
})(templateObject_31 || (templateObject_31 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
14530
|
+
var hasInvertedStyle = props.hasInvertedStyle;
|
|
14531
|
+
return css$2(templateObject_30 || (templateObject_30 = __makeTemplateObject(["\n ", "\n margin: 0;\n "], ["\n ", "\n margin: 0;\n "])), hasInvertedStyle && invertedWideButtonStyles(props));
|
|
14532
|
+
});
|
|
14533
|
+
var templateObject_1$k, 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, templateObject_30, templateObject_31;
|
|
14447
14534
|
|
|
14448
14535
|
var doNotForwardProps$8 = ["active", "hasInvertedStyle", "isNarrow"];
|
|
14449
14536
|
var NarrowPrimaryNavItem = function (props) {
|
|
@@ -14460,13 +14547,13 @@ var NarrowPrimaryNavItem = function (props) {
|
|
|
14460
14547
|
var inactiveBorderColor = hasInvertedStyle
|
|
14461
14548
|
? (_c = colors === null || colors === void 0 ? void 0 : colors.neutral) === null || _c === void 0 ? void 0 : _c.fillPrimary
|
|
14462
14549
|
: colors === null || colors === void 0 ? void 0 : colors.base.borderPrimary;
|
|
14463
|
-
return css(templateObject_1$
|
|
14550
|
+
return css(templateObject_1$j || (templateObject_1$j = __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
|
|
14464
14551
|
? colors === null || colors === void 0 ? void 0 : colors.base.backgroundSecondaryInverse
|
|
14465
14552
|
: colors === null || colors === void 0 ? void 0 : colors.base.backgroundSecondary, spaces === null || spaces === void 0 ? void 0 : spaces.xs, active ? activeBorderColor : inactiveBorderColor);
|
|
14466
14553
|
};
|
|
14467
14554
|
var PrimaryNavItem = styled$2(Button, {
|
|
14468
14555
|
shouldForwardProp: function (prop) { return !doNotForwardProps$8.includes(prop); },
|
|
14469
|
-
})(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n display: flex;\n align-items: start;\n background: none;\n\n ", "\n"], ["\n display: flex;\n align-items: start;\n background: none;\n\n ", "\n"])), function (props) {
|
|
14556
|
+
})(templateObject_3$6 || (templateObject_3$6 = __makeTemplateObject(["\n display: flex;\n align-items: start;\n background: none;\n padding: 0;\n min-width: fit-content;\n\n ", "\n"], ["\n display: flex;\n align-items: start;\n background: none;\n padding: 0;\n min-width: fit-content;\n\n ", "\n"])), function (props) {
|
|
14470
14557
|
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow;
|
|
14471
14558
|
var spaces = getSpaces(props);
|
|
14472
14559
|
var colors = getSemanticColors(props);
|
|
@@ -14478,14 +14565,13 @@ var WideStyledLabel = function (props) {
|
|
|
14478
14565
|
var _a, _b;
|
|
14479
14566
|
var hasInvertedStyle = props.hasInvertedStyle, active = props.active;
|
|
14480
14567
|
var colors = getSemanticColors(props);
|
|
14481
|
-
var spaces = getSpaces(props);
|
|
14482
14568
|
var activeBorderColor = hasInvertedStyle
|
|
14483
14569
|
? (_a = colors === null || colors === void 0 ? void 0 : colors.base) === null || _a === void 0 ? void 0 : _a.borderOnFill
|
|
14484
14570
|
: (_b = colors === null || colors === void 0 ? void 0 : colors.accent) === null || _b === void 0 ? void 0 : _b.border;
|
|
14485
14571
|
var inactiveBorderColor = hasInvertedStyle
|
|
14486
14572
|
? colors === null || colors === void 0 ? void 0 : colors.base.borderOnFill
|
|
14487
14573
|
: colors === null || colors === void 0 ? void 0 : colors.base.borderPrimary;
|
|
14488
|
-
return css(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n border-bottom: solid 2px transparent;\n border-bottom-color: ", ";\n
|
|
14574
|
+
return css(templateObject_4$4 || (templateObject_4$4 = __makeTemplateObject(["\n border-bottom: solid 2px transparent;\n border-bottom-color: ", ";\n\n &:hover {\n border-bottom-color: ", ";\n }\n "], ["\n border-bottom: solid 2px transparent;\n border-bottom-color: ", ";\n\n &:hover {\n border-bottom-color: ", ";\n }\n "])), active ? activeBorderColor : "transparent", active ? activeBorderColor : inactiveBorderColor);
|
|
14489
14575
|
};
|
|
14490
14576
|
var StyledLabel = styled$2("span", {
|
|
14491
14577
|
shouldForwardProp: function (prop) { return !doNotForwardProps$8.includes(prop); },
|
|
@@ -14500,11 +14586,11 @@ var StyledLabel = styled$2("span", {
|
|
|
14500
14586
|
: colors === null || colors === void 0 ? void 0 : colors.base.textSecondary;
|
|
14501
14587
|
return css(templateObject_5$3 || (templateObject_5$3 = __makeTemplateObject(["\n color: ", ";\n\n ", "\n "], ["\n color: ", ";\n\n ", "\n "])), active ? activeColor : inactiveColor, !isNarrow && WideStyledLabel(props));
|
|
14502
14588
|
});
|
|
14503
|
-
var templateObject_1$
|
|
14589
|
+
var templateObject_1$j, templateObject_2$b, templateObject_3$6, templateObject_4$4, templateObject_5$3, templateObject_6$2;
|
|
14504
14590
|
|
|
14505
14591
|
var doNotForwardProps$7 = ["isNarrow"];
|
|
14506
14592
|
var NarrowStyledSection = function () {
|
|
14507
|
-
return css(templateObject_1$
|
|
14593
|
+
return css(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n align-items: start;\n flex-direction: column;\n "], ["\n align-items: start;\n flex-direction: column;\n "])));
|
|
14508
14594
|
};
|
|
14509
14595
|
var StyledSection = styled$2("section", {
|
|
14510
14596
|
shouldForwardProp: function (prop) { return !doNotForwardProps$7.includes(prop); },
|
|
@@ -14514,7 +14600,7 @@ var StyledSection = styled$2("section", {
|
|
|
14514
14600
|
var spaces = getSpaces(props);
|
|
14515
14601
|
return css(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n column-gap: ", "px;\n\n ", "\n "], ["\n column-gap: ", "px;\n\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces[(_a = props === null || props === void 0 ? void 0 : props.gap) !== null && _a !== void 0 ? _a : "xl"], isNarrow && NarrowStyledSection());
|
|
14516
14602
|
});
|
|
14517
|
-
var templateObject_1$
|
|
14603
|
+
var templateObject_1$i, templateObject_2$a, templateObject_3$5;
|
|
14518
14604
|
|
|
14519
14605
|
function NavigationHeaderPrimaryNav(_a) {
|
|
14520
14606
|
var hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow, items = _a.items, onChange = _a.onChange, value = _a.value;
|
|
@@ -14534,13 +14620,13 @@ var NarrowStyledTextItem = function (props) {
|
|
|
14534
14620
|
var hasInvertedStyle = props.hasInvertedStyle;
|
|
14535
14621
|
var semanticColors = getSemanticColors(props);
|
|
14536
14622
|
var spaces = getSpaces(props);
|
|
14537
|
-
return css(templateObject_1$
|
|
14623
|
+
return css(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n padding-left: ", "px;\n border-radius: 0;\n width: 100%;\n\n &:hover {\n box-shadow: none;\n background: ", ";\n }\n "], ["\n padding-left: ", "px;\n border-radius: 0;\n width: 100%;\n\n &:hover {\n box-shadow: none;\n background: ", ";\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xl, hasInvertedStyle
|
|
14538
14624
|
? semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondaryInverse
|
|
14539
14625
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.backgroundSecondary);
|
|
14540
14626
|
};
|
|
14541
14627
|
var StyledTextItem = styled$2(Button, {
|
|
14542
14628
|
shouldForwardProp: function (prop) { return !ButtonDoNotForwardProps.includes(prop); },
|
|
14543
|
-
})(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n ", "\n\n background: none;\n justify-content: flex-start;\n min-height: 44px;\n width: fit-content;\n min-width: unset;\n\n ", "\n"], ["\n ", "\n\n background: none;\n justify-content: flex-start;\n min-height: 44px;\n width: fit-content;\n min-width: unset;\n\n ", "\n"])), fontHeaderS, function (props) {
|
|
14629
|
+
})(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n ", "\n\n background: none;\n justify-content: flex-start;\n min-height: 44px;\n width: fit-content;\n min-width: unset;\n padding: 0;\n\n ", "\n"], ["\n ", "\n\n background: none;\n justify-content: flex-start;\n min-height: 44px;\n width: fit-content;\n min-width: unset;\n padding: 0;\n\n ", "\n"])), fontHeaderS, function (props) {
|
|
14544
14630
|
var _a, _b;
|
|
14545
14631
|
var hasInvertedStyle = props.hasInvertedStyle, open = props.open, isNarrow = props.isNarrow;
|
|
14546
14632
|
var semanticColors = getSemanticColors(props);
|
|
@@ -14566,7 +14652,7 @@ var StyledTextItem = styled$2(Button, {
|
|
|
14566
14652
|
var doNotForwardProps$6 = ["hasInvertedStyle", "isNarrow"];
|
|
14567
14653
|
var StyledAccordion = styled$2(Accordion, {
|
|
14568
14654
|
shouldForwardProp: function (prop) { return !doNotForwardProps$6.includes(prop); },
|
|
14569
|
-
})(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n width:
|
|
14655
|
+
})(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n width: 100%;\n min-width: unset;\n\n .MuiAccordionDetails-root .MuiButtonBase-root .primary-text {\n ", "\n }\n\n ", "\n"], ["\n width: 100%;\n min-width: unset;\n\n .MuiAccordionDetails-root .MuiButtonBase-root .primary-text {\n ", "\n }\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
14570
14656
|
var _a, _b;
|
|
14571
14657
|
var hasInvertedStyle = props.hasInvertedStyle, isNarrow = props.isNarrow;
|
|
14572
14658
|
var spaces = getSpaces(props);
|
|
@@ -14597,7 +14683,7 @@ var StyledAccordion = styled$2(Accordion, {
|
|
|
14597
14683
|
: semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base.textPrimary);
|
|
14598
14684
|
});
|
|
14599
14685
|
var StyledSubItem = styled$2(MenuItem)(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n &.MuiButtonBase-root.MuiMenuItem-root:hover {\n span.primary-text {\n font-weight: 600;\n }\n }\n"], ["\n &.MuiButtonBase-root.MuiMenuItem-root:hover {\n span.primary-text {\n font-weight: 600;\n }\n }\n"])));
|
|
14600
|
-
var templateObject_1$
|
|
14686
|
+
var templateObject_1$h, templateObject_2$9, templateObject_3$4, templateObject_4$3, templateObject_5$2, templateObject_6$1, templateObject_7;
|
|
14601
14687
|
|
|
14602
14688
|
function SecondaryNavItem(_a) {
|
|
14603
14689
|
var item = _a.item, hasInvertedStyle = _a.hasInvertedStyle, isNarrow = _a.isNarrow, rest = __rest(_a, ["item", "hasInvertedStyle", "isNarrow"]);
|
|
@@ -14615,7 +14701,11 @@ function SecondaryNavItem(_a) {
|
|
|
14615
14701
|
}
|
|
14616
14702
|
setMenuWidth(button.offsetWidth);
|
|
14617
14703
|
}, []);
|
|
14618
|
-
return (jsxs(Fragment$1, { children: [item.itemType === "text" && (jsx(StyledTextItem, __assign({ sdsStyle: "minimal", onClick: item.onClick, hasInvertedStyle: hasInvertedStyle, open: open, isNarrow: isNarrow }, rest, { children: item.label }))), item.itemType === "dropdown" && !isNarrow && (jsxs(Fragment, { children: [jsxs(StyledTextItem, { sdsStyle: "minimal", ref: buttonRef,
|
|
14704
|
+
return (jsxs(Fragment$1, { children: [item.itemType === "text" && (jsx(StyledTextItem, __assign({ sdsStyle: "minimal", onClick: item.onClick, hasInvertedStyle: hasInvertedStyle, open: open, isNarrow: isNarrow }, rest, { children: item.label }))), item.itemType === "dropdown" && !isNarrow && (jsxs(Fragment, { children: [jsxs(StyledTextItem, __assign({ sdsStyle: "minimal", ref: buttonRef, hasInvertedStyle: hasInvertedStyle, open: open, isNarrow: isNarrow }, rest, { onClick: function (event) {
|
|
14705
|
+
var _a;
|
|
14706
|
+
setAnchorEl(event.currentTarget);
|
|
14707
|
+
(_a = item.onClick) === null || _a === void 0 ? void 0 : _a.call(item, event);
|
|
14708
|
+
}, children: [jsx("span", { children: item.label }), jsx(Icon, { sdsIcon: open ? "ChevronUp" : "ChevronDown", sdsSize: "xs" })] })), jsx(Menu, { anchorEl: anchorEl, open: open, onClose: onClose, children: item.items.map(function (subItem) {
|
|
14619
14709
|
var label = subItem.label, onClick = subItem.onClick, subItemRest = __rest(subItem, ["label", "onClick"]);
|
|
14620
14710
|
return (jsx(MenuItem, __assign({ onClick: function () {
|
|
14621
14711
|
onClick === null || onClick === void 0 ? void 0 : onClick();
|
|
@@ -14637,28 +14727,85 @@ function NavigationHeaderSecondaryNav(_a) {
|
|
|
14637
14727
|
}) }));
|
|
14638
14728
|
}
|
|
14639
14729
|
|
|
14730
|
+
function ElevationScroll(elevationProps) {
|
|
14731
|
+
var _a, _b, _c;
|
|
14732
|
+
var children = elevationProps.children, window = elevationProps.window, _d = elevationProps.shouldElevate, shouldElevate = _d === void 0 ? true : _d;
|
|
14733
|
+
var theme = useTheme$4();
|
|
14734
|
+
var mode = theme.palette.mode;
|
|
14735
|
+
var trigger = useScrollTrigger({
|
|
14736
|
+
disableHysteresis: true,
|
|
14737
|
+
target: window ? window() : undefined,
|
|
14738
|
+
threshold: 0,
|
|
14739
|
+
});
|
|
14740
|
+
var darkModeStyles = css$2(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n border-bottom: 1px solid ", ";\n "], ["\n border-bottom: 1px solid ", ";\n "])), (_c = (_b = (_a = theme.palette) === null || _a === void 0 ? void 0 : _a.sds) === null || _b === void 0 ? void 0 : _b.base) === null || _c === void 0 ? void 0 : _c.borderSecondary);
|
|
14741
|
+
/**
|
|
14742
|
+
* (masoudmanson): Elevation is set to 10 when the user scrolls and 0 otherwise.
|
|
14743
|
+
* MUI's elevation range is 0-24, but in the SDS theme, we have mapped:
|
|
14744
|
+
* - shadow.none to 0
|
|
14745
|
+
* - shadow.S to values 1-8
|
|
14746
|
+
* - shadow.M to values 9-16
|
|
14747
|
+
* - shadow.L to values 17-24
|
|
14748
|
+
*
|
|
14749
|
+
* Since the navigation requires a shadow.M drop shadow based on the design system,
|
|
14750
|
+
* any elevation value between 9 and 16 will produce the same effect.
|
|
14751
|
+
*/
|
|
14752
|
+
return children
|
|
14753
|
+
? React__default.cloneElement(children, {
|
|
14754
|
+
elevation: trigger && shouldElevate ? 14 : 0,
|
|
14755
|
+
sx: trigger && shouldElevate
|
|
14756
|
+
? __assign(__assign({}, (elevationProps.sx || {})), (mode === "dark" && darkModeStyles)) : undefined,
|
|
14757
|
+
})
|
|
14758
|
+
: null;
|
|
14759
|
+
}
|
|
14760
|
+
var templateObject_1$g;
|
|
14761
|
+
|
|
14640
14762
|
var NavigationHeader = forwardRef(function (props, ref) {
|
|
14641
|
-
var
|
|
14763
|
+
var _a = props.activePrimaryNavKey, activePrimaryNavKey = _a === void 0 ? "" : _a, buttons = props.buttons, hasInvertedStyle = props.hasInvertedStyle, logo = props.logo, logoUrl = props.logoUrl, _b = props.logoLinkComponent, logoLinkComponent = _b === void 0 ? "a" : _b, logoLinkProps = props.logoLinkProps, _c = props.scrollElevation, scrollElevation = _c === void 0 ? true : _c, primaryNavItems = props.primaryNavItems, _d = props.primaryNavPosition, primaryNavPosition = _d === void 0 ? "left" : _d, searchProps = props.searchProps, secondaryNavItems = props.secondaryNavItems, setActivePrimaryNavKey = props.setActivePrimaryNavKey, _e = props.showSearch, showSearch = _e === void 0 ? true : _e, tag = props.tag, tagColor = props.tagColor, title = props.title, controlledDrawerOpen = props.drawerOpen, onDrawerOpenChange = props.setDrawerOpen, rest = __rest(props, ["activePrimaryNavKey", "buttons", "hasInvertedStyle", "logo", "logoUrl", "logoLinkComponent", "logoLinkProps", "scrollElevation", "primaryNavItems", "primaryNavPosition", "searchProps", "secondaryNavItems", "setActivePrimaryNavKey", "showSearch", "tag", "tagColor", "title", "drawerOpen", "setDrawerOpen"]);
|
|
14642
14764
|
var navRef = useRef(null);
|
|
14643
14765
|
var theme = useTheme();
|
|
14644
14766
|
var isMdScreen = useMediaQuery(theme.breakpoints.down("md"));
|
|
14767
|
+
// Use controlled or uncontrolled drawer state
|
|
14768
|
+
var _f = useState(false), internalDrawerOpen = _f[0], setInternalDrawerOpen = _f[1];
|
|
14769
|
+
var drawerOpen = controlledDrawerOpen !== null && controlledDrawerOpen !== void 0 ? controlledDrawerOpen : internalDrawerOpen;
|
|
14770
|
+
var setDrawerOpen = function (open) {
|
|
14771
|
+
var newOpen = typeof open === "function" ? open(drawerOpen) : open;
|
|
14772
|
+
if (onDrawerOpenChange) {
|
|
14773
|
+
onDrawerOpenChange(newOpen);
|
|
14774
|
+
}
|
|
14775
|
+
else {
|
|
14776
|
+
setInternalDrawerOpen(newOpen);
|
|
14777
|
+
}
|
|
14778
|
+
};
|
|
14779
|
+
var _g = useState({
|
|
14780
|
+
breakpoint: 0,
|
|
14781
|
+
isNarrow: isMdScreen,
|
|
14782
|
+
}), dimensions = _g[0], setDimensions = _g[1];
|
|
14645
14783
|
useEffect(function () {
|
|
14646
|
-
|
|
14784
|
+
setDimensions(function (prev) { return (__assign(__assign({}, prev), { isNarrow: isMdScreen })); });
|
|
14647
14785
|
}, [isMdScreen]);
|
|
14648
|
-
var _d = useState(true), drawerOpen = _d[0], setDrawerOpen = _d[1];
|
|
14649
|
-
var _e = useState(isMdScreen), isNarrow = _e[0], setIsNarrow = _e[1];
|
|
14650
|
-
var _f = useState(0), breakpoint = _f[0], setBreakpoint = _f[1];
|
|
14651
14786
|
var checkScrollable = useCallback(function () {
|
|
14652
14787
|
if (!navRef.current)
|
|
14653
14788
|
return;
|
|
14654
14789
|
var clientWidth = navRef.current.clientWidth;
|
|
14655
14790
|
var scrollWidth = navRef.current.scrollWidth;
|
|
14656
14791
|
var needsScroll = scrollWidth > clientWidth;
|
|
14657
|
-
|
|
14658
|
-
|
|
14659
|
-
|
|
14660
|
-
|
|
14661
|
-
|
|
14792
|
+
setDimensions(function (prev) {
|
|
14793
|
+
var newBreakpoint = needsScroll
|
|
14794
|
+
? prev.breakpoint > scrollWidth
|
|
14795
|
+
? prev.breakpoint
|
|
14796
|
+
: scrollWidth
|
|
14797
|
+
: prev.breakpoint;
|
|
14798
|
+
var newIsNarrow = prev.isNarrow
|
|
14799
|
+
? clientWidth < newBreakpoint
|
|
14800
|
+
? true
|
|
14801
|
+
: false
|
|
14802
|
+
: needsScroll;
|
|
14803
|
+
return {
|
|
14804
|
+
breakpoint: newBreakpoint,
|
|
14805
|
+
isNarrow: newIsNarrow,
|
|
14806
|
+
};
|
|
14807
|
+
});
|
|
14808
|
+
}, []);
|
|
14662
14809
|
useEffect(function () {
|
|
14663
14810
|
checkScrollable();
|
|
14664
14811
|
var resizeObserver = new ResizeObserver(checkScrollable);
|
|
@@ -14666,46 +14813,59 @@ var NavigationHeader = forwardRef(function (props, ref) {
|
|
|
14666
14813
|
resizeObserver.observe(navRef.current);
|
|
14667
14814
|
}
|
|
14668
14815
|
return function () { return resizeObserver.disconnect(); };
|
|
14669
|
-
}, [
|
|
14816
|
+
}, [checkScrollable]);
|
|
14670
14817
|
var renderSearch = function () {
|
|
14671
|
-
return (showSearch && (jsx(StyledSearch, __assign({ id: "nav-bar-search", label: "Search", placeholder: "Search", sdsStyle: "rounded", hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow }, searchProps))));
|
|
14818
|
+
return (showSearch && (jsx(StyledSearch, __assign({ id: "nav-bar-search", label: "Search", placeholder: "Search", sdsStyle: "rounded", hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow }, searchProps))));
|
|
14672
14819
|
};
|
|
14673
14820
|
var renderLogoNode = function () {
|
|
14674
|
-
var logoNode = (jsxs(StyledTitleContainer, { hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: [jsx(StyledLogoWrapper, { children: logo }), jsx("p", { children: title }), tag && jsx(StyledTag, { color: tagColor, label: tag, hover: false })] }));
|
|
14821
|
+
var logoNode = (jsxs(StyledTitleContainer, { hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow, children: [logo && jsx(StyledLogoWrapper, { children: logo }), jsxs(StyledTitleTagWrapper, { children: [title && jsx("p", { children: title }), tag && jsx(StyledTag, { color: tagColor, label: tag, hover: false })] })] }));
|
|
14675
14822
|
if (logoLinkComponent || logoUrl) {
|
|
14676
|
-
logoNode = (jsx(StyledLogoLinkWrapper, __assign({ component: logoLinkComponent, href: logoUrl }, logoLinkProps, { isNarrow: isNarrow, children: logoNode })));
|
|
14823
|
+
logoNode = (jsx(StyledLogoLinkWrapper, __assign({ component: logoLinkComponent, href: logoUrl }, logoLinkProps, { isNarrow: dimensions.isNarrow, children: logoNode })));
|
|
14677
14824
|
}
|
|
14678
14825
|
return logoNode;
|
|
14679
14826
|
};
|
|
14680
14827
|
var renderPrimaryNav = function () {
|
|
14681
|
-
return (
|
|
14682
|
-
setActivePrimaryNavKey &&
|
|
14828
|
+
return (setActivePrimaryNavKey &&
|
|
14683
14829
|
primaryNavItems &&
|
|
14684
|
-
primaryNavItems.length > 0 && (jsx(NavigationHeaderPrimaryNav, { items: primaryNavItems, value: activePrimaryNavKey, onChange: setActivePrimaryNavKey, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow })));
|
|
14830
|
+
primaryNavItems.length > 0 && (jsx(NavigationHeaderPrimaryNav, { items: primaryNavItems, value: activePrimaryNavKey, onChange: setActivePrimaryNavKey, hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow })));
|
|
14685
14831
|
};
|
|
14686
14832
|
var renderSecondaryNav = function () {
|
|
14687
14833
|
return (secondaryNavItems &&
|
|
14688
|
-
secondaryNavItems.length > 0 && (jsx(NavigationHeaderSecondaryNav, { items: secondaryNavItems, hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow })));
|
|
14834
|
+
secondaryNavItems.length > 0 && (jsx(NavigationHeaderSecondaryNav, { items: secondaryNavItems, hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow })));
|
|
14689
14835
|
};
|
|
14690
14836
|
var renderButtonsNode = function () {
|
|
14691
14837
|
if (!buttons || buttons.length === 0)
|
|
14692
14838
|
return null;
|
|
14693
|
-
return (jsx(StyledButtonSection, { hasInvertedStyle: hasInvertedStyle, isNarrow: isNarrow, children: buttons.map(function (buttonProps, idx) { return renderButton(buttonProps, idx); }) }));
|
|
14839
|
+
return (jsx(StyledButtonSection, { hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow, children: buttons.map(function (buttonProps, idx) { return renderButton(buttonProps, idx); }) }));
|
|
14694
14840
|
};
|
|
14695
14841
|
var renderButton = function (buttonProps, idx) {
|
|
14696
|
-
var
|
|
14842
|
+
var _a;
|
|
14697
14843
|
var key = "button-".concat(idx);
|
|
14698
|
-
var fullWidth = isNarrow ? { width: "100%" } : undefined;
|
|
14699
|
-
if (
|
|
14700
|
-
return
|
|
14844
|
+
var fullWidth = dimensions.isNarrow ? { width: "100%" } : undefined;
|
|
14845
|
+
if (React__default.isValidElement(buttonProps)) {
|
|
14846
|
+
return React__default.cloneElement(buttonProps, {
|
|
14847
|
+
hasInvertedStyle: hasInvertedStyle,
|
|
14848
|
+
key: key,
|
|
14849
|
+
sx: __assign(__assign({}, (((_a = buttonProps.props) === null || _a === void 0 ? void 0 : _a.sx) || {})), fullWidth),
|
|
14850
|
+
});
|
|
14701
14851
|
}
|
|
14702
|
-
if (
|
|
14703
|
-
|
|
14852
|
+
if (typeof buttonProps === "object" && buttonProps !== null) {
|
|
14853
|
+
var buttonPropsObj = buttonProps;
|
|
14854
|
+
var isIconButton = "icon" in buttonPropsObj;
|
|
14855
|
+
if (isIconButton && dimensions.isNarrow && buttonPropsObj.icon) {
|
|
14856
|
+
return renderNarrowIconButton(buttonPropsObj, key, fullWidth);
|
|
14857
|
+
}
|
|
14858
|
+
if (isIconButton && !dimensions.isNarrow) {
|
|
14859
|
+
return renderWideIconButton(buttonPropsObj, key);
|
|
14860
|
+
}
|
|
14861
|
+
return renderDefaultButton(buttonPropsObj, key, fullWidth);
|
|
14704
14862
|
}
|
|
14705
|
-
return
|
|
14863
|
+
return null;
|
|
14864
|
+
};
|
|
14865
|
+
var renderNarrowIconButton = function (buttonProps, key, fullWidth) { return (jsx(StyledNarrowIconButton, __assign({ sx: fullWidth, isAllCaps: false, startIcon: jsx(Icon, { sdsSize: "s", sdsIcon: "Person" }), hasInvertedStyle: hasInvertedStyle }, buttonProps, { sdsStyle: "minimal", sdsType: "secondary", children: buttonProps.children }), key)); };
|
|
14866
|
+
var renderWideIconButton = function (buttonProps, key) {
|
|
14867
|
+
return (jsx(StyledWideIconButton, __assign({ sdsIconProps: { sdsSize: "l" }, "aria-label": String(buttonProps.children), hasInvertedStyle: hasInvertedStyle }, buttonProps, { sdsStyle: "icon", sdsType: "secondary", icon: buttonProps.icon }), key));
|
|
14706
14868
|
};
|
|
14707
|
-
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)); };
|
|
14708
|
-
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)); };
|
|
14709
14869
|
var renderDefaultButton = function (buttonProps, key, fullWidth) { return (jsx(StyledHeaderButton, __assign({ sx: fullWidth }, buttonProps, { sdsStyle: "rounded", hasInvertedStyle: hasInvertedStyle }), key)); };
|
|
14710
14870
|
var renderHeaderContent = function () {
|
|
14711
14871
|
var logoNode = renderLogoNode();
|
|
@@ -14713,14 +14873,14 @@ var NavigationHeader = forwardRef(function (props, ref) {
|
|
|
14713
14873
|
var primaryNav = renderPrimaryNav();
|
|
14714
14874
|
var secondaryNav = renderSecondaryNav();
|
|
14715
14875
|
var buttonsNode = renderButtonsNode();
|
|
14716
|
-
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; }); } }))] }));
|
|
14876
|
+
return (jsxs(StyledToolbar, { hasInvertedStyle: hasInvertedStyle, isNarrow: dimensions.isNarrow, children: [logoNode, !dimensions.isNarrow && (jsxs(Fragment, { children: [jsx(StyledPrimaryNavContainer, { primaryNavPosition: primaryNavPosition, showSearch: showSearch, isNarrow: dimensions.isNarrow, children: primaryNavPosition === "left" ? (jsxs(Fragment, { children: [primaryNav, search] })) : (jsxs(Fragment, { children: [search, primaryNav] })) }), secondaryNav, buttonsNode] })), dimensions.isNarrow && (jsx(StyledNarrowButton, { sdsType: "secondary", sdsStyle: "icon", icon: drawerOpen ? "XMark" : "LinesHorizontal3", onClick: function () { return setDrawerOpen(function (prev) { return !prev; }); }, hasInvertedStyle: hasInvertedStyle }))] }));
|
|
14717
14877
|
};
|
|
14718
14878
|
var headerContent = renderHeaderContent();
|
|
14719
14879
|
var search = renderSearch();
|
|
14720
14880
|
var primaryNav = renderPrimaryNav();
|
|
14721
14881
|
var secondaryNav = renderSecondaryNav();
|
|
14722
14882
|
var buttonsNode = renderButtonsNode();
|
|
14723
|
-
return (jsxs(
|
|
14883
|
+
return (jsxs(Fragment, { children: [jsx(ElevationScroll, __assign({}, props, { shouldElevate: scrollElevation, children: jsx(StyledAppBar, __assign({ elevation: 0, hasInvertedStyle: hasInvertedStyle, ref: mergeRefs([ref, navRef]), "aria-label": "Main navigation", tabIndex: 0, position: "sticky" }, rest, { children: headerContent })) })), dimensions.isNarrow && drawerOpen && (jsxs(StyledDrawer$1, { anchor: "right", open: drawerOpen, onClose: function () { return setDrawerOpen(false); }, hasInvertedStyle: hasInvertedStyle, role: "dialog", "aria-label": "Navigation menu", children: [jsxs("div", { children: [jsx(ElevationScroll, __assign({}, props, { shouldElevate: scrollElevation, children: jsx(StyledAppBar, __assign({ elevation: 10, hasInvertedStyle: hasInvertedStyle, ref: mergeRefs([ref, navRef]), "aria-label": "Main navigation", tabIndex: 0 }, rest, { position: "sticky", children: headerContent })) })), search, primaryNav, secondaryNav] }), buttonsNode] }))] }));
|
|
14724
14884
|
});
|
|
14725
14885
|
|
|
14726
14886
|
/**
|