@synopackageland/ui 0.25.20 → 0.25.22

package/dist/modules/components/primitives/pagination/Pagination.vue.js

@@ -0,0 +1,313 @@
+import { defineComponent as oe, computed as i, ref as P, watch as ne, onBeforeUnmount as ie, openBlock as n, createElementBlock as u, renderSlot as k, createTextVNode as D, toDisplayString as x, createElementVNode as $, createVNode as r, withCtx as c, unref as f, createBlock as z, createCommentVNode as w, Fragment as I, renderList as ue, normalizeClass as re } from "vue";
+import { useUiText as de } from "../../../i18n/text.js";
+import { useUiLocale as ve } from "../../../i18n/locale.js";
+import { ChevronLeft as q, ChevronRight as G, RefreshCw as H, ChevronsLeft as pe, ChevronsRight as ce } from "@lucide/vue";
+import g from "../button/IconButton.vue.js";
+import fe from "../select/Select.vue.js";
+import { usePhonePresentation as ge } from "../sheet/phone.js";
+import me from "./PaginationSheet.vue.js";
+import { localizedPaginationLabels as he } from "./labels.js";
+import { pageCountOf as be, clampPage as J, pageWindow as xe, formatTotalText as we } from "./model.js";
+const ke = ["aria-label"], ye = {
+  key: 0,
+  class: "max-w-full min-w-0 flex-[1_0_auto] truncate text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-secondary)]"
+}, Pe = {
+  key: 1,
+  class: "min-w-0 flex-1"
+}, ze = { class: "flex shrink-0 items-center gap-[calc(var(--ui-tap-gap,0px)*1.25)]" }, _e = {
+  key: 1,
+  "aria-current": "page",
+  class: "whitespace-nowrap px-2 tabular-nums"
+}, Ce = ["aria-label"], Se = {
+  key: 0,
+  class: "min-w-0 flex-1 truncate text-[var(--ui-text-secondary)]"
+}, Be = {
+  key: 1,
+  class: "min-w-0 flex-1"
+}, $e = { class: "flex shrink-0 items-center gap-[max(4px,calc(var(--ui-hit-min,0px)-var(--ui-control-sm)))]" }, Ne = {
+  key: 0,
+  "aria-hidden": "true",
+  class: "px-0.5 text-[var(--ui-text-muted)]"
+}, Te = ["aria-current", "aria-label", "onClick"], Le = {
+  key: 2,
+  class: "min-w-6 px-1 text-center",
+  "aria-current": "page"
+}, Ve = {
+  key: 2,
+  class: "flex shrink-0 items-center gap-2 text-[var(--ui-text-secondary)]"
+}, Ue = { class: "sr-only" }, Me = { class: "block w-24" }, He = /* @__PURE__ */ oe({
+  __name: "Pagination",
+  props: {
+    modelValue: { default: 1 },
+    total: { default: 0 },
+    pageSize: { default: 10 },
+    hasNext: { type: Boolean, default: void 0 },
+    hasPrev: { type: Boolean, default: void 0 },
+    start: { default: 0 },
+    end: { default: 0 },
+    selectedCount: { default: 0 },
+    filteredCount: { default: 0 },
+    switchPage: { type: Boolean, default: !0 },
+    pageShiftUnit: { default: 5 },
+    showTotal: { type: Boolean, default: !0 },
+    itemsPerPage: { type: [Boolean, Array], default: !1 },
+    mode: { default: "normal" },
+    hasFirstBtn: { type: Boolean, default: !0 },
+    hasLastBtn: { type: Boolean, default: !0 },
+    endless: { type: Boolean, default: !1 },
+    autoLess: { type: Boolean, default: !0 },
+    lessWidth: { default: 480 },
+    maxPageButtons: { default: 7 },
+    refresh: { type: Boolean, default: !0 },
+    groupDigits: { type: Boolean, default: !0 },
+    totalTextMode: { default: "total" },
+    totalTextFormat: { default: () => ({}) },
+    labels: { default: () => ({}) },
+    beforeSwitchPage: {}
+  },
+  emits: ["update:modelValue", "update:pageSize", "change", "changePage", "refresh"],
+  setup(K, { expose: Q, emit: X }) {
+    const Y = de(), e = K, v = X, Z = ve(() => {
+    }), m = (t) => e.groupDigits ? new Intl.NumberFormat(Z.value).format(t) : String(t), o = i(() => ({ ...he(Y), ...e.labels })), h = (t) => {
+      const a = Number(t);
+      return Number.isFinite(a) ? a : 0;
+    }, b = i(() => Math.max(0, h(e.total))), d = i(() => be(b.value, e.pageSize)), l = i(
+      () => e.endless ? Math.max(1, Math.trunc(h(e.modelValue))) : J(h(e.modelValue), d.value)
+    ), N = i(() => h(e.start) || (l.value - 1) * e.pageSize + 1), T = i(() => h(e.end) || Math.min(l.value * e.pageSize, b.value)), L = i(() => e.hasPrev ?? l.value > 1), V = i(() => e.hasNext ?? (e.endless ? !0 : l.value < d.value)), ee = i(
+      () => e.endless ? [] : xe(l.value, d.value, e.maxPageButtons).map(
+        (t) => t === "ellipsis" ? { kind: "ellipsis" } : { kind: "page", page: t }
+      )
+    ), _ = P(), C = P(0), S = i(() => e.mode === "less" || e.autoLess && C.value > 0 && C.value < e.lessWidth), ae = i(() => !e.endless && !S.value), O = i(() => {
+      const t = e.totalTextFormat[e.totalTextMode] ?? o.value.totalText[e.totalTextMode];
+      return we(t, {
+        total: m(b.value),
+        start: m(N.value),
+        end: m(T.value),
+        filteredCount: m(h(e.filteredCount)),
+        selectedCount: m(h(e.selectedCount))
+      });
+    }), W = i(() => e.showTotal && !e.endless), B = i(
+      () => (Array.isArray(e.itemsPerPage) ? e.itemsPerPage : []).map((t) => ({ label: t.label, value: String(t.value) }))
+    ), te = ge(), le = i(() => e.mode === "phone" || te.value), U = P(!1), M = i(() => e.endless ? o.value.page(l.value) : o.value.pageOf(l.value, d.value)), R = i(() => e.switchPage && (B.value.length > 0 || !e.endless && d.value > 1));
+    let y;
+    ne(_, (t) => {
+      y?.disconnect(), y = void 0, t && (C.value = t.clientWidth, !(typeof ResizeObserver > "u") && (y = new ResizeObserver(() => {
+        C.value = _.value?.clientWidth ?? 0;
+      }), y.observe(t)));
+    }, { flush: "post" }), ie(() => y?.disconnect());
+    async function p(t) {
+      if (!e.switchPage) return;
+      const a = e.endless ? Math.max(1, Math.trunc(t)) : J(t, d.value);
+      a !== l.value && (e.beforeSwitchPage && await e.beforeSwitchPage({ pageNum: a, pageSize: e.pageSize }) === !1 || (v("update:modelValue", a), v("change", a), v("changePage", { pageNum: a, pageSize: e.pageSize })));
+    }
+    function A(t) {
+      const a = Number(t);
+      !Number.isFinite(a) || a === e.pageSize || (v("update:pageSize", a), l.value !== 1 && (v("update:modelValue", 1), v("change", 1)), v("changePage", { pageNum: 1, pageSize: a }));
+    }
+    const F = P(null), E = P(null);
+    function j(t) {
+      const a = t?.$el;
+      a && !a.hasAttribute("disabled") && a.focus();
+    }
+    return Q({
+      focusPrevious: () => j(F.value),
+      focusNext: () => j(E.value)
+    }), (t, a) => le.value ? (n(), u("nav", {
+      key: 0,
+      ref_key: "rootEl",
+      ref: _,
+      "aria-label": o.value.nav(b.value, e.endless),
+      class: "flex min-w-0 flex-wrap items-center justify-end gap-x-2 text-[length:var(--ui-font-size)] text-[var(--ui-text)]",
+      "data-ui-pagination-phone": "",
+      "data-syno-pkg-land-ui": ""
+    }, [
+      W.value ? (n(), u("div", ye, [
+        k(t.$slots, "total", {
+          total: b.value,
+          page: l.value,
+          pageCount: d.value,
+          start: N.value,
+          end: T.value
+        }, () => [
+          D(x(O.value), 1)
+        ])
+      ])) : (n(), u("div", Pe)),
+      $("div", ze, [
+        r(g, {
+          ref_key: "previousButton",
+          ref: F,
+          label: o.value.previous,
+          disabled: !L.value || !e.switchPage,
+          onClick: a[0] || (a[0] = (s) => p(l.value - e.pageShiftUnit))
+        }, {
+          default: c(() => [
+            r(f(q), { class: "size-4" })
+          ]),
+          _: 1
+        }, 8, ["label", "disabled"]),
+        R.value ? (n(), u("button", {
+          key: 0,
+          type: "button",
+          "aria-haspopup": "dialog",
+          "data-ui-pagination-label": "",
+          "data-ui-hit": "",
+          class: "inline-flex h-[var(--ui-control-md)] min-w-[var(--ui-control-md)] items-center justify-center whitespace-nowrap rounded-[var(--ui-radius-control)] border-0 bg-transparent px-2 tabular-nums text-[var(--ui-text)] outline-none active:bg-[var(--ui-surface-selected)] focus-visible:shadow-[var(--ui-shadow-focus)]",
+          onClick: a[1] || (a[1] = (s) => U.value = !0)
+        }, x(M.value), 1)) : (n(), u("span", _e, x(M.value), 1)),
+        r(g, {
+          ref_key: "nextButton",
+          ref: E,
+          label: o.value.next,
+          disabled: !V.value || !e.switchPage,
+          onClick: a[2] || (a[2] = (s) => p(l.value + e.pageShiftUnit))
+        }, {
+          default: c(() => [
+            r(f(G), { class: "size-4" })
+          ]),
+          _: 1
+        }, 8, ["label", "disabled"]),
+        k(t.$slots, "right"),
+        e.refresh ? (n(), z(g, {
+          key: 2,
+          label: o.value.refresh,
+          onClick: a[3] || (a[3] = (s) => v("refresh"))
+        }, {
+          default: c(() => [
+            r(f(H), { class: "size-4" })
+          ]),
+          _: 1
+        }, 8, ["label"])) : w("", !0),
+        k(t.$slots, "right-wrapper")
+      ]),
+      R.value ? (n(), z(me, {
+        key: 2,
+        open: U.value,
+        "onUpdate:open": a[4] || (a[4] = (s) => U.value = s),
+        page: l.value,
+        "page-count": d.value,
+        endless: e.endless,
+        "page-size": e.pageSize,
+        sizes: B.value,
+        title: o.value.goToPageTitle,
+        hint: M.value,
+        go: o.value.go,
+        "items-per-page": o.value.itemsPerPage,
+        onPage: p,
+        onPageSize: A
+      }, null, 8, ["open", "page", "page-count", "endless", "page-size", "sizes", "title", "hint", "go", "items-per-page"])) : w("", !0)
+    ], 8, ke)) : (n(), u("nav", {
+      key: 1,
+      ref_key: "rootEl",
+      ref: _,
+      "aria-label": o.value.nav(b.value, e.endless),
+      class: "flex min-w-0 flex-wrap items-center gap-x-3 gap-y-1 text-[length:var(--ui-font-size)] text-[var(--ui-text)]",
+      "data-syno-pkg-land-ui": ""
+    }, [
+      W.value ? (n(), u("div", Se, [
+        k(t.$slots, "total", {
+          total: b.value,
+          page: l.value,
+          pageCount: d.value,
+          start: N.value,
+          end: T.value
+        }, () => [
+          D(x(O.value), 1)
+        ])
+      ])) : (n(), u("div", Be)),
+      $("div", $e, [
+        e.hasFirstBtn && !S.value ? (n(), z(g, {
+          key: 0,
+          label: o.value.first,
+          size: "sm",
+          disabled: !L.value || !e.switchPage,
+          onClick: a[5] || (a[5] = (s) => p(1))
+        }, {
+          default: c(() => [
+            r(f(pe), { class: "size-3.5" })
+          ]),
+          _: 1
+        }, 8, ["label", "disabled"])) : w("", !0),
+        r(g, {
+          ref_key: "previousButton",
+          ref: F,
+          label: o.value.previous,
+          size: "sm",
+          disabled: !L.value || !e.switchPage,
+          onClick: a[6] || (a[6] = (s) => p(l.value - e.pageShiftUnit))
+        }, {
+          default: c(() => [
+            r(f(q), { class: "size-3.5" })
+          ]),
+          _: 1
+        }, 8, ["label", "disabled"]),
+        ae.value ? (n(!0), u(I, { key: 1 }, ue(ee.value, (s, se) => (n(), u(I, { key: se }, [
+          s.kind === "ellipsis" ? (n(), u("span", Ne, "…")) : (n(), u("button", {
+            key: 1,
+            type: "button",
+            "aria-current": s.page === l.value ? "page" : void 0,
+            "aria-label": s.page === l.value ? o.value.page(s.page) : o.value.goToPage(s.page),
+            "data-ui-hit": "",
+            class: re([
+              "inline-flex h-[var(--ui-control-sm)] min-w-[calc(3ch+0.5rem)] [@media(pointer:coarse)]:min-w-[max(calc(3ch+0.5rem),var(--ui-control-sm))] shrink-0 whitespace-nowrap items-center justify-center rounded-[var(--ui-radius-inner)] px-1 outline-none transition-colors duration-[var(--ui-motion-fast)] ease-[var(--ui-motion-ease)] focus-visible:shadow-[var(--ui-shadow-focus)]",
+              s.page === l.value ? "bg-[var(--ui-primary-soft)] font-medium text-[var(--ui-primary-active)]" : "text-[var(--ui-text)] hover:bg-[var(--ui-surface-hover)] active:bg-[var(--ui-surface-selected)]",
+              !e.switchPage && "pointer-events-none",
+              !e.switchPage && s.page !== l.value && "opacity-50"
+            ]),
+            onClick: (Fe) => p(s.page)
+          }, x(m(s.page)), 11, Te))
+        ], 64))), 128)) : S.value || e.endless ? (n(), u("span", Le, x(m(l.value)), 1)) : w("", !0),
+        r(g, {
+          ref_key: "nextButton",
+          ref: E,
+          label: o.value.next,
+          size: "sm",
+          disabled: !V.value || !e.switchPage,
+          onClick: a[7] || (a[7] = (s) => p(l.value + e.pageShiftUnit))
+        }, {
+          default: c(() => [
+            r(f(G), { class: "size-3.5" })
+          ]),
+          _: 1
+        }, 8, ["label", "disabled"]),
+        e.hasLastBtn && !S.value ? (n(), z(g, {
+          key: 3,
+          label: o.value.last,
+          size: "sm",
+          disabled: !V.value || !e.switchPage,
+          onClick: a[8] || (a[8] = (s) => p(e.endless ? l.value + 1 : d.value))
+        }, {
+          default: c(() => [
+            r(f(ce), { class: "size-3.5" })
+          ]),
+          _: 1
+        }, 8, ["label", "disabled"])) : w("", !0)
+      ]),
+      k(t.$slots, "right"),
+      B.value.length ? (n(), u("label", Ve, [
+        $("span", Ue, x(o.value.itemsPerPage), 1),
+        $("span", Me, [
+          r(fe, {
+            "model-value": String(e.pageSize),
+            options: B.value,
+            "onUpdate:modelValue": A
+          }, null, 8, ["model-value", "options"])
+        ])
+      ])) : w("", !0),
+      e.refresh ? (n(), z(g, {
+        key: 3,
+        label: o.value.refresh,
+        size: "sm",
+        onClick: a[9] || (a[9] = (s) => v("refresh"))
+      }, {
+        default: c(() => [
+          r(f(H), { class: "size-3.5" })
+        ]),
+        _: 1
+      }, 8, ["label"])) : w("", !0),
+      k(t.$slots, "right-wrapper")
+    ], 8, Ce));
+  }
+});
+export {
+  He as default
+};

