react-antd-icons - npm Package Compare versions

Comparing version 0.0.1-alpha.4 to 0.1.0-alpha.1

esm/components/AntdIcon.d.ts

 import * as React from 'react';
 export interface IAntdIconProps {
     type: string;
-    prefix?: string;
     className?: string;
@@ -9,7 +8,3 @@ onClick?: React.MouseEventHandler<SVGSVGElement>;
 }
-export default class AntdIcon extends React.Component<IAntdIconProps> {
-    static displayName: string;
-    static NODE_ID: string;
-    render(): JSX.Element;
-    componentDidMount(): void;
-}
+declare const AntdIcon: React.SFC<IAntdIconProps>;
+export default AntdIcon;

esm/index.js

@@ -1,3 +0,3 @@
-import { library, prefix } from 'antd-icons';
-import { createElement, Component } from 'react';
+import { createElement } from 'react';
+import { antDesignIcons, library } from 'antd-icons';
 
@@ -18,14 +18,3 @@ /*! *****************************************************************************
 ***************************************************************************** */
-/* global Reflect, Promise */
 
-var extendStatics = Object.setPrototypeOf ||
-    ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-    function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-
-function __extends(d, b) {
-    extendStatics(d, b);
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-}
-
 var __assign = Object.assign || function __assign(t) {
@@ -49,25 +38,32 @@ for (var s, i = 1, n = arguments.length; i < n; i++) {
 
-var AntdIcon = /** @class */ (function (_super) {
-    __extends(AntdIcon, _super);
-    function AntdIcon() {
-        return _super !== null && _super.apply(this, arguments) || this;
+function convert(createElement$$1, icon, extraProps) {
+    var _a;
+    var children = [];
+    if (icon.style) {
+        children.push(createElement$$1('style', {}, icon.style));
     }
-    AntdIcon.prototype.render = function () {
-        var _a = this.props, type = _a.type, prefix$$1 = _a.prefix, rest = __rest(_a, ["type", "prefix"]);
-        return (createElement("svg", __assign({ "data-icon": type, width: '1em', height: '1em', fill: 'currentColor' }, rest),
-            createElement("use", { xlinkHref: "#" + (typeof prefix$$1 === 'string' ? prefix$$1 : prefix) + type })));
-    };
-    AntdIcon.prototype.componentDidMount = function () {
-        if (document && typeof document.getElementById === 'function') {
-            var mountedNode = document.getElementById(AntdIcon.NODE_ID);
-            if (!mountedNode) {
-                library.dom.mount(AntdIcon.NODE_ID);
-            }
+    var iconChildren = icon.children
+        .map(function (_a, index) {
+        var tag = _a.tag, attrs = _a.attrs;
+        return createElement$$1(tag, __assign({}, attrs, { key: tag + "-" + index }));
+    });
+    children.push.apply(children, iconChildren);
+    return createElement$$1('svg', __assign({}, extraProps, (_a = {}, _a['data-icon'] = icon.name, _a.width = '1em', _a.height = '1em', _a.fill = 'currentColor', _a)), children);
+}
+var convertThunk = convert.bind(null, createElement);
+
+library.add.apply(library, antDesignIcons);
+var AntdIcon = function (props) {
+    var type = props.type, rest = __rest(props, ["type"]);
+    var target = library.definitions[type];
+    if (!target) {
+        if (!(process && process.env && process.env.NODE_ENV === 'production')) {
+            console.error('[react-antd-icons]: Could not find icon: ', type);
         }
-    };
-    AntdIcon.displayName = 'AntdIcon';
-    AntdIcon.NODE_ID = '__REACT_ANTD_ICONS__';
-    return AntdIcon;
-}(Component));
+        return null;
+    }
+    return convertThunk(target, rest);
+};
+AntdIcon.displayName = 'AntdIcon';
 
 export { AntdIcon };

lib/components/AntdIcon.d.ts

 import * as React from 'react';
 export interface IAntdIconProps {
     type: string;
-    prefix?: string;
     className?: string;
@@ -9,7 +8,3 @@ onClick?: React.MouseEventHandler<SVGSVGElement>;
 }
-export default class AntdIcon extends React.Component<IAntdIconProps> {
-    static displayName: string;
-    static NODE_ID: string;
-    render(): JSX.Element;
-    componentDidMount(): void;
-}
+declare const AntdIcon: React.SFC<IAntdIconProps>;
+export default AntdIcon;

lib/index.js

@@ -5,4 +5,4 @@ 'use strict';
 
+var React = require('react');
 var antdIcons = require('antd-icons');
-var React = require('react');
 
@@ -23,14 +23,3 @@ /*! *****************************************************************************
 ***************************************************************************** */
-/* global Reflect, Promise */
 
-var extendStatics = Object.setPrototypeOf ||
-    ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-    function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-
-function __extends(d, b) {
-    extendStatics(d, b);
-    function __() { this.constructor = d; }
-    d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-}
-
 var __assign = Object.assign || function __assign(t) {
@@ -54,25 +43,32 @@ for (var s, i = 1, n = arguments.length; i < n; i++) {
 
-var AntdIcon = /** @class */ (function (_super) {
-    __extends(AntdIcon, _super);
-    function AntdIcon() {
-        return _super !== null && _super.apply(this, arguments) || this;
+function convert(createElement, icon, extraProps) {
+    var _a;
+    var children = [];
+    if (icon.style) {
+        children.push(createElement('style', {}, icon.style));
     }
-    AntdIcon.prototype.render = function () {
-        var _a = this.props, type = _a.type, prefix = _a.prefix, rest = __rest(_a, ["type", "prefix"]);
-        return (React.createElement("svg", __assign({ "data-icon": type, width: '1em', height: '1em', fill: 'currentColor' }, rest),
-            React.createElement("use", { xlinkHref: "#" + (typeof prefix === 'string' ? prefix : antdIcons.prefix) + type })));
-    };
-    AntdIcon.prototype.componentDidMount = function () {
-        if (document && typeof document.getElementById === 'function') {
-            var mountedNode = document.getElementById(AntdIcon.NODE_ID);
-            if (!mountedNode) {
-                antdIcons.library.dom.mount(AntdIcon.NODE_ID);
-            }
+    var iconChildren = icon.children
+        .map(function (_a, index) {
+        var tag = _a.tag, attrs = _a.attrs;
+        return createElement(tag, __assign({}, attrs, { key: tag + "-" + index }));
+    });
+    children.push.apply(children, iconChildren);
+    return createElement('svg', __assign({}, extraProps, (_a = {}, _a['data-icon'] = icon.name, _a.width = '1em', _a.height = '1em', _a.fill = 'currentColor', _a)), children);
+}
+var convertThunk = convert.bind(null, React.createElement);
+
+antdIcons.library.add.apply(antdIcons.library, antdIcons.antDesignIcons);
+var AntdIcon = function (props) {
+    var type = props.type, rest = __rest(props, ["type"]);
+    var target = antdIcons.library.definitions[type];
+    if (!target) {
+        if (!(process && process.env && process.env.NODE_ENV === 'production')) {
+            console.error('[react-antd-icons]: Could not find icon: ', type);
         }
-    };
-    AntdIcon.displayName = 'AntdIcon';
-    AntdIcon.NODE_ID = '__REACT_ANTD_ICONS__';
-    return AntdIcon;
-}(React.Component));
+        return null;
+    }
+    return convertThunk(target, rest);
+};
+AntdIcon.displayName = 'AntdIcon';
 
 exports.AntdIcon = AntdIcon;

package.json

 {
   "name": "react-antd-icons",
-  "version": "0.0.1-alpha.4",
+  "version": "0.1.0-alpha.1",
   "main": "./lib/index.js",
@@ -16,3 +16,3 @@ "module": "./esm/index.js",
   "peerDependencies": {
-    "antd-icons": "^0.0.3-alpha.3",
+    "antd-icons": "^0.1.0-alpha.1",
     "react": "^16.4.1"
@@ -25,3 +25,3 @@ },
     "@types/react-test-renderer": "^16.0.1",
-    "antd-icons": "^0.0.3-alpha.3",
+    "antd-icons": "^0.1.0-alpha.1",
     "cross-env": "^5.2.0",
@@ -28,0 +28,0 @@ "espower-typescript": "^9.0.0",

ReadMe.md

@@ -14,3 +14,3 @@ # React Antd Icons
 ```ts
-import { library, Alibaba } from 'antd-icons';
+import { library, Alibaba } from 'antd-icons/esm';
 library.add(Alibaba);
@@ -22,3 +22,3 @@ ```
 ```jsx
-import { AntdIcon } from 'react-antd-icons';
+import { AntdIcon } from 'react-antd-icons/esm';
 import { render } from 'react-dom';
@@ -25,0 +25,0 @@

New alerts

Environment variable access

Supply chain risk

Package accesses environment variables, which may be a sign of credential stuffing or data theft.

Found 2 instances in 1 package

Worsened metrics

Total package byte prevSize

13286

decreased by-30.66%

Number of package files

37

decreased by-47.14%

Lines of code

249

decreased by-1.19%

Number of low supply chain risk alerts

5

increased by400%

No dependency changes