@luzmo/analytics-components-kit 1.0.1-alpha.46 → 1.0.1-alpha.47

package/components/grid/index.cjs

@@ -278,7 +278,7 @@ Note: ".grid-stack" is required for proper CSS styling and drag/drop, and is the
         >
         </luzmo-grid-item-actions-menu>
       </div>
-    `}_createItemActionsMenuPopover(e){let t=e.querySelector(".grid-item-actions-popover");const i=e.querySelector(".grid-stack-item-content"),r=this.getGridItemById(e.getAttribute("gs-id")??"");if(!t){const o=document.createDocumentFragment();f.B(this._renderOverlayContent(r==null?void 0:r.item),o),t=o.querySelector(".grid-item-actions-popover"),e.append(t)}const n=ts(i,t,async()=>{var l;const{x:o,y:a}=await rs(i,t,{placement:((l=r==null?void 0:r.item)==null?void 0:l.placementActionsMenu)??this.placementItemActionsMenu??"right-start",middleware:[is(0),ss({crossAxis:!1})]});t.style.left=`${o}px`,t.style.top=`${a}px`});t._cleanup=n,t.matches(":popover-open")||t.showPopover()}_removeItemActionsMenuPopover(e){const t=e.querySelector(".grid-item-actions-popover");t&&(t._cleanup&&(t._cleanup(),delete t._cleanup),t.matches(":popover-open")&&t.hidePopover(),t.remove())}_updateThemeProperties(){var r,n,o,a,l,d,c,h,u,g,m,b,y,w,_,x,R,A,j,W,H;if(!this._fullTheme)return;const e=this._fullTheme.boxShadow;let t="";if(e){const G=new C(e.color),O={r:Math.round(G.srgb.r*255),g:Math.round(G.srgb.g*255),b:Math.round(G.srgb.b*255)},ue=((r=this._fullTheme.margins)==null?void 0:r[0])??16,$=Math.min(ue/10,2),oe=(I,me)=>me>=1?`rgba(${I.r},${I.g},${I.b},1)`:me<=0?`rgba(${I.r},${I.g},${I.b},0)`:`rgba(${I.r},${I.g},${I.b},${me})`;e.size==="none"?t="none":e.size==="S"?t=`0 ${$*2}px ${$*4}px ${oe(O,.16)}, 0 ${$*2}px ${$*4}px ${oe(O,.23)}`:e.size==="M"?t=`0 ${$*8}px ${$*16}px ${oe(O,.19)}, 0 ${$*4}px ${$*4}px ${oe(O,.23)}`:e.size==="L"&&(t=`0 ${$*12}px ${$*24}px ${oe(O,.25)}, 0 ${$*8}px ${$*8}px ${oe(O,.22)}`)}new Map([["--grid-font-family",(o=(n=this._fullTheme)==null?void 0:n.font)==null?void 0:o.fontFamily],["--grid-background",(a=this._fullTheme)==null?void 0:a.background],["--grid-item-box-shadow",t],["--grid-item-background",(l=this._fullTheme)==null?void 0:l.itemsBackground],["--grid-item-border-color",(c=(d=this._fullTheme)==null?void 0:d.borders)==null?void 0:c["border-color"]],["--grid-item-border-style",(u=(h=this._fullTheme)==null?void 0:h.borders)==null?void 0:u["border-style"]],["--grid-item-border-radius",(m=(g=this._fullTheme)==null?void 0:g.borders)==null?void 0:m["border-radius"]],["--grid-item-border-width",`${(y=(b=this._fullTheme)==null?void 0:b.borders)==null?void 0:y["border-top-width"]}`],["--grid-item-border-top-width",(_=(w=this._fullTheme)==null?void 0:w.borders)==null?void 0:_["border-top-width"]],["--grid-item-border-right-width",(R=(x=this._fullTheme)==null?void 0:x.borders)==null?void 0:R["border-right-width"]],["--grid-item-border-bottom-width",(j=(A=this._fullTheme)==null?void 0:A.borders)==null?void 0:j["border-bottom-width"]],["--grid-item-border-left-width",(H=(W=this._fullTheme)==null?void 0:W.borders)==null?void 0:H["border-left-width"]]]).forEach((G,O)=>{G?this.style.setProperty(O,G):this.style.removeProperty(O)})}getGridItemById(e){return this.gridItems.find(t=>t.item.id===e)}addGridItem(e){var a,l,d,c,h;!this._initialized&&this._gridElement&&console.warn("Grid is not initialized, wait for grid-ready event");const t={...structuredClone(e),id:nt(),position:structuredClone(e==null?void 0:e.position)??{sizeX:1,sizeY:1,col:0,row:0}};this.items.push(t);const i=this._renderItem(t,this.items.length),r=document.createDocumentFragment();f.B(i,r,{host:this}),this._gridElement.append(r);const n=this._gridElement.querySelector(`[luzmo-grid-item-id="${t.id}"]`);n.setAttribute("orphan","true");const o={x:((a=t.position)==null?void 0:a.col)??0,y:((l=t.position)==null?void 0:l.row)??0,w:((d=t.position)==null?void 0:d.sizeX)??1,h:((c=t.position)==null?void 0:c.sizeY)??1,autoPosition:!0,id:t.id};return(h=this._grid)==null||h.makeWidget(n,o),this._hasItemAdded=!0,this._activeItemElement&&this._cleanupActiveItem(this._activeItemElement),requestAnimationFrame(()=>{const u=n.getBoundingClientRect();(u.bottom>window.innerHeight||u.top<0)&&n.scrollIntoView({behavior:"smooth",block:"center"})}),n}removeGridItem(e){this.removeGridItemById((e==null?void 0:e.id)??"")}removeGridItemById(e){var r;if(!e)return;const t=(r=this.getGridItemById(e))==null?void 0:r.element;t&&this._grid&&(this._grid.removeWidget(t),this._focusedItemElement=void 0);const i=this.items.findIndex(n=>n.id===e);i!==-1&&this.items.splice(i,1),this._removeItemActionsMenuPopover(t),t&&this._activeItemElement===t&&this._cleanupActiveItem(t)}_renderItem(e,t){var n;const i={...e.options,locale:this.contentLanguage};i.theme||(i.theme=(n=this._fullTheme)!=null&&n.id?{id:this._fullTheme.id}:structuredClone(this._fullTheme));const r=!this.viewMode;return f.x`
+    `}_createItemActionsMenuPopover(e){let t=e.querySelector(".grid-item-actions-popover");const i=e.querySelector(".grid-stack-item-content"),r=this.getGridItemById(e.getAttribute("gs-id")??"");if(!t){const o=document.createDocumentFragment();f.B(this._renderOverlayContent(r==null?void 0:r.item),o),t=o.querySelector(".grid-item-actions-popover"),e.append(t)}const n=ts(i,t,async()=>{var l;const{x:o,y:a}=await rs(i,t,{placement:((l=r==null?void 0:r.item)==null?void 0:l.placementActionsMenu)??this.placementItemActionsMenu??"right-start",middleware:[is(0),ss({crossAxis:!1})]});t.style.left=`${o}px`,t.style.top=`${a}px`});t._cleanup=n,t.matches(":popover-open")||t.showPopover()}_removeItemActionsMenuPopover(e){const t=e.querySelector(".grid-item-actions-popover");t&&(t._cleanup&&(t._cleanup(),delete t._cleanup),t.matches(":popover-open")&&t.hidePopover(),t.remove())}_updateThemeProperties(){var r,n,o,a,l,d,c,h,u,g,m,b,y,w,_,x,R,A,j,W,H;if(!this._fullTheme)return;const e=this._fullTheme.boxShadow;let t="";if(e){const G=new C(e.color),O={r:Math.round(G.srgb.r*255),g:Math.round(G.srgb.g*255),b:Math.round(G.srgb.b*255)},ue=((r=this._fullTheme.margins)==null?void 0:r[0])??16,$=Math.min(ue/10,2),oe=(I,me)=>me>=1?`rgba(${I.r},${I.g},${I.b},1)`:me<=0?`rgba(${I.r},${I.g},${I.b},0)`:`rgba(${I.r},${I.g},${I.b},${me})`;e.size==="none"?t="none":e.size==="S"?t=`0 ${$*2}px ${$*4}px ${oe(O,.16)}, 0 ${$*2}px ${$*4}px ${oe(O,.23)}`:e.size==="M"?t=`0 ${$*8}px ${$*16}px ${oe(O,.19)}, 0 ${$*4}px ${$*4}px ${oe(O,.23)}`:e.size==="L"&&(t=`0 ${$*12}px ${$*24}px ${oe(O,.25)}, 0 ${$*8}px ${$*8}px ${oe(O,.22)}`)}new Map([["--grid-font-family",(o=(n=this._fullTheme)==null?void 0:n.font)==null?void 0:o.fontFamily],["--grid-background",(a=this._fullTheme)==null?void 0:a.background],["--grid-item-box-shadow",t],["--grid-item-background",(l=this._fullTheme)==null?void 0:l.itemsBackground],["--grid-item-border-color",(c=(d=this._fullTheme)==null?void 0:d.borders)==null?void 0:c["border-color"]],["--grid-item-border-style",(u=(h=this._fullTheme)==null?void 0:h.borders)==null?void 0:u["border-style"]],["--grid-item-border-radius",(m=(g=this._fullTheme)==null?void 0:g.borders)==null?void 0:m["border-radius"]],["--grid-item-border-width",`${(y=(b=this._fullTheme)==null?void 0:b.borders)==null?void 0:y["border-top-width"]}`],["--grid-item-border-top-width",(_=(w=this._fullTheme)==null?void 0:w.borders)==null?void 0:_["border-top-width"]],["--grid-item-border-right-width",(R=(x=this._fullTheme)==null?void 0:x.borders)==null?void 0:R["border-right-width"]],["--grid-item-border-bottom-width",(j=(A=this._fullTheme)==null?void 0:A.borders)==null?void 0:j["border-bottom-width"]],["--grid-item-border-left-width",(H=(W=this._fullTheme)==null?void 0:W.borders)==null?void 0:H["border-left-width"]]]).forEach((G,O)=>{G?this.style.setProperty(O,G):this.style.removeProperty(O)})}getGridItemById(e){return this.gridItems.find(t=>t.item.id===e)}addGridItem(e){var l,d,c,h,u;!this._initialized&&this._gridElement&&console.warn("Grid is not initialized, wait for grid-ready event");const t={...structuredClone(e),id:nt(),position:structuredClone(e==null?void 0:e.position)??{sizeX:1,sizeY:1,col:0,row:0}},i=this._renderItem(t,this.items.length),r=document.createDocumentFragment();f.B(i,r,{host:this}),this._gridElement.append(r);const n=this._gridElement.querySelector(`[luzmo-grid-item-id="${t.id}"]`);n.setAttribute("orphan","true");const o={x:((l=t.position)==null?void 0:l.col)??0,y:((d=t.position)==null?void 0:d.row)??0,w:((c=t.position)==null?void 0:c.sizeX)??1,h:((h=t.position)==null?void 0:h.sizeY)??1,autoPosition:!0,id:t.id},a=(u=this._grid)==null?void 0:u.makeWidget(n,o);return a&&(t.position={sizeX:Number.parseInt(a.getAttribute("gs-w")??"1",10),sizeY:Number.parseInt(a.getAttribute("gs-h")??"1",10),col:Number.parseInt(a.getAttribute("gs-x")??"0",10),row:Number.parseInt(a.getAttribute("gs-y")??"0",10)}),this.items.push(t),this._hasItemAdded=!0,this._activeItemElement&&this._cleanupActiveItem(this._activeItemElement),requestAnimationFrame(()=>{const g=n.getBoundingClientRect();(g.bottom>window.innerHeight||g.top<0)&&n.scrollIntoView({behavior:"smooth",block:"center"})}),n}removeGridItem(e){this.removeGridItemById((e==null?void 0:e.id)??"")}removeGridItemById(e){var r;if(!e)return;const t=(r=this.getGridItemById(e))==null?void 0:r.element;t&&this._grid&&(this._grid.removeWidget(t),this._focusedItemElement=void 0);const i=this.items.findIndex(n=>n.id===e);i!==-1&&this.items.splice(i,1),this._removeItemActionsMenuPopover(t),t&&this._activeItemElement===t&&this._cleanupActiveItem(t)}_renderItem(e,t){var n;const i={...e.options,locale:this.contentLanguage};i.theme||(i.theme=(n=this._fullTheme)!=null&&n.id?{id:this._fullTheme.id}:structuredClone(this._fullTheme));const r=!this.viewMode;return f.x`
       <div
         class="luzmo-grid-item has-luzmo-viz-item"
         luzmo-grid-item-id=${e.id??nt()}

