Function onRegionPointerDown

apps/desktop/src/components/Cropper.tsx:643–677

(e: PointerEvent)

	});

	function onRegionPointerDown(e: PointerEvent) {
		if (!containerRef || e.button !== 0) return;

		const target = e.currentTarget as HTMLElement;
		disposeActivePointerSession();
		stopAnimation();
		e.stopPropagation();
		setMouseState({ drag: "region" });
		let currentBounds = rawBounds();
		const containerRect = containerRef.getBoundingClientRect();
		const startOffset = {
			x: e.clientX - containerRect.left - currentBounds.x,
			y: e.clientY - containerRect.top - currentBounds.y,
		};

		trackPointerSession(
			target,
			e.pointerId,
			(e) => {
				let newX = e.clientX - containerRect.left - startOffset.x;
				let newY = e.clientY - containerRect.top - startOffset.y;

				newX = clamp(newX, 0, containerRect.width - currentBounds.width);
				newY = clamp(newY, 0, containerRect.height - currentBounds.height);

				currentBounds = moveBounds(currentBounds, newX, newY);
				setRawBounds(currentBounds);

				if (!isAnimating()) setDisplayRawBounds(currentBounds);
			},
			() => {
				setMouseState({ drag: null });
			},
		);
	}

	let activePointerSessionDispose: (() => void) | undefined;