@welcome-ui/tag - npm Package Compare versions

Comparing version 1.0.28-alpha.0 to 1.0.30-alpha.0

dist/tag.cjs.js

@@ -12,2 +12,3 @@ 'use strict';
 var icons_cross = require('@welcome-ui/icons.cross');
+var utils = require('@welcome-ui/utils');
 require('prop-types');
@@ -17,60 +18,6 @@ var _taggedTemplateLiteralLoose = _interopDefault(require('@babel/runtime/helpers/taggedTemplateLiteralLoose'));
 var styled__default = _interopDefault(styled);
-var S = require('@xstyled/system');
+var system = require('@xstyled/system');
 var icon = require('@welcome-ui/icon');
-require('lodash.difference');
+var system$1 = require('@welcome-ui/system');
 
-var wrap = function wrap(children) {
-  return React__default.Children.toArray(children).map(function (child) {
-    return ['number', 'string'].includes(typeof child) ? React__default.createElement("span", {
-      key: child
-    }, child) : child;
-  });
-};
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-var overflowEllipsis =
-/*#__PURE__*/
-styled.css(
-/*#__PURE__*/
-_templateObject());
-
-var getMax = function getMax(width, height) {
-  if (height === void 0) {
-    height = width;
-  }
-
-  var widthValue = parseInt(width, 10);
-  var heightValue = parseInt(height, 10);
-  var diff = widthValue - heightValue;
-  return diff >= 0 ? width : height;
-};
-
-var systemProps = [S.backgrounds, S.basics, S.borders, S.color, S.display, S.flexboxes, S.grids, S.height, S.maxHeight, S.maxWidth, S.minHeight, S.minWidth, S.positioning, S.space, S.typography, S.verticalAlign, S.width];
-var system =
-/*#__PURE__*/
-S.compose.apply(void 0, systemProps);
-
-function _templateObject$1() {
-  var data = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"]);
-
-  _templateObject$1 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-var centerContent =
-/*#__PURE__*/
-styled.css(
-/*#__PURE__*/
-_templateObject$1());
-
 function _templateObject5() {
@@ -116,6 +63,6 @@ var data = _taggedTemplateLiteralLoose(["\n    position: absolute;\n    ", ";\n    top: 0;\n    bottom: 0;\n    right: 0;\n    ", ";\n  "]);
 
-function _templateObject$2() {
+function _templateObject() {
   var data = _taggedTemplateLiteralLoose(["\n  ", "\n  padding: 0;\n  ", "\n  ", ";\n"]);
 
-  _templateObject$2 = function _templateObject() {
+  _templateObject = function _templateObject() {
     return data;
@@ -132,3 +79,3 @@ };
 
-  return styled.css(_templateObject$2(), S.th("tags.shape." + shape + "." + size), (width || height) && styled.css(_templateObject2(), getMax(width || 0, height), getMax(width || 0, height)), shape === 'circle' && 'border-radius: 50%');
+  return styled.css(_templateObject(), system.th("tags.shape." + shape + "." + size), (width || height) && styled.css(_templateObject2(), utils.getMax(width || 0, height), utils.getMax(width || 0, height)), shape === 'circle' && 'border-radius: 50%');
 };
@@ -146,5 +93,5 @@
       width = _ref.width;
-  return styled.css(_templateObject3(), S.th('tags.default'), S.th("tags.variants." + variant), S.th("tags.sizes." + size), hasAction && styled.css(_templateObject4()), overflowEllipsis, system, (shape || length === 1) && shapeStyles(size, width, height, shape),
+  return styled.css(_templateObject3(), system.th('tags.default'), system.th("tags.variants." + variant), system.th("tags.sizes." + size), hasAction && styled.css(_templateObject4()), utils.overflowEllipsis, system$1.system, (shape || length === 1) && shapeStyles(size, width, height, shape),
   /* sc-selector */
-  icon.StyledIcon, S.th.transition('medium'), S.th('colors.danger.500'));
+  icon.StyledIcon, system.th.transition('medium'), system.th('colors.danger.500'));
 });
@@ -155,3 +102,3 @@ var ActionIcon =
   var size = _ref2.size;
-  return styled.css(_templateObject5(), S.th("tags.sizes." + size), centerContent);
+  return styled.css(_templateObject5(), system.th("tags.sizes." + size), utils.centerContent);
 });
@@ -171,3 +118,3 @@
 
-  var content = wrap(children); // get size children for int and string
+  var content = utils.wrapChildren(children); // get size children for int and string
 
@@ -174,0 +121,0 @@ var childrenLength = !!(children || children === 0) && ['number', 'string'].includes(typeof children) && children.toString().length;

dist/tag.es.js

@@ -5,63 +5,10 @@ import _extends from '@babel/runtime/helpers/esm/extends';
 import { CrossIcon } from '@welcome-ui/icons.cross';
