Fixed line nodes (#96)

* fixed line nodes * fixed line nodes * changeset * changeset * Update .changeset/new-spiders-travel.md Co-authored-by: Jordi Sala Morales <jordism91@gmail.com> --------- Co-authored-by: Jordi Sala Morales <jordism91@gmail.com>
penpot · May 10, 2024 · 9355f28 · 9355f28
1 parent f5a8b9c
commit 9355f28
Show file tree

Hide file tree

Showing 4 changed files with 37 additions and 2 deletions.
diff --git a/.changeset/many-lamps-stare.md b/.changeset/many-lamps-stare.md
@@ -0,0 +1,5 @@
+---
+"penpot-exporter": patch
+---
+
+Fixed correct size for line nodes
diff --git a/.changeset/new-spiders-travel.md b/.changeset/new-spiders-travel.md
@@ -0,0 +1,5 @@
+---
+"penpot-exporter": patch
+---
+
+Fixed line node export when using opacity 0 on the line
diff --git a/plugin-src/transformers/partials/transformVectorPaths.ts b/plugin-src/transformers/partials/transformVectorPaths.ts
@@ -1,4 +1,4 @@
-import { translateVectorPaths } from '@plugin/translators';
+import { createLineGeometry, translateVectorPaths } from '@plugin/translators';
 
 import { PathAttributes } from '@ui/lib/types/shapes/pathShape';
 
@@ -10,7 +10,7 @@ const getVectorPaths = (node: VectorNode | StarNode | LineNode | PolygonNode): V
     case 'VECTOR':
       return node.vectorPaths;
     case 'LINE':
-      return node.strokeGeometry;
+      return createLineGeometry(node);
   }
 };
 

diff --git a/plugin-src/translators/translateVectorPaths.ts b/plugin-src/translators/translateVectorPaths.ts
@@ -16,6 +16,31 @@ export const translateVectorPaths = (
   return segments;
 };
 
+export const createLineGeometry = (node: LineNode): VectorPaths => {
+  const commands: (MoveToCommand | LineToCommand)[] = [];
+
+  commands.push({
+    command: 'moveto',
+    code: 'M',
+    x: 0,
+    y: 0
+  });
+
+  commands.push({
+    command: 'lineto',
+    code: 'L',
+    x: node.width,
+    y: node.height
+  });
+
+  return [
+    {
+      windingRule: 'NONZERO',
+      data: commands.map(({ code, x, y }) => `${code} ${x} ${y}`).join(' ') + ' Z'
+    }
+  ];
+};
+
 const translateVectorPath = (path: VectorPath, baseX: number, baseY: number): Segment[] => {
   const normalizedPaths = parseSVG(path.data);