diff --git a/ui-src/lib/types/penpotPage.ts b/ui-src/lib/types/penpotPage.ts index 9067815..af72973 100644 --- a/ui-src/lib/types/penpotPage.ts +++ b/ui-src/lib/types/penpotPage.ts @@ -8,7 +8,7 @@ export type PenpotPage = { } & Children; export type PenpotPageOptions = { - background?: string; // hex color + background?: string; savedGrids?: SavedGrids; flows?: Flow[]; guides?: { [uuid: Uuid]: Guide }; diff --git a/ui-src/lib/types/shapes/layout.ts b/ui-src/lib/types/shapes/layout.ts index b966def..ee4f6c7 100644 --- a/ui-src/lib/types/shapes/layout.ts +++ b/ui-src/lib/types/shapes/layout.ts @@ -1,29 +1,9 @@ import { Uuid } from '@ui/lib/types/utils/uuid'; -export const ITEM_MARGIN_SIMPLE_TYPE: unique symbol = Symbol.for('simple'); -export const ITEM_MARGIN_MULTIPLE_TYPE: unique symbol = Symbol.for('multiple'); -export const ITEM_SIZING_FILL: unique symbol = Symbol.for('fill'); -export const ITEM_SIZING_FIX: unique symbol = Symbol.for('fix'); -export const ITEM_SIZING_AUTO: unique symbol = Symbol.for('auto'); -export const ITEM_ALIGN_SELF_START: unique symbol = Symbol.for('start'); -export const ITEM_ALIGN_SELF_END: unique symbol = Symbol.for('end'); -export const ITEM_ALIGN_SELF_CENTER: unique symbol = Symbol.for('center'); -export const ITEM_ALIGN_SELF_STRETCH: unique symbol = Symbol.for('stretch'); - -export type LayoutSizing = - | 'fill' - | 'fix' - | 'auto' - | typeof ITEM_SIZING_FILL - | typeof ITEM_SIZING_FIX - | typeof ITEM_SIZING_AUTO; +export type LayoutSizing = 'fill' | 'fix' | 'auto'; export type LayoutChildAttributes = { - 'layoutItemMarginType'?: - | 'simple' - | 'multiple' - | typeof ITEM_MARGIN_SIMPLE_TYPE - | typeof ITEM_MARGIN_MULTIPLE_TYPE; + 'layoutItemMarginType'?: 'simple' | 'multiple'; 'layoutItemMargin'?: { m1?: number; m2?: number; @@ -36,15 +16,7 @@ export type LayoutChildAttributes = { 'layoutItemMinW'?: number; 'layoutItemH-Sizing'?: LayoutSizing; 'layoutItemV-Sizing'?: LayoutSizing; - 'layoutItemAlignSelf'?: - | 'start' - | 'end' - | 'center' - | 'stretch' - | typeof ITEM_ALIGN_SELF_START - | typeof ITEM_ALIGN_SELF_END - | typeof ITEM_ALIGN_SELF_CENTER - | typeof ITEM_ALIGN_SELF_STRETCH; + 'layoutItemAlignSelf'?: 'start' | 'end' | 'center' | 'stretch'; 'layoutItemAbsolute'?: boolean; 'layoutItemZIndex'?: number; }; diff --git a/ui-src/lib/types/utils/blendModes.ts b/ui-src/lib/types/utils/blendModes.ts index 8f8c628..e66a153 100644 --- a/ui-src/lib/types/utils/blendModes.ts +++ b/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'; diff --git a/ui-src/lib/types/utils/color.ts b/ui-src/lib/types/utils/color.ts index 9b3bd50..0545174 100644 --- a/ui-src/lib/types/utils/color.ts +++ b/ui-src/lib/types/utils/color.ts @@ -7,9 +7,9 @@ export type Color = { name?: string; path?: string; value?: string; - color?: string; // hex color + color?: string; opacity?: number; - modifiedAt?: string; //@TODO: check this attribute in penpot + modifiedAt?: string; refId?: Uuid; refFile?: Uuid; gradient?: Gradient; diff --git a/ui-src/lib/types/utils/export.ts b/ui-src/lib/types/utils/export.ts index 937e0ca..5cf5e48 100644 --- a/ui-src/lib/types/utils/export.ts +++ b/ui-src/lib/types/utils/export.ts @@ -1,6 +1,4 @@ export type Export = { - // @TODO: in Penpot this is of type :keyword - // check if it makes sense type: string; scale: number; suffix: string; diff --git a/ui-src/lib/types/utils/gradient.ts b/ui-src/lib/types/utils/gradient.ts index 4bd6217..7e3de8c 100644 --- a/ui-src/lib/types/utils/gradient.ts +++ b/ui-src/lib/types/utils/gradient.ts @@ -1,8 +1,5 @@ -export const LINEAR_TYPE: unique symbol = Symbol.for('linear'); -export const RADIAL_TYPE: unique symbol = Symbol.for('radial'); - export type Gradient = { - type: 'linear' | 'radial' | typeof LINEAR_TYPE | typeof RADIAL_TYPE; // symbol + type: 'linear' | 'radial'; startX: number; startY: number; endX: number; diff --git a/ui-src/lib/types/utils/grid.ts b/ui-src/lib/types/utils/grid.ts index 2cdb55c..f3780b5 100644 --- a/ui-src/lib/types/utils/grid.ts +++ b/ui-src/lib/types/utils/grid.ts @@ -39,6 +39,6 @@ type SquareParams = { }; type GridColor = { - color: string; // hex color + color: string; opacity: number; }; diff --git a/ui-src/parser/creators/createArtboard.ts b/ui-src/parser/creators/createArtboard.ts index 1fa9136..90379d2 100644 --- a/ui-src/parser/creators/createArtboard.ts +++ b/ui-src/parser/creators/createArtboard.ts @@ -2,34 +2,22 @@ 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, children = [], figmaId, figmaRelatedId, ...shape }: FrameShape ): Uuid | undefined => { const id = parseFigmaId(file, figmaId); - file.addArtboard({ - id, - shapeRef: shapeRef ?? parseFigmaId(file, figmaRelatedId, true), - fills: symbolFills(fills), - strokes: symbolStrokes(strokes), - blendMode: symbolBlendMode(blendMode), - ...rest - }); + shape.id = id; + shape.shapeRef ??= parseFigmaId(file, figmaRelatedId, true); + shape.fills = symbolFills(shape.fills); + shape.strokes = symbolStrokes(shape.strokes); + + file.addArtboard(shape); createItems(file, children); diff --git a/ui-src/parser/creators/createBool.ts b/ui-src/parser/creators/createBool.ts index 2181052..bd79ed7 100644 --- a/ui-src/parser/creators/createBool.ts +++ b/ui-src/parser/creators/createBool.ts @@ -1,38 +1,21 @@ 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, figmaId, figmaRelatedId, children = [], ...shape }: 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 - }); + shape.id = parseFigmaId(file, figmaId); + shape.shapeRef = parseFigmaId(file, figmaRelatedId, true); + shape.fills = symbolFills(shape.fills); + shape.strokes = symbolStrokes(shape.strokes); + shape.boolType = symbolBoolType(shape.boolType); + + file.addBool(shape); createItems(file, children); diff --git a/ui-src/parser/creators/createCircle.ts b/ui-src/parser/creators/createCircle.ts index b9279ff..b1e1a8e 100644 --- a/ui-src/parser/creators/createCircle.ts +++ b/ui-src/parser/creators/createCircle.ts @@ -1,18 +1,16 @@ 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, figmaId, figmaRelatedId, ...shape }: CircleShape ) => { - file.createCircle({ - id: parseFigmaId(file, figmaId), - shapeRef: parseFigmaId(file, figmaRelatedId, true), - fills: symbolFills(fills), - strokes: symbolStrokes(strokes), - blendMode: symbolBlendMode(blendMode), - ...rest - }); + shape.id = parseFigmaId(file, figmaId); + shape.shapeRef = parseFigmaId(file, figmaRelatedId, true); + shape.fills = symbolFills(shape.fills); + shape.strokes = symbolStrokes(shape.strokes); + + file.createCircle(shape); }; diff --git a/ui-src/parser/creators/createComponent.ts b/ui-src/parser/creators/createComponent.ts index 9ca6ead..47293f5 100644 --- a/ui-src/parser/creators/createComponent.ts +++ b/ui-src/parser/creators/createComponent.ts @@ -8,21 +8,20 @@ import { createArtboard } from '.'; export const createComponent = (file: PenpotFile, { figmaId }: ComponentRoot) => { const component = componentsLibrary.get(figmaId); + if (!component) { return; } - const uiComponent = uiComponents.get(figmaId); - const componentId = uiComponent?.componentId ?? file.newId(); + const componentId = getComponentId(file, figmaId); + const { type, ...shape } = component; - const frameId = createArtboard(file, { - ...component, - componentFile: file.getId(), - componentId, - componentRoot: true, - mainInstance: true, - type: 'frame' - }); + shape.componentFile = file.getId(); + shape.componentId = componentId; + shape.componentRoot = true; + shape.mainInstance = true; + + const frameId = createArtboard(file, shape); if (!frameId) { return; @@ -35,3 +34,9 @@ export const createComponent = (file: PenpotFile, { figmaId }: ComponentRoot) => mainInstanceId: frameId }); }; + +const getComponentId = (file: PenpotFile, figmaId: string) => { + const uiComponent = uiComponents.get(figmaId); + + return uiComponent?.componentId ?? file.newId(); +}; diff --git a/ui-src/parser/creators/createComponentInstance.ts b/ui-src/parser/creators/createComponentInstance.ts index f580241..44bcf9a 100644 --- a/ui-src/parser/creators/createComponentInstance.ts +++ b/ui-src/parser/creators/createComponentInstance.ts @@ -13,31 +13,37 @@ export const createComponentInstance = ( figmaId, figmaRelatedId, isComponentRoot, - ...rest + ...shape }: ComponentInstance ) => { - let uiComponent = uiComponents.get(mainComponentFigmaId); + const uiComponent = + uiComponents.get(mainComponentFigmaId) ?? createUiComponent(file, mainComponentFigmaId); if (!uiComponent) { - const mainInstanceId = parseFigmaId(file, mainComponentFigmaId); - if (!mainInstanceId) { - return; - } - - uiComponent = { - componentId: file.newId(), - componentFigmaId: mainComponentFigmaId, - mainInstanceId - }; - uiComponents.register(mainComponentFigmaId, uiComponent); + return; } - createArtboard(file, { - ...rest, - shapeRef: uiComponent.mainInstanceId, - componentFile: file.getId(), - componentRoot: isComponentRoot, - componentId: uiComponent.componentId, - type: 'frame' - }); + shape.shapeRef = uiComponent.mainInstanceId; + shape.componentFile = file.getId(); + shape.componentRoot = isComponentRoot; + shape.componentId = uiComponent.componentId; + + createArtboard(file, shape); +}; + +const createUiComponent = (file: PenpotFile, mainComponentFigmaId: string) => { + const mainInstanceId = parseFigmaId(file, mainComponentFigmaId); + if (!mainInstanceId) { + return; + } + + const uiComponent = { + componentId: file.newId(), + componentFigmaId: mainComponentFigmaId, + mainInstanceId + }; + + uiComponents.register(mainComponentFigmaId, uiComponent); + + return uiComponent; }; diff --git a/ui-src/parser/creators/createComponentsLibrary.ts b/ui-src/parser/creators/createComponentsLibrary.ts index fae3fe8..935e4db 100644 --- a/ui-src/parser/creators/createComponentsLibrary.ts +++ b/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,21 +41,19 @@ const createComponentLibrary = async (file: PenpotFile, uiComponent: UiComponent return; } - const { children = [], fills, strokes, blendMode, ...rest } = component; + const { children = [], ...shape } = component; - file.startComponent({ - ...rest, - fills: symbolFills(fills), - strokes: symbolStrokes(strokes), - blendMode: symbolBlendMode(blendMode), - id: uiComponent.componentId, - componentId: uiComponent.componentId, - mainInstancePage: uiComponent.mainInstancePage, - mainInstanceId: uiComponent.mainInstanceId, - componentRoot: true, - mainInstance: true, - componentFile: file.getId() - }); + shape.fills = symbolFills(shape.fills); + shape.strokes = symbolStrokes(shape.strokes); + shape.id = uiComponent.componentId; + shape.componentId = uiComponent.componentId; + shape.mainInstancePage = uiComponent.mainInstancePage; + shape.mainInstanceId = uiComponent.mainInstanceId; + shape.componentRoot = true; + shape.mainInstance = true; + shape.componentFile = file.getId(); + + file.startComponent(shape); createItems(file, children); diff --git a/ui-src/parser/creators/createGroup.ts b/ui-src/parser/creators/createGroup.ts index 5abcd3e..4ac4a16 100644 --- a/ui-src/parser/creators/createGroup.ts +++ b/ui-src/parser/creators/createGroup.ts @@ -1,20 +1,17 @@ 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, ...shape }: GroupShape ) => { - file.addGroup({ - id: parseFigmaId(file, figmaId), - shapeRef: parseFigmaId(file, figmaRelatedId, true), - blendMode: symbolBlendMode(blendMode), - ...rest - }); + shape.id = parseFigmaId(file, figmaId); + shape.shapeRef = parseFigmaId(file, figmaRelatedId, true); + + file.addGroup(shape); createItems(file, children); diff --git a/ui-src/parser/creators/createPath.ts b/ui-src/parser/creators/createPath.ts index 3fe9660..d04bf58 100644 --- a/ui-src/parser/creators/createPath.ts +++ b/ui-src/parser/creators/createPath.ts @@ -1,24 +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, figmaId, figmaRelatedId, ...shape }: 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 - }); + shape.id = parseFigmaId(file, figmaId); + shape.shapeRef = parseFigmaId(file, figmaRelatedId, true); + shape.fills = symbolFills(shape.fills); + shape.strokes = symbolStrokes(shape.strokes); + shape.content = symbolPathContent(shape.content); + + file.createPath(shape); }; diff --git a/ui-src/parser/creators/createRectangle.ts b/ui-src/parser/creators/createRectangle.ts index b418e5f..e17ef11 100644 --- a/ui-src/parser/creators/createRectangle.ts +++ b/ui-src/parser/creators/createRectangle.ts @@ -1,18 +1,16 @@ 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, figmaId, figmaRelatedId, ...shape }: RectShape ) => { - file.createRect({ - id: parseFigmaId(file, figmaId), - shapeRef: parseFigmaId(file, figmaRelatedId, true), - fills: symbolFills(fills), - strokes: symbolStrokes(strokes), - blendMode: symbolBlendMode(blendMode), - ...rest - }); + shape.id = parseFigmaId(file, figmaId); + shape.shapeRef = parseFigmaId(file, figmaRelatedId, true); + shape.fills = symbolFills(shape.fills); + shape.strokes = symbolStrokes(shape.strokes); + + file.createRect(shape); }; diff --git a/ui-src/parser/creators/createText.ts b/ui-src/parser/creators/createText.ts index 93d7b93..1310318 100644 --- a/ui-src/parser/creators/createText.ts +++ b/ui-src/parser/creators/createText.ts @@ -1,20 +1,18 @@ 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, figmaId, figmaRelatedId, ...shape }: TextShape ) => { - file.createText({ - id: parseFigmaId(file, figmaId), - shapeRef: parseFigmaId(file, figmaRelatedId, true), - content: parseContent(content), - blendMode: symbolBlendMode(blendMode), - strokes: symbolStrokes(strokes), - ...rest - }); + shape.id = parseFigmaId(file, figmaId); + shape.shapeRef = parseFigmaId(file, figmaRelatedId, true); + shape.content = parseContent(shape.content); + shape.strokes = symbolStrokes(shape.strokes); + + file.createText(shape); }; const parseContent = (content: TextContent | undefined): TextContent | undefined => { diff --git a/ui-src/parser/creators/symbols/index.ts b/ui-src/parser/creators/symbols/index.ts index 611fc67..08f1e0f 100644 --- a/ui-src/parser/creators/symbols/index.ts +++ b/ui-src/parser/creators/symbols/index.ts @@ -1,4 +1,3 @@ -export * from './symbolBlendMode'; export * from './symbolBoolType'; export * from './symbolFills'; export * from './symbolPathContent'; diff --git a/ui-src/parser/creators/symbols/symbolBlendMode.ts b/ui-src/parser/creators/symbols/symbolBlendMode.ts deleted file mode 100644 index 5b71dd6..0000000 --- a/ui-src/parser/creators/symbols/symbolBlendMode.ts +++ /dev/null @@ -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; - } -}; diff --git a/ui-src/parser/creators/symbols/symbolFills.ts b/ui-src/parser/creators/symbols/symbolFills.ts index 0ade017..8516ee8 100644 --- a/ui-src/parser/creators/symbols/symbolFills.ts +++ b/ui-src/parser/creators/symbols/symbolFills.ts @@ -1,5 +1,4 @@ import { Fill } from '@ui/lib/types/utils/fill'; -import { Gradient, LINEAR_TYPE, RADIAL_TYPE } from '@ui/lib/types/utils/gradient'; import { ImageColor, PartialImageColor } from '@ui/lib/types/utils/imageColor'; import { uiImages } from '@ui/parser/libraries'; @@ -7,10 +6,6 @@ export const symbolFills = (fills?: Fill[]): Fill[] | undefined => { if (!fills) return; return fills.map(fill => { - if (fill.fillColorGradient) { - fill.fillColorGradient = symbolFillGradient(fill.fillColorGradient); - } - if (fill.fillImage) { fill.fillImage = symbolFillImage(fill.fillImage); } @@ -19,25 +14,6 @@ export const symbolFills = (fills?: Fill[]): Fill[] | undefined => { }); }; -const symbolFillGradient = (fillGradient: Gradient): Gradient => { - if (typeof fillGradient.type !== 'string') return fillGradient; - - const { type, ...rest } = fillGradient; - - switch (type) { - case 'linear': - return { - type: LINEAR_TYPE, - ...rest - }; - case 'radial': - return { - type: RADIAL_TYPE, - ...rest - }; - } -}; - export const symbolFillImage = ( fillImage: ImageColor | PartialImageColor ): ImageColor | undefined => { diff --git a/ui-src/parser/creators/symbols/symbolPathContent.ts b/ui-src/parser/creators/symbols/symbolPathContent.ts index bcb7188..73f46ad 100644 --- a/ui-src/parser/creators/symbols/symbolPathContent.ts +++ b/ui-src/parser/creators/symbols/symbolPathContent.ts @@ -1,7 +1,6 @@ import { Command, PathContent, - Segment, VECTOR_CLOSE_PATH, VECTOR_CURVE_TO, VECTOR_LINE_TO, @@ -9,13 +8,10 @@ import { } from '@ui/lib/types/shapes/pathShape'; export const symbolPathContent = (content: PathContent): PathContent => - content.map(({ command: stringCommand, ...rest }) => { - const command = symbolPathCommand(stringCommand); + content.map(segment => { + segment.command = symbolPathCommand(segment.command); - return { - command, - ...rest - } as Segment; + return segment; }); const symbolPathCommand = (command: Command): Command => {