@mui/material 5.10.16 → 5.11.0

package/esm/styles/createTypography.js

@@ -1,82 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["fontFamily", "fontSize", "fontWeightLight", "fontWeightRegular", "fontWeightMedium", "fontWeightBold", "htmlFontSize", "allVariants", "pxToRem"];
-import { deepmerge } from '@mui/utils';
-function round(value) {
-  return Math.round(value * 1e5) / 1e5;
-}
-const caseAllCaps = {
-  textTransform: 'uppercase'
-};
-const defaultFontFamily = '"Roboto", "Helvetica", "Arial", sans-serif';
-
-/**
- * @see @link{https://m2.material.io/design/typography/the-type-system.html}
- * @see @link{https://m2.material.io/design/typography/understanding-typography.html}
- */
-export default function createTypography(palette, typography) {
-  const _ref = typeof typography === 'function' ? typography(palette) : typography,
-    {
-      fontFamily = defaultFontFamily,
-      // The default font size of the Material Specification.
-      fontSize = 14,
-      // px
-      fontWeightLight = 300,
-      fontWeightRegular = 400,
-      fontWeightMedium = 500,
-      fontWeightBold = 700,
-      // Tell MUI what's the font-size on the html element.
-      // 16px is the default font-size used by browsers.
-      htmlFontSize = 16,
-      // Apply the CSS properties to all the variants.
-      allVariants,
-      pxToRem: pxToRem2
-    } = _ref,
-    other = _objectWithoutPropertiesLoose(_ref, _excluded);
-  if (process.env.NODE_ENV !== 'production') {
-    if (typeof fontSize !== 'number') {
-      console.error('MUI: `fontSize` is required to be a number.');
-    }
-    if (typeof htmlFontSize !== 'number') {
-      console.error('MUI: `htmlFontSize` is required to be a number.');
-    }
-  }
-  const coef = fontSize / 14;
-  const pxToRem = pxToRem2 || (size => `${size / htmlFontSize * coef}rem`);
-  const buildVariant = (fontWeight, size, lineHeight, letterSpacing, casing) => _extends({
-    fontFamily,
-    fontWeight,
-    fontSize: pxToRem(size),
-    // Unitless following https://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/
-    lineHeight
-  }, fontFamily === defaultFontFamily ? {
-    letterSpacing: `${round(letterSpacing / size)}em`
-  } : {}, casing, allVariants);
-  const variants = {
-    h1: buildVariant(fontWeightLight, 96, 1.167, -1.5),
-    h2: buildVariant(fontWeightLight, 60, 1.2, -0.5),
-    h3: buildVariant(fontWeightRegular, 48, 1.167, 0),
-    h4: buildVariant(fontWeightRegular, 34, 1.235, 0.25),
-    h5: buildVariant(fontWeightRegular, 24, 1.334, 0),
-    h6: buildVariant(fontWeightMedium, 20, 1.6, 0.15),
-    subtitle1: buildVariant(fontWeightRegular, 16, 1.75, 0.15),
-    subtitle2: buildVariant(fontWeightMedium, 14, 1.57, 0.1),
-    body1: buildVariant(fontWeightRegular, 16, 1.5, 0.15),
-    body2: buildVariant(fontWeightRegular, 14, 1.43, 0.15),
-    button: buildVariant(fontWeightMedium, 14, 1.75, 0.4, caseAllCaps),
-    caption: buildVariant(fontWeightRegular, 12, 1.66, 0.4),
-    overline: buildVariant(fontWeightRegular, 12, 2.66, 1, caseAllCaps)
-  };
-  return deepmerge(_extends({
-    htmlFontSize,
-    pxToRem,
-    fontFamily,
-    fontSize,
-    fontWeightLight,
-    fontWeightRegular,
-    fontWeightMedium,
-    fontWeightBold
-  }, variants), other, {
-    clone: false // No need to clone deep
-  });
-}

package/esm/styles/cssUtils.js

