canvu-react 0.4.47 → 0.4.49

package/dist/react.d.cts

@@ -1,18 +1,19 @@
-import { I as IndexedDbImageStore } from './asset-hydration-Cy_2FyV5.cjs';
-export { H as HydratedSceneItemsWithAssetsResult, h as hydrateSceneItemsWithAssets } from './asset-hydration-Cy_2FyV5.cjs';
-import { V as VectorSceneItem } from './types-BCCvY6ie.cjs';
-import { V as VectorViewportAssetKind, a as VectorViewportAssetStore } from './asset-store-TzOPvlgn.cjs';
-export { b as VectorViewportAssetHydrationRequest, c as VectorViewportAssetResolveRequest, d as VectorViewportAssetResolveResult, e as VectorViewportAssetUploadRequest, f as VectorViewportAssetUploadResult } from './asset-store-TzOPvlgn.cjs';
-import { B as BoardComponentPosition, V as VectorToolDefinition, C as CanvasPlugin, a as VectorSelectionInspector } from './types-C4wI3Jyc.cjs';
-export { b as CanvasPluginComponentProps, c as CanvasPluginContribution, d as CanvasPluginItemsChangeMiddlewareContext, e as CanvasPluginRenderContext, f as CanvuChromeActiveToolStyle, g as CanvuChromeContext, h as CanvuChromeContextValue, i as CanvuChromeSelectionStyleChange, j as CanvuPluginContext, k as CanvuPluginContextValue, l as CanvuPluginViewportSnapshot, m as CustomShapePlacementOptions, P as PlacementPreview, n as VectorCanvasSpacePosition, o as VectorSelectionInspectorProps, p as VectorViewport, q as VectorViewportHandle, r as VectorViewportProps, W as WorldPointerDownDetail, s as createCanvuPlugin, t as getBoardPositionStyle, u as useCanvuChromeContext, v as useCanvuDocumentContext, w as useCanvuPluginContext, x as useCanvuPluginContribution, y as useCanvuResolvedTools, z as useCanvuViewportContext } from './types-C4wI3Jyc.cjs';
+import { V as VectorSceneItem } from './types-fJNwEnHf.cjs';
+export { C as CustomShapeResizeHandles, b as ResizeHandleId } from './types-fJNwEnHf.cjs';
+import { I as IndexedDbImageStore } from './asset-hydration-F6aM5C7x.cjs';
+export { H as HydratedSceneItemsWithAssetsResult, h as hydrateSceneItemsWithAssets } from './asset-hydration-F6aM5C7x.cjs';
+import { V as VectorViewportAssetKind, a as VectorViewportAssetStore } from './asset-store-35ysK28r.cjs';
+export { b as VectorViewportAssetHydrationRequest, c as VectorViewportAssetResolveRequest, d as VectorViewportAssetResolveResult, e as VectorViewportAssetUploadRequest, f as VectorViewportAssetUploadResult } from './asset-store-35ysK28r.cjs';
+import { B as BoardComponentPosition, V as VectorToolDefinition, C as CustomShapePlacementOptions, a as CanvasPlugin, b as VectorSelectionInspector } from './types-uzeExFkd.cjs';
+export { c as CanvasPluginComponentProps, d as CanvasPluginContribution, e as CanvasPluginItemsChangeMiddlewareContext, f as CanvasPluginRenderContext, g as CanvuChromeActiveToolStyle, h as CanvuChromeContext, i as CanvuChromeContextValue, j as CanvuChromeSelectionStyleChange, k as CanvuPluginContext, l as CanvuPluginContextValue, m as CanvuPluginViewportSnapshot, P as PlacementPreview, S as SelectModeItemClickDetail, n as SelectModeItemClickResult, o as VectorCanvasSpacePosition, p as VectorSelectionInspectorProps, q as VectorViewport, r as VectorViewportHandle, s as VectorViewportProps, W as WorldPointerDownDetail, t as createCanvuPlugin, u as getBoardPositionStyle, v as useCanvuChromeContext, w as useCanvuDocumentContext, x as useCanvuPluginContext, y as useCanvuPluginContribution, z as useCanvuResolvedTools, A as useCanvuViewportContext } from './types-uzeExFkd.cjs';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { CSSProperties, ReactNode, ReactElement, SVGProps } from 'react';
-import { C as Camera2D } from './shape-builders-CKEMjivV.cjs';
-import { V as VectorCanvasPersistenceAdapter, a as VectorCanvasRemoteAdapter } from './types-BUPc2Zgw.cjs';
-export { b as VectorCanvasSnapshot } from './types-BUPc2Zgw.cjs';
-import './link-item-DwzXOwU5.cjs';
-import './types-BQUbxMgz.cjs';
+import { C as Camera2D } from './shape-builders-BmLS8CNh.cjs';
+import { V as VectorCanvasPersistenceAdapter, a as VectorCanvasRemoteAdapter } from './types-6HszqSa5.cjs';
+export { b as VectorCanvasSnapshot } from './types-6HszqSa5.cjs';
+import './link-item-BMV3VUCr.cjs';
+import './types-BOQLWyCw.cjs';
 
 /**
  * Extra context for each item created by {@link ingestAssetFilesToSceneItems}.
@@ -391,6 +392,21 @@ type CreateToolPluginOptions = VectorToolDefinition & {
             height: number;
         };
     }) => VectorSceneItem;
+    /**
+     * Whether items created by this tool should become selected immediately after placement.
+     *
+     * Defaults to `true`. Set to `false` for clickable custom tools such as pins,
+     * reactions, or cards that should act without showing selection handles on placement.
+     */
+    selectAfterCreate?: CustomShapePlacementOptions["selectAfterCreate"];
+    /**
+     * Handles plain clicks on this tool's items while the viewport is in select mode.
+     *
+     * Resize and rotate handles still take priority. Returning `"handled"` marks the
+     * click as owned by the tool; dragging past the tap threshold still falls back to
+     * normal move behavior.
+     */
+    onSelectModeItemClick?: CustomShapePlacementOptions["onSelectModeItemClick"];
     /**
      * Optional tool list transform applied after this tool is merged.
      *
@@ -715,4 +731,4 @@ type VectorToolbarWithStatics = ((props: VectorToolbarProps) => ReactElement) &
  */
 declare const VectorToolbar: VectorToolbarWithStatics;
 