package/dist/modules/components/primitives/pagination/Pagination2.vue.js

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

package/dist/modules/components/primitives/pagination/PaginationSheet.vue.js

@@ -0,0 +1,108 @@
+import { defineComponent as _, ref as b, watch as y, openBlock as i, createBlock as f, createSlots as k, withCtx as p, createElementVNode as s, createElementBlock as l, withModifiers as z, createVNode as g, toDisplayString as u, createCommentVNode as m, Fragment as S, renderList as w, unref as C, createTextVNode as P } from "vue";
+import { Check as V } from "@lucide/vue";
+import N from "../sheet/BottomSheet.vue.js";
+import B from "../button/Button.vue.js";
+import $ from "../input/Input.vue.js";
+const j = { class: "flex flex-col gap-4" }, E = { class: "text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-secondary)]" }, F = ["aria-label"], M = {
+  "aria-hidden": "true",
+  class: "m-0 pb-1 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-secondary)]"
+}, U = ["aria-pressed", "onClick"], D = { class: "tabular-nums" }, I = /* @__PURE__ */ _({
+  __name: "PaginationSheet",
+  props: {
+    open: { type: Boolean },
+    page: {},
+    pageCount: {},
+    endless: { type: Boolean },
+    pageSize: {},
+    sizes: {},
+    title: {},
+    hint: {},
+    go: {},
+    itemsPerPage: {}
+  },
+  emits: ["update:open", "page", "pageSize"],
+  setup(v, { emit: h }) {
+    const e = v, r = h, n = b("");
+    y(() => e.open, (a) => {
+      a && (n.value = String(e.page));
+    }, { immediate: !0 });
+    function d() {
+      r("update:open", !1);
+    }
+    function c() {
+      const a = Math.trunc(Number(n.value));
+      n.value.trim() && Number.isFinite(a) && r("page", a), d();
+    }
+    function x(a) {
+      r("pageSize", a), d();
+    }
+    return (a, o) => (i(), f(N, {
+      open: e.open,
+      title: e.title,
+      "onUpdate:open": o[1] || (o[1] = (t) => r("update:open", t))
+    }, k({
+      default: p(() => [
+        s("div", j, [
+          e.endless ? m("", !0) : (i(), l("form", {
+            key: 0,
+            "data-ui-pagination-jump": "",
+            class: "flex flex-col gap-[var(--ui-field-gap)]",
+            onSubmit: z(c, ["prevent"])
+          }, [
+            g($, {
+              modelValue: n.value,
+              "onUpdate:modelValue": o[0] || (o[0] = (t) => n.value = t),
+              type: "integer",
+              class: "min-h-[var(--ui-hit-min)]",
+              "aria-label": e.title,
+              enterkeyhint: "go"
+            }, null, 8, ["modelValue", "aria-label"]),
+            s("span", E, u(e.hint), 1)
+          ], 32)),
+          e.sizes.length ? (i(), l("div", {
+            key: 1,
+            role: "group",
+            "aria-label": e.itemsPerPage,
+            "data-ui-pagination-sizes": ""
+          }, [
+            s("p", M, u(e.itemsPerPage), 1),
+            (i(!0), l(S, null, w(e.sizes, (t) => (i(), l("button", {
+              key: t.value,
+              type: "button",
+              "aria-pressed": t.value === String(e.pageSize),
+              class: "flex min-h-[max(var(--ui-menu-row-height),var(--ui-hit-min))] w-full items-center justify-between rounded-[var(--ui-radius-inner)] border-0 bg-transparent px-2 text-left text-[length:var(--ui-font-size)] text-[var(--ui-text)] outline-none focus-visible:shadow-[var(--ui-shadow-focus)]",
+              onClick: (L) => x(t.value)
+            }, [
+              s("span", D, u(t.label), 1),
+              t.value === String(e.pageSize) ? (i(), f(C(V), {
+                key: 0,
+                class: "size-4 text-[var(--ui-primary)]",
+                "aria-hidden": "true"
+              })) : m("", !0)
+            ], 8, U))), 128))
+          ], 8, F)) : m("", !0)
+        ])
+      ]),
+      _: 2
+    }, [
+      e.endless ? void 0 : {
+        name: "footer",
+        fn: p(() => [
+          g(B, {
+            variant: "primary",
+            onClick: c
+          }, {
+            default: p(() => [
+              P(u(e.go), 1)
+            ]),
+            _: 1
+          })
+        ]),
+        key: "0"
+      }
+    ]), 1032, ["open", "title"]));
+  }
+});
+export {
+  I as default
+};

