react-best-gradient-color-picker - npm Package Compare versions

Comparing version 3.0.10-beta.3 to 3.0.10-beta.4

dist/cjs/components/icon.js

@@ -24,7 +24,10 @@ "use strict";
         fill: 'none',
-        stroke: col,
         strokeWidth: '1.8px',
     };
     return (react_1.default.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 14 } },
-        react_1.default.createElement("polyline", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...styles, ...defaultStyles.rbgcpControlIcon }, points: "0.9 12.73 0.9 19.1 7.27 19.1 0.9 19.1 19.1 0.9 12.73 0.9 19.1 0.9 19.1 7.27" })));
+        react_1.default.createElement("polyline", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...styles,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "0.9 12.73 0.9 19.1 7.27 19.1 0.9 19.1 19.1 0.9 12.73 0.9 19.1 0.9 19.1 7.27" })));
 };
@@ -37,3 +40,2 @@ exports.LinearIcon = LinearIcon;
         fill: 'none',
-        stroke: col,
         strokeMiterlimit: 10,
@@ -43,4 +45,12 @@ strokeWidth: '1.8px',
     return (react_1.default.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 15 } },
-        react_1.default.createElement("circle", { style: { ...styles, ...defaultStyles.rbgcpControlIcon }, cx: "10", cy: "10", r: "9" }),
-        react_1.default.createElement("circle", { style: { ...styles, ...defaultStyles.rbgcpControlIcon }, cx: "10", cy: "10", r: "5" })));
+        react_1.default.createElement("circle", { style: {
+                ...styles,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, cx: "10", cy: "10", r: "9" }),
+        react_1.default.createElement("circle", { style: {
+                ...styles,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, cx: "10", cy: "10", r: "5" })));
 };
@@ -53,17 +63,38 @@ exports.RadialIcon = RadialIcon;
         fill: 'none',
-        stroke: col,
         strokeWidth: '1.8px',
     };
     const style2 = {
-        fill: col,
-        stroke: col,
         strokeWidth: '1.8px',
     };
     return (react_1.default.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 17 } },
-        react_1.default.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, points: "3.74 2.75 3.74 12.69 0.9 12.71 6.59 12.71" }),
-        react_1.default.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, x1: "3.74", y1: "17.26", x2: "3.74", y2: "15.21" }),
-        react_1.default.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, points: "10.1 17.25 10.1 7.31 12.95 7.29 7.26 7.29" }),
-        react_1.default.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, x1: "10.1", y1: "2.74", x2: "10.1", y2: "4.79" }),
-        react_1.default.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, points: "16.26 2.75 16.26 12.69 13.41 12.71 19.1 12.71" }),
-        react_1.default.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, x1: "16.26", y1: "17.26", x2: "16.26", y2: "15.21" })));
+        react_1.default.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "3.74 2.75 3.74 12.69 0.9 12.71 6.59 12.71" }),
+        react_1.default.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col, fill: col }),
+            }, x1: "3.74", y1: "17.26", x2: "3.74", y2: "15.21" }),
+        react_1.default.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "10.1 17.25 10.1 7.31 12.95 7.29 7.26 7.29" }),
+        react_1.default.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col, fill: col }),
+            }, x1: "10.1", y1: "2.74", x2: "10.1", y2: "4.79" }),
+        react_1.default.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "16.26 2.75 16.26 12.69 13.41 12.71 19.1 12.71" }),
+        react_1.default.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col, fill: col }),
+            }, x1: "16.26", y1: "17.26", x2: "16.26", y2: "15.21" })));
 };
@@ -76,9 +107,20 @@ exports.SlidersIcon = SlidersIcon;
         fill: 'none',
-        stroke: col,
         strokeWidth: '1.8px',
     };
     return (react_1.default.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 17 } },
