@mui/system 6.1.1 → 6.1.3

package/breakpoints/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "./index.js",
-  "main": "../node/breakpoints/index.js",
+  "module": "../esm/breakpoints/index.js",
+  "main": "./index.js",
   "types": "./index.d.ts"
 }

package/colorManipulator/colorManipulator.js

@@ -1,6 +1,31 @@
-import _formatMuiErrorMessage from "@mui/utils/formatMuiErrorMessage";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.alpha = alpha;
+exports.blend = blend;
+exports.colorChannel = void 0;
+exports.darken = darken;
+exports.decomposeColor = decomposeColor;
+exports.emphasize = emphasize;
+exports.getContrastRatio = getContrastRatio;
+exports.getLuminance = getLuminance;
+exports.hexToRgb = hexToRgb;
+exports.hslToRgb = hslToRgb;
+exports.lighten = lighten;
+exports.private_safeAlpha = private_safeAlpha;
+exports.private_safeColorChannel = void 0;
+exports.private_safeDarken = private_safeDarken;
+exports.private_safeEmphasize = private_safeEmphasize;
+exports.private_safeLighten = private_safeLighten;
+exports.recomposeColor = recomposeColor;
+exports.rgbToHex = rgbToHex;
+var _formatMuiErrorMessage2 = _interopRequireDefault(require("@mui/utils/formatMuiErrorMessage"));
+var _clamp = _interopRequireDefault(require("@mui/utils/clamp"));
 /* eslint-disable @typescript-eslint/naming-convention */
-import clamp from '@mui/utils/clamp';
+
 /**
  * Returns a number whose value is limited to the given range.
  * @param {number} value The value to be clamped
@@ -14,7 +39,7 @@ function clampWrapper(value, min = 0, max = 1) {
       console.error(`MUI: The value provided ${value} is out of range [${min}, ${max}].`);
     }
   }
-  return clamp(value, min, max);
+  return (0, _clamp.default)(value, min, max);
 }
 
 /**
@@ -22,7 +47,7 @@ function clampWrapper(value, min = 0, max = 1) {
  * @param {string} color - Hex color, i.e. #nnn or #nnnnnn
  * @returns {string} A CSS rgb color string
  */
