@cghbcf/xp-ui 1.0.1 → 1.1.0

package/dist/cghbcf-xp-ui.es.js

@@ -1,13 +1,13 @@
-import { ref as _, openBlock as r, createBlock as z, Transition as N, withCtx as S, createElementBlock as i, normalizeClass as $, createElementVNode as c, toDisplayString as k, renderSlot as b, createTextVNode as X, createCommentVNode as g, computed as w, normalizeStyle as C, Teleport as L, createVNode as B, withModifiers as K, onMounted as Q, onBeforeUnmount as J, Fragment as W, renderList as q, nextTick as Z, inject as oe, provide as se } from "vue";
-const v = (e, t) => {
-  const a = e.__vccOpts || e;
-  for (const [l, n] of t)
-    a[l] = n;
-  return a;
-}, re = { class: "xp-alert__icon" }, ie = { class: "xp-alert__content" }, de = { class: "xp-alert__title" }, ce = {
+import { ref as z, openBlock as a, createBlock as R, Transition as D, withCtx as E, createElementBlock as r, normalizeClass as B, createElementVNode as o, toDisplayString as k, renderSlot as b, createTextVNode as W, createCommentVNode as g, computed as M, normalizeStyle as T, onUnmounted as ie, Teleport as H, createVNode as A, withModifiers as j, Fragment as _, renderList as V, watch as re, onMounted as de, onBeforeUnmount as Q, nextTick as ue, inject as _e, provide as ke, reactive as $e, unref as ce, TransitionGroup as we } from "vue";
+const C = (e, n) => {
+  const t = e.__vccOpts || e;
+  for (const [s, l] of n)
+    t[s] = l;
+  return t;
+}, Ce = { class: "xp-alert__icon" }, Se = { class: "xp-alert__content" }, ze = { class: "xp-alert__title" }, Be = {
   key: 0,
   class: "xp-alert__description"
-}, ue = {
+}, Me = {
   __name: "Alert",
   props: {
     title: {
@@ -34,54 +34,54 @@ const v = (e, t) => {
     }
   },
   emits: ["close"],
-  setup(e, { emit: t }) {
-    const a = t, l = _(!0), n = {
+  setup(e, { emit: n }) {
+    const t = n, s = z(!0), l = {
       success: "✓",
       warning: "!",
       danger: "×",
       info: "i"
-    }, s = () => {
-      l.value = !1, a("close");
+    }, u = () => {
+      s.value = !1, t("close");
     };
-    return (o, u) => (r(), z(N, { name: "xp-alert-fade" }, {
-      default: S(() => [
-        l.value ? (r(), i("div", {
+    return (d, x) => (a(), R(D, { name: "xp-alert-fade" }, {
+      default: E(() => [
+        s.value ? (a(), r("div", {
           key: 0,
-          class: $(["xp-alert", [
+          class: B(["xp-alert", [
             `xp-alert--${e.type}`,
             `xp-alert--${e.effect}`,
             { "xp-alert--plain": e.effect === "plain" }
           ]]),
           role: "alert"
         }, [
-          c("span", re, k(n[e.type]), 1),
-          c("div", ie, [
-            c("span", de, [
-              b(o.$slots, "default", {}, () => [
-                X(k(e.title), 1)
+          o("span", Ce, k(l[e.type]), 1),
+          o("div", Se, [
+            o("span", ze, [
+              b(d.$slots, "default", {}, () => [
+                W(k(e.title), 1)
               ], !0)
             ]),
-            o.$slots.default ? (r(), i("p", ce, [
-              b(o.$slots, "default", {}, void 0, !0)
+            d.$slots.default ? (a(), r("p", Be, [
+              b(d.$slots, "default", {}, void 0, !0)
             ])) : g("", !0)
           ]),
-          e.closable ? (r(), i("i", {
+          e.closable ? (a(), r("i", {
             key: 0,
             class: "xp-alert__close-btn",
-            onClick: s
+            onClick: u
           }, "×")) : g("", !0)
         ], 2)) : g("", !0)
       ]),
       _: 3
     }));
   }
-}, pe = /* @__PURE__ */ v(ue, [["__scopeId", "data-v-91d792bd"]]), fe = ["src", "alt"], he = {
+}, Ie = /* @__PURE__ */ C(Me, [["__scopeId", "data-v-91d792bd"]]), Te = ["src", "alt"], Ve = {
   key: 1,
   class: "xp-avatar__slot"
-}, me = {
+}, Ee = {
   key: 2,
   class: "xp-avatar__text"
-}, ge = {
+}, Ae = {
   __name: "Avatar",
   props: {
     src: {
@@ -108,32 +108,32 @@ const v = (e, t) => {
     }
   },
   emits: ["error"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = _(!1), s = w(() => ({
-      backgroundColor: a.src ? "transparent" : "var(--xp-color-primary-bg)",
-      color: a.src ? void 0 : "var(--xp-color-primary)"
-    })), o = () => {
-      n.value = !0, l("error");
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = z(!1), u = M(() => ({
+      backgroundColor: t.src ? "transparent" : "var(--xp-color-primary-bg)",
+      color: t.src ? void 0 : "var(--xp-color-primary)"
+    })), d = () => {
+      l.value = !0, s("error");
     };
-    return (u, f) => (r(), i("span", {
-      class: $(["xp-avatar", [
+    return (x, m) => (a(), r("span", {
+      class: B(["xp-avatar", [
         `xp-avatar--${e.shape}`,
         `xp-avatar--${e.size}`,
         { "xp-avatar--fit": e.src }
       ]]),
-      style: C(s.value)
+      style: T(u.value)
     }, [
-      e.src && !n.value ? (r(), i("img", {
+      e.src && !l.value ? (a(), r("img", {
         key: 0,
         src: e.src,
         alt: e.alt,
-        onError: o
-      }, null, 40, fe)) : u.$slots.default ? (r(), i("span", he, [
-        b(u.$slots, "default", {}, void 0, !0)
-      ])) : (r(), i("span", me, k(e.alt || "A"), 1))
+        onError: d
+      }, null, 40, Te)) : x.$slots.default ? (a(), r("span", Ve, [
+        b(x.$slots, "default", {}, void 0, !0)
+      ])) : (a(), r("span", Ee, k(e.alt || "A"), 1))
     ], 6));
   }
-}, be = /* @__PURE__ */ v(ge, [["__scopeId", "data-v-a9a54bc5"]]), xe = { key: 0 }, ve = {
+}, De = /* @__PURE__ */ C(Ae, [["__scopeId", "data-v-a9a54bc5"]]), je = { key: 0 }, Ne = {
   __name: "Badge",
   props: {
     value: {
@@ -159,32 +159,32 @@ const v = (e, t) => {
     }
   },
   setup(e) {
-    const t = e, a = w(() => typeof t.value == "number" && t.value > t.max ? `${t.max}+` : t.value), l = w(() => t.value !== 0 && t.value !== "" && t.value !== null && t.value !== void 0);
-    return (n, s) => (r(), i("div", {
-      class: $(["xp-badge", { "xp-badge--dot": e.isDot, "xp-badge--hidden": e.hidden }])
+    const n = e, t = M(() => typeof n.value == "number" && n.value > n.max ? `${n.max}+` : n.value), s = M(() => n.value !== 0 && n.value !== "" && n.value !== null && n.value !== void 0);
+    return (l, u) => (a(), r("div", {
+      class: B(["xp-badge", { "xp-badge--dot": e.isDot, "xp-badge--hidden": e.hidden }])
     }, [
-      b(n.$slots, "default", {}, void 0, !0),
-      !e.hidden && (e.isDot || l.value) ? (r(), i("sup", {
+      b(l.$slots, "default", {}, void 0, !0),
+      !e.hidden && (e.isDot || s.value) ? (a(), r("sup", {
         key: 0,
-        class: $(["xp-badge__content", [
+        class: B(["xp-badge__content", [
           `xp-badge__content--${e.type}`,
           { "xp-badge__content--dot": e.isDot }
         ]])
       }, [
-        e.isDot ? g("", !0) : (r(), i("span", xe, k(a.value), 1))
+        e.isDot ? g("", !0) : (a(), r("span", je, k(t.value), 1))
       ], 2)) : g("", !0)
     ], 2));
   }
-}, ye = /* @__PURE__ */ v(ve, [["__scopeId", "data-v-207db6dd"]]), _e = ["disabled"], $e = {
+}, Fe = /* @__PURE__ */ C(Ne, [["__scopeId", "data-v-207db6dd"]]), Re = ["disabled"], Oe = {
   key: 0,
   class: "xp-button__loading"
-}, ke = { class: "xp-button__text" }, we = {
+}, Xe = { class: "xp-button__text" }, Le = {
   __name: "Button",
   props: {
     type: {
       type: String,
       default: "default",
-      validator: (e) => ["primary", "default", "success", "warning", "danger", "info"].includes(e)
+      validator: (e) => ["primary", "default", "success", "warning", "danger", "info", "ghost"].includes(e)
     },
     size: {
       type: String,
@@ -209,12 +209,12 @@ const v = (e, t) => {
     }
   },
   emits: ["click"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = (s) => {
-      !a.disabled && !a.loading && l("click", s);
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = (u) => {
+      !t.disabled && !t.loading && s("click", u);
     };
-    return (s, o) => (r(), i("button", {
-      class: $(["xp-button", [
+    return (u, d) => (a(), r("button", {
+      class: B(["xp-button", [
         `xp-button--${e.type}`,
         `xp-button--${e.size}`,
         {
@@ -225,24 +225,24 @@ const v = (e, t) => {
         }
       ]]),
       disabled: e.disabled || e.loading,
-      onClick: n
+      onClick: l
     }, [
-      e.loading ? (r(), i("span", $e)) : g("", !0),
-      c("span", ke, [
-        b(s.$slots, "default", {}, void 0, !0)
+      e.loading ? (a(), r("span", Oe)) : g("", !0),
+      o("span", Xe, [
+        b(u.$slots, "default", {}, void 0, !0)
       ])
-    ], 10, _e));
+    ], 10, Re));
   }
-}, F = /* @__PURE__ */ v(we, [["__scopeId", "data-v-a768661d"]]), Ce = {
+}, K = /* @__PURE__ */ C(Le, [["__scopeId", "data-v-9c6bc634"]]), Pe = {
   key: 0,
   class: "xp-card__header"
-}, Se = { class: "xp-card__title" }, Be = {
+}, We = { class: "xp-card__title" }, Je = {
   key: 0,
   class: "xp-card__extra"
-}, Ve = { class: "xp-card__body" }, Te = {
+}, He = { class: "xp-card__body" }, Ue = {
   key: 1,
   class: "xp-card__footer"
-}, Ie = {
+}, Ge = {
   __name: "Card",
   props: {
     title: {
@@ -264,8 +264,8 @@ const v = (e, t) => {
     }
   },
   setup(e) {
-    return (t, a) => (r(), i("div", {
-      class: $(["xp-card", [
+    return (n, t) => (a(), r("div", {
+      class: B(["xp-card", [
         `xp-card--${e.shadow}`,
         {
           "xp-card--bordered": e.bordered,
@@ -273,23 +273,23 @@ const v = (e, t) => {
         }
       ]])
     }, [
-      e.title || t.$slots.header ? (r(), i("div", Ce, [
-        b(t.$slots, "header", {}, () => [
-          c("h3", Se, k(e.title), 1)
+      e.title || n.$slots.header ? (a(), r("div", Pe, [
+        b(n.$slots, "header", {}, () => [
+          o("h3", We, k(e.title), 1)
         ], !0),
-        t.$slots.extra ? (r(), i("div", Be, [
-          b(t.$slots, "extra", {}, void 0, !0)
+        n.$slots.extra ? (a(), r("div", Je, [
+          b(n.$slots, "extra", {}, void 0, !0)
         ])) : g("", !0)
       ])) : g("", !0),
-      c("div", Ve, [
-        b(t.$slots, "default", {}, void 0, !0)
+      o("div", He, [
+        b(n.$slots, "default", {}, void 0, !0)
       ]),
-      t.$slots.footer ? (r(), i("div", Te, [
-        b(t.$slots, "footer", {}, void 0, !0)
+      n.$slots.footer ? (a(), r("div", Ue, [
+        b(n.$slots, "footer", {}, void 0, !0)
       ])) : g("", !0)
     ], 2));
   }
-}, Re = /* @__PURE__ */ v(Ie, [["__scopeId", "data-v-e65cbe05"]]), Me = { class: "xp-checkbox__input" }, Ne = ["checked", "disabled", ".indeterminate"], Xe = { class: "xp-checkbox__label" }, Ae = {
+}, qe = /* @__PURE__ */ C(Ge, [["__scopeId", "data-v-e65cbe05"]]), Ye = { class: "xp-checkbox__input" }, Ke = ["checked", "disabled", ".indeterminate"], Ze = { class: "xp-checkbox__label" }, Qe = {
   __name: "Checkbox",
   props: {
     modelValue: {
@@ -306,14 +306,14 @@ const v = (e, t) => {
     }
   },
   emits: ["update:modelValue", "change"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = (s) => {
-      if (a.disabled) return;
-      const o = s.target.checked;
-      l("update:modelValue", o), l("change", o);
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = (u) => {
+      if (t.disabled) return;
+      const d = u.target.checked;
+      s("update:modelValue", d), s("change", d);
     };
-    return (s, o) => (r(), i("label", {
-      class: $(["xp-checkbox", [
+    return (u, d) => (a(), r("label", {
+      class: B(["xp-checkbox", [
         {
           "xp-checkbox--checked": e.modelValue,
           "xp-checkbox--disabled": e.disabled,
@@ -321,26 +321,101 @@ const v = (e, t) => {
         }
       ]])
     }, [
-      c("span", Me, [
-        o[0] || (o[0] = c("span", { class: "xp-checkbox__inner" }, null, -1)),
-        c("input", {
+      o("span", Ye, [
+        d[0] || (d[0] = o("span", { class: "xp-checkbox__inner" }, null, -1)),
+        o("input", {
           type: "checkbox",
           class: "xp-checkbox__original",
           checked: e.modelValue,
           disabled: e.disabled,
-          onChange: n,
+          onChange: l,
           ".indeterminate": e.indeterminate
-        }, null, 40, Ne)
+        }, null, 40, Ke)
       ]),
-      c("span", Xe, [
-        b(s.$slots, "default", {}, void 0, !0)
+      o("span", Ze, [
+        b(u.$slots, "default", {}, void 0, !0)
       ])
     ], 2));
   }
-}, Oe = /* @__PURE__ */ v(Ae, [["__scopeId", "data-v-7c078f46"]]), je = { class: "xp-dialog__header" }, De = { class: "xp-dialog__title" }, Ee = { class: "xp-dialog__body" }, ze = {
+}, et = /* @__PURE__ */ C(Qe, [["__scopeId", "data-v-7c078f46"]]), tt = {
+  key: 0,
+  class: "xp-menu__divider"
+}, nt = ["disabled", "onClick"], ot = {
+  key: 0,
+  class: "xp-menu__icon",
+  "aria-hidden": "true"
+}, st = { class: "xp-menu__label" }, lt = {
+  __name: "ContextMenu",
+  props: {
+    visible: { type: Boolean, default: !1 },
+    x: { type: Number, default: 0 },
+    y: { type: Number, default: 0 },
+    /**
+     * 菜单项：{ label, icon?, command?, danger?, disabled?, divider?, onClick? }
+     * divider 为 true 时渲染分隔线；select / command 事件与 onClick 三者按需使用
+     */
+    items: { type: Array, default: () => [] }
+  },
+  emits: ["close", "select", "command"],
+  setup(e, { emit: n }) {
+    const t = e, s = n;
+    z(null);
+    const l = M(() => {
+      const f = Math.min(t.items.filter((h) => !h.divider).length, 12) * 32 + 12;
+      let i = t.x, c = t.y;
+      return i + 220 > window.innerWidth - 8 && (i = Math.max(8, window.innerWidth - 220 - 8)), c + f > window.innerHeight - 8 && (c = Math.max(8, window.innerHeight - f - 8)), { left: `${i}px`, top: `${c}px` };
+    });
+    function u() {
+      s("close");
+    }
+    function d(m) {
+      m.disabled || (s("close"), s("select", m), s("command", m.command), m.onClick && m.onClick());
+    }
+    function x(m) {
+      m.key === "Escape" && t.visible && s("close");
+    }
+    return ie(() => window.removeEventListener("keydown", x)), (m, f) => (a(), R(H, { to: "body" }, [
+      A(D, { name: "xp-menu" }, {
+        default: E(() => [
+          e.visible ? (a(), r("div", {
+            key: 0,
+            class: "xp-menu-mask",
+            onMousedown: u,
+            onContextmenu: f[2] || (f[2] = j(() => {
+            }, ["prevent"]))
+          }, [
+            o("div", {
+              class: "xp-menu",
+              style: T(l.value),
+              role: "menu",
+              onMousedown: f[0] || (f[0] = j(() => {
+              }, ["stop"])),
+              onMouseup: f[1] || (f[1] = j(() => {
+              }, ["stop"]))
+            }, [
+              (a(!0), r(_, null, V(e.items, (i, c) => (a(), r(_, { key: c }, [
+                i.divider ? (a(), r("div", tt)) : (a(), r("button", {
+                  key: 1,
+                  class: B(["xp-menu__item", { "xp-menu__item--danger": i.danger, "xp-menu__item--disabled": i.disabled }]),
+                  role: "menuitem",
+                  disabled: i.disabled,
+                  onClick: (h) => d(i)
+                }, [
+                  i.icon ? (a(), r("span", ot, k(i.icon), 1)) : g("", !0),
+                  o("span", st, k(i.label), 1)
+                ], 10, nt))
+              ], 64))), 128))
+            ], 36)
+          ], 32)) : g("", !0)
+        ]),
+        _: 1
+      })
+    ]));
+  }
+}, at = /* @__PURE__ */ C(lt, [["__scopeId", "data-v-7477a575"]]), it = { class: "xp-dialog__header" }, rt = { class: "xp-dialog__title" }, dt = { class: "xp-dialog__body" }, ut = {
   key: 0,
   class: "xp-dialog__footer"
-}, Fe = {
+}, ct = {
   __name: "Dialog",
   props: {
     visible: {
@@ -373,59 +448,67 @@ const v = (e, t) => {
     }
   },
   emits: ["confirm", "cancel", "update:visible", "close"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = () => {
-      l("update:visible", !1), l("close");
-    }, s = () => {
-      a.closeOnClickModal && n();
-    }, o = () => {
-      l("confirm"), n();
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = () => {
+      s("update:visible", !1), s("close");
     }, u = () => {
-      l("cancel"), n();
+      t.closeOnClickModal && l();
+    }, d = () => {
+      s("confirm"), l();
+    }, x = () => {
+      s("cancel"), l();
     };
-    return (f, p) => (r(), z(L, { to: "body" }, [
-      B(N, { name: "xp-dialog-fade" }, {
-        default: S(() => [
-          e.visible ? (r(), i("div", {
+    function m(f) {
+      f.key === "Escape" && t.visible && l();
+    }
+    return re(
+      () => t.visible,
+      (f) => {
+        f ? window.addEventListener("keydown", m) : window.removeEventListener("keydown", m);
+      }
+    ), ie(() => window.removeEventListener("keydown", m)), (f, i) => (a(), R(H, { to: "body" }, [
+      A(D, { name: "xp-dialog-fade" }, {
+        default: E(() => [
+          e.visible ? (a(), r("div", {
             key: 0,
             class: "xp-dialog__wrapper",
-            onClick: K(s, ["self"])
+            onClick: j(u, ["self"])
           }, [
-            p[0] || (p[0] = c("div", { class: "xp-dialog__mask" }, null, -1)),
-            B(N, {
+            i[0] || (i[0] = o("div", { class: "xp-dialog__mask" }, null, -1)),
+            A(D, {
               name: "xp-dialog-slide",
               appear: ""
             }, {
-              default: S(() => [
-                e.visible ? (r(), i("div", {
+              default: E(() => [
+                e.visible ? (a(), r("div", {
                   key: 0,
                   class: "xp-dialog",
-                  style: C({ width: e.width })
+                  style: T({ width: e.width })
                 }, [
-                  c("div", je, [
-                    c("h3", De, k(e.title), 1),
-                    c("button", {
+                  o("div", it, [
+                    o("h3", rt, k(e.title), 1),
+                    o("button", {
                       class: "xp-dialog__close",
-                      onClick: n
+                      onClick: l
                     }, "×")
                   ]),
-                  c("div", Ee, [
+                  o("div", dt, [
                     b(f.$slots, "default", {}, void 0, !0)
                   ]),
-                  f.$slots.footer || e.showDefaultFooter ? (r(), i("div", ze, [
+                  f.$slots.footer || e.showDefaultFooter ? (a(), r("div", ut, [
                     b(f.$slots, "footer", {}, () => [
-                      B(F, { onClick: u }, {
-                        default: S(() => [
-                          X(k(e.cancelButtonText), 1)
+                      A(K, { onClick: x }, {
+                        default: E(() => [
+                          W(k(e.cancelButtonText), 1)
                         ]),
                         _: 1
                       }),
-                      B(F, {
+                      A(K, {
                         type: "primary",
-                        onClick: o
+                        onClick: d
                       }, {
-                        default: S(() => [
-                          X(k(e.confirmButtonText), 1)
+                        default: E(() => [
+                          W(k(e.confirmButtonText), 1)
                         ]),
                         _: 1
                       })
@@ -441,10 +524,10 @@ const v = (e, t) => {
       })
     ]));
   }
-}, Pe = /* @__PURE__ */ v(Fe, [["__scopeId", "data-v-ef43d114"]]), Le = ["onClick"], Je = { key: 0 }, We = {
+}, pt = /* @__PURE__ */ C(ct, [["__scopeId", "data-v-f85c5a46"]]), ft = ["onClick"], mt = { key: 0 }, ht = {
   key: 1,
   class: "xp-dropdown__divider"
-}, qe = {
+}, xt = {
   __name: "Dropdown",
   props: {
     items: {
@@ -457,58 +540,58 @@ const v = (e, t) => {
     }
   },
   emits: ["select", "command", "open", "close"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = _(!1), s = _({}), o = _(null), u = _(null), f = () => {
-      Z(() => {
-        if (!o.value || !u.value) return;
-        const d = o.value.getBoundingClientRect(), y = u.value.getBoundingClientRect();
-        let x = d.bottom + 6, I = d.left;
-        I + y.width > window.innerWidth - 10 && (I = window.innerWidth - y.width - 10), x + y.height > window.innerHeight - 10 && (x = d.top - y.height - 6), s.value = {
-          top: `${x + window.scrollY}px`,
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = z(!1), u = z({}), d = z(null), x = z(null), m = () => {
+      ue(() => {
+        if (!d.value || !x.value) return;
+        const h = d.value.getBoundingClientRect(), $ = x.value.getBoundingClientRect();
+        let w = h.bottom + 6, I = h.left;
+        I + $.width > window.innerWidth - 10 && (I = window.innerWidth - $.width - 10), w + $.height > window.innerHeight - 10 && (w = h.top - $.height - 6), u.value = {
+          top: `${w + window.scrollY}px`,
           left: `${I + window.scrollX}px`
         };
       });
-    }, p = () => {
-      a.disabled || (n.value = !n.value, n.value ? (f(), l("open")) : l("close"));
-    }, m = (d) => {
-      d.disabled || d.divider || (l("select", d), d.command !== void 0 && l("command", d.command, d), n.value = !1, l("close"));
-    }, h = (d) => {
-      var y;
-      n.value && o.value && !o.value.contains(d.target) && !((y = u.value) != null && y.contains(d.target)) && (n.value = !1, l("close"));
+    }, f = () => {
+      t.disabled || (l.value = !l.value, l.value ? (m(), s("open")) : s("close"));
+    }, i = (h) => {
+      h.disabled || h.divider || (s("select", h), h.command !== void 0 && s("command", h.command, h), l.value = !1, s("close"));
+    }, c = (h) => {
+      var $;
+      l.value && d.value && !d.value.contains(h.target) && !(($ = x.value) != null && $.contains(h.target)) && (l.value = !1, s("close"));
     };
-    return Q(() => {
-      document.addEventListener("click", h);
-    }), J(() => {
-      document.removeEventListener("click", h);
-    }), (d, y) => (r(), i("div", {
+    return de(() => {
+      document.addEventListener("click", c);
+    }), Q(() => {
+      document.removeEventListener("click", c);
+    }), (h, $) => (a(), r("div", {
       class: "xp-dropdown",
       ref_key: "dropdownRef",
-      ref: o
+      ref: d
     }, [
-      c("div", {
+      o("div", {
         class: "xp-dropdown__trigger",
-        onClick: p
+        onClick: f
       }, [
-        b(d.$slots, "default", {}, void 0, !0)
+        b(h.$slots, "default", {}, void 0, !0)
       ]),
-      (r(), z(L, { to: "body" }, [
-        B(N, { name: "xp-dropdown-fade" }, {
-          default: S(() => [
-            n.value ? (r(), i("div", {
+      (a(), R(H, { to: "body" }, [
+        A(D, { name: "xp-dropdown-fade" }, {
+          default: E(() => [
+            l.value ? (a(), r("div", {
               key: 0,
               class: "xp-dropdown__menu",
-              style: C(s.value),
+              style: T(u.value),
               ref_key: "menuRef",
-              ref: u
+              ref: x
             }, [
-              (r(!0), i(W, null, q(e.items, (x, I) => (r(), i("div", {
+              (a(!0), r(_, null, V(e.items, (w, I) => (a(), r("div", {
                 key: I,
-                class: $(["xp-dropdown__item", { "xp-dropdown__item--disabled": x.disabled, "xp-dropdown__item--divider": x.divider }]),
-                onClick: (Lt) => m(x)
+                class: B(["xp-dropdown__item", { "xp-dropdown__item--disabled": w.disabled, "xp-dropdown__item--divider": w.divider }]),
+                onClick: (te) => i(w)
               }, [
-                x.divider ? g("", !0) : (r(), i("span", Je, k(x.label), 1)),
-                x.divider ? (r(), i("span", We)) : g("", !0)
-              ], 10, Le))), 128))
+                w.divider ? g("", !0) : (a(), r("span", mt, k(w.label), 1)),
+                w.divider ? (a(), r("span", ht)) : g("", !0)
+              ], 10, ft))), 128))
             ], 4)) : g("", !0)
           ]),
           _: 1
@@ -516,19 +599,386 @@ const v = (e, t) => {
       ]))
     ], 512));
   }
-}, He = /* @__PURE__ */ v(qe, [["__scopeId", "data-v-ad741cd8"]]), Ue = {
+}, vt = /* @__PURE__ */ C(xt, [["__scopeId", "data-v-ad741cd8"]]), gt = { class: "xp-empty" }, yt = { class: "xp-empty__title" }, bt = {
+  key: 0,
+  class: "xp-empty__hint"
+}, _t = {
+  key: 1,
+  class: "xp-empty__action"
+}, kt = {
+  __name: "Empty",
+  props: {
+    title: { type: String, default: "暂无内容" },
+    hint: { type: String, default: "" }
+  },
+  setup(e) {
+    return (n, t) => (a(), r("div", gt, [
+      b(n.$slots, "icon", {}, () => [
+        t[0] || (t[0] = o("div", {
+          class: "xp-empty__icon",
+          "aria-hidden": "true"
+        }, [
+          o("svg", {
+            width: "46",
+            height: "46",
+            viewBox: "0 0 24 24",
+            fill: "none"
+          }, [
+            o("path", {
+              d: "M4 7a2 2 0 0 1 2-2h4l2 2h6a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2z",
+              stroke: "var(--xp-border-color)",
+              "stroke-width": "1.5",
+              "stroke-linejoin": "round"
+            })
+          ])
+        ], -1))
+      ], !0),
+      o("p", yt, k(e.title), 1),
+      e.hint ? (a(), r("p", bt, k(e.hint), 1)) : g("", !0),
+      n.$slots.default ? (a(), r("div", _t, [
+        b(n.$slots, "default", {}, void 0, !0)
+      ])) : g("", !0)
+    ]));
+  }
+}, $t = /* @__PURE__ */ C(kt, [["__scopeId", "data-v-93d5e1e9"]]), wt = ["width", "height"], Ct = {
+  __name: "FileIcon",
+  props: {
+    type: { type: String, default: "file" },
+    size: { type: Number, default: 20 }
+  },
+  setup(e) {
+    return (n, t) => (a(), r("span", {
+      class: "xp-file-icon",
+      style: T({ width: e.size + "px", height: e.size + "px" }),
+      "aria-hidden": "true"
+    }, [
+      (a(), r("svg", {
+        width: e.size,
+        height: e.size,
+        viewBox: "0 0 24 24",
+        fill: "none"
+      }, [
+        e.type === "folder" ? (a(), r(_, { key: 0 }, [
+          t[0] || (t[0] = o("path", {
+            d: "M3 6.5A2.5 2.5 0 0 1 5.5 4h4l2 2h7A2.5 2.5 0 0 1 21 8.5v9A2.5 2.5 0 0 1 18.5 20h-13A2.5 2.5 0 0 1 3 17.5z",
+            fill: "#E8B64E",
+            "fill-opacity": "0.9"
+          }, null, -1)),
+          t[1] || (t[1] = o("path", {
+            d: "M3 8.5h18v9A2.5 2.5 0 0 1 18.5 20h-13A2.5 2.5 0 0 1 3 17.5z",
+            fill: "#F3CE78"
+          }, null, -1))
+        ], 64)) : e.type === "image" ? (a(), r(_, { key: 1 }, [
+          t[2] || (t[2] = o("rect", {
+            x: "3",
+            y: "4",
+            width: "18",
+            height: "16",
+            rx: "2.4",
+            fill: "#4FA8C9",
+            "fill-opacity": "0.16",
+            stroke: "#3D8EAD",
+            "stroke-width": "1.4"
+          }, null, -1)),
+          t[3] || (t[3] = o("circle", {
+            cx: "9",
+            cy: "10",
+            r: "1.8",
+            fill: "#3D8EAD"
+          }, null, -1)),
+          t[4] || (t[4] = o("path", {
+            d: "M4.4 17.4l4.6-4.4 3 2.8 3.2-3.2 4.4 4.2",
+            stroke: "#3D8EAD",
+            "stroke-width": "1.4",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            fill: "none"
+          }, null, -1))
+        ], 64)) : e.type === "video" ? (a(), r(_, { key: 2 }, [
+          t[5] || (t[5] = o("rect", {
+            x: "3",
+            y: "5",
+            width: "13",
+            height: "14",
+            rx: "2.4",
+            fill: "#9B5FD1",
+            "fill-opacity": "0.14",
+            stroke: "#8A48C4",
+            "stroke-width": "1.4"
+          }, null, -1)),
+          t[6] || (t[6] = o("path", {
+            d: "M16 10.5l5-3v9l-5-3z",
+            fill: "#8A48C4"
+          }, null, -1))
+        ], 64)) : e.type === "audio" ? (a(), r(_, { key: 3 }, [
+          t[7] || (t[7] = o("path", {
+            d: "M9 18V6l10-2v11",
+            stroke: "#C2569B",
+            "stroke-width": "1.6",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            fill: "none"
+          }, null, -1)),
+          t[8] || (t[8] = o("circle", {
+            cx: "6.6",
+            cy: "18",
+            r: "2.4",
+            fill: "#C2569B"
+          }, null, -1)),
+          t[9] || (t[9] = o("circle", {
+            cx: "16.6",
+            cy: "15",
+            r: "2.4",
+            fill: "#C2569B"
+          }, null, -1))
+        ], 64)) : e.type === "pdf" ? (a(), r(_, { key: 4 }, [
+          t[10] || (t[10] = o("rect", {
+            x: "4",
+            y: "3",
+            width: "16",
+            height: "18",
+            rx: "2.4",
+            fill: "#D9504A",
+            "fill-opacity": "0.14",
+            stroke: "#C24842",
+            "stroke-width": "1.4"
+          }, null, -1)),
+          t[11] || (t[11] = o("text", {
+            x: "12",
+            y: "16.2",
+            "text-anchor": "middle",
+            "font-size": "9.5",
+            "font-weight": "700",
+            fill: "#C24842",
+            "font-family": "Arial, sans-serif"
+          }, "PDF", -1))
+        ], 64)) : e.type === "doc" ? (a(), r(_, { key: 5 }, [
+          t[12] || (t[12] = o("path", {
+            d: "M5 3.5h9l5 5v12h-14z",
+            fill: "#3B7FD6",
+            "fill-opacity": "0.14",
+            stroke: "#2F6DC0",
+            "stroke-width": "1.4",
+            "stroke-linejoin": "round"
+          }, null, -1)),
+          t[13] || (t[13] = o("path", {
+            d: "M14 3.5v5h5",
+            fill: "none",
+            stroke: "#2F6DC0",
+            "stroke-width": "1.4",
+            "stroke-linejoin": "round"
+          }, null, -1)),
+          t[14] || (t[14] = o("path", {
+            d: "M7.5 12v5M7.5 14.5h3",
+            stroke: "#2F6DC0",
+            "stroke-width": "1.4",
+            "stroke-linecap": "round"
+          }, null, -1)),
+          t[15] || (t[15] = o("path", {
+            d: "M13.5 12h3M13.5 14.5h3M13.5 17h2",
+            stroke: "#2F6DC0",
+            "stroke-width": "1.4",
+            "stroke-linecap": "round"
+          }, null, -1))
+        ], 64)) : e.type === "sheet" ? (a(), r(_, { key: 6 }, [
+          t[16] || (t[16] = o("rect", {
+            x: "4",
+            y: "3.5",
+            width: "16",
+            height: "17",
+            rx: "2.4",
+            fill: "#3E9C5E",
+            "fill-opacity": "0.14",
+            stroke: "#33854F",
+            "stroke-width": "1.4"
+          }, null, -1)),
+          t[17] || (t[17] = o("path", {
+            d: "M4 9h16M4 14h16M10 9v11.5M14.5 9v11.5",
+            stroke: "#33854F",
+            "stroke-width": "1.2",
+            "stroke-linecap": "round"
+          }, null, -1))
+        ], 64)) : e.type === "slide" ? (a(), r(_, { key: 7 }, [
+          t[18] || (t[18] = o("rect", {
+            x: "3",
+            y: "5",
+            width: "18",
+            height: "12",
+            rx: "2.4",
+            fill: "#E09A2F",
+            "fill-opacity": "0.16",
+            stroke: "#CC8420",
+            "stroke-width": "1.4"
+          }, null, -1)),
+          t[19] || (t[19] = o("path", {
+            d: "M12 17v3M9.5 20h5",
+            stroke: "#CC8420",
+            "stroke-width": "1.4",
+            "stroke-linecap": "round"
+          }, null, -1)),
+          t[20] || (t[20] = o("circle", {
+            cx: "9",
+            cy: "10.4",
+            r: "1.3",
+            fill: "#CC8420"
+          }, null, -1)),
+          t[21] || (t[21] = o("path", {
+            d: "M6 14.4l2.8-2.8 2 1.8L14 9.6l4 4.4",
+            stroke: "#CC8420",
+            "stroke-width": "1.4",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            fill: "none"
+          }, null, -1))
+        ], 64)) : e.type === "archive" ? (a(), r(_, { key: 8 }, [
+          t[22] || (t[22] = o("rect", {
+            x: "4",
+            y: "3.5",
+            width: "16",
+            height: "17",
+            rx: "2.4",
+            fill: "#A97D4E",
+            "fill-opacity": "0.16",
+            stroke: "#8F6539",
+            "stroke-width": "1.4"
+          }, null, -1)),
+          t[23] || (t[23] = o("path", {
+            d: "M9.5 4v16M14.5 4v16M4 12h16",
+            stroke: "#8F6539",
+            "stroke-width": "1.3"
+          }, null, -1))
+        ], 64)) : e.type === "code" ? (a(), r(_, { key: 9 }, [
+          t[24] || (t[24] = o("path", {
+            d: "M8.5 8l-4.5 4 4.5 4M15.5 8l4.5 4-4.5 4",
+            stroke: "#6B62E0",
+            "stroke-width": "1.7",
+            "stroke-linecap": "round",
+            "stroke-linejoin": "round",
+            fill: "none"
+          }, null, -1)),
+          t[25] || (t[25] = o("path", {
+            d: "M13.6 5.8l-3.2 12.4",
+            stroke: "#6B62E0",
+            "stroke-width": "1.5",
+            "stroke-linecap": "round"
+          }, null, -1))
+        ], 64)) : e.type === "text" ? (a(), r(_, { key: 10 }, [
+          t[26] || (t[26] = o("path", {
+            d: "M4 6.2C4 5 4.9 4 6.5 4h11C19 4 20 5 20 6.2v11.6C20 19 19 20 17.5 20h-11C4.9 20 4 19 4 17.8z",
+            fill: "#7D8894",
+            "fill-opacity": "0.12",
+            stroke: "#5F6B78",
+            "stroke-width": "1.4"
+          }, null, -1)),
+          t[27] || (t[27] = o("path", {
+            d: "M7.5 8.5h9M7.5 12h6.5",
+            stroke: "#5F6B78",
+            "stroke-width": "1.5",
+            "stroke-linecap": "round"
+          }, null, -1))
+        ], 64)) : (a(), r(_, { key: 11 }, [
+          t[28] || (t[28] = o("path", {
+            d: "M6 3.5h8l5 5v12h-13z",
+            fill: "#A2AAB4",
+            "fill-opacity": "0.16",
+            stroke: "#7C8590",
+            "stroke-width": "1.4",
+            "stroke-linejoin": "round"
+          }, null, -1)),
+          t[29] || (t[29] = o("path", {
+            d: "M14 3.5v5h5",
+            fill: "none",
+            stroke: "#7C8590",
+            "stroke-width": "1.4",
+            "stroke-linejoin": "round"
+          }, null, -1)),
+          t[30] || (t[30] = o("path", {
+            d: "M8 12.5h8M8 15.5h8M8 18.5h5",
+            stroke: "#7C8590",
+            "stroke-width": "1.3",
+            "stroke-linecap": "round"
+          }, null, -1))
+        ], 64))
+      ], 8, wt))
+    ], 4));
+  }
+}, St = /* @__PURE__ */ C(Ct, [["__scopeId", "data-v-c598c294"]]), zt = '<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg class="icon" width="200px" height="200.00px" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M330.666667 512c0-14.933333 4.266667-29.866667 14.933333-40.533333l234.666667-277.33333399c23.466667-27.733333 64-29.866667 89.6-8.53333301 27.733333 23.466667 29.866667 64 8.53333299 89.6L477.866667 512l200.53333299 236.8c23.466667 27.733333 19.19999999 68.266667-8.53333299 89.6-27.733333 23.466667-68.266667 19.19999999-89.6-8.53333301l-234.666667-277.33333399c-10.666667-10.666667-14.933333-25.6-14.933333-40.533333z"  /></svg>', Bt = ["viewBox", "innerHTML"], Mt = {
+  key: 2,
+  class: "xp-icon__fallback"
+}, It = {
+  __name: "Icon",
+  props: {
+    name: {
+      type: String,
+      default: ""
+    },
+    size: {
+      type: [String, Number],
+      default: "medium"
+    },
+    color: {
+      type: String,
+      default: ""
+    },
+    spin: {
+      type: Boolean,
+      default: !1
+    },
+    rotate: {
+      type: Number,
+      default: 0
+    }
+  },
+  setup(e) {
+    const n = ["small", "medium", "large"], t = e, s = /* @__PURE__ */ Object.assign({ "./icons/jiantou.svg": zt }), l = (i) => i && i.replace(/\bfill\s*=\s*["'](?!none["'])[^"']+["']/gi, 'fill="currentColor"').replace(/\bstroke\s*=\s*["'](?!none["'])[^"']+["']/gi, 'stroke="currentColor"'), u = M(() => {
+      if (!t.name) return null;
+      const i = `./icons/${t.name}.svg`, c = s[i];
+      if (!c) return null;
+      const h = c.match(/<svg[^>]*>([\s\S]*)<\/svg>/i), $ = l(h ? h[1] : c), w = c.match(/viewBox\s*=\s*["']([^"']+)["']/i);
+      return {
+        inner: $,
+        viewBox: w ? w[1] : "0 0 24 24"
+      };
+    }), d = M(() => n.includes(String(t.size))), x = M(() => {
+      if (d.value) return null;
+      const i = t.size;
+      return typeof i == "number" ? `${i}px` : typeof i == "string" && i.trim() ? /^\d+(\.\d+)?$/.test(i.trim()) ? `${i}px` : i.trim() : null;
+    }), m = M(() => {
+      const i = [];
+      return d.value && i.push(`xp-icon--${t.size}`), t.spin && i.push("xp-icon--spin"), i;
+    }), f = M(() => {
+      const i = {};
+      return t.color && (i.color = t.color), t.rotate && (i.transform = `rotate(${t.rotate}deg)`), x.value && (i.width = x.value, i.height = x.value, i.fontSize = x.value), i;
+    });
+    return (i, c) => (a(), r("i", {
+      class: B(["xp-icon", m.value]),
+      style: T(f.value)
+    }, [
+      i.$slots.default ? b(i.$slots, "default", { key: 0 }, void 0, !0) : u.value ? (a(), r("svg", {
+        key: 1,
+        viewBox: u.value.viewBox,
+        innerHTML: u.value.inner
+      }, null, 8, Bt)) : (a(), r("span", Mt, "?"))
+    ], 6));
+  }
+}, Tt = /* @__PURE__ */ C(It, [["__scopeId", "data-v-14319319"]]), Vt = {
   key: 0,
   class: "xp-input__prefix"
-}, Ye = ["type", "value", "placeholder", "disabled", "maxlength"], Ge = {
+}, Et = ["id", "type", "value", "placeholder", "disabled", "maxlength"], At = {
   key: 2,
   class: "xp-input__suffix"
-}, Ke = {
+}, Dt = {
   __name: "Input",
   props: {
     modelValue: {
       type: [String, Number],
       default: ""
     },
+    /** 原生 input 的 id，用于配合 label[for] 聚焦 */
+    id: {
+      type: String,
+      default: ""
+    },
     type: {
       type: String,
       default: "text",
@@ -557,57 +1007,62 @@ const v = (e, t) => {
     }
   },
   emits: ["update:modelValue", "focus", "blur", "clear"],
-  setup(e, { emit: t }) {
-    const a = t, l = _(null), n = _(!1), s = (p) => {
-      a("update:modelValue", p.target.value);
-    }, o = (p) => {
-      n.value = !0, a("focus", p);
-    }, u = (p) => {
-      n.value = !1, a("blur", p);
+  setup(e, { expose: n, emit: t }) {
+    const s = t, l = z(null), u = z(!1), d = (i) => {
+      s("update:modelValue", i.target.value);
+    }, x = (i) => {
+      u.value = !0, s("focus", i);
+    }, m = (i) => {
+      u.value = !1, s("blur", i);
     }, f = () => {
-      a("update:modelValue", ""), a("clear"), l.value && l.value.focus();
+      s("update:modelValue", ""), s("clear"), l.value && l.value.focus();
     };
-    return (p, m) => (r(), i("div", {
-      class: $(["xp-input", [
+    return n({
+      focus: () => l.value && l.value.focus(),
+      select: () => l.value && l.value.select(),
+      blur: () => l.value && l.value.blur()
+    }), (i, c) => (a(), r("div", {
+      class: B(["xp-input", [
         `xp-input--${e.size}`,
         {
           "xp-input--disabled": e.disabled,
-          "xp-input--prefix": p.$slots.prefix,
-          "xp-input--suffix": p.$slots.suffix || e.showClear,
-          "xp-input--focus": n.value
+          "xp-input--prefix": i.$slots.prefix,
+          "xp-input--suffix": i.$slots.suffix || e.showClear,
+          "xp-input--focus": u.value
         }
       ]])
     }, [
-      p.$slots.prefix ? (r(), i("span", Ue, [
-        b(p.$slots, "prefix", {}, void 0, !0)
+      i.$slots.prefix ? (a(), r("span", Vt, [
+        b(i.$slots, "prefix", {}, void 0, !0)
       ])) : g("", !0),
-      c("input", {
+      o("input", {
         ref_key: "inputRef",
         ref: l,
         class: "xp-input__inner",
+        id: e.id || void 0,
         type: e.type,
         value: e.modelValue,
         placeholder: e.placeholder,
         disabled: e.disabled,
         maxlength: e.maxlength,
-        onInput: s,
-        onFocus: o,
-        onBlur: u
-      }, null, 40, Ye),
-      e.showClear && e.modelValue && !e.disabled ? (r(), i("span", {
+        onInput: d,
+        onFocus: x,
+        onBlur: m
+      }, null, 40, Et),
+      e.showClear && e.modelValue && !e.disabled ? (a(), r("span", {
         key: 1,
         class: "xp-input__clear",
         onClick: f
       }, "×")) : g("", !0),
-      p.$slots.suffix && !e.showClear ? (r(), i("span", Ge, [
-        b(p.$slots, "suffix", {}, void 0, !0)
+      i.$slots.suffix && !e.showClear ? (a(), r("span", At, [
+        b(i.$slots, "suffix", {}, void 0, !0)
       ])) : g("", !0)
     ], 2));
   }
-}, Qe = /* @__PURE__ */ v(Ke, [["__scopeId", "data-v-f671ef9a"]]), Ze = { class: "xp-progress__bar" }, et = {
+}, jt = /* @__PURE__ */ C(Dt, [["__scopeId", "data-v-46247483"]]), Nt = {
   key: 0,
   class: "xp-progress__text"
-}, tt = {
+}, Ft = {
   __name: "Progress",
   props: {
     percentage: {
@@ -632,27 +1087,37 @@ const v = (e, t) => {
       type: String,
       default: "",
       validator: (e) => ["", "success", "warning", "exception"].includes(e)
+    },
+    /** line 模式下进度条轨道/内条高度（px），用于紧凑场景 */
+    strokeWidth: {
+      type: Number,
+      default: 8
     }
   },
   setup(e) {
-    const t = e, a = w(() => t.color ? t.color : t.status === "success" ? "var(--xp-color-success)" : t.status === "warning" ? "var(--xp-color-warning)" : t.status === "exception" ? "var(--xp-color-danger)" : "var(--xp-color-primary)");
-    return (l, n) => (r(), i("div", {
-      class: $(["xp-progress", [`xp-progress--${e.type}`]])
+    const n = e, t = M(
+      () => n.type === "line" ? { height: `${n.strokeWidth}px` } : {}
+    ), s = M(() => n.color ? n.color : n.status === "success" ? "var(--xp-color-success)" : n.status === "warning" ? "var(--xp-color-warning)" : n.status === "exception" ? "var(--xp-color-danger)" : "var(--xp-color-primary)");
+    return (l, u) => (a(), r("div", {
+      class: B(["xp-progress", [`xp-progress--${e.type}`]])
     }, [
-      c("div", Ze, [
-        c("div", {
+      o("div", {
+        class: "xp-progress__bar",
+        style: T(t.value)
+      }, [
+        o("div", {
           class: "xp-progress__inner",
-          style: C({ width: `${e.percentage}%`, backgroundColor: a.value })
+          style: T({ width: `${e.percentage}%`, backgroundColor: s.value })
         }, null, 4)
-      ]),
-      e.showText ? (r(), i("span", et, [
+      ], 4),
+      e.showText ? (a(), r("span", Nt, [
         b(l.$slots, "default", {}, () => [
-          X(k(e.percentage) + "%", 1)
+          W(k(e.percentage) + "%", 1)
         ], !0)
       ])) : g("", !0)
     ], 2));
   }
-}, at = /* @__PURE__ */ v(tt, [["__scopeId", "data-v-a95933c8"]]), lt = { class: "xp-radio__input" }, nt = ["checked", "disabled"], ot = { class: "xp-radio__label" }, st = {
+}, Rt = /* @__PURE__ */ C(Ft, [["__scopeId", "data-v-244dca2c"]]), Ot = { class: "xp-radio__input" }, Xt = ["checked", "disabled"], Lt = { class: "xp-radio__label" }, Pt = {
   __name: "Radio",
   props: {
     modelValue: {
@@ -669,37 +1134,37 @@ const v = (e, t) => {
     }
   },
   emits: ["update:modelValue", "change"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = () => {
-      a.disabled || (l("update:modelValue", a.value), l("change", a.value));
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = () => {
+      t.disabled || (s("update:modelValue", t.value), s("change", t.value));
     };
-    return (s, o) => (r(), i("label", {
-      class: $(["xp-radio", [
+    return (u, d) => (a(), r("label", {
+      class: B(["xp-radio", [
         {
           "xp-radio--checked": e.modelValue === e.value,
           "xp-radio--disabled": e.disabled
         }
       ]])
     }, [
-      c("span", lt, [
-        o[0] || (o[0] = c("span", { class: "xp-radio__inner" }, null, -1)),
-        c("input", {
+      o("span", Ot, [
+        d[0] || (d[0] = o("span", { class: "xp-radio__inner" }, null, -1)),
+        o("input", {
           type: "radio",
           class: "xp-radio__original",
           checked: e.modelValue === e.value,
           disabled: e.disabled,
-          onChange: n
-        }, null, 40, nt)
+          onChange: l
+        }, null, 40, Xt)
       ]),
-      c("span", ot, [
-        b(s.$slots, "default", {}, void 0, !0)
+      o("span", Lt, [
+        b(u.$slots, "default", {}, void 0, !0)
       ])
     ], 2));
   }
-}, rt = /* @__PURE__ */ v(st, [["__scopeId", "data-v-02a0d80d"]]), it = { class: "xp-rate" }, dt = ["onClick", "onMouseenter"], ct = { class: "xp-rate__star" }, ut = {
+}, Wt = /* @__PURE__ */ C(Pt, [["__scopeId", "data-v-02a0d80d"]]), Jt = { class: "xp-rate" }, Ht = ["onClick", "onMouseenter"], Ut = { class: "xp-rate__star" }, Gt = {
   key: 0,
   class: "xp-rate__text"
-}, pt = {
+}, qt = {
   __name: "Rate",
   props: {
     modelValue: {
@@ -724,39 +1189,39 @@ const v = (e, t) => {
     }
   },
   emits: ["update:modelValue", "change"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = _(0), s = w(() => n.value || a.modelValue), o = (f) => {
-      const p = s.value - f + 1;
-      return p >= 1 ? 100 : p > 0 ? p * 100 : 0;
-    }, u = (f) => {
-      a.disabled || (l("update:modelValue", f), l("change", f));
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = z(0), u = M(() => l.value || t.modelValue), d = (m) => {
+      const f = u.value - m + 1;
+      return f >= 1 ? 100 : f > 0 ? f * 100 : 0;
+    }, x = (m) => {
+      t.disabled || (s("update:modelValue", m), s("change", m));
     };
-    return (f, p) => (r(), i("div", it, [
-      (r(!0), i(W, null, q(e.max, (m) => (r(), i("span", {
-        key: m,
-        class: $(["xp-rate__item", {
+    return (m, f) => (a(), r("div", Jt, [
+      (a(!0), r(_, null, V(e.max, (i) => (a(), r("span", {
+        key: i,
+        class: B(["xp-rate__item", {
           "xp-rate__item--disabled": e.disabled
         }]),
-        style: C({ cursor: e.disabled ? "default" : "pointer" }),
-        onClick: (h) => u(m),
-        onMouseenter: (h) => n.value = m,
-        onMouseleave: p[0] || (p[0] = (h) => n.value = 0)
+        style: T({ cursor: e.disabled ? "default" : "pointer" }),
+        onClick: (c) => x(i),
+        onMouseenter: (c) => l.value = i,
+        onMouseleave: f[0] || (f[0] = (c) => l.value = 0)
       }, [
-        c("span", ct, [
-          c("span", {
+        o("span", Ut, [
+          f[1] || (f[1] = o("span", { class: "xp-rate__star-outer" }, "★", -1)),
+          o("span", {
             class: "xp-rate__star-inner",
-            style: C({ width: o(m) + "%", color: e.color })
-          }, " ★ ", 4),
-          p[1] || (p[1] = c("span", { class: "xp-rate__star-outer" }, "★", -1))
+            style: T({ width: d(i) + "%", color: e.color })
+          }, " ★ ", 4)
         ])
-      ], 46, dt))), 128)),
-      e.showText && !e.disabled ? (r(), i("span", ut, k(e.modelValue) + " / " + k(e.max), 1)) : g("", !0)
+      ], 46, Ht))), 128)),
+      e.showText && !e.disabled ? (a(), r("span", Gt, k(e.modelValue) + " / " + k(e.max), 1)) : g("", !0)
     ]));
   }
-}, ft = /* @__PURE__ */ v(pt, [["__scopeId", "data-v-17bb0933"]]), ht = ["aria-checked"], mt = {
+}, Yt = /* @__PURE__ */ C(qt, [["__scopeId", "data-v-214323a3"]]), Kt = ["aria-checked"], Zt = {
   key: 0,
   class: "xp-switch__label"
-}, gt = {
+}, Qt = {
   __name: "Switch",
   props: {
     modelValue: {
@@ -774,14 +1239,14 @@ const v = (e, t) => {
     }
   },
   emits: ["update:modelValue", "change"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = () => {
-      if (a.disabled) return;
-      const s = !a.modelValue;
-      l("update:modelValue", s), l("change", s);
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = () => {
+      if (t.disabled) return;
+      const u = !t.modelValue;
+      s("update:modelValue", u), s("change", u);
     };
-    return (s, o) => (r(), i("div", {
-      class: $(["xp-switch", [
+    return (u, d) => (a(), r("div", {
+      class: B(["xp-switch", [
         `xp-switch--${e.size}`,
         {
           "xp-switch--checked": e.modelValue,
@@ -790,20 +1255,20 @@ const v = (e, t) => {
       ]]),
       role: "switch",
       "aria-checked": e.modelValue,
-      onClick: n
+      onClick: l
     }, [
-      o[0] || (o[0] = c("span", { class: "xp-switch__core" }, [
-        c("span", { class: "xp-switch__action" })
+      d[0] || (d[0] = o("span", { class: "xp-switch__core" }, [
+        o("span", { class: "xp-switch__action" })
       ], -1)),
-      s.$slots.default ? (r(), i("span", mt, [
-        b(s.$slots, "default", {}, void 0, !0)
+      u.$slots.default ? (a(), r("span", Zt, [
+        b(u.$slots, "default", {}, void 0, !0)
       ])) : g("", !0)
-    ], 10, ht));
+    ], 10, Kt));
   }
-}, bt = /* @__PURE__ */ v(gt, [["__scopeId", "data-v-5a5e33c5"]]), xt = {
+}, en = /* @__PURE__ */ C(Qt, [["__scopeId", "data-v-5a5e33c5"]]), tn = {
   key: 0,
   class: "xp-tab-pane"
-}, vt = {
+}, nn = {
   __name: "TabPane",
   props: {
     name: {
@@ -820,19 +1285,19 @@ const v = (e, t) => {
     }
   },
   setup(e) {
-    const t = e, a = oe("xpTabs", null), l = w(() => a ? a.currentValue.value === t.name : !0);
-    return Q(() => {
-      a && a.addTab && a.addTab({ name: t.name, title: t.title, disabled: t.disabled });
-    }), J(() => {
-      a && a.removeTab && a.removeTab(t.name);
-    }), (n, s) => l.value ? (r(), i("div", xt, [
-      b(n.$slots, "default", {}, void 0, !0)
+    const n = e, t = _e("xpTabs", null), s = M(() => t ? t.currentValue.value === n.name : !0);
+    return de(() => {
+      t && t.addTab && t.addTab({ name: n.name, title: n.title, disabled: n.disabled });
+    }), Q(() => {
+      t && t.removeTab && t.removeTab(n.name);
+    }), (l, u) => s.value ? (a(), r("div", tn, [
+      b(l.$slots, "default", {}, void 0, !0)
     ])) : g("", !0);
   }
-}, yt = /* @__PURE__ */ v(vt, [["__scopeId", "data-v-6fe7943a"]]), _t = { class: "xp-tabs" }, $t = {
+}, on = /* @__PURE__ */ C(nn, [["__scopeId", "data-v-6fe7943a"]]), sn = { class: "xp-tabs" }, ln = {
   class: "xp-tabs__nav",
   role: "tablist"
-}, kt = ["onClick"], wt = { class: "xp-tabs__content" }, Ct = {
+}, an = ["onClick"], rn = { class: "xp-tabs__content" }, dn = {
   __name: "Tabs",
   props: {
     modelValue: {
@@ -841,48 +1306,48 @@ const v = (e, t) => {
     }
   },
   emits: ["update:modelValue", "change"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = _([]), s = w(() => {
-      var m;
-      return a.modelValue !== null && a.modelValue !== void 0 && a.modelValue !== "" ? a.modelValue : ((m = n.value[0]) == null ? void 0 : m.name) ?? null;
-    }), o = w(() => {
-      const m = n.value.findIndex((d) => d.name === s.value);
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = z([]), u = M(() => {
+      var i;
+      return t.modelValue !== null && t.modelValue !== void 0 && t.modelValue !== "" ? t.modelValue : ((i = l.value[0]) == null ? void 0 : i.name) ?? null;
+    }), d = M(() => {
+      const i = l.value.findIndex((h) => h.name === u.value);
       return {
-        transform: `translateX(${(m >= 0 ? m : 0) * 100}%)`,
-        width: `${n.value.length ? 100 / n.value.length : 0}%`
+        transform: `translateX(${(i >= 0 ? i : 0) * 100}%)`,
+        width: `${l.value.length ? 100 / l.value.length : 0}%`
       };
-    }), u = (m) => {
-      m.disabled || (l("update:modelValue", m.name), l("change", m.name));
+    }), x = (i) => {
+      i.disabled || (s("update:modelValue", i.name), s("change", i.name));
     };
-    return se("xpTabs", { addTab: (m) => {
-      n.value.find((h) => h.name === m.name) || n.value.push(m);
-    }, removeTab: (m) => {
-      const h = n.value.findIndex((d) => d.name === m);
-      h >= 0 && n.value.splice(h, 1);
-    }, currentValue: s }), (m, h) => (r(), i("div", _t, [
-      c("div", $t, [
-        (r(!0), i(W, null, q(n.value, (d, y) => (r(), i("div", {
-          key: d.name || y,
-          class: $(["xp-tabs__item", [
+    return ke("xpTabs", { addTab: (i) => {
+      l.value.find((c) => c.name === i.name) || l.value.push(i);
+    }, removeTab: (i) => {
+      const c = l.value.findIndex((h) => h.name === i);
+      c >= 0 && l.value.splice(c, 1);
+    }, currentValue: u }), (i, c) => (a(), r("div", sn, [
+      o("div", ln, [
+        (a(!0), r(_, null, V(l.value, (h, $) => (a(), r("div", {
+          key: h.name || $,
+          class: B(["xp-tabs__item", [
             {
-              "xp-tabs__item--active": s.value === d.name,
-              "xp-tabs__item--disabled": d.disabled
+              "xp-tabs__item--active": u.value === h.name,
+              "xp-tabs__item--disabled": h.disabled
             }
           ]]),
           role: "tab",
-          onClick: (x) => u(d)
-        }, k(d.title), 11, kt))), 128)),
-        c("div", {
+          onClick: (w) => x(h)
+        }, k(h.title), 11, an))), 128)),
+        o("div", {
           class: "xp-tabs__active-bar",
-          style: C(o.value)
+          style: T(d.value)
         }, null, 4)
       ]),
-      c("div", wt, [
-        b(m.$slots, "default", {}, void 0, !0)
+      o("div", rn, [
+        b(i.$slots, "default", {}, void 0, !0)
       ])
     ]));
   }
-}, St = /* @__PURE__ */ v(Ct, [["__scopeId", "data-v-3e658dba"]]), Bt = {
+}, un = /* @__PURE__ */ C(dn, [["__scopeId", "data-v-3e658dba"]]), cn = {
   __name: "Tag",
   props: {
     type: {
@@ -913,18 +1378,18 @@ const v = (e, t) => {
     }
   },
   emits: ["click", "close"],
-  setup(e, { emit: t }) {
-    const a = e, l = t, n = w(() => a.color ? a.color.startsWith("#") || a.color.startsWith("rgb") ? {
-      backgroundColor: a.color,
-      borderColor: a.color,
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = M(() => t.color ? t.color.startsWith("#") || t.color.startsWith("rgb") ? {
+      backgroundColor: t.color,
+      borderColor: t.color,
       color: "#fff"
-    } : {} : {}), s = (u) => {
-      l("click", u);
-    }, o = (u) => {
-      l("close", u);
+    } : {} : {}), u = (x) => {
+      s("click", x);
+    }, d = (x) => {
+      s("close", x);
     };
-    return (u, f) => (r(), i("span", {
-      class: $(["xp-tag", [
+    return (x, m) => (a(), r("span", {
+      class: B(["xp-tag", [
         `xp-tag--${e.type}`,
         `xp-tag--${e.size}`,
         {
@@ -933,179 +1398,81 @@ const v = (e, t) => {
           "xp-tag--closable": e.closable
         }
       ]]),
-      style: C(n.value),
-      onClick: s
+      style: T(l.value),
+      onClick: u
     }, [
-      b(u.$slots, "default", {}, void 0, !0),
-      e.closable ? (r(), i("span", {
+      b(x.$slots, "default", {}, void 0, !0),
+      e.closable ? (a(), r("span", {
         key: 0,
         class: "xp-tag__close",
-        onClick: K(o, ["stop"])
+        onClick: j(d, ["stop"])
       }, "×")) : g("", !0)
     ], 6));
   }
-}, Vt = /* @__PURE__ */ v(Bt, [["__scopeId", "data-v-903813de"]]), Tt = { class: "xp-tooltip__content" }, It = {
-  __name: "Tooltip",
-  props: {
-    content: {
-      type: String,
-      default: ""
-    },
-    placement: {
-      type: String,
-      default: "top",
-      validator: (e) => ["top", "bottom", "left", "right"].includes(e)
-    },
-    trigger: {
-      type: String,
-      default: "hover",
-      validator: (e) => ["hover", "click", "manual"].includes(e)
-    },
-    disabled: {
-      type: Boolean,
-      default: !1
-    }
-  },
-  setup(e) {
-    const t = e, a = _(!1), l = _({}), n = _(null), s = _(null);
-    let o = null;
-    const u = () => {
-      Z(() => {
-        if (!n.value || !s.value) return;
-        const h = n.value.getBoundingClientRect(), d = s.value.getBoundingClientRect();
-        let y = 0, x = 0;
-        switch (t.placement) {
-          case "top":
-            y = h.top - d.height - 8, x = h.left + h.width / 2 - d.width / 2;
-            break;
-          case "bottom":
-            y = h.bottom + 8, x = h.left + h.width / 2 - d.width / 2;
-            break;
-          case "left":
-            y = h.top + h.height / 2 - d.height / 2, x = h.left - d.width - 8;
-            break;
-          case "right":
-            y = h.top + h.height / 2 - d.height / 2, x = h.right + 8;
-            break;
-        }
-        l.value = {
-          top: `${y + window.scrollY}px`,
-          left: `${x + window.scrollX}px`
-        };
-      });
-    }, f = () => {
-      t.disabled || (clearTimeout(o), o = setTimeout(() => {
-        a.value = !0, u();
-      }, 100));
-    }, p = () => {
-      clearTimeout(o), o = setTimeout(() => {
-        a.value = !1;
-      }, 150);
-    }, m = () => {
-      t.trigger !== "click" || t.disabled || (a.value = !a.value, a.value && u());
-    };
-    return J(() => {
-      clearTimeout(o);
-    }), (h, d) => (r(), i("div", {
-      class: "xp-tooltip",
-      ref_key: "tooltipRef",
-      ref: n
-    }, [
-      c("div", {
-        class: "xp-tooltip__trigger",
-        onMouseenter: f,
-        onMouseleave: p,
-        onClick: m
-      }, [
-        b(h.$slots, "default", {}, void 0, !0)
-      ], 32),
-      (r(), z(L, { to: "body" }, [
-        B(N, { name: "xp-tooltip-fade" }, {
-          default: S(() => [
-            a.value ? (r(), i("div", {
-              key: 0,
-              class: $(["xp-tooltip__popper", [`xp-tooltip__popper--${e.placement}`]]),
-              style: C(l.value),
-              ref_key: "popperRef",
-              ref: s
-            }, [
-              c("div", Tt, [
-                b(h.$slots, "content", {}, () => [
-                  X(k(e.content), 1)
-                ], !0)
-              ]),
-              d[0] || (d[0] = c("div", { class: "xp-tooltip__arrow" }, null, -1))
-            ], 6)) : g("", !0)
-          ]),
-          _: 3
-        })
-      ]))
-    ], 512));
-  }
-}, Rt = /* @__PURE__ */ v(It, [["__scopeId", "data-v-6d9af40b"]]), Mt = /^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/, Nt = /^rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*([\d.]+))?\s*\)$/;
-function E(e) {
+}, pn = /* @__PURE__ */ C(cn, [["__scopeId", "data-v-903813de"]]), fn = /^#?([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/, mn = /^rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*([\d.]+))?\s*\)$/;
+function Y(e) {
   if (typeof e != "string") return null;
-  const t = e.trim(), a = t.match(Mt);
-  if (a) {
-    let n = a[1];
-    n.length === 3 && (n = n.split("").map((f) => f + f).join(""));
-    const s = parseInt(n.slice(0, 2), 16), o = parseInt(n.slice(2, 4), 16), u = parseInt(n.slice(4, 6), 16);
-    return { r: s, g: o, b: u, a: 1 };
+  const n = e.trim(), t = n.match(fn);
+  if (t) {
+    let l = t[1];
+    l.length === 3 && (l = l.split("").map((m) => m + m).join(""));
+    const u = parseInt(l.slice(0, 2), 16), d = parseInt(l.slice(2, 4), 16), x = parseInt(l.slice(4, 6), 16);
+    return { r: u, g: d, b: x, a: 1 };
   }
-  const l = t.match(Nt);
-  return l ? {
-    r: parseInt(l[1], 10),
-    g: parseInt(l[2], 10),
-    b: parseInt(l[3], 10),
-    a: l[4] ? parseFloat(l[4]) : 1
+  const s = n.match(mn);
+  return s ? {
+    r: parseInt(s[1], 10),
+    g: parseInt(s[2], 10),
+    b: parseInt(s[3], 10),
+    a: s[4] ? parseFloat(s[4]) : 1
   } : null;
 }
-function Xt(e) {
+function hn(e) {
   return Math.max(0, Math.min(255, Math.round(e)));
 }
-function At(e, t, a) {
-  const l = (n) => Xt(n).toString(16).padStart(2, "0");
-  return "#" + l(e) + l(t) + l(a);
+function xn(e, n, t) {
+  const s = (l) => hn(l).toString(16).padStart(2, "0");
+  return "#" + s(e) + s(n) + s(t);
 }
-function ee(e, t, a = 0.5) {
-  const l = E(e), n = E(t);
-  if (!l || !n) return "#000000";
-  const s = Math.max(0, Math.min(1, a)), o = l.r * (1 - s) + n.r * s, u = l.g * (1 - s) + n.g * s, f = l.b * (1 - s) + n.b * s;
-  return At(o, u, f);
+function pe(e, n, t = 0.5) {
+  const s = Y(e), l = Y(n);
+  if (!s || !l) return "#000000";
+  const u = Math.max(0, Math.min(1, t)), d = s.r * (1 - u) + l.r * u, x = s.g * (1 - u) + l.g * u, m = s.b * (1 - u) + l.b * u;
+  return xn(d, x, m);
 }
-function j(e, t) {
-  return ee(e, "#ffffff", t);
+function G(e, n) {
+  return pe(e, "#ffffff", n);
 }
-function D(e, t) {
-  return ee(e, "#000000", t);
+function q(e, n) {
+  return pe(e, "#000000", n);
 }
-function Wt(e) {
-  return j(e, 0.3);
+function xo(e) {
+  return G(e, 0.3);
 }
-function qt(e) {
-  return D(e, 0.2);
+function vo(e) {
+  return q(e, 0.2);
 }
-function Ht(e, t) {
-  const a = E(e);
-  if (!a) return e;
-  const l = Math.max(0, Math.min(1, t));
-  return `rgba(${a.r}, ${a.g}, ${a.b}, ${l})`;
+function go(e, n) {
+  const t = Y(e);
+  if (!t) return e;
+  const s = Math.max(0, Math.min(1, n));
+  return `rgba(${t.r}, ${t.g}, ${t.b}, ${s})`;
 }
-function Ut(e) {
-  const t = E(e);
-  return t ? (t.r * 299 + t.g * 587 + t.b * 114) / 1e3 < 128 : !1;
+function yo(e) {
+  const n = Y(e);
+  return n ? (n.r * 299 + n.g * 587 + n.b * 114) / 1e3 < 128 : !1;
 }
-function te(e, t) {
-  const a = j(e, 0.3), l = D(e, 0.2), n = t === "dark" ? D(e, 0.85) : j(e, 0.9), s = t === "dark" ? D(e, 0.7) : j(e, 0.7);
-  return { base: e, light: a, dark: l, bg: n, border: s };
+function fe(e, n) {
+  const t = G(e, 0.3), s = q(e, 0.2), l = n === "dark" ? q(e, 0.85) : G(e, 0.9), u = n === "dark" ? q(e, 0.7) : G(e, 0.7);
+  return { base: e, light: t, dark: s, bg: l, border: u };
 }
-const V = {
+const N = {
   primary: "#409eff",
   success: "#67c23a",
   warning: "#e6a23c",
   danger: "#f56c6c",
   info: "#909399"
-}, A = {
+}, J = {
   light: {
     text: { primary: "#303133", regular: "#606266", secondary: "#909399", placeholder: "#c0c4cc" },
     border: { base: "#dcdfe6", light: "#ebeef5", lighter: "#f2f6fc" },
@@ -1131,83 +1498,83 @@ const V = {
     }
   }
 };
-function T() {
+function F() {
   return {
-    primary: { ...V },
-    light: U(A.light),
-    dark: U(A.dark)
+    primary: { ...N },
+    light: se(J.light),
+    dark: se(J.dark)
   };
 }
-function U(e) {
+function se(e) {
   return JSON.parse(JSON.stringify(e));
 }
-function Y(e, t) {
-  const a = ["primary", "success", "warning", "danger", "info"], l = [];
-  for (const n of a) {
-    const s = e[n] || V[n], o = te(s, t);
-    l.push(`  --xp-color-${n}: ${s};`), l.push(`  --xp-color-${n}-light: ${o.light};`), l.push(`  --xp-color-${n}-dark: ${o.dark};`), l.push(`  --xp-color-${n}-bg: ${o.bg};`), l.push(`  --xp-color-${n}-border: ${o.border};`);
+function le(e, n) {
+  const t = ["primary", "success", "warning", "danger", "info"], s = [];
+  for (const l of t) {
+    const u = e[l] || N[l], d = fe(u, n);
+    s.push(`  --xp-color-${l}: ${u};`), s.push(`  --xp-color-${l}-light: ${d.light};`), s.push(`  --xp-color-${l}-dark: ${d.dark};`), s.push(`  --xp-color-${l}-bg: ${d.bg};`), s.push(`  --xp-color-${l}-border: ${d.border};`);
   }
-  return l.join(`
+  return s.join(`
 `);
 }
-function G(e) {
-  const t = [];
-  for (const a of Object.keys(e.text)) t.push(`  --xp-text-color-${a}: ${e.text[a]};`);
-  t.push(`  --xp-border-color: ${e.border.base};`), t.push(`  --xp-border-color-light: ${e.border.light};`), t.push(`  --xp-border-color-lighter: ${e.border.lighter};`);
-  for (const a of Object.keys(e.bg)) {
-    const l = a === "base" ? "" : `-${a}`;
-    t.push(`  --xp-bg-color${l}: ${e.bg[a]};`);
+function ae(e) {
+  const n = [];
+  for (const t of Object.keys(e.text)) n.push(`  --xp-text-color-${t}: ${e.text[t]};`);
+  n.push(`  --xp-border-color: ${e.border.base};`), n.push(`  --xp-border-color-light: ${e.border.light};`), n.push(`  --xp-border-color-lighter: ${e.border.lighter};`);
+  for (const t of Object.keys(e.bg)) {
+    const s = t === "base" ? "" : `-${t}`;
+    n.push(`  --xp-bg-color${s}: ${e.bg[t]};`);
   }
-  for (const a of Object.keys(e.fill)) {
-    const l = a === "base" ? "" : `-${a}`;
-    t.push(`  --xp-fill-color${l}: ${e.fill[a]};`);
+  for (const t of Object.keys(e.fill)) {
+    const s = t === "base" ? "" : `-${t}`;
+    n.push(`  --xp-fill-color${s}: ${e.fill[t]};`);
   }
-  for (const a of Object.keys(e.shadow)) t.push(`  --xp-shadow-${a}: ${e.shadow[a]};`);
-  return t.join(`
+  for (const t of Object.keys(e.shadow)) n.push(`  --xp-shadow-${t}: ${e.shadow[t]};`);
+  return n.join(`
 `);
 }
-function Ot(e, t) {
-  const a = {}, l = e.primary || V, n = ["primary", "success", "warning", "danger", "info"];
-  for (const o of n) {
-    const u = l[o] || V[o], f = te(u, t);
-    a[`--xp-color-${o}`] = u, a[`--xp-color-${o}-light`] = f.light, a[`--xp-color-${o}-dark`] = f.dark, a[`--xp-color-${o}-bg`] = f.bg, a[`--xp-color-${o}-border`] = f.border;
+function vn(e, n) {
+  const t = {}, s = e.primary || N, l = ["primary", "success", "warning", "danger", "info"];
+  for (const d of l) {
+    const x = s[d] || N[d], m = fe(x, n);
+    t[`--xp-color-${d}`] = x, t[`--xp-color-${d}-light`] = m.light, t[`--xp-color-${d}-dark`] = m.dark, t[`--xp-color-${d}-bg`] = m.bg, t[`--xp-color-${d}-border`] = m.border;
   }
-  const s = e[t] || A[t];
-  for (const o of Object.keys(s.text)) a[`--xp-text-color-${o}`] = s.text[o];
-  a["--xp-border-color"] = s.border.base, a["--xp-border-color-light"] = s.border.light, a["--xp-border-color-lighter"] = s.border.lighter;
-  for (const o of Object.keys(s.bg)) a[`--xp-bg-color${o === "base" ? "" : "-" + o}`] = s.bg[o];
-  for (const o of Object.keys(s.fill)) a[`--xp-fill-color${o === "base" ? "" : "-" + o}`] = s.fill[o];
-  for (const o of Object.keys(s.shadow)) a[`--xp-shadow-${o}`] = s.shadow[o];
-  return a;
+  const u = e[n] || J[n];
+  for (const d of Object.keys(u.text)) t[`--xp-text-color-${d}`] = u.text[d];
+  t["--xp-border-color"] = u.border.base, t["--xp-border-color-light"] = u.border.light, t["--xp-border-color-lighter"] = u.border.lighter;
+  for (const d of Object.keys(u.bg)) t[`--xp-bg-color${d === "base" ? "" : "-" + d}`] = u.bg[d];
+  for (const d of Object.keys(u.fill)) t[`--xp-fill-color${d === "base" ? "" : "-" + d}`] = u.fill[d];
+  for (const d of Object.keys(u.shadow)) t[`--xp-shadow-${d}`] = u.shadow[d];
+  return t;
 }
-function ae(e) {
+function me(e) {
   return [
     ':root, [data-theme="light"] {',
-    Y(e.primary || V, "light"),
-    G(e.light || A.light),
+    le(e.primary || N, "light"),
+    ae(e.light || J.light),
     "}",
     "",
     '[data-theme="dark"] {',
-    Y(e.primary || V, "dark"),
-    G(e.dark || A.dark),
+    le(e.primary || N, "dark"),
+    ae(e.dark || J.dark),
     "}"
   ].join(`
 `);
 }
-let O = null;
-function jt() {
+let U = null;
+function gn() {
   if (typeof document > "u") return null;
-  if (O && document.contains(O)) return O;
+  if (U && document.contains(U)) return U;
   let e = document.querySelector("style[data-xp-ui-theme]");
-  return e || (e = document.createElement("style"), e.setAttribute("data-xp-ui-theme", "true"), document.head.appendChild(e)), O = e, e;
+  return e || (e = document.createElement("style"), e.setAttribute("data-xp-ui-theme", "true"), document.head.appendChild(e)), U = e, e;
 }
-function Dt(e) {
-  const t = jt();
-  t && (t.textContent = ae(e));
+function yn(e) {
+  const n = gn();
+  n && (n.textContent = me(e));
 }
-const H = _("light"), le = _(T());
-function R(e) {
-  if (["light", "dark"].includes(e) && (H.value = e, typeof document < "u")) {
+const ee = z("light"), he = z(F());
+function L(e) {
+  if (["light", "dark"].includes(e) && (ee.value = e, typeof document < "u")) {
     document.documentElement.setAttribute("data-theme", e);
     try {
       localStorage.setItem("xp-ui-theme", e);
@@ -1215,128 +1582,552 @@ function R(e) {
     }
   }
 }
-function Et() {
-  R(H.value === "light" ? "dark" : "light");
+function bn() {
+  L(ee.value === "light" ? "dark" : "light");
 }
-function M(e) {
+function P(e) {
   if (!e) return;
-  const t = T();
-  e.primary && (t.primary = { ...t.primary, ...e.primary }), e.light && (t.light = P(t.light, e.light)), e.dark && (t.dark = P(t.dark, e.dark)), le.value = t, Dt(t);
+  const n = F();
+  e.primary && (n.primary = { ...n.primary, ...e.primary }), e.light && (n.light = Z(n.light, e.light)), e.dark && (n.dark = Z(n.dark, e.dark)), he.value = n, yn(n);
   try {
-    localStorage.setItem("xp-ui-theme-config", JSON.stringify(t));
+    localStorage.setItem("xp-ui-theme-config", JSON.stringify(n));
   } catch {
   }
 }
-function zt() {
-  M(T());
+function _n() {
+  P(F());
 }
-function Ft() {
+function kn() {
   if (typeof document > "u") return;
   let e = null;
   try {
     e = localStorage.getItem("xp-ui-theme");
   } catch {
   }
-  e === "light" || e === "dark" ? R(e) : typeof window < "u" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? R("dark") : R("light");
-  let t = null;
+  e === "light" || e === "dark" ? L(e) : typeof window < "u" && window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? L("dark") : L("light");
+  let n = null;
   try {
-    t = localStorage.getItem("xp-ui-theme-config");
+    n = localStorage.getItem("xp-ui-theme-config");
   } catch {
   }
-  if (t)
+  if (n)
     try {
-      M(JSON.parse(t));
+      P(JSON.parse(n));
     } catch {
-      M(T());
+      P(F());
     }
   else
-    M(T());
+    P(F());
 }
-function P(e, t) {
-  if (!t || typeof t != "object") return e;
-  const a = Array.isArray(e) ? [...e] : { ...e };
-  for (const l of Object.keys(t))
-    t[l] && typeof t[l] == "object" && !Array.isArray(t[l]) ? a[l] = P(e[l] || {}, t[l]) : a[l] = t[l];
-  return a;
+function Z(e, n) {
+  if (!n || typeof n != "object") return e;
+  const t = Array.isArray(e) ? [...e] : { ...e };
+  for (const s of Object.keys(n))
+    n[s] && typeof n[s] == "object" && !Array.isArray(n[s]) ? t[s] = Z(e[s] || {}, n[s]) : t[s] = n[s];
+  return t;
 }
-function Yt() {
+function $n() {
   return {
-    theme: H,
-    themeConfig: le,
-    setTheme: R,
-    toggleTheme: Et,
-    initTheme: Ft,
-    applyThemeConfig: M,
-    resetThemeConfig: zt,
-    getDefaultThemeConfig: T,
-    buildCssString: ae,
-    buildCssVars: Ot
+    theme: ee,
+    themeConfig: he,
+    setTheme: L,
+    toggleTheme: bn,
+    initTheme: kn,
+    applyThemeConfig: P,
+    resetThemeConfig: _n,
+    getDefaultThemeConfig: F,
+    buildCssString: me,
+    buildCssVars: vn
   };
 }
-const ne = {
-  XpAlert: pe,
-  XpAvatar: be,
-  XpBadge: ye,
-  XpButton: F,
-  XpCard: Re,
-  XpCheckbox: Oe,
-  XpDialog: Pe,
-  XpDropdown: He,
-  XpInput: Qe,
-  XpProgress: at,
-  XpRadio: rt,
-  XpRate: ft,
-  XpSwitch: bt,
-  XpTabPane: yt,
-  XpTabs: St,
-  XpTag: Vt,
-  XpTooltip: Rt
-}, Pt = (e) => {
-  Object.entries(ne).forEach(([t, a]) => {
-    e.component(t, a);
+const wn = ["data-theme"], Cn = { class: "xp-theme-customizer__header" }, Sn = { class: "xp-theme-customizer__body" }, zn = { class: "xp-theme-customizer__section" }, Bn = { class: "xp-theme-customizer__modes" }, Mn = ["onClick"], In = { class: "xp-theme-customizer__section" }, Tn = { class: "xp-theme-customizer__grid" }, Vn = { class: "xp-theme-customizer__label" }, En = { class: "xp-theme-customizer__input" }, An = ["value", "onInput"], Dn = ["value", "onChange"], jn = { class: "xp-theme-customizer__section" }, Nn = { class: "xp-theme-customizer__grid" }, Fn = { class: "xp-theme-customizer__label" }, Rn = { class: "xp-theme-customizer__input" }, On = ["value", "onInput"], Xn = ["value", "onChange"], Ln = { class: "xp-theme-customizer__section" }, Pn = { class: "xp-theme-customizer__grid" }, Wn = { class: "xp-theme-customizer__label" }, Jn = { class: "xp-theme-customizer__input" }, Hn = ["value", "onInput"], Un = ["value", "onChange"], Gn = { class: "xp-theme-customizer__section" }, qn = { class: "xp-theme-customizer__grid" }, Yn = { class: "xp-theme-customizer__label" }, Kn = { class: "xp-theme-customizer__input" }, Zn = ["value", "onInput"], Qn = ["value", "onChange"], eo = { class: "xp-theme-customizer__label" }, to = { class: "xp-theme-customizer__input" }, no = ["value", "onInput"], oo = ["value", "onChange"], so = {
+  __name: "ThemeCustomizer",
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: n }) {
+    const { theme: t, applyThemeConfig: s, resetThemeConfig: l, getDefaultThemeConfig: u, buildCssString: d, themeConfig: x } = $n(), m = {
+      primary: "主色",
+      success: "成功",
+      warning: "警告",
+      danger: "危险",
+      info: "信息",
+      regular: "常规",
+      secondary: "次要",
+      placeholder: "占位",
+      base: "基础",
+      page: "页面",
+      soft: "柔和",
+      light: "亮",
+      lighter: "更亮"
+    }, f = z("light"), i = z(null), c = $e(h(x.value));
+    re(x, (S) => Object.assign(c, h(S)), { deep: !0 });
+    function h(S) {
+      return JSON.parse(JSON.stringify(S));
+    }
+    function $(S) {
+      if (!S) return "#ffffff";
+      if (/^#([0-9a-f]{6})$/i.test(S)) return S.toLowerCase();
+      const v = S.match(/rgba?\(\s*(\d{1,3}),\s*(\d{1,3}),\s*(\d{1,3})/);
+      return v ? "#" + [v[1], v[2], v[3]].map((p) => Number(p).toString(16).padStart(2, "0")).join("") : "#ffffff";
+    }
+    function w(S, v) {
+      c.primary[S] = v, s(c);
+    }
+    function I(S, v, p) {
+      c[f.value][S][v] = p, s(c);
+    }
+    function te() {
+      l();
+    }
+    function ve() {
+      ne("xp-ui-theme.json", JSON.stringify(c, null, 2), "application/json");
+    }
+    function ge() {
+      ne("xp-ui-theme.css", d(c), "text/css");
+    }
+    function ye() {
+      i.value && i.value.click();
+    }
+    function be(S) {
+      const v = S.target.files && S.target.files[0];
+      if (!v) return;
+      const p = new FileReader();
+      p.onload = () => {
+        try {
+          const y = JSON.parse(p.result);
+          s(y);
+        } catch (y) {
+          alert(`主题配置解析失败：
+` + y.message);
+        } finally {
+          S.target.value = "";
+        }
+      }, p.readAsText(v);
+    }
+    function ne(S, v, p) {
+      const y = new Blob([v], { type: p + ";charset=utf-8" }), oe = URL.createObjectURL(y), O = document.createElement("a");
+      O.href = oe, O.download = S, document.body.appendChild(O), O.click(), O.remove(), setTimeout(() => URL.revokeObjectURL(oe), 0);
+    }
+    return (S, v) => (a(), r(_, null, [
+      A(D, { name: "xp-fade" }, {
+        default: E(() => [
+          e.modelValue ? (a(), r("div", {
+            key: 0,
+            class: "xp-theme-customizer-backdrop",
+            onClick: v[0] || (v[0] = j((p) => S.$emit("update:modelValue", !1), ["self"]))
+          })) : g("", !0)
+        ]),
+        _: 1
+      }),
+      A(D, { name: "xp-slide" }, {
+        default: E(() => [
+          e.modelValue ? (a(), r("aside", {
+            key: 0,
+            class: "xp-theme-customizer",
+            "data-theme": ce(t)
+          }, [
+            o("header", Cn, [
+              v[2] || (v[2] = o("div", { class: "xp-theme-customizer__title" }, "🎨 主题定制", -1)),
+              o("button", {
+                class: "xp-theme-customizer__close",
+                onClick: v[1] || (v[1] = (p) => S.$emit("update:modelValue", !1)),
+                "aria-label": "关闭"
+              }, "✕")
+            ]),
+            o("div", Sn, [
+              o("section", zn, [
+                v[3] || (v[3] = o("p", { class: "xp-theme-customizer__desc" }, " 修改下方颜色即可改变整个示例/库的外观。导出后可直接放进你自己的项目中应用。 ", -1)),
+                o("div", Bn, [
+                  (a(), r(_, null, V(["light", "dark"], (p) => o("button", {
+                    key: p,
+                    class: B(["xp-theme-customizer__mode-btn", { "is-active": f.value === p }]),
+                    onClick: (y) => f.value = p
+                  }, k(p === "light" ? "浅色" : "暗黑"), 11, Mn)), 64))
+                ])
+              ]),
+              o("section", In, [
+                v[4] || (v[4] = o("h3", { class: "xp-theme-customizer__h" }, "主色", -1)),
+                o("div", Tn, [
+                  (a(), r(_, null, V(["primary", "success", "warning", "danger", "info"], (p) => o("div", {
+                    key: p,
+                    class: "xp-theme-customizer__item"
+                  }, [
+                    o("div", Vn, k(m[p]), 1),
+                    o("div", En, [
+                      o("input", {
+                        type: "color",
+                        value: c.primary[p],
+                        onInput: (y) => w(p, y.target.value)
+                      }, null, 40, An),
+                      o("input", {
+                        type: "text",
+                        value: c.primary[p],
+                        onChange: (y) => w(p, y.target.value)
+                      }, null, 40, Dn)
+                    ])
+                  ])), 64))
+                ])
+              ]),
+              o("section", jn, [
+                v[5] || (v[5] = o("h3", { class: "xp-theme-customizer__h" }, "文本", -1)),
+                o("div", Nn, [
+                  (a(), r(_, null, V(["primary", "regular", "secondary", "placeholder"], (p) => o("div", {
+                    key: "t-" + p,
+                    class: "xp-theme-customizer__item"
+                  }, [
+                    o("div", Fn, k(m[p]), 1),
+                    o("div", Rn, [
+                      o("input", {
+                        type: "color",
+                        value: $(c[f.value].text[p]),
+                        onInput: (y) => I("text", p, y.target.value)
+                      }, null, 40, On),
+                      o("input", {
+                        type: "text",
+                        value: c[f.value].text[p],
+                        onChange: (y) => I("text", p, y.target.value)
+                      }, null, 40, Xn)
+                    ])
+                  ])), 64))
+                ])
+              ]),
+              o("section", Ln, [
+                v[6] || (v[6] = o("h3", { class: "xp-theme-customizer__h" }, "背景", -1)),
+                o("div", Pn, [
+                  (a(), r(_, null, V(["base", "page", "soft"], (p) => o("div", {
+                    key: "bg-" + p,
+                    class: "xp-theme-customizer__item"
+                  }, [
+                    o("div", Wn, k(m[p]), 1),
+                    o("div", Jn, [
+                      o("input", {
+                        type: "color",
+                        value: $(c[f.value].bg[p]),
+                        onInput: (y) => I("bg", p, y.target.value)
+                      }, null, 40, Hn),
+                      o("input", {
+                        type: "text",
+                        value: c[f.value].bg[p],
+                        onChange: (y) => I("bg", p, y.target.value)
+                      }, null, 40, Un)
+                    ])
+                  ])), 64))
+                ])
+              ]),
+              o("section", Gn, [
+                v[7] || (v[7] = o("h3", { class: "xp-theme-customizer__h" }, "边框 / 填充", -1)),
+                o("div", qn, [
+                  (a(), r(_, null, V(["base", "light", "lighter"], (p) => o("div", {
+                    key: "bd-" + p,
+                    class: "xp-theme-customizer__item"
+                  }, [
+                    o("div", Yn, "边框 - " + k(m[p]), 1),
+                    o("div", Kn, [
+                      o("input", {
+                        type: "color",
+                        value: $(c[f.value].border[p]),
+                        onInput: (y) => I("border", p, y.target.value)
+                      }, null, 40, Zn),
+                      o("input", {
+                        type: "text",
+                        value: c[f.value].border[p],
+                        onChange: (y) => I("border", p, y.target.value)
+                      }, null, 40, Qn)
+                    ])
+                  ])), 64)),
+                  (a(), r(_, null, V(["base", "light", "lighter"], (p) => o("div", {
+                    key: "fl-" + p,
+                    class: "xp-theme-customizer__item"
+                  }, [
+                    o("div", eo, "填充 - " + k(m[p]), 1),
+                    o("div", to, [
+                      o("input", {
+                        type: "color",
+                        value: $(c[f.value].fill[p]),
+                        onInput: (y) => I("fill", p, y.target.value)
+                      }, null, 40, no),
+                      o("input", {
+                        type: "text",
+                        value: c[f.value].fill[p],
+                        onChange: (y) => I("fill", p, y.target.value)
+                      }, null, 40, oo)
+                    ])
+                  ])), 64))
+                ])
+              ]),
+              v[8] || (v[8] = o("section", { class: "xp-theme-customizer__section" }, [
+                o("h3", { class: "xp-theme-customizer__h" }, "实时预览"),
+                o("div", { class: "xp-theme-customizer__preview" }, [
+                  o("div", { class: "xp-preview-row" }, [
+                    o("button", { class: "xp-preview-btn xp-preview-btn--primary" }, "Primary"),
+                    o("button", { class: "xp-preview-btn xp-preview-btn--success" }, "Success"),
+                    o("button", { class: "xp-preview-btn xp-preview-btn--warning" }, "Warning"),
+                    o("button", { class: "xp-preview-btn xp-preview-btn--danger" }, "Danger")
+                  ]),
+                  o("div", { class: "xp-preview-text xp-preview-text--primary" }, "主标题文本"),
+                  o("div", { class: "xp-preview-text" }, "正文内容样例 Regular text"),
+                  o("div", { class: "xp-preview-text xp-preview-text--secondary" }, "次要提示")
+                ])
+              ], -1))
+            ]),
+            o("footer", { class: "xp-theme-customizer__footer" }, [
+              o("button", {
+                class: "xp-theme-customizer__action",
+                onClick: te
+              }, "恢复默认"),
+              o("button", {
+                class: "xp-theme-customizer__action xp-theme-customizer__action--secondary",
+                onClick: ye
+              }, "导入 JSON"),
+              o("button", {
+                class: "xp-theme-customizer__action xp-theme-customizer__action--primary",
+                onClick: ve
+              }, "导出 JSON"),
+              o("button", {
+                class: "xp-theme-customizer__action xp-theme-customizer__action--primary",
+                onClick: ge
+              }, "导出 CSS")
+            ]),
+            o("input", {
+              ref_key: "importFileInput",
+              ref: i,
+              type: "file",
+              accept: "application/json,.json,.txt",
+              class: "xp-theme-customizer__hidden",
+              onChange: be
+            }, null, 544)
+          ], 8, wn)) : g("", !0)
+        ]),
+        _: 1
+      })
+    ], 64));
+  }
+}, X = z([]);
+let lo = 0;
+function bo() {
+  function e(n, t = "info", s = 2600) {
+    const l = ++lo;
+    X.value.push({ id: l, message: n, type: t }), setTimeout(() => {
+      const u = X.value.findIndex((d) => d.id === l);
+      u >= 0 && X.value.splice(u, 1);
+    }, s);
+  }
+  return {
+    toasts: X,
+    toast: e,
+    success: (n) => e(n, "success", 2200),
+    error: (n) => e(n, "error", 3600),
+    info: (n) => e(n, "info"),
+    warn: (n) => e(n, "warn", 2800)
+  };
+}
+const ao = {
+  class: "xp-toast-wrap",
+  "aria-live": "polite"
+}, io = { class: "xp-toast__msg" }, ro = {
+  __name: "Toast",
+  setup(e) {
+    return (n, t) => (a(), R(H, { to: "body" }, [
+      o("div", ao, [
+        A(we, { name: "xp-toast" }, {
+          default: E(() => [
+            (a(!0), r(_, null, V(ce(X), (s) => (a(), r("div", {
+              key: s.id,
+              class: B(["xp-toast", `xp-toast--${s.type}`])
+            }, [
+              t[0] || (t[0] = o("span", {
+                class: "xp-toast__dot",
+                "aria-hidden": "true"
+              }, null, -1)),
+              o("span", io, k(s.message), 1)
+            ], 2))), 128))
+          ]),
+          _: 1
+        })
+      ])
+    ]));
+  }
+}, uo = /* @__PURE__ */ C(ro, [["__scopeId", "data-v-b564201c"]]), co = { class: "xp-tooltip__content" }, po = {
+  __name: "Tooltip",
+  props: {
+    content: {
+      type: String,
+      default: ""
+    },
+    placement: {
+      type: String,
+      default: "top",
+      validator: (e) => ["top", "bottom", "left", "right"].includes(e)
+    },
+    trigger: {
+      type: String,
+      default: "hover",
+      validator: (e) => ["hover", "click", "manual"].includes(e)
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(e) {
+    const n = e, t = z(!1), s = z({}), l = z(null), u = z(null);
+    let d = null;
+    const x = () => {
+      ue(() => {
+        if (!l.value || !u.value) return;
+        const c = l.value.getBoundingClientRect(), h = u.value.getBoundingClientRect();
+        let $ = 0, w = 0;
+        switch (n.placement) {
+          case "top":
+            $ = c.top - h.height - 8, w = c.left + c.width / 2 - h.width / 2;
+            break;
+          case "bottom":
+            $ = c.bottom + 8, w = c.left + c.width / 2 - h.width / 2;
+            break;
+          case "left":
+            $ = c.top + c.height / 2 - h.height / 2, w = c.left - h.width - 8;
+            break;
+          case "right":
+            $ = c.top + c.height / 2 - h.height / 2, w = c.right + 8;
+            break;
+        }
+        s.value = {
+          top: `${$ + window.scrollY}px`,
+          left: `${w + window.scrollX}px`
+        };
+      });
+    }, m = () => {
+      n.disabled || (clearTimeout(d), d = setTimeout(() => {
+        t.value = !0, x();
+      }, 100));
+    }, f = () => {
+      clearTimeout(d), d = setTimeout(() => {
+        t.value = !1;
+      }, 150);
+    }, i = () => {
+      n.trigger !== "click" || n.disabled || (t.value = !t.value, t.value && x());
+    };
+    return Q(() => {
+      clearTimeout(d);
+    }), (c, h) => (a(), r("div", {
+      class: "xp-tooltip",
+      ref_key: "tooltipRef",
+      ref: l
+    }, [
+      o("div", {
+        class: "xp-tooltip__trigger",
+        onMouseenter: m,
+        onMouseleave: f,
+        onClick: i
+      }, [
+        b(c.$slots, "default", {}, void 0, !0)
+      ], 32),
+      (a(), R(H, { to: "body" }, [
+        A(D, { name: "xp-tooltip-fade" }, {
+          default: E(() => [
+            t.value ? (a(), r("div", {
+              key: 0,
+              class: B(["xp-tooltip__popper", [`xp-tooltip__popper--${e.placement}`]]),
+              style: T(s.value),
+              ref_key: "popperRef",
+              ref: u
+            }, [
+              o("div", co, [
+                b(c.$slots, "content", {}, () => [
+                  W(k(e.content), 1)
+                ], !0)
+              ]),
+              h[0] || (h[0] = o("div", { class: "xp-tooltip__arrow" }, null, -1))
+            ], 6)) : g("", !0)
+          ]),
+          _: 3
+        })
+      ]))
+    ], 512));
+  }
+}, fo = /* @__PURE__ */ C(po, [["__scopeId", "data-v-6d9af40b"]]), xe = {
+  XpAlert: Ie,
+  XpAvatar: De,
+  XpBadge: Fe,
+  XpButton: K,
+  XpCard: qe,
+  XpCheckbox: et,
+  XpContextMenu: at,
+  XpDialog: pt,
+  XpDropdown: vt,
+  XpEmpty: $t,
+  XpFileIcon: St,
+  XpIcon: Tt,
+  XpInput: jt,
+  XpProgress: Rt,
+  XpRadio: Wt,
+  XpRate: Yt,
+  XpSwitch: en,
+  XpTabPane: on,
+  XpTabs: un,
+  XpTag: pn,
+  XpThemeCustomizer: so,
+  XpToast: uo,
+  XpTooltip: fo
+}, mo = (e) => {
+  Object.entries(xe).forEach(([n, t]) => {
+    e.component(n, t);
   });
-}, Gt = {
-  install: Pt,
-  ...ne
+}, _o = {
+  install: mo,
+  ...xe
 };
 export {
-  V as DEFAULT_PRIMARY,
-  A as DEFAULT_TOKENS,
-  pe as XpAlert,
-  be as XpAvatar,
-  ye as XpBadge,
-  F as XpButton,
-  Re as XpCard,
-  Oe as XpCheckbox,
-  Pe as XpDialog,
-  He as XpDropdown,
-  Qe as XpInput,
-  at as XpProgress,
-  rt as XpRadio,
-  ft as XpRate,
-  bt as XpSwitch,
-  yt as XpTabPane,
-  St as XpTabs,
-  Vt as XpTag,
-  Rt as XpTooltip,
-  M as applyThemeConfig,
-  ae as buildCssString,
-  Ot as buildCssVars,
-  D as darken,
-  Gt as default,
-  qt as deriveDark,
-  Wt as deriveLight,
-  T as getDefaultThemeConfig,
-  Ft as initTheme,
-  Pt as install,
-  Ut as isDark,
-  j as lighten,
-  ee as mix,
-  E as parseColor,
-  zt as resetThemeConfig,
-  R as setTheme,
-  At as toHex,
-  Et as toggleTheme,
-  Yt as useTheme,
-  Ht as withAlpha
+  N as DEFAULT_PRIMARY,
+  J as DEFAULT_TOKENS,
+  Ie as XpAlert,
+  De as XpAvatar,
+  Fe as XpBadge,
+  K as XpButton,
+  qe as XpCard,
+  et as XpCheckbox,
+  at as XpContextMenu,
+  pt as XpDialog,
+  vt as XpDropdown,
+  $t as XpEmpty,
+  St as XpFileIcon,
+  Tt as XpIcon,
+  jt as XpInput,
+  Rt as XpProgress,
+  Wt as XpRadio,
+  Yt as XpRate,
+  en as XpSwitch,
+  on as XpTabPane,
+  un as XpTabs,
+  pn as XpTag,
+  so as XpThemeCustomizer,
+  uo as XpToast,
+  fo as XpTooltip,
+  P as applyThemeConfig,
+  me as buildCssString,
+  vn as buildCssVars,
+  q as darken,
+  _o as default,
+  vo as deriveDark,
+  xo as deriveLight,
+  F as getDefaultThemeConfig,
+  kn as initTheme,
+  mo as install,
+  yo as isDark,
+  G as lighten,
+  pe as mix,
+  Y as parseColor,
+  _n as resetThemeConfig,
+  L as setTheme,
+  xn as toHex,
+  X as toasts,
+  bn as toggleTheme,
+  $n as useTheme,
+  bo as useToast,
+  go as withAlpha
 };