@synopackageland/ui 0.25.21 → 0.25.22

package/dist/modules/components/composite/table-cell/CellText.vue.js

@@ -0,0 +1,82 @@
+import { defineComponent as v, useTemplateRef as p, computed as w, openBlock as t, createElementBlock as n, normalizeClass as a, createBlock as m, resolveDynamicComponent as x, createCommentVNode as i, createElementVNode as b, renderSlot as r, createTextVNode as s, toDisplayString as d } from "vue";
+import h from "../../primitives/tooltip/OverflowTooltip.vue.js";
+import { inOverflowTooltipRegion as g } from "../../../lib/truncation.js";
+const k = ["data-layout", "data-wrap"], $ = ["data-ui-tooltip-hint", "disabled"], z = /* @__PURE__ */ v({
+  __name: "CellText",
+  props: {
+    text: {},
+    secondary: {},
+    layout: { default: "stacked" },
+    icon: {},
+    openLabel: {},
+    openDisabled: { type: Boolean, default: !1 },
+    wrap: { type: Boolean, default: !1 }
+  },
+  emits: ["open"],
+  setup(e) {
+    const y = e, f = !g(), u = p("root"), o = w(() => y.wrap ? "whitespace-normal [overflow-wrap:anywhere]" : "truncate");
+    return (l, c) => (t(), n("div", {
+      ref_key: "root",
+      ref: u,
+      class: a(["flex min-w-0 gap-[var(--ui-space-2)]", e.wrap ? "items-start" : "items-center"]),
+      "data-layout": e.layout,
+      "data-wrap": e.wrap ? "" : void 0,
+      "data-syno-pkg-land-ui": ""
+    }, [
+      e.icon ? (t(), m(x(e.icon), {
+        key: 0,
+        class: a(["size-4 shrink-0 text-[var(--ui-text-secondary)]", e.wrap && "mt-0.5"]),
+        "aria-hidden": "true"
+      }, null, 8, ["class"])) : i("", !0),
+      b("div", {
+        "data-ui-cell-lines": "",
+        class: a([
+          "min-w-0 flex-1",
+          e.layout === "inline" ? "flex items-baseline gap-x-[var(--ui-space-2)]" : "flex flex-col gap-y-0.5"
+        ])
+      }, [
+        e.openLabel ? (t(), n("button", {
+          key: 0,
+          type: "button",
+          "data-ui-cell-primary": "",
+          "data-ui-tooltip-hint": e.openLabel,
+          disabled: e.openDisabled,
+          class: a([o.value, "m-0 -mx-0.5 min-w-0 max-w-full rounded-[var(--ui-radius-inner)] border-0 bg-transparent px-0.5 py-0 text-left text-[length:inherit] leading-5 text-[var(--ui-primary)] outline-none hover:underline focus-visible:shadow-[var(--ui-shadow-focus)] disabled:cursor-default disabled:opacity-50 disabled:hover:no-underline"]),
+          onClick: c[0] || (c[0] = (C) => l.$emit("open"))
+        }, [
+          r(l.$slots, "default", {}, () => [
+            s(d(e.text), 1)
+          ])
+        ], 10, $)) : (t(), n("span", {
+          key: 1,
+          "data-ui-cell-primary": "",
+          class: a([o.value, "min-w-0 leading-5 text-[var(--ui-text)]"])
+        }, [
+          r(l.$slots, "default", {}, () => [
+            s(d(e.text), 1)
+          ])
+        ], 2)),
+        e.secondary || l.$slots.secondary ? (t(), n("span", {
+          key: 2,
+          "data-ui-cell-secondary": "",
+          class: a([
+            "min-w-0 text-[length:var(--ui-font-size-sm)] leading-4 text-[var(--ui-text-secondary)]",
+            o.value,
+            e.layout === "inline" && "shrink-0"
+          ])
+        }, [
+          r(l.$slots, "secondary", {}, () => [
+            s(d(e.secondary), 1)
+          ])
+        ], 2)) : i("", !0)
+      ], 2),
+      f ? (t(), m(h, {
+        key: 1,
+        target: u.value
+      }, null, 8, ["target"])) : i("", !0)
+    ], 10, k));
+  }
+});
+export {
+  z as default
+};

package/dist/modules/components/composite/table-cell/CellText2.vue.js

