type CustomElementTagNameMap= { '#text': Text, '#comment': Comment } type SupportedElement= HTMLElementTagNameMap[keyof HTMLElementTagNameMap] | SVGElementTagNameMap[keyof SVGElementTagNameMap] | MathMLElementTagNameMap[keyof MathMLElementTagNameMap] | CustomElementTagNameMap[keyof CustomElementTagNameMap]; declare global { type ddeComponentAttributes= Record | undefined | string; type ddeElementModifier= (element: El)=> El; } type AttrsModified= { /** * Use string like in HTML (internally uses `*.setAttribute("style", *)`), or object representation (like DOM API). */ style: string | Partial /** * 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, /** * By default simiral to `className`, but also supports `string[]` * */ className: string | (string|boolean|undefined)[]; /** * Sets `aria-*` simiraly to `dataset` * */ ariaset: Record, } /** * Just element attributtes * * In most cases, you can use native propertie such as [MDN WEB/API/Element](https://developer.mozilla.org/en-US/docs/Web/API/Element) and so on (e.g. [`Text`](https://developer.mozilla.org/en-US/docs/Web/API/Text)). * * There is added support for `data[A-Z].*`/`aria[A-Z].*` to be converted to the kebab-case alternatives. * @private */ type ElementAttributes= Omit & AttrsModified; export function assign(element: El, ...attrs_array: Partial>[]): El type ExtendedHTMLElementTagNameMap= HTMLElementTagNameMap & CustomElementTagNameMap interface element{ prototype: el; append(...els: (SupportedElement | DocumentFragment | string | element)[]): el } export function el( tag_name: TAG, attrs?: string | Partial>, ...modifiers: ddeElementModifier[] ): element export function el( tag_name?: "<>", ): element export function el< A extends ddeComponentAttributes, C extends (attr: A)=> SupportedElement | DocumentFragment>( fComponent: C, attrs?: A, ...modifiers: ddeElementModifier>[] ): element> export function el( tag_name: string, attrs?: string | Record, ...modifiers: ddeElementModifier[] ): element export function elNS( namespace: "http://www.w3.org/2000/svg" ): ( tag_name: TAG, attrs?: string | Partial<{ [key in KEYS]: SVGElementTagNameMap[TAG][key] | string | number | boolean }>, ...modifiers: ddeElementModifier[] )=> element export function elNS( namespace: "http://www.w3.org/1998/Math/MathML" ): ( tag_name: TAG, attrs?: string | Partial<{ [key in KEYS]: MathMLElementTagNameMap[TAG][key] | string | number | boolean }>, ...modifiers: ddeElementModifier[] )=> element export function elNS( namespace: string ): ( tag_name: string, attrs?: string | Record, ...modifiers: ddeElementModifier[] )=> element export function dispatchEvent(element: SupportedElement, name: keyof DocumentEventMap): void; export function dispatchEvent(element: SupportedElement, name: string, data: any): void; interface On{ < EE extends ddeElementModifier, El extends ( EE extends ddeElementModifier ? El : never ), Event extends keyof DocumentEventMap>( type: Event, listener: (this: El, ev: DocumentEventMap[Event]) => any, options?: AddEventListenerOptions ) : EE; connected< EE extends ddeElementModifier, El extends ( EE extends ddeElementModifier ? El : never ) >( listener: (el: El) => any, options?: AddEventListenerOptions ) : EE; disconnected< EE extends ddeElementModifier, El extends ( EE extends ddeElementModifier ? El : never ) >( listener: (el: El) => any, options?: AddEventListenerOptions ) : EE; } export const on: On; export const scope: { host: ddeElementModifier, };