search

airbnb / babel-plugin-inline-react-svg

A babel plugin that optimizes and inlines SVGs for your React Components.
MIT License
474 stars 92 forks source link

[Breaking] update `svgo` to v2; drop node < v10.13 #99

Closed ljharb closed 3 years ago

ljharb commented 3 years ago

Thanks to https://github.com/svg/svgo/issues/1015#issuecomment-780840871, we can now update to svgo v2.

Closes #66. Closes #34. Closes #44. Closes #45. Closes #18.

test diff ```diff diff --git a/before b/after index 90a0f13..88ac94f 100644 --- a/before +++ b/after @@ -33,7 +33,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } var MySvg = function MySvg(props) { - return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("title", null), /*#__PURE__*/_react["default"].createElement("circle", { + return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("circle", { cx: "1038.5", cy: "467.01", r: "72.28", @@ -49,13 +49,23 @@ var MySvg = function MySvg(props) { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/_react["default"].createElement("text", null, "This is an opening ", "{", " and this is a closing ", "}", "."), /*#__PURE__*/_react["default"].createElement("style", null, "text", "{", "color:#00f", "}")); + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/_react["default"].createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/_react["default"].createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", "{", " and this is a closing ", "}", ".")); }; MySvg.defaultProps = { "'data-name'": "Livello 1", - id: "Livello_1", viewBox: "0 0 151.57 151.57", xmlns: "http://www.w3.org/2000/svg" }; @@ -86,10 +96,13 @@ var MyClassIcon = /*#__PURE__*/function (_React$Component) { }(_react["default"].Component); exports.MyClassIcon = MyClassIcon; -test/fixtures/test-import.jsx import React from 'react'; +test/fixtures/test-no-svg-or-react.js import './path/to.jpg'; +import './code.js'; +export default class Foo {} +test/fixtures/test-no-duplicate-react.jsx import React from "react"; var MySvg = function MySvg(props) { - return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("title", null), /*#__PURE__*/React.createElement("circle", { + return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("circle", { cx: "1038.5", cy: "467.01", r: "72.28", @@ -105,29 +118,33 @@ var MySvg = function MySvg(props) { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/React.createElement("text", null, "This is an opening ", `{`, " and this is a closing ", `}`, "."), /*#__PURE__*/React.createElement("style", null, "text", `{`, "color:#00f", `}`)); + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/React.createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/React.createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", `{`, " and this is a closing ", `}`, ".")); }; MySvg.defaultProps = { 'data-name': "Livello 1", - id: "Livello_1", viewBox: "0 0 151.57 151.57", xmlns: "http://www.w3.org/2000/svg" }; -export default function MyFunctionIcon() { - return /*#__PURE__*/React.createElement(MySvg, null); -} -export class MyClassIcon extends React.Component { - render() { - return /*#__PURE__*/React.createElement(MySvg, null); - } - +export function MyFunctionIcon() { + return MySvg; } test/fixtures/test-multiple-svg.jsx import React from "react"; var MySvg = function MySvg(props) { - return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("title", null), /*#__PURE__*/React.createElement("circle", { + return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("circle", { cx: "1038.5", cy: "467.01", r: "72.28", @@ -143,19 +160,29 @@ var MySvg = function MySvg(props) { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/React.createElement("text", null, "This is an opening ", `{`, " and this is a closing ", `}`, "."), /*#__PURE__*/React.createElement("style", null, "text", `{`, "color:#00f", `}`)); + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/React.createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/React.createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", `{`, " and this is a closing ", `}`, ".")); }; MySvg.defaultProps = { 'data-name': "Livello 1", - id: "Livello_1", viewBox: "0 0 151.57 151.57", xmlns: "http://www.w3.org/2000/svg" }; var MySvg2 = function MySvg2(props) { - return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("title", null), /*#__PURE__*/React.createElement("circle", { + return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("circle", { cx: "1038.5", cy: "467.01", r: "72.28", @@ -171,19 +198,29 @@ var MySvg2 = function MySvg2(props) { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/React.createElement("text", null, "This is an opening ", `{`, " and this is a closing ", `}`, "."), /*#__PURE__*/React.createElement("style", null, "text", `{`, "color:#00f", `}`)); + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/React.createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/React.createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", `{`, " and this is a closing ", `}`, ".")); }; MySvg2.defaultProps = { 'data-name': "Livello 1", - id: "Livello_1", viewBox: "0 0 151.57 151.57", xmlns: "http://www.w3.org/2000/svg" }; var MySvg3 = function MySvg3(props) { - return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("title", null), /*#__PURE__*/React.createElement("circle", { + return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("circle", { cx: "1038.5", cy: "467.01", r: "72.28", @@ -199,13 +236,23 @@ var MySvg3 = function MySvg3(props) { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/React.createElement("text", null, "This is an opening ", `{`, " and this is a closing ", `}`, "."), /*#__PURE__*/React.createElement("style", null, "text", `{`, "color:#00f", `}`)); + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/React.createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/React.createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", `{`, " and this is a closing ", `}`, ".")); }; MySvg3.defaultProps = { 'data-name': "Livello 1", - id: "Livello_1", viewBox: "0 0 151.57 151.57", xmlns: "http://www.w3.org/2000/svg" }; @@ -218,10 +265,59 @@ export class MyClassIcon extends React.Component { } } +test/fixtures/test-import.jsx import React from 'react'; + +var MySvg = function MySvg(props) { + return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("circle", { + cx: "1038.5", + cy: "467.01", + r: "72.28", + transform: "rotate(-45 84.888 1433.508)", + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7" + }), /*#__PURE__*/React.createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/React.createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/React.createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", `{`, " and this is a closing ", `}`, ".")); +}; + +MySvg.defaultProps = { + 'data-name': "Livello 1", + viewBox: "0 0 151.57 151.57", + xmlns: "http://www.w3.org/2000/svg" +}; +export default function MyFunctionIcon() { + return /*#__PURE__*/React.createElement(MySvg, null); +} +export class MyClassIcon extends React.Component { + render() { + return /*#__PURE__*/React.createElement(MySvg, null); + } + +} +test/fixtures/test-case-sensitive.jsx Test passed: Expected case sensitive error was thrown test/fixtures/test-no-react.jsx import React from "react"; var MySvg = function MySvg(props) { - return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("title", null), /*#__PURE__*/React.createElement("circle", { + return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("circle", { cx: "1038.5", cy: "467.01", r: "72.28", @@ -237,55 +333,29 @@ var MySvg = function MySvg(props) { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/React.createElement("text", null, "This is an opening ", `{`, " and this is a closing ", `}`, "."), /*#__PURE__*/React.createElement("style", null, "text", `{`, "color:#00f", `}`)); -}; - -MySvg.defaultProps = { - 'data-name': "Livello 1", - id: "Livello_1", - viewBox: "0 0 151.57 151.57", - xmlns: "http://www.w3.org/2000/svg" -}; -export function MyFunctionIcon() { - return MySvg; -} -test/fixtures/test-no-svg-or-react.js import './path/to.jpg'; -import './code.js'; -export default class Foo {} -test/fixtures/test-no-duplicate-react.jsx import React from "react"; - -var MySvg = function MySvg(props) { - return /*#__PURE__*/React.createElement("svg", props, /*#__PURE__*/React.createElement("title", null), /*#__PURE__*/React.createElement("circle", { - cx: "1038.5", - cy: "467.01", - r: "72.28", - transform: "rotate(-45 84.888 1433.508)", - fill: "#da2244", - stroke: "#f2f2f2", - strokeLinecap: "round", - strokeLinejoin: "round", - strokeWidth: "7" + d: "M47.57 103.99l56.42-56.42" }), /*#__PURE__*/React.createElement("path", { fill: "#da2244", stroke: "#f2f2f2", strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/React.createElement("text", null, "This is an opening ", `{`, " and this is a closing ", `}`, "."), /*#__PURE__*/React.createElement("style", null, "text", `{`, "color:#00f", `}`)); + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/React.createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", `{`, " and this is a closing ", `}`, ".")); }; MySvg.defaultProps = { 'data-name': "Livello 1", - id: "Livello_1", viewBox: "0 0 151.57 151.57", xmlns: "http://www.w3.org/2000/svg" }; export function MyFunctionIcon() { return MySvg; } -test/fixtures/test-case-sensitive.jsx Test passed: Expected case sensitive error was thrown test/fixtures/test-import.jsx "use strict"; function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } @@ -321,7 +391,7 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } var MySvg = function MySvg(props) { - return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("title", null), /*#__PURE__*/_react["default"].createElement("circle", { + return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("circle", { cx: "1038.5", cy: "467.01", r: "72.28", @@ -337,13 +407,23 @@ var MySvg = function MySvg(props) { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/_react["default"].createElement("text", null, "This is an opening ", "{", " and this is a closing ", "}", "."), /*#__PURE__*/_react["default"].createElement("style", null, "text", "{", "color:#00f", "}")); + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/_react["default"].createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/_react["default"].createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", "{", " and this is a closing ", "}", ".")); }; MySvg.defaultProps = { "'data-name'": "Livello 1", - id: "Livello_1", viewBox: "0 0 151.57 151.57", xmlns: "http://www.w3.org/2000/svg" }; @@ -374,6 +454,225 @@ var MyClassIcon = /*#__PURE__*/function (_React$Component) { }(_react["default"].Component); exports.MyClassIcon = MyClassIcon; +test/fixtures/test-dynamic-require.jsx "use strict"; + +function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports["default"] = MyFunctionIcon; +exports.MyClassIcon = exports.foo = void 0; + +var _react = _interopRequireDefault(require("react")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } + +function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } + +function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } + +function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } + +function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); } + +function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } + +function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } + +function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); } + +function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } + +function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } + +function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } + +var MySvg = function MySvg(props) { + return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("circle", { + cx: "1038.5", + cy: "467.01", + r: "72.28", + transform: "rotate(-45 84.888 1433.508)", + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7" + }), /*#__PURE__*/_react["default"].createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/_react["default"].createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/_react["default"].createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", "{", " and this is a closing ", "}", ".")); +}; + +MySvg.defaultProps = { + "'data-name'": "Livello 1", + viewBox: "0 0 151.57 151.57", + xmlns: "http://www.w3.org/2000/svg" +}; + +var foo = require(path.join(pkgBase, 'package.json')); // regression test + + +exports.foo = foo; + +function MyFunctionIcon() { + return /*#__PURE__*/_react["default"].createElement(MySvg, null); +} + +var MyClassIcon = /*#__PURE__*/function (_React$Component) { + _inherits(MyClassIcon, _React$Component); + + var _super = _createSuper(MyClassIcon); + + function MyClassIcon() { + _classCallCheck(this, MyClassIcon); + + return _super.apply(this, arguments); + } + + _createClass(MyClassIcon, [{ + key: "render", + value: function render() { + return /*#__PURE__*/_react["default"].createElement(MySvg, null); + } + }]); + + return MyClassIcon; +}(_react["default"].Component); + +exports.MyClassIcon = MyClassIcon; +test/fixtures/test-export-default-as.jsx "use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.IconClose = void 0; + +var _react = _interopRequireDefault(require("react")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } + +var IconClose = function IconClose(props) { + return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("circle", { + cx: "1038.5", + cy: "467.01", + r: "72.28", + transform: "rotate(-45 84.888 1433.508)", + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7" + }), /*#__PURE__*/_react["default"].createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/_react["default"].createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/_react["default"].createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", "{", " and this is a closing ", "}", ".")); +}; + +exports.IconClose = IconClose; +IconClose.defaultProps = { + "'data-name'": "Livello 1", + viewBox: "0 0 151.57 151.57", + xmlns: "http://www.w3.org/2000/svg" +}; +test/fixtures/test-export-default.jsx "use strict"; + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports["default"] = void 0; + +var _react = _interopRequireDefault(require("react")); + +function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } + +var Component = function Component(props) { + return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("circle", { + cx: "1038.5", + cy: "467.01", + r: "72.28", + transform: "rotate(-45 84.888 1433.508)", + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7" + }), /*#__PURE__*/_react["default"].createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M47.57 103.99l56.42-56.42" + }), /*#__PURE__*/_react["default"].createElement("path", { + fill: "#da2244", + stroke: "#f2f2f2", + strokeLinecap: "round", + strokeLinejoin: "round", + strokeWidth: "7", + d: "M45.8 45.87l59.9 59.9" + }), /*#__PURE__*/_react["default"].createElement("text", { + style: { + color: "#00f" + } + }, "This is an opening ", "{", " and this is a closing ", "}", ".")); +}; + +Component.defaultProps = { + "'data-name'": "Livello 1", + viewBox: "0 0 151.57 151.57", + xmlns: "http://www.w3.org/2000/svg" +}; +Component.displayName = "close-a"; +var _default = Component; +exports["default"] = _default; +test/fixtures/test-export-all-as.jsx "use strict"; + +function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } + +Object.defineProperty(exports, "__esModule", { + value: true +}); +exports.foo = void 0; + +var _foo = _interopRequireWildcard(require("bar")); + +exports.foo = _foo; + +function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; } + +function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; } test/fixtures/test-commented.jsx "use strict"; function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } @@ -445,192 +744,3 @@ var MyClassIcon = /*#__PURE__*/function (_React$Component) { }(_react["default"].Component); exports.MyClassIcon = MyClassIcon; -test/fixtures/test-export-default.jsx "use strict"; - -Object.defineProperty(exports, "__esModule", { - value: true -}); -exports["default"] = void 0; - -var _react = _interopRequireDefault(require("react")); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } - -var Component = function Component(props) { - return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("title", null), /*#__PURE__*/_react["default"].createElement("circle", { - cx: "1038.5", - cy: "467.01", - r: "72.28", - transform: "rotate(-45 84.888 1433.508)", - fill: "#da2244", - stroke: "#f2f2f2", - strokeLinecap: "round", - strokeLinejoin: "round", - strokeWidth: "7" - }), /*#__PURE__*/_react["default"].createElement("path", { - fill: "#da2244", - stroke: "#f2f2f2", - strokeLinecap: "round", - strokeLinejoin: "round", - strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/_react["default"].createElement("text", null, "This is an opening ", "{", " and this is a closing ", "}", "."), /*#__PURE__*/_react["default"].createElement("style", null, "text", "{", "color:#00f", "}")); -}; - -Component.defaultProps = { - "'data-name'": "Livello 1", - id: "Livello_1", - viewBox: "0 0 151.57 151.57", - xmlns: "http://www.w3.org/2000/svg" -}; -Component.displayName = "close-a"; -var _default = Component; -exports["default"] = _default; -test/fixtures/test-dynamic-require.jsx "use strict"; - -function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } - -Object.defineProperty(exports, "__esModule", { - value: true -}); -exports["default"] = MyFunctionIcon; -exports.MyClassIcon = exports.foo = void 0; - -var _react = _interopRequireDefault(require("react")); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } - -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } - -function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } - -function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; } - -function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); } - -function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); } - -function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; } - -function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); } - -function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; } - -function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Date.prototype.toString.call(Reflect.construct(Date, [], function () {})); return true; } catch (e) { return false; } } - -function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); } - -var MySvg = function MySvg(props) { - return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("title", null), /*#__PURE__*/_react["default"].createElement("circle", { - cx: "1038.5", - cy: "467.01", - r: "72.28", - transform: "rotate(-45 84.888 1433.508)", - fill: "#da2244", - stroke: "#f2f2f2", - strokeLinecap: "round", - strokeLinejoin: "round", - strokeWidth: "7" - }), /*#__PURE__*/_react["default"].createElement("path", { - fill: "#da2244", - stroke: "#f2f2f2", - strokeLinecap: "round", - strokeLinejoin: "round", - strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/_react["default"].createElement("text", null, "This is an opening ", "{", " and this is a closing ", "}", "."), /*#__PURE__*/_react["default"].createElement("style", null, "text", "{", "color:#00f", "}")); -}; - -MySvg.defaultProps = { - "'data-name'": "Livello 1", - id: "Livello_1", - viewBox: "0 0 151.57 151.57", - xmlns: "http://www.w3.org/2000/svg" -}; - -var foo = require(path.join(pkgBase, 'package.json')); // regression test - - -exports.foo = foo; - -function MyFunctionIcon() { - return /*#__PURE__*/_react["default"].createElement(MySvg, null); -} - -var MyClassIcon = /*#__PURE__*/function (_React$Component) { - _inherits(MyClassIcon, _React$Component); - - var _super = _createSuper(MyClassIcon); - - function MyClassIcon() { - _classCallCheck(this, MyClassIcon); - - return _super.apply(this, arguments); - } - - _createClass(MyClassIcon, [{ - key: "render", - value: function render() { - return /*#__PURE__*/_react["default"].createElement(MySvg, null); - } - }]); - - return MyClassIcon; -}(_react["default"].Component); - -exports.MyClassIcon = MyClassIcon; -test/fixtures/test-export-all-as.jsx "use strict"; - -function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); } - -Object.defineProperty(exports, "__esModule", { - value: true -}); -exports.foo = void 0; - -var _foo = _interopRequireWildcard(require("bar")); - -exports.foo = _foo; - -function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; } - -function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; } -test/fixtures/test-export-default-as.jsx "use strict"; - -Object.defineProperty(exports, "__esModule", { - value: true -}); -exports.IconClose = void 0; - -var _react = _interopRequireDefault(require("react")); - -function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } - -var IconClose = function IconClose(props) { - return /*#__PURE__*/_react["default"].createElement("svg", props, /*#__PURE__*/_react["default"].createElement("title", null), /*#__PURE__*/_react["default"].createElement("circle", { - cx: "1038.5", - cy: "467.01", - r: "72.28", - transform: "rotate(-45 84.888 1433.508)", - fill: "#da2244", - stroke: "#f2f2f2", - strokeLinecap: "round", - strokeLinejoin: "round", - strokeWidth: "7" - }), /*#__PURE__*/_react["default"].createElement("path", { - fill: "#da2244", - stroke: "#f2f2f2", - strokeLinecap: "round", - strokeLinejoin: "round", - strokeWidth: "7", - d: "M47.57 103.99l56.42-56.42M45.8 45.87l59.9 59.9" - }), /*#__PURE__*/_react["default"].createElement("text", null, "This is an opening ", "{", " and this is a closing ", "}", "."), /*#__PURE__*/_react["default"].createElement("style", null, "text", "{", "color:#00f", "}")); -}; - -exports.IconClose = IconClose; -IconClose.defaultProps = { - "'data-name'": "Livello 1", - id: "Livello_1", - viewBox: "0 0 151.57 151.57", - xmlns: "http://www.w3.org/2000/svg" -}; ```
ljharb commented 3 years ago

@lencioni mind doing a v2 release? (alternatively, uncheck the review requirement in branch protections and i can take care of it moving forward)

lencioni commented 3 years ago

@ljharb happy to publish a release. Is the breaking change here just dropping support for older node versions, or something more?

ljharb commented 3 years ago

Theoretically that’s the only break; it’s possible tho that there could be others, so a major is a safer bump anyways.

lencioni commented 3 years ago

v2.0.0 has been published with this change https://github.com/airbnb/babel-plugin-inline-react-svg/releases/tag/v2.0.0