svgs - npm Package Compare versions

Comparing version 3.3.0 to 3.3.1

CHANGELOG.md

 # CHANGELOG
 
+### 3.3.1
+
+- Upgrade to Babel 7 was a breaking change, reverting to 6 in this build so
+  3.3.1 no longer breaks people. Will re-release breaking babel upgrade as 4.0
+
 ### 3.3.0
@@ -4,0 +9,0 @@

lib/index.js

@@ -1,2 +0,2 @@
-"use strict";
+'use strict';
 
@@ -6,40 +6,22 @@ Object.defineProperty(exports, "__esModule", {
 });
-exports.Circle = Circle;
-exports.ClipPath = ClipPath;
-exports.Defs = Defs;
-exports.Ellipse = Ellipse;
-exports.G = G;
-exports.Image = Image;
-exports.Line = Line;
-exports.LinearGradient = LinearGradient;
-exports.Mask = Mask;
-exports.Path = Path;
-exports.Pattern = Pattern;
-exports.Polygon = Polygon;
-exports.Polyline = Polyline;
-exports.RadialGradient = RadialGradient;
-exports.Rect = Rect;
-exports.Stop = Stop;
-exports.Svg = Svg;
-exports.Symbol = _Symbol;
-exports.TSpan = TSpan;
-exports.Text = Text;
-exports.TextPath = TextPath;
-exports.Use = Use;
-exports.default = void 0;
+exports.Use = exports.TextPath = exports.Text = exports.TSpan = exports.Symbol = exports.Svg = exports.Stop = exports.Rect = exports.RadialGradient = exports.Polyline = exports.Polygon = exports.Pattern = exports.Path = exports.Mask = exports.LinearGradient = exports.Line = exports.Image = exports.G = exports.Ellipse = exports.Defs = exports.ClipPath = exports.Circle = undefined;
 
-var _propTypes = _interopRequireDefault(require("prop-types"));
+var _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; };
 
-var _react = _interopRequireDefault(require("react"));
+var _propTypes = require('prop-types');
 
-var _ripOut = _interopRequireDefault(require("rip-out"));
+var _propTypes2 = _interopRequireDefault(_propTypes);
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _react = require('react');
 
-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); }
+var _react2 = _interopRequireDefault(_react);
 
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+var _ripOut = require('rip-out');
 
-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; }
+var _ripOut2 = _interopRequireDefault(_ripOut);
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
+
 /**
@@ -51,3 +33,4 @@ * PropType specification where a value can be represented as number and string.
  */
-var numb = _propTypes.default.oneOfType([_propTypes.default.string, _propTypes.default.number]);
+var numb = _propTypes2.default.oneOfType([_propTypes2.default.string, _propTypes2.default.number]);
+
 /**
@@ -62,6 +45,4 @@ * Helper function to copy and paste over properties to a different object if
  */
