ant-design-x-vue 1.2.7 → 1.2.9

package/es/_util/cssinjs/StyleContext.mjs

@@ -1,7 +1,8 @@
-import { inject as A, shallowRef as C, getCurrentInstance as T, defineComponent as g, watch as x, unref as d, provide as b } from "vue";
-import P from "./Cache.mjs";
-import { withInstall as v, arrayType as u, booleanType as l, someType as I, stringType as f, objectType as E } from "../type.mjs";
-const J = "data-token-hash", h = "data-css-hash", V = "data-cache-path", i = "__cssinjs_instance__";
+import { inject as A, shallowRef as C, getCurrentInstance as T, defineComponent as g, h as P, watch as v, unref as d, provide as x } from "vue";
+import b from "./Cache.mjs";
+import { withInstall as I, arrayType as u, booleanType as l, someType as E, stringType as f, objectType as N } from "../type.mjs";
+import { StyleProvider as j } from "ant-design-vue";
+const q = "data-token-hash", h = "data-css-hash", D = "data-cache-path", i = "__cssinjs_instance__";
 function s() {
   const e = Math.random().toString(12).slice(2);
   if (typeof document < "u" && document.head && document.body) {
@@ -11,22 +12,22 @@ function s() {
     Array.from(o).forEach((t) => {
       t[i] = t[i] || e, t[i] === e && document.head.insertBefore(t, n);
     });
-    const c = {};
+    const r = {};
     Array.from(document.querySelectorAll(`style[${h}]`)).forEach((t) => {
-      var r;
-      const a = t.getAttribute(h);
-      c[a] ? t[i] === e && ((r = t.parentNode) == null || r.removeChild(t)) : c[a] = !0;
+      var a;
+      const c = t.getAttribute(h);
+      r[c] ? t[i] === e && ((a = t.parentNode) == null || a.removeChild(t)) : r[c] = !0;
     });
   }
-  return new P(e);
+  return new b(e);
 }
-const p = Symbol("StyleContextKey"), N = () => {
-  var n, c, t;
+const p = Symbol("StyleContextKey"), w = () => {
+  var n, r, t;
   const e = T();
   let o;
   if (e && e.appContext) {
-    const a = (t = (c = (n = e.appContext) == null ? void 0 : n.config) == null ? void 0 : c.globalProperties) == null ? void 0 : t.__ANTDV_CSSINJS_CACHE__;
-    a ? o = a : (o = s(), e.appContext.config.globalProperties && (e.appContext.config.globalProperties.__ANTDV_CSSINJS_CACHE__ = o));
+    const c = (t = (r = (n = e.appContext) == null ? void 0 : n.config) == null ? void 0 : r.globalProperties) == null ? void 0 : t.__ANTDV_CSSINJS_CACHE__;
+    c ? o = c : (o = s(), e.appContext.config.globalProperties && (e.appContext.config.globalProperties.__ANTDV_CSSINJS_CACHE__ = o));
   } else
     o = s();
   return o;
@@ -35,32 +36,32 @@ const p = Symbol("StyleContextKey"), N = () => {
   defaultCache: !0,
   hashPriority: "low"
 }, y = () => {
-  const e = N();
+  const e = w();
   return A(p, C({
     ...m,
     cache: e
   }));
-}, _ = (e) => {
+}, S = (e) => {
   const o = y(), n = C({
     ...m,
     cache: s()
   });
-  return x([() => d(e), o], () => {
-    const c = {
+  return v([() => d(e), o], () => {
+    const r = {
       ...o.value
     }, t = d(e);
-    Object.keys(t).forEach((r) => {
-      const S = t[r];
-      t[r] !== void 0 && (c[r] = S);
+    Object.keys(t).forEach((a) => {
+      const _ = t[a];
+      t[a] !== void 0 && (r[a] = _);
     });
     const {
-      cache: a
+      cache: c
     } = t;
-    c.cache = c.cache || s(), c.defaultCache = !a && o.value.defaultCache, n.value = c;
+    r.cache = r.cache || s(), r.defaultCache = !c && o.value.defaultCache, n.value = r;
   }, {
     immediate: !0
-  }), b(p, n), n;
-}, j = () => ({
+  }), x(p, n), n;
+}, H = () => ({
   autoClear: l(),
   /** @private Test only. Not work in production. */
   mock: f(),
@@ -68,13 +69,13 @@ const p = Symbol("StyleContextKey"), N = () => {
    * Only set when you need ssr to extract style on you own.
    * If not provided, it will auto create <style /> on the end of Provider in server side.
    */
-  cache: E(),
+  cache: N(),
   /** Tell children that this context is default generated context */
   defaultCache: l(),
   /** Use `:where` selector to reduce hashId css selector priority */
   hashPriority: f(),
   /** Tell cssinjs where to inject style in */
-  container: I(),
+  container: E(),
   /** Component wil render inline  `<style />` for fallback in SSR. Not recommend. */
   ssrInline: l(),
   /** Transform css before inject in document. Please note that `transformers` do not support dynamic update */
@@ -85,32 +86,37 @@ const p = Symbol("StyleContextKey"), N = () => {
    * Please note that `linters` do not support dynamic update.
    */
   linters: u()
-}), w = v(/* @__PURE__ */ g({
-  name: "AStyleProvider",
+}), R = I(/* @__PURE__ */ g({
+  name: "AXStyleProvider",
   inheritAttrs: !1,
-  props: j(),
+  props: H(),
   setup(e, {
     slots: o
   }) {
-    return _(e), () => {
-      var n;
-      return (n = o.default) == null ? void 0 : n.call(o);
-    };
+    return S(e), () => P(
+      j,
+      // @ts-ignore
+      e,
+      () => {
+        var n;
+        return (n = o.default) == null ? void 0 : n.call(o);
+      }
+    );
   }
-})), q = {
+})), M = {
   useStyleInject: y,
-  useStyleProvider: _,
-  StyleProvider: w
+  useStyleProvider: S,
+  StyleProvider: R
 };
 export {
-  V as ATTR_CACHE_PATH,
+  D as ATTR_CACHE_PATH,
   h as ATTR_MARK,
-  J as ATTR_TOKEN,
+  q as ATTR_TOKEN,
   i as CSS_IN_JS_INSTANCE,
-  w as StyleProvider,
+  R as StyleProvider,
   s as createCache,
-  q as default,
-  j as styleProviderProps,
+  M as default,
+  H as styleProviderProps,
   y as useStyleInject,
-  _ as useStyleProvider
+  S as useStyleProvider
 };

package/es/bubble/Bubble.mjs

@@ -1,23 +1,25 @@
-import { defineComponent as j, mergeDefaults as D, toRef as h, useSlots as H, ref as d, watch as N, unref as k, watchEffect as q, computed as r, createVNode as l, isVNode as z, Fragment as G, toValue as c, mergeProps as J } from "vue";
-import { a as K } from "../attachments/Attachments2.mjs";
-import { Avatar as L } from "ant-design-vue";
-import M from "../_util/hooks/use-x-component-config.mjs";
+import { defineComponent as H, mergeDefaults as k, toRef as h, useSlots as q, ref as d, watch as N, unref as z, watchEffect as G, computed as r, createVNode as l, isVNode as x, Fragment as J, toValue as i, mergeProps as K } from "vue";
+import { a as L } from "../attachments/Attachments2.mjs";
+import { Avatar as M } from "ant-design-vue";
+import O from "../_util/hooks/use-x-component-config.mjs";
 import "../x-provider/index.mjs";
-import O from "./hooks/useTypedEffect.mjs";
-import Q from "./hooks/useTypingConfig.mjs";
-import W from "./loading.mjs";
-import Y from "./style/index.mjs";
-import { useBubbleContextInject as Z } from "./context.mjs";
-import U from "../x-provider/hooks/use-x-provider-context.mjs";
-const ie = /* @__PURE__ */ j({
+import Q from "./hooks/useTypedEffect.mjs";
+import W from "./hooks/useTypingConfig.mjs";
+import Y from "./loading.mjs";
+import Z from "./style/index.mjs";
+import { useBubbleContextInject as U } from "./context.mjs";
+import p from "../x-provider/hooks/use-x-provider-context.mjs";
+const ue = /* @__PURE__ */ H({
   name: "AXBubble",
   __name: "Bubble",
-  props: D({
+  props: k({
     prefixCls: null,
     rootClassName: null,
     styles: null,
     classNames: null,
-    avatar: null,
+    avatar: {
+      type: Function
+    },
     placement: null,
     loading: {
       type: Boolean
@@ -44,35 +46,35 @@ const ie = /* @__PURE__ */ j({
     variant: "filled"
   }),
   setup(e, {
-    expose: x
+    expose: $
   }) {
-    const $ = K(e, ["prefixCls", "rootClassName", "classNames", "styles", "avatar", "placement", "loading", "loadingRender", "typing", "content", "messageRender", "variant", "shape", "onTypingComplete", "header", "footer"]);
+    const b = L(e, ["prefixCls", "rootClassName", "classNames", "styles", "avatar", "placement", "loading", "loadingRender", "typing", "content", "messageRender", "variant", "shape", "onTypingComplete", "header", "footer"]);
     h(e, "content"), h(e, "prefixCls");
-    const a = H(), g = d(e.content);
+    const a = q(), y = d(e.content);
     N(() => e.content, () => {
-      g.value = e.content;
+      y.value = e.content;
     });
     const {
-      onUpdate: i
-    } = k(Z()), y = d(null), {
-      direction: b,
-      getPrefixCls: R
-    } = U(), t = R("bubble", e.prefixCls), n = M("bubble"), [T, P, S, C] = Q(() => e.typing), [s, u] = O(g, T, P, S), f = d(!1);
+      onUpdate: c
+    } = z(U()), g = d(null), {
+      direction: R,
+      getPrefixCls: T
+    } = p(), t = T("bubble", e.prefixCls), n = O("bubble"), [P, S, V, C] = W(() => e.typing), [s, u] = Q(y, P, S, V), f = d(!1);
     N(s, () => {
-      i == null || i();
-    }), q(() => {
+      c == null || c();
+    }), G(() => {
       var o;
       !u.value && !e.loading ? f.value || (f.value = !0, (o = e.onTypingComplete) == null || o.call(e)) : f.value = !1;
     });
-    const [V, w, B] = Y(() => t), E = r(() => [t, e.rootClassName, n.value.className, w.value, B, `${t}-${e.placement}`, {
-      [`${t}-rtl`]: b.value === "rtl"
+    const [A, w, B] = Z(() => t), E = r(() => [t, e.rootClassName, n.value.className, w.value, B, `${t}-${e.placement}`, {
+      [`${t}-rtl`]: R.value === "rtl"
     }, {
       [`${t}-typing`]: u.value && !e.loading && !e.messageRender && !a.message && !C.value
-    }]), F = r(() => a.avatar ? a.avatar() : z(e.avatar) ? e.avatar : l(L, e.avatar, null)), I = r(() => a.message ? a.message({
+    }]), F = (o) => Array.isArray(o) && o.every(x), I = r(() => a.avatar ? a.avatar() : typeof e.avatar == "function" ? e.avatar() : x(e.avatar) || F(e.avatar) ? e.avatar : l(M, e.avatar, null)), X = r(() => a.message ? a.message({
       content: s.value
-    }) : e.messageRender ? e.messageRender(s.value) : s.value), X = r(() => e.loading ? a.loading ? a.loading() : e.loadingRender ? e.loadingRender() : l(W, {
+    }) : e.messageRender ? e.messageRender(s.value) : s.value), j = r(() => e.loading ? a.loading ? a.loading() : e.loadingRender ? e.loadingRender() : l(Y, {
       prefixCls: t
-    }, null) : l(G, null, [I.value, u.value && c(C)])), A = r(() => {
+    }, null) : l(J, null, [X.value, u.value && i(C)])), D = r(() => {
       const o = l("div", {
         style: {
           ...n.value.styles.content,
@@ -81,7 +83,7 @@ const ie = /* @__PURE__ */ j({
         class: [`${t}-content`, `${t}-content-${e.variant}`, {
           [`${t}-content-${e.shape}`]: e.shape
         }, n.value.classNames.content, e.classNames.content]
-      }, [c(X)]), m = a.header ? a.header({
+      }, [i(j)]), m = a.header ? a.header({
         content: s.value
       }) : typeof e.header == "function" ? e.header(s.value) : e.header, v = a.footer ? a.footer({
         content: s.value
@@ -102,25 +104,25 @@ const ie = /* @__PURE__ */ j({
         }
       }, [v])]) : o;
     });
-    return x({
-      nativeElement: y
-    }), () => V(l("div", J({
+    return $({
+      nativeElement: g
+    }), () => A(l("div", K({
       style: {
         ...n.value.style
         // ...(style as object),
       },
-      class: c(E)
-    }, $, {
-      ref: y
+      class: i(E)
+    }, b, {
+      ref: g
     }), [(a.avatar || e.avatar) && l("div", {
       style: {
         ...n.value.styles.avatar,
         ...e.styles.avatar
       },
       class: [`${t}-avatar`, n.value.classNames.avatar, e.classNames.avatar]
-    }, [c(F)]), c(A)]));
+    }, [i(I)]), i(D)]));
   }
 });
 export {
-  ie as default
+  ue as default
 };

package/es/bubble/BubbleList.mjs

@@ -1,20 +1,20 @@
-import { defineComponent as M, mergeDefaults as O, toRef as g, useAttrs as W, mergeProps as h, ref as u, watch as m, watchEffect as j, onWatcherCleanup as q, unref as t, nextTick as F, computed as G, createVNode as x } from "vue";
-import { a as J, c as Q } from "../attachments/Attachments2.mjs";
-import { useEventCallback as Y } from "../_util/hooks/use-event-callback.mjs";
-import Z from "../_util/pick-attrs.mjs";
+import { defineComponent as q, mergeDefaults as F, toRef as p, useAttrs as G, useSlots as J, computed as A, mergeProps as v, ref as d, watch as g, watchEffect as Q, onWatcherCleanup as Y, unref as o, nextTick as Z, createVNode as x } from "vue";
+import { a as k, c as b } from "../attachments/Attachments2.mjs";
+import { useEventCallback as _ } from "../_util/hooks/use-event-callback.mjs";
+import tt from "../_util/pick-attrs.mjs";
 import "../x-provider/index.mjs";
-import _ from "./Bubble.mjs";
-import tt from "./hooks/useDisplayData.mjs";
-import et from "./hooks/useListData.mjs";
-import ot from "./style/index.mjs";
-import b from "../_util/hooks/use-state.mjs";
-import { BubbleContextProvider as st } from "./context.mjs";
-import lt from "../x-provider/hooks/use-x-provider-context.mjs";
-const nt = 1, bt = /* @__PURE__ */ M({
+import et from "./Bubble.mjs";
+import ot from "./hooks/useDisplayData.mjs";
+import st from "./hooks/useListData.mjs";
+import at from "./style/index.mjs";
+import S from "../_util/hooks/use-state.mjs";
+import { BubbleContextProvider as lt } from "./context.mjs";
+import rt from "../x-provider/hooks/use-x-provider-context.mjs";
+const nt = 1, Rt = /* @__PURE__ */ q({
   name: "AXBubbleList",
   inheritAttrs: !1,
   __name: "BubbleList",
-  props: O({
+  props: F({
     prefixCls: null,
     rootClassName: null,
     items: null,
@@ -25,111 +25,147 @@ const nt = 1, bt = /* @__PURE__ */ M({
   }, {
     autoScroll: !0
   }),
-  setup(e, {
-    expose: D
+  setup(s, {
+    expose: N
   }) {
-    const T = J(e, ["prefixCls", "rootClassName", "items", "autoScroll", "roles"]);
-    g(e, "roles"), g(e, "items"), g(e, "prefixCls");
-    const V = W(), A = Z(h(T, V), {
+    const w = k(s, ["prefixCls", "rootClassName", "items", "autoScroll", "roles"]);
+    p(s, "roles"), p(s, "items"), p(s, "prefixCls");
+    const B = G(), a = J(), L = A(() => tt(v(w, B), {
       attr: !0,
       aria: !0
-    }), v = u(e.items), S = u(e.roles);
-    m(() => e.items, () => {
-      v.value = e.items;
-    }), m(() => e.roles, () => {
-      S.value = e.roles;
+    })), R = d(s.items), P = d(s.roles);
+    g(() => s.items, () => {
+      R.value = s.items;
+    }), g(() => s.roles, () => {
+      P.value = s.roles;
     });
-    const r = u(null), i = u({}), {
-      getPrefixCls: N
-    } = lt(), P = N("bubble", e.prefixCls), R = `${P}-list`, [w, B, L] = ot(P), [H, I] = b(!1);
-    j(() => {
-      I(!0), q(() => {
-        I(!1);
+    const i = d(null), u = d({}), {
+      getPrefixCls: H
+    } = rt(), I = H("bubble", s.prefixCls), E = `${I}-list`, [U, $, z] = at(I), [X, D] = S(!1);
+    Q(() => {
+      D(!0), Y(() => {
+        D(!1);
       });
     });
-    const U = et(v, S), [a, $] = tt(U), [E, f] = b(!0), [d, y] = b(0), z = (o) => {
-      const s = o.target;
-      f(s.scrollHeight - Math.abs(s.scrollTop) - s.clientHeight <= nt);
+    const y = st(R, P), [m, K] = ot(y), [T, C] = S(!0), [h, V] = S(0), M = (t) => {
+      const l = t.target;
+      C(l.scrollHeight - Math.abs(l.scrollTop) - l.clientHeight <= nt);
     };
-    m(d, () => {
-      e.autoScroll && t(r) && t(E) && F(() => {
-        t(r).scrollTo({
-          top: t(r).scrollHeight
+    g(h, () => {
+      s.autoScroll && o(i) && o(T) && Z(() => {
+        o(i).scrollTo({
+          top: o(i).scrollHeight
         });
       });
-    }), m(() => t(a).length, () => {
-      var o;
-      if (e.autoScroll) {
-        const s = (o = t(a)[t(a).length - 2]) == null ? void 0 : o.key, l = t(i)[s];
-        if (l) {
+    }), g(() => o(m).length, () => {
+      var t;
+      if (s.autoScroll) {
+        const l = (t = o(m)[o(m).length - 2]) == null ? void 0 : t.key, e = o(u)[l];
+        if (e) {
           const {
             nativeElement: n
-          } = l, {
+          } = e, {
             top: c = 0,
-            bottom: C = 0
+            bottom: f = 0
           } = (n == null ? void 0 : n.getBoundingClientRect()) ?? {}, {
-            top: p,
-            bottom: K
-          } = t(r).getBoundingClientRect();
-          c < K && C > p && (y(t(d) + 1), f(!0));
+            top: r,
+            bottom: j
+          } = o(i).getBoundingClientRect();
+          c < j && f > r && (V(o(h) + 1), C(!0));
         }
       }
     });
-    const X = Y(() => {
-      e.autoScroll && y(t(d) + 1);
-    }), k = G(() => ({
-      onUpdate: X
+    const O = _(() => {
+      s.autoScroll && V(o(h) + 1);
+    }), W = A(() => ({
+      onUpdate: O
     }));
-    return D({
-      nativeElement: r,
+    return N({
+      nativeElement: i,
       scrollTo: ({
-        key: o,
-        offset: s,
-        behavior: l = "smooth",
+        key: t,
+        offset: l,
+        behavior: e = "smooth",
         block: n
       }) => {
-        if (typeof s == "number")
-          t(r).scrollTo({
-            top: s,
-            behavior: l
+        if (typeof l == "number")
+          o(i).scrollTo({
+            top: l,
+            behavior: e
           });
-        else if (o !== void 0) {
-          const c = t(i)[o];
+        else if (t !== void 0) {
+          const c = o(u)[t];
           if (c) {
-            const C = t(a).findIndex((p) => p.key === o);
-            f(C === t(a).length - 1), c.nativeElement.scrollIntoView({
-              behavior: l,
+            const f = o(m).findIndex((r) => r.key === t);
+            C(f === o(m).length - 1), c.nativeElement.scrollIntoView({
+              behavior: e,
               block: n
             });
           }
         }
       }
-    }), () => w(x(st, {
-      value: k.value
+    }), () => U(x(lt, {
+      value: W.value
     }, {
-      default: () => [x("div", h(A, {
-        class: Q(R, e.rootClassName, B.value, L, {
-          [`${R}-reach-end`]: E.value
+      default: () => [x("div", v(L.value, {
+        class: b(E, s.rootClassName, $.value, z, {
+          [`${E}-reach-end`]: T.value
         }),
-        ref: r,
-        onScroll: z
-      }), [t(a).map(({
-        key: o,
-        onTypingComplete: s,
-        ...l
-      }) => x(_, h(l, {
-        key: o,
-        ref: (n) => {
-          n ? i.value[o] = n : delete i.value[o];
-        },
-        typing: H.value ? l.typing : !1,
-        onTypingComplete: () => {
-          s == null || s(), $(o);
-        }
-      }), null))])]
+        ref: i,
+        onScroll: M
+      }), [o(m).map(({
+        key: t,
+        onTypingComplete: l,
+        ...e
+      }) => {
+        var n, c, f;
+        return x(et, v(e, {
+          avatar: a.avatar ? () => {
+            var r;
+            return (r = a.avatar) == null ? void 0 : r.call(a, {
+              item: {
+                key: t,
+                ...e
+              }
+            });
+          } : e.avatar,
+          header: ((n = a.header) == null ? void 0 : n.call(a, {
+            item: {
+              key: t,
+              ...e
+            }
+          })) ?? e.header,
+          footer: ((c = a.footer) == null ? void 0 : c.call(a, {
+            item: {
+              key: t,
+              ...e
+            }
+          })) ?? e.footer,
+          loadingRender: a.loading ? () => a.loading({
+            item: {
+              key: t,
+              ...e
+            }
+          }) : e.loadingRender,
+          content: ((f = a.message) == null ? void 0 : f.call(a, {
+            item: {
+              key: t,
+              ...e
+            }
+          })) ?? e.content,
+          key: t,
+          ref: (r) => {
+            r ? u.value[t] = r : delete u.value[t];
+          },
+          typing: X.value ? e.typing : !1,
+          onTypingComplete: () => {
+            l == null || l(), K(t);
+          }
+        }), null);
+      })])]
     }));
   }
 });
 export {
-  bt as default
+  Rt as default
 };

package/es/bubble/style/list.mjs

@@ -1,14 +1,27 @@
-const o = (e) => {
-  const { componentCls: t, padding: l } = e;
+const t = (r) => {
+  const { componentCls: o, padding: l } = r;
   return {
-    [`${t}-list`]: {
+    [`${o}-list`]: {
       display: "flex",
       flexDirection: "column",
       gap: l,
-      overflowY: "auto"
+      overflowY: "auto",
+      "&::-webkit-scrollbar": {
+        width: 8,
+        backgroundColor: "transparent"
+      },
+      "&::-webkit-scrollbar-thumb": {
+        backgroundColor: r.colorTextTertiary,
+        borderRadius: r.borderRadiusSM
+      },
+      // For Firefox
+      "&": {
+        scrollbarWidth: "thin",
+        scrollbarColor: `${r.colorTextTertiary} transparent`
+      }
     }
   };
 };
 export {
-  o as default
+  t as default
 };