-export function hexToRgb(color) {
+function hexToRgb(color) {
   color = color.slice(1);
   const re = new RegExp(`.{1,${color.length >= 6 ? 2 : 1}}`, 'g');
   let colors = color.match(re);
@@ -45,7 +70,7 @@ function intToHex(int) {
  * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
  * @returns {object} - A MUI color object: {type: string, values: number[]}
  */
-export function decomposeColor(color) {
+function decomposeColor(color) {
   // Idempotent
   if (color.type) {
     return color;
@@ -56,8 +81,7 @@ export function decomposeColor(color) {
   const marker = color.indexOf('(');
   const type = color.substring(0, marker);
   if (!['rgb', 'rgba', 'hsl', 'hsla', 'color'].includes(type)) {
-    throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Unsupported \`${color}\` color.
-The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().` : _formatMuiErrorMessage(9, color));
+    throw new Error(process.env.NODE_ENV !== "production" ? `MUI: Unsupported \`${color}\` color.\n` + 'The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color().' : (0, _formatMuiErrorMessage2.default)(9, color));
   }
   let values = color.substring(marker + 1, color.length - 1);
   let colorSpace;
@@ -68,8 +92,7 @@ The following formats are supported: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
       values[3] = values[3].slice(1);
     }
     if (!['srgb', 'display-p3', 'a98-rgb', 'prophoto-rgb', 'rec-2020'].includes(colorSpace)) {
-      throw new Error(process.env.NODE_ENV !== "production" ? `MUI: unsupported \`${colorSpace}\` color space.
-The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.` : _formatMuiErrorMessage(10, colorSpace));
+      throw new Error(process.env.NODE_ENV !== "production" ? `MUI: unsupported \`${colorSpace}\` color space.\n` + 'The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rgb, rec-2020.' : (0, _formatMuiErrorMessage2.default)(10, colorSpace));
     }
   } else {
     values = values.split(',');
@@ -88,11 +111,12 @@ The following color spaces are supported: srgb, display-p3, a98-rgb, prophoto-rg
  * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
  * @returns {string} - The channel for the color, that can be used in rgba or hsla colors
  */
-export const colorChannel = color => {
+const colorChannel = color => {
   const decomposedColor = decomposeColor(color);
   return decomposedColor.values.slice(0, 3).map((val, idx) => decomposedColor.type.includes('hsl') && idx !== 0 ? `${val}%` : val).join(' ');
 };
-export const private_safeColorChannel = (color, warning) => {
+exports.colorChannel = colorChannel;
+const private_safeColorChannel = (color, warning) => {
   try {
     return colorChannel(color);
   } catch (error) {
@@ -110,7 +134,8 @@ export const private_safeColorChannel = (color, warning) => {
  * @param {array} color.values - [n,n,n] or [n,n,n,n]
  * @returns {string} A CSS color string
  */
-export function recomposeColor(color) {
+exports.private_safeColorChannel = private_safeColorChannel;
+function recomposeColor(color) {
   const {
     type,
     colorSpace
@@ -138,7 +163,7 @@ export function recomposeColor(color) {
  * @param {string} color - RGB color, i.e. rgb(n, n, n)
  * @returns {string} A CSS rgb color string, i.e. #nnnnnn
  */
-export function rgbToHex(color) {
+function rgbToHex(color) {
   // Idempotent
   if (color.startsWith('#')) {
     return color;
@@ -154,7 +179,7 @@ export function rgbToHex(color) {
  * @param {string} color - HSL color values
  * @returns {string} rgb color values
  */
-export function hslToRgb(color) {
+function hslToRgb(color) {
   color = decomposeColor(color);
   const {
     values
@@ -183,7 +208,7 @@ export function hslToRgb(color) {
  * @param {string} color - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla(), color()
  * @returns {number} The relative brightness of the color in the range 0 - 1
  */
-export function getLuminance(color) {
+function getLuminance(color) {
   color = decomposeColor(color);
   let rgb = color.type === 'hsl' || color.type === 'hsla' ? decomposeColor(hslToRgb(color)).values : color.values;
   rgb = rgb.map(val => {
@@ -205,7 +230,7 @@ export function getLuminance(color) {
  * @param {string} background - CSS color, i.e. one of: #nnn, #nnnnnn, rgb(), rgba(), hsl(), hsla()
  * @returns {number} A contrast ratio value in the range 0 - 21.
  */
-export function getContrastRatio(foreground, background) {
+function getContrastRatio(foreground, background) {
   const lumA = getLuminance(foreground);
   const lumB = getLuminance(background);
   return (Math.max(lumA, lumB) + 0.05) / (Math.min(lumA, lumB) + 0.05);
@@ -218,7 +243,7 @@ export function getContrastRatio(foreground, background) {
  * @param {number} value - value to set the alpha channel to in the range 0 - 1
  * @returns {string} A CSS color string. Hex input values are returned as rgb
  */
-export function alpha(color, value) {
+function alpha(color, value) {
   color = decomposeColor(color);
   value = clampWrapper(value);
   if (color.type === 'rgb' || color.type === 'hsl') {
@@ -231,7 +256,7 @@ export function alpha(color, value) {
   }
   return recomposeColor(color);
 }
-export function private_safeAlpha(color, value, warning) {
+function private_safeAlpha(color, value, warning) {
   try {
     return alpha(color, value);
   } catch (error) {
@@ -248,7 +273,7 @@ export function private_safeAlpha(color, value, warning) {
  * @param {number} coefficient - multiplier in the range 0 - 1
  * @returns {string} A CSS color string. Hex input values are returned as rgb
  */
-export function darken(color, coefficient) {
+function darken(color, coefficient) {
   color = decomposeColor(color);
   coefficient = clampWrapper(coefficient);
   if (color.type.includes('hsl')) {
@@ -260,7 +285,7 @@ export function darken(color, coefficient) {
   }
   return recomposeColor(color);
 }
-export function private_safeDarken(color, coefficient, warning) {
+function private_safeDarken(color, coefficient, warning) {
   try {
     return darken(color, coefficient);
   } catch (error) {
@@ -277,7 +302,7 @@ export function private_safeDarken(color, coefficient, warning) {
  * @param {number} coefficient - multiplier in the range 0 - 1
  * @returns {string} A CSS color string. Hex input values are returned as rgb
  */
-export function lighten(color, coefficient) {
+function lighten(color, coefficient) {
   color = decomposeColor(color);
   coefficient = clampWrapper(coefficient);
   if (color.type.includes('hsl')) {
@@ -293,7 +318,7 @@ export function lighten(color, coefficient) {
   }
   return recomposeColor(color);
 }
-export function private_safeLighten(color, coefficient, warning) {
+function private_safeLighten(color, coefficient, warning) {
   try {
     return lighten(color, coefficient);
   } catch (error) {
@@ -311,10 +336,10 @@ export function private_safeLighten(color, coefficient, warning) {
  * @param {number} coefficient=0.15 - multiplier in the range 0 - 1
  * @returns {string} A CSS color string. Hex input values are returned as rgb
  */
-export function emphasize(color, coefficient = 0.15) {
+function emphasize(color, coefficient = 0.15) {
   return getLuminance(color) > 0.5 ? darken(color, coefficient) : lighten(color, coefficient);
 }
-export function private_safeEmphasize(color, coefficient, warning) {
+function private_safeEmphasize(color, coefficient, warning) {
   try {
     return emphasize(color, coefficient);
   } catch (error) {
@@ -333,7 +358,7 @@ export function private_safeEmphasize(color, coefficient, warning) {
  * @param {number} opacity - Opacity multiplier in the range 0 - 1
  * @param {number} [gamma=1.0] - Gamma correction factor. For gamma-correct blending, 2.2 is usual.
  */
-export function blend(background, overlay, opacity, gamma = 1.0) {
+function blend(background, overlay, opacity, gamma = 1.0) {
   const blendChannel = (b, o) => Math.round((b ** (1 / gamma) * (1 - opacity) + o ** (1 / gamma) * opacity) ** gamma);
   const backgroundColor = decomposeColor(background);
   const overlayColor = decomposeColor(overlay);

package/colorManipulator/index.js

@@ -1 +1,16 @@
-export * from "./colorManipulator.js";
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _colorManipulator = require("./colorManipulator");
+Object.keys(_colorManipulator).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _colorManipulator[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _colorManipulator[key];
+    }
+  });
+});

package/colorManipulator/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "./index.js",
-  "main": "../node/colorManipulator/index.js",
+  "module": "../esm/colorManipulator/index.js",
+  "main": "./index.js",
   "types": "./index.d.ts"
 }

package/compose/compose.js

@@ -1,4 +1,11 @@
-import merge from "../merge/index.js";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _merge = _interopRequireDefault(require("../merge"));
 function compose(...styles) {
   const handlers = styles.reduce((acc, style) => {
     style.filterProps.forEach(prop => {
@@ -12,7 +19,7 @@ function compose(...styles) {
   const fn = props => {
     return Object.keys(props).reduce((acc, prop) => {
       if (handlers[prop]) {
-        return merge(acc, handlers[prop](props));
+        return (0, _merge.default)(acc, handlers[prop](props));
       }
       return acc;
     }, {});
@@ -21,4 +28,4 @@ function compose(...styles) {
   fn.filterProps = styles.reduce((acc, style) => acc.concat(style.filterProps), []);
   return fn;
 }
-export default compose;
+var _default = exports.default = compose;

package/compose/index.js

@@ -1 +1,13 @@
-export { default } from "./compose.js";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _compose.default;
+  }
+});
+var _compose = _interopRequireDefault(require("./compose"));

package/compose/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "./index.js",
-  "main": "../node/compose/index.js",
+  "module": "../esm/compose/index.js",
+  "main": "./index.js",
   "types": "./index.d.ts"
 }

package/createBox/createBox.js

@@ -1,32 +1,39 @@
+"use strict";
 'use client';
 
-import * as React from 'react';
-import clsx from 'clsx';
-import styled from '@mui/styled-engine';
-import styleFunctionSx, { extendSxProp } from "../styleFunctionSx/index.js";
-import useTheme from "../useTheme/index.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-export default function createBox(options = {}) {
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = createBox;
+var React = _interopRequireWildcard(require("react"));
+var _clsx = _interopRequireDefault(require("clsx"));
+var _styledEngine = _interopRequireDefault(require("@mui/styled-engine"));
+var _styleFunctionSx = _interopRequireWildcard(require("../styleFunctionSx"));
+var _useTheme = _interopRequireDefault(require("../useTheme"));
+var _jsxRuntime = require("react/jsx-runtime");
+function createBox(options = {}) {
   const {
     themeId,
     defaultTheme,
     defaultClassName = 'MuiBox-root',
     generateClassName
   } = options;
-  const BoxRoot = styled('div', {
+  const BoxRoot = (0, _styledEngine.default)('div', {
     shouldForwardProp: prop => prop !== 'theme' && prop !== 'sx' && prop !== 'as'
-  })(styleFunctionSx);
+  })(_styleFunctionSx.default);
   const Box = /*#__PURE__*/React.forwardRef(function Box(inProps, ref) {
-    const theme = useTheme(defaultTheme);
+    const theme = (0, _useTheme.default)(defaultTheme);
     const {
       className,
       component = 'div',
       ...other
-    } = extendSxProp(inProps);
-    return /*#__PURE__*/_jsx(BoxRoot, {
+    } = (0, _styleFunctionSx.extendSxProp)(inProps);
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(BoxRoot, {
       as: component,
       ref: ref,
-      className: clsx(className, generateClassName ? generateClassName(defaultClassName) : defaultClassName),
+      className: (0, _clsx.default)(className, generateClassName ? generateClassName(defaultClassName) : defaultClassName),
       theme: themeId ? theme[themeId] || theme : theme,
       ...other
     });

package/createBox/index.js

@@ -1 +1,13 @@
-export { default } from "./createBox.js";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _createBox.default;
+  }
+});
+var _createBox = _interopRequireDefault(require("./createBox"));

package/createBox/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "./index.js",
-  "main": "../node/createBox/index.js",
+  "module": "../esm/createBox/index.js",
+  "main": "./index.js",
   "types": "./index.d.ts"
 }

package/createBreakpoints/createBreakpoints.js

@@ -1,6 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.breakpointKeys = void 0;
+exports.default = createBreakpoints;
 // Sorted ASC by size. That's important.
 // It can't be configured as it's used statically for propTypes.
-export const breakpointKeys = ['xs', 'sm', 'md', 'lg', 'xl'];
+const breakpointKeys = exports.breakpointKeys = ['xs', 'sm', 'md', 'lg', 'xl'];
 const sortBreakpointsValues = values => {
   const breakpointsAsArray = Object.keys(values).map(key => ({
     key,
@@ -17,7 +24,7 @@ const sortBreakpointsValues = values => {
 };
 
 // Keep in mind that @media is inclusive by the CSS specification.
-export default function createBreakpoints(breakpoints) {
+function createBreakpoints(breakpoints) {
   const {
     // The breakpoint **start** at this value.
     // For instance with the first breakpoint xs: [xs, sm).

package/createBreakpoints/index.js

@@ -1,3 +1,13 @@
-/** This export is intended for internal integration with Pigment CSS */
-/* eslint-disable import/prefer-default-export */
-export { default as unstable_createBreakpoints } from "./createBreakpoints.js";
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "unstable_createBreakpoints", {
+  enumerable: true,
+  get: function () {
+    return _createBreakpoints.default;
+  }
+});
+var _createBreakpoints = _interopRequireDefault(require("./createBreakpoints"));

package/createBreakpoints/package.json

@@ -1,6 +1,6 @@
 {
   "sideEffects": false,
-  "module": "./index.js",
-  "main": "../node/createBreakpoints/index.js",
+  "module": "../esm/createBreakpoints/index.js",
+  "main": "./index.js",
   "types": "./index.d.ts"
 }