@uiw/react-icon - npm Package Compare versions

Comparing version 4.1.1 to 4.2.0

lib/cjs/index.d.ts

@@ -15,10 +15,6 @@ import React from 'react';
     type?: IconsName | null | T;
-    spin: boolean;
+    spin?: boolean;
     color?: string;
     verticalAlign?: 'middle' | 'baseline';
 }
-export default class Icon<T> extends React.PureComponent<IconProps<T>> {
-    static defaultProps: IconProps<{}>;
-    renderSvgPaths: (type: IconsName) => JSX.Element[] | null;
-    render(): JSX.Element | null;
-}
+export default function Icon<T>(props?: IconProps<T>): JSX.Element | null;

lib/cjs/index.js

 "use strict";
 
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
+
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
@@ -8,3 +10,3 @@
 });
-exports.default = void 0;
+exports.default = Icon;
 
@@ -15,14 +17,4 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
-var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
+var _react = _interopRequireWildcard(require("react"));
 
-var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
-var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
-var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
-
-var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
-
-var _react = _interopRequireDefault(require("react"));
-
 var _classnames2 = _interopRequireDefault(require("classnames"));
@@ -36,91 +28,58 @@
 
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2.default)(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2.default)(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2.default)(this, result); }; }
-
-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; } }
-
-var Icon = /*#__PURE__*/function (_React$PureComponent) {
-  (0, _inherits2.default)(Icon, _React$PureComponent);
-
-  var _super = _createSuper(Icon);
-
-  function Icon() {
-    var _this;
-
-    (0, _classCallCheck2.default)(this, Icon);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
+function Icon() {
+  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  var className = props.className,
+      _props$prefixCls = props.prefixCls,
+      prefixCls = _props$prefixCls === void 0 ? 'w-icon' : _props$prefixCls,
+      _props$verticalAlign = props.verticalAlign,
+      verticalAlign = _props$verticalAlign === void 0 ? 'middle' : _props$verticalAlign,
+      _props$tagName = props.tagName,
+      TagName = _props$tagName === void 0 ? 'span' : _props$tagName,
+      color = props.color,
+      type = props.type,
+      _props$spin = props.spin,
+      spin = _props$spin === void 0 ? false : _props$spin,
+      others = (0, _objectWithoutProperties2.default)(props, ["className", "prefixCls", "verticalAlign", "tagName", "color", "type", "spin"]);
+  var renderSVGPaths = (0, _react.useMemo)(function () {
+    if (!type) {
+      return null;
     }
 
-    _this = _super.call.apply(_super, [this].concat(args));
-
-    _this.renderSvgPaths = function (type) {
-      var svgPathsData = _wIcon.default;
-      var pathStrings = svgPathsData[type];
-
-      if (pathStrings == null) {
-        return null;
-      }
-
-      return pathStrings.map(function (d, i) {
-        return /*#__PURE__*/_react.default.createElement("path", {
-          key: i,
-          d: d,
-          fillRule: "evenodd"
-        });
+    var svgPathsData = _wIcon.default;
+    var pathStrings = svgPathsData[type] || [];
+    return pathStrings.map(function (d, i) {
+      return /*#__PURE__*/_react.default.createElement("path", {
+        key: i,
+        d: d,
+        fillRule: "evenodd"
       });
-    };
+    });
+  }, [type]);
+  var svg = null;
 
-    return _this;
+  if (typeof type === 'string') {
+    svg = /*#__PURE__*/_react.default.createElement("svg", {
+      fill: color,
+      viewBox: "0 0 20 20"
+    }, renderSVGPaths);
+  } else if ( /*#__PURE__*/_react.default.isValidElement(type)) {
+    svg = /*#__PURE__*/_react.default.cloneElement(type, {
+      fill: color
+    });
+  } else {
+    return null;
   }
 
-  (0, _createClass2.default)(Icon, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          prefixCls = _this$props.prefixCls,
-          className = _this$props.className,
-          color = _this$props.color,
-          type = _this$props.type,
-          spin = _this$props.spin,
-          verticalAlign = _this$props.verticalAlign,
-          TagName = _this$props.tagName,
-          others = (0, _objectWithoutProperties2.default)(_this$props, ["prefixCls", "className", "color", "type", "spin", "verticalAlign", "tagName"]);
-      var svg = null;
+  others.style = _objectSpread({
+    fill: 'currentColor'
+  }, others.style);
 
-      if (typeof type === 'string') {
-        svg = /*#__PURE__*/_react.default.createElement("svg", {
-          fill: color,
-          viewBox: "0 0 20 20"
-        }, this.renderSvgPaths(type));
-      } else if ( /*#__PURE__*/_react.default.isValidElement(type)) {
-        svg = /*#__PURE__*/_react.default.cloneElement(type, {
-          fill: color
-        });
-      } else {
-        return null;
-      }
+  var propps = _objectSpread(_objectSpread({}, others), {}, {
+    className: (0, _classnames2.default)(prefixCls, className, "".concat(prefixCls, "-").concat(verticalAlign), (0, _defineProperty2.default)({}, "".concat(prefixCls, "-spin"), spin))
+  });
 
-      others.style = _objectSpread({
-        fill: 'currentColor'
-      }, others.style);
+  return /*#__PURE__*/_react.default.createElement(TagName, propps, svg);
+}
 
-      var propps = _objectSpread(_objectSpread({}, others), {}, {
-        className: (0, _classnames2.default)(prefixCls, className, "".concat(prefixCls, "-").concat(verticalAlign), (0, _defineProperty2.default)({}, "".concat(prefixCls, "-spin"), spin))
-      });
-
-      return /*#__PURE__*/_react.default.createElement(TagName, propps, svg);
-    }
-  }]);
-  return Icon;
-}(_react.default.PureComponent);
-
-exports.default = Icon;
-Icon.defaultProps = {
-  prefixCls: 'w-icon',
-  verticalAlign: 'middle',
-  tagName: 'span',
-  spin: false
-};
 module.exports = exports.default; 
 //# sourceMappingURL=index.js.map

