diff --git a/index.d.ts b/index.d.ts index 42c559d..af12b5e 100644 --- a/index.d.ts +++ b/index.d.ts @@ -1,4 +1,4 @@ -import { Signal } from "./signals"; +declare global{ /* ddeSignal */ } type CustomElementTagNameMap= { '#text': Text, '#comment': Comment } type SupportedElement= @@ -15,20 +15,20 @@ type AttrsModified= { /** * Use string like in HTML (internally uses `*.setAttribute("style", *)`), or object representation (like DOM API). */ - style: string | Partial | Signal | Partial<{ [K in keyof CSSStyleDeclaration]: Signal }> + style: string | Partial | ddeSignal | Partial<{ [K in keyof CSSStyleDeclaration]: ddeSignal }> /** * 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>, + classList: Record>, /** * By default simiral to `className`, but also supports `string[]` * */ - className: string | (string|boolean|undefined|Signal)[]; + className: string | (string|boolean|undefined|ddeSignal)[]; /** * Sets `aria-*` simiraly to `dataset` * */ - ariaset: Record>, -} & Record<`=${string}` | `data${PascalCase}` | `aria${PascalCase}`, string|Signal> & Record<`.${string}`, any> + ariaset: Record>, +} & Record<`=${string}` | `data${PascalCase}` | `aria${PascalCase}`, string|ddeSignal> & Record<`.${string}`, any> type _fromElsInterfaces= Omit; /** * Just element attributtes @@ -38,15 +38,15 @@ type _fromElsInterfaces= Omit= Partial<_fromElsInterfaces & { [K in keyof _fromElsInterfaces]: Signal<_fromElsInterfaces[K], any> } & AttrsModified> & Record; +type ElementAttributes= Partial<{ [K in keyof _fromElsInterfaces]: _fromElsInterfaces[K] | ddeSignal<_fromElsInterfaces[K]> } & AttrsModified> & Record; export function classListDeclarative(element: El, classList: AttrsModified["classList"]): El export function assign(element: El, ...attrs_array: ElementAttributes[]): El export function assignAttribute>(element: El, attr: ATT, value: ElementAttributes[ATT]): ElementAttributes[ATT] type ExtendedHTMLElementTagNameMap= HTMLElementTagNameMap & CustomElementTagNameMap; -type textContent= string | ( (set?: string)=> string ); // TODO: for some reason `Signal` leads to `attrs?: any` +type textContent= string | ddeSignal; export function el< - TAG extends keyof ExtendedHTMLElementTagNameMap & string, + TAG extends keyof ExtendedHTMLElementTagNameMap, EL extends (TAG extends keyof ExtendedHTMLElementTagNameMap ? ExtendedHTMLElementTagNameMap[TAG] : HTMLElement) >( tag_name: TAG, @@ -56,6 +56,11 @@ export function el< export function el( tag_name?: "<>", ): ddeDocumentFragment +export function el( + tag_name: string, + attrs?: ElementAttributes, + ...addons: ddeElementAddon[] +): ddeHTMLElement export function el< C extends (attr: ddeComponentAttributes)=> SupportedElement | ddeDocumentFragment @@ -83,7 +88,7 @@ export function elNS( EL extends ( TAG extends keyof MathMLElementTagNameMap ? MathMLElementTagNameMap[TAG] : MathMLElement ), >( tag_name: TAG, - attrs?: string | textContent | Partial<{ [key in keyof EL]: EL[key] | Signal | string | number | boolean }>, + attrs?: string | textContent | Partial<{ [key in keyof EL]: EL[key] | ddeSignal | string | number | boolean }>, ...addons: ddeElementAddon[] )=> ddeMathMLElement export function elNS( @@ -124,7 +129,7 @@ interface On{ EE extends ddeElementAddon, El extends ( EE extends ddeElementAddon ? El : never ) >( - listener: (this: El, event: CustomEvent) => any, + listener: (this: El, event: CustomEvent) => any, options?: AddEventListenerOptions ) : EE; /** Listens to the element is disconnected from the live DOM. In case of custom elements uses [`disconnectedCallback`](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements#custom_element_lifecycle_callbacks), or {@link MutationObserver} else where */ @@ -159,7 +164,7 @@ export const scope: { * It can be also used to register Addon(s) (functions to be called when component is initized) * — `scope.host(on.connected(console.log))`. * */ - host: (...addons: ddeElementAddon[])=> HTMLElement, + host: (...addons: ddeElementAddon[])=> HTMLElement, state: Scope[], /** Adds new child scope. All attributes are inherited by default. */ @@ -176,11 +181,11 @@ export function customElementRender< >( custom_element: EL, target: ShadowRoot | EL, - render: (props: P)=> SupportedElement, + render: (props: P)=> SupportedElement | DocumentFragment, props?: P | ((...args: any[])=> P) ): EL -export function customElementWithDDE(custom_element: EL): EL -export function lifecyclesToEvents(custom_element: EL): EL +export function customElementWithDDE HTMLElement)>(custom_element: EL): EL +export function lifecyclesToEvents HTMLElement)>(custom_element: EL): EL export function observedAttributes(custom_element: HTMLElement): Record /* TypeScript MEH */ diff --git a/signals.d.ts b/signals.d.ts index 753ec07..517f83b 100644 --- a/signals.d.ts +++ b/signals.d.ts @@ -6,6 +6,10 @@ type Actions= Record>; type OnListenerOptions= Pick & { first_time?: boolean }; interface signal{ _: Symbol + /** + * Computations signal. This creates a signal which is computed from other signals. + * */ + any>(computation: V): Signal, {}> /** * Simple example: * ```js @@ -31,10 +35,6 @@ interface signal{ * by `S.clear`. * */ >(value: V, actions?: A): Signal; - /** - * Computations signal. This creates a signal which is computed from other signals. - * */ - (computation: ()=> V): Signal action>, A extends (S extends Signal ? A : never), N extends keyof A>( signal: S, name: N,