x-next 1.0.0 → 1.1.0

package/dist/es/components/menu/overflow-wrap.js

@@ -0,0 +1,92 @@
+import { defineComponent as V, ref as w, onMounted as _, onUnmounted as $, createVNode as h, cloneVNode as g, mergeProps as L, createTextVNode as E } from "vue";
+import k from "../../node_modules/.pnpm/resize-observer-polyfill@1.5.1/node_modules/resize-observer-polyfill/dist/ResizeObserver.es.js";
+import { getStyle as N } from "../../_utils/style.js";
+import F from "./hooks/use-menu-context.js";
+import P from "./MenuSubMenu.js";
+import { unFragment as T } from "../../_utils/vue-eco.js";
+const y = 10;
+function O(s) {
+  return s && +s.getBoundingClientRect().width.toFixed(2);
+}
+function W(s) {
+  const o = Number(s.replace("px", ""));
+  return Number.isNaN(o) ? 0 : o;
+}
+const A = /* @__PURE__ */ V({
+  name: "MenuOverflowWrap",
+  setup(s, {
+    slots: o
+  }) {
+    const m = `${F().prefixCls}-overflow`, x = `${m}-sub-menu`, I = `${m}-hidden-menu-item`, C = `${m}-sub-menu-mirror`, f = w(), u = w(null), d = w();
+    function S() {
+      const n = f.value, M = O(n), l = [].slice.call(n.children);
+      let r = 0, e = 0, i = 0;
+      for (let c = 0; c < l.length; c++) {
+        const t = l[c], p = t.className.split(" "), a = p.indexOf(x) > -1, b = p.indexOf(C) > -1;
+        if (a)
+          continue;
+        const v = O(t) + W(N(t, "marginLeft")) + W(N(t, "marginRight"));
+        if (b) {
+          i = v;
+          continue;
+        }
+        if (e += v, e + i + y > M) {
+          u.value = r - 1;
+          return;
+        }
+        r++;
+      }
+      u.value = null;
+    }
+    return _(() => {
+      S(), d.value = new k((n) => {
+        n.forEach(S);
+      }), f.value && d.value.observe(f.value);
+    }), $(() => {
+      d.value && d.value.disconnect();
+    }), () => {
+      const n = (l, r) => {
+        const {
+          isMirror: e = !1,
+          props: i = {}
+        } = r || {};
+        return h(P, L({
+          key: `__arco-menu-overflow-sub-menu${e ? "-mirror" : ""}`,
+          class: e ? C : x,
+          _internalSkipCollect: !0
+        }, i), {
+          title: () => h("span", null, [E("...")]),
+          default: () => l
+        });
+      }, M = () => {
+        var t;
+        const l = ((t = o.default) == null ? void 0 : t.call(o)) || [], r = T(l);
+        let e = null;
+        const i = n(null, {
+          isMirror: !0
+        }), c = r.map((p, a) => {
+          const b = g(p, u.value !== null && a > u.value ? {
+            class: I
+          } : {
+            class: ""
+          });
+          if (u.value !== null && a === u.value + 1) {
+            const v = r.slice(a).map((R) => g(R, {
+              _internalSkipCollect: !0
+            }));
+            e = n(v);
+          }
+          return b;
+        });
+        return [i, ...c, e];
+      };
+      return h("div", {
+        class: `${m}-wrap`,
+        ref: f
+      }, [M()]);
+    };
+  }
+});
+export {
+  A as default
+};

package/dist/es/components/menu/sub-menu-inline.vue.js

