@mundoit-lib/plugin-vue-event 1.0.2 → 2.0.3

package/dist/index.js

@@ -1,83 +1,5 @@
-import mitt from 'mitt';
-import { isVue3, isVue2 } from 'vue-demi';
+import { EVENTS_KEY, createEventBus, eventBus, useEventBus } from "./eventBus.js";
+import eventsPlugin from "./plugin.js";
+import { useEvents } from "./useEvents.js";
 
-// src/eventBus.ts
-var eventBus = mitt();
-var useEventBus = () => {
-  return {
-    emit(event, ...args) {
-      eventBus.emit(event, args);
-    },
-    on(event, callback) {
-      const listener = (args) => callback(...args);
-      eventBus.on(event, listener);
-      return listener;
-    },
-    fire(event, ...args) {
-      eventBus.emit(event, args);
-    },
-    off(event, listener) {
-      eventBus.off(event, listener);
-    },
-    once(event, callback) {
-      const listener = (args) => callback(...args);
-      const wrappedListener = (args) => {
-        listener(args);
-        eventBus.off(event, wrappedListener);
-      };
-      eventBus.on(event, wrappedListener);
-      return wrappedListener;
-    }
-  };
-};
-function plugin(VueOrApp) {
-  const bus = useEventBus();
-  if (isVue3) {
-    const app = VueOrApp;
-    app.config.globalProperties.$events = bus;
-    app.mixin({
-      beforeCreate() {
-        if (typeof this.$options.events !== "object") return;
-        this._eventListeners = [];
-        for (const [event, handler] of Object.entries(this.$options.events)) {
-          const boundHandler = handler.bind(this);
-          const listener = bus.on(event, boundHandler);
-          this._eventListeners.push({ event, listener });
-        }
-      },
-      beforeUnmount() {
-        if (!this._eventListeners) return;
-        for (const { event, listener } of this._eventListeners) {
-          bus.off(event, listener);
-        }
-      }
-    });
-  } else if (isVue2) {
-    const Vue = VueOrApp;
-    Object.defineProperty(Vue.prototype, "$events", {
-      get() {
-        return bus;
-      }
-    });
-    Vue.mixin({
-      beforeCreate() {
-        if (typeof this.$options.events !== "object") return;
-        this._eventListeners = [];
-        for (const [event, handler] of Object.entries(this.$options.events)) {
-          const boundHandler = handler.bind(this);
-          const listener = bus.on(event, boundHandler);
-          this._eventListeners.push({ event, listener });
-        }
-      },
-      beforeDestroy() {
-        if (!this._eventListeners) return;
-        for (const { event, listener } of this._eventListeners) {
-          bus.off(event, listener);
-        }
-      }
-    });
-  }
-}
-var plugin_default = plugin;
-
-export { eventBus, plugin_default as eventsPlugin, useEventBus };
+export { EVENTS_KEY, createEventBus, eventBus, eventsPlugin, useEventBus, useEvents };

package/dist/plugin.cjs

@@ -1,91 +1,39 @@
-'use strict';
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: 'Module' } });
+const require_eventBus = require('./eventBus.cjs');
 