-        react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, d: "M6.35,2.72a4.85,4.85,0,0,1,1.86.16,7.94,7.94,0,0,1,.88.43,3.66,3.66,0,0,0,.85.49c.25,0,.58-.27.81-.39A8.25,8.25,0,0,1,11.7,3a4,4,0,0,1,1.79-.23,3.21,3.21,0,0,0-1.34.09,6.39,6.39,0,0,0-1.47.63c-.45.25-.7.3-.7.86s0,1.18,0,1.78c0,1.3,0,2.61,0,3.92h0v5.63a2.46,2.46,0,0,1,0,.47c-.07.28-.43.42-.7.57a5.29,5.29,0,0,1-2.94.61A9.3,9.3,0,0,0,8,17.15l1.09-.37.89-.52c.06,0,.48.21.56.25.32.14.64.27,1,.38a8.54,8.54,0,0,0,2.12.4" }),
-        react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, d: "M7.57,5.73C6,5.7,4.5,5.65,3,5.77a2.28,2.28,0,0,0-1.76.74A2.3,2.3,0,0,0,.94,7.83l0,3.82A4.73,4.73,0,0,0,1,12.9a1.64,1.64,0,0,0,.68,1,2.44,2.44,0,0,0,1,.27,25,25,0,0,0,4.74.09" }),
-        react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, d: "M12.43,14.32a44.12,44.12,0,0,0,4.6,0,2.24,2.24,0,0,0,1.76-.74,2.29,2.29,0,0,0,.27-1.32l0-3.81A4.81,4.81,0,0,0,19,7.15a1.62,1.62,0,0,0-.68-1,2.31,2.31,0,0,0-1-.28,26.8,26.8,0,0,0-4.74-.09" })));
+        react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, d: "M6.35,2.72a4.85,4.85,0,0,1,1.86.16,7.94,7.94,0,0,1,.88.43,3.66,3.66,0,0,0,.85.49c.25,0,.58-.27.81-.39A8.25,8.25,0,0,1,11.7,3a4,4,0,0,1,1.79-.23,3.21,3.21,0,0,0-1.34.09,6.39,6.39,0,0,0-1.47.63c-.45.25-.7.3-.7.86s0,1.18,0,1.78c0,1.3,0,2.61,0,3.92h0v5.63a2.46,2.46,0,0,1,0,.47c-.07.28-.43.42-.7.57a5.29,5.29,0,0,1-2.94.61A9.3,9.3,0,0,0,8,17.15l1.09-.37.89-.52c.06,0,.48.21.56.25.32.14.64.27,1,.38a8.54,8.54,0,0,0,2.12.4" }),
+        react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, d: "M7.57,5.73C6,5.7,4.5,5.65,3,5.77a2.28,2.28,0,0,0-1.76.74A2.3,2.3,0,0,0,.94,7.83l0,3.82A4.73,4.73,0,0,0,1,12.9a1.64,1.64,0,0,0,.68,1,2.44,2.44,0,0,0,1,.27,25,25,0,0,0,4.74.09" }),
+        react_1.default.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, d: "M12.43,14.32a44.12,44.12,0,0,0,4.6,0,2.24,2.24,0,0,0,1.76-.74,2.29,2.29,0,0,0,.27-1.32l0-3.81A4.81,4.81,0,0,0,19,7.15a1.62,1.62,0,0,0-.68-1,2.31,2.31,0,0,0-1-.28,26.8,26.8,0,0,0-4.74-.09" })));
 };
@@ -89,6 +131,3 @@ exports.InputsIcon = InputsIcon;
     const col = color || '';
-    const style1 = { fill: col };
     const style2 = {
-        fill: col,
-        stroke: col,
         strokeMiterlimit: 10,
@@ -98,6 +137,18 @@ strokeWidth: '0.5px',
     return (react_1.default.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 17 } },
