@aegisjsproject/callback-registry 1.0.1 → 1.0.3

package/callbackRegistry.cjs

@@ -1,11 +1,617 @@
 'use strict';
 
+const PREFIX = 'data-aegis-event-';
+const EVENT_PREFIX = PREFIX + 'on-';
+const EVENT_PREFIX_LENGTH = EVENT_PREFIX.length;
+const DATA_PREFIX = 'aegisEventOn';
+const DATA_PREFIX_LENGTH = DATA_PREFIX.length;
+const signalSymbol = Symbol('aegis:signal');
+const controllerSymbol = Symbol('aegis:controller');
+const signalRegistry = new Map();
+const controllerRegistry = new Map();
+
+const once = PREFIX + 'once';
+const passive = PREFIX + 'passive';
+const capture = PREFIX + 'capture';
+const signal = PREFIX + 'signal';
+const controller = PREFIX + 'controller';
+const onAbort = EVENT_PREFIX + 'abort';
+const onBlur = EVENT_PREFIX + 'blur';
+const onFocus = EVENT_PREFIX + 'focus';
+const onCancel = EVENT_PREFIX + 'cancel';
+const onAuxclick = EVENT_PREFIX + 'auxclick';
+const onBeforeinput = EVENT_PREFIX + 'beforeinput';
+const onBeforetoggle = EVENT_PREFIX + 'beforetoggle';
+const onCanplay = EVENT_PREFIX + 'canplay';
+const onCanplaythrough = EVENT_PREFIX + 'canplaythrough';
+const onChange = EVENT_PREFIX + 'change';
+const onClick = EVENT_PREFIX + 'click';
+const onClose = EVENT_PREFIX + 'close';
+const onCommand = EVENT_PREFIX + 'command';
+const onContextmenu = EVENT_PREFIX + 'contextmenu';
+const onCopy = EVENT_PREFIX + 'copy';
+const onCuechange = EVENT_PREFIX + 'cuechange';
+const onCut = EVENT_PREFIX + 'cut';
+const onDblclick = EVENT_PREFIX + 'dblclick';
+const onDrag = EVENT_PREFIX + 'drag';
+const onDragend = EVENT_PREFIX + 'dragend';
+const onDragenter = EVENT_PREFIX + 'dragenter';
+const onDragexit = EVENT_PREFIX + 'dragexit';
+const onDragleave = EVENT_PREFIX + 'dragleave';
+const onDragover = EVENT_PREFIX + 'dragover';
+const onDragstart = EVENT_PREFIX + 'dragstart';
+const onDrop = EVENT_PREFIX + 'drop';
+const onDurationchange = EVENT_PREFIX + 'durationchange';
+const onEmptied = EVENT_PREFIX + 'emptied';
+const onEnded = EVENT_PREFIX + 'ended';
+const onFormdata = EVENT_PREFIX + 'formdata';
+const onInput = EVENT_PREFIX + 'input';
+const onInvalid = EVENT_PREFIX + 'invalid';
+const onKeydown = EVENT_PREFIX + 'keydown';
+const onKeypress = EVENT_PREFIX + 'keypress';
+const onKeyup = EVENT_PREFIX + 'keyup';
+const onLoad = EVENT_PREFIX + 'load';
+const onLoadeddata = EVENT_PREFIX + 'loadeddata';
+const onLoadedmetadata = EVENT_PREFIX + 'loadedmetadata';
+const onLoadstart = EVENT_PREFIX + 'loadstart';
+const onMousedown = EVENT_PREFIX + 'mousedown';
+const onMouseenter = EVENT_PREFIX + 'mouseenter';
+const onMouseleave = EVENT_PREFIX + 'mouseleave';
+const onMousemove = EVENT_PREFIX + 'mousemove';
+const onMouseout = EVENT_PREFIX + 'mouseout';
+const onMouseover = EVENT_PREFIX + 'mouseover';
+const onMouseup = EVENT_PREFIX + 'mouseup';
+const onWheel = EVENT_PREFIX + 'wheel';
+const onPaste = EVENT_PREFIX + 'paste';
+const onPause = EVENT_PREFIX + 'pause';
+const onPlay = EVENT_PREFIX + 'play';
+const onPlaying = EVENT_PREFIX + 'playing';
+const onProgress = EVENT_PREFIX + 'progress';
+const onRatechange = EVENT_PREFIX + 'ratechange';
+const onReset = EVENT_PREFIX + 'reset';
+const onResize = EVENT_PREFIX + 'resize';
+const onScroll = EVENT_PREFIX + 'scroll';
+const onScrollend = EVENT_PREFIX + 'scrollend';
+const onSecuritypolicyviolation = EVENT_PREFIX + 'securitypolicyviolation';
+const onSeeked = EVENT_PREFIX + 'seeked';
+const onSeeking = EVENT_PREFIX + 'seeking';
+const onSelect = EVENT_PREFIX + 'select';
+const onSlotchange = EVENT_PREFIX + 'slotchange';
+const onStalled = EVENT_PREFIX + 'stalled';
+const onSubmit = EVENT_PREFIX + 'submit';
+const onSuspend = EVENT_PREFIX + 'suspend';
+const onTimeupdate = EVENT_PREFIX + 'timeupdate';
+const onVolumechange = EVENT_PREFIX + 'volumechange';
+const onWaiting = EVENT_PREFIX + 'waiting';
+const onSelectstart = EVENT_PREFIX + 'selectstart';
+const onSelectionchange = EVENT_PREFIX + 'selectionchange';
+const onToggle = EVENT_PREFIX + 'toggle';
+const onPointercancel = EVENT_PREFIX + 'pointercancel';
+const onPointerdown = EVENT_PREFIX + 'pointerdown';
+const onPointerup = EVENT_PREFIX + 'pointerup';
+const onPointermove = EVENT_PREFIX + 'pointermove';
+const onPointerout = EVENT_PREFIX + 'pointerout';
+const onPointerover = EVENT_PREFIX + 'pointerover';
+const onPointerenter = EVENT_PREFIX + 'pointerenter';
+const onPointerleave = EVENT_PREFIX + 'pointerleave';
+const onGotpointercapture = EVENT_PREFIX + 'gotpointercapture';
+const onLostpointercapture = EVENT_PREFIX + 'lostpointercapture';
+const onMozfullscreenchange = EVENT_PREFIX + 'mozfullscreenchange';
+const onMozfullscreenerror = EVENT_PREFIX + 'mozfullscreenerror';
+const onAnimationcancel = EVENT_PREFIX + 'animationcancel';
+const onAnimationend = EVENT_PREFIX + 'animationend';
+const onAnimationiteration = EVENT_PREFIX + 'animationiteration';
+const onAnimationstart = EVENT_PREFIX + 'animationstart';
+const onTransitioncancel = EVENT_PREFIX + 'transitioncancel';
+const onTransitionend = EVENT_PREFIX + 'transitionend';
+const onTransitionrun = EVENT_PREFIX + 'transitionrun';
+const onTransitionstart = EVENT_PREFIX + 'transitionstart';
+const onWebkitanimationend = EVENT_PREFIX + 'webkitanimationend';
+const onWebkitanimationiteration = EVENT_PREFIX + 'webkitanimationiteration';
+const onWebkitanimationstart = EVENT_PREFIX + 'webkitanimationstart';
+const onWebkittransitionend = EVENT_PREFIX + 'webkittransitionend';
+const onError = EVENT_PREFIX + 'error';
+
+const eventAttrs = [
+	onAbort,
+	onBlur,
+	onFocus,
+	onCancel,
+	onAuxclick,
+	onBeforeinput,
+	onBeforetoggle,
+	onCanplay,
+	onCanplaythrough,
+	onChange,
+	onClick,
+	onClose,
+	onCommand,
+	onContextmenu,
+	onCopy,
+	onCuechange,
+	onCut,
+	onDblclick,
+	onDrag,
+	onDragend,
+	onDragenter,
+	onDragexit,
+	onDragleave,
+	onDragover,
+	onDragstart,
+	onDrop,
+	onDurationchange,
+	onEmptied,
+	onEnded,
+	onFormdata,
+	onInput,
+	onInvalid,
+	onKeydown,
+	onKeypress,
+	onKeyup,
+	onLoad,
+	onLoadeddata,
+	onLoadedmetadata,
+	onLoadstart,
+	onMousedown,
+	onMouseenter,
+	onMouseleave,
+	onMousemove,
+	onMouseout,
+	onMouseover,
+	onMouseup,
+	onWheel,
+	onPaste,
+	onPause,
+	onPlay,
+	onPlaying,
+	onProgress,
+	onRatechange,
+	onReset,
+	onResize,
+	onScroll,
+	onScrollend,
+	onSecuritypolicyviolation,
+	onSeeked,
+	onSeeking,
+	onSelect,
+	onSlotchange,
+	onStalled,
+	onSubmit,
+	onSuspend,
+	onTimeupdate,
+	onVolumechange,
+	onWaiting,
+	onSelectstart,
+	onSelectionchange,
+	onToggle,
+	onPointercancel,
+	onPointerdown,
+	onPointerup,
+	onPointermove,
+	onPointerout,
+	onPointerover,
+	onPointerenter,
+	onPointerleave,
+	onGotpointercapture,
+	onLostpointercapture,
+	onMozfullscreenchange,
+	onMozfullscreenerror,
+	onAnimationcancel,
+	onAnimationend,
+	onAnimationiteration,
+	onAnimationstart,
+	onTransitioncancel,
+	onTransitionend,
+	onTransitionrun,
+	onTransitionstart,
+	onWebkitanimationend,
+	onWebkitanimationiteration,
+	onWebkitanimationstart,
+	onWebkittransitionend,
+	onError,
+];
+
+let selector = eventAttrs.map(attr => `[${CSS.escape(attr)}]`).join(', ');
+
+const attrToProp = attr => `on${attr[EVENT_PREFIX_LENGTH].toUpperCase()}${attr.substring(EVENT_PREFIX_LENGTH + 1)}`;
+
+const eventToProp = event => EVENT_PREFIX + event;
+
+const hasEventAttribute = event => eventAttrs.includes(EVENT_PREFIX + event);
+
+const isEventDataAttr = ([name]) => name.startsWith(DATA_PREFIX);
+
+function _addListeners(el, { signal, attrFilter = EVENTS } = {}) {
+	const dataset = el.dataset;
+
+	for (const [attr, val] of Object.entries(dataset).filter(isEventDataAttr)) {
+		try {
+			const event = 'on' + attr.substring(DATA_PREFIX_LENGTH);
+
+			if (attrFilter.hasOwnProperty(event) && hasCallback(val)) {
+				el.addEventListener(event.substring(2).toLowerCase(), getCallback(val), {
+					passive: dataset.hasOwnProperty('aegisEventPassive'),
+					capture: dataset.hasOwnProperty('aegisEventCapture'),
+					once: dataset.hasOwnProperty('aegisEventOnce'),
+					signal: dataset.hasOwnProperty('aegisEventSignal') ? getSignal(dataset.aegisEventSignal) : signal,
+				});
+			}
+		} catch(err) {
+			reportError(err);
+		}
+	}
+}
+
+const observer = new MutationObserver(records => {
+	records.forEach(record  => {
+		switch(record.type) {
+			case 'childList':
+				[...record.addedNodes]
+					.filter(node => node.nodeType === Node.ELEMENT_NODE)
+					.forEach(node => attachListeners(node));
+				break;
+
+			case 'attributes':
+				if (typeof record.oldValue === 'string' && hasCallback(record.oldValue)) {
+					record.target.removeEventListener(
+						record.attributeName.substring(EVENT_PREFIX_LENGTH),
+						getCallback(record.oldValue), {
+							once: record.target.hasAttribute(once),
+							capture: record.target.hasAttribute(capture),
+							passive: record.target.hasAttribute(passive),
+						}
+					);
+				}
+
+				if (
+					record.target.hasAttribute(record.attributeName)
+					&& hasCallback(record.target.getAttribute(record.attributeName))
+				) {
+					record.target.addEventListener(
+						record.attributeName.substring(EVENT_PREFIX_LENGTH),
+						getCallback(record.target.getAttribute(record.attributeName)), {
+							once: record.target.hasAttribute(once),
+							capture: record.target.hasAttribute(capture),
+							passive: record.target.hasAttribute(passive),
+							signal: record.target.hasAttribute(signal) ? getSignal(record.target.getAttribute(signal)) : undefined,
+						}
+					);
+				}
+				break;
+		}
+	});
+});
+
+const EVENTS = {
+	onAbort,
+	onBlur,
+	onFocus,
+	onCancel,
+	onAuxclick,
+	onBeforeinput,
+	onBeforetoggle,
+	onCanplay,
+	onCanplaythrough,
+	onChange,
+	onClick,
+	onClose,
+	onCommand,
+	onContextmenu,
+	onCopy,
+	onCuechange,
+	onCut,
+	onDblclick,
+	onDrag,
+	onDragend,
+	onDragenter,
+	onDragexit,
+	onDragleave,
+	onDragover,
+	onDragstart,
+	onDrop,
+	onDurationchange,
+	onEmptied,
+	onEnded,
+	onFormdata,
+	onInput,
+	onInvalid,
+	onKeydown,
+	onKeypress,
+	onKeyup,
+	onLoad,
+	onLoadeddata,
+	onLoadedmetadata,
+	onLoadstart,
+	onMousedown,
+	onMouseenter,
+	onMouseleave,
+	onMousemove,
+	onMouseout,
+	onMouseover,
+	onMouseup,
+	onWheel,
+	onPaste,
+	onPause,
+	onPlay,
+	onPlaying,
+	onProgress,
+	onRatechange,
+	onReset,
+	onResize,
+	onScroll,
+	onScrollend,
+	onSecuritypolicyviolation,
+	onSeeked,
+	onSeeking,
+	onSelect,
+	onSlotchange,
+	onStalled,
+	onSubmit,
+	onSuspend,
+	onTimeupdate,
+	onVolumechange,
+	onWaiting,
+	onSelectstart,
+	onSelectionchange,
+	onToggle,
+	onPointercancel,
+	onPointerdown,
+	onPointerup,
+	onPointermove,
+	onPointerout,
+	onPointerover,
+	onPointerenter,
+	onPointerleave,
+	onGotpointercapture,
+	onLostpointercapture,
+	onMozfullscreenchange,
+	onMozfullscreenerror,
+	onAnimationcancel,
+	onAnimationend,
+	onAnimationiteration,
+	onAnimationstart,
+	onTransitioncancel,
+	onTransitionend,
+	onTransitionrun,
+	onTransitionstart,
+	onWebkitanimationend,
+	onWebkitanimationiteration,
+	onWebkitanimationstart,
+	onWebkittransitionend,
+	onError,
+	once,
+	passive,
+	capture,
+};
+
+/**
+ * Register an attribute to observe for adding/removing event listeners
+ *
+ * @param {string} attr Name of the attribute to observe
+ * @param {object} options
+ * @param {boolean} [options.addListeners=false] Whether or not to automatically add listeners
+ * @param {Document|Element} [options.base=document.body] Root node to observe
+ * @param {AbortSignal} [options.signal] An abort signal to remove any listeners when aborted
+ * @returns {string} The resulting `data-*` attribute name
+ */
+function registerEventAttribute(attr, {
+	addListeners = false,
+	base = document.body,
+	signal,
+} = {}) {
+	const fullAttr = EVENT_PREFIX + attr.toLowerCase();
+
+	if (! eventAttrs.includes(fullAttr)) {
+		const sel = `[${CSS.escape(fullAttr)}]`;
+		const prop = attrToProp(fullAttr);
+		eventAttrs.push(fullAttr);
+		EVENTS[prop] = fullAttr;
+		selector += `, ${sel}`;
+
+		if (addListeners) {
+			requestAnimationFrame(() => {
+				const config = { attrFilter: { [prop]: sel }, signal };
+				[base, ...base.querySelectorAll(sel)].forEach(el => _addListeners(el, config));
+			});
+		}
+	}
+
+	return fullAttr;
+}
+
+/**
+ * Registers an `AbortController` in the controller registry and returns the key for it
+ *
+ * @param {AbortController} controller
+ * @returns {string} The randomly generated key with which the controller is registered
+ * @throws {TypeError} If controller is not an `AbortController`
+ * @throws {Error} Any `reason` if controller is already aborted
+ */
+function registerController(controller) {
+	if (! (controller instanceof AbortController)) {
+		throw new TypeError('Controller is not an `AbortSignal.');
+	} else if (controller.signal.aborted) {
+		throw controller.signal.reason;
+	} else if (typeof controller.signal[controllerSymbol] === 'string') {
+		return controller.signal[controllerSymbol];
+	} else {
+		const key = 'aegis:event:controller:' + crypto.randomUUID();
+		Object.defineProperty(controller.signal, controllerSymbol, { value: key, writable: false, enumerable: false });
+		controllerRegistry.set(key, controller);
+
+		controller.signal.addEventListener('abort', unregisterController, { once: true });
+
+		return key;
+	}
+}
+
+/**
+ * Removes a controller from the registry
+ *
+ * @param {AbortController|AbortSignal|string} key The registed key or the controller or signal it corresponds to
+ * @returns {boolean} Whether or not the controller was successfully unregistered
+ */
+function unregisterController(key) {
+	if (key instanceof AbortController) {
+		return controllerRegistry.delete(key.signal[controllerSymbol]);
+	} else if (key instanceof AbortSignal) {
+		return controllerRegistry.delete(key[controllerSymbol]);
+	} else {
+		return controllerRegistry.delete(key);
+	}
+}
+
+/**
+ * Creates and registers an `AbortController` in the controller registry and returns the key for it
+ *
+ * @param {object} options
+ * @param {AbortSignal} [options.signal] An optional `AbortSignal` to externally abort the controller with
+ * @returns {string} The randomly generated key with which the controller is registered
+ */
+function createController({ signal } = {}) {
+	const controller = new AbortController();
+
+	if (signal instanceof AbortSignal) {
+		signal.addEventListener('abort', ({ target }) => controller.abort(target.reason), { signal: controller.signal});
+	}
+
+	return registerController(controller);
+}
+
+/**
+ * Get a registetd controller from the registry
+ *
+ * @param {string} key Generated key with which the controller was registered
+ * @returns {AbortController|void} Any registered controller, if any
+ */
+const getController = key => controllerRegistry.get(key);
+
+function abortController(key, reason) {
+	const controller = getController(key);
+
+	if (! (controller instanceof AbortController)) {
+		return false;
+	} else if (typeof reason === 'string') {
+		controller.abort(new Error(reason));
+		return true;
+	} else {
+		controller.abort(reason);
+		return true;
+	}
+}
+
+/**
+ * Register an `AbortSignal` to be used in declarative HTML as a value for `data-aegis-event-signal`
+ *
+ * @param {AbortSignal} signal The signal to register
+ * @returns {string} The registered key
+ * @throws {TypeError} Thrown if not an `AbortSignal`
+ */
+function registerSignal(signal) {
+	if (! (signal instanceof AbortSignal)) {
+		throw new TypeError('Signal must be an `AbortSignal`.');
+	} else if (typeof signal[signalSymbol] === 'string') {
+		return signal[signalSymbol];
+	} else {
+		const key = 'aegis:event:signal:' + crypto.randomUUID();
+		Object.defineProperty(signal, signalSymbol, { value: key, writable: false, enumerable: false });
+		signalRegistry.set(key, signal);
+		signal.addEventListener('abort', ({ target }) => unregisterSignal(target[signalSymbol]), { once: true });
+
+		return key;
+	}
+}
+
+/**
+ * Gets and `AbortSignal` from the registry
+ *
+ * @param {string} key The registered key for the signal
+ * @returns {AbortSignal|void} The corresponding `AbortSignal`, if any
+ */
+const getSignal = key => signalRegistry.get(key);
+
+/**
+ * Removes an `AbortSignal` from the registry
+ *
+ * @param {AbortSignal|string} signal An `AbortSignal` or the registered key for one
+ * @returns {boolean} Whether or not the signal was sucessfully unregistered
+ * @throws {TypeError} Throws if `signal` is not an `AbortSignal` or the key for a registered signal
+ */
+function unregisterSignal(signal) {
+	if (signal instanceof AbortSignal) {
+		return signalRegistry.delete(signal[signalSymbol]);
+	} else if (typeof signal === 'string') {
+		return signalRegistry.delete(signal);
+	} else {
+		throw new TypeError('Signal must be an `AbortSignal` or registered key/attribute.');
+	}
+}
+
+/**
+ * Add listeners to an element and its children, matching a generated query based on registered attributes
+ *
+ * @param {Element|Document} target Root node to add listeners from
+ * @param {object} options
+ * @param {AbortSignal} [options.signal] Optional signal to remove event listeners
+ * @returns {Element|Document} Returns the passed target node
+ */
+function attachListeners(target, { signal } = {}) {
+	const nodes = target instanceof Element && target.matches(selector)
+		? [target, ...target.querySelectorAll(selector)]
+		: target.querySelectorAll(selector);
+
+	nodes.forEach(el => _addListeners(el, { signal }));
+
+	return target;
+}
+
+/**
+ * Add a node to the `MutationObserver` to observe attributes and add/remove event listeners
+ *
+ * @param {Document|Element} root Element to observe attributes on
+ */
+function observeEvents(root = document) {
+	attachListeners(root);
+
+	observer.observe(root, {
+		subtree: true,
+		childList:true,
+		attributes: true,
+		attributeOldValue: true,
+		attributeFilter: eventAttrs,
+	});
+}
+
+/**
+ * Disconnects the `MutationObserver`, disabling observing of all attribute changes
+ *
+ * @returns {void}
+ */
+const disconnectEventsObserver = () => observer.disconnect();
+
+/**
+ * Register a global error handler callback
+ *
+ * @param {Function} callback Callback to register as a global error handler
+ * @param {EventInit} config Typical event listener config object
+ */
+function setGlobalErrorHandler(callback, { capture, once, passive, signal } = {}) {
+	if (callback instanceof Function) {
+		globalThis.addEventListener('error', callback, { capture, once, passive, signal });
+	} else {
+		throw new TypeError('Callback is not a function.');
+	}
+}
+
 let _isRegistrationOpen = true;
 
 const $$ = (selector, base = document) => base.querySelectorAll(selector);
 
 const $ = (selector, base = document) => base.querySelector(selector);
 