package/dist/modules/components/primitives/pagination/PaginationSheet2.vue.js

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

package/dist/modules/components/primitives/pagination/labels.js

@@ -0,0 +1,20 @@
+function o(e) {
+  return {
+    nav: (a, t) => t ? e("Pagination") : e(a === 1 ? "Pagination, {total} item total" : "Pagination, {total} items total", { total: a }),
+    first: e("First page"),
+    previous: e("Previous page"),
+    next: e("Next page"),
+    last: e("Last page"),
+    refresh: e("Refresh"),
+    page: (a) => e("Page {page}", { page: a }),
+    goToPage: (a) => e("Go to page {page}", { page: a }),
+    itemsPerPage: e("Items per page"),
+    pageOf: (a, t) => e("Page {page} of {pageCount}", { page: a, pageCount: t }),
+    goToPageTitle: e("Go to page"),
+    go: e("Go"),
+    totalText: { total: e("{total} items"), range: e("{start}-{end} items"), filter: e("{filteredCount} items"), select: e("{selectedCount} / {total} items selected") }
+  };
+}
+export {
+  o as localizedPaginationLabels
+};

package/dist/modules/components/primitives/pagination/model.js

@@ -0,0 +1,25 @@
+function c(i, t) {
+  return !Number.isFinite(i) || !Number.isFinite(t) || t <= 0 ? 1 : Math.max(1, Math.ceil(Math.max(0, i) / t));
+}
+function M(i, t) {
+  return Number.isFinite(i) ? Math.min(Math.max(1, Math.trunc(i)), Math.max(1, t)) : 1;
+}
+function l(i, t, h = 7) {
+  const n = (f, m) => Array.from({ length: m - f + 1 }, (o, s) => f + s);
+  if (t <= h) return n(1, t);
+  const e = Math.max(1, h - 4);
+  let r = Math.max(2, i - Math.floor((e - 1) / 2));
+  const u = Math.min(t - 1, r + e - 1);
+  u - r + 1 < e && (r = Math.max(2, u - e + 1));
+  const a = [1];
+  return r > 2 && a.push("ellipsis"), a.push(...n(r, u)), u < t - 1 && a.push("ellipsis"), a.push(t), a;
+}
+function x(i, t) {
+  return i.replace(/\{(\w+)\}/g, (h, n) => n in t ? String(t[n]) : h);
+}
+export {
+  M as clampPage,
+  x as formatTotalText,
+  c as pageCountOf,
+  l as pageWindow
+};

package/dist/modules/components/primitives/popover/Popover.vue.js

@@ -0,0 +1,75 @@
+import { defineComponent as F, ref as b, computed as h, useTemplateRef as P, openBlock as k, createBlock as C, unref as e, withCtx as n, createVNode as l, mergeProps as f, renderSlot as m } from "vue";
+import { PopoverRoot_default as O } from "../../../vendor/reka-ui/dist/Popover/PopoverRoot.js";
+import { PopoverContent_default as $ } from "../../../vendor/reka-ui/dist/Popover/PopoverContent.js";
+import { PopoverPortal_default as E } from "../../../vendor/reka-ui/dist/Popover/PopoverPortal.js";
+import { PopoverTrigger_default as S } from "../../../vendor/reka-ui/dist/Popover/PopoverTrigger.js";
+import { useFloating as T, FLOATING_SIZE_CLASS as B } from "./floating.js";
+import { useOverlayMotion as I, useOverlayLayer as L, keepEscapeForIme as D, skipAutoFocusOnTouch as K } from "./overlay.js";
+const V = /* @__PURE__ */ F({
+  inheritAttrs: !1,
+  __name: "Popover",
+  props: {
+    open: { type: Boolean, default: void 0 },
+    side: { default: "bottom" },
+    align: { default: "start" },
+    width: { default: "280px" },
+    motion: { default: void 0 }
+  },
+  emits: ["update:open", "openAutoFocus", "closeAutoFocus"],
+  setup(a, { emit: c }) {
+    const u = a, s = c, p = b(!1), t = h({
+      get: () => u.open ?? p.value,
+      set: (o) => {
+        u.open === void 0 && (p.value = o), s("update:open", o);
+      }
+    }), d = P("trigger"), v = T(() => d.value?.$el, () => t.value), g = ["z-[1450] overflow-y-auto [scrollbar-gutter:stable] [overflow-wrap:anywhere] rounded-[var(--ui-radius-popover)] border border-[var(--ui-border-floating)] bg-[var(--ui-surface-raised)] p-3 shadow-[var(--ui-shadow-menu)] outline-none", B], y = I(() => u.motion), w = L(() => t.value, () => {
+      t.value = !1;
+    });
+    function A(o) {
+      s("openAutoFocus", o), K(o);
+    }
+    return (o, r) => (k(), C(e(O), {
+      open: t.value,
+      "onUpdate:open": r[1] || (r[1] = (i) => t.value = i)
+    }, {
+      default: n(() => [
+        l(e(S), f({
+          ref_key: "trigger",
+          ref: d
+        }, o.$attrs.id ? { "aria-controls": t.value ? o.$attrs.id : void 0 } : {}, { "as-child": "" }), {
+          default: n(() => [
+            m(o.$slots, "trigger")
+          ]),
+          _: 3
+        }, 16),
+        l(e(E), null, {
+          default: n(() => [
+            l(e($), f({ "data-ui-popup": "" }, { ...e(v), ...e(w), ...o.$attrs }, {
+              "data-ui-popup-motion": e(y)() === "none" ? "none" : void 0,
+              side: a.side,
+              align: a.align,
+              "side-offset": 4,
+              class: g,
+              style: { width: a.width },
+              "data-ui-popover": "",
+              "data-syno-pkg-land-ui": "",
+              onEscapeKeyDown: e(D),
+              onOpenAutoFocus: A,
+              onCloseAutoFocus: r[0] || (r[0] = (i) => s("closeAutoFocus", i))
+            }), {
+              default: n(() => [
+                m(o.$slots, "default")
+              ]),
+              _: 3
+            }, 16, ["data-ui-popup-motion", "side", "align", "style", "onEscapeKeyDown"])
+          ]),
+          _: 3
+        })
+      ]),
+      _: 3
+    }, 8, ["open"]));
+  }
+});
+export {
+  V as default
+};

package/dist/modules/components/primitives/popover/Popover2.vue.js

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

package/dist/modules/components/primitives/popover/floating.js

@@ -0,0 +1,67 @@
+import { shallowRef as h, watch as v, onScopeDispose as g, computed as w, toValue as b } from "vue";
+import { useCollisionBoundary as x, anchorElement as y } from "../../../composables/collisionBoundary.js";
+const c = 8, P = "max-w-[var(--reka-popper-available-width)] max-h-[var(--reka-popper-available-height)]", d = { top: c, right: c, bottom: c, left: c }, E = [
+  "position:fixed",
+  "top:0",
+  "left:0",
+  "width:0",
+  "height:0",
+  "visibility:hidden",
+  "pointer-events:none",
+  "contain:strict",
+  "padding-top:var(--ui-safe-top,env(safe-area-inset-top,0px))",
+  "padding-right:var(--ui-safe-right,env(safe-area-inset-right,0px))",
+  "padding-bottom:calc(var(--ui-safe-bottom,env(safe-area-inset-bottom,0px)) + var(--ui-kb-inset,0px))",
+  "padding-left:var(--ui-safe-left,env(safe-area-inset-left,0px))"
+].join(";"), u = (e) => {
+  const t = Number.parseFloat(e);
+  return Number.isFinite(t) && t > 0 ? t : 0;
+};
+function L(e) {
+  const t = y(e), r = t?.ownerDocument, p = r?.defaultView;
+  if (!t || !r || !p) return { ...d };
+  const s = t.closest("[data-ui-app]"), i = s?.querySelector(":scope > [data-ui-portals]") ?? s ?? r.body, n = r.createElement("div");
+  n.setAttribute("aria-hidden", "true"), n.style.cssText = E, i.appendChild(n);
+  const o = p.getComputedStyle(n), a = { top: u(o.paddingTop), right: u(o.paddingRight), bottom: u(o.paddingBottom), left: u(o.paddingLeft) };
+  return n.remove(), { top: d.top + a.top, right: d.right + a.right, bottom: d.bottom + a.bottom, left: d.left + a.left };
+}
+const A = (e, t) => e.top === t.top && e.right === t.right && e.bottom === t.bottom && e.left === t.left;
+function B(e, t) {
+  const r = () => b(e) ?? void 0, p = x(r, t), s = h({ ...d });
+  let i = 0;
+  const n = () => {
+    i = 0;
+    const l = L(r());
+    A(l, s.value) || (s.value = l);
+  }, o = () => {
+    i || (i = requestAnimationFrame(n));
+  };
+  let a;
+  const f = () => {
+    a?.(), a = void 0, i && cancelAnimationFrame(i), i = 0;
+  };
+  return v(t, (l) => {
+    if (f(), !l || typeof window > "u") return;
+    n();
+    const m = window.visualViewport;
+    m?.addEventListener("resize", o), window.addEventListener("resize", o), a = () => {
+      m?.removeEventListener("resize", o), window.removeEventListener("resize", o);
+    };
+  }, { immediate: !0, flush: "post" }), g(f), w(() => ({
+    avoidCollisions: !0,
+    collisionBoundary: p.value,
+    collisionPadding: s.value,
+    sticky: "partial",
+    hideWhenDetached: !0
+  }));
+}
+function C() {
+  return typeof matchMedia == "function" && matchMedia("(pointer: coarse)").matches;
+}
+export {
+  c as FLOATING_GAP,
+  P as FLOATING_SIZE_CLASS,
+  C as coarsePointer,
+  L as floatingPadding,
+  B as useFloating
+};

