@quidgest/ui 0.14.11 → 0.14.13

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

@@ -1,26 +1,28 @@
-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 n, mergeProps as F, withModifiers as O, createSlots as ae, withCtx as i, 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 { defineComponent as X, mergeModels as I, useModel as j, ref as f, computed as b, watch as G, nextTick as J, createElementBlock as m, openBlock as a, Fragment as N, createVNode as k, unref as n, mergeProps as D, withModifiers as F, createSlots as Y, withCtx as i, toDisplayString as O, createCommentVNode as g, createTextVNode as Z, renderSlot as u, createBlock as h, normalizeProps as ee, createElementVNode as le } from "vue";
+import { DEFAULT_TEXTS as oe, DEFAULT_ICONS as te } from "./types.js";
+import { QButton as ae } from "../QButton/index.js";
 import { QField as ne } from "../QField/index.js";
-import { QIcon as S } from "../QIcon/index.js";
-import { QList as ie } from "../QList/index.js";
-import { QOverlay as se } from "../QOverlay/index.js";
+import { QIcon as ie } from "../QIcon/index.js";
+import { QList as se } from "../QList/index.js";
+import { QOverlay as re } 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 = {
+import { QChevron as ue } from "../__internal__/QChevron/index.js";
+import { QClearButton as ce } from "../__internal__/QClearButton/index.js";
+const fe = {
   key: 0,
   class: "q-select__value"
-}, fe = {
+}, me = {
   key: 1,
   class: "q-select__placeholder"
-}, me = ["data-key"], pe = {
+}, pe = ["data-key"], ye = {
   key: 0,
   class: "q-select__loader"
-}, Ve = /* @__PURE__ */ Y({
+}, qe = /* @__PURE__ */ X({
   inheritAttrs: !1,
   __name: "QSelect",
-  props: /* @__PURE__ */ R({
-    id: { default: void 0 },
-    label: { default: "" },
+  props: /* @__PURE__ */ I({
+    id: {},
+    label: {},
     clearable: { type: Boolean },
     readonly: { type: Boolean },
     disabled: { type: Boolean },
@@ -30,95 +32,95 @@ const ce = {
     groups: { default: () => [] },
     itemValue: { default: "key" },
     itemLabel: { default: "label" },
-    emptyValue: { type: [String, Number, Boolean, Symbol], default: void 0 },
-    size: { default: void 0 },
-    class: { default: "" },
-    icons: { default: () => re },
-    texts: { default: () => ue }
+    emptyValue: { type: [String, Number, Boolean, Symbol] },
+    size: {},
+    class: {},
+    icons: { default: () => te },
+    texts: { default: () => oe }
   }, {
     modelValue: {
       type: [String, Number, Boolean, Symbol]
     },
     modelModifiers: {}
   }),
-  emits: /* @__PURE__ */ R(["before-show", "before-hide", "show", "hide"], ["update:modelValue"]),
-  setup($, { emit: P }) {
-    const e = $, y = P, b = Z($, "modelValue"), t = f(!1), _ = f(""), v = f(null), w = f(null), V = f(null), K = k(() => s.value === void 0), s = k(
+  emits: /* @__PURE__ */ I(["before-show", "before-hide", "show", "hide"], ["update:modelValue"]),
+  setup(x, { emit: R }) {
+    const e = x, p = R, y = j(x, "modelValue"), t = f(!1), w = f(""), v = f(null), _ = f(null), V = f(null), A = b(() => s.value === void 0), s = b(
       () => {
         var l;
-        return (l = e.items) == null ? void 0 : l.find((a) => a[e.itemValue] === b.value);
+        return (l = e.items) == null ? void 0 : l.find((o) => o[e.itemValue] === y.value);
       }
-    ), H = k(
+    ), M = b(
       () => s.value ? s.value[e.itemLabel] : ""
-    ), q = k(
+    ), E = b(
       () => e.clearable && !e.readonly && !e.disabled && !e.loading
     );
     function B(l) {
-      b.value = l, L();
+      y.value = l, q();
     }
-    function E() {
-      q.value && (B(e.emptyValue), I());
+    function L() {
+      E.value && (B(e.emptyValue), T());
     }
-    function W(l) {
-      var a, d, c;
-      !((a = V.value) != null && a.contains(l.relatedTarget)) && !((c = (d = v.value) == null ? void 0 : d.fieldRef) != null && c.contains(l.relatedTarget)) && L();
+    function U(l) {
+      var o, r, c;
+      !((o = V.value) != null && o.contains(l.relatedTarget)) && !((c = (r = v.value) == null ? void 0 : r.fieldRef) != null && c.contains(l.relatedTarget)) && q();
     }
-    function X() {
-      t.value || (y("before-show"), t.value = !0);
+    function K() {
+      t.value || (p("before-show"), t.value = !0);
     }
-    function L() {
-      t.value && (y("before-hide"), t.value = !1);
+    function q() {
+      t.value && (p("before-hide"), t.value = !1);
     }
-    function T() {
-      e.readonly || e.disabled || (t.value ? L() : X());
+    function C() {
+      e.readonly || e.disabled || (t.value ? q() : K());
     }
-    let C;
-    function z(l) {
+    let S;
+    function $(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);
+        if (window.clearTimeout(S), ["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 : E.value && l.key === "Escape" && L()), l.key === "Delete" && e.clearable && L(), /^[a-z]$/i.test(l.key)) {
+          w.value += l.key.toLowerCase();
+          for (let o = 0; o < e.items.length; o++)
+            if (e.items[o][e.itemLabel].toLowerCase().startsWith(w.value)) {
+              W(o);
               break;
             }
         }
-        C = window.setTimeout(function() {
-          _.value = "";
+        S = window.setTimeout(function() {
+          w.value = "";
         }, 500);
       }
     }
-    function j() {
+    function P() {
       var l;
-      e.loading ? (l = V.value) == null || l.focus() : N(), y("show");
+      e.loading ? (l = V.value) == null || l.focus() : Q(), p("show");
     }
-    function G() {
-      I(), y("hide");
+    function H() {
+      T(), p("hide");
     }
-    function I() {
-      var l, a;
-      (a = (l = v.value) == null ? void 0 : l.fieldRef) == null || a.focus();
+    function T() {
+      var l, o;
+      (o = (l = v.value) == null ? void 0 : l.fieldRef) == null || o.focus();
     }
-    function N() {
+    function Q() {
       var l;
-      (l = w.value) == null || l.$el.focus();
+      (l = _.value) == null || l.$el.focus();
     }
-    function J(l) {
-      var a;
-      (a = w.value) == null || a.focusItem(l);
+    function W(l) {
+      var o;
+      (o = _.value) == null || o.focusItem(l);
     }
-    return ee(
+    return G(
       () => e.loading,
       (l) => {
-        !l && t.value && le(N);
+        !l && t.value && J(Q);
       }
-    ), (l, a) => {
-      var d, c;
-      return o(), m(
-        D,
+    ), (l, o) => {
+      var r, c;
+      return a(), m(
+        N,
         null,
         [
-          p(n(ne), F({
+          k(n(ne), D({
             id: e.id,
             ref_key: "triggerEl",
             ref: v,
@@ -130,8 +132,7 @@ const ce = {
               "q-select",
               {
                 "q-select--readonly": e.readonly,
-                "q-select--disabled": e.disabled,
-                "q-select--expanded": t.value
+                "q-select--disabled": e.disabled
               },
               e.class
             ],
@@ -142,33 +143,18 @@ const ce = {
             "aria-haspopup": "listbox",
             size: e.size
           }, l.$attrs, {
-            onClick: T,
-            onKeydown: O(z, ["stop"])
-          }), ae({
+            onClick: C,
+            onKeydown: F($, ["stop"])
+          }), Y({
             append: i(() => [
               u(l.$slots, "append"),
-              q.value && b.value ? (o(), g(n(U), {
+              E.value && y.value ? (a(), h(n(ce), {
                 key: 0,
-                class: "q-select__clear",
-                "aria-label": e.texts.clearValue,
-                "b-style": "plain",
-                borderless: "",
-                tabindex: "-1",
-                onClick: E
-              }, {
-                default: i(() => [
-                  p(
-                    n(S),
-                    x(A(e.icons.clear)),
-                    null,
-                    16
-                    /* FULL_PROPS */
-                  )
-                ]),
-                _: 1
-                /* STABLE */
-              }, 8, ["aria-label"])) : h("v-if", !0),
-              e.readonly ? h("v-if", !0) : (o(), g(n(U), {
+                icons: e.icons,
+                texts: e.texts,
+                onClick: L
+              }, null, 8, ["icons", "texts"])) : g("v-if", !0),
+              e.readonly ? g("v-if", !0) : (a(), h(n(ae), {
                 key: 1,
                 class: "q-select__chevron",
                 "aria-label": e.texts.showOptions,
@@ -176,40 +162,37 @@ const ce = {
                 borderless: "",
                 tabindex: "-1",
                 disabled: e.disabled,
-                onClick: T
+                onClick: C
               }, {
                 default: i(() => [
-                  p(
-                    n(S),
-                    x(A(e.icons.chevron)),
-                    null,
-                    16
-                    /* FULL_PROPS */
-                  )
+                  k(n(ue), {
+                    "model-value": t.value,
+                    icons: e.icons
+                  }, null, 8, ["model-value", "icons"])
                 ]),
                 _: 1
                 /* STABLE */
               }, 8, ["aria-label", "disabled"]))
             ]),
             default: i(() => [
-              K.value ? (o(), m("span", fe, [
-                !e.readonly && !e.disabled ? (o(), m(
-                  D,
+              A.value ? (a(), m("span", me, [
+                !e.readonly && !e.disabled ? (a(), m(
+                  N,
                   { key: 0 },
                   [
-                    te(
-                      M(e.texts.placeholder),
+                    Z(
+                      O(e.texts.placeholder),
                       1
                       /* TEXT */
                     )
                   ],
                   64
                   /* STABLE_FRAGMENT */
-                )) : h("v-if", !0)
-              ])) : (o(), m(
+                )) : g("v-if", !0)
+              ])) : (a(), m(
                 "span",
-                ce,
-                M(H.value),
+                fe,
+                O(M.value),
                 1
                 /* TEXT */
               ))
@@ -217,19 +200,19 @@ const ce = {
             _: 2
             /* DYNAMIC */
           }, [
-            (d = s.value) != null && d.icon || l.$slots.prepend ? {
+            (r = s.value) != null && r.icon || l.$slots.prepend ? {
               name: "prepend",
               fn: i(() => {
-                var r, Q;
+                var d, z;
                 return [
                   u(l.$slots, "prepend"),
-                  (r = s.value) != null && r.icon ? (o(), g(
-                    n(S),
-                    x(F({ key: 0 }, (Q = s.value) == null ? void 0 : Q.icon)),
+                  (d = s.value) != null && d.icon ? (a(), h(
+                    n(ie),
+                    ee(D({ key: 0 }, (z = s.value) == null ? void 0 : z.icon)),
                     null,
                     16
                     /* FULL_PROPS */
-                  )) : h("v-if", !0)
+                  )) : g("v-if", !0)
                 ];
               }),
               key: "0"
@@ -242,9 +225,9 @@ const ce = {
               key: "1"
             } : void 0
           ]), 1040, ["id", "label", "required", "tabindex", "class", "readonly", "disabled", "data-loading", "aria-expanded", "size"]),
-          p(n(se), {
+          k(n(re), {
             modelValue: t.value,
-            "onUpdate:modelValue": a[0] || (a[0] = (r) => t.value = r),
+            "onUpdate:modelValue": o[0] || (o[0] = (d) => t.value = d),
             spy: "",
             trigger: "manual",
             placement: "bottom-start",
@@ -252,44 +235,44 @@ const ce = {
             "scroll-lock": "",
             anchor: (c = v.value) == null ? void 0 : c.$el,
             offset: 2,
-            onEnter: j,
-            onLeave: G
+            onEnter: P,
+            onLeave: H
           }, {
             default: i(() => [
-              oe("div", {
+              le("div", {
                 ref_key: "contentRef",
                 ref: V,
                 "data-testid": "combobox-dropdown",
                 "data-key": e.id,
                 class: "q-select__body",
                 tabindex: "-1",
-                onFocusout: W,
-                onKeydown: O(z, ["stop"])
+                onFocusout: U,
+                onKeydown: F($, ["stop"])
               }, [
                 u(l.$slots, "body.prepend"),
-                e.loading ? (o(), m("div", pe, [
-                  p(n(de), { size: 24 })
-                ])) : (o(), g(n(ie), {
+                e.loading ? (a(), m("div", ye, [
+                  k(n(de), { size: 24 })
+                ])) : (a(), h(n(se), {
                   key: 1,
                   ref_key: "listRef",
-                  ref: w,
+                  ref: _,
                   class: "q-select__items",
                   selectable: "",
-                  "model-value": b.value,
+                  "model-value": y.value,
                   items: e.items,
                   groups: l.groups,
                   "item-label": e.itemLabel,
                   "item-value": e.itemValue,
                   "onUpdate:modelValue": B
                 }, {
-                  item: i(({ item: r }) => [
-                    u(l.$slots, "item", { item: r })
+                  item: i(({ item: d }) => [
+                    u(l.$slots, "item", { item: d })
                   ]),
                   _: 3
                   /* FORWARDED */
                 }, 8, ["model-value", "items", "groups", "item-label", "item-value"])),
                 u(l.$slots, "body.append")
-              ], 40, me)
+              ], 40, pe)
             ]),
             _: 3
             /* FORWARDED */
@@ -302,5 +285,5 @@ const ce = {
   }
 });
 export {
-  Ve as default
+  qe as default
 };