@@ -1,125 +0,0 @@
-export function isUnitless(value) {
-  return String(parseFloat(value)).length === String(value).length;
-}
-
-// Ported from Compass
-// https://github.com/Compass/compass/blob/master/core/stylesheets/compass/typography/_units.scss
-// Emulate the sass function "unit"
-export function getUnit(input) {
-  return String(input).match(/[\d.\-+]*\s*(.*)/)[1] || '';
-}
-
-// Emulate the sass function "unitless"
-export function toUnitless(length) {
-  return parseFloat(length);
-}
-
-// Convert any CSS <length> or <percentage> value to any another.
-// From https://github.com/KyleAMathews/convert-css-length
-export function convertLength(baseFontSize) {
-  return (length, toUnit) => {
-    const fromUnit = getUnit(length);
-
-    // Optimize for cases where `from` and `to` units are accidentally the same.
-    if (fromUnit === toUnit) {
-      return length;
-    }
-
-    // Convert input length to pixels.
-    let pxLength = toUnitless(length);
-    if (fromUnit !== 'px') {
-      if (fromUnit === 'em') {
-        pxLength = toUnitless(length) * toUnitless(baseFontSize);
-      } else if (fromUnit === 'rem') {
-        pxLength = toUnitless(length) * toUnitless(baseFontSize);
-      }
-    }
-
-    // Convert length in pixels to the output unit
-    let outputLength = pxLength;
-    if (toUnit !== 'px') {
-      if (toUnit === 'em') {
-        outputLength = pxLength / toUnitless(baseFontSize);
-      } else if (toUnit === 'rem') {
-        outputLength = pxLength / toUnitless(baseFontSize);
-      } else {
-        return length;
-      }
-    }
-    return parseFloat(outputLength.toFixed(5)) + toUnit;
-  };
-}
-export function alignProperty({
-  size,
-  grid
-}) {
-  const sizeBelow = size - size % grid;
-  const sizeAbove = sizeBelow + grid;
-  return size - sizeBelow < sizeAbove - size ? sizeBelow : sizeAbove;
-}
-
-// fontGrid finds a minimal grid (in rem) for the fontSize values so that the
-// lineHeight falls under a x pixels grid, 4px in the case of Material Design,
-// without changing the relative line height
-export function fontGrid({
-  lineHeight,
-  pixels,
-  htmlFontSize
-}) {
-  return pixels / (lineHeight * htmlFontSize);
-}
-
-/**
- * generate a responsive version of a given CSS property
- * @example
- * responsiveProperty({
- *   cssProperty: 'fontSize',
- *   min: 15,
- *   max: 20,
- *   unit: 'px',
- *   breakpoints: [300, 600],
- * })
- *
- * // this returns
- *
- * {
- *   fontSize: '15px',
- *   '@media (min-width:300px)': {
- *     fontSize: '17.5px',
- *   },
- *   '@media (min-width:600px)': {
- *     fontSize: '20px',
- *   },
- * }
- * @param {Object} params
- * @param {string} params.cssProperty - The CSS property to be made responsive
- * @param {number} params.min - The smallest value of the CSS property
- * @param {number} params.max - The largest value of the CSS property
- * @param {string} [params.unit] - The unit to be used for the CSS property
- * @param {Array.number} [params.breakpoints]  - An array of breakpoints
- * @param {number} [params.alignStep] - Round scaled value to fall under this grid
- * @returns {Object} responsive styles for {params.cssProperty}
- */
-export function responsiveProperty({
-  cssProperty,
-  min,
-  max,
-  unit = 'rem',
-  breakpoints = [600, 900, 1200],
-  transform = null
-}) {
-  const output = {
-    [cssProperty]: `${min}${unit}`
-  };
-  const factor = (max - min) / breakpoints[breakpoints.length - 1];
-  breakpoints.forEach(breakpoint => {
-    let value = min + factor * breakpoint;
-    if (transform !== null) {
-      value = transform(value);
-    }
-    output[`@media (min-width:${breakpoint}px)`] = {
-      [cssProperty]: `${Math.round(value * 10000) / 10000}${unit}`
-    };
-  });
-  return output;
-}

package/esm/styles/defaultTheme.js

@@ -1,3 +0,0 @@
-import createTheme from './createTheme';
-const defaultTheme = createTheme();
-export default defaultTheme;

package/esm/styles/excludeVariablesFromRoot.js

@@ -1,5 +0,0 @@
-/**
- * @internal These variables should not appear in the :root stylesheet when the `defaultMode="dark"`
- */
-const excludeVariablesFromRoot = cssVarPrefix => [...[...Array(24)].map((_, index) => `--${cssVarPrefix ? `${cssVarPrefix}-` : ''}overlays-${index + 1}`), `--${cssVarPrefix ? `${cssVarPrefix}-` : ''}palette-AppBar-darkBg`, `--${cssVarPrefix ? `${cssVarPrefix}-` : ''}palette-AppBar-darkColor`];
-export default excludeVariablesFromRoot;

package/esm/styles/experimental_extendTheme.js

