update shapes to 2.0.0

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[];

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;

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;

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;

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;

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;

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

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;

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[];

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

ui-src/lib/types/shape/shapeGeomAttributes.d.ts

@@ -0,0 +1,6 @@
+export type ShapeGeomAttributes = {
+  x: number;
+  y: number;
+  width: number;
+  height: number;
+};

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;