@reekon-tools/boldr-utils 1.6.20 → 1.6.23

package/dist/annotation/canvas/AnnotationCanvasInner.d.ts

@@ -24,6 +24,9 @@ export interface AnnotationCanvasInnerProps {
     renderMeasurementStamp?: RenderMeasurementStamp;
     onMeasurementStampPress?: (placed: PlacedMeasurementRef) => void;
     onMeasurementStampLongPress?: (placed: PlacedMeasurementRef) => void;
+    onMeasurementStampDoubleTap?: (placed: PlacedMeasurementRef) => void;
+    resolveStampMeasurement?: (placed: PlacedMeasurementRef) => Measurement | null;
+    onMeasurementStampRemove?: (placed: PlacedMeasurementRef, defaultRemove: () => void) => void;
     stampFontSource?: unknown;
     stampValueFontSize?: number;
     stampLabelFontSize?: number;

package/dist/annotation/canvas/AnnotationCanvasInner.js

@@ -3,7 +3,7 @@ import { Skia, useFont, useTypeface } from '@shopify/react-native-skia';
 import { useCallback, useEffect, useMemo, useRef, } from 'react';
 import { AnnotationCanvasSkia } from './AnnotationCanvasSkia.js';
 import { TEXT_FONT_FAMILY } from './elements/ShapeElement.js';
-import { buildRemoveMeasurementOps } from './measurementGeometry.js';
+import { buildRemoveMeasurementOps, hitPlacedMeasurement, } from './measurementGeometry.js';
 import { useAnnotationCanvasState, } from './useAnnotationCanvasState.js';
 import { stampTileSize } from './stampLayout.js';
 // Screen-px radius of a measurement-annotation endpoint handle (matches the
@@ -244,8 +244,28 @@ export const AnnotationCanvasInner = (props) => {
         ...style,
     };
     const customPreview = activeTool?.renderPreview?.(state.customPreviewState, state.ctx);
-    const { renderMeasurementStamp, onMeasurementStampPress, onMeasurementStampLongPress, selection, } = props;
-    return (_jsxs("div", { ref: containerRef, style: containerStyle, onPointerDown: handlePointerDown, onPointerMove: handlePointerMove, onPointerUp: handlePointerUp, onPointerCancel: handlePointerCancel, onWheel: handleWheel, onContextMenu: handleContextMenu, children: [AnnotationCanvasSkia({
+    const { renderMeasurementStamp, onMeasurementStampPress, onMeasurementStampLongPress, onMeasurementStampDoubleTap, resolveStampMeasurement, onMeasurementStampRemove, selection, } = props;
+    // Double-click a stamp → fire the consumer callback (e.g. open its value
+    // editor). Runs the SAME hit-test the select tool uses (top-of-z-order), on
+    // the gesture container, so the stamp overlay stays pointer-events:none and
+    // drag-to-move / single-tap select are unaffected. dblclick is a distinct
+    // browser event that doesn't suppress the preceding pointerdown/up select.
+    const handleDoubleClick = useCallback((event) => {
+        if (!onMeasurementStampDoubleTap)
+            return;
+        const rect = containerRef.current?.getBoundingClientRect();
+        const screen = {
+            x: event.clientX - (rect?.left ?? 0),
+            y: event.clientY - (rect?.top ?? 0),
+        };
+        const world = state.ctx.viewport.screenToWorld(screen);
+        const placed = [...state.effectiveCanvas.placedMeasurements]
+            .reverse()
+            .find((m) => hitPlacedMeasurement(m, world, state.viewport.zoom, state.effectiveCanvas.tileScaleFactor, state.tileViewportScale));
+        if (placed)
+            onMeasurementStampDoubleTap(placed);
+    }, [onMeasurementStampDoubleTap, state]);
+    return (_jsxs("div", { ref: containerRef, style: containerStyle, onPointerDown: handlePointerDown, onPointerMove: handlePointerMove, onPointerUp: handlePointerUp, onPointerCancel: handlePointerCancel, onDoubleClick: handleDoubleClick, onWheel: handleWheel, onContextMenu: handleContextMenu, children: [AnnotationCanvasSkia({
                 width,
                 height,
                 effectiveCanvas: state.effectiveCanvas,
@@ -279,7 +299,7 @@ export const AnnotationCanvasInner = (props) => {
                     const isSelected = selection?.ids.includes(placed.id) ?? false;
                     const measurement = placed.measurementId
                         ? (state.measurementsById.get(placed.measurementId) ?? null)
-                        : null;
+                        : (resolveStampMeasurement?.(placed) ?? null);
                     // Corner-pinned, tile-proportional remove target (see the style
                     // comment below) so it can't blanket a small tile and eat its grab.
                     const removeSize = Math.min(40, size * 0.4);
@@ -300,10 +320,17 @@ export const AnnotationCanvasInner = (props) => {
                                     ? () => onMeasurementStampLongPress(placed)
                                     : undefined })), isSelected && measurement && (_jsx("div", { role: "button", "aria-label": "Remove measurement", onPointerDown: (e) => {
                                     e.stopPropagation();
-                                    const { ops, keepSelection } = buildRemoveMeasurementOps(placed);
-                                    state.ctx.commit({ ops });
-                                    if (!keepSelection)
-                                        state.ctx.setSelection(null);
+                                    const defaultRemove = () => {
+                                        const { ops, keepSelection } = buildRemoveMeasurementOps(placed);
+                                        state.ctx.commit({ ops });
+                                        if (!keepSelection)
+                                            state.ctx.setSelection(null);
+                                    };
+                                    if (onMeasurementStampRemove) {
+                                        onMeasurementStampRemove(placed, defaultRemove);
+                                        return;
+                                    }
+                                    defaultRemove();
                                 }, style: {
                                     // Sized as a fraction of the tile and corner-pinned so it
                                     // never covers the center. A fixed 40px target blanketed

package/dist/annotation/canvas/AnnotationCanvasInner.native.d.ts

@@ -25,6 +25,9 @@ export interface AnnotationCanvasInnerProps {
     renderMeasurementStamp?: RenderMeasurementStamp;
     onMeasurementStampPress?: (placed: PlacedMeasurementRef) => void;
     onMeasurementStampLongPress?: (placed: PlacedMeasurementRef) => void;
+    onMeasurementStampDoubleTap?: (placed: PlacedMeasurementRef) => void;
+    resolveStampMeasurement?: (placed: PlacedMeasurementRef) => Measurement | null;
+    onMeasurementStampRemove?: (placed: PlacedMeasurementRef, defaultRemove: () => void) => void;
     stampFontSource?: unknown;
     stampValueFontSize?: number;
     stampLabelFontSize?: number;

package/dist/annotation/canvas/AnnotationCanvasInner.native.js

@@ -1049,7 +1049,7 @@ export const AnnotationCanvasInner = (props) => {
     ]);
     const activeTool = props.tools.find((t) => t.id === props.activeToolId) ?? null;
     const customPreview = activeTool?.renderPreview?.(state.customPreviewState, state.ctx);
-    const { renderMeasurementStamp, onMeasurementStampPress, onMeasurementStampLongPress, selection, } = props;
+    const { renderMeasurementStamp, onMeasurementStampPress, onMeasurementStampLongPress, resolveStampMeasurement, onMeasurementStampRemove, selection, } = props;
     return (_jsxs(GestureHandlerRootView, { style: [{ width, height }, style], children: [_jsx(GestureDetector, { gesture: gesture, children: _jsx(View, { style: { width, height }, collapsable: false, children: AnnotationCanvasSkia({
                         width,
                         height,
@@ -1117,11 +1117,18 @@ export const AnnotationCanvasInner = (props) => {
                         customPreview,
                     }) }) }), renderMeasurementStamp && (_jsx(View, { pointerEvents: "box-none", style: StyleSheet.absoluteFill, children: state.effectiveCanvas.placedMeasurements.map((placed) => (_jsx(MeasurementStampOverlayItem, { placed: placed, measurement: placed.measurementId
                         ? (state.measurementsById.get(placed.measurementId) ?? null)
-                        : null, selected: selection?.ids.includes(placed.id) ?? false, dragging: draggingId === placed.id, sliding: slidingId === placed.id, endpointDragging: epDragId === placed.id, rectResizing: rectDragId === placed.id, zoomSnapshot: state.viewport.zoom, zoom: zoom, panX: panX, panY: panY, dragX: dragX, dragY: dragY, slideCtx: slideCtx, epCtx: epCtx, rectCtx: rectCtx, renderMeasurementStamp: renderMeasurementStamp, tileScaleFactor: state.effectiveCanvas.tileScaleFactor, tileViewportScale: state.tileViewportScale, onStampPress: onMeasurementStampPress, onStampLongPress: onMeasurementStampLongPress, onRemove: () => {
-                        const { ops, keepSelection } = buildRemoveMeasurementOps(placed);
-                        state.ctx.commit({ ops });
-                        if (!keepSelection)
-                            state.ctx.setSelection(null);
+                        : (resolveStampMeasurement?.(placed) ?? null), selected: selection?.ids.includes(placed.id) ?? false, dragging: draggingId === placed.id, sliding: slidingId === placed.id, endpointDragging: epDragId === placed.id, rectResizing: rectDragId === placed.id, zoomSnapshot: state.viewport.zoom, zoom: zoom, panX: panX, panY: panY, dragX: dragX, dragY: dragY, slideCtx: slideCtx, epCtx: epCtx, rectCtx: rectCtx, renderMeasurementStamp: renderMeasurementStamp, tileScaleFactor: state.effectiveCanvas.tileScaleFactor, tileViewportScale: state.tileViewportScale, onStampPress: onMeasurementStampPress, onStampLongPress: onMeasurementStampLongPress, onRemove: () => {
+                        const defaultRemove = () => {
+                            const { ops, keepSelection } = buildRemoveMeasurementOps(placed);
+                            state.ctx.commit({ ops });
+                            if (!keepSelection)
+                                state.ctx.setSelection(null);
+                        };
+                        if (onMeasurementStampRemove) {
+                            onMeasurementStampRemove(placed, defaultRemove);
+                            return;
+                        }
+                        defaultRemove();
                     } }, placed.id))) }))] }));
 };
 const MeasurementStampOverlayItem = ({ placed, measurement, selected, dragging, sliding, endpointDragging, rectResizing, zoomSnapshot, zoom, panX, panY, dragX, dragY, slideCtx, epCtx, rectCtx, renderMeasurementStamp, tileScaleFactor, tileViewportScale, onStampPress, onStampLongPress, onRemove, }) => {

package/dist/annotation/canvas/stampLayout.d.ts

@@ -5,7 +5,5 @@ export declare const DEFAULT_TILE_SCALE = 1;
 export declare const TILE_SCALE_MIN = 0.4;
 export declare const TILE_SCALE_MAX = 2;
 export declare const clampTileScale: (v: number) => number;
-export declare const renderedDocWidthAtFit: (canvasW: number, canvasH: number, docW: number, docH: number) => number;
-export declare const viewportTileScale: (canvasW: number, canvasH: number, docW: number, docH: number) => number;
-export declare const isUnassociatedStamp: (m: Pick<PlacedMeasurementRef, "measurementId" | "measurementPath">) => boolean;
-export declare const stampTileSize: (m: Pick<PlacedMeasurementRef, "measurementId" | "measurementPath" | "scale">, tileScaleFactor?: number, viewportScale?: number) => number;
+export declare const isUnassociatedStamp: (m: Pick<PlacedMeasurementRef, "measurementId" | "measurementPath" | "columnId">) => boolean;
+export declare const stampTileSize: (m: Pick<PlacedMeasurementRef, "measurementId" | "measurementPath" | "columnId" | "scale">, tileScaleFactor?: number, viewportScale?: number) => number;

package/dist/annotation/canvas/stampLayout.js

@@ -30,60 +30,40 @@ export const TILE_SCALE_MAX = 2;
 // Clamp a tile-scale-factor candidate to the supported range. The single guard
 // for the value before it lands in the document (slider input, restored docs).
 export const clampTileScale = (v) => v < TILE_SCALE_MIN ? TILE_SCALE_MIN : v > TILE_SCALE_MAX ? TILE_SCALE_MAX : v;
-// --- Viewport-relative tile sizing ------------------------------------------
-// A bare-pixel tile is the same size on every device, but the SAME document is
-// fit into wildly different canvases (a phone window vs a desktop pane), so the
-// drawing renders much larger on desktop and a fixed-px tile reads as a tiny
-// fraction of it. To keep a tile a CONSISTENT fraction of the drawing across
-// platforms — while staying independent of the user's live zoom — the tile
-// footprint is multiplied by `viewportTileScale`, which tracks how large the
-// document renders when fit to the canvas (NOT the live zoom).
-// Rendered document width (screen px) at which a tile uses its unscaled base
-// size. Calibrated to a large phone's width so phone canvases land at scale 1
-// (mobile visually unchanged); larger canvases scale up proportionally.
-const TILE_VIEWPORT_REFERENCE_PX = 430;
-// Clamp so phone-sized canvases never shrink tiles below base (lower = 1) and
-// very large monitors don't produce runaway tiles (upper = 4).
-const TILE_VIEWPORT_SCALE_MIN = 1;
-const TILE_VIEWPORT_SCALE_MAX = 4;
-// Screen-px width the document occupies when fit to the canvas:
-//   docW * fitZoom, fitZoom = min(canvasW/docW, canvasH/docH)
-//            = min(canvasW, docW * canvasH / docH)
-// This — not the raw canvas size — governs the tile's fraction of the drawing,
-// so the same document at the same canvas aspect yields the same value on web
-// and native. Falls back to canvasW when doc dimensions are unknown.
-export const renderedDocWidthAtFit = (canvasW, canvasH, docW, docH) => {
-    if (!(docW > 0) || !(docH > 0) || !(canvasW > 0) || !(canvasH > 0)) {
-        return canvasW > 0 ? canvasW : TILE_VIEWPORT_REFERENCE_PX;
-    }
-    return Math.min(canvasW, (docW * canvasH) / docH);
-};
-// Multiplier folded into the tile footprint so tiles are a consistent fraction
-// of the rendered drawing on any canvas. Zoom-INDEPENDENT (a function of canvas
-// + doc dimensions only), so the tile still never changes size as the user
-// pinches/wheels. Defaults to 1 (callers without canvas dimensions are
-// unaffected — e.g. legacy tests).
-export const viewportTileScale = (canvasW, canvasH, docW, docH) => {
-    const s = renderedDocWidthAtFit(canvasW, canvasH, docW, docH) /
-        TILE_VIEWPORT_REFERENCE_PX;
-    return s < TILE_VIEWPORT_SCALE_MIN
-        ? TILE_VIEWPORT_SCALE_MIN
-        : s > TILE_VIEWPORT_SCALE_MAX
-            ? TILE_VIEWPORT_SCALE_MAX
-            : s;
-};
+// --- Tile sizing is independent of canvas size ------------------------------
+// A measurement tile's footprint is base × per-tile `scale` × the document-wide
+// `tileScaleFactor` (below) — and NOTHING tied to the canvas's pixel size, so
+// the same document shows the same tiles at any canvas/window size.
+//
+// Earlier builds multiplied the footprint by a per-canvas `viewportTileScale`
+// derived from how large the document rendered when fit to the canvas, to keep a
+// tile a constant fraction of the drawing across devices. But that made a tile's
+// size change whenever the canvas was resized (e.g. dragging a desktop pane) —
+// the same document read with different-sized tiles at different window sizes.
+// That auto-multiplier is retired in favor of the user-driven "Tile size"
+// slider (the document-wide `tileScaleFactor`), which is explicit, persisted,
+// and consistent everywhere. Mobile is unchanged — its old factor was already
+// pinned at 1, calibrated to a phone's width.
+//
+// `stampTileSize` keeps its `viewportScale` parameter (default 1) only so the
+// render overlay, hit-test, and tools that thread it stay call-compatible; it is
+// now always 1.
 // A placed measurement is an unassociated input until a measurement reference
-// is attached (id or path). Such stamps use STAMP_INPUT_TILE_SIZE.
-export const isUnassociatedStamp = (m) => !m.measurementId && !m.measurementPath;
+// is attached (id or path) OR it is bound to a form column (`columnId`). Such
+// stamps use STAMP_INPUT_TILE_SIZE. A column-bound tile is a full editable
+// input *card* (it shows the column's label + value editor), so it takes the
+// full STAMP_TILE_SIZE like an associated tile — only the truly blank "+"
+// placeholder uses the compact input size.
+export const isUnassociatedStamp = (m) => !m.measurementId && !m.measurementPath && !m.columnId;
 // Screen-space edge length for a placed stamp: the compact input size while
 // unassociated, full size once a measurement is attached, then scaled by the
-// per-stamp `scale`, the document-wide `tileScaleFactor`, and the
-// `viewportTileScale` (so tiles read at a consistent fraction of the drawing on
-// any canvas). The ONE source of truth for tile footprint — render overlay,
-// hit-test, and slide-grab classification all call this so the drawn tile and
-// its touch box always agree. `tileScaleFactor` is the canvas-level knob
-// (default 1, from `AnnotationCanvasState.tileScaleFactor`); `viewportScale`
-// (default 1) is the per-canvas multiplier from `viewportTileScale`.
+// per-stamp `scale` and the document-wide `tileScaleFactor`. The ONE source of
+// truth for tile footprint — render overlay, hit-test, and slide-grab
+// classification all call this so the drawn tile and its touch box always agree.
+// `tileScaleFactor` is the document-wide knob (default 1, from
+// `AnnotationCanvasState.tileScaleFactor`, driven by the "Tile size" slider).
+// `viewportScale` is retained for call compatibility and is always 1 — the old
+// per-canvas multiplier was retired (see the note above). Independent of zoom.
 export const stampTileSize = (m, tileScaleFactor = DEFAULT_TILE_SCALE, viewportScale = 1) => (isUnassociatedStamp(m) ? STAMP_INPUT_TILE_SIZE : STAMP_TILE_SIZE) *
     (m.scale ?? 1) *
     tileScaleFactor *

package/dist/annotation/canvas/tools/selectTool.js

@@ -2,8 +2,20 @@ import { stampTileSize } from '../stampLayout.js';
 import { placementOf, linePosOf, snapLinePos, lerp, recomputeAnchor, rectCenter, rectCornerPoint, oppositeRectCorner, hitPlacedMeasurement, } from '../measurementGeometry.js';
 import { hitShapeOutline } from '../shapeGeometry.js';
 import { DEFAULT_TEXT_FONT_SIZE, resizeScaleFromDrag, textResizeGeometry, textShapeBounds, } from '../textGeometry.js';
-import { editTextShape, findTextShapeAt } from './textEditing.js';
+import { editTextShape } from './textEditing.js';
 const HIT_PADDING = 6;
+// Whether an element id refers to a text shape (findHit reports text, lines,
+// rects and ellipses all as kind 'shape'; only text supports tap-to-edit).
+const isTextShape = (doc, id) => doc.shapes.some((s) => s.id === id && s.kind === 'text');
+// Re-tap-to-edit for text. The pointer-down records a text shape's id here only
+// when that shape was *already* selected before this gesture; a release with no
+// movement then re-opens its editor. Held at module scope (not in ToolState)
+// because the native tap gesture synthesizes pointer-down and pointer-up in a
+// single React tick — a ToolState set on down isn't visible to up, but this is.
+// Only one select gesture is ever in flight, so a shared cell is safe. A first
+// tap (shape not yet selected) leaves this null, so it only selects; the second
+// tap edits. Cleared on drag, release, and cancel.
+let pendingTextEditId = null;
 // Hit-test in doc-space. Crude but fast — good enough for v1; tools can
 // override via `hitTest` for more precision later.
 const hitStroke = (stroke, p) => {
@@ -389,6 +401,10 @@ export const createSelectTool = () => ({
     onPointerDown(event, ctx) {
         const { world } = event;
         const zoom = ctx.viewport.state.zoom;
+        // Reset the re-tap-to-edit latch; only a body grab of an already-selected
+        // text shape (below) re-arms it. Grabbing a handle or empty canvas leaves
+        // it cleared, so neither can leak an edit into the next release.
+        pendingTextEditId = null;
         // Endpoint/resize handles show only on the selected element — check first,
         // UNLESS the grab is on that element's tile: the tile is the move/slide
         // affordance and must win over a handle sitting under it, so a selected
@@ -451,6 +467,15 @@ export const createSelectTool = () => ({
             ctx.setSelection(null);
             return { kind: 'idle' };
         }
+        // Re-tapping an already-selected text shape (without dragging) opens its
+        // editor on release — see onPointerUp. `selId` is the selection from before
+        // this down, so a first tap only selects; the second tap edits.
+        pendingTextEditId =
+            hit.kind === 'shape' &&
+                hit.id === selId &&
+                isTextShape(ctx.document, hit.id)
+                ? hit.id
+                : null;
         ctx.setSelection({ ids: [hit.id] });
         const mode = hit.kind === 'measurement' &&
             classifyGrab(ctx.document, hit.id, world, zoom, ctx.tileViewportScale) ===
@@ -474,32 +499,39 @@ export const createSelectTool = () => ({
             x: event.world.x - s.start.x,
             y: event.world.y - s.start.y,
         };
+        // Any real movement turns this into a drag, not a re-tap — disarm the edit.
+        if (delta.x !== 0 || delta.y !== 0)
+            pendingTextEditId = null;
         const patch = dragPatch(s, ctx.document, delta, ctx.viewport.state.zoom);
         if (patch)
             ctx.preview(patch);
         return { ...s, delta };
     },
     onPointerUp(_event, ctx, state) {
+        const editId = pendingTextEditId;
+        pendingTextEditId = null;
         const s = state;
-        if (s?.kind !== 'dragging')
-            return;
-        if (s.delta.x === 0 && s.delta.y === 0)
+        // A moved selection commits its drag and is never a tap-to-edit.
+        if (s?.kind === 'dragging' && (s.delta.x !== 0 || s.delta.y !== 0)) {
+            const patch = dragPatch(s, ctx.document, s.delta, ctx.viewport.state.zoom);
+            if (patch)
+                ctx.commit(patch);
             return;
-        const patch = dragPatch(s, ctx.document, s.delta, ctx.viewport.state.zoom);
-        if (patch)
-            ctx.commit(patch);
+        }
+        // No movement: re-tapping an already-selected text shape re-opens its
+        // editor (the same edit flow as tapping it with the text tool, via the
+        // shared editTextShape). `editId` was latched on the down, so this survives
+        // the native tap's synchronous down+up where `state` cannot.
+        if (editId) {
+            const shape = ctx.document.shapes.find((sh) => sh.id === editId);
+            if (shape && shape.kind === 'text')
+                editTextShape(ctx, shape);
+        }
     },
     onCancel(_state, ctx) {
+        pendingTextEditId = null;
         ctx.preview({ ops: [] });
     },
-    // Long-pressing a placed text shape re-opens the editor (the same edit flow
-    // as tapping it with the text tool, via the shared editTextShape). A hold on
-    // any other element — or empty canvas — is ignored.
-    onLongPress(event, ctx) {
-        const shape = findTextShapeAt(ctx.document, event.world);
-        if (shape)
-            editTextShape(ctx, shape);
-    },
     hitTest(element, p) {
         if (element.kind === 'measurement')
             return hitPlacedMeasurement(element, p);

package/dist/annotation/canvas/tools/textEditing.js

@@ -1,7 +1,7 @@
 import { hitTestTextShape } from '../textGeometry.js';
 // Topmost text shape under a world point (z-order, top first), or null. Shared
-// by the text tool (tap-to-edit) and the select tool (long-press-to-edit) so a
-// press resolves to the same element from either tool.
+// by the text tool (tap-to-edit) and the select tool (tap-a-selected-shape-to-
+// edit) so a press resolves to the same element from either tool.
 export const findTextShapeAt = (doc, world) => {
     for (let i = doc.shapes.length - 1; i >= 0; i--) {
         const s = doc.shapes[i];

package/dist/annotation/canvas/useAnnotationCanvasState.d.ts

@@ -16,6 +16,14 @@ export interface AnnotationCanvasHandle {
     }): void;
     setAnnotationType(id: AnnotationElementId, type: MeasurementPlacement): void;
     associateMeasurement(id: AnnotationElementId, ref: MeasurementRef): void;
+    bindColumn(id: AnnotationElementId, binding: {
+        groupId: string;
+        columnId: string;
+    }): void;
+    placeColumnTileAtCenter(binding: {
+        groupId: string;
+        columnId: string;
+    }): AnnotationElementId;
     deleteSelected(): void;
 }
 export interface UseAnnotationCanvasStateProps {

package/dist/annotation/canvas/useAnnotationCanvasState.js

@@ -2,7 +2,6 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { applyPatch, invertPatch, DEFAULT_LAYER_ID, } from '../../types/annotation.js';
 import { createViewportApi, panBy, zoomAt, DEFAULT_VIEWPORT, } from './viewport.js';
 import { recomputeAnchor, rectCenter, DEFAULT_LINE_POS, } from './measurementGeometry.js';
-import { viewportTileScale } from './stampLayout.js';
 // Platform-agnostic state machine for the annotation canvas. Web and native
 // inners share this hook; each wraps it with platform-specific event
 // capture and JSX (div + DOM events vs. GestureDetector + RN Views).
@@ -22,11 +21,13 @@ export const useAnnotationCanvasState = (props) => {
         return map;
     }, [measurements]);
     const viewportApi = useMemo(() => createViewportApi(viewport), [viewport]);
-    // How large the document renders when fit to this canvas, as a tile-footprint
-    // multiplier (zoom-independent). Keeps tiles a consistent fraction of the
-    // drawing on a phone vs a desktop pane. Used by the overlays (drawn size) and
-    // the tools (hit box) so both agree.
-    const tileViewportScale = useMemo(() => viewportTileScale(width, height, canvas.viewport.width, canvas.viewport.height), [width, height, canvas.viewport.width, canvas.viewport.height]);
+    // Tiles are sized independently of the canvas: their footprint is base ×
+    // per-tile scale × the document-wide `tileScaleFactor` ("Tile size" slider),
+    // never the canvas pixel size — so resizing the pane no longer rescales tiles.
+    // Retained as a (constant 1) value because the overlays (drawn size) and tools
+    // (hit box) thread it; keeping them in lockstep at 1 means both still agree.
+    // (See stampLayout.ts for why the old per-canvas multiplier was retired.)
+    const tileViewportScale = 1;
     const ctx = useMemo(() => ({
         document: canvas,
         selection,
@@ -317,6 +318,39 @@ export const useAnnotationCanvasState = (props) => {
                     ],
                 });
             },
+            bindColumn(id, binding) {
+                const c = ctxRef.current;
+                c.commit({
+                    ops: [
+                        {
+                            op: 'updateMeasurement',
+                            id,
+                            patch: { groupId: binding.groupId, columnId: binding.columnId },
+                        },
+                    ],
+                });
+            },
+            placeColumnTileAtCenter(binding) {
+                const c = ctxRef.current;
+                const anchor = c.viewport.screenToWorld({
+                    x: width / 2,
+                    y: height / 2,
+                });
+                const placed = {
+                    id: `measurement-${Date.now().toString(36)}-${Math.floor(Math.random() * 1e9).toString(36)}`,
+                    layerId: c.document.layers[0]?.id ?? DEFAULT_LAYER_ID,
+                    groupId: binding.groupId,
+                    columnId: binding.columnId,
+                    anchor,
+                    showLabel: true,
+                    showValue: true,
+                    createdAt: Date.now(),
+                };
+                c.commit({ ops: [{ op: 'addMeasurement', measurement: placed }] });
+                // Select it so the consumer can immediately move it / open its editor.
+                c.setSelection({ ids: [placed.id] });
+                return placed.id;
+            },
             deleteSelected() {
                 const c = ctxRef.current;
                 const ids = c.selection?.ids;

package/dist/types/annotation.d.ts

@@ -50,6 +50,7 @@ export interface PlacedMeasurementRef {
     measurementPath?: string;
     measurementId?: string;
     groupId?: string;
+    columnId?: string;
     anchor: Vec2;
     placement?: MeasurementPlacement;
     line?: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@reekon-tools/boldr-utils",
-  "version": "1.6.20",
+  "version": "1.6.23",
   "description": "Shared utilities for formulas and measurement conversion used in Reekon apps",
   "author": "REEKON Tools",
   "license": "MIT",