UNPKG

@byloth/vuert

Version:

The headless alerts, modals, notifications & popups library for Vue.js craftsmen. ℹ

220 lines (219 loc) 7.74 kB
var T = Object.defineProperty; var D = (t, e, i) => e in t ? T(t, e, { enumerable: !0, configurable: !0, writable: !0, value: i }) : t[e] = i; var s = (t, e, i) => D(t, typeof e != "symbol" ? e + "" : e, i); import { ref as y, computed as A, getCurrentScope as C, inject as j, defineComponent as E, shallowRef as F, onMounted as I, onBeforeUnmount as N, openBlock as S, createBlock as V, resolveDynamicComponent as k, withCtx as U, renderSlot as $, createCommentVNode as P, nextTick as R } from "vue"; import { RuntimeException as h, ValueException as m, DeferredPromise as B, Publisher as q, delay as _ } from "@byloth/core"; const w = { $vuert: Symbol("[vuert]: vuert") }; class H extends h { constructor(i, n, o, u = "AlertThrottledException") { n === void 0 && (n = "The alert has been throttled to prevent spamming the user with too many alerts."); super(n, o, u); s(this, "alert"); this.alert = i; } } class g { constructor(e) { s(this, "id"); s(this, "type"); s(this, "icon"); s(this, "label"); s(this, "callback"); this.id = e.id ?? Symbol(), this.type = e.type ?? "secondary", this.icon = e.icon, this.label = e.label, this.callback = e.callback ?? (() => e.value); } } class c { constructor(e) { s(this, "id"); s(this, "type"); s(this, "priority"); s(this, "icon"); s(this, "title"); s(this, "message"); s(this, "payload"); s(this, "actions"); s(this, "dismissible"); s(this, "timeout"); var i; if (this.id = e.id ?? Symbol(), this.type = e.type ?? "info", this.priority = e.priority ?? "normal", this.icon = e.icon, this.title = e.title, e.message !== void 0 && e.component !== void 0) throw new m("The `message` and `component` properties cannot both be valued at the same time."); if (this.message = e.message, this.payload = e.payload, this.actions = ((i = e.actions) == null ? void 0 : i.map((n) => new g(n))) ?? [], this.dismissible = e.dismissible || !1, e.timeout !== void 0) { if (e.timeout <= 0) throw new m("The `timeout` property must be a positive integer or -at least- `undefined`."); this.timeout = e.timeout; } else this.timeout = 0; } } class L extends B { constructor(i, n) { const o = async () => { if (!this._isOpen.value) throw new Error("Unable to close the alert. It has already been closed or not even opened yet."); this._isOpen.value = !1, this._timeoutId !== void 0 && (clearTimeout(this._timeoutId), this._timeoutId = void 0), this._publisher.publish("closing"), await _(this._duration.leave), this._publisher.publish("closed"); }; super((l) => (o(), l instanceof g ? l.callback() : l instanceof Function ? l() : l), (l) => { throw o(), l; }); s(this, "_duration"); s(this, "_timeoutId"); s(this, "_publisher"); s(this, "_isOpen"); s(this, "alert"); s(this, "isOpen"); s(this, "component"); if (typeof n == "object") this._duration = { enter: Number(n.enter), leave: Number(n.leave) }; else { const l = Number(n); this._duration = { enter: l, leave: l }; } this._publisher = new q(), this.alert = new c(i), this._isOpen = y(!1), this.isOpen = A(() => this._isOpen.value), this.component = i.component; } async open() { if (this._isOpen.value) throw new Error("Unable to open the alert. It has already been opened."); this._isOpen.value = !0, this._publisher.publish("opening"), await _(this._duration.enter), this._publisher.publish("opened"), this.alert.timeout && (this._timeoutId = setTimeout(this.resolve, this.alert.timeout)); } onOpening(i) { this._publisher.subscribe("opening", i); } onOpened(i) { this._publisher.subscribe("opened", i); } onClosing(i) { this._publisher.subscribe("closing", i); } onClosed(i) { this._publisher.subscribe("closed", i); } } const d = class d { constructor(e) { // eslint-disable-next-line @typescript-eslint/no-explicit-any s(this, "_subscribers"); s(this, "_throttlers"); s(this, "_options"); s(this, "_throttle"); this._subscribers = [], this._throttlers = /* @__PURE__ */ new Map(), this._options = { ...d.DEFAULT_OPTS, ...e }, this._options.useThrottling ? this._throttle = (i) => { if (!i.id) return !1; const n = Date.now(), o = this._throttlers.get(i.id) ?? 0; return n - o > this._options.throttlingDuration ? (this._throttlers.set(i.id, n), !1) : !0; } : this._throttle = () => !1; } static get DEFAULT_OPTS() { return { useThrottling: !0, throttlingDuration: 100, transitionDuration: 200 }; } get options() { return { ...this._options }; } emit(e) { if (this._throttle(e)) throw new H(e); const o = this._subscribers.slice().map((u) => u(e)).filter((u) => !!u); if (!o.length) throw new h("Unable to handle the emitted alert properly. There wasn't found any supported subscribers."); if (o.length > 1) throw new h("Unable to handle the emitted alert properly. There were found too many supported subscribers."); return o[0]; } subscribe(e) { return this._subscribers.push(e), () => { const i = this._subscribers.indexOf(e); return this._subscribers.splice(i, 1)[0]; }; } }; s(d, "VERSION", "1.3.5"); let b = d, O; const M = (t) => { O = t; }, K = () => C() ? j(w.$vuert) : O, Q = (t) => ({ install: ({ config: e, provide: i }) => { const n = new b(t); M(n), e.globalProperties.$vuert = n, i(w.$vuert, n); } }), v = () => { const t = K(); if (!t) throw new h( "`useVuert()` was called but there was not active Vuert. Did you forget to install `Vuert` plugin in your App?" ); return t; }, W = /* @__PURE__ */ E({ __name: "AlertHandler", props: { is: { default: "div", type: [String, Object] }, filter: { default: () => !0, type: Function }, transitionDuration: { default: () => v().options.transitionDuration, type: [Number, Object], validator: (t) => t instanceof Object ? "enter" in t && "leave" in t ? isFinite(Number(t.enter)) && isFinite(Number(t.leave)) : !1 : isFinite(Number(t)) } }, emits: { opening: (t) => t instanceof c, opened: (t) => t instanceof c, closing: (t) => t instanceof c, closed: (t) => t instanceof c }, setup(t, { emit: e }) { const i = t, n = e, o = [], u = y(0), a = F(), l = async () => { const r = o[0]; r.onOpening(() => n("opening", r.alert)), r.onOpened(() => n("opened", r.alert)), r.onClosing(() => n("closing", r.alert)), r.onClosed(async () => { n("closed", r.alert), o.shift(), a.value = void 0, u.value -= 1, await R(), o.length > 0 && l(); }), a.value = r, await r.open(); }, x = (r) => { const p = new L(r, i.transitionDuration); return o.push(p), o.length === 1 && l(), u.value += 1, p; }; let f; return I(() => { f = v().subscribe((r) => { if (i.filter(r)) return x(r); }); }), N(() => f()), (r, p) => (S(), V(k(t.is), null, { default: U(() => [ a.value ? $(r.$slots, "default", { key: 0, alert: a.value.alert, customComponent: a.value.component, isOpen: a.value.isOpen.value, queue: u.value, resolve: a.value.resolve, reject: a.value.reject }) : P("", !0) ]), _: 3 })); } }); export { g as Action, c as Alert, W as AlertHandler, H as AlertThrottledException, L as Context, Q as createVuert, b as default, v as useVuert }; //# sourceMappingURL=vuert.esm.js.map