@galaxy-ds/core 2.1.6 → 2.1.8

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.js CHANGED
@@ -877,7 +877,7 @@ var autocompleteOverrides$1 = {
877
877
  marginBottom: 0,
878
878
  },
879
879
  '& .MuiAutocomplete-input:first-of-type.MuiInputBase-input': {
880
- padding: '0 4px',
880
+ padding: '0 8px',
881
881
  },
882
882
  },
883
883
  inputRoot: {
@@ -1197,6 +1197,23 @@ var dropdownOverrides$1 = {
1197
1197
  fontSize: 12,
1198
1198
  display: 'none',
1199
1199
  },
1200
+ root: function () { return ({
1201
+ '&.MuiInputBase-adornedStart': {
1202
+ '.MuiSvgIcon-root': {
1203
+ fontSize: 16,
1204
+ left: 8,
1205
+ position: 'absolute',
1206
+ margin: 0,
1207
+ },
1208
+ },
1209
+ '&.customSelectInputBackground': {
1210
+ select: {
1211
+ '&.MuiOutlinedInput-input': {
1212
+ padding: 0,
1213
+ },
1214
+ },
1215
+ },
1216
+ }); },
1200
1217
  select: function (_a) {
1201
1218
  var theme = _a.theme;
1202
1219
  return (__assign(__assign({}, theme.typography.body1), { lineHeight: '1.375rem', background: "url(\"data:image/svg+xml,%3Csvg width='12' height='12' viewBox='0 0 12 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fillRule='evenodd' clipRule='evenodd' d='M9.0625 3.66666L9.9375 4.54166L6 8.47916L2.0625 4.54166L2.9375 3.66666L6 6.72916L9.0625 3.66666Z' fill='%23444444'/%3E%3C/svg%3E\") center right 3px no-repeat", cursor: 'default', '&.MuiInputBase-input': {
@@ -1206,12 +1223,16 @@ var dropdownOverrides$1 = {
1206
1223
  }, '.customLargeSize &': {
1207
1224
  height: 30,
1208
1225
  lineHeight: '30px',
1226
+ }, '&.MuiOutlinedInput-input': {
1227
+ zIndex: '1001',
1228
+ paddingLeft: 8,
1229
+ }, '&.MuiInputBase-inputAdornedStart.MuiOutlinedInput-input': {
1230
+ padding: '0 24px 0 32px',
1231
+ zIndex: '1001',
1209
1232
  }, '& .customSelectInputBackground': {
1210
1233
  borderColor: theme.palette.grey[500],
1211
1234
  cursor: 'default',
1212
1235
  '&:hover': {
1213
- // backgroundColor: pallettes.brand.background.accent.lighter,
1214
- // borderColor: pallettes.brand.utility.accent.dark,
1215
1236
  cursor: 'default',
1216
1237
  },
1217
1238
  } }));
@@ -1347,17 +1368,16 @@ var inputBaseOverrides$1 = {
1347
1368
  },
1348
1369
  },
1349
1370
  '&.customSelectInputBackground.MuiInputBase-adornedStart > .MuiSvgIcon-root': {
1350
- position: 'absolute',
1351
1371
  fontSize: 16,
1352
1372
  },
1353
1373
  '&.customSelectInputBackground .MuiInputBase-inputAdornedStart': {
1354
- paddingLeft: 24,
1374
+ paddingLeft: 12,
1355
1375
  },
1356
1376
  });
1357
1377
  },
1358
1378
  adornedStart: {
1359
1379
  '& svg:first-of-type': {
1360
- marginLeft: 3,
1380
+ marginLeft: 12,
1361
1381
  },
1362
1382
  },
1363
1383
  input: {
@@ -1480,8 +1500,8 @@ var listSubheaderOverrides$1 = {
1480
1500
  }, '&.MuiListSubheader-gutters': {
1481
1501
  paddingTop: 0,
1482
1502
  paddingBottom: 0,
1483
- paddingLeft: 2,
1484
- paddingRight: 2,
1503
+ paddingLeft: 8,
1504
+ paddingRight: 8,
1485
1505
  } }));
1486
1506
  },
1487
1507
  },
