From 35d9d47e2afb0fa3db09a51803de5549230ba2c4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alex=20S=C3=A1nchez?= <sion333@gmail.com>
Date: Mon, 27 May 2024 13:04:42 +0200
Subject: [PATCH] fix frames fills and blendModes (#118)

---
 .changeset/serious-wolves-help.md         |  5 +++++
 ui-src/converters/createPenpotArtboard.ts |  9 +++++++--
 ui-src/lib/types/shapes/frameShape.ts     | 11 ++++++-----
 3 files changed, 18 insertions(+), 7 deletions(-)
 create mode 100644 .changeset/serious-wolves-help.md

diff --git a/.changeset/serious-wolves-help.md b/.changeset/serious-wolves-help.md
new file mode 100644
index 0000000..28189a1
--- /dev/null
+++ b/.changeset/serious-wolves-help.md
@@ -0,0 +1,5 @@
+---
+"penpot-exporter": patch
+---
+
+Fix frames fills and blendModes
diff --git a/ui-src/converters/createPenpotArtboard.ts b/ui-src/converters/createPenpotArtboard.ts
index 7324fa9..f3b073f 100644
--- a/ui-src/converters/createPenpotArtboard.ts
+++ b/ui-src/converters/createPenpotArtboard.ts
@@ -1,13 +1,18 @@
 import { PenpotFile } from '@ui/lib/types/penpotFile';
 import { FrameShape } from '@ui/lib/types/shapes/frameShape';
+import { translateFillGradients, translateUiBlendMode } from '@ui/translators';
 
 import { createPenpotItem } from '.';
 
 export const createPenpotArtboard = (
   file: PenpotFile,
-  { type, children = [], ...rest }: FrameShape
+  { type, fills, blendMode, children = [], ...rest }: FrameShape
 ) => {
-  file.addArtboard(rest);
+  file.addArtboard({
+    fills: translateFillGradients(fills),
+    blendMode: translateUiBlendMode(blendMode),
+    ...rest
+  });
 
   for (const child of children) {
     createPenpotItem(file, child);
diff --git a/ui-src/lib/types/shapes/frameShape.ts b/ui-src/lib/types/shapes/frameShape.ts
index 1ff82bb..418c7be 100644
--- a/ui-src/lib/types/shapes/frameShape.ts
+++ b/ui-src/lib/types/shapes/frameShape.ts
@@ -1,11 +1,14 @@
 import { LayoutAttributes, LayoutChildAttributes } from '@ui/lib/types/shapes/layout';
-import { ShapeBaseAttributes, ShapeGeomAttributes } from '@ui/lib/types/shapes/shape';
+import {
+  ShapeAttributes,
+  ShapeBaseAttributes,
+  ShapeGeomAttributes
+} from '@ui/lib/types/shapes/shape';
 import { Children } from '@ui/lib/types/utils/children';
-import { Fill } from '@ui/lib/types/utils/fill';
-import { Stroke } from '@ui/lib/types/utils/stroke';
 import { Uuid } from '@ui/lib/types/utils/uuid';
 
 export type FrameShape = ShapeBaseAttributes &
+  ShapeAttributes &
   ShapeGeomAttributes &
   FrameAttributes &
   LayoutAttributes &
@@ -18,6 +21,4 @@ type FrameAttributes = {
   hideFillOnExport?: boolean;
   showContent?: boolean;
   hideInViewer?: boolean;
-  fills?: Fill[];
-  strokes?: Stroke[];
 };