+import { overflowEllipsis, getMax, centerContent, wrapChildren } from '@welcome-ui/utils';
 import 'prop-types';
 import _taggedTemplateLiteralLoose from '@babel/runtime/helpers/esm/taggedTemplateLiteralLoose';
 import styled, { css } from '@xstyled/styled-components';
-import { compose, backgrounds, basics, borders, color, display, flexboxes, grids, height, maxHeight, maxWidth, minHeight, minWidth, positioning, space, typography, verticalAlign, width, th } from '@xstyled/system';
+import { th } from '@xstyled/system';
 import { StyledIcon } from '@welcome-ui/icon';
-import 'lodash.difference';
+import { system } from '@welcome-ui/system';
 
-var wrap = function wrap(children) {
-  return React.Children.toArray(children).map(function (child) {
-    return ['number', 'string'].includes(typeof child) ? React.createElement("span", {
-      key: child
-    }, child) : child;
-  });
-};
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n"]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-var overflowEllipsis =
-/*#__PURE__*/
-css(
-/*#__PURE__*/
-_templateObject());
-
-var getMax = function getMax(width, height) {
-  if (height === void 0) {
-    height = width;
-  }
-
-  var widthValue = parseInt(width, 10);
-  var heightValue = parseInt(height, 10);
-  var diff = widthValue - heightValue;
-  return diff >= 0 ? width : height;
-};
-
-var systemProps = [backgrounds, basics, borders, color, display, flexboxes, grids, height, maxHeight, maxWidth, minHeight, minWidth, positioning, space, typography, verticalAlign, width];
-var system =
-/*#__PURE__*/
-compose.apply(void 0, systemProps);
-
-function _templateObject$1() {
-  var data = _taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n"]);
-
-  _templateObject$1 = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-var centerContent =
-/*#__PURE__*/
-css(
-/*#__PURE__*/
-_templateObject$1());
-
 function _templateObject5() {
@@ -107,6 +54,6 @@ var data = _taggedTemplateLiteralLoose(["\n    position: absolute;\n    ", ";\n    top: 0;\n    bottom: 0;\n    right: 0;\n    ", ";\n  "]);
 
-function _templateObject$2() {
+function _templateObject() {
   var data = _taggedTemplateLiteralLoose(["\n  ", "\n  padding: 0;\n  ", "\n  ", ";\n"]);
 
-  _templateObject$2 = function _templateObject() {
+  _templateObject = function _templateObject() {
     return data;
@@ -123,3 +70,3 @@ };
 
-  return css(_templateObject$2(), th("tags.shape." + shape + "." + size), (width || height) && css(_templateObject2(), getMax(width || 0, height), getMax(width || 0, height)), shape === 'circle' && 'border-radius: 50%');
+  return css(_templateObject(), th("tags.shape." + shape + "." + size), (width || height) && css(_templateObject2(), getMax(width || 0, height), getMax(width || 0, height)), shape === 'circle' && 'border-radius: 50%');
 };
@@ -160,3 +107,3 @@
 
-  var content = wrap(children); // get size children for int and string
+  var content = wrapChildren(children); // get size children for int and string
 
@@ -163,0 +110,0 @@ var childrenLength = !!(children || children === 0) && ['number', 'string'].includes(typeof children) && children.toString().length;

package.json

 {
   "name": "@welcome-ui/tag",
-  "version": "1.0.28-alpha.0",
+  "version": "1.0.30-alpha.0",
   "description": "Customizable design system with react • styled-components • styled-system and reakit.",
@@ -37,3 +37,5 @@ "main": "dist/tag.cjs.js",
   "dependencies": {
-    "@welcome-ui/icons.cross": "^1.0.28-alpha.0",
+    "@welcome-ui/icons.cross": "^1.0.30-alpha.0",
+    "@welcome-ui/system": "^1.0.30-alpha.0",
+    "@welcome-ui/utils": "^1.0.30-alpha.0",
     "@xstyled/styled-components": "^1.8.3",
@@ -48,4 +50,4 @@ "@xstyled/system": "^1.8.2",
   },
-  "gitHead": "a90685f8fb5dc4266e354b08b08f113fc1354be5",
+  "gitHead": "6572020b45c435cd321875ff48af888d6ad071cb",
   "sideEffects": false
 }

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

Number of medium supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

11888

decreased by-18.42%

Dependency count

9

increased by28.57%

Lines of code

217

decreased by-28.15%

Dependency changes

• + Added@welcome-ui/system@^1.0.30-alpha.0

• + Added@welcome-ui/utils@^1.0.30-alpha.0

• + Added@welcome-ui/utils@1.30.0(transitive)

• Updated@welcome-ui/icons.cross@^1.0.30-alpha.0