@reekon-tools/boldr-utils 1.13.2 → 1.14.0

package/dist/annotation/canvas/AnnotationCanvasInner.js

@@ -284,7 +284,7 @@ export const AnnotationCanvasInner = (props) => {
         const world = state.ctx.viewport.screenToWorld(screen);
         const placed = [...state.effectiveCanvas.placedMeasurements]
             .reverse()
-            .find((m) => hitPlacedMeasurement(m, world, state.viewport.zoom, state.tileScaleFactor, state.tileViewportScale));
+            .find((m) => hitPlacedMeasurement(m, world, state.viewport.zoom, state.tileScaleFactor, state.tileViewportScale, state.headerTileScaleFactor));
         if (placed)
             onMeasurementStampDoubleTap(placed);
     }, [onMeasurementStampDoubleTap, state]);
@@ -320,7 +320,7 @@ export const AnnotationCanvasInner = (props) => {
                 }, children: state.effectiveCanvas.placedMeasurements.map((placed) => {
                     // Square tile or wide group-header pill — one footprint source of
                     // truth shared with the hit-test (stampTileDims).
-                    const { width, height } = stampTileDims(placed, state.tileScaleFactor, state.tileViewportScale);
+                    const { width, height } = stampTileDims(placed, state.tileScaleFactor, state.tileViewportScale, state.headerTileScaleFactor);
                     const cx = (placed.anchor.x - state.viewport.pan.x) * state.viewport.zoom;
                     const cy = (placed.anchor.y - state.viewport.pan.y) * state.viewport.zoom;
                     const isSelected = selection?.ids.includes(placed.id) ?? false;

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

@@ -875,7 +875,7 @@ export const AnnotationCanvasInner = (props) => {
                 return;
             const world = st.ctx.viewport.screenToWorld(screen);
             const zoomNow = st.ctx.viewport.state.zoom;
-            const hit = dragSelection.hitTest(st.ctx.document, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor);
+            const hit = dragSelection.hitTest(st.ctx.document, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor, st.ctx.headerTileScaleFactor);
             if (!hit || hit.kind !== 'measurement' || hit.id !== prevSelectedId) {
                 return;
             }
@@ -1193,7 +1193,7 @@ export const AnnotationCanvasInner = (props) => {
                 // so a selected tile isn't stuck until you deselect it).
                 const selId = st.ctx.selection?.ids[0];
                 if (selId &&
-                    !cfg.isSelectedTileGrab?.(st.ctx.document, selId, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor)) {
+                    !cfg.isSelectedTileGrab?.(st.ctx.document, selId, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor, st.ctx.headerTileScaleFactor)) {
                     const handle = cfg.hitTestHandle?.(st.ctx.document, selId, world, zoomNow);
                     if (handle) {
                         const m = st.ctx.document.placedMeasurements.find((x) => x.id === selId);
@@ -1293,7 +1293,7 @@ export const AnnotationCanvasInner = (props) => {
                         return;
                     }
                 }
-                const hit = cfg.hitTest(st.ctx.document, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor);
+                const hit = cfg.hitTest(st.ctx.document, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor, st.ctx.headerTileScaleFactor);
                 if (!hit) {
                     // Backgrounds can cover the whole document, so they only get the
                     // drag once every annotation element misses, and only when ALREADY
@@ -1313,7 +1313,7 @@ export const AnnotationCanvasInner = (props) => {
                 st.ctx.setSelection({ ids: [hit.id] });
                 // Grabbing a line annotation's tile slides it; otherwise group-move.
                 const grab = hit.kind === 'measurement'
-                    ? cfg.classifyMeasurementGrab?.(st.ctx.document, hit.id, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor)
+                    ? cfg.classifyMeasurementGrab?.(st.ctx.document, hit.id, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor, st.ctx.headerTileScaleFactor)
                     : 'move';
                 if (grab === 'slide') {
                     const m = st.ctx.document.placedMeasurements.find((x) => x.id === hit.id);
@@ -1621,7 +1621,7 @@ export const AnnotationCanvasInner = (props) => {
     // non-fullscreen canvas (e.g. a diagram strip) escape into surrounding UI.
     _jsxs(GestureHandlerRootView, { style: [{ width, height, overflow: 'hidden' }, style], children: [backgroundLayers.map((layer) => (_jsx(BackgroundSkImageLoader, { layer: layer, resolveUrl: resolveImageUrl, onImage: onBackgroundSkImage }, layer.id))), _jsx(GestureDetector, { gesture: gesture, children: _jsx(View, { style: { width, height }, collapsable: false, children: AnnotationCanvasSkia(skiaProps) }) }), 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)
-                        : (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.tileScaleFactor, tileViewportScale: state.tileViewportScale, onStampPress: onMeasurementStampPress, onStampLongPress: onMeasurementStampLongPress, onRemove: onMeasurementStampRemove
+                        : (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.tileScaleFactor, headerTileScaleFactor: state.headerTileScaleFactor, tileViewportScale: state.tileViewportScale, onStampPress: onMeasurementStampPress, onStampLongPress: onMeasurementStampLongPress, onRemove: onMeasurementStampRemove
                         ? () => {
                             const defaultRemove = () => {
                                 const { ops, keepSelection } = buildRemoveMeasurementOps(placed);
@@ -1637,10 +1637,10 @@ export const AnnotationCanvasInner = (props) => {
                     wrapContent: loupeWrap,
                 }) }))] }));
 };
-const MeasurementStampOverlayItem = ({ placed, measurement, selected, dragging, sliding, endpointDragging, rectResizing, zoomSnapshot, zoom, panX, panY, dragX, dragY, slideCtx, epCtx, rectCtx, renderMeasurementStamp, tileScaleFactor, tileViewportScale, onStampPress, onStampLongPress, onRemove, }) => {
+const MeasurementStampOverlayItem = ({ placed, measurement, selected, dragging, sliding, endpointDragging, rectResizing, zoomSnapshot, zoom, panX, panY, dragX, dragY, slideCtx, epCtx, rectCtx, renderMeasurementStamp, tileScaleFactor, headerTileScaleFactor, tileViewportScale, onStampPress, onStampLongPress, onRemove, }) => {
     // Square tile or wide group-header pill — one footprint source of truth
     // shared with the hit-test (stampTileDims).
-    const { width, height } = stampTileDims(placed, tileScaleFactor, tileViewportScale);
+    const { width, height } = stampTileDims(placed, tileScaleFactor, tileViewportScale, headerTileScaleFactor ?? tileScaleFactor);
     const halfW = width / 2;
     const halfH = height / 2;
     // Remove-"X" touch target, sized as a fraction of the tile and corner-pinned

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

@@ -24,6 +24,7 @@ export interface ToolContext {
     viewport: ViewportApi;
     tileViewportScale: number;
     tileScaleFactor: number;
+    headerTileScaleFactor: number;
     preview(patch: AnnotationDocumentPatch): void;
     commit(patch: AnnotationDocumentPatch): void;
     setSelection(selection: Selection | null): void;
@@ -54,12 +55,12 @@ export interface ShapeDrawConfig {
 }
 export type DragElementKind = 'stroke' | 'shape' | 'measurement' | 'background';
 export interface DragSelectionConfig {
-    hitTest(doc: AnnotationCanvasState, world: Vec2, zoom: number, viewportTileScale?: number, tileScaleFactor?: number): {
+    hitTest(doc: AnnotationCanvasState, world: Vec2, zoom: number, viewportTileScale?: number, tileScaleFactor?: number, headerTileScaleFactor?: number): {
         id: AnnotationElementId;
         kind: DragElementKind;
     } | null;
     buildTranslatePatch(doc: AnnotationCanvasState, id: AnnotationElementId, kind: DragElementKind, delta: Vec2): AnnotationDocumentPatch | null;
-    classifyMeasurementGrab?(doc: AnnotationCanvasState, id: AnnotationElementId, world: Vec2, zoom: number, viewportTileScale?: number, tileScaleFactor?: number): 'slide' | 'move';
+    classifyMeasurementGrab?(doc: AnnotationCanvasState, id: AnnotationElementId, world: Vec2, zoom: number, viewportTileScale?: number, tileScaleFactor?: number, headerTileScaleFactor?: number): 'slide' | 'move';
     buildSlidePatch?(doc: AnnotationCanvasState, id: AnnotationElementId, delta: Vec2, zoom: number): AnnotationDocumentPatch | null;
     hitTestHandle?(doc: AnnotationCanvasState, id: AnnotationElementId, world: Vec2, zoom: number): 'a' | 'b' | null;
     buildEndpointPatch?(doc: AnnotationCanvasState, id: AnnotationElementId, handle: 'a' | 'b', delta: Vec2): AnnotationDocumentPatch | null;
@@ -77,7 +78,7 @@ export interface DragSelectionConfig {
         fixed: Vec2;
     } | null;
     buildShapeCornerPatch?(doc: AnnotationCanvasState, id: AnnotationElementId, corner: RectCorner, delta: Vec2): AnnotationDocumentPatch | null;
-    isSelectedTileGrab?(doc: AnnotationCanvasState, id: AnnotationElementId, world: Vec2, zoom: number, viewportTileScale?: number, tileScaleFactor?: number): boolean;
+    isSelectedTileGrab?(doc: AnnotationCanvasState, id: AnnotationElementId, world: Vec2, zoom: number, viewportTileScale?: number, tileScaleFactor?: number, headerTileScaleFactor?: number): boolean;
     hitTestBackground?(doc: AnnotationCanvasState, world: Vec2): {
         id: AnnotationElementId;
     } | null;

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

@@ -36,7 +36,7 @@ export declare const rectCornerPoint: (rect: {
     b: Vec2;
 }, corner: RectCorner) => Vec2;
 export declare const oppositeRectCorner: (corner: RectCorner) => RectCorner;
-export declare const hitPlacedMeasurement: (m: PlacedMeasurementRef, p: Vec2, zoom?: number, tileScaleFactor?: number, viewportScale?: number) => boolean;
+export declare const hitPlacedMeasurement: (m: PlacedMeasurementRef, p: Vec2, zoom?: number, tileScaleFactor?: number, viewportScale?: number, headerTileScaleFactor?: number) => boolean;
 export interface RemoveMeasurementResult {
     ops: AnnotationPatchOp[];
     keepSelection: boolean;

package/dist/annotation/canvas/measurementGeometry.js

@@ -110,14 +110,15 @@ const segmentDistSq = (p, a, b) => {
 // around the anchor, the line body of a line annotation, or the
 // border ring of a rectangle annotation (interiors stay transparent to hits so
 // elements inside remain reachable).
-export const hitPlacedMeasurement = (m, p, zoom = 1, tileScaleFactor = 1, viewportScale = 1) => {
+export const hitPlacedMeasurement = (m, p, zoom = 1, tileScaleFactor = 1, viewportScale = 1, headerTileScaleFactor = tileScaleFactor) => {
     // stampTileDims yields the tile's CURRENT screen-space box (the
     // zoom-relative multiplier arrives via `viewportScale`); converting the
     // half-extents (+ padding) back to doc space via the zoom keeps the hit box
     // matching what's drawn — a doc-constant footprint (blank and populated
-    // stamps share the square footprint; group-header chips are a wide pill —
-    // see stampTileDims in stampLayout).
-    const dims = stampTileDims(m, tileScaleFactor, viewportScale);
+    // stamps share the square footprint; group-header chips are a wide pill
+    // sized by their OWN document-wide knob, `headerTileScaleFactor` — see
+    // stampTileDims in stampLayout).
+    const dims = stampTileDims(m, tileScaleFactor, viewportScale, headerTileScaleFactor);
     const halfW = (dims.width / 2 + STAMP_HIT_PADDING) / zoom;
     const halfH = (dims.height / 2 + STAMP_HIT_PADDING) / zoom;
     const dx = Math.abs(p.x - m.anchor.x);

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

@@ -19,6 +19,7 @@ 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 resolveTileScaleFactor: (canvas: Pick<AnnotationCanvasState, "tileScaleFactor" | "tileScaleFactorMobile">, platform: TileScalePlatform) => number;
+export declare const resolveHeaderTileScaleFactor: (canvas: Pick<AnnotationCanvasState, "tileScaleFactor" | "tileScaleFactorMobile" | "headerTileScaleFactor" | "headerTileScaleFactorMobile">, platform: TileScalePlatform) => number;
 export declare const clampTileScale: (v: number) => number;
 export declare const tileDocSizeForFactor: (factor: number, zoom: number) => number;
 export declare const tileScaleFromDocSize: (docSize: number, zoom: number) => number;
@@ -28,4 +29,4 @@ export interface StampTileDims {
     width: number;
     height: number;
 }
-export declare const stampTileDims: (m: Pick<PlacedMeasurementRef, "scale" | "isGroupHeader" | "collapsed">, tileScaleFactor?: number, viewportScale?: number) => StampTileDims;
+export declare const stampTileDims: (m: Pick<PlacedMeasurementRef, "scale" | "isGroupHeader" | "collapsed">, tileScaleFactor?: number, viewportScale?: number, headerTileScaleFactor?: number) => StampTileDims;

package/dist/annotation/canvas/stampLayout.js

@@ -80,6 +80,18 @@ export const TILE_SCALE_MAX = 2;
 export const resolveTileScaleFactor = (canvas, platform) => (platform === 'mobile'
     ? (canvas.tileScaleFactorMobile ?? canvas.tileScaleFactor)
     : canvas.tileScaleFactor) ?? DEFAULT_TILE_SCALE;
+// Resolve the document-wide HEADER-scale knob for a platform — the group/form
+// header counterpart of resolveTileScaleFactor (Asana 1217570500895543).
+// Same platform fallback (mobile → web), then one more step: a document with
+// no header knob at all falls back to the MEASUREMENT factor, the pre-split
+// behavior where one knob drove every tile — so existing documents render
+// identically until a user first moves the header slider. The ONE read path
+// for the header fields — renderers, hit-testing, and the slider UIs must all
+// resolve through here so they agree.
+export const resolveHeaderTileScaleFactor = (canvas, platform) => (platform === 'mobile'
+    ? (canvas.headerTileScaleFactorMobile ?? canvas.headerTileScaleFactor)
+    : canvas.headerTileScaleFactor) ??
+    resolveTileScaleFactor(canvas, platform);
 // 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;
@@ -136,11 +148,15 @@ export const isUnassociatedStamp = (m) => !m.isGroupHeader && !m.measurementId &
 // canvas's content-fit reference zoom (see the note above), so tiles scale
 // with the drawing as the user zooms.
 export const stampTileSize = (m, tileScaleFactor = DEFAULT_TILE_SCALE, viewportScale = 1) => STAMP_TILE_SIZE * (m.scale ?? 1) * tileScaleFactor * viewportScale;
-export const stampTileDims = (m, tileScaleFactor = DEFAULT_TILE_SCALE, viewportScale = 1) => {
-    const k = (m.scale ?? 1) * tileScaleFactor * viewportScale;
+// `headerTileScaleFactor` is the header chips' own document-wide knob
+// (resolveHeaderTileScaleFactor); it defaults to `tileScaleFactor` so callers
+// that predate the header/measurement split keep their one-knob behavior.
+export const stampTileDims = (m, tileScaleFactor = DEFAULT_TILE_SCALE, viewportScale = 1, headerTileScaleFactor = tileScaleFactor) => {
     if (!m.isGroupHeader) {
+        const k = (m.scale ?? 1) * tileScaleFactor * viewportScale;
         return { width: STAMP_TILE_SIZE * k, height: STAMP_TILE_SIZE * k };
     }
+    const k = (m.scale ?? 1) * headerTileScaleFactor * viewportScale;
     const base = groupHeaderBaseDims(m.collapsed);
     return { width: base.width * k, height: base.height * k };
 };

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

@@ -51,7 +51,7 @@ export const createPanTool = (options = {}) => ({
         const measurements = ctx.document.placedMeasurements;
         for (let i = measurements.length - 1; i >= 0; i--) {
             const m = measurements[i];
-            if (hitPlacedMeasurement(m, event.world, zoom, ctx.tileScaleFactor, ctx.tileViewportScale)) {
+            if (hitPlacedMeasurement(m, event.world, zoom, ctx.tileScaleFactor, ctx.tileViewportScale, ctx.headerTileScaleFactor)) {
                 ctx.setSelection({ ids: [m.id] });
                 return;
             }

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

@@ -66,11 +66,15 @@ const segmentDistanceSq = (px, py, ax, ay, bx, by) => {
 const findHit = (doc, world, zoom, viewportTileScale = 1, 
 // Platform-resolved tile-scale knob (ctx.tileScaleFactor). Defaults to the
 // doc's web/legacy field so un-threaded callers keep the pre-split behavior.
-tileScaleFactor = doc.tileScaleFactor) => {
+tileScaleFactor = doc.tileScaleFactor, 
+// Platform-resolved header-scale knob (ctx.headerTileScaleFactor). Defaults
+// to the doc's web header field, falling back to the measurement knob the
+// way resolveHeaderTileScaleFactor does.
+headerTileScaleFactor = doc.headerTileScaleFactor ?? tileScaleFactor) => {
     // Hit-test in z-order (top first): measurements > shapes > strokes.
     for (let i = doc.placedMeasurements.length - 1; i >= 0; i--) {
         const m = doc.placedMeasurements[i];
-        if (hitPlacedMeasurement(m, world, zoom, tileScaleFactor, viewportTileScale)) {
+        if (hitPlacedMeasurement(m, world, zoom, tileScaleFactor, viewportTileScale, headerTileScaleFactor)) {
             return { id: m.id, kind: 'measurement' };
         }
     }
@@ -179,11 +183,11 @@ const translatePatch = (elementKind, id, doc, delta) => {
 // is selected; without this, a handle sitting under the tile (a rectangle
 // tile at the rect center, a line tile slid onto an endpoint) hijacks the grab
 // and the tile becomes unmovable until deselected.
-const isOnMeasurementTile = (doc, id, world, zoom, viewportTileScale = 1, tileScaleFactor = doc.tileScaleFactor) => {
+const isOnMeasurementTile = (doc, id, world, zoom, viewportTileScale = 1, tileScaleFactor = doc.tileScaleFactor, headerTileScaleFactor = doc.headerTileScaleFactor ?? tileScaleFactor) => {
     const m = doc.placedMeasurements.find((x) => x.id === id);
     if (!m)
         return false;
-    const dims = stampTileDims(m, tileScaleFactor, viewportTileScale);
+    const dims = stampTileDims(m, tileScaleFactor, viewportTileScale, headerTileScaleFactor);
     const halfW = (dims.width / 2 + HIT_PADDING) / zoom;
     const halfH = (dims.height / 2 + HIT_PADDING) / zoom;
     return (Math.abs(world.x - m.anchor.x) <= halfW &&
@@ -193,14 +197,14 @@ const isOnMeasurementTile = (doc, id, world, zoom, viewportTileScale = 1, tileSc
 // via DragSelectionConfig AND the web pointer handlers — one source of truth) ---
 // Grabbing the tile of a line annotation slides it along the line; everything
 // else (bare stamps, grabs on the line body) is a group move.
-const classifyGrab = (doc, id, world, zoom, viewportTileScale = 1, tileScaleFactor = doc.tileScaleFactor) => {
+const classifyGrab = (doc, id, world, zoom, viewportTileScale = 1, tileScaleFactor = doc.tileScaleFactor, headerTileScaleFactor = doc.headerTileScaleFactor ?? tileScaleFactor) => {
     const m = doc.placedMeasurements.find((x) => x.id === id);
     if (!m)
         return 'move';
     // Same footprint the tile is drawn at (wide pill for group headers; folds in
     // the document-wide tile scale + viewport scale so slide-grab matches the
     // draw).
-    const dims = stampTileDims(m, tileScaleFactor, viewportTileScale);
+    const dims = stampTileDims(m, tileScaleFactor, viewportTileScale, headerTileScaleFactor);
     const halfW = (dims.width / 2 + HIT_PADDING) / zoom;
     const halfH = (dims.height / 2 + HIT_PADDING) / zoom;
     const onTile = Math.abs(world.x - m.anchor.x) <= halfW &&
@@ -600,7 +604,7 @@ export const createSelectTool = (options = {}) => ({
     // reusing the same hit-test and translate logic the pointer handlers below
     // use for web — one source of truth.
     dragSelection: {
-        hitTest: (doc, world, zoom, viewportTileScale, tileScaleFactor) => findHit(doc, world, zoom, viewportTileScale, tileScaleFactor),
+        hitTest: (doc, world, zoom, viewportTileScale, tileScaleFactor, headerTileScaleFactor) => findHit(doc, world, zoom, viewportTileScale, tileScaleFactor, headerTileScaleFactor),
         buildTranslatePatch: (doc, id, kind, delta) => {
             const op = translatePatch(kind, id, doc, delta);
             return op ? { ops: [op] } : null;
@@ -639,7 +643,7 @@ export const createSelectTool = (options = {}) => ({
         // tile stays draggable (otherwise it can only be moved after deselecting).
         const selId = ctx.selection?.ids[0];
         if (selId &&
-            !isOnMeasurementTile(ctx.document, selId, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor)) {
+            !isOnMeasurementTile(ctx.document, selId, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor, ctx.headerTileScaleFactor)) {
             const handle = findHandleHit(ctx.document, selId, world, zoom);
             if (handle) {
                 ctx.setSelection({ ids: [selId] });
@@ -708,7 +712,7 @@ export const createSelectTool = (options = {}) => ({
                 };
             }
         }
-        const hit = findHit(ctx.document, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor);
+        const hit = findHit(ctx.document, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor, ctx.headerTileScaleFactor);
         if (!hit) {
             // Background layers only get a look-in when every annotation element
             // misses — they can cover the whole document, so elements above always
@@ -753,7 +757,7 @@ export const createSelectTool = (options = {}) => ({
                 : null;
         ctx.setSelection({ ids: [hit.id] });
         const mode = hit.kind === 'measurement' &&
-            classifyGrab(ctx.document, hit.id, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor) === 'slide'
+            classifyGrab(ctx.document, hit.id, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor, ctx.headerTileScaleFactor) === 'slide'
             ? 'slide'
             : 'move';
         return {

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

@@ -24,6 +24,7 @@ export interface AnnotationCanvasHandle {
         durationMs?: number;
     }): void;
     getTileScaleFactor(): number;
+    getHeaderTileScaleFactor(): number;
     getTileDocSize(factor: number): number;
     ensureMeasurementVisible(id: AnnotationElementId): void;
     placeMeasurementAtCenter(ref: MeasurementRef): void;
@@ -84,6 +85,7 @@ export interface AnnotationCanvasStateApi {
     ctx: ToolContext;
     tileViewportScale: number;
     tileScaleFactor: number;
+    headerTileScaleFactor: number;
     penDrawingStroke: AnnotationStroke | null;
     customPreviewState: ToolState;
     dispatchPointerDown(event: CanvasPointerEvent): void;

package/dist/annotation/canvas/useAnnotationCanvasState.js

@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { applyPatch, invertPatch, DEFAULT_LAYER_ID, } from '../../types/annotation.js';
-import { resolveTileScaleFactor, stampTileDims, STAMP_TILE_SIZE, tileDocSizeForFactor, tileScaleFromDocSize, } from './stampLayout.js';
+import { resolveHeaderTileScaleFactor, resolveTileScaleFactor, stampTileDims, STAMP_TILE_SIZE, tileDocSizeForFactor, tileScaleFromDocSize, } from './stampLayout.js';
 import { createViewportApi, fitRectToScreen, panBy, zoomAt, DEFAULT_VIEWPORT, } from './viewport.js';
 import { backgroundLayerDocRect, backgroundLayersOf, backgroundLayersUnionRect, } from './backgroundLayers.js';
 import { buildRemoveMeasurementOps, recomputeAnchor, rectCenter, DEFAULT_LINE_POS, } from './measurementGeometry.js';
@@ -157,13 +157,28 @@ export const useAnnotationCanvasState = (props) => {
     // commit writes tileScaleFactorMobile and takes over for good.
     const tileScalePlatformResolved = tileScalePlatform ?? 'web';
     let tileScaleFactor = resolveTileScaleFactor(effectiveCanvas, tileScalePlatformResolved);
+    // Group/form header chips carry their own document-wide knob (Asana
+    // 1217570500895543), resolved the same way. With no header knob set it
+    // equals the measurement factor (resolveHeaderTileScaleFactor's fallback) —
+    // the pre-split one-knob behavior.
+    let headerTileScaleFactor = resolveHeaderTileScaleFactor(effectiveCanvas, tileScalePlatformResolved);
     if (tileScalePlatformResolved === 'mobile' &&
         effectiveCanvas.tileScaleFactorMobile == null &&
         effectiveCanvas.tileDocSize != null &&
         effectiveCanvas.tileDocSize > 0 &&
         width > 0 &&
         height > 0) {
-        tileScaleFactor = tileScaleFromDocSize(effectiveCanvas.tileDocSize, baseFitZoom);
+        const calibrated = tileScaleFromDocSize(effectiveCanvas.tileDocSize, baseFitZoom);
+        // Scale the header factor by the same calibration ratio so its relation
+        // to the measurement factor survives the override: a doc with no header
+        // knob keeps headers exactly at the calibrated measurement factor, and a
+        // doc whose web user set a header knob keeps the same header-to-tile
+        // proportion the web user saw.
+        headerTileScaleFactor =
+            tileScaleFactor > 0
+                ? headerTileScaleFactor * (calibrated / tileScaleFactor)
+                : calibrated;
+        tileScaleFactor = calibrated;
     }
     const ctx = useMemo(() => ({
         document: canvas,
@@ -171,6 +186,7 @@ export const useAnnotationCanvasState = (props) => {
         viewport: viewportApi,
         tileViewportScale,
         tileScaleFactor,
+        headerTileScaleFactor,
         preview(patch) {
             setPreviewPatch(patch);
         },
@@ -222,6 +238,7 @@ export const useAnnotationCanvasState = (props) => {
         viewportApi,
         tileViewportScale,
         tileScaleFactor,
+        headerTileScaleFactor,
         tileScalePlatformResolved,
         baseFitZoom,
         onCommit,
@@ -425,6 +442,9 @@ export const useAnnotationCanvasState = (props) => {
             getTileScaleFactor() {
                 return ctxRef.current.tileScaleFactor;
             },
+            getHeaderTileScaleFactor() {
+                return ctxRef.current.headerTileScaleFactor;
+            },
             getTileDocSize(factor) {
                 // Tiles are doc-constant, so the doc size a factor yields derives
                 // from the content-fit reference, not the current zoom.
@@ -437,7 +457,7 @@ export const useAnnotationCanvasState = (props) => {
                     return;
                 // The tile's CURRENT on-screen half-extents: stampTileDims with the
                 // zoom-relative tileViewportScale folded in.
-                const dims = stampTileDims(m, c.tileScaleFactor, c.tileViewportScale);
+                const dims = stampTileDims(m, c.tileScaleFactor, c.tileViewportScale, c.headerTileScaleFactor);
                 const halfW = dims.width / 2;
                 const halfH = dims.height / 2;
                 const s = c.viewport.worldToScreen(m.anchor);
@@ -734,6 +754,7 @@ export const useAnnotationCanvasState = (props) => {
         ctx,
         tileViewportScale,
         tileScaleFactor,
+        headerTileScaleFactor,
         penDrawingStroke,
         customPreviewState: toolState,
         dispatchPointerDown,

package/dist/exports.d.ts

@@ -29,7 +29,7 @@ export type { GestureConfig, PanTrigger, AnnotationCanvasInnerProps, } from './a
 export type { CanvasPointerEvent, RequestTextInput, ShapeDrawConfig, Tool, ToolContext, ToolState, } from './annotation/canvas/Tool.js';
 export type { MeasurementRef, PickMeasurement, } from './annotation/canvas/measurementPicker.js';
 export type { MeasurementStampRenderArgs, RenderMeasurementStamp, } from './annotation/canvas/measurementStampOverlay.js';
-export { STAMP_TILE_SIZE, GROUP_HEADER_TILE_WIDTH, GROUP_HEADER_TILE_HEIGHT, GROUP_HEADER_COLLAPSED_WIDTH, GROUP_HEADER_COLLAPSED_HEIGHT, GROUP_HEADER_DESIGN, groupHeaderBaseDims, DEFAULT_TILE_SCALE, TILE_SCALE_MIN, TILE_SCALE_MAX, clampTileScale, resolveTileScaleFactor, tileDocSizeForFactor, tileScaleFromDocSize, stampTileSize, stampTileDims, isUnassociatedStamp, type StampTileDims, } from './annotation/canvas/stampLayout.js';
+export { STAMP_TILE_SIZE, GROUP_HEADER_TILE_WIDTH, GROUP_HEADER_TILE_HEIGHT, GROUP_HEADER_COLLAPSED_WIDTH, GROUP_HEADER_COLLAPSED_HEIGHT, GROUP_HEADER_DESIGN, groupHeaderBaseDims, DEFAULT_TILE_SCALE, TILE_SCALE_MIN, TILE_SCALE_MAX, clampTileScale, resolveTileScaleFactor, resolveHeaderTileScaleFactor, tileDocSizeForFactor, tileScaleFromDocSize, stampTileSize, stampTileDims, isUnassociatedStamp, type StampTileDims, } from './annotation/canvas/stampLayout.js';
 export { GROUP_HEADER_STYLE, describeGroupHeader, groupHeaderSignature, type GroupHeaderBadge, type GroupHeaderDescriptor, } from './annotation/canvas/groupHeaderLayout.js';
 export { createViewportApi, fitToScreen, fitRectToScreen, imageDocRect, panBy, zoomAt, DEFAULT_VIEWPORT, type ViewportApi, type ViewportState, } from './annotation/canvas/viewport.js';
 export { LEGACY_BACKGROUND_LAYER_ID, BACKGROUND_PLACEMENT_GAP_RATIO, backgroundLayersOf, backgroundLayerDocRect, backgroundLayersUnionRect, placeNewBackgroundLayer, } from './annotation/canvas/backgroundLayers.js';

package/dist/exports.js

@@ -34,7 +34,7 @@ export { useAnnotationMutations, } from './annotation/data/hooks/useAnnotationMu
 export { useAnnotationCanvasDoc, } from './annotation/data/hooks/useAnnotationCanvasDoc.js';
 export { hydrateCanvasState } from './annotation/data/canvasPersistence.js';
 export { InMemoryAnnotationProvider } from './annotation/data/InMemoryAnnotationProvider.js';
-export { STAMP_TILE_SIZE, GROUP_HEADER_TILE_WIDTH, GROUP_HEADER_TILE_HEIGHT, GROUP_HEADER_COLLAPSED_WIDTH, GROUP_HEADER_COLLAPSED_HEIGHT, GROUP_HEADER_DESIGN, groupHeaderBaseDims, DEFAULT_TILE_SCALE, TILE_SCALE_MIN, TILE_SCALE_MAX, clampTileScale, resolveTileScaleFactor, tileDocSizeForFactor, tileScaleFromDocSize, stampTileSize, stampTileDims, isUnassociatedStamp, } from './annotation/canvas/stampLayout.js';
+export { STAMP_TILE_SIZE, GROUP_HEADER_TILE_WIDTH, GROUP_HEADER_TILE_HEIGHT, GROUP_HEADER_COLLAPSED_WIDTH, GROUP_HEADER_COLLAPSED_HEIGHT, GROUP_HEADER_DESIGN, groupHeaderBaseDims, DEFAULT_TILE_SCALE, TILE_SCALE_MIN, TILE_SCALE_MAX, clampTileScale, resolveTileScaleFactor, resolveHeaderTileScaleFactor, tileDocSizeForFactor, tileScaleFromDocSize, stampTileSize, stampTileDims, isUnassociatedStamp, } from './annotation/canvas/stampLayout.js';
 export { GROUP_HEADER_STYLE, describeGroupHeader, groupHeaderSignature, } from './annotation/canvas/groupHeaderLayout.js';
 export { createViewportApi, fitToScreen, fitRectToScreen, imageDocRect, panBy, zoomAt, DEFAULT_VIEWPORT, } from './annotation/canvas/viewport.js';
 export { LEGACY_BACKGROUND_LAYER_ID, BACKGROUND_PLACEMENT_GAP_RATIO, backgroundLayersOf, backgroundLayerDocRect, backgroundLayersUnionRect, placeNewBackgroundLayer, } from './annotation/canvas/backgroundLayers.js';

package/dist/types/annotation.d.ts

@@ -120,6 +120,7 @@ export interface AnnotationViewport {
     backgroundImages?: AnnotationBackgroundLayer[];
 }
 export type TileScalePlatform = 'web' | 'mobile';
+export type TileScaleTarget = 'measurement' | 'header';
 export interface AnnotationCanvasState {
     schemaVersion: 1;
     layers: AnnotationLayer[];
@@ -129,6 +130,8 @@ export interface AnnotationCanvasState {
     placedMeasurements: PlacedMeasurementRef[];
     tileScaleFactor?: number;
     tileScaleFactorMobile?: number;
+    headerTileScaleFactor?: number;
+    headerTileScaleFactorMobile?: number;
     tileDocSize?: number;
     externalPayloadPath?: string;
 }
@@ -190,6 +193,7 @@ export type AnnotationPatchOp = {
     op: 'setTileScaleFactor';
     value: number;
     platform?: TileScalePlatform;
+    target?: TileScaleTarget;
 } | {
     op: 'setTileDocSize';
     value: number;

package/dist/types/annotation.js

@@ -120,6 +120,11 @@ const applyOp = (state, op) => {
         case 'setViewport':
             return { ...state, viewport: { ...state.viewport, ...op.patch } };
         case 'setTileScaleFactor':
+            if (op.target === 'header') {
+                return op.platform === 'mobile'
+                    ? { ...state, headerTileScaleFactorMobile: op.value }
+                    : { ...state, headerTileScaleFactor: op.value };
+            }
             return op.platform === 'mobile'
                 ? { ...state, tileScaleFactorMobile: op.value }
                 : { ...state, tileScaleFactor: op.value };
@@ -223,18 +228,30 @@ const invertOp = (before, op) => {
             }
             return { op: 'setViewport', patch: inversePatch };
         }
-        case 'setTileScaleFactor':
-            // Restore the prior EFFECTIVE factor for the same platform knob. Mobile
-            // falls back to the shared/web value when it has no own value yet (the
-            // pre-split doc case — mirrors resolveTileScaleFactor); absent → an
-            // explicit 1 (visually identical), keeping the `value: number` contract.
+        case 'setTileScaleFactor': {
+            // Restore the prior EFFECTIVE factor for the same platform (and tile
+            // kind) knob. Mobile falls back to the shared/web value when it has no
+            // own value yet (the pre-split doc case — mirrors
+            // resolveTileScaleFactor), and the header knob further falls back to
+            // the measurement knob (mirrors resolveHeaderTileScaleFactor); absent →
+            // an explicit 1 (visually identical), keeping the `value: number`
+            // contract.
+            const measurementPrior = op.platform === 'mobile'
+                ? (before.tileScaleFactorMobile ?? before.tileScaleFactor)
+                : before.tileScaleFactor;
+            const prior = op.target === 'header'
+                ? ((op.platform === 'mobile'
+                    ? (before.headerTileScaleFactorMobile ??
+                        before.headerTileScaleFactor)
+                    : before.headerTileScaleFactor) ?? measurementPrior)
+                : measurementPrior;
             return {
                 op: 'setTileScaleFactor',
-                value: (op.platform === 'mobile'
-                    ? (before.tileScaleFactorMobile ?? before.tileScaleFactor)
-                    : before.tileScaleFactor) ?? 1,
+                value: prior ?? 1,
                 ...(op.platform && { platform: op.platform }),
+                ...(op.target && { target: op.target }),
             };
+        }
         case 'setTileDocSize':
             // Restore the prior calibration when there was one. A doc that never
             // had a calibration can't be reverted to "absent" through this op

package/package.json

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