@vanduo-oss/vd3-cbun 1.3.1 → 1.3.2

package/CHANGELOG.md

@@ -4,6 +4,19 @@ All notable changes to `@vanduo-oss/vd3-cbun` are documented here. This file
 tracks the PACKAGE only — never docs-site content. Per-component VERSION
 constants are listed alongside each bundle release.
 
+## 1.3.2 — 2026-08-13
+
+**draw** — line shapes accept an optional `smooth` boolean; when true and there
+are 3+ points, `pointsToPath` emits Catmull-Rom cubics so dense AI polylines
+read as real curves. Interactive two-point lines stay sharp (`smooth` defaults
+false). The `VdDraw` template ref now exposes `addShape`, `updateShape`,
+`removeShape`, `getShape`, `getShapes`, `clear`, `load`, and `toJSON` (the core
+already had these; the wrapper previously omitted them). Additive and
+backward-compatible — a missing `smooth` loads as false — so `VD_DRAW_VERSION`
+stays `1.1.0`. Also non-runtime: pnpm audit overrides (`postcss`,
+`brace-expansion`, `nanoid`, `undici`) kept on the Node 20 engines major, and
+jsdom 30 so the undici override stays compatible.
+
 ## 1.3.1 — 2026-08-02
 
 **flowchart** — CSS token mixes no longer blend toward fixed light cream/white

package/README.md

@@ -8,11 +8,12 @@ tree-shakeable subpath exports. It replaces the four per-repo publishes
 (`@vanduo-oss/charts`, `@vanduo-oss/flowchart`, `@vanduo-oss/hex-grid`,
 `@vanduo-oss/music-player`) of the old line.
 
-**Status: 1.3.1.** Six Vue3-only component families — charts, code-editor, draw,
+**Status: 1.3.2.** Six Vue3-only component families — charts, code-editor, draw,
 flowchart, hex-grid, music-player — each on its own tree-shakeable subpath, with
 the esbuild metafile isolation guard in place. (1.3.0 adds chart mark-click
 emits + bounded draw/flowchart deserialization; 1.3.1 dark-aware flowchart
-chrome, icon toolbar, and short-parent sizing; see the
+chrome, icon toolbar, and short-parent sizing; 1.3.2 Catmull-Rom smooth lines
+and Vue shape CRUD on `VdDraw`; see the
 [changelog](./CHANGELOG.md).)
 
 ## Install

package/dist/draw/core.d.ts

@@ -60,6 +60,8 @@ export interface DrawShape {
   text?: string;
   arrowStart?: boolean;
   arrowEnd?: boolean;
+  /** When true, line.points render as a Catmull-Rom cubic path instead of a polyline. */
+  smooth?: boolean;
   groupId?: string;
 }
 
