remove symbols for blend mode

ui-src/lib/types/utils/blendModes.ts

@@ -1,20 +1,3 @@
-export const BLEND_MODE_NORMAL: unique symbol = Symbol.for('normal');
-export const BLEND_MODE_DARKEN: unique symbol = Symbol.for('darken');
-export const BLEND_MODE_MULTIPLY: unique symbol = Symbol.for('multiply');
-export const BLEND_MODE_COLOR_BURN: unique symbol = Symbol.for('color-burn');
-export const BLEND_MODE_LIGHTEN: unique symbol = Symbol.for('lighten');
-export const BLEND_MODE_SCREEN: unique symbol = Symbol.for('screen');
-export const BLEND_MODE_COLOR_DODGE: unique symbol = Symbol.for('color-dodge');
-export const BLEND_MODE_OVERLAY: unique symbol = Symbol.for('overlay');
-export const BLEND_MODE_SOFT_LIGHT: unique symbol = Symbol.for('soft-light');
-export const BLEND_MODE_HARD_LIGHT: unique symbol = Symbol.for('hard-light');
-export const BLEND_MODE_DIFFERENCE: unique symbol = Symbol.for('difference');
-export const BLEND_MODE_EXCLUSION: unique symbol = Symbol.for('exclusion');
-export const BLEND_MODE_HUE: unique symbol = Symbol.for('hue');
-export const BLEND_MODE_SATURATION: unique symbol = Symbol.for('saturation');
-export const BLEND_MODE_COLOR: unique symbol = Symbol.for('color');
-export const BLEND_MODE_LUMINOSITY: unique symbol = Symbol.for('luminosity');
-
 export type BlendMode =
   | 'normal'
   | 'darken'
@@ -31,20 +14,4 @@ export type BlendMode =
   | 'hue'
   | 'saturation'
   | 'color'
-  | 'luminosity'
-  | typeof BLEND_MODE_NORMAL
-  | typeof BLEND_MODE_DARKEN
-  | typeof BLEND_MODE_MULTIPLY
-  | typeof BLEND_MODE_COLOR_BURN
-  | typeof BLEND_MODE_LIGHTEN
-  | typeof BLEND_MODE_SCREEN
-  | typeof BLEND_MODE_COLOR_DODGE
-  | typeof BLEND_MODE_OVERLAY
-  | typeof BLEND_MODE_SOFT_LIGHT
-  | typeof BLEND_MODE_HARD_LIGHT
-  | typeof BLEND_MODE_DIFFERENCE
-  | typeof BLEND_MODE_EXCLUSION
-  | typeof BLEND_MODE_HUE
-  | typeof BLEND_MODE_SATURATION
-  | typeof BLEND_MODE_COLOR
-  | typeof BLEND_MODE_LUMINOSITY;
+  | 'luminosity';

ui-src/parser/creators/createArtboard.ts

@@ -2,23 +2,13 @@ import { PenpotFile } from '@ui/lib/types/penpotFile';
 import { FrameShape } from '@ui/lib/types/shapes/frameShape';
 import { Uuid } from '@ui/lib/types/utils/uuid';
 import { parseFigmaId } from '@ui/parser';
