@quidgest/ui 0.13.3 → 0.14.0

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

@@ -1,29 +1,21 @@
-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 J, mergeModels as R, useModel as Y, ref as f, computed as k, watch as Z, nextTick as ee, openBlock as t, createElementBlock as m, Fragment as D, createVNode as p, unref as n, normalizeClass as le, withModifiers as F, createSlots as ae, withCtx as i, renderSlot as u, createBlock as g, normalizeProps as S, guardReactiveProps as M, createCommentVNode as h, toDisplayString as O, createTextVNode as oe, mergeProps as te, createElementVNode as ne } 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 { QIcon as x } 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 { DEFAULT_ICONS as ue, DEFAULT_TEXTS as ce } from "./types.js";
+const fe = {
   key: 0,
   class: "q-select__value"
-}, ce = {
+}, me = {
   key: 1,
   class: "q-select__placeholder"
-}, fe = ["data-key"], me = {
+}, pe = ["data-key"], ve = {
   key: 0,
   class: "q-select__loader"
-}, pe = {
-  placeholder: "Choose..."
-}, ve = {
-  chevron: {
-    icon: "chevron-down"
-  },
-  clear: {
-    icon: "close"
-  }
-}, Ve = /* @__PURE__ */ J({
+}, qe = /* @__PURE__ */ J({
   __name: "QSelect",
   props: /* @__PURE__ */ R({
     id: { default: void 0 },
@@ -40,7 +32,7 @@ const ue = {
     emptyValue: { type: [String, Number, Boolean, Symbol], default: void 0 },
     size: { default: void 0 },
     class: { default: "" },
-    internals: { default: () => ({ icons: ve, texts: pe }) }
+    internals: { default: () => ({ icons: ue, texts: ce }) }
   }, {
     modelValue: {
       type: [String, Number, Boolean, Symbol]
@@ -48,83 +40,83 @@ 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(B, { emit: A }) {
+    const l = B, v = A, y = Y(B, "modelValue"), o = f(!1), _ = f(""), b = f(null), w = f(null), V = f(null), P = k(() => s.value === void 0), s = k(
       () => {
         var e;
-        return (e = l.items) == null ? void 0 : e.find((o) => o[l.itemValue] === c.value);
+        return (e = l.items) == null ? void 0 : e.find((a) => a[l.itemValue] === y.value);
       }
     ), K = k(
-      () => d.value ? d.value[l.itemLabel] : ""
+      () => s.value ? s.value[l.itemLabel] : ""
     ), q = k(
       () => l.clearable && !l.readonly && !l.disabled && !l.loading
     );
-    function B(e) {
-      c.value = e, L();
+    function C(e) {
+      y.value = e, L();
     }
     function E() {
-      q.value && (B(l.emptyValue), I());
+      q.value && (C(l.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();
+      var a, d, c;
+      !((a = V.value) != null && a.contains(e.relatedTarget)) && !((c = (d = b.value) == null ? void 0 : d.fieldRef) != null && c.contains(e.relatedTarget)) && L();
     }
     function W() {
-      a.value || (y("before-show"), a.value = !0);
+      o.value || (v("before-show"), o.value = !0);
     }
     function L() {
-      a.value && (y("before-hide"), a.value = !1);
+      o.value && (v("before-hide"), o.value = !1);
     }
     function T() {
-      l.readonly || l.disabled || (a.value ? L() : W());
+      l.readonly || l.disabled || (o.value ? L() : W());
     }
     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);
+        if (window.clearTimeout($), ["Enter", " ", "ArrowDown", "ArrowUp", "Home", "End"].includes(e.key) && (e.preventDefault(), e.stopPropagation()), ["Enter", " "].includes(e.key) && (o.value = !0), ["Escape", "Tab"].includes(e.key) && (o.value ? o.value = !1 : q.value && e.key === "Escape" && E()), e.key === "Delete" && l.clearable && E(), /^[a-z]$/i.test(e.key)) {
+          _.value += e.key.toLowerCase();
+          for (let a = 0; a < l.items.length; a++)
+            if (l.items[a][l.itemLabel].toLowerCase().startsWith(_.value)) {
+              G(a);
               break;
             }
         }
         $ = window.setTimeout(function() {
-          w.value = "";
+          _.value = "";
         }, 500);
       }
     }
     function X() {
       var e;
-      l.loading ? (e = V.value) == null || e.focus() : N(), y("show");
+      l.loading ? (e = V.value) == null || e.focus() : N(), v("show");
     }
     function j() {
-      I(), y("hide");
+      I(), v("hide");
     }
     function I() {
-      var e, o;
-      (o = (e = b.value) == null ? void 0 : e.fieldRef) == null || o.focus();
+      var e, a;
+      (a = (e = b.value) == null ? void 0 : e.fieldRef) == null || a.focus();
     }
     function N() {
       var e;
-      (e = _.value) == null || e.$el.focus();
+      (e = w.value) == null || e.$el.focus();
     }
     function G(e) {
-      var o;
-      (o = _.value) == null || o.focusItem(e);
+      var a;
+      (a = w.value) == null || a.focusItem(e);
     }
     return Z(
       () => l.loading,
       (e) => {
-        !e && a.value && ee(N);
+        !e && o.value && ee(N);
       }
-    ), (e, o) => {
-      var r, f;
-      return t(), p(
+    ), (e, a) => {
+      var d, c;
+      return t(), m(
         D,
         null,
         [
-          v(n(ie), {
+          p(n(ie), {
             id: l.id,
             label: l.label,
             required: l.required,
@@ -137,22 +129,22 @@ const ue = {
               {
                 "q-select--readonly": l.readonly,
                 "q-select--disabled": l.disabled,
-                "q-select--expanded": a.value
+                "q-select--expanded": o.value
               },
               l.class
             ]),
             readonly: l.readonly,
             disabled: l.disabled,
             "data-loading": l.loading,
-            "aria-expanded": a.value,
+            "aria-expanded": o.value,
             "aria-haspopup": "listbox",
             size: l.size,
             onClick: T,
             onKeydown: F(z, ["stop"])
-          }, oe({
-            append: s(() => [
+          }, ae({
+            append: i(() => [
               u(e.$slots, "append"),
-              q.value && c.value ? (t(), g(n(U), {
+              q.value && y.value ? (t(), g(n(U), {
                 key: 0,
                 class: "q-select__clear",
                 "b-style": "plain",
@@ -160,10 +152,10 @@ const ue = {
                 tabindex: "-1",
                 onClick: E
               }, {
-                default: s(() => [
-                  v(
-                    n(S),
-                    C(M(l.internals.icons.clear)),
+                default: i(() => [
+                  p(
+                    n(x),
+                    S(M(l.internals.icons.clear)),
                     null,
                     16
                     /* FULL_PROPS */
@@ -181,10 +173,10 @@ const ue = {
                 disabled: l.disabled,
                 onClick: T
               }, {
-                default: s(() => [
-                  v(
-                    n(S),
-                    C(M(l.internals.icons.chevron)),
+                default: i(() => [
+                  p(
+                    n(x),
+                    S(M(l.internals.icons.chevron)),
                     null,
                     16
                     /* FULL_PROPS */
@@ -194,13 +186,13 @@ const ue = {
                 /* STABLE */
               }, 8, ["disabled"]))
             ]),
-            default: s(() => [
-              P.value ? (t(), p("span", ce, [
-                !l.readonly && !l.disabled ? (t(), p(
+            default: i(() => [
+              P.value ? (t(), m("span", me, [
+                !l.readonly && !l.disabled ? (t(), m(
                   D,
                   { key: 0 },
                   [
-                    ae(
+                    oe(
                       O(e.internals.texts.placeholder),
                       1
                       /* TEXT */
@@ -209,9 +201,9 @@ const ue = {
                   64
                   /* STABLE_FRAGMENT */
                 )) : h("v-if", !0)
-              ])) : (t(), p(
+              ])) : (t(), m(
                 "span",
-                ue,
+                fe,
                 O(K.value),
                 1
                 /* TEXT */
@@ -220,15 +212,15 @@ const ue = {
             _: 2
             /* DYNAMIC */
           }, [
-            (r = d.value) != null && r.icon || e.$slots.prepend ? {
+            (d = s.value) != null && d.icon || e.$slots.prepend ? {
               name: "prepend",
-              fn: s(() => {
-                var i, Q;
+              fn: i(() => {
+                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)),
+                  (r = s.value) != null && r.icon ? (t(), g(
+                    n(x),
+                    S(te({ key: 0 }, (Q = s.value) == null ? void 0 : Q.icon)),
                     null,
                     16
                     /* FULL_PROPS */
@@ -239,26 +231,26 @@ const ue = {
             } : void 0,
             e.$slots.extras ? {
               name: "extras",
-              fn: s(() => [
+              fn: i(() => [
                 u(e.$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),
+          p(n(de), {
+            modelValue: o.value,
+            "onUpdate:modelValue": a[0] || (a[0] = (r) => o.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
           }, {
-            default: s(() => [
+            default: i(() => [
               ne("div", {
                 ref_key: "contentRef",
                 ref: V,
@@ -270,32 +262,29 @@ const ue = {
                 onKeydown: F(z, ["stop"])
               }, [
                 u(e.$slots, "body.prepend"),
-                l.loading ? (t(), p("div", me, [
-                  v(n(re), { size: 24 })
+                l.loading ? (t(), m("div", ve, [
+                  p(n(re), { size: 24 })
                 ])) : (t(), g(n(se), {
                   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
-                  ],
+                  "model-value": y.value,
                   items: l.items,
                   groups: e.groups,
                   "item-label": l.itemLabel,
-                  "item-value": l.itemValue
+                  "item-value": l.itemValue,
+                  "onUpdate:modelValue": C
                 }, {
-                  item: s(({ item: i }) => [
-                    u(e.$slots, "item", { item: i })
+                  item: i(({ item: r }) => [
+                    u(e.$slots, "item", { item: r })
                   ]),
                   _: 3
                   /* FORWARDED */
-                }, 8, ["modelValue", "items", "groups", "item-label", "item-value"])),
+                }, 8, ["model-value", "items", "groups", "item-label", "item-value"])),
                 u(e.$slots, "body.append")
-              ], 40, fe)
+              ], 40, pe)
             ]),
             _: 3
             /* FORWARDED */
@@ -308,5 +297,5 @@ const ue = {
   }
 });
 export {
-  Ve as default
+  qe as default
 };