@deepnoid/canvas 0.1.42 → 0.1.43

package/dist/components/AnnotationLayer/_hooks/drawEvents/rectangle.d.ts

@@ -1,5 +1,5 @@
 import { DrawEventsParams } from './useDrawEvents';
 export declare const handleMouseDownRectangle: ({ canvasRef, canvasStateRef, mouseActionRef, mousePointRef, setMousePoint, startMousePointRef, currentCoordinateRef, coordinatesRef, rectangleAnchorRef, }: DrawEventsParams) => (event: globalThis.MouseEvent) => void;
 export declare const handleMouseMoveRectangle: ({ canvasRef, canvasStateRef, mouseActionRef, mousePointRef, setMousePoint, prevMousePointRef, currentCoordinateRef, coordinatesRef, rectangleAnchorRef, }: DrawEventsParams) => (event: globalThis.MouseEvent) => void;
-export declare const handleMouseUpRectangle: ({ canvasRef, canvasStateRef, mouseActionRef, mousePointRef, setMousePoint, startMousePointRef, prevMousePointRef, currentCoordinateRef, coordinatesRef, setCoordinates, rectangleAnchorRef, historyRef, drawLabel, }: DrawEventsParams) => (event: globalThis.MouseEvent) => void;
+export declare const handleMouseUpRectangle: ({ canvasRef, canvasStateRef, mouseActionRef, mousePointRef, setMousePoint, startMousePointRef, prevMousePointRef, currentCoordinateRef, coordinatesRef, setCoordinates, rectangleAnchorRef, historyRef, drawLabelRef, }: DrawEventsParams) => (event: globalThis.MouseEvent) => void;
 export declare const handleMouseLeaveRectangle: ({ canvasRef, canvasStateRef, setMousePoint, startMousePointRef, prevMousePointRef, mouseActionRef, rectangleAnchorRef, }: DrawEventsParams) => (event: globalThis.MouseEvent) => void;

package/dist/components/AnnotationLayer/_hooks/drawEvents/rectangle.js

@@ -36,7 +36,7 @@ export const handleMouseMoveRectangle = ({ canvasRef, canvasStateRef, mouseActio
     });
     event.preventDefault();
 };
-export const handleMouseUpRectangle = ({ canvasRef, canvasStateRef, mouseActionRef, mousePointRef, setMousePoint, startMousePointRef, prevMousePointRef, currentCoordinateRef, coordinatesRef, setCoordinates, rectangleAnchorRef, historyRef, drawLabel, }) => (event) => {
+export const handleMouseUpRectangle = ({ canvasRef, canvasStateRef, mouseActionRef, mousePointRef, setMousePoint, startMousePointRef, prevMousePointRef, currentCoordinateRef, coordinatesRef, setCoordinates, rectangleAnchorRef, historyRef, drawLabelRef, }) => (event) => {
     if (!canvasRef.current || !isMouseClickAction(event.button, MouseAction.LEFT))
         return;
     const mousePoint = getCanvasMousePoint(event, canvasRef.current, canvasStateRef.current);
@@ -48,7 +48,8 @@ export const handleMouseUpRectangle = ({ canvasRef, canvasStateRef, mouseActionR
         if (movedWidth > ACTIVE_POINT_SIZE || movedHeight > ACTIVE_POINT_SIZE) {
             const { x, y, width, height } = clampBoundingBoxToImage(Math.min(startMousePointRef.current.x, mousePoint.x), Math.min(startMousePointRef.current.y, mousePoint.y), movedWidth, movedHeight, dw, dh);
             if (!currentCoordinateRef.current) {
-                const newCoordinate = { label: drawLabel, type: DrawMode.RECTANGLE, x, y, width, height, selected: false };
+                const label = drawLabelRef.current;
+                const newCoordinate = { label, type: DrawMode.RECTANGLE, x, y, width, height, selected: false };
                 createCoordinate(newCoordinate, setCoordinates, coordinatesRef, historyRef, currentCoordinateRef);
             }
         }

package/dist/components/AnnotationLayer/_hooks/drawEvents/useDrawEvents.d.ts

@@ -17,7 +17,7 @@ export type DrawEventsParams = {
     rectangleAnchorRef: RefObject<RectangleAnchor | null>;
     historyRef: RefObject<CoordinateHistory>;
     maskImageRef: RefObject<HTMLImageElement | null>;
-    drawLabel?: Label;
+    drawLabelRef: RefObject<Label | undefined>;
 };
 export declare const useDrawEvents: (params: DrawEventsParams & {
     selectedDrawMode?: DrawMode;

package/dist/components/AnnotationLayer/index.js

@@ -23,7 +23,11 @@ const AnnotationLayer = ({ canvasState, coordinates = [], setCoordinates: propSe
     const startMousePointRef = useRef(null);
     const prevMousePointRef = useRef(null);
     const rectangleAnchorRef = useRef(null);
+    const drawLabelRef = useRef(drawLabel);
     const [showSelectedOnly, setShowSelectedOnly] = useState(false);
+    useEffect(() => {
+        drawLabelRef.current = drawLabel;
+    }, [drawLabel]);
     const setCoordinates = useCallback((coordinates) => {
         coordinatesRef.current = cloneDeep(coordinates) || [];
         propSetCoordinates && propSetCoordinates(coordinates);
@@ -44,7 +48,7 @@ const AnnotationLayer = ({ canvasState, coordinates = [], setCoordinates: propSe
         rectangleAnchorRef,
         historyRef,
         maskImageRef,
-        drawLabel,
+        drawLabelRef,
         selectedDrawMode,
         editable,
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deepnoid/canvas",
-  "version": "0.1.42",
+  "version": "0.1.43",
   "type": "module",
   "license": "MIT",
   "main": "./dist/index.cjs",