@mui/system 5.15.15 → 6.0.0-alpha.1

package/node/propsToClassKey/index.js

@@ -0,0 +1,14 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _propsToClassKey.default;
+  }
+});
+var _propsToClassKey = _interopRequireDefault(require("./propsToClassKey"));

package/node/responsivePropType/index.js

@@ -0,0 +1,14 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _responsivePropType.default;
+  }
+});
+var _responsivePropType = _interopRequireDefault(require("./responsivePropType"));

package/node/shadows/index.js

@@ -0,0 +1,14 @@
+"use strict";
+'use client';
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _shadows.default;
+  }
+});
+var _shadows = _interopRequireDefault(require("./shadows"));

package/{shadows.js → node/shadows/shadows.js}

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _style = _interopRequireDefault(require("./style"));
+var _style = _interopRequireDefault(require("../style"));
 const boxShadow = (0, _style.default)({
   prop: 'boxShadow',
   themeKey: 'shadows'

package/node/sizing/index.js

@@ -0,0 +1,27 @@
+"use strict";
+'use client';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _sizing.default;
+  }
+});
+var _sizing = _interopRequireWildcard(require("./sizing"));
+Object.keys(_sizing).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _sizing[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _sizing[key];
+    }
+  });
+});
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }

package/{sizing.js → node/sizing/sizing.js}

@@ -7,9 +7,9 @@ Object.defineProperty(exports, "__esModule", {
 exports.sizeWidth = exports.sizeHeight = exports.minWidth = exports.minHeight = exports.maxWidth = exports.maxHeight = exports.height = exports.default = exports.boxSizing = void 0;
 exports.sizingTransform = sizingTransform;
 exports.width = void 0;
-var _style = _interopRequireDefault(require("./style"));
-var _compose = _interopRequireDefault(require("./compose"));
-var _breakpoints = require("./breakpoints");
+var _style = _interopRequireDefault(require("../style"));
+var _compose = _interopRequireDefault(require("../compose"));
+var _breakpoints = require("../breakpoints");
 function sizingTransform(value) {
   return value <= 1 && value !== 0 ? `${value * 100}%` : value;
 }

package/node/spacing/index.js

@@ -0,0 +1,27 @@
+"use strict";
+'use client';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _spacing.default;
+  }
+});
+var _spacing = _interopRequireWildcard(require("./spacing"));
+Object.keys(_spacing).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _spacing[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _spacing[key];
+    }
+  });
+});
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }

package/{spacing.js → node/spacing/spacing.js}

@@ -13,11 +13,11 @@ exports.margin = margin;
 exports.marginKeys = void 0;
 exports.padding = padding;
 exports.paddingKeys = void 0;
