add image

src/ui/converters/createPenpotImage.ts

@@ -7,6 +7,7 @@ export const createPenpotImage = (
   baseY: number
 ) => {
   file.penpotFile.createImage({
+    type: Symbol.for('image'),
     name: node.name,
     x: node.x + baseX,
     y: node.y + baseY,

src/ui/lib/penpot.d.ts

@@ -1,4 +1,5 @@
 import { CircleShape } from './types/circle/circleShape';
+import { ImageShape } from './types/image/imageShape';
 import { RectShape } from './types/rect/rectShape';
 import { TextShape } from './types/text/textShape';
 
@@ -17,8 +18,7 @@ export interface PenpotFile {
   createRect(rect: RectShape): void;
   createCircle(circle: CircleShape): void;
   createText(options: TextShape): void;
-  // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  createImage(image: any): void;
+  createImage(image: ImageShape): void;
 }
 
 export function createFile(name: string): PenpotFile;

src/ui/lib/types/image/imageAttributes.d.ts

@@ -0,0 +1,14 @@
+export type ImageAttributes = {
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  id?: any;
+  type: symbol;
+  // TODO: Investigate where it comes from
+  dataUri?: string;
+  metadata: {
+    width: number;
+    height: number;
+    mtype?: string;
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    id?: any;
+  };
+};

src/ui/lib/types/image/imageShape.d.ts

@@ -0,0 +1,4 @@
+import { Shape } from '../shape';
+import { ImageAttributes } from './imageAttributes';
+
+export type ImageShape = Shape & ImageAttributes;