package/components/grid/index.js

@@ -8795,7 +8795,7 @@ class $ extends Dr {
     return this.gridItems.find((t) => t.item.id === e);
   }
   addGridItem(e) {
-    var a, l, d, c, h;
+    var l, d, c, h, u;
     !this._initialized && this._gridElement && console.warn("Grid is not initialized, wait for grid-ready event");
     const t = {
       ...structuredClone(e),
@@ -8806,26 +8806,32 @@ class $ extends Dr {
         col: 0,
         row: 0
       }
-    };
-    this.items.push(t);
-    const s = this._renderItem(t, this.items.length), r = document.createDocumentFragment();
+    }, s = this._renderItem(t, this.items.length), r = document.createDocumentFragment();
     es(s, r, { host: this }), this._gridElement.append(r);
     const o = this._gridElement.querySelector(
       `[luzmo-grid-item-id="${t.id}"]`
     );
     o.setAttribute("orphan", "true");
     const n = {
-      x: ((a = t.position) == null ? void 0 : a.col) ?? 0,
-      y: ((l = t.position) == null ? void 0 : l.row) ?? 0,
-      w: ((d = t.position) == null ? void 0 : d.sizeX) ?? 1,
-      h: ((c = t.position) == null ? void 0 : c.sizeY) ?? 1,
+      x: ((l = t.position) == null ? void 0 : l.col) ?? 0,
+      y: ((d = t.position) == null ? void 0 : d.row) ?? 0,
+      w: ((c = t.position) == null ? void 0 : c.sizeX) ?? 1,
+      h: ((h = t.position) == null ? void 0 : h.sizeY) ?? 1,
       // Let GridStack find a good position if there's overlap
       autoPosition: !0,
       id: t.id
-    };
-    return (h = this._grid) == null || h.makeWidget(o, n), this._hasItemAdded = !0, this._activeItemElement && this._cleanupActiveItem(this._activeItemElement), requestAnimationFrame(() => {
-      const u = o.getBoundingClientRect();
-      (u.bottom > window.innerHeight || u.top < 0) && o.scrollIntoView({ behavior: "smooth", block: "center" });
+    }, a = (u = this._grid) == null ? void 0 : u.makeWidget(
+      o,
+      n
+    );
+    return a && (t.position = {
+      sizeX: Number.parseInt(a.getAttribute("gs-w") ?? "1", 10),
+      sizeY: Number.parseInt(a.getAttribute("gs-h") ?? "1", 10),
+      col: Number.parseInt(a.getAttribute("gs-x") ?? "0", 10),
+      row: Number.parseInt(a.getAttribute("gs-y") ?? "0", 10)
+    }), this.items.push(t), this._hasItemAdded = !0, this._activeItemElement && this._cleanupActiveItem(this._activeItemElement), requestAnimationFrame(() => {
+      const f = o.getBoundingClientRect();
+      (f.bottom > window.innerHeight || f.top < 0) && o.scrollIntoView({ behavior: "smooth", block: "center" });
     }), o;
   }
   removeGridItem(e) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@luzmo/analytics-components-kit",
-  "version": "1.0.1-alpha.46",
+  "version": "1.0.1-alpha.47",
   "type": "module",
   "main": "./components/index.js",
   "module": "./components/index.js",