-export { BoardComponentPosition, CanvasPlugin, type CreateLocalStoragePersistenceAdapterOptions, type CreateToolPluginOptions, DEFAULT_OVERFLOW_TOOL_IDS, DEFAULT_VECTOR_CANVAS_STORAGE_KEY, DEFAULT_VECTOR_TOOLS, IconArchitecturalCloud, IconArrow, IconDraw, IconEllipse, IconHand, IconImage, IconLaser, IconLine, IconRect, IconSelect, IconText, ImagesMenu, type ImagesMenuLabels, type ImagesMenuProps, type IngestAssetFileError, type IngestAssetFilesToSceneItemsOptions, type IngestAssetFilesToSceneItemsResult, type IngestedAssetItemContext, NavMenu, type NavMenuMinimapProps, type NavMenuProps, type NavMenuUndoRedoProps, type NavMenuZoomControlsProps, ShapeContextMenu, type ShapeContextMenuProps, type UseVectorCanvasDocumentOptions, type UseVectorCanvasDocumentResult, VectorCanvas, VectorCanvasBody, VectorCanvasHeader, VectorCanvasMain, VectorCanvasPersistenceAdapter, VectorCanvasRemoteAdapter, VectorCanvasRoot, type VectorCanvasSlotProps, type VectorCanvasSpaceProps, VectorCanvasToolbar, type VectorCanvasToolbarProps, VectorCanvasViewportSurface, VectorSelectionInspector, VectorToolDefinition, VectorToolbar, type VectorToolbarOverflowProps, type VectorToolbarProps, type VectorToolbarRenderContext, type VectorToolbarToolLockProps, type VectorToolbarToolProps, VectorViewportAssetKind, VectorViewportAssetStore, createIndexedDbPersistenceAdapter, createLocalStoragePersistenceAdapter, createNoopPersistenceAdapter, createToolPlugin, cursorForVectorToolId, ingestAssetFilesToSceneItems, useVectorCanvasDocument };
+export { BoardComponentPosition, CanvasPlugin, type CreateLocalStoragePersistenceAdapterOptions, type CreateToolPluginOptions, CustomShapePlacementOptions, DEFAULT_OVERFLOW_TOOL_IDS, DEFAULT_VECTOR_CANVAS_STORAGE_KEY, DEFAULT_VECTOR_TOOLS, IconArchitecturalCloud, IconArrow, IconDraw, IconEllipse, IconHand, IconImage, IconLaser, IconLine, IconRect, IconSelect, IconText, ImagesMenu, type ImagesMenuLabels, type ImagesMenuProps, type IngestAssetFileError, type IngestAssetFilesToSceneItemsOptions, type IngestAssetFilesToSceneItemsResult, type IngestedAssetItemContext, NavMenu, type NavMenuMinimapProps, type NavMenuProps, type NavMenuUndoRedoProps, type NavMenuZoomControlsProps, ShapeContextMenu, type ShapeContextMenuProps, type UseVectorCanvasDocumentOptions, type UseVectorCanvasDocumentResult, VectorCanvas, VectorCanvasBody, VectorCanvasHeader, VectorCanvasMain, VectorCanvasPersistenceAdapter, VectorCanvasRemoteAdapter, VectorCanvasRoot, type VectorCanvasSlotProps, type VectorCanvasSpaceProps, VectorCanvasToolbar, type VectorCanvasToolbarProps, VectorCanvasViewportSurface, VectorSelectionInspector, VectorToolDefinition, VectorToolbar, type VectorToolbarOverflowProps, type VectorToolbarProps, type VectorToolbarRenderContext, type VectorToolbarToolLockProps, type VectorToolbarToolProps, VectorViewportAssetKind, VectorViewportAssetStore, createIndexedDbPersistenceAdapter, createLocalStoragePersistenceAdapter, createNoopPersistenceAdapter, createToolPlugin, cursorForVectorToolId, ingestAssetFilesToSceneItems, useVectorCanvasDocument };

package/dist/react.d.ts

