@cghbcf/xp-ui 1.0.0 → 1.1.0

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

@@ -0,0 +1,2133 @@
+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"
+}, Me = {
+  __name: "Alert",
+  props: {
+    title: {
+      type: String,
+      default: ""
+    },
+    type: {
+      type: String,
+      default: "info",
+      validator: (e) => ["success", "warning", "danger", "info"].includes(e)
+    },
+    effect: {
+      type: String,
+      default: "light",
+      validator: (e) => ["light", "dark", "plain"].includes(e)
+    },
+    closable: {
+      type: Boolean,
+      default: !0
+    },
+    showIcon: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  emits: ["close"],
+  setup(e, { emit: n }) {
+    const t = n, s = z(!0), l = {
+      success: "✓",
+      warning: "!",
+      danger: "×",
+      info: "i"
+    }, u = () => {
+      s.value = !1, t("close");
+    };
+    return (d, x) => (a(), R(D, { name: "xp-alert-fade" }, {
+      default: E(() => [
+        s.value ? (a(), r("div", {
+          key: 0,
+          class: B(["xp-alert", [
+            `xp-alert--${e.type}`,
+            `xp-alert--${e.effect}`,
+            { "xp-alert--plain": e.effect === "plain" }
+          ]]),
+          role: "alert"
+        }, [
+          o("span", Ce, k(l[e.type]), 1),
+          o("div", Se, [
+            o("span", ze, [
+              b(d.$slots, "default", {}, () => [
+                W(k(e.title), 1)
+              ], !0)
+            ]),
+            d.$slots.default ? (a(), r("p", Be, [
+              b(d.$slots, "default", {}, void 0, !0)
+            ])) : g("", !0)
+          ]),
+          e.closable ? (a(), r("i", {
+            key: 0,
+            class: "xp-alert__close-btn",
+            onClick: u
+          }, "×")) : g("", !0)
+        ], 2)) : g("", !0)
+      ]),
+      _: 3
+    }));
+  }
+}, Ie = /* @__PURE__ */ C(Me, [["__scopeId", "data-v-91d792bd"]]), Te = ["src", "alt"], Ve = {
+  key: 1,
+  class: "xp-avatar__slot"
+}, Ee = {
+  key: 2,
+  class: "xp-avatar__text"
+}, Ae = {
+  __name: "Avatar",
+  props: {
+    src: {
+      type: String,
+      default: ""
+    },
+    alt: {
+      type: String,
+      default: ""
+    },
+    shape: {
+      type: String,
+      default: "circle",
+      validator: (e) => ["circle", "square"].includes(e)
+    },
+    size: {
+      type: String,
+      default: "medium",
+      validator: (e) => ["small", "medium", "large"].includes(e)
+    },
+    icon: {
+      type: String,
+      default: ""
+    }
+  },
+  emits: ["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 (x, m) => (a(), r("span", {
+      class: B(["xp-avatar", [
+        `xp-avatar--${e.shape}`,
+        `xp-avatar--${e.size}`,
+        { "xp-avatar--fit": e.src }
+      ]]),
+      style: T(u.value)
+    }, [
+      e.src && !l.value ? (a(), r("img", {
+        key: 0,
+        src: e.src,
+        alt: e.alt,
+        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));
+  }
+}, De = /* @__PURE__ */ C(Ae, [["__scopeId", "data-v-a9a54bc5"]]), je = { key: 0 }, Ne = {
+  __name: "Badge",
+  props: {
+    value: {
+      type: [String, Number],
+      default: 0
+    },
+    max: {
+      type: Number,
+      default: 99
+    },
+    type: {
+      type: String,
+      default: "danger",
+      validator: (e) => ["primary", "success", "warning", "danger", "info"].includes(e)
+    },
+    isDot: {
+      type: Boolean,
+      default: !1
+    },
+    hidden: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(e) {
+    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(l.$slots, "default", {}, void 0, !0),
+      !e.hidden && (e.isDot || s.value) ? (a(), r("sup", {
+        key: 0,
+        class: B(["xp-badge__content", [
+          `xp-badge__content--${e.type}`,
+          { "xp-badge__content--dot": e.isDot }
+        ]])
+      }, [
+        e.isDot ? g("", !0) : (a(), r("span", je, k(t.value), 1))
+      ], 2)) : g("", !0)
+    ], 2));
+  }
+}, Fe = /* @__PURE__ */ C(Ne, [["__scopeId", "data-v-207db6dd"]]), Re = ["disabled"], Oe = {
+  key: 0,
+  class: "xp-button__loading"
+}, Xe = { class: "xp-button__text" }, Le = {
+  __name: "Button",
+  props: {
+    type: {
+      type: String,
+      default: "default",
+      validator: (e) => ["primary", "default", "success", "warning", "danger", "info", "ghost"].includes(e)
+    },
+    size: {
+      type: String,
+      default: "medium",
+      validator: (e) => ["small", "medium", "large"].includes(e)
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    loading: {
+      type: Boolean,
+      default: !1
+    },
+    plain: {
+      type: Boolean,
+      default: !1
+    },
+    text: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["click"],
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = (u) => {
+      !t.disabled && !t.loading && s("click", u);
+    };
+    return (u, d) => (a(), r("button", {
+      class: B(["xp-button", [
+        `xp-button--${e.type}`,
+        `xp-button--${e.size}`,
+        {
+          "xp-button--disabled": e.disabled,
+          "xp-button--loading": e.loading,
+          "xp-button--plain": e.plain,
+          "xp-button--text": e.text
+        }
+      ]]),
+      disabled: e.disabled || e.loading,
+      onClick: l
+    }, [
+      e.loading ? (a(), r("span", Oe)) : g("", !0),
+      o("span", Xe, [
+        b(u.$slots, "default", {}, void 0, !0)
+      ])
+    ], 10, Re));
+  }
+}, K = /* @__PURE__ */ C(Le, [["__scopeId", "data-v-9c6bc634"]]), Pe = {
+  key: 0,
+  class: "xp-card__header"
+}, We = { class: "xp-card__title" }, Je = {
+  key: 0,
+  class: "xp-card__extra"
+}, He = { class: "xp-card__body" }, Ue = {
+  key: 1,
+  class: "xp-card__footer"
+}, Ge = {
+  __name: "Card",
+  props: {
+    title: {
+      type: String,
+      default: ""
+    },
+    shadow: {
+      type: String,
+      default: "always",
+      validator: (e) => ["always", "hover", "never"].includes(e)
+    },
+    bordered: {
+      type: Boolean,
+      default: !0
+    },
+    hover: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(e) {
+    return (n, t) => (a(), r("div", {
+      class: B(["xp-card", [
+        `xp-card--${e.shadow}`,
+        {
+          "xp-card--bordered": e.bordered,
+          "xp-card--hover": e.hover
+        }
+      ]])
+    }, [
+      e.title || n.$slots.header ? (a(), r("div", Pe, [
+        b(n.$slots, "header", {}, () => [
+          o("h3", We, k(e.title), 1)
+        ], !0),
+        n.$slots.extra ? (a(), r("div", Je, [
+          b(n.$slots, "extra", {}, void 0, !0)
+        ])) : g("", !0)
+      ])) : g("", !0),
+      o("div", He, [
+        b(n.$slots, "default", {}, void 0, !0)
+      ]),
+      n.$slots.footer ? (a(), r("div", Ue, [
+        b(n.$slots, "footer", {}, void 0, !0)
+      ])) : g("", !0)
+    ], 2));
+  }
+}, 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: {
+      type: Boolean,
+      default: !1
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    indeterminate: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["update:modelValue", "change"],
+  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 (u, d) => (a(), r("label", {
+      class: B(["xp-checkbox", [
+        {
+          "xp-checkbox--checked": e.modelValue,
+          "xp-checkbox--disabled": e.disabled,
+          "xp-checkbox--indeterminate": e.indeterminate
+        }
+      ]])
+    }, [
+      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: l,
+          ".indeterminate": e.indeterminate
+        }, null, 40, Ke)
+      ]),
+      o("span", Ze, [
+        b(u.$slots, "default", {}, void 0, !0)
+      ])
+    ], 2));
+  }
+}, 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"
+}, ct = {
+  __name: "Dialog",
+  props: {
+    visible: {
+      type: Boolean,
+      default: !1
+    },
+    title: {
+      type: String,
+      default: ""
+    },
+    width: {
+      type: String,
+      default: "500px"
+    },
+    confirmButtonText: {
+      type: String,
+      default: "确定"
+    },
+    cancelButtonText: {
+      type: String,
+      default: "取消"
+    },
+    closeOnClickModal: {
+      type: Boolean,
+      default: !0
+    },
+    showDefaultFooter: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  emits: ["confirm", "cancel", "update:visible", "close"],
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = () => {
+      s("update:visible", !1), s("close");
+    }, u = () => {
+      t.closeOnClickModal && l();
+    }, d = () => {
+      s("confirm"), l();
+    }, x = () => {
+      s("cancel"), l();
+    };
+    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: j(u, ["self"])
+          }, [
+            i[0] || (i[0] = o("div", { class: "xp-dialog__mask" }, null, -1)),
+            A(D, {
+              name: "xp-dialog-slide",
+              appear: ""
+            }, {
+              default: E(() => [
+                e.visible ? (a(), r("div", {
+                  key: 0,
+                  class: "xp-dialog",
+                  style: T({ width: e.width })
+                }, [
+                  o("div", it, [
+                    o("h3", rt, k(e.title), 1),
+                    o("button", {
+                      class: "xp-dialog__close",
+                      onClick: l
+                    }, "×")
+                  ]),
+                  o("div", dt, [
+                    b(f.$slots, "default", {}, void 0, !0)
+                  ]),
+                  f.$slots.footer || e.showDefaultFooter ? (a(), r("div", ut, [
+                    b(f.$slots, "footer", {}, () => [
+                      A(K, { onClick: x }, {
+                        default: E(() => [
+                          W(k(e.cancelButtonText), 1)
+                        ]),
+                        _: 1
+                      }),
+                      A(K, {
+                        type: "primary",
+                        onClick: d
+                      }, {
+                        default: E(() => [
+                          W(k(e.confirmButtonText), 1)
+                        ]),
+                        _: 1
+                      })
+                    ], !0)
+                  ])) : g("", !0)
+                ], 4)) : g("", !0)
+              ]),
+              _: 3
+            })
+          ])) : g("", !0)
+        ]),
+        _: 3
+      })
+    ]));
+  }
+}, pt = /* @__PURE__ */ C(ct, [["__scopeId", "data-v-f85c5a46"]]), ft = ["onClick"], mt = { key: 0 }, ht = {
+  key: 1,
+  class: "xp-dropdown__divider"
+}, xt = {
+  __name: "Dropdown",
+  props: {
+    items: {
+      type: Array,
+      default: () => []
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["select", "command", "open", "close"],
+  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`
+        };
+      });
+    }, 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 de(() => {
+      document.addEventListener("click", c);
+    }), Q(() => {
+      document.removeEventListener("click", c);
+    }), (h, $) => (a(), r("div", {
+      class: "xp-dropdown",
+      ref_key: "dropdownRef",
+      ref: d
+    }, [
+      o("div", {
+        class: "xp-dropdown__trigger",
+        onClick: f
+      }, [
+        b(h.$slots, "default", {}, void 0, !0)
+      ]),
+      (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: T(u.value),
+              ref_key: "menuRef",
+              ref: x
+            }, [
+              (a(!0), r(_, null, V(e.items, (w, I) => (a(), r("div", {
+                key: I,
+                class: B(["xp-dropdown__item", { "xp-dropdown__item--disabled": w.disabled, "xp-dropdown__item--divider": w.divider }]),
+                onClick: (te) => i(w)
+              }, [
+                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
+        })
+      ]))
+    ], 512));
+  }
+}, 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"
+}, Et = ["id", "type", "value", "placeholder", "disabled", "maxlength"], At = {
+  key: 2,
+  class: "xp-input__suffix"
+}, Dt = {
+  __name: "Input",
+  props: {
+    modelValue: {
+      type: [String, Number],
+      default: ""
+    },
+    /** 原生 input 的 id，用于配合 label[for] 聚焦 */
+    id: {
+      type: String,
+      default: ""
+    },
+    type: {
+      type: String,
+      default: "text",
+      validator: (e) => ["text", "password", "number", "email", "tel", "url"].includes(e)
+    },
+    placeholder: {
+      type: String,
+      default: ""
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    size: {
+      type: String,
+      default: "medium",
+      validator: (e) => ["small", "medium", "large"].includes(e)
+    },
+    maxlength: {
+      type: [String, Number],
+      default: null
+    },
+    showClear: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["update:modelValue", "focus", "blur", "clear"],
+  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 = () => {
+      s("update:modelValue", ""), s("clear"), l.value && l.value.focus();
+    };
+    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": i.$slots.prefix,
+          "xp-input--suffix": i.$slots.suffix || e.showClear,
+          "xp-input--focus": u.value
+        }
+      ]])
+    }, [
+      i.$slots.prefix ? (a(), r("span", Vt, [
+        b(i.$slots, "prefix", {}, void 0, !0)
+      ])) : g("", !0),
+      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: 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),
+      i.$slots.suffix && !e.showClear ? (a(), r("span", At, [
+        b(i.$slots, "suffix", {}, void 0, !0)
+      ])) : g("", !0)
+    ], 2));
+  }
+}, jt = /* @__PURE__ */ C(Dt, [["__scopeId", "data-v-46247483"]]), Nt = {
+  key: 0,
+  class: "xp-progress__text"
+}, Ft = {
+  __name: "Progress",
+  props: {
+    percentage: {
+      type: Number,
+      default: 0,
+      validator: (e) => e >= 0 && e <= 100
+    },
+    color: {
+      type: String,
+      default: ""
+    },
+    showText: {
+      type: Boolean,
+      default: !0
+    },
+    type: {
+      type: String,
+      default: "line",
+      validator: (e) => ["line", "circle"].includes(e)
+    },
+    status: {
+      type: String,
+      default: "",
+      validator: (e) => ["", "success", "warning", "exception"].includes(e)
+    },
+    /** line 模式下进度条轨道/内条高度（px），用于紧凑场景 */
+    strokeWidth: {
+      type: Number,
+      default: 8
+    }
+  },
+  setup(e) {
+    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}`]])
+    }, [
+      o("div", {
+        class: "xp-progress__bar",
+        style: T(t.value)
+      }, [
+        o("div", {
+          class: "xp-progress__inner",
+          style: T({ width: `${e.percentage}%`, backgroundColor: s.value })
+        }, null, 4)
+      ], 4),
+      e.showText ? (a(), r("span", Nt, [
+        b(l.$slots, "default", {}, () => [
+          W(k(e.percentage) + "%", 1)
+        ], !0)
+      ])) : g("", !0)
+    ], 2));
+  }
+}, 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: {
+      type: [String, Number, Boolean],
+      default: ""
+    },
+    value: {
+      type: [String, Number, Boolean],
+      default: ""
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["update:modelValue", "change"],
+  setup(e, { emit: n }) {
+    const t = e, s = n, l = () => {
+      t.disabled || (s("update:modelValue", t.value), s("change", t.value));
+    };
+    return (u, d) => (a(), r("label", {
+      class: B(["xp-radio", [
+        {
+          "xp-radio--checked": e.modelValue === e.value,
+          "xp-radio--disabled": e.disabled
+        }
+      ]])
+    }, [
+      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: l
+        }, null, 40, Xt)
+      ]),
+      o("span", Lt, [
+        b(u.$slots, "default", {}, void 0, !0)
+      ])
+    ], 2));
+  }
+}, 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"
+}, qt = {
+  __name: "Rate",
+  props: {
+    modelValue: {
+      type: Number,
+      default: 0
+    },
+    max: {
+      type: Number,
+      default: 5
+    },
+    color: {
+      type: String,
+      default: "#f7ba2a"
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    },
+    showText: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["update:modelValue", "change"],
+  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 (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: T({ cursor: e.disabled ? "default" : "pointer" }),
+        onClick: (c) => x(i),
+        onMouseenter: (c) => l.value = i,
+        onMouseleave: f[0] || (f[0] = (c) => l.value = 0)
+      }, [
+        o("span", Ut, [
+          f[1] || (f[1] = o("span", { class: "xp-rate__star-outer" }, "★", -1)),
+          o("span", {
+            class: "xp-rate__star-inner",
+            style: T({ width: d(i) + "%", color: e.color })
+          }, " ★ ", 4)
+        ])
+      ], 46, Ht))), 128)),
+      e.showText && !e.disabled ? (a(), r("span", Gt, k(e.modelValue) + " / " + k(e.max), 1)) : g("", !0)
+    ]));
+  }
+}, Yt = /* @__PURE__ */ C(qt, [["__scopeId", "data-v-214323a3"]]), Kt = ["aria-checked"], Zt = {
+  key: 0,
+  class: "xp-switch__label"
+}, Qt = {
+  __name: "Switch",
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: !1
+    },
+    size: {
+      type: String,
+      default: "medium",
+      validator: (e) => ["small", "medium", "large"].includes(e)
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["update:modelValue", "change"],
+  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 (u, d) => (a(), r("div", {
+      class: B(["xp-switch", [
+        `xp-switch--${e.size}`,
+        {
+          "xp-switch--checked": e.modelValue,
+          "xp-switch--disabled": e.disabled
+        }
+      ]]),
+      role: "switch",
+      "aria-checked": e.modelValue,
+      onClick: l
+    }, [
+      d[0] || (d[0] = o("span", { class: "xp-switch__core" }, [
+        o("span", { class: "xp-switch__action" })
+      ], -1)),
+      u.$slots.default ? (a(), r("span", Zt, [
+        b(u.$slots, "default", {}, void 0, !0)
+      ])) : g("", !0)
+    ], 10, Kt));
+  }
+}, en = /* @__PURE__ */ C(Qt, [["__scopeId", "data-v-5a5e33c5"]]), tn = {
+  key: 0,
+  class: "xp-tab-pane"
+}, nn = {
+  __name: "TabPane",
+  props: {
+    name: {
+      type: [String, Number],
+      required: !0
+    },
+    title: {
+      type: String,
+      default: ""
+    },
+    disabled: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(e) {
+    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);
+  }
+}, on = /* @__PURE__ */ C(nn, [["__scopeId", "data-v-6fe7943a"]]), sn = { class: "xp-tabs" }, ln = {
+  class: "xp-tabs__nav",
+  role: "tablist"
+}, an = ["onClick"], rn = { class: "xp-tabs__content" }, dn = {
+  __name: "Tabs",
+  props: {
+    modelValue: {
+      type: [String, Number],
+      default: null
+    }
+  },
+  emits: ["update:modelValue", "change"],
+  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(${(i >= 0 ? i : 0) * 100}%)`,
+        width: `${l.value.length ? 100 / l.value.length : 0}%`
+      };
+    }), x = (i) => {
+      i.disabled || (s("update:modelValue", i.name), s("change", i.name));
+    };
+    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": u.value === h.name,
+              "xp-tabs__item--disabled": h.disabled
+            }
+          ]]),
+          role: "tab",
+          onClick: (w) => x(h)
+        }, k(h.title), 11, an))), 128)),
+        o("div", {
+          class: "xp-tabs__active-bar",
+          style: T(d.value)
+        }, null, 4)
+      ]),
+      o("div", rn, [
+        b(i.$slots, "default", {}, void 0, !0)
+      ])
+    ]));
+  }
+}, un = /* @__PURE__ */ C(dn, [["__scopeId", "data-v-3e658dba"]]), cn = {
+  __name: "Tag",
+  props: {
+    type: {
+      type: String,
+      default: "default",
+      validator: (e) => ["primary", "default", "success", "warning", "danger", "info"].includes(e)
+    },
+    size: {
+      type: String,
+      default: "medium",
+      validator: (e) => ["small", "medium", "large"].includes(e)
+    },
+    color: {
+      type: String,
+      default: ""
+    },
+    plain: {
+      type: Boolean,
+      default: !1
+    },
+    round: {
+      type: Boolean,
+      default: !1
+    },
+    closable: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["click", "close"],
+  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"
+    } : {} : {}), u = (x) => {
+      s("click", x);
+    }, d = (x) => {
+      s("close", x);
+    };
+    return (x, m) => (a(), r("span", {
+      class: B(["xp-tag", [
+        `xp-tag--${e.type}`,
+        `xp-tag--${e.size}`,
+        {
+          "xp-tag--plain": e.plain,
+          "xp-tag--round": e.round,
+          "xp-tag--closable": e.closable
+        }
+      ]]),
+      style: T(l.value),
+      onClick: u
+    }, [
+      b(x.$slots, "default", {}, void 0, !0),
+      e.closable ? (a(), r("span", {
+        key: 0,
+        class: "xp-tag__close",
+        onClick: j(d, ["stop"])
+      }, "×")) : g("", !0)
+    ], 6));
+  }
+}, 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 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 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 hn(e) {
+  return Math.max(0, Math.min(255, Math.round(e)));
+}
+function xn(e, n, t) {
+  const s = (l) => hn(l).toString(16).padStart(2, "0");
+  return "#" + s(e) + s(n) + s(t);
+}
+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 G(e, n) {
+  return pe(e, "#ffffff", n);
+}
+function q(e, n) {
+  return pe(e, "#000000", n);
+}
+function xo(e) {
+  return G(e, 0.3);
+}
+function vo(e) {
+  return q(e, 0.2);
+}
+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 yo(e) {
+  const n = Y(e);
+  return n ? (n.r * 299 + n.g * 587 + n.b * 114) / 1e3 < 128 : !1;
+}
+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 N = {
+  primary: "#409eff",
+  success: "#67c23a",
+  warning: "#e6a23c",
+  danger: "#f56c6c",
+  info: "#909399"
+}, J = {
+  light: {
+    text: { primary: "#303133", regular: "#606266", secondary: "#909399", placeholder: "#c0c4cc" },
+    border: { base: "#dcdfe6", light: "#ebeef5", lighter: "#f2f6fc" },
+    bg: { base: "#ffffff", page: "#f2f3f5", soft: "#f5f7fa", overlay: "rgba(0, 0, 0, 0.5)" },
+    fill: { base: "#f0f2f5", light: "#f5f7fa", lighter: "#fafafa" },
+    shadow: {
+      sm: "0 1px 2px 0 rgba(0, 0, 0, 0.05)",
+      md: "0 2px 12px 0 rgba(0, 0, 0, 0.1)",
+      lg: "0 4px 20px 0 rgba(0, 0, 0, 0.15)",
+      overlay: "0 8px 24px 0 rgba(0, 0, 0, 0.2)"
+    }
+  },
+  dark: {
+    text: { primary: "#e5eaf3", regular: "#cfd3dc", secondary: "#a3a6ad", placeholder: "#8d9095" },
+    border: { base: "#4c4d4f", light: "#414243", lighter: "#363637" },
+    bg: { base: "#1d1e1f", page: "#141414", soft: "#2a2b2c", overlay: "rgba(0, 0, 0, 0.7)" },
+    fill: { base: "#303030", light: "#262727", lighter: "#1d1d1d" },
+    shadow: {
+      sm: "0 1px 2px 0 rgba(0, 0, 0, 0.4)",
+      md: "0 2px 12px 0 rgba(0, 0, 0, 0.45)",
+      lg: "0 4px 20px 0 rgba(0, 0, 0, 0.5)",
+      overlay: "0 8px 24px 0 rgba(0, 0, 0, 0.6)"
+    }
+  }
+};
+function F() {
+  return {
+    primary: { ...N },
+    light: se(J.light),
+    dark: se(J.dark)
+  };
+}
+function se(e) {
+  return JSON.parse(JSON.stringify(e));
+}
+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 s.join(`
+`);
+}
+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 t of Object.keys(e.fill)) {
+    const s = t === "base" ? "" : `-${t}`;
+    n.push(`  --xp-fill-color${s}: ${e.fill[t]};`);
+  }
+  for (const t of Object.keys(e.shadow)) n.push(`  --xp-shadow-${t}: ${e.shadow[t]};`);
+  return n.join(`
+`);
+}
+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 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 me(e) {
+  return [
+    ':root, [data-theme="light"] {',
+    le(e.primary || N, "light"),
+    ae(e.light || J.light),
+    "}",
+    "",
+    '[data-theme="dark"] {',
+    le(e.primary || N, "dark"),
+    ae(e.dark || J.dark),
+    "}"
+  ].join(`
+`);
+}
+let U = null;
+function gn() {
+  if (typeof document > "u") return null;
+  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)), U = e, e;
+}
+function yn(e) {
+  const n = gn();
+  n && (n.textContent = me(e));
+}
+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);
+    } catch {
+    }
+  }
+}
+function bn() {
+  L(ee.value === "light" ? "dark" : "light");
+}
+function P(e) {
+  if (!e) return;
+  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(n));
+  } catch {
+  }
+}
+function _n() {
+  P(F());
+}
+function kn() {
+  if (typeof document > "u") return;
+  let e = null;
+  try {
+    e = localStorage.getItem("xp-ui-theme");
+  } catch {
+  }
+  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 {
+    n = localStorage.getItem("xp-ui-theme-config");
+  } catch {
+  }
+  if (n)
+    try {
+      P(JSON.parse(n));
+    } catch {
+      P(F());
+    }
+  else
+    P(F());
+}
+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 $n() {
+  return {
+    theme: ee,
+    themeConfig: he,
+    setTheme: L,
+    toggleTheme: bn,
+    initTheme: kn,
+    applyThemeConfig: P,
+    resetThemeConfig: _n,
+    getDefaultThemeConfig: F,
+    buildCssString: me,
+    buildCssVars: vn
+  };
+}
+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);
+  });
+}, _o = {
+  install: mo,
+  ...xe
+};
+export {
+  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
+};