@@ -1,249 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
-const _excluded = ["colorSchemes", "cssVarPrefix"],
-  _excluded2 = ["palette"];
-import { deepmerge } from '@mui/utils';
-import { colorChannel, alpha, darken, lighten, emphasize, unstable_createGetCssVar as systemCreateGetCssVar } from '@mui/system';
-import createThemeWithoutVars from './createTheme';
-import getOverlayAlpha from './getOverlayAlpha';
-const defaultDarkOverlays = [...Array(25)].map((_, index) => {
-  if (index === 0) {
-    return undefined;
-  }
-  const overlay = getOverlayAlpha(index);
-  return `linear-gradient(rgba(255 255 255 / ${overlay}), rgba(255 255 255 / ${overlay}))`;
-});
-function assignNode(obj, keys) {
-  keys.forEach(k => {
-    if (!obj[k]) {
-      obj[k] = {};
-    }
-  });
-}
-function setColor(obj, key, defaultValue) {
-  obj[key] = obj[key] || defaultValue;
-}
-export const createGetCssVar = (cssVarPrefix = 'mui') => systemCreateGetCssVar(cssVarPrefix);
-export default function extendTheme(options = {}, ...args) {
-  var _colorSchemesInput$li, _colorSchemesInput$da, _colorSchemesInput$li2, _colorSchemesInput$li3, _colorSchemesInput$da2, _colorSchemesInput$da3;
-  const {
-      colorSchemes: colorSchemesInput = {},
-      cssVarPrefix = 'mui'
-    } = options,
-    input = _objectWithoutPropertiesLoose(options, _excluded);
-  const getCssVar = createGetCssVar(cssVarPrefix);
-  const _createThemeWithoutVa = createThemeWithoutVars(_extends({}, input, colorSchemesInput.light && {
-      palette: (_colorSchemesInput$li = colorSchemesInput.light) == null ? void 0 : _colorSchemesInput$li.palette
-    })),
-    {
-      palette: lightPalette
-    } = _createThemeWithoutVa,
-    muiTheme = _objectWithoutPropertiesLoose(_createThemeWithoutVa, _excluded2);
-  const {
-    palette: darkPalette
-  } = createThemeWithoutVars({
-    palette: _extends({
-      mode: 'dark'
-    }, (_colorSchemesInput$da = colorSchemesInput.dark) == null ? void 0 : _colorSchemesInput$da.palette)
-  });
-  let theme = _extends({}, muiTheme, {
-    cssVarPrefix,
-    getCssVar,
-    colorSchemes: _extends({}, colorSchemesInput, {
-      light: _extends({}, colorSchemesInput.light, {
-        palette: lightPalette,
-        opacity: _extends({
-          inputPlaceholder: 0.42,
-          inputUnderline: 0.42,
-          switchTrackDisabled: 0.12,
-          switchTrack: 0.38
-        }, (_colorSchemesInput$li2 = colorSchemesInput.light) == null ? void 0 : _colorSchemesInput$li2.opacity),
-        overlays: ((_colorSchemesInput$li3 = colorSchemesInput.light) == null ? void 0 : _colorSchemesInput$li3.overlays) || []
-      }),
-      dark: _extends({}, colorSchemesInput.dark, {
-        palette: darkPalette,
-        opacity: _extends({
-          inputPlaceholder: 0.5,
-          inputUnderline: 0.7,
-          switchTrackDisabled: 0.2,
-          switchTrack: 0.3
-        }, (_colorSchemesInput$da2 = colorSchemesInput.dark) == null ? void 0 : _colorSchemesInput$da2.opacity),
-        overlays: ((_colorSchemesInput$da3 = colorSchemesInput.dark) == null ? void 0 : _colorSchemesInput$da3.overlays) || defaultDarkOverlays
-      })
-    })
-  });
-  Object.keys(theme.colorSchemes).forEach(key => {
-    const palette = theme.colorSchemes[key].palette;
-
-    // attach black & white channels to common node
-    if (key === 'light') {
-      setColor(palette.common, 'background', '#fff');
-      setColor(palette.common, 'onBackground', '#000');
-    } else {
-      setColor(palette.common, 'background', '#000');
-      setColor(palette.common, 'onBackground', '#fff');
-    }
-
-    // assign component variables
-    assignNode(palette, ['Alert', 'AppBar', 'Avatar', 'Chip', 'FilledInput', 'LinearProgress', 'Skeleton', 'Slider', 'SnackbarContent', 'SpeedDialAction', 'StepConnector', 'StepContent', 'Switch', 'TableCell', 'Tooltip']);
-    if (key === 'light') {
-      setColor(palette.Alert, 'errorColor', darken(palette.error.light, 0.6));
-      setColor(palette.Alert, 'infoColor', darken(palette.info.light, 0.6));
-      setColor(palette.Alert, 'successColor', darken(palette.success.light, 0.6));
-      setColor(palette.Alert, 'warningColor', darken(palette.warning.light, 0.6));
-      setColor(palette.Alert, 'errorFilledBg', getCssVar('palette-error-main'));
-      setColor(palette.Alert, 'infoFilledBg', getCssVar('palette-info-main'));
-      setColor(palette.Alert, 'successFilledBg', getCssVar('palette-success-main'));
-      setColor(palette.Alert, 'warningFilledBg', getCssVar('palette-warning-main'));
-      setColor(palette.Alert, 'errorFilledColor', lightPalette.getContrastText(palette.error.main));
-      setColor(palette.Alert, 'infoFilledColor', lightPalette.getContrastText(palette.info.main));
-      setColor(palette.Alert, 'successFilledColor', lightPalette.getContrastText(palette.success.main));
-      setColor(palette.Alert, 'warningFilledColor', lightPalette.getContrastText(palette.warning.main));
-      setColor(palette.Alert, 'errorStandardBg', lighten(palette.error.light, 0.9));
-      setColor(palette.Alert, 'infoStandardBg', lighten(palette.info.light, 0.9));
-      setColor(palette.Alert, 'successStandardBg', lighten(palette.success.light, 0.9));
-      setColor(palette.Alert, 'warningStandardBg', lighten(palette.warning.light, 0.9));
-      setColor(palette.Alert, 'errorIconColor', getCssVar('palette-error-light'));
-      setColor(palette.Alert, 'infoIconColor', getCssVar('palette-info-light'));
-      setColor(palette.Alert, 'successIconColor', getCssVar('palette-success-light'));
-      setColor(palette.Alert, 'warningIconColor', getCssVar('palette-warning-light'));
-      setColor(palette.AppBar, 'defaultBg', getCssVar('palette-grey-100'));
-      setColor(palette.Avatar, 'defaultBg', getCssVar('palette-grey-400'));
-      setColor(palette.Chip, 'defaultBorder', getCssVar('palette-grey-400'));
-      setColor(palette.Chip, 'defaultAvatarColor', getCssVar('palette-grey-700'));
-      setColor(palette.Chip, 'defaultIconColor', getCssVar('palette-grey-700'));
-      setColor(palette.FilledInput, 'bg', 'rgba(0, 0, 0, 0.06)');
-      setColor(palette.FilledInput, 'hoverBg', 'rgba(0, 0, 0, 0.09)');
-      setColor(palette.FilledInput, 'disabledBg', 'rgba(0, 0, 0, 0.12)');
-      setColor(palette.LinearProgress, 'primaryBg', lighten(palette.primary.main, 0.62));
-      setColor(palette.LinearProgress, 'secondaryBg', lighten(palette.secondary.main, 0.62));
-      setColor(palette.LinearProgress, 'errorBg', lighten(palette.error.main, 0.62));
-      setColor(palette.LinearProgress, 'infoBg', lighten(palette.info.main, 0.62));
-      setColor(palette.LinearProgress, 'successBg', lighten(palette.success.main, 0.62));
-      setColor(palette.LinearProgress, 'warningBg', lighten(palette.warning.main, 0.62));
-      setColor(palette.Skeleton, 'bg', `rgba(${getCssVar('palette-text-primaryChannel')} / 0.11)`);
-      setColor(palette.Slider, 'primaryTrack', lighten(palette.primary.main, 0.62));
-      setColor(palette.Slider, 'secondaryTrack', lighten(palette.secondary.main, 0.62));
-      setColor(palette.Slider, 'errorTrack', lighten(palette.error.main, 0.62));
-      setColor(palette.Slider, 'infoTrack', lighten(palette.info.main, 0.62));
-      setColor(palette.Slider, 'successTrack', lighten(palette.success.main, 0.62));
-      setColor(palette.Slider, 'warningTrack', lighten(palette.warning.main, 0.62));
-      const snackbarContentBackground = emphasize(palette.background.default, 0.8);
-      setColor(palette.SnackbarContent, 'bg', snackbarContentBackground);
-      setColor(palette.SnackbarContent, 'color', lightPalette.getContrastText(snackbarContentBackground));
-      setColor(palette.SpeedDialAction, 'fabHoverBg', emphasize(palette.background.paper, 0.15));
-      setColor(palette.StepConnector, 'border', getCssVar('palette-grey-400'));
-      setColor(palette.StepContent, 'border', getCssVar('palette-grey-400'));
-      setColor(palette.Switch, 'defaultColor', getCssVar('palette-common-white'));
-      setColor(palette.Switch, 'defaultDisabledColor', getCssVar('palette-grey-100'));
-      setColor(palette.Switch, 'primaryDisabledColor', lighten(palette.primary.main, 0.62));
-      setColor(palette.Switch, 'secondaryDisabledColor', lighten(palette.secondary.main, 0.62));
-      setColor(palette.Switch, 'errorDisabledColor', lighten(palette.error.main, 0.62));
-      setColor(palette.Switch, 'infoDisabledColor', lighten(palette.info.main, 0.62));
-      setColor(palette.Switch, 'successDisabledColor', lighten(palette.success.main, 0.62));
-      setColor(palette.Switch, 'warningDisabledColor', lighten(palette.warning.main, 0.62));
-      setColor(palette.TableCell, 'border', lighten(alpha(palette.divider, 1), 0.88));
-      setColor(palette.Tooltip, 'bg', alpha(palette.grey[700], 0.92));
-    } else {
-      setColor(palette.Alert, 'errorColor', lighten(palette.error.light, 0.6));
-      setColor(palette.Alert, 'infoColor', lighten(palette.info.light, 0.6));
-      setColor(palette.Alert, 'successColor', lighten(palette.success.light, 0.6));
-      setColor(palette.Alert, 'warningColor', lighten(palette.warning.light, 0.6));
-      setColor(palette.Alert, 'errorFilledBg', getCssVar('palette-error-dark'));
-      setColor(palette.Alert, 'infoFilledBg', getCssVar('palette-info-dark'));
-      setColor(palette.Alert, 'successFilledBg', getCssVar('palette-success-dark'));
-      setColor(palette.Alert, 'warningFilledBg', getCssVar('palette-warning-dark'));
-      setColor(palette.Alert, 'errorFilledColor', darkPalette.getContrastText(palette.error.dark));
-      setColor(palette.Alert, 'infoFilledColor', darkPalette.getContrastText(palette.info.dark));
-      setColor(palette.Alert, 'successFilledColor', darkPalette.getContrastText(palette.success.dark));
-      setColor(palette.Alert, 'warningFilledColor', darkPalette.getContrastText(palette.warning.dark));
-      setColor(palette.Alert, 'errorStandardBg', darken(palette.error.light, 0.9));
-      setColor(palette.Alert, 'infoStandardBg', darken(palette.info.light, 0.9));
-      setColor(palette.Alert, 'successStandardBg', darken(palette.success.light, 0.9));
-      setColor(palette.Alert, 'warningStandardBg', darken(palette.warning.light, 0.9));
-      setColor(palette.Alert, 'errorIconColor', getCssVar('palette-error-main'));
-      setColor(palette.Alert, 'infoIconColor', getCssVar('palette-info-main'));
-      setColor(palette.Alert, 'successIconColor', getCssVar('palette-success-main'));
-      setColor(palette.Alert, 'warningIconColor', getCssVar('palette-warning-main'));
-      setColor(palette.AppBar, 'defaultBg', getCssVar('palette-grey-900'));
-      setColor(palette.AppBar, 'darkBg', getCssVar('palette-background-paper')); // specific for dark mode
-      setColor(palette.AppBar, 'darkColor', getCssVar('palette-text-primary')); // specific for dark mode
-      setColor(palette.Avatar, 'defaultBg', getCssVar('palette-grey-600'));
-      setColor(palette.Chip, 'defaultBorder', getCssVar('palette-grey-700'));
-      setColor(palette.Chip, 'defaultAvatarColor', getCssVar('palette-grey-300'));
-      setColor(palette.Chip, 'defaultIconColor', getCssVar('palette-grey-300'));
-      setColor(palette.FilledInput, 'bg', 'rgba(255, 255, 255, 0.09)');
-      setColor(palette.FilledInput, 'hoverBg', 'rgba(255, 255, 255, 0.13)');
-      setColor(palette.FilledInput, 'disabledBg', 'rgba(255, 255, 255, 0.12)');
-      setColor(palette.LinearProgress, 'primaryBg', darken(palette.primary.main, 0.5));
-      setColor(palette.LinearProgress, 'secondaryBg', darken(palette.secondary.main, 0.5));
-      setColor(palette.LinearProgress, 'errorBg', darken(palette.error.main, 0.5));
-      setColor(palette.LinearProgress, 'infoBg', darken(palette.info.main, 0.5));
-      setColor(palette.LinearProgress, 'successBg', darken(palette.success.main, 0.5));
-      setColor(palette.LinearProgress, 'warningBg', darken(palette.warning.main, 0.5));
-      setColor(palette.Skeleton, 'bg', `rgba(${getCssVar('palette-text-primaryChannel')} / 0.13)`);
-      setColor(palette.Slider, 'primaryTrack', darken(palette.primary.main, 0.5));
-      setColor(palette.Slider, 'secondaryTrack', darken(palette.secondary.main, 0.5));
-      setColor(palette.Slider, 'errorTrack', darken(palette.error.main, 0.5));
-      setColor(palette.Slider, 'infoTrack', darken(palette.info.main, 0.5));
-      setColor(palette.Slider, 'successTrack', darken(palette.success.main, 0.5));
-      setColor(palette.Slider, 'warningTrack', darken(palette.warning.main, 0.5));
-      const snackbarContentBackground = emphasize(palette.background.default, 0.98);
-      setColor(palette.SnackbarContent, 'bg', snackbarContentBackground);
-      setColor(palette.SnackbarContent, 'color', darkPalette.getContrastText(snackbarContentBackground));
-      setColor(palette.SpeedDialAction, 'fabHoverBg', emphasize(palette.background.paper, 0.15));
-      setColor(palette.StepConnector, 'border', getCssVar('palette-grey-600'));
-      setColor(palette.StepContent, 'border', getCssVar('palette-grey-600'));
-      setColor(palette.Switch, 'defaultColor', getCssVar('palette-grey-300'));
-      setColor(palette.Switch, 'defaultDisabledColor', getCssVar('palette-grey-600'));
-      setColor(palette.Switch, 'primaryDisabledColor', darken(palette.primary.main, 0.55));
-      setColor(palette.Switch, 'secondaryDisabledColor', darken(palette.secondary.main, 0.55));
-      setColor(palette.Switch, 'errorDisabledColor', darken(palette.error.main, 0.55));
-      setColor(palette.Switch, 'infoDisabledColor', darken(palette.info.main, 0.55));
-      setColor(palette.Switch, 'successDisabledColor', darken(palette.success.main, 0.55));
-      setColor(palette.Switch, 'warningDisabledColor', darken(palette.warning.main, 0.55));
-      setColor(palette.TableCell, 'border', darken(alpha(palette.divider, 1), 0.68));
-      setColor(palette.Tooltip, 'bg', alpha(palette.grey[700], 0.92));
-    }
-    palette.background.defaultChannel = colorChannel(palette.background.default); // MUI X - DataGrid needs this token.
-
-    palette.common.backgroundChannel = colorChannel(palette.common.background);
-    palette.common.onBackgroundChannel = colorChannel(palette.common.onBackground);
-    palette.dividerChannel = colorChannel(palette.divider);
-    Object.keys(palette).forEach(color => {
-      const colors = palette[color];
-
-      // Color palettes: primary, secondary, error, info, success, and warning
-      if (colors.main) {
-        palette[color].mainChannel = colorChannel(colors.main);
-      }
-      if (colors.light) {
-        palette[color].lightChannel = colorChannel(colors.light);
-      }
-      if (colors.dark) {
-        palette[color].darkChannel = colorChannel(colors.dark);
-      }
-      if (colors.contrastText) {
-        palette[color].contrastTextChannel = colorChannel(colors.contrastText);
-      }
-
-      // Text colors: text.primary, text.secondary
-      if (colors.primary) {
-        palette[color].primaryChannel = colorChannel(colors.primary);
-      }
-      if (colors.secondary) {
-        palette[color].secondaryChannel = colorChannel(colors.secondary);
-      }
-
-      // Action colors: action.active, action.selected
-      if (colors.active) {
-        palette[color].activeChannel = colorChannel(colors.active);
-      }
-      if (colors.selected) {
-        palette[color].selectedChannel = colorChannel(colors.selected);
-      }
-    });
-  });
-  theme = args.reduce((acc, argument) => deepmerge(acc, argument), theme);
-  return theme;
-}

