@pixerate/editor 0.133.0 → 0.134.0

package/dist/vector/index.js

@@ -43,7 +43,7 @@ import {
   reverseMorphContour,
   subpathToMorphContour,
   turnMorphContour
-} from "../chunk-VGZSIXX3.js";
+} from "../chunk-7RJ6P7MI.js";
 import {
   DEFAULT_VECTOR_FONT,
   IDENTITY_MATRIX,
@@ -208,6 +208,7 @@ import {
   isVectorMaskActive,
   isVectorMaskGroup,
   isVectorMaskType,
+  isVectorMasterPage,
   isVectorMeshGradient,
   isVectorShadedPaint,
   isVectorSymmetryGroup,
@@ -273,6 +274,7 @@ import {
   rerouteVectorConnectors,
   resizeWarpMesh,
   resolveVectorLenses,
+  resolveVectorMasterPages,
   resolveVectorSymbols,
   reverseSubpath,
   reverseVectorGradient,
@@ -319,6 +321,7 @@ import {
   splitWarpMeshV,
   starSubpath,
   stripVectorLensViews,
+  stripVectorMasterArt,
   stripVectorSymbolArt,
   strokePositionPoint,
   strokeWidthProfileOf,
@@ -413,6 +416,8 @@ import {
   vectorMaskedGeometry,
   vectorMaskedLocalBounds,
   vectorMaskedShapes,
+  vectorMasterArt,
+  vectorMasterPages,
   vectorMeshColorAt,
   vectorMeshFromOutline,
   vectorMeshLines,
@@ -427,6 +432,7 @@ import {
   vectorNodeToBezier,
   vectorNodesNear,
   vectorOperandOperation,
+  vectorPages,
   vectorPaintLayerNodes,
   vectorPaintSolid,
   vectorPaintToSvg,
@@ -495,7 +501,7 @@ import {
   withVectorStrokes,
   withVectorTargetPaint,
   zigzagPaths
-} from "../chunk-FOBB6AIO.js";
+} from "../chunk-HHTCDFZC.js";
 import {
   bezierPathBounds,
   bezierPathToSvg,
@@ -2437,7 +2443,7 @@ var lensResolved = /* @__PURE__ */ new WeakMap();
 function resolvedLensNodes(doc) {
   const hit = lensResolved.get(doc.nodes);
   if (hit) return hit;
-  const nodes = resolveVectorLenses(doc).nodes;
+  const nodes = resolveVectorLenses(resolveVectorMasterPages(doc)).nodes;
   lensResolved.set(doc.nodes, nodes);
   return nodes;
 }
@@ -3678,10 +3684,10 @@ ${offset}
 var pdfString = (s) => `(${s.replace(/[\\()]/g, (c) => `\\${c}`).replace(/[^\x20-\x7e]/g, "?")})`;
 function vectorDocumentToPdf(doc, options = {}) {
   const notes = /* @__PURE__ */ new Set();
-  doc = resolveVectorLenses(doc);
+  doc = resolveVectorLenses(resolveVectorMasterPages(doc));
   const scale = options.scale ?? 1;
   const compress = options.compress !== false;
-  const frames = options.pages === "artboards" ? vectorArtboards(doc) : [];
+  const frames = options.pages === "artboards" ? vectorPages(doc) : [];
   if (options.pages === "artboards" && !frames.length) notes.add("There are no artboards (top-level frames): the whole drawing is one page.");
   const docs = frames.length ? frames.map((f) => vectorFrameDocument(doc, f.id, findVectorNode)) : [doc];
   const w = new PdfWriter();
@@ -3948,7 +3954,7 @@ function vectorDocumentToLottie(doc, options = {}) {
   const fps = options.fps ?? 30;
   const op = Math.max(1, Math.round(options.frames ?? 1));
   const shapes = [];
-  if (!options.nodes) doc = resolveVectorLenses(doc);
+  if (!options.nodes) doc = resolveVectorLenses(resolveVectorMasterPages(doc));
   for (const n2 of [...options.nodes ?? doc.nodes].reverse()) {
     const g = nodeGroup(n2, notes);
     if (g) shapes.push(g);
@@ -7147,7 +7153,7 @@ var VectorEditorController = class _VectorEditorController {
       out = { ...out, symbols: out.symbols.map((s) => s.id === edit.symbolId ? { ...s, nodes: out.nodes } : s) };
     }
     out = resolveVectorSymbols(out);
-    return resolveVectorLenses(rerouteVectorConnectors(this.solved(out)));
+    return resolveVectorLenses(resolveVectorMasterPages(rerouteVectorConnectors(this.solved(out))));
   }
   /**
    * `doc` with its constraints solved (geometry edited since the last solve moving least) and
@@ -7641,7 +7647,7 @@ var VectorEditorController = class _VectorEditorController {
     return vectorDocumentToSvg(this.storedDocument(), options);
   }
   toJSON() {
-    return cloneVectorDocument(stripVectorLensViews(stripVectorSymbolArt(this.storedDocument())));
+    return cloneVectorDocument(stripVectorMasterArt(stripVectorLensViews(stripVectorSymbolArt(this.storedDocument()))));
   }
   /** Adds a node (ids are kept unless taken). Returns its id. */
   addNode(node, options = {}) {
@@ -10559,6 +10565,146 @@ var VectorEditorController = class _VectorEditorController {
     });
     return { ok: true, id };
   }
+  // -----------------------------------------------------------------------------------------
+  // Pages and master pages
+  /**
+   * The document's pages (top-level frames that are not master pages, in order: `number` from 1)
+   * with the master each uses, and its master pages.
+   */
+  getPages() {
+    const pages = vectorPages(this.doc);
+    const masters = vectorMasterPages(this.doc);
+    const box = (f) => ({ x: f.frame.x, y: f.frame.y, width: f.frame.width, height: f.frame.height });
+    return {
+      pages: pages.map((p, i) => ({ id: p.id, name: p.name ?? `Page ${i + 1}`, number: i + 1, masterId: p.frame.masterId && masters.some((m) => m.id === p.frame.masterId) ? p.frame.masterId : null, bounds: box(p) })),
+      masters: masters.map((m) => ({ id: m.id, name: m.name ?? "Master", usedBy: pages.filter((p) => p.frame.masterId === m.id).map((p) => p.id), bounds: box(m) }))
+    };
+  }
+  /** Where a new page or master goes: right of every top-level frame, or below them for a master. */
+  nextPageRect(master) {
+    const frames = this.doc.nodes.filter(isVectorFrame);
+    const pages = vectorPages(this.doc);
+    const like = pages[pages.length - 1]?.frame ?? frames[frames.length - 1]?.frame;
+    const width = like?.width ?? this.doc.width;
+    const height = like?.height ?? this.doc.height;
+    if (!frames.length) return { x: 0, y: 0, width, height };
+    const gap = Math.max(20, Math.round(width * 0.1));
+    if (master) {
+      const bottom = Math.max(...frames.map((f) => f.frame.y + f.frame.height));
+      const left = Math.min(...frames.map((f) => f.frame.x));
+      return { x: left, y: bottom + gap * 2, width, height };
+    }
+    const right = Math.max(...pages.map((f) => f.frame.x + f.frame.width), ...pages.length ? [] : frames.map((f) => f.frame.x + f.frame.width));
+    const top = pages.length ? Math.min(...pages.map((f) => f.frame.y)) : Math.min(...frames.map((f) => f.frame.y));
+    return { x: right + gap, y: top, width, height };
+  }
+  /**
+   * Adds a page: a frame the size of the last page (or the document), to the right of the others,
+   * after page `after` in the page order (default last), using master page `masterId` (default:
+   * the master the last page uses). The first page added to a document without frames covers the
+   * artboard and takes the existing top-level art in. One undo step; selects it. Returns its id.
+   */
+  addPage(input = {}) {
+    const pages = vectorPages(this.doc);
+    if (input.masterId && !isVectorMasterPage(this.doc.nodes.find((n2) => n2.id === input.masterId))) return { ok: false, message: `"${input.masterId}" is not a master page (add one with vector.addMasterPage).` };
+    if (input.after !== void 0 && !pages.some((p) => p.id === input.after)) return { ok: false, message: `"${input.after}" is not a page.` };
+    const first = !this.doc.nodes.some(isVectorFrame);
+    const rect = this.nextPageRect(false);
+    const id = this.newId();
+    const masterId = input.masterId === void 0 ? pages[pages.length - 1]?.frame.masterId ?? null : input.masterId;
+    const adopted = first ? this.doc.nodes.filter((n2) => !n2.locked && n2.visible !== false && !n2.blendStep) : [];
+    const page = {
+      id,
+      type: "group",
+      name: input.name ?? `Page ${pages.length + 1}`,
+      frame: { ...rect, fill: "#ffffff", ...masterId ? { masterId } : {} },
+      children: adopted
+    };
+    const taken = new Set(adopted.map((n2) => n2.id));
+    this.change("Add Page", () => {
+      const rest = this.doc.nodes.filter((n2) => !taken.has(n2.id));
+      const at = input.after ? rest.findIndex((n2) => n2.id === input.after) + 1 : rest.length;
+      this.setDoc([...rest.slice(0, at), page, ...rest.slice(at)]);
+      this.selection = [id];
+      this.anchors = [];
+      this.editingId = null;
+    });
+    return { ok: true, id };
+  }
+  /**
+   * Adds an empty master page (a frame with `master` set, the size of the last page) below the
+   * pages. Art drawn in it shows on every page that uses it; text can show `{page}` and `{pages}`.
+   * With `assignTo` (page ids, or `all`), those pages use it. One undo step; selects it.
+   */
+  addMasterPage(input = {}) {
+    const pages = vectorPages(this.doc);
+    const assign = input.assignTo === "all" ? pages.map((p) => p.id) : input.assignTo ?? [];
+    for (const pid of assign) if (!pages.some((p) => p.id === pid)) return { ok: false, message: `"${pid}" is not a page.` };
+    const rect = this.nextPageRect(true);
+    const id = this.newId();
+    const master = { id, type: "group", name: input.name ?? `Master ${String.fromCharCode(65 + vectorMasterPages(this.doc).length % 26)}`, frame: { ...rect, master: true }, children: [] };
+    const set = new Set(assign);
+    this.change("Add Master Page", () => {
+      this.setDoc([...this.doc.nodes.map((n2) => set.has(n2.id) && isVectorFrame(n2) ? { ...n2, frame: { ...n2.frame, masterId: id } } : n2), master]);
+      this.selection = [id];
+      this.anchors = [];
+      this.editingId = null;
+    });
+    return { ok: true, id };
+  }
+  /** Makes pages use master page `masterId`, or none with null. One undo step. */
+  setPageMaster(masterId, options = {}) {
+    const pages = vectorPages(this.doc);
+    const ids = options.ids ?? this.selection.filter((id) => pages.some((p) => p.id === id));
+    if (!ids.length) return { ok: false, message: "Select a page (a top-level frame) first." };
+    for (const id of ids) if (!pages.some((p) => p.id === id)) return { ok: false, message: `"${id}" is not a page${isVectorMasterPage(this.getNode(id)) ? " (it is a master page)" : ""}.` };
+    if (masterId !== null && !isVectorMasterPage(this.doc.nodes.find((n2) => n2.id === masterId))) return { ok: false, message: `"${masterId}" is not a master page.` };
+    const set = new Set(ids);
+    this.change(masterId ? "Apply Master Page" : "Remove Master Page", () => {
+      this.setDoc(
+        this.doc.nodes.map((n2) => {
+          if (!set.has(n2.id) || !isVectorFrame(n2)) return n2;
+          const { masterId: _m, ...frame } = n2.frame;
+          return { ...n2, frame: masterId ? { ...frame, masterId } : frame };
+        })
+      );
+    });
+    return { ok: true, ids: [...ids] };
+  }
+  /** Moves page `id` to position `index` (0-based) in the page order. One undo step. Returns the new order. */
+  movePage(id, index) {
+    const pages = vectorPages(this.doc);
+    const from = pages.findIndex((p) => p.id === id);
+    if (from < 0) return { ok: false, message: `"${id}" is not a page.` };
+    if (!Number.isInteger(index) || index < 0 || index >= pages.length) return { ok: false, message: `index must be from 0 to ${pages.length - 1}.` };
+    if (index === from) return { ok: true, order: pages.map((p) => p.id) };
+    const order = pages.map((p) => p.id);
+    order.splice(index, 0, ...order.splice(from, 1));
+    const slots = this.doc.nodes.map((n2, i) => pages.some((p) => p.id === n2.id) ? i : -1).filter((i) => i >= 0);
+    const byId = new Map(pages.map((p) => [p.id, p]));
+    this.change("Move Page", () => {
+      const nodes = this.doc.nodes.slice();
+      slots.forEach((slot, k) => nodes[slot] = byId.get(order[k]));
+      this.setDoc(nodes);
+    });
+    return { ok: true, order };
+  }
+  /**
+   * Goes to a page (or master page): selects it and brings it into view, fitted to a canvas of
+   * `size` screen pixels when given, otherwise at the current zoom with its corner near the
+   * canvas's top-left. Not an undo step.
+   */
+  goToPage(id, options = {}) {
+    const n2 = this.doc.nodes.find((x) => x.id === id);
+    if (!isVectorFrame(n2)) return { ok: false, message: `"${id}" is not a page or master page.` };
+    const b = vectorNodeBounds(n2) ?? { x: n2.frame.x, y: n2.frame.y, width: n2.frame.width, height: n2.frame.height };
+    this.selection = [id];
+    this.anchors = [];
+    if (options.size) this.zoomToFit(options.size, { bounds: b });
+    else this.setViewport({ x: 40 - b.x * this.viewport.zoom, y: 40 - b.y * this.viewport.zoom });
+    this.notify();
+    return { ok: true };
+  }
   /**
    * Frame Selection: puts the selected (or given) objects, which must share a parent, into a new
    * frame fitted to their bounds plus `padding` (document units, default 0), in their place in the
@@ -14883,7 +15029,8 @@ function createVectorCommands(controller, options = {}) {
           name: { type: "string", description: "Layer name (default the text's start)." },
           fill: PAINT,
           stroke: PAINT,
-          strokeWidth: { type: "number", minimum: 0, description: "Stroke width (default 1)." }
+          strokeWidth: { type: "number", minimum: 0, description: "Stroke width (default 1)." },
+          parentId: { type: "string", description: "A group (frame, master page, symmetry group) to add it into, on top of its children (default: the top of the document). On a master page, {page} and {pages} show each page's number and the page count." }
         },
         required: ["text"],
         additionalProperties: false
@@ -14903,7 +15050,7 @@ function createVectorCommands(controller, options = {}) {
             ...params.paragraph ? { paragraph: params.paragraph } : {},
             ...params.fill !== void 0 ? { fill: checkPaint(params.fill, "fill") } : {},
             ...params.stroke !== void 0 ? { stroke: checkPaint(params.stroke, "stroke") } : {}
-          });
+          }, parentOf(params.parentId));
         } catch (e) {
           fail(e instanceof Error ? e.message : String(e));
         }
@@ -15975,6 +16122,109 @@ function createVectorCommands(controller, options = {}) {
   ];
   const frameResult = (id) => controller.getFrames().find((f) => f.id === id) ?? fail(`"${id}" is not a frame.`);
   const FRAME_PAINT = { ...PAINT, description: `The frame's background, drawn below its children. ${PAINT.description}` };
+  const pagesResult = () => controller.getPages();
+  const pageCommands = () => [
+    {
+      ...base,
+      id: `${prefix}listPages`,
+      label: "Pages",
+      keywords: ["pages", "master page", "multipage", "page numbers", "document pages"],
+      description: "Lists the document's pages (top-level frames that are not master pages, in order) and its master pages: { pages: [{ id, name, number, masterId, bounds }], masters: [{ id, name, usedBy, bounds }] }. Place master art inside the master bounds.",
+      params: { type: "object", properties: {}, additionalProperties: false },
+      run: () => pagesResult()
+    },
+    {
+      ...base,
+      id: `${prefix}addPage`,
+      label: "Add Page",
+      keywords: ["page", "add page", "new page", "insert page", "multipage"],
+      description: "Adds a page: a frame the size of the last page (or the document) right of the others, after page `after` (default last), using master `masterId` (default: the last page's master; null for none). The first page of a document without frames covers the artboard and takes its art in. Add art to it with parentId. One undo step. Returns { id } and the pages.",
+      params: {
+        type: "object",
+        properties: {
+          name: { type: "string", description: 'Page name (default "Page n").' },
+          masterId: { type: ["string", "null"], description: "Master page id, or null for none (default: the last page's master)." },
+          after: { type: "string", description: "Page id to insert after (default: at the end)." }
+        },
+        additionalProperties: false
+      },
+      undoable: true,
+      run: (_ctx, params) => {
+        const r = controller.addPage(params ?? {});
+        check(r);
+        return { id: r.id, ...pagesResult() };
+      }
+    },
+    {
+      ...base,
+      id: `${prefix}addMasterPage`,
+      label: "Add Master Page",
+      keywords: ["master page", "template page", "header", "footer", "page numbers"],
+      description: 'Adds an empty master page (a frame below the pages, not a page itself). Art added to it (parentId: its id) shows on every page using it, laid out by each object\'s resizing constraints; text there can show {page} and {pages}. `assignTo` page ids or "all" make pages use it. One undo step. Returns { id } and the pages.',
+      params: {
+        type: "object",
+        properties: {
+          name: { type: "string", description: 'Master name (default "Master A", "Master B", \u2026).' },
+          assignTo: { anyOf: [{ type: "string", enum: ["all"] }, { ...IDS }], description: 'Pages that use it: "all" or page ids (default none).' }
+        },
+        additionalProperties: false
+      },
+      undoable: true,
+      run: (_ctx, params) => {
+        const r = controller.addMasterPage(params ?? {});
+        check(r);
+        return { id: r.id, ...pagesResult() };
+      }
+    },
+    {
+      ...base,
+      id: `${prefix}setPageMaster`,
+      label: "Apply Master Page",
+      keywords: ["master page", "apply master", "page template"],
+      description: "Makes pages (`ids`, default the selected pages) use master page `masterId`, or none with null. One undo step. Returns the pages.",
+      params: { type: "object", properties: { ids: { ...IDS, description: "Page ids (default: the selected pages)." }, masterId: { type: ["string", "null"], description: "Master page id, or null for none." } }, required: ["masterId"], additionalProperties: false },
+      undoable: true,
+      run: (_ctx, params) => {
+        check(controller.setPageMaster(params.masterId, params.ids ? { ids: params.ids } : {}));
+        return pagesResult();
+      }
+    },
+    {
+      ...base,
+      id: `${prefix}movePage`,
+      label: "Move Page",
+      keywords: ["page order", "reorder pages", "move page"],
+      description: "Moves page `id` to position `index` (0-based) in the page order; page numbers follow. One undo step. Returns the pages.",
+      params: { type: "object", properties: { id: { type: "string", description: "The page." }, index: { type: "integer", minimum: 0, description: "New position, 0 for first." } }, required: ["id", "index"], additionalProperties: false },
+      undoable: true,
+      run: (_ctx, params) => {
+        check(controller.movePage(params.id, params.index));
+        return pagesResult();
+      }
+    },
+    {
+      ...base,
+      id: `${prefix}goToPage`,
+      label: "Go to Page",
+      keywords: ["go to page", "navigate", "show page", "zoom to page"],
+      description: "Selects a page or master page and brings it into view for the user (fitted when the canvas size is given). Not an undo step. Returns { id }.",
+      params: {
+        type: "object",
+        properties: {
+          id: { type: "string", description: "Page or master page id." },
+          canvasWidth: { type: "number", exclusiveMinimum: 0, description: "Canvas width in screen pixels, to fit the page (optional)." },
+          canvasHeight: { type: "number", exclusiveMinimum: 0, description: "Canvas height in screen pixels, to fit the page (optional)." }
+        },
+        required: ["id"],
+        additionalProperties: false
+      },
+      run: (_ctx, params) => {
+        const size = params.canvasWidth && params.canvasHeight ? { width: params.canvasWidth, height: params.canvasHeight } : void 0;
+        check(controller.goToPage(params.id, size ? { size } : {}));
+        return { id: params.id };
+      }
+    }
+  ];
   const frameCommands = () => [
     {
       ...base,
@@ -16324,6 +16574,7 @@ function createVectorCommands(controller, options = {}) {
     ...symbolCommands(),
     ...constraintCommands(),
     ...frameCommands(),
+    ...pageCommands(),
     ...connectorCommands(),
     ...trackingCommands(),
     ...shadingCommands(),
@@ -17579,6 +17830,7 @@ export {
   isVectorMaskActive,
   isVectorMaskGroup,
   isVectorMaskType,
+  isVectorMasterPage,
   isVectorMeshGradient,
   isVectorShadedPaint,
   isVectorSymmetryGroup,
@@ -17666,6 +17918,7 @@ export {
   resizeWarpMesh as resizeVectorMesh,
   resolveVectorBlendOptions,
   resolveVectorLenses,
+  resolveVectorMasterPages,
   resolveVectorSymbols,
   reverseMorphContour,
   reverseSubpath,
@@ -17719,6 +17972,7 @@ export {
   splitWarpMeshV as splitVectorMeshV,
   starSubpath,
   stripVectorLensViews,
+  stripVectorMasterArt,
   stripVectorSymbolArt,
   strokePositionPoint,
   strokeWidthProfileOf,
@@ -17851,6 +18105,8 @@ export {
   vectorMaskedGeometry,
   vectorMaskedLocalBounds,
   vectorMaskedShapes,
+  vectorMasterArt,
+  vectorMasterPages,
   vectorMeshColorAt,
   warpMeshColumns as vectorMeshColumns,
   warpMeshControlBounds as vectorMeshControlBounds,
@@ -17871,6 +18127,7 @@ export {
   vectorNodeToBezier,
   vectorNodesNear,
   vectorOperandOperation,
+  vectorPages,
   vectorPaintLayerNodes,
   vectorPaintSolid,
   vectorPaintSwatch,