@@ -1,18 +1,19 @@
-import { I as IndexedDbImageStore } from './asset-hydration-Dc7fsnTG.js';
-export { H as HydratedSceneItemsWithAssetsResult, h as hydrateSceneItemsWithAssets } from './asset-hydration-Dc7fsnTG.js';
-import { V as VectorSceneItem } from './types-BCCvY6ie.js';
-import { V as VectorViewportAssetKind, a as VectorViewportAssetStore } from './asset-store-DQPRZEcy.js';
-export { b as VectorViewportAssetHydrationRequest, c as VectorViewportAssetResolveRequest, d as VectorViewportAssetResolveResult, e as VectorViewportAssetUploadRequest, f as VectorViewportAssetUploadResult } from './asset-store-DQPRZEcy.js';
-import { B as BoardComponentPosition, V as VectorToolDefinition, C as CanvasPlugin, a as VectorSelectionInspector } from './types-B7xZAKVJ.js';
-export { b as CanvasPluginComponentProps, c as CanvasPluginContribution, d as CanvasPluginItemsChangeMiddlewareContext, e as CanvasPluginRenderContext, f as CanvuChromeActiveToolStyle, g as CanvuChromeContext, h as CanvuChromeContextValue, i as CanvuChromeSelectionStyleChange, j as CanvuPluginContext, k as CanvuPluginContextValue, l as CanvuPluginViewportSnapshot, m as CustomShapePlacementOptions, P as PlacementPreview, n as VectorCanvasSpacePosition, o as VectorSelectionInspectorProps, p as VectorViewport, q as VectorViewportHandle, r as VectorViewportProps, W as WorldPointerDownDetail, s as createCanvuPlugin, t as getBoardPositionStyle, u as useCanvuChromeContext, v as useCanvuDocumentContext, w as useCanvuPluginContext, x as useCanvuPluginContribution, y as useCanvuResolvedTools, z as useCanvuViewportContext } from './types-B7xZAKVJ.js';
+import { V as VectorSceneItem } from './types-fJNwEnHf.js';
+export { C as CustomShapeResizeHandles, b as ResizeHandleId } from './types-fJNwEnHf.js';
+import { I as IndexedDbImageStore } from './asset-hydration-BSjiek7Q.js';
+export { H as HydratedSceneItemsWithAssetsResult, h as hydrateSceneItemsWithAssets } from './asset-hydration-BSjiek7Q.js';
+import { V as VectorViewportAssetKind, a as VectorViewportAssetStore } from './asset-store-D_FjW_CN.js';
+export { b as VectorViewportAssetHydrationRequest, c as VectorViewportAssetResolveRequest, d as VectorViewportAssetResolveResult, e as VectorViewportAssetUploadRequest, f as VectorViewportAssetUploadResult } from './asset-store-D_FjW_CN.js';
+import { B as BoardComponentPosition, V as VectorToolDefinition, C as CustomShapePlacementOptions, a as CanvasPlugin, b as VectorSelectionInspector } from './types-BAEHaIYO.js';
+export { c as CanvasPluginComponentProps, d as CanvasPluginContribution, e as CanvasPluginItemsChangeMiddlewareContext, f as CanvasPluginRenderContext, g as CanvuChromeActiveToolStyle, h as CanvuChromeContext, i as CanvuChromeContextValue, j as CanvuChromeSelectionStyleChange, k as CanvuPluginContext, l as CanvuPluginContextValue, m as CanvuPluginViewportSnapshot, P as PlacementPreview, S as SelectModeItemClickDetail, n as SelectModeItemClickResult, o as VectorCanvasSpacePosition, p as VectorSelectionInspectorProps, q as VectorViewport, r as VectorViewportHandle, s as VectorViewportProps, W as WorldPointerDownDetail, t as createCanvuPlugin, u as getBoardPositionStyle, v as useCanvuChromeContext, w as useCanvuDocumentContext, x as useCanvuPluginContext, y as useCanvuPluginContribution, z as useCanvuResolvedTools, A as useCanvuViewportContext } from './types-BAEHaIYO.js';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as react from 'react';
 import { CSSProperties, ReactNode, ReactElement, SVGProps } from 'react';
-import { C as Camera2D } from './shape-builders-Cyh8zvDG.js';
-import { V as VectorCanvasPersistenceAdapter, a as VectorCanvasRemoteAdapter } from './types-CYtq9Pr9.js';
-export { b as VectorCanvasSnapshot } from './types-CYtq9Pr9.js';
-import './link-item-IW4GTnxl.js';
-import './types-B82WiQQh.js';
+import { C as Camera2D } from './shape-builders-BCOAG0pS.js';
+import { V as VectorCanvasPersistenceAdapter, a as VectorCanvasRemoteAdapter } from './types-BtWbGOqh.js';
+export { b as VectorCanvasSnapshot } from './types-BtWbGOqh.js';
+import './link-item-COoNNvCu.js';
+import './types-BMMPUak7.js';
 
 /**
  * Extra context for each item created by {@link ingestAssetFilesToSceneItems}.
@@ -391,6 +392,21 @@ type CreateToolPluginOptions = VectorToolDefinition & {
             height: number;
         };
     }) => VectorSceneItem;
+    /**
+     * Whether items created by this tool should become selected immediately after placement.
+     *
+     * Defaults to `true`. Set to `false` for clickable custom tools such as pins,
+     * reactions, or cards that should act without showing selection handles on placement.
+     */
+    selectAfterCreate?: CustomShapePlacementOptions["selectAfterCreate"];
+    /**
+     * Handles plain clicks on this tool's items while the viewport is in select mode.
+     *
+     * Resize and rotate handles still take priority. Returning `"handled"` marks the
+     * click as owned by the tool; dragging past the tap threshold still falls back to
+     * normal move behavior.
+     */
+    onSelectModeItemClick?: CustomShapePlacementOptions["onSelectModeItemClick"];
     /**
      * Optional tool list transform applied after this tool is merged.
      *
@@ -715,4 +731,4 @@ type VectorToolbarWithStatics = ((props: VectorToolbarProps) => ReactElement) &
  */
 declare const VectorToolbar: VectorToolbarWithStatics;
 
