jaandrle/deka-dom-el
1
0
Fork 0
mirror of https://github.com/jaandrle/deka-dom-el synced 2024-11-21 15:39:36 +01:00
Code Packages Releases Activity

🔨 ElementExtender → ElementModifier

Browse Source
This commit is contained in:
Jan Andrle 2023-11-07 17:30:15 +01:00
parent 2c844a0ca9
commit 3866b29436
Signed by: jaandrle
GPG Key ID: B3A25AED155AFFAB
2 changed files with 14 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
index.d.ts vendored
View File

@ -1,6 +1,6 @@
declare global {
type ddeComponentAttributes= Record<any, any> | undefined | string;
type ddeElementExtender<El extends HTMLElement | SVGElement | Comment | DocumentFragment>= (element: El)=> El;
type ddeElementModifier<El extends HTMLElement | SVGElement | Comment | DocumentFragment>= (element: El)=> El;
}
type ElementTagNameMap= HTMLElementTagNameMap & { // & SVGElementTagNameMap
'#text': Text
@ -41,7 +41,7 @@ export function assign<El extends Element>(element: El, ...attrs_array: Partial<
export function el<TAG extends keyof ElementTagNameMap>(
tag_name: TAG,
attrs?: Partial<ElementAttributes<ElementTagNameMap[TAG]>>,
...extenders: ddeElementExtender<ElementTagNameMap[TAG]>[]
...modifiers: ddeElementModifier<ElementTagNameMap[TAG]>[]
): ElementTagNameMap[TAG]
export function el<T>(
tag_name?: "<>",
@ -52,36 +52,36 @@ export function el<
C extends (attr: A)=> Element | DocumentFragment>(
fComponent: C,
attrs?: A,
...extenders: ddeElementExtender<ReturnType<C>>[]
...modifiers: ddeElementModifier<ReturnType<C>>[]
): ReturnType<C>
export function el(
tag_name: string,
attrs?: Record<string, any>,
...extenders: ddeElementExtender<HTMLElement | SVGElement>[]
...modifiers: ddeElementModifier<HTMLElement | SVGElement>[]
): HTMLElement
export function dispatchEvent(element: HTMLElement, name: keyof DocumentEventMap): void;
export function dispatchEvent(element: HTMLElement, name: string, data: any): void;
interface On{
<
EE extends ddeElementExtender<Element>,
El extends ( EE extends ddeElementExtender<infer El> ? El : never ),
EE extends ddeElementModifier<Element>,
El extends ( EE extends ddeElementModifier<infer El> ? El : never ),
Event extends keyof DocumentEventMap>(
type: Event,
listener: (this: El, ev: DocumentEventMap[Event]) => any,
options?: AddEventListenerOptions
) : EE;
connected<
EE extends ddeElementExtender<Element>,
El extends ( EE extends ddeElementExtender<infer El> ? El : never )
EE extends ddeElementModifier<Element>,
El extends ( EE extends ddeElementModifier<infer El> ? El : never )
>(
listener: (el: El) => any,
options?: AddEventListenerOptions
) : EE;
disconnected<
EE extends ddeElementExtender<Element>,
El extends ( EE extends ddeElementExtender<infer El> ? El : never )
EE extends ddeElementModifier<Element>,
El extends ( EE extends ddeElementModifier<infer El> ? El : never )
>(
listener: (el: El) => any,
options?: AddEventListenerOptions
@ -91,7 +91,7 @@ export const on: On;
export const scope: {
namespace: string,
host: ddeElementExtender<any>,
host: ddeElementModifier<any>,
elNamespace: (ns: string)=> ({ append(...els: (HTMLElement | SVGElement)[]): HTMLElement | SVGElement | DocumentFragment })
};

6
src/dom.js
View File

@ -39,7 +39,7 @@ export const scope= {
},
pop(){ return scopes.pop(); },
};
export function createElement(tag, attributes, ...connect){
export function createElement(tag, attributes, ...modifiers){
const s= signals(this);
const { namespace }= scope;
let scoped= 0;
@ -50,7 +50,7 @@ export function createElement(tag, attributes, ...connect){
switch(true){
case typeof tag==="function": {
scoped= 1;
scope.push({ scope: tag, host: c=> c ? (scoped===1 ? connect.unshift(c) : c(el_host), undefined) : el_host });
scope.push({ scope: tag, host: c=> c ? (scoped===1 ? modifiers.unshift(c) : c(el_host), undefined) : el_host });
el= tag(attributes || undefined);
const is_fragment= el instanceof DocumentFragment;
const el_mark= document.createComment(`<dde:mark type="component" name="${tag.name}" host="${is_fragment ? "this" : "parentElement"}"/>`);
@ -64,7 +64,7 @@ export function createElement(tag, attributes, ...connect){
case !el: el= assign.call(this, document.createElement(tag), attributes);
}
if(!el_host) el_host= el;
connect.forEach(c=> c(el_host));
modifiers.forEach(c=> c(el_host));
if(scoped) scope.pop();
scoped= 2;
return el;