@material-ui/system - npm Package Compare versions

Comparing version 5.0.0-beta.0 to 5.0.0-beta.1

createStyled.js

@@ -81,3 +81,5 @@ "use strict";
 
-const shouldForwardProp = prop => prop !== 'styleProps' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
+const shouldForwardProp = prop => {
+  return prop !== 'styleProps' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
+};
 
@@ -84,0 +86,0 @@ exports.shouldForwardProp = shouldForwardProp;

esm/createStyled.js

@@ -65,3 +65,5 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 
-export const shouldForwardProp = prop => prop !== 'styleProps' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
+export const shouldForwardProp = prop => {
+  return prop !== 'styleProps' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
+};
 export const systemDefaultTheme = createTheme();
@@ -68,0 +70,0 @@

esm/index.js

@@ -33,2 +33,3 @@ export { css, keyframes, GlobalStyles, StyledEngineProvider } from '@material-ui/styled-engine';
 export { default as createBreakpoints } from './createTheme/createBreakpoints';
+export { default as createSpacing } from './createTheme/createSpacing';
 export { default as shape } from './createTheme/shape';
@@ -35,0 +36,0 @@ export { default as useThemeProps, getThemeProps } from './useThemeProps';

esm/sizing.js

 import style from './style';
 import compose from './compose';
+import { handleBreakpoints } from './breakpoints';
 
@@ -12,6 +13,17 @@ function transform(value) {
 });