-export { BoardComponentPosition, CanvasPlugin, type CreateLocalStoragePersistenceAdapterOptions, type CreateToolPluginOptions, DEFAULT_OVERFLOW_TOOL_IDS, DEFAULT_VECTOR_CANVAS_STORAGE_KEY, DEFAULT_VECTOR_TOOLS, IconArchitecturalCloud, IconArrow, IconDraw, IconEllipse, IconHand, IconImage, IconLaser, IconLine, IconRect, IconSelect, IconText, ImagesMenu, type ImagesMenuLabels, type ImagesMenuProps, type IngestAssetFileError, type IngestAssetFilesToSceneItemsOptions, type IngestAssetFilesToSceneItemsResult, type IngestedAssetItemContext, NavMenu, type NavMenuMinimapProps, type NavMenuProps, type NavMenuUndoRedoProps, type NavMenuZoomControlsProps, ShapeContextMenu, type ShapeContextMenuProps, type UseVectorCanvasDocumentOptions, type UseVectorCanvasDocumentResult, VectorCanvas, VectorCanvasBody, VectorCanvasHeader, VectorCanvasMain, VectorCanvasPersistenceAdapter, VectorCanvasRemoteAdapter, VectorCanvasRoot, type VectorCanvasSlotProps, type VectorCanvasSpaceProps, VectorCanvasToolbar, type VectorCanvasToolbarProps, VectorCanvasViewportSurface, VectorSelectionInspector, VectorToolDefinition, VectorToolbar, type VectorToolbarOverflowProps, type VectorToolbarProps, type VectorToolbarRenderContext, type VectorToolbarToolLockProps, type VectorToolbarToolProps, VectorViewportAssetKind, VectorViewportAssetStore, createIndexedDbPersistenceAdapter, createLocalStoragePersistenceAdapter, createNoopPersistenceAdapter, createToolPlugin, cursorForVectorToolId, ingestAssetFilesToSceneItems, useVectorCanvasDocument };
+export { BoardComponentPosition, CanvasPlugin, type CreateLocalStoragePersistenceAdapterOptions, type CreateToolPluginOptions, CustomShapePlacementOptions, DEFAULT_OVERFLOW_TOOL_IDS, DEFAULT_VECTOR_CANVAS_STORAGE_KEY, DEFAULT_VECTOR_TOOLS, IconArchitecturalCloud, IconArrow, IconDraw, IconEllipse, IconHand, IconImage, IconLaser, IconLine, IconRect, IconSelect, IconText, ImagesMenu, type ImagesMenuLabels, type ImagesMenuProps, type IngestAssetFileError, type IngestAssetFilesToSceneItemsOptions, type IngestAssetFilesToSceneItemsResult, type IngestedAssetItemContext, NavMenu, type NavMenuMinimapProps, type NavMenuProps, type NavMenuUndoRedoProps, type NavMenuZoomControlsProps, ShapeContextMenu, type ShapeContextMenuProps, type UseVectorCanvasDocumentOptions, type UseVectorCanvasDocumentResult, VectorCanvas, VectorCanvasBody, VectorCanvasHeader, VectorCanvasMain, VectorCanvasPersistenceAdapter, VectorCanvasRemoteAdapter, VectorCanvasRoot, type VectorCanvasSlotProps, type VectorCanvasSpaceProps, VectorCanvasToolbar, type VectorCanvasToolbarProps, VectorCanvasViewportSurface, VectorSelectionInspector, VectorToolDefinition, VectorToolbar, type VectorToolbarOverflowProps, type VectorToolbarProps, type VectorToolbarRenderContext, type VectorToolbarToolLockProps, type VectorToolbarToolProps, VectorViewportAssetKind, VectorViewportAssetStore, createIndexedDbPersistenceAdapter, createLocalStoragePersistenceAdapter, createNoopPersistenceAdapter, createToolPlugin, cursorForVectorToolId, ingestAssetFilesToSceneItems, useVectorCanvasDocument };

package/dist/react.js

