@superdispatch/ui 0.40.1 → 0.41.0

package/dist-node/index.js

@@ -20,6 +20,8 @@ var flattenChildren = _interopDefault(require('react-keyed-flatten-children'));
 var ui = require('@superdispatch/ui');
 var reactNumberFormat = require('react-number-format');
 var createBreakpoints = _interopDefault(require('@material-ui/core/styles/createBreakpoints'));
+var styles$1 = require('@mui/material/styles');
+var styles$2 = require('@mui/styles');
 
 var _excluded = ["size", "children", "disabled", "isActive", "isLoading", "color"];
 var Button = /*#__PURE__*/React.forwardRef((_ref, ref) => {
@@ -3933,17 +3935,11 @@ function overrideToolbar(theme) {
 }
 
 function overrideTooltip(theme) {
-  var mode = theme.palette.type;
-  var color = mode === 'dark' ? exports.ColorDark.Silver400 : exports.Color.Dark500;
-  theme.props.MuiTooltip = {
-    arrow: true
-  };
   theme.overrides.MuiTooltip = {
     tooltip: _objectSpread(_objectSpread({}, theme.typography.body2), {}, {
       padding: theme.spacing(1, 1.5),
-      backgroundColor: color,
-      color: exports.Color.White,
-      '--sd-dark-300': exports.Color.Silver500 //tooltip secondary color(Dark300) is invisible in light mode
+      backgroundColor: exports.ColorDynamic.Dark500,
+      '--sd-dark-300': exports.ColorDynamic.Silver500 //tooltip secondary color(Dark300) is invisible in dark mode
     }),
     popperArrow: {
       '&[x-placement*="top"] $arrow': {
@@ -3968,7 +3964,7 @@ function overrideTooltip(theme) {
       }
     },
     arrow: {
-      color,
+      color: exports.ColorDynamic.Silver500,
       fontSize: theme.spacing(1)
     }
   };
@@ -4164,6 +4160,41 @@ function createSuperDispatchTheme(type) {
   overridePreloader(theme);
   return theme;
 }
+function createThemeV5(type) {
+  var breakpoints = createBreakpoints({});
+  var color = type === 'dark' ? exports.ColorDark : exports.Color;
+  return styles$1.createTheme({
+    breakpoints,
+    palette: {
+      mode: type,
+      primary: {
+        main: color.Blue300
+      },
+      error: {
+        main: color.Red300
+      },
+      action: {
+        hover: color.Silver200,
+        selected: color.Blue50,
+        disabled: color.Silver400
+      },
+      text: {
+        primary: color.Dark500,
+        secondary: color.Dark300,
+        disabled: color.Dark100
+      },
+      common: {
+        white: color.White,
+        black: color.Black
+      },
+      divider: color.Silver400,
+      background: {
+        paper: color.White
+      }
+    },
+    components: {}
+  });
+}
 var generateMaterialClassName = /*#__PURE__*/core.createGenerateClassName();
 function generateClassName(rule, sheet) {
   var {
@@ -4201,19 +4232,27 @@ function ThemeProvider(_ref) {
     return !modifier ? nextTheme : modifier(nextTheme);
     // eslint-disable-next-line react-hooks/exhaustive-deps -- modifier may update on every render
   }, [mode]);
+  var themeV5 = createThemeV5(mode);
   return /*#__PURE__*/jsxRuntime.jsx(styles.StylesProvider, {
     injectFirst: injectFirst,
     generateClassName: generateClassName,
-    children: /*#__PURE__*/jsxRuntime.jsxs(styles.ThemeProvider, {
-      theme: theme,
-      children: [/*#__PURE__*/jsxRuntime.jsx(core.CssBaseline, {}), /*#__PURE__*/jsxRuntime.jsxs(styled.ThemeProvider, {
+    children: /*#__PURE__*/jsxRuntime.jsx(styles$2.StylesProvider, {
+      injectFirst: injectFirst,
+      generateClassName: generateClassName,
+      children: /*#__PURE__*/jsxRuntime.jsx(styles.ThemeProvider, {
         theme: theme,
-        children: [/*#__PURE__*/jsxRuntime.jsx(GlobalStyles, {}), /*#__PURE__*/jsxRuntime.jsx(ResponsiveContextProvider, {
-          children: /*#__PURE__*/jsxRuntime.jsx(SnackbarStackProvider, {
-            children: children
-          })
-        })]
-      })]
+        children: /*#__PURE__*/jsxRuntime.jsxs(styles$1.ThemeProvider, {
+          theme: themeV5,
+          children: [/*#__PURE__*/jsxRuntime.jsx(core.CssBaseline, {}), /*#__PURE__*/jsxRuntime.jsxs(styled.ThemeProvider, {
+            theme: theme,
+            children: [/*#__PURE__*/jsxRuntime.jsx(GlobalStyles, {}), /*#__PURE__*/jsxRuntime.jsx(ResponsiveContextProvider, {
+              children: /*#__PURE__*/jsxRuntime.jsx(SnackbarStackProvider, {
+                children: children
+              })
+            })]
+          })]
+        })
+      })
     })
   });
 }