microboard-ui-temp 0.1.8 → 0.1.9

package/dist/index.js

@@ -215914,7 +215914,8 @@ var conf = {
   FALLBACK_LNG: "en",
   cursorsMap,
   DECK_HORIZONTAL_OFFSET: 2,
-  DECK_VERTICAL_OFFSET: 0
+  DECK_VERTICAL_OFFSET: 0,
+  CARD_DIMENSIONS: { width: 250, height: 400 }
 };
 initDefaultI18N();
 
@@ -229984,6 +229985,7 @@ class BaseItem extends Mbr {
   shouldUseRelativeAlignment = true;
   enableResize = true;
   itemType = "";
+  children = [];
   constructor(board, id = "", defaultItemData, isGroupItem) {
     super();
     this.defaultItemData = defaultItemData;
@@ -230001,6 +230003,9 @@ class BaseItem extends Mbr {
     this.linkTo = new LinkTo(this.id, board.events);
     this.transformation = new Transformation(this.id, board.events);
   }
+  updateChildrenIds() {
+    this.children = this.index?.items.listAll().map((item) => item.getId()) || [];
+  }
   getId() {
     return this.id;
   }
@@ -230086,6 +230091,7 @@ class BaseItem extends Mbr {
         }
       }
     });
+    this.updateChildrenIds();
     this.updateMbr();
     this.subject.publish(this);
   }
@@ -230103,6 +230109,7 @@ class BaseItem extends Mbr {
         }
       }
     });
+    this.updateChildrenIds();
     this.updateMbr();
     this.subject.publish(this);
   }
@@ -255857,7 +255864,6 @@ var defaultCardData = {
   faceUrl: "",
   backsideUrl: ""
 };
-var CARD_DIMENSIONS = { width: 250, height: 400 };
 
 class Card extends BaseItem {
   subject = new Subject;
@@ -255918,7 +255924,7 @@ class Card extends BaseItem {
     const ctx = context.ctx;
     if (this.imageToRender && this.imageToRender.complete) {
       ctx.save();
-      ctx.drawImage(this.imageToRender, typeof left === "number" ? left : this.left, typeof top === "number" ? top : this.top, CARD_DIMENSIONS.width, CARD_DIMENSIONS.height);
+      ctx.drawImage(this.imageToRender, typeof left === "number" ? left : this.left, typeof top === "number" ? top : this.top, conf.CARD_DIMENSIONS.width, conf.CARD_DIMENSIONS.height);
       ctx.restore();
     }
   }
@@ -255926,8 +255932,8 @@ class Card extends BaseItem {
     const { translateX, translateY, scaleX, scaleY } = this.transformation.matrix;
     this.left = translateX;
     this.top = translateY;
-    this.right = this.left + CARD_DIMENSIONS.width * scaleX;
-    this.bottom = this.top + CARD_DIMENSIONS.height * scaleY;
+    this.right = this.left + conf.CARD_DIMENSIONS.width * scaleX;
+    this.bottom = this.top + conf.CARD_DIMENSIONS.height * scaleY;
   }
   getPath() {
     return new Path2(this.getMbr().getLines());
@@ -255977,6 +255983,7 @@ class Deck extends BaseItem {
   cachedCanvas = null;
   isCacheDirty = true;
   enableResize = false;
+  path = new Path2;
   constructor(board, id = "") {
     super(board, id, defaultDeckData, true);
     this.index.getUnderPoint = () => [];
@@ -256010,6 +256017,7 @@ class Deck extends BaseItem {
         }
       }
     });
+    this.updateChildrenIds();
     this.updateMbr();
     this.subject.publish(this);
   }
@@ -256028,6 +256036,7 @@ class Deck extends BaseItem {
         }
       }
     });
+    this.updateChildrenIds();
     this.updateMbr();
     this.subject.publish(this);
   }
@@ -256077,14 +256086,18 @@ class Deck extends BaseItem {
   updateMbr() {
     const { translateX, translateY } = this.transformation.matrix;
     const items = this.index.list();
-    const itemsMbr = items[0]?.getMbr().combine(items.slice(1).map((item) => item.getMbr()));
+    const itemsMbr = items[0].getMbr().combine(items.slice(1).map((item) => item.getMbr()));
     this.left = translateX;
     this.top = translateY;
-    this.right = translateX + (itemsMbr?.getWidth() || 0);
-    this.bottom = translateY + (itemsMbr?.getHeight() || 0);
+    this.right = translateX + (itemsMbr?.getWidth() || conf.CARD_DIMENSIONS.width + conf.DECK_HORIZONTAL_OFFSET * ((this.children.length || 1) - 1));
+    this.bottom = translateY + (itemsMbr?.getHeight() || conf.CARD_DIMENSIONS.height - conf.DECK_VERTICAL_OFFSET * ((this.children.length || 1) - 1));
+    this.path = new Path2(this.getMbr().getLines(), true, "#FFFFFF");
   }
   deserialize(data) {
     super.deserialize(data);
+    if (data.children) {
+      this.children = data.children;
+    }
     this.updateMbr();
     this.subject.publish(this);
     return this;
@@ -256096,6 +256109,7 @@ class Deck extends BaseItem {
     const ctx = context.ctx;
     if (this.isCacheDirty || !this.cachedCanvas) {
       this.updateCache(context);
+      this.path.render(context);
     }
     if (this.cachedCanvas && this.cachedCanvas.width && this.cachedCanvas.height) {
       ctx.save();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "microboard-ui-temp",
-  "version": "0.1.8",
+  "version": "0.1.9",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "type": "module",
@@ -51,7 +51,7 @@
     "i18next-browser-languagedetector": "^8.2.0",
     "js-cookie": "^3.0.5",
     "jwt-decode": "^4.0.0",
-    "microboard-temp": "^0.4.103",
+    "microboard-temp": "^0.4.104",
     "nanoid": "^5.1.5",
     "prop-types": "^15.8.1",
     "react-hot-toast": "2.4.1",