Function createResizeHandler

apps/desktop/src/routes/editor/TextOverlay.tsx:344–449

(dirX: -1 | 0 | 1, dirY: -1 | 0 | 1)

	);

	const createResizeHandler = (dirX: -1 | 0 | 1, dirY: -1 | 0 | 1) => {
		const isCorner = dirX !== 0 && dirY !== 0;

		const handler = props.createMouseDownDrag(
			() => {
				if (isCorner) {
					setIsResizing(true);
				}
				const seg = segment();
				return {
					startPos: { ...seg.center },
					startSize: { ...seg.size },
					startFontSize: seg.fontSize,
				};
			},
			(e, { startPos, startSize, startFontSize }, initialMouse) => {
				const dx = (e.clientX - initialMouse.x) / props.size.width;
				const dy = (e.clientY - initialMouse.y) / props.size.height;

				const isSide = dirX !== 0 && dirY === 0;

				const minSize = 0.03;
				const maxSize = 0.95;
				const minPadding = 0.02;

				props.updateSegment((s) => {
					if (isSide) {
						const targetWidth = startSize.x + dx * dirX;
						const clampedWidth = props.clamp(targetWidth, minSize, maxSize);
						const appliedDelta = clampedWidth - startSize.x;

						s.size.x = clampedWidth;

						const halfWidth = s.size.x / 2;
						const halfHeight = s.size.y / 2;
						s.center.x = props.clamp(
							startPos.x + (dirX * appliedDelta) / 2,
							halfWidth + minPadding,
							1 - halfWidth - minPadding,
						);
						s.center.y = props.clamp(
							s.center.y,
							halfHeight + minPadding,
							1 - halfHeight - minPadding,
						);
					} else if (isCorner) {
						const currentHeightPx = startSize.y * props.size.height;
						const deltaPxY = dy * props.size.height * dirY;

						const scaleY = (currentHeightPx + deltaPxY) / currentHeightPx;
						const scale = scaleY;

						if (scale > 0.1 && scale < 10) {
							const newFontSize = props.clamp(startFontSize * scale, 8, 400);
							const newSizeX = props.clamp(
								startSize.x * scale,
								minSize,
								maxSize,