package/esm/styles/getOverlayAlpha.js

@@ -1,11 +0,0 @@
-// Inspired by https://github.com/material-components/material-components-ios/blob/bca36107405594d5b7b16265a5b0ed698f85a5ee/components/Elevation/src/UIColor%2BMaterialElevation.m#L61
-const getOverlayAlpha = elevation => {
-  let alphaValue;
-  if (elevation < 1) {
-    alphaValue = 5.11916 * elevation ** 2;
-  } else {
-    alphaValue = 4.5 * Math.log(elevation + 1) + 2;
-  }
-  return (alphaValue / 100).toFixed(2);
-};
-export default getOverlayAlpha;

package/esm/styles/index.js

@@ -1,26 +0,0 @@
-export { default as adaptV4Theme } from './adaptV4Theme';
-export { hexToRgb, rgbToHex, hslToRgb, decomposeColor, recomposeColor, getContrastRatio, getLuminance, emphasize, alpha, darken, lighten, css, keyframes, experimental_sx } from '@mui/system';
-export { default as createTheme, createMuiTheme } from './createTheme';
-export { default as unstable_createMuiStrictModeTheme } from './createMuiStrictModeTheme';
-export { default as createStyles } from './createStyles';
-export { getUnit as unstable_getUnit, toUnitless as unstable_toUnitless } from './cssUtils';
-export { default as responsiveFontSizes } from './responsiveFontSizes';
-export { duration, easing } from './createTransitions';
-export { default as useTheme } from './useTheme';
-export { default as useThemeProps } from './useThemeProps';
-export { default as styled } from './styled';
-export { default as experimentalStyled } from './styled';
-export { default as ThemeProvider } from './ThemeProvider';
-export { StyledEngineProvider } from '@mui/system';
-// The legacy utilities from @mui/styles
-// These are just empty functions that throws when invoked
-export { default as makeStyles } from './makeStyles';
-export { default as withStyles } from './withStyles';
-export { default as withTheme } from './withTheme';
-export * from './CssVarsProvider';
-export { default as experimental_extendTheme } from './experimental_extendTheme';
-export { default as getOverlayAlpha } from './getOverlayAlpha';
-
-// Private methods for creating parts of the theme
-export { default as private_createTypography } from './createTypography';
-export { default as private_excludeVariablesFromRoot } from './excludeVariablesFromRoot';

