1
0
mirror of https://github.com/jaandrle/deka-dom-el synced 2025-07-01 04:12:14 +02:00

docs + readme

This commit is contained in:
2023-11-07 21:58:48 +01:00
parent 3866b29436
commit caa4cd84ed
17 changed files with 106 additions and 461 deletions

Binary file not shown.

File diff suppressed because one or more lines are too long

BIN
dist/dde.gzip.js vendored

Binary file not shown.

6
dist/dde.js vendored

File diff suppressed because one or more lines are too long

View File

@ -1,8 +1,8 @@
declare global {
type ddeComponentAttributes= Record<any, any> | undefined | string;
type ddeElementExtender<El extends Element>= (element: El)=> El;
type ddeElementModifier<El extends HTMLElement | SVGElement | Comment | DocumentFragment>= (element: El)=> El;
}
type ElementTagNameMap= HTMLElementTagNameMap & SVGElementTagNameMap & {
type ElementTagNameMap= HTMLElementTagNameMap & { // & SVGElementTagNameMap
'#text': Text
}
type Element= ElementTagNameMap[keyof ElementTagNameMap];
@ -14,7 +14,7 @@ type AttrsModified= {
/**
* Provide option to add/remove/toggle CSS clasess (index of object) using 1/0/-1. In fact `el.classList.toggle(class_name)` for `-1` and `el.classList.toggle(class_name, Boolean(...))` for others.
*/
classList: Record<string,-1|0|1>,
classList: Record<string,-1|0|1|boolean>,
/**
* By default simiral to `className`, but also supports `string[]`
* */
@ -40,45 +40,55 @@ 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?: "<>",
): DocumentFragment
export function el<
A extends ddeComponentAttributes,
C extends (attr: A)=> Element>(
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>,
...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
) : EE;
}
export const on: On;
export const scope: {
namespace: string,
host: ddeElementModifier<any>,
elNamespace: (ns: string)=> ({ append(...els: (HTMLElement | SVGElement)[]): HTMLElement | SVGElement | DocumentFragment })
};
//TODO for SVG
declare global{
interface HTMLDivElement{ append(...nodes: (Node | string)[]): HTMLDivElement; }

Binary file not shown.

File diff suppressed because one or more lines are too long

34
dist/esm.d.ts vendored
View File

@ -1,8 +1,8 @@
declare global {
type ddeComponentAttributes= Record<any, any> | undefined | string;
type ddeElementExtender<El extends Element>= (element: El)=> El;
type ddeElementModifier<El extends HTMLElement | SVGElement | Comment | DocumentFragment>= (element: El)=> El;
}
type ElementTagNameMap= HTMLElementTagNameMap & SVGElementTagNameMap & {
type ElementTagNameMap= HTMLElementTagNameMap & { // & SVGElementTagNameMap
'#text': Text
}
type Element= ElementTagNameMap[keyof ElementTagNameMap];
@ -14,7 +14,7 @@ type AttrsModified= {
/**
* Provide option to add/remove/toggle CSS clasess (index of object) using 1/0/-1. In fact `el.classList.toggle(class_name)` for `-1` and `el.classList.toggle(class_name, Boolean(...))` for others.
*/
classList: Record<string,-1|0|1>,
classList: Record<string,-1|0|1|boolean>,
/**
* By default simiral to `className`, but also supports `string[]`
* */
@ -40,45 +40,55 @@ 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?: "<>",
): DocumentFragment
export function el<
A extends ddeComponentAttributes,
C extends (attr: A)=> Element>(
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>,
...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
) : EE;
}
export const on: On;
export const scope: {
namespace: string,
host: ddeElementModifier<any>,
elNamespace: (ns: string)=> ({ append(...els: (HTMLElement | SVGElement)[]): HTMLElement | SVGElement | DocumentFragment })
};
//TODO for SVG
declare global{
interface HTMLDivElement{ append(...nodes: (Node | string)[]): HTMLDivElement; }

BIN
dist/esm.gzip.js vendored

Binary file not shown.

2
dist/esm.js vendored

File diff suppressed because one or more lines are too long