@quidgest/ui 0.16.35 → 0.16.36

package/esm/components/QPropertyList/QPropertyList.vue.js

@@ -1,7 +1,7 @@
-import { defineComponent as G, ref as c, computed as g, watch as Q, nextTick as S, createElementBlock as d, openBlock as i, normalizeClass as h, createElementVNode as a, createBlock as p, createCommentVNode as f, Fragment as y, renderList as _, unref as m, withCtx as k, renderSlot as C } from "vue";
-import { QPropertyListGroup as N, QPropertyListRow as O, QPropertyListPanel as V } from "./index.js";
-import { DEFAULT_TEXTS as $, DEFAULT_ICONS as D } from "./types.js";
-const U = ["id"], W = { class: "q-property-list__table" }, j = /* @__PURE__ */ G({
+import { defineComponent as A, ref as p, computed as g, watch as G, nextTick as Q, createElementBlock as u, openBlock as s, normalizeClass as h, createElementVNode as a, createBlock as f, createCommentVNode as c, Fragment as y, renderList as k, unref as m, withCtx as _, renderSlot as F } from "vue";
+import { QPropertyListGroup as W, QPropertyListRow as N, QPropertyListPanel as O } from "./index.js";
+import { DEFAULT_TEXTS as V, DEFAULT_ICONS as $ } from "./types.js";
+const D = ["id"], U = { class: "q-property-list__table" }, j = /* @__PURE__ */ A({
   __name: "QPropertyList",
   props: {
     id: {},
@@ -13,14 +13,14 @@ const U = ["id"], W = { class: "q-property-list__table" }, j = /* @__PURE__ */ G
     noPanel: { type: Boolean },
     noToggle: { type: Boolean },
     readonly: { type: Boolean },
-    icons: { default: () => D },
-    texts: { default: () => $ }
+    icons: { default: () => $ },
+    texts: { default: () => V }
   },
   emits: ["field-change", "select-field"],
-  setup(F, { emit: b }) {
-    const t = F, v = b, u = c(t.groups.map((e) => e.id)), s = c(void 0), r = c(null), x = g(() => t.groups.length ? t.groups.filter(
+  setup(C, { emit: b }) {
+    const t = C, v = b, d = p(t.groups.map((e) => e.id)), n = p(void 0), r = p(null), x = g(() => t.groups.length ? t.groups.filter(
       (e) => t.fields.some((o) => o.group === e.id)
-    ) : [{ id: "", title: "" }]), w = g(() => [
+    ) : [{ id: "", title: "" }]), P = g(() => [
       "q-property-list",
       {
         "q-property-list--side-panel": t.panelPosition === "right",
@@ -28,54 +28,52 @@ const U = ["id"], W = { class: "q-property-list__table" }, j = /* @__PURE__ */ G
       },
       t.class
     ]);
-    function P() {
-      if (!r.value) return;
-      const e = r.value.offsetWidth;
-      r.value.style.width = `${e}px`;
-    }
-    function q() {
+    function B() {
       var e;
-      (e = r.value) != null && e.contains(document.activeElement) || (s.value = void 0);
-    }
-    function B(e) {
-      return e ? t.fields.filter((o) => o.group === e) : t.fields;
+      (e = r.value) != null && e.contains(document.activeElement) || (n.value = void 0);
     }
     function L(e) {
-      const o = u.value.indexOf(e);
-      o === -1 ? u.value.push(e) : u.value.splice(o, 1);
+      return e ? t.fields.filter((o) => o.group === e) : t.fields;
     }
     function T(e) {
+      const o = d.value.indexOf(e);
+      o === -1 ? d.value.push(e) : d.value.splice(o, 1);
+    }
+    function q(e) {
       var l;
-      const o = e.group && !u.value.includes(e.group), n = ((l = s.value) == null ? void 0 : l.id) === e.id;
       return [
         {
-          "q-property-list__row--closed": o,
-          "q-property-list__row--selected": n
+          "q-property-list__row--selected": ((l = n.value) == null ? void 0 : l.id) === e.id
         }
       ];
     }
-    function E(e) {
-      s.value = e, v("select-field", s.value.id);
+    function w(e) {
+      n.value = e, v("select-field", n.value.id);
     }
-    function R(e, o) {
+    function E(e, o) {
       t.readonly || (e.props.readonly ?? !1) || v("field-change", e, o);
     }
-    return Q(
+    function R() {
+      if (!r.value) return;
+      const e = r.value.offsetWidth;
+      r.value.style.minWidth = `${e}px`;
+    }
+    return G(
       () => t.block,
       async (e) => {
         var o;
-        await S(), e ? (o = r.value) == null || o.removeAttribute("style") : P();
+        await Q(), e ? (o = r.value) == null || o.removeAttribute("style") : R();
       },
       { immediate: !0 }
-    ), (e, o) => (i(), d("div", {
+    ), (e, o) => (s(), u("div", {
       id: t.id,
       ref_key: "componentRoot",
       ref: r,
       tabindex: "0",
-      class: h(w.value),
-      onFocusout: q
+      class: h(P.value),
+      onFocusout: B
     }, [
-      a("table", W, [
+      a("table", U, [
         o[0] || (o[0] = a(
           "thead",
           { class: "q-property-list__header" },
@@ -88,44 +86,44 @@ const U = ["id"], W = { class: "q-property-list__table" }, j = /* @__PURE__ */ G
           /* HOISTED */
         )),
         a("tbody", null, [
-          (i(!0), d(
+          (s(!0), u(
             y,
             null,
-            _(x.value, (n) => (i(), d(
+            k(x.value, (l) => (s(), u(
               y,
               {
-                key: n.id
+                key: l.id
               },
               [
-                n.title ? (i(), p(m(N), {
+                l.title ? (s(), f(m(W), {
                   key: 0,
-                  "data-key": n.id,
-                  title: n.title,
+                  "data-key": l.id,
+                  title: l.title,
                   icons: t.icons,
                   "no-toggle": t.noToggle,
-                  onClick: () => L(n.id)
-                }, null, 8, ["data-key", "title", "icons", "no-toggle", "onClick"])) : f("v-if", !0),
-                (i(!0), d(
+                  onClick: () => T(l.id)
+                }, null, 8, ["data-key", "title", "icons", "no-toggle", "onClick"])) : c("v-if", !0),
+                l.id === "" || d.value.includes(l.id) ? (s(!0), u(
                   y,
-                  null,
-                  _(B(n.id), (l) => (i(), p(m(O), {
-                    key: l.id,
-                    class: h(T(l)),
-                    field: l,
-                    "model-value": l.props.modelValue,
+                  { key: 1 },
+                  k(L(l.id), (i) => (s(), f(m(N), {
+                    key: i.id,
+                    class: h(q(i)),
+                    field: i,
+                    "model-value": i.props.modelValue,
                     readonly: t.readonly,
-                    onFocus: E,
-                    onFieldChange: (A) => R(l, A)
+                    onFocus: w,
+                    onFieldChange: (S) => E(i, S)
                   }, {
-                    default: k(() => [
-                      C(e.$slots, l.id, { field: l })
+                    default: _(() => [
+                      F(e.$slots, i.id, { field: i })
                     ]),
                     _: 2
                     /* DYNAMIC */
                   }, 1032, ["class", "field", "model-value", "readonly", "onFieldChange"]))),
                   128
                   /* KEYED_FRAGMENT */
-                ))
+                )) : c("v-if", !0)
               ],
               64
               /* STABLE_FRAGMENT */
@@ -135,21 +133,21 @@ const U = ["id"], W = { class: "q-property-list__table" }, j = /* @__PURE__ */ G
           ))
         ])
       ]),
-      t.noPanel ? f("v-if", !0) : (i(), p(m(V), {
+      t.noPanel ? c("v-if", !0) : (s(), f(m(O), {
         key: 0,
-        field: s.value,
+        field: n.value,
         texts: t.texts
       }, {
-        default: k(() => [
-          s.value ? C(e.$slots, "panel", {
+        default: _(() => [
+          n.value ? F(e.$slots, "panel", {
             key: 0,
-            field: s.value
-          }) : f("v-if", !0)
+            field: n.value
+          }) : c("v-if", !0)
         ]),
         _: 3
         /* FORWARDED */
       }, 8, ["field", "texts"]))
-    ], 42, U));
+    ], 42, D));
   }
 });
 export {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@quidgest/ui",
   "description": "Quidgest's UI framework",
-  "version": "0.16.35",
+  "version": "0.16.36",
   "private": false,
   "type": "module",
   "author": "Quidgest",