@ant-design/icons-react - npm Package Compare versions

Comparing version 1.0.0-alpha.1 to 1.0.0-alpha.2

es/components/Icon.d.ts

@@ -9,3 +9,9 @@ import { IconDefinition, IconDefinitionGetter } from '@ant-design/icons/lib/types';
     style?: React.CSSProperties;
+    primaryColor?: string;
+    secondaryColor?: string;
 }
+export interface TwoToneColorPalette {
+    primaryColor: string;
+    secondaryColor: string;
+}
 declare class Icon extends React.Component<IconProps> {
@@ -16,3 +22,3 @@ static displayName: string;
     static clear(): void;
-    static get(key?: string): IconDefinition | undefined;
+    static get(key?: string, colors?: TwoToneColorPalette): IconDefinition | undefined;
     static setTwoTonePrimaryColor(primaryColor: string, secondaryColor?: string): void;
@@ -19,0 +25,0 @@ render(): any;

es/components/Icon.js

@@ -6,5 +6,4 @@ import _defineProperty from 'babel-runtime/helpers/defineProperty';
 import _inherits from 'babel-runtime/helpers/inherits';
-import { generate as generateColor } from 'ant-design-palettes';
 import * as React from 'react';
-import { generate, getIconNameAccordingToSuffix, isIconDefinition, isIconDefinitionGetter, log, MiniMap } from '../utils';
+import { generate, getIconNameAccordingToSuffix, getSecondaryColor, isIconDefinition, isIconDefinitionGetter, log, MiniMap } from '../utils';
 var twoToneColorPalette = {
@@ -33,11 +32,20 @@ primaryColor: '#333',
                 onClick = _props.onClick,
-                style = _props.style;
+                style = _props.style,
+                primaryColor = _props.primaryColor,
+                secondaryColor = _props.secondaryColor;
 
             var target = void 0;
+            var colors = twoToneColorPalette;
+            if (primaryColor) {
+                colors = {
+                    primaryColor: primaryColor,
+                    secondaryColor: secondaryColor || getSecondaryColor(primaryColor)
+                };
+            }
             if (isIconDefinition(type)) {
                 target = type;
             } else if (isIconDefinitionGetter(type)) {
-                target = type(twoToneColorPalette.primaryColor, twoToneColorPalette.secondaryColor);
+                target = type(colors.primaryColor, colors.secondaryColor);
             } else if (typeof type === 'string') {
-                target = Icon.get(getIconNameAccordingToSuffix(type));
+                target = Icon.get(getIconNameAccordingToSuffix(type), colors);
                 if (!target) {
@@ -79,6 +87,8 @@ log('Could not find icon: ' + type);
         value: function get(key) {
+            var colors = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : twoToneColorPalette;
+
             if (key) {
                 var result = this.definitions.get(key);
                 if (isIconDefinitionGetter(result)) {
-                    result = result(twoToneColorPalette.primaryColor, twoToneColorPalette.secondaryColor);
+                    result = result(colors.primaryColor, colors.secondaryColor);
                 }
@@ -92,5 +102,3 @@ return result;
             twoToneColorPalette.primaryColor = primaryColor;
-            twoToneColorPalette.secondaryColor =
-            // choose the second color
-            secondaryColor || generateColor(twoToneColorPalette.primaryColor)[1];
+            twoToneColorPalette.secondaryColor = secondaryColor || getSecondaryColor(primaryColor);
         }
@@ -97,0 +105,0 @@ }]);

es/utils.d.ts

@@ -22,1 +22,2 @@ import { AbstractNode, IconDefinition, IconDefinitionGetter } from '@ant-design/icons/lib/types';
 export declare function getIconNameAccordingToSuffix(type: string): string | undefined;
+export declare function getSecondaryColor(primaryColor: string): string;

es/utils.js

@@ -5,2 +5,3 @@ import _extends from 'babel-runtime/helpers/extends';
 import mapper from '@ant-design/icons/lib/mapNameToThemedName';
+import { generate as generateColor } from 'ant-design-palettes';
 import * as React from 'react';
@@ -93,3 +94,8 @@ export function log(message) {
     }
+    // use mapper from '@ant-design/icons/lib/mapNameToThemedName'
     return mapper[type];
+}
+export function getSecondaryColor(primaryColor) {
+    // choose the second color
+    return generateColor(primaryColor)[0];
 }

lib/components/Icon.d.ts

@@ -9,3 +9,9 @@ import { IconDefinition, IconDefinitionGetter } from '@ant-design/icons/lib/types';
     style?: React.CSSProperties;
+    primaryColor?: string;
+    secondaryColor?: string;
 }
