@manifest-ui/styled - npm Package Compare versions

Comparing version 0.0.9 to 0.0.10

lib/isStyleProp.js

@@ -8,11 +8,9 @@ "use strict";
 
-var styledProps = (0, _styledSystem.compose)(_styledSystem.background, _styledSystem.border, _styledSystem.color, _styledSystem.flexbox, _styledSystem.grid, _styledSystem.layout, _styledSystem.other, _styledSystem.position, _styledSystem.shadow, _styledSystem.space, _styledSystem.transition, _styledSystem.typography);
+const styledProps = (0, _styledSystem.compose)(_styledSystem.background, _styledSystem.border, _styledSystem.color, _styledSystem.flexbox, _styledSystem.grid, _styledSystem.layout, _styledSystem.other, _styledSystem.position, _styledSystem.shadow, _styledSystem.space, _styledSystem.transition, _styledSystem.typography);
 exports.styledProps = styledProps;
-var systemProps = [].concat(styledProps.propNames);
+const systemProps = [...styledProps.propNames];
 exports.systemProps = systemProps;
 
-var isStyleProp = function isStyleProp(prop) {
-  return systemProps.includes(prop);
-};
+const isStyleProp = prop => systemProps.includes(prop);
 
 exports.isStyleProp = isStyleProp;

lib/shouldForwardProp.js

@@ -8,8 +8,6 @@ "use strict";
 
-var props = new Set([].concat(_isStyleProp.systemProps, ['as', 'size', 'sx', 'theme', 'variant']));
+const props = new Set([..._isStyleProp.systemProps, 'as', 'size', 'sx', 'theme', 'variant']);
 
-var shouldForwardProp = function shouldForwardProp(prop) {
-  return !props.has(prop);
-};
+const shouldForwardProp = prop => !props.has(prop);
 
 exports.shouldForwardProp = shouldForwardProp;

lib/styled.js

@@ -21,57 +21,41 @@ "use strict";
 
-var _excluded = ["size", "sx", "theme", "variant"];
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-
 function createStyled() {
-  return function (tag, options) {
-    var _ref = options != null ? options : {},
-        label = _ref.label,
-        _ref$shouldForwardPro = _ref.shouldForwardProp,
-        shouldForwardProp = _ref$shouldForwardPro === void 0 ? _shouldForwardProp.shouldForwardProp : _ref$shouldForwardPro,
-        _ref$slot = _ref.slot,
-        slotOption = _ref$slot === void 0 ? 'root' : _ref$slot,
-        _ref$themeKey = _ref.themeKey,
-        themeKey = _ref$themeKey === void 0 ? '' : _ref$themeKey;
-
-    var emotionResolver = (0, _styled["default"])(tag, {
-      label: label,
-      shouldForwardProp: shouldForwardProp
+  return (tag, options) => {
+    const {
+      label,
+      shouldForwardProp = _shouldForwardProp.shouldForwardProp,
+      slot: slotOption = 'root',
+      themeKey = ''
+    } = options ?? {};
+    const emotionResolver = (0, _styled.default)(tag, {
+      label,
+      shouldForwardProp
     });
 
-    var styleResolver = function styleResolver() {
-      for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-        args[_key] = arguments[_key];
-      }
-
-      var styleArgs = args.map(function (interpolation) {
-        return function (props) {
-          var _theme$components, _slots$slotOption;
-
-          var sizeProp = props.size,
-              sx = props.sx,
-              themeProp = props.theme,
-              variantProp = props.variant,
-              other = _objectWithoutPropertiesLoose(props, _excluded);
-
-          var theme = (0, _lodash["default"])(themeProp) ? _themes.defaultTheme : themeProp;
-          var componentTheme = theme == null ? void 0 : (_theme$components = theme.components) == null ? void 0 : _theme$components[themeKey];
-          var slots = componentTheme == null ? void 0 : componentTheme.slots;
-          var slot = (_slots$slotOption = slots == null ? void 0 : slots[slotOption]) != null ? _slots$slotOption : {};
-          var sizes = componentTheme == null ? void 0 : componentTheme.sizes;
-          var variants = componentTheme == null ? void 0 : componentTheme.variants;
-          var baseStyles = typeof interpolation === 'function' ? interpolation(_extends({}, props, {
-            theme: theme
-          })) : interpolation;
-          var mergedStyles = Object.assign({}, baseStyles, slot);
-          var styleProps = (0, _lodash2["default"])(other, function (_, prop) {
-            return !(0, _isStyleProp.isStyleProp)(prop);
-          });
-          var size = sizeProp ? sizes == null ? void 0 : sizes[sizeProp] : {};
-          var variant = variantProp ? variants == null ? void 0 : variants[variantProp] : {};
-          var composedStyles = Object.assign({}, mergedStyles, size, variant, styleProps, sx);
+    const styleResolver = (...args) => {
+      const styleArgs = args.map(interpolation => {
+        return props => {
+          const {
+            size: sizeProp,
+            sx,
+            theme: themeProp,
+            variant: variantProp,
+            ...other
+          } = props;
+          const theme = (0, _lodash.default)(themeProp) ? _themes.defaultTheme : themeProp;
+          const componentTheme = theme?.components?.[themeKey];
+          const slots = componentTheme?.slots;
+          const slot = slots?.[slotOption] ?? {};
+          const sizes = componentTheme?.sizes;
+          const variants = componentTheme?.variants;
+          const baseStyles = typeof interpolation === 'function' ? interpolation({ ...props,
+            theme
+          }) : interpolation;
+          const mergedStyles = Object.assign({}, baseStyles, slot);
+          const styleProps = (0, _lodash2.default)(other, (_, prop) => !(0, _isStyleProp.isStyleProp)(prop));
+          const size = sizeProp ? sizes?.[sizeProp] : {};
+          const variant = variantProp ? variants?.[variantProp] : {};
+          const composedStyles = Object.assign({}, mergedStyles, size, variant, styleProps, sx);
           return (0, _styledSystem.css)(composedStyles)(theme);
@@ -87,3 +71,3 @@ };
 
-var styled = createStyled();
+const styled = createStyled();
 exports.styled = styled;

package.json

 {
   "name": "@manifest-ui/styled",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "main": "./lib/index.js",
@@ -24,3 +24,3 @@ "types": "./dts/index.d.ts",
   "dependencies": {
-    "@manifest-ui/styled-system": "^0.0.7",
+    "@manifest-ui/styled-system": "^0.0.8",
     "@manifest-ui/themes": "^0.2.3",
@@ -27,0 +27,0 @@ "lodash.isempty": "^4.4.0",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

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

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

21449

decreased by-7.32%

Lines of code

493

decreased by-2.95%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Added@manifest-ui/styled-system@0.0.8(transitive)

• + Addedlodash.isstring@4.0.1(transitive)

• - Removed@manifest-ui/styled-system@0.0.7(transitive)

• Updated@manifest-ui/styled-system@^0.0.8