x-next 1.0.1 → 1.1.0

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

@@ -0,0 +1,142 @@
+import { defineComponent as v, computed as t, ref as b, onMounted as M, onUpdated as B, onUnmounted as I } from "vue";
+import { getComponentPrefix as p, getClassNameMixin as w } from "../../_utils/config.js";
+import F from "../_components/icon-hover/index.vue.js";
+import N from "../../icons/default/close-circle-fill.js";
+import x from "../../icons/default/close.js";
+import L from "../../icons/default/check-circle-fill.js";
+import O from "../../icons/default/exclamation-circle-fill.js";
+import H from "../../icons/default/info-circle-fill.js";
+import S from "../../icons/default/minus-circle-fill.js";
+import T from "../../icons/animation/animation-loading.js";
+import { useLocale as U } from "../../locale/index.js";
+const J = v({
+  name: p("Message"),
+  components: {
+    IconHover: F,
+    Close: x,
+    CloseCircleFill: N,
+    CheckCircleFill: L,
+    ExclamationCircleFill: O,
+    InfoCircleFill: H,
+    MinusCircleFill: S,
+    AnimationLoading: T
+  },
+  props: {
+    id: {
+      type: [String, Number],
+      default: ""
+    },
+    message: {
+      type: [String, Number, Object],
+      default: ""
+    },
+    type: {
+      type: String,
+      default: "success"
+    },
+    duration: {
+      type: Number,
+      default: 3e3
+    },
+    center: {
+      type: Boolean,
+      default: !1
+    },
+    onClose: {
+      type: Function,
+      default: () => {
+      }
+    },
+    offset: {
+      type: Number,
+      default: 20
+    },
+    zIndex: {
+      type: Number,
+      default: 0
+    },
+    showClose: {
+      type: Boolean,
+      default: !1
+    },
+    showIcon: {
+      type: Boolean,
+      default: !0
+    },
+    icon: Function,
+    useHTML: Boolean,
+    popupClass: {
+      type: String,
+      default: void 0
+    },
+    position: {
+      type: String,
+      default: "top"
+    },
+    resetOnHover: {
+      type: Boolean,
+      default: !1
+    },
+    resetOnUpdate: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  setup(e) {
+    const o = w("message"), { t: u } = U(), m = t(() => [
+      o.block,
+      o.modifier(e.type),
+      e.center && o.modifier("center"),
+      e.showClose && !e.center && o.element("show-close"),
+      e.popupClass && e.popupClass
+    ]), i = b(!1);
+    let n = null;
+    const l = () => {
+      n && (clearTimeout(n), n = null);
+    }, s = () => {
+      l(), e.duration > 0 && (n = setTimeout(() => {
+        c();
+      }, e.duration));
+    };
+    M(() => {
+      i.value = !0, s();
+    }), B(() => {
+      e.resetOnUpdate && s();
+    }), I(() => {
+      l();
+    });
+    const f = t(() => ({
+      top: `${e.offset}px`
+    })), c = () => {
+      var a;
+      l(), i.value = !1, (a = e.onClose) == null || a.call(e, e.id);
+    }, d = () => {
+      e.resetOnHover && l();
+    }, C = () => {
+      e.resetOnHover && s();
+    }, y = t(
+      () => e.showIcon && (e.type !== "normal" || !!e.icon)
+    ), r = t(() => e.icon), h = t(() => !!r.value), g = t(
+      () => u("message.closeLabel", { id: e.id ? ` ${e.id}` : "" })
+    );
+    return {
+      cn: o,
+      cls: m,
+      styles: f,
+      visible: i,
+      hasIcon: y,
+      iconRender: r,
+      hasCustomIcon: h,
+      handleClose: c,
+      handleMouseEnter: d,
+      handleMouseLeave: C,
+      handleCloseMouseDown: (a) => {
+        a.preventDefault();
+      },
+      closeLabel: g
+    };
+  }
+});
+export {
+  J as default
+};

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

@@ -0,0 +1,12 @@
+const s = [
+  "success",
+  "warning",
+  "error",
+  "strong",
+  "info",
+  "loading",
+  "normal"
+];
+export {
+  s as messageTypes
+};

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

@@ -0,0 +1,144 @@
+var p = Object.defineProperty;
+var C = (t, e, s) => e in t ? p(t, e, { enumerable: !0, configurable: !0, writable: !0, value: s }) : t[e] = s;
+var r = (t, e, s) => C(t, typeof e != "symbol" ? e + "" : e, s);
+import { isVNode as m, reactive as l, createVNode as y, render as h } from "vue";
+import { NOOP as x, getElement as v } from "../../_utils/dom.js";
+import { isString as M, isNumber as T, isFunction as w, isObject as O } from "../../_utils/is.js";
+import { messageTypes as u } from "./props.js";
+import _ from "./message-list.js";
+const g = () => typeof window < "u" && typeof document < "u", b = {
+  close: x
+}, c = /* @__PURE__ */ new WeakMap(), d = /* @__PURE__ */ new Set(), B = (t) => t.message ?? t.content ?? "", E = (t) => M(t) || T(t) || m(t) || w(t) ? {
+  message: t
+} : t, N = (t) => {
+  const e = v(t || "body");
+  return e || document.body;
+}, f = (t, e = t.type ?? "info", s) => ({
+  id: s,
+  message: B(t),
+  type: e,
+  duration: t.duration ?? 3e3,
+  center: t.center ?? !1,
+  offset: t.offset ?? 20,
+  showClose: t.showClose ?? t.closable ?? !1,
+  showIcon: t.showIcon ?? (e !== "normal" || !!t.icon),
+  icon: t.icon,
+  useHTML: t.useHTML ?? !1,
+  popupClass: t.popupClass,
+  position: t.position ?? "top",
+  resetOnHover: t.resetOnHover ?? !1,
+  onClose: t.onClose
+});
+class H {
+  constructor(e, s, n) {
+    r(this, "messages", l([]));
+    r(this, "ids", /* @__PURE__ */ new Set());
+    r(this, "container");
+    r(this, "renderTo");
+    r(this, "position");
+    r(this, "renderToBody");
+    r(this, "appContext");
+    r(this, "messageCount", 0);
+    r(this, "remove", (e) => {
+      var o;
+      const s = this.messages.findIndex((a) => a.id === e);
+      if (s < 0)
+        return;
+      const [n] = this.messages.splice(s, 1);
+      this.ids.delete(e), (o = n.onClose) == null || o.call(n, e), this.render();
+    });
+    r(this, "destroy", () => {
+      if (this.messages.length > 0)
+        return;
+      h(null, this.container), this.container.remove();
+      const e = c.get(this.renderTo);
+      e && delete e[this.position], d.delete(this);
+    });
+    this.renderTo = e, this.position = s, this.appContext = n ?? null, this.renderToBody = e.tagName === "BODY", this.container = document.createElement("div"), d.add(this), this.mountContainer(), this.render();
+  }
+  mountContainer() {
+    if (this.renderTo.tagName !== "BODY") {
+      const e = window.getComputedStyle(this.renderTo).position;
+      (!e || e === "static") && (this.renderTo.style.position = "relative");
+    }
+    this.renderTo.appendChild(this.container);
+  }
+  render() {
+    var n;
+    const e = y(_, {
+      messages: this.messages,
+      position: this.position,
+      offset: ((n = this.messages[0]) == null ? void 0 : n.offset) ?? 20,
+      renderToBody: this.renderToBody,
+      onClose: this.remove,
+      onAfterClose: this.destroy
+    }), s = this.appContext ?? i._context ?? null;
+    s && (e.appContext = s), h(e, this.container);
+  }
+  add(e, s) {
+    this.messageCount += 1;
+    const n = e.id ?? `__x_message_${this.position}_${this.messageCount}`;
+    if (this.ids.has(n))
+      return this.update(n, e, s);
+    const o = l(f(e, s, n));
+    return this.messages.push(o), this.ids.add(n), this.render(), {
+      close: () => this.remove(n)
+    };
+  }
+  update(e, s, n) {
+    const o = this.messages.findIndex((a) => a.id === e);
+    if (o >= 0) {
+      const a = this.messages[o];
+      Object.assign(a, f(s, n ?? a.type, e), {
+        resetOnUpdate: s.duration !== void 0
+      }), this.render();
+    }
+    return {
+      close: () => this.remove(e)
+    };
+  }
+  clear() {
+    this.messages.splice(0).forEach((s) => {
+      var n;
+      this.ids.delete(s.id), (n = s.onClose) == null || n.call(s, s.id);
+    }), this.render();
+  }
+}
+const S = (t, e, s) => {
+  let n = c.get(t);
+  return n || (n = {}, c.set(t, n)), n[e] || (n[e] = new H(t, e, s)), n[e];
+}, i = ((t, e) => {
+  if (!g())
+    return b;
+  const s = E(t), n = N(s.renderTo), o = s.position ?? "top";
+  return S(n, o, e).add(s, s.type);
+});
+u.forEach((t) => {
+  i[t] = (e, s) => {
+    const n = O(e) && !m(e) ? e : { message: e };
+    return i(
+      {
+        type: t,
+        ...n
+      },
+      s
+    );
+  };
+});
+i.clear = (t) => {
+  g() && Array.from(d).forEach((e) => {
+    (!t || e.position === t) && e.clear();
+  });
+};
+i.install = (t) => {
+  const e = {
+    clear: i.clear
+  };
+  u.forEach((s) => {
+    e[s] = (n, o = t._context) => i[s](n, o);
+  }), t.config.globalProperties.$message = e;
+};
+i._context = null;
+export {
+  i as default
+};

package/dist/es/components/message-box/MessageBox.js

@@ -0,0 +1,180 @@
+import { reactive as S, createVNode as l, render as z, isVNode as g, Fragment as B, createTextVNode as C } from "vue";
+import { getLocaleMessage as v } from "../../locale/index.js";
+import { Dialog as x } from "../dialog/index.js";
+import { Button as E } from "../button/index.js";
+import { Space as O } from "../space/index.js";
+import _ from "../../icons/default/close-circle-fill.js";
+import D from "../../icons/default/check-circle-fill.js";
+import I from "../../icons/default/exclamation-circle-fill.js";
+import R from "../../icons/default/info-circle-fill.js";
+import U from "../../icons/default/minus-circle-fill.js";
+import { isClient as H, isFunction as a } from "../../_utils/is.js";
+import { NOOP as N, getElement as L } from "../../_utils/dom.js";
+import { messageBoxStaticMethods as P } from "./props.js";
+import { getClassNameMixin as $ } from "../../_utils/config.js";
+function V(c) {
+  return typeof c == "function" || Object.prototype.toString.call(c) === "[object Object]" && !g(c);
+}
+const k = $("message-box"), b = [], q = {
+  close: N,
+  update: N
+}, j = (c) => L(c || "body") ?? document.body, y = (c) => {
+  if (!H())
+    return q;
+  const e = S({
+    ...c
+  }), d = document.createElement("div"), f = () => {
+    z(null, d);
+    const o = b.indexOf(T);
+    o >= 0 && b.splice(o, 1);
+  }, u = (o) => {
+    if (o === "cancel")
+      return e.beforeOnCancel ? e.beforeOnCancel() : !0;
+    if (o === "ok")
+      return e.beforeOnOk ? e.beforeOnOk() : !0;
+  }, s = (o, t) => {
+    o === "cancel" && e.onCancel && e.onCancel(t), o === "ok" && e.onOk && e.onOk(t);
+  }, p = (o) => {
+    let t;
+    switch (o) {
+      case "warning":
+        t = l(I, {
+          size: "22px"
+        }, null);
+        break;
+      case "strong":
+        t = l(U, {
+          size: "22px"
+        }, null);
+        break;
+      case "error":
+        t = l(_, {
+          size: "22px"
+        }, null);
+        break;
+      case "success":
+        t = l(D, {
+          size: "22px"
+        }, null);
+        break;
+      case "info":
+        t = l(R, {
+          size: "22px"
+        }, null);
+        break;
+    }
+    return l("div", {
+      class: [k.element("icon"), k.modifier(`icon-${o}`)]
+    }, [t]);
+  }, m = (o) => g(o) ? o : a(o) ? o() : l("div", {
+    class: k.element("title")
+  }, [C(" "), o, C(" ")]), i = (o) => g(o) ? o : a(o) ? o() : l("div", {
+    class: k.element("content")
+  }, [C(" "), o, C(" ")]), h = () => () => l(B, null, [p(e.type || "success"), e.title && m(e.title)]), r = () => () => l(B, null, [e.content && i(e.content)]), A = (o) => {
+    if (e.footer === !1)
+      return;
+    if (g(e.footer)) return e.footer;
+    if (a(e.footer))
+      return e.footer(o);
+    const t = (e == null ? void 0 : e.cancelText) || v("dialog.cancelText"), F = (e == null ? void 0 : e.okText) || v("dialog.okText");
+    return l(O, {
+      size: 12
+    }, {
+      default: () => {
+        var M, w;
+        return [!e.hideCancel && l(E, {
+          size: "small",
+          onClick: o.cancel,
+          loading: (M = o.loadingObj) == null ? void 0 : M.cancel
+        }, V(t) ? t : {
+          default: () => [t]
+        }), !e.hideOk && l(E, {
+          type: "primary",
+          size: "small",
+          onClick: o.ok,
+          loading: (w = o.loadingObj) == null ? void 0 : w.ok
+        }, V(F) ? F : {
+          default: () => [F]
+        })];
+      }
+    });
+  }, n = l(x, {
+    messageBox: !0,
+    width: (e == null ? void 0 : e.width) ?? 360,
+    height: (e == null ? void 0 : e.height) ?? "auto",
+    modelValue: !0,
+    renderTo: j(e == null ? void 0 : e.renderTo),
+    center: e != null && e.top ? !1 : (e == null ? void 0 : e.center) ?? !0,
+    top: (e == null ? void 0 : e.top) ?? 0,
+    mask: (e == null ? void 0 : e.mask) ?? !0,
+    maskToClose: (e == null ? void 0 : e.maskToClose) ?? !1,
+    popupClass: e.popupClass,
+    showClose: e.closable ?? !0,
+    hideFooter: e.footer === !1,
+    onClose: s,
+    onBeforeCancel: u,
+    "onUpdate:modelValue": () => {
+      n.component.props.modelValue = !1;
+    },
+    // 等待动画完全结束后销毁vm
+    onClosed: f,
+    onOpened: () => {
+    }
+  }, {
+    title: h(),
+    default: r(),
+    footer: A
+  });
+  z(n, d);
+  const T = {
+    close() {
+      n.component && (n.component.props.modelValue = !1);
+    },
+    update(o) {
+      Object.assign(e, o), n.component && (o.width !== void 0 && (n.component.props.width = o.width), o.height !== void 0 && (n.component.props.height = o.height), o.top !== void 0 && (n.component.props.top = o.top), o.renderTo !== void 0 && (n.component.props.renderTo = j(o.renderTo)), o.center !== void 0 && (n.component.props.center = o.center), o.mask !== void 0 && (n.component.props.mask = o.mask), o.maskToClose !== void 0 && (n.component.props.maskToClose = o.maskToClose), o.popupClass !== void 0 && (n.component.props.popupClass = o.popupClass), o.closable !== void 0 && (n.component.props.showClose = o.closable), o.footer !== void 0 && (n.component.props.hideFooter = o.footer === !1));
+    }
+  };
+  return b.push(T), T;
+}, G = () => {
+  P.forEach((c) => {
+    y[c] = (e, d) => {
+      const f = [], u = [], s = [];
+      let p = () => !0, m = () => !0, i, h = !1;
+      return setTimeout(() => {
+        h || (i = y({
+          title: e,
+          content: d,
+          type: c,
+          beforeOnCancel: m,
+          beforeOnOk: p,
+          onOk: () => {
+            f.forEach((r) => a(r) && r());
+          },
+          onCancel: () => {
+            u.forEach((r) => a(r) && r());
+          }
+        }), s.forEach((r) => i == null ? void 0 : i.update(r)), s.length = 0);
+      }, 0), {
+        close() {
+          i ? i.close() : (h = !0, s.length = 0);
+        },
+        update(r) {
+          return i ? i.update(r) : s.push(r), this;
+        },
+        ok(...r) {
+          return r.length === 1 && f.push(r[0]), r.length === 2 && (p = r[0], f.push(r[1])), this;
+        },
+        cancel(...r) {
+          return r.length === 1 && u.push(r[0]), r.length === 2 && (m = r[0], u.push(r[1])), this;
+        }
+      };
+    };
+  });
+};
+G();
+y.destroyAll = () => {
+  [...b].forEach((c) => c.close());
+};
+export {
+  y as default
+};

package/dist/es/components/message-box/props.js

@@ -0,0 +1,4 @@
+const s = ["info", "success", "warning", "strong", "error"];
+export {
+  s as messageBoxStaticMethods
+};

package/dist/es/components/message-box/warp.js

@@ -0,0 +1,4 @@
+import o from "./MessageBox.js";
+export {
+  o as default
+};

package/dist/es/components/network/Network.vue.js

@@ -0,0 +1,60 @@
+import d from "./Network.vue2.js";
+import { openBlock as s, createElementBlock as r, normalizeClass as a, renderSlot as u, createElementVNode as l, Fragment as p, renderList as g, normalizeStyle as S, toDisplayString as i, createCommentVNode as m } from "vue";
+import y from "../../_virtual/_plugin-vue_export-helper.js";
+const f = ["aria-label", "aria-live", "title"];
+function c(e, t, v, N, h, k) {
+  return s(), r("div", {
+    class: a(e.cls),
+    role: "status",
+    "aria-label": e.mergedAriaLabel,
+    "aria-live": e.ariaLive,
+    title: e.showTooltip ? e.mergedAriaLabel : void 0
+  }, [
+    u(e.$slots, "default", {
+      status: e.mergedStatus,
+      quality: e.mergedStatus.quality,
+      online: e.mergedStatus.online,
+      latency: e.mergedStatus.latency,
+      downloadSpeed: e.mergedStatus.downloadSpeed,
+      speedSource: e.mergedStatus.speedSource,
+      source: e.mergedStatus.source,
+      reason: e.mergedStatus.reason,
+      refresh: e.refresh
+    }, () => [
+      l("div", {
+        class: a(e.className.element("signal")),
+        "aria-hidden": "true"
+      }, [
+        (s(!0), r(p, null, g(e.lineItems, (o, n) => (s(), r("div", {
+          key: n,
+          class: a([
+            e.className.element("signal--item"),
+            o.active && e.className.is("active")
+          ]),
+          style: S({
+            height: `${100 / e.lineItems.length * (n + 1)}%`,
+            "--x-network-line-color": o.color
+          })
+        }, [...t[0] || (t[0] = [
+          l("i", null, null, -1)
+        ])], 6))), 128))
+      ], 2),
+      e.mergedShowMetrics ? (s(), r("span", {
+        key: 0,
+        class: a(e.className.element("metrics"))
+      }, [
+        e.mergedStatus.latency !== void 0 ? (s(), r("span", {
+          key: 0,
+          class: a(e.className.element("latency"))
+        }, i(e.mergedStatus.latency) + "ms ", 3)) : m("", !0),
+        l("span", {
+          class: a(e.className.element("speed"))
+        }, i(e.formattedDownloadSpeed), 3)
+      ], 2)) : m("", !0)
+    ])
+  ], 10, f);
+}
+const L = /* @__PURE__ */ y(d, [["render", c]]);
+export {
+  L as default
+};