-        react_1.default.createElement("circle", { style: { ...style1, ...defaultStyles.rbgcpControlIcon2 }, cx: "9.36", cy: "5.07", r: "1.71" }),
-        react_1.default.createElement("circle", { style: { ...style1, ...defaultStyles.rbgcpControlIcon2 }, cx: "13.93", cy: "6.91", r: "1.71" }),
-        react_1.default.createElement("circle", { style: { ...style1, ...defaultStyles.rbgcpControlIcon2 }, cx: "5.8", cy: "7.55", r: "1.71" }),
-        react_1.default.createElement("circle", { style: { ...style1, ...defaultStyles.rbgcpControlIcon2 }, cx: "5.45", cy: "12.04", r: "1.71" }),
+        react_1.default.createElement("circle", { style: {
+                ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col }),
+            }, cx: "9.36", cy: "5.07", r: "1.71" }),
+        react_1.default.createElement("circle", { style: {
+                ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col }),
+            }, cx: "13.93", cy: "6.91", r: "1.71" }),
+        react_1.default.createElement("circle", { style: {
+                ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col }),
+            }, cx: "5.8", cy: "7.55", r: "1.71" }),
+        react_1.default.createElement("circle", { style: {
+                ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col }),
+            }, cx: "5.45", cy: "12.04", r: "1.71" }),
         react_1.default.createElement("path", { style: {
@@ -107,2 +158,3 @@ ...style2,
                 ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col, stroke: col }),
             }, d: "M19.1,10c0,3.58-2.12,2.94-4.06,2.35-1.15-.34-2.24-.67-2.77-.08-.68.78-.54,2.07-.39,3.33.2,1.79.39,3.5-1.88,3.5A9.1,9.1,0,1,1,19.1,10ZM10,18c.7,0,.74-.19.75-.2a2.67,2.67,0,0,0,.07-1.27c0-.19,0-.42-.06-.67-.06-.53-.13-1.15-.14-1.67a3.82,3.82,0,0,1,.8-2.63,2.14,2.14,0,0,1,1.45-.7,4.36,4.36,0,0,1,1.32.12c.39.08.8.21,1.16.32h0c.39.12.74.23,1.08.3.74.17,1,.1,1.13,0S18,11.32,18,10a8,8,0,1,0-8,8Z" })));
@@ -116,3 +168,2 @@ };
         fill: 'none',
-        stroke: col,
         strokeMiterlimit: 10,
@@ -122,4 +173,12 @@ strokeWidth: '1.8px',
     return (react_1.default.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 15 } },
-        react_1.default.createElement("polyline", { strokeLinecap: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, points: "13.86 2.01 1.7 16.99 18.77 16.99" }),
-        react_1.default.createElement("polyline", { strokeLinecap: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, points: "10.96 16.38 10.96 16.38 10.74 15.7 10.44 14.97 10.06 14.21 9.72 13.63 9.21 12.89 8.85 12.44 8.41 11.95 7.91 11.45 7.51 11.1" })));
+        react_1.default.createElement("polyline", { strokeLinecap: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "13.86 2.01 1.7 16.99 18.77 16.99" }),
+        react_1.default.createElement("polyline", { strokeLinecap: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "10.96 16.38 10.96 16.38 10.74 15.7 10.44 14.97 10.06 14.21 9.72 13.63 9.21 12.89 8.85 12.44 8.41 11.95 7.91 11.45 7.51 11.1" })));
 };
@@ -126,0 +185,0 @@ exports.DegreesIcon = DegreesIcon;

dist/cjs/styles/styles.js

@@ -203,5 +203,5 @@ "use strict";
         for (const key in darkStyles_js_1.darkStyles) {
-            if (Object.prototype.hasOwnProperty.call(darkStyles_js_1.darkStyles, key) && Object.prototype.hasOwnProperty.call(styles, key)) {
+            if (Object.prototype.hasOwnProperty.call(darkStyles_js_1.darkStyles, key)) {
                 styles[key] = {
-                    ...styles[key],
+                    ...(Object.prototype.hasOwnProperty.call(styles, key) ? styles[key] : {}),
                     ...darkStyles_js_1.darkStyles[key],
@@ -208,0 +208,0 @@ };

dist/esm/components/icon.js

@@ -18,7 +18,10 @@ import React from 'react';
         fill: 'none',
-        stroke: col,
         strokeWidth: '1.8px',
     };
     return (React.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 14 } },
-        React.createElement("polyline", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...styles, ...defaultStyles.rbgcpControlIcon }, points: "0.9 12.73 0.9 19.1 7.27 19.1 0.9 19.1 19.1 0.9 12.73 0.9 19.1 0.9 19.1 7.27" })));
+        React.createElement("polyline", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...styles,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "0.9 12.73 0.9 19.1 7.27 19.1 0.9 19.1 19.1 0.9 12.73 0.9 19.1 0.9 19.1 7.27" })));
 };