@@ -0,0 +1,72 @@
+import $ from "./sub-menu-inline.vue2.js";
+import { resolveComponent as a, openBlock as r, createElementBlock as d, normalizeClass as n, createElementVNode as s, createVNode as t, Fragment as C, renderSlot as i, createTextVNode as p, toDisplayString as u, withCtx as v, withDirectives as b, vShow as k } from "vue";
+import w from "../../_virtual/_plugin-vue_export-helper.js";
+const y = ["tabindex", "aria-expanded", "aria-disabled"];
+function P(e, o, S, h, E, H) {
+  const m = a("MenuIndent"), f = a("ExpandTransition");
+  return r(), d("div", {
+    class: n(e.classNames)
+  }, [
+    s("div", {
+      class: n([
+        `${e.prefixCls}-header`,
+        {
+          [`${e.menuPrefixCls}-selected`]: e.isSelected,
+          [`${e.menuPrefixCls}-disabled`]: e.disabled,
+          [`${e.menuPrefixCls}-has-icon`]: e.$slots.icon
+        }
+      ]),
+      role: "menuitem",
+      tabindex: e.disabled ? -1 : 0,
+      "aria-haspopup": "true",
+      "aria-expanded": e.isOpen ? "true" : "false",
+      "aria-disabled": e.disabled ? "true" : void 0,
+      onClick: o[0] || (o[0] = (...l) => e.onHeaderClick && e.onHeaderClick(...l)),
+      onKeydown: o[1] || (o[1] = (...l) => e.onHeaderKeydown && e.onHeaderKeydown(...l))
+    }, [
+      t(m, { level: e.level }, null, 8, ["level"]),
+      e.$slots.icon ? (r(), d(C, { key: 0 }, [
+        s("span", {
+          class: n(`${e.menuPrefixCls}-icon`)
+        }, [
+          i(e.$slots, "icon")
+        ], 2),
+        s("span", {
+          class: n(`${e.menuPrefixCls}-title`)
+        }, [
+          i(e.$slots, "title", {}, () => [
+            p(u(e.title), 1)
+          ])
+        ], 2)
+      ], 64)) : i(e.$slots, "title", { key: 1 }, () => [
+        p(u(e.title), 1)
+      ]),
+      s("span", {
+        class: n([
+          `${e.menuPrefixCls}-icon-suffix`,
+          {
+            "is-open": e.isOpen
+          }
+        ])
+      }, [
+        i(e.$slots, "expand-icon-down")
+      ], 2)
+    ], 42, y),
+    t(f, null, {
+      default: v(() => [
+        b(s("div", {
+          class: n(`${e.prefixCls}-content`)
+        }, [
+          i(e.$slots, "default")
+        ], 2), [
+          [k, e.isOpen]
+        ])
+      ]),
+      _: 3
+    })
+  ], 2);
+}
+const M = /* @__PURE__ */ w($, [["render", P]]);
+export {
+  M as default
+};

package/dist/es/components/menu/sub-menu-inline.vue2.js

@@ -0,0 +1,50 @@
+import { defineComponent as c, computed as n } from "vue";
+import m from "./hooks/use-menu-context.js";
+import p from "./hooks/use-menu.js";
+import f from "./hooks/use-level.js";
+import C from "./indent.vue.js";
+import v from "../_components/transition/expand-transition.vue.js";
+const B = c({
+  name: "SubMenuInline",
+  components: {
+    MenuIndent: C,
+    ExpandTransition: v
+  },
+  props: {
+    title: {
+      type: String
+    },
+    isChildrenSelected: {
+      type: Boolean
+    },
+    disabled: {
+      type: Boolean
+    },
+    _internalSkipCollect: {
+      type: Boolean
+    }
+  },
+  setup(t) {
+    const { key: o } = p(), { level: i } = f({
+      provideNextLevel: !0
+    }), e = m(), u = n(() => e.prefixCls), r = n(() => `${u.value}-inline`), s = n(() => [r.value]), a = n(() => t.isChildrenSelected), d = n(() => (e.openKeys || []).indexOf(o.value) > -1);
+    return {
+      prefixCls: r,
+      menuPrefixCls: u,
+      classNames: s,
+      level: i,
+      disabled: n(() => t.disabled),
+      isSelected: a,
+      isOpen: d,
+      onHeaderClick: () => {
+        t.disabled || e.onSubMenuClick && e.onSubMenuClick(o.value, i.value);
+      },
+      onHeaderKeydown: (l) => {
+        t.disabled || (l.key === "Enter" || l.key === " ") && (l.preventDefault(), e.onSubMenuClick && e.onSubMenuClick(o.value, i.value));
+      }
+    };
+  }
+});
+export {
+  B as default
+};

package/dist/es/components/menu/sub-menu-pop.vue.js

