@reekon-tools/boldr-utils 1.14.2 → 1.15.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, state.headerTileScaleFactor));
+            .find((m) => hitPlacedMeasurement(m, world, state.viewport.zoom, state.tileScaleFactor, state.tileViewportScale, state.headerTileScaleFactor, state.fileTileScaleFactor));
         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, state.headerTileScaleFactor);
+                    const { width, height } = stampTileDims(placed, state.tileScaleFactor, state.tileViewportScale, state.headerTileScaleFactor, state.fileTileScaleFactor);
                     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

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { Group, Line, Rect, RoundedRect, Skia, rect, rrect, useFont, } from '@shopify/react-native-skia';
-import { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
+import { useCallback, useEffect, useLayoutEffect, useMemo, useRef, useState, } from 'react';
 import { StyleSheet, TouchableOpacity, View, } from 'react-native';
 import { Gesture, GestureDetector, GestureHandlerRootView, } from 'react-native-gesture-handler';
 import Animated, { runOnJS, runOnUI, useAnimatedStyle, useDerivedValue, useSharedValue, } from 'react-native-reanimated';
@@ -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, st.ctx.headerTileScaleFactor);
+            const hit = dragSelection.hitTest(st.ctx.document, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor, st.ctx.headerTileScaleFactor, st.ctx.fileTileScaleFactor);
             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, st.ctx.headerTileScaleFactor)) {
+                    !cfg.isSelectedTileGrab?.(st.ctx.document, selId, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor, st.ctx.headerTileScaleFactor, st.ctx.fileTileScaleFactor)) {
                     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, st.ctx.headerTileScaleFactor);
+                const hit = cfg.hitTest(st.ctx.document, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor, st.ctx.headerTileScaleFactor, st.ctx.fileTileScaleFactor);
                 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, st.ctx.headerTileScaleFactor)
+                    ? cfg.classifyMeasurementGrab?.(st.ctx.document, hit.id, world, zoomNow, st.ctx.tileViewportScale, st.ctx.tileScaleFactor, st.ctx.headerTileScaleFactor, st.ctx.fileTileScaleFactor)
                     : '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, headerTileScaleFactor: state.headerTileScaleFactor, 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, fileTileScaleFactor: state.fileTileScaleFactor, 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, headerTileScaleFactor, 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, fileTileScaleFactor, 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, headerTileScaleFactor ?? tileScaleFactor);
+    const { width, height } = stampTileDims(placed, tileScaleFactor, tileViewportScale, headerTileScaleFactor ?? tileScaleFactor, fileTileScaleFactor ?? tileScaleFactor);
     const halfW = width / 2;
     const halfH = height / 2;
     // Remove-"X" touch target, sized as a fraction of the tile and corner-pinned