@@ -30,3 +33,2 @@ export const RadialIcon = ({ color }) => {
         fill: 'none',
-        stroke: col,
         strokeMiterlimit: 10,
@@ -36,4 +38,12 @@ strokeWidth: '1.8px',
     return (React.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 15 } },
-        React.createElement("circle", { style: { ...styles, ...defaultStyles.rbgcpControlIcon }, cx: "10", cy: "10", r: "9" }),
-        React.createElement("circle", { style: { ...styles, ...defaultStyles.rbgcpControlIcon }, cx: "10", cy: "10", r: "5" })));
+        React.createElement("circle", { style: {
+                ...styles,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, cx: "10", cy: "10", r: "9" }),
+        React.createElement("circle", { style: {
+                ...styles,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, cx: "10", cy: "10", r: "5" })));
 };
@@ -45,17 +55,38 @@ export const SlidersIcon = ({ color }) => {
         fill: 'none',
-        stroke: col,
         strokeWidth: '1.8px',
     };
     const style2 = {
-        fill: col,
-        stroke: col,
         strokeWidth: '1.8px',
     };
     return (React.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 17 } },
-        React.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, points: "3.74 2.75 3.74 12.69 0.9 12.71 6.59 12.71" }),
-        React.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, x1: "3.74", y1: "17.26", x2: "3.74", y2: "15.21" }),
-        React.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, points: "10.1 17.25 10.1 7.31 12.95 7.29 7.26 7.29" }),
-        React.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, x1: "10.1", y1: "2.74", x2: "10.1", y2: "4.79" }),
-        React.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, points: "16.26 2.75 16.26 12.69 13.41 12.71 19.1 12.71" }),
-        React.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, x1: "16.26", y1: "17.26", x2: "16.26", y2: "15.21" })));
+        React.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "3.74 2.75 3.74 12.69 0.9 12.71 6.59 12.71" }),
+        React.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col, fill: col }),
+            }, x1: "3.74", y1: "17.26", x2: "3.74", y2: "15.21" }),
+        React.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "10.1 17.25 10.1 7.31 12.95 7.29 7.26 7.29" }),
+        React.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col, fill: col }),
+            }, x1: "10.1", y1: "2.74", x2: "10.1", y2: "4.79" }),
+        React.createElement("polyline", { fillRule: "evenodd", strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "16.26 2.75 16.26 12.69 13.41 12.71 19.1 12.71" }),
+        React.createElement("line", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col, fill: col }),
+            }, x1: "16.26", y1: "17.26", x2: "16.26", y2: "15.21" })));
 };
@@ -67,9 +98,20 @@ export const InputsIcon = ({ color }) => {
         fill: 'none',
-        stroke: col,
         strokeWidth: '1.8px',
     };
     return (React.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 17 } },
