@czi-sds/components 21.2.0 → 21.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs.d.ts +41 -11
- package/dist/index.cjs.js +492 -367
- package/dist/index.esm.d.ts +41 -11
- package/dist/index.esm.js +491 -369
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/dist/variables.css +34 -10
- package/dist/variables.scss +34 -10
- 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, useMemo, createContext, useContext } from 'react';
|
|
5
5
|
import { css } from '@emotion/react';
|
|
6
|
-
import { createTheme, 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, Popper, ClickAwayListener, alertClasses, alertTitleClasses, Grow, AlertTitle, Tooltip as Tooltip$1, Chip as Chip$1, darken, 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, Tabs as Tabs$1, tabsClasses, Tab as Tab$1, Slide, Box, ToggleButtonGroup, toggleButtonClasses, ToggleButton, TableCell, TableContainer, Table as Table$1, TableBody, TableRow as TableRow$1 } from '@mui/material';
|
|
6
|
+
import { createTheme, 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, Popper, ClickAwayListener, alertClasses, alertTitleClasses, Grow, AlertTitle, Tooltip as Tooltip$1, Chip as Chip$1, darken, 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, Tabs as Tabs$1, tabsClasses, Tab as Tab$1, Slide, Box, Drawer, drawerClasses, ToggleButtonGroup, toggleButtonClasses, ToggleButton, TableCell, TableContainer, Table as Table$1, TableBody, TableRow as TableRow$1 } from '@mui/material';
|
|
7
7
|
import styled from '@emotion/styled';
|
|
8
8
|
import { Check, Remove, Clear } from '@mui/icons-material';
|
|
9
9
|
import { css as css$1 } from '@emotion/css';
|
|
@@ -553,27 +553,39 @@ SDSLightAppTheme.borders = {
|
|
|
553
553
|
table: "1px solid ".concat(SDSLightAppTheme.colors.gray[300]),
|
|
554
554
|
},
|
|
555
555
|
beta: {
|
|
556
|
-
default: "1px solid ".concat(SDSLightAppTheme.colors.purple[
|
|
556
|
+
default: "1px solid ".concat(SDSLightAppTheme.colors.purple[600]),
|
|
557
|
+
extraThick: "4px solid ".concat(SDSLightAppTheme.colors.purple[600]),
|
|
558
|
+
thick: "2px solid ".concat(SDSLightAppTheme.colors.purple[600]),
|
|
557
559
|
},
|
|
558
560
|
info: {
|
|
559
|
-
default: "1px solid ".concat(SDSLightAppTheme.colors.blue[
|
|
561
|
+
default: "1px solid ".concat(SDSLightAppTheme.colors.blue[600]),
|
|
562
|
+
extraThick: "4px solid ".concat(SDSLightAppTheme.colors.blue[600]),
|
|
563
|
+
thick: "2px solid ".concat(SDSLightAppTheme.colors.blue[600]),
|
|
560
564
|
},
|
|
561
565
|
link: {
|
|
562
566
|
dashed: "1px dashed",
|
|
563
567
|
solid: "1px solid",
|
|
564
568
|
},
|
|
565
569
|
negative: {
|
|
566
|
-
default: "1px solid ".concat(SDSLightAppTheme.colors.red[
|
|
570
|
+
default: "1px solid ".concat(SDSLightAppTheme.colors.red[600]),
|
|
571
|
+
extraThick: "4px solid ".concat(SDSLightAppTheme.colors.red[600]),
|
|
572
|
+
thick: "2px solid ".concat(SDSLightAppTheme.colors.red[600]),
|
|
567
573
|
},
|
|
568
574
|
neutral: {
|
|
569
575
|
default: "1px solid ".concat(SDSLightAppTheme.colors.gray[500]),
|
|
576
|
+
extraThick: "4px solid ".concat(SDSLightAppTheme.colors.gray[500]),
|
|
577
|
+
thick: "2px solid ".concat(SDSLightAppTheme.colors.gray[500]),
|
|
570
578
|
},
|
|
571
579
|
none: "none",
|
|
572
580
|
notice: {
|
|
573
|
-
default: "1px solid ".concat(SDSLightAppTheme.colors.yellow[
|
|
581
|
+
default: "1px solid ".concat(SDSLightAppTheme.colors.yellow[600]),
|
|
582
|
+
extraThick: "4px solid ".concat(SDSLightAppTheme.colors.yellow[600]),
|
|
583
|
+
thick: "2px solid ".concat(SDSLightAppTheme.colors.yellow[600]),
|
|
574
584
|
},
|
|
575
585
|
positive: {
|
|
576
|
-
default: "1px solid ".concat(SDSLightAppTheme.colors.green[
|
|
586
|
+
default: "1px solid ".concat(SDSLightAppTheme.colors.green[600]),
|
|
587
|
+
extraThick: "4px solid ".concat(SDSLightAppTheme.colors.green[600]),
|
|
588
|
+
thick: "2px solid ".concat(SDSLightAppTheme.colors.green[600]),
|
|
577
589
|
},
|
|
578
590
|
};
|
|
579
591
|
var SDSDarkAppTheme = __assign(__assign({}, sharedAppTheme), { colors: SDSDarkThemeColors });
|
|
@@ -595,27 +607,39 @@ SDSDarkAppTheme.borders = {
|
|
|
595
607
|
table: "1px solid ".concat(SDSDarkAppTheme.colors.gray[300]),
|
|
596
608
|
},
|
|
597
609
|
beta: {
|
|
598
|
-
default: "1px solid ".concat(SDSDarkAppTheme.colors.purple[
|
|
610
|
+
default: "1px solid ".concat(SDSDarkAppTheme.colors.purple[600]),
|
|
611
|
+
extraThick: "4px solid ".concat(SDSDarkAppTheme.colors.purple[600]),
|
|
612
|
+
thick: "2px solid ".concat(SDSDarkAppTheme.colors.purple[600]),
|
|
599
613
|
},
|
|
600
614
|
info: {
|
|
601
|
-
default: "1px solid ".concat(SDSDarkAppTheme.colors.blue[
|
|
615
|
+
default: "1px solid ".concat(SDSDarkAppTheme.colors.blue[600]),
|
|
616
|
+
extraThick: "4px solid ".concat(SDSDarkAppTheme.colors.blue[600]),
|
|
617
|
+
thick: "2px solid ".concat(SDSDarkAppTheme.colors.blue[600]),
|
|
602
618
|
},
|
|
603
619
|
link: {
|
|
604
620
|
dashed: "1px dashed",
|
|
605
621
|
solid: "1px solid",
|
|
606
622
|
},
|
|
607
623
|
negative: {
|
|
608
|
-
default: "1px solid ".concat(SDSDarkAppTheme.colors.red[
|
|
624
|
+
default: "1px solid ".concat(SDSDarkAppTheme.colors.red[600]),
|
|
625
|
+
extraThick: "4px solid ".concat(SDSDarkAppTheme.colors.red[600]),
|
|
626
|
+
thick: "2px solid ".concat(SDSDarkAppTheme.colors.red[600]),
|
|
609
627
|
},
|
|
610
628
|
neutral: {
|
|
611
629
|
default: "1px solid ".concat(SDSDarkAppTheme.colors.gray[500]),
|
|
630
|
+
extraThick: "4px solid ".concat(SDSDarkAppTheme.colors.gray[500]),
|
|
631
|
+
thick: "2px solid ".concat(SDSDarkAppTheme.colors.gray[500]),
|
|
612
632
|
},
|
|
613
633
|
none: "none",
|
|
614
634
|
notice: {
|
|
615
|
-
default: "1px solid ".concat(SDSDarkAppTheme.colors.yellow[
|
|
635
|
+
default: "1px solid ".concat(SDSDarkAppTheme.colors.yellow[600]),
|
|
636
|
+
extraThick: "4px solid ".concat(SDSDarkAppTheme.colors.yellow[600]),
|
|
637
|
+
thick: "2px solid ".concat(SDSDarkAppTheme.colors.yellow[600]),
|
|
616
638
|
},
|
|
617
639
|
positive: {
|
|
618
|
-
default: "1px solid ".concat(SDSDarkAppTheme.colors.green[
|
|
640
|
+
default: "1px solid ".concat(SDSDarkAppTheme.colors.green[600]),
|
|
641
|
+
extraThick: "4px solid ".concat(SDSDarkAppTheme.colors.green[600]),
|
|
642
|
+
thick: "2px solid ".concat(SDSDarkAppTheme.colors.green[600]),
|
|
619
643
|
},
|
|
620
644
|
};
|
|
621
645
|
/**
|
|
@@ -901,6 +925,11 @@ function makeThemeOptions(appTheme, mode) {
|
|
|
901
925
|
disableRipple: true,
|
|
902
926
|
},
|
|
903
927
|
},
|
|
928
|
+
MuiDrawer: {
|
|
929
|
+
defaultProps: {
|
|
930
|
+
hideBackdrop: true,
|
|
931
|
+
},
|
|
932
|
+
},
|
|
904
933
|
MuiLink: {
|
|
905
934
|
defaultProps: {
|
|
906
935
|
underline: "hover",
|
|
@@ -1200,7 +1229,7 @@ var fontCaps = function (fontSize) {
|
|
|
1200
1229
|
if (!typography)
|
|
1201
1230
|
return null;
|
|
1202
1231
|
var caps = typography.styles.caps, capsFontFamily = typography.fontFamily.caps;
|
|
1203
|
-
return css(templateObject_1$
|
|
1232
|
+
return css(templateObject_1$X || (templateObject_1$X = __makeTemplateObject(["\n ", "\n text-transform: uppercase;\n "], ["\n ", "\n text-transform: uppercase;\n "])), themeToCss(caps.semibold[fontSize], capsFontFamily));
|
|
1204
1233
|
};
|
|
1205
1234
|
};
|
|
1206
1235
|
var fontCapsXxs = fontCaps("xxs");
|
|
@@ -1230,7 +1259,7 @@ var fontCode = function (fontSize, fontWeight) {
|
|
|
1230
1259
|
if (!typography)
|
|
1231
1260
|
return null;
|
|
1232
1261
|
var code = typography.styles.code, codeFontFamily = typography.fontFamily.code;
|
|
1233
|
-
return css(templateObject_2$
|
|
1262
|
+
return css(templateObject_2$C || (templateObject_2$C = __makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), themeToCss(code[fontWeight][fontSize], codeFontFamily));
|
|
1234
1263
|
};
|
|
1235
1264
|
};
|
|
1236
1265
|
var fontCodeXs = fontCode("xs", "regular");
|
|
@@ -1244,7 +1273,7 @@ var fontTabular = function (fontSize, fontWeight) {
|
|
|
1244
1273
|
if (!typography)
|
|
1245
1274
|
return null;
|
|
1246
1275
|
var tabular = typography.styles.tabular, tabularFontFamily = typography.fontFamily.tabular;
|
|
1247
|
-
return css(templateObject_3$
|
|
1276
|
+
return css(templateObject_3$t || (templateObject_3$t = __makeTemplateObject(["\n ", "\n font-variant-numeric: tabular-nums;\n "], ["\n ", "\n font-variant-numeric: tabular-nums;\n "])), themeToCss(tabular[fontWeight][fontSize], tabularFontFamily));
|
|
1248
1277
|
};
|
|
1249
1278
|
};
|
|
1250
1279
|
var fontTabularXs = fontTabular("xs", "regular");
|
|
@@ -1253,33 +1282,33 @@ var fontTabularSemiboldXs = fontTabular("xs", "semibold");
|
|
|
1253
1282
|
var fontTabularSemiboldS = fontTabular("s", "semibold");
|
|
1254
1283
|
function themeToCss(fontTheme, fontFamily) {
|
|
1255
1284
|
if (fontFamily === void 0) { fontFamily = "inherit"; }
|
|
1256
|
-
return css(templateObject_4$
|
|
1285
|
+
return css(templateObject_4$p || (templateObject_4$p = __makeTemplateObject(["\n font-family: ", ";\n font-size: ", "px;\n line-height: ", ";\n letter-spacing: ", ";\n font-weight: ", ";\n text-transform: ", ";\n "], ["\n font-family: ", ";\n font-size: ", "px;\n line-height: ", ";\n letter-spacing: ", ";\n font-weight: ", ";\n text-transform: ", ";\n "])), fontFamily, fontTheme.fontSize, fontTheme.lineHeight, fontTheme.letterSpacing, fontTheme.fontWeight, fontTheme.textTransform);
|
|
1257
1286
|
}
|
|
1258
|
-
var templateObject_1$
|
|
1287
|
+
var templateObject_1$X, templateObject_2$C, templateObject_3$t, templateObject_4$p;
|
|
1259
1288
|
|
|
1260
|
-
var StyledAccordionDetails = styled(AccordionDetails$1)(templateObject_2$
|
|
1289
|
+
var StyledAccordionDetails = styled(AccordionDetails$1)(templateObject_2$B || (templateObject_2$B = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
1261
1290
|
var spaces = getSpaces(props);
|
|
1262
|
-
return css(templateObject_1$
|
|
1291
|
+
return css(templateObject_1$W || (templateObject_1$W = __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);
|
|
1263
1292
|
});
|
|
1264
|
-
var templateObject_1$
|
|
1293
|
+
var templateObject_1$W, templateObject_2$B;
|
|
1265
1294
|
|
|
1266
1295
|
var AccordionDetails = function (props) {
|
|
1267
1296
|
var children = props.children;
|
|
1268
1297
|
return jsx(StyledAccordionDetails, { children: children });
|
|
1269
1298
|
};
|
|
1270
1299
|
|
|
1271
|
-
var StyledAccordionHeader = styled(AccordionSummary)(templateObject_2$
|
|
1300
|
+
var StyledAccordionHeader = styled(AccordionSummary)(templateObject_2$A || (templateObject_2$A = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontHeaderS, function (props) {
|
|
1272
1301
|
var _a, _b;
|
|
1273
1302
|
var spaces = getSpaces(props);
|
|
1274
1303
|
var semanticColors = getSemanticColors(props);
|
|
1275
|
-
return css(templateObject_1$
|
|
1304
|
+
return css(templateObject_1$V || (templateObject_1$V = __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.iconPrimary, accordionSummaryClasses.expandIconWrapper, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimaryHover);
|
|
1276
1305
|
});
|
|
1277
|
-
var StyledSubtitle = styled("p")(templateObject_4$
|
|
1306
|
+
var StyledSubtitle = styled("p")(templateObject_4$o || (templateObject_4$o = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
1278
1307
|
var _a;
|
|
1279
1308
|
var semanticColors = getSemanticColors(props);
|
|
1280
|
-
return css(templateObject_3$
|
|
1309
|
+
return css(templateObject_3$s || (templateObject_3$s = __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);
|
|
1281
1310
|
});
|
|
1282
|
-
var templateObject_1$
|
|
1311
|
+
var templateObject_1$V, templateObject_2$A, templateObject_3$s, templateObject_4$o;
|
|
1283
1312
|
|
|
1284
1313
|
var _path$2a, _path2$D, _path3$6;
|
|
1285
1314
|
function _extends$2f() { _extends$2f = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$2f.apply(this, arguments); }
|
|
@@ -3978,33 +4007,33 @@ function iconSize(props) {
|
|
|
3978
4007
|
var _a, _b;
|
|
3979
4008
|
var sdsSize = props.sdsSize;
|
|
3980
4009
|
var iconSizes = getIconSizes(props);
|
|
3981
|
-
return css(templateObject_1$
|
|
4010
|
+
return css(templateObject_1$U || (templateObject_1$U = __makeTemplateObject(["\n height: ", "px;\n width: ", "px;\n "], ["\n height: ", "px;\n width: ", "px;\n "])), (_a = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes[sdsSize]) === null || _a === void 0 ? void 0 : _a.height, (_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes[sdsSize]) === null || _b === void 0 ? void 0 : _b.width);
|
|
3982
4011
|
}
|
|
3983
4012
|
function buttonStyle() {
|
|
3984
|
-
return css(templateObject_2$
|
|
4013
|
+
return css(templateObject_2$z || (templateObject_2$z = __makeTemplateObject(["\n color: inherit;\n "], ["\n color: inherit;\n "])));
|
|
3985
4014
|
}
|
|
3986
4015
|
function staticStyle(props) {
|
|
3987
4016
|
var _a;
|
|
3988
4017
|
var _b = props.iconColor, iconColor = _b === void 0 ? "blue" : _b, _c = props.shade, shade = _c === void 0 ? 500 : _c;
|
|
3989
4018
|
var colors = getColors(props);
|
|
3990
|
-
return css(templateObject_3$
|
|
4019
|
+
return css(templateObject_3$r || (templateObject_3$r = __makeTemplateObject(["\n color: ", ";\n "], ["\n color: ", ";\n "])), (_a = colors === null || colors === void 0 ? void 0 : colors[iconColor]) === null || _a === void 0 ? void 0 : _a[shade]);
|
|
3991
4020
|
}
|
|
3992
4021
|
function interactive(props) {
|
|
3993
4022
|
var _a, _b, _c, _d;
|
|
3994
4023
|
var _e = props.iconColor, iconColor = _e === void 0 ? "blue" : _e, _f = props.shade, shade = _f === void 0 ? 500 : _f;
|
|
3995
4024
|
var colors = getColors(props);
|
|
3996
4025
|
var semanticColors = getSemanticColors(props);
|
|
3997
|
-
return css(templateObject_4$
|
|
4026
|
+
return css(templateObject_4$n || (templateObject_4$n = __makeTemplateObject(["\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n\n &:disabled {\n color: ", ";\n }\n "], ["\n color: ", ";\n\n &:hover {\n color: ", ";\n }\n\n &:active {\n color: ", ";\n }\n\n &:disabled {\n color: ", ";\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.iconPrimary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimaryHover, (_c = colors === null || colors === void 0 ? void 0 : colors[iconColor]) === null || _c === void 0 ? void 0 : _c[shade], (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.iconDisabled);
|
|
3998
4027
|
}
|
|
3999
|
-
var doNotForwardProps$
|
|
4028
|
+
var doNotForwardProps$r = ["sdsIcon", "sdsSize", "sdsType", "iconColor"];
|
|
4000
4029
|
var StyledSvgIcon = styled(SvgIcon, {
|
|
4001
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4002
|
-
})(templateObject_6$
|
|
4030
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$r.includes(prop); },
|
|
4031
|
+
})(templateObject_6$d || (templateObject_6$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4003
4032
|
var sdsType = props.sdsType;
|
|
4004
|
-
return css(templateObject_5$
|
|
4033
|
+
return css(templateObject_5$i || (templateObject_5$i = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n "])), sdsType !== "iconButton" && iconSize(props), sdsType === "static" && staticStyle(props), sdsType === "interactive" && interactive(props), sdsType === "button" && buttonStyle());
|
|
4005
4034
|
});
|
|
4006
|
-
var StyledIcon = styled("div")(templateObject_7$
|
|
4007
|
-
var templateObject_1$
|
|
4035
|
+
var StyledIcon = styled("div")(templateObject_7$9 || (templateObject_7$9 = __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"])));
|
|
4036
|
+
var templateObject_1$U, templateObject_2$z, templateObject_3$r, templateObject_4$n, templateObject_5$i, templateObject_6$d, templateObject_7$9;
|
|
4008
4037
|
|
|
4009
4038
|
/**
|
|
4010
4039
|
* @see https://mui.com/material-ui/icons/#icons
|
|
@@ -4035,7 +4064,7 @@ var StyledAccordion = styled(Accordion$1, {
|
|
|
4035
4064
|
shouldForwardProp: function (prop) {
|
|
4036
4065
|
return !sdsPropNames$3.includes(prop.toString());
|
|
4037
4066
|
},
|
|
4038
|
-
})(templateObject_2$
|
|
4067
|
+
})(templateObject_2$y || (templateObject_2$y = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4039
4068
|
var _a, _b, _c;
|
|
4040
4069
|
var useDivider = props.useDivider, togglePosition = props.togglePosition;
|
|
4041
4070
|
var shadows = getShadows(props);
|
|
@@ -4043,17 +4072,17 @@ var StyledAccordion = styled(Accordion$1, {
|
|
|
4043
4072
|
var borders = getBorders(props);
|
|
4044
4073
|
var spaces = getSpaces(props);
|
|
4045
4074
|
var semanticColors = getSemanticColors(props);
|
|
4046
|
-
return css(templateObject_1$
|
|
4075
|
+
return css(templateObject_1$T || (templateObject_1$T = __makeTemplateObject(["\n &.", " {\n background-color: ", ";\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: ", ";\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, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfaceBackground, shadows === null || shadows === void 0 ? void 0 : shadows.none, (_b = typography === null || typography === void 0 ? void 0 : typography.fontFamily) === null || _b === void 0 ? void 0 : _b.body, useDivider ? (_c = borders === null || borders === void 0 ? void 0 : borders.base) === null || _c === void 0 ? void 0 : _c.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));
|
|
4047
4076
|
});
|
|
4048
4077
|
var leftPosition = function (props) {
|
|
4049
4078
|
var _a, _b, _c;
|
|
4050
4079
|
var spaces = getSpaces(props);
|
|
4051
4080
|
var iconSizes = getIconSizes(props);
|
|
4052
|
-
return css(templateObject_3$
|
|
4081
|
+
return css(templateObject_3$q || (templateObject_3$q = __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) +
|
|
4053
4082
|
((_b = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs.width) !== null && _b !== void 0 ? _b : 12) +
|
|
4054
4083
|
((_c = spaces === null || spaces === void 0 ? void 0 : spaces.s) !== null && _c !== void 0 ? _c : 8));
|
|
4055
4084
|
};
|
|
4056
|
-
var templateObject_1$
|
|
4085
|
+
var templateObject_1$T, templateObject_2$y, templateObject_3$q;
|
|
4057
4086
|
|
|
4058
4087
|
/**
|
|
4059
4088
|
* @see https://mui.com/material-ui/react-accordion/
|
|
@@ -4069,7 +4098,7 @@ var Accordion = React__default.forwardRef(function (props, ref) {
|
|
|
4069
4098
|
return (jsx(StyledAccordion, __assign({ square: true, useDivider: useDivider, togglePosition: togglePosition, expanded: expanded === id, onChange: handleChange(id), ref: ref }, props, { children: children })));
|
|
4070
4099
|
});
|
|
4071
4100
|
|
|
4072
|
-
var StyledAlert = styled(Alert$2)(templateObject_1$
|
|
4101
|
+
var StyledAlert = styled(Alert$2)(templateObject_1$S || (templateObject_1$S = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4073
4102
|
var _a;
|
|
4074
4103
|
var colors = getColors(props);
|
|
4075
4104
|
var spaces = getSpaces(props);
|
|
@@ -4096,7 +4125,7 @@ function severityToColor(alertSeverity, colors) {
|
|
|
4096
4125
|
return colors === null || colors === void 0 ? void 0 : colors.green;
|
|
4097
4126
|
}
|
|
4098
4127
|
}
|
|
4099
|
-
var templateObject_1$
|
|
4128
|
+
var templateObject_1$S;
|
|
4100
4129
|
|
|
4101
4130
|
/**
|
|
4102
4131
|
* @see https://mui.com/material-ui/react-alert/
|
|
@@ -4187,7 +4216,7 @@ var showWarningIfFirstOccurence = function (warningType) {
|
|
|
4187
4216
|
SDS_WARNINGS[warningType].hasWarned = true;
|
|
4188
4217
|
};
|
|
4189
4218
|
|
|
4190
|
-
var doNotForwardProps$
|
|
4219
|
+
var doNotForwardProps$q = [
|
|
4191
4220
|
"isAllCaps",
|
|
4192
4221
|
"isRounded",
|
|
4193
4222
|
"sdsStyle",
|
|
@@ -4221,11 +4250,11 @@ var ButtonStyles = function (props) {
|
|
|
4221
4250
|
var disabledBorder = variant === "outlined"
|
|
4222
4251
|
? "inset 0 0 0 1px ".concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.borderDisabled)
|
|
4223
4252
|
: "none";
|
|
4224
|
-
return css(templateObject_1$
|
|
4253
|
+
return css(templateObject_1$R || (templateObject_1$R = __makeTemplateObject(["\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n padding: ", ";\n color: ", ";\n line-height: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n background-color: ", ";\n box-shadow: ", ";\n border: none;\n\n svg {\n color: ", ";\n }\n }\n\n .", ", .", " {\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n max-width: ", "px;\n max-height: ", "px;\n }\n }\n\n .", " {\n margin-right: ", "px;\n margin-left: 0;\n }\n\n .", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n "], ["\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n padding: ", ";\n color: ", ";\n line-height: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n background-color: ", ";\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:disabled {\n color: ", ";\n background-color: ", ";\n box-shadow: ", ";\n border: none;\n\n svg {\n color: ", ";\n }\n }\n\n .", ", .", " {\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n max-width: ", "px;\n max-height: ", "px;\n }\n }\n\n .", " {\n margin-right: ", "px;\n margin-left: 0;\n }\n\n .", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n "])), backgroundColor, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _h === void 0 ? void 0 : _h.border, 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.iconPrimaryInverse, (_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.iconPrimaryInverse, (_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.iconDisabled, 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);
|
|
4225
4254
|
};
|
|
4226
4255
|
var Rounded = function (props) {
|
|
4227
4256
|
var corners = getCorners(props);
|
|
4228
|
-
return css(templateObject_2$
|
|
4257
|
+
return css(templateObject_2$x || (templateObject_2$x = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.l);
|
|
4229
4258
|
};
|
|
4230
4259
|
var DestructiveButton = function (props) {
|
|
4231
4260
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s;
|
|
@@ -4241,13 +4270,13 @@ var DestructiveButton = function (props) {
|
|
|
4241
4270
|
var backgroundColor = variant === "outlined"
|
|
4242
4271
|
? "transparent"
|
|
4243
4272
|
: (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _e === void 0 ? void 0 : _e.fillPrimary;
|
|
4244
|
-
return css(templateObject_3$
|
|
4273
|
+
return css(templateObject_3$p || (templateObject_3$p = __makeTemplateObject(["\n border: none;\n box-shadow: inset 0 0 0 1px ", ";\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: inset 0 0 0 1px ", ";\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 "])), (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.negative) === null || _f === void 0 ? void 0 : _f.border, 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.iconPrimaryInverse, (_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.iconPrimaryInverse, (_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.iconDisabled);
|
|
4245
4274
|
};
|
|
4246
4275
|
var StyledButton$3 = styled(Button$1, {
|
|
4247
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4248
|
-
})(templateObject_5$
|
|
4276
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
4277
|
+
})(templateObject_5$h || (templateObject_5$h = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4249
4278
|
var sdsStyle = props.sdsStyle, sdsType = props.sdsType, isAllCaps = props.isAllCaps;
|
|
4250
|
-
return css(templateObject_4$
|
|
4279
|
+
return css(templateObject_4$m || (templateObject_4$m = __makeTemplateObject(["\n ", "\n\n ", "\n ", "\n ", "\n "], ["\n ", "\n\n ", "\n ", "\n ", "\n "])), isAllCaps ? fontCapsXxs(props) : fontBodySemiboldXs(props), ButtonStyles(props), sdsStyle === "rounded" && Rounded(props), sdsType === "destructive" && DestructiveButton(props));
|
|
4251
4280
|
});
|
|
4252
4281
|
// Minimal Button Styles
|
|
4253
4282
|
var Minimal = function (props) {
|
|
@@ -4256,26 +4285,26 @@ var Minimal = function (props) {
|
|
|
4256
4285
|
var spaces = getSpaces(props);
|
|
4257
4286
|
var iconSizes = getIconSizes(props);
|
|
4258
4287
|
var semanticColors = getSemanticColors(props);
|
|
4259
|
-
return css(templateObject_6$
|
|
4288
|
+
return css(templateObject_6$c || (templateObject_6$c = __makeTemplateObject(["\n ", "\n ", "\n\n min-width: unset;\n padding: ", "px ", "px;\n\n &:hover,\n &:focus-visible {\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n &:disabled {\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n .", ", .", " {\n height: ", "px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n svg {\n max-width: ", "px;\n max-height: ", "px;\n }\n }\n\n .", " {\n margin-right: ", "px;\n margin-left: 0;\n }\n\n .", " {\n margin-left: ", "px;\n margin-right: 0;\n }\n "], ["\n ", "\n ", "\n\n min-width: unset;\n padding: ", "px ", "px;\n\n &:hover,\n &:focus-visible {\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n color: ", ";\n\n svg {\n color: ", ";\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.iconHover, (_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.accent) === null || _e === void 0 ? void 0 : _e.iconPressed, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textDisabled, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.iconDisabled, buttonClasses.startIcon, buttonClasses.endIcon, (_h = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s) === null || _h === void 0 ? void 0 : _h.width, (_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, buttonClasses.startIcon, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, buttonClasses.endIcon, spaces === null || spaces === void 0 ? void 0 : spaces.xxs);
|
|
4260
4289
|
};
|
|
4261
4290
|
var PrimaryMinimalButton = function (props) {
|
|
4262
4291
|
var _a;
|
|
4263
4292
|
var semanticColors = getSemanticColors(props);
|
|
4264
|
-
return css(templateObject_7$
|
|
4293
|
+
return css(templateObject_7$8 || (templateObject_7$8 = __makeTemplateObject(["\n ", "\n color: ", ";\n "], ["\n ", "\n color: ", ";\n "])), Minimal(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.textAction);
|
|
4265
4294
|
};
|
|
4266
4295
|
var SecondaryMinimalButton = function (props) {
|
|
4267
4296
|
var _a;
|
|
4268
4297
|
var semanticColors = getSemanticColors(props);
|
|
4269
|
-
return css(templateObject_8$
|
|
4298
|
+
return css(templateObject_8$6 || (templateObject_8$6 = __makeTemplateObject(["\n ", "\n color: ", ";\n "], ["\n ", "\n color: ", ";\n "])), Minimal(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary);
|
|
4270
4299
|
};
|
|
4271
4300
|
var StyledMinimalButton = styled(Button$1, {
|
|
4272
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4301
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
4273
4302
|
})(templateObject_10$2 || (templateObject_10$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4274
4303
|
var sdsType = props.sdsType;
|
|
4275
4304
|
return css(templateObject_9$3 || (templateObject_9$3 = __makeTemplateObject(["\n ", "\n ", "\n "], ["\n ", "\n ", "\n "])), sdsType === "primary" && PrimaryMinimalButton(props), sdsType === "secondary" && SecondaryMinimalButton(props));
|
|
4276
4305
|
});
|
|
4277
4306
|
var StyledButtonLegacy = styled(Button$1, {
|
|
4278
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4307
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$q.includes(prop); },
|
|
4279
4308
|
})(templateObject_11$1 || (templateObject_11$1 = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4280
4309
|
if (!props.isRounded)
|
|
4281
4310
|
return "";
|
|
@@ -4283,47 +4312,47 @@ var StyledButtonLegacy = styled(Button$1, {
|
|
|
4283
4312
|
var spaces = getSpaces(props);
|
|
4284
4313
|
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 ");
|
|
4285
4314
|
});
|
|
4286
|
-
var templateObject_1$
|
|
4315
|
+
var templateObject_1$R, templateObject_2$x, templateObject_3$p, templateObject_4$m, templateObject_5$h, templateObject_6$c, templateObject_7$8, templateObject_8$6, templateObject_9$3, templateObject_10$2, templateObject_11$1;
|
|
4287
4316
|
|
|
4288
4317
|
var isDisabled$1 = function (props) {
|
|
4289
4318
|
var _a, _b;
|
|
4290
4319
|
var semanticColors = getSemanticColors(props);
|
|
4291
|
-
return css(templateObject_1$
|
|
4320
|
+
return css(templateObject_1$Q || (templateObject_1$Q = __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.iconDisabled, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconDisabled);
|
|
4292
4321
|
};
|
|
4293
4322
|
var primary$2 = function (props) {
|
|
4294
4323
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4295
4324
|
var semanticColors = getSemanticColors(props);
|
|
4296
|
-
return css(templateObject_2$
|
|
4325
|
+
return css(templateObject_2$w || (templateObject_2$w = __makeTemplateObject(["\n color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n "], ["\n color: ", ";\n\n svg {\n color: ", ";\n }\n\n &:hover {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n\n &:active {\n background: ", ";\n color: ", ";\n\n svg {\n color: ", ";\n }\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.textAction, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.icon, (_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.textActionHover, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.iconHover, (_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.textActionPressed, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _h === void 0 ? void 0 : _h.iconPressed);
|
|
4297
4326
|
};
|
|
4298
4327
|
var secondary$2 = function (props) {
|
|
4299
4328
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
4300
4329
|
var semanticColors = getSemanticColors(props);
|
|
4301
|
-
return css(templateObject_3$
|
|
4330
|
+
return css(templateObject_3$o || (templateObject_3$o = __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.iconPrimary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimary, (_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.iconHover, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.iconHover, (_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.iconPressed, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _h === void 0 ? void 0 : _h.iconPressed);
|
|
4302
4331
|
};
|
|
4303
4332
|
var tertiary = function (props) {
|
|
4304
4333
|
var _a, _b, _c, _d, _e, _f;
|
|
4305
4334
|
var semanticColors = getSemanticColors(props);
|
|
4306
|
-
return css(templateObject_4$
|
|
4335
|
+
return css(templateObject_4$l || (templateObject_4$l = __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.iconPrimary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimary, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.iconPrimaryHover, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.iconPrimaryHover, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.iconPrimaryPressed, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.iconPrimaryPressed);
|
|
4307
4336
|
};
|
|
4308
4337
|
var small$1 = function (props) {
|
|
4309
4338
|
var sdsType = props.sdsType;
|
|
4310
4339
|
var iconSizes = getIconSizes(props);
|
|
4311
4340
|
var spaces = getSpaces(props);
|
|
4312
|
-
return css(templateObject_5$
|
|
4341
|
+
return css(templateObject_5$g || (templateObject_5$g = __makeTemplateObject(["\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "], ["\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "])), iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, sdsType !== "tertiary" ? "margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;") : "");
|
|
4313
4342
|
};
|
|
4314
4343
|
var medium$1 = function (props) {
|
|
4315
4344
|
var sdsType = props.sdsType;
|
|
4316
4345
|
var iconSizes = getIconSizes(props);
|
|
4317
4346
|
var spaces = getSpaces(props);
|
|
4318
|
-
return css(templateObject_6$
|
|
4347
|
+
return css(templateObject_6$b || (templateObject_6$b = __makeTemplateObject(["\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "], ["\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "])), iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.width, sdsType !== "tertiary" ? "margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;") : "");
|
|
4319
4348
|
};
|
|
4320
4349
|
var large = function (props) {
|
|
4321
4350
|
var sdsType = props.sdsType;
|
|
4322
4351
|
var iconSizes = getIconSizes(props);
|
|
4323
4352
|
var spaces = getSpaces(props);
|
|
4324
|
-
return css(templateObject_7$
|
|
4353
|
+
return css(templateObject_7$7 || (templateObject_7$7 = __makeTemplateObject(["\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "], ["\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n ", "\n }\n "])), iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xl.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xl.height, sdsType !== "tertiary" ? "margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;") : "");
|
|
4325
4354
|
};
|
|
4326
|
-
var doNotForwardProps$
|
|
4355
|
+
var doNotForwardProps$p = [
|
|
4327
4356
|
"on",
|
|
4328
4357
|
"sdsSize",
|
|
4329
4358
|
"sdsType",
|
|
@@ -4332,12 +4361,12 @@ var doNotForwardProps$o = [
|
|
|
4332
4361
|
"sdsIconProps",
|
|
4333
4362
|
];
|
|
4334
4363
|
var StyledButtonIcon = styled(IconButton, {
|
|
4335
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4364
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$p.includes(prop); },
|
|
4336
4365
|
})(templateObject_9$2 || (templateObject_9$2 = __makeTemplateObject(["\n padding: 0;\n ", "\n\n ", "\n"], ["\n padding: 0;\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
4337
4366
|
var disabled = props.disabled, _a = props.sdsSize, sdsSize = _a === void 0 ? "medium" : _a, _b = props.sdsType, sdsType = _b === void 0 ? "primary" : _b;
|
|
4338
|
-
return css(templateObject_8$
|
|
4367
|
+
return css(templateObject_8$5 || (templateObject_8$5 = __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));
|
|
4339
4368
|
});
|
|
4340
|
-
var templateObject_1$
|
|
4369
|
+
var templateObject_1$Q, templateObject_2$w, templateObject_3$o, templateObject_4$l, templateObject_5$g, templateObject_6$b, templateObject_7$7, templateObject_8$5, templateObject_9$2;
|
|
4341
4370
|
|
|
4342
4371
|
var ButtonIconSizeToSdsIconSize = {
|
|
4343
4372
|
large: "xl",
|
|
@@ -4438,24 +4467,19 @@ var rounded$3 = function (props) {
|
|
|
4438
4467
|
var _a;
|
|
4439
4468
|
var corners = getCorners(props);
|
|
4440
4469
|
var semanticColors = getSemanticColors(props);
|
|
4441
|
-
return css(templateObject_1$
|
|
4470
|
+
return css(templateObject_1$P || (templateObject_1$P = __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.border);
|
|
4442
4471
|
};
|
|
4443
|
-
var
|
|
4472
|
+
var applyIntentColor$2 = function (props, intent) {
|
|
4444
4473
|
var _a, _b, _c, _d;
|
|
4445
4474
|
var semanticColors = getSemanticColors(props);
|
|
4446
|
-
return css(templateObject_2$
|
|
4447
|
-
};
|
|
4448
|
-
var warning$1 = function (props) {
|
|
4449
|
-
var _a, _b, _c, _d;
|
|
4450
|
-
var semanticColors = getSemanticColors(props);
|
|
4451
|
-
return css(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n .", " .", " {\n border: 1px solid ", ";\n }\n\n .", ":hover\n .", " {\n border: 1px solid ", ";\n }\n\n .", ".", " {\n .", " {\n border: 1px solid ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "], ["\n .", " .", " {\n border: 1px solid ", ";\n }\n\n .", ":hover\n .", " {\n border: 1px solid ", ";\n }\n\n .", ".", " {\n .", " {\n border: 1px solid ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "])), outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.notice) === null || _a === void 0 ? void 0 : _a.border, outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderHover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderHover, inputAdornmentClasses.root, buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.iconPrimaryHover);
|
|
4475
|
+
return css(templateObject_2$v || (templateObject_2$v = __makeTemplateObject(["\n .", " .", " {\n border: 1px solid ", ";\n }\n\n .", ":hover\n .", " {\n border: 1px solid ", ";\n }\n\n .", ".", " {\n .", " {\n border: 1px solid ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "], ["\n .", " .", " {\n border: 1px solid ", ";\n }\n\n .", ":hover\n .", " {\n border: 1px solid ", ";\n }\n\n .", ".", " {\n .", " {\n border: 1px solid ", ";\n }\n\n .", " .", ":last-of-type {\n cursor: default;\n svg {\n color: ", ";\n }\n }\n }\n "])), outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _a === void 0 ? void 0 : _a.border, outlinedInputClasses.root, outlinedInputClasses.notchedOutline, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderHover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderHover, inputAdornmentClasses.root, buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.iconPrimaryHover);
|
|
4452
4476
|
};
|
|
4453
4477
|
var disabledStyled$2 = function (props) {
|
|
4454
4478
|
var _a, _b, _c, _d;
|
|
4455
4479
|
var semanticColors = getSemanticColors(props);
|
|
4456
|
-
return css(
|
|
4480
|
+
return css(templateObject_3$n || (templateObject_3$n = __makeTemplateObject(["\n .", " {\n .", " {\n border: 1px solid ", " !important;\n }\n\n .", " svg {\n color: ", ";\n }\n\n &:hover .", " {\n border: 1px solid ", ";\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 border: 1px solid ", ";\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.borderDisabled, inputAdornmentClasses.root, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconDisabled, outlinedInputClasses.notchedOutline, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderDisabled, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.textDisabled);
|
|
4457
4481
|
};
|
|
4458
|
-
var StyledLabel$2 = styled("label")(
|
|
4482
|
+
var StyledLabel$2 = styled("label")(templateObject_4$k || (templateObject_4$k = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyM$1, function (props) {
|
|
4459
4483
|
var spaces = getSpaces(props);
|
|
4460
4484
|
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 ");
|
|
4461
4485
|
});
|
|
@@ -4463,18 +4487,18 @@ var StyledSearchBase = styled(TextField, {
|
|
|
4463
4487
|
shouldForwardProp: function (prop) {
|
|
4464
4488
|
return !sdsPropNames$2.includes(prop.toString());
|
|
4465
4489
|
},
|
|
4466
|
-
})(
|
|
4490
|
+
})(templateObject_6$a || (templateObject_6$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4467
4491
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o;
|
|
4468
4492
|
var intent = props.intent, disabled = props.disabled, sdsStyle = props.sdsStyle;
|
|
4469
4493
|
var spaces = getSpaces(props);
|
|
4470
4494
|
var iconSizes = getIconSizes(props);
|
|
4471
4495
|
var semanticColors = getSemanticColors(props);
|
|
4472
|
-
return css(
|
|
4496
|
+
return css(templateObject_5$f || (templateObject_5$f = __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 opacity: 0;\n cursor: pointer;\n\n svg {\n height: ", "px;\n width: ", "px;\n }\n }\n\n .", " {\n padding: 0 ", "px;\n background-color: ", ";\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 opacity: 1;\n\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 background-color: ", ";\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 opacity: 0;\n cursor: pointer;\n\n svg {\n height: ", "px;\n width: ", "px;\n }\n }\n\n .", " {\n padding: 0 ", "px;\n background-color: ", ";\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 opacity: 1;\n\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 background-color: ", ";\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, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.surfacePrimary, outlinedInputClasses.input, spaces === null || spaces === void 0 ? void 0 : spaces.l, 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.border, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.iconPrimary, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.iconPrimaryHover, (_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, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.surfacePrimary, outlinedInputClasses.root, buttonBaseClasses.root, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.iconPrimaryHover, outlinedInputClasses.notchedOutline, (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.borderHover, outlinedInputClasses.root, outlinedInputClasses.focused, outlinedInputClasses.notchedOutline, (_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _l === void 0 ? void 0 : _l.border, inputAdornmentClasses.root, buttonBaseClasses.root, (_m = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _m === void 0 ? void 0 : _m.icon, outlinedInputClasses.root, (_o = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _o === void 0 ? void 0 : _o.borderHover, 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));
|
|
4473
4497
|
});
|
|
4474
|
-
var StyledInputAdornment = styled(InputAdornment)(
|
|
4475
|
-
var templateObject_1$
|
|
4498
|
+
var StyledInputAdornment = styled(InputAdornment)(templateObject_7$6 || (templateObject_7$6 = __makeTemplateObject(["\n position: relative;\n height: unset;\n margin: 0;\n"], ["\n position: relative;\n height: unset;\n margin: 0;\n"])));
|
|
4499
|
+
var templateObject_1$P, templateObject_2$v, templateObject_3$n, templateObject_4$k, templateObject_5$f, templateObject_6$a, templateObject_7$6;
|
|
4476
4500
|
|
|
4477
|
-
var StyledMenuItem$1 = styled(MenuItem$1)(templateObject_1$
|
|
4501
|
+
var StyledMenuItem$1 = styled(MenuItem$1)(templateObject_1$O || (templateObject_1$O = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4478
4502
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
4479
4503
|
var selected = props.selected;
|
|
4480
4504
|
var fontWeights = getFontWeights(props);
|
|
@@ -4482,7 +4506,7 @@ var StyledMenuItem$1 = styled(MenuItem$1)(templateObject_1$L || (templateObject_
|
|
|
4482
4506
|
var semanticColors = getSemanticColors(props);
|
|
4483
4507
|
return "\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px !important;\n min-height: unset;\n opacity: 1;\n\n &.MuiAutocomplete-option {\n min-height: unset;\n }\n \n .primary-text {\n font-weight: ").concat(selected ? fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold : fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.regular, ";\n }\n\n &.MuiButtonBase-root {\n background-color: transparent;\n opacity: 1;\n\n &:hover, &.").concat(menuItemClasses.focusVisible, " {\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.fillHover, ";\n\n &[aria-selected=\"true\"] {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n }\n }\n }\n\n &.").concat(menuItemClasses.root, " .MuiSvgIcon-root {\n align-self: flex-start;\n }\n\n &.").concat(menuItemClasses.root, " .").concat(menuItemClasses.disabled, " {\n opacity: 1 !important;\n }\n\n &.MuiAutocomplete-option[aria-selected=\"true\"] {\n &:hover {\n background-color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillHover, " !important;\n }\n\n svg.check-icon {\n color: ").concat(selected ? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.iconSelected : (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.iconPrimary, ";\n }\n }\n\n &.MuiAutocomplete-option[aria-disabled=\"true\"] {\n opacity: 1;\n }\n\n &:hover {\n background-color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.fillHover, ";\n svg.check-icon {\n color: ").concat(selected ? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _g === void 0 ? void 0 : _g.iconHover : (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.iconPrimary, ";\n }\n }\n\n &.Mui-selected.MuiListItem-root.MuiListItem-button {\n background-color: ").concat((_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.surfacePrimary, ";\n &:hover {\n background-color: ").concat((_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.fillHover, ";\n }\n .primary-text {\n font-weight: ").concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n }\n }\n\n &:active {\n svg.check-icon {\n color: ").concat((_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _l === void 0 ? void 0 : _l.iconPressed, ";\n }\n\n &:active {\n svg.check-icon {\n color: ").concat((_m = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _m === void 0 ? void 0 : _m.iconPressed, ";\n }\n\n .primary-text {\n font-weight: ").concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n }\n }\n }\n ");
|
|
4484
4508
|
});
|
|
4485
|
-
var ContentWrapper = styled("span")(templateObject_2$
|
|
4509
|
+
var ContentWrapper = styled("span")(templateObject_2$u || (templateObject_2$u = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n width: 100%;\n"], ["\n display: flex;\n justify-content: space-between;\n align-items: flex-start;\n width: 100%;\n"])));
|
|
4486
4510
|
var disabledStyles = function (props) {
|
|
4487
4511
|
var _a;
|
|
4488
4512
|
var disabled = props.disabled;
|
|
@@ -4491,12 +4515,12 @@ var disabledStyles = function (props) {
|
|
|
4491
4515
|
var semanticColors = getSemanticColors(props);
|
|
4492
4516
|
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 ");
|
|
4493
4517
|
};
|
|
4494
|
-
var TextWrapper = styled("span")(templateObject_3$
|
|
4518
|
+
var TextWrapper = styled("span")(templateObject_3$m || (templateObject_3$m = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
4495
4519
|
var _a;
|
|
4496
4520
|
var semanticColors = getSemanticColors(props);
|
|
4497
4521
|
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 ");
|
|
4498
4522
|
}, disabledStyles);
|
|
4499
|
-
var StyledMenuItemIcon = styled("span")(templateObject_4$
|
|
4523
|
+
var StyledMenuItemIcon = styled("span")(templateObject_4$j || (templateObject_4$j = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4500
4524
|
var _a;
|
|
4501
4525
|
var disabled = props.disabled;
|
|
4502
4526
|
var spaces = getSpaces(props);
|
|
@@ -4504,20 +4528,20 @@ var StyledMenuItemIcon = styled("span")(templateObject_4$i || (templateObject_4$
|
|
|
4504
4528
|
var semanticColors = getSemanticColors(props);
|
|
4505
4529
|
return "\n margin-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n margin-top: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n\n .MuiSvgIcon-root {\n ").concat(disabled ? "color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.iconDisabled, ";") : null, "\n }\n ");
|
|
4506
4530
|
});
|
|
4507
|
-
var ColumnWrapper = styled("span")(templateObject_5$
|
|
4531
|
+
var ColumnWrapper = styled("span")(templateObject_5$e || (templateObject_5$e = __makeTemplateObject(["\n ", "\n\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
4508
4532
|
var _a;
|
|
4509
4533
|
var semanticColors = getSemanticColors(props);
|
|
4510
4534
|
var spaces = getSpaces(props);
|
|
4511
4535
|
return "\n text-align: right;\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n ");
|
|
4512
4536
|
}, disabledStyles);
|
|
4513
|
-
var StyledIconWrapper = styled("span")(templateObject_6$
|
|
4537
|
+
var StyledIconWrapper = styled("span")(templateObject_6$9 || (templateObject_6$9 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4514
4538
|
var spaces = getSpaces(props);
|
|
4515
4539
|
var iconSizes = getIconSizes(props);
|
|
4516
4540
|
return "\n align-self: start;\n margin-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n margin-top: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n height: ").concat(iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, "px;\n ");
|
|
4517
4541
|
});
|
|
4518
4542
|
var StyledCheck = styled(Check, {
|
|
4519
4543
|
shouldForwardProp: function (prop) { return prop !== "selected"; },
|
|
4520
|
-
})(templateObject_7$
|
|
4544
|
+
})(templateObject_7$5 || (templateObject_7$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4521
4545
|
var _a, _b;
|
|
4522
4546
|
var selected = props.selected, disabled = props.disabled;
|
|
4523
4547
|
var iconSizes = getIconSizes(props);
|
|
@@ -4539,7 +4563,7 @@ var StyledMinus = styled(Remove, {
|
|
|
4539
4563
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.icon;
|
|
4540
4564
|
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 ");
|
|
4541
4565
|
});
|
|
4542
|
-
var templateObject_1$
|
|
4566
|
+
var templateObject_1$O, templateObject_2$u, templateObject_3$m, templateObject_4$j, templateObject_5$e, templateObject_6$9, templateObject_7$5, templateObject_8$4;
|
|
4543
4567
|
|
|
4544
4568
|
/**
|
|
4545
4569
|
* @see https://mui.com/material-ui/react-menu/
|
|
@@ -4705,7 +4729,7 @@ var InputSearch = forwardRef(function InputSearch(props, ref) {
|
|
|
4705
4729
|
autoComplete: "one-time-code" }, rest))] }));
|
|
4706
4730
|
});
|
|
4707
4731
|
|
|
4708
|
-
var doNotForwardProps$
|
|
4732
|
+
var doNotForwardProps$o = [
|
|
4709
4733
|
"count",
|
|
4710
4734
|
"keepSearchOnSelect",
|
|
4711
4735
|
"search",
|
|
@@ -4714,8 +4738,8 @@ var doNotForwardProps$n = [
|
|
|
4714
4738
|
"onClickAway",
|
|
4715
4739
|
];
|
|
4716
4740
|
var StyledAutocompleteBase = styled(Autocomplete$1, {
|
|
4717
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4718
|
-
})(templateObject_1$
|
|
4741
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
4742
|
+
})(templateObject_1$N || (templateObject_1$N = __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) {
|
|
4719
4743
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
4720
4744
|
var search = props.search;
|
|
4721
4745
|
var spaces = getSpaces(props);
|
|
@@ -4724,8 +4748,8 @@ var StyledAutocompleteBase = styled(Autocomplete$1, {
|
|
|
4724
4748
|
return "\n ".concat(!search && "height: 0; margin: 0 !important;", ";\n \n // (masoudmanson): We need to apply the focus styles to the input element\n // when the user is tabbing through the options. To find out more, take a\n // look at the useDetectUserTabbing hook.\n &[data-user-is-tabbing=\"true\"]:focus-within {\n border-radius: 4px;\n outline: 2px solid ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderHover, ";\n outline-offset: 1px;\n }\n\n .MuiFormControl-root {\n outline: none;\n }\n\n .MuiOutlinedInput-root.MuiInputBase-formControl.MuiInputBase-adornedEnd {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n\n .MuiAutocomplete-input {\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n }\n }\n\n & + .").concat(autocompleteClasses.popper, " > .").concat(autocompleteClasses.paper, " {\n .").concat(autocompleteClasses.listbox, " {\n max-height: 40vh;\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0;\n\n .").concat(autocompleteClasses.option, " {\n min-height: unset;\n\n &.").concat(autocompleteClasses.focused, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.surfaceSecondary, ";\n }\n\n &[aria-selected=\"true\"] {\n background-color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.surfacePrimary, ";\n }\n\n &[aria-disabled=\"true\"] {\n opacity: 1;\n }\n\n &[aria-selected=\"true\"].").concat(autocompleteClasses.focused, " {\n background-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.surfaceSecondary, ";\n }\n }\n\n & > li:last-child .").concat(autocompleteClasses.groupUl, " {\n border-bottom: none;\n margin-bottom: 0;\n padding-bottom: 0;\n }\n }\n\n .").concat(autocompleteClasses.groupLabel, " {\n top: 0;\n color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.textSecondary, ";\n background-color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.surfacePrimary, ";\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n }\n\n .").concat(autocompleteClasses.groupUl, " {\n position: relative;\n margin: 0 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n border-bottom: ").concat((_g = borders === null || borders === void 0 ? void 0 : borders.base) === null || _g === void 0 ? void 0 : _g.divider, ";\n padding-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n\n & li:last-of-type {\n position: relative;\n }\n }\n\n .").concat(autocompleteClasses.noOptions, " {\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n }\n\n .").concat(autocompleteClasses.loading, " {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0;\n }\n }\n ");
|
|
4725
4749
|
});
|
|
4726
4750
|
var InputBaseWrapper$1 = styled("div", {
|
|
4727
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4728
|
-
})(templateObject_2$
|
|
4751
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
4752
|
+
})(templateObject_2$t || (templateObject_2$t = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4729
4753
|
var search = props.search;
|
|
4730
4754
|
if (!search) {
|
|
4731
4755
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -4735,12 +4759,12 @@ var InputBaseWrapper$1 = styled("div", {
|
|
|
4735
4759
|
}
|
|
4736
4760
|
});
|
|
4737
4761
|
var StyledMenuInputSearch$1 = styled(InputSearch, {
|
|
4738
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
4739
|
-
})(templateObject_3$
|
|
4762
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$o.includes(prop); },
|
|
4763
|
+
})(templateObject_3$l || (templateObject_3$l = __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) {
|
|
4740
4764
|
var search = _a.search;
|
|
4741
4765
|
return (search ? "auto" : "transparent");
|
|
4742
4766
|
});
|
|
4743
|
-
var StyledPaper$3 = styled(Paper)(templateObject_4$
|
|
4767
|
+
var StyledPaper$3 = styled(Paper)(templateObject_4$i || (templateObject_4$i = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4744
4768
|
var _a;
|
|
4745
4769
|
var spaces = getSpaces(props);
|
|
4746
4770
|
var corners = getCorners(props);
|
|
@@ -4749,13 +4773,13 @@ var StyledPaper$3 = styled(Paper)(templateObject_4$h || (templateObject_4$h = __
|
|
|
4749
4773
|
var semanticColors = getSemanticColors(props);
|
|
4750
4774
|
return "\n background-image: none;\n padding: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ;\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, ";\n border: ").concat(borders === null || borders === void 0 ? void 0 : borders.none, ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.m, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n box-sizing: border-box;\n ");
|
|
4751
4775
|
});
|
|
4752
|
-
var StyledMenuItemDetails = styled("div")(templateObject_5$
|
|
4776
|
+
var StyledMenuItemDetails = styled("div")(templateObject_5$d || (templateObject_5$d = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
4753
4777
|
var _a;
|
|
4754
4778
|
var semanticColors = getSemanticColors(props);
|
|
4755
4779
|
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 ");
|
|
4756
4780
|
});
|
|
4757
|
-
var StyledMenuItemText = styled("div")(templateObject_6$
|
|
4758
|
-
var templateObject_1$
|
|
4781
|
+
var StyledMenuItemText = styled("div")(templateObject_6$8 || (templateObject_6$8 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n"], ["\n display: flex;\n flex-direction: column;\n"])));
|
|
4782
|
+
var templateObject_1$N, templateObject_2$t, templateObject_3$l, templateObject_4$i, templateObject_5$d, templateObject_6$8;
|
|
4759
4783
|
|
|
4760
4784
|
var AutocompleteBase = function (props) {
|
|
4761
4785
|
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;
|
|
@@ -4920,27 +4944,27 @@ var AutocompleteBase = function (props) {
|
|
|
4920
4944
|
}
|
|
4921
4945
|
};
|
|
4922
4946
|
|
|
4923
|
-
var StyledColumn = styled("div")(templateObject_1$
|
|
4947
|
+
var StyledColumn = styled("div")(templateObject_1$M || (templateObject_1$M = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4924
4948
|
var _a;
|
|
4925
4949
|
var _b = props.width, width = _b === void 0 ? 280 : _b;
|
|
4926
4950
|
var spaces = getSpaces(props);
|
|
4927
4951
|
var borders = getBorders(props);
|
|
4928
4952
|
return "\n position: relative;\n width: ".concat(width, "px;\n\n &:not(:last-child) {\n border-right: ").concat((_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.divider, ";\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n }\n\n // (masoudmanson): This code hides the relation icon of the last column\n &:last-of-type {\n .SdsAutocompleteMultiColumn-column-relation-icon {\n display: none;\n }\n }\n ");
|
|
4929
4953
|
});
|
|
4930
|
-
var StyledColumnTitle = styled("p")(templateObject_2$
|
|
4954
|
+
var StyledColumnTitle = styled("p")(templateObject_2$s || (templateObject_2$s = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontCapsXxxxs, function (props) {
|
|
4931
4955
|
var _a;
|
|
4932
4956
|
var spaces = getSpaces(props);
|
|
4933
4957
|
var semanticColors = getSemanticColors(props);
|
|
4934
4958
|
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 ");
|
|
4935
4959
|
});
|
|
4936
|
-
var StyledColumnIcon = styled("span")(templateObject_3$
|
|
4960
|
+
var StyledColumnIcon = styled("span")(templateObject_3$k || (templateObject_3$k = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4937
4961
|
var _a, _b;
|
|
4938
4962
|
var spaces = getSpaces(props);
|
|
4939
4963
|
var iconSizes = getIconSizes(props);
|
|
4940
4964
|
var semanticColors = getSemanticColors(props);
|
|
4941
4965
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, ";\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.iconPrimary, ";\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 ");
|
|
4942
4966
|
});
|
|
4943
|
-
var templateObject_1$
|
|
4967
|
+
var templateObject_1$M, templateObject_2$s, templateObject_3$k;
|
|
4944
4968
|
|
|
4945
4969
|
var AutocompleteGroup = function (props) {
|
|
4946
4970
|
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"]);
|
|
@@ -4980,7 +5004,7 @@ var AutocompleteGroup = function (props) {
|
|
|
4980
5004
|
}
|
|
4981
5005
|
};
|
|
4982
5006
|
|
|
4983
|
-
var doNotForwardProps$
|
|
5007
|
+
var doNotForwardProps$n = [
|
|
4984
5008
|
"anchorEl",
|
|
4985
5009
|
"count",
|
|
4986
5010
|
"keepSearchOnSelect",
|
|
@@ -4993,9 +5017,9 @@ var doNotForwardProps$m = [
|
|
|
4993
5017
|
];
|
|
4994
5018
|
var StyledPopper$2 = styled(Popper, {
|
|
4995
5019
|
shouldForwardProp: function (prop) {
|
|
4996
|
-
return !doNotForwardProps$
|
|
5020
|
+
return !doNotForwardProps$n.includes(prop) || prop === "anchorEl";
|
|
4997
5021
|
},
|
|
4998
|
-
})(templateObject_1$
|
|
5022
|
+
})(templateObject_1$L || (templateObject_1$L = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
4999
5023
|
var _a;
|
|
5000
5024
|
var corners = getCorners(props);
|
|
5001
5025
|
var shadows = getShadows(props);
|
|
@@ -5005,24 +5029,24 @@ var StyledPopper$2 = styled(Popper, {
|
|
|
5005
5029
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, ";\n background-image: none;\n border: ").concat(borders === null || borders === void 0 ? void 0 : borders.none, ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.m, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n box-sizing: border-box;\n z-index: 1400;\n\n .").concat(autocompleteClasses.popper, ".").concat(autocompleteClasses.popperDisablePortal, " {\n position: relative !important;\n transform: none !important;\n \n .MuiPaper-root .").concat(autocompleteClasses.listbox, " {\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0 0;\n }\n }\n ");
|
|
5006
5030
|
});
|
|
5007
5031
|
var StyledPaper$2 = styled(Paper, {
|
|
5008
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5009
|
-
})(templateObject_2$
|
|
5032
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
5033
|
+
})(templateObject_2$r || (templateObject_2$r = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5010
5034
|
var _a;
|
|
5011
5035
|
var shadows = getShadows(props);
|
|
5012
5036
|
var semanticColors = getSemanticColors(props);
|
|
5013
5037
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, ";\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 ");
|
|
5014
5038
|
});
|
|
5015
|
-
var StyledAutocompleteGroupWrapper = styled("div")(templateObject_3$
|
|
5039
|
+
var StyledAutocompleteGroupWrapper = styled("div")(templateObject_3$j || (templateObject_3$j = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
5016
5040
|
var StyledAutocompleteInput = styled(InputSearch, {
|
|
5017
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5018
|
-
})(templateObject_4$
|
|
5041
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$n.includes(prop); },
|
|
5042
|
+
})(templateObject_4$h || (templateObject_4$h = __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) {
|
|
5019
5043
|
var search = _a.search;
|
|
5020
5044
|
return !search && "height: 0; display: none; margin: 0 !important;";
|
|
5021
5045
|
}, function (_a) {
|
|
5022
5046
|
var search = _a.search;
|
|
5023
5047
|
return (search ? "auto" : "transparent");
|
|
5024
5048
|
});
|
|
5025
|
-
var templateObject_1$
|
|
5049
|
+
var templateObject_1$L, templateObject_2$r, templateObject_3$j, templateObject_4$h;
|
|
5026
5050
|
|
|
5027
5051
|
var AutocompleteMultiColumn = function (props) {
|
|
5028
5052
|
var _a;
|
|
@@ -5208,13 +5232,13 @@ var Autocomplete = function (props) {
|
|
|
5208
5232
|
}
|
|
5209
5233
|
};
|
|
5210
5234
|
|
|
5211
|
-
var Centered = styled("div")(templateObject_1$
|
|
5235
|
+
var Centered = styled("div")(templateObject_1$K || (templateObject_1$K = __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"])));
|
|
5212
5236
|
var doNotForwardPropsIconWrapper = ["bannerType"];
|
|
5213
5237
|
var IconWrapper$1 = styled("div", {
|
|
5214
5238
|
shouldForwardProp: function (prop) {
|
|
5215
5239
|
return !doNotForwardPropsIconWrapper.includes(prop);
|
|
5216
5240
|
},
|
|
5217
|
-
})(templateObject_2$
|
|
5241
|
+
})(templateObject_2$q || (templateObject_2$q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5218
5242
|
var _a, _b;
|
|
5219
5243
|
var bannerType = props.bannerType;
|
|
5220
5244
|
var iconSizes = getIconSizes(props);
|
|
@@ -5227,7 +5251,7 @@ var StyledButton$2 = styled(Button, {
|
|
|
5227
5251
|
shouldForwardProp: function (prop) {
|
|
5228
5252
|
return !doNotForwardPropsButtonIcon.includes(prop);
|
|
5229
5253
|
},
|
|
5230
|
-
})(templateObject_3$
|
|
5254
|
+
})(templateObject_3$i || (templateObject_3$i = __makeTemplateObject(["\n flex: 0 0 auto;\n\n ", "\n"], ["\n flex: 0 0 auto;\n\n ", "\n"])), function (props) {
|
|
5231
5255
|
var _a, _b;
|
|
5232
5256
|
var bannerType = props.bannerType;
|
|
5233
5257
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5235,7 +5259,7 @@ var StyledButton$2 = styled(Button, {
|
|
|
5235
5259
|
return "";
|
|
5236
5260
|
return "\n svg {\n fill: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.iconPrimaryInverse, ";\n }\n\n svg:hover {\n fill: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimaryInverseHover, ";\n }\n ");
|
|
5237
5261
|
});
|
|
5238
|
-
styled("div")(templateObject_4$
|
|
5262
|
+
styled("div")(templateObject_4$g || (templateObject_4$g = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), fontBodyS$1);
|
|
5239
5263
|
var primary$1 = function (props) {
|
|
5240
5264
|
var _a, _b;
|
|
5241
5265
|
var semanticColors = getSemanticColors(props);
|
|
@@ -5246,15 +5270,15 @@ var secondary$1 = function (props) {
|
|
|
5246
5270
|
var semanticColors = getSemanticColors(props);
|
|
5247
5271
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.info) === null || _a === void 0 ? void 0 : _a.surfacePrimary, ";\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, ";\n ");
|
|
5248
5272
|
};
|
|
5249
|
-
var doNotForwardProps$
|
|
5273
|
+
var doNotForwardProps$m = ["sdsType", "textChild"];
|
|
5250
5274
|
var StyledBanner = styled("div", {
|
|
5251
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5252
|
-
})(templateObject_5$
|
|
5275
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$m.includes(prop); },
|
|
5276
|
+
})(templateObject_5$c || (templateObject_5$c = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
5253
5277
|
var sdsType = props.sdsType;
|
|
5254
5278
|
var spaces = getSpaces(props);
|
|
5255
5279
|
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 ");
|
|
5256
5280
|
});
|
|
5257
|
-
var templateObject_1$
|
|
5281
|
+
var templateObject_1$K, templateObject_2$q, templateObject_3$i, templateObject_4$g, templateObject_5$c;
|
|
5258
5282
|
|
|
5259
5283
|
var Banner = forwardRef(function Banner(props, ref) {
|
|
5260
5284
|
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"]);
|
|
@@ -5322,10 +5346,10 @@ var ButtonDropdown = React__default.forwardRef(function (props, ref) {
|
|
|
5322
5346
|
|
|
5323
5347
|
var CALLOUT_TITLE_DISPLAY_NAME = "CalloutTitle";
|
|
5324
5348
|
|
|
5325
|
-
var doNotForwardProps$
|
|
5349
|
+
var doNotForwardProps$l = ["calloutTitle", "collapsed", "severity"];
|
|
5326
5350
|
var StyledCallout = styled(Alert$2, {
|
|
5327
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5328
|
-
})(templateObject_1$
|
|
5351
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$l.includes(prop); },
|
|
5352
|
+
})(templateObject_1$J || (templateObject_1$J = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5329
5353
|
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
5330
5354
|
var _m = props.intent, intent = _m === void 0 ? "info" : _m;
|
|
5331
5355
|
var spaces = getSpaces(props);
|
|
@@ -5348,7 +5372,7 @@ var StyledCallout = styled(Alert$2, {
|
|
|
5348
5372
|
2);
|
|
5349
5373
|
return "\n width: 360px;\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((_l = palette === null || palette === void 0 ? void 0 : palette.text) === null || _l === void 0 ? void 0 : _l.primary, ";\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n background-color: ").concat(backgroundColor, ";\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 padding: ").concat(alertMessagePaddingTop, "px 0 0;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n\n .").concat(alertTitleClasses.root, " {\n margin-top: 0;\n ").concat(titleBottomMargin, "\n }\n }\n\n .").concat(alertClasses.action, " {\n margin-right: 0;\n padding: 0;\n align-items: flex-start;\n margin-top: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n\n > button {\n padding: 0;\n }\n }\n ");
|
|
5350
5374
|
});
|
|
5351
|
-
var templateObject_1$
|
|
5375
|
+
var templateObject_1$J;
|
|
5352
5376
|
|
|
5353
5377
|
var SDS_STAGE_OPEN = "open";
|
|
5354
5378
|
var SDS_STAGE_CLOSED = "closed";
|
|
@@ -5415,11 +5439,11 @@ var Callout = function (_a) {
|
|
|
5415
5439
|
return (jsx(Fragment, { children: jsx(Grow, { in: !hide, children: jsxs(StyledCallout, __assign({ onClose: onClose ? handleClose : undefined, action: getAction(collapsed), icon: getIcon(), intent: intent, collapsed: collapsed || false }, rest, { children: [calloutTitle, !collapsed && calloutContent] })) }) }));
|
|
5416
5440
|
};
|
|
5417
5441
|
|
|
5418
|
-
var StyledCalloutTitle = styled(AlertTitle)(templateObject_1$
|
|
5442
|
+
var StyledCalloutTitle = styled(AlertTitle)(templateObject_1$I || (templateObject_1$I = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
5419
5443
|
var spaces = getSpaces(props);
|
|
5420
5444
|
return "\n margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
5421
5445
|
});
|
|
5422
|
-
var templateObject_1$
|
|
5446
|
+
var templateObject_1$I;
|
|
5423
5447
|
|
|
5424
5448
|
var CalloutTitle = function (_a) {
|
|
5425
5449
|
var children = _a.children;
|
|
@@ -5432,22 +5456,22 @@ var dark = function (props) {
|
|
|
5432
5456
|
var _a, _b;
|
|
5433
5457
|
var spaces = getSpaces(props);
|
|
5434
5458
|
var semanticColors = getSemanticColors(props);
|
|
5435
|
-
return css$1(templateObject_1$
|
|
5459
|
+
return css$1(templateObject_1$H || (templateObject_1$H = __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.surfacePrimaryInverse, (_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);
|
|
5436
5460
|
};
|
|
5437
5461
|
var light = function (props) {
|
|
5438
5462
|
var _a, _b;
|
|
5439
5463
|
var spaces = getSpaces(props);
|
|
5440
5464
|
var semanticColors = getSemanticColors(props);
|
|
5441
|
-
return css$1(templateObject_2$
|
|
5465
|
+
return css$1(templateObject_2$p || (templateObject_2$p = __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.surfacePrimary, (_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);
|
|
5442
5466
|
};
|
|
5443
5467
|
var wide = function () {
|
|
5444
|
-
return css$1(templateObject_3$
|
|
5468
|
+
return css$1(templateObject_3$h || (templateObject_3$h = __makeTemplateObject(["\n max-width: 550px;\n "], ["\n max-width: 550px;\n "])));
|
|
5445
5469
|
};
|
|
5446
5470
|
var tableStyles = function (props) {
|
|
5447
5471
|
var spaces = getSpaces(props);
|
|
5448
|
-
return css$1(templateObject_4$
|
|
5472
|
+
return css$1(templateObject_4$f || (templateObject_4$f = __makeTemplateObject(["\n padding: ", "px;\n "], ["\n padding: ", "px;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.m);
|
|
5449
5473
|
};
|
|
5450
|
-
var Subtitle$1 = styled("div")(templateObject_5$
|
|
5474
|
+
var Subtitle$1 = styled("div")(templateObject_5$b || (templateObject_5$b = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
5451
5475
|
var _a;
|
|
5452
5476
|
var semanticColors = getSemanticColors(props);
|
|
5453
5477
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondaryInverse, ";\n ");
|
|
@@ -5455,13 +5479,13 @@ var Subtitle$1 = styled("div")(templateObject_5$a || (templateObject_5$a = __mak
|
|
|
5455
5479
|
var tooltipCss = function (props) {
|
|
5456
5480
|
var inverted = props.inverted, sdsStyle = props.sdsStyle, width = props.width, followCursor = props.followCursor;
|
|
5457
5481
|
var shadows = getShadows(props);
|
|
5458
|
-
return css$1(templateObject_6$
|
|
5482
|
+
return css$1(templateObject_6$7 || (templateObject_6$7 = __makeTemplateObject(["\n &.MuiTooltip-tooltip {\n box-shadow: ", ";\n\n ", "\n ", "\n\n ", "\n }\n "], ["\n &.MuiTooltip-tooltip {\n box-shadow: ", ";\n\n ", "\n ", "\n\n ", "\n }\n "])), shadows === null || shadows === void 0 ? void 0 : shadows.m, sdsStyle === "dark" || inverted ? dark(props) : light(props), width === "wide" && sdsStyle === "light" && wide(), followCursor === true && tableStyles(props));
|
|
5459
5483
|
};
|
|
5460
5484
|
var arrowCss = function (props) {
|
|
5461
5485
|
var _a, _b;
|
|
5462
5486
|
var inverted = props.inverted, sdsStyle = props.sdsStyle, arrowOffset = props.arrowOffset;
|
|
5463
5487
|
var semanticColors = getSemanticColors(props);
|
|
5464
|
-
return css$1(templateObject_7$
|
|
5488
|
+
return css$1(templateObject_7$4 || (templateObject_7$4 = __makeTemplateObject(["\n &.MuiTooltip-arrow {\n /* (bethbertozzi): !important is needed to fight inline style */\n left: ", "px !important;\n color: ", ";\n &:before {\n box-sizing: border-box;\n width: 12px;\n height: 12px;\n }\n }\n "], ["\n &.MuiTooltip-arrow {\n /* (bethbertozzi): !important is needed to fight inline style */\n left: ", "px !important;\n color: ", ";\n &:before {\n box-sizing: border-box;\n width: 12px;\n height: 12px;\n }\n }\n "])), arrowOffset, inverted || sdsStyle === "dark"
|
|
5465
5489
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimaryInverse
|
|
5466
5490
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.surfacePrimary);
|
|
5467
5491
|
};
|
|
@@ -5470,7 +5494,7 @@ var arrowCss = function (props) {
|
|
|
5470
5494
|
* default placement which is calculated by javascript
|
|
5471
5495
|
*/
|
|
5472
5496
|
var StyledPopper$1 = styled(Popper)(templateObject_8$3 || (templateObject_8$3 = __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"])));
|
|
5473
|
-
var templateObject_1$
|
|
5497
|
+
var templateObject_1$H, templateObject_2$p, templateObject_3$h, templateObject_4$f, templateObject_5$b, templateObject_6$7, templateObject_7$4, templateObject_8$3;
|
|
5474
5498
|
|
|
5475
5499
|
/**
|
|
5476
5500
|
* @see https://mui.com/material-ui/react-tooltip/
|
|
@@ -5536,7 +5560,7 @@ function mergeClass$1(_a) {
|
|
|
5536
5560
|
return propClassName ? "".concat(propClassName, " ").concat(className) : className;
|
|
5537
5561
|
}
|
|
5538
5562
|
|
|
5539
|
-
var doNotForwardProps$
|
|
5563
|
+
var doNotForwardProps$k = [
|
|
5540
5564
|
"icon",
|
|
5541
5565
|
"iconVerticalAlign",
|
|
5542
5566
|
"horizontalAlign",
|
|
@@ -5564,8 +5588,8 @@ var verticalAlignToFlexMap = {
|
|
|
5564
5588
|
top: "flex-start",
|
|
5565
5589
|
};
|
|
5566
5590
|
var StyledTableData = styled("td", {
|
|
5567
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5568
|
-
})(templateObject_1$
|
|
5591
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
5592
|
+
})(templateObject_1$G || (templateObject_1$G = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
5569
5593
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
5570
5594
|
var spaces = getSpaces(props);
|
|
5571
5595
|
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 ");
|
|
@@ -5576,30 +5600,30 @@ var ShouldWrap = function (lineCount) {
|
|
|
5576
5600
|
var ShouldTruncate = function () {
|
|
5577
5601
|
return "\n text-overflow: ellipsis;\n white-space: nowrap;\n overflow: hidden;\n ";
|
|
5578
5602
|
};
|
|
5579
|
-
var StyledCellContent = styled("div")(templateObject_2$
|
|
5580
|
-
var StyledCellContentWrapper = styled("div")(templateObject_3$
|
|
5603
|
+
var StyledCellContent = styled("div")(templateObject_2$o || (templateObject_2$o = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
5604
|
+
var StyledCellContentWrapper = styled("div")(templateObject_3$g || (templateObject_3$g = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
5581
5605
|
var StyledCellIconWrapper = styled("div", {
|
|
5582
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5583
|
-
})(templateObject_4$
|
|
5606
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
5607
|
+
})(templateObject_4$e || (templateObject_4$e = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5584
5608
|
var _a = props.iconVerticalAlign, iconVerticalAlign = _a === void 0 ? "top" : _a;
|
|
5585
5609
|
var spaces = getSpaces(props);
|
|
5586
5610
|
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 ");
|
|
5587
5611
|
});
|
|
5588
|
-
var PrimaryTextWrapper = styled("div")(templateObject_5$
|
|
5612
|
+
var PrimaryTextWrapper = styled("div")(templateObject_5$a || (templateObject_5$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5589
5613
|
var horizontalAlign = props.horizontalAlign;
|
|
5590
5614
|
return "\n display: flex;\n justify-content: ".concat(horizontalAlign === "left" ? "flex-start" : "flex-end", ";\n ");
|
|
5591
5615
|
});
|
|
5592
5616
|
var PrimaryText = styled("div", {
|
|
5593
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5594
|
-
})(templateObject_6$
|
|
5617
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
5618
|
+
})(templateObject_6$6 || (templateObject_6$6 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
5595
5619
|
var _a = props.primaryTextWrapLineCount, primaryTextWrapLineCount = _a === void 0 ? 3 : _a;
|
|
5596
5620
|
return "\n display: block;\n ".concat(props.shouldTextWrap
|
|
5597
5621
|
? ShouldWrap(primaryTextWrapLineCount)
|
|
5598
5622
|
: ShouldTruncate(), "\n ");
|
|
5599
5623
|
});
|
|
5600
5624
|
var SecondaryText = styled("span", {
|
|
5601
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5602
|
-
})(templateObject_7$
|
|
5625
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
5626
|
+
})(templateObject_7$3 || (templateObject_7$3 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
5603
5627
|
var _a;
|
|
5604
5628
|
var _b = props.secondaryTextWrapLineCount, secondaryTextWrapLineCount = _b === void 0 ? 1 : _b;
|
|
5605
5629
|
var spaces = getSpaces(props);
|
|
@@ -5609,7 +5633,7 @@ var SecondaryText = styled("span", {
|
|
|
5609
5633
|
: ShouldTruncate(), "\n ");
|
|
5610
5634
|
});
|
|
5611
5635
|
var TertiaryText = styled("span", {
|
|
5612
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5636
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$k.includes(prop); },
|
|
5613
5637
|
})(templateObject_8$2 || (templateObject_8$2 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
5614
5638
|
var _a;
|
|
5615
5639
|
var _b = props.tertiaryTextWrapLineCount, tertiaryTextWrapLineCount = _b === void 0 ? 1 : _b;
|
|
@@ -5627,7 +5651,7 @@ var PrimaryTextComponentSlotRightWrapper = styled("div")(templateObject_10$1 ||
|
|
|
5627
5651
|
var spaces = getSpaces(props);
|
|
5628
5652
|
return "\n margin-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
5629
5653
|
});
|
|
5630
|
-
var templateObject_1$
|
|
5654
|
+
var templateObject_1$G, templateObject_2$o, templateObject_3$g, templateObject_4$e, templateObject_5$a, templateObject_6$6, templateObject_7$3, templateObject_8$2, templateObject_9$1, templateObject_10$1;
|
|
5631
5655
|
|
|
5632
5656
|
var CellBasicContent = function (props) {
|
|
5633
5657
|
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;
|
|
@@ -5641,15 +5665,15 @@ var CellBasic = forwardRef(function (props, ref) {
|
|
|
5641
5665
|
return (jsx(StyledTableData, __assign({ ref: ref }, props, { children: jsx(CellBasicContent, __assign({}, props)) })));
|
|
5642
5666
|
});
|
|
5643
5667
|
|
|
5644
|
-
var doNotForwardProps$
|
|
5668
|
+
var doNotForwardProps$j = ["horizontalAlign", "verticalAlign"];
|
|
5645
5669
|
var StyledCellComponentData = styled("td", {
|
|
5646
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5647
|
-
})(templateObject_1$
|
|
5670
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$j.includes(prop); },
|
|
5671
|
+
})(templateObject_1$F || (templateObject_1$F = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontBodyS$1, focusVisibleA11yStyle, function (props) {
|
|
5648
5672
|
var spaces = getSpaces(props);
|
|
5649
5673
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a, _b = props.verticalAlign, verticalAlign = _b === void 0 ? "top" : _b;
|
|
5650
5674
|
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 ");
|
|
5651
5675
|
});
|
|
5652
|
-
var templateObject_1$
|
|
5676
|
+
var templateObject_1$F;
|
|
5653
5677
|
|
|
5654
5678
|
var CellComponent = forwardRef(function (props, _) {
|
|
5655
5679
|
var children = props.children;
|
|
@@ -5661,7 +5685,7 @@ var contentPositionMapping = {
|
|
|
5661
5685
|
left: "flex-start",
|
|
5662
5686
|
right: "flex-end",
|
|
5663
5687
|
};
|
|
5664
|
-
var doNotForwardProps$
|
|
5688
|
+
var doNotForwardProps$i = [
|
|
5665
5689
|
"active",
|
|
5666
5690
|
"horizontalAlign",
|
|
5667
5691
|
"shouldShowTooltipOnHover",
|
|
@@ -5670,8 +5694,8 @@ var doNotForwardProps$h = [
|
|
|
5670
5694
|
"hideSortIcon",
|
|
5671
5695
|
];
|
|
5672
5696
|
var StyledSortingIcon = styled(Icon, {
|
|
5673
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5674
|
-
})(templateObject_1$
|
|
5697
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
5698
|
+
})(templateObject_1$E || (templateObject_1$E = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5675
5699
|
var _a, _b;
|
|
5676
5700
|
var _c = props.active, active = _c === void 0 ? false : _c, hideSortIcon = props.hideSortIcon;
|
|
5677
5701
|
var spaces = getSpaces(props);
|
|
@@ -5679,8 +5703,8 @@ var StyledSortingIcon = styled(Icon, {
|
|
|
5679
5703
|
return "\n margin-left: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n margin-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n color: ").concat(active ? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.icon : (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimary, ";\n opacity: ").concat(hideSortIcon ? (active ? 1 : 0) : 1, ";\n outline: none !important;\n ");
|
|
5680
5704
|
});
|
|
5681
5705
|
var StyledTableHeader$1 = styled("th", {
|
|
5682
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5683
|
-
})(templateObject_2$
|
|
5706
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
5707
|
+
})(templateObject_2$n || (templateObject_2$n = __makeTemplateObject(["\n ", "\n ", "\n\n ", "\n"], ["\n ", "\n ", "\n\n ", "\n"])), fontHeaderS, focusVisibleA11yStyle, function (props) {
|
|
5684
5708
|
var _a, _b, _c, _d, _e, _f, _g, _h;
|
|
5685
5709
|
var _j = props.active, active = _j === void 0 ? false : _j, _k = props.horizontalAlign, horizontalAlign = _k === void 0 ? "left" : _k;
|
|
5686
5710
|
var spaces = getSpaces(props);
|
|
@@ -5688,12 +5712,12 @@ var StyledTableHeader$1 = styled("th", {
|
|
|
5688
5712
|
return "\n color: ".concat(active ? (_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.base) === null || _b === void 0 ? void 0 : _b.textSecondary, ";\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n text-align: ").concat(horizontalAlign, ";\n min-width: 96px;\n width: 96px;\n cursor: pointer;\n vertical-align: bottom;\n\n & .MuiButtonBase-root {\n outline: none;\n }\n\n &:hover {\n color: ").concat(active ? (_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.base) === null || _d === void 0 ? void 0 : _d.textPrimary, ";\n\n & .MuiButtonBase-root {\n color: ").concat(active ? (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.textActionHover : (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textPrimary, ";\n opacity: 1;\n }\n\n & svg {\n color: ").concat(active ? (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _g === void 0 ? void 0 : _g.iconHover : (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.iconPrimaryHover, ";\n }\n }\n ");
|
|
5689
5713
|
});
|
|
5690
5714
|
var StyledCellHeaderContainer = styled("div", {
|
|
5691
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5692
|
-
})(templateObject_3$
|
|
5715
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$i.includes(prop); },
|
|
5716
|
+
})(templateObject_3$f || (templateObject_3$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5693
5717
|
var _a = props.horizontalAlign, horizontalAlign = _a === void 0 ? "left" : _a;
|
|
5694
5718
|
return "\n align-items: flex-end;\n width: 100%;\n display: flex;\n justify-content: ".concat(horizontalAlign ? contentPositionMapping[horizontalAlign] : "flex-start", ";\n ");
|
|
5695
5719
|
});
|
|
5696
|
-
var templateObject_1$
|
|
5720
|
+
var templateObject_1$E, templateObject_2$n, templateObject_3$f;
|
|
5697
5721
|
|
|
5698
5722
|
var CellHeaderContent = function (props) {
|
|
5699
5723
|
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;
|
|
@@ -5713,20 +5737,20 @@ var CellHeader = forwardRef(function (props, ref) {
|
|
|
5713
5737
|
|
|
5714
5738
|
var small = function (props) {
|
|
5715
5739
|
var spaces = getSpaces(props);
|
|
5716
|
-
return css(templateObject_1$
|
|
5740
|
+
return css(templateObject_1$D || (templateObject_1$D = __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));
|
|
5717
5741
|
};
|
|
5718
5742
|
var medium = function (props) {
|
|
5719
5743
|
var spaces = getSpaces(props);
|
|
5720
5744
|
var colors = getColors(props);
|
|
5721
|
-
return css(templateObject_2$
|
|
5745
|
+
return css(templateObject_2$m || (templateObject_2$m = __makeTemplateObject(["\n margin: 0 ", "px;\n height: 24px;\n\n background-color: ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n .MuiChip-label {\n ", "\n color: white;\n padding-left: ", "px;\n }\n\n .MuiChip-deleteIcon {\n color: white;\n padding-right: ", "px;\n margin: 0 0 0 -", "px;\n height: ", "px;\n width: ", "px;\n\n &:hover,\n &:focus-visible {\n color: white;\n }\n }\n "], ["\n margin: 0 ", "px;\n height: 24px;\n\n background-color: ", ";\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n .MuiChip-label {\n ", "\n color: white;\n padding-left: ", "px;\n }\n\n .MuiChip-deleteIcon {\n color: white;\n padding-right: ", "px;\n margin: 0 0 0 -", "px;\n height: ", "px;\n width: ", "px;\n\n &:hover,\n &:focus-visible {\n color: white;\n }\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.s, colors === null || colors === void 0 ? void 0 : colors.blue[400], colors === null || colors === void 0 ? void 0 : colors.blue[500], colors === null || colors === void 0 ? void 0 : colors.blue[600], fontHeaderXs(props), spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.s, spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.l);
|
|
5722
5746
|
};
|
|
5723
5747
|
var rounded$2 = function (props) {
|
|
5724
5748
|
var corners = getCorners(props);
|
|
5725
|
-
return css(templateObject_3$
|
|
5749
|
+
return css(templateObject_3$e || (templateObject_3$e = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.l);
|
|
5726
5750
|
};
|
|
5727
5751
|
var square$2 = function (props) {
|
|
5728
5752
|
var corners = getCorners(props);
|
|
5729
|
-
return css(templateObject_4$
|
|
5753
|
+
return css(templateObject_4$d || (templateObject_4$d = __makeTemplateObject(["\n border-radius: ", "px;\n "], ["\n border-radius: ", "px;\n "])), corners === null || corners === void 0 ? void 0 : corners.m);
|
|
5730
5754
|
};
|
|
5731
5755
|
var success = function (props) {
|
|
5732
5756
|
return createStatusCss(props, "success");
|
|
@@ -5779,7 +5803,7 @@ function createStatusCss(props, status) {
|
|
|
5779
5803
|
},
|
|
5780
5804
|
};
|
|
5781
5805
|
var statusColors = statusToColors[status];
|
|
5782
|
-
return css(templateObject_5$
|
|
5806
|
+
return css(templateObject_5$9 || (templateObject_5$9 = __makeTemplateObject(["\n background-color: ", ";\n\n .MuiChip-label {\n color: ", ";\n }\n "], ["\n background-color: ", ";\n\n .MuiChip-label {\n color: ", ";\n }\n "])), statusColors.light, statusColors.dark);
|
|
5783
5807
|
}
|
|
5784
5808
|
var statusToCss = {
|
|
5785
5809
|
beta: beta,
|
|
@@ -5789,14 +5813,14 @@ var statusToCss = {
|
|
|
5789
5813
|
success: success,
|
|
5790
5814
|
warning: warning,
|
|
5791
5815
|
};
|
|
5792
|
-
var doNotForwardProps$
|
|
5816
|
+
var doNotForwardProps$h = ["isRounded"];
|
|
5793
5817
|
var StyledChip = styled(Chip$1, {
|
|
5794
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5795
|
-
})(templateObject_7$
|
|
5818
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$h.includes(prop); },
|
|
5819
|
+
})(templateObject_7$2 || (templateObject_7$2 = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
5796
5820
|
var size = props.size, status = props.status, isRounded = props.isRounded;
|
|
5797
|
-
return css(templateObject_6$
|
|
5821
|
+
return css(templateObject_6$5 || (templateObject_6$5 = __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));
|
|
5798
5822
|
});
|
|
5799
|
-
var templateObject_1$
|
|
5823
|
+
var templateObject_1$D, templateObject_2$m, templateObject_3$e, templateObject_4$d, templateObject_5$9, templateObject_6$5, templateObject_7$2;
|
|
5800
5824
|
|
|
5801
5825
|
/**
|
|
5802
5826
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -5814,7 +5838,7 @@ var Chip = function (props) {
|
|
|
5814
5838
|
return jsx(StyledChip, __assign({}, props));
|
|
5815
5839
|
};
|
|
5816
5840
|
|
|
5817
|
-
var doNotForwardProps$
|
|
5841
|
+
var doNotForwardProps$g = [
|
|
5818
5842
|
"anchorEl",
|
|
5819
5843
|
"count",
|
|
5820
5844
|
"keepSearchOnSelect",
|
|
@@ -5828,19 +5852,19 @@ var doNotForwardProps$f = [
|
|
|
5828
5852
|
"isMultiColumn",
|
|
5829
5853
|
];
|
|
5830
5854
|
var StyledHeaderTitle = styled("div", {
|
|
5831
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5832
|
-
})(templateObject_1$
|
|
5855
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
5856
|
+
})(templateObject_1$C || (templateObject_1$C = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderXs, function (props) {
|
|
5833
5857
|
var _a;
|
|
5834
5858
|
var spaces = getSpaces(props);
|
|
5835
5859
|
var semanticColors = getSemanticColors(props);
|
|
5836
5860
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n padding-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n ");
|
|
5837
5861
|
});
|
|
5838
|
-
var StyledDropdownMenuAutocompleteWrapper = styled("div")(templateObject_2$
|
|
5862
|
+
var StyledDropdownMenuAutocompleteWrapper = styled("div")(templateObject_2$l || (templateObject_2$l = __makeTemplateObject(["\n & .", ", & .MuiPopper-root,\n .base-Popper-root {\n position: relative !important;\n transform: none !important;\n width: 100% !important;\n box-shadow: none;\n padding: 0;\n border: none;\n\n .", ", .MuiPaper-root {\n box-shadow: none !important;\n border: none !important;\n border-radius: 0;\n margin: 0;\n padding: 0;\n }\n }\n"], ["\n & .", ", & .MuiPopper-root,\n .base-Popper-root {\n position: relative !important;\n transform: none !important;\n width: 100% !important;\n box-shadow: none;\n padding: 0;\n border: none;\n\n .", ", .MuiPaper-root {\n box-shadow: none !important;\n border: none !important;\n border-radius: 0;\n margin: 0;\n padding: 0;\n }\n }\n"])), autocompleteClasses.popper, autocompleteClasses.paper);
|
|
5839
5863
|
var StyledPopper = styled(Popper, {
|
|
5840
5864
|
shouldForwardProp: function (prop) {
|
|
5841
|
-
return !doNotForwardProps$
|
|
5865
|
+
return !doNotForwardProps$g.includes(prop) || prop === "anchorEl";
|
|
5842
5866
|
},
|
|
5843
|
-
})(templateObject_3$
|
|
5867
|
+
})(templateObject_3$d || (templateObject_3$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5844
5868
|
var _a;
|
|
5845
5869
|
var borders = getBorders(props);
|
|
5846
5870
|
var corners = getCorners(props);
|
|
@@ -5849,8 +5873,8 @@ var StyledPopper = styled(Popper, {
|
|
|
5849
5873
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, ";\n background-image: none;\n border: ").concat(borders === null || borders === void 0 ? void 0 : borders.none, ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.m, "px;\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.m, ";\n box-sizing: border-box;\n z-index: 1400;\n ");
|
|
5850
5874
|
});
|
|
5851
5875
|
var StyledPaper$1 = styled(Paper, {
|
|
5852
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5853
|
-
})(templateObject_4$
|
|
5876
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$g.includes(prop); },
|
|
5877
|
+
})(templateObject_4$c || (templateObject_4$c = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5854
5878
|
var _a;
|
|
5855
5879
|
var spaces = getSpaces(props);
|
|
5856
5880
|
var borders = getBorders(props);
|
|
@@ -5858,12 +5882,12 @@ var StyledPaper$1 = styled(Paper, {
|
|
|
5858
5882
|
var semanticColors = getSemanticColors(props);
|
|
5859
5883
|
return "\n box-shadow: ".concat(shadows === null || shadows === void 0 ? void 0 : shadows.none, " !important;\n border: ").concat(borders === null || borders === void 0 ? void 0 : borders.none, ";\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, ";\n background-image: none;\n margin: 0;\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n\n .MuiAutocomplete-root,\n .MuiFormControl-root.MuiTextField-root {\n margin-bottom: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n }\n\n // (masoudmanson): Remove margin-right and margin-bottom for the single column autocomplete\n // as it has been added to the parent container\n .MuiAutocomplete-root .MuiFormControl-root.MuiTextField-root {\n margin-right: 0;\n margin-bottom: 0; \n }\n ");
|
|
5860
5884
|
});
|
|
5861
|
-
var StyledDropdownMenuHeader = styled("div")(templateObject_5$
|
|
5885
|
+
var StyledDropdownMenuHeader = styled("div")(templateObject_5$8 || (templateObject_5$8 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5862
5886
|
var search = props.search;
|
|
5863
5887
|
var spaces = getSpaces(props);
|
|
5864
5888
|
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 ");
|
|
5865
5889
|
});
|
|
5866
|
-
var templateObject_1$
|
|
5890
|
+
var templateObject_1$C, templateObject_2$l, templateObject_3$d, templateObject_4$c, templateObject_5$8;
|
|
5867
5891
|
|
|
5868
5892
|
// (masoudmanson): Represents the minimum width defined by design specifications
|
|
5869
5893
|
// for the dropdownMenu's popper component
|
|
@@ -5898,10 +5922,10 @@ var DropdownMenu = function (props) {
|
|
|
5898
5922
|
], open: open, anchorEl: anchorEl, placement: PopperPlacement }, PopperBaseProps, {
|
|
5899
5923
|
// (masoudmanson): To override the width of the Popper,
|
|
5900
5924
|
// the sx prop's value must be set after spreading the PopperBaseProps.
|
|
5901
|
-
sx: dropdownMenuPopperSx, children: jsx(PaperComponent, { children: jsx(ClickAwayListener, __assign({ onClickAway: onClickAway }, ClickAwayListenerProps, { children: jsxs(StyledDropdownMenuAutocompleteWrapper, { children: [jsxs(StyledDropdownMenuHeader, { search: search, children: [title && jsx(StyledHeaderTitle, { children: title }), headerComponentSlot && jsx(Fragment, { children: headerComponentSlot })] }), anchorEl && (jsx(Autocomplete, __assign({ label: label, search: search, title: title, open: open, options: options, PopperBaseProps: DEFAULT_POPPER_BASE_PROPS, disablePortal: true, onClickAway: noop, onClick: noop }, rest, { InputBaseProps: DefaultInputBaseProps }))), children] }) })) }) })));
|
|
5925
|
+
sx: dropdownMenuPopperSx, children: jsx(PaperComponent, { children: jsx(ClickAwayListener, __assign({ onClickAway: onClickAway }, ClickAwayListenerProps, { children: jsxs(StyledDropdownMenuAutocompleteWrapper, { children: [(title || headerComponentSlot) && (jsxs(StyledDropdownMenuHeader, { search: search, children: [title && jsx(StyledHeaderTitle, { children: title }), headerComponentSlot && jsx(Fragment, { children: headerComponentSlot })] })), anchorEl && (jsx(Autocomplete, __assign({ label: label, search: search, title: title, open: open, options: options, PopperBaseProps: DEFAULT_POPPER_BASE_PROPS, disablePortal: true, onClickAway: noop, onClick: noop }, rest, { InputBaseProps: DefaultInputBaseProps }))), children] }) })) }) })));
|
|
5902
5926
|
};
|
|
5903
5927
|
|
|
5904
|
-
var doNotForwardProps$
|
|
5928
|
+
var doNotForwardProps$f = [
|
|
5905
5929
|
"intent",
|
|
5906
5930
|
"state",
|
|
5907
5931
|
"sdsType",
|
|
@@ -5923,27 +5947,27 @@ var inputDropdownStyles = function (props) {
|
|
|
5923
5947
|
* The top/bottom padding is set to 1px less than the actual value to account for the border.
|
|
5924
5948
|
*/
|
|
5925
5949
|
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");
|
|
5926
|
-
return css(templateObject_1$
|
|
5950
|
+
return css(templateObject_1$B || (templateObject_1$B = __makeTemplateObject(["\n ", "\n\n border: ", ";\n background-color: ", ";\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: ", ";\n border-color: ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n border: ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n }\n\n &:focus {\n outline-offset: -1px;\n }\n "], ["\n ", "\n\n border: ", ";\n background-color: ", ";\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: ", ";\n border-color: ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n border: ", ";\n color: ", ";\n\n path {\n fill: ", ";\n }\n }\n\n &:focus {\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, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.surfacePrimary, padding, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.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, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.iconPrimary, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.surfacePrimary, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.borderHover, (_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.textPrimary, (_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.iconPrimaryHover, (_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.textPrimary, (_l = borders === null || borders === void 0 ? void 0 : borders.base) === null || _l === void 0 ? void 0 : _l.pressed, (_m = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _m === void 0 ? void 0 : _m.textPrimary, (_o = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _o === void 0 ? void 0 : _o.iconPrimaryPressed);
|
|
5927
5951
|
};
|
|
5928
5952
|
var minimal$1 = function (props) {
|
|
5929
5953
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
5930
5954
|
var spaces = getSpaces(props);
|
|
5931
5955
|
var semanticColors = getSemanticColors(props);
|
|
5932
|
-
return css(templateObject_2$
|
|
5956
|
+
return css(templateObject_2$k || (templateObject_2$k = __makeTemplateObject(["\n ", "\n ", "\n\n /* this is needed to left align the label text */\n align-items: flex-start;\n border: none;\n flex-direction: column;\n padding: ", "px ", "px;\n background-color: transparent;\n\n /* Nesting to increase CSS specificity for style override */\n &.MuiButton-text {\n .styled-label {\n margin: 0;\n }\n }\n\n span {\n color: ", ";\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: ", ";\n border: none;\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n background-color: ", ";\n border: none;\n }\n\n &.MuiButton-root.MuiButton-text > span {\n ", "\n margin-left: 0;\n }\n\n &.MuiButton-root.MuiButton-text svg {\n margin-left: ", "px;\n margin-right: 0;\n }\n "], ["\n ", "\n ", "\n\n /* this is needed to left align the label text */\n align-items: flex-start;\n border: none;\n flex-direction: column;\n padding: ", "px ", "px;\n background-color: transparent;\n\n /* Nesting to increase CSS specificity for style override */\n &.MuiButton-text {\n .styled-label {\n margin: 0;\n }\n }\n\n span {\n color: ", ";\n }\n\n path {\n fill: ", ";\n }\n\n &:hover {\n background-color: ", ";\n border: none;\n color: ", ";\n\n path {\n fill: ", ";\n }\n\n .styled-label {\n color: ", ";\n }\n }\n\n &:active {\n background-color: ", ";\n border: none;\n }\n\n &.MuiButton-root.MuiButton-text > span {\n ", "\n margin-left: 0;\n }\n\n &.MuiButton-root.MuiButton-text svg {\n margin-left: ", "px;\n margin-right: 0;\n }\n "])), labelStyle(props), focusVisibleA11yStyle(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.s, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimary, (_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.iconPrimaryHover, (_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);
|
|
5933
5957
|
};
|
|
5934
5958
|
var square$1 = function (props) {
|
|
5935
5959
|
var corners = getCorners(props);
|
|
5936
|
-
return css(templateObject_3$
|
|
5960
|
+
return css(templateObject_3$c || (templateObject_3$c = __makeTemplateObject(["\n border-radius: ", "px;\n min-width: 90px;\n "], ["\n border-radius: ", "px;\n min-width: 90px;\n "])), corners === null || corners === void 0 ? void 0 : corners.m);
|
|
5937
5961
|
};
|
|
5938
5962
|
var rounded$1 = function (props) {
|
|
5939
5963
|
var corners = getCorners(props);
|
|
5940
|
-
return css(templateObject_4$
|
|
5964
|
+
return css(templateObject_4$b || (templateObject_4$b = __makeTemplateObject(["\n border-radius: ", "px;\n min-width: 90px;\n "], ["\n border-radius: ", "px;\n min-width: 90px;\n "])), corners === null || corners === void 0 ? void 0 : corners.l);
|
|
5941
5965
|
};
|
|
5942
5966
|
var userInput = function (props) {
|
|
5943
5967
|
var _a, _b, _c, _d, _e, _f;
|
|
5944
5968
|
var sdsStyle = props.sdsStyle;
|
|
5945
5969
|
var semanticColors = getSemanticColors(props);
|
|
5946
|
-
return css(templateObject_5$
|
|
5970
|
+
return css(templateObject_5$7 || (templateObject_5$7 = __makeTemplateObject(["\n & .styled-label {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n ", "\n "], ["\n & .styled-label {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n ", "\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, sdsStyle === "minimal"
|
|
5947
5971
|
? "\n \n background-color: ".concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillHover, "47;\n border: none;\n color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.textPrimary, ";\n\n path {\n fill: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.iconPrimaryHover, ";\n }\n\n .styled-label {\n color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.textPrimary, ";\n }\n ")
|
|
5948
5972
|
: "");
|
|
5949
5973
|
};
|
|
@@ -5952,26 +5976,21 @@ var isOpen = function (props) {
|
|
|
5952
5976
|
var sdsStyle = props.sdsStyle;
|
|
5953
5977
|
var borders = getBorders(props);
|
|
5954
5978
|
var semanticColors = getSemanticColors(props);
|
|
5955
|
-
return css(templateObject_6$
|
|
5979
|
+
return css(templateObject_6$4 || (templateObject_6$4 = __makeTemplateObject(["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n ", "\n\n path {\n fill: ", ";\n }\n\n border: ", ";\n background-color: ", ";\n\n &:hover {\n path {\n fill: ", ";\n }\n\n border-color: ", ";\n }\n "], ["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n ", "\n\n path {\n fill: ", ";\n }\n\n border: ", ";\n background-color: ", ";\n\n &:hover {\n path {\n fill: ", ";\n }\n\n border-color: ", ";\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, sdsStyle === "minimal"
|
|
5956
5980
|
? "\n & > span, \n &:hover > span { \n color: ".concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, "; \n }\n\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimary, "; \n ")
|
|
5957
5981
|
: "", (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.iconOpen, sdsStyle === "minimal" ? borders === null || borders === void 0 ? void 0 : borders.none : (_e = borders === null || borders === void 0 ? void 0 : borders.accent) === null || _e === void 0 ? void 0 : _e.open, sdsStyle === "minimal"
|
|
5958
5982
|
? ((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.fillHover) + "47"
|
|
5959
5983
|
: "transparent", (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.iconPrimaryHover, (_h = borders === null || borders === void 0 ? void 0 : borders.accent) === null || _h === void 0 ? void 0 : _h.hover);
|
|
5960
5984
|
};
|
|
5961
|
-
var
|
|
5985
|
+
var applyIntentColor$1 = function (props, intent) {
|
|
5962
5986
|
var _a, _b, _c;
|
|
5963
5987
|
var borders = getBorders(props);
|
|
5964
|
-
return css(templateObject_7$
|
|
5965
|
-
};
|
|
5966
|
-
var negative$1 = function (props) {
|
|
5967
|
-
var _a, _b, _c;
|
|
5968
|
-
var borders = getBorders(props);
|
|
5969
|
-
return css(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n border: ", ";\n\n &:hover {\n border: ", ";\n }\n\n &:active {\n border: ", ";\n }\n "], ["\n border: ", ";\n\n &:hover {\n border: ", ";\n }\n\n &:active {\n border: ", ";\n }\n "])), (_a = borders === null || borders === void 0 ? void 0 : borders.negative) === null || _a === void 0 ? void 0 : _a.default, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, (_c = borders === null || borders === void 0 ? void 0 : borders.base) === null || _c === void 0 ? void 0 : _c.pressed);
|
|
5988
|
+
return css(templateObject_7$1 || (templateObject_7$1 = __makeTemplateObject(["\n border: ", ";\n\n &:hover {\n border: ", ";\n }\n\n &:active {\n border: ", ";\n }\n "], ["\n border: ", ";\n\n &:hover {\n border: ", ";\n }\n\n &:active {\n border: ", ";\n }\n "])), (_a = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _a === void 0 ? void 0 : _a.default, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.hover, (_c = borders === null || borders === void 0 ? void 0 : borders.base) === null || _c === void 0 ? void 0 : _c.pressed);
|
|
5970
5989
|
};
|
|
5971
5990
|
var isDisabled = function (props) {
|
|
5972
5991
|
var _a, _b, _c, _d;
|
|
5973
5992
|
var semanticColors = getSemanticColors(props);
|
|
5974
|
-
return css(
|
|
5993
|
+
return css(templateObject_8$1 || (templateObject_8$1 = __makeTemplateObject(["\n cursor: default;\n border-color: ", ";\n\n span {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n path {\n fill: ", ";\n }\n "], ["\n cursor: default;\n border-color: ", ";\n\n span {\n color: ", ";\n }\n\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n\n path {\n fill: ", ";\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderDisabled, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textDisabled, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textDisabled, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.iconDisabled);
|
|
5975
5994
|
};
|
|
5976
5995
|
/**
|
|
5977
5996
|
* (masoudmanson): `Button as React.ComponentType<InputDropdownProps>` is a
|
|
@@ -5982,22 +6001,28 @@ var isDisabled = function (props) {
|
|
|
5982
6001
|
* to the InputDropdownProps interface.
|
|
5983
6002
|
*/
|
|
5984
6003
|
var StyledInputDropdown = styled(Button, {
|
|
5985
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5986
|
-
})(
|
|
6004
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
6005
|
+
})(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n ", "\n ", "\n outline-offset: 1px !important;\n\n /* (thuang): in Minimal it's a different value */\n align-items: center;\n /* (thuang): in Minimal it's a different value */\n flex-direction: row;\n\n justify-content: space-between;\n\n ", "\n"], ["\n ", "\n ", "\n outline-offset: 1px !important;\n\n /* (thuang): in Minimal it's a different value */\n align-items: center;\n /* (thuang): in Minimal it's a different value */\n flex-direction: row;\n\n justify-content: space-between;\n\n ", "\n"])), labelFontBodyXs, focusVisibleA11yStyle, function (props) {
|
|
5987
6006
|
var disabled = props.disabled, intent = props.intent, state = props.state, value = props.value, sdsStyle = props.sdsStyle;
|
|
5988
|
-
return css(
|
|
6007
|
+
return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), inputDropdownStyles(props), sdsStyle === "minimal" && minimal$1(props), sdsStyle === "square" && square$1(props), sdsStyle === "rounded" && rounded$1(props), value && userInput(props), intent === "notice" &&
|
|
6008
|
+
sdsStyle !== "minimal" &&
|
|
6009
|
+
applyIntentColor$1(props, "notice"), intent === "negative" &&
|
|
6010
|
+
sdsStyle !== "minimal" &&
|
|
6011
|
+
applyIntentColor$1(props, "negative"), intent === "positive" &&
|
|
6012
|
+
sdsStyle !== "minimal" &&
|
|
6013
|
+
applyIntentColor$1(props, "positive"), state === "open" && isOpen(props), disabled && isDisabled(props));
|
|
5989
6014
|
});
|
|
5990
6015
|
var StyledDetail = styled("span", {
|
|
5991
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
5992
|
-
})(
|
|
6016
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
6017
|
+
})(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
5993
6018
|
var _a;
|
|
5994
6019
|
var spaces = getSpaces(props);
|
|
5995
6020
|
var semanticColors = getSemanticColors(props);
|
|
5996
6021
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n ");
|
|
5997
6022
|
});
|
|
5998
6023
|
var StyledLabel$1 = styled("span", {
|
|
5999
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6000
|
-
})(
|
|
6024
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
6025
|
+
})(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6001
6026
|
var _a, _b;
|
|
6002
6027
|
var details = props.details, counter = props.counter, sdsType = props.sdsType;
|
|
6003
6028
|
var fontWeights = getFontWeights(props);
|
|
@@ -6008,8 +6033,8 @@ var StyledLabel$1 = styled("span", {
|
|
|
6008
6033
|
return "\n color: ".concat(labelColor, ";\n\n font-weight: ").concat(sdsType === "label" ? fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold : fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.regular, ";\n ");
|
|
6009
6034
|
});
|
|
6010
6035
|
var StyledCounter = styled("span", {
|
|
6011
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6012
|
-
})(
|
|
6036
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
6037
|
+
})(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6013
6038
|
var _a, _b;
|
|
6014
6039
|
var corners = getCorners(props);
|
|
6015
6040
|
var spaces = getSpaces(props);
|
|
@@ -6017,32 +6042,32 @@ var StyledCounter = styled("span", {
|
|
|
6017
6042
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfaceTertiary, ";\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.textAction, ";\n border-radius: ").concat(corners === null || corners === void 0 ? void 0 : corners.l, "px;\n padding: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
6018
6043
|
});
|
|
6019
6044
|
var MinimalDetails = styled("div", {
|
|
6020
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6021
|
-
})(
|
|
6045
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
6046
|
+
})(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n ", "\n text-align: left;\n width: 100%;\n\n ", "\n"], ["\n ", "\n text-align: left;\n width: 100%;\n\n ", "\n"])), labelFontBodyS, function (props) {
|
|
6022
6047
|
var _a;
|
|
6023
6048
|
var shouldTruncateMinimalDetails = props.shouldTruncateMinimalDetails;
|
|
6024
6049
|
var semanticColors = getSemanticColors(props);
|
|
6025
6050
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n\n ").concat(shouldTruncateMinimalDetails &&
|
|
6026
|
-
"overflow: hidden;\n
|
|
6051
|
+
"overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;", "\n ");
|
|
6027
6052
|
});
|
|
6028
6053
|
var LabelWrapper = styled("span", {
|
|
6029
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6030
|
-
})(
|
|
6054
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
6055
|
+
})(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (_a) {
|
|
6031
6056
|
var isMinimal = _a.isMinimal;
|
|
6032
6057
|
return "\n align-items: ".concat(isMinimal ? "center" : undefined, ";\n display: ").concat(isMinimal ? "inline-flex" : "contents", ";\n justify-content: ").concat(isMinimal ? "space-between" : undefined, ";\n width: 100%;\n ");
|
|
6033
6058
|
});
|
|
6034
6059
|
var IconWrapper = styled("span", {
|
|
6035
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6036
|
-
})(
|
|
6060
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$f.includes(prop); },
|
|
6061
|
+
})(templateObject_16 || (templateObject_16 = __makeTemplateObject(["\n margin-left: auto;\n display: flex;\n align-items: center;\n"], ["\n margin-left: auto;\n display: flex;\n align-items: center;\n"])));
|
|
6037
6062
|
function labelStyle(props) {
|
|
6038
6063
|
var _a, _b;
|
|
6039
6064
|
var semanticColors = getSemanticColors(props);
|
|
6040
6065
|
var labelColor = props.sdsType === "value"
|
|
6041
6066
|
? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary
|
|
6042
6067
|
: (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textSecondary;
|
|
6043
|
-
return css(
|
|
6068
|
+
return css(templateObject_17 || (templateObject_17 = __makeTemplateObject(["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n "], ["\n &.MuiButton-text {\n .styled-label {\n color: ", ";\n }\n }\n "])), labelColor);
|
|
6044
6069
|
}
|
|
6045
|
-
var templateObject_1$
|
|
6070
|
+
var templateObject_1$B, templateObject_2$k, templateObject_3$c, templateObject_4$b, templateObject_5$7, templateObject_6$4, templateObject_7$1, templateObject_8$1, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15, templateObject_16, templateObject_17;
|
|
6046
6071
|
|
|
6047
6072
|
/**
|
|
6048
6073
|
* @see https://mui.com/material-ui/react-button/
|
|
@@ -6109,33 +6134,33 @@ var tagSizeS = function (props) {
|
|
|
6109
6134
|
var spaces = getSpaces(props);
|
|
6110
6135
|
var iconSizes = getIconSizes(props);
|
|
6111
6136
|
var semanticColors = getSemanticColors(props);
|
|
6112
|
-
return css(templateObject_1$
|
|
6137
|
+
return css(templateObject_1$A || (templateObject_1$A = __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.iconPrimaryInverse, 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);
|
|
6113
6138
|
};
|
|
6114
6139
|
var tagSizeL = function (props) {
|
|
6115
6140
|
var _a;
|
|
6116
6141
|
var spaces = getSpaces(props);
|
|
6117
6142
|
var iconSizes = getIconSizes(props);
|
|
6118
6143
|
var semanticColors = getSemanticColors(props);
|
|
6119
|
-
return css(templateObject_2$
|
|
6144
|
+
return css(templateObject_2$j || (templateObject_2$j = __makeTemplateObject(["\n height: unset;\n margin: 0 ", "px ", "px 0;\n\n .MuiChip-label {\n ", "\n padding: 0;\n }\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n margin: 0 ", "px 0 -", "px;\n }\n\n .MuiChip-deleteIcon {\n ", "\n color: ", ";\n margin: 0 0 0 ", "px;\n height: ", "px;\n width: ", "px;\n }\n "], ["\n height: unset;\n margin: 0 ", "px ", "px 0;\n\n .MuiChip-label {\n ", "\n padding: 0;\n }\n\n .MuiSvgIcon-root {\n height: ", "px;\n width: ", "px;\n margin: 0 ", "px 0 -", "px;\n }\n\n .MuiChip-deleteIcon {\n ", "\n color: ", ";\n margin: 0 0 0 ", "px;\n height: ", "px;\n width: ", "px;\n }\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.xs, fontBodyXs$2(props), iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.width, spaces === null || spaces === void 0 ? void 0 : spaces.xxs, spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, fontHeaderXs(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.iconPrimaryInverse, 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);
|
|
6120
6145
|
};
|
|
6121
6146
|
var rounded = function (props) {
|
|
6122
6147
|
var corners = getCorners(props);
|
|
6123
6148
|
var spaces = getSpaces(props);
|
|
6124
6149
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6125
6150
|
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;
|
|
6126
|
-
return css(templateObject_3$
|
|
6151
|
+
return css(templateObject_3$b || (templateObject_3$b = __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);
|
|
6127
6152
|
};
|
|
6128
6153
|
var square = function (props) {
|
|
6129
6154
|
var corners = getCorners(props);
|
|
6130
6155
|
var spaces = getSpaces(props);
|
|
6131
6156
|
var _a = props.sdsSize, sdsSize = _a === void 0 ? "s" : _a, icon = props.icon;
|
|
6132
6157
|
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;
|
|
6133
|
-
return css(templateObject_4$
|
|
6158
|
+
return css(templateObject_4$a || (templateObject_4$a = __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);
|
|
6134
6159
|
};
|
|
6135
6160
|
var withHover = function (props) {
|
|
6136
6161
|
var _a;
|
|
6137
6162
|
var semanticColors = getSemanticColors(props);
|
|
6138
|
-
return css(templateObject_5$
|
|
6163
|
+
return css(templateObject_5$6 || (templateObject_5$6 = __makeTemplateObject(["\n &:hover {\n cursor: pointer;\n }\n\n &:hover,\n &:focus-visible {\n color: ", ";\n }\n "], ["\n &:hover {\n cursor: pointer;\n }\n\n &:hover,\n &:focus-visible {\n color: ", ";\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimaryInverse);
|
|
6139
6164
|
};
|
|
6140
6165
|
var primary = function (props) {
|
|
6141
6166
|
return createTypeCss(props, "primary");
|
|
@@ -6206,13 +6231,13 @@ function createTypeCss(props, type) {
|
|
|
6206
6231
|
secondary: generateSecondaryTagColors(intent, colors, semanticColors),
|
|
6207
6232
|
};
|
|
6208
6233
|
var typeColors = typeToColors[type];
|
|
6209
|
-
return css(templateObject_6$
|
|
6234
|
+
return css(templateObject_6$3 || (templateObject_6$3 = __makeTemplateObject(["\n ", "\n\n background-color: ", ";\n position: relative;\n\n .MuiChip-label {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n\n &:hover,\n &:active {\n .MuiChip-label {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n &.Mui-focusVisible {\n background-color: ", ";\n }x\n "], ["\n ", "\n\n background-color: ", ";\n position: relative;\n\n .MuiChip-label {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n\n &:hover,\n &:active {\n .MuiChip-label {\n color: ", ";\n }\n\n svg {\n fill: ", ";\n }\n }\n\n &:hover {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n &.Mui-focusVisible {\n background-color: ", ";\n }x\n "])), focusVisibleA11yStyle(props), typeColors.background, typeColors.label, typeColors.iconColor, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimaryInverse, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimaryInverse, typeColors.backgroundHover, typeColors.backgroundClicked, typeColors.backgroundHover);
|
|
6210
6235
|
}
|
|
6211
6236
|
var typeToCss = {
|
|
6212
6237
|
primary: primary,
|
|
6213
6238
|
secondary: secondary,
|
|
6214
6239
|
};
|
|
6215
|
-
var doNotForwardProps$
|
|
6240
|
+
var doNotForwardProps$e = [
|
|
6216
6241
|
"sdsType",
|
|
6217
6242
|
"sdsStyle",
|
|
6218
6243
|
"sdsSize",
|
|
@@ -6220,14 +6245,14 @@ var doNotForwardProps$d = [
|
|
|
6220
6245
|
"hover",
|
|
6221
6246
|
];
|
|
6222
6247
|
var StyledTag$1 = styled(Chip$1, {
|
|
6223
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6248
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$e.includes(prop); },
|
|
6224
6249
|
})(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n border: none;\n\n ", "\n"], ["\n border: none;\n\n ", "\n"])), function (props) {
|
|
6225
6250
|
var _a = props.hover, hover = _a === void 0 ? true : _a, sdsType = props.sdsType, sdsStyle = props.sdsStyle, _b = props.sdsSize, sdsSize = _b === void 0 ? "s" : _b;
|
|
6226
6251
|
var isRounded = sdsStyle === "rounded";
|
|
6227
6252
|
var type = sdsType || "primary";
|
|
6228
|
-
return css(templateObject_7
|
|
6253
|
+
return css(templateObject_7 || (templateObject_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;");
|
|
6229
6254
|
});
|
|
6230
|
-
var templateObject_1$
|
|
6255
|
+
var templateObject_1$A, templateObject_2$j, templateObject_3$b, templateObject_4$a, templateObject_5$6, templateObject_6$3, templateObject_7, templateObject_8;
|
|
6231
6256
|
|
|
6232
6257
|
/**
|
|
6233
6258
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6241,14 +6266,14 @@ var Tag = function (props) {
|
|
|
6241
6266
|
return jsx(StyledTag$1, __assign({ tagColor: color }, props, { color: "primary" }));
|
|
6242
6267
|
};
|
|
6243
6268
|
|
|
6244
|
-
var StyledTag = styled(Tag)(templateObject_2$
|
|
6269
|
+
var StyledTag = styled(Tag)(templateObject_2$i || (templateObject_2$i = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6245
6270
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
6246
6271
|
var spaces = getSpaces(props);
|
|
6247
6272
|
var iconSizes = getIconSizes(props);
|
|
6248
6273
|
var semanticColors = getSemanticColors(props);
|
|
6249
|
-
return css(templateObject_1$
|
|
6274
|
+
return css(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n padding: ", "px ", "px;\n background-color: ", ";\n\n &:hover,\n &:focus {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n &:after {\n display: none;\n }\n\n .MuiChip-label {\n ", "\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 .MuiChip-label,\n svg {\n z-index: auto;\n }\n "], ["\n padding: ", "px ", "px;\n background-color: ", ";\n\n &:hover,\n &:focus {\n background-color: ", ";\n }\n\n &:active {\n background-color: ", ";\n }\n\n &:after {\n display: none;\n }\n\n .MuiChip-label {\n ", "\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 .MuiChip-label,\n svg {\n z-index: auto;\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, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.fillHover, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.fillPressed, fontHeaderXs(props), spaces === null || spaces === void 0 ? void 0 : spaces.s, (_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 = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs) === null || _f === void 0 ? void 0 : _f.width, (_g = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.xs) === null || _g === void 0 ? void 0 : _g.height);
|
|
6250
6275
|
});
|
|
6251
|
-
var templateObject_1$
|
|
6276
|
+
var templateObject_1$z, templateObject_2$i;
|
|
6252
6277
|
|
|
6253
6278
|
/**
|
|
6254
6279
|
* @see https://mui.com/material-ui/react-chip/
|
|
@@ -6271,12 +6296,12 @@ var Chips = function (_a) {
|
|
|
6271
6296
|
}) }));
|
|
6272
6297
|
};
|
|
6273
6298
|
|
|
6274
|
-
var Wrapper$1 = styled("div")(templateObject_1$
|
|
6275
|
-
var StyledChipsWrapper = styled("div")(templateObject_2$
|
|
6299
|
+
var Wrapper$1 = styled("div")(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n min-width: 150px;\n"], ["\n min-width: 150px;\n"])));
|
|
6300
|
+
var StyledChipsWrapper = styled("div")(templateObject_2$h || (templateObject_2$h = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6276
6301
|
var spaces = getSpaces(props);
|
|
6277
6302
|
return "\n margin-top: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
6278
6303
|
});
|
|
6279
|
-
var templateObject_1$
|
|
6304
|
+
var templateObject_1$y, templateObject_2$h;
|
|
6280
6305
|
|
|
6281
6306
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
6282
6307
|
var ComplexFilter = function (_a) {
|
|
@@ -6368,10 +6393,10 @@ var ComplexFilter = function (_a) {
|
|
|
6368
6393
|
var DialogContext = createContext({ sdsSize: "m" });
|
|
6369
6394
|
|
|
6370
6395
|
// (thuang): Please keep this in sync with the props used in `ExtraProps`
|
|
6371
|
-
var doNotForwardProps$
|
|
6396
|
+
var doNotForwardProps$d = ["sdsSize"];
|
|
6372
6397
|
var StyledPaper = styled(Paper, {
|
|
6373
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6374
|
-
})(templateObject_1$
|
|
6398
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$d.includes(prop); },
|
|
6399
|
+
})(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n & {\n ", "\n\n ", "\n }\n"], ["\n & {\n ", "\n\n ", "\n }\n"])), paperDimensions, function (props) {
|
|
6375
6400
|
var _a;
|
|
6376
6401
|
var spaces = getSpaces(props);
|
|
6377
6402
|
var corners = getCorners(props);
|
|
@@ -6402,7 +6427,7 @@ function paperDimensions(props) {
|
|
|
6402
6427
|
var _a = sizeToDimensions[sdsSize], width = _a.width, minHeight = _a.minHeight;
|
|
6403
6428
|
return "\n width: ".concat(width, ";\n min-height: ").concat(minHeight, ";\n max-width: revert;\n box-sizing: border-box;\n ");
|
|
6404
6429
|
}
|
|
6405
|
-
var templateObject_1$
|
|
6430
|
+
var templateObject_1$x;
|
|
6406
6431
|
|
|
6407
6432
|
/**
|
|
6408
6433
|
* @see https://mui.com/material-ui/react-paper/
|
|
@@ -6431,15 +6456,15 @@ var Dialog = forwardRef(function Dialog(props, ref) {
|
|
|
6431
6456
|
});
|
|
6432
6457
|
|
|
6433
6458
|
// (thuang): Please keep this in sync with the props used in `DialogActionsExtraProps`
|
|
6434
|
-
var doNotForwardProps$
|
|
6459
|
+
var doNotForwardProps$c = ["buttonPosition"];
|
|
6435
6460
|
var StyledDialogActions = styled(DialogActions$1, {
|
|
6436
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6437
|
-
})(templateObject_1$
|
|
6461
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$c.includes(prop); },
|
|
6462
|
+
})(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n padding: 0;\n\n ", "\n"], ["\n padding: 0;\n\n ", "\n"])), function (props) {
|
|
6438
6463
|
var spaces = getSpaces(props);
|
|
6439
6464
|
var _a = props.buttonPosition, buttonPosition = _a === void 0 ? "right" : _a;
|
|
6440
6465
|
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 ");
|
|
6441
6466
|
});
|
|
6442
|
-
var templateObject_1$
|
|
6467
|
+
var templateObject_1$w;
|
|
6443
6468
|
|
|
6444
6469
|
/**
|
|
6445
6470
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -6448,8 +6473,8 @@ var DialogActions = forwardRef(function DialogActions(props, ref) {
|
|
|
6448
6473
|
return jsx(StyledDialogActions, __assign({ ref: ref }, props));
|
|
6449
6474
|
});
|
|
6450
6475
|
|
|
6451
|
-
var StyledDialogContent = styled(DialogContent)(templateObject_1$
|
|
6452
|
-
var templateObject_1$
|
|
6476
|
+
var StyledDialogContent = styled(DialogContent)(templateObject_1$v || (templateObject_1$v = __makeTemplateObject(["\n ", "\n padding: 0;\n"], ["\n ", "\n padding: 0;\n"])), fontBodyS$1);
|
|
6477
|
+
var templateObject_1$v;
|
|
6453
6478
|
|
|
6454
6479
|
var index = forwardRef(
|
|
6455
6480
|
/**
|
|
@@ -6459,11 +6484,11 @@ function DialogContent(props, ref) {
|
|
|
6459
6484
|
return jsx(StyledDialogContent, __assign({ ref: ref }, props));
|
|
6460
6485
|
});
|
|
6461
6486
|
|
|
6462
|
-
var StyledButton$1 = styled(Button)(templateObject_1$
|
|
6487
|
+
var StyledButton$1 = styled(Button)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject(["\n position: absolute;\n\n ", "\n"], ["\n position: absolute;\n\n ", "\n"])), function (props) {
|
|
6463
6488
|
var spaces = getSpaces(props);
|
|
6464
6489
|
return "\n right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxl, "px;\n ");
|
|
6465
6490
|
});
|
|
6466
|
-
var templateObject_1$
|
|
6491
|
+
var templateObject_1$u;
|
|
6467
6492
|
|
|
6468
6493
|
var CloseButton = forwardRef(function CloseButton(props, ref) {
|
|
6469
6494
|
var SDS_SIZE_TO_COMPONENT_SIZE = {
|
|
@@ -6479,27 +6504,27 @@ var CloseButton = forwardRef(function CloseButton(props, ref) {
|
|
|
6479
6504
|
} }));
|
|
6480
6505
|
});
|
|
6481
6506
|
|
|
6482
|
-
var StyledDialogTitle = styled(DialogTitle$1)(templateObject_1$
|
|
6507
|
+
var StyledDialogTitle = styled(DialogTitle$1)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject(["\n padding: 0;\n ", "\n"], ["\n padding: 0;\n ", "\n"])), function (props) {
|
|
6483
6508
|
var spaces = getSpaces(props);
|
|
6484
6509
|
return "\n margin-bottom: ".concat((spaces === null || spaces === void 0 ? void 0 : spaces.xl) || 0, "px;\n ");
|
|
6485
6510
|
});
|
|
6486
|
-
var Title = styled(Typography)(templateObject_2$
|
|
6511
|
+
var Title = styled(Typography)(templateObject_2$g || (templateObject_2$g = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontHeaderXl, function (props) {
|
|
6487
6512
|
var _a;
|
|
6488
6513
|
var semanticColors = getSemanticColors(props);
|
|
6489
6514
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textPrimary, ";\n ");
|
|
6490
6515
|
});
|
|
6491
|
-
var Subtitle = styled(Typography)(templateObject_3$
|
|
6516
|
+
var Subtitle = styled(Typography)(templateObject_3$a || (templateObject_3$a = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
6492
6517
|
var _a;
|
|
6493
6518
|
var semanticColors = getSemanticColors(props);
|
|
6494
6519
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n ");
|
|
6495
6520
|
});
|
|
6496
|
-
var Overline = styled(Typography)(templateObject_4$
|
|
6521
|
+
var Overline = styled(Typography)(templateObject_4$9 || (templateObject_4$9 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6497
6522
|
var _a;
|
|
6498
6523
|
var semanticColors = getSemanticColors(props);
|
|
6499
6524
|
var spaces = getSpaces(props);
|
|
6500
6525
|
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 ");
|
|
6501
6526
|
});
|
|
6502
|
-
var templateObject_1$
|
|
6527
|
+
var templateObject_1$t, templateObject_2$g, templateObject_3$a, templateObject_4$9;
|
|
6503
6528
|
|
|
6504
6529
|
/**
|
|
6505
6530
|
* @see https://mui.com/material-ui/react-dialog/
|
|
@@ -6509,20 +6534,20 @@ var DialogTitle = forwardRef(function DialogTitle(props, ref) {
|
|
|
6509
6534
|
return (jsx(StyledDialogTitle, __assign({ ref: ref }, rest, { children: children || (jsxs(Fragment, { children: [onClose && jsx(CloseButton, { icon: "XMark", onClick: onClose }), jsx(Overline, { children: overline }), jsx(Title, { children: title }), jsx(Subtitle, { children: subtitle })] })) })));
|
|
6510
6535
|
});
|
|
6511
6536
|
|
|
6512
|
-
var doNotForwardProps$
|
|
6537
|
+
var doNotForwardProps$b = ["buttonPosition"];
|
|
6513
6538
|
var StyledButtonsWrapper = styled("div", {
|
|
6514
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6515
|
-
})(templateObject_1$
|
|
6539
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$b.includes(prop); },
|
|
6540
|
+
})(templateObject_1$s || (templateObject_1$s = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6516
6541
|
var buttonPosition = props.buttonPosition;
|
|
6517
6542
|
return "\n display: flex;\n justify-content: ".concat(buttonPosition === "left" ? "start" : "end", ";\n ");
|
|
6518
6543
|
});
|
|
6519
6544
|
var StyledButton = styled(Button, {
|
|
6520
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
6521
|
-
})(templateObject_2$
|
|
6545
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$b.includes(prop); },
|
|
6546
|
+
})(templateObject_2$f || (templateObject_2$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6522
6547
|
var spaces = getSpaces(props);
|
|
6523
6548
|
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 ");
|
|
6524
6549
|
});
|
|
6525
|
-
var templateObject_1$
|
|
6550
|
+
var templateObject_1$s, templateObject_2$f;
|
|
6526
6551
|
|
|
6527
6552
|
// eslint-disable-next-line sonarjs/cognitive-complexity
|
|
6528
6553
|
var Dropdown = function (props) {
|
|
@@ -6695,7 +6720,7 @@ var SvgIconCheckboxUnchecked = function SvgIconCheckboxUnchecked(props) {
|
|
|
6695
6720
|
})));
|
|
6696
6721
|
};
|
|
6697
6722
|
|
|
6698
|
-
var StyledCheckbox = styled(Checkbox)(templateObject_1$
|
|
6723
|
+
var StyledCheckbox = styled(Checkbox)(templateObject_1$r || (templateObject_1$r = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6699
6724
|
var _a, _b, _c, _d, _e, _f;
|
|
6700
6725
|
var _g = props.intent, intent = _g === void 0 ? "default" : _g;
|
|
6701
6726
|
var iconSizes = getIconSizes(props);
|
|
@@ -6705,26 +6730,27 @@ var StyledCheckbox = styled(Checkbox)(templateObject_1$o || (templateObject_1$o
|
|
|
6705
6730
|
default: "base",
|
|
6706
6731
|
negative: "negative",
|
|
6707
6732
|
notice: "notice",
|
|
6733
|
+
positive: "positive",
|
|
6708
6734
|
};
|
|
6709
6735
|
var checkboxColor = intentToColor[intent];
|
|
6710
6736
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[checkboxColor]) === null || _a === void 0 ? void 0 : _a.border, ";\n\n &:hover {\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderHover, ";\n background-color: transparent;\n }\n\n &.").concat(checkboxClasses.disabled, " {\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderDisabled, ";\n }\n\n &.").concat(checkboxClasses.checked, " {\n color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.border, ";\n\n &:hover {\n color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.borderHover, ";\n background-color: transparent;\n }\n\n &.").concat(checkboxClasses.disabled, " {\n color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.borderDisabled, ";\n }\n }\n\n &.").concat(checkboxClasses.root, " {\n ").concat(focusVisibleA11yStyle(props), "\n padding: 0;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n border-radius: 0;\n }\n\n .MuiSvgIcon-root {\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 ");
|
|
6711
6737
|
});
|
|
6712
|
-
var StyledFormControlLabel$1 = styled(FormControlLabel)(templateObject_2$
|
|
6738
|
+
var StyledFormControlLabel$1 = styled(FormControlLabel)(templateObject_2$e || (templateObject_2$e = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6713
6739
|
var spaces = getSpaces(props);
|
|
6714
6740
|
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 ");
|
|
6715
6741
|
});
|
|
6716
|
-
var StyledLabelContainer$1 = styled("span")(templateObject_3$
|
|
6717
|
-
var StyledCheckboxLabel = styled("span")(templateObject_4$
|
|
6742
|
+
var StyledLabelContainer$1 = styled("span")(templateObject_3$9 || (templateObject_3$9 = __makeTemplateObject(["\n display: flex;\n justify-content: start;\n flex-direction: column;\n"], ["\n display: flex;\n justify-content: start;\n flex-direction: column;\n"])));
|
|
6743
|
+
var StyledCheckboxLabel = styled("span")(templateObject_4$8 || (templateObject_4$8 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
6718
6744
|
var spaces = getSpaces(props);
|
|
6719
6745
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
6720
6746
|
});
|
|
6721
|
-
var StyledCheckboxCaption = styled("span")(templateObject_5$
|
|
6747
|
+
var StyledCheckboxCaption = styled("span")(templateObject_5$5 || (templateObject_5$5 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6722
6748
|
var _a, _b;
|
|
6723
6749
|
var disabled = props.disabled;
|
|
6724
6750
|
var semanticColors = getSemanticColors(props);
|
|
6725
6751
|
return "\n color: ".concat(disabled ? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textDisabled : (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textSecondary, ";\n ");
|
|
6726
6752
|
});
|
|
6727
|
-
var templateObject_1$
|
|
6753
|
+
var templateObject_1$r, templateObject_2$e, templateObject_3$9, templateObject_4$8, templateObject_5$5;
|
|
6728
6754
|
|
|
6729
6755
|
/**
|
|
6730
6756
|
* @see https://mui.com/material-ui/react-checkbox/
|
|
@@ -6775,7 +6801,7 @@ var SvgIconRadioUnchecked = function SvgIconRadioUnchecked(props) {
|
|
|
6775
6801
|
})));
|
|
6776
6802
|
};
|
|
6777
6803
|
|
|
6778
|
-
var StyledRadioButton = styled(Radio)(templateObject_1$
|
|
6804
|
+
var StyledRadioButton = styled(Radio)(templateObject_1$q || (templateObject_1$q = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6779
6805
|
var _a, _b, _c, _d, _e, _f;
|
|
6780
6806
|
var _g = props.intent, intent = _g === void 0 ? "default" : _g;
|
|
6781
6807
|
var spaces = getSpaces(props);
|
|
@@ -6785,26 +6811,27 @@ var StyledRadioButton = styled(Radio)(templateObject_1$n || (templateObject_1$n
|
|
|
6785
6811
|
default: "base",
|
|
6786
6812
|
negative: "negative",
|
|
6787
6813
|
notice: "notice",
|
|
6814
|
+
positive: "positive",
|
|
6788
6815
|
};
|
|
6789
6816
|
var radioColor = intentToColor[intent];
|
|
6790
6817
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[radioColor]) === null || _a === void 0 ? void 0 : _a.border, ";\n\n &:hover {\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderHover, ";\n background-color: transparent;\n }\n\n &.").concat(radioClasses.disabled, " {\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderDisabled, ";\n }\n\n &.").concat(radioClasses.checked, " {\n color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.border, ";\n\n &:hover {\n color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.borderHover, ";\n background-color: transparent;\n }\n\n &.").concat(radioClasses.disabled, " {\n color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.borderDisabled, ";\n }\n }\n\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\n .MuiSvgIcon-root {\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 ");
|
|
6791
6818
|
});
|
|
6792
|
-
var StyledFormControlLabel = styled(FormControlLabel)(templateObject_2$
|
|
6819
|
+
var StyledFormControlLabel = styled(FormControlLabel)(templateObject_2$d || (templateObject_2$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6793
6820
|
var spaces = getSpaces(props);
|
|
6794
6821
|
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 ");
|
|
6795
6822
|
});
|
|
6796
|
-
var StyledLabelContainer = styled("span")(templateObject_3$
|
|
6797
|
-
var StyledRadioLabel = styled("span")(templateObject_4$
|
|
6823
|
+
var StyledLabelContainer = styled("span")(templateObject_3$8 || (templateObject_3$8 = __makeTemplateObject(["\n display: flex;\n justify-content: start;\n flex-direction: column;\n"], ["\n display: flex;\n justify-content: start;\n flex-direction: column;\n"])));
|
|
6824
|
+
var StyledRadioLabel = styled("span")(templateObject_4$7 || (templateObject_4$7 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
6798
6825
|
var spaces = getSpaces(props);
|
|
6799
6826
|
return "\n margin-top: -".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px !important;\n ");
|
|
6800
6827
|
});
|
|
6801
|
-
var StyledRadioCaption = styled("span")(templateObject_5$
|
|
6828
|
+
var StyledRadioCaption = styled("span")(templateObject_5$4 || (templateObject_5$4 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6802
6829
|
var _a, _b;
|
|
6803
6830
|
var disabled = props.disabled;
|
|
6804
6831
|
var semanticColors = getSemanticColors(props);
|
|
6805
6832
|
return "\n color: ".concat(disabled ? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textDisabled : (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textSecondary, ";\n ");
|
|
6806
6833
|
});
|
|
6807
|
-
var templateObject_1$
|
|
6834
|
+
var templateObject_1$q, templateObject_2$d, templateObject_3$8, templateObject_4$7, templateObject_5$4;
|
|
6808
6835
|
|
|
6809
6836
|
/**
|
|
6810
6837
|
* @see https://mui.com/material-ui/react-radio-button/
|
|
@@ -6852,11 +6879,11 @@ var disabledSlider = function (props) {
|
|
|
6852
6879
|
var mode = getMode(props);
|
|
6853
6880
|
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(colors === null || colors === void 0 ? void 0 : colors.gray[300], ";\n background-color: ").concat(mode === "light" ? (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.surfaceSecondary : (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.surfacePrimary, ";\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 ");
|
|
6854
6881
|
};
|
|
6855
|
-
var StyledSlider = styled(Slider)(templateObject_1$
|
|
6882
|
+
var StyledSlider = styled(Slider)(templateObject_1$p || (templateObject_1$p = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXxs$1, function (props) {
|
|
6856
6883
|
var disabled = props.disabled;
|
|
6857
6884
|
return "\n ".concat(inputSlider(props), "\n ").concat(horizontal(props), "\n ").concat(disabled ? disabledSlider(props) : "", "\n ");
|
|
6858
6885
|
});
|
|
6859
|
-
var templateObject_1$
|
|
6886
|
+
var templateObject_1$p;
|
|
6860
6887
|
|
|
6861
6888
|
/**
|
|
6862
6889
|
* @see https://mui.com/material-ui/react-slider/
|
|
@@ -6867,29 +6894,23 @@ var InputSlider = forwardRef(function (props, ref) {
|
|
|
6867
6894
|
});
|
|
6868
6895
|
|
|
6869
6896
|
var sdsPropNames$1 = ["sdsStyle", "sdsType", "intent", "hideLabel"];
|
|
6870
|
-
var
|
|
6897
|
+
var applyIntentColor = function (props, intent) {
|
|
6871
6898
|
var _a, _b, _c, _d;
|
|
6872
6899
|
var borders = getBorders(props);
|
|
6873
6900
|
var semanticColors = getSemanticColors(props);
|
|
6874
|
-
return css(templateObject_1$
|
|
6875
|
-
};
|
|
6876
|
-
var notice = function (props) {
|
|
6877
|
-
var _a, _b, _c, _d;
|
|
6878
|
-
var borders = getBorders(props);
|
|
6879
|
-
var semanticColors = getSemanticColors(props);
|
|
6880
|
-
return css(templateObject_2$b || (templateObject_2$b = __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.notice) === 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.base) === null || _c === void 0 ? void 0 : _c.hover, inputAdornmentClasses.root, buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.iconPrimary);
|
|
6901
|
+
return css(templateObject_1$o || (templateObject_1$o = __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.base) === null || _c === void 0 ? void 0 : _c.hover, inputAdornmentClasses.root, buttonBaseClasses.root, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.iconPrimary);
|
|
6881
6902
|
};
|
|
6882
6903
|
var disabledStyled$1 = function (props) {
|
|
6883
6904
|
var _a, _b, _c;
|
|
6884
6905
|
var borders = getBorders(props);
|
|
6885
6906
|
var semanticColors = getSemanticColors(props);
|
|
6886
|
-
return css(
|
|
6907
|
+
return css(templateObject_2$c || (templateObject_2$c = __makeTemplateObject(["\n .", " {\n .", " {\n border: ", ";\n }\n\n &:hover .", " {\n border: ", ";\n }\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n "], ["\n .", " {\n .", " {\n border: ", ";\n }\n\n &:hover .", " {\n border: ", ";\n }\n\n &::placeholder {\n color: ", ";\n opacity: 1;\n }\n }\n "])), outlinedInputClasses.disabled, outlinedInputClasses.notchedOutline, (_a = borders === null || borders === void 0 ? void 0 : borders.base) === null || _a === void 0 ? void 0 : _a.disabled, outlinedInputClasses.notchedOutline, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.disabled, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textDisabled);
|
|
6887
6908
|
};
|
|
6888
6909
|
var textArea = function (props) {
|
|
6889
6910
|
var spaces = getSpaces(props);
|
|
6890
|
-
return css(
|
|
6911
|
+
return css(templateObject_3$7 || (templateObject_3$7 = __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);
|
|
6891
6912
|
};
|
|
6892
|
-
var StyledLabel = styled("label")(
|
|
6913
|
+
var StyledLabel = styled("label")(templateObject_4$6 || (templateObject_4$6 = __makeTemplateObject(["\n display: block;\n ", "\n\n ", "\n"], ["\n display: block;\n ", "\n\n ", "\n"])), fontBodyS$1, function (props) {
|
|
6893
6914
|
var spaces = getSpaces(props);
|
|
6894
6915
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n ");
|
|
6895
6916
|
});
|
|
@@ -6897,16 +6918,16 @@ var StyledInputBase = styled(TextField, {
|
|
|
6897
6918
|
shouldForwardProp: function (prop) {
|
|
6898
6919
|
return !sdsPropNames$1.includes(prop.toString());
|
|
6899
6920
|
},
|
|
6900
|
-
})(
|
|
6921
|
+
})(templateObject_6$2 || (templateObject_6$2 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
6901
6922
|
var _a, _b, _c, _d;
|
|
6902
6923
|
var intent = props.intent, sdsType = props.sdsType, disabled = props.disabled;
|
|
6903
6924
|
var spaces = getSpaces(props);
|
|
6904
6925
|
var borders = getBorders(props);
|
|
6905
6926
|
var corners = getCorners(props);
|
|
6906
6927
|
var semanticColors = getSemanticColors(props);
|
|
6907
|
-
return css(
|
|
6928
|
+
return css(templateObject_5$3 || (templateObject_5$3 = __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 background-color: ", ";\n }\n\n .", " {\n border-radius: ", "px;\n border: ", ";\n }\n\n .", " {\n outline: none;\n border-radius: 4px;\n width: 100%;\n }\n\n &.user-is-tabbing .", " {\n ", "\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", "\n .", " {\n border: ", ";\n }\n\n ", "\n ", "\n ", "\n ", "\n ", "\n "], ["\n margin-bottom: ", "px;\n margin-right: ", "px;\n display: block;\n\n .", " {\n width: 100%;\n }\n\n .", " {\n ", "\n padding: ", "px ", "px;\n height: unset;\n box-sizing: border-box;\n background-color: ", ";\n }\n\n .", " {\n border-radius: ", "px;\n border: ", ";\n }\n\n .", " {\n outline: none;\n border-radius: 4px;\n width: 100%;\n }\n\n &.user-is-tabbing .", " {\n ", "\n }\n\n .", ":hover\n .", " {\n border: ", ";\n }\n\n .", ".", "\n .", " {\n border: ", ";\n }\n\n ", "\n ", "\n ", "\n ", "\n ", "\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.l, spaces === null || spaces === void 0 ? void 0 : spaces.m, outlinedInputClasses.root, outlinedInputClasses.inputSizeSmall, fontBodyXs$2(props), spaces === null || spaces === void 0 ? void 0 : spaces.xs, spaces === null || spaces === void 0 ? void 0 : spaces.m, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, outlinedInputClasses.notchedOutline, corners === null || corners === void 0 ? void 0 : corners.m, (_b = borders === null || borders === void 0 ? void 0 : borders.base) === null || _b === void 0 ? void 0 : _b.default, outlinedInputClasses.input, 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));
|
|
6908
6929
|
});
|
|
6909
|
-
var templateObject_1$
|
|
6930
|
+
var templateObject_1$o, templateObject_2$c, templateObject_3$7, templateObject_4$6, templateObject_5$3, templateObject_6$2;
|
|
6910
6931
|
|
|
6911
6932
|
/**
|
|
6912
6933
|
* @see https://mui.com/material-ui/react-text-field/
|
|
@@ -6967,11 +6988,11 @@ var toggleOff = function (props) {
|
|
|
6967
6988
|
: (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.iconPrimary, ";\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: ").concat((_j = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _j === void 0 ? void 0 : _j.fillPrimary, " !important;\n opacity: 1 !important;\n }\n\n ").concat(!disabled &&
|
|
6968
6989
|
"&:hover {\n outline: ".concat((_k = borders === null || borders === void 0 ? void 0 : borders.base) === null || _k === void 0 ? void 0 : _k.hover, ";\n\n .").concat(switchClasses.thumb, " {\n color: ").concat((_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _l === void 0 ? void 0 : _l.iconPrimaryHover, ";\n }\n }"), "\n ");
|
|
6969
6990
|
};
|
|
6970
|
-
var Toggle = styled(Switch)(templateObject_1$
|
|
6991
|
+
var Toggle = styled(Switch)(templateObject_1$n || (templateObject_1$n = __makeTemplateObject(["\n ", "\n ", "\n"], ["\n ", "\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
6971
6992
|
var checked = props.checked;
|
|
6972
6993
|
return "\n ".concat(toggle(props), "\n ").concat(checked ? toggleOn(props) : toggleOff(props), "\n ");
|
|
6973
6994
|
});
|
|
6974
|
-
var templateObject_1$
|
|
6995
|
+
var templateObject_1$n;
|
|
6975
6996
|
|
|
6976
6997
|
/**
|
|
6977
6998
|
* @see https://mui.com/material-ui/react-switch/
|
|
@@ -6989,18 +7010,18 @@ var InputToggle = function (props) {
|
|
|
6989
7010
|
return (jsx(Toggle, __assign({ checked: finalChecked, color: "primary", onChange: handleChange, value: labelValue }, rest)));
|
|
6990
7011
|
};
|
|
6991
7012
|
|
|
6992
|
-
var doNotForwardProps$
|
|
7013
|
+
var doNotForwardProps$a = ["sdsStyle", "sdsSize", "fontWeight"];
|
|
6993
7014
|
var defaultStyle = function (props) {
|
|
6994
7015
|
var _a, _b, _c, _d, _e, _f, _g;
|
|
6995
7016
|
var _h = props.sdsSize, sdsSize = _h === void 0 ? "s" : _h;
|
|
6996
7017
|
var semanticColors = getSemanticColors(props);
|
|
6997
|
-
return css(templateObject_1$
|
|
7018
|
+
return css(templateObject_1$m || (templateObject_1$m = __makeTemplateObject(["\n color: ", ";\n position: relative;\n\n &::after {\n content: \"\";\n display: block;\n position: absolute;\n height: 1px;\n margin-top: ", "px;\n width: 100%;\n }\n\n &:hover {\n color: ", ";\n\n &::after {\n background-color: ", ";\n }\n }\n\n &:focus {\n color: ", ";\n\n &::after {\n background-color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n\n &::after {\n background-color: ", ";\n }\n }\n "], ["\n color: ", ";\n position: relative;\n\n &::after {\n content: \"\";\n display: block;\n position: absolute;\n height: 1px;\n margin-top: ", "px;\n width: 100%;\n }\n\n &:hover {\n color: ", ";\n\n &::after {\n background-color: ", ";\n }\n }\n\n &:focus {\n color: ", ";\n\n &::after {\n background-color: ", ";\n }\n }\n\n &:active {\n color: ", ";\n\n &::after {\n background-color: ", ";\n }\n }\n "])), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _a === void 0 ? void 0 : _a.textAction, sdsSize === "s" ? -4 : -3, (_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.borderHover, (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _d === void 0 ? void 0 : _d.textActionHover, (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _e === void 0 ? void 0 : _e.borderHover, (_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _f === void 0 ? void 0 : _f.textActionPressed, (_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _g === void 0 ? void 0 : _g.borderPressed);
|
|
6998
7019
|
};
|
|
6999
7020
|
var dashedStyle = function (props) {
|
|
7000
7021
|
var _a, _b, _c;
|
|
7001
7022
|
var _d = props.sdsSize, sdsSize = _d === void 0 ? "s" : _d;
|
|
7002
7023
|
var semanticColors = getSemanticColors(props);
|
|
7003
|
-
return css(templateObject_2$
|
|
7024
|
+
return css(templateObject_2$b || (templateObject_2$b = __makeTemplateObject(["\n color: inherit;\n position: relative;\n\n &::after {\n content: \"\";\n display: block;\n position: absolute;\n height: 1px;\n margin-top: ", "px;\n margin-left: 1px;\n width: 100%;\n background-image: linear-gradient(\n to right,\n ", " 60%,\n transparent 60%\n );\n background-size: 5px 100%;\n }\n\n &:hover,\n &:focus {\n text-decoration: none;\n &::after {\n background-image: linear-gradient(\n to right,\n ", " 60%,\n ", " 60%\n );\n }\n }\n "], ["\n color: inherit;\n position: relative;\n\n &::after {\n content: \"\";\n display: block;\n position: absolute;\n height: 1px;\n margin-top: ", "px;\n margin-left: 1px;\n width: 100%;\n background-image: linear-gradient(\n to right,\n ", " 60%,\n transparent 60%\n );\n background-size: 5px 100%;\n }\n\n &:hover,\n &:focus {\n text-decoration: none;\n &::after {\n background-image: linear-gradient(\n to right,\n ", " 60%,\n ", " 60%\n );\n }\n }\n "])), sdsSize === "s" ? -4 : -3, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.borderHover, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.borderHover, (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.borderHover);
|
|
7004
7025
|
};
|
|
7005
7026
|
var smallStyle = function (props) {
|
|
7006
7027
|
return fontBodyS$1(props);
|
|
@@ -7010,13 +7031,13 @@ var extraSmallStyle = function (props) {
|
|
|
7010
7031
|
};
|
|
7011
7032
|
var StyledLink = styled(Link$1, {
|
|
7012
7033
|
shouldForwardProp: function (prop) {
|
|
7013
|
-
return !doNotForwardProps$
|
|
7034
|
+
return !doNotForwardProps$a.includes(prop.toString());
|
|
7014
7035
|
},
|
|
7015
|
-
})(templateObject_4$
|
|
7036
|
+
})(templateObject_4$5 || (templateObject_4$5 = __makeTemplateObject(["\n all: unset;\n\n ", "\n\n ", "\n"], ["\n all: unset;\n\n ", "\n\n ", "\n"])), focusVisibleA11yStyle, function (props) {
|
|
7016
7037
|
var _a = props.fontWeight, fontWeight = _a === void 0 ? "normal" : _a, sdsStyle = props.sdsStyle, _b = props.sdsSize, sdsSize = _b === void 0 ? "s" : _b;
|
|
7017
|
-
return css(templateObject_3$
|
|
7038
|
+
return css(templateObject_3$6 || (templateObject_3$6 = __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(props), sdsSize === "s" && smallStyle(props), sdsSize === "xs" && extraSmallStyle(props), fontWeight === "normal" ? "400" : "600");
|
|
7018
7039
|
});
|
|
7019
|
-
var templateObject_1$
|
|
7040
|
+
var templateObject_1$m, templateObject_2$b, templateObject_3$6, templateObject_4$5;
|
|
7020
7041
|
|
|
7021
7042
|
/**
|
|
7022
7043
|
* @see https://mui.com/material-ui/react-link/
|
|
@@ -7031,10 +7052,10 @@ var Link = forwardRef(function (props, ref) {
|
|
|
7031
7052
|
});
|
|
7032
7053
|
|
|
7033
7054
|
// (thuang): Please keep this in sync with the props used in `ListExtraProps`
|
|
7034
|
-
var doNotForwardProps$
|
|
7055
|
+
var doNotForwardProps$9 = ["marginBottom", "ordered"];
|
|
7035
7056
|
var StyledList = styled(List$1, {
|
|
7036
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7037
|
-
})(templateObject_1$
|
|
7057
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$9.includes(prop); },
|
|
7058
|
+
})(templateObject_1$l || (templateObject_1$l = __makeTemplateObject(["\n .MuiListSubheader-root {\n ", "\n }\n\n ", "\n"], ["\n .MuiListSubheader-root {\n ", "\n }\n\n ", "\n"])), propsToMarginBottom$1, function (props) {
|
|
7038
7059
|
if (!props.ordered)
|
|
7039
7060
|
return "";
|
|
7040
7061
|
return "\n counter-reset: section;\n ";
|
|
@@ -7052,7 +7073,7 @@ function propsToMarginBottom$1(props) {
|
|
|
7052
7073
|
var marginBottom = props.marginBottom;
|
|
7053
7074
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "s"], "px;\n ");
|
|
7054
7075
|
}
|
|
7055
|
-
var templateObject_1$
|
|
7076
|
+
var templateObject_1$l;
|
|
7056
7077
|
|
|
7057
7078
|
/**
|
|
7058
7079
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7069,10 +7090,10 @@ var fontBodyXs$1 = fontBody("xs");
|
|
|
7069
7090
|
var fontBodyXxs = fontBody("xxs");
|
|
7070
7091
|
var fontBodyXxxs = fontBody("xxxs");
|
|
7071
7092
|
// (thuang): Please keep this in sync with the props used in `ListItemExtraProps`
|
|
7072
|
-
var doNotForwardProps$
|
|
7093
|
+
var doNotForwardProps$8 = ["marginBottom", "fontSize", "ordered"];
|
|
7073
7094
|
var StyledListItem = styled(ListItem$1, {
|
|
7074
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7075
|
-
})(templateObject_1$
|
|
7095
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$8.includes(prop); },
|
|
7096
|
+
})(templateObject_1$k || (templateObject_1$k = __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) {
|
|
7076
7097
|
var ordered = props.ordered;
|
|
7077
7098
|
return "\n align-items: flex-start;\n ".concat(ordered ? "counter-increment: section;" : "", "\n ");
|
|
7078
7099
|
}, function (props) {
|
|
@@ -7103,11 +7124,11 @@ function propsToMarginBottom(props) {
|
|
|
7103
7124
|
var marginBottom = props.marginBottom;
|
|
7104
7125
|
return "\n margin-bottom: ".concat(propsToMarginBottomMap[marginBottom || "xs"], "px;\n ");
|
|
7105
7126
|
}
|
|
7106
|
-
var ListItemLabel = styled("span")(templateObject_2$
|
|
7127
|
+
var ListItemLabel = styled("span")(templateObject_2$a || (templateObject_2$a = __makeTemplateObject(["\n margin-right: 5px;\n\n ", "\n"], ["\n margin-right: 5px;\n\n ", "\n"])), function (props) {
|
|
7107
7128
|
var fontWeights = getFontWeights(props);
|
|
7108
7129
|
return "\n font-weight: ".concat(fontWeights === null || fontWeights === void 0 ? void 0 : fontWeights.semibold, ";\n ");
|
|
7109
7130
|
});
|
|
7110
|
-
var templateObject_1$
|
|
7131
|
+
var templateObject_1$k, templateObject_2$a;
|
|
7111
7132
|
|
|
7112
7133
|
/**
|
|
7113
7134
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7117,11 +7138,11 @@ var ListItem = function (props) {
|
|
|
7117
7138
|
};
|
|
7118
7139
|
|
|
7119
7140
|
var fontHeaderM = fontHeader("m");
|
|
7120
|
-
var StyledListSubheader = styled(ListSubheader$1)(templateObject_1$
|
|
7141
|
+
var StyledListSubheader = styled(ListSubheader$1)(templateObject_1$j || (templateObject_1$j = __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) {
|
|
7121
7142
|
var spaces = getSpaces(props);
|
|
7122
7143
|
return "\n margin-bottom: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n ");
|
|
7123
7144
|
});
|
|
7124
|
-
var templateObject_1$
|
|
7145
|
+
var templateObject_1$j;
|
|
7125
7146
|
|
|
7126
7147
|
/**
|
|
7127
7148
|
* @see https://mui.com/material-ui/react-list/
|
|
@@ -7130,7 +7151,7 @@ var ListSubheader = function (props) {
|
|
|
7130
7151
|
return jsx(StyledListSubheader, __assign({ disableGutters: true }, props));
|
|
7131
7152
|
};
|
|
7132
7153
|
|
|
7133
|
-
var StyledText = styled("span")(templateObject_1$
|
|
7154
|
+
var StyledText = styled("span")(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7134
7155
|
var spaces = getSpaces(props);
|
|
7135
7156
|
return "\n margin: 0 ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
7136
7157
|
});
|
|
@@ -7138,37 +7159,37 @@ var minimal = function (props) {
|
|
|
7138
7159
|
var _a, _b;
|
|
7139
7160
|
var iconSizes = getIconSizes(props);
|
|
7140
7161
|
var semanticColors = getSemanticColors(props);
|
|
7141
|
-
return css(templateObject_2$
|
|
7162
|
+
return css(templateObject_2$9 || (templateObject_2$9 = __makeTemplateObject(["\n ", "\n\n color: ", ";\n\n svg {\n height: ", "px;\n width: ", "px;\n\n path {\n fill: ", ";\n }\n }\n "], ["\n ", "\n\n color: ", ";\n\n svg {\n height: ", "px;\n width: ", "px;\n\n path {\n fill: ", ";\n }\n }\n "])), fontBodyS$1(props), (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.height, iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.s.width, (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimary);
|
|
7142
7163
|
};
|
|
7143
7164
|
var tag = function (props) {
|
|
7144
7165
|
var _a, _b, _c;
|
|
7145
7166
|
var corners = getCorners(props);
|
|
7146
7167
|
var semanticColors = getSemanticColors(props);
|
|
7147
|
-
return css(templateObject_3$
|
|
7168
|
+
return css(templateObject_3$5 || (templateObject_3$5 = __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.surfacePrimary, 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);
|
|
7148
7169
|
};
|
|
7149
|
-
var doNotForwardProps$
|
|
7170
|
+
var doNotForwardProps$7 = ["sdsStyle"];
|
|
7150
7171
|
var StyledLoadingIndicator = styled("div", {
|
|
7151
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7152
|
-
})(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7172
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$7.includes(prop); },
|
|
7173
|
+
})(templateObject_6$1 || (templateObject_6$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7153
7174
|
var sdsStyle = props.sdsStyle;
|
|
7154
7175
|
var spaces = getSpaces(props);
|
|
7155
|
-
var style = css(templateObject_4$
|
|
7156
|
-
return css(templateObject_5$
|
|
7176
|
+
var style = css(templateObject_4$4 || (templateObject_4$4 = __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);
|
|
7177
|
+
return css(templateObject_5$2 || (templateObject_5$2 = __makeTemplateObject(["\n ", "\n ", "\n ", "\n "], ["\n ", "\n ", "\n ", "\n "])), style, sdsStyle === "minimal" && minimal(props), sdsStyle === "tag" && tag(props));
|
|
7157
7178
|
});
|
|
7158
|
-
var templateObject_1$
|
|
7179
|
+
var templateObject_1$i, templateObject_2$9, templateObject_3$5, templateObject_4$4, templateObject_5$2, templateObject_6$1;
|
|
7159
7180
|
|
|
7160
7181
|
var LoadingIndicator = function (_a) {
|
|
7161
7182
|
var ariaLabel = _a["aria-label"], sdsStyle = _a.sdsStyle;
|
|
7162
7183
|
return (jsxs(StyledLoadingIndicator, { sdsStyle: sdsStyle, "aria-label": "Loading", children: [jsx(Icon, { sdsIcon: "Loading", sdsSize: "l", sdsType: "static" }), jsx(StyledText, { "aria-label": ariaLabel, "aria-live": "polite", role: "status", children: "Loading" })] }));
|
|
7163
7184
|
};
|
|
7164
7185
|
|
|
7165
|
-
var StyledMenu = styled(Menu$1)(templateObject_1$
|
|
7186
|
+
var StyledMenu = styled(Menu$1)(templateObject_1$h || (templateObject_1$h = __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) {
|
|
7166
7187
|
var _a;
|
|
7167
7188
|
var spaces = getSpaces(props);
|
|
7168
7189
|
var semanticColors = getSemanticColors(props);
|
|
7169
7190
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, ";\n background-image: none;\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xs, "px;\n ");
|
|
7170
7191
|
});
|
|
7171
|
-
var templateObject_1$
|
|
7192
|
+
var templateObject_1$h;
|
|
7172
7193
|
|
|
7173
7194
|
var ANCHOR_ORIGIN = {
|
|
7174
7195
|
horizontal: "center",
|
|
@@ -7185,19 +7206,19 @@ var Menu = function (props) {
|
|
|
7185
7206
|
return (jsx(StyledMenu, __assign({ anchorOrigin: ANCHOR_ORIGIN, transformOrigin: TRANSFORM_ORIGIN }, props)));
|
|
7186
7207
|
};
|
|
7187
7208
|
|
|
7188
|
-
var StyledMenuItem = styled(MenuItem)(templateObject_1$
|
|
7189
|
-
var doNotForwardProps$
|
|
7209
|
+
var StyledMenuItem = styled(MenuItem)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n width: 100%;\n"], ["\n width: 100%;\n"])));
|
|
7210
|
+
var doNotForwardProps$6 = ["search", "InputBaseProps", "keepSearchOnSelect"];
|
|
7190
7211
|
// (thuang): Casting the type to `Autocomplete`
|
|
7191
7212
|
// per https://github.com/mui-org/material-ui/issues/21727#issuecomment-880263271
|
|
7192
7213
|
var StyledAutocomplete = styled(Autocomplete$1, {
|
|
7193
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7194
|
-
})(templateObject_2$
|
|
7214
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$6.includes(prop); },
|
|
7215
|
+
})(templateObject_2$8 || (templateObject_2$8 = __makeTemplateObject(["\n ", "\n width: 100%;\n"], ["\n ", "\n width: 100%;\n"])), function (_a) {
|
|
7195
7216
|
var search = _a.search;
|
|
7196
7217
|
return !search && "height: 0; margin: 0 !important;";
|
|
7197
7218
|
});
|
|
7198
7219
|
var InputBaseWrapper = styled("div", {
|
|
7199
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7200
|
-
})(templateObject_3$
|
|
7220
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$6.includes(prop); },
|
|
7221
|
+
})(templateObject_3$4 || (templateObject_3$4 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7201
7222
|
var search = props.search;
|
|
7202
7223
|
if (!search) {
|
|
7203
7224
|
// (thuang): We cannot use `display: none;` here, since
|
|
@@ -7209,12 +7230,12 @@ var InputBaseWrapper = styled("div", {
|
|
|
7209
7230
|
return "\n margin: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.s, "px;\n ");
|
|
7210
7231
|
});
|
|
7211
7232
|
var StyledMenuInputSearch = styled(InputSearch, {
|
|
7212
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7213
|
-
})(templateObject_4$
|
|
7233
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$6.includes(prop); },
|
|
7234
|
+
})(templateObject_4$3 || (templateObject_4$3 = __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) {
|
|
7214
7235
|
var search = _a.search;
|
|
7215
7236
|
return (search ? "auto" : "transparent");
|
|
7216
7237
|
});
|
|
7217
|
-
var templateObject_1$
|
|
7238
|
+
var templateObject_1$g, templateObject_2$8, templateObject_3$4, templateObject_4$3;
|
|
7218
7239
|
|
|
7219
7240
|
/**
|
|
7220
7241
|
* @see https://mui.com/material-ui/react-autocomplete/
|
|
@@ -7318,24 +7339,24 @@ var useScrollStopListener = function (callback, timeout) {
|
|
|
7318
7339
|
}, [timeout]);
|
|
7319
7340
|
};
|
|
7320
7341
|
|
|
7321
|
-
var doNotForwardProps$
|
|
7342
|
+
var doNotForwardProps$5 = ["items", "sdsIndicatorColor"];
|
|
7322
7343
|
var StyledTabs$1 = styled(Tabs$1, {
|
|
7323
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7324
|
-
})(templateObject_1$
|
|
7344
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$5.includes(prop); },
|
|
7345
|
+
})(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7325
7346
|
var _a, _b;
|
|
7326
7347
|
var spaces = getSpaces(props);
|
|
7327
7348
|
var semanticColors = getSemanticColors(props);
|
|
7328
7349
|
return "\n &:before {\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.divider, ";\n border-radius: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n content: \"\";\n height: 100%;\n left: 0;\n position: absolute;\n top: 0;\n width: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n }\n\n max-width: 180px;\n top: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xl, "px;\n margin-bottom: ").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 position: sticky;\n overflow: visible;\n\n .").concat(tabsClasses.indicator, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _b === void 0 ? void 0 : _b.borderSelected, " !important;\n border-radius: 2px;\n left: 0;\n width: 2px;\n }\n\n .").concat(tabsClasses.scroller, " {\n overflow: visible !important;\n }\n ");
|
|
7329
7350
|
});
|
|
7330
7351
|
var StyledTab$1 = styled(Tab$1, {
|
|
7331
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7332
|
-
})(templateObject_2$
|
|
7352
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$5.includes(prop); },
|
|
7353
|
+
})(templateObject_2$7 || (templateObject_2$7 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs$2, function (props) {
|
|
7333
7354
|
var _a, _b, _c, _d;
|
|
7334
7355
|
var spaces = getSpaces(props);
|
|
7335
7356
|
var semanticColors = getSemanticColors(props);
|
|
7336
7357
|
return "\n ".concat(focusVisibleA11yStyle(props), "\n box-sizing: border-box;\n max-width: 180px;\n padding-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n margin: 0 ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n align-items: start;\n min-height: unset;\n max-height: unset;\n text-transform: none;\n &:last-child {\n margin-bottom: 0;\n }\n &:before {\n content: \"\";\n position: absolute;\n left: -").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n width: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n height: 100%;\n background-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.border, ";\n display: none;\n border-radius: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n }\n &:hover {\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimary, ";\n &:before {\n display: block;\n }\n }\n &.Mui-selected {\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimary, ";\n font-weight: 600;\n }\n &.MuiTabs-indicator {\n backgroundColor: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.surfaceTertiary, ";\n width: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, "px;\n }\n &.MuiButtonBase-root {\n white-space: nowrap;\n padding: 0;\n overflow: visible;\n }\n ");
|
|
7337
7358
|
});
|
|
7338
|
-
var templateObject_1$
|
|
7359
|
+
var templateObject_1$f, templateObject_2$7;
|
|
7339
7360
|
|
|
7340
7361
|
/**
|
|
7341
7362
|
* Custom hook that observes elements to determine if they are in the viewport.
|
|
@@ -7480,34 +7501,34 @@ var NavigationJumpTo = forwardRef(function (props, ref) {
|
|
|
7480
7501
|
});
|
|
7481
7502
|
|
|
7482
7503
|
var fontBodyXs = fontBody("xs");
|
|
7483
|
-
var doNotForwardProps$
|
|
7504
|
+
var doNotForwardProps$4 = ["slideDirection"];
|
|
7484
7505
|
var StyledNotification = styled(Alert$2, {
|
|
7485
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7486
|
-
})(templateObject_1$
|
|
7487
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m
|
|
7488
|
-
var
|
|
7506
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$4.includes(prop); },
|
|
7507
|
+
})(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodyXs, function (props) {
|
|
7508
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
|
|
7509
|
+
var _o = props.intent, intent = _o === void 0 ? "info" : _o;
|
|
7489
7510
|
var spaces = getSpaces(props);
|
|
7490
7511
|
var shadows = getShadows(props);
|
|
7491
7512
|
var corners = getCorners(props);
|
|
7492
7513
|
var iconSizes = getIconSizes(props);
|
|
7493
7514
|
var semanticColors = getSemanticColors(props);
|
|
7494
7515
|
var typography = getTypography(props);
|
|
7495
|
-
var
|
|
7496
|
-
var iconColor = (
|
|
7497
|
-
var backgroundColor = (
|
|
7516
|
+
var borders = getBorders(props);
|
|
7517
|
+
var iconColor = (_b = (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _a === void 0 ? void 0 : _a.ornament) !== null && _b !== void 0 ? _b : "black";
|
|
7518
|
+
var backgroundColor = (_d = (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors[intent]) === null || _c === void 0 ? void 0 : _c.surfacePrimary) !== null && _d !== void 0 ? _d : "white";
|
|
7498
7519
|
// (masoudmanson): The Notification Icon should be vertically centered with the Notification
|
|
7499
7520
|
// Title. The padding-top of the Notification Title is calculated based on the difference
|
|
7500
7521
|
// between the height of the Icon and the line-height of the Notification Title.
|
|
7501
|
-
var alertMessagePaddingTop = Math.abs((((
|
|
7502
|
-
parseInt(String((
|
|
7522
|
+
var alertMessagePaddingTop = Math.abs((((_e = iconSizes === null || iconSizes === void 0 ? void 0 : iconSizes.l.height) !== null && _e !== void 0 ? _e : 0) -
|
|
7523
|
+
parseInt(String((_k = (_j = (_h = (_g = (_f = typography === null || typography === void 0 ? void 0 : typography.styles) === null || _f === void 0 ? void 0 : _f.body) === null || _g === void 0 ? void 0 : _g.regular) === null || _h === void 0 ? void 0 : _h.xs) === null || _j === void 0 ? void 0 : _j.lineHeight) !== null && _k !== void 0 ? _k : "0"))) /
|
|
7503
7524
|
2);
|
|
7504
|
-
return "\n background-color: ".concat(backgroundColor, ";\n max-width: 480px;\n min-width: 280px;\n box-sizing: border-box;\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((
|
|
7525
|
+
return "\n background-color: ".concat(backgroundColor, ";\n max-width: 480px;\n min-width: 280px;\n box-sizing: border-box;\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((_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _l === void 0 ? void 0 : _l.textPrimary, ";\n padding: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n align-items: flex-start;\n border-left: ").concat((_m = borders === null || borders === void 0 ? void 0 : borders[intent]) === null || _m === void 0 ? void 0 : _m.extraThick, ";\n box-shadow: ").concat(shadows === null || shadows === void 0 ? void 0 : shadows.s, ";\n\n .MuiAlert-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.m, "px;\n padding: 0;\n path {\n fill: ").concat(iconColor, ";\n }\n }\n\n .MuiAlert-message {\n padding: ").concat(alertMessagePaddingTop, "px 0px 0px;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px;\n width: 100%;\n\n > * {\n margin: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.m, "px 0px;\n\n &:last-child {\n margin-bottom: 0;\n }\n }\n\n button {\n display: block;\n }\n }\n\n .MuiAlert-action {\n margin-right: 0;\n padding: 0;\n align-items: flex-start;\n margin-top: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.xxs, "px;\n\n > button {\n padding: 0;\n }\n }\n }\n ");
|
|
7505
7526
|
});
|
|
7506
|
-
var StyledButtonWrapper = styled("div")(templateObject_2$
|
|
7527
|
+
var StyledButtonWrapper = styled("div")(templateObject_2$6 || (templateObject_2$6 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7507
7528
|
var _a = props.buttonPosition, buttonPosition = _a === void 0 ? "right" : _a;
|
|
7508
7529
|
return "\n display: flex;\n justify-content: ".concat(buttonPosition === "left" ? "flex-start" : "flex-end", ";\n ");
|
|
7509
7530
|
});
|
|
7510
|
-
var templateObject_1$
|
|
7531
|
+
var templateObject_1$e, templateObject_2$6;
|
|
7511
7532
|
|
|
7512
7533
|
/**
|
|
7513
7534
|
* @see https://mui.com/material-ui/react-alert/
|
|
@@ -7555,7 +7576,7 @@ var Notification = function (_a) {
|
|
|
7555
7576
|
return (jsx(Fragment, { children: jsx(Slide, { in: !hide, direction: slideDirection, mountOnEnter: true, unmountOnExit: true, timeout: 250, children: jsx(Box, { children: jsxs(StyledNotification, __assign({ onClose: onClose ? handleClose : undefined, action: onClose ? (jsx(Button, { onClick: handleClose, sdsSize: "small", sdsType: "tertiary", sdsStyle: "icon", "data-testid": "notificationCloseButton", icon: "XMark" })) : null, icon: getIcon(), className: "elevated", intent: intent, slideDirection: slideDirection }, passedProps, { children: [children, buttonOnClick !== undefined && (jsx(StyledButtonWrapper, { buttonPosition: buttonPosition, children: jsx(Button, { sdsStyle: "minimal", sdsType: "secondary", onClick: buttonOnClick, children: buttonText }) }))] })) }) }) }));
|
|
7556
7577
|
};
|
|
7557
7578
|
|
|
7558
|
-
var doNotForwardProps$
|
|
7579
|
+
var doNotForwardProps$3 = [
|
|
7559
7580
|
"sdsStyle",
|
|
7560
7581
|
"selected",
|
|
7561
7582
|
"onPageChange",
|
|
@@ -7568,14 +7589,14 @@ var doNotForwardProps$2 = [
|
|
|
7568
7589
|
"pageSize",
|
|
7569
7590
|
"truncateDropdown",
|
|
7570
7591
|
];
|
|
7571
|
-
var StyledPaginationButton = styled(Button)(templateObject_1$
|
|
7592
|
+
var StyledPaginationButton = styled(Button)(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7572
7593
|
var _a, _b, _c;
|
|
7573
7594
|
var semanticColors = getSemanticColors(props);
|
|
7574
7595
|
return "\n width: 32px;\n height: 32px;\n cursor: \"pointer\";\n\n & .MuiSvgIcon-root {\n width: 10px;\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.iconPrimary, "\n }\n\n &:hover {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n\n & .MuiSvgIcon-root {\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.iconPrimaryHover, "\n }\n }\n ");
|
|
7575
7596
|
});
|
|
7576
7597
|
var StyledPaginationChevronList = styled("li", {
|
|
7577
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7578
|
-
})(templateObject_2$
|
|
7598
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$3.includes(prop); },
|
|
7599
|
+
})(templateObject_2$5 || (templateObject_2$5 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7579
7600
|
var _a, _b, _c, _d, _e;
|
|
7580
7601
|
var disabled = props.disabled;
|
|
7581
7602
|
var spaces = getSpaces(props);
|
|
@@ -7583,16 +7604,16 @@ var StyledPaginationChevronList = styled("li", {
|
|
|
7583
7604
|
return "\n width: 32px;\n height: 32px;\n cursor: ".concat(disabled ? "auto" : "pointer", ";\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: 32px;\n\n &[data-order=\"first\"] {\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n }\n\n &[data-order=\"last\"] {\n margin-left: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n }\n\n & .MuiSvgIcon-root {\n color: ").concat(disabled ? (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.iconDisabled : (_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.iconPrimary, ";\n }\n\n &:hover {\n background-color: ").concat(disabled ? "transparent" : (_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillHover, ";\n\n & .MuiSvgIcon-root {\n color: ").concat(disabled ? (_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.iconDisabled : (_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.iconPrimaryHover, "\n }\n }\n\n ").concat(focusVisibleA11yStyle(props), "\n ");
|
|
7584
7605
|
});
|
|
7585
7606
|
var StyledPagination = styled("ul", {
|
|
7586
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7587
|
-
})(templateObject_3$
|
|
7607
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$3.includes(prop); },
|
|
7608
|
+
})(templateObject_3$3 || (templateObject_3$3 = __makeTemplateObject(["\n ", "\n display: flex;\n flex-wrap: wrap;\n padding: 0;\n margin: 0;\n & li {\n list-style: none;\n }\n"], ["\n ", "\n display: flex;\n flex-wrap: wrap;\n padding: 0;\n margin: 0;\n & li {\n list-style: none;\n }\n"])), fontBodyS$1);
|
|
7588
7609
|
var selectedPageStyle = function (props) {
|
|
7589
7610
|
var _a, _b, _c, _d;
|
|
7590
7611
|
var semanticColors = getSemanticColors(props);
|
|
7591
7612
|
return "\n background-color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.fillSelected, ";\n color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.textPrimaryInverse, ";\n\n &:hover {\n background-color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.fillSelected, ";\n color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.textPrimaryInverse, ";\n }\n ");
|
|
7592
7613
|
};
|
|
7593
7614
|
var Page = styled("li", {
|
|
7594
|
-
shouldForwardProp: function (prop) { return !doNotForwardProps$
|
|
7595
|
-
})(templateObject_4$
|
|
7615
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$3.includes(prop); },
|
|
7616
|
+
})(templateObject_4$2 || (templateObject_4$2 = __makeTemplateObject(["\n ", "\n\n ", "\n"], ["\n ", "\n\n ", "\n"])), fontBodySemiboldS, function (props) {
|
|
7596
7617
|
var _a, _b, _c;
|
|
7597
7618
|
var selected = props.selected, sdsStyle = props.sdsStyle;
|
|
7598
7619
|
var spaces = getSpaces(props);
|
|
@@ -7600,10 +7621,10 @@ var Page = styled("li", {
|
|
|
7600
7621
|
var semanticColors = getSemanticColors(props);
|
|
7601
7622
|
return "\n color: ".concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.textSecondary, ";\n cursor: pointer;\n list-style: none;\n width: 32px;\n height: 32px;\n margin-right: ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n display: flex;\n justify-content: center;\n align-items: center;\n border-radius: ").concat(sdsStyle === "round" ? corners === null || corners === void 0 ? void 0 : corners.l : corners === null || corners === void 0 ? void 0 : corners.m, "px;\n user-select: none;\n &:hover {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillHover, ";\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _c === void 0 ? void 0 : _c.textPrimary, ";\n }\n\n &:nth-last-of-type(-n+2) {\n margin-right: 0;\n }\n\n ").concat(selected && selectedPageStyle(props), ";\n ").concat(focusVisibleA11yStyle(props), "\n ");
|
|
7602
7623
|
});
|
|
7603
|
-
var templateObject_1$
|
|
7624
|
+
var templateObject_1$d, templateObject_2$5, templateObject_3$3, templateObject_4$2;
|
|
7604
7625
|
|
|
7605
|
-
var StyledPaginationDropdownMenu = styled(Menu)(templateObject_1$
|
|
7606
|
-
var templateObject_1$
|
|
7626
|
+
var StyledPaginationDropdownMenu = styled(Menu)(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n & .MuiPaper-root {\n max-height: 120px;\n }\n"], ["\n & .MuiPaper-root {\n max-height: 120px;\n }\n"])));
|
|
7627
|
+
var templateObject_1$c;
|
|
7607
7628
|
|
|
7608
7629
|
var PageListDropdown = function (props) {
|
|
7609
7630
|
var pageList = props.pageList, onPageChange = props.onPageChange, sdsStyle = props.sdsStyle;
|
|
@@ -7723,40 +7744,141 @@ var Pagination = forwardRef(function (props, ref) {
|
|
|
7723
7744
|
}
|
|
7724
7745
|
});
|
|
7725
7746
|
|
|
7747
|
+
var doNotForwardProps$2 = [
|
|
7748
|
+
"sdsType",
|
|
7749
|
+
"position",
|
|
7750
|
+
"width",
|
|
7751
|
+
"headerComponent",
|
|
7752
|
+
"onClick",
|
|
7753
|
+
"disableScrollLock",
|
|
7754
|
+
"closeButtonOnClick",
|
|
7755
|
+
"CloseButtonComponent",
|
|
7756
|
+
];
|
|
7757
|
+
var basicPanelStyles = function (props) {
|
|
7758
|
+
var _a;
|
|
7759
|
+
var semanticColors = getSemanticColors(props);
|
|
7760
|
+
var spaces = getSpaces(props);
|
|
7761
|
+
return css(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n .", " {\n background-color: ", ";\n padding: ", "px;\n min-width: ", "px;\n min-height: ", "px;\n }\n "], ["\n .", " {\n background-color: ", ";\n padding: ", "px;\n min-width: ", "px;\n min-height: ", "px;\n }\n "])), drawerClasses.paper, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, spaces === null || spaces === void 0 ? void 0 : spaces.l, PANEL_BASIC_MIN_WIDTH_PX, PANEL_BASIC_MIN_WIDTH_PX);
|
|
7762
|
+
};
|
|
7763
|
+
var overlayPanelStyles = function (props) {
|
|
7764
|
+
var _a;
|
|
7765
|
+
var semanticColors = getSemanticColors(props);
|
|
7766
|
+
var spaces = getSpaces(props);
|
|
7767
|
+
var shadows = getShadows(props);
|
|
7768
|
+
return css(templateObject_2$4 || (templateObject_2$4 = __makeTemplateObject(["\n .", " {\n background-color: ", ";\n padding: ", "px;\n min-width: ", "px;\n min-height: ", "px;\n box-shadow: ", ";\n background-image: none;\n }\n "], ["\n .", " {\n background-color: ", ";\n padding: ", "px;\n min-width: ", "px;\n min-height: ", "px;\n box-shadow: ", ";\n background-image: none;\n }\n "])), drawerClasses.paper, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.surfacePrimary, spaces === null || spaces === void 0 ? void 0 : spaces.xl, PANEL_OVERLAY_MIN_WIDTH_PX, PANEL_OVERLAY_MIN_WIDTH_PX, shadows === null || shadows === void 0 ? void 0 : shadows.l);
|
|
7769
|
+
};
|
|
7770
|
+
var StyledDrawer = styled(Drawer, {
|
|
7771
|
+
shouldForwardProp: function (prop) { return !doNotForwardProps$2.includes(prop); },
|
|
7772
|
+
})(templateObject_4$1 || (templateObject_4$1 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7773
|
+
var _a;
|
|
7774
|
+
var _b = props.sdsType, sdsType = _b === void 0 ? "basic" : _b, _c = props.anchor, anchor = _c === void 0 ? "left" : _c, width = props.width;
|
|
7775
|
+
var semanticColors = getSemanticColors(props);
|
|
7776
|
+
var spaces = getSpaces(props);
|
|
7777
|
+
var widthString = typeof width === "number" ? "".concat(width, "px") : width;
|
|
7778
|
+
var panelWidth = anchor !== "bottom" ? widthString : "100%";
|
|
7779
|
+
var panelHeight = anchor !== "bottom" ? "100%" : widthString;
|
|
7780
|
+
return css(templateObject_3$2 || (templateObject_3$2 = __makeTemplateObject(["\n .", " {\n border-color: ", ";\n border-width: ", "px;\n height: ", ";\n width: ", ";\n }\n\n .", " {\n height: ", ";\n width: ", ";\n }\n\n ", "\n ", "\n "], ["\n .", " {\n border-color: ", ";\n border-width: ", "px;\n height: ", ";\n width: ", ";\n }\n\n .", " {\n height: ", ";\n width: ", ";\n }\n\n ", "\n ", "\n "])), drawerClasses.root, (_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.divider, spaces === null || spaces === void 0 ? void 0 : spaces.xxxs, panelHeight, panelWidth, drawerClasses.paper, panelHeight, panelWidth, sdsType === "basic" && basicPanelStyles(props), sdsType === "overlay" && overlayPanelStyles(props));
|
|
7781
|
+
});
|
|
7782
|
+
var StyledHeaderComponent = styled("div")(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7783
|
+
var spaces = getSpaces(props);
|
|
7784
|
+
return css(templateObject_5$1 || (templateObject_5$1 = __makeTemplateObject(["\n margin-bottom: ", "px;\n display: flex;\n justify-content: space-between;\n align-items: start;\n "], ["\n margin-bottom: ", "px;\n display: flex;\n justify-content: space-between;\n align-items: start;\n "])), spaces === null || spaces === void 0 ? void 0 : spaces.xxl);
|
|
7785
|
+
});
|
|
7786
|
+
var templateObject_1$b, templateObject_2$4, templateObject_3$2, templateObject_4$1, templateObject_5$1, templateObject_6;
|
|
7787
|
+
|
|
7788
|
+
var StyledPanelHeader = styled("div")(templateObject_1$a || (templateObject_1$a = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7789
|
+
var spaces = getSpaces(props);
|
|
7790
|
+
return "\n width: 100%;\n height: 100%;\n margin-right: ".concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n ");
|
|
7791
|
+
});
|
|
7792
|
+
var templateObject_1$a;
|
|
7793
|
+
|
|
7794
|
+
var PanelHeader = function (props) {
|
|
7795
|
+
var children = props.children;
|
|
7796
|
+
return jsx(StyledPanelHeader, { children: children });
|
|
7797
|
+
};
|
|
7798
|
+
|
|
7799
|
+
var StyledPanelHeaderClose = styled("div")(templateObject_1$9 || (templateObject_1$9 = __makeTemplateObject(["\n display: flex;\n justify-content: end;\n align-items: center;\n"], ["\n display: flex;\n justify-content: end;\n align-items: center;\n"])));
|
|
7800
|
+
var templateObject_1$9;
|
|
7801
|
+
|
|
7802
|
+
var PanelHeaderClose = function (props) {
|
|
7803
|
+
var onClick = props.onClick, CloseButtonComponent = props.CloseButtonComponent;
|
|
7804
|
+
return (jsx(StyledPanelHeaderClose, { onClick: onClick, children: CloseButtonComponent ? (CloseButtonComponent) : (jsx(Button, { sdsStyle: "icon", sdsType: "tertiary", icon: "XMark", "aria-label": "Panel Toggle" })) }));
|
|
7805
|
+
};
|
|
7806
|
+
|
|
7807
|
+
// Type guard to narrow the type
|
|
7808
|
+
function isOverlayPanelProps(props) {
|
|
7809
|
+
return props.sdsType === "overlay";
|
|
7810
|
+
}
|
|
7811
|
+
var PANEL_BASIC_MIN_WIDTH_PX = 240;
|
|
7812
|
+
var PANEL_OVERLAY_MIN_WIDTH_PX = 320;
|
|
7813
|
+
/**
|
|
7814
|
+
* @see https://mui.com/material-ui/react-drawer/
|
|
7815
|
+
*/
|
|
7816
|
+
var Panel = React__default.forwardRef(function (props, ref) {
|
|
7817
|
+
var children = props.children, _a = props.sdsType, sdsType = _a === void 0 ? "basic" : _a, _b = props.position, position = _b === void 0 ? "left" : _b, width = props.width;
|
|
7818
|
+
var drawerWidth = width
|
|
7819
|
+
? width
|
|
7820
|
+
: sdsType === "basic"
|
|
7821
|
+
? PANEL_BASIC_MIN_WIDTH_PX
|
|
7822
|
+
: PANEL_OVERLAY_MIN_WIDTH_PX;
|
|
7823
|
+
var drawerVariant = sdsType === "basic" ? "persistent" : "temporary";
|
|
7824
|
+
// (masoudmanson): The basic Panel only supports "left" or "right" positions.
|
|
7825
|
+
// If a "bottom" position is provided for a basic Panel, it defaults to "left".
|
|
7826
|
+
var drawerAnchor = sdsType === "overlay"
|
|
7827
|
+
? position
|
|
7828
|
+
: position === "bottom"
|
|
7829
|
+
? "left"
|
|
7830
|
+
: position;
|
|
7831
|
+
return (
|
|
7832
|
+
/**
|
|
7833
|
+
* (masoudmanson): We need the props after {...props} to override any
|
|
7834
|
+
* user-defined values. Placing them afterward ensures that our values
|
|
7835
|
+
* take priority.
|
|
7836
|
+
*
|
|
7837
|
+
* For example, the SDS design specifies that a BasicPanel should only be anchored
|
|
7838
|
+
* to the left or right. To prevent users from positioning it at the bottom,
|
|
7839
|
+
* the 'anchor' prop must always be set to our predefined value.
|
|
7840
|
+
*/
|
|
7841
|
+
jsxs(StyledDrawer, __assign({}, props, { ref: ref, anchor: drawerAnchor, variant: drawerVariant, width: drawerWidth, children: [isOverlayPanelProps(props) && (jsxs(StyledHeaderComponent, { children: [(props === null || props === void 0 ? void 0 : props.HeaderComponent) && (jsx(PanelHeader, { children: props === null || props === void 0 ? void 0 : props.HeaderComponent })), jsx(PanelHeaderClose, { onClick: props === null || props === void 0 ? void 0 : props.closeButtonOnClick, CloseButtonComponent: props === null || props === void 0 ? void 0 : props.CloseButtonComponent })] })), children] })));
|
|
7842
|
+
});
|
|
7843
|
+
|
|
7726
7844
|
var doNotForwardProps$1 = ["buttonDefinition"];
|
|
7727
7845
|
var StyledSegmentedControl = styled(ToggleButtonGroup, {
|
|
7728
7846
|
shouldForwardProp: function (prop) { return !doNotForwardProps$1.includes(prop); },
|
|
7729
7847
|
})(templateObject_1$8 || (templateObject_1$8 = __makeTemplateObject(["\n ", "\n"], ["\n ", "\n"])), function (props) {
|
|
7730
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
|
|
7848
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
|
|
7731
7849
|
var spaces = getSpaces(props);
|
|
7732
7850
|
var semanticColors = getSemanticColors(props);
|
|
7733
|
-
return "\n .".concat(toggleButtonClasses.root, ".").concat(toggleButtonClasses.
|
|
7851
|
+
return "\n .".concat(toggleButtonClasses.root, ".").concat(toggleButtonClasses.disabled, " {\n border-color: ").concat((_a = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _a === void 0 ? void 0 : _a.border, ";\n }\n\n .").concat(toggleButtonClasses.root, ".").concat(toggleButtonClasses.selected, " {\n background-color: ").concat((_b = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _b === void 0 ? void 0 : _b.fillOpen, ";\n color: ").concat((_c = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.accent) === null || _c === void 0 ? void 0 : _c.iconSelected, ";\n border-color: ").concat((_d = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _d === void 0 ? void 0 : _d.border, ";\n\n &:hover {\n background-color: ").concat((_e = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _e === void 0 ? void 0 : _e.fillHover, ";\n }\n }\n\n .").concat(toggleButtonClasses.root, " {\n ").concat(focusVisibleA11yStyle(props), "\n background-color: ").concat((_f = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _f === void 0 ? void 0 : _f.fillPrimary, ";\n border-color: ").concat((_g = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _g === void 0 ? void 0 : _g.border, ";\n line-height: 0px;\n color: ").concat((_h = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _h === void 0 ? void 0 : _h.iconSecondary, ";\n padding: ").concat(((_j = spaces === null || spaces === void 0 ? void 0 : spaces.xs) !== null && _j !== void 0 ? _j : 6) - 1, "px ").concat(spaces === null || spaces === void 0 ? void 0 : spaces.l, "px;\n\n &:hover {\n border-color: ").concat((_k = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _k === void 0 ? void 0 : _k.border, ";\n background-color: ").concat((_l = semanticColors === null || semanticColors === void 0 ? void 0 : semanticColors.base) === null || _l === void 0 ? void 0 : _l.fillHover, ";\n }\n }\n ");
|
|
7734
7852
|
});
|
|
7735
7853
|
var templateObject_1$8;
|
|
7736
7854
|
|
|
7855
|
+
/**
|
|
7856
|
+
* @see https://mui.com/material-ui/react-toggle-button/
|
|
7857
|
+
*/
|
|
7737
7858
|
var SegmentedControl = function (props) {
|
|
7738
7859
|
var _a;
|
|
7739
|
-
var buttonDefinition = props.buttonDefinition;
|
|
7740
|
-
var
|
|
7741
|
-
var _b = React__default.useState(
|
|
7860
|
+
var buttonDefinition = props.buttonDefinition, valueProp = props.value, onChangeProp = props.onChange, restProps = __rest(props, ["buttonDefinition", "value", "onChange"]);
|
|
7861
|
+
var initialValue = ((_a = buttonDefinition.find(function (button) { return !button.disabled; })) === null || _a === void 0 ? void 0 : _a.value) || null;
|
|
7862
|
+
var _b = React__default.useState(initialValue), active = _b[0], setActive = _b[1];
|
|
7863
|
+
// (masoudmanson): Add Controlled/Uncontrolled Component pattern
|
|
7864
|
+
var isControlled = valueProp !== undefined;
|
|
7865
|
+
var value = isControlled ? valueProp : active;
|
|
7742
7866
|
var handleActive = function (event, newActive) {
|
|
7743
7867
|
if (newActive !== null) {
|
|
7744
|
-
|
|
7868
|
+
if (!isControlled) {
|
|
7869
|
+
setActive(newActive);
|
|
7870
|
+
}
|
|
7871
|
+
if (onChangeProp) {
|
|
7872
|
+
onChangeProp(event, newActive);
|
|
7873
|
+
}
|
|
7745
7874
|
}
|
|
7746
7875
|
};
|
|
7747
|
-
return (jsxs(StyledSegmentedControl, __assign({ "aria-label": "Segmented Control", size: "small", value:
|
|
7748
|
-
var icon = button.icon, tooltipText = button.tooltipText, value = button.
|
|
7749
|
-
var iconItem =
|
|
7750
|
-
|
|
7751
|
-
|
|
7752
|
-
|
|
7753
|
-
}
|
|
7754
|
-
else {
|
|
7755
|
-
return jsx(Icon, { sdsIcon: icon, sdsSize: "s", sdsType: "button" });
|
|
7756
|
-
}
|
|
7757
|
-
}
|
|
7758
|
-
};
|
|
7759
|
-
return (jsx(Tooltip, { title: tooltipText !== null && tooltipText !== void 0 ? tooltipText : value, sdsStyle: "dark", arrow: true, children: jsx(ToggleButton, { "aria-label": tooltipText, value: value, children: jsx("span", { tabIndex: -1, children: iconItem() }) }) }, value));
|
|
7876
|
+
return (jsxs(StyledSegmentedControl, __assign({ "aria-label": "Segmented Control", size: "small", value: value, exclusive: true, onChange: handleActive }, restProps, { children: [buttonDefinition.map(function (button) {
|
|
7877
|
+
var icon = button.icon, tooltipText = button.tooltipText, buttonValue = button.value, _a = button.disabled, disabled = _a === void 0 ? false : _a;
|
|
7878
|
+
var iconItem = icon ? (typeof icon !== "string" ? (icon) : (jsx(Icon, { sdsIcon: icon, sdsSize: "s", sdsType: "button" }))) : null;
|
|
7879
|
+
var toggleButton = (jsx(ToggleButton, { "aria-label": tooltipText !== null && tooltipText !== void 0 ? tooltipText : buttonValue, value: buttonValue, disabled: disabled, children: jsx("span", { tabIndex: -1, children: iconItem }) }, buttonValue));
|
|
7880
|
+
// (masoudmanson): If the button is disabled, we don't want to show the tooltip.
|
|
7881
|
+
return disabled ? (toggleButton) : (jsx(Tooltip, { title: tooltipText !== null && tooltipText !== void 0 ? tooltipText : buttonValue, sdsStyle: "dark", arrow: true, children: toggleButton }, buttonValue));
|
|
7760
7882
|
}), ";"] })));
|
|
7761
7883
|
};
|
|
7762
7884
|
|
|
@@ -8014,4 +8136,4 @@ var TooltipTableContent = function (props) {
|
|
|
8014
8136
|
return (jsxs(TableContainer, __assign({}, rest, { children: [contentAlert && jsx(Alert, { children: contentAlert }), data === null || data === void 0 ? void 0 : data.map(function (section, index) { return (jsxs(Section, { disabled: section.disabled, children: [jsx(SectionLabel, { disabled: section.disabled, label: section.label, children: section.label }), jsx(Table$1, { size: "small", children: jsx(TableBody, { children: section.dataRows.map(function (row, rowIndex) { return (jsxs(TableRow$1, { children: [jsx(RowLabel, { disabled: section.disabled, align: "left", children: row.label }), jsx(RowValue, { disabled: section.disabled, align: itemAlign, children: row.value })] }, row.label + String(rowIndex))); }) }) })] }, "".concat(section.label + String(index)))); })] })));
|
|
8015
8137
|
};
|
|
8016
8138
|
|
|
8017
|
-
export { Accordion, AccordionDetails, AccordionHeader, Alert$1 as Alert, Autocomplete, StyledPopper$2 as AutocompleteMultiColumnStyledPopper, StyledPaper$3 as AutocompleteSingleColumnStyledPaper, Banner, Button, ButtonDropdown, ButtonIcon, Callout, CalloutTitle, CellBasic, CellComponent, CellHeader, Chip, ComplexFilter, InputDropdown as ComplexFilterInputDropdown, StyledPopper as ComplexFilterPopper, Dialog, DialogActions, index as DialogContent, DialogContext, DialogPaper, DialogTitle, Overline as DialogTitleOverline, Subtitle as DialogTitleSubtitle, Title as DialogTitleTitle, Dropdown, InputDropdown as DropdownInputDropdown, DropdownMenu, StyledPaper$1 as DropdownPaper, StyledPopper as DropdownPopper, Icon, InputCheckbox, InputDropdown, InputRadio, InputSearch, InputSlider, InputText, InputToggle, Link, List, ListItem, ListItemLabel, ListSubheader, LoadingIndicator, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, Menu, MenuItem, MenuSelect, NavigationJumpTo, Notification, Pagination, SDSChooseTheme, SDSDarkAppTheme, SDSLightAppTheme, SegmentedControl, Tab, Table, TableHeader, TableRow, Tabs, Tag, TagFilter, Theme, Tooltip, TooltipCondensed, TooltipTableContent as TooltipTable, defaultAppTheme, defaultTheme, focusVisibleA11yStyle, fontBody, fontBodyL$1 as fontBodyL, fontBodyM$1 as fontBodyM, fontBodyS$1 as fontBodyS, fontBodySemiboldL, fontBodySemiboldM, fontBodySemiboldS, fontBodySemiboldXs, fontBodySemiboldXxs, fontBodySemiboldXxxs, fontBodyXs$2 as fontBodyXs, fontBodyXxs$1 as fontBodyXxs, fontBodyXxxs$1 as fontBodyXxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontCode, fontCodeS, fontCodeSemiboldS, fontCodeSemiboldXs, fontCodeXs, fontHeader, fontHeaderL, fontHeaderM$1 as fontHeaderM, fontHeaderS, fontHeaderXl, fontHeaderXs, fontHeaderXxl, fontHeaderXxs, fontHeaderXxxs, fontTabular, fontTabularS, fontTabularSemiboldS, fontTabularSemiboldXs, fontTabularXs, getBorders, getColors, getCorners, getFontWeights, getIconSizes, getMode, getPalette, getSemanticColors, getShadows, getSpaces, getSpacings, getTypography, makeThemeOptions };
|
|
8139
|
+
export { Accordion, AccordionDetails, AccordionHeader, Alert$1 as Alert, Autocomplete, StyledPopper$2 as AutocompleteMultiColumnStyledPopper, StyledPaper$3 as AutocompleteSingleColumnStyledPaper, Banner, Button, ButtonDropdown, ButtonIcon, Callout, CalloutTitle, CellBasic, CellComponent, CellHeader, Chip, ComplexFilter, InputDropdown as ComplexFilterInputDropdown, StyledPopper as ComplexFilterPopper, Dialog, DialogActions, index as DialogContent, DialogContext, DialogPaper, DialogTitle, Overline as DialogTitleOverline, Subtitle as DialogTitleSubtitle, Title as DialogTitleTitle, Dropdown, InputDropdown as DropdownInputDropdown, DropdownMenu, StyledPaper$1 as DropdownPaper, StyledPopper as DropdownPopper, Icon, InputCheckbox, InputDropdown, InputRadio, InputSearch, InputSlider, InputText, InputToggle, Link, List, ListItem, ListItemLabel, ListSubheader, LoadingIndicator, MINIMUM_DROPDOWN_MENU_POPPER_WIDTH, Menu, MenuItem, MenuSelect, NavigationJumpTo, Notification, PANEL_BASIC_MIN_WIDTH_PX, PANEL_OVERLAY_MIN_WIDTH_PX, Pagination, Panel, SDSChooseTheme, SDSDarkAppTheme, SDSLightAppTheme, SegmentedControl, Tab, Table, TableHeader, TableRow, Tabs, Tag, TagFilter, Theme, Tooltip, TooltipCondensed, TooltipTableContent as TooltipTable, defaultAppTheme, defaultTheme, focusVisibleA11yStyle, fontBody, fontBodyL$1 as fontBodyL, fontBodyM$1 as fontBodyM, fontBodyS$1 as fontBodyS, fontBodySemiboldL, fontBodySemiboldM, fontBodySemiboldS, fontBodySemiboldXs, fontBodySemiboldXxs, fontBodySemiboldXxxs, fontBodyXs$2 as fontBodyXs, fontBodyXxs$1 as fontBodyXxs, fontBodyXxxs$1 as fontBodyXxxs, fontCaps, fontCapsXxs, fontCapsXxxs, fontCapsXxxxs, fontCode, fontCodeS, fontCodeSemiboldS, fontCodeSemiboldXs, fontCodeXs, fontHeader, fontHeaderL, fontHeaderM$1 as fontHeaderM, fontHeaderS, fontHeaderXl, fontHeaderXs, fontHeaderXxl, fontHeaderXxs, fontHeaderXxxs, fontTabular, fontTabularS, fontTabularSemiboldS, fontTabularSemiboldXs, fontTabularXs, getBorders, getColors, getCorners, getFontWeights, getIconSizes, getMode, getPalette, getSemanticColors, getShadows, getSpaces, getSpacings, getTypography, makeThemeOptions };
|