@@ -0,0 +1,111 @@
+import $ from "./sub-menu-pop.vue2.js";
+import { resolveComponent as i, openBlock as d, createBlock as c, mergeProps as u, withCtx as o, createElementVNode as l, createVNode as r, createElementBlock as m, Fragment as k, normalizeClass as t, renderSlot as n, createTextVNode as f, toDisplayString as g, createCommentVNode as h, normalizeStyle as P, createSlots as v } from "vue";
+import w from "../../_virtual/_plugin-vue_export-helper.js";
+const I = ["aria-expanded", "aria-disabled", "tabindex"];
+function M(e, s, V, N, S, B) {
+  const C = i("MenuIndent"), p = i("RenderFunction"), b = i("Menu"), y = i("Trigger");
+  return d(), c(y, u({
+    trigger: "hover",
+    class: e.triggerClassNames,
+    position: e.needPopOnBottom ? "bl" : "rt",
+    "show-arrow": "",
+    "animation-class": "fade-in",
+    "mouse-enter-delay": 50,
+    "mouse-leave-delay": 50,
+    "popup-offset": 4,
+    "auto-fit-popup-min-width": !0,
+    duration: 100
+  }, e.triggerProps, {
+    disabled: e.disabled,
+    "unmount-on-close": !1,
+    "popup-visible": e.popVisible,
+    onPopupVisibleChange: e.onVisibleChange
+  }), {
+    content: o(() => [
+      r(b, {
+        "in-trigger": "",
+        "prefix-cls": `${e.className.block}-menu`,
+        "selected-keys": e.selectedKeys,
+        theme: e.menuContext.theme,
+        "trigger-props": e.menuContext.triggerProps,
+        style: P(e.popupMenuStyles),
+        onMenuItemClick: e.onMenuItemClick
+      }, v({
+        default: o(() => [
+          n(e.$slots, "default")
+        ]),
+        _: 2
+      }, [
+        e.menuContext.expandIconDown ? {
+          name: "expand-icon-down",
+          fn: o(() => [
+            r(p, {
+              "render-func": e.menuContext.expandIconDown
+            }, null, 8, ["render-func"])
+          ]),
+          key: "0"
+        } : void 0,
+        e.menuContext.expandIconRight ? {
+          name: "expand-icon-right",
+          fn: o(() => [
+            r(p, {
+              "render-func": e.menuContext.expandIconRight
+            }, null, 8, ["render-func"])
+          ]),
+          key: "1"
+        } : void 0
+      ]), 1032, ["prefix-cls", "selected-keys", "theme", "trigger-props", "style", "onMenuItemClick"])
+    ]),
+    default: o(() => [
+      l("div", u({
+        class: [
+          e.classNames,
+          {
+            [`${e.menuPrefixCls}-disabled`]: e.disabled,
+            [`${e.menuPrefixCls}-has-icon`]: e.$slots.icon
+          }
+        ],
+        role: "menuitem",
+        "aria-haspopup": "true",
+        "aria-expanded": e.popVisible ? "true" : "false",
+        "aria-disabled": e.disabled ? "true" : void 0,
+        tabindex: e.disabled ? -1 : 0
+      }, e.$attrs, {
+        onClick: s[0] || (s[0] = (...a) => e.onClick && e.onClick(...a)),
+        onKeydown: s[1] || (s[1] = (...a) => e.onKeydown && e.onKeydown(...a))
+      }), [
+        r(C, { level: e.level }, null, 8, ["level"]),
+        e.$slots.icon ? (d(), m(k, { key: 0 }, [
+          l("span", {
+            class: t(`${e.menuPrefixCls}-icon`)
+          }, [
+            n(e.$slots, "icon")
+          ], 2),
+          l("span", {
+            class: t(`${e.menuPrefixCls}-title`)
+          }, [
+            n(e.$slots, "title", {}, () => [
+              f(g(e.title), 1)
+            ])
+          ], 2)
+        ], 64)) : n(e.$slots, "title", { key: 1 }, () => [
+          f(g(e.title), 1)
+        ]),
+        l("span", {
+          class: t(`${e.menuPrefixCls}-icon-suffix`)
+        }, [
+          e.needPopOnBottom ? n(e.$slots, "expand-icon-down", { key: 0 }) : n(e.$slots, "expand-icon-right", { key: 1 })
+        ], 2),
+        e.isSelected && e.mode === "horizontal" ? (d(), m("div", {
+          key: 2,
+          class: t(`${e.menuPrefixCls}-selected-label`)
+        }, null, 2)) : h("", !0)
+      ], 16, I)
+    ]),
+    _: 3
+  }, 16, ["class", "position", "disabled", "popup-visible", "onPopupVisibleChange"]);
+}
+const D = /* @__PURE__ */ w($, [["render", M]]);
+export {
+  D as default
+};

package/dist/es/components/menu/sub-menu-pop.vue2.js