@@ -3355,7 +3355,9 @@ function ToolPluginComponent({
   pluginId,
   tool,
   toolTransform,
-  createItem
+  createItem,
+  selectAfterCreate,
+  onSelectModeItemClick
 }) {
   const contribution = useMemo(
     () => ({
@@ -3364,17 +3366,25 @@ function ToolPluginComponent({
       customPlacements: createItem ? [
         {
           toolId: tool.id,
-          createItem
+          createItem,
+          selectAfterCreate,
+          onSelectModeItemClick
         }
       ] : void 0
     }),
-    [createItem, tool, toolTransform]
+    [createItem, onSelectModeItemClick, selectAfterCreate, tool, toolTransform]
   );
   useCanvuPluginContribution(pluginId, contribution);
   return null;
 }
 function createToolPlugin(options) {
-  const { createItem, toolTransform, ...tool } = options;
+  const {
+    createItem,
+    toolTransform,
+    selectAfterCreate,
+    onSelectModeItemClick,
+    ...tool
+  } = options;
   const pluginId = `canvu.plugin.tool:${tool.id}`;
   return createCanvuPlugin({
     id: pluginId,
@@ -3385,7 +3395,9 @@ function createToolPlugin(options) {
           pluginId,
           tool,
           toolTransform,
-          createItem
+          createItem,
+          selectAfterCreate,
+          onSelectModeItemClick
         }
       );
     }
@@ -5986,7 +5998,43 @@ init_shape_builders();
 
 // src/interaction/resize-handles.ts
 init_rect();
-var HANDLE_IDS = ["nw", "n", "ne", "e", "se", "s", "sw", "w"];
+init_link_item();
+var ALL_RESIZE_HANDLES = [
+  "nw",
+  "n",
+  "ne",
+  "e",
+  "se",
+  "s",
+  "sw",
+  "w"
+];
+var CORNER_RESIZE_HANDLES = [
+  "nw",
+  "ne",
+  "se",
+  "sw"
+];
+function dedupeHandles(handles) {
+  const allowed = new Set(handles);
+  return ALL_RESIZE_HANDLES.filter((handle) => allowed.has(handle));
+}
+function resolveCustomResizeHandles(handles) {
+  if (handles === "corners") return CORNER_RESIZE_HANDLES;
+  if (handles === "all" || handles === void 0) return ALL_RESIZE_HANDLES;
+  return dedupeHandles(handles);
+}
+function resolveResizeHandlesForItem(item) {
+  if (!item) return ALL_RESIZE_HANDLES;
+  if (getLinkData(item)) return CORNER_RESIZE_HANDLES;
+  if (item.toolKind === "custom") {
+    return resolveCustomResizeHandles(item.customResizeHandles);
+  }
+  return ALL_RESIZE_HANDLES;
+}
+function itemAllowsResizeHandle(item, handle) {
+  return resolveResizeHandlesForItem(item).includes(handle);
+}
 function getHandleWorldPosition(bounds, id) {
   const r = normalizeRect(bounds);
   const cx = r.x + r.width / 2;
@@ -6010,7 +6058,7 @@ function getHandleWorldPosition(bounds, id) {
       return { x: r.x, y: cy };
   }
 }
-function hitTestResizeHandle(bounds, worldX, worldY, radiusWorld, rotationRad = 0) {
+function hitTestResizeHandle(bounds, worldX, worldY, radiusWorld, rotationRad = 0, handles = ALL_RESIZE_HANDLES) {
   const r = normalizeRect(bounds);
   const pl = worldToItemLocal(
     worldX,
@@ -6024,7 +6072,7 @@ function hitTestResizeHandle(bounds, worldX, worldY, radiusWorld, rotationRad =
   const localBounds = { x: 0, y: 0, width: r.width, height: r.height };
   let best = null;
   let bestD = radiusWorld;
-  for (const id of HANDLE_IDS) {
+  for (const id of handles) {
     const p = getHandleWorldPosition(localBounds, id);
     const d = Math.hypot(pl.x - p.x, pl.y - p.y);
     if (d <= bestD) {
@@ -6656,6 +6704,9 @@ function moveItemByDelta(item, dx, dy) {
 }
 function resizeItemByHandle(item, start, handle, currentWorld) {
   const sb = normalizeRect(start.bounds);
+  if (!itemAllowsResizeHandle(item, handle)) {
+    return item;
+  }
   const newBoundsRaw = computeNewBoundsForResize(item, sb, handle, currentWorld);
   const nb = normalizeRect(newBoundsRaw);
   const k = item.toolKind;
@@ -6916,6 +6967,14 @@ function formatItemPlacementTransform(item) {
   const cy = r.height / 2;
   return `translate(${item.x}, ${item.y}) translate(${cx}, ${cy}) rotate(${deg}) translate(${-cx}, ${-cy})`;
 }
+function itemClassName(item) {
+  const kind = item.toolKind ?? "unknown";
+  const classes = [`canvu-item`, `canvu-item--${kind}`];
+  if (item.svgClassName) {
+    classes.push(item.svgClassName);
+  }
+  return classes.join(" ");
+}
 var SvgVectorRenderer = class {
   container;
   scene;
@@ -6923,6 +6982,8 @@ var SvgVectorRenderer = class {
   svg;
   rootG;
   itemNodeCache = /* @__PURE__ */ new Map();
+  selectedIds = /* @__PURE__ */ new Set();
+  hoveredItemId = null;
   liveOverlay = null;
   resizeObserver;
   constructor(options) {
@@ -6943,6 +7004,20 @@ var SvgVectorRenderer = class {
     this.resizeObserver = new ResizeObserver(() => this.render());
     this.resizeObserver.observe(this.container);
   }
+  /**
+   * Updates interaction attributes on item groups for CSS hooks.
+   *
+   * Use `[data-canvu-selected="true"]` and `[data-canvu-hovered="true"]`
+   * for animations in interactive canvases where the scene SVG may ignore
+   * pointer events.
+   */
+  setInteractionState(state) {
+    this.selectedIds = new Set(state.selectedIds ?? []);
+    this.hoveredItemId = state.hoveredItemId ?? null;
+    for (const [id, cached] of this.itemNodeCache) {
+      this.applyInteractionAttributes(cached.g, id);
+    }
+  }
   /**
    * Reads container size, culls items, and updates the SVG (incrementally when possible).
    */
@@ -6979,6 +7054,7 @@ var SvgVectorRenderer = class {
     if (!this.liveOverlay) {
       const g = document.createElementNS("http://www.w3.org/2000/svg", "g");
       g.setAttribute("data-live-overlay", "true");
+      g.setAttribute("data-canvu-item", "true");
       this.liveOverlay = {
         g,
         lastChildrenSvg: "",
@@ -6988,6 +7064,11 @@ var SvgVectorRenderer = class {
     }
     const cached = this.liveOverlay;
     const t = formatItemPlacementTransform(item);
+    cached.g.setAttribute("class", itemClassName(item));
+    cached.g.setAttribute("data-item-id", item.id);
+    cached.g.setAttribute("data-tool-kind", item.toolKind ?? "");
+    cached.g.setAttribute("data-canvu-selected", "false");
+    cached.g.setAttribute("data-canvu-hovered", "false");
     if (cached.lastTransform !== t) {
       cached.g.setAttribute("transform", t);
       cached.lastTransform = t;
@@ -7018,6 +7099,7 @@ var SvgVectorRenderer = class {
       let cached = this.itemNodeCache.get(item.id);
       if (!cached) {
         const g2 = document.createElementNS("http://www.w3.org/2000/svg", "g");
+        g2.setAttribute("data-canvu-item", "true");
         g2.setAttribute("data-item-id", item.id);
         cached = {
           g: g2,
@@ -7027,6 +7109,11 @@ var SvgVectorRenderer = class {
         this.itemNodeCache.set(item.id, cached);
       }
       const { g } = cached;
+      g.setAttribute("class", itemClassName(item));
+      g.setAttribute("data-canvu-item", "true");
+      g.setAttribute("data-item-id", item.id);
+      g.setAttribute("data-tool-kind", item.toolKind ?? "");
+      this.applyInteractionAttributes(g, item.id);
       const t = formatItemPlacementTransform(item);
       if (cached.lastTransform !== t) {
         g.setAttribute("transform", t);
@@ -7043,6 +7130,16 @@ var SvgVectorRenderer = class {
       previousNode = g;
     }
   }
+  applyInteractionAttributes(g, itemId) {
+    g.setAttribute(
+      "data-canvu-selected",
+      this.selectedIds.has(itemId) ? "true" : "false"
+    );
+    g.setAttribute(
+      "data-canvu-hovered",
+      this.hoveredItemId === itemId ? "true" : "false"
+    );
+  }
   destroy() {
     this.resizeObserver.disconnect();
     this.itemNodeCache.clear();
@@ -7150,10 +7247,7 @@ function smoothFreehandPointsToPathD(points) {
 }
 
 // src/react/InteractionOverlay.tsx
-init_link_item();
 init_shape_builders();
-var HANDLE_ORDER = ["nw", "n", "ne", "e", "se", "s", "sw", "w"];
-var LINK_HANDLE_ORDER = ["nw", "ne", "se", "sw"];
 var ERASER_TINT = "#cbd5e1";
 var ERASER_TINT_OPACITY = 0.95;
 var ERASER_PREVIEW_OPACITY = 0.3;
@@ -7206,7 +7300,7 @@ function InteractionOverlay({
         ) }, it.id);
       }),
       showResizeHandles && bSingle && single && rotHandlePos && /* @__PURE__ */ jsxs(Fragment, { children: [
-        (getLinkData(single) ? LINK_HANDLE_ORDER : HANDLE_ORDER).map((hid) => {
+        resolveResizeHandlesForItem(single).map((hid) => {
           const p = getHandleWorldPositionRotated(bSingle, hid, rotSingle);
           return /* @__PURE__ */ jsx(
             "circle",
@@ -8020,7 +8114,6 @@ function defaultPlacementWorld(tool, center) {
     lineWorld: [a, b]
   };
 }
-var LINK_CORNER_HANDLES2 = /* @__PURE__ */ new Set(["nw", "ne", "se", "sw"]);
 function pointInSelectedItemBounds(item, worldX, worldY) {
   const bounds = normalizeRect(item.bounds);
   const local = worldToItemLocal(
@@ -8114,6 +8207,16 @@ function reorderItemsByIds(items, ids, direction) {
 function isDefaultMarkerToolStyle(style) {
   return style.stroke === MARKER_TOOL_STYLE.stroke && style.strokeWidth === MARKER_TOOL_STYLE.strokeWidth && style.strokeOpacity === MARKER_TOOL_STYLE.strokeOpacity;
 }
+function tagCustomPlacementItem(item, toolId) {
+  return item.customToolId === toolId ? item : { ...item, customToolId: toolId };
+}
+function findSelectModeItemClickPlacement(item, placements) {
+  const toolId = item.customToolId;
+  if (!toolId) return null;
+  return [...placements].reverse().find(
+    (placement) => placement.toolId === toolId && placement.onSelectModeItemClick
+  ) ?? null;
+}
 function mergeToolListById(baseTools, pluginTools) {
   const next = [...baseTools];
   for (const tool of pluginTools) {
@@ -8278,6 +8381,7 @@ var VectorViewport = forwardRef(
     const [cameraForOverlay, setCameraForOverlay] = useState(null);
     const sceneRef = useRef(null);
     const rendererRef = useRef(null);
+    const hoveredItemIdRef = useRef(null);
     const pluginViewportRef = useRef(null);
     const [pluginContributions, setPluginContributions] = useState({});
     const registerContribution = useCallback(
@@ -8432,6 +8536,8 @@ var VectorViewport = forwardRef(
     assetStoreRef.current = assetStore;
     const customPlacementRef = useRef(customPlacement);
     customPlacementRef.current = customPlacement;
+    const allCustomPlacementsRef = useRef(allCustomPlacements);
+    allCustomPlacementsRef.current = allCustomPlacements;
     const dragStateRef = useRef({ kind: "idle" });
     const clipboardRef = useRef(null);
     const undoStackRef = useRef([]);
@@ -8483,6 +8589,12 @@ var VectorViewport = forwardRef(
     }, [isSelectionControlled, controlledSelectedKey, uncontrolledSel]);
     const effectiveSelectedIdsRef = useRef([]);
     effectiveSelectedIdsRef.current = effectiveSelectedIds;
+    const syncRendererInteractionState = useCallback(() => {
+      rendererRef.current?.setInteractionState({
+        selectedIds: effectiveSelectedIdsRef.current,
+        hoveredItemId: hoveredItemIdRef.current
+      });
+    }, []);
     const setEffectiveSelectedIds = useCallback(
       (ids) => {
         const next = [...ids];
@@ -8925,6 +9037,10 @@ var VectorViewport = forwardRef(
         pointerEventsNone: interactiveRef.current
       });
       rendererRef.current = renderer;
+      renderer.setInteractionState({
+        selectedIds: effectiveSelectedIdsRef.current,
+        hoveredItemId: hoveredItemIdRef.current
+      });
       renderer.render();
       if (!reducedMotionRef.current) {
         setZoomPercent(Math.round(camera.zoom * 100));
@@ -8962,11 +9078,53 @@ var VectorViewport = forwardRef(
         setCameraForOverlay(null);
       };
     }, [applePencilNav, renderFrame]);
+    useEffect(() => {
+      rendererRef.current?.setInteractionState({
+        selectedIds: effectiveSelectedIds,
+        hoveredItemId: hoveredItemIdRef.current
+      });
+    }, [effectiveSelectedIds]);
     useEffect(() => {
       const r = rendererRef.current;
       if (!r) return;
       r.setPointerEventsNone(interactive);
     }, [interactive]);
+    const clearHoveredItem = useCallback(() => {
+      if (hoveredItemIdRef.current === null) return;
+      hoveredItemIdRef.current = null;
+      syncRendererInteractionState();
+    }, [syncRendererInteractionState]);
+    const updateHoveredItem = useCallback(
+      (clientX, clientY) => {
+        const cam = cameraRef.current;
+        const rect = sceneContainerRef.current?.getBoundingClientRect();
+        if (!cam || !rect) return;
+        const { worldX, worldY } = cam.screenToWorld(
+          clientX - rect.left,
+          clientY - rect.top
+        );
+        const hit = hitTestWorldPoint(resolvedItemsRef.current, worldX, worldY, {
+          lineHitWorld: 10 / cam.zoom,
+          ignoreLocked: true
+        });
+        const next = hit?.id ?? null;
+        if (hoveredItemIdRef.current === next) return;
+        hoveredItemIdRef.current = next;
+        syncRendererInteractionState();
+      },
+      [syncRendererInteractionState]
+    );
+    useEffect(() => {
+      const root = wrapperRef.current;
+      if (!root) return;
+      const move = (e) => updateHoveredItem(e.clientX, e.clientY);
+      root.addEventListener("pointermove", move, { passive: true });
+      root.addEventListener("pointerleave", clearHoveredItem);
+      return () => {
+        root.removeEventListener("pointermove", move);
+        root.removeEventListener("pointerleave", clearHoveredItem);
+      };
+    }, [clearHoveredItem, updateHoveredItem]);
     useEffect(() => {
       if (!eraserActive && laserTrail.length === 0) return;
       const timer = window.setInterval(() => {
@@ -9945,10 +10103,10 @@ var VectorViewport = forwardRef(
               worldX,
               worldY,
               handleRadiusWorld,
-              rot
+              rot,
+              resolveResizeHandlesForItem(selected)
             );
-            const isLinkResizeHandle = hb && getLinkData(selected) ? LINK_CORNER_HANDLES2.has(hb) : Boolean(hb);
-            if (hb && isLinkResizeHandle) {
+            if (hb) {
               const snapRs = bakedSnapshot(selected.id);
               if (!snapRs) return;
               dragStateRef.current = {
@@ -9972,6 +10130,31 @@ var VectorViewport = forwardRef(
             ignoreLocked: true
           });
           if (hit) {
+            const selectModeClickPlacement = !e.shiftKey ? findSelectModeItemClickPlacement(hit, allCustomPlacementsRef.current) : null;
+            if (selectModeClickPlacement) {
+              const isAlreadySelected = cur.includes(hit.id);
+              const moveIds = isAlreadySelected ? [...cur] : [hit.id];
+              const moveSnapshots = {};
+              for (const id of moveIds) {
+                const snap = bakedSnapshot(id);
+                if (snap) {
+                  moveSnapshots[id] = snap;
+                }
+              }
+              dragStateRef.current = {
+                kind: "select-mode-item-click",
+                id: hit.id,
+                startWorld: { x: worldX, y: worldY },
+                startScreen: { x: e.clientX, y: e.clientY },
+                moveIds,
+                moveSnapshots,
+                ...isAlreadySelected ? {} : { selectIdsOnDrag: [hit.id] }
+              };
+              captureInteractionPointer(e.currentTarget, e.pointerId);
+              e.preventDefault();
+              e.stopPropagation();
+              return;
+            }
             if (e.shiftKey) {
               const next = cur.includes(hit.id) ? cur.filter((id) => id !== hit.id) : [...cur, hit.id];
               setEffectiveSelectedIdsRef.current(next);
@@ -10539,6 +10722,21 @@ var VectorViewport = forwardRef(
         const change = onItemsChangeRef.current;
         if (!change) return;
         const { worldX, worldY } = screenToWorld(ev.clientX, ev.clientY);
+        if (st.kind === "select-mode-item-click") {
+          const screenDx = ev.clientX - st.startScreen.x;
+          const screenDy = ev.clientY - st.startScreen.y;
+          if (Math.hypot(screenDx, screenDy) <= TAP_PX) return;
+          if (st.selectIdsOnDrag) {
+            setEffectiveSelectedIdsRef.current(st.selectIdsOnDrag);
+          }
+          dragStateRef.current = {
+            kind: "move",
+            ids: st.moveIds,
+            snapshots: st.moveSnapshots,
+            startWorld: st.startWorld
+          };
+          return;
+        }
         if (st.kind === "move") {
           const dx = worldX - st.startWorld.x;
           const dy = worldY - st.startWorld.y;
@@ -10657,6 +10855,43 @@ var VectorViewport = forwardRef(
           releaseInteractionPointer();
           return;
         }
+        if (st.kind === "select-mode-item-click") {
+          dragStateRef.current = { kind: "idle" };
+          releaseInteractionPointer();
+          if (ev.type === "pointercancel") return;
+          const dx = ev.clientX - st.startScreen.x;
+          const dy = ev.clientY - st.startScreen.y;
+          if (Math.hypot(dx, dy) > TAP_PX) return;
+          const item = itemsRef.current.find((candidate) => candidate.id === st.id) ?? resolvedItemsRef.current.find((candidate) => candidate.id === st.id);
+          if (!item) return;
+          const placement = findSelectModeItemClickPlacement(
+            item,
+            allCustomPlacementsRef.current
+          );
+          const onSelectModeItemClick = placement?.onSelectModeItemClick;
+          if (!onSelectModeItemClick) return;
+          const { worldX, worldY } = screenToWorld(ev.clientX, ev.clientY);
+          onSelectModeItemClick({
+            item,
+            worldX,
+            worldY,
+            clientX: ev.clientX,
+            clientY: ev.clientY,
+            pointerType: ev.pointerType,
+            shiftKey: ev.shiftKey,
+            altKey: ev.altKey,
+            metaKey: ev.metaKey,
+            ctrlKey: ev.ctrlKey,
+            items: itemsRef.current,
+            updateItem: (next) => {
+              onItemsChangeRef.current?.(
+                replaceItem(itemsRef.current, item.id, next)
+              );
+            },
+            setSelectedIds: (ids) => setEffectiveSelectedIdsRef.current(ids)
+          });
+          return;
+        }
         if (st.kind === "marquee") {
           dragStateRef.current = { kind: "idle" };
           releaseInteractionPointer();
@@ -10852,8 +11087,14 @@ var VectorViewport = forwardRef(
           const id = createShapeId();
           const pen = strokeStyleRef.current;
           if (cpUp && st.tool === cpUp.toolId) {
-            change(itemsRef.current.concat(cpUp.createItem({ id, bounds: br })));
-            setEffectiveSelectedIdsRef.current([id]);
+            const item = tagCustomPlacementItem(
+              cpUp.createItem({ id, bounds: br }),
+              cpUp.toolId
+            );
+            change(itemsRef.current.concat(item));
+            if (cpUp.selectAfterCreate !== false) {
+              setEffectiveSelectedIdsRef.current([id]);
+            }
             return;
           }
           if (st.tool === "rect") {