diff --git a/ui-src/lib/types/bool/boolAttributes.d.ts b/ui-src/lib/types/bool/boolAttributes.ts similarity index 74% rename from ui-src/lib/types/bool/boolAttributes.d.ts rename to ui-src/lib/types/bool/boolAttributes.ts index a2a8c88..8a58974 100644 --- a/ui-src/lib/types/bool/boolAttributes.d.ts +++ b/ui-src/lib/types/bool/boolAttributes.ts @@ -2,9 +2,11 @@ import { Uuid } from '@ui/lib/types/utils/uuid'; import { BoolContent } from './boolContent'; +export const BOOL_TYPE: unique symbol = Symbol.for('bool'); + export type BoolAttributes = { id?: Uuid; - type: symbol; // bool + type: 'bool' | typeof BOOL_TYPE; shapes?: Uuid[]; boolType: string; // @TODO: in Penpot this is of type :keyword. check if it makes sense boolContent: BoolContent[]; diff --git a/ui-src/lib/types/bool/boolShape.d.ts b/ui-src/lib/types/bool/boolShape.d.ts index 1db2d84..ea440ff 100644 --- a/ui-src/lib/types/bool/boolShape.d.ts +++ b/ui-src/lib/types/bool/boolShape.d.ts @@ -1,5 +1,6 @@ -import { Shape } from '@ui/lib/types/shape'; +import { ShapeAttributes } from '@ui/lib/types/shape/shapeAttributes'; +import { ShapeBaseAttributes } from '@ui/lib/types/shape/shapeBaseAttributes'; import { BoolAttributes } from './boolAttributes'; -export type BoolShape = Shape & BoolAttributes; +export type BoolShape = ShapeBaseAttributes & ShapeAttributes & BoolAttributes; diff --git a/ui-src/lib/types/circle/circleShape.d.ts b/ui-src/lib/types/circle/circleShape.d.ts index 9c693c4..73df332 100644 --- a/ui-src/lib/types/circle/circleShape.d.ts +++ b/ui-src/lib/types/circle/circleShape.d.ts @@ -1,5 +1,10 @@ -import { Shape } from '@ui/lib/types/shape'; +import { ShapeAttributes } from '@ui/lib/types/shape/shapeAttributes'; +import { ShapeBaseAttributes } from '@ui/lib/types/shape/shapeBaseAttributes'; +import { ShapeGeomAttributes } from '@ui/lib/types/shape/shapeGeomAttributes'; import { CircleAttributes } from './circleAttributes'; -export type CircleShape = Shape & CircleAttributes; +export type CircleShape = ShapeBaseAttributes & + ShapeGeomAttributes & + ShapeAttributes & + CircleAttributes; diff --git a/ui-src/lib/types/frame/frameShape.d.ts b/ui-src/lib/types/frame/frameShape.d.ts index 2ffaf9e..46deebd 100644 --- a/ui-src/lib/types/frame/frameShape.d.ts +++ b/ui-src/lib/types/frame/frameShape.d.ts @@ -1,6 +1,7 @@ -import { Shape } from '@ui/lib/types/shape'; +import { ShapeBaseAttributes } from '@ui/lib/types/shape/shapeBaseAttributes'; +import { ShapeGeomAttributes } from '@ui/lib/types/shape/shapeGeomAttributes'; import { Children } from '@ui/lib/types/utils/children'; import { FrameAttributes } from './frameAttributes'; -export type FrameShape = Shape & FrameAttributes & Children; +export type FrameShape = ShapeBaseAttributes & ShapeGeomAttributes & FrameAttributes & Children; diff --git a/ui-src/lib/types/group/groupShape.d.ts b/ui-src/lib/types/group/groupShape.d.ts index 7234fc0..48fe4a6 100644 --- a/ui-src/lib/types/group/groupShape.d.ts +++ b/ui-src/lib/types/group/groupShape.d.ts @@ -1,6 +1,12 @@ -import { Shape } from '@ui/lib/types/shape'; +import { ShapeAttributes } from '@ui/lib/types/shape/shapeAttributes'; +import { ShapeBaseAttributes } from '@ui/lib/types/shape/shapeBaseAttributes'; +import { ShapeGeomAttributes } from '@ui/lib/types/shape/shapeGeomAttributes'; import { Children } from '@ui/lib/types/utils/children'; import { GroupAttributes } from './groupAttributes'; -export type GroupShape = Shape & GroupAttributes & Children; +export type GroupShape = ShapeBaseAttributes & + ShapeGeomAttributes & + ShapeAttributes & + GroupAttributes & + Children; diff --git a/ui-src/lib/types/image/imageShape.d.ts b/ui-src/lib/types/image/imageShape.d.ts index 6ef9fdd..d3b5d1a 100644 --- a/ui-src/lib/types/image/imageShape.d.ts +++ b/ui-src/lib/types/image/imageShape.d.ts @@ -1,5 +1,10 @@ -import { Shape } from '@ui/lib/types/shape'; +import { ShapeAttributes } from '@ui/lib/types/shape/shapeAttributes'; +import { ShapeBaseAttributes } from '@ui/lib/types/shape/shapeBaseAttributes'; +import { ShapeGeomAttributes } from '@ui/lib/types/shape/shapeGeomAttributes'; import { ImageAttributes } from './imageAttributes'; -export type ImageShape = Shape & ImageAttributes; +export type ImageShape = ShapeBaseAttributes & + ShapeGeomAttributes & + ShapeAttributes & + ImageAttributes; diff --git a/ui-src/lib/types/layout/layoutChildAttributes.ts b/ui-src/lib/types/layout/layoutChildAttributes.ts new file mode 100644 index 0000000..f298f0c --- /dev/null +++ b/ui-src/lib/types/layout/layoutChildAttributes.ts @@ -0,0 +1,55 @@ +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_HSIZING_FILL: unique symbol = Symbol.for('fill'); +export const ITEM_HSIZING_FIX: unique symbol = Symbol.for('fix'); +export const ITEM_HSIZING_AUTO: unique symbol = Symbol.for('auto'); +export const ITEM_VSIZING_FILL: unique symbol = Symbol.for('fill'); +export const ITEM_VSIZING_FIX: unique symbol = Symbol.for('fix'); +export const ITEM_VSIZING_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 LayoutChildAttributes = { + layoutItemMarginType?: + | 'simple' + | 'multiple' + | typeof ITEM_MARGIN_SIMPLE_TYPE + | typeof ITEM_MARGIN_MULTIPLE_TYPE; + layoutItemMargin?: { + m1?: number; + m2?: number; + m3?: number; + m4?: number; + }; + layoutItemMaxH?: number; + layoutItemMinH?: number; + layoutItemMaxW?: number; + layoutItemMinW?: number; + layoutItemHSizing?: + | 'fill' + | 'fix' + | 'auto' + | typeof ITEM_HSIZING_FILL + | typeof ITEM_HSIZING_FIX + | typeof ITEM_HSIZING_AUTO; + layoutItemVSizing?: + | 'fill' + | 'fix' + | 'auto' + | typeof ITEM_VSIZING_FILL + | typeof ITEM_VSIZING_FIX + | typeof ITEM_VSIZING_AUTO; + 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; + layoutItemAbsolute?: boolean; + layoutItemZIndex?: number; +}; diff --git a/ui-src/lib/types/rect/rectShape.d.ts b/ui-src/lib/types/rect/rectShape.d.ts index b169150..e5c6319 100644 --- a/ui-src/lib/types/rect/rectShape.d.ts +++ b/ui-src/lib/types/rect/rectShape.d.ts @@ -1,5 +1,12 @@ -import { Shape } from '@ui/lib/types/shape'; +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'; import { RectAttributes } from './rectAttributes'; -export type RectShape = Shape & RectAttributes; +export type RectShape = ShapeBaseAttributes & + ShapeGeomAttributes & + ShapeAttributes & + RectAttributes & + LayoutChildAttributes; diff --git a/ui-src/lib/types/shape.d.ts b/ui-src/lib/types/shape/shapeAttributes.d.ts similarity index 94% rename from ui-src/lib/types/shape.d.ts rename to ui-src/lib/types/shape/shapeAttributes.d.ts index 89aba4d..0173a2a 100644 --- a/ui-src/lib/types/shape.d.ts +++ b/ui-src/lib/types/shape/shapeAttributes.d.ts @@ -9,11 +9,13 @@ import { Selrect } from '@ui/lib/types/utils/selrect'; import { Shadow } from '@ui/lib/types/utils/shadow'; import { Stroke } from '@ui/lib/types/utils/stroke'; -export type Shape = { +export type ShapeAttributes = { name?: string; componentId?: string; componentFile?: string; componentRoot?: boolean; + mainInstance?: boolean; + remoteSynced?: boolean; shapeRef?: string; selrect?: Selrect; points?: Point[]; diff --git a/ui-src/lib/types/shape/shapeBaseAttributes.ts b/ui-src/lib/types/shape/shapeBaseAttributes.ts new file mode 100644 index 0000000..8459242 --- /dev/null +++ b/ui-src/lib/types/shape/shapeBaseAttributes.ts @@ -0,0 +1,44 @@ +import { Matrix } from '@ui/lib/types/utils/matrix'; +import { Point } from '@ui/lib/types/utils/point'; +import { Selrect } from '@ui/lib/types/utils/selrect'; +import { Uuid } from '@ui/lib/types/utils/uuid'; + +export const FRAME_TYPE: unique symbol = Symbol.for('frame'); +export const GROUP_TYPE: unique symbol = Symbol.for('group'); +export const BOOL_TYPE: unique symbol = Symbol.for('bool'); +export const RECT_TYPE: unique symbol = Symbol.for('rect'); +export const PATH_TYPE: unique symbol = Symbol.for('path'); +export const TEXT_TYPE: unique symbol = Symbol.for('text'); +export const CIRCLE_TYPE: unique symbol = Symbol.for('circle'); +export const SVG_RAW_TYPE: unique symbol = Symbol.for('svg-raw'); +export const IMAGE_TYPE: unique symbol = Symbol.for('image'); + +export type ShapeBaseAttributes = { + id?: Uuid; + name?: string; + type: + | 'frame' + | 'group' + | 'bool' + | 'rect' + | 'path' + | 'text' + | 'circle' + | 'svg-raw' + | 'image' + | typeof FRAME_TYPE + | typeof GROUP_TYPE + | typeof BOOL_TYPE + | typeof RECT_TYPE + | typeof PATH_TYPE + | typeof TEXT_TYPE + | typeof CIRCLE_TYPE + | typeof SVG_RAW_TYPE + | typeof IMAGE_TYPE; + selrect?: Selrect; + points?: Point[]; + transform?: Matrix; + transformInverse?: Matrix; + parentId?: Uuid; + frameId?: Uuid; +}; diff --git a/ui-src/lib/types/shape/shapeGeomAttributes.d.ts b/ui-src/lib/types/shape/shapeGeomAttributes.d.ts new file mode 100644 index 0000000..dba4ff0 --- /dev/null +++ b/ui-src/lib/types/shape/shapeGeomAttributes.d.ts @@ -0,0 +1,6 @@ +export type ShapeGeomAttributes = { + x: number; + y: number; + width: number; + height: number; +}; diff --git a/ui-src/lib/types/text/textShape.d.ts b/ui-src/lib/types/text/textShape.d.ts index a152f7e..bde8b8c 100644 --- a/ui-src/lib/types/text/textShape.d.ts +++ b/ui-src/lib/types/text/textShape.d.ts @@ -1,5 +1,10 @@ -import { Shape } from '@ui/lib/types/shape'; +import { ShapeAttributes } from '@ui/lib/types/shape/shapeAttributes'; +import { ShapeBaseAttributes } from '@ui/lib/types/shape/shapeBaseAttributes'; +import { ShapeGeomAttributes } from '@ui/lib/types/shape/shapeGeomAttributes'; import { TextAttributes } from './textAttributes'; -export type TextShape = Shape & TextAttributes; +export type TextShape = ShapeBaseAttributes & + ShapeGeomAttributes & + ShapeAttributes & + TextAttributes;