@@ -0,0 +1,4 @@
+import f from "./CellText.vue.js";
+export {
+  f as default
+};

package/dist/modules/components/composite/tag-editor/TagEditor.vue.js

@@ -0,0 +1,164 @@
+import { defineComponent as K, ref as g, watch as z, useTemplateRef as y, useId as G, computed as H, onBeforeUnmount as J, openBlock as i, createElementBlock as c, unref as u, Fragment as k, renderList as L, createBlock as N, createVNode as O, createTextVNode as Q, toDisplayString as U, createCommentVNode as W, createElementVNode as _, withModifiers as A, withDirectives as I, vModelText as X, vShow as Y, nextTick as R } from "vue";
+import { useLocalizedDefaults as Z, useUiText as ee } from "../../../i18n/text.js";
+import { Plus as ae } from "@lucide/vue";
+import S from "../../primitives/tag/Tag.vue.js";
+const te = ["data-editing"], oe = ["disabled", "aria-label"], le = {
+  key: 0,
+  class: "inline-flex items-center gap-1 text-[length:var(--ui-font-size)] text-[var(--ui-text-muted)]"
+}, re = {
+  key: 1,
+  class: "flex flex-col gap-1"
+}, ne = ["aria-label", "aria-expanded", "aria-controls", "aria-activedescendant", "placeholder"], ie = ["id", "aria-label"], ue = ["id", "aria-selected", "data-kind", "onPointerenter", "onClick"], fe = /* @__PURE__ */ K({
+  __name: "TagEditor",
+  props: {
+    modelValue: { default: () => [] },
+    options: { default: () => [] },
+    allowCreate: { type: Boolean, default: !0 },
+    save: { type: Function, default: void 0 },
+    disabled: { type: Boolean, default: !1 },
+    label: {},
+    placeholder: {}
+  },
+  emits: ["update:modelValue", "error", "open", "close"],
+  setup(C, { emit: F }) {
+    const l = Z(C, { label: "Tags", placeholder: "Add tag" }), M = ee(), f = F, o = g([...l.modelValue]);
+    z(() => l.modelValue, (e) => {
+      o.value = [...e];
+    });
+    const p = g(!1), v = g(""), s = g(0), V = y("root"), m = y("input"), $ = y("readButton"), w = G(), r = H(() => {
+      const e = v.value.trim(), t = e.toLocaleLowerCase(), a = new Set(o.value.map((d) => d.toLocaleLowerCase())), n = l.options.filter((d) => !a.has(d.toLocaleLowerCase()) && d.toLocaleLowerCase().includes(t)).map((d) => ({ kind: "option", value: d })), h = a.has(t) || l.options.some((d) => d.toLocaleLowerCase() === t);
+      return e && l.allowCreate && !h ? [...n, { kind: "create", value: e }] : n;
+    });
+    z(r, () => {
+      s.value = 0;
+    });
+    let B = 0;
+    async function D(e) {
+      const t = [...o.value], a = ++B;
+      if (o.value = e, f("update:modelValue", e), !!l.save)
+        try {
+          await l.save(e, t);
+        } catch (n) {
+          a === B && (o.value = t, f("update:modelValue", t)), f("error", n);
+        }
+    }
+    function b(e) {
+      const t = e.trim();
+      !t || o.value.some((a) => a.toLocaleLowerCase() === t.toLocaleLowerCase()) || (v.value = "", D([...o.value, t]));
+    }
+    function E(e) {
+      D(o.value.filter((t, a) => a !== e)), m.value?.focus();
+    }
+    function x(e) {
+      V.value?.contains(e.target) || P(!1);
+    }
+    async function j() {
+      l.disabled || p.value || (p.value = !0, f("open"), document.addEventListener("pointerdown", x, !0), await R(), m.value?.focus());
+    }
+    async function P(e = !0) {
+      p.value && (p.value = !1, v.value = "", document.removeEventListener("pointerdown", x, !0), f("close"), e && (await R(), $.value?.focus()));
+    }
+    J(() => document.removeEventListener("pointerdown", x, !0));
+    function q(e) {
+      if (e.key === "Escape")
+        e.preventDefault(), e.stopPropagation(), P();
+      else if (e.key === "Enter") {
+        e.preventDefault();
+        const t = r.value[s.value];
+        t ? b(t.value) : l.allowCreate && b(v.value);
+      } else e.key === "Backspace" && !v.value && o.value.length ? (e.preventDefault(), E(o.value.length - 1)) : e.key === "ArrowDown" && r.value.length ? (e.preventDefault(), s.value = (s.value + 1) % r.value.length) : e.key === "ArrowUp" && r.value.length && (e.preventDefault(), s.value = (s.value - 1 + r.value.length) % r.value.length);
+    }
+    const T = (e) => `${w}-${e}`;
+    return (e, t) => (i(), c("div", {
+      ref_key: "root",
+      ref: V,
+      class: "ui-tag-editor min-w-0",
+      "data-editing": p.value || void 0,
+      "data-ui-tag-editor": "",
+      "data-syno-pkg-land-ui": ""
+    }, [
+      p.value ? (i(), c("div", re, [
+        _("div", {
+          class: "flex min-h-[var(--ui-control-md)] w-full min-w-0 flex-wrap items-center gap-1 rounded-[var(--ui-radius-control)] border border-[var(--ui-primary)] bg-[var(--ui-control-bg)] px-1 py-0.5 shadow-[var(--ui-shadow-focus)]",
+          "data-ui-tag-editor-field": "",
+          onClick: t[1] || (t[1] = A((a) => m.value?.focus(), ["self"]))
+        }, [
+          (i(!0), c(k, null, L(o.value, (a, n) => (i(), N(S, {
+            key: a,
+            label: a,
+            tooltip: !1,
+            removable: "",
+            onRemove: (h) => E(n)
+          }, null, 8, ["label", "onRemove"]))), 128)),
+          I(_("input", {
+            ref_key: "input",
+            ref: m,
+            "onUpdate:modelValue": t[0] || (t[0] = (a) => v.value = a),
+            type: "text",
+            role: "combobox",
+            "aria-label": u(l).label,
+            "aria-expanded": r.value.length > 0,
+            "aria-controls": u(w),
+            "aria-activedescendant": r.value.length ? T(s.value) : void 0,
+            "aria-autocomplete": "list",
+            placeholder: o.value.length ? "" : u(l).placeholder,
+            class: "h-6 min-w-16 flex-1 border-0 bg-transparent px-1 text-[length:var(--ui-font-size)] text-[var(--ui-text)] outline-none placeholder:text-[var(--ui-text-muted)]",
+            "data-ui-tag-editor-input": "",
+            onKeydown: q
+          }, null, 40, ne), [
+            [X, v.value]
+          ])
+        ]),
+        I(_("ul", {
+          id: u(w),
+          role: "listbox",
+          "aria-label": u(l).label,
+          class: "m-0 flex max-h-48 list-none flex-col overflow-y-auto rounded-[var(--ui-radius-popover)] border border-[var(--ui-border)] bg-[var(--ui-surface-raised)] p-1 shadow-[var(--ui-shadow-menu)]",
+          "data-ui-tag-editor-list": ""
+        }, [
+          (i(!0), c(k, null, L(r.value, (a, n) => (i(), c("li", {
+            id: T(n),
+            key: `${a.kind}-${a.value}`,
+            role: "option",
+            "aria-selected": n === s.value,
+            "data-kind": a.kind,
+            class: "flex min-h-7 cursor-default items-center rounded-[var(--ui-radius-inner)] px-2 text-[length:var(--ui-font-size)] aria-selected:bg-[var(--ui-primary-soft)] [@media(pointer:coarse)]:min-h-9",
+            "data-ui-tag-editor-option": "",
+            onPointerdown: t[2] || (t[2] = A(() => {
+            }, ["prevent"])),
+            onPointerenter: (h) => s.value = n,
+            onClick: (h) => b(a.value)
+          }, U(a.kind === "create" ? u(M)("Create “{name}”", { name: a.value }) : a.value), 41, ue))), 128))
+        ], 8, ie), [
+          [Y, r.value.length]
+        ])
+      ])) : (i(), c("button", {
+        key: 0,
+        ref_key: "readButton",
+        ref: $,
+        type: "button",
+        disabled: C.disabled,
+        "aria-label": o.value.length ? `${u(l).label}: ${o.value.join(", ")}` : u(l).label,
+        class: "flex min-h-[var(--ui-control-md)] w-full min-w-0 flex-wrap items-center gap-1 rounded-[var(--ui-radius-control)] px-1 py-0.5 text-start outline-none enabled:hover:bg-[var(--ui-surface-hover)] focus-visible:shadow-[var(--ui-shadow-focus)] disabled:opacity-50",
+        "data-ui-tag-editor-read": "",
+        onClick: j
+      }, [
+        (i(!0), c(k, null, L(o.value, (a) => (i(), N(S, {
+          key: a,
+          label: a,
+          tooltip: !1
+        }, null, 8, ["label"]))), 128)),
+        o.value.length ? W("", !0) : (i(), c("span", le, [
+          O(u(ae), {
+            class: "size-3.5",
+            "aria-hidden": "true"
+          }),
+          Q(U(u(l).placeholder), 1)
+        ]))
+      ], 8, oe))
+    ], 8, te));
+  }
+});
+export {
+  fe as default
+};