+const requestFullscreen = { attr: 'data-request-fullscreen-selector', data: 'requestFullscreenSelector' };
+const toggleFullsceen = { attr: 'data-toggle-fullscreen-selector', data: 'toggleFullscreenSelector' };
+
 const FUNCS = {
 	debug: {
 		log: 'aegis:debug:log',
@@ -17,10 +623,12 @@ const FUNCS = {
 		back: 'aegis:navigate:back',
 		forward: 'aegis:navigate:forward',
 		reload: 'aegis:navigate:reload',
+		close: 'aegis:navigate:close',
 		link: 'aegis:navigate:go',
 		popup: 'aegis:navigate:popup',
 	},
 	ui: {
+		command: 'aegis:ui:command',
 		print: 'aegis:ui:print',
 		remove: 'aegis:ui:remove',
 		hide: 'aegis:ui:hide',
@@ -34,6 +642,14 @@ const FUNCS = {
 		disable: 'aegis:ui:disable',
 		scrollTo: 'aegis:ui:scrollTo',
 		prevent: 'aegis:ui:prevent',
+		revokeObjectURL: 'aegis:ui:revokeObjectURL',
+		cancelAnimationFrame: 'aegis:ui:cancelAnimationFrame',
+		requestFullscreen: 'aegis:ui:requestFullscreen',
+		toggleFullscreen: 'aegis:ui:toggleFullsceen',
+		exitFullsceen: 'aegis:ui:exitFullscreen',
+		open: 'aegis:ui:open',
+		close: 'aegis:ui:close',
+		abortController: 'aegis:ui:controller:abort',
 	},
 };
 
@@ -45,6 +661,7 @@ const registry = new Map([
 	[FUNCS.navigate.back, () => history.back()],
 	[FUNCS.navigate.forward, () => history.forward()],
 	[FUNCS.navigate.reload, () => history.go(0)],
+	[FUNCS.navigate.close, () => globalThis.close()],
 	[FUNCS.navigate.link, event => {
 		if (event.isTrusted) {
 			event.preventDefault();
@@ -83,6 +700,13 @@ const registry = new Map([
 			});
 		}
 	}],
+	[FUNCS.ui.revokeObjectURL, ({ currentTarget }) => URL.revokeObjectURL(currentTarget.src)],
+	[FUNCS.ui.cancelAnimationFrame, ({ currentTarget }) => cancelAnimationFrame(parseInt(currentTarget.dataset.animationFrame))],
+	[FUNCS.ui.clearInterval, ({ currentTarget }) => clearInterval(parseInt(currentTarget.dataset.clearInterval))],
+	[FUNCS.ui.clearTimeout, ({ currentTarget }) => clearTimeout(parseInt(currentTarget.dataset.timeout))],
+	[FUNCS.ui.abortController, ({ currentTarget }) => abortController(currentTarget.dataset.aegisEventController, currentTarget.dataset.aegisControllerReason)],
+	[FUNCS.ui.open, ({ currentTarget }) => document.querySelector(currentTarget.dataset.openSelector).open = true],
+	[FUNCS.ui.close, ({ currentTarget }) => document.querySelector(currentTarget.dataset.closeSelector).open = false],
 	[FUNCS.ui.showModal, ({ currentTarget }) => {
 		const target = $(currentTarget.dataset.showModalSelector);
 
@@ -120,6 +744,25 @@ const registry = new Map([
 	}],
 	[FUNCS.ui.print, () => globalThis.print()],
 	[FUNCS.ui.prevent, event => event.preventDefault()],
+	[FUNCS.ui.requestFullscreen, ({ currentTarget}) => {
+		if (currentTarget.dataset.hasOwnProperty(requestFullscreen.data)) {
+			document.getElementById(currentTarget.dataset[requestFullscreen.data]).requestFullscreen();
+		} else {
+			currentTarget.requestFullscreen();
+		}
+	}],
+	[FUNCS.ui.toggleFullscreen, ({ currentTarget }) => {
+		const target = currentTarget.dataset.hasOwnProperty(toggleFullsceen.data)
+			? document.getElementById(currentTarget.dataset[toggleFullsceen.data])
+			: currentTarget;
+
+		if (target.isSameNode(document.fullscreenElement)) {
+			document.exitFullscreen();
+		} else {
+			target.requestFullscreen();
+		}
+	}],
+	[FUNCS.ui.exitFullsceen, () => document.exitFullscreen()],
 ]);
 
 /**
@@ -240,289 +883,172 @@ function getHost(target) {
 	}
 }
 
-const EVENT_PREFIX = 'data-aegis-event-on-';
-const EVENT_PREFIX_LENGTH = EVENT_PREFIX.length;
-const DATA_PREFIX = 'aegisEventOn';
-const DATA_PREFIX_LENGTH = DATA_PREFIX.length;
-
-const once = 'data-aegis-event-once',
-	passive = 'data-aegis-event-passive',
-	capture = 'data-aegis-event-capture';
-
-const eventAttrs = [
-	EVENT_PREFIX + 'abort',
-	EVENT_PREFIX + 'blur',
-	EVENT_PREFIX + 'focus',
-	EVENT_PREFIX + 'cancel',
-	EVENT_PREFIX + 'auxclick',
-	EVENT_PREFIX + 'beforeinput',
-	EVENT_PREFIX + 'beforetoggle',
-	EVENT_PREFIX + 'canplay',
-	EVENT_PREFIX + 'canplaythrough',
-	EVENT_PREFIX + 'change',
-	EVENT_PREFIX + 'click',
-	EVENT_PREFIX + 'close',
-	EVENT_PREFIX + 'contextmenu',
-	EVENT_PREFIX + 'copy',
-	EVENT_PREFIX + 'cuechange',
-	EVENT_PREFIX + 'cut',
-	EVENT_PREFIX + 'dblclick',
-	EVENT_PREFIX + 'drag',
-	EVENT_PREFIX + 'dragend',
-	EVENT_PREFIX + 'dragenter',
-	EVENT_PREFIX + 'dragexit',
-	EVENT_PREFIX + 'dragleave',
-	EVENT_PREFIX + 'dragover',
-	EVENT_PREFIX + 'dragstart',
-	EVENT_PREFIX + 'drop',
-	EVENT_PREFIX + 'durationchange',
-	EVENT_PREFIX + 'emptied',
-	EVENT_PREFIX + 'ended',
-	EVENT_PREFIX + 'formdata',
-	EVENT_PREFIX + 'input',
-	EVENT_PREFIX + 'invalid',
-	EVENT_PREFIX + 'keydown',
-	EVENT_PREFIX + 'keypress',
-	EVENT_PREFIX + 'keyup',
-	EVENT_PREFIX + 'load',
-	EVENT_PREFIX + 'loadeddata',
-	EVENT_PREFIX + 'loadedmetadata',
-	EVENT_PREFIX + 'loadstart',
-	EVENT_PREFIX + 'mousedown',
-	EVENT_PREFIX + 'mouseenter',
-	EVENT_PREFIX + 'mouseleave',
-	EVENT_PREFIX + 'mousemove',
-	EVENT_PREFIX + 'mouseout',
-	EVENT_PREFIX + 'mouseover',
-	EVENT_PREFIX + 'mouseup',
-	EVENT_PREFIX + 'wheel',
-	EVENT_PREFIX + 'paste',
-	EVENT_PREFIX + 'pause',
-	EVENT_PREFIX + 'play',
-	EVENT_PREFIX + 'playing',
-	EVENT_PREFIX + 'progress',
-	EVENT_PREFIX + 'ratechange',
-	EVENT_PREFIX + 'reset',
-	EVENT_PREFIX + 'resize',
-	EVENT_PREFIX + 'scroll',
-	EVENT_PREFIX + 'scrollend',
-	EVENT_PREFIX + 'securitypolicyviolation',
-	EVENT_PREFIX + 'seeked',
-	EVENT_PREFIX + 'seeking',
-	EVENT_PREFIX + 'select',
-	EVENT_PREFIX + 'slotchange',
-	EVENT_PREFIX + 'stalled',
-	EVENT_PREFIX + 'submit',
-	EVENT_PREFIX + 'suspend',
-	EVENT_PREFIX + 'timeupdate',
-	EVENT_PREFIX + 'volumechange',
-	EVENT_PREFIX + 'waiting',
-	EVENT_PREFIX + 'selectstart',
-	EVENT_PREFIX + 'selectionchange',
-	EVENT_PREFIX + 'toggle',
-	EVENT_PREFIX + 'pointercancel',
-	EVENT_PREFIX + 'pointerdown',
-	EVENT_PREFIX + 'pointerup',
-	EVENT_PREFIX + 'pointermove',
-	EVENT_PREFIX + 'pointerout',
-	EVENT_PREFIX + 'pointerover',
-	EVENT_PREFIX + 'pointerenter',
-	EVENT_PREFIX + 'pointerleave',
-	EVENT_PREFIX + 'gotpointercapture',
-	EVENT_PREFIX + 'lostpointercapture',
-	EVENT_PREFIX + 'mozfullscreenchange',
-	EVENT_PREFIX + 'mozfullscreenerror',
-	EVENT_PREFIX + 'animationcancel',
-	EVENT_PREFIX + 'animationend',
-	EVENT_PREFIX + 'animationiteration',
-	EVENT_PREFIX + 'animationstart',
-	EVENT_PREFIX + 'transitioncancel',
-	EVENT_PREFIX + 'transitionend',
-	EVENT_PREFIX + 'transitionrun',
-	EVENT_PREFIX + 'transitionstart',
-	EVENT_PREFIX + 'webkitanimationend',
-	EVENT_PREFIX + 'webkitanimationiteration',
-	EVENT_PREFIX + 'webkitanimationstart',
-	EVENT_PREFIX + 'webkittransitionend',
-	EVENT_PREFIX + 'error',
-];
-
-let selector = eventAttrs.map(attr => `[${CSS.escape(attr)}]`).join(', ');
-
-const attrToProp = attr => `on${attr[EVENT_PREFIX_LENGTH].toUpperCase()}${attr.substring(EVENT_PREFIX_LENGTH + 1)}`;
-
-const attrEntriesMap = attr => [attrToProp(attr), attr];
-
-const isEventDataAttr = ([name]) => name.startsWith(DATA_PREFIX);
-
-const DATA_EVENTS = Object.fromEntries([...eventAttrs].map(attrEntriesMap));
-
-function _addListeners(el, { signal, attrFilter = EVENTS } = {}) {
-	const dataset = el.dataset;
-
-	for (const [attr, val] of Object.entries(dataset).filter(isEventDataAttr)) {
-		try {
-			const event = 'on' + attr.substring(DATA_PREFIX_LENGTH);
-
-			if (attrFilter.hasOwnProperty(event) && hasCallback(val)) {
-				el.addEventListener(event.substring(2).toLowerCase(), getCallback(val), {
-					passive: dataset.hasOwnProperty('aegisEventPassive'),
-					capture: dataset.hasOwnProperty('aegisEventCapture'),
-					once: dataset.hasOwnProperty('aegisEventOnce'),
-					signal,
-				});
-			}
-		} catch(err) {
-			console.error(err);
+function on(event, callback, { capture: capture$1 = false, passive: passive$1 = false, once: once$1 = false, signal: signal$1 } = {}) {
+	if (callback instanceof Function) {
+		return on(event, createCallback(callback), { capture: capture$1, passive: passive$1, once: once$1, signal: signal$1 });
+	} else if (typeof callback !== 'string' || callback.length === 0) {
+		throw new TypeError('Callback must be a function or a registered callback string.');
+	} else if (typeof event !== 'string' || event.length === 0) {
+		throw new TypeError('Event must be a non-empty string.');
+	} else {
+		if (! hasEventAttribute(event)) {
+			registerEventAttribute(event);
 		}
-	}
-}
-
-const observer = new MutationObserver(records => {
-	records.forEach(record  => {
-		switch(record.type) {
-			case 'childList':
-				[...record.addedNodes]
-					.filter(node => node.nodeType === Node.ELEMENT_NODE)
-					.forEach(node => attachListeners(node));
-				break;
 
-			case 'attributes':
-				if (typeof record.oldValue === 'string' && hasCallback(record.oldValue)) {
-					record.target.removeEventListener(
-						record.attributeName.substring(EVENT_PREFIX_LENGTH),
-						getCallback(record.oldValue), {
-							once: record.target.hasAttribute(once),
-							capture: record.target.hasAttribute(capture),
-							passive: record.target.hasAttribute(passive),
-						}
-					);
-				}
+		const parts = [[eventToProp(event), callback]];
 
-				if (
-					record.target.hasAttribute(record.attributeName)
-					&& hasCallback(record.target.getAttribute(record.attributeName))
-				) {
-					record.target.addEventListener(
-						record.attributeName.substring(EVENT_PREFIX_LENGTH),
-						getCallback(record.target.getAttribute(record.attributeName)), {
-							once: record.target.hasAttribute(once),
-							capture: record.target.hasAttribute(capture),
-							passive: record.target.hasAttribute(passive),
-						}
-					);
-				}
-				break;
+		if (capture$1) {
+			parts.push([capture, '']);
 		}
-	});
-});
-
-const EVENTS = { ...DATA_EVENTS, once, passive, capture };
-
-/**
- * Register an attribute to observe for adding/removing event listeners
- *
- * @param {string} attr Name of the attribute to observe
- * @param {object} options
- * @param {boolean} [options.addListeners=false] Whether or not to automatically add listeners
- * @param {Document|Element} [options.base=document.body] Root node to observe
- * @param {AbortSignal} [options.signal] An abort signal to remove any listeners when aborted
- * @returns {string} The resulting `data-*` attribute name
- */
-function registerEventAttribute(attr, {
-	addListeners = false,
-	base = document.body,
-	signal,
-} = {}) {
-	const fullAttr = EVENT_PREFIX + attr.toLowerCase();
-
-	if (! eventAttrs.includes(fullAttr)) {
-		const sel = `[${CSS.escape(fullAttr)}]`;
-		const prop = attrToProp(fullAttr);
-		eventAttrs.push(fullAttr);
-		EVENTS[prop] = fullAttr;
-		selector += `, ${sel}`;
 
-		if (addListeners) {
-			requestAnimationFrame(() => {
-				const config = { attrFilter: { [prop]: sel }, signal };
-				[base, ...base.querySelectorAll(sel)].forEach(el => _addListeners(el, config));
-			});
+		if (passive$1) {
+			parts.push([passive, '']);
 		}
-	}
-
-	return fullAttr;
-}
 
-/**
- * Add listeners to an element and its children, matching a generated query based on registered attributes
- *
- * @param {Element|Document} target Root node to add listeners from
- * @param {object} options
- * @param {AbortSignal} [options.signal] Optional signal to remove event listeners
- * @returns {Element|Document} Returns the passed target node
- */
-function attachListeners(target, { signal } = {}) {
-	const nodes = target instanceof Element && target.matches(selector)
-		? [target, ...target.querySelectorAll(selector)]
-		: target.querySelectorAll(selector);
-
-	nodes.forEach(el => _addListeners(el, { signal }));
-
-	return target;
-}
-/**
- * Add a node to the `MutationObserver` to observe attributes and add/remove event listeners
- *
- * @param {Document|Element} root Element to observe attributes on
- */
-function observeEvents(root = document) {
-	attachListeners(root);
-	observer.observe(root, {
-		subtree: true,
-		childList:true,
-		attributes: true,
-		attributeOldValue: true,
-		attributeFilter: eventAttrs,
-	});
-}
+		if (once$1) {
+			parts.push([once, '']);
+		}
 
-/**
- * Disconnects the `MutationObserver`, disabling observing of all attribute changes
- *
- * @returns {void}
- */
-const disconnectEventsObserver = () => observer.disconnect();
+		if (signal$1 instanceof AbortSignal) {
+			parts.push([signal, registerSignal(signal$1)]);
+		} else if (typeof signal$1 === 'string') {
+			parts.push([signal, signal$1]);
+		}
 
-/**
- * Register a global error handler callback
- *
- * @param {Function} callback Callback to register as a global error handler
- * @param {EventInit} config Typical event listener config object
- */
-function setGlobalErrorHandler(callback, { capture, once, passive, signal } = {}) {
-	if (callback instanceof Function) {
-		globalThis.addEventListener('error', callback, { capture, once, passive, signal });
-	} else {
-		throw new TypeError('Callback is not a function.');
+		return parts.map(([prop, val]) => `${prop}="${val}"`).join(' ');
 	}
 }
 
 exports.EVENTS = EVENTS;
 exports.FUNCS = FUNCS;
+exports.abortController = abortController;
 exports.attachListeners = attachListeners;
 exports.callCallback = callCallback;
+exports.capture = capture;
 exports.clearRegistry = clearRegistry;
 exports.closeRegistration = closeRegistration;
+exports.controller = controller;
 exports.createCallback = createCallback;
+exports.createController = createController;
 exports.disconnectEventsObserver = disconnectEventsObserver;
+exports.eventAttrs = eventAttrs;
+exports.eventToProp = eventToProp;
 exports.getCallback = getCallback;
+exports.getController = getController;
 exports.getHost = getHost;
+exports.getSignal = getSignal;
 exports.hasCallback = hasCallback;
+exports.hasEventAttribute = hasEventAttribute;
 exports.isRegistrationOpen = isRegistrationOpen;
 exports.listCallbacks = listCallbacks;
 exports.observeEvents = observeEvents;
+exports.on = on;
+exports.onAbort = onAbort;
+exports.onAnimationcancel = onAnimationcancel;
+exports.onAnimationend = onAnimationend;
+exports.onAnimationiteration = onAnimationiteration;
+exports.onAnimationstart = onAnimationstart;
+exports.onAuxclick = onAuxclick;
+exports.onBeforeinput = onBeforeinput;
+exports.onBeforetoggle = onBeforetoggle;
+exports.onBlur = onBlur;
+exports.onCancel = onCancel;
+exports.onCanplay = onCanplay;
+exports.onCanplaythrough = onCanplaythrough;
+exports.onChange = onChange;
+exports.onClick = onClick;
+exports.onClose = onClose;
+exports.onCommand = onCommand;
+exports.onContextmenu = onContextmenu;
+exports.onCopy = onCopy;
+exports.onCuechange = onCuechange;
+exports.onCut = onCut;
+exports.onDblclick = onDblclick;
+exports.onDrag = onDrag;
+exports.onDragend = onDragend;
+exports.onDragenter = onDragenter;
+exports.onDragexit = onDragexit;
+exports.onDragleave = onDragleave;
+exports.onDragover = onDragover;
+exports.onDragstart = onDragstart;
+exports.onDrop = onDrop;
+exports.onDurationchange = onDurationchange;
+exports.onEmptied = onEmptied;
+exports.onEnded = onEnded;
+exports.onError = onError;
+exports.onFocus = onFocus;
+exports.onFormdata = onFormdata;
+exports.onGotpointercapture = onGotpointercapture;
+exports.onInput = onInput;
+exports.onInvalid = onInvalid;
+exports.onKeydown = onKeydown;
+exports.onKeypress = onKeypress;
+exports.onKeyup = onKeyup;
+exports.onLoad = onLoad;
+exports.onLoadeddata = onLoadeddata;
+exports.onLoadedmetadata = onLoadedmetadata;
+exports.onLoadstart = onLoadstart;
+exports.onLostpointercapture = onLostpointercapture;
+exports.onMousedown = onMousedown;
+exports.onMouseenter = onMouseenter;
+exports.onMouseleave = onMouseleave;
+exports.onMousemove = onMousemove;
+exports.onMouseout = onMouseout;
+exports.onMouseover = onMouseover;
+exports.onMouseup = onMouseup;
+exports.onMozfullscreenchange = onMozfullscreenchange;
+exports.onMozfullscreenerror = onMozfullscreenerror;
+exports.onPaste = onPaste;
+exports.onPause = onPause;
+exports.onPlay = onPlay;
+exports.onPlaying = onPlaying;
+exports.onPointercancel = onPointercancel;
+exports.onPointerdown = onPointerdown;
+exports.onPointerenter = onPointerenter;
+exports.onPointerleave = onPointerleave;
+exports.onPointermove = onPointermove;
+exports.onPointerout = onPointerout;
+exports.onPointerover = onPointerover;
+exports.onPointerup = onPointerup;
+exports.onProgress = onProgress;
+exports.onRatechange = onRatechange;
+exports.onReset = onReset;
+exports.onResize = onResize;
+exports.onScroll = onScroll;
+exports.onScrollend = onScrollend;
+exports.onSecuritypolicyviolation = onSecuritypolicyviolation;
+exports.onSeeked = onSeeked;
+exports.onSeeking = onSeeking;
+exports.onSelect = onSelect;
+exports.onSelectionchange = onSelectionchange;
+exports.onSelectstart = onSelectstart;
+exports.onSlotchange = onSlotchange;
+exports.onStalled = onStalled;
+exports.onSubmit = onSubmit;
+exports.onSuspend = onSuspend;
+exports.onTimeupdate = onTimeupdate;
+exports.onToggle = onToggle;
+exports.onTransitioncancel = onTransitioncancel;
+exports.onTransitionend = onTransitionend;
+exports.onTransitionrun = onTransitionrun;
+exports.onTransitionstart = onTransitionstart;
+exports.onVolumechange = onVolumechange;
+exports.onWaiting = onWaiting;
+exports.onWebkitanimationend = onWebkitanimationend;
+exports.onWebkitanimationiteration = onWebkitanimationiteration;
+exports.onWebkitanimationstart = onWebkitanimationstart;
+exports.onWebkittransitionend = onWebkittransitionend;
+exports.onWheel = onWheel;
+exports.once = once;
+exports.passive = passive;
 exports.registerCallback = registerCallback;
+exports.registerController = registerController;
 exports.registerEventAttribute = registerEventAttribute;
+exports.registerSignal = registerSignal;
+exports.requestFullscreen = requestFullscreen;
 exports.setGlobalErrorHandler = setGlobalErrorHandler;
+exports.signal = signal;
+exports.toggleFullsceen = toggleFullsceen;
 exports.unregisterCallback = unregisterCallback;
+exports.unregisterController = unregisterController;
+exports.unregisterSignal = unregisterSignal;