lib/esm/index.d.ts

@@ -15,10 +15,6 @@ import React from 'react';
     type?: IconsName | null | T;
-    spin: boolean;
+    spin?: boolean;
     color?: string;
     verticalAlign?: 'middle' | 'baseline';
 }
-export default class Icon<T> extends React.PureComponent<IconProps<T>> {
-    static defaultProps: IconProps<{}>;
-    renderSvgPaths: (type: IconsName) => JSX.Element[] | null;
-    render(): JSX.Element | null;
-}
+export default function Icon<T>(props?: IconProps<T>): JSX.Element | null;

lib/esm/index.js

 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf";
 
@@ -13,97 +8,62 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
 
-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 _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; } }
-
-import React from 'react';
+import React, { useMemo } from 'react';
 import classnames from 'classnames';
 import svgPaths from '@uiw/icons/fonts/w-icon.json';
 import "./style/index.css";
+export default function Icon() {
+  var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
 
-var Icon = /*#__PURE__*/function (_React$PureComponent) {
-  _inherits(Icon, _React$PureComponent);
+  var className = props.className,
+      _props$prefixCls = props.prefixCls,
+      prefixCls = _props$prefixCls === void 0 ? 'w-icon' : _props$prefixCls,
+      _props$verticalAlign = props.verticalAlign,
+      verticalAlign = _props$verticalAlign === void 0 ? 'middle' : _props$verticalAlign,
+      _props$tagName = props.tagName,
+      TagName = _props$tagName === void 0 ? 'span' : _props$tagName,
+      color = props.color,
+      type = props.type,
+      _props$spin = props.spin,
+      spin = _props$spin === void 0 ? false : _props$spin,
+      others = _objectWithoutProperties(props, ["className", "prefixCls", "verticalAlign", "tagName", "color", "type", "spin"]);
 
-  var _super = _createSuper(Icon);
-
-  function Icon() {
-    var _this;
-
-    _classCallCheck(this, Icon);
-
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
+  var renderSVGPaths = useMemo(function () {
+    if (!type) {
+      return null;
     }
 
-    _this = _super.call.apply(_super, [this].concat(args));
-
-    _this.renderSvgPaths = function (type) {
-      var svgPathsData = svgPaths;
-      var pathStrings = svgPathsData[type];
-
-      if (pathStrings == null) {
-        return null;
-      }
-
-      return pathStrings.map(function (d, i) {
-        return /*#__PURE__*/React.createElement("path", {
-          key: i,
-          d: d,
-          fillRule: "evenodd"
-        });
+    var svgPathsData = svgPaths;
+    var pathStrings = svgPathsData[type] || [];
+    return pathStrings.map(function (d, i) {
+      return /*#__PURE__*/React.createElement("path", {
+        key: i,
+        d: d,
+        fillRule: "evenodd"
       });
-    };
+    });
+  }, [type]);
+  var svg = null;
 
-    return _this;
+  if (typeof type === 'string') {
+    svg = /*#__PURE__*/React.createElement("svg", {
+      fill: color,
+      viewBox: "0 0 20 20"
+    }, renderSVGPaths);
+  } else if ( /*#__PURE__*/React.isValidElement(type)) {
+    svg = /*#__PURE__*/React.cloneElement(type, {
+      fill: color
+    });
+  } else {
+    return null;
   }
 
-  _createClass(Icon, [{
-    key: "render",
-    value: function render() {
-      var _this$props = this.props,
-          prefixCls = _this$props.prefixCls,
-          className = _this$props.className,
-          color = _this$props.color,
-          type = _this$props.type,
-          spin = _this$props.spin,
-          verticalAlign = _this$props.verticalAlign,
-          TagName = _this$props.tagName,
-          others = _objectWithoutProperties(_this$props, ["prefixCls", "className", "color", "type", "spin", "verticalAlign", "tagName"]);
+  others.style = _objectSpread({
+    fill: 'currentColor'
+  }, others.style);
 
-      var svg = null;
+  var propps = _objectSpread(_objectSpread({}, others), {}, {
+    className: classnames(prefixCls, className, "".concat(prefixCls, "-").concat(verticalAlign), _defineProperty({}, "".concat(prefixCls, "-spin"), spin))
+  });
 
-      if (typeof type === 'string') {
-        svg = /*#__PURE__*/React.createElement("svg", {
-          fill: color,
-          viewBox: "0 0 20 20"
-        }, this.renderSvgPaths(type));
-      } else if ( /*#__PURE__*/React.isValidElement(type)) {
-        svg = /*#__PURE__*/React.cloneElement(type, {
-          fill: color
-        });
-      } else {
-        return null;
-      }
-
-      others.style = _objectSpread({
-        fill: 'currentColor'
-      }, others.style);
-
-      var propps = _objectSpread(_objectSpread({}, others), {}, {
-        className: classnames(prefixCls, className, "".concat(prefixCls, "-").concat(verticalAlign), _defineProperty({}, "".concat(prefixCls, "-spin"), spin))
-      });
-
-      return /*#__PURE__*/React.createElement(TagName, propps, svg);
-    }
-  }]);
-
-  return Icon;
-}(React.PureComponent);
-
-Icon.defaultProps = {
-  prefixCls: 'w-icon',
-  verticalAlign: 'middle',
-  tagName: 'span',
-  spin: false
-};
-export { Icon as default }; 
+  return /*#__PURE__*/React.createElement(TagName, propps, svg);
+} 
 //# sourceMappingURL=index.js.map

package.json

 {
   "name": "@uiw/react-icon",
-  "version": "4.1.1",
+  "version": "4.2.0",
   "description": "Icon component",
@@ -57,3 +57,3 @@ "author": "Kenny Wong <[e-mail]>",
   },
-  "gitHead": "1f6848374148d3e573244cf52dc88ecd001a6423"
+  "gitHead": "ef630720992e1b680084bf028b6304fdcbcf71b9"
 }

README.md

@@ -12,3 +12,3 @@ Icon 图标
 
-const icons = ["adobe", "alipay", "aliwangwang", "android-o", "android", "apple", "appstore-o", "appstore", "area-chart", "down", "left", "right", "up", "arrow-down", "arrow-left", "arrow-right", "arrow-up", "arrows-alt", "asterisk", "backward", "baidu", "bar-chart", "barcode", "bell", "camera-o", "caret-down", "caret-left", "caret-right", "caret-up", "check-square-o", "check-square", "check", "chrome", "circle-check-o", "circle-check", "circle-close-o", "circle-close", "close-square-o", "close-square", "close", "cloud-download-o", "cloud-download", "cloud-upload-o", "cloud-upload", "coffee", "component", "copy", "copyright", "css3", "cut", "d-arrow-left", "d-arrow-right", "d-caret", "dashboard", "date", "delete", "dingding", "dislike-o", "document", "dot-chart", "down-circle-o", "down-circle", "down-square-o", "down-square", "download", "edit", "enter", "environment-o", "environment", "eye-o", "eye", "facebook", "file-add", "file-excel", "file-jpg", "file-pdf", "file-text", "file-unknown", "filter", "firefox", "folder-add", "folder-open", "folder", "forward", "foursquare", "frown-o", "frown", "github-o", "github", "global", "heart-off", "heart-on", "home", "html5", "ie", "inbox", "information-o", "information", "laptop", "left-circle-o", "left-circle", "left-square-o", "left-square", "like-o", "link", "linkedin", "linux", "loading", "lock", "login", "logout", "man", "map", "meh-o", "meh", "menu-fold", "menu-unfold", "menu", "mail", "mail-o", "message", "minus-circle-o", "minus-circle", "minus-square-o", "minus-square", "minus", "mobile", "more", "notification", "opera", "paper-clip", "pause-circle-o", "pause-circle", "pause", "pay-circle-o", "pay", "picasa", "picture", "pie-chart", "pinterest", "play-circle-o", "play-circle", "plus-circle-o", "plus-circle", "plus-square-o", "plus-square", "plus", "poweroff", "printer", "qq", "qrcode", "question-circle-o", "question-circle", "reddit", "reload", "right-circle-o", "right-circle", "right-square-o", "right-square", "rollback", "safari", "safety", "save", "search", "setting-o", "setting", "share", "shopping-cart", "shrink", "smile-o", "smile", "star-off", "star-on", "swap-left", "swap-right", "swap", "table", "tag-o", "tag", "tags-o", "tags", "taobao", "time-o", "time", "twitter", "uiw", "unlock", "up-circle-o", "up-circle", "up-square-o", "up-square", "upload", "user-add", "user-delete", "user", "usergroup-add", "usergroup-delete", "verification", "verticle-left", "verticle-right", "video-camera", "warning-o", "warning", "weibo", "weixin", "wifi", "windows", "woman", "zoom-in", "zoom-out", 'stop-o', 'stop'];
+const icons = ["adobe", "alipay", "aliwangwang", "android-o", "android", "apple", "appstore-o", "appstore", "area-chart", "down", "left", "right", "up", "arrow-down", "arrow-left", "arrow-right", "arrow-up", "arrows-alt", "asterisk", "backward", "baidu", "bar-chart", "barcode", "bell", "camera-o", "caret-down", "caret-left", "caret-right", "caret-up", "check-square-o", "check-square", "check", "chrome", "circle-check-o", "circle-check", "circle-close-o", "circle-close", "close-square-o", "close-square", "close", "cloud-download-o", "cloud-download", "cloud-upload-o", "cloud-upload", "coffee", "component", "copy", "copyright", "css3", "cut", "d-arrow-left", "d-arrow-right", "d-caret", "dashboard", "date", "delete", "dingding", "dislike-o", "document", "dot-chart", "circle-o", "down-circle-o", "down-circle", "down-square-o", "down-square", "download", "edit", "enter", "environment-o", "environment", "eye-o", "eye", "facebook", "file-add", "file-excel", "file-jpg", "file-pdf", "file-text", "file-unknown", "filter", "firefox", "folder-add", "folder-open", "folder", "forward", "foursquare", "frown-o", "frown", "github-o", "github", "global", "heart-off", "heart-on", "home", "html5", "ie", "inbox", "information-o", "information", "laptop", "left-circle-o", "left-circle", "left-square-o", "left-square", "like-o", "link", "linkedin", "linux", "loading", "lock", "login", "logout", "man", "map", "meh-o", "meh", "menu-fold", "menu-unfold", "menu", "mail", "mail-o", "message", "minus-circle-o", "minus-circle", "minus-square-o", "minus-square", "minus", "mobile", "more", "notification", "opera", "paper-clip", "pause-circle-o", "pause-circle", "pause", "pay-circle-o", "pay", "picasa", "picture", "pie-chart", "pinterest", "play-circle-o", "play-circle", "plus-circle-o", "plus-circle", "plus-square-o", "plus-square", "plus", "poweroff", "printer", "qq", "qrcode", "question-circle-o", "question-circle", "reddit", "reload", "right-circle-o", "right-circle", "right-square-o", "right-square", "rollback", "safari", "safety", "save", "search", "setting-o", "setting", "share", "shopping-cart", "shrink", "smile-o", "smile", "star-off", "star-on", "swap-left", "swap-right", "swap", "table", "tag-o", "tag", "tags-o", "tags", "taobao", "time-o", "time", "twitter", "uiw", "unlock", "up-circle-o", "up-circle", "up-square-o", "up-square", "upload", "user-add", "user-delete", "user", "usergroup-add", "usergroup-delete", "verification", "verticle-left", "verticle-right", "video-camera", "warning-o", "warning", "weibo", "weixin", "wifi", "windows", "woman", "zoom-in", "zoom-out", 'stop-o', 'stop'];
 const itemStyl = {
@@ -309,3 +309,3 @@ fontSize: 26, minWidth: 120, background: '#eaeaea', marginBottom: 10, marginRight: 10, padding: '20px 0',
 const iconList = [
-  'down-square-o','down-square','up-square-o', 'up-square','left-square-o','left-square', 'right-square-o', 'right-square',
+  'circle-o', 'down-square-o','down-square','up-square-o', 'up-square','left-square-o','left-square', 'right-square-o', 'right-square',
 ]
@@ -340,3 +340,3 @@ const itemStyl = {
 const iconList = [
-  'down-circle-o', 'down-circle','up-circle-o','up-circle','left-circle-o', 'left-circle','right-circle-o', 'right-circle','play-circle-o',  'play-circle',
+  'square-o', 'down-circle-o', 'down-circle','up-circle-o','up-circle','left-circle-o', 'left-circle','right-circle-o', 'right-circle','play-circle-o',  'play-circle',
 ]
@@ -343,0 +343,0 @@ const itemStyl = {

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

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

42305

decreased by-8.67%

Lines of code

254

decreased by-20.13%

No dependency changes