vlite3 1.1.1 → 1.1.2

package/components/List/List.vue.js

@@ -1,21 +1,22 @@
-import { defineComponent as J, useSlots as K, computed as h, openBlock as r, createElementBlock as n, normalizeClass as C, renderSlot as p, createBlock as x, createCommentVNode as k, createElementVNode as d, toDisplayString as N, Fragment as f, renderList as g, unref as S, isMemoSame as B, createSlots as j, withCtx as L, mergeProps as M } from "vue";
-import Q from "../Icon.vue.js";
-import F from "./ListFieldRow.vue.js";
-import { $t as U } from "../../utils/i18n.js";
-import { getObjectValue as I } from "./utils.js";
-const W = {
+import { defineComponent as X, computed as u, useSlots as Y, openBlock as r, createElementBlock as o, normalizeClass as C, renderSlot as x, createBlock as S, createCommentVNode as h, createElementVNode as d, toDisplayString as Z, Fragment as f, renderList as g, unref as L, isMemoSame as M, createSlots as R, withCtx as F, mergeProps as V } from "vue";
+import ee from "../Icon.vue.js";
+import D from "./ListFieldRow.vue.js";
+import { $t as te } from "../../utils/i18n.js";
+import { getComponentConfig as re } from "../../utils/configUtils.js";
+import { getObjectValue as $ } from "./utils.js";
+const le = {
   key: 0,
   class: "px-3 py-2.5 border-b border-border/70 flex items-center gap-2 bg-muted/60"
-}, X = { class: "text-sm font-semibold text-gray-900 tracking-tight" }, Y = { class: "sm:hidden" }, Z = { class: "hidden sm:block" }, _ = { class: "sm:hidden" }, ee = { class: "hidden sm:block" }, te = {
+}, oe = { class: "text-sm font-semibold text-gray-900 tracking-tight" }, se = { class: "sm:hidden" }, ne = { class: "hidden sm:block" }, ae = { class: "sm:hidden" }, ue = { class: "hidden sm:block" }, de = {
   key: 0,
   class: "px-3 py-8 text-center text-sm text-muted-foreground"
-}, re = { key: 1 }, oe = { key: 2 }, le = {
+}, ie = { key: 1 }, ve = { key: 2 }, me = {
   key: 1,
   class: "px-3 py-8 text-center text-sm text-muted-foreground"
-}, ne = {
+}, ce = {
   key: 3,
   class: "border-t border-border/70 px-3 py-2.5"
-}, me = /* @__PURE__ */ J({
+}, pe = /* @__PURE__ */ X({
   __name: "List",
   props: {
     fields: {},
@@ -23,42 +24,42 @@ const W = {
     title: {},
     titleI18n: {},
     titleIcon: {},
-    columns: { default: 2 },
-    variant: { default: "default" },
-    class: { default: "" },
-    showColon: { type: Boolean, default: !0 },
-    loading: { type: Boolean, default: !1 },
-    skeletonRows: { default: 6 },
-    stackedBorderStyle: { default: "none" }
+    columns: {},
+    variant: {},
+    class: {},
+    showColon: { type: Boolean },
+    loading: { type: Boolean },
+    skeletonRows: {},
+    stackedBorderStyle: {}
   },
-  setup(s) {
-    const o = s, G = K(), y = h(() => o.fields.filter((l) => {
-      const u = I(l.key, o.data);
-      return l.whenTrue && !u ? !1 : l.when ? l.when(u, o.data) : !0;
-    })), i = h(() => {
-      if (o.columns === 1)
-        return { left: [], right: [], full: y.value };
-      const l = [], u = [], t = [];
-      for (const m of y.value) {
-        if (m.lineByLine) {
-          t.push(m);
+  setup(B) {
+    const a = B, I = re("list") || {}, k = u(() => a.columns ?? I.columns ?? 2), y = u(() => a.variant ?? I.variant ?? "default"), J = u(() => a.class ?? I.class ?? ""), p = u(() => a.showColon ?? I.showColon ?? !0), K = u(() => a.skeletonRows ?? I.skeletonRows ?? 6), T = u(() => a.stackedBorderStyle ?? I.stackedBorderStyle ?? "none"), N = Y(), w = u(() => a.fields.filter((l) => {
+      const n = $(l.key, a.data);
+      return l.whenTrue && !n ? !1 : l.when ? l.when(n, a.data) : !0;
+    })), i = u(() => {
+      if (k.value === 1)
+        return { left: [], right: [], full: w.value };
+      const l = [], n = [], t = [];
+      for (const v of w.value) {
+        if (v.lineByLine) {
+          t.push(v);
           continue;
         }
-        l.length <= u.length ? l.push(m) : u.push(m);
+        l.length <= n.length ? l.push(v) : n.push(v);
       }
-      const e = Math.abs(l.length - u.length);
+      const e = Math.abs(l.length - n.length);
       if (e >= 2) {
-        const m = l.length > u.length ? l : u, a = m.splice(m.length - Math.floor(e / 2));
-        t.unshift(...a);
+        const v = l.length > n.length ? l : n, s = v.splice(v.length - Math.floor(e / 2));
+        t.unshift(...s);
       }
-      if (o.columns === 2 && l.length === u.length + 1) {
-        const m = l.pop();
-        t.unshift(m);
+      if (k.value === 2 && l.length === n.length + 1) {
+        const v = l.pop();
+        t.unshift(v);
       }
-      return { left: l, right: u, full: t };
-    }), D = h(() => i.value.full.length > 0), P = h(
+      return { left: l, right: n, full: t };
+    }), O = u(() => i.value.full.length > 0), Q = u(
       () => i.value.left.length > 0 || i.value.right.length > 0
-    ), E = h(() => o.titleI18n ? U(o.titleI18n) : o.title ?? ""), O = h(() => o.variant === "stacked"), q = h(() => {
+    ), z = u(() => a.titleI18n ? te(a.titleI18n) : a.title ?? ""), A = u(() => y.value === "stacked"), U = u(() => {
       const l = {
         default: "border border-border rounded",
         card: "border border-border rounded bg-card shadow-sm",
@@ -70,230 +71,230 @@ const W = {
       };
       return [
         "list-component w-full overflow-hidden",
-        l[o.variant] ?? l.default,
-        o.class
+        l[y.value] ?? l.default,
+        J.value
       ].join(" ");
-    }), R = h(() => o.columns === 1 ? "grid grid-cols-1" : o.columns === 3 ? "grid grid-cols-1 md:grid-cols-3" : "grid grid-cols-1 md:grid-cols-2"), T = h(() => o.columns === 1 ? "" : "border-r border-border/70"), z = h(() => o.columns === 1 ? 1 : o.columns === 3 ? 3 : 2), A = h(() => o.columns === 1 ? "grid grid-cols-1 pb-2.5 pt-1 px-1" : o.columns === 3 ? "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 pb-2.5 pt-1 px-1" : "grid grid-cols-1 sm:grid-cols-2 pb-2.5 pt-1 px-1"), $ = h(
-      () => Object.keys(G).filter((l) => !["title", "header", "footer"].includes(l))
-    ), V = h(() => Array.from({ length: o.skeletonRows }));
-    function H(l) {
-      return o.stackedBorderStyle === "divider" && l % z.value !== 0 ? "flex flex-col gap-1.5 py-2 border-l border-border pl-4 pr-3.5" : "flex flex-col gap-1.5 px-3.5 py-2";
+    }), G = u(() => k.value === 1 ? "grid grid-cols-1" : k.value === 3 ? "grid grid-cols-1 md:grid-cols-3" : "grid grid-cols-1 md:grid-cols-2"), P = u(() => k.value === 1 ? "" : "border-r border-border/70"), q = u(() => k.value === 1 ? 1 : k.value === 3 ? 3 : 2), H = u(() => k.value === 1 ? "grid grid-cols-1 pb-2.5 pt-1 px-1" : k.value === 3 ? "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 pb-2.5 pt-1 px-1" : "grid grid-cols-1 sm:grid-cols-2 pb-2.5 pt-1 px-1"), j = u(
+      () => Object.keys(N).filter((l) => !["title", "header", "footer"].includes(l))
+    ), E = u(() => Array.from({ length: K.value }));
+    function W(l) {
+      return T.value === "divider" && l % q.value !== 0 ? "flex flex-col gap-1.5 py-2 border-l border-border pl-4 pr-3.5" : "flex flex-col gap-1.5 px-3.5 py-2";
     }
-    return (l, u) => (r(), n("div", {
-      class: C(q.value),
+    return (l, n) => (r(), o("div", {
+      class: C(U.value),
       role: "table",
       "aria-label": "Information list"
     }, [
-      E.value || s.titleIcon || l.$slots.title ? (r(), n("div", W, [
-        p(l.$slots, "title", {}, () => [
-          s.titleIcon ? (r(), x(Q, {
+      z.value || B.titleIcon || l.$slots.title ? (r(), o("div", le, [
+        x(l.$slots, "title", {}, () => [
+          B.titleIcon ? (r(), S(ee, {
             key: 0,
-            icon: s.titleIcon,
+            icon: B.titleIcon,
             class: "w-4 h-4 text-muted-foreground shrink-0"
-          }, null, 8, ["icon"])) : k("", !0),
-          d("h3", X, N(E.value), 1)
+          }, null, 8, ["icon"])) : h("", !0),
+          d("h3", oe, Z(z.value), 1)
         ])
-      ])) : k("", !0),
-      s.loading ? (r(), n(f, { key: 1 }, [
-        O.value ? (r(), n(f, { key: 0 }, [
-          d("div", Y, [
-            (r(!0), n(f, null, g(V.value, (t, e) => (r(), n("div", {
+      ])) : h("", !0),
+      B.loading ? (r(), o(f, { key: 1 }, [
+        A.value ? (r(), o(f, { key: 0 }, [
+          d("div", se, [
+            (r(!0), o(f, null, g(E.value, (t, e) => (r(), o("div", {
               key: "sk-sm-" + e,
               class: "flex justify-between gap-3 px-3 py-2.5 border-b border-border/70 last:border-b-0"
-            }, [...u[10] || (u[10] = [
+            }, [...n[10] || (n[10] = [
               d("div", { class: "h-4 w-1/3 rounded bg-muted animate-pulse" }, null, -1),
               d("div", { class: "h-4 w-2/5 rounded bg-muted/60 animate-pulse" }, null, -1)
             ])]))), 128))
           ]),
-          d("div", Z, [
+          d("div", ne, [
             d("div", {
-              class: C(A.value)
+              class: C(H.value)
             }, [
-              (r(!0), n(f, null, g(V.value, (t, e) => (r(), n("div", {
+              (r(!0), o(f, null, g(E.value, (t, e) => (r(), o("div", {
                 key: "sk-s-" + e,
-                class: C(H(e))
-              }, [...u[11] || (u[11] = [
+                class: C(W(e))
+              }, [...n[11] || (n[11] = [
                 d("div", { class: "h-3 w-1/3 rounded bg-muted/60 animate-pulse" }, null, -1),
                 d("div", { class: "h-4 w-2/3 rounded bg-muted animate-pulse" }, null, -1)
               ])], 2))), 128))
             ], 2)
           ])
-        ], 64)) : (r(), n("div", {
+        ], 64)) : (r(), o("div", {
           key: 1,
-          class: C(R.value)
+          class: C(G.value)
         }, [
           d("div", null, [
-            (r(!0), n(f, null, g(V.value, (t, e) => (r(), n("div", {
+            (r(!0), o(f, null, g(E.value, (t, e) => (r(), o("div", {
               key: "sk-l-" + e,
               class: "flex justify-between gap-3 px-3 py-2.5 border-b border-border/70 last:border-b-0"
-            }, [...u[12] || (u[12] = [
+            }, [...n[12] || (n[12] = [
               d("div", { class: "h-4 w-1/3 rounded bg-muted animate-pulse" }, null, -1),
               d("div", { class: "h-4 w-2/5 rounded bg-muted/60 animate-pulse" }, null, -1)
             ])]))), 128))
           ]),
-          s.columns !== 1 ? (r(), n("div", {
+          k.value !== 1 ? (r(), o("div", {
             key: 0,
-            class: C(T.value)
+            class: C(P.value)
           }, [
-            (r(!0), n(f, null, g(V.value, (t, e) => (r(), n("div", {
+            (r(!0), o(f, null, g(E.value, (t, e) => (r(), o("div", {
               key: "sk-r-" + e,
               class: "flex justify-between gap-3 px-3 py-2.5 border-b border-border/70 last:border-b-0"
-            }, [...u[13] || (u[13] = [
+            }, [...n[13] || (n[13] = [
               d("div", { class: "h-4 w-1/3 rounded bg-muted animate-pulse" }, null, -1),
               d("div", { class: "h-4 w-2/5 rounded bg-muted/60 animate-pulse" }, null, -1)
             ])]))), 128))
-          ], 2)) : k("", !0)
+          ], 2)) : h("", !0)
         ], 2))
-      ], 64)) : (r(), n(f, { key: 2 }, [
-        O.value ? (r(), n(f, { key: 0 }, [
-          d("div", _, [
-            (r(!0), n(f, null, g(y.value, (t, e, m, a) => {
-              const v = [t, S(I)(t.key, o.data), s.variant, s.showColon];
-              if (a && a.key === "mob-" + t.key + e && B(a, v)) return a;
-              const c = (r(), x(F, {
+      ], 64)) : (r(), o(f, { key: 2 }, [
+        A.value ? (r(), o(f, { key: 0 }, [
+          d("div", ae, [
+            (r(!0), o(f, null, g(w.value, (t, e, v, s) => {
+              const m = [t, L($)(t.key, a.data), y.value, p.value];
+              if (s && s.key === "mob-" + t.key + e && M(s, m)) return s;
+              const c = (r(), S(D, {
                 key: "mob-" + t.key + e,
                 field: t,
-                data: o.data,
+                data: a.data,
                 index: e,
                 variant: "default",
-                "show-colon": s.showColon,
-                "is-last": e === y.value.length - 1,
-                "show-border-bottom": e < y.value.length - 1
-              }, j({ _: 2 }, [
-                g($.value, (b) => ({
+                "show-colon": p.value,
+                "is-last": e === w.value.length - 1,
+                "show-border-bottom": e < w.value.length - 1
+              }, R({ _: 2 }, [
+                g(j.value, (b) => ({
                   name: b,
-                  fn: L((w) => [
-                    p(l.$slots, b, M({ ref_for: !0 }, w))
+                  fn: F((_) => [
+                    x(l.$slots, b, V({ ref_for: !0 }, _))
                   ])
                 }))
               ]), 1032, ["field", "data", "index", "show-colon", "is-last", "show-border-bottom"]));
-              return c.memo = v, c;
-            }, u, 0), 128))
+              return c.memo = m, c;
+            }, n, 0), 128))
           ]),
-          d("div", ee, [
+          d("div", ue, [
             d("div", {
-              class: C(A.value)
+              class: C(H.value)
             }, [
-              (r(!0), n(f, null, g(y.value, (t, e, m, a) => {
-                const v = [t, S(I)(t.key, o.data), s.variant, s.showColon];
-                if (a && a.key === t.key + e && B(a, v)) return a;
-                const c = (r(), x(F, {
+              (r(!0), o(f, null, g(w.value, (t, e, v, s) => {
+                const m = [t, L($)(t.key, a.data), y.value, p.value];
+                if (s && s.key === t.key + e && M(s, m)) return s;
+                const c = (r(), S(D, {
                   key: t.key + e,
                   field: t,
-                  data: o.data,
+                  data: a.data,
                   index: e,
-                  variant: s.variant,
+                  variant: y.value,
                   "show-colon": !1,
-                  "is-last": e === y.value.length - 1,
+                  "is-last": e === w.value.length - 1,
                   "show-border-bottom": !1,
-                  "stacked-col-index": e % z.value,
-                  "stacked-border-style": s.stackedBorderStyle
-                }, j({ _: 2 }, [
-                  g($.value, (b) => ({
+                  "stacked-col-index": e % q.value,
+                  "stacked-border-style": T.value
+                }, R({ _: 2 }, [
+                  g(j.value, (b) => ({
                     name: b,
-                    fn: L((w) => [
-                      p(l.$slots, b, M({ ref_for: !0 }, w))
+                    fn: F((_) => [
+                      x(l.$slots, b, V({ ref_for: !0 }, _))
                     ])
                   }))
                 ]), 1032, ["field", "data", "index", "variant", "is-last", "stacked-col-index", "stacked-border-style"]));
-                return c.memo = v, c;
-              }, u, 2), 128))
+                return c.memo = m, c;
+              }, n, 2), 128))
             ], 2)
           ]),
-          y.value.length === 0 ? (r(), n("div", te, " No information to display. ")) : k("", !0)
-        ], 64)) : (r(), n(f, { key: 1 }, [
+          w.value.length === 0 ? (r(), o("div", de, " No information to display. ")) : h("", !0)
+        ], 64)) : (r(), o(f, { key: 1 }, [
           d("div", {
-            class: C(R.value)
+            class: C(G.value)
           }, [
-            i.value.left.length > 0 ? (r(), n("div", {
+            i.value.left.length > 0 ? (r(), o("div", {
               key: 0,
-              class: C(T.value)
+              class: C(P.value)
             }, [
-              (r(!0), n(f, null, g(i.value.left, (t, e, m, a) => {
-                const v = [t, S(I)(t.key, o.data), s.variant, s.showColon];
-                if (a && a.key === t.key + e && B(a, v)) return a;
-                const c = (r(), x(F, {
+              (r(!0), o(f, null, g(i.value.left, (t, e, v, s) => {
+                const m = [t, L($)(t.key, a.data), y.value, p.value];
+                if (s && s.key === t.key + e && M(s, m)) return s;
+                const c = (r(), S(D, {
                   key: t.key + e,
                   field: t,
-                  data: o.data,
+                  data: a.data,
                   index: e,
-                  variant: s.variant,
-                  "show-colon": s.showColon,
+                  variant: y.value,
+                  "show-colon": p.value,
                   "is-last": e === i.value.left.length - 1,
-                  "show-border-bottom": e < i.value.left.length - 1 || e === i.value.left.length - 1 && !D.value
-                }, j({ _: 2 }, [
-                  g($.value, (b) => ({
+                  "show-border-bottom": e < i.value.left.length - 1 || e === i.value.left.length - 1 && !O.value
+                }, R({ _: 2 }, [
+                  g(j.value, (b) => ({
                     name: b,
-                    fn: L((w) => [
-                      p(l.$slots, b, M({ ref_for: !0 }, w))
+                    fn: F((_) => [
+                      x(l.$slots, b, V({ ref_for: !0 }, _))
                     ])
                   }))
                 ]), 1032, ["field", "data", "index", "variant", "show-colon", "is-last", "show-border-bottom"]));
-                return c.memo = v, c;
-              }, u, 4), 128))
-            ], 2)) : k("", !0),
-            s.columns !== 1 && i.value.right.length > 0 ? (r(), n("div", re, [
-              (r(!0), n(f, null, g(i.value.right, (t, e, m, a) => {
-                const v = [t, S(I)(t.key, o.data), s.variant, s.showColon];
-                if (a && a.key === t.key + e && B(a, v)) return a;
-                const c = (r(), x(F, {
+                return c.memo = m, c;
+              }, n, 4), 128))
+            ], 2)) : h("", !0),
+            k.value !== 1 && i.value.right.length > 0 ? (r(), o("div", ie, [
+              (r(!0), o(f, null, g(i.value.right, (t, e, v, s) => {
+                const m = [t, L($)(t.key, a.data), y.value, p.value];
+                if (s && s.key === t.key + e && M(s, m)) return s;
+                const c = (r(), S(D, {
                   key: t.key + e,
                   field: t,
-                  data: o.data,
+                  data: a.data,
                   index: e,
-                  variant: s.variant,
-                  "show-colon": s.showColon,
+                  variant: y.value,
+                  "show-colon": p.value,
                   "is-last": e === i.value.right.length - 1,
-                  "show-border-bottom": e < i.value.right.length - 1 || e === i.value.right.length - 1 && !D.value
-                }, j({ _: 2 }, [
-                  g($.value, (b) => ({
+                  "show-border-bottom": e < i.value.right.length - 1 || e === i.value.right.length - 1 && !O.value
+                }, R({ _: 2 }, [
+                  g(j.value, (b) => ({
                     name: b,
-                    fn: L((w) => [
-                      p(l.$slots, b, M({ ref_for: !0 }, w))
+                    fn: F((_) => [
+                      x(l.$slots, b, V({ ref_for: !0 }, _))
                     ])
                   }))
                 ]), 1032, ["field", "data", "index", "variant", "show-colon", "is-last", "show-border-bottom"]));
-                return c.memo = v, c;
-              }, u, 6), 128))
-            ])) : k("", !0),
-            s.columns === 3 ? (r(), n("div", oe)) : k("", !0)
+                return c.memo = m, c;
+              }, n, 6), 128))
+            ])) : h("", !0),
+            k.value === 3 ? (r(), o("div", ve)) : h("", !0)
           ], 2),
-          D.value ? (r(), n("div", {
+          O.value ? (r(), o("div", {
             key: 0,
-            class: C(P.value ? "border-t border-border" : "")
+            class: C(Q.value ? "border-t border-border" : "")
           }, [
-            (r(!0), n(f, null, g(i.value.full, (t, e, m, a) => {
-              const v = [t, S(I)(t.key, o.data), s.variant, s.showColon];
-              if (a && a.key === t.key + e && B(a, v)) return a;
-              const c = (r(), x(F, {
+            (r(!0), o(f, null, g(i.value.full, (t, e, v, s) => {
+              const m = [t, L($)(t.key, a.data), y.value, p.value];
+              if (s && s.key === t.key + e && M(s, m)) return s;
+              const c = (r(), S(D, {
                 key: t.key + e,
                 field: t,
-                data: o.data,
+                data: a.data,
                 index: e,
-                variant: s.variant,
-                "show-colon": s.showColon,
+                variant: y.value,
+                "show-colon": p.value,
                 "is-last": e === i.value.full.length - 1,
                 "show-border-bottom": e < i.value.full.length - 1
-              }, j({ _: 2 }, [
-                g($.value, (b) => ({
+              }, R({ _: 2 }, [
+                g(j.value, (b) => ({
                   name: b,
-                  fn: L((w) => [
-                    p(l.$slots, b, M({ ref_for: !0 }, w))
+                  fn: F((_) => [
+                    x(l.$slots, b, V({ ref_for: !0 }, _))
                   ])
                 }))
               ]), 1032, ["field", "data", "index", "variant", "show-colon", "is-last", "show-border-bottom"]));
-              return c.memo = v, c;
-            }, u, 8), 128))
-          ], 2)) : k("", !0),
-          y.value.length === 0 ? (r(), n("div", le, " No information to display. ")) : k("", !0)
+              return c.memo = m, c;
+            }, n, 8), 128))
+          ], 2)) : h("", !0),
+          w.value.length === 0 ? (r(), o("div", me, " No information to display. ")) : h("", !0)
         ], 64))
       ], 64)),
-      l.$slots.footer ? (r(), n("div", ne, [
-        p(l.$slots, "footer")
-      ])) : k("", !0)
+      l.$slots.footer ? (r(), o("div", ce, [
+        x(l.$slots, "footer")
+      ])) : h("", !0)
     ], 2));
   }
 });
 export {
-  me as default
+  pe as default
 };

package/components/List/ListFieldRow.vue.d.ts

@@ -49,12 +49,12 @@ declare function __VLS_template(): {
 type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
 declare const __VLS_component: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{}>, {
     variant: string;
+    showColon: boolean;
+    stackedBorderStyle: StackedBorderStyle;
     index: number;
     isLast: boolean;
     showBorderBottom: boolean;
-    showColon: boolean;
     stackedColIndex: number;
-    stackedBorderStyle: StackedBorderStyle;
     autoLineByLineThreshold: number;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;