-export const maxWidth = style({
-  prop: 'maxWidth',
-  transform
-});
+export const maxWidth = props => {
+  if (props.maxWidth) {
+    const styleFromPropValue = propValue => {
+      const breakpoint = props.theme.breakpoints.values[propValue];
+      return {
+        maxWidth: breakpoint || transform(propValue)
+      };
+    };
+
+    return handleBreakpoints(props, props.maxWidth, styleFromPropValue);
+  }
+
+  return null;
+};
+maxWidth.filterProps = ['maxWidth'];
 export const minWidth = style({
@@ -18,0 +30,0 @@ prop: 'minWidth',

index.d.ts

@@ -139,2 +139,3 @@ import {
 
+export { default as createSpacing } from './createTheme/createSpacing';
 export { SpacingOptions, Spacing } from './createTheme/createSpacing';
@@ -141,0 +142,0 @@

index.js

@@ -1,2 +0,2 @@
-/** @license Material-UI v5.0.0-beta.0
+/** @license Material-UI v5.0.0-beta.1
  *
@@ -43,2 +43,3 @@ * This source code is licensed under the MIT license found in the
   createBreakpoints: true,
+  createSpacing: true,
   shape: true,
@@ -225,2 +226,8 @@ useThemeProps: true,
 });
+Object.defineProperty(exports, "createSpacing", {
+  enumerable: true,
+  get: function () {
+    return _createSpacing.default;
+  }
+});
 Object.defineProperty(exports, "shape", {
@@ -415,2 +422,4 @@ enumerable: true,
 
+var _createSpacing = _interopRequireDefault(require("./createTheme/createSpacing"));
+
 var _shape = _interopRequireDefault(require("./createTheme/shape"));
@@ -417,0 +426,0 @@

legacy/index.js

@@ -1,2 +0,2 @@
-/** @license Material-UI v5.0.0-beta.0
+/** @license Material-UI v5.0.0-beta.1
  *
@@ -38,2 +38,3 @@ * This source code is licensed under the MIT license found in the
 export { default as createBreakpoints } from './createTheme/createBreakpoints';
+export { default as createSpacing } from './createTheme/createSpacing';
 export { default as shape } from './createTheme/shape';
@@ -40,0 +41,0 @@ export { default as useThemeProps, getThemeProps } from './useThemeProps';

legacy/sizing.js

 import style from './style';
 import compose from './compose';
+import { handleBreakpoints } from './breakpoints';
 
@@ -12,6 +13,17 @@ function transform(value) {
 });
-export var maxWidth = style({
-  prop: 'maxWidth',
-  transform: transform
-});
+export var maxWidth = function maxWidth(props) {
+  if (props.maxWidth) {
+    var styleFromPropValue = function styleFromPropValue(propValue) {
+      var breakpoint = props.theme.breakpoints.values[propValue];
+      return {
+        maxWidth: breakpoint || transform(propValue)
+      };
+    };
+
+    return handleBreakpoints(props, props.maxWidth, styleFromPropValue);
+  }
+
+  return null;
+};
+maxWidth.filterProps = ['maxWidth'];
 export var minWidth = style({
@@ -18,0 +30,0 @@ prop: 'minWidth',

modern/createStyled.js

@@ -63,3 +63,5 @@ import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
 
-export const shouldForwardProp = prop => prop !== 'styleProps' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
+export const shouldForwardProp = prop => {
+  return prop !== 'styleProps' && prop !== 'theme' && prop !== 'sx' && prop !== 'as';
+};
 export const systemDefaultTheme = createTheme();
@@ -66,0 +68,0 @@

modern/index.js

@@ -1,2 +0,2 @@
-/** @license Material-UI v5.0.0-beta.0
+/** @license Material-UI v5.0.0-beta.1
  *
@@ -38,2 +38,3 @@ * This source code is licensed under the MIT license found in the
 export { default as createBreakpoints } from './createTheme/createBreakpoints';
+export { default as createSpacing } from './createTheme/createSpacing';
 export { default as shape } from './createTheme/shape';
@@ -40,0 +41,0 @@ export { default as useThemeProps, getThemeProps } from './useThemeProps';

modern/sizing.js

 import style from './style';
 import compose from './compose';
+import { handleBreakpoints } from './breakpoints';
 
@@ -12,6 +13,17 @@ function transform(value) {
 });
-export const maxWidth = style({
-  prop: 'maxWidth',
-  transform
-});
+export const maxWidth = props => {
+  if (props.maxWidth) {
+    const styleFromPropValue = propValue => {
+      const breakpoint = props.theme.breakpoints.values[propValue];
+      return {
+        maxWidth: breakpoint || transform(propValue)
+      };
+    };
+
+    return handleBreakpoints(props, props.maxWidth, styleFromPropValue);
+  }
+
+  return null;
+};
+maxWidth.filterProps = ['maxWidth'];
 export const minWidth = style({
@@ -18,0 +30,0 @@ prop: 'minWidth',

package.json

 {
   "name": "@material-ui/system",
-  "version": "5.0.0-beta.0",
+  "version": "5.0.0-beta.1",
   "private": false,
@@ -23,3 +23,3 @@ "author": "Material-UI Team",
   },
-  "homepage": "https://material-ui.com/system/basics/",
+  "homepage": "https://next.material-ui.com/system/basics/",
   "funding": {
@@ -48,4 +48,4 @@ "type": "opencollective",
     "@babel/runtime": "^7.4.4",
-    "@material-ui/private-theming": "5.0.0-beta.0",
-    "@material-ui/styled-engine": "5.0.0-beta.0",
+    "@material-ui/private-theming": "5.0.0-beta.1",
+    "@material-ui/styled-engine": "5.0.0-beta.1",
     "@material-ui/types": "6.0.1",
@@ -52,0 +52,0 @@ "@material-ui/utils": "5.0.0-beta.0",

sizing.js

@@ -14,2 +14,4 @@ "use strict";
 
+var _breakpoints = require("./breakpoints");
+
 function transform(value) {
@@ -24,7 +26,20 @@ return value <= 1 ? `${value * 100}%` : value;
 exports.width = width;
-const maxWidth = (0, _style.default)({
-  prop: 'maxWidth',
-  transform
-});
+
+const maxWidth = props => {
+  if (props.maxWidth) {
+    const styleFromPropValue = propValue => {
+      const breakpoint = props.theme.breakpoints.values[propValue];
+      return {
+        maxWidth: breakpoint || transform(propValue)
+      };
+    };
+
+    return (0, _breakpoints.handleBreakpoints)(props, props.maxWidth, styleFromPropValue);
+  }
+
+  return null;
+};
+
 exports.maxWidth = maxWidth;
+maxWidth.filterProps = ['maxWidth'];
 const minWidth = (0, _style.default)({
@@ -31,0 +46,0 @@ prop: 'minWidth',

Fixed 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

1120116

increased by0.75%

Lines of code

8052

increased by0.73%

Number of medium supply chain risk alerts

0

decreased by-100%

Dependency changes

• + Added@material-ui/private-theming@5.0.0-beta.1(transitive)

• + Added@material-ui/styled-engine@5.0.0-beta.1(transitive)

• - Removed@material-ui/private-theming@5.0.0-beta.0(transitive)

• - Removed@material-ui/styled-engine@5.0.0-beta.0(transitive)

• Updated@material-ui/private-theming@5.0.0-beta.1

• Updated@material-ui/styled-engine@5.0.0-beta.1