Layer Blur (#103)

* layer blur

* changeset

.changeset/gentle-kiwis-explain.md

@@ -0,0 +1,5 @@
+---
+"penpot-exporter": minor
+---
+
+Added support for layer blur

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)
   };
 };

plugin-src/translators/index.ts

@@ -1,4 +1,5 @@
 export * from './translateBlendMode';
+export * from './translateBlurEffects';
 export * from './translateFills';
 export * from './translateShadowEffects';
 export * from './translateStrokes';

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
+  };
+};

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;