@extclp/vexip-ui/es/components/notice/index.mjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

var C = Object.defineProperty;
var x = (c, e, t) => e in c ? C(c, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : c[e] = t;
var r = (c, e, t) => x(c, typeof e != "symbol" ? e + "" : e, t);
import { render as y, createApp as I, createVNode as N, markRaw as T } from "vue";
import "./notice.vue.mjs";
import { unrefElement as k, proxyExposed as L } from "@vexip-ui/hooks";
import { toNumber as O, isNull as j, destroyObject as F, isClient as p, noop as $, isObject as D } from "@vexip-ui/utils";
import E from "./notice.vue2.mjs";
const A = [
  "top-right",
  "top-left",
  "bottom-right",
  "bottom-left"
];
let P = 1;
function K() {
  return `notice-${P++}`;
}
class h {
  constructor(e = {}) {
    r(this, "name");
    r(this, "defaults");
    r(this, "open");
    r(this, "primary");
    r(this, "info");
    r(this, "success");
    r(this, "warning");
    r(this, "error");
    r(this, "_mountedApp");
    r(this, "_instance");
    r(this, "_innerApp");
    r(this, "_container");
    r(this, "_wrapper");
    r(this, "_mountedEl");
    e = {
      ...e,
      marker: !!e.marker,
      duration: e.duration ? O(e.duration) : 4e3
    }, this._mountedApp = null, this._instance = null, this._innerApp = null, this._container = null, this._wrapper = null, this._mountedEl = null, this.name = "Notice", this.defaults = {}, this.config(e), this.open = (t, n, i) => this._open(null, t, n, i), this.primary = (t, n, i) => this._open("primary", t, n, i), this.info = (t, n, i) => this._open("info", t, n, i), this.success = (t, n, i) => this._open("success", t, n, i), this.warning = (t, n, i) => this._open("warning", t, n, i), this.error = (t, n, i) => this._open("error", t, n, i);
  }
  judge(e, t, n, i) {
    e ? this.success(t, i) : this.error(n, i);
  }
  close(e) {
    var t;
    j(e) ? this.clear() : (t = this._getInstance()) == null || t.remove(e);
  }
  config({ placement: e, ...t }) {
    var n;
    e && ((n = this._getInstance()) == null || n.config({
      placement: A.includes(e) ? e : A[0]
    })), this.defaults = { ...this.defaults, ...t };
  }
  clone() {
    const e = new h(this.defaults);
    return e._mountedApp = this._mountedApp, e;
  }
  clear() {
    var e;
    (e = this._getInstance()) == null || e.clear();
  }
  destroy() {
    var e, t;
    this._mountedEl && ((e = this._wrapper) == null || e.removeChild(this._mountedEl)), (t = this._innerApp) == null || t.unmount(), this._container && y(null, this._container), F(this);
  }
  isDestroyed() {
    return !1;
  }
  install(e, t = {}) {
    const { property: n, ...i } = t;
    this.config(i), this._mountedApp = e, (n || !e.config.globalProperties.$notice) && (e.config.globalProperties[n || "$notice"] = this);
  }
  transferTo(e) {
    if (!p) return;
    const t = k(e);
    t && (this._wrapper = t, this._instance ? this._mountedEl && this._wrapper.appendChild(this._mountedEl) : this._getInstance());
  }
  _getInstance() {
    if (!this._instance && p) {
      if (!this._mountedApp)
        console.warn("[vexip-ui:Notice]: App missing, the plugin maybe not installed."), this._container = document.createElement("div"), this._innerApp = I(E), this._instance = this._innerApp.mount(this._container);
      else {
        const e = N(E, null, null);
        this._container = document.createElement("div"), e.appContext = this._mountedApp._context, y(e, this._container), this._instance = L(e);
      }
      this._mountedEl = this._container.firstElementChild, (this._wrapper || document.body).appendChild(this._mountedEl);
    }
    return this._instance;
  }
  _open(e, t, n, i) {
    if (!p)
      return $;
    let s;
    D(t) ? s = t : typeof n == "number" ? s = { title: t, duration: n } : n ? s = { title: t, content: n, duration: i } : s = { title: t, duration: i };
    const l = s.key ?? K(), a = this._getInstance();
    let u;
    const m = s.onClose, v = () => {
      if (clearTimeout(u), typeof m == "function")
        return m();
    }, f = s.onEnter, w = () => {
      if (s.liveOnEnter && clearTimeout(u), typeof f == "function")
        return f();
    }, _ = s.onLeave, b = () => {
      if (s.liveOnEnter && (clearTimeout(u), d()), typeof _ == "function")
        return _();
    }, o = {
      ...this.defaults,
      ...s,
      key: l,
      type: e ?? s.type,
      onClose: v,
      onEnter: w,
      onLeave: b
    };
    o.icon && typeof o.icon != "function" && (o.icon = T(o.icon)), a.add(o), d();
    function d() {
      const g = typeof o.duration == "number" ? o.duration : 4e3;
      g >= 500 && (u = setTimeout(() => {
        a.remove(l);
      }, g));
    }
    return () => {
      clearTimeout(u), a.remove(l);
    };
  }
}
const G = new h();
export {
  G as Notice,
  h as NoticeManager
};
//# sourceMappingURL=index.mjs.map