figmatk 0.3.8 → 0.3.9

package/.claude-plugin/marketplace.json

@@ -13,7 +13,7 @@
     {
       "name": "figmatk",
       "description": "Swiss Army Knife for Figma Files (.deck)",
-      "version": "0.3.8",
+      "version": "0.3.9",
       "author": {
         "name": "FigmaTK Contributors"
       },

package/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "figmatk",
-  "version": "0.3.3",
+  "version": "0.3.9",
   "description": "Create and edit Figma Slides .deck files programmatically — no Figma API required",
   "author": {
     "name": "FigmaTK Contributors"

package/lib/rasterizer/svg-builder.mjs

@@ -500,6 +500,100 @@ function renderLine(deck, node) {
   return `<line x1="${x1}" y1="${y1}" x2="${x2}" y2="${y2}" stroke="${stroke}" stroke-width="${sw}"/>`;
 }
 
+/**
+ * VECTOR — decode fillGeometry/strokeGeometry commandsBlob binary to SVG paths.
+ *
+ * Blob format: [cmdByte][float32LE params...]
+ *   0x01 = moveTo (x, y)
+ *   0x02 = lineTo (x, y)
+ *   0x04 = cubicTo (c1x, c1y, c2x, c2y, x, y)
+ *   0x00 = close
+ *
+ * Coordinates are in node-size space. The full affine transform matrix is used
+ * to position, scale, and rotate the vector in the slide.
+ */
+function renderVector(deck, node) {
+  const t = node.transform ?? {};
+  const m00 = t.m00 ?? 1, m01 = t.m01 ?? 0, m02 = t.m02 ?? 0;
+  const m10 = t.m10 ?? 0, m11 = t.m11 ?? 1, m12 = t.m12 ?? 0;
+  const blobs = deck.message?.blobs;
+  const parts = [];
+
+  // Fill paths
+  const fillColor = resolveFill(getFillPaints(node));
+  if (fillColor && node.fillGeometry?.length && blobs) {
+    for (const geo of node.fillGeometry) {
+      const d = decodeCmdBlob(blobs, geo.commandsBlob);
+      if (!d) continue;
+      const rule = geo.windingRule === 'EVENODD' ? ' fill-rule="evenodd"' : '';
+      parts.push(`<path d="${d}" fill="${fillColor}"${rule}/>`);
+    }
+  }
+
+  // Stroke paths
+  const strokeColor = resolveFill(node.strokePaints);
+  const sw = node.strokeWeight ?? 0;
+  if (strokeColor && sw > 0 && node.strokeGeometry?.length && blobs) {
+    for (const geo of node.strokeGeometry) {
+      const d = decodeCmdBlob(blobs, geo.commandsBlob);
+      if (!d) continue;
+      // strokeGeometry encodes the stroke outline as a fill shape
+      const rule = geo.windingRule === 'EVENODD' ? ' fill-rule="evenodd"' : '';
+      parts.push(`<path d="${d}" fill="${strokeColor}"${rule}/>`);
+    }
+  }
+
+  if (!parts.length) return renderPlaceholder(deck, node);
+  return `<g transform="matrix(${m00},${m10},${m01},${m11},${m02},${m12})">\n${parts.join('\n')}\n</g>`;
+}
+
+/** Decode a commandsBlob index into an SVG path d-string. */
+function decodeCmdBlob(blobs, blobIdx) {
+  if (blobIdx == null || !blobs?.[blobIdx]) return null;
+  const raw = blobs[blobIdx].bytes ?? blobs[blobIdx];
+  if (!raw) return null;
+
+  // Convert indexed object to Buffer if needed
+  let buf;
+  if (Buffer.isBuffer(raw) || raw instanceof Uint8Array) {
+    buf = Buffer.from(raw);
+  } else {
+    const len = Object.keys(raw).length;
+    buf = Buffer.alloc(len);
+    for (let i = 0; i < len; i++) buf[i] = raw[i];
+  }
+
+  const cmds = [];
+  let off = 0;
+  while (off < buf.length) {
+    const cmd = buf[off++];
+    if (cmd === 0x01) { // moveTo
+      const x = buf.readFloatLE(off); off += 4;
+      const y = buf.readFloatLE(off); off += 4;
+      cmds.push(`M${f(x)},${f(y)}`);
+    } else if (cmd === 0x02) { // lineTo
+      const x = buf.readFloatLE(off); off += 4;
+      const y = buf.readFloatLE(off); off += 4;
+      cmds.push(`L${f(x)},${f(y)}`);
+    } else if (cmd === 0x04) { // cubicTo
+      const c1x = buf.readFloatLE(off); off += 4;
+      const c1y = buf.readFloatLE(off); off += 4;
+      const c2x = buf.readFloatLE(off); off += 4;
+      const c2y = buf.readFloatLE(off); off += 4;
+      const x = buf.readFloatLE(off); off += 4;
+      const y = buf.readFloatLE(off); off += 4;
+      cmds.push(`C${f(c1x)},${f(c1y)} ${f(c2x)},${f(c2y)} ${f(x)},${f(y)}`);
+    } else if (cmd === 0x00) { // close
+      cmds.push('Z');
+    } else {
+      break; // unknown command — stop
+    }
+  }
+  return cmds.length ? cmds.join('') : null;
+}
+
+function f(v) { return +v.toFixed(2); }
+
 function renderPlaceholder(deck, node) {
   const { x, y } = pos(node);
   const { w, h } = size(node);
@@ -580,7 +674,7 @@ const RENDERERS = {
   GROUP:             renderGroup,
   SECTION:           renderGroup,
   BOOLEAN_OPERATION: renderGroup,
-  VECTOR:            renderPlaceholder,
+  VECTOR:            renderVector,
   LINE:              renderLine,
   STAR:              renderPlaceholder,
   POLYGON:           renderPlaceholder,

package/manifest.json

@@ -1,7 +1,7 @@
 {
   "manifest_version": "0.2",
   "name": "figmatk",
-  "version": "0.3.3",
+  "version": "0.3.9",
   "description": "Create and edit Figma Slides .deck files programmatically - no Figma API required",
   "author": {
     "name": "FigmaTK Contributors"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "figmatk",
-  "version": "0.3.8",
+  "version": "0.3.9",
   "description": "Figma Toolkit — Swiss-army knife CLI for Figma .deck and .fig files",
   "type": "module",
   "bin": {

package/skills/figma-slides-creator/SKILL.md

@@ -6,7 +6,7 @@ description: >
   clone or remove slides, or produce a .deck file for Figma Slides.
   Powered by FigmaTK under the hood.
 metadata:
-  version: "0.3.8"
+  version: "0.3.9"
 ---
 
 # FigmaTK Skill

package/skills/figma-template-builder/SKILL.md

@@ -6,7 +6,7 @@ description: >
   template from an existing deck, define reusable layouts, mark editable
   text/image slots, or prepare a draft template for later instantiation.
 metadata:
-  version: "0.3.8"
+  version: "0.3.9"
 ---
 
 # Figma Template Builder