@superdispatch/ui 0.37.1 → 0.38.1

package/dist-node/index.js

@@ -955,7 +955,7 @@ var CardButton = /*#__PURE__*/React.forwardRef((_ref, ref) => {
 });
 if (process.env.NODE_ENV !== "production") CardButton.displayName = "CardButton";
 
-var _excluded$5 = ["label", "error", "checked", "onBlur", "onChange", "helperText", "FormControlLabelProps"];
+var _excluded$5 = ["label", "error", "checked", "onBlur", "onChange", "helperText", "FormControlProps", "FormControlLabelProps"];
 var FormControl = /*#__PURE__*/styled__default(core.FormControl).withConfig({
   displayName: "CheckboxField__FormControl",
   componentId: "SD__sc-1wxu0g6-0"
@@ -972,11 +972,13 @@ var CheckboxField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       onBlur,
       onChange,
       helperText,
+      FormControlProps: formControlProps,
       FormControlLabelProps: formControlLabelProps
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded$5);
-  return /*#__PURE__*/jsxRuntime.jsxs(FormControl, {
-    error: error,
+  return /*#__PURE__*/jsxRuntime.jsxs(FormControl, _objectSpread(_objectSpread({
+    error: error
+  }, formControlProps), {}, {
     children: [/*#__PURE__*/jsxRuntime.jsx(core.FormControlLabel, _objectSpread(_objectSpread({}, formControlLabelProps), {}, {
       label: label,
       checked: checked,
@@ -989,7 +991,7 @@ var CheckboxField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     })), helperText && /*#__PURE__*/jsxRuntime.jsx(FormHelperText, {
       children: helperText
     })]
-  });
+  }));
 });
 if (process.env.NODE_ENV !== "production") CheckboxField.displayName = "CheckboxField";
 
@@ -2022,7 +2024,7 @@ var PatternField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
 if (process.env.NODE_ENV !== "production") PatternField.displayName = "PatternField";
 PatternField.displayName = 'PatternField';
 
-var _excluded$k = ["label", "error", "checked", "onBlur", "onChange", "helperText", "FormControlLabelProps"];
+var _excluded$k = ["label", "error", "checked", "onBlur", "onChange", "helperText", "FormControlProps", "FormControlLabelProps"];
 var FormControl$1 = /*#__PURE__*/styled__default(core.FormControl).withConfig({
   displayName: "RadioField__FormControl",
   componentId: "SD__sc-6ey4qt-0"
@@ -2039,11 +2041,13 @@ var RadioField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
       onBlur,
       onChange,
       helperText,
+      FormControlProps: formControlProps,
       FormControlLabelProps: formControlLabelProps
     } = _ref,
     props = _objectWithoutProperties(_ref, _excluded$k);
-  return /*#__PURE__*/jsxRuntime.jsxs(FormControl$1, {
-    error: error,
+  return /*#__PURE__*/jsxRuntime.jsxs(FormControl$1, _objectSpread(_objectSpread({
+    error: error
+  }, formControlProps), {}, {
     children: [/*#__PURE__*/jsxRuntime.jsx(core.FormControlLabel, _objectSpread(_objectSpread({}, formControlLabelProps), {}, {
       label: label,
       checked: checked,
@@ -2056,7 +2060,7 @@ var RadioField = /*#__PURE__*/React.forwardRef((_ref, ref) => {
     })), helperText && /*#__PURE__*/jsxRuntime.jsx(FormHelperText$2, {
       children: helperText
     })]
-  });
+  }));
 });
 if (process.env.NODE_ENV !== "production") RadioField.displayName = "RadioField";
 
@@ -2623,6 +2627,7 @@ function overrideAppBar(theme) {
 
 function overrideAutocomplete(theme) {
   var sm = theme.breakpoints.up('sm');
+  var color = theme.palette.type === 'dark' ? core.alpha(exports.Color.White, 0.08) : exports.ColorDynamic.Silver200;
 
   // Remove `Object.assign` after official release of `Autocomplete`.
   Object.assign(theme.props, {
@@ -2681,6 +2686,11 @@ function overrideAutocomplete(theme) {
             }
           }
         }
+      },
+      option: {
+        '&[data-focus="true"]': {
+          backgroundColor: color
+        }
       }
     }
   });
@@ -3207,7 +3217,8 @@ function overrideIconButton(theme) {
       },
       '&:focus': {
         backgroundColor: exports.ColorDynamic.Blue50
-      }
+      },
+      color: exports.ColorDynamic.Blue500
     },
     edgeEnd: {
       marginRight: theme.spacing(-1)
@@ -3294,6 +3305,7 @@ function overrideLink(theme) {
 }
 
 function overrideList(theme) {
+  var color = theme.palette.type === 'dark' ? core.alpha(exports.Color.White, 0.08) : exports.ColorDynamic.Silver200;
   theme.overrides.MuiListItem = {
     root: {
       '&$selected, &$selected:hover': {
@@ -3302,11 +3314,17 @@ function overrideList(theme) {
       '& .MuiTouchRipple-root': {
         color: exports.ColorDynamic.Blue100
       }
+    },
+    button: {
+      '&:hover': {
+        backgroundColor: color
+      }
     }
   };
 }
 
 function overrideMenu(theme) {
+  var color = theme.palette.type === 'dark' ? core.alpha(exports.Color.White, 0.08) : exports.ColorDynamic.Silver200;
   theme.props.MuiMenu = {
     getContentAnchorEl: null,
     anchorOrigin: {
@@ -3326,20 +3344,25 @@ function overrideMenu(theme) {
   theme.overrides.MuiMenuItem = {
     root: _objectSpread(_objectSpread({}, theme.typography.body2), {}, {
       paddingTop: theme.spacing(1),
-      paddingBottom: theme.spacing(1)
+      paddingBottom: theme.spacing(1),
+      '&:hover': {
+        backgroundColor: color
+      }
     })
   };
 }
 
 function overridePagination(theme) {
   var props = {};
+  var mode = theme.palette.type;
+  var color = mode === 'dark' ? core.alpha(exports.Color.White, 0.08) : exports.ColorDynamic.Silver200;
   var overrides = {
     root: {
       color: exports.ColorDynamic.Dark500
     },
     page: {
       '&:hover': {
-        backgroundColor: exports.ColorDynamic.Silver200
+        backgroundColor: color
       },
       '&$focusVisible': {
         borderRadius: 4,
@@ -3890,7 +3913,8 @@ function overrideTooltip(theme) {
   theme.overrides.MuiTooltip = {
     tooltip: _objectSpread(_objectSpread({}, theme.typography.body2), {}, {
       padding: theme.spacing(1, 1.5),
-      backgroundColor: exports.ColorDynamic.Dark500
+      backgroundColor: exports.ColorDynamic.Dark500,
+      '--sd-dark-300': exports.ColorDynamic.Silver500 //tooltip secondary color(Dark300) is invisible in dark mode
     }),
     popperArrow: {
       '&[x-placement*="top"] $arrow': {