@quidgest/ui 0.13.3 → 0.14.1

package/esm/components/QSelect/QSelect.vue.js

@@ -1,29 +1,22 @@
-import { defineComponent as J, mergeModels as R, useModel as Y, ref as m, computed as k, watch as Z, nextTick as ee, openBlock as t, createElementBlock as p, Fragment as D, createVNode as v, unref as n, normalizeClass as le, withModifiers as F, createSlots as oe, withCtx as s, renderSlot as u, createBlock as g, normalizeProps as C, guardReactiveProps as M, createCommentVNode as h, toDisplayString as O, createTextVNode as ae, mergeProps as te, createElementVNode as ne } from "vue";
+import { defineComponent as Y, mergeModels as R, useModel as Z, ref as f, computed as k, watch as ee, nextTick as le, openBlock as o, createElementBlock as m, Fragment as D, createVNode as p, unref as i, mergeProps as F, withModifiers as O, createSlots as ae, withCtx as n, renderSlot as u, createBlock as g, normalizeProps as x, guardReactiveProps as A, createCommentVNode as h, toDisplayString as M, createTextVNode as te, createElementVNode as oe } from "vue";
 import { QButton as U } from "../QButton/index.js";
 import { QField as ie } from "../QField/index.js";
 import { QIcon as S } from "../QIcon/index.js";
