@eodash/eodash 5.0.0-alpha.2.1 → 5.0.0-alpha.2.3

package/dist/DashboardLayout-lzEvtalW.js

@@ -0,0 +1,148 @@
+import { x, W as w, X as h, _ as e, $ as n, a0 as u, a9 as _, a2 as t, a5 as d, a1 as c, a3 as g, d as m, a4 as y, F as b, a6 as f } from "./asWebComponent-fqvymeM-.js";
+import { V as v } from "./VMain-COrg6UtF.js";
+class k extends HTMLElement {
+  static get observedAttributes() {
+    return ["gap"];
+  }
+  constructor() {
+    super(), this.attachShadow({ mode: "open" }), this.render();
+  }
+  render() {
+    this.shadowRoot.innerHTML = `
+    <style>
+      :host {
+        display: grid;
+        padding: ${this.getAttribute("gap") || 0}px;
+        height: 100%;
+        box-sizing: border-box;
+        gap: ${this.getAttribute("gap") || "0"}px;
+        grid-template-columns: repeat(12, 1fr);
+        grid-template-rows: repeat(12, 1fr);
+      }
+    </style>
+    <slot></slot>
+  `;
+  }
+  attributeChangedCallback(a, o, s) {
+    o !== s && (this[a] = s), this.render();
+  }
+}
+class A extends HTMLElement {
+  static get observedAttributes() {
+    return ["x", "y", "w", "h"];
+  }
+  constructor() {
+    super(), this.attachShadow({ mode: "open" }), this.render();
+  }
+  render() {
+    this.shadowRoot.innerHTML = `
+      <style>
+        :host {
+          background: lightgrey;
+          border: 1px solid darkgrey;
+          border-radius: 4px;
+          padding: 4px 8px;
+          overflow: hidden;
+
+
+          grid-column: ${parseInt(this.getAttribute("x")) + 1} / span ${this.getAttribute("w")};
+          grid-row: ${parseInt(this.getAttribute("y")) + 1} / span ${this.getAttribute("h")};
+        }
+      </style>
+      <slot></slot>
+    `;
+  }
+  attributeChangedCallback(a, o, s) {
+    o !== s && (this[a] = s), this.render();
+  }
+}
+customElements.define("eox-layout", k);
+customElements.define("eox-layout-item", A);
+const C = ["gap"], $ = {
+  key: 0,
+  style: { "z-index": "0" },
+  x: "0",
+  y: "0",
+  h: "12",
+  w: "12"
+}, L = ["x", "y", "h", "w"], T = {
+  __name: "DashboardLayout",
+  setup(p) {
+    const a = (
+      /** @type {import("@/types").Eodash} */
+      x(w)
+    ), [o] = h([a.template?.background]), s = a.template?.widgets, i = h(s);
+    return (E, M) => (e(), n(v, null, {
+      default: u(() => [
+        _("eox-layout", {
+          gap: t(a).template.gap ?? 2
+        }, [
+          t(o).component ? (e(), d("eox-layout-item", $, [
+            (e(), n(c, { suspensible: "" }, {
+              default: u(() => [
+                (e(), n(
+                  g(t(o).component),
+                  m({ id: "bg-widget" }, t(o).props),
+                  null,
+                  16
+                  /* FULL_PROPS */
+                ))
+              ]),
+              _: 1
+              /* STABLE */
+            }))
+          ])) : y("v-if", !0),
+          (e(!0), d(
+            b,
+            null,
+            f(t(s), (l, r) => (e(), d(
+              b,
+              { key: r },
+              [
+                t(i)[r].value.component ? (e(), d("eox-layout-item", {
+                  key: 0,
+                  style: { position: "relative", overflow: "visible", "z-index": "1", "border-radius": "0px", background: "rgb(var(--v-theme-surface))" },
+                  x: l.layout.x,
+                  y: l.layout.y,
+                  h: l.layout.h,
+                  w: l.layout.w
+                }, [
+                  (e(), n(
+                    c,
+                    { suspensible: "" },
+                    {
+                      default: u(() => [
+                        (e(), n(
+                          g(t(i)[r].value.component),
+                          m({
+                            key: t(i)[r].value.id
+                          }, t(i)[r].value.props),
+                          null,
+                          16
+                          /* FULL_PROPS */
+                        ))
+                      ]),
+                      _: 2
+                      /* DYNAMIC */
+                    },
+                    1024
+                    /* DYNAMIC_SLOTS */
+                  ))
+                ], 8, L)) : y("v-if", !0)
+              ],
+              64
+              /* STABLE_FRAGMENT */
+            ))),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ], 8, C)
+      ]),
+      _: 1
+      /* STABLE */
+    }));
+  }
+};
+export {
+  T as default
+};

package/dist/{DynamicWebComponent-BrHVTesn.js → DynamicWebComponent-CgDh2csQ.js}

@@ -1,5 +1,5 @@
-import { aL as i, aM as m, r as p, C as d, aN as f, D as c, K as g, E as y, m as _, H as k } from "./asWebComponent-C8rb3b1D.js";
-const h = { class: "d-flex flex-column fill-height overflow-auto" }, x = {
+import { a_ as i, a$ as m, r as p, Z as d, b0 as f, _ as c, a5 as g, $ as _, d as y, a3 as k } from "./asWebComponent-fqvymeM-.js";
+const h = { class: "d-flex flex-column fill-height overflow-auto" }, N = {
   __name: "DynamicWebComponent",
   props: {
     link: {
@@ -19,29 +19,29 @@ const h = { class: "d-flex flex-column fill-height overflow-auto" }, x = {
     onUnmounted: Function
   },
   async setup(o) {
-    let t, s;
+    let t, a;
     const e = (
       /** @type {import("@/types").WebComponentProps}  */
       o
     ), u = async () => typeof e.link == "string" ? await import(
       /* @vite-ignore */
       e.link
-    ) : await e.link(), l = customElements.get(e.tagName) ? null : ([t, s] = i(() => u().catch((n) => {
+    ) : await e.link(), l = customElements.get(e.tagName) ? null : ([t, a] = i(() => u().catch((n) => {
       console.error(n);
-    })), t = await t, s(), t);
+    })), t = await t, a(), t);
     if (!customElements.get(e.tagName) && e.constructorProp) {
       const n = l[e.constructorProp];
       customElements.define(e.tagName, n);
     }
-    const a = m(), r = p(null);
+    const s = m(), r = p(null);
     return d(() => {
-      e.onMounted?.(r.value, a);
+      e.onMounted?.(r.value, s);
     }), f(() => {
-      e.onUnmounted?.(r.value, a);
-    }), (n, N) => (c(), g("span", h, [
-      (c(), y(
+      e.onUnmounted?.(r.value, s);
+    }), (n, x) => (c(), g("span", h, [
+      (c(), _(
         k(o.tagName),
-        _(o.properties, {
+        y(o.properties, {
           ref_key: "elementRef",
           ref: r
         }),
@@ -53,5 +53,5 @@ const h = { class: "d-flex flex-column fill-height overflow-auto" }, x = {
   }
 };
 export {
-  x as default
+  N as default
 };