-
-
 function copypaste(from, to) {
-  for (var _len = arguments.length, props = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
+  for (var _len = arguments.length, props = Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
     props[_key - 2] = arguments[_key];
@@ -74,2 +55,3 @@ }
 }
+
 /**
@@ -84,7 +66,8 @@ * The `react-native-svg` has some crazy api's that do not match with the
  */
+function prepare(props) {
+  var clean = (0, _ripOut2.default)(props, 'translate', 'scale', 'rotate', 'skewX', 'skewY', 'originX', 'originY', 'fontFamily', 'fontSize', 'fontWeight', 'fontStyle', 'style');
 
+  var transform = [];
 
-function prepare(props) {
-  var clean = (0, _ripOut.default)(props, 'translate', 'scale', 'rotate', 'skewX', 'skewY', 'originX', 'originY', 'fontFamily', 'fontSize', 'fontWeight', 'fontStyle', 'style');
-  var transform = []; //
+  //
   // Correctly apply the transformation properties.
@@ -94,15 +77,17 @@ // To apply originX and originY we need to translate the element on those values and
   //
+  if ('originX' in props || 'originY' in props) transform.push('translate(' + (props.originX || 0) + ', ' + (props.originY || 0) + ')');
+  if ('translate' in props) transform.push('translate(' + props.translate + ')');
+  if ('scale' in props) transform.push('scale(' + props.scale + ')');
+  if ('rotate' in props) transform.push('rotate(' + props.rotate + ')');
+  if ('skewX' in props) transform.push('skewX(' + props.skewX + ')');
+  if ('skewY' in props) transform.push('skewY(' + props.skewY + ')');
+  if ('originX' in props || 'originY' in props) transform.push('translate(' + (-props.originX || 0) + ', ' + (-props.originY || 0) + ')');
+  if (transform.length) clean.transform = transform.join(' ');
 
-  if ('originX' in props || 'originY' in props) transform.push("translate(".concat(props.originX || 0, ", ").concat(props.originY || 0, ")"));
-  if ('translate' in props) transform.push("translate(".concat(props.translate, ")"));
-  if ('scale' in props) transform.push("scale(".concat(props.scale, ")"));
-  if ('rotate' in props) transform.push("rotate(".concat(props.rotate, ")"));
-  if ('skewX' in props) transform.push("skewX(".concat(props.skewX, ")"));
-  if ('skewY' in props) transform.push("skewY(".concat(props.skewY, ")"));
-  if ('originX' in props || 'originY' in props) transform.push("translate(".concat(-props.originX || 0, ", ").concat(-props.originY || 0, ")"));
-  if (transform.length) clean.transform = transform.join(' '); //
+  //
   // Correctly set the initial style value.
   //
+  var style = 'style' in props ? props.style : {};
 
-  var style = 'style' in props ? props.style : {}; //
+  //
   // This is the nasty part where we depend on React internals to work as
@@ -113,5 +98,6 @@ // intended. If we add an empty object as style, it shouldn't render a `style`
   //
+  copypaste(props, style, 'fontFamily', 'fontSize', 'fontWeight', 'fontStyle');
+  clean.style = style;
 
-  copypaste(props, style, 'fontFamily', 'fontSize', 'fontWeight', 'fontStyle');
-  clean.style = style; //
+  //
   // React-Native svg provides as a default of `xMidYMid` if aspectRatio is not
@@ -121,5 +107,3 @@ // specified with align information. So we need to support this behavior and
   //
-
   var preserve = clean.preserveAspectRatio;
-
   if (preserve && preserve !== 'none' && !~preserve.indexOf(' ')) {
@@ -131,2 +115,3 @@ clean.preserveAspectRatio = 'xMidYMid ' + preserve;
 }
+
 /**
@@ -139,7 +124,6 @@ * Return a circle SVG element.
  */
-
-
 function Circle(props) {
-  return _react.default.createElement("circle", prepare(props));
+  return _react2.default.createElement('circle', prepare(props));
 }
+
 /**
@@ -152,7 +136,6 @@ * Return a clipPath SVG element.
  */
-
-
 function ClipPath(props) {
-  return _react.default.createElement("clipPath", prepare(props));
+  return _react2.default.createElement('clipPath', prepare(props));
 }
+
 /**
@@ -165,7 +148,6 @@ * Return a defs SVG element.
  */
-
-
 function Defs(props) {
-  return _react.default.createElement("defs", prepare(props));
+  return _react2.default.createElement('defs', prepare(props));
 }
+
 /**
@@ -178,7 +160,6 @@ * Return a ellipse SVG element.
  */
-
-
 function Ellipse(props) {
-  return _react.default.createElement("ellipse", prepare(props));
+  return _react2.default.createElement('ellipse', prepare(props));
 }
+
 /**
@@ -191,15 +172,14 @@ * Return a g SVG element.
  */
-
-
 function G(props) {
   var x = props.x,
       y = props.y,
-      rest = _objectWithoutProperties(props, ["x", "y"]);
+      rest = _objectWithoutProperties(props, ['x', 'y']);
 
   if ((x || y) && !rest.translate) {
-    rest.translate = "".concat(x || 0, ", ").concat(y || 0);
+    rest.translate = (x || 0) + ', ' + (y || 0);
   }
 
-  return _react.default.createElement("g", prepare(rest));
+  return _react2.default.createElement('g', prepare(rest));
 }
+
 /**
@@ -211,4 +191,2 @@ * PropType validation for the <G />.
  */
-
-
 G.propTypes = {
@@ -218,2 +196,3 @@ x: numb,
 };
+
 /**
@@ -226,6 +205,6 @@ * Return a image SVG element.
  */
-
 function Image(props) {
-  return _react.default.createElement("image", prepare(props));
+  return _react2.default.createElement('image', prepare(props));
 }
+
 /**
@@ -238,7 +217,6 @@ * Return a line SVG element.
  */
-
-
 function Line(props) {
-  return _react.default.createElement("line", prepare(props));
+  return _react2.default.createElement('line', prepare(props));
 }
+
 /**
@@ -251,7 +229,6 @@ * Return a linearGradient SVG element.
  */
-
-
 function LinearGradient(props) {
-  return _react.default.createElement("linearGradient", prepare(props));
+  return _react2.default.createElement('linearGradient', prepare(props));
 }
+
 /**
@@ -264,7 +241,6 @@ * Return a path SVG element.
  */
-
-
 function Path(props) {
-  return _react.default.createElement("path", prepare(props));
+  return _react2.default.createElement('path', prepare(props));
 }
+
 /**
@@ -277,7 +253,6 @@ * Return a polygon SVG element.
  */
-
-
 function Polygon(props) {
-  return _react.default.createElement("polygon", prepare(props));
+  return _react2.default.createElement('polygon', prepare(props));
 }
+
 /**
@@ -290,7 +265,6 @@ * Return a polyline SVG element.
  */
-
-
 function Polyline(props) {
-  return _react.default.createElement("polyline", prepare(props));
+  return _react2.default.createElement('polyline', prepare(props));
 }
+
 /**
@@ -303,7 +277,6 @@ * Return a radialGradient SVG element.
  */
-
-
 function RadialGradient(props) {
-  return _react.default.createElement("radialGradient", prepare(props));
+  return _react2.default.createElement('radialGradient', prepare(props));
 }
+
 /**
@@ -316,7 +289,6 @@ * Return a rect SVG element.
  */
-
-
 function Rect(props) {
-  return _react.default.createElement("rect", prepare(props));
+  return _react2.default.createElement('rect', prepare(props));
 }
+
 /**
@@ -329,7 +301,6 @@ * Return a stop SVG element.
  */
-
-
 function Stop(props) {
-  return _react.default.createElement("stop", prepare(props));
+  return _react2.default.createElement('stop', prepare(props));
 }
+
 /**
@@ -342,17 +313,22 @@ * Return a SVG element.
  */
-
-
 function Svg(props) {
   var title = props.title,
-      rest = _objectWithoutProperties(props, ["title"]);
+      rest = _objectWithoutProperties(props, ['title']);
 
   if (title) {
-    return _react.default.createElement("svg", _extends({
-      role: "img",
-      "aria-label": "[title]"
-    }, prepare(rest)), _react.default.createElement("title", null, title), props.children);
+    return _react2.default.createElement(
+      'svg',
+      _extends({ role: 'img', 'aria-label': '[title]' }, prepare(rest)),
+      _react2.default.createElement(
+        'title',
+        null,
+        title
+      ),
+      props.children
+    );
   }
 
-  return _react.default.createElement("svg", prepare(rest));
+  return _react2.default.createElement('svg', prepare(rest));
 }
+
 /**
@@ -364,8 +340,7 @@ * PropType validation for the <Svg />.
  */
-
-
 Svg.propTypes = {
-  title: _propTypes.default.string,
-  children: _propTypes.default.any
+  title: _propTypes2.default.string,
+  children: _propTypes2.default.any
 };
+
 /**
@@ -378,6 +353,6 @@ * Return a symbol SVG element.
  */
-
 function _Symbol(props) {
-  return _react.default.createElement("symbol", prepare(props));
+  return _react2.default.createElement('symbol', prepare(props));
 }
+
 /**
@@ -395,4 +370,2 @@ * Return a text SVG element.
  */
-
-
 function Text(props) {
@@ -404,12 +377,7 @@ var x = props.x,
       rotate = props.rotate,
-      rest = _objectWithoutProperties(props, ["x", "y", "dx", "dy", "rotate"]);
+      rest = _objectWithoutProperties(props, ['x', 'y', 'dx', 'dy', 'rotate']);
 
-  return _react.default.createElement("text", _extends({}, prepare(rest), {
-    x: x,
-    y: y,
-    dx: dx,
-    dy: dy,
-    rotate: rotate
-  }));
+  return _react2.default.createElement('text', _extends({}, prepare(rest), { x: x, y: y, dx: dx, dy: dy, rotate: rotate }));
 }
+
 /**
@@ -421,4 +389,2 @@ * PropType validation for the <Text />.
  */
-
-
 Text.propTypes = {
@@ -431,2 +397,3 @@ x: numb,
 };
+
 /**
@@ -444,3 +411,2 @@ * Return a tspan SVG element.
  */
-
 function TSpan(props) {
@@ -452,12 +418,7 @@ var x = props.x,
       rotate = props.rotate,
-      rest = _objectWithoutProperties(props, ["x", "y", "dx", "dy", "rotate"]);
+      rest = _objectWithoutProperties(props, ['x', 'y', 'dx', 'dy', 'rotate']);
 
-  return _react.default.createElement("tspan", _extends({}, prepare(rest), {
-    x: x,
-    y: y,
-    dx: dx,
-    dy: dy,
-    rotate: rotate
-  }));
+  return _react2.default.createElement('tspan', _extends({}, prepare(rest), { x: x, y: y, dx: dx, dy: dy, rotate: rotate }));
 }
+
 /**
@@ -469,5 +430,4 @@ * PropType validation for the <TSpan />.
  */
+TSpan.propTypes = Text.propTypes;
 
-
-TSpan.propTypes = Text.propTypes;
 /**
@@ -480,6 +440,6 @@ * Return a textpath SVG element.
  */
-
 function TextPath(props) {
-  return _react.default.createElement("textPath", prepare(props));
+  return _react2.default.createElement('textPath', prepare(props));
 }
+
 /**
@@ -492,7 +452,6 @@ * Return a use SVG element.
  */
-
-
 function Use(props) {
-  return _react.default.createElement("use", prepare(props));
+  return _react2.default.createElement('use', prepare(props));
 }
+
 /**
@@ -505,7 +464,6 @@ * Return a mask SVG element.
  */
-
-
 function Mask(props) {
-  return _react.default.createElement("mask", prepare(props));
+  return _react2.default.createElement('mask', prepare(props));
 }
+
 /**
@@ -518,12 +476,31 @@ * Return a pattern SVG element.
  */
+function Pattern(props) {
+  return _react2.default.createElement('pattern', prepare(props));
+}
 
-
-function Pattern(props) {
-  return _react.default.createElement("pattern", prepare(props));
-} //
+//
 // Expose everything in the same way as `react-native-svg` is doing.
 //
-
-
-var _default = Svg;
-exports.default = _default;
+exports.Circle = Circle;
+exports.ClipPath = ClipPath;
+exports.Defs = Defs;
+exports.Ellipse = Ellipse;
+exports.G = G;
+exports.Image = Image;
+exports.Line = Line;
+exports.LinearGradient = LinearGradient;
+exports.Mask = Mask;
+exports.Path = Path;
+exports.Pattern = Pattern;
+exports.Polygon = Polygon;
+exports.Polyline = Polyline;
+exports.RadialGradient = RadialGradient;
+exports.Rect = Rect;
+exports.Stop = Stop;
+exports.Svg = Svg;
+exports.Symbol = _Symbol;
+exports.TSpan = TSpan;
+exports.Text = Text;
+exports.TextPath = TextPath;
+exports.Use = Use;
+exports.default = Svg;

package.json

 {
   "name": "svgs",
-  "version": "3.3.0",
+  "version": "3.3.1",
   "description": "svgs is a compatiblity layer between svg and react-native-svg",
@@ -35,8 +35,7 @@ "main": "./lib",
   "devDependencies": {
-    "@babel/cli": "^7.1.2",
-    "@babel/core": "^7.1.2",
-    "@babel/plugin-proposal-object-rest-spread": "^7.0.0",
-    "@babel/preset-env": "^7.1.0",
-    "@babel/preset-react": "^7.0.0",
-    "@babel/register": "^7.0.0",
+    "babel-cli": "^6.24.1",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
+    "babel-preset-es2015": "^6.24.1",
+    "babel-preset-react": "^6.24.1",
+    "babel-register": "^6.26.0",
     "assume": "^2.1.0",
@@ -66,7 +65,7 @@ "coveralls": "^3.0.0",
     "plugins": [
-      "@babel/plugin-proposal-object-rest-spread"
+      "transform-object-rest-spread"
     ],
     "presets": [
-      "@babel/preset-env",
-      "@babel/preset-react"
+      "babel-preset-es2015",
+      "babel-preset-react"
     ]
@@ -73,0 +72,0 @@ },

No alert changes

Improved metrics

Dev dependency count

21

decreased by-4.55%

Worsened metrics

Total package byte prevSize

99904

decreased by-0.14%

Lines of code

1205

decreased by-0.17%

No dependency changes