orio-ui 1.20.0 → 1.23.3

package/dist/runtime/components/Canvas/tools/textTool.js

@@ -0,0 +1,99 @@
+import { defineCanvasTool } from "../types.js";
+import TextTooltip from "./tooltips/Text.vue";
+export function textTool(options = {}) {
+  return defineCanvasTool({
+    id: "text",
+    label: "Text",
+    icon: "text",
+    cursor: "text",
+    tooltip: TextTooltip,
+    defaultOptions: {
+      fontSize: 24,
+      fontFamily: "system-ui, sans-serif",
+      color: "#111111",
+      weight: "normal",
+      ...options
+    },
+    onPointerDown(e, api) {
+      const stage = api.stageEl();
+      if (!stage) return;
+      if (e.originalEvent.target?.closest?.(
+        ".canvas-text-editor"
+      )) {
+        return;
+      }
+      const input = document.createElement("input");
+      input.type = "text";
+      input.className = "canvas-text-editor";
+      input.style.position = "absolute";
+      input.style.left = `${e.x}px`;
+      input.style.top = `${e.y}px`;
+      input.style.transform = "translateY(-50%)";
+      input.style.font = `${api.options.weight} ${api.options.fontSize}px ${api.options.fontFamily}`;
+      input.style.color = api.options.color;
+      input.style.background = "transparent";
+      input.style.border = "1px dashed currentColor";
+      input.style.outline = "none";
+      input.style.padding = "0 2px";
+      input.style.minWidth = "1ch";
+      input.style.zIndex = "10";
+      const snapshot = { ...api.options };
+      stage.appendChild(input);
+      requestAnimationFrame(() => input.focus());
+      let committed = false;
+      const commit = () => {
+        if (committed) return;
+        committed = true;
+        const text = input.value;
+        input.remove();
+        if (!text.trim()) return;
+        api.addNode({
+          type: "text",
+          x: e.x,
+          y: e.y,
+          data: {
+            text,
+            fontSize: snapshot.fontSize,
+            fontFamily: snapshot.fontFamily,
+            color: snapshot.color,
+            weight: snapshot.weight
+          }
+        });
+        api.requestRender();
+      };
+      const cancel = () => {
+        if (committed) return;
+        committed = true;
+        input.remove();
+      };
+      input.addEventListener("blur", commit);
+      input.addEventListener("keydown", (ev) => {
+        if (ev.key === "Enter") {
+          ev.preventDefault();
+          input.blur();
+        } else if (ev.key === "Escape") {
+          ev.preventDefault();
+          input.removeEventListener("blur", commit);
+          cancel();
+        }
+      });
+    },
+    hitTest(node, point, radius) {
+      const { text, fontSize } = node.data;
+      if (!text) return false;
+      const estimatedWidth = text.length * fontSize * 0.6;
+      const halfHeight = fontSize / 2;
+      return point.x + radius >= node.x && point.x - radius <= node.x + estimatedWidth && point.y + radius >= node.y - halfHeight && point.y - radius <= node.y + halfHeight;
+    },
+    render(ctx, node) {
+      const { text, fontSize, fontFamily, color, weight } = node.data;
+      if (!text) return;
+      ctx.save();
+      ctx.font = `${weight} ${fontSize}px ${fontFamily}`;
+      ctx.fillStyle = color;
+      ctx.textBaseline = "middle";
+      ctx.fillText(text, node.x, node.y);
+      ctx.restore();
+    }
+  });
+}

package/dist/runtime/components/Canvas/tools/tooltips/Clear.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Clear.vue

@@ -0,0 +1,12 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Clear</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Remove all nodes from the canvas.
+    </orio-view-text>
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:200px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Clear.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Draw.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Draw.vue

@@ -0,0 +1,12 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Draw</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Freehand pen. Click and drag to draw strokes.
+    </orio-view-text>
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:200px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Draw.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Erase.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Erase.vue

@@ -0,0 +1,12 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Eraser</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Drag over elements to remove them. Frozen nodes are protected.
+    </orio-view-text>
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:220px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Erase.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Export.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Export.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Export</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Download the canvas as PNG, JPEG, or WebP. Configure format and filename
+      via the tool's options.
+    </orio-view-text>
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:240px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Export.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Highlight.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Highlight.vue

@@ -0,0 +1,12 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Highlight</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Hover over nodes to inspect their bounding box.
+    </orio-view-text>
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:200px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Highlight.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Image.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Image.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Upload image</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Insert a PNG, JPEG, WebP, GIF, SVG, AVIF, or BMP file. Resize and rotate
+      with the Transform tool.
+    </orio-view-text>
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:240px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Image.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Move.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Move.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Move</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Click and drag to reposition nodes.
+    </orio-view-text>
+    <orio-view-key-binds bind="`]` bring forward · `[` send backward" />
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:220px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Move.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Redo.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Redo.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Redo</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Restore the last undone action.
+    </orio-view-text>
+    <orio-view-key-binds bind="`Ctrl`/`Cmd` + `Shift` + `Z`" />
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:200px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Redo.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Resize.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Resize.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Resize</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Click a node to select, then drag a handle to resize.
+    </orio-view-text>
+    <orio-view-key-binds bind="`Esc` deselect" />
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:220px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Resize.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Rotate.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Rotate.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Rotate</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Click a node to select, then drag the top circle to rotate.
+    </orio-view-text>
+    <orio-view-key-binds bind="`Esc` deselect" />
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:220px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Rotate.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Text.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Text.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Text</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Click anywhere to place text.
+    </orio-view-text>
+    <orio-view-key-binds bind="`Enter` commit · `Esc` cancel" />
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:220px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Text.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Transform.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Transform.vue

