@mui/system - npm Package Compare versions

Comparing version 5.14.1 to 5.14.3

Box/Box.d.ts

@@ -177,7 +177,2 @@ import * as React from 'react';
       children?: React.ReactNode;
-      /**
-       * The component used for the root node.
-       * Either a string to use a HTML element or a component.
-       */
-      component?: React.ElementType;
       ref?: React.Ref<unknown>;
@@ -207,4 +202,4 @@ /**
   P = {},
-> = OverrideProps<BoxTypeMap<P, D>, D>;
+> = OverrideProps<BoxTypeMap<P, D>, D> & { component?: React.ElementType };
 
 export default Box;

esm/Stack/createStack.js

@@ -104,4 +104,8 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
       return {
+        // The useFlexGap={false} implement relies on each child to give up control of the margin.
+        // We need to reset the margin to avoid double spacing.
+        '& > :not(style):not(style)': {
+          margin: 0
+        },
         '& > :not(style) ~ :not(style)': {
-          margin: 0,
           [`margin${getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)}`]: getValue(transformer, propValue)
@@ -108,0 +112,0 @@ }

esm/Unstable_Grid/Grid.js

@@ -115,2 +115,25 @@ 'use client';
   /**
+   * @internal
+   * The level of the grid starts from `0`
+   * and increases when the grid nests inside another grid regardless of container or item.
+   *
+   * ```js
+   * <Grid> // level 0
+   *   <Grid> // level 1
+   *     <Grid> // level 2
+   *   <Grid> // level 1
+   * ```
+   *
+   * Only consecutive grid is considered nesting.
+   * A grid container will start at `0` if there are non-Grid element above it.
+   *
+   * ```js
+   * <Grid> // level 0
+   *   <div>
+   *     <Grid> // level 0
+   *       <Grid> // level 1
+   * ```
+   */
+  unstable_level: PropTypes.number,
+  /**
    * Defines the `flex-wrap` style property.
@@ -117,0 +140,0 @@ * It's applied for all screen sizes.

index.js

 /**
- * @mui/system v5.14.1
+ * @mui/system v5.14.3
  *
@@ -4,0 +4,0 @@ * @license MIT

legacy/index.js

 /**
- * @mui/system v5.14.1
+ * @mui/system v5.14.3
  *
@@ -4,0 +4,0 @@ * @license MIT

legacy/Stack/createStack.js

@@ -108,5 +108,8 @@ import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
       return {
-        '& > :not(style) ~ :not(style)': _defineProperty({
+        // The useFlexGap={false} implement relies on each child to give up control of the margin.
+        // We need to reset the margin to avoid double spacing.
+        '& > :not(style):not(style)': {
           margin: 0
-        }, "margin".concat(getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)), getValue(transformer, propValue))
+        },
+        '& > :not(style) ~ :not(style)': _defineProperty({}, "margin".concat(getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)), getValue(transformer, propValue))
       };
@@ -113,0 +116,0 @@ };

legacy/Unstable_Grid/Grid.js

@@ -115,2 +115,25 @@ 'use client';
   /**
+   * @internal
+   * The level of the grid starts from `0`
+   * and increases when the grid nests inside another grid regardless of container or item.
+   *
+   * ```js
+   * <Grid> // level 0
+   *   <Grid> // level 1
+   *     <Grid> // level 2
+   *   <Grid> // level 1
+   * ```
+   *
+   * Only consecutive grid is considered nesting.
+   * A grid container will start at `0` if there are non-Grid element above it.
+   *
+   * ```js
+   * <Grid> // level 0
+   *   <div>
+   *     <Grid> // level 0
+   *       <Grid> // level 1
+   * ```
+   */
+  unstable_level: PropTypes.number,
+  /**
    * Defines the `flex-wrap` style property.
@@ -117,0 +140,0 @@ * It's applied for all screen sizes.

modern/index.js

 /**
- * @mui/system v5.14.1
+ * @mui/system v5.14.3
  *
@@ -4,0 +4,0 @@ * @license MIT

modern/Stack/createStack.js

@@ -104,4 +104,8 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
       return {
+        // The useFlexGap={false} implement relies on each child to give up control of the margin.
+        // We need to reset the margin to avoid double spacing.
+        '& > :not(style):not(style)': {
+          margin: 0
+        },
         '& > :not(style) ~ :not(style)': {
-          margin: 0,
           [`margin${getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)}`]: getValue(transformer, propValue)
@@ -108,0 +112,0 @@ }

modern/Unstable_Grid/Grid.js

@@ -115,2 +115,25 @@ 'use client';
   /**
+   * @internal
+   * The level of the grid starts from `0`
+   * and increases when the grid nests inside another grid regardless of container or item.
+   *
+   * ```js
+   * <Grid> // level 0
+   *   <Grid> // level 1
+   *     <Grid> // level 2
+   *   <Grid> // level 1
+   * ```
+   *
+   * Only consecutive grid is considered nesting.
+   * A grid container will start at `0` if there are non-Grid element above it.
+   *
+   * ```js
+   * <Grid> // level 0
+   *   <div>
+   *     <Grid> // level 0
+   *       <Grid> // level 1
+   * ```
+   */
+  unstable_level: PropTypes.number,
+  /**
    * Defines the `flex-wrap` style property.
@@ -117,0 +140,0 @@ * It's applied for all screen sizes.

package.json

 {
   "name": "@mui/system",
-  "version": "5.14.1",
+  "version": "5.14.3",
   "private": false,
@@ -50,4 +50,4 @@ "author": "MUI Team",
     "@mui/types": "^7.2.4",
-    "@mui/utils": "^5.14.1",
-    "clsx": "^1.2.1",
+    "@mui/utils": "^5.14.3",
+    "clsx": "^2.0.0",
     "csstype": "^3.1.2",
@@ -54,0 +54,0 @@ "prop-types": "^15.8.1"

Stack/createStack.js

@@ -114,4 +114,8 @@ "use strict";
       return {
+        // The useFlexGap={false} implement relies on each child to give up control of the margin.
+        // We need to reset the margin to avoid double spacing.
+        '& > :not(style):not(style)': {
+          margin: 0
+        },
         '& > :not(style) ~ :not(style)': {
-          margin: 0,
           [`margin${getSideFromDirection(breakpoint ? directionValues[breakpoint] : ownerState.direction)}`]: (0, _spacing.getValue)(transformer, propValue)
@@ -118,0 +122,0 @@ }

Unstable_Grid/Grid.js

@@ -121,2 +121,25 @@ "use strict";
   /**
+   * @internal
+   * The level of the grid starts from `0`
+   * and increases when the grid nests inside another grid regardless of container or item.
+   *
+   * ```js
+   * <Grid> // level 0
+   *   <Grid> // level 1
+   *     <Grid> // level 2
+   *   <Grid> // level 1
+   * ```
+   *
+   * Only consecutive grid is considered nesting.
+   * A grid container will start at `0` if there are non-Grid element above it.
+   *
+   * ```js
+   * <Grid> // level 0
+   *   <div>
+   *     <Grid> // level 0
+   *       <Grid> // level 1
+   * ```
+   */
+  unstable_level: _propTypes.default.number,
+  /**
    * Defines the `flex-wrap` style property.
@@ -123,0 +146,0 @@ * It's applied for all screen sizes.

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

1415350

increased by0.93%

Lines of code

20100

increased by0.51%

Worsened metrics

Number of medium supply chain risk alerts

1

increased byInfinity%

Published versions last months

5

decreased by-16.67%

Published versions last year

67

decreased by-1.47%

Dependency changes

• - Removedclsx@1.2.1(transitive)

• Updated@mui/utils@^5.14.3

• Updatedclsx@^2.0.0