@rft-rc/recycle-ui 0.0.1-rc.6 → 0.0.2-rc.1

package/dist/index.mjs

@@ -1,50 +1,119 @@
-import { defineComponent as S, computed as f, createElementBlock as d, openBlock as i, normalizeStyle as h, normalizeClass as z, createCommentVNode as g, renderSlot as y, createTextVNode as M, toDisplayString as _, inject as x, createElementVNode as b, ref as T, watchEffect as oe, provide as D, Fragment as A, renderList as Q, createBlock as X, onMounted as Z, onUnmounted as ae, Teleport as ce, createVNode as P, Transition as re, withCtx as ee, createApp as le, reactive as ie, TransitionGroup as ue, render as te } from "vue";
-const de = ["disabled"], fe = {
+import { defineComponent as W, inject as z, computed as _, onMounted as be, createElementBlock as m, openBlock as r, normalizeStyle as A, normalizeClass as V, createCommentVNode as k, toDisplayString as x, renderSlot as C, Fragment as M, createBlock as q, createTextVNode as H, createElementVNode as $, ref as I, watchEffect as Le, provide as F, renderList as Y, onUnmounted as ke, Teleport as Ne, createVNode as L, Transition as le, withCtx as O, createApp as Be, reactive as We, TransitionGroup as Te, render as $e, watch as ie, nextTick as ue, unref as K } from "vue";
+const ze = {
+  key: 0,
+  class: "rc-icon__unicode"
+}, Me = /* @__PURE__ */ W({
+  name: "rc-icon",
+  __name: "index",
+  props: {
+    name: {},
+    size: { default: 16 },
+    color: { default: "" },
+    spin: { type: Boolean, default: !1 },
+    code: { default: "" }
+  },
+  setup(e) {
+    const t = e, a = z(re, {}), i = _(() => (a == null ? void 0 : a.iconClass) || "iconfont"), v = _(() => t.name || ""), f = _(() => typeof t.size == "number" ? `${t.size}px` : t.size || "16px"), u = _(() => ({
+      fontSize: f.value,
+      color: t.color || void 0,
+      lineHeight: 1,
+      fontFamily: (a == null ? void 0 : a.iconClass) || "iconfont"
+    })), o = _(() => {
+      const l = t.code;
+      if (l == null || l === "" || l === 0) return "";
+      if (typeof l == "number")
+        return String.fromCharCode(l);
+      const c = String(l).replace(/^0x/i, ""), b = parseInt(c, 16);
+      return Number.isNaN(b) ? "" : String.fromCharCode(b);
+    });
+    return be(() => {
+      if (typeof window > "u") return;
+      const l = a && a.iconCssUrl || Ce.iconCssUrl;
+      if (!l) return;
+      const c = `link[rel="stylesheet"][data-rcui-icon="true"][href="${l}"]`;
+      if (!document.head.querySelector(c)) {
+        const y = document.createElement("link");
+        y.rel = "stylesheet", y.href = l, y.setAttribute("data-rcui-icon", "true"), document.head.appendChild(y);
+      }
+    }), (l, c) => (r(), m("i", {
+      class: V(["rc-icon", [i.value, v.value, { "rc-icon--spin": e.spin }]]),
+      style: A(u.value),
+      "aria-hidden": "true"
+    }, [
+      o.value ? (r(), m("span", ze, x(o.value), 1)) : k("", !0)
+    ], 6));
+  }
+}), T = (e, t) => {
+  const a = e.__vccOpts || e;
+  for (const [i, v] of t)
+    a[i] = v;
+  return a;
+}, D = /* @__PURE__ */ T(Me, [["__scopeId", "data-v-3857a892"]]), Ue = ["disabled"], Fe = {
   key: 0,
   class: "rc-button__spinner"
-}, me = /* @__PURE__ */ S({
+}, Ge = {
+  key: 0,
+  class: "rc-button__icon rc-button__icon--prefix"
+}, Oe = {
+  key: 2,
+  class: "rc-button__icon rc-button__icon--suffix"
+}, Pe = /* @__PURE__ */ W({
   __name: "index",
   props: {
     type: { default: "default" },
     size: { default: "medium" },
-    plain: { type: Boolean, default: !1 },
+    mode: { default: void 0 },
     block: { type: Boolean, default: !1 },
     label: { default: "" },
     round: { type: [Number, String, Boolean], default: 6 },
     disabled: { type: Boolean, default: !1 },
-    loading: { type: Boolean, default: !1 }
+    loading: { type: Boolean, default: !1 },
+    preIcon: { default: "" },
+    suffixIcon: { default: "" }
   },
   emits: ["click"],
   setup(e, { emit: t }) {
-    const n = e, c = t, r = (l) => {
-      !n.disabled && !n.loading && c("click", l);
-    }, u = f(() => {
-      const l = n.round;
-      return typeof l == "boolean" ? l ? "999px" : "6px" : typeof l == "number" ? `${l}px` : String(l);
+    const a = e, i = t, v = (u) => {
+      !a.disabled && !a.loading && i("click", u);
+    }, f = _(() => {
+      const u = a.round;
+      return typeof u == "boolean" ? u ? "999px" : "6px" : typeof u == "number" ? `${u}px` : String(u);
     });
-    return (l, o) => (i(), d("button", {
-      class: z(["rc-button", [`rc-button--${e.type}`, `rc-button--${e.size}`, { "is-plain": e.plain, "is-block": e.block, "is-disabled": e.disabled, "is-loading": e.loading }]]),
-      style: h({ borderRadius: u.value }),
+    return (u, o) => (r(), m("button", {
+      class: V(["rc-button", [`rc-button--${e.type}`, `rc-button--${e.size}`, e.mode ? `rc-button--${e.mode}` : "", { "is-block": e.block, "is-disabled": e.disabled, "is-loading": e.loading }]]),
+      style: A({ borderRadius: f.value }),
       disabled: e.disabled || e.loading,
-      onClick: r
+      onClick: v
     }, [
-      e.loading ? (i(), d("span", fe)) : g("", !0),
-      y(l.$slots, "default", {}, () => [
-        M(_(e.label), 1)
-      ], !0)
-    ], 14, de));
+      e.loading ? (r(), m("span", Fe)) : (r(), m(M, { key: 1 }, [
+        e.preIcon || u.$slots.preIcon ? (r(), m("span", Ge, [
+          C(u.$slots, "preIcon", {}, () => [
+            e.preIcon ? (r(), q(D, {
+              key: 0,
+              name: e.preIcon
+            }, null, 8, ["name"])) : k("", !0)
+          ], !0)
+        ])) : k("", !0)
+      ], 64)),
+      C(u.$slots, "default", {}, () => [
+        H(x(e.label), 1)
+      ], !0),
+      !e.loading && (e.suffixIcon || u.$slots.suffixIcon) ? (r(), m("span", Oe, [
+        C(u.$slots, "suffixIcon", {}, () => [
+          e.suffixIcon ? (r(), q(D, {
+            key: 0,
+            name: e.suffixIcon
+          }, null, 8, ["name"])) : k("", !0)
+        ], !0)
+      ])) : k("", !0)
+    ], 14, Ue));
   }
-}), w = (e, t) => {
-  const n = e.__vccOpts || e;
-  for (const [c, r] of t)
-    n[c] = r;
-  return n;
-}, G = /* @__PURE__ */ w(me, [["__scopeId", "data-v-a70e95bb"]]);
-G.name = "rc-button";
-function H(e) {
-  return e.component(G.name, G), e;
+}), Q = /* @__PURE__ */ T(Pe, [["__scopeId", "data-v-3ed3109f"]]);
+Q.name = "rc-button";
+function de(e) {
+  return e.component(Q.name, Q), e;
 }
-const pe = { class: "rc-desc-item__value" }, ye = /* @__PURE__ */ S({
+const je = { class: "rc-desc-item__value" }, qe = /* @__PURE__ */ W({
   name: "rc-descriptions-item",
   __name: "item",
   props: {
@@ -55,42 +124,42 @@ const pe = { class: "rc-desc-item__value" }, ye = /* @__PURE__ */ S({
   },
   setup(e) {
     const t = e;
-    x("rcDescItemWidth", void 0), x("rcDescSingleWidth", ""), x("rcDescGap", "0px");
-    const n = x("rcDescGapPx", 0), c = x("rcDescColCount", 1), r = x("rcDescLabelWidth", ""), u = f(() => {
-      const s = typeof t.span == "string" ? parseInt(t.span, 10) : t.span, a = typeof (c == null ? void 0 : c.value) == "number" ? c.value : c, m = !Number.isNaN(s) && s > 0 ? s : 1;
-      return Math.min(m, a || 1);
-    }), l = f(() => {
-      const s = typeof (c == null ? void 0 : c.value) == "number" ? c.value : c, a = typeof (n == null ? void 0 : n.value) == "number" ? n.value : n, m = u.value;
-      if (!s || s <= 1 || m >= s) return "100%";
-      const p = (s - 1) * a, v = (m - 1) * a;
-      return `calc((100% - ${p}px) * ${m} / ${s} + ${v}px)`;
-    }), o = f(() => {
-      const s = typeof (r == null ? void 0 : r.value) == "string" ? r.value : r, a = t.labelWidth !== "" ? t.labelWidth : s || "";
-      return a ? { width: typeof a == "number" ? `${a}px` : String(a), flex: "0 0 auto" } : {};
+    z("rcDescItemWidth", void 0), z("rcDescSingleWidth", ""), z("rcDescGap", "0px");
+    const a = z("rcDescGapPx", 0), i = z("rcDescColCount", 1), v = z("rcDescLabelWidth", ""), f = _(() => {
+      const l = typeof t.span == "string" ? parseInt(t.span, 10) : t.span, c = typeof (i == null ? void 0 : i.value) == "number" ? i.value : i, b = !Number.isNaN(l) && l > 0 ? l : 1;
+      return Math.min(b, c || 1);
+    }), u = _(() => {
+      const l = typeof (i == null ? void 0 : i.value) == "number" ? i.value : i, c = typeof (a == null ? void 0 : a.value) == "number" ? a.value : a, b = f.value;
+      if (!l || l <= 1 || b >= l) return "100%";
+      const y = (l - 1) * c, g = (b - 1) * c;
+      return `calc((100% - ${y}px) * ${b} / ${l} + ${g}px)`;
+    }), o = _(() => {
+      const l = typeof (v == null ? void 0 : v.value) == "string" ? v.value : v, c = t.labelWidth !== "" ? t.labelWidth : l || "";
+      return c ? { width: typeof c == "number" ? `${c}px` : String(c), flex: "0 0 auto" } : {};
     });
-    return (s, a) => (i(), d("div", {
+    return (l, c) => (r(), m("div", {
       class: "rc-desc-item",
-      style: h({ width: l.value, flex: `0 0 ${l.value}` })
+      style: A({ width: u.value, flex: `0 0 ${u.value}` })
     }, [
-      b("div", {
+      $("div", {
         class: "rc-desc-item__label",
-        style: h(o.value)
+        style: A(o.value)
       }, [
-        y(s.$slots, "label", {}, () => [
-          M(_(e.label), 1)
+        C(l.$slots, "label", {}, () => [
+          H(x(e.label), 1)
         ], !0)
       ], 4),
-      b("div", pe, [
-        y(s.$slots, "default", {}, () => [
-          M(_(e.value), 1)
+      $("div", je, [
+        C(l.$slots, "default", {}, () => [
+          H(x(e.value), 1)
         ], !0)
       ])
     ], 4));
   }
-}), R = /* @__PURE__ */ w(ye, [["__scopeId", "data-v-970d0b99"]]), ge = { class: "rc-descriptions" }, be = {
+}), P = /* @__PURE__ */ T(qe, [["__scopeId", "data-v-970d0b99"]]), He = { class: "rc-descriptions" }, Ke = {
   key: 0,
   class: "rc-descriptions__title"
-}, ve = /* @__PURE__ */ S({
+}, Ye = /* @__PURE__ */ W({
   name: "rc-descriptions",
   __name: "index",
   props: {
@@ -102,66 +171,66 @@ const pe = { class: "rc-desc-item__value" }, ye = /* @__PURE__ */ S({
     keyMap: {}
   },
   setup(e) {
-    const t = e, n = T(null), c = f(() => typeof t.gap == "number" ? `${t.gap}px` : String(t.gap)), r = f(() => {
-      const a = typeof t.column == "string" ? Number.parseInt(t.column, 10) : t.column ?? 1;
-      return !Number.isNaN(a) && a > 0 ? a : 1;
-    }), u = T("100%"), l = T("100%");
-    oe(() => {
-      const a = r.value;
-      if (a <= 1)
-        u.value = "100%", l.value = "100%";
+    const t = e, a = I(null), i = _(() => typeof t.gap == "number" ? `${t.gap}px` : String(t.gap)), v = _(() => {
+      const c = typeof t.column == "string" ? Number.parseInt(t.column, 10) : t.column ?? 1;
+      return !Number.isNaN(c) && c > 0 ? c : 1;
+    }), f = I("100%"), u = I("100%");
+    Le(() => {
+      const c = v.value;
+      if (c <= 1)
+        f.value = "100%", u.value = "100%";
       else {
-        const m = typeof t.gap == "number" ? t.gap : parseFloat(String(t.gap)) || 0, v = `calc((100% - ${(a - 1) * m}px) / ${a})`;
-        l.value = v, u.value = v;
+        const b = typeof t.gap == "number" ? t.gap : parseFloat(String(t.gap)) || 0, g = `calc((100% - ${(c - 1) * b}px) / ${c})`;
+        u.value = g, f.value = g;
       }
-    }), D("rcDescItemWidth", u), D("rcDescSingleWidth", l), D("rcDescColCount", r), D("rcDescGapPx", f(() => typeof t.gap == "number" ? t.gap : parseFloat(String(t.gap)) || 0));
-    const o = f(() => t.labelWidth === "" || t.labelWidth === void 0 ? "" : typeof t.labelWidth == "number" ? `${t.labelWidth}px` : String(t.labelWidth));
-    D("rcDescLabelWidth", o), D("rcDescGap", f(() => typeof t.gap == "number" ? `${t.gap}px` : String(t.gap)));
-    const s = f(() => {
-      var p, v, V;
-      const a = ((p = t.keyMap) == null ? void 0 : p.key) ?? "label", m = ((v = t.keyMap) == null ? void 0 : v.value) ?? "value";
-      return (V = t.data) != null && V.length ? t.data.map((I) => ({
-        label: I == null ? void 0 : I[a],
-        value: I == null ? void 0 : I[m]
+    }), F("rcDescItemWidth", f), F("rcDescSingleWidth", u), F("rcDescColCount", v), F("rcDescGapPx", _(() => typeof t.gap == "number" ? t.gap : parseFloat(String(t.gap)) || 0));
+    const o = _(() => t.labelWidth === "" || t.labelWidth === void 0 ? "" : typeof t.labelWidth == "number" ? `${t.labelWidth}px` : String(t.labelWidth));
+    F("rcDescLabelWidth", o), F("rcDescGap", _(() => typeof t.gap == "number" ? `${t.gap}px` : String(t.gap)));
+    const l = _(() => {
+      var y, g, h;
+      const c = ((y = t.keyMap) == null ? void 0 : y.key) ?? "label", b = ((g = t.keyMap) == null ? void 0 : g.value) ?? "value";
+      return (h = t.data) != null && h.length ? t.data.map((E) => ({
+        label: E == null ? void 0 : E[c],
+        value: E == null ? void 0 : E[b]
       })) : [];
     });
-    return (a, m) => (i(), d("div", ge, [
-      a.$slots.title || e.title ? (i(), d("div", be, [
-        y(a.$slots, "title", {}, () => [
-          M(_(e.title), 1)
+    return (c, b) => (r(), m("div", He, [
+      c.$slots.title || e.title ? (r(), m("div", Ke, [
+        C(c.$slots, "title", {}, () => [
+          H(x(e.title), 1)
         ], !0)
-      ])) : g("", !0),
-      b("div", {
+      ])) : k("", !0),
+      $("div", {
         class: "rc-descriptions__body",
-        style: h({ gap: c.value }),
+        style: A({ gap: i.value }),
         ref_key: "wrapEl",
-        ref: n
+        ref: a
       }, [
-        s.value.length ? (i(!0), d(A, { key: 0 }, Q(s.value, (p, v) => (i(), X(R, {
-          key: v,
-          label: p.label,
-          value: p.value,
+        l.value.length ? (r(!0), m(M, { key: 0 }, Y(l.value, (y, g) => (r(), q(P, {
+          key: g,
+          label: y.label,
+          value: y.value,
           "label-width": e.labelWidth
-        }, null, 8, ["label", "value", "label-width"]))), 128)) : y(a.$slots, "default", { key: 1 }, void 0, !0)
+        }, null, 8, ["label", "value", "label-width"]))), 128)) : C(c.$slots, "default", { key: 1 }, void 0, !0)
       ], 4)
     ]));
   }
-}), B = /* @__PURE__ */ w(ve, [["__scopeId", "data-v-5fcaa235"]]);
-B.name = "rc-descriptions";
-R.name = "rc-descriptions-item";
-function K(e) {
-  return e.component(B.name, B), e.component("RcDescriptions", B), e.component(R.name, R), e.component("RcDescriptionsItem", R), e;
+}), J = /* @__PURE__ */ T(Ye, [["__scopeId", "data-v-5fcaa235"]]);
+J.name = "rc-descriptions";
+P.name = "rc-descriptions-item";
+function fe(e) {
+  return e.component(J.name, J), e.component("RcDescriptions", J), e.component(P.name, P), e.component("RcDescriptionsItem", P), e;
 }
-const He = B, Ke = R, he = { class: "rc-card__title" }, _e = { class: "rc-card__title-text" }, $e = {
+const Lt = J, Nt = P, Je = { class: "rc-card__title" }, Qe = { class: "rc-card__title-text" }, Xe = {
   key: 0,
   class: "rc-card__status"
-}, ke = {
+}, Ze = {
   key: 1,
   class: "rc-card__divider"
-}, xe = {
+}, et = {
   key: 2,
   class: "rc-card__action"
-}, Ce = /* @__PURE__ */ S({
+}, tt = /* @__PURE__ */ W({
   name: "rc-card",
   __name: "index",
   props: {
@@ -179,84 +248,84 @@ const He = B, Ke = R, he = { class: "rc-card__title" }, _e = { class: "rc-card__
     height: { default: "" }
   },
   setup(e) {
-    const t = e, n = f(() => {
+    const t = e, a = _(() => {
       const o = typeof t.round == "boolean" ? t.round ? "12px" : "0" : typeof t.round == "number" ? `${t.round}px` : String(t.round);
       return {
         backgroundColor: t.color || "var(--rc-white)",
         borderRadius: o,
-        boxShadow: l(t.elevation),
-        width: u(t.width),
-        height: u(t.height)
+        boxShadow: u(t.elevation),
+        width: f(t.width),
+        height: f(t.height)
       };
-    }), c = f(() => t.padding || "16px"), r = f(
+    }), i = _(() => t.padding || "16px"), v = _(
       () => typeof t.gap == "number" ? `${t.gap}px` : String(t.gap)
     );
-    function u(o) {
+    function f(o) {
       return o == null || o === "" ? "" : typeof o == "number" ? `${o}px` : String(o);
     }
-    function l(o) {
+    function u(o) {
       if (!o || o <= 0) return "none";
-      const s = 4 * o;
-      return `0 ${Math.round(s / 2)}px ${s}px rgba(0,0,0,0.06), 0 ${Math.round(
-        s / 4
-      )}px ${Math.round(s / 2)}px rgba(0,0,0,0.04)`;
+      const l = 4 * o;
+      return `0 ${Math.round(l / 2)}px ${l}px rgba(0,0,0,0.06), 0 ${Math.round(
+        l / 4
+      )}px ${Math.round(l / 2)}px rgba(0,0,0,0.04)`;
     }
-    return (o, s) => (i(), d("div", {
-      class: z(["rc-card", [{ "rc-card--bordered": e.bordered }]]),
-      style: h(n.value)
+    return (o, l) => (r(), m("div", {
+      class: V(["rc-card", [{ "rc-card--bordered": e.bordered }]]),
+      style: A(a.value)
     }, [
-      o.$slots.title || e.title || o.$slots.status || e.status ? (i(), d("div", {
+      o.$slots.title || e.title || o.$slots.status || e.status ? (r(), m("div", {
         key: 0,
         class: "rc-card__top",
-        style: h({ backgroundColor: e.topBgColor || "rgba(29, 133, 252, 0.05)" })
+        style: A({ backgroundColor: e.topBgColor || "rgba(29, 133, 252, 0.05)" })
       }, [
-        b("div", he, [
-          y(o.$slots, "title", {}, () => [
-            b("span", _e, _(e.title), 1)
+        $("div", Je, [
+          C(o.$slots, "title", {}, () => [
+            $("span", Qe, x(e.title), 1)
           ], !0)
         ]),
-        o.$slots.status || e.status ? (i(), d("div", $e, [
-          y(o.$slots, "status", {}, () => [
-            b("span", {
+        o.$slots.status || e.status ? (r(), m("div", Xe, [
+          C(o.$slots, "status", {}, () => [
+            $("span", {
               class: "rc-card__status-text",
-              style: h({ color: e.statusColor || "var(--rc-primary)" })
-            }, _(e.status), 5)
+              style: A({ color: e.statusColor || "var(--rc-primary)" })
+            }, x(e.status), 5)
           ], !0)
-        ])) : g("", !0)
-      ], 4)) : g("", !0),
-      b("div", {
+        ])) : k("", !0)
+      ], 4)) : k("", !0),
+      $("div", {
         class: "rc-card__body",
-        style: h({ padding: c.value, gap: r.value })
+        style: A({ padding: i.value, gap: v.value })
       }, [
-        y(o.$slots, "content", {}, () => [
-          y(o.$slots, "default", {}, void 0, !0)
+        C(o.$slots, "content", {}, () => [
+          C(o.$slots, "default", {}, void 0, !0)
         ], !0)
       ], 4),
-      o.$slots.action ? (i(), d("div", ke)) : g("", !0),
-      o.$slots.action ? (i(), d("div", xe, [
-        y(o.$slots, "action", {}, void 0, !0)
-      ])) : g("", !0)
+      o.$slots.action ? (r(), m("div", Ze)) : k("", !0),
+      o.$slots.action ? (r(), m("div", et, [
+        C(o.$slots, "action", {}, void 0, !0)
+      ])) : k("", !0)
     ], 6));
   }
-}), U = /* @__PURE__ */ w(Ce, [["__scopeId", "data-v-a7b95214"]]);
-U.name = "rc-card";
-const Se = "RcCard";
-function O(e) {
-  return e.component(U.name, U), e.component(Se, U), e;
+}), te = /* @__PURE__ */ T(tt, [["__scopeId", "data-v-a7b95214"]]);
+te.name = "rc-card";
+const nt = "RcCard";
+function me(e) {
+  return e.component(te.name, te), e.component(nt, te), e;
 }
-const we = {
+const st = {
   key: 0,
   class: "rc-toast__mask"
-}, Ie = { class: "rc-toast__content" }, De = {
+}, at = { class: "rc-toast__content" }, lt = {
   key: 0,
   class: "rc-toast__spinner"
-}, Ne = {
+}, rt = {
   key: 1,
   class: "rc-toast__icon rc-toast__icon--success"
-}, Re = {
+}, ot = {
   key: 2,
   class: "rc-toast__icon rc-toast__icon--fail"
-}, We = { class: "rc-toast__text" }, Be = /* @__PURE__ */ S({
+}, ct = { class: "rc-toast__text" }, it = /* @__PURE__ */ W({
   __name: "index",
   props: {
     message: { default: "" },
@@ -266,250 +335,433 @@ const we = {
     onAfterLeave: {}
   },
   setup(e, { expose: t }) {
-    const n = e, c = T(!0);
-    let r;
-    function u() {
-      r && (clearTimeout(r), r = null);
+    const a = e, i = I(!0);
+    let v;
+    function f() {
+      v && (clearTimeout(v), v = null);
     }
-    function l() {
-      u(), c.value = !1;
+    function u() {
+      f(), i.value = !1;
     }
-    return t({ close: l }), Z(() => {
-      n.duration && n.duration > 0 && (r = setTimeout(() => {
-        l();
-      }, n.duration));
-    }), ae(() => {
-      u();
-    }), (o, s) => (i(), d(A, null, [
-      (i(), X(ce, { to: "body" }, [
-        P(re, {
+    return t({ close: u }), be(() => {
+      a.duration && a.duration > 0 && (v = setTimeout(() => {
+        u();
+      }, a.duration));
+    }), ke(() => {
+      f();
+    }), (o, l) => (r(), m(M, null, [
+      (r(), q(Ne, { to: "body" }, [
+        L(le, {
           name: "rc-toast-fade",
           onAfterLeave: e.onAfterLeave
         }, {
-          default: ee(() => [
-            c.value ? (i(), d("div", {
+          default: O(() => [
+            i.value ? (r(), m("div", {
               key: 0,
-              class: z(["rc-toast", [`rc-toast--${e.type}`]])
+              class: V(["rc-toast", [`rc-toast--${e.type}`]])
             }, [
-              e.mask ? (i(), d("div", we)) : g("", !0),
-              b("div", Ie, [
-                e.type === "loading" ? (i(), d("div", De)) : e.type === "success" ? (i(), d("div", Ne)) : e.type === "fail" ? (i(), d("div", Re)) : g("", !0),
-                b("div", We, _(e.message), 1)
+              e.mask ? (r(), m("div", st)) : k("", !0),
+              $("div", at, [
+                e.type === "loading" ? (r(), m("div", lt)) : e.type === "success" ? (r(), m("div", rt)) : e.type === "fail" ? (r(), m("div", ot)) : k("", !0),
+                $("div", ct, x(e.message), 1)
               ])
-            ], 2)) : g("", !0)
+            ], 2)) : k("", !0)
           ]),
           _: 1
         }, 8, ["onAfterLeave"])
       ])),
-      y(o.$slots, "default", {}, void 0, !0)
+      C(o.$slots, "default", {}, void 0, !0)
     ], 64));
   }
-}), E = /* @__PURE__ */ w(Be, [["__scopeId", "data-v-d234c9c5"]]);
-let C = null, W = null;
-function Y() {
-  C && (C.unmount(), C = null), W && (document.body.removeChild(W), W = null);
+}), ne = /* @__PURE__ */ T(it, [["__scopeId", "data-v-d234c9c5"]]);
+let U = null, j = null;
+function ve() {
+  U && (U.unmount(), U = null), j && (document.body.removeChild(j), j = null);
 }
-function Oe(e) {
+function Bt(e) {
   const t = typeof e == "string" ? { message: e } : e || {};
-  Y(), W = document.createElement("div"), document.body.appendChild(W);
-  const n = {
+  ve(), j = document.createElement("div"), document.body.appendChild(j);
+  const a = {
     message: t.message,
     type: t.type ?? "text",
     duration: t.duration ?? 2e3,
     mask: t.mask ?? !1,
     onAfterLeave: () => {
-      var c;
-      Y(), (c = t.onClose) == null || c.call(t);
+      var i;
+      ve(), (i = t.onClose) == null || i.call(t);
     }
   };
-  return C = le(E, n), C.mount(W), {
-    close: ze
+  return U = Be(ne, a), U.mount(j), {
+    close: ut
   };
 }
-function ze() {
-  var e, t, n;
-  C && ((n = (t = (e = C._instance) == null ? void 0 : e.exposed) == null ? void 0 : t.close) == null || n.call(t));
+function ut() {
+  var e, t, a;
+  U && ((a = (t = (e = U._instance) == null ? void 0 : e.exposed) == null ? void 0 : t.close) == null || a.call(t));
 }
-E.name = "rc-toast";
-function j(e) {
-  return e.component(E.name, E), e;
+ne.name = "rc-toast";
+function pe(e) {
+  return e.component(ne.name, ne), e;
 }
-const Te = {
+const dt = {
   class: "rc-message",
   role: "alert",
   "aria-live": "polite"
-}, Ue = { class: "rc-message__content" }, Le = /* @__PURE__ */ S({
+}, ft = { class: "rc-message__content" }, mt = /* @__PURE__ */ W({
   __name: "index",
   setup(e, { expose: t }) {
-    const n = ie([]);
-    let c = 1;
-    function r(l) {
-      const o = n.findIndex((s) => s.id === l);
-      o >= 0 && n.splice(o, 1);
+    const a = We([]);
+    let i = 1;
+    function v(u) {
+      const o = a.findIndex((l) => l.id === u);
+      o >= 0 && a.splice(o, 1);
     }
-    function u(l, o, s) {
-      const a = c++;
-      return n.push({ id: a, type: l, content: o, duration: s }), s > 0 && window.setTimeout(() => r(a), s), a;
+    function f(u, o, l) {
+      const c = i++;
+      return a.push({ id: c, type: u, content: o, duration: l }), l > 0 && window.setTimeout(() => v(c), l), c;
     }
-    return t({ add: u, remove: r }), (l, o) => (i(), d("div", Te, [
-      P(ue, {
+    return t({ add: f, remove: v }), (u, o) => (r(), m("div", dt, [
+      L(Te, {
         name: "rc-message-fade",
         tag: "div"
       }, {
-        default: ee(() => [
-          (i(!0), d(A, null, Q(n, (s) => (i(), d("div", {
-            key: s.id,
-            class: z(["rc-message__item", `rc-message--${s.type}`])
+        default: O(() => [
+          (r(!0), m(M, null, Y(a, (l) => (r(), m("div", {
+            key: l.id,
+            class: V(["rc-message__item", `rc-message--${l.type}`])
           }, [
-            b("span", Ue, _(s.content), 1)
+            $("span", ft, x(l.content), 1)
           ], 2))), 128))
         ]),
         _: 1
       })
     ]));
   }
-}), Me = /* @__PURE__ */ w(Le, [["__scopeId", "data-v-87811df0"]]);
-let k = null, $ = null;
-function Ee() {
+}), vt = /* @__PURE__ */ T(mt, [["__scopeId", "data-v-87811df0"]]);
+let B = null, N = null;
+function pt() {
   var t;
-  if (k && $) return;
-  k = document.createElement("div"), document.body.appendChild(k);
-  const e = P(Me, {});
-  te(e, k), $ = (t = e.component) == null ? void 0 : t.exposed;
+  if (B && N) return;
+  B = document.createElement("div"), document.body.appendChild(B);
+  const e = L(vt, {});
+  $e(e, B), N = (t = e.component) == null ? void 0 : t.exposed;
 }
-function N(e, t, n) {
-  var r;
-  Ee();
-  const c = typeof n == "number" ? n : e === "loading" ? 0 : 2e3;
-  return (r = $ == null ? void 0 : $.add) == null ? void 0 : r.call($, e, t, c);
+function G(e, t, a) {
+  var v;
+  pt();
+  const i = typeof a == "number" ? a : e === "loading" ? 0 : 2e3;
+  return (v = N == null ? void 0 : N.add) == null ? void 0 : v.call(N, e, t, i);
 }
-const Ge = {
+const yt = {
   open(e) {
-    return N(e.type || "info", e.content, e.duration);
+    return G(e.type || "info", e.content, e.duration);
   },
   info(e, t) {
-    return N("info", e, t);
+    return G("info", e, t);
   },
   success(e, t) {
-    return N("success", e, t);
+    return G("success", e, t);
   },
   warning(e, t) {
-    return N("warning", e, t);
+    return G("warning", e, t);
   },
   error(e, t) {
-    return N("error", e, t);
+    return G("error", e, t);
   },
   loading(e, t) {
-    return N("loading", e, t);
+    return G("loading", e, t);
   },
   destroy() {
-    k && (te(null, k), k.remove(), k = null, $ = null);
+    B && ($e(null, B), B.remove(), B = null, N = null);
   }
 };
-function q(e) {
-  return e.config.globalProperties.$message = Ge, e;
+function ye(e) {
+  return e.config.globalProperties.$message = yt, e;
 }
-const Ae = {
+D.name = "rc-icon";
+function he(e) {
+  return e.component(D.name, D), e.component("RcIcon", D), e;
+}
+const ht = { class: "rc-search-area" }, gt = { class: "rc-search-area__bar" }, _t = ["onClick"], bt = { class: "rc-search-area__item-label" }, kt = { class: "rc-search-area__panel-content" }, $t = {
   key: 0,
-  class: "rc-icon__unicode"
-}, Pe = /* @__PURE__ */ S({
-  name: "rc-icon",
+  class: "rc-search-area__options-grid"
+}, Ct = ["onClick"], xt = { class: "rc-search-area__option-label" }, St = {
+  key: 1,
+  class: "rc-search-area__options-grid"
+}, wt = ["onClick"], It = { class: "rc-search-area__option-label" }, At = {
+  key: 2,
+  class: "rc-search-area__empty"
+}, Rt = { class: "rc-search-area__panel-footer" }, Vt = /* @__PURE__ */ W({
+  name: "rc-search-area",
   __name: "index",
   props: {
-    name: {},
-    size: { default: 16 },
-    color: { default: "" },
-    spin: { type: Boolean, default: !1 },
-    code: { default: "" }
+    items: { default: () => [] },
+    modelValue: { default: () => ({}) },
+    showMask: { type: Boolean, default: !0 }
   },
-  setup(e) {
-    const t = e, n = x(F, {}), c = f(() => (n == null ? void 0 : n.iconClass) || "iconfont"), r = f(() => t.name || ""), u = f(() => typeof t.size == "number" ? `${t.size}px` : t.size || "16px"), l = f(() => ({
-      fontSize: u.value,
-      color: t.color || void 0,
-      lineHeight: 1,
-      fontFamily: (n == null ? void 0 : n.iconClass) || "iconfont"
-    })), o = f(() => {
-      const s = t.code;
-      if (s == null || s === "" || s === 0) return "";
-      if (typeof s == "number")
-        return String.fromCharCode(s);
-      const a = String(s).replace(/^0x/i, ""), m = parseInt(a, 16);
-      return Number.isNaN(m) ? "" : String.fromCharCode(m);
+  emits: ["update:modelValue", "change", "confirm", "reset", "item-change"],
+  setup(e, { expose: t, emit: a }) {
+    const i = e, v = a, f = I(null), u = I(null), o = I(null), l = I({ top: "0px" }), c = async () => {
+      if (f.value === null || !u.value)
+        return;
+      await ue();
+      const s = u.value.getBoundingClientRect().top;
+      l.value = { top: `${s}px` };
+    }, b = (n) => {
+      if (f.value === null || !u.value)
+        return;
+      const s = n.target;
+      if (u.value.contains(s))
+        return;
+      const d = u.value.closest(".rc-search-area");
+      if (d) {
+        const p = d.querySelector(".rc-search-area__bar");
+        if (p && p.contains(s))
+          return;
+      }
+      se();
+    };
+    ie(f, async (n) => {
+      n !== null ? (await ue(), c(), window.addEventListener("resize", c), window.addEventListener("scroll", c, !0), document.addEventListener("click", b, !0)) : (window.removeEventListener("resize", c), window.removeEventListener("scroll", c, !0), document.removeEventListener("click", b, !0));
+    }), ke(() => {
+      window.removeEventListener("resize", c), window.removeEventListener("scroll", c, !0), document.removeEventListener("click", b, !0);
     });
-    return Z(() => {
-      if (typeof window > "u") return;
-      const s = n && n.iconCssUrl || ne.iconCssUrl;
+    const y = I({}), g = I({ ...i.modelValue });
+    ie(() => i.modelValue, (n) => {
+      g.value = { ...n || {} };
+    }, { deep: !0, immediate: !0 });
+    const h = _(() => f.value === null ? null : i.items[f.value]), E = _(() => {
+      if (!h.value) return "";
+      const n = De(h.value);
+      return n > 0 ? `(${n}项)` : "";
+    }), Se = (n) => {
+      const s = g.value[n.key];
+      if (s == null || s === "")
+        return n.label;
+      if (n.type === "single") {
+        const d = oe(n, s);
+        if (d)
+          return `${n.label}: ${X(d)}`;
+      } else {
+        const d = Array.isArray(s) ? s : [s];
+        if (d.length > 0) {
+          const p = d.map((S) => {
+            const w = oe(n, S);
+            return w ? X(w) : null;
+          }).filter((S) => S !== null);
+          if (p.length > 0)
+            return `${n.label}: ${p.join("、")}`;
+        }
+      }
+      return n.label;
+    }, we = (n) => {
+      const s = i.items[n];
       if (!s) return;
-      const a = `link[rel="stylesheet"][data-rcui-icon="true"][href="${s}"]`;
-      if (!document.head.querySelector(a)) {
-        const p = document.createElement("link");
-        p.rel = "stylesheet", p.href = s, p.setAttribute("data-rcui-icon", "true"), document.head.appendChild(p);
+      if (f.value === n) {
+        f.value = null;
+        return;
       }
-    }), (s, a) => (i(), d("i", {
-      class: z(["rc-icon", [c.value, r.value, { "rc-icon--spin": e.spin }]]),
-      style: h(l.value),
-      "aria-hidden": "true"
-    }, [
-      o.value ? (i(), d("span", Ae, _(o.value), 1)) : g("", !0)
-    ], 6));
+      const d = g.value[s.key];
+      s.type === "single" ? y.value[s.key] = d !== void 0 ? d : null : y.value[s.key] = d !== void 0 ? Array.isArray(d) ? [...d] : [d] : [], f.value = n;
+    }, se = () => {
+      f.value = null;
+    }, X = (n) => typeof n == "string" ? n : n.label || String(n.value), Z = (n) => typeof n == "string" ? n : n.value !== void 0 ? n.value : n, oe = (n, s) => n.options.find((d) => {
+      const p = Z(d);
+      return p === s || String(p) === String(s);
+    }) || null, ee = (n) => {
+      if (!h.value) return !1;
+      const s = h.value.key, d = y.value[s], p = Z(n);
+      return h.value.type === "single" ? d != null && d === p : (Array.isArray(d) ? d : []).some((w) => w === p || String(w) === String(p));
+    }, Ie = (n) => {
+      if (!h.value) return;
+      const s = h.value.key, d = Z(n);
+      y.value[s] === d ? y.value[s] = null : y.value[s] = d;
+    }, Ae = (n) => {
+      if (!h.value) return;
+      const s = h.value.key, d = Z(n), p = Array.isArray(y.value[s]) ? [...y.value[s]] : [], S = p.findIndex(
+        (w) => w === d || String(w) === String(d)
+      );
+      S >= 0 ? p.splice(S, 1) : p.push(d), y.value[s] = p;
+    }, Re = () => {
+      if (!h.value) return;
+      const n = h.value.key;
+      h.value.type === "single" ? y.value[n] = null : y.value[n] = [];
+    }, Ve = () => {
+      if (!h.value) return;
+      const n = h.value.key, s = y.value[n], d = g.value[n];
+      let p;
+      h.value.type === "single" ? (p = s ?? void 0, g.value[n] = p) : (p = Array.isArray(s) && s.length > 0 ? s : void 0, g.value[n] = p), v("update:modelValue", { ...g.value }), v("change", { ...g.value }, h.value), v("confirm", { ...g.value }, h.value), JSON.stringify(d) !== JSON.stringify(p) && v("item-change", n, p), se();
+    }, ce = (n) => {
+      const s = g.value[n.key];
+      return s == null || s === "" ? 0 : n.type === "single" ? 1 : Array.isArray(s) ? s.length : s ? 1 : 0;
+    }, De = (n) => {
+      const s = y.value[n.key];
+      return s == null || s === "" ? 0 : n.type === "single" ? 1 : Array.isArray(s) ? s.length : 0;
+    };
+    return t({
+      /** 获取当前筛选值 */
+      getValues: () => ({ ...g.value }),
+      /** 重置所有筛选 */
+      reset: () => {
+        g.value = {}, y.value = {}, v("update:modelValue", {}), v("change", {}, null), v("reset");
+      }
+    }), (n, s) => (r(), m("div", ht, [
+      $("div", gt, [
+        (r(!0), m(M, null, Y(i.items, (d, p) => (r(), m("div", {
+          key: p,
+          class: V(["rc-search-area__item", {
+            "is-active": f.value === p,
+            "has-value": ce(d) > 0
+          }]),
+          onClick: (S) => we(p)
+        }, [
+          $("span", bt, x(Se(d)), 1),
+          L(K(D), {
+            name: "icon_a-xiala2",
+            color: f.value !== p && ce(d) > 0 ? "#1677ff" : "#969799",
+            class: V(["rc-search-area__item-arrow", { "is-up": f.value === p }])
+          }, null, 8, ["color", "class"])
+        ], 10, _t))), 128))
+      ]),
+      L(le, { name: "rc-search-area-fade" }, {
+        default: O(() => [
+          f.value !== null && i.showMask ? (r(), m("div", {
+            key: 0,
+            ref_key: "maskRef",
+            ref: o,
+            class: "rc-search-area__mask",
+            style: A(l.value),
+            onClick: se
+          }, null, 4)) : k("", !0)
+        ]),
+        _: 1
+      }),
+      L(le, { name: "rc-search-area-slide" }, {
+        default: O(() => {
+          var d, p, S, w;
+          return [
+            f.value !== null ? (r(), m("div", {
+              key: 0,
+              ref_key: "panelRef",
+              ref: u,
+              class: "rc-search-area__panel"
+            }, [
+              $("div", kt, [
+                ((d = h.value) == null ? void 0 : d.type) === "single" ? (r(), m("div", $t, [
+                  (r(!0), m(M, null, Y(h.value.options, (R, ae) => (r(), m("div", {
+                    key: ae,
+                    class: V(["rc-search-area__option", { "is-selected": ee(R) }]),
+                    onClick: (Ee) => Ie(R)
+                  }, [
+                    $("span", xt, x(X(R)), 1),
+                    ee(R) ? (r(), q(K(D), {
+                      key: 0,
+                      name: "icon_select",
+                      class: "rc-search-area__option-check"
+                    })) : k("", !0)
+                  ], 10, Ct))), 128))
+                ])) : (r(), m("div", St, [
+                  (r(!0), m(M, null, Y(((p = h.value) == null ? void 0 : p.options) || [], (R, ae) => (r(), m("div", {
+                    key: ae,
+                    class: V(["rc-search-area__option", { "is-selected": ee(R) }]),
+                    onClick: (Ee) => Ae(R)
+                  }, [
+                    $("span", It, x(X(R)), 1),
+                    ee(R) ? (r(), q(K(D), {
+                      key: 0,
+                      name: "icon_select",
+                      class: "rc-search-area__option-check"
+                    })) : k("", !0)
+                  ], 10, wt))), 128))
+                ])),
+                ((w = (S = h.value) == null ? void 0 : S.options) == null ? void 0 : w.length) === 0 ? (r(), m("div", At, [...s[0] || (s[0] = [
+                  $("p", null, "暂无选项", -1)
+                ])])) : k("", !0)
+              ]),
+              $("div", Rt, [
+                L(K(Q), {
+                  block: "",
+                  onClick: Re
+                }, {
+                  default: O(() => [...s[1] || (s[1] = [
+                    H(" 重置 ", -1)
+                  ])]),
+                  _: 1
+                }),
+                L(K(Q), {
+                  type: "primary",
+                  block: "",
+                  onClick: Ve
+                }, {
+                  default: O(() => [
+                    H(" 确定" + x(E.value), 1)
+                  ]),
+                  _: 1
+                })
+              ])
+            ], 512)) : k("", !0)
+          ];
+        }),
+        _: 1
+      })
+    ]));
   }
-}), L = /* @__PURE__ */ w(Pe, [["__scopeId", "data-v-3857a892"]]);
-L.name = "rc-icon";
-function J(e) {
-  return e.component(L.name, L), e.component("RcIcon", L), e;
-}
-const F = Symbol("RECYCLE_UI_CONFIG"), ne = {
+}), ge = /* @__PURE__ */ T(Vt, [["__scopeId", "data-v-6a70650d"]]), _e = (e) => {
+  e.component("RcSearchArea", ge), e.component("rc-search-area", ge);
+}, re = Symbol("RECYCLE_UI_CONFIG"), Ce = {
   prefix: "rc",
   autoRegister: !0,
-  provideKey: F,
+  provideKey: re,
   // 预留主题/其他全局配置
   theme: {},
   // IconFont 默认配置（可在 app.use 时覆盖）
   iconCssUrl: "//at.alicdn.com/t/c/font_4252799_9vcnw0pnmkh.css",
   iconClass: "iconfont"
 };
-function Fe(e, t) {
-  t.autoRegister !== !1 && (typeof H == "function" && H(e), typeof K == "function" && K(e), typeof O == "function" && O(e), typeof j == "function" && j(e), typeof J == "function" && J(e), typeof q == "function" && q(e));
+function Dt(e, t) {
+  t.autoRegister !== !1 && (typeof de == "function" && de(e), typeof fe == "function" && fe(e), typeof me == "function" && me(e), typeof pe == "function" && pe(e), typeof he == "function" && he(e), typeof ye == "function" && ye(e), typeof _e == "function" && _e(e));
 }
-const se = (e, t) => {
-  const n = { ...ne, ...t || {} };
-  if (e.provide(n.provideKey ?? F, n), e.config.globalProperties.$recycleUI = n, typeof window < "u" && n.iconCssUrl) {
-    const c = `link[rel="stylesheet"][data-rcui-icon="true"][href="${n.iconCssUrl}"]`;
-    if (!document.head.querySelector(c)) {
-      const u = document.createElement("link");
-      u.rel = "stylesheet", u.href = n.iconCssUrl, u.setAttribute("data-rcui-icon", "true"), document.head.appendChild(u);
+const xe = (e, t) => {
+  const a = { ...Ce, ...t || {} };
+  if (e.provide(a.provideKey ?? re, a), e.config.globalProperties.$recycleUI = a, typeof window < "u" && a.iconCssUrl) {
+    const i = `link[rel="stylesheet"][data-rcui-icon="true"][href="${a.iconCssUrl}"]`;
+    if (!document.head.querySelector(i)) {
+      const f = document.createElement("link");
+      f.rel = "stylesheet", f.href = a.iconCssUrl, f.setAttribute("data-rcui-icon", "true"), document.head.appendChild(f);
     }
   }
-  return Fe(e, n), e;
-}, Ye = { install: se };
-function je(e) {
+  return Dt(e, a), e;
+}, Wt = { install: xe };
+function Tt(e) {
   return {
     install(t) {
-      se(t, e);
+      xe(t, e);
     }
   };
 }
 export {
-  F as RECYCLE_UI_SYMBOL,
-  G as RcButton,
-  U as RcCard,
-  He as RcDescriptions,
-  Ke as RcDescriptionsItem,
-  L as RcIcon,
-  E as RcToast,
-  je as createRecycleUI,
-  Ye as default,
-  ne as defaultRecycleUIConfig,
-  ze as hideToast,
-  se as install,
-  H as installButton,
-  O as installCard,
-  K as installDescriptions,
-  J as installIcon,
-  q as installMessage,
-  Ge as message,
-  He as rcDescriptions,
-  Ke as rcDescriptionsItem,
-  Oe as showToast
+  re as RECYCLE_UI_SYMBOL,
+  Q as RcButton,
+  te as RcCard,
+  Lt as RcDescriptions,
+  Nt as RcDescriptionsItem,
+  D as RcIcon,
+  ge as RcSearchArea,
+  ne as RcToast,
+  Tt as createRecycleUI,
+  Wt as default,
+  Ce as defaultRecycleUIConfig,
+  ut as hideToast,
+  xe as install,
+  de as installButton,
+  me as installCard,
+  fe as installDescriptions,
+  he as installIcon,
+  ye as installMessage,
+  _e as installSearchArea,
+  yt as message,
+  Lt as rcDescriptions,
+  Nt as rcDescriptionsItem,
+  Bt as showToast
 };
 //# sourceMappingURL=index.mjs.map