-import { symbolBlendMode, symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
+import { symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
 
 import { createItems } from '.';
 
 export const createArtboard = (
   file: PenpotFile,
-  {
-    type,
-    fills,
-    strokes,
-    blendMode,
-    children = [],
-    figmaId,
-    figmaRelatedId,
-    shapeRef,
-    ...rest
-  }: FrameShape
+  { type, fills, strokes, children = [], figmaId, figmaRelatedId, shapeRef, ...rest }: FrameShape
 ): Uuid | undefined => {
   const id = parseFigmaId(file, figmaId);
 
@@ -27,7 +17,6 @@ export const createArtboard = (
     shapeRef: shapeRef ?? parseFigmaId(file, figmaRelatedId, true),
     fills: symbolFills(fills),
     strokes: symbolStrokes(strokes),
-    blendMode: symbolBlendMode(blendMode),
     ...rest
   });
 

ui-src/parser/creators/createBool.ts

@@ -1,35 +1,19 @@
 import { PenpotFile } from '@ui/lib/types/penpotFile';
 import { BoolShape } from '@ui/lib/types/shapes/boolShape';
 import { parseFigmaId } from '@ui/parser';
-import {
-  symbolBlendMode,
-  symbolBoolType,
-  symbolFills,
-  symbolStrokes
-} from '@ui/parser/creators/symbols';
+import { symbolBoolType, symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
 
 import { createItems } from '.';
 
 export const createBool = (
   file: PenpotFile,
-  {
-    type,
-    fills,
-    strokes,
-    boolType,
-    blendMode,
-    figmaId,
-    figmaRelatedId,
-    children = [],
-    ...rest
-  }: BoolShape
+  { type, fills, strokes, boolType, figmaId, figmaRelatedId, children = [], ...rest }: BoolShape
 ) => {
   file.addBool({
     id: parseFigmaId(file, figmaId),
     shapeRef: parseFigmaId(file, figmaRelatedId, true),
     fills: symbolFills(fills),
     strokes: symbolStrokes(strokes),
-    blendMode: symbolBlendMode(blendMode),
     boolType: symbolBoolType(boolType),
     ...rest
   });

ui-src/parser/creators/createCircle.ts

@@ -1,18 +1,17 @@
 import { PenpotFile } from '@ui/lib/types/penpotFile';
 import { CircleShape } from '@ui/lib/types/shapes/circleShape';
 import { parseFigmaId } from '@ui/parser';
-import { symbolBlendMode, symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
+import { symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
 
 export const createCircle = (
   file: PenpotFile,
-  { type, fills, strokes, blendMode, figmaId, figmaRelatedId, ...rest }: CircleShape
+  { type, fills, strokes, figmaId, figmaRelatedId, ...rest }: CircleShape
 ) => {
   file.createCircle({
     id: parseFigmaId(file, figmaId),
     shapeRef: parseFigmaId(file, figmaRelatedId, true),
     fills: symbolFills(fills),
     strokes: symbolStrokes(strokes),
-    blendMode: symbolBlendMode(blendMode),
     ...rest
   });
 };

ui-src/parser/creators/createComponentsLibrary.ts

@@ -3,7 +3,7 @@ import { sleep } from '@plugin/utils/sleep';
 
 import { sendMessage } from '@ui/context';
 import { PenpotFile } from '@ui/lib/types/penpotFile';
-import { symbolBlendMode, symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
+import { symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
 import { UiComponent, uiComponents } from '@ui/parser/libraries';
 
 import { createItems } from '.';
@@ -41,13 +41,12 @@ const createComponentLibrary = async (file: PenpotFile, uiComponent: UiComponent
     return;
   }
 
-  const { children = [], fills, strokes, blendMode, ...rest } = component;
+  const { children = [], fills, strokes, ...rest } = component;
 
   file.startComponent({
     ...rest,
     fills: symbolFills(fills),
     strokes: symbolStrokes(strokes),
-    blendMode: symbolBlendMode(blendMode),
     id: uiComponent.componentId,
     componentId: uiComponent.componentId,
     mainInstancePage: uiComponent.mainInstancePage,

ui-src/parser/creators/createGroup.ts

@@ -1,18 +1,16 @@
 import { PenpotFile } from '@ui/lib/types/penpotFile';
 import { GroupShape } from '@ui/lib/types/shapes/groupShape';
 import { parseFigmaId } from '@ui/parser';
-import { symbolBlendMode } from '@ui/parser/creators/symbols';
 
 import { createItems } from '.';
 
 export const createGroup = (
   file: PenpotFile,
-  { type, blendMode, children = [], figmaId, figmaRelatedId, ...rest }: GroupShape
+  { type, children = [], figmaId, figmaRelatedId, ...rest }: GroupShape
 ) => {
   file.addGroup({
     id: parseFigmaId(file, figmaId),
     shapeRef: parseFigmaId(file, figmaRelatedId, true),
-    blendMode: symbolBlendMode(blendMode),
     ...rest
   });
 

ui-src/parser/creators/createPath.ts

@@ -1,23 +1,17 @@
 import { PenpotFile } from '@ui/lib/types/penpotFile';
 import { PathShape } from '@ui/lib/types/shapes/pathShape';
 import { parseFigmaId } from '@ui/parser';
-import {
-  symbolBlendMode,
-  symbolFills,
-  symbolPathContent,
-  symbolStrokes
-} from '@ui/parser/creators/symbols';
+import { symbolFills, symbolPathContent, symbolStrokes } from '@ui/parser/creators/symbols';
 
 export const createPath = (
   file: PenpotFile,
-  { type, fills, strokes, blendMode, content, figmaId, figmaRelatedId, ...rest }: PathShape
+  { type, fills, strokes, content, figmaId, figmaRelatedId, ...rest }: PathShape
 ) => {
   file.createPath({
     id: parseFigmaId(file, figmaId),
     shapeRef: parseFigmaId(file, figmaRelatedId, true),
     fills: symbolFills(fills),
     strokes: symbolStrokes(strokes),
-    blendMode: symbolBlendMode(blendMode),
     content: symbolPathContent(content),
     ...rest
   });

ui-src/parser/creators/createRectangle.ts

@@ -1,18 +1,17 @@
 import { PenpotFile } from '@ui/lib/types/penpotFile';
 import { RectShape } from '@ui/lib/types/shapes/rectShape';
 import { parseFigmaId } from '@ui/parser';
-import { symbolBlendMode, symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
+import { symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
 
 export const createRectangle = (
   file: PenpotFile,
-  { type, fills, strokes, blendMode, figmaId, figmaRelatedId, ...rest }: RectShape
+  { type, fills, strokes, figmaId, figmaRelatedId, ...rest }: RectShape
 ) => {
   file.createRect({
     id: parseFigmaId(file, figmaId),
     shapeRef: parseFigmaId(file, figmaRelatedId, true),
     fills: symbolFills(fills),
     strokes: symbolStrokes(strokes),
-    blendMode: symbolBlendMode(blendMode),
     ...rest
   });
 };

ui-src/parser/creators/createText.ts

@@ -1,17 +1,16 @@
 import { PenpotFile } from '@ui/lib/types/penpotFile';
 import { TextContent, TextShape } from '@ui/lib/types/shapes/textShape';
 import { parseFigmaId } from '@ui/parser';
-import { symbolBlendMode, symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
+import { symbolFills, symbolStrokes } from '@ui/parser/creators/symbols';
 
 export const createText = (
   file: PenpotFile,
-  { type, blendMode, strokes, figmaId, content, figmaRelatedId, ...rest }: TextShape
+  { type, strokes, figmaId, content, figmaRelatedId, ...rest }: TextShape
 ) => {
   file.createText({
     id: parseFigmaId(file, figmaId),
     shapeRef: parseFigmaId(file, figmaRelatedId, true),
     content: parseContent(content),
-    blendMode: symbolBlendMode(blendMode),
     strokes: symbolStrokes(strokes),
     ...rest
   });

ui-src/parser/creators/symbols/index.ts

@@ -1,4 +1,3 @@
-export * from './symbolBlendMode';
 export * from './symbolBoolType';
 export * from './symbolFills';
 export * from './symbolPathContent';

ui-src/parser/creators/symbols/symbolBlendMode.ts

@@ -1,60 +0,0 @@
-import {
-  BLEND_MODE_COLOR,
-  BLEND_MODE_COLOR_BURN,
-  BLEND_MODE_COLOR_DODGE,
-  BLEND_MODE_DARKEN,
-  BLEND_MODE_DIFFERENCE,
-  BLEND_MODE_EXCLUSION,
-  BLEND_MODE_HARD_LIGHT,
-  BLEND_MODE_HUE,
-  BLEND_MODE_LIGHTEN,
-  BLEND_MODE_LUMINOSITY,
-  BLEND_MODE_MULTIPLY,
-  BLEND_MODE_NORMAL,
-  BLEND_MODE_OVERLAY,
-  BLEND_MODE_SATURATION,
-  BLEND_MODE_SCREEN,
-  BLEND_MODE_SOFT_LIGHT,
-  BlendMode
-} from '@ui/lib/types/utils/blendModes';
-
-export const symbolBlendMode = (blendMode?: BlendMode): BlendMode | undefined => {
-  if (!blendMode) return;
-
-  if (typeof blendMode !== 'string') return blendMode;
-
-  switch (blendMode) {
-    case 'normal':
-      return BLEND_MODE_NORMAL;
-    case 'darken':
-      return BLEND_MODE_DARKEN;
-    case 'multiply':
-      return BLEND_MODE_MULTIPLY;
-    case 'color-burn':
-      return BLEND_MODE_COLOR_BURN;
-    case 'lighten':
-      return BLEND_MODE_LIGHTEN;
-    case 'screen':
-      return BLEND_MODE_SCREEN;
-    case 'color-dodge':
-      return BLEND_MODE_COLOR_DODGE;
-    case 'overlay':
-      return BLEND_MODE_OVERLAY;
-    case 'soft-light':
-      return BLEND_MODE_SOFT_LIGHT;
-    case 'hard-light':
-      return BLEND_MODE_HARD_LIGHT;
-    case 'difference':
-      return BLEND_MODE_DIFFERENCE;
-    case 'exclusion':
-      return BLEND_MODE_EXCLUSION;
-    case 'hue':
-      return BLEND_MODE_HUE;
-    case 'saturation':
-      return BLEND_MODE_SATURATION;
-    case 'color':
-      return BLEND_MODE_COLOR;
-    case 'luminosity':
-      return BLEND_MODE_LUMINOSITY;
-  }
-};