react-eyedrop - npm Package Compare versions

Comparing version 5.4.1 to 5.4.2

dist/eyeDropper.js

@@ -42,4 +42,6 @@ "use strict";
         }
-        setPickingColorFromDocument(isPicking);
         setButtonDisabled(disableButton);
+        window.setTimeout(() => {
+            setPickingColorFromDocument(isPicking);
+        }, 250);
     }, [cursorActive, cursorInactive]);
@@ -46,0 +48,0 @@ const deactivateColorPicking = useCallback(() => {

dist/getColor/calcAverageColor.js

@@ -16,10 +16,8 @@ "use strict";
     }
-    const rgbAverage = colorBlock.reduce((rgbAcc, colorsObj) => {
-        rgbAcc[0] += Math.round(colorsObj.r / totalPixels);
-        rgbAcc[1] += Math.round(colorsObj.g / totalPixels);
-        rgbAcc[2] += Math.round(colorsObj.b / totalPixels);
-        return rgbAcc;
-    }, [0, 0, 0]);
-    return { r: rgbAverage[0], g: rgbAverage[1], b: rgbAverage[2] };
+    const rgbPrimary = colorBlock
+        .map(array => JSON.stringify(array))
+        .filter((item, index, array) => array.indexOf(item) === index)
+        .map(string => JSON.parse(string));
+    return { r: rgbPrimary[0][0], g: rgbPrimary[0][1], b: rgbPrimary[0][2] };
 };
 exports.calcAverageColor = calcAverageColor;

dist/getColor/getCanvasBlockColors.js

@@ -23,7 +23,3 @@ "use strict";
         const color = imageData.slice(i, i + 4);
-        colorBlock.push({
-            r: color[0],
-            g: color[1],
-            b: color[2]
-        });
+        colorBlock.push([color[0], color[1], color[2]]);
     }
@@ -30,0 +26,0 @@ return colorBlock;

dist/types.d.ts

@@ -16,5 +16,9 @@ export declare type RgbObj = {
     cursorInactive?: string;
+    customProps?: {
+        [key: string]: any;
+    };
     onPickStart?: () => void;
     onPickEnd?: () => void;
     onPickCancel?: () => void;
+    onChange?: (changes: OnChangeEyedrop) => void;
 };
@@ -21,0 +25,0 @@ export declare type PickingMode = {

dist/useEyeDrop.d.ts

@@ -7,3 +7,3 @@ import { HookOptions } from './types';
 declare type ReturnValue = [typeof initialStateColors, () => void, () => void];
-export declare const useEyeDrop: ({ once, pickRadius, cursorActive, cursorInactive, onPickStart, onPickEnd, onPickCancel, }?: HookOptions) => ReturnValue;
+export declare const useEyeDrop: ({ once, pickRadius, cursorActive, cursorInactive, customProps, onPickStart, onPickEnd, onPickCancel, onChange, }?: HookOptions) => ReturnValue;
 export {};

dist/useEyeDrop.js

@@ -21,3 +21,3 @@ "use strict";
 const initialStateColors = { rgb: '', hex: '' };
-const useEyeDrop = ({ once, pickRadius, cursorActive = 'copy', cursorInactive = 'auto', onPickStart, onPickEnd, onPickCancel, } = {}) => {
+const useEyeDrop = ({ once, pickRadius, cursorActive = 'copy', cursorInactive = 'auto', customProps, onPickStart, onPickEnd, onPickCancel, onChange, } = {}) => {
     const [colors, setColors] = useState(initialStateColors);
@@ -51,2 +51,8 @@ const [pickingColorFromDocument, setPickingColorFromDocument] = useState(false);
         const rgbColor = (0, getColor_1.getColor)(targetCanvas, e, pickRadius);
+        if (onChange) {
+            const rgb = (0, parseRgb_1.parseRGB)(rgbColor);
+            const hex = (0, rgbToHex_1.rgbToHex)(rgbColor);
+            // set color object to parent handler
+            onChange({ rgb, hex, customProps });
+        }
         updateColors(rgbColor);
@@ -57,3 +63,3 @@ once && setPickingColorFromDocument(false);
         }
-    }), [once, setPickingColorFromDocument]);
+    }), [customProps, once, setPickingColorFromDocument]);
     useEffect(() => {
@@ -60,0 +66,0 @@ if (pickingColorFromDocument) {

package.json

 {
   "name": "react-eyedrop",
-  "version": "5.4.1",
+  "version": "5.4.2",
   "description": "A reusable ColorPick EyeDropper written in React & TypeScript.",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

README.md

@@ -286,2 +286,5 @@ # React EyeDrop
 
+* 5.4.2
+  * Fixed bug with color picking HTML elements
+  * Now functions with React 18
 * 5.4.1
@@ -288,0 +291,0 @@ * Added onPickStart, onPickEnd and onPickCancel to hook

No alert changes

Improved metrics

Total package byte prevSize

36356

increased by1.17%

Lines of code

591

increased by1.03%

Number of lines in readme file

351

increased by0.86%

No dependency changes