-        React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, d: "M6.35,2.72a4.85,4.85,0,0,1,1.86.16,7.94,7.94,0,0,1,.88.43,3.66,3.66,0,0,0,.85.49c.25,0,.58-.27.81-.39A8.25,8.25,0,0,1,11.7,3a4,4,0,0,1,1.79-.23,3.21,3.21,0,0,0-1.34.09,6.39,6.39,0,0,0-1.47.63c-.45.25-.7.3-.7.86s0,1.18,0,1.78c0,1.3,0,2.61,0,3.92h0v5.63a2.46,2.46,0,0,1,0,.47c-.07.28-.43.42-.7.57a5.29,5.29,0,0,1-2.94.61A9.3,9.3,0,0,0,8,17.15l1.09-.37.89-.52c.06,0,.48.21.56.25.32.14.64.27,1,.38a8.54,8.54,0,0,0,2.12.4" }),
-        React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, d: "M7.57,5.73C6,5.7,4.5,5.65,3,5.77a2.28,2.28,0,0,0-1.76.74A2.3,2.3,0,0,0,.94,7.83l0,3.82A4.73,4.73,0,0,0,1,12.9a1.64,1.64,0,0,0,.68,1,2.44,2.44,0,0,0,1,.27,25,25,0,0,0,4.74.09" }),
-        React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: { ...style1, ...defaultStyles.rbgcpControlIcon }, d: "M12.43,14.32a44.12,44.12,0,0,0,4.6,0,2.24,2.24,0,0,0,1.76-.74,2.29,2.29,0,0,0,.27-1.32l0-3.81A4.81,4.81,0,0,0,19,7.15a1.62,1.62,0,0,0-.68-1,2.31,2.31,0,0,0-1-.28,26.8,26.8,0,0,0-4.74-.09" })));
+        React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, d: "M6.35,2.72a4.85,4.85,0,0,1,1.86.16,7.94,7.94,0,0,1,.88.43,3.66,3.66,0,0,0,.85.49c.25,0,.58-.27.81-.39A8.25,8.25,0,0,1,11.7,3a4,4,0,0,1,1.79-.23,3.21,3.21,0,0,0-1.34.09,6.39,6.39,0,0,0-1.47.63c-.45.25-.7.3-.7.86s0,1.18,0,1.78c0,1.3,0,2.61,0,3.92h0v5.63a2.46,2.46,0,0,1,0,.47c-.07.28-.43.42-.7.57a5.29,5.29,0,0,1-2.94.61A9.3,9.3,0,0,0,8,17.15l1.09-.37.89-.52c.06,0,.48.21.56.25.32.14.64.27,1,.38a8.54,8.54,0,0,0,2.12.4" }),
+        React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, d: "M7.57,5.73C6,5.7,4.5,5.65,3,5.77a2.28,2.28,0,0,0-1.76.74A2.3,2.3,0,0,0,.94,7.83l0,3.82A4.73,4.73,0,0,0,1,12.9a1.64,1.64,0,0,0,.68,1,2.44,2.44,0,0,0,1,.27,25,25,0,0,0,4.74.09" }),
+        React.createElement("path", { strokeLinecap: "round", strokeLinejoin: "round", style: {
+                ...style1,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, d: "M12.43,14.32a44.12,44.12,0,0,0,4.6,0,2.24,2.24,0,0,0,1.76-.74,2.29,2.29,0,0,0,.27-1.32l0-3.81A4.81,4.81,0,0,0,19,7.15a1.62,1.62,0,0,0-.68-1,2.31,2.31,0,0,0-1-.28,26.8,26.8,0,0,0-4.74-.09" })));
 };
@@ -79,6 +121,3 @@ export const PaletteIcon = ({ color }) => {
     const col = color || '';
-    const style1 = { fill: col };
     const style2 = {
-        fill: col,
-        stroke: col,
         strokeMiterlimit: 10,
@@ -88,6 +127,18 @@ strokeWidth: '0.5px',
     return (React.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 17 } },
-        React.createElement("circle", { style: { ...style1, ...defaultStyles.rbgcpControlIcon2 }, cx: "9.36", cy: "5.07", r: "1.71" }),
-        React.createElement("circle", { style: { ...style1, ...defaultStyles.rbgcpControlIcon2 }, cx: "13.93", cy: "6.91", r: "1.71" }),
-        React.createElement("circle", { style: { ...style1, ...defaultStyles.rbgcpControlIcon2 }, cx: "5.8", cy: "7.55", r: "1.71" }),
-        React.createElement("circle", { style: { ...style1, ...defaultStyles.rbgcpControlIcon2 }, cx: "5.45", cy: "12.04", r: "1.71" }),
+        React.createElement("circle", { style: {
+                ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col }),
+            }, cx: "9.36", cy: "5.07", r: "1.71" }),
+        React.createElement("circle", { style: {
+                ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col }),
+            }, cx: "13.93", cy: "6.91", r: "1.71" }),
+        React.createElement("circle", { style: {
+                ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col }),
+            }, cx: "5.8", cy: "7.55", r: "1.71" }),
+        React.createElement("circle", { style: {
+                ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col }),
+            }, cx: "5.45", cy: "12.04", r: "1.71" }),
         React.createElement("path", { style: {
@@ -97,2 +148,3 @@ ...style2,
                 ...defaultStyles.rbgcpControlIcon2,
+                ...(col && { fill: col, stroke: col }),
             }, d: "M19.1,10c0,3.58-2.12,2.94-4.06,2.35-1.15-.34-2.24-.67-2.77-.08-.68.78-.54,2.07-.39,3.33.2,1.79.39,3.5-1.88,3.5A9.1,9.1,0,1,1,19.1,10ZM10,18c.7,0,.74-.19.75-.2a2.67,2.67,0,0,0,.07-1.27c0-.19,0-.42-.06-.67-.06-.53-.13-1.15-.14-1.67a3.82,3.82,0,0,1,.8-2.63,2.14,2.14,0,0,1,1.45-.7,4.36,4.36,0,0,1,1.32.12c.39.08.8.21,1.16.32h0c.39.12.74.23,1.08.3.74.17,1,.1,1.13,0S18,11.32,18,10a8,8,0,1,0-8,8Z" })));
@@ -105,3 +157,2 @@ };
         fill: 'none',
-        stroke: col,
         strokeMiterlimit: 10,
@@ -111,4 +162,12 @@ strokeWidth: '1.8px',
     return (React.createElement("svg", { id: "Layer_1", "data-name": "Layer 1", xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 20 20", style: { width: 15 } },
-        React.createElement("polyline", { strokeLinecap: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, points: "13.86 2.01 1.7 16.99 18.77 16.99" }),
-        React.createElement("polyline", { strokeLinecap: "round", style: { ...style2, ...defaultStyles.rbgcpControlIcon }, points: "10.96 16.38 10.96 16.38 10.74 15.7 10.44 14.97 10.06 14.21 9.72 13.63 9.21 12.89 8.85 12.44 8.41 11.95 7.91 11.45 7.51 11.1" })));
+        React.createElement("polyline", { strokeLinecap: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "13.86 2.01 1.7 16.99 18.77 16.99" }),
+        React.createElement("polyline", { strokeLinecap: "round", style: {
+                ...style2,
+                ...defaultStyles.rbgcpControlIcon,
+                ...(col && { stroke: col }),
+            }, points: "10.96 16.38 10.96 16.38 10.74 15.7 10.44 14.97 10.06 14.21 9.72 13.63 9.21 12.89 8.85 12.44 8.41 11.95 7.91 11.45 7.51 11.1" })));
 };
@@ -115,0 +174,0 @@ export const StopIcon = () => {

dist/esm/styles/styles.js

@@ -200,5 +200,5 @@ import { darkStyles } from './darkStyles.js';
         for (const key in darkStyles) {
-            if (Object.prototype.hasOwnProperty.call(darkStyles, key) && Object.prototype.hasOwnProperty.call(styles, key)) {
+            if (Object.prototype.hasOwnProperty.call(darkStyles, key)) {
                 styles[key] = {
-                    ...styles[key],
+                    ...(Object.prototype.hasOwnProperty.call(styles, key) ? styles[key] : {}),
                     ...darkStyles[key],
@@ -205,0 +205,0 @@ };

package.json

 {
   "name": "react-best-gradient-color-picker",
-  "version": "3.0.10-beta.3",
+  "version": "3.0.10-beta.4",
   "description": "An easy to use color/gradient picker for React.js",
@@ -5,0 +5,0 @@ "type": "module",

src/styles/styles.ts

@@ -202,5 +202,5 @@ import { darkStyles } from './darkStyles.js';
     for (const key in darkStyles) {
-      if (Object.prototype.hasOwnProperty.call(darkStyles, key) && Object.prototype.hasOwnProperty.call(styles, key)) {
+      if (Object.prototype.hasOwnProperty.call(darkStyles, key)) {
         (styles as Record<string, any>)[key] = {
-          ...(styles as Record<string, any>)[key],
+          ...(Object.prototype.hasOwnProperty.call(styles, key) ? (styles as Record<string, any>)[key] : {}),
           ...(darkStyles as Record<string, any>)[key],
@@ -211,4 +211,5 @@ };
 
+    return styles;
+  } 
   return styles;
-  } return styles;
 };
@@ -215,0 +216,0 @@

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

406105

increased by0.95%

Lines of code

11078

increased by1.58%

No dependency changes