@@ -175,6 +177,7 @@ export class VdDraw {
 
   // Shapes
   getShape(id: string): DrawShape | null;
+  getShapes(): DrawShape[];
   addShape(partial?: Partial<DrawShape>): DrawShape;
   updateShape(
     id: string,

package/dist/draw/index.cjs

@@ -247,8 +247,31 @@ function resizeHandlePositions(bounds) {
     { key: "w", x, y: my }
   ];
 }
-function pointsToPath(points) {
+function pointsToCatmullRomPath(points) {
+  const pts = points.map((p) => [Number(p[0]), Number(p[1])]);
+  if (pts.length < 3) {
+    const [first, ...rest] = pts;
+    let d2 = `M ${round(first[0])} ${round(first[1])}`;
+    for (const [px, py] of rest) d2 += ` L ${round(px)} ${round(py)}`;
+    return d2;
+  }
+  let d = `M ${round(pts[0][0])} ${round(pts[0][1])}`;
+  for (let i = 0; i < pts.length - 1; i += 1) {
+    const p0 = pts[i === 0 ? i : i - 1];
+    const p1 = pts[i];
+    const p2 = pts[i + 1];
+    const p3 = pts[i + 2 < pts.length ? i + 2 : i + 1];
+    const c1x = p1[0] + (p2[0] - p0[0]) / 6;
+    const c1y = p1[1] + (p2[1] - p0[1]) / 6;
+    const c2x = p2[0] - (p3[0] - p1[0]) / 6;
+    const c2y = p2[1] - (p3[1] - p1[1]) / 6;
+    d += ` C ${round(c1x)} ${round(c1y)} ${round(c2x)} ${round(c2y)} ${round(p2[0])} ${round(p2[1])}`;
+  }
+  return d;
+}
+function pointsToPath(points, options = {}) {
   if (!points || !points.length) return "";
+  if (options.smooth && points.length >= 3) return pointsToCatmullRomPath(points);
   const [first, ...rest] = points;
   let d = `M ${round(first[0])} ${round(first[1])}`;
   for (const [px, py] of rest) d += ` L ${round(px)} ${round(py)}`;
@@ -427,7 +450,8 @@ function normalizeShape(raw, usedIds) {
       ...base,
       points,
       arrowStart: Boolean(raw.arrowStart),
-      arrowEnd: raw.arrowEnd == null ? true : Boolean(raw.arrowEnd)
+      arrowEnd: raw.arrowEnd == null ? true : Boolean(raw.arrowEnd),
+      smooth: Boolean(raw.smooth)
     };
   }
   const shape = {
@@ -1052,6 +1076,9 @@ var VdDraw = class {
   getShape(id) {
     return this.documentData.shapes.find((s) => s.id === id) || null;
   }
+  getShapes() {
+    return this.documentData.shapes.map((s) => deepClone(s));
+  }
   addShape(partial = {}) {
     const type = DRAW_SHAPE_TYPES.includes(partial.type) ? partial.type : "rectangle";
     const s = this.style;
@@ -1077,7 +1104,9 @@ var VdDraw = class {
         strokeWidth: partial.strokeWidth == null ? this._shapeStrokeWidth() : partial.strokeWidth,
         opacity: partial.opacity == null ? s.opacity : partial.opacity,
         arrowStart: Boolean(partial.arrowStart),
-        arrowEnd: partial.arrowEnd == null ? true : Boolean(partial.arrowEnd)
+        arrowEnd: partial.arrowEnd == null ? true : Boolean(partial.arrowEnd),
+        // AI-authored multi-point curves set smooth:true; interactive 2-pt lines stay sharp.
+        smooth: partial.smooth == null ? false : Boolean(partial.smooth)
       };
     } else {
       shape = {
@@ -2030,7 +2059,9 @@ var VdDraw = class {
       this._applyShapeStroke(el, shape, standalone, colors);
       setOpacity(el);
     } else if (shape.type === "line") {
-      el = createSvgEl("path", { d: pointsToPath(shape.points) });
+      el = createSvgEl("path", {
+        d: pointsToPath(shape.points, { smooth: Boolean(shape.smooth) })
+      });
       el.classList.add("vd-draw-shape");
       this._applyShapeStroke(el, shape, standalone, colors);
       setOpacity(el);
@@ -2240,7 +2271,15 @@ var VdDraw2 = (0, import_vue.defineComponent)({
       canUndo: () => Boolean(instance?.canUndo()),
       canRedo: () => Boolean(instance?.canRedo()),
       toSVG: () => instance?.toSVG(),
-      toPNG: (options) => instance?.toPNG(options)
+      toPNG: (options) => instance?.toPNG(options),
+      addShape: (partial) => instance?.addShape(partial),
+      updateShape: (id, patch, options) => instance?.updateShape(id, patch, options),
+      removeShape: (id) => instance?.removeShape(id),
+      getShape: (id) => instance?.getShape(id),
+      getShapes: () => instance?.getShapes(),
+      clear: () => instance?.clear(),
+      load: (data) => instance?.load(data),
+      toJSON: () => instance?.toJSON()
     });
     return () => (0, import_vue.h)("div", { ref: el, class: "vd-draw" });
   }