-var _responsivePropType = _interopRequireDefault(require("./responsivePropType"));
-var _breakpoints = require("./breakpoints");
-var _style = require("./style");
-var _merge = _interopRequireDefault(require("./merge"));
-var _memoize = _interopRequireDefault(require("./memoize"));
+var _responsivePropType = _interopRequireDefault(require("../responsivePropType"));
+var _breakpoints = require("../breakpoints");
+var _style = require("../style");
+var _merge = _interopRequireDefault(require("../merge"));
+var _memoize = _interopRequireDefault(require("../memoize"));
 const properties = {
   m: 'margin',
   p: 'padding'
@@ -59,25 +59,29 @@ const paddingKeys = exports.paddingKeys = ['p', 'pt', 'pr', 'pb', 'pl', 'px', 'p
 const spacingKeys = [...marginKeys, ...paddingKeys];
 function createUnaryUnit(theme, themeKey, defaultValue, propName) {
   var _getPath;
-  const themeSpacing = (_getPath = (0, _style.getPath)(theme, themeKey, false)) != null ? _getPath : defaultValue;
-  if (typeof themeSpacing === 'number') {
-    return abs => {
-      if (typeof abs === 'string') {
-        return abs;
+  const themeSpacing = (_getPath = (0, _style.getPath)(theme, themeKey, true)) != null ? _getPath : defaultValue;
+  if (typeof themeSpacing === 'number' || typeof themeSpacing === 'string') {
+    return val => {
+      if (typeof val === 'string') {
+        return val;
       }
       if (process.env.NODE_ENV !== 'production') {
-        if (typeof abs !== 'number') {
-          console.error(`MUI: Expected ${propName} argument to be a number or a string, got ${abs}.`);
+        if (typeof val !== 'number') {
+          console.error(`MUI: Expected ${propName} argument to be a number or a string, got ${val}.`);
         }
       }
-      return themeSpacing * abs;
+      if (typeof themeSpacing === 'string') {
+        return `calc(${val} * ${themeSpacing})`;
+      }
+      return themeSpacing * val;
     };
   }
   if (Array.isArray(themeSpacing)) {
-    return abs => {
-      if (typeof abs === 'string') {
-        return abs;
+    return val => {
+      if (typeof val === 'string') {
+        return val;
       }
+      const abs = Math.abs(val);
       if (process.env.NODE_ENV !== 'production') {
         if (!Number.isInteger(abs)) {
           console.error([`MUI: The \`theme.${themeKey}\` array type cannot be combined with non integer values.` + `You should either use an integer value that can be used as index, or define the \`theme.${themeKey}\` as a number.`].join('\n'));
@@ -85,7 +89,14 @@ function createUnaryUnit(theme, themeKey, defaultValue, propName) {
           console.error([`MUI: The value provided (${abs}) overflows.`, `The supported values are: ${JSON.stringify(themeSpacing)}.`, `${abs} > ${themeSpacing.length - 1}, you need to add the missing values.`].join('\n'));
         }
       }
-      return themeSpacing[abs];
+      const transformed = themeSpacing[abs];
+      if (val >= 0) {
+        return transformed;
+      }
+      if (typeof transformed === 'number') {
+        return -transformed;
+      }
+      return `-${transformed}`;
     };
   }
   if (typeof themeSpacing === 'function') {
@@ -103,15 +114,7 @@ function getValue(transformer, propValue) {
   if (typeof propValue === 'string' || propValue == null) {
     return propValue;
   }
-  const abs = Math.abs(propValue);
-  const transformed = transformer(abs);
-  if (propValue >= 0) {
-    return transformed;
-  }
-  if (typeof transformed === 'number') {
-    return -transformed;
-  }
-  return `-${transformed}`;
+  return transformer(propValue);
 }
 function getStyleFromPropValue(cssProperties, transformer) {
   return propValue => cssProperties.reduce((acc, cssProperty) => {

package/node/style/index.js

@@ -0,0 +1,27 @@
+"use strict";
+'use client';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var _exportNames = {};
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _style.default;
+  }
+});
+var _style = _interopRequireWildcard(require("./style"));
+Object.keys(_style).forEach(function (key) {
+  if (key === "default" || key === "__esModule") return;
+  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
+  if (key in exports && exports[key] === _style[key]) return;
+  Object.defineProperty(exports, key, {
+    enumerable: true,
+    get: function () {
+      return _style[key];
+    }
+  });
+});
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }

package/{style.js → node/style/style.js}

@@ -8,8 +8,8 @@ exports.default = void 0;
 exports.getPath = getPath;
 exports.getStyleValue = getStyleValue;
 var _capitalize = _interopRequireDefault(require("@mui/utils/capitalize"));
-var _responsivePropType = _interopRequireDefault(require("./responsivePropType"));
-var _breakpoints = require("./breakpoints");
+var _responsivePropType = _interopRequireDefault(require("../responsivePropType"));
+var _breakpoints = require("../breakpoints");
 function getPath(obj, path, checkVars = true) {
   if (!path || typeof path !== 'string') {
     return null;

package/{esm → node}/styleFunctionSx/defaultSxConfig.js

@@ -1,29 +1,35 @@
-import { padding, margin } from '../spacing';
-import { borderRadius, borderTransform } from '../borders';
-import { gap, rowGap, columnGap } from '../cssGrid';
-import { paletteTransform } from '../palette';
-import { maxWidth, sizingTransform } from '../sizing';
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _spacing = require("../spacing");
+var _borders = require("../borders");
+var _cssGrid = require("../cssGrid");
+var _palette = require("../palette");
+var _sizing = require("../sizing");
 const defaultSxConfig = {
   // borders
   border: {
     themeKey: 'borders',
-    transform: borderTransform
+    transform: _borders.borderTransform
   },
   borderTop: {
     themeKey: 'borders',
-    transform: borderTransform
+    transform: _borders.borderTransform
   },
   borderRight: {
     themeKey: 'borders',
-    transform: borderTransform
+    transform: _borders.borderTransform
   },
   borderBottom: {
     themeKey: 'borders',
-    transform: borderTransform
+    transform: _borders.borderTransform
   },
   borderLeft: {
     themeKey: 'borders',
-    transform: borderTransform
+    transform: _borders.borderTransform
   },
   borderColor: {
     themeKey: 'palette'
@@ -42,149 +48,149 @@ const defaultSxConfig = {
   },
   outline: {
     themeKey: 'borders',
-    transform: borderTransform
+    transform: _borders.borderTransform
   },
   outlineColor: {
     themeKey: 'palette'
   },
   borderRadius: {
     themeKey: 'shape.borderRadius',
-    style: borderRadius
+    style: _borders.borderRadius
   },
   // palette
   color: {
     themeKey: 'palette',
-    transform: paletteTransform
+    transform: _palette.paletteTransform
   },
   bgcolor: {
     themeKey: 'palette',
     cssProperty: 'backgroundColor',
-    transform: paletteTransform
+    transform: _palette.paletteTransform
   },
   backgroundColor: {
     themeKey: 'palette',
-    transform: paletteTransform
+    transform: _palette.paletteTransform
   },
   // spacing
   p: {
-    style: padding
+    style: _spacing.padding
   },
   pt: {
-    style: padding
+    style: _spacing.padding
   },
   pr: {
-    style: padding
+    style: _spacing.padding
   },
   pb: {
-    style: padding
+    style: _spacing.padding
   },
   pl: {
-    style: padding
+    style: _spacing.padding
   },
   px: {
-    style: padding
+    style: _spacing.padding
   },
   py: {
-    style: padding
+    style: _spacing.padding
   },
   padding: {
-    style: padding
+    style: _spacing.padding
   },
   paddingTop: {
-    style: padding
+    style: _spacing.padding
   },
   paddingRight: {
-    style: padding
+    style: _spacing.padding
   },
   paddingBottom: {
-    style: padding
+    style: _spacing.padding
   },
   paddingLeft: {
-    style: padding
+    style: _spacing.padding
   },
   paddingX: {
-    style: padding
+    style: _spacing.padding
   },
   paddingY: {
-    style: padding
+    style: _spacing.padding
   },
   paddingInline: {
-    style: padding
+    style: _spacing.padding
   },
   paddingInlineStart: {
-    style: padding
+    style: _spacing.padding
   },
   paddingInlineEnd: {
-    style: padding
+    style: _spacing.padding
   },
   paddingBlock: {
-    style: padding
+    style: _spacing.padding
   },
   paddingBlockStart: {
-    style: padding
+    style: _spacing.padding
   },
   paddingBlockEnd: {
-    style: padding
+    style: _spacing.padding
   },
   m: {
-    style: margin
+    style: _spacing.margin
   },
   mt: {
-    style: margin
+    style: _spacing.margin
   },
   mr: {
-    style: margin
+    style: _spacing.margin
   },
   mb: {
-    style: margin
+    style: _spacing.margin
   },
   ml: {
-    style: margin
+    style: _spacing.margin
   },
   mx: {
-    style: margin
+    style: _spacing.margin
   },
   my: {
-    style: margin
+    style: _spacing.margin
   },
   margin: {
-    style: margin
+    style: _spacing.margin
   },
   marginTop: {
-    style: margin
+    style: _spacing.margin
   },
   marginRight: {
-    style: margin
+    style: _spacing.margin
   },
   marginBottom: {
-    style: margin
+    style: _spacing.margin
   },
   marginLeft: {
-    style: margin
+    style: _spacing.margin
   },
   marginX: {
-    style: margin
+    style: _spacing.margin
   },
   marginY: {
-    style: margin
+    style: _spacing.margin
   },
   marginInline: {
-    style: margin
+    style: _spacing.margin
   },
   marginInlineStart: {
-    style: margin
+    style: _spacing.margin
   },
   marginInlineEnd: {
-    style: margin
+    style: _spacing.margin
   },
   marginBlock: {
-    style: margin
+    style: _spacing.margin
   },
   marginBlockStart: {
-    style: margin
+    style: _spacing.margin
   },
   marginBlockEnd: {
-    style: margin
+    style: _spacing.margin
   },
   // display
   displayPrint: {
@@ -216,13 +222,13 @@ const defaultSxConfig = {
   justifySelf: {},
   // grid
   gap: {
-    style: gap
+    style: _cssGrid.gap
   },
   rowGap: {
-    style: rowGap
+    style: _cssGrid.rowGap
   },
   columnGap: {
-    style: columnGap
+    style: _cssGrid.columnGap
   },
   gridColumn: {},
   gridRow: {},
@@ -248,22 +254,22 @@ const defaultSxConfig = {
   },
   // sizing
   width: {
-    transform: sizingTransform
+    transform: _sizing.sizingTransform
   },
   maxWidth: {
-    style: maxWidth
+    style: _sizing.maxWidth
   },
   minWidth: {
-    transform: sizingTransform
+    transform: _sizing.sizingTransform
   },
   height: {
-    transform: sizingTransform
+    transform: _sizing.sizingTransform
   },
   maxHeight: {
-    transform: sizingTransform
+    transform: _sizing.sizingTransform
   },
   minHeight: {
-    transform: sizingTransform
+    transform: _sizing.sizingTransform
   },
   boxSizing: {},
   // typography
@@ -288,4 +294,4 @@ const defaultSxConfig = {
     themeKey: 'typography'
   }
 };
-export default defaultSxConfig;
+var _default = exports.default = defaultSxConfig;

package/node/styleFunctionSx/extendSxProp.js

@@ -0,0 +1,55 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = extendSxProp;
+var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
+var _deepmerge = require("@mui/utils/deepmerge");
+var _defaultSxConfig = _interopRequireDefault(require("./defaultSxConfig"));
+const _excluded = ["sx"];
+const splitProps = props => {
+  var _props$theme$unstable, _props$theme;
+  const result = {
+    systemProps: {},
+    otherProps: {}
+  };
+  const config = (_props$theme$unstable = props == null || (_props$theme = props.theme) == null ? void 0 : _props$theme.unstable_sxConfig) != null ? _props$theme$unstable : _defaultSxConfig.default;
+  Object.keys(props).forEach(prop => {
+    if (config[prop]) {
+      result.systemProps[prop] = props[prop];
+    } else {
+      result.otherProps[prop] = props[prop];
+    }
+  });
+  return result;
+};
+function extendSxProp(props) {
+  const {
+      sx: inSx
+    } = props,
+    other = (0, _objectWithoutPropertiesLoose2.default)(props, _excluded);
+  const {
+    systemProps,
+    otherProps
+  } = splitProps(other);
+  let finalSx;
+  if (Array.isArray(inSx)) {
+    finalSx = [systemProps, ...inSx];
+  } else if (typeof inSx === 'function') {
+    finalSx = (...args) => {
+      const result = inSx(...args);
+      if (!(0, _deepmerge.isPlainObject)(result)) {
+        return systemProps;
+      }
+      return (0, _extends2.default)({}, systemProps, result);
+    };
+  } else {
+    finalSx = (0, _extends2.default)({}, systemProps, inSx);
+  }
+  return (0, _extends2.default)({}, otherProps, {
+    sx: finalSx
+  });
+}

package/node/styleFunctionSx/index.js

@@ -0,0 +1,35 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "default", {
+  enumerable: true,
+  get: function () {
+    return _styleFunctionSx.default;
+  }
+});
+Object.defineProperty(exports, "extendSxProp", {
+  enumerable: true,
+  get: function () {
+    return _extendSxProp.default;
+  }
+});
+Object.defineProperty(exports, "unstable_createStyleFunctionSx", {
+  enumerable: true,
+  get: function () {
+    return _styleFunctionSx.unstable_createStyleFunctionSx;
+  }
+});
+Object.defineProperty(exports, "unstable_defaultSxConfig", {
+  enumerable: true,
+  get: function () {
+    return _defaultSxConfig.default;
+  }
+});
+var _styleFunctionSx = _interopRequireWildcard(require("./styleFunctionSx"));
+var _extendSxProp = _interopRequireDefault(require("./extendSxProp"));
+var _defaultSxConfig = _interopRequireDefault(require("./defaultSxConfig"));
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }