@synopackageland/ui 0.25.21 → 0.25.22

package/dist/modules/components/primitives/dropdown-menu/DropdownMenuItems.vue.js

@@ -0,0 +1,264 @@
+import { defineComponent as j, computed as S, resolveComponent as B, openBlock as t, createElementBlock as s, Fragment as w, renderList as D, createBlock as u, unref as n, withCtx as m, createVNode as c, normalizeClass as h, resolveDynamicComponent as M, createCommentVNode as o, createElementVNode as f, createTextVNode as x, toDisplayString as d, mergeProps as E, withModifiers as L } from "vue";
+import { FLOATING_SIZE_CLASS as R } from "../popover/floating.js";
+import { Check as g, ChevronRight as I } from "@lucide/vue";
+import { DropdownMenuCheckboxItem_default as A } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuCheckboxItem.js";
+import { DropdownMenuItem_default as K } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuItem.js";
+import { DropdownMenuItemIndicator_default as C } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuItemIndicator.js";
+import { DropdownMenuPortal_default as F } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuPortal.js";
+import { DropdownMenuRadioGroup_default as G } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuRadioGroup.js";
+import { DropdownMenuRadioItem_default as O } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuRadioItem.js";
+import { DropdownMenuSeparator_default as P } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuSeparator.js";
+import { DropdownMenuSub_default as U } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuSub.js";
+import { DropdownMenuSubContent_default as b } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuSubContent.js";
+import { DropdownMenuSubTrigger_default as Z } from "../../../vendor/reka-ui/dist/DropdownMenu/DropdownMenuSubTrigger.js";
+const q = { class: "min-w-0 flex-1 [overflow-wrap:anywhere]" }, H = {
+  key: 0,
+  "data-menu-description": "",
+  class: "block text-[length:var(--ui-font-size-sm)] leading-4 text-[var(--ui-text-secondary)]"
+}, J = {
+  key: 1,
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-muted)]"
+}, Q = { class: "flex size-4 shrink-0 items-center justify-center text-[var(--ui-primary)]" }, W = { class: "min-w-0 flex-1 [overflow-wrap:anywhere]" }, X = {
+  key: 0,
+  "data-menu-description": "",
+  class: "block text-[length:var(--ui-font-size-sm)] leading-4 text-[var(--ui-text-secondary)]"
+}, Y = {
+  key: 0,
+  "data-menu-hint": "",
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-muted)]"
+}, ee = {
+  key: 1,
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-muted)]"
+}, te = { class: "flex size-4 shrink-0 items-center justify-center text-[var(--ui-primary)]" }, ae = {
+  key: 1,
+  "data-radio-dot": "",
+  class: "block size-1.5 rounded-full bg-current",
+  "aria-hidden": "true"
+}, ie = { class: "min-w-0 flex-1 [overflow-wrap:anywhere]" }, re = {
+  key: 0,
+  "data-menu-description": "",
+  class: "block text-[length:var(--ui-font-size-sm)] leading-4 text-[var(--ui-text-secondary)]"
+}, ne = {
+  key: 0,
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-muted)]"
+}, se = { class: "min-w-0 flex-1 [overflow-wrap:anywhere]" }, oe = {
+  key: 0,
+  "data-menu-description": "",
+  class: "block text-[length:var(--ui-font-size-sm)] leading-4 text-[var(--ui-text-secondary)]"
+}, de = {
+  key: 1,
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-muted)]"
+}, k = "flex min-h-[var(--ui-menu-row-height)] select-none items-center gap-2 rounded-[var(--ui-radius-inner)] px-2 py-1 text-left text-[length:var(--ui-font-size)] outline-none data-[highlighted]:bg-[var(--ui-state-hover)] data-[disabled]:opacity-40", _e = /* @__PURE__ */ j({
+  name: "DropdownMenuItems",
+  __name: "DropdownMenuItems",
+  props: {
+    items: {},
+    checkedKeys: { default: () => [] },
+    radioValues: { default: () => ({}) },
+    floating: {},
+    radioIndicator: { default: "dot" },
+    motion: { default: "auto" }
+  },
+  emits: ["select", "toggle", "radio"],
+  setup(l, { emit: V }) {
+    const _ = l, p = V, N = (r) => r.group ?? "", z = S(
+      () => _.items.some((r) => r.type === "checkbox" || r.type === "radio" || r.type !== "separator" && (r.checked !== void 0 || !!r.icon))
+    ), T = S(
+      () => _.items.reduce((r, a) => {
+        if (a.type === "radio") {
+          const y = N(a), e = r.at(-1);
+          return e?.kind === "radio" && e.group === y ? e.items.push(a) : r.push({ kind: "radio", key: `radio-${y}-${a.key}`, group: y, items: [a] }), r;
+        }
+        return a.type === "separator" ? (r.push({ kind: "separator", key: a.key }), r) : a.type === "checkbox" ? (r.push({ kind: "checkbox", key: a.key, item: a }), r) : a.children?.length ? (r.push({ kind: "submenu", key: a.key, item: a, children: a.children }), r) : (r.push({ kind: "item", key: a.key, item: a }), r);
+      }, [])
+    );
+    return (r, a) => {
+      const y = B("DropdownMenuItems", !0);
+      return t(!0), s(w, null, D(T.value, (e) => (t(), s(w, {
+        key: e.key
+      }, [
+        e.kind === "separator" ? (t(), u(n(P), {
+          key: 0,
+          class: "my-1 h-[var(--ui-hairline)] bg-[var(--ui-border-subtle)]"
+        })) : e.kind === "submenu" ? (t(), u(n(U), { key: 1 }, {
+          default: m(() => [
+            c(n(Z), {
+              disabled: e.item.disabled,
+              class: h([
+                k,
+                "data-[state=open]:bg-[var(--ui-state-hover)]",
+                e.item.danger ? "text-[var(--ui-danger)]" : "text-[var(--ui-text)]"
+              ])
+            }, {
+              default: m(() => [
+                z.value ? (t(), s("span", {
+                  key: 0,
+                  class: h(["flex size-4 shrink-0 items-center justify-center", e.item.checked ? "text-[var(--ui-primary)]" : e.item.danger ? "" : "text-[var(--ui-text-secondary)]"])
+                }, [
+                  e.item.checked ? (t(), u(n(g), {
+                    key: 0,
+                    class: "size-3.5",
+                    "aria-hidden": "true"
+                  })) : e.item.icon ? (t(), u(M(e.item.icon), {
+                    key: 1,
+                    class: "size-4",
+                    "aria-hidden": "true"
+                  })) : o("", !0)
+                ], 2)) : o("", !0),
+                f("span", q, [
+                  x(d(e.item.label), 1),
+                  e.item.description ? (t(), s("span", H, d(e.item.description), 1)) : o("", !0)
+                ]),
+                e.item.shortcut ? (t(), s("span", J, d(e.item.shortcut), 1)) : o("", !0),
+                c(n(I), {
+                  class: "size-3.5 shrink-0 text-[var(--ui-text-muted)]",
+                  "aria-hidden": "true"
+                })
+              ]),
+              _: 2
+            }, 1032, ["disabled", "class"]),
+            c(n(F), null, {
+              default: m(() => [
+                c(n(b), E({
+                  "data-ui-popup": "",
+                  "data-ui-ignore-outside": "",
+                  "data-ui-popup-motion": l.motion === "none" ? "none" : void 0,
+                  "side-offset": 4,
+                  "align-offset": -4
+                }, { ref_for: !0 }, l.floating, {
+                  class: ["z-[1450] min-w-[min(11rem,var(--reka-popper-available-width))] overflow-y-auto [scrollbar-gutter:stable] rounded-[var(--ui-radius-popover)] border border-[var(--ui-border-floating)] bg-[var(--ui-surface-raised)] p-1 shadow-[var(--ui-shadow-menu)] outline-none", n(R)],
+                  "data-syno-pkg-land-ui": ""
+                }), {
+                  default: m(() => [
+                    c(y, {
+                      items: e.children,
+                      "checked-keys": l.checkedKeys,
+                      "radio-values": l.radioValues,
+                      floating: l.floating,
+                      "radio-indicator": l.radioIndicator,
+                      motion: l.motion,
+                      onSelect: a[0] || (a[0] = (i) => p("select", i)),
+                      onToggle: a[1] || (a[1] = (i, v) => p("toggle", i, v)),
+                      onRadio: a[2] || (a[2] = (i, v, $) => p("radio", i, v, $))
+                    }, null, 8, ["items", "checked-keys", "radio-values", "floating", "radio-indicator", "motion"])
+                  ]),
+                  _: 2
+                }, 1040, ["data-ui-popup-motion", "class"])
+              ]),
+              _: 2
+            }, 1024)
+          ]),
+          _: 2
+        }, 1024)) : e.kind === "checkbox" ? (t(), u(n(A), {
+          key: 2,
+          "model-value": l.checkedKeys.includes(e.item.key),
+          disabled: e.item.disabled,
+          class: h([
+            k,
+            e.item.danger ? "text-[var(--ui-danger)]" : "text-[var(--ui-text)]"
+          ]),
+          "onUpdate:modelValue": (i) => p("toggle", e.item.key, !!i),
+          onSelect: L((i) => p("select", e.item.key), ["prevent"])
+        }, {
+          default: m(() => [
+            f("span", Q, [
+              c(n(C), null, {
+                default: m(() => [
+                  c(n(g), {
+                    class: "size-3.5",
+                    "aria-hidden": "true"
+                  })
+                ]),
+                _: 1
+              })
+            ]),
+            f("span", W, [
+              x(d(e.item.label), 1),
+              e.item.description ? (t(), s("span", X, d(e.item.description), 1)) : o("", !0)
+            ]),
+            e.item.hint ? (t(), s("span", Y, d(e.item.hint), 1)) : o("", !0),
+            e.item.shortcut ? (t(), s("span", ee, d(e.item.shortcut), 1)) : o("", !0)
+          ]),
+          _: 2
+        }, 1032, ["model-value", "disabled", "class", "onUpdate:modelValue", "onSelect"])) : e.kind === "radio" ? (t(), u(n(G), {
+          key: 3,
+          "model-value": l.radioValues[e.group]
+        }, {
+          default: m(() => [
+            (t(!0), s(w, null, D(e.items, (i) => (t(), u(n(O), {
+              key: i.key,
+              value: i.value,
+              disabled: i.disabled,
+              class: h([
+                k,
+                i.danger ? "text-[var(--ui-danger)]" : "text-[var(--ui-text)]"
+              ]),
+              onSelect: (v) => p("radio", i.value, i.key, e.group)
+            }, {
+              default: m(() => [
+                f("span", te, [
+                  c(n(C), null, {
+                    default: m(() => [
+                      l.radioIndicator === "check" ? (t(), u(n(g), {
+                        key: 0,
+                        class: "size-3.5",
+                        "aria-hidden": "true"
+                      })) : (t(), s("span", ae))
+                    ]),
+                    _: 1
+                  })
+                ]),
+                f("span", ie, [
+                  x(d(i.label), 1),
+                  i.description ? (t(), s("span", re, d(i.description), 1)) : o("", !0)
+                ]),
+                i.shortcut ? (t(), s("span", ne, d(i.shortcut), 1)) : o("", !0)
+              ]),
+              _: 2
+            }, 1032, ["value", "disabled", "class", "onSelect"]))), 128))
+          ]),
+          _: 2
+        }, 1032, ["model-value"])) : (t(), u(n(K), {
+          key: 4,
+          disabled: e.item.disabled,
+          class: h([
+            k,
+            e.item.danger ? "text-[var(--ui-danger)]" : "text-[var(--ui-text)]"
+          ]),
+          onSelect: (i) => p("select", e.item.key)
+        }, {
+          default: m(() => [
+            z.value ? (t(), s("span", {
+              key: 0,
+              class: h(["flex size-4 shrink-0 items-center justify-center", e.item.checked ? "text-[var(--ui-primary)]" : e.item.danger ? "" : "text-[var(--ui-text-secondary)]"])
+            }, [
+              e.item.checked ? (t(), u(n(g), {
+                key: 0,
+                class: "size-3.5",
+                "aria-hidden": "true"
+              })) : e.item.icon ? (t(), u(M(e.item.icon), {
+                key: 1,
+                class: "size-4",
+                "aria-hidden": "true"
+              })) : o("", !0)
+            ], 2)) : o("", !0),
+            f("span", se, [
+              x(d(e.item.label), 1),
+              e.item.description ? (t(), s("span", oe, d(e.item.description), 1)) : o("", !0)
+            ]),
+            e.item.shortcut ? (t(), s("span", de, d(e.item.shortcut), 1)) : o("", !0),
+            e.item.submenu ? (t(), u(n(I), {
+              key: 2,
+              class: "size-3.5 shrink-0 text-[var(--ui-text-muted)]",
+              "aria-hidden": "true"
+            })) : o("", !0)
+          ]),
+          _: 2
+        }, 1032, ["disabled", "class", "onSelect"]))
+      ], 64))), 128);
+    };
+  }
+});
+export {
+  _e as default
+};

package/dist/modules/components/primitives/dropdown-menu/DropdownMenuItems2.vue.js

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

package/dist/modules/components/primitives/dropdown-menu/DropdownMenuSheet.vue.js

@@ -0,0 +1,184 @@
+import { defineComponent as $, ref as D, watch as F, computed as x, openBlock as a, createBlock as u, mergeProps as I, withCtx as p, createVNode as g, unref as r, createElementVNode as c, normalizeClass as f, toDisplayString as h, createCommentVNode as d, createElementBlock as n, Fragment as _, renderList as K, resolveDynamicComponent as j, createTextVNode as E } from "vue";
+import { ChevronLeft as L, Check as O, ChevronRight as S } from "@lucide/vue";
+import { RovingFocusGroup_default as T } from "../../../vendor/reka-ui/dist/RovingFocus/RovingFocusGroup.js";
+import { RovingFocusItem_default as C } from "../../../vendor/reka-ui/dist/RovingFocus/RovingFocusItem.js";
+import { useUiText as U } from "../../../i18n/text.js";
+import A from "../sheet/BottomSheet.vue.js";
+const G = ["aria-label"], M = { class: "min-w-0 flex-1 truncate" }, P = {
+  key: 0,
+  role: "separator",
+  class: "mx-3 my-1 h-[var(--ui-hairline)] bg-[var(--ui-border-subtle)]"
+}, W = ["role", "aria-checked", "aria-haspopup", "disabled", "data-key", "onClick"], q = {
+  key: 0,
+  "data-radio-dot": "",
+  class: "block size-2 rounded-full bg-current",
+  "aria-hidden": "true"
+}, H = { class: "min-w-0 flex-1 [overflow-wrap:anywhere]" }, J = {
+  key: 0,
+  "data-menu-description": "",
+  class: "block text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-secondary)]"
+}, Q = {
+  key: 1,
+  "data-menu-hint": "",
+  class: "shrink-0 text-[length:var(--ui-font-size-sm)] text-[var(--ui-text-muted)]"
+}, m = "flex min-h-12 w-full select-none items-center gap-3 rounded-[var(--ui-radius-control)] px-3 py-2 text-left text-[length:var(--ui-font-size)] outline-none hover:bg-[var(--ui-neutral-soft)] focus-visible:bg-[var(--ui-neutral-soft)] disabled:opacity-40", re = /* @__PURE__ */ $({
+  inheritAttrs: !1,
+  __name: "DropdownMenuSheet",
+  props: {
+    open: { type: Boolean },
+    items: {},
+    title: { default: void 0 },
+    checkedKeys: { default: () => [] },
+    radioValues: { default: () => ({}) },
+    radioIndicator: { default: "dot" }
+  },
+  emits: ["update:open", "select", "toggle", "radio"],
+  setup(z, { emit: B }) {
+    const o = z, s = B, k = U(), l = D([]);
+    F(() => o.open, (e) => {
+      e || (l.value = []);
+    });
+    const y = x(() => l.value.at(-1)), w = x(() => y.value?.items ?? o.items), V = x(
+      () => w.value.some((e) => e.type === "checkbox" || e.type === "radio" || e.type !== "separator" && (e.checked !== void 0 || !!e.icon))
+    );
+    function v() {
+      s("update:open", !1);
+    }
+    function N(e) {
+      if (!(e.type === "separator" || e.disabled)) {
+        if (e.type === "checkbox") {
+          s("toggle", e.key, !o.checkedKeys.includes(e.key)), s("select", e.key);
+          return;
+        }
+        if (e.type === "radio") {
+          s("radio", e.value, e.key, e.group ?? ""), v();
+          return;
+        }
+        if (e.children?.length) {
+          l.value = [...l.value, { label: e.label, items: e.children }];
+          return;
+        }
+        s("select", e.key), v();
+      }
+    }
+    function b(e) {
+      return e.type === "checkbox" ? o.checkedKeys.includes(e.key) : e.type === "radio" ? o.radioValues[e.group ?? ""] === e.value : e.type !== "separator" && !!e.checked;
+    }
+    function R(e) {
+      return e.type === "checkbox" ? "menuitemcheckbox" : e.type === "radio" ? "menuitemradio" : "menuitem";
+    }
+    return (e, i) => (a(), u(A, I(e.$attrs, {
+      open: o.open,
+      title: y.value?.label ?? o.title,
+      "show-close": !1,
+      "data-ui-menu-sheet": "",
+      "onUpdate:open": i[1] || (i[1] = (t) => s("update:open", t))
+    }), {
+      default: p(() => [
+        g(r(T), {
+          as: "div",
+          orientation: "vertical",
+          loop: "",
+          role: "menu",
+          "aria-label": y.value?.label ?? o.title,
+          class: "-mx-2 flex flex-col"
+        }, {
+          default: p(() => [
+            y.value ? (a(), u(r(C), {
+              key: 0,
+              "as-child": ""
+            }, {
+              default: p(() => [
+                c("button", {
+                  type: "button",
+                  class: f([m, "text-[var(--ui-text-secondary)]"]),
+                  "aria-label": r(k)("Back"),
+                  "data-ui-menu-sheet-back": "",
+                  onClick: i[0] || (i[0] = (t) => l.value = l.value.slice(0, -1))
+                }, [
+                  g(r(L), {
+                    class: "size-5 shrink-0",
+                    "aria-hidden": "true"
+                  }),
+                  c("span", M, h(l.value.at(-2)?.label ?? o.title ?? r(k)("Back")), 1)
+                ], 10, G)
+              ]),
+              _: 1
+            })) : d("", !0),
+            (a(!0), n(_, null, K(w.value, (t) => (a(), n(_, {
+              key: t.key
+            }, [
+              t.type === "separator" ? (a(), n("div", P)) : (a(), u(r(C), {
+                key: 1,
+                "as-child": "",
+                focusable: !t.disabled
+              }, {
+                default: p(() => [
+                  c("button", {
+                    type: "button",
+                    role: R(t),
+                    "aria-checked": t.type === "checkbox" || t.type === "radio" ? b(t) : void 0,
+                    "aria-haspopup": t.type !== "checkbox" && t.type !== "radio" && t.children?.length ? "menu" : void 0,
+                    disabled: t.disabled,
+                    class: f([m, t.danger ? "text-[var(--ui-danger)]" : "text-[var(--ui-text)]"]),
+                    "data-ui-menu-sheet-item": "",
+                    "data-key": t.key,
+                    onClick: (X) => N(t)
+                  }, [
+                    V.value ? (a(), n("span", {
+                      key: 0,
+                      class: f(["flex size-5 shrink-0 items-center justify-center", b(t) ? "text-[var(--ui-primary)]" : t.danger ? "" : "text-[var(--ui-text-secondary)]"])
+                    }, [
+                      b(t) ? (a(), n(_, { key: 0 }, [
+                        t.type === "radio" && o.radioIndicator === "dot" ? (a(), n("span", q)) : (a(), u(r(O), {
+                          key: 1,
+                          class: "size-4",
+                          "aria-hidden": "true"
+                        }))
+                      ], 64)) : t.type !== "checkbox" && t.type !== "radio" && t.icon ? (a(), u(j(t.icon), {
+                        key: 1,
+                        class: "size-5",
+                        "aria-hidden": "true"
+                      })) : d("", !0)
+                    ], 2)) : d("", !0),
+                    c("span", H, [
+                      E(h(t.label) + " ", 1),
+                      t.description ? (a(), n("span", J, h(t.description), 1)) : d("", !0)
+                    ]),
+                    t.type === "checkbox" && t.hint ? (a(), n("span", Q, h(t.hint), 1)) : d("", !0),
+                    t.type !== "checkbox" && t.type !== "radio" && t.children?.length ? (a(), u(r(S), {
+                      key: 2,
+                      class: "size-5 shrink-0 text-[var(--ui-text-muted)]",
+                      "aria-hidden": "true"
+                    })) : d("", !0)
+                  ], 10, W)
+                ]),
+                _: 2
+              }, 1032, ["focusable"]))
+            ], 64))), 128)),
+            i[2] || (i[2] = c("div", {
+              role: "separator",
+              class: "mx-3 my-1 h-[var(--ui-hairline)] bg-[var(--ui-border-subtle)]"
+            }, null, -1)),
+            g(r(C), { "as-child": "" }, {
+              default: p(() => [
+                c("button", {
+                  type: "button",
+                  class: f([m, "justify-center font-semibold text-[var(--ui-text)]"]),
+                  "data-ui-menu-sheet-cancel": "",
+                  onClick: v
+                }, h(r(k)("Cancel")), 3)
+              ]),
+              _: 1
+            })
+          ]),
+          _: 1
+        }, 8, ["aria-label"])
+      ]),
+      _: 1
+    }, 16, ["open", "title"]));
+  }
+});
+export {
+  re as default
+};

package/dist/modules/components/primitives/dropdown-menu/DropdownMenuSheet2.vue.js

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

package/dist/modules/components/primitives/ghost/Ghost.vue.js

@@ -0,0 +1,55 @@
+import { defineComponent as m, computed as n, openBlock as r, createElementBlock as s, normalizeClass as f, toDisplayString as l, createCommentVNode as u, renderSlot as i, createBlock as v, resolveDynamicComponent as g, mergeProps as h, createElementVNode as x, createTextVNode as b } from "vue";
+import { cn as y } from "../../../lib/cn.js";
+const _ = {
+  key: 0,
+  "data-ghost-nums": "",
+  class: "absolute -right-2 -top-2 flex h-6 min-w-6 items-center justify-center rounded-full bg-[var(--ui-danger)] px-1 text-[length:var(--ui-font-size-sm)] font-medium text-[var(--ui-danger-foreground)]"
+}, k = {
+  "data-ghost-title": "",
+  class: "min-w-0 flex-1 truncate"
+}, z = /* @__PURE__ */ m({
+  __name: "Ghost",
+  props: {
+    title: { default: "" },
+    nums: { type: [Number, Boolean], default: !1 },
+    icon: { type: [Object, Boolean], default: !1 }
+  },
+  setup(c) {
+    function d(e) {
+      return typeof e == "object" && e !== null && "component" in e;
+    }
+    const t = c, o = n(() => {
+      const e = t.icon;
+      return e ? d(e) ? e : { component: e, props: {} } : null;
+    }), a = n(() => {
+      const e = t.nums;
+      return e === !1 || e < 2 ? null : e > 99 ? "99+" : String(e);
+    }), p = n(
+      () => y(
+        "relative flex h-10 w-[200px] items-center gap-1 rounded-[var(--ui-radius-popover)] border border-[var(--ui-border)] bg-[var(--ui-surface-raised)] px-4 text-[length:var(--ui-font-size-control)] text-[var(--ui-text)] shadow-[var(--ui-shadow-menu)]"
+      )
+    );
+    return (e, w) => (r(), s("div", {
+      "data-syno-pkg-land-ui": "",
+      "data-ghost": "",
+      class: f(p.value)
+    }, [
+      a.value ? (r(), s("span", _, l(a.value), 1)) : u("", !0),
+      i(e.$slots, "default", {}, () => [
+        o.value ? (r(), v(g(o.value.component), h({ key: 0 }, o.value.props, {
+          "data-ghost-icon": "",
+          class: "size-4 shrink-0",
+          "aria-hidden": "true"
+        }), null, 16)) : u("", !0),
+        x("span", k, [
+          i(e.$slots, "title", {}, () => [
+            b(l(t.title), 1)
+          ])
+        ])
+      ])
+    ], 2));
+  }
+});
+export {
+  z as default
+};

package/dist/modules/components/primitives/ghost/Ghost2.vue.js

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

package/dist/modules/components/primitives/icon/FileTypeIcon.vue.js

@@ -0,0 +1,24 @@
+import { defineComponent as r, computed as o, openBlock as t, createBlock as c, normalizeStyle as a } from "vue";
+import { FolderOpen as f, Folder as s } from "@lucide/vue";
+import p from "./Icon.vue.js";
+import { fileTypeIcon as m } from "./fileType.js";
+const z = /* @__PURE__ */ r({
+  __name: "FileTypeIcon",
+  props: {
+    kind: { default: "file" },
+    name: { default: "" },
+    open: { type: Boolean, default: !1 },
+    size: { default: "sm" }
+  },
+  setup(n) {
+    const e = n, l = o(() => e.kind === "folder" ? e.open ? f : s : m(e.name)), i = o(() => e.kind === "folder" ? "var(--ui-file-folder)" : "var(--ui-file-icon)");
+    return (d, u) => (t(), c(p, {
+      "svg-icon": l.value,
+      size: e.size,
+      style: a({ color: i.value })
+    }, null, 8, ["svg-icon", "size", "style"]));
+  }
+});
+export {
+  z as default
+};

package/dist/modules/components/primitives/icon/FileTypeIcon2.vue.js

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

package/dist/modules/components/primitives/icon/Icon.vue.js

@@ -0,0 +1,59 @@
+import { defineComponent as m, getCurrentInstance as f, useTemplateRef as p, computed as t, onMounted as v, openBlock as i, createElementBlock as b, mergeProps as y, unref as g, createBlock as h, resolveDynamicComponent as I } from "vue";
+import { cn as B } from "../../../lib/cn.js";
+import { resolveIconSize as x, iconSetColor as k } from "./icon.js";
+import { getRegisteredIcon as L } from "./iconRegistry.js";
+const R = /* @__PURE__ */ m({
+  __name: "Icon",
+  props: {
+    svgIcon: {},
+    name: {},
+    size: { default: "m" },
+    svgIconSet: { default: "inherit" },
+    disabled: { type: Boolean, default: !1 },
+    ariaHidden: { type: [Boolean, String], default: !0 },
+    ariaLabel: {},
+    ariaLabelledby: {},
+    redundant: { type: Boolean, default: !1 },
+    sprite: { type: Boolean, default: !1 }
+  },
+  setup(o, { expose: r }) {
+    const e = o;
+    f();
+    const n = p("element"), s = t(
+      () => e.svgIcon ?? (e.name ? L(e.name) : void 0)
+    ), a = t(() => x(e.size)), l = t(() => !!(e.ariaLabel || e.ariaLabelledby)), d = t(() => ({
+      role: l.value ? "img" : void 0,
+      "aria-hidden": l.value ? void 0 : e.ariaHidden === !0 || e.ariaHidden === "true" ? !0 : void 0,
+      "aria-label": e.ariaLabel,
+      "aria-labelledby": e.ariaLabelledby,
+      "data-icon-name": e.name
+    })), c = t(() => ({
+      width: `${a.value[0]}px`,
+      height: `${a.value[1]}px`,
+      color: k(e.svgIconSet)
+    }));
+    function u() {
+      n.value?.focus();
+    }
+    return v(() => {
+    }), r({ focus: u, el: n }), (z, S) => (i(), b("span", y({
+      ref_key: "element",
+      ref: n,
+      class: g(B)("inline-flex shrink-0 items-center justify-center", o.disabled && "cursor-default opacity-40"),
+      style: c.value
+    }, d.value, {
+      "data-icon": "",
+      "data-syno-pkg-land-ui": ""
+    }), [
+      (i(), h(I(s.value), {
+        size: a.value[0],
+        width: a.value[0],
+        height: a.value[1],
+        focusable: "false"
+      }, null, 8, ["size", "width", "height"]))
+    ], 16));
+  }
+});
+export {
+  R as default
+};

package/dist/modules/components/primitives/icon/Icon2.vue.js

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

package/dist/modules/components/primitives/icon/fileType.js

@@ -0,0 +1,16 @@
+import { File as o, FileImage as a, FileVideo as p, FileAudio as m, FileArchive as l, FileText as s, FileCode as c } from "@lucide/vue";
+const r = [
+  [a, ["jpg", "jpeg", "png", "gif", "bmp", "webp", "heic", "svg", "tif", "tiff", "raw"]],
+  [p, ["mp4", "mkv", "mov", "avi", "wmv", "m4v", "webm", "ts", "m2ts"]],
+  [m, ["mp3", "flac", "wav", "aac", "m4a", "ogg", "wma", "ape"]],
+  [l, ["zip", "rar", "7z", "tar", "gz", "tgz", "bz2", "xz", "spk"]],
+  [s, ["txt", "md", "log", "pdf", "doc", "docx", "rtf", "odt"]],
+  [c, ["js", "ts", "json", "html", "css", "vue", "go", "py", "sh", "c", "cpp", "java", "rs", "yaml", "yml", "xml"]]
+], f = new Map(r.flatMap(([e, t]) => t.map((i) => [i, e])));
+function n(e = "") {
+  const t = e.lastIndexOf(".");
+  return t <= 0 ? o : f.get(e.slice(t + 1).toLowerCase()) ?? o;
+}
+export {
+  n as fileTypeIcon
+};

package/dist/modules/components/primitives/icon/icon.js

@@ -0,0 +1,31 @@
+const n = {
+  sm: 16,
+  m: 24,
+  lg: 32
+}, a = {
+  inherit: "currentColor",
+  primary: "var(--ui-text)",
+  secondary: "var(--ui-text-secondary)",
+  "secondary-primary": "var(--ui-text-secondary)",
+  tertiary: "var(--ui-icon-tertiary)",
+  "tertiary-secondary": "var(--ui-icon-tertiary)",
+  theme: "var(--ui-primary)",
+  info: "var(--ui-info)",
+  success: "var(--ui-success)",
+  warning: "var(--ui-warning)",
+  danger: "var(--ui-danger)"
+};
+function t(r) {
+  if (Array.isArray(r)) return [r[0], r[1]];
+  const i = n[r];
+  return [i, i];
+}
+function e(r) {
+  return a[r];
+}
+export {
+  a as ICON_SET_COLORS,
+  n as ICON_SIZE_TOKENS,
+  e as iconSetColor,
+  t as resolveIconSize
+};