package/esm/styles/makeStyles.js

@@ -1,6 +0,0 @@
-import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
-export default function makeStyles() {
-  throw new Error(process.env.NODE_ENV !== "production" ? `MUI: makeStyles is no longer exported from @mui/material/styles.
-You have to import it from @mui/styles.
-See https://mui.com/r/migration-v4/#mui-material-styles for more details.` : _formatMuiErrorMessage(14));
-}

package/esm/styles/responsiveFontSizes.js

@@ -1,59 +0,0 @@
-import _extends from "@babel/runtime/helpers/esm/extends";
-import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
-import { isUnitless, convertLength, responsiveProperty, alignProperty, fontGrid } from './cssUtils';
-export default function responsiveFontSizes(themeInput, options = {}) {
-  const {
-    breakpoints = ['sm', 'md', 'lg'],
-    disableAlign = false,
-    factor = 2,
-    variants = ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'subtitle1', 'subtitle2', 'body1', 'body2', 'caption', 'button', 'overline']
-  } = options;
-  const theme = _extends({}, themeInput);
-  theme.typography = _extends({}, theme.typography);
-  const typography = theme.typography;
-
-  // Convert between CSS lengths e.g. em->px or px->rem
-  // Set the baseFontSize for your project. Defaults to 16px (also the browser default).
-  const convert = convertLength(typography.htmlFontSize);
-  const breakpointValues = breakpoints.map(x => theme.breakpoints.values[x]);
-  variants.forEach(variant => {
-    const style = typography[variant];
-    const remFontSize = parseFloat(convert(style.fontSize, 'rem'));
-    if (remFontSize <= 1) {
-      return;
-    }
-    const maxFontSize = remFontSize;
-    const minFontSize = 1 + (maxFontSize - 1) / factor;
-    let {
-      lineHeight
-    } = style;
-    if (!isUnitless(lineHeight) && !disableAlign) {
-      throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Unsupported non-unitless line height with grid alignment.
-Use unitless line heights instead.` : _formatMuiErrorMessage(6));
-    }
-    if (!isUnitless(lineHeight)) {
-      // make it unitless
-      lineHeight = parseFloat(convert(lineHeight, 'rem')) / parseFloat(remFontSize);
-    }
-    let transform = null;
-    if (!disableAlign) {
-      transform = value => alignProperty({
-        size: value,
-        grid: fontGrid({
-          pixels: 4,
-          lineHeight,
-          htmlFontSize: typography.htmlFontSize
-        })
-      });
-    }
-    typography[variant] = _extends({}, style, responsiveProperty({
-      cssProperty: 'fontSize',
-      min: minFontSize,
-      max: maxFontSize,
-      unit: 'rem',
-      breakpoints: breakpointValues,
-      transform
-    }));
-  });
-  return theme;
-}

package/esm/styles/shadows.js

@@ -1,10 +0,0 @@
-const shadowKeyUmbraOpacity = 0.2;
-const shadowKeyPenumbraOpacity = 0.14;
-const shadowAmbientShadowOpacity = 0.12;
-function createShadow(...px) {
-  return [`${px[0]}px ${px[1]}px ${px[2]}px ${px[3]}px rgba(0,0,0,${shadowKeyUmbraOpacity})`, `${px[4]}px ${px[5]}px ${px[6]}px ${px[7]}px rgba(0,0,0,${shadowKeyPenumbraOpacity})`, `${px[8]}px ${px[9]}px ${px[10]}px ${px[11]}px rgba(0,0,0,${shadowAmbientShadowOpacity})`].join(',');
-}
-
-// Values from https://github.com/material-components/material-components-web/blob/be8747f94574669cb5e7add1a7c54fa41a89cec7/packages/mdc-elevation/_variables.scss
-const shadows = ['none', createShadow(0, 2, 1, -1, 0, 1, 1, 0, 0, 1, 3, 0), createShadow(0, 3, 1, -2, 0, 2, 2, 0, 0, 1, 5, 0), createShadow(0, 3, 3, -2, 0, 3, 4, 0, 0, 1, 8, 0), createShadow(0, 2, 4, -1, 0, 4, 5, 0, 0, 1, 10, 0), createShadow(0, 3, 5, -1, 0, 5, 8, 0, 0, 1, 14, 0), createShadow(0, 3, 5, -1, 0, 6, 10, 0, 0, 1, 18, 0), createShadow(0, 4, 5, -2, 0, 7, 10, 1, 0, 2, 16, 1), createShadow(0, 5, 5, -3, 0, 8, 10, 1, 0, 3, 14, 2), createShadow(0, 5, 6, -3, 0, 9, 12, 1, 0, 3, 16, 2), createShadow(0, 6, 6, -3, 0, 10, 14, 1, 0, 4, 18, 3), createShadow(0, 6, 7, -4, 0, 11, 15, 1, 0, 4, 20, 3), createShadow(0, 7, 8, -4, 0, 12, 17, 2, 0, 5, 22, 4), createShadow(0, 7, 8, -4, 0, 13, 19, 2, 0, 5, 24, 4), createShadow(0, 7, 9, -4, 0, 14, 21, 2, 0, 5, 26, 4), createShadow(0, 8, 9, -5, 0, 15, 22, 2, 0, 6, 28, 5), createShadow(0, 8, 10, -5, 0, 16, 24, 2, 0, 6, 30, 5), createShadow(0, 8, 11, -5, 0, 17, 26, 2, 0, 6, 32, 5), createShadow(0, 9, 11, -5, 0, 18, 28, 2, 0, 7, 34, 6), createShadow(0, 9, 12, -6, 0, 19, 29, 2, 0, 7, 36, 6), createShadow(0, 10, 13, -6, 0, 20, 31, 3, 0, 8, 38, 7), createShadow(0, 10, 13, -6, 0, 21, 33, 3, 0, 8, 40, 7), createShadow(0, 10, 14, -6, 0, 22, 35, 3, 0, 8, 42, 7), createShadow(0, 11, 14, -7, 0, 23, 36, 3, 0, 9, 44, 8), createShadow(0, 11, 15, -7, 0, 24, 38, 3, 0, 9, 46, 8)];
-export default shadows;

package/esm/styles/styled.js

@@ -1,9 +0,0 @@
-import { createStyled, shouldForwardProp } from '@mui/system';
-import defaultTheme from './defaultTheme';
-export const rootShouldForwardProp = prop => shouldForwardProp(prop) && prop !== 'classes';
-export const slotShouldForwardProp = shouldForwardProp;
-const styled = createStyled({
-  defaultTheme,
-  rootShouldForwardProp
-});
-export default styled;

package/esm/styles/useTheme.js

@@ -1,11 +0,0 @@
-import * as React from 'react';
-import { useTheme as useThemeSystem } from '@mui/system';
-import defaultTheme from './defaultTheme';
-export default function useTheme() {
-  const theme = useThemeSystem(defaultTheme);
-  if (process.env.NODE_ENV !== 'production') {
-    // eslint-disable-next-line react-hooks/rules-of-hooks
-    React.useDebugValue(theme);
-  }
-  return theme;
-}

package/esm/styles/useThemeProps.js

@@ -1,12 +0,0 @@
-import { useThemeProps as systemUseThemeProps } from '@mui/system';
-import defaultTheme from './defaultTheme';
-export default function useThemeProps({
-  props,
-  name
-}) {
-  return systemUseThemeProps({
-    props,
-    name,
-    defaultTheme
-  });
-}

package/esm/styles/withStyles.js

@@ -1,6 +0,0 @@
-import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
-export default function withStyles() {
-  throw new Error(process.env.NODE_ENV !== "production" ? `MUI: withStyles is no longer exported from @mui/material/styles.
-You have to import it from @mui/styles.
-See https://mui.com/r/migration-v4/#mui-material-styles for more details.` : _formatMuiErrorMessage(15));
-}

package/esm/styles/withTheme.js

@@ -1,6 +0,0 @@
-import { formatMuiErrorMessage as _formatMuiErrorMessage } from "@mui/utils";
-export default function withTheme() {
-  throw new Error(process.env.NODE_ENV !== "production" ? `MUI: withTheme is no longer exported from @mui/material/styles.
-You have to import it from @mui/styles.
-See https://mui.com/r/migration-v4/#mui-material-styles for more details.` : _formatMuiErrorMessage(16));
-}

package/esm/styles/zIndex.js

@@ -1,13 +0,0 @@
-// We need to centralize the zIndex definitions as they work
-// like global values in the browser.
-const zIndex = {
-  mobileStepper: 1000,
-  fab: 1050,
-  speedDial: 1050,
-  appBar: 1100,
-  drawer: 1200,
-  modal: 1300,
-  snackbar: 1400,
-  tooltip: 1500
-};
-export default zIndex;