package/dist/modules/components/composite/tag-editor/TagEditor2.vue.js

@@ -0,0 +1,4 @@
+import f from "./TagEditor.vue.js";
+export {
+  f as default
+};

package/dist/modules/components/composite/tag-picker/TagPicker.vue.js

@@ -0,0 +1,316 @@
+import { defineComponent as ge, ref as T, watch as R, computed as s, useTemplateRef as J, nextTick as he, openBlock as r, createElementBlock as o, mergeProps as A, Fragment as L, renderList as N, createBlock as $, normalizeClass as O, toDisplayString as v, createCommentVNode as c, unref as u, createVNode as p, createTextVNode as Q, withCtx as x, createSlots as W, renderSlot as X, normalizeProps as Y, guardReactiveProps as Z, createElementVNode as xe } from "vue";
+import { Plus as P, ChevronDown as ye } from "@lucide/vue";
+import be from "../../primitives/popover/Popover.vue.js";
+import ke from "../../primitives/sheet/BottomSheet.vue.js";
+import K from "../../primitives/tag/Tag.vue.js";
+import { useFormField as we } from "../form/context.js";
+import { useFormControl as _e } from "../../../composables/formControl.js";
+import { useGroupDisabled as Ce } from "../../../composables/formGroup.js";
+import { usePhoneSurface as ze, accessibleName as Te } from "../../../composables/phoneSurface.js";
+import { useLocalizedDefaults as Le, useUiText as $e } from "../../../i18n/text.js";
+import ee from "./TagPickerList.vue.js";
+import { normalizeTagOption as Pe } from "./tagPicker.js";
+const Be = {
+  key: 0,
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-secondary)]",
+  "data-ui-tag-picker-more": ""
+}, De = {
+  key: 1,
+  class: "inline-flex items-center gap-0.5 text-[length:var(--ui-font-size-sm)] whitespace-nowrap text-[var(--ui-text-secondary)] group-hover:text-[var(--ui-text)]",
+  "data-ui-tag-picker-add": ""
+}, Ve = {
+  key: 2,
+  class: "inline-grid size-5 shrink-0 place-items-center rounded-[var(--ui-radius-inner)] text-[var(--ui-text-secondary)] group-hover:bg-[var(--ui-state-hover)]",
+  "aria-hidden": "true"
+}, Fe = { class: "flex min-w-0 flex-1 flex-wrap items-center gap-1" }, Re = {
+  key: 0,
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-secondary)]",
+  "data-ui-tag-picker-more": ""
+}, Ae = {
+  key: 1,
+  class: "truncate pl-0.5 text-[var(--ui-text-muted)]",
+  "data-ui-tag-picker-placeholder": ""
+}, Ne = {
+  key: 0,
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-secondary)] tabular-nums",
+  "data-ui-tag-picker-count": ""
+}, Oe = {
+  key: 0,
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-secondary)]",
+  "data-ui-tag-picker-more": ""
+}, Ke = {
+  key: 1,
+  class: "inline-flex items-center gap-0.5 text-[length:var(--ui-font-size-sm)] whitespace-nowrap text-[var(--ui-text-secondary)] group-hover:text-[var(--ui-text)]",
+  "data-ui-tag-picker-add": ""
+}, Se = {
+  key: 2,
+  class: "inline-grid size-5 shrink-0 place-items-center rounded-[var(--ui-radius-inner)] text-[var(--ui-text-secondary)] group-hover:bg-[var(--ui-state-hover)]",
+  "aria-hidden": "true"
+}, Ye = /* @__PURE__ */ ge({
+  inheritAttrs: !1,
+  __name: "TagPicker",
+  props: {
+    modelValue: { default: () => [] },
+    options: { default: () => [] },
+    loading: { type: Boolean, default: !1 },
+    allowCreate: { type: Boolean, default: !1 },
+    createFilter: { type: Function, default: void 0 },
+    max: { default: void 0 },
+    single: { type: Boolean, default: !1 },
+    variant: { default: "field" },
+    placeholder: {},
+    label: {},
+    disabled: { type: Boolean, default: !1 },
+    invalid: { type: Boolean, default: !1 },
+    chipLimit: { default: void 0 },
+    wrap: { type: Boolean, default: !1 },
+    save: { type: Function, default: void 0 },
+    width: { default: "300px" },
+    searchPlaceholder: {},
+    emptyText: {},
+    loadingText: {},
+    removeLabel: {}
+  },
+  emits: ["update:modelValue", "create", "error", "open", "close"],
+  setup(ae, { emit: te }) {
+    const e = ae, le = Le(e, { removeLabel: "Remove" }), m = te, h = $e(), re = we(), n = Ce(() => e.disabled), t = T([...e.modelValue]);
+    R(() => e.modelValue, (a) => {
+      t.value = [...a];
+    });
+    const y = s(() => e.placeholder ?? (e.variant === "inline" ? h("Add tag") : e.single ? h("Choose a tag") : h("Choose tags"))), { controlAttrs: ie, wrapperAttrs: oe, changed: ne, invalid: se } = _e({
+      value: () => t.value,
+      disabled: () => n.value,
+      invalid: () => e.invalid,
+      ariaLabel: () => e.label ?? (re ? void 0 : e.single ? h("Choose a tag") : h("Choose tags"))
+    }), d = T(!1), b = T(e.variant === "field"), k = ze({ list: !0, search: !0 }), ue = s(() => d.value && k.value === "popover"), S = s(() => d.value && k.value === "sheet"), w = J("trigger"), E = T("");
+    R(d, (a) => {
+      a ? (k.value === "sheet" && (E.value = e.label || Te(w.value) || y.value), m("open")) : m("close");
+    });
+    const de = s(() => {
+      const a = /* @__PURE__ */ new Map();
+      for (const i of e.options) {
+        const l = Pe(i);
+        a.set(l.value, l.label);
+      }
+      return a;
+    }), _ = (a) => de.value.get(a) ?? a, U = s(() => !e.single && e.max !== void 0), ve = s(() => U.value && t.value.length >= e.max), ce = s(() => e.chipLimit ?? (e.variant === "inline" ? 3 : 6)), C = s(() => t.value.slice(0, ce.value)), f = s(() => t.value.length - C.value.length), pe = s(() => t.value.map(_).join(", "));
+    let j = 0;
+    async function g(a) {
+      const i = [...t.value], l = ++j;
+      if (t.value = a, ne(a), m("update:modelValue", a), !!e.save)
+        try {
+          await e.save(a, i);
+        } catch (I) {
+          l === j && (t.value = i, m("update:modelValue", i)), m("error", I);
+        }
+    }
+    function G(a, i) {
+      if (i === "create" && m("create", a), e.single) {
+        g(t.value[0] === a ? [] : [a]), d.value = !1;
+        return;
+      }
+      t.value.includes(a) ? g(t.value.filter((l) => l !== a)) : ve.value || g([...t.value, a]);
+    }
+    function z(a) {
+      g(t.value.filter((i) => i !== a));
+    }
+    function B(a) {
+      a && n.value || (d.value = a);
+    }
+    function M() {
+      n.value || b.value || (b.value = !0, d.value = !0);
+    }
+    function D(a) {
+      a.target !== a.currentTarget || n.value || (a.key === "Enter" || a.key === " " || a.key === "ArrowDown" ? (a.preventDefault(), b.value ? B(!0) : M()) : a.key === "Backspace" && e.variant === "field" && t.value.length && !e.single && (a.preventDefault(), z(t.value[t.value.length - 1])));
+    }
+    function q(a) {
+      n.value && (a.stopPropagation(), a.preventDefault());
+    }
+    const fe = J("sheetList");
+    R(S, (a) => {
+      a && he(() => fe.value?.focus());
+    });
+    const V = s(() => ({
+      ...ie(),
+      ...oe(),
+      role: e.variant === "field" ? "combobox" : "button",
+      "aria-haspopup": "dialog",
+      "aria-expanded": d.value,
+      "aria-disabled": n.value || void 0,
+      tabindex: n.value ? -1 : 0,
+      title: f.value ? pe.value : void 0
+    })), me = s(() => [
+      "flex min-h-[var(--ui-control-md)] w-full min-w-0 items-center gap-1 rounded-[var(--ui-radius-control)] border bg-[var(--ui-surface)] py-0.5 pr-2 pl-1 text-[length:var(--ui-font-size-control)] text-[var(--ui-text)] outline-none transition-[border-color,box-shadow] duration-[var(--ui-motion-fast)] ease-[var(--ui-motion-ease)]",
+      se.value ? "border-[var(--ui-danger)]" : d.value ? "border-[var(--ui-primary)] shadow-[var(--ui-shadow-focus-field)]" : "border-[var(--ui-border)] focus-visible:border-[var(--ui-primary)] focus-visible:shadow-[var(--ui-shadow-focus-field)]",
+      n.value ? "cursor-default bg-[var(--ui-surface-subtle)] text-[var(--ui-text-disabled)]" : "cursor-pointer hover:border-[var(--ui-control-border-hover)]"
+    ]), H = s(() => [
+      "inline-flex min-h-6 max-w-full min-w-0 items-center gap-1 rounded-[var(--ui-radius-inner)] outline-none focus-visible:shadow-[var(--ui-shadow-focus)]",
+      e.wrap ? "flex-wrap" : "overflow-hidden",
+      n.value ? "cursor-default" : "group cursor-pointer"
+    ]), F = s(() => e.variant === "inline" && !e.wrap ? "min-w-14 max-w-[180px] shrink" : "max-w-[180px]");
+    return (a, i) => b.value ? (r(), o(L, { key: 1 }, [
+      p(be, {
+        open: ue.value,
+        align: "start",
+        width: e.width,
+        "onUpdate:open": B
+      }, {
+        trigger: x(() => [
+          e.variant === "field" ? (r(), o("div", A({
+            key: 0,
+            ref_key: "trigger",
+            ref: w
+          }, V.value, {
+            class: me.value,
+            "data-ui-tag-picker": "",
+            "data-syno-pkg-land-ui": "",
+            onKeydown: D,
+            onClickCapture: q
+          }), [
+            xe("span", Fe, [
+              (r(!0), o(L, null, N(C.value, (l) => (r(), $(K, {
+                key: l,
+                label: _(l),
+                class: O(F.value),
+                removable: !u(n),
+                "remove-label": u(le).removeLabel,
+                onRemove: (I) => z(l)
+              }, null, 8, ["label", "class", "removable", "remove-label", "onRemove"]))), 128)),
+              f.value ? (r(), o("span", Re, "+" + v(f.value), 1)) : c("", !0),
+              t.value.length ? c("", !0) : (r(), o("span", Ae, v(y.value), 1))
+            ]),
+            U.value ? (r(), o("span", Ne, v(t.value.length) + " / " + v(e.max), 1)) : c("", !0),
+            p(u(ye), {
+              class: "size-4 shrink-0 text-[var(--ui-text-secondary)]",
+              "aria-hidden": "true"
+            })
+          ], 16)) : (r(), o("div", A({
+            key: 1,
+            ref_key: "trigger",
+            ref: w
+          }, V.value, {
+            class: H.value,
+            "data-ui-tag-picker": "",
+            "data-ui-tag-picker-inline": "",
+            "data-syno-pkg-land-ui": "",
+            onKeydown: D,
+            onClickCapture: q
+          }), [
+            (r(!0), o(L, null, N(C.value, (l) => (r(), $(K, {
+              key: l,
+              label: _(l),
+              tooltip: !1,
+              class: O(F.value)
+            }, null, 8, ["label", "class"]))), 128)),
+            f.value ? (r(), o("span", Oe, "+" + v(f.value), 1)) : c("", !0),
+            !t.value.length && !u(n) ? (r(), o("span", Ke, [
+              p(u(P), {
+                class: "size-3",
+                "aria-hidden": "true"
+              }),
+              Q(v(y.value), 1)
+            ])) : !u(n) && e.wrap ? (r(), o("span", Se, [
+              p(u(P), { class: "size-3" })
+            ])) : c("", !0)
+          ], 16))
+        ]),
+        default: x(() => [
+          p(ee, {
+            "model-value": t.value,
+            options: e.options,
+            loading: e.loading,
+            "allow-create": e.allowCreate,
+            "create-filter": e.createFilter,
+            max: e.max,
+            single: e.single,
+            label: e.label,
+            "search-placeholder": e.searchPlaceholder,
+            "empty-text": e.emptyText,
+            "loading-text": e.loadingText,
+            "data-ui-tag-picker-panel": "",
+            onPick: G,
+            onClear: i[0] || (i[0] = (l) => g([])),
+            onRemoveLast: i[1] || (i[1] = (l) => z(t.value[t.value.length - 1]))
+          }, W({ _: 2 }, [
+            a.$slots.limit ? {
+              name: "limit",
+              fn: x((l) => [
+                X(a.$slots, "limit", Y(Z(l)))
+              ]),
+              key: "0"
+            } : void 0
+          ]), 1032, ["model-value", "options", "loading", "allow-create", "create-filter", "max", "single", "label", "search-placeholder", "empty-text", "loading-text"])
+        ]),
+        _: 3
+      }, 8, ["open", "width"]),
+      u(k) === "sheet" ? (r(), $(ke, {
+        key: 0,
+        open: S.value,
+        title: E.value,
+        "onUpdate:open": B
+      }, {
+        default: x(() => [
+          p(ee, {
+            ref: "sheetList",
+            "model-value": t.value,
+            options: e.options,
+            loading: e.loading,
+            "allow-create": e.allowCreate,
+            "create-filter": e.createFilter,
+            max: e.max,
+            single: e.single,
+            label: e.label,
+            "search-placeholder": e.searchPlaceholder,
+            "empty-text": e.emptyText,
+            "loading-text": e.loadingText,
+            "visible-rows": 9,
+            "data-ui-tag-picker-panel": "",
+            onPick: G,
+            onClear: i[2] || (i[2] = (l) => g([])),
+            onRemoveLast: i[3] || (i[3] = (l) => z(t.value[t.value.length - 1]))
+          }, W({ _: 2 }, [
+            a.$slots.limit ? {
+              name: "limit",
+              fn: x((l) => [
+                X(a.$slots, "limit", Y(Z(l)))
+              ]),
+              key: "0"
+            } : void 0
+          ]), 1032, ["model-value", "options", "loading", "allow-create", "create-filter", "max", "single", "label", "search-placeholder", "empty-text", "loading-text"])
+        ]),
+        _: 3
+      }, 8, ["open", "title"])) : c("", !0)
+    ], 64)) : (r(), o("div", A({
+      key: 0,
+      ref_key: "trigger",
+      ref: w
+    }, V.value, {
+      class: H.value,
+      "data-ui-tag-picker": "",
+      "data-ui-tag-picker-inline": "",
+      "data-syno-pkg-land-ui": "",
+      onClick: M,
+      onKeydown: D
+    }), [
+      (r(!0), o(L, null, N(C.value, (l) => (r(), $(K, {
+        key: l,
+        label: _(l),
+        tooltip: !1,
+        class: O(F.value)
+      }, null, 8, ["label", "class"]))), 128)),
+      f.value ? (r(), o("span", Be, "+" + v(f.value), 1)) : c("", !0),
+      !t.value.length && !u(n) ? (r(), o("span", De, [
+        p(u(P), {
+          class: "size-3",
+          "aria-hidden": "true"
+        }),
+        Q(v(y.value), 1)
+      ])) : !u(n) && e.wrap ? (r(), o("span", Ve, [
+        p(u(P), { class: "size-3" })
+      ])) : c("", !0)
+    ], 16));
+  }
+});
+export {
+  Ye as default
+};

package/dist/modules/components/composite/tag-picker/TagPicker2.vue.js

@@ -0,0 +1,4 @@
+import f from "./TagPicker.vue.js";
+export {
+  f as default
+};