@@ -0,0 +1,99 @@
+import { defineComponent as S, toRefs as B, computed as o, ref as P } from "vue";
+import { Trigger as $ } from "../trigger/index.js";
+import H from "./base-menu.vue.js";
+import N from "./hooks/use-menu.js";
+import I from "./hooks/use-level.js";
+import { omit as K } from "../../_utils/omit.js";
+import V from "./indent.vue.js";
+import _ from "./hooks/use-menu-context.js";
+import R from "../../_container/render-function.js";
+import { isNumber as T } from "../../_utils/is.js";
+import { getClassNameMixin as w } from "../../_utils/config.js";
+const Q = S({
+  name: "SubMenuPop",
+  components: {
+    Menu: H,
+    Trigger: $,
+    MenuIndent: V,
+    RenderFunction: R
+  },
+  inheritAttrs: !1,
+  props: {
+    title: {
+      type: String
+    },
+    selectable: {
+      type: Boolean
+    },
+    disabled: {
+      type: Boolean
+    },
+    isChildrenSelected: {
+      type: Boolean
+    },
+    popupMaxHeight: {
+      type: [Boolean, Number],
+      default: void 0
+    },
+    _internalSkipCollect: {
+      type: Boolean
+    }
+  },
+  setup(g) {
+    const { key: l } = N(), { level: i } = I(), { selectable: a, disabled: u, isChildrenSelected: C, popupMaxHeight: x } = B(g), t = _(), { onSubMenuClick: r, onMenuItemClick: n } = t, p = o(() => t.prefixCls), m = o(() => t.mode), c = o(() => t.selectedKeys || []), s = o(() => `${p.value}-pop`), f = o(
+      () => a.value && c.value.includes(l.value) || C.value
+    ), M = o(() => [
+      `${s.value}`,
+      `${s.value}-header`,
+      {
+        [`${p.value}-selected`]: f.value
+      }
+    ]), h = o(() => m.value === "horizontal" && !t.inTrigger), v = P(!1), d = (e) => {
+      v.value = e;
+    }, y = w("trigger"), b = o(() => {
+      var e;
+      return [
+        `${s.value}-trigger`,
+        {
+          [`${s.value}-trigger-dark`]: t.theme === "dark"
+        },
+        // @ts-ignore
+        (e = t.triggerProps) == null ? void 0 : e.class
+      ];
+    }), k = o(() => K(t.triggerProps || {}, ["class"]));
+    return {
+      menuPrefixCls: p,
+      mode: m,
+      level: i,
+      classNames: M,
+      isSelected: f,
+      disabled: u,
+      selectedKeys: c,
+      needPopOnBottom: h,
+      popVisible: v,
+      className: y,
+      triggerClassNames: b,
+      triggerProps: k,
+      menuContext: t,
+      popupMenuStyles: o(() => {
+        const e = x.value ?? t.popupMaxHeight;
+        return T(e) ? { maxHeight: `${e}px` } : e ? {} : { maxHeight: "unset" };
+      }),
+      onClick: () => {
+        u.value || (r && r(l.value, i.value), a.value && n && n(l.value));
+      },
+      onKeydown: (e) => {
+        u.value || (e.key === "Enter" || e.key === " ") && (e.preventDefault(), r && r(l.value, i.value), a.value && n && n(l.value));
+      },
+      onMenuItemClick: (e) => {
+        n && n(e), d(!1);
+      },
+      onVisibleChange: (e) => {
+        d(e);
+      }
+    };
+  }
+});
+export {
+  Q as default
+};

package/dist/es/components/message/index.js

@@ -0,0 +1,8 @@
+import e from "./message.vue.js";
+import { generateComponent as o } from "../../_utils/vue-eco.js";
+import { getComponentPrefix as t } from "../../_utils/config.js";
+const a = o(t("Message"), e);
+export {
+  a as Message,
+  a as default
+};

package/dist/es/components/message/message-list.js

