From c71eb8e736aa591e69fd33312091ddf4d3910b58 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alex=20S=C3=A1nchez?= <sion333@gmail.com>
Date: Mon, 13 May 2024 13:23:19 +0200
Subject: [PATCH] Layer Blur (#103)

* layer blur

* changeset
---
 .changeset/gentle-kiwis-explain.md                |  5 +++++
 .../transformers/partials/transformEffects.ts     |  5 +++--
 plugin-src/translators/index.ts                   |  1 +
 plugin-src/translators/translateBlurEffects.ts    | 15 +++++++++++++++
 ui-src/lib/types/utils/blur.ts                    |  2 +-
 5 files changed, 25 insertions(+), 3 deletions(-)
 create mode 100644 .changeset/gentle-kiwis-explain.md
 create mode 100644 plugin-src/translators/translateBlurEffects.ts

diff --git a/.changeset/gentle-kiwis-explain.md b/.changeset/gentle-kiwis-explain.md
new file mode 100644
index 0000000..3ae34ef
--- /dev/null
+++ b/.changeset/gentle-kiwis-explain.md
@@ -0,0 +1,5 @@
+---
+"penpot-exporter": minor
+---
+
+Added support for layer blur
diff --git a/plugin-src/transformers/partials/transformEffects.ts b/plugin-src/transformers/partials/transformEffects.ts
index 4745618..d42896c 100644
--- a/plugin-src/transformers/partials/transformEffects.ts
+++ b/plugin-src/transformers/partials/transformEffects.ts
@@ -1,9 +1,10 @@
-import { translateShadowEffects } from '@plugin/translators';
+import { translateBlurEffects, translateShadowEffects } from '@plugin/translators';
 
 import { ShapeAttributes } from '@ui/lib/types/shapes/shape';
 
 export const transformEffects = (node: BlendMixin): Partial<ShapeAttributes> => {
   return {
-    shadow: translateShadowEffects(node.effects)
+    shadow: translateShadowEffects(node.effects),
+    blur: translateBlurEffects(node.effects)
   };
 };
diff --git a/plugin-src/translators/index.ts b/plugin-src/translators/index.ts
index ece604f..7ca0ebd 100644
--- a/plugin-src/translators/index.ts
+++ b/plugin-src/translators/index.ts
@@ -1,4 +1,5 @@
 export * from './translateBlendMode';
+export * from './translateBlurEffects';
 export * from './translateFills';
 export * from './translateShadowEffects';
 export * from './translateStrokes';
diff --git a/plugin-src/translators/translateBlurEffects.ts b/plugin-src/translators/translateBlurEffects.ts
new file mode 100644
index 0000000..4ff7bd5
--- /dev/null
+++ b/plugin-src/translators/translateBlurEffects.ts
@@ -0,0 +1,15 @@
+import { Blur } from '@ui/lib/types/utils/blur';
+
+export const translateBlurEffects = (effect: readonly Effect[]): Blur | undefined => {
+  const blur = effect.find(effect => effect.type === 'LAYER_BLUR');
+
+  if (!blur) {
+    return;
+  }
+
+  return {
+    type: 'layer-blur',
+    value: blur.radius,
+    hidden: !blur.visible
+  };
+};
diff --git a/ui-src/lib/types/utils/blur.ts b/ui-src/lib/types/utils/blur.ts
index bb9f782..6cd6ec8 100644
--- a/ui-src/lib/types/utils/blur.ts
+++ b/ui-src/lib/types/utils/blur.ts
@@ -1,7 +1,7 @@
 import { Uuid } from './uuid';
 
 export type Blur = {
-  id: Uuid;
+  id?: Uuid;
   type: 'layer-blur';
   value: number;
   hidden: boolean;