-var vueDemi = require('vue-demi');
-var mitt = require('mitt');
-
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var mitt__default = /*#__PURE__*/_interopDefault(mitt);
-
-// src/plugin.ts
-var eventBus = mitt__default.default();
-var useEventBus = () => {
-  return {
-    emit(event, ...args) {
-      eventBus.emit(event, args);
-    },
-    on(event, callback) {
-      const listener = (args) => callback(...args);
-      eventBus.on(event, listener);
-      return listener;
-    },
-    fire(event, ...args) {
-      eventBus.emit(event, args);
-    },
-    off(event, listener) {
-      eventBus.off(event, listener);
-    },
-    once(event, callback) {
-      const listener = (args) => callback(...args);
-      const wrappedListener = (args) => {
-        listener(args);
-        eventBus.off(event, wrappedListener);
-      };
-      eventBus.on(event, wrappedListener);
-      return wrappedListener;
-    }
-  };
-};
-
-// src/plugin.ts
-function plugin(VueOrApp) {
-  const bus = useEventBus();
-  if (vueDemi.isVue3) {
-    const app = VueOrApp;
-    app.config.globalProperties.$events = bus;
-    app.mixin({
-      beforeCreate() {
-        if (typeof this.$options.events !== "object") return;
-        this._eventListeners = [];
-        for (const [event, handler] of Object.entries(this.$options.events)) {
-          const boundHandler = handler.bind(this);
-          const listener = bus.on(event, boundHandler);
-          this._eventListeners.push({ event, listener });
-        }
-      },
-      beforeUnmount() {
-        if (!this._eventListeners) return;
-        for (const { event, listener } of this._eventListeners) {
-          bus.off(event, listener);
-        }
-      }
-    });
-  } else if (vueDemi.isVue2) {
-    const Vue = VueOrApp;
-    Object.defineProperty(Vue.prototype, "$events", {
-      get() {
-        return bus;
-      }
-    });
-    Vue.mixin({
-      beforeCreate() {
-        if (typeof this.$options.events !== "object") return;
-        this._eventListeners = [];
-        for (const [event, handler] of Object.entries(this.$options.events)) {
-          const boundHandler = handler.bind(this);
-          const listener = bus.on(event, boundHandler);
-          this._eventListeners.push({ event, listener });
-        }
-      },
-      beforeDestroy() {
-        if (!this._eventListeners) return;
-        for (const { event, listener } of this._eventListeners) {
-          bus.off(event, listener);
-        }
-      }
-    });
-  }
+//#region src/plugin.ts
+/**
+* Plugin de Vue 3: expone `$events`, hace `app.provide('mundoitEvents', bus)` y registra
+* la opción de componente `events: { 'nombre'() {} }`.
+*/
+function eventsPlugin(app, options = {}) {
+	const bus = options.bus ?? require_eventBus.eventBus;
+	const listeners = /* @__PURE__ */ new WeakMap();
+	app.config.globalProperties.$events = bus;
+	app.provide(require_eventBus.EVENTS_KEY, bus);
+	app.mixin({
+		beforeCreate() {
+			const events = this.$options.events;
+			if (!events || typeof events !== "object") return;
+			const stored = [];
+			for (const [event, handler] of Object.entries(events)) {
+				if (typeof handler !== "function") continue;
+				stored.push({
+					event,
+					listener: bus.on(event, handler.bind(this))
+				});
+			}
+			listeners.set(this, stored);
+		},
+		beforeUnmount() {
+			const stored = listeners.get(this);
+			if (!stored) return;
+			for (const { event, listener } of stored) bus.off(event, listener);
+			listeners.delete(this);
+		}
+	});
 }
-var plugin_default = plugin;
 
-module.exports = plugin_default;
+//#endregion
+exports.default = eventsPlugin;
+exports.eventsPlugin = eventsPlugin;

package/dist/plugin.d.cts

@@ -1,10 +1,25 @@
-import { App } from 'vue-demi';
-
-interface Vue2Constructor {
-    prototype: any;
-    mixin: (options: any) => void;
+import { EventBus } from "./eventBus.cjs";
+import { App } from "vue";
+//#region src/plugin.d.ts
+export interface EventsPluginOptions {
+  /** Bus a usar en la app. Por defecto, el bus compartido `eventBus`. */
+  bus?: EventBus;
 }
-declare function plugin(app: App): void;
-declare function plugin(Vue: Vue2Constructor): void;
-
-export { plugin as default };
+type EventsOption = Record<string, (...args: any[]) => void>;
+declare module 'vue' {
+  interface ComponentCustomProperties {
+    /** Bus de eventos de la app (`@mundoit-lib/plugin-vue-event`). */
+    $events: EventBus;
+  }
+  interface ComponentCustomOptions {
+    /** Listeners del bus: se registran en `beforeCreate` y se desregistran en `beforeUnmount`. */
+    events?: EventsOption;
+  }
+}
+/**
+ * Plugin de Vue 3: expone `$events`, hace `app.provide('mundoitEvents', bus)` y registra
+ * la opción de componente `events: { 'nombre'() {} }`.
+ */
+declare function eventsPlugin(app: App, options?: EventsPluginOptions): void;
+//#endregion
+export { eventsPlugin as default, eventsPlugin };

package/dist/plugin.d.ts

@@ -1,10 +1,25 @@
-import { App } from 'vue-demi';
-
-interface Vue2Constructor {
-    prototype: any;
-    mixin: (options: any) => void;
+import { EventBus } from "./eventBus.js";
+import { App } from "vue";
+//#region src/plugin.d.ts
+export interface EventsPluginOptions {
+  /** Bus a usar en la app. Por defecto, el bus compartido `eventBus`. */
+  bus?: EventBus;
 }
-declare function plugin(app: App): void;
-declare function plugin(Vue: Vue2Constructor): void;
-
-export { plugin as default };
+type EventsOption = Record<string, (...args: any[]) => void>;
+declare module 'vue' {
+  interface ComponentCustomProperties {
+    /** Bus de eventos de la app (`@mundoit-lib/plugin-vue-event`). */
+    $events: EventBus;
+  }
+  interface ComponentCustomOptions {
+    /** Listeners del bus: se registran en `beforeCreate` y se desregistran en `beforeUnmount`. */
+    events?: EventsOption;
+  }
+}
+/**
+ * Plugin de Vue 3: expone `$events`, hace `app.provide('mundoitEvents', bus)` y registra
+ * la opción de componente `events: { 'nombre'() {} }`.
+ */
+declare function eventsPlugin(app: App, options?: EventsPluginOptions): void;
+//#endregion
+export { eventsPlugin as default, eventsPlugin };

package/dist/plugin.js

@@ -1,85 +1,37 @@
-import { isVue3, isVue2 } from 'vue-demi';
-import mitt from 'mitt';
+import { EVENTS_KEY, eventBus } from "./eventBus.js";
 
-// src/plugin.ts
-var eventBus = mitt();
-var useEventBus = () => {
-  return {
-    emit(event, ...args) {
-      eventBus.emit(event, args);
-    },
-    on(event, callback) {
-      const listener = (args) => callback(...args);
-      eventBus.on(event, listener);
-      return listener;
-    },
-    fire(event, ...args) {
-      eventBus.emit(event, args);
-    },
-    off(event, listener) {
-      eventBus.off(event, listener);
-    },
-    once(event, callback) {
-      const listener = (args) => callback(...args);
-      const wrappedListener = (args) => {
-        listener(args);
-        eventBus.off(event, wrappedListener);
-      };
-      eventBus.on(event, wrappedListener);
-      return wrappedListener;
-    }
-  };
-};
-
-// src/plugin.ts
-function plugin(VueOrApp) {
-  const bus = useEventBus();
-  if (isVue3) {
-    const app = VueOrApp;
-    app.config.globalProperties.$events = bus;
-    app.mixin({
-      beforeCreate() {
-        if (typeof this.$options.events !== "object") return;
-        this._eventListeners = [];
-        for (const [event, handler] of Object.entries(this.$options.events)) {
-          const boundHandler = handler.bind(this);
-          const listener = bus.on(event, boundHandler);
-          this._eventListeners.push({ event, listener });
-        }
-      },
-      beforeUnmount() {
-        if (!this._eventListeners) return;
-        for (const { event, listener } of this._eventListeners) {
-          bus.off(event, listener);
-        }
-      }
-    });
-  } else if (isVue2) {
-    const Vue = VueOrApp;
-    Object.defineProperty(Vue.prototype, "$events", {
-      get() {
-        return bus;
-      }
-    });
-    Vue.mixin({
-      beforeCreate() {
-        if (typeof this.$options.events !== "object") return;
-        this._eventListeners = [];
-        for (const [event, handler] of Object.entries(this.$options.events)) {
-          const boundHandler = handler.bind(this);
-          const listener = bus.on(event, boundHandler);
-          this._eventListeners.push({ event, listener });
-        }
-      },
-      beforeDestroy() {
-        if (!this._eventListeners) return;
-        for (const { event, listener } of this._eventListeners) {
-          bus.off(event, listener);
-        }
-      }
-    });
-  }
+//#region src/plugin.ts
+/**
+* Plugin de Vue 3: expone `$events`, hace `app.provide('mundoitEvents', bus)` y registra
+* la opción de componente `events: { 'nombre'() {} }`.
+*/
+function eventsPlugin(app, options = {}) {
+	const bus = options.bus ?? eventBus;
+	const listeners = /* @__PURE__ */ new WeakMap();
+	app.config.globalProperties.$events = bus;
+	app.provide(EVENTS_KEY, bus);
+	app.mixin({
+		beforeCreate() {
+			const events = this.$options.events;
+			if (!events || typeof events !== "object") return;
+			const stored = [];
+			for (const [event, handler] of Object.entries(events)) {
+				if (typeof handler !== "function") continue;
+				stored.push({
+					event,
+					listener: bus.on(event, handler.bind(this))
+				});
+			}
+			listeners.set(this, stored);
+		},
+		beforeUnmount() {
+			const stored = listeners.get(this);
+			if (!stored) return;
+			for (const { event, listener } of stored) bus.off(event, listener);
+			listeners.delete(this);
+		}
+	});
 }
-var plugin_default = plugin;
 
-export { plugin_default as default };
+//#endregion
+export { eventsPlugin as default, eventsPlugin };

package/dist/useEvents.cjs

@@ -0,0 +1,51 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+const require_eventBus = require('./eventBus.cjs');
+let vue = require("vue");
+
+//#region src/useEvents.ts
+/**
+* Bus de eventos para Composition API. Lo que se registre con `on`/`once` desde un `setup`
+* se desregistra solo en `onBeforeUnmount`. Fuera de un componente se comporta como el bus.
+*
+* @param bus bus a usar; por defecto, el de la app (`install(app, { bus })`) o el bus por defecto.
+*/
+function useEvents(bus = require_eventBus.useEventBus()) {
+	const registrations = [];
+	function add(event, listener, once) {
+		const fn = listener;
+		const registration = {
+			event,
+			listener: fn,
+			handler: fn
+		};
+		registration.handler = once ? (...args) => {
+			remove(registration);
+			fn(...args);
+		} : (...args) => fn(...args);
+		registrations.push(registration);
+		bus.on(event, registration.handler);
+		return listener;
+	}
+	function remove(registration) {
+		const index = registrations.indexOf(registration);
+		if (index !== -1) registrations.splice(index, 1);
+		bus.off(registration.event, registration.handler);
+	}
+	if ((0, vue.getCurrentInstance)()) (0, vue.onBeforeUnmount)(() => {
+		for (const registration of [...registrations]) remove(registration);
+	});
+	return {
+		emit: (event, ...args) => bus.emit(event, ...args),
+		on: (event, listener) => add(event, listener, false),
+		once: (event, listener) => add(event, listener, true),
+		off(event, listener) {
+			const own = registrations.filter((r) => r.event === event && (!listener || r.listener === listener));
+			for (const registration of own) remove(registration);
+			if (!listener) bus.off(event);
+			else if (!own.length) bus.off(event, listener);
+		}
+	};
+}
+
+//#endregion
+exports.useEvents = useEvents;

package/dist/useEvents.d.cts

@@ -0,0 +1,11 @@
+import { EventBus } from "./eventBus.cjs";
+//#region src/useEvents.d.ts
+export type UseEventsReturn = Pick<EventBus, 'emit' | 'on' | 'once' | 'off'>;
+/**
+ * Bus de eventos para Composition API. Lo que se registre con `on`/`once` desde un `setup`
+ * se desregistra solo en `onBeforeUnmount`. Fuera de un componente se comporta como el bus.
+ *
+ * @param bus bus a usar; por defecto, el de la app (`install(app, { bus })`) o el bus por defecto.
+ */
+export declare function useEvents(bus?: EventBus): UseEventsReturn;
+//#endregion

package/dist/useEvents.d.ts

@@ -0,0 +1,11 @@
+import { EventBus } from "./eventBus.js";
+//#region src/useEvents.d.ts
+export type UseEventsReturn = Pick<EventBus, 'emit' | 'on' | 'once' | 'off'>;
+/**
+ * Bus de eventos para Composition API. Lo que se registre con `on`/`once` desde un `setup`
+ * se desregistra solo en `onBeforeUnmount`. Fuera de un componente se comporta como el bus.
+ *
+ * @param bus bus a usar; por defecto, el de la app (`install(app, { bus })`) o el bus por defecto.
+ */
+export declare function useEvents(bus?: EventBus): UseEventsReturn;
+//#endregion

package/dist/useEvents.js

@@ -0,0 +1,50 @@
+import { useEventBus } from "./eventBus.js";
+import { getCurrentInstance, onBeforeUnmount } from "vue";
+
+//#region src/useEvents.ts
+/**
+* Bus de eventos para Composition API. Lo que se registre con `on`/`once` desde un `setup`
+* se desregistra solo en `onBeforeUnmount`. Fuera de un componente se comporta como el bus.
+*
+* @param bus bus a usar; por defecto, el de la app (`install(app, { bus })`) o el bus por defecto.
+*/
+function useEvents(bus = useEventBus()) {
+	const registrations = [];
+	function add(event, listener, once) {
+		const fn = listener;
+		const registration = {
+			event,
+			listener: fn,
+			handler: fn
+		};
+		registration.handler = once ? (...args) => {
+			remove(registration);
+			fn(...args);
+		} : (...args) => fn(...args);
+		registrations.push(registration);
+		bus.on(event, registration.handler);
+		return listener;
+	}
+	function remove(registration) {
+		const index = registrations.indexOf(registration);
+		if (index !== -1) registrations.splice(index, 1);
+		bus.off(registration.event, registration.handler);
+	}
+	if (getCurrentInstance()) onBeforeUnmount(() => {
+		for (const registration of [...registrations]) remove(registration);
+	});
+	return {
+		emit: (event, ...args) => bus.emit(event, ...args),
+		on: (event, listener) => add(event, listener, false),
+		once: (event, listener) => add(event, listener, true),
+		off(event, listener) {
+			const own = registrations.filter((r) => r.event === event && (!listener || r.listener === listener));
+			for (const registration of own) remove(registration);
+			if (!listener) bus.off(event);
+			else if (!own.length) bus.off(event, listener);
+		}
+	};
+}
+
+//#endregion
+export { useEvents };