jaandrle/deka-dom-el
1
0
Fork 0
mirror of https://github.com/jaandrle/deka-dom-el synced 2025-07-03 13:12:14 +02:00
Code Packages Releases Activity

⚡ dde and docs improvements (#27)

Browse Source 
* ⚡ 🎉

* ⚡ wip

* 🔤

* ⚡ wip

* ⚡ wip

* ⚡ Refatc signals to .get/.set syntax #26

* 🐛 Better types for on*

* 🔤

* 🔤

* 🐛 coumputed signal

* 🔤 ⚡ Docs UI/UX

* ⚡ 🔤 UI enhancements

* ⚡ (bs) (un)min

* 🔤 adds debugging

* 🔤 ssr

* 🔤

* ⚡ bs/lint

* 🔤

* 🔤 UI

* 🔤 updates texts

* 🔤UI

* ⚡ dispatch

* 🔤 events

* 🔤 elements

* 🔤 intro

* 🐛 fixes completitions for el with components

* 🐛 wrong file(s) in git

* 🔤 logo

* 🐛 🔤 types 3ps

* 🔤 ui/ux

* 🔤

* 🔤

* 🔤 scopes

* 🔤

* 🔤 ui/ux

* 🔤

* ⚡ issignal

* 🔤 improvemens

* ⚡ irelands

* 🔤 UI/UX/wording

* 🐛 npx-hint

[Scrollable region must have keyboard access | Axe Rules | Deque University | Deque Systems](https://dequeuniversity.com/rules/axe/4.10/scrollable-region-focusable?application=axeAPI)

* 🔤 logos

* ⚡ better? dts builds

* Update README.md
This commit is contained in:
Jan Andrle
2025-03-07 14:40:45 +01:00
committed by GitHub
parent dba4e93b88
commit 4366027658
110 changed files with 16261 additions and 4741 deletions
Download Patch File Download Diff File Expand all files Collapse all files

69
src/events.js
View File

@ -1,7 +1,17 @@
export { registerReactivity } from './signals-common.js';
export { registerReactivity } from './signals-lib/common.js';
import { enviroment as env, keyLTE, evc, evd, eva } from './dom-common.js';
import { oAssign, onAbort } from './helpers.js';
/**
* Creates a function to dispatch events on elements
*
* @param {string} name - Event name
* @param {Object} [options] - Event options
* @param {Element|Function} [host] - Host element or function returning host element
* @returns {Function} Function that dispatches the event
*/
export function dispatchEvent(name, options, host){
if(typeof options==="function"){ host= options; options= null; }
if(!options) options= {};
return function dispatch(element, ...d){
if(host){
@ -9,10 +19,19 @@ export function dispatchEvent(name, options, host){
element= typeof host==="function"? host() : host;
}
//TODO: what about re-emmitting?
const event= d.length ? new CustomEvent(name, Object.assign({ detail: d[0] }, options)) : new Event(name, options);
const event= d.length ? new CustomEvent(name, oAssign({ detail: d[0] }, options)) : new Event(name, options);
return element.dispatchEvent(event);
};
}
/**
* Creates a function to register event listeners on elements
*
* @param {string} event - Event name
* @param {Function} listener - Event handler
* @param {Object} [options] - Event listener options
* @returns {Function} Function that registers the listener
*/
export function on(event, listener, options){
return function registerElement(element){
element.addEventListener(event, listener, options);
@ -21,10 +40,23 @@ export function on(event, listener, options){
}
import { c_ch_o } from "./events-observer.js";
import { onAbort } from './helpers.js';
const lifeOptions= obj=> Object.assign({}, typeof obj==="object" ? obj : null, { once: true });
/**
* Prepares lifecycle event options with once:true default
* @private
*/
const lifeOptions= obj=> oAssign({}, typeof obj==="object" ? obj : null, { once: true });
//TODO: cleanUp when event before abort?
//TODO: docs (e.g.) https://nolanlawson.com/2024/01/13/web-component-gotcha-constructor-vs-connectedcallback/
/**
* Creates a function to register connected lifecycle event listeners
*
* @param {Function} listener - Event handler
* @param {Object} [options] - Event listener options
* @returns {Function} Function that registers the connected listener
*/
on.connected= function(listener, options){
options= lifeOptions(options);
return function registerElement(element){
@ -37,6 +69,14 @@ on.connected= function(listener, options){
return element;
};
};
/**
* Creates a function to register disconnected lifecycle event listeners
*
* @param {Function} listener - Event handler
* @param {Object} [options] - Event listener options
* @returns {Function} Function that registers the disconnected listener
*/
on.disconnected= function(listener, options){
options= lifeOptions(options);
return function registerElement(element){
@ -48,16 +88,35 @@ on.disconnected= function(listener, options){
return element;
};
};
/** Store for disconnect abort controllers */
const store_abort= new WeakMap();
/**
* Creates an AbortController that triggers when the element disconnects
*
* @param {Function} host - Host element or function taking an element
* @returns {AbortSignal} AbortSignal that aborts on disconnect
*/
on.disconnectedAsAbort= function(host){
if(store_abort.has(host)) return store_abort.get(host);
const a= new AbortController();
store_abort.set(host, a);
host(on.disconnected(()=> a.abort()));
return a;
return a.signal;
};
/** Store for elements with attribute observers */
const els_attribute_store= new WeakSet();
/**
* Creates a function to register attribute change event listeners
*
* @param {Function} listener - Event handler
* @param {Object} [options] - Event listener options
* @returns {Function} Function that registers the attribute change listener
*/
on.attributeChanged= function(listener, options){
if(typeof options !== "object")
options= {};