-import { QList as se } from "../QList/index.js";
-import { QOverlay as de } from "../QOverlay/index.js";
-import { QSpinnerLoader as re } from "../QSpinnerLoader/index.js";
-const ue = {
+import { QList as ne } from "../QList/index.js";
+import { QOverlay as se } from "../QOverlay/index.js";
+import { QSpinnerLoader as de } from "../QSpinnerLoader/index.js";
+import { DEFAULT_ICONS as re, DEFAULT_TEXTS as ue } from "./types.js";
+const ce = {
   key: 0,
   class: "q-select__value"
-}, ce = {
+}, fe = {
   key: 1,
   class: "q-select__placeholder"
-}, fe = ["data-key"], me = {
+}, me = ["data-key"], pe = {
   key: 0,
   class: "q-select__loader"
-}, pe = {
-  placeholder: "Choose..."
-}, ve = {
-  chevron: {
-    icon: "chevron-down"
-  },
-  clear: {
-    icon: "close"
-  }
-}, Ve = /* @__PURE__ */ J({
+}, Ve = /* @__PURE__ */ Y({
+  inheritAttrs: !1,
   __name: "QSelect",
   props: /* @__PURE__ */ R({
     id: { default: void 0 },
@@ -40,7 +33,8 @@ const ue = {
     emptyValue: { type: [String, Number, Boolean, Symbol], default: void 0 },
     size: { default: void 0 },
     class: { default: "" },
-    internals: { default: () => ({ icons: ve, texts: pe }) }
+    icons: { default: () => re },
+    texts: { default: () => ue }
   }, {
     modelValue: {
       type: [String, Number, Boolean, Symbol]
@@ -48,122 +42,124 @@ const ue = {
     modelModifiers: {}
   }),
   emits: /* @__PURE__ */ R(["before-show", "before-hide", "show", "hide"], ["update:modelValue"]),
-  setup(x, { emit: A }) {
-    const l = x, y = A, c = Y(x, "modelValue"), a = m(!1), w = m(""), b = m(null), _ = m(null), V = m(null), P = k(() => d.value === void 0), d = k(
+  setup($, { emit: P }) {
+    const e = $, v = P, y = Z($, "modelValue"), t = f(!1), _ = f(""), b = f(null), w = f(null), V = f(null), K = k(() => s.value === void 0), s = k(
       () => {
-        var e;
-        return (e = l.items) == null ? void 0 : e.find((o) => o[l.itemValue] === c.value);
+        var l;
+        return (l = e.items) == null ? void 0 : l.find((a) => a[e.itemValue] === y.value);
       }
-    ), K = k(
-      () => d.value ? d.value[l.itemLabel] : ""
+    ), H = k(
+      () => s.value ? s.value[e.itemLabel] : ""
     ), q = k(
-      () => l.clearable && !l.readonly && !l.disabled && !l.loading
+      () => e.clearable && !e.readonly && !e.disabled && !e.loading
     );
-    function B(e) {
-      c.value = e, L();
+    function B(l) {
+      y.value = l, L();
     }
     function E() {
-      q.value && (B(l.emptyValue), I());
+      q.value && (B(e.emptyValue), I());
     }
-    function H(e) {
-      var o, r, f;
-      !((o = V.value) != null && o.contains(e.relatedTarget)) && !((f = (r = b.value) == null ? void 0 : r.fieldRef) != null && f.contains(e.relatedTarget)) && L();
+    function W(l) {
+      var a, d, c;
+      !((a = V.value) != null && a.contains(l.relatedTarget)) && !((c = (d = b.value) == null ? void 0 : d.fieldRef) != null && c.contains(l.relatedTarget)) && L();
     }
-    function W() {
-      a.value || (y("before-show"), a.value = !0);
+    function X() {
+      t.value || (v("before-show"), t.value = !0);
     }
     function L() {
-      a.value && (y("before-hide"), a.value = !1);
+      t.value && (v("before-hide"), t.value = !1);
     }
     function T() {
-      l.readonly || l.disabled || (a.value ? L() : W());
+      e.readonly || e.disabled || (t.value ? L() : X());
     }
-    let $;
-    function z(e) {
-      if (!(!e.key || l.readonly || l.disabled)) {
-        if (window.clearTimeout($), ["Enter", " ", "ArrowDown", "ArrowUp", "Home", "End"].includes(e.key) && (e.preventDefault(), e.stopPropagation()), ["Enter", " "].includes(e.key) && (a.value = !0), ["Escape", "Tab"].includes(e.key) && (a.value ? a.value = !1 : q.value && e.key === "Escape" && E()), e.key === "Delete" && l.clearable && E(), /^[a-z]$/i.test(e.key)) {
-          w.value += e.key.toLowerCase();
-          for (let o = 0; o < l.items.length; o++)
-            if (l.items[o][l.itemLabel].toLowerCase().startsWith(w.value)) {
-              G(o);
+    let C;
+    function z(l) {
+      if (!(!l.key || e.readonly || e.disabled)) {
+        if (window.clearTimeout(C), ["Enter", " ", "ArrowDown", "ArrowUp", "Home", "End"].includes(l.key) && (l.preventDefault(), l.stopPropagation()), ["Enter", " "].includes(l.key) && (t.value = !0), ["Escape", "Tab"].includes(l.key) && (t.value ? t.value = !1 : q.value && l.key === "Escape" && E()), l.key === "Delete" && e.clearable && E(), /^[a-z]$/i.test(l.key)) {
+          _.value += l.key.toLowerCase();
+          for (let a = 0; a < e.items.length; a++)
+            if (e.items[a][e.itemLabel].toLowerCase().startsWith(_.value)) {
+              J(a);
               break;
             }
         }
-        $ = window.setTimeout(function() {
-          w.value = "";
+        C = window.setTimeout(function() {
+          _.value = "";
         }, 500);
       }
     }
-    function X() {
-      var e;
-      l.loading ? (e = V.value) == null || e.focus() : N(), y("show");
-    }
     function j() {
-      I(), y("hide");
+      var l;
+      e.loading ? (l = V.value) == null || l.focus() : N(), v("show");
+    }
+    function G() {
+      I(), v("hide");
     }
     function I() {
-      var e, o;
-      (o = (e = b.value) == null ? void 0 : e.fieldRef) == null || o.focus();
+      var l, a;
+      (a = (l = b.value) == null ? void 0 : l.fieldRef) == null || a.focus();
     }
     function N() {
-      var e;
-      (e = _.value) == null || e.$el.focus();
+      var l;
+      (l = w.value) == null || l.$el.focus();
     }
-    function G(e) {
-      var o;
-      (o = _.value) == null || o.focusItem(e);
+    function J(l) {
+      var a;
+      (a = w.value) == null || a.focusItem(l);
     }
-    return Z(
-      () => l.loading,
-      (e) => {
-        !e && a.value && ee(N);
+    return ee(
+      () => e.loading,
+      (l) => {
+        !l && t.value && le(N);
       }
-    ), (e, o) => {
-      var r, f;
-      return t(), p(
+    ), (l, a) => {
+      var d, c;
+      return o(), m(
         D,
         null,
         [
-          v(n(ie), {
-            id: l.id,
-            label: l.label,
-            required: l.required,
+          p(i(ie), F({
+            id: e.id,
+            label: e.label,
+            required: e.required,
             ref_key: "triggerEl",
             ref: b,
             role: "combobox",
-            tabindex: l.disabled ? -1 : 0,
-            class: le([
+            tabindex: e.disabled ? -1 : 0,
+            class: [
               "q-select",
               {
-                "q-select--readonly": l.readonly,
-                "q-select--disabled": l.disabled,
-                "q-select--expanded": a.value
+                "q-select--readonly": e.readonly,
+                "q-select--disabled": e.disabled,
+                "q-select--expanded": t.value
               },
-              l.class
-            ]),
-            readonly: l.readonly,
-            disabled: l.disabled,
-            "data-loading": l.loading,
-            "aria-expanded": a.value,
+              e.class
+            ],
+            readonly: e.readonly,
+            disabled: e.disabled,
+            "data-loading": e.loading,
+            "aria-expanded": t.value,
             "aria-haspopup": "listbox",
-            size: l.size,
+            size: e.size
+          }, l.$attrs, {
             onClick: T,
-            onKeydown: F(z, ["stop"])
-          }, oe({
-            append: s(() => [
-              u(e.$slots, "append"),
-              q.value && c.value ? (t(), g(n(U), {
+            onKeydown: O(z, ["stop"])
+          }), ae({
+            append: n(() => [
+              u(l.$slots, "append"),
+              q.value && y.value ? (o(), g(i(U), {
                 key: 0,
                 class: "q-select__clear",
+                "aria-label": e.texts.clearValue,
                 "b-style": "plain",
                 borderless: "",
                 tabindex: "-1",
                 onClick: E
               }, {
-                default: s(() => [
-                  v(
-                    n(S),
-                    C(M(l.internals.icons.clear)),
+                default: n(() => [
+                  p(
+                    i(S),
+                    x(A(e.icons.clear)),
                     null,
                     16
                     /* FULL_PROPS */
@@ -171,20 +167,21 @@ const ue = {
                 ]),
                 _: 1
                 /* STABLE */
-              })) : h("v-if", !0),
-              l.readonly ? h("v-if", !0) : (t(), g(n(U), {
+              }, 8, ["aria-label"])) : h("v-if", !0),
+              e.readonly ? h("v-if", !0) : (o(), g(i(U), {
                 key: 1,
                 class: "q-select__chevron",
+                "aria-label": e.texts.showOptions,
                 "b-style": "plain",
                 borderless: "",
                 tabindex: "-1",
-                disabled: l.disabled,
+                disabled: e.disabled,
                 onClick: T
               }, {
-                default: s(() => [
-                  v(
-                    n(S),
-                    C(M(l.internals.icons.chevron)),
+                default: n(() => [
+                  p(
+                    i(S),
+                    x(A(e.icons.chevron)),
                     null,
                     16
                     /* FULL_PROPS */
@@ -192,16 +189,16 @@ const ue = {
                 ]),
                 _: 1
                 /* STABLE */
-              }, 8, ["disabled"]))
+              }, 8, ["aria-label", "disabled"]))
             ]),
-            default: s(() => [
-              P.value ? (t(), p("span", ce, [
-                !l.readonly && !l.disabled ? (t(), p(
+            default: n(() => [
+              K.value ? (o(), m("span", fe, [
+                !e.readonly && !e.disabled ? (o(), m(
                   D,
                   { key: 0 },
                   [
-                    ae(
-                      O(e.internals.texts.placeholder),
+                    te(
+                      M(e.texts.placeholder),
                       1
                       /* TEXT */
                     )
@@ -209,10 +206,10 @@ const ue = {
                   64
                   /* STABLE_FRAGMENT */
                 )) : h("v-if", !0)
-              ])) : (t(), p(
+              ])) : (o(), m(
                 "span",
-                ue,
-                O(K.value),
+                ce,
+                M(H.value),
                 1
                 /* TEXT */
               ))
@@ -220,15 +217,15 @@ const ue = {
             _: 2
             /* DYNAMIC */
           }, [
-            (r = d.value) != null && r.icon || e.$slots.prepend ? {
+            (d = s.value) != null && d.icon || l.$slots.prepend ? {
               name: "prepend",
-              fn: s(() => {
-                var i, Q;
+              fn: n(() => {
+                var r, Q;
                 return [
-                  u(e.$slots, "prepend"),
-                  (i = d.value) != null && i.icon ? (t(), g(
-                    n(S),
-                    C(te({ key: 0 }, (Q = d.value) == null ? void 0 : Q.icon)),
+                  u(l.$slots, "prepend"),
+                  (r = s.value) != null && r.icon ? (o(), g(
+                    i(S),
+                    x(F({ key: 0 }, (Q = s.value) == null ? void 0 : Q.icon)),
                     null,
                     16
                     /* FULL_PROPS */
@@ -237,65 +234,62 @@ const ue = {
               }),
               key: "0"
             } : void 0,
-            e.$slots.extras ? {
+            l.$slots.extras ? {
               name: "extras",
-              fn: s(() => [
-                u(e.$slots, "extras")
+              fn: n(() => [
+                u(l.$slots, "extras")
               ]),
               key: "1"
             } : void 0
-          ]), 1032, ["id", "label", "required", "tabindex", "class", "readonly", "disabled", "data-loading", "aria-expanded", "size"]),
-          v(n(de), {
-            modelValue: a.value,
-            "onUpdate:modelValue": o[1] || (o[1] = (i) => a.value = i),
+          ]), 1040, ["id", "label", "required", "tabindex", "class", "readonly", "disabled", "data-loading", "aria-expanded", "size"]),
+          p(i(se), {
+            modelValue: t.value,
+            "onUpdate:modelValue": a[0] || (a[0] = (r) => t.value = r),
             spy: "",
             trigger: "manual",
             placement: "bottom-start",
             width: "anchor",
             "scroll-lock": "",
-            anchor: (f = b.value) == null ? void 0 : f.$el,
+            anchor: (c = b.value) == null ? void 0 : c.$el,
             offset: 2,
-            onEnter: X,
-            onLeave: j
+            onEnter: j,
+            onLeave: G
           }, {
-            default: s(() => [
-              ne("div", {
+            default: n(() => [
+              oe("div", {
                 ref_key: "contentRef",
                 ref: V,
                 "data-testid": "combobox-dropdown",
-                "data-key": l.id,
+                "data-key": e.id,
                 class: "q-select__body",
                 tabindex: "-1",
-                onFocusout: H,
-                onKeydown: F(z, ["stop"])
+                onFocusout: W,
+                onKeydown: O(z, ["stop"])
               }, [
-                u(e.$slots, "body.prepend"),
-                l.loading ? (t(), p("div", me, [
-                  v(n(re), { size: 24 })
-                ])) : (t(), g(n(se), {
+                u(l.$slots, "body.prepend"),
+                e.loading ? (o(), m("div", pe, [
+                  p(i(de), { size: 24 })
+                ])) : (o(), g(i(ne), {
                   key: 1,
                   ref_key: "listRef",
-                  ref: _,
+                  ref: w,
                   class: "q-select__items",
                   selectable: "",
-                  modelValue: c.value,
-                  "onUpdate:modelValue": [
-                    o[0] || (o[0] = (i) => c.value = i),
-                    B
-                  ],
-                  items: l.items,
-                  groups: e.groups,
-                  "item-label": l.itemLabel,
-                  "item-value": l.itemValue
+                  "model-value": y.value,
+                  items: e.items,
+                  groups: l.groups,
+                  "item-label": e.itemLabel,
+                  "item-value": e.itemValue,
+                  "onUpdate:modelValue": B
                 }, {
-                  item: s(({ item: i }) => [
-                    u(e.$slots, "item", { item: i })
+                  item: n(({ item: r }) => [
+                    u(l.$slots, "item", { item: r })
                   ]),
                   _: 3
                   /* FORWARDED */
-                }, 8, ["modelValue", "items", "groups", "item-label", "item-value"])),
-                u(e.$slots, "body.append")
-              ], 40, fe)
+                }, 8, ["model-value", "items", "groups", "item-label", "item-value"])),
+                u(l.$slots, "body.append")
+              ], 40, me)
             ]),
             _: 3
             /* FORWARDED */