+export interface TwoToneColorPalette {
+    primaryColor: string;
+    secondaryColor: string;
+}
 declare class Icon extends React.Component<IconProps> {
@@ -16,3 +22,3 @@ static displayName: string;
     static clear(): void;
-    static get(key?: string): IconDefinition | undefined;
+    static get(key?: string, colors?: TwoToneColorPalette): IconDefinition | undefined;
     static setTwoTonePrimaryColor(primaryColor: string, secondaryColor?: string): void;
@@ -19,0 +25,0 @@ render(): any;

lib/components/Icon.js

@@ -27,4 +27,2 @@ 'use strict';
 
-var _antDesignPalettes = require('ant-design-palettes');
-
 var _react = require('react');
@@ -62,11 +60,20 @@
                 onClick = _props.onClick,
-                style = _props.style;
+                style = _props.style,
+                primaryColor = _props.primaryColor,
+                secondaryColor = _props.secondaryColor;
 
             var target = void 0;
+            var colors = twoToneColorPalette;
+            if (primaryColor) {
+                colors = {
+                    primaryColor: primaryColor,
+                    secondaryColor: secondaryColor || (0, _utils.getSecondaryColor)(primaryColor)
+                };
+            }
             if ((0, _utils.isIconDefinition)(type)) {
                 target = type;
             } else if ((0, _utils.isIconDefinitionGetter)(type)) {
-                target = type(twoToneColorPalette.primaryColor, twoToneColorPalette.secondaryColor);
+                target = type(colors.primaryColor, colors.secondaryColor);
             } else if (typeof type === 'string') {
-                target = Icon.get((0, _utils.getIconNameAccordingToSuffix)(type));
+                target = Icon.get((0, _utils.getIconNameAccordingToSuffix)(type), colors);
                 if (!target) {
@@ -108,6 +115,8 @@ (0, _utils.log)('Could not find icon: ' + type);
         value: function get(key) {
+            var colors = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : twoToneColorPalette;
+
             if (key) {
                 var result = this.definitions.get(key);
                 if ((0, _utils.isIconDefinitionGetter)(result)) {
-                    result = result(twoToneColorPalette.primaryColor, twoToneColorPalette.secondaryColor);
+                    result = result(colors.primaryColor, colors.secondaryColor);
                 }
@@ -121,5 +130,3 @@ return result;
             twoToneColorPalette.primaryColor = primaryColor;
-            twoToneColorPalette.secondaryColor =
-            // choose the second color
-            secondaryColor || (0, _antDesignPalettes.generate)(twoToneColorPalette.primaryColor)[1];
+            twoToneColorPalette.secondaryColor = secondaryColor || (0, _utils.getSecondaryColor)(primaryColor);
         }
@@ -126,0 +133,0 @@ }]);

lib/utils.d.ts

@@ -22,1 +22,2 @@ import { AbstractNode, IconDefinition, IconDefinitionGetter } from '@ant-design/icons/lib/types';
 export declare function getIconNameAccordingToSuffix(type: string): string | undefined;
+export declare function getSecondaryColor(primaryColor: string): string;

lib/utils.js

@@ -26,2 +26,3 @@ 'use strict';
 exports.getIconNameAccordingToSuffix = getIconNameAccordingToSuffix;
+exports.getSecondaryColor = getSecondaryColor;
 
@@ -32,2 +33,4 @@ var _mapNameToThemedName = require('@ant-design/icons/lib/mapNameToThemedName');
 
+var _antDesignPalettes = require('ant-design-palettes');
+
 var _react = require('react');
@@ -128,3 +131,8 @@
     }
+    // use mapper from '@ant-design/icons/lib/mapNameToThemedName'
     return _mapNameToThemedName2['default'][type];
+}
+function getSecondaryColor(primaryColor) {
+    // choose the second color
+    return (0, _antDesignPalettes.generate)(primaryColor)[0];
 }

package.json

 {
   "name": "@ant-design/icons-react",
-  "version": "1.0.0-alpha.1",
+  "version": "1.0.0-alpha.2",
   "main": "./lib/index.js",
@@ -5,0 +5,0 @@ "module": "./es/index.js",

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

Improved metrics

Total package byte prevSize

23951

increased by7.83%

Lines of code

521

increased by8.54%

No dependency changes