@@ -1659,13 +1659,36 @@ const MeasurementStampOverlayItem = ({ placed, measurement, selected, dragging,
     // in the same render the new anchor arrives — no flicker.
     //
     // Size: the LAID-OUT box is the tile's screen size at `zoomSnapshot` (the
-    // JS viewport this render was built from). Tiles scale with zoom, so while
-    // a pinch/glide has the live zoom ahead of that snapshot the worklet
-    // bridges the gap with a scale transform (about the centered anchor);
-    // when the gesture ends and the JS snapshot syncs, the item re-renders at
-    // the final size and the scale settles back to exactly 1 — the same
-    // captured-prop handoff the drag offsets use, so there is no jump.
+    // JS viewport this render was built from) — a real re-layout, which is what
+    // keeps the tile crisp: iOS rasterizes a view at its laid-out size, so a
+    // box magnified by a transform alone blurs at 3× (tried; illegible). Tiles
+    // scale with zoom, so while a pinch/glide has the live zoom ahead of that
+    // snapshot the worklet bridges the gap with a scale transform (about the
+    // centered anchor); when the gesture ends and the JS snapshot syncs, the
+    // item re-renders at the final size and the scale settles back to 1.
+    //
+    // That settle MUST land in the same frame as the re-layout, and captured
+    // props can't do it: reanimated re-evaluates a useAnimatedStyle whose
+    // captured values changed from a PASSIVE effect — a later task, after
+    // React's commit has already mounted the new layout — so every pinch
+    // release drew one frame of the new, bigger box under the old, still-
+    // magnifying transform and the whole canvas flashed (Asana
+    // 1217570500895545 QA). The layout-dependent inputs therefore travel as
+    // SHARED VALUES written from useLayoutEffect: that runs inside the commit
+    // task, right behind the mount dispatch, and mapper runs on the UI runtime
+    // are microtasks, so the transform update lands in the same main-queue
+    // drain as the new layout — before Core Animation commits the frame.
+    // (`dragging`/`sliding` stay captured: the anchor they gate changes in the
+    // same render and doesn't touch layout, so both lag together, harmlessly.)
     const zoomBase = zoomSnapshot > 0 ? zoomSnapshot : 1;
+    const zoomBaseSv = useSharedValue(zoomBase);
+    const halfWSv = useSharedValue(halfW);
+    const halfHSv = useSharedValue(halfH);
+    useLayoutEffect(() => {
+        zoomBaseSv.value = zoomBase;
+        halfWSv.value = halfW;
+        halfHSv.value = halfH;
+    }, [zoomBase, halfW, halfH, zoomBaseSv, halfWSv, halfHSv]);
     const animatedStyle = useAnimatedStyle(() => {
         'worklet';
         let worldX = anchorX;
@@ -1714,11 +1737,11 @@ const MeasurementStampOverlayItem = ({ placed, measurement, selected, dragging,
         const cy = (worldY - panY.value) * zoom.value;
         return {
             transform: [
-                { translateX: cx - halfW },
-                { translateY: cy - halfH },
+                { translateX: cx - halfWSv.value },
+                { translateY: cy - halfHSv.value },
                 // Scales about the box center, which the translate just pinned to
                 // the anchor — so the tile grows/shrinks in place.
-                { scale: zoom.value / zoomBase },
+                { scale: zoom.value / zoomBaseSv.value },
             ],
         };
     });

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

@@ -25,6 +25,7 @@ export interface ToolContext {
     tileViewportScale: number;
     tileScaleFactor: number;
     headerTileScaleFactor: number;
+    fileTileScaleFactor: number;
     preview(patch: AnnotationDocumentPatch): void;
     commit(patch: AnnotationDocumentPatch): void;
     setSelection(selection: Selection | null): void;
@@ -55,12 +56,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, headerTileScaleFactor?: number): {
+    hitTest(doc: AnnotationCanvasState, world: Vec2, zoom: number, viewportTileScale?: number, tileScaleFactor?: number, headerTileScaleFactor?: number, fileTileScaleFactor?: 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, headerTileScaleFactor?: number): 'slide' | 'move';
+    classifyMeasurementGrab?(doc: AnnotationCanvasState, id: AnnotationElementId, world: Vec2, zoom: number, viewportTileScale?: number, tileScaleFactor?: number, headerTileScaleFactor?: number, fileTileScaleFactor?: 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;
@@ -78,7 +79,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, headerTileScaleFactor?: number): boolean;
+    isSelectedTileGrab?(doc: AnnotationCanvasState, id: AnnotationElementId, world: Vec2, zoom: number, viewportTileScale?: number, tileScaleFactor?: number, headerTileScaleFactor?: number, fileTileScaleFactor?: 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, headerTileScaleFactor?: number) => boolean;
+export declare const hitPlacedMeasurement: (m: PlacedMeasurementRef, p: Vec2, zoom?: number, tileScaleFactor?: number, viewportScale?: number, headerTileScaleFactor?: number, fileTileScaleFactor?: number) => boolean;
 export interface RemoveMeasurementResult {
     ops: AnnotationPatchOp[];
     keepSelection: boolean;

package/dist/annotation/canvas/measurementGeometry.js

@@ -110,15 +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, headerTileScaleFactor = tileScaleFactor) => {
+export const hitPlacedMeasurement = (m, p, zoom = 1, tileScaleFactor = 1, viewportScale = 1, headerTileScaleFactor = tileScaleFactor, fileTileScaleFactor = 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
-    // sized by their OWN document-wide knob, `headerTileScaleFactor` — see
+    // stamps share the square footprint; group-header chips are a wide pill and
+    // object tiles a square, each sized by its OWN document-wide knob — see
     // stampTileDims in stampLayout).
-    const dims = stampTileDims(m, tileScaleFactor, viewportScale, headerTileScaleFactor);
+    const dims = stampTileDims(m, tileScaleFactor, viewportScale, headerTileScaleFactor, fileTileScaleFactor);
     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/measurementPicker.d.ts

@@ -8,3 +8,8 @@ export interface MeasurementRef {
     unit?: Units;
 }
 export type PickMeasurement = () => Promise<MeasurementRef | null>;
+export interface FileRef {
+    fileId: string;
+    filePath: string;
+    groupId: string;
+}

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

@@ -20,13 +20,15 @@ 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 resolveFileTileScaleFactor: (canvas: Pick<AnnotationCanvasState, "tileScaleFactor" | "tileScaleFactorMobile" | "fileTileScaleFactor" | "fileTileScaleFactorMobile">, 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;
-export declare const isUnassociatedStamp: (m: Pick<PlacedMeasurementRef, "measurementId" | "measurementPath" | "columnId" | "isGroupHeader">) => boolean;
+export declare const isFileStamp: (m: Pick<PlacedMeasurementRef, "fileId">) => boolean;
+export declare const isUnassociatedStamp: (m: Pick<PlacedMeasurementRef, "measurementId" | "measurementPath" | "columnId" | "isGroupHeader" | "fileId">) => boolean;
 export declare const stampTileSize: (m: Pick<PlacedMeasurementRef, "scale">, tileScaleFactor?: number, viewportScale?: number) => number;
 export interface StampTileDims {
     width: number;
     height: number;
 }
-export declare const stampTileDims: (m: Pick<PlacedMeasurementRef, "scale" | "isGroupHeader" | "collapsed">, tileScaleFactor?: number, viewportScale?: number, headerTileScaleFactor?: number) => StampTileDims;
+export declare const stampTileDims: (m: Pick<PlacedMeasurementRef, "scale" | "isGroupHeader" | "collapsed" | "fileId">, tileScaleFactor?: number, viewportScale?: number, headerTileScaleFactor?: number, fileTileScaleFactor?: number) => StampTileDims;

package/dist/annotation/canvas/stampLayout.js

@@ -90,8 +90,15 @@ export const resolveTileScaleFactor = (canvas, platform) => (platform === 'mobil
 // resolve through here so they agree.
 export const resolveHeaderTileScaleFactor = (canvas, platform) => (platform === 'mobile'
     ? (canvas.headerTileScaleFactorMobile ?? canvas.headerTileScaleFactor)
-    : canvas.headerTileScaleFactor) ??
-    resolveTileScaleFactor(canvas, platform);
+    : canvas.headerTileScaleFactor) ?? resolveTileScaleFactor(canvas, platform);
+// Resolve the document-wide OBJECT-tile-scale knob for a platform — the third
+// knob (Asana 1217570500895545), resolved exactly like the header knob: own
+// platform value → web value → the MEASUREMENT factor, so an object tile
+// placed before its knob was ever moved matches the measurement tiles beside
+// it. The ONE read path for the file fields.
+export const resolveFileTileScaleFactor = (canvas, platform) => (platform === 'mobile'
+    ? (canvas.fileTileScaleFactorMobile ?? canvas.fileTileScaleFactor)
+    : canvas.fileTileScaleFactor) ?? 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;
@@ -130,12 +137,21 @@ export const tileScaleFromDocSize = (docSize, zoom) => (docSize * zoom) / STAMP_
 // (An even earlier per-canvas auto-multiplier — tile size derived from the
 // canvas's pixel size — was retired for the user-driven "Tile size" slider,
 // which remains: the slider and the zoom multiplier compose.)
+// A placed element is an OBJECT tile (a group file placed from the picker's
+// object grid) when it carries a `fileId` — the one field measurement, column
+// and header tiles never set. The single discriminant every host and engine
+// path should branch on, so the check can't drift between them.
+export const isFileStamp = (m) => !!m.fileId;
 // A placed measurement is an unassociated input until a measurement reference
 // is attached (id or path) OR it is bound to a form column (`columnId`). Such
 // stamps render as the blank "+" placeholder (same footprint as a populated
-// tile — see STAMP_TILE_SIZE). Group-header chips carry neither ref but are
-// NOT inputs — never treat them as blank "+" placeholders.
-export const isUnassociatedStamp = (m) => !m.isGroupHeader && !m.measurementId && !m.measurementPath && !m.columnId;
+// tile — see STAMP_TILE_SIZE). Group-header chips and object tiles carry
+// neither ref but are NOT inputs — never treat them as blank "+" placeholders.
+export const isUnassociatedStamp = (m) => !m.isGroupHeader &&
+    !isFileStamp(m) &&
+    !m.measurementId &&
+    !m.measurementPath &&
+    !m.columnId;
 // Screen-space edge length for a placed stamp: the base size scaled by the
 // per-stamp `scale`, the document-wide `tileScaleFactor`, and the
 // zoom-relative `viewportScale`. Blank and populated stamps share the
@@ -149,9 +165,14 @@ export const isUnassociatedStamp = (m) => !m.isGroupHeader && !m.measurementId &
 // 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;
 // `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) => {
+// (resolveHeaderTileScaleFactor) and `fileTileScaleFactor` the object tiles'
+// (resolveFileTileScaleFactor); both default to `tileScaleFactor` so callers
+// that predate the per-kind split keep their one-knob behavior.
+export const stampTileDims = (m, tileScaleFactor = DEFAULT_TILE_SCALE, viewportScale = 1, headerTileScaleFactor = tileScaleFactor, fileTileScaleFactor = tileScaleFactor) => {
+    if (isFileStamp(m)) {
+        const k = (m.scale ?? 1) * fileTileScaleFactor * viewportScale;
+        return { width: STAMP_TILE_SIZE * k, height: STAMP_TILE_SIZE * k };
+    }
     if (!m.isGroupHeader) {
         const k = (m.scale ?? 1) * tileScaleFactor * viewportScale;
         return { width: STAMP_TILE_SIZE * k, height: STAMP_TILE_SIZE * 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, ctx.headerTileScaleFactor)) {
+            if (hitPlacedMeasurement(m, event.world, zoom, ctx.tileScaleFactor, ctx.tileViewportScale, ctx.headerTileScaleFactor, ctx.fileTileScaleFactor)) {
                 ctx.setSelection({ ids: [m.id] });
                 return;
             }

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

@@ -70,11 +70,11 @@ 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) => {
+headerTileScaleFactor = doc.headerTileScaleFactor ?? tileScaleFactor, fileTileScaleFactor = doc.fileTileScaleFactor ?? 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, headerTileScaleFactor)) {
+        if (hitPlacedMeasurement(m, world, zoom, tileScaleFactor, viewportTileScale, headerTileScaleFactor, fileTileScaleFactor)) {
             return { id: m.id, kind: 'measurement' };
         }
     }
@@ -183,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, headerTileScaleFactor = doc.headerTileScaleFactor ?? tileScaleFactor) => {
+const isOnMeasurementTile = (doc, id, world, zoom, viewportTileScale = 1, tileScaleFactor = doc.tileScaleFactor, headerTileScaleFactor = doc.headerTileScaleFactor ?? tileScaleFactor, fileTileScaleFactor = doc.fileTileScaleFactor ?? tileScaleFactor) => {
     const m = doc.placedMeasurements.find((x) => x.id === id);
     if (!m)
         return false;
-    const dims = stampTileDims(m, tileScaleFactor, viewportTileScale, headerTileScaleFactor);
+    const dims = stampTileDims(m, tileScaleFactor, viewportTileScale, headerTileScaleFactor, fileTileScaleFactor);
     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 &&
@@ -197,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, headerTileScaleFactor = doc.headerTileScaleFactor ?? tileScaleFactor) => {
+const classifyGrab = (doc, id, world, zoom, viewportTileScale = 1, tileScaleFactor = doc.tileScaleFactor, headerTileScaleFactor = doc.headerTileScaleFactor ?? tileScaleFactor, fileTileScaleFactor = doc.fileTileScaleFactor ?? 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, headerTileScaleFactor);
+    const dims = stampTileDims(m, tileScaleFactor, viewportTileScale, headerTileScaleFactor, fileTileScaleFactor);
     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 &&
@@ -604,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, headerTileScaleFactor) => findHit(doc, world, zoom, viewportTileScale, tileScaleFactor, headerTileScaleFactor),
+        hitTest: (doc, world, zoom, viewportTileScale, tileScaleFactor, headerTileScaleFactor, fileTileScaleFactor) => findHit(doc, world, zoom, viewportTileScale, tileScaleFactor, headerTileScaleFactor, fileTileScaleFactor),
         buildTranslatePatch: (doc, id, kind, delta) => {
             const op = translatePatch(kind, id, doc, delta);
             return op ? { ops: [op] } : null;
@@ -643,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, ctx.headerTileScaleFactor)) {
+            !isOnMeasurementTile(ctx.document, selId, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor, ctx.headerTileScaleFactor, ctx.fileTileScaleFactor)) {
             const handle = findHandleHit(ctx.document, selId, world, zoom);
             if (handle) {
                 ctx.setSelection({ ids: [selId] });
@@ -712,7 +712,7 @@ export const createSelectTool = (options = {}) => ({
                 };
             }
         }
-        const hit = findHit(ctx.document, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor, ctx.headerTileScaleFactor);
+        const hit = findHit(ctx.document, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor, ctx.headerTileScaleFactor, ctx.fileTileScaleFactor);
         if (!hit) {
             // Background layers only get a look-in when every annotation element
             // misses — they can cover the whole document, so elements above always
@@ -757,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, ctx.headerTileScaleFactor) === 'slide'
+            classifyGrab(ctx.document, hit.id, world, zoom, ctx.tileViewportScale, ctx.tileScaleFactor, ctx.headerTileScaleFactor, ctx.fileTileScaleFactor) === 'slide'
             ? 'slide'
             : 'move';
         return {

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

@@ -1,6 +1,6 @@
 import type { Measurement } from '../../types/firestore.js';
 import { type AnnotationCanvasState, type AnnotationDocumentPatch, type AnnotationElementId, type AnnotationStroke, type MeasurementPlacement, type Selection, type TileScalePlatform, type Vec2 } from '../../types/annotation.js';
-import type { MeasurementRef } from './measurementPicker.js';
+import type { FileRef, MeasurementRef } from './measurementPicker.js';
 import type { CanvasPointerEvent, RequestTextInput, Tool, ToolContext, ToolState } from './Tool.js';
 import { type ViewportState } from './viewport.js';
 export interface CanvasScreenRect {
@@ -25,6 +25,7 @@ export interface AnnotationCanvasHandle {
     }): void;
     getTileScaleFactor(): number;
     getHeaderTileScaleFactor(): number;
+    getFileTileScaleFactor(): number;
     getTileDocSize(factor: number): number;
     ensureMeasurementVisible(id: AnnotationElementId): void;
     placeMeasurementAtCenter(ref: MeasurementRef): void;
@@ -47,6 +48,7 @@ export interface AnnotationCanvasHandle {
     placeGroupHeaderAtCenter(ref: {
         groupId: string;
     }): AnnotationElementId;
+    placeFileAtCenter(ref: FileRef): AnnotationElementId;
     setGroupHeaderCollapsed(id: AnnotationElementId, collapsed: boolean): void;
     deleteSelected(): void;
 }
@@ -86,6 +88,7 @@ export interface AnnotationCanvasStateApi {
     tileViewportScale: number;
     tileScaleFactor: number;
     headerTileScaleFactor: number;
+    fileTileScaleFactor: 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 { resolveHeaderTileScaleFactor, resolveTileScaleFactor, stampTileDims, STAMP_TILE_SIZE, tileDocSizeForFactor, tileScaleFromDocSize, } from './stampLayout.js';
+import { resolveHeaderTileScaleFactor, resolveFileTileScaleFactor, 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';
@@ -162,6 +162,8 @@ export const useAnnotationCanvasState = (props) => {
     // equals the measurement factor (resolveHeaderTileScaleFactor's fallback) —
     // the pre-split one-knob behavior.
     let headerTileScaleFactor = resolveHeaderTileScaleFactor(effectiveCanvas, tileScalePlatformResolved);
+    // Object tiles: the third knob, same fallback (Asana 1217570500895545).
+    let fileTileScaleFactor = resolveFileTileScaleFactor(effectiveCanvas, tileScalePlatformResolved);
     if (tileScalePlatformResolved === 'mobile' &&
         effectiveCanvas.tileScaleFactorMobile == null &&
         effectiveCanvas.tileDocSize != null &&
@@ -178,6 +180,10 @@ export const useAnnotationCanvasState = (props) => {
             tileScaleFactor > 0
                 ? headerTileScaleFactor * (calibrated / tileScaleFactor)
                 : calibrated;
+        fileTileScaleFactor =
+            tileScaleFactor > 0
+                ? fileTileScaleFactor * (calibrated / tileScaleFactor)
+                : calibrated;
         tileScaleFactor = calibrated;
     }
     const ctx = useMemo(() => ({
@@ -187,6 +193,7 @@ export const useAnnotationCanvasState = (props) => {
         tileViewportScale,
         tileScaleFactor,
         headerTileScaleFactor,
+        fileTileScaleFactor,
         preview(patch) {
             setPreviewPatch(patch);
         },
@@ -209,6 +216,47 @@ export const useAnnotationCanvasState = (props) => {
                     };
                 }
             }
+            // The three tile-kind knobs are independent (Asana 1217570500895545):
+            // moving the MEASUREMENT slider must not move header chips or object
+            // tiles. Their knobs fall back to the measurement factor while unset
+            // (back-compat for documents from the one-knob era), so the first
+            // measurement-slider commit on this platform latches each unset knob
+            // at the value it is drawn at RIGHT NOW — the resolved (and, on
+            // mobile, calibration-corrected) factor — and it stops following. Same
+            // undo step as the slider commit.
+            const measurementKnobOp = effective.ops.find((o) => o.op === 'setTileScaleFactor' &&
+                (o.target ?? 'measurement') === 'measurement' &&
+                (o.platform ?? 'web') === tileScalePlatformResolved);
+            if (measurementKnobOp) {
+                const isMobile = tileScalePlatformResolved === 'mobile';
+                const headerUnset = isMobile
+                    ? canvas.headerTileScaleFactorMobile == null
+                    : canvas.headerTileScaleFactor == null;
+                const fileUnset = isMobile
+                    ? canvas.fileTileScaleFactorMobile == null
+                    : canvas.fileTileScaleFactor == null;
+                const latch = [];
+                if (headerUnset) {
+                    latch.push({
+                        op: 'setTileScaleFactor',
+                        value: headerTileScaleFactor,
+                        platform: tileScalePlatformResolved,
+                        target: 'header',
+                    });
+                }
+                if (fileUnset) {
+                    latch.push({
+                        op: 'setTileScaleFactor',
+                        value: fileTileScaleFactor,
+                        platform: tileScalePlatformResolved,
+                        target: 'file',
+                    });
+                }
+                // Latches go FIRST so they read the pre-move state; the slider op
+                // then only moves the measurement knob.
+                if (latch.length)
+                    effective = { ops: [...latch, ...effective.ops] };
+            }
             const inverse = invertPatch(canvas, effective);
             undoStackRef.current.push({ forward: effective, inverse });
             redoStackRef.current = [];
@@ -239,6 +287,7 @@ export const useAnnotationCanvasState = (props) => {
         tileViewportScale,
         tileScaleFactor,
         headerTileScaleFactor,
+        fileTileScaleFactor,
         tileScalePlatformResolved,
         baseFitZoom,
         onCommit,
@@ -445,6 +494,9 @@ export const useAnnotationCanvasState = (props) => {
             getHeaderTileScaleFactor() {
                 return ctxRef.current.headerTileScaleFactor;
             },
+            getFileTileScaleFactor() {
+                return ctxRef.current.fileTileScaleFactor;
+            },
             getTileDocSize(factor) {
                 // Tiles are doc-constant, so the doc size a factor yields derives
                 // from the content-fit reference, not the current zoom.
@@ -457,7 +509,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, c.headerTileScaleFactor);
+                const dims = stampTileDims(m, c.tileScaleFactor, c.tileViewportScale, c.headerTileScaleFactor, c.fileTileScaleFactor);
                 const halfW = dims.width / 2;
                 const halfH = dims.height / 2;
                 const s = c.viewport.worldToScreen(m.anchor);
@@ -681,6 +733,24 @@ export const useAnnotationCanvasState = (props) => {
                 c.setSelection({ ids: [placed.id] });
                 return placed.id;
             },
+            placeFileAtCenter(ref) {
+                const c = ctxRef.current;
+                const anchor = cascadeCenterWorld();
+                // No showLabel/showValue/placement — an object tile is not an input;
+                // it renders the file's preview, resolved live by the consumer.
+                const placed = {
+                    id: `file-${Date.now().toString(36)}-${Math.floor(Math.random() * 1e9).toString(36)}`,
+                    layerId: c.document.layers[0]?.id ?? DEFAULT_LAYER_ID,
+                    fileId: ref.fileId,
+                    filePath: ref.filePath,
+                    groupId: ref.groupId,
+                    anchor,
+                    createdAt: Date.now(),
+                };
+                c.commit({ ops: [{ op: 'addMeasurement', measurement: placed }] });
+                c.setSelection({ ids: [placed.id] });
+                return placed.id;
+            },
             setGroupHeaderCollapsed(id, collapsed) {
                 const c = ctxRef.current;
                 const target = c.document.placedMeasurements.find((m) => m.id === id);
@@ -755,6 +825,7 @@ export const useAnnotationCanvasState = (props) => {
         tileViewportScale,
         tileScaleFactor,
         headerTileScaleFactor,
+        fileTileScaleFactor,
         penDrawingStroke,
         customPreviewState: toolState,
         dispatchPointerDown,

package/dist/exports.d.ts

@@ -27,9 +27,9 @@ export { InMemoryAnnotationProvider } from './annotation/data/InMemoryAnnotation
 export type { AnnotationCanvasHandle } from './annotation/canvas/useAnnotationCanvasState.js';
 export type { GestureConfig, PanTrigger, AnnotationCanvasInnerProps, } from './annotation/canvas/AnnotationCanvasInner.js';
 export type { CanvasPointerEvent, RequestTextInput, ShapeDrawConfig, Tool, ToolContext, ToolState, } from './annotation/canvas/Tool.js';
-export type { MeasurementRef, PickMeasurement, } from './annotation/canvas/measurementPicker.js';
+export type { FileRef, 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, resolveHeaderTileScaleFactor, 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, resolveFileTileScaleFactor, tileDocSizeForFactor, tileScaleFromDocSize, stampTileSize, stampTileDims, isUnassociatedStamp, isFileStamp, 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, resolveHeaderTileScaleFactor, 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, resolveFileTileScaleFactor, tileDocSizeForFactor, tileScaleFromDocSize, stampTileSize, stampTileDims, isUnassociatedStamp, isFileStamp, } 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/theme/index.d.ts

@@ -0,0 +1,3 @@
+export * from './colors.js';
+export * from './semantic.js';
+export * from './preset.js';

package/dist/theme/index.js

@@ -0,0 +1,3 @@
+export * from './colors.js';
+export * from './semantic.js';
+export * from './preset.js';