@wssto2/vue-core 0.4.17 → 0.4.18

package/dist/SelectField.vue_vue_type_script_setup_true_lang-C1Flb1hA.js

@@ -1,465 +0,0 @@
-import { defineComponent as G, ref as N, useId as J, useTemplateRef as K, computed as g, watch as B, nextTick as Q, openBlock as a, createElementBlock as f, normalizeClass as b, createElementVNode as r, createVNode as q, unref as o, withDirectives as X, vModelText as Y, createCommentVNode as v, toDisplayString as $, createBlock as V, Fragment as R, renderList as H, onScopeDispose as Z, mergeProps as I, createSlots as M, withCtx as S, createTextVNode as ee, renderSlot as U, mergeDefaults as te } from "vue";
-import { useI18n as W } from "vue-i18n";
-import { _ as oe } from "./Button.vue_vue_type_script_setup_true_lang-CL9Qh5yq.js";
-import { _ as z } from "./Icon.vue_vue_type_script_lang-D7oC-d-S.js";
-import { u as le } from "./mediaQuery-CygcXmFW.js";
-import { _ as P } from "./ToneDot.vue_vue_type_script_setup_true_lang-99rNn-L5.js";
-import { _ as ae } from "./Sheet.vue_vue_type_script_setup_true_lang-DgOFV4fa.js";
-import { _ as ne } from "./Popover.vue_vue_type_script_setup_true_lang-Dx-tDhNE.js";
-import { a as se, c as re, _ as ie, f as ue, b as de } from "./control-B_Nwtmag.js";
-import { g as ce, m as pe } from "./options-Ba_0uLWN.js";
-import { a as me } from "./suggestions-BxMm6MQA.js";
-const fe = { class: "flex min-h-9 items-center gap-1.5 rounded-control bg-fill px-2.5 text-content-muted focus-within:outline-2 focus-within:outline-offset-2 focus-within:outline-border-focus" }, ve = ["aria-label", "placeholder"], be = ["aria-multiselectable", "aria-busy"], ge = {
-  key: 0,
-  role: "presentation"
-}, he = ["aria-selected"], ye = { class: "flex-1 py-2" }, xe = {
-  key: 1,
-  role: "presentation",
-  class: "flex items-center gap-2.5 px-row-inset py-4 text-subheadline text-content-muted",
-  "data-test": "options-loading"
-}, ke = { role: "status" }, _e = {
-  key: 2,
-  role: "presentation",
-  class: "flex flex-col items-start gap-1 px-row-inset py-3",
-  "data-test": "options-failed"
-}, we = {
-  role: "alert",
-  class: "text-subheadline text-content-destructive"
-}, $e = ["id"], Ce = ["aria-labelledby"], Se = ["aria-selected"], Ve = ["disabled", "onClick"], Le = {
-  key: 0,
-  "aria-hidden": "true",
-  class: "flex shrink-0 items-center"
-}, De = { class: "min-w-0 flex-1 text-content-strong" }, qe = {
-  key: 1,
-  class: "shrink-0 text-footnote text-content-muted"
-}, ze = {
-  key: 3,
-  class: "px-4 py-6 text-center text-subheadline text-content-muted"
-}, j = /* @__PURE__ */ G({
-  __name: "OptionList",
-  props: {
-    options: {},
-    modelValue: { default: null },
-    multiple: { type: Boolean, default: !1 },
-    searchFrom: { default: 9 },
-    noneLabel: { default: void 0 },
-    presentation: { default: "grouped" },
-    status: { default: "loaded" }
-  },
-  emits: ["select", "retry"],
-  setup(i, { emit: h }) {
-    const e = i, y = h, { t: m } = W(), n = N(""), c = J(), x = K("root"), s = g(() => e.options.length >= e.searchFrom), C = g(() => ce(pe(e.options, n.value))), L = (p) => e.multiple ? Array.isArray(e.modelValue) && e.modelValue.includes(p.value) : e.modelValue === p.value, u = g(() => e.multiple ? !1 : e.modelValue === null);
-    function w(p) {
-      if (!["ArrowDown", "ArrowUp", "Home", "End"].includes(p.key)) return;
-      const t = [...x.value?.querySelectorAll("[data-option]:not([disabled])") ?? []];
-      if (t.length === 0) return;
-      const _ = t.indexOf(document.activeElement), d = p.key === "Home" ? 0 : p.key === "End" ? t.length - 1 : p.key === "ArrowDown" ? Math.min(_ + 1, t.length - 1) : Math.max(_ - 1, 0);
-      p.key === "ArrowUp" && _ <= 0 ? x.value?.querySelector("[data-option-search]")?.focus() : t[_ === -1 && p.key === "ArrowDown" ? 0 : d]?.focus(), p.preventDefault();
-    }
-    const k = g(() => e.presentation === "grouped"), O = g(() => e.status === "loading"), T = g(() => e.status === "failed");
-    return B(() => e.status, (p, l) => {
-      l !== "loading" || p === "loading" || Q(() => {
-        const t = document.activeElement;
-        (!t || t === document.body || t.getAttribute("role") === "dialog" && !!x.value && t.contains(x.value)) && x.value?.querySelector("[data-option-search], [data-option]:not([disabled])")?.focus({ preventScroll: !0 });
-      });
-    }), (p, l) => (a(), f("div", {
-      ref_key: "root",
-      ref: x,
-      "data-test": "option-list",
-      onKeydown: w
-    }, [
-      s.value ? (a(), f("div", {
-        key: 0,
-        class: b(["sticky top-0 z-10 pb-2", k.value ? "bg-surface-page pt-1" : "bg-surface-cell"])
-      }, [
-        r("label", fe, [
-          q(o(z), {
-            name: "search",
-            size: 16,
-            class: "shrink-0"
-          }),
-          X(r("input", {
-            "onUpdate:modelValue": l[0] || (l[0] = (t) => n.value = t),
-            "data-option-search": "",
-            type: "search",
-            enterkeyhint: "search",
-            autocomplete: "off",
-            autocapitalize: "off",
-            spellcheck: "false",
-            "aria-label": o(m)("core.form.select.search"),
-            placeholder: o(m)("core.form.select.search"),
-            class: "min-w-0 flex-1 border-0 bg-transparent p-0 text-body text-content-strong outline-none placeholder:text-content-disabled focus:ring-0"
-          }, null, 8, ve), [
-            [Y, n.value]
-          ])
-        ])
-      ], 2)) : v("", !0),
-      r("ul", {
-        class: b(["flex flex-col", k.value ? "gap-group-gap" : "gap-2"]),
-        role: "listbox",
-        "aria-multiselectable": e.multiple || void 0,
-        "aria-busy": O.value || void 0
-      }, [
-        e.noneLabel && n.value === "" ? (a(), f("li", ge, [
-          r("ul", {
-            role: "group",
-            class: b(k.value ? "rounded-group bg-surface-cell shadow-group" : "")
-          }, [
-            r("li", {
-              role: "option",
-              "aria-selected": u.value
-            }, [
-              r("button", {
-                type: "button",
-                "data-option": "",
-                class: b(["flex min-h-row w-full cursor-pointer items-center gap-3 px-row-inset text-left text-body hover:bg-fill focus-visible:bg-fill focus-visible:outline-none active:bg-fill", [u.value ? "text-content-strong" : "text-content-muted", k.value ? "rounded-group" : "rounded-control"]]),
-                onClick: l[1] || (l[1] = (t) => y("select", null))
-              }, [
-                r("span", ye, $(e.noneLabel), 1),
-                u.value ? (a(), V(o(z), {
-                  key: 0,
-                  name: "checkCustom",
-                  size: 18,
-                  class: "shrink-0 text-content-link"
-                })) : v("", !0)
-              ], 2)
-            ], 8, he)
-          ], 2)
-        ])) : v("", !0),
-        O.value ? (a(), f("li", xe, [
-          q(o(z), {
-            name: "loader4Line",
-            size: 16,
-            class: "shrink-0 animate-spin text-content-link"
-          }),
-          r("span", ke, $(o(m)("core.form.select.loading")), 1)
-        ])) : T.value ? (a(), f("li", _e, [
-          r("span", we, $(o(m)("core.form.select.load_failed")), 1),
-          r("button", {
-            type: "button",
-            "data-option": "",
-            "data-test": "options-retry",
-            class: "-ml-2 cursor-pointer rounded-control px-2 py-1 text-subheadline font-medium text-content-link hover:bg-fill focus-visible:bg-fill focus-visible:outline-none",
-            onClick: l[2] || (l[2] = (t) => y("retry"))
-          }, $(o(m)("core.actions.retry")), 1)
-        ])) : v("", !0),
-        (a(!0), f(R, null, H(C.value, (t, _) => (a(), f("li", {
-          key: t.title ?? _,
-          role: "presentation"
-        }, [
-          t.title ? (a(), f("p", {
-            key: 0,
-            id: `${o(c)}-${_}`,
-            class: "px-row-inset pb-1.5 text-footnote uppercase tracking-wide text-content-muted"
-          }, $(t.title), 9, $e)) : v("", !0),
-          r("ul", {
-            role: "group",
-            "aria-labelledby": t.title ? `${o(c)}-${_}` : void 0,
-            class: b(k.value ? "rounded-group bg-surface-cell shadow-group" : "")
-          }, [
-            (a(!0), f(R, null, H(t.options, (d) => (a(), f("li", {
-              key: String(d.value),
-              role: "option",
-              "aria-selected": L(d),
-              class: "group/option"
-            }, [
-              r("button", {
-                type: "button",
-                "data-option": "",
-                "data-test": "option",
-                disabled: d.disabled,
-                class: b(["flex w-full cursor-pointer items-stretch gap-3 pl-row-inset text-left text-body hover:bg-fill focus-visible:bg-fill focus-visible:outline-none active:bg-fill disabled:cursor-not-allowed disabled:opacity-45", k.value ? "group-first/option:rounded-t-group group-last/option:rounded-b-group" : "rounded-control"]),
-                onClick: (E) => y("select", d.value)
-              }, [
-                e.multiple ? (a(), f("span", Le, [
-                  r("span", {
-                    class: b(["flex size-5.5 items-center justify-center rounded-full border", L(d) ? "border-control-on bg-control-on text-white" : "border-border-control"])
-                  }, [
-                    L(d) ? (a(), V(o(z), {
-                      key: 0,
-                      name: "checkCustom",
-                      size: 12
-                    })) : v("", !0)
-                  ], 2)
-                ])) : v("", !0),
-                r("span", {
-                  class: b(["flex min-h-row min-w-0 flex-1 items-center gap-3 py-2 pr-row-inset", k.value ? "border-t border-border-separator group-first/option:border-t-0" : ""])
-                }, [
-                  d.dot ? (a(), V(P, {
-                    key: 0,
-                    tone: d.dot,
-                    class: "-mr-1.5"
-                  }, null, 8, ["tone"])) : v("", !0),
-                  r("span", De, $(d.label), 1),
-                  d.description ? (a(), f("span", qe, $(d.description), 1)) : v("", !0),
-                  !e.multiple && L(d) ? (a(), V(o(z), {
-                    key: 2,
-                    name: "checkCustom",
-                    size: 18,
-                    class: "shrink-0 text-content-link"
-                  })) : v("", !0)
-                ], 2)
-              ], 10, Ve)
-            ], 8, Se))), 128))
-          ], 10, Ce)
-        ]))), 128)),
-        C.value.length === 0 && !O.value && !T.value ? (a(), f("li", ze, $(o(m)("core.form.select.no_matches")), 1)) : v("", !0)
-      ], 10, be)
-    ], 544));
-  }
-});
-function We(i) {
-  const h = me(), e = i.for !== void 0;
-  let y = 0;
-  function m() {
-    const n = i.for?.();
-    if (e && n == null) {
-      h.cancel(), h.items.value = [], h.status.value = "idle";
-      return;
-    }
-    h.run(
-      (c) => e ? i.load(n, { signal: c }) : i.load({ signal: c })
-    );
-  }
-  return B(
-    () => i.for?.(),
-    (n, c) => {
-      c != null && y++, m();
-    },
-    { immediate: !0 }
-  ), Z(h.cancel), {
-    get status() {
-      return h.status.value;
-    },
-    get options() {
-      return h.items.value;
-    },
-    get generation() {
-      return y;
-    },
-    reload: m
-  };
-}
-const A = (i) => Array.isArray(i), Ae = [];
-function Oe(i, h) {
-  const e = g(() => {
-    const s = i();
-    return A(s) ? s : s.options;
-  }), y = g(() => {
-    const s = i();
-    return A(s) ? "loaded" : s.status;
-  }), m = g(() => y.value === "loading" || y.value === "failed" ? Ae : e.value), n = g(() => y.value === "loading"), c = i();
-  let x = A(c) ? 0 : c.generation;
-  return B(
-    () => {
-      const s = i();
-      return A(s) ? null : s.status === "loaded" || s.status === "idle" ? s.options : null;
-    },
-    (s) => {
-      const C = i();
-      s === null || A(C) || C.generation === x || (x = C.generation, h(s));
-    }
-  ), { known: e, rows: m, status: y, loading: n, reload: () => {
-    const s = i();
-    A(s) || s.reload();
-  } };
-}
-const Te = ["id", "disabled", "aria-expanded", "aria-required", "aria-invalid", "aria-describedby", "aria-busy"], Fe = ["id", "disabled", "aria-required", "aria-invalid", "aria-describedby", "aria-busy", "onClick"], Be = { class: "max-h-72 overflow-y-auto" }, Je = /* @__PURE__ */ G({
-  __name: "SelectField",
-  props: /* @__PURE__ */ te({
-    label: {},
-    labelHidden: { type: Boolean },
-    hint: {},
-    error: {},
-    required: { type: Boolean },
-    editable: { type: Boolean },
-    disabled: { type: Boolean },
-    lockedReason: {},
-    presentation: {},
-    name: {},
-    options: {},
-    selected: {},
-    placeholder: {},
-    clearable: {},
-    modelValue: {},
-    searchFrom: {}
-  }, { ...de, selected: null, placeholder: void 0, clearable: void 0, modelValue: void 0, searchFrom: 9 }),
-  emits: ["update:modelValue"],
-  setup(i, { emit: h }) {
-    const e = i, y = h, m = N(e.modelValue ?? null);
-    B(() => e.modelValue, (l) => m.value = l ?? null);
-    const n = g({
-      get: () => m.value,
-      set: (l) => {
-        m.value = l, y("update:modelValue", l);
-      }
-    }), { t: c } = W(), x = le(), s = !!se(), C = K("sheet"), L = N(!1), u = Oe(() => e.options, (l) => {
-      n.value !== null && !l.some((t) => t.value === n.value) && (n.value = null);
-    }), w = g(() => u.known.value.find((l) => l.value === n.value) ?? (e.selected?.value === n.value ? e.selected : null)), k = g(() => e.placeholder ?? c("core.form.select.choose")), O = re("popup", () => e.error ? "error" : e.disabled ? "locked" : "rest");
-    function T(l) {
-      n.value = l, C.value?.dismiss();
-    }
-    const p = g(() => [
-      "flex max-w-full min-w-0 items-center gap-1.5 py-1 pl-2.5 pr-2 text-body focus-visible:outline-none",
-      s ? "compact:pl-0 compact:pr-0" : "",
-      e.disabled ? "cursor-not-allowed" : "cursor-pointer"
-    ]);
-    return (l, t) => (a(), V(ie, I(o(ue)(e), {
-      value: w.value?.label ?? null
-    }), M({
-      default: S(({ id: _, describedby: d, invalid: E }) => [
-        r("div", {
-          class: b(["inline-flex max-w-full min-w-0", o(O)])
-        }, [
-          o(x) ? (a(), f("button", {
-            key: 0,
-            id: _,
-            type: "button",
-            disabled: e.disabled,
-            "aria-haspopup": "dialog",
-            "aria-expanded": L.value,
-            "aria-required": e.required || void 0,
-            "aria-invalid": E || void 0,
-            "aria-describedby": d,
-            "aria-busy": o(u).loading.value || void 0,
-            class: b(p.value),
-            onClick: t[0] || (t[0] = (D) => C.value?.present())
-          }, [
-            w.value?.dot ? (a(), V(P, {
-              key: 0,
-              tone: w.value.dot
-            }, null, 8, ["tone"])) : v("", !0),
-            r("span", {
-              class: b(["min-w-0 truncate", w.value ? s ? "text-content-strong compact:text-content-muted" : "text-content-strong" : "text-content-disabled"])
-            }, $(w.value?.label ?? k.value), 3),
-            q(o(z), {
-              name: o(u).loading.value ? "loader4Line" : "expandUpDownLine",
-              size: 14,
-              class: b(["shrink-0 text-content-muted", o(u).loading.value ? "animate-spin" : ""])
-            }, null, 8, ["name", "class"])
-          ], 10, Te)) : (a(), V(ne, {
-            key: 1,
-            label: e.label ?? k.value,
-            width: "md",
-            "match-trigger-width": "",
-            placement: "bottom-start",
-            arrow: !1
-          }, {
-            trigger: S(({ toggle: D, attrs: F }) => [
-              r("button", I({
-                id: _,
-                type: "button"
-              }, F, {
-                "aria-haspopup": "listbox",
-                disabled: e.disabled,
-                "aria-required": e.required || void 0,
-                "aria-invalid": E || void 0,
-                "aria-describedby": d,
-                "aria-busy": o(u).loading.value || void 0,
-                class: p.value,
-                onClick: D
-              }), [
-                w.value?.dot ? (a(), V(P, {
-                  key: 0,
-                  tone: w.value.dot
-                }, null, 8, ["tone"])) : v("", !0),
-                r("span", {
-                  class: b(["min-w-0 truncate", w.value ? "text-content-strong" : "text-content-disabled"])
-                }, $(w.value?.label ?? k.value), 3),
-                q(o(z), {
-                  name: o(u).loading.value ? "loader4Line" : "expandUpDownLine",
-                  size: 14,
-                  class: b(["shrink-0 text-content-muted", o(u).loading.value ? "animate-spin" : ""])
-                }, null, 8, ["name", "class"])
-              ], 16, Fe)
-            ]),
-            default: S(({ dismiss: D }) => [
-              r("div", Be, [
-                q(j, {
-                  options: o(u).rows.value,
-                  status: o(u).status.value,
-                  "model-value": n.value,
-                  "search-from": e.searchFrom,
-                  "none-label": e.clearable ? o(c)("core.form.select.clear") : void 0,
-                  presentation: "plain",
-                  onSelect: (F) => {
-                    n.value = F, D();
-                  },
-                  onRetry: t[1] || (t[1] = (F) => o(u).reload())
-                }, null, 8, ["options", "status", "model-value", "search-from", "none-label", "onSelect"])
-              ])
-            ]),
-            _: 2
-          }, 1032, ["label"]))
-        ], 2),
-        o(x) ? (a(), V(ae, {
-          key: 0,
-          ref_key: "sheet",
-          ref: C,
-          title: e.label ?? k.value,
-          grouped: "",
-          onPresented: t[4] || (t[4] = (D) => L.value = !0),
-          onDismissed: t[5] || (t[5] = (D) => L.value = !1)
-        }, M({
-          default: S(() => [
-            q(j, {
-              options: o(u).rows.value,
-              status: o(u).status.value,
-              "model-value": n.value,
-              "search-from": e.searchFrom,
-              "none-label": e.clearable ? o(c)("core.form.select.clear") : void 0,
-              onSelect: T,
-              onRetry: t[2] || (t[2] = (D) => o(u).reload())
-            }, null, 8, ["options", "status", "model-value", "search-from", "none-label"])
-          ]),
-          _: 2
-        }, [
-          e.clearable && n.value !== null ? {
-            name: "footer",
-            fn: S(() => [
-              q(oe, {
-                prominence: "plain",
-                onClick: t[3] || (t[3] = (D) => T(null))
-              }, {
-                default: S(() => [
-                  ee($(o(c)("core.form.select.clear")), 1)
-                ]),
-                _: 1
-              })
-            ]),
-            key: "0"
-          } : void 0
-        ]), 1032, ["title"])) : v("", !0)
-      ]),
-      _: 2
-    }, [
-      l.$slots.trailing ? {
-        name: "trailing",
-        fn: S(() => [
-          U(l.$slots, "trailing")
-        ]),
-        key: "0"
-      } : void 0,
-      l.$slots.labelTrailing ? {
-        name: "labelTrailing",
-        fn: S(() => [
-          U(l.$slots, "labelTrailing")
-        ]),
-        key: "1"
-      } : void 0,
-      l.$slots.readonly ? {
-        name: "readonly",
-        fn: S(() => [
-          U(l.$slots, "readonly")
-        ]),
-        key: "2"
-      } : void 0
-    ]), 1040, ["value"]));
-  }
-});
-export {
-  Je as _,
-  j as a,
-  We as b,
-  Oe as u
-};