@wssto2/vue-core 0.4.18 → 0.4.19

package/dist/SelectField.vue_vue_type_script_setup_true_lang-DkbBJpYX.js

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