package/dist/modules/components/primitives/popover/overlay.js

@@ -0,0 +1,49 @@
+/*! @synopackageland/ui: MIT, Copyright (c) 2023-2025 Teable, Inc. and Copyright (c) 2019-present Baserow B.V. in parts; see LICENSES/source-notices.md */
+import { inject as c, toValue as s, useId as f, provide as p } from "vue";
+import { createCompositionGuard as d } from "../../../interaction/ime.js";
+import { IGNORE_OUTSIDE_ATTR as l, IGNORE_OUTSIDE_SELECTOR as m } from "../../../interaction/outside.js";
+import { useOutsideLayer as y } from "../../../interaction/vue.js";
+const r = /* @__PURE__ */ Symbol("syno-overlay-motion");
+function I(e) {
+  p(r, e);
+}
+function T(e) {
+  const o = c(r, "auto");
+  return () => e() ?? s(o);
+}
+const n = /* @__PURE__ */ new WeakMap();
+function i(e) {
+  const o = e.target?.ownerDocument?.defaultView ?? (typeof window > "u" ? null : window);
+  if (!o) return e.isComposing || e.keyCode === 229;
+  let t = n.get(o);
+  return t || n.set(o, t = d(o)), t.ownsKey(e);
+}
+function D(e) {
+  i(e) && e.preventDefault();
+}
+function M(e, o) {
+  const t = f(), u = `[data-ui-layer="${t}"]`;
+  return y(
+    () => typeof document > "u" ? null : document.querySelector(u),
+    e,
+    {
+      onEscape: (a) => i(a) ? !1 : (o(), !0)
+    }
+  ), { "data-ui-layer": t, [l]: "" };
+}
+function _(e) {
+  const o = e.target;
+  o instanceof Element && o.closest(m) && e.preventDefault();
+}
+function k(e) {
+  typeof matchMedia == "function" && matchMedia("(pointer: coarse)").matches && e.preventDefault();
+}
+export {
+  i as imeOwnsEscape,
+  D as keepEscapeForIme,
+  _ as keepForIgnoredPortal,
+  I as provideOverlayMotion,
+  k as skipAutoFocusOnTouch,
+  M as useOverlayLayer,
+  T as useOverlayMotion
+};