@@ -1546,7 +1566,7 @@ var menuItemOverrides$1 = {
1546
1566
  var _b;
1547
1567
  var theme = _a.theme;
1548
1568
  return ({
1549
- '&.MuiMenuItem-root': __assign(__assign({}, theme.typography.body1), (_b = { lineHeight: '1.25rem', padding: 4, paddingTop: 0, paddingBottom: 0, backgroundColor: theme.palette.grey[50], transition: 'none' }, _b[theme.breakpoints.down('sm')] = {
1569
+ '&.MuiMenuItem-root': __assign(__assign({}, theme.typography.body1), (_b = { lineHeight: '1.25rem', paddingLeft: 8, paddingTop: 0, paddingBottom: 0, backgroundColor: theme.palette.grey[50], transition: 'none' }, _b[theme.breakpoints.down('sm')] = {
1550
1570
  minHeight: 40,
1551
1571
  }, _b['@media (hover: none)'] = {
1552
1572
  minHeight: 40,
@@ -1572,7 +1592,7 @@ var menuItemOverrides$1 = {
1572
1592
  lineHeight: '1.25rem',
1573
1593
  },
1574
1594
  }, _b['& .MuiFormControlLabel-root'] = {
1575
- marginRight: 6,
1595
+ marginRight: 4,
1576
1596
  }, _b['&.gds-drawer-menu-item-dark'] = {
1577
1597
  backgroundColor: theme.palette.primary.main,
1578
1598
  color: theme.palette.grey[200],
@@ -2771,10 +2791,17 @@ var dropdownOverrides = {
2771
2791
  '.MuiSvgIcon-root': {
2772
2792
  fontSize: 16,
2773
2793
  left: 16,
2774
- position: 'relative',
2794
+ position: 'absolute',
2775
2795
  margin: 0,
2776
2796
  },
2777
2797
  },
2798
+ '&.customSelectInputBackground': {
2799
+ select: {
2800
+ '&.MuiOutlinedInput-input': {
2801
+ padding: 0,
2802
+ },
2803
+ },
2804
+ },
2778
2805
  '&:hover': {
2779
2806
  backgroundColor: theme.palette.primary.transparent,
2780
2807
  borderColor: theme.palette.primary.main,
@@ -2822,7 +2849,11 @@ var dropdownOverrides = {
2822
2849
  fontWeight: 600,
2823
2850
  letterSpacing: '.02em',
2824
2851
  '&.MuiOutlinedInput-input': {
2825
- padding: '8px 32px 8px 16px',
2852
+ zIndex: '1001',
2853
+ },
2854
+ '&.MuiInputBase-inputAdornedStart.MuiOutlinedInput-input': {
2855
+ padding: '8px 36px 8px 46px',
2856
+ zIndex: '1001',
2826
2857
  },
2827
2858
  },
2828
2859
  },
@@ -18718,12 +18749,13 @@ var StyledFormHelperText = styles$1.styled(FormHelperText)(function (_a) {
18718
18749
  });
18719
18750
 
18720
18751
  var Input = React.forwardRef(function Input(props, ref) {
18721
- var _a = props.error, error = _a === void 0 ? false : _a, helperText = props.helperText, _b = props.textAlignRight, textAlignRight = _b === void 0 ? false : _b, label = props.label, _c = props.size, size = _c === void 0 ? 'medium' : _c, _d = props.background, background = _d === void 0 ? 'default' : _d, className = props.className, inputPropStyles = props.inputPropStyles, rest = __rest(props, ["error", "helperText", "textAlignRight", "label", "size", "background", "className", "inputPropStyles"]);
18752
+ var _a = props.error, error = _a === void 0 ? false : _a, helperText = props.helperText, _b = props.textAlignRight, textAlignRight = _b === void 0 ? false : _b, label = props.label, _c = props.size, size = _c === void 0 ? 'medium' : _c, _d = props.background, background = _d === void 0 ? 'default' : _d, className = props.className, inputPropStyles = props.inputPropStyles, minRows = props.minRows, maxRows = props.maxRows, rows = props.rows, rest = __rest(props, ["error", "helperText", "textAlignRight", "label", "size", "background", "className", "inputPropStyles", "minRows", "maxRows", "rows"]);
18722
18753
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [label && jsxRuntime.jsx(FormLabelBlock, { children: label }), jsxRuntime.jsx(StyledInputBase, __assign({ ref: ref, error: error, textAlignRight: textAlignRight, className: clsx(size === 'large' && 'customLargeSize', background === 'light' && 'customLightColor', className), inputProps: {
18723
18754
  style: __assign({
18724
- // EDGECASE: When we use multiline and set minRows, maxRows, rows we need to define the width of the input. By default we set this to 162.
18725
- width: inputPropStyles ? inputPropStyles.width : 162 }, inputPropStyles),
18726
- } }, rest)), helperText && (jsxRuntime.jsx(StyledFormHelperText, { error: error, children: helperText }))] }));
18755
+ // EDGECASE: When we use multiline and set minRows, maxRows, rows we need to define the width of the input. 100% here will inherit parent container.
18756
+ // If there's no container we need to define the width. Otherwise the input will fluctate in size on keydown when rows param exist.
18757
+ width: inputPropStyles ? inputPropStyles.width : '100%' }, inputPropStyles),
18758
+ }, rows: rows, minRows: minRows, maxRows: maxRows }, rest)), helperText && (jsxRuntime.jsx(StyledFormHelperText, { error: error, children: helperText }))] }));
18727
18759
  });
18728
18760
 
18729
18761
  var ListItemAvatar = function (props) {