@@ -0,0 +1,70 @@
+import { defineComponent as n, h as r, TransitionGroup as d, createVNode as l } from "vue";
+import u from "./message.vue.js";
+import p from "../../_hooks/use-popup-manager.js";
+import { getClassNameMixin as f } from "../../_utils/config.js";
+const y = /* @__PURE__ */ n({
+  name: "XMessageList",
+  props: {
+    messages: {
+      type: Array,
+      default: () => []
+    },
+    position: {
+      type: String,
+      default: "top"
+    },
+    offset: {
+      type: Number,
+      default: 20
+    },
+    renderToBody: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  emits: {
+    close: (s) => !0,
+    afterClose: () => !0
+  },
+  setup(s, {
+    emit: a
+  }) {
+    const o = f("message-list"), {
+      zIndex: t
+    } = p("message", {
+      runOnMounted: !0
+    });
+    return () => r(d, {
+      tag: "div",
+      name: "x-message-fade",
+      class: [o.block, o.modifier(s.position), {
+        [o.modifier("local")]: !s.renderToBody
+      }],
+      style: {
+        zIndex: t.value,
+        [s.position]: `${s.offset}px`
+      },
+      onAfterLeave: () => a("afterClose")
+    }, {
+      default: () => s.messages.map((e) => l(u, {
+        key: e.id,
+        id: e.id,
+        message: e.message,
+        type: e.type,
+        duration: e.duration,
+        center: e.center,
+        showClose: e.showClose,
+        showIcon: e.showIcon,
+        useHTML: e.useHTML,
+        popupClass: e.popupClass,
+        icon: e.icon,
+        resetOnHover: e.resetOnHover,
+        resetOnUpdate: e.resetOnUpdate,
+        onClose: () => a("close", e.id)
+      }, null))
+    });
+  }
+});
+export {
+  y as default
+};

package/dist/es/components/message/message.vue.js

@@ -0,0 +1,54 @@
+import h from "./message.vue2.js";
+import { resolveComponent as n, withDirectives as v, openBlock as o, createElementBlock as s, normalizeStyle as F, normalizeClass as r, renderSlot as c, createBlock as l, resolveDynamicComponent as g, Fragment as w, createCommentVNode as a, createElementVNode as L, toDisplayString as $, withModifiers as m, withCtx as E, createVNode as I, vShow as b } from "vue";
+import H from "../../_virtual/_plugin-vue_export-helper.js";
+const D = ["innerHTML"], S = { key: 1 };
+function B(e, i, N, T, V, z) {
+  const p = n("CheckCircleFill"), d = n("ExclamationCircleFill"), C = n("MinusCircleFill"), u = n("CloseCircleFill"), y = n("AnimationLoading"), k = n("InfoCircleFill"), M = n("Close"), f = n("IconHover");
+  return v((o(), s("div", {
+    role: "alert",
+    class: r(e.cls),
+    style: F(e.styles),
+    onMouseenter: i[0] || (i[0] = (...t) => e.handleMouseEnter && e.handleMouseEnter(...t)),
+    onMouseleave: i[1] || (i[1] = (...t) => e.handleMouseLeave && e.handleMouseLeave(...t))
+  }, [
+    e.hasIcon || e.$slots.icon ? (o(), s("span", {
+      key: 0,
+      class: r([e.cn.element("icon"), e.cn.modifier(`icon-${e.type}`)])
+    }, [
+      c(e.$slots, "icon", {}, () => [
+        e.hasCustomIcon ? (o(), l(g(e.iconRender), { key: 0 })) : (o(), s(w, { key: 1 }, [
+          e.type === "success" ? (o(), l(p, { key: 0 })) : e.type === "warning" ? (o(), l(d, { key: 1 })) : e.type === "strong" ? (o(), l(C, { key: 2 })) : e.type === "error" ? (o(), l(u, { key: 3 })) : e.type === "loading" ? (o(), l(y, { key: 4 })) : e.type === "info" ? (o(), l(k, { key: 5 })) : a("", !0)
+        ], 64))
+      ])
+    ], 2)) : a("", !0),
+    L("span", {
+      class: r(e.cn.element("content"))
+    }, [
+      c(e.$slots, "default", {}, () => [
+        e.useHTML ? (o(), s("span", {
+          key: 0,
+          innerHTML: e.message
+        }, null, 8, D)) : (o(), s("span", S, $(e.message), 1))
+      ])
+    ], 2),
+    e.showClose ? (o(), l(f, {
+      key: 1,
+      as: "button",
+      class: r(e.cn.element("close-icon")),
+      "aria-label": e.closeLabel,
+      onClick: m(e.handleClose, ["stop"]),
+      onMousedown: m(e.handleCloseMouseDown, ["stop"])
+    }, {
+      default: E(() => [
+        I(M)
+      ]),
+      _: 1
+    }, 8, ["class", "aria-label", "onClick", "onMousedown"])) : a("", !0)
+  ], 38)), [
+    [b, e.visible]
+  ]);
+}
+const q = /* @__PURE__ */ H(h, [["render", B]]);
+export {
+  q as default
+};