From 2869673f9c9472963d20d5920986e79e45abac5b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alex=20S=C3=A1nchez?= <sion333@gmail.com>
Date: Mon, 15 Apr 2024 15:47:41 +0200
Subject: [PATCH] circle

---
 plugin-src/transformers/transformEllipseNode.ts | 4 +++-
 ui-src/converters/createPenpotCircle.ts         | 8 ++++++--
 ui-src/converters/createPenpotRectangle.ts      | 1 -
 ui-src/lib/types/circle/circleShape.d.ts        | 4 +++-
 4 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/plugin-src/transformers/transformEllipseNode.ts b/plugin-src/transformers/transformEllipseNode.ts
index 7d6f5eb..2fcf529 100644
--- a/plugin-src/transformers/transformEllipseNode.ts
+++ b/plugin-src/transformers/transformEllipseNode.ts
@@ -1,5 +1,5 @@
 import { transformDimensionAndPosition } from '@plugin/transformers/partials';
-import { translateFills } from '@plugin/translators';
+import { translateBlendMode, translateFills } from '@plugin/translators';
 
 import { CircleShape } from '@ui/lib/types/circle/circleShape';
 
@@ -12,6 +12,8 @@ export const transformEllipseNode = (
     type: 'circle',
     name: node.name,
     fills: translateFills(node.fills, node.width, node.height),
+    blendMode: translateBlendMode(node.blendMode),
+    opacity: !node.visible ? 0 : node.opacity, //@TODO: check this. If we use the property hidden and it's hidden, it won't export
     ...transformDimensionAndPosition(node, baseX, baseY)
   };
 };
diff --git a/ui-src/converters/createPenpotCircle.ts b/ui-src/converters/createPenpotCircle.ts
index a6101d4..0b60734 100644
--- a/ui-src/converters/createPenpotCircle.ts
+++ b/ui-src/converters/createPenpotCircle.ts
@@ -2,12 +2,16 @@ import { PenpotFile } from '@ui/lib/penpot';
 import { CIRCLE_TYPE } from '@ui/lib/types/circle/circleAttributes';
 import { CircleShape } from '@ui/lib/types/circle/circleShape';
 
-import { translateFillGradients } from '../translators';
+import { translateFillGradients, translateUiBlendMode } from '../translators';
 
-export const createPenpotCircle = (file: PenpotFile, { type, fills, ...rest }: CircleShape) => {
+export const createPenpotCircle = (
+  file: PenpotFile,
+  { type, fills, blendMode, ...rest }: CircleShape
+) => {
   file.createCircle({
     type: CIRCLE_TYPE,
     fills: translateFillGradients(fills),
+    blendMode: translateUiBlendMode(blendMode),
     ...rest
   });
 };
diff --git a/ui-src/converters/createPenpotRectangle.ts b/ui-src/converters/createPenpotRectangle.ts
index a2a4bda..7b000e6 100644
--- a/ui-src/converters/createPenpotRectangle.ts
+++ b/ui-src/converters/createPenpotRectangle.ts
@@ -5,7 +5,6 @@ import { translateFillGradients, translateUiBlendMode } from '@ui/translators';
 
 export const createPenpotRectangle = (
   file: PenpotFile,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
   { type, fills, blendMode, ...rest }: RectShape
 ) => {
   file.createRect({
diff --git a/ui-src/lib/types/circle/circleShape.d.ts b/ui-src/lib/types/circle/circleShape.d.ts
index 73df332..70fc92b 100644
--- a/ui-src/lib/types/circle/circleShape.d.ts
+++ b/ui-src/lib/types/circle/circleShape.d.ts
@@ -1,3 +1,4 @@
+import { LayoutChildAttributes } from '@ui/lib/types/layout/layoutChildAttributes';
 import { ShapeAttributes } from '@ui/lib/types/shape/shapeAttributes';
 import { ShapeBaseAttributes } from '@ui/lib/types/shape/shapeBaseAttributes';
 import { ShapeGeomAttributes } from '@ui/lib/types/shape/shapeGeomAttributes';
@@ -7,4 +8,5 @@ import { CircleAttributes } from './circleAttributes';
 export type CircleShape = ShapeBaseAttributes &
   ShapeGeomAttributes &
   ShapeAttributes &
-  CircleAttributes;
+  CircleAttributes &
+  LayoutChildAttributes;