add group

src/ui/converters/createPenpotGroup.ts

@@ -7,9 +7,14 @@ export const createPenpotGroup = (
   baseX: number,
   baseY: number
 ) => {
-  file.penpotFile.addGroup({ name: node.name });
+  file.penpotFile.addGroup({
+    type: Symbol.for('group'),
+    name: node.name
+  });
+
   for (const child of node.children) {
     createPenpotItem(file, child, baseX, baseY);
   }
+
   file.penpotFile.closeGroup();
 };

src/ui/lib/penpot.d.ts

@@ -1,4 +1,5 @@
 import { CircleShape } from './types/circle/circleShape';
+import { GroupShape } from './types/group/groupShape';
 import { ImageShape } from './types/image/imageShape';
 import { RectShape } from './types/rect/rectShape';
 import { TextShape } from './types/text/textShape';
@@ -12,8 +13,7 @@ export interface PenpotFile {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   addArtboard(artboard: any): void;
   closeArtboard(): void;
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  addGroup(group: any): void;
+  addGroup(group: GroupShape): void;
   closeGroup(): void;
   createRect(rect: RectShape): void;
   createCircle(circle: CircleShape): void;

src/ui/lib/types/group/groupAttributes.d.ts

@@ -0,0 +1,7 @@
+export type GroupAttributes = {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  id?: any;
+  type: symbol;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  shapes?: any[];
+};

src/ui/lib/types/group/groupShape.d.ts

@@ -0,0 +1,4 @@
+import { Shape } from '../shape';
+import { GroupAttributes } from './groupAttributes';
+
+export type GroupShape = Shape & GroupAttributes;