@@ -0,0 +1,14 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Transform</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Click a node to select. Drag corners to resize, the top circle to rotate,
+      or the body to move.
+    </orio-view-text>
+    <orio-view-key-binds bind="`Esc` deselect" />
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:220px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Transform.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Undo.d.vue.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/tooltips/Undo.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="tool-tip">
+    <orio-view-text type="title" size="medium">Undo</orio-view-text>
+    <orio-view-text type="subtitle" size="small">
+      Revert the last action.
+    </orio-view-text>
+    <orio-view-key-binds bind="`Ctrl`/`Cmd` + `Z`" />
+  </div>
+</template>
+
+<style scoped>
+.tool-tip{--view-text-color:#fff;display:flex;flex-direction:column;gap:.25rem;max-width:200px;white-space:normal}
+</style>

package/dist/runtime/components/Canvas/tools/tooltips/Undo.vue.d.ts

@@ -0,0 +1,3 @@
+declare const __VLS_export: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+declare const _default: typeof __VLS_export;
+export default _default;

package/dist/runtime/components/Canvas/tools/transformHandles.d.ts

@@ -0,0 +1,74 @@
+import type { CanvasNode, CanvasPoint } from "../types.js";
+export type ResizeHandle = "n" | "s" | "e" | "w" | "nw" | "ne" | "sw" | "se";
+export type Handle = ResizeHandle | "rotate";
+export interface Bounds {
+    x: number;
+    y: number;
+    width: number;
+    height: number;
+}
+export interface HandleStyle {
+    size: number;
+    fill: string;
+    stroke: string;
+    lineWidth: number;
+    rotateOffset: number;
+}
+/** Cursor for each resize handle (CSS values). */
+export declare const HANDLE_CURSORS: Record<ResizeHandle, string>;
+/** Map a resize handle through node rotation so cursors match the visual. */
+export declare function cursorForHandle(handle: Handle, rotation?: number): string;
+/** Resize handle anchor positions in node-local (un-rotated) space. */
+export declare function getResizeHandles(b: Bounds): Record<ResizeHandle, CanvasPoint>;
+/** Rotation handle anchor — sits above the top-center of the bounds. */
+export declare function getRotationHandle(b: Bounds, offset?: number): CanvasPoint;
+/**
+ * Hit-test the handles of a (possibly rotated) node.
+ *
+ * @returns the matched handle name or `null` if the point is outside all handles.
+ */
+export declare function hitHandle(node: CanvasNode, point: CanvasPoint, opts?: {
+    style?: Partial<HandleStyle>;
+    /** Restrict which handles can be hit (e.g. resize-only tools). */
+    handles?: Handle[];
+}): Handle | null;
+/** Render resize handles on a node's bounding rect, applying rotation. */
+export declare function renderResizeHandles(ctx: CanvasRenderingContext2D, node: CanvasNode, opts?: {
+    style?: Partial<HandleStyle>;
+    handles?: ResizeHandle[];
+    hovered?: ResizeHandle | null;
+}): void;
+/** Render rotation handle (line + circle) above the node, applying rotation. */
+export declare function renderRotationHandle(ctx: CanvasRenderingContext2D, node: CanvasNode, opts?: {
+    style?: Partial<HandleStyle>;
+    hovered?: boolean;
+}): void;
+/** Wrap a delta into (-π, π] so multi-turn drags don't jump at atan2's boundary. */
+export declare function normalizeAngleDelta(delta: number): number;
+/**
+ * Compute a node's rotation given a pointer position. The rotation is the
+ * angle from the node's bounds-center to `point`, with 0 meaning the
+ * rotation handle pointing straight up.
+ */
+export declare function rotationFromPoint(node: CanvasNode, point: CanvasPoint): number;
+export interface ResizeContext {
+    /** Node snapshot taken at pointer-down. */
+    original: CanvasNode;
+    /** Bounds of `original`. */
+    originalBounds: Bounds;
+    /** Pointer in canvas-space at pointer-down (already in local coords). */
+    startLocal: CanvasPoint;
+}
+/**
+ * Compute a patch that resizes `ctx.original` so the dragged handle lines up
+ * with the current pointer.
+ *
+ * - For width/height nodes: patches `x`, `y`, `width`, `height`.
+ * - For draw nodes (with `data.points`): scales each point relative to the
+ *   original bounds.
+ * - For text nodes (with `data.fontSize`): uniform scale via `fontSize`,
+ *   only on corner handles.
+ */
+export declare function computeResizePatch(handle: ResizeHandle, pointerLocal: CanvasPoint, ctx: ResizeContext, opts?: {
+    minSize?: number;
+}): Partial<Omit<CanvasNode, "id">> | null;