@tempots/dom 28.6.2 → 29.0.0

package/renderable/element.d.ts

@@ -64,6 +64,7 @@ export declare const html: {
     dt: (...children: TNode[]) => Renderable;
     em: (...children: TNode[]) => Renderable;
     embed: (...children: TNode[]) => Renderable;
+    fencedframe: (...children: TNode[]) => Renderable;
     fieldset: (...children: TNode[]) => Renderable;
     figcaption: (...children: TNode[]) => Renderable;
     figure: (...children: TNode[]) => Renderable;
@@ -93,6 +94,7 @@ export declare const html: {
     main: (...children: TNode[]) => Renderable;
     map: (...children: TNode[]) => Renderable;
     mark: (...children: TNode[]) => Renderable;
+    menu: (...children: TNode[]) => Renderable;
     meta: (...children: TNode[]) => Renderable;
     meter: (...children: TNode[]) => Renderable;
     nav: (...children: TNode[]) => Renderable;
@@ -105,6 +107,7 @@ export declare const html: {
     p: (...children: TNode[]) => Renderable;
     param: (...children: TNode[]) => Renderable;
     picture: (...children: TNode[]) => Renderable;
+    portal: (...children: TNode[]) => Renderable;
     pre: (...children: TNode[]) => Renderable;
     progress: (...children: TNode[]) => Renderable;
     q: (...children: TNode[]) => Renderable;
@@ -114,6 +117,7 @@ export declare const html: {
     s: (...children: TNode[]) => Renderable;
     samp: (...children: TNode[]) => Renderable;
     script: (...children: TNode[]) => Renderable;
+    search: (...children: TNode[]) => Renderable;
     section: (...children: TNode[]) => Renderable;
     select: (...children: TNode[]) => Renderable;
     slot: (...children: TNode[]) => Renderable;
@@ -157,26 +161,26 @@ export declare const html: {
  */
 export declare const input: {
     number: (...children: TNode[]) => Renderable;
+    date: (...children: TNode[]) => Renderable;
+    time: (...children: TNode[]) => Renderable;
     text: (...children: TNode[]) => Renderable;
     color: (...children: TNode[]) => Renderable;
     hidden: (...children: TNode[]) => Renderable;
     button: (...children: TNode[]) => Renderable;
     search: (...children: TNode[]) => Renderable;
-    time: (...children: TNode[]) => Renderable;
     image: (...children: TNode[]) => Renderable;
     reset: (...children: TNode[]) => Renderable;
     submit: (...children: TNode[]) => Renderable;
+    tel: (...children: TNode[]) => Renderable;
+    email: (...children: TNode[]) => Renderable;
+    url: (...children: TNode[]) => Renderable;
     checkbox: (...children: TNode[]) => Renderable;
     radio: (...children: TNode[]) => Renderable;
     file: (...children: TNode[]) => Renderable;
     password: (...children: TNode[]) => Renderable;
-    date: (...children: TNode[]) => Renderable;
     range: (...children: TNode[]) => Renderable;
     month: (...children: TNode[]) => Renderable;
     week: (...children: TNode[]) => Renderable;
-    email: (...children: TNode[]) => Renderable;
-    tel: (...children: TNode[]) => Renderable;
-    url: (...children: TNode[]) => Renderable;
     "datetime-local": (...children: TNode[]) => Renderable;
 };
 /**
@@ -246,18 +250,20 @@ export declare const svg: {
     title: (...children: TNode[]) => Renderable;
     tspan: (...children: TNode[]) => Renderable;
     use: (...children: TNode[]) => Renderable;
+    view: (...children: TNode[]) => Renderable;
 };
 /**
  * A convenience object to create Renderables for MATH elements.
  * @public
  */
 export declare const math: {
-    annotation_xml: (...children: TNode[]) => Renderable;
+    'annotation-xml': (...children: TNode[]) => Renderable;
     annotation: (...children: TNode[]) => Renderable;
     maction: (...children: TNode[]) => Renderable;
     maligngroup: (...children: TNode[]) => Renderable;
     malignmark: (...children: TNode[]) => Renderable;
     math: (...children: TNode[]) => Renderable;
+    menclose: (...children: TNode[]) => Renderable;
     merror: (...children: TNode[]) => Renderable;
     mfenced: (...children: TNode[]) => Renderable;
     mfrac: (...children: TNode[]) => Renderable;
@@ -271,6 +277,7 @@ export declare const math: {
     mover: (...children: TNode[]) => Renderable;
     mpadded: (...children: TNode[]) => Renderable;
     mphantom: (...children: TNode[]) => Renderable;
+    mprescripts: (...children: TNode[]) => Renderable;
     mroot: (...children: TNode[]) => Renderable;
     mrow: (...children: TNode[]) => Renderable;
     ms: (...children: TNode[]) => Renderable;

package/renderable/on.d.ts

@@ -64,11 +64,15 @@ export declare const OnChecked: (fn: (event: boolean, ctx: DOMContext) => void)
  */
 export declare const on: {
     abort: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    afterprint: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     animationcancel: (handler: (event: AnimationEvent, ctx: DOMContext) => void) => Renderable;
     animationend: (handler: (event: AnimationEvent, ctx: DOMContext) => void) => Renderable;
     animationiteration: (handler: (event: AnimationEvent, ctx: DOMContext) => void) => Renderable;
     animationstart: (handler: (event: AnimationEvent, ctx: DOMContext) => void) => Renderable;
     auxclick: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
+    beforeinput: (handler: (event: InputEvent, ctx: DOMContext) => void) => Renderable;
+    beforeprint: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    beforeunload: (handler: (event: BeforeUnloadEvent, ctx: DOMContext) => void) => Renderable;
     blur: (handler: (event: FocusEvent, ctx: DOMContext) => void) => Renderable;
     cancel: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     canplay: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
@@ -76,8 +80,13 @@ export declare const on: {
     change: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     click: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
     close: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    compositionend: (handler: (event: CompositionEvent, ctx: DOMContext) => void) => Renderable;
+    compositionstart: (handler: (event: CompositionEvent, ctx: DOMContext) => void) => Renderable;
+    compositionupdate: (handler: (event: CompositionEvent, ctx: DOMContext) => void) => Renderable;
     contextmenu: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
+    copy: (handler: (event: ClipboardEvent, ctx: DOMContext) => void) => Renderable;
     cuechange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    cut: (handler: (event: ClipboardEvent, ctx: DOMContext) => void) => Renderable;
     dblclick: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
     drag: (handler: (event: DragEvent, ctx: DOMContext) => void) => Renderable;
     dragend: (handler: (event: DragEvent, ctx: DOMContext) => void) => Renderable;
@@ -94,18 +103,25 @@ export declare const on: {
     focus: (handler: (event: FocusEvent, ctx: DOMContext) => void) => Renderable;
     focusin: (handler: (event: FocusEvent, ctx: DOMContext) => void) => Renderable;
     focusout: (handler: (event: FocusEvent, ctx: DOMContext) => void) => Renderable;
+    formdata: (handler: (event: FormDataEvent, ctx: DOMContext) => void) => Renderable;
+    fullscreenchange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    fullscreenerror: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     gotpointercapture: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
+    hashchange: (handler: (event: HashChangeEvent, ctx: DOMContext) => void) => Renderable;
     input: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     invalid: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     keydown: (handler: (event: KeyboardEvent, ctx: DOMContext) => void) => Renderable;
     keypress: (handler: (event: KeyboardEvent, ctx: DOMContext) => void) => Renderable;
     keyup: (handler: (event: KeyboardEvent, ctx: DOMContext) => void) => Renderable;
+    languagechange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     load: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     loadeddata: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     loadedmetadata: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     loadend: (handler: (event: ProgressEvent<EventTarget>, ctx: DOMContext) => void) => Renderable;
     loadstart: (handler: (event: ProgressEvent<EventTarget>, ctx: DOMContext) => void) => Renderable;
     lostpointercapture: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
+    message: (handler: (event: MessageEvent<any>, ctx: DOMContext) => void) => Renderable;
+    messageerror: (handler: (event: MessageEvent<any>, ctx: DOMContext) => void) => Renderable;
     mousedown: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
     mouseenter: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
     mouseleave: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
@@ -113,6 +129,12 @@ export declare const on: {
     mouseout: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
     mouseover: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
     mouseup: (handler: (event: MouseEvent, ctx: DOMContext) => void) => Renderable;
+    offline: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    online: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    orientationchange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    pagehide: (handler: (event: PageTransitionEvent, ctx: DOMContext) => void) => Renderable;
+    pageshow: (handler: (event: PageTransitionEvent, ctx: DOMContext) => void) => Renderable;
+    paste: (handler: (event: ClipboardEvent, ctx: DOMContext) => void) => Renderable;
     pause: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     play: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     playing: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
@@ -120,23 +142,32 @@ export declare const on: {
     pointerdown: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
     pointerenter: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
     pointerleave: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
+    pointerlockchange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    pointerlockerror: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     pointermove: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
     pointerout: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
     pointerover: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
+    pointerrawupdate: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
     pointerup: (handler: (event: PointerEvent, ctx: DOMContext) => void) => Renderable;
+    popstate: (handler: (event: PopStateEvent, ctx: DOMContext) => void) => Renderable;
     progress: (handler: (event: ProgressEvent<EventTarget>, ctx: DOMContext) => void) => Renderable;
     ratechange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    readystatechange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    rejectionhandled: (handler: (event: PromiseRejectionEvent, ctx: DOMContext) => void) => Renderable;
     reset: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     resize: (handler: (event: UIEvent, ctx: DOMContext) => void) => Renderable;
     scroll: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    scrollend: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     securitypolicyviolation: (handler: (event: SecurityPolicyViolationEvent, ctx: DOMContext) => void) => Renderable;
     seeked: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     seeking: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     select: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     selectionchange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     selectstart: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    slotchange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     stalled: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
-    submit: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    storage: (handler: (event: StorageEvent, ctx: DOMContext) => void) => Renderable;
+    submit: (handler: (event: SubmitEvent, ctx: DOMContext) => void) => Renderable;
     suspend: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     timeupdate: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     toggle: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
@@ -148,9 +179,47 @@ export declare const on: {
     transitionend: (handler: (event: TransitionEvent, ctx: DOMContext) => void) => Renderable;
     transitionrun: (handler: (event: TransitionEvent, ctx: DOMContext) => void) => Renderable;
     transitionstart: (handler: (event: TransitionEvent, ctx: DOMContext) => void) => Renderable;
+    unhandledrejection: (handler: (event: PromiseRejectionEvent, ctx: DOMContext) => void) => Renderable;
+    unload: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    visibilitychange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     volumechange: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
     waiting: (handler: (event: Event, ctx: DOMContext) => void) => Renderable;
+    wheel: (handler: (event: WheelEvent, ctx: DOMContext) => void) => Renderable;
 };
+/**
+ * Options for event handlers.
+ *
+ * @public
+ */
+export type EmitOptions = {
+    preventDefault?: boolean;
+    stopPropagation?: boolean;
+    stopImmediatePropagation?: boolean;
+};
+/**
+ * Creates an event handler that calls the provided function with the event as an argument.
+ * @param fn - The function to call when the event is triggered.
+ * @returns An event handler function that can be used with event listeners.
+ * @public
+ */
+export declare const emit: (fn: (event: Event) => void, options?: EmitOptions) => (event: Event) => void;
+/**
+ * Creates an event handler that extracts and emits the target element from an event.
+ *
+ * @example
+ * ```typescript
+ * html.input(
+ *   on.input(emitTarget((input) => {
+ *     console.log('Input value:', input.value)
+ *   }))
+ * )
+ * ```
+ *
+ * @param fn - Callback function that receives the target element
+ * @returns Event handler function that can be used with event listeners
+ * @public
+ */
+export declare const emitTarget: <EL extends HTMLElement>(fn: (element: EL, event: Event) => void, options?: EmitOptions) => (event: Event) => void;
 /**
  * Creates an event handler that extracts and emits the string value from an input element.
  *
@@ -185,7 +254,7 @@ export declare const on: {
  * @returns Event handler function that can be used with event listeners
  * @public
  */
-export declare const emitValue: (fn: (text: string) => void) => (event: Event) => void;
+export declare const emitValue: (fn: (text: string, event: Event) => void, options?: EmitOptions) => (event: Event) => void;
 /**
  * Creates an event handler that extracts and emits the numeric value from an input element.
  *
@@ -226,35 +295,35 @@ export declare const emitValue: (fn: (text: string) => void) => (event: Event) =
  * @returns Event handler function that can be used with event listeners
  * @public
  */
-export declare const emitValueAsNumber: (fn: (num: number) => void) => (event: Event) => void;
+export declare const emitValueAsNumber: (fn: (num: number, event: Event) => void, options?: EmitOptions) => (event: Event) => void;
 /**
  * Converts the value of an HTML input element to a Date object and emits it using the provided callback function.
  * @param fn - The callback function to be called with the converted Date object.
  * @returns A function that can be used as an event handler for input events.
  * @public
  */
-export declare const emitValueAsDate: (fn: (date: Date) => void) => (event: Event) => void;
+export declare const emitValueAsDate: (fn: (date: Date, event: Event) => void, options?: EmitOptions) => (event: Event) => void;
 /**
  * Converts the value of an HTML input element to a Date object or null and emits it using the provided callback function.
  * @param fn - The callback function to be called with the converted Date object or null.
  * @returns A function that can be used as an event handler for input events.
  * @public
  */
-export declare const emitValueAsNullableDate: (fn: (date: Date | null) => void) => (event: Event) => void;
+export declare const emitValueAsNullableDate: (fn: (date: Date | null, event: Event) => void, options?: EmitOptions) => (event: Event) => void;
 /**
  * Emits the value of an HTMLInputElement as a Date object.
  * @param fn - The callback function to be called with the emitted Date object.
  * @returns The event handler function.
  * @public
  */
-export declare const emitValueAsDateTime: (fn: (date: Date) => void) => (event: Event) => void;
+export declare const emitValueAsDateTime: (fn: (date: Date, event: Event) => void, options?: EmitOptions) => (event: Event) => void;
 /**
  * Emits the value of an HTMLInputElement as a Date object or null.
  * @param fn - The callback function to be called with the emitted Date object or null.
  * @returns The event handler function.
  * @public
  */
-export declare const emitValueAsNullableDateTime: (fn: (date: Date | null) => void) => (event: Event) => void;
+export declare const emitValueAsNullableDateTime: (fn: (date: Date | null, event: Event) => void, options?: EmitOptions) => (event: Event) => void;
 /**
  * Creates an event handler that extracts and emits the checked state from a checkbox or radio input.
  *
@@ -307,25 +376,4 @@ export declare const emitValueAsNullableDateTime: (fn: (date: Date | null) => vo
  * @returns Event handler function that can be used with event listeners
  * @public
  */
-export declare const emitChecked: (fn: (checked: boolean) => void) => (event: Event) => void;
-/**
- * Wraps a function to prevent the default behavior of an event before invoking it.
- * @param fn - The function to be wrapped.
- * @returns A new function that prevents the default behavior of the event and then invokes the original function.
- * @public
- */
-export declare const emitPreventDefault: (fn: () => void) => (event: Event) => void;
-/**
- * Creates a new event handler that stops event propagation and invokes the provided function.
- * @param fn - The function to be invoked when the event is triggered.
- * @returns A new event handler function.
- * @public
- */
-export declare const emitStopPropagation: (fn: () => void) => (event: Event) => void;
-/**
- * Creates an event handler that stops immediate propagation of the event and invokes the provided function.
- * @param fn - The function to be invoked.
- * @returns The event handler function.
- * @public
- */
-export declare const emitStopImmediatePropagation: (fn: () => void) => (event: Event) => void;
+export declare const emitChecked: (fn: (checked: boolean, event: Event) => void, options?: EmitOptions) => (event: Event) => void;

package/renderable/style.d.ts

@@ -4,6 +4,8 @@ import { NValue, Renderable } from '../types/domain';
  * @public
  */
 export declare const style: {
+    page: (value: NValue<string>) => Renderable;
+    grid: (value: NValue<string>) => Renderable;
     all: (value: NValue<string>) => Renderable;
     accentColor: (value: NValue<string>) => Renderable;
     alignContent: (value: NValue<string>) => Renderable;
@@ -190,7 +192,6 @@ export declare const style: {
     fontWeight: (value: NValue<string>) => Renderable;
     forcedColorAdjust: (value: NValue<string>) => Renderable;
     gap: (value: NValue<string>) => Renderable;
-    grid: (value: NValue<string>) => Renderable;
     gridArea: (value: NValue<string>) => Renderable;
     gridAutoColumns: (value: NValue<string>) => Renderable;
     gridAutoFlow: (value: NValue<string>) => Renderable;
@@ -308,7 +309,6 @@ export declare const style: {
     paddingLeft: (value: NValue<string>) => Renderable;
     paddingRight: (value: NValue<string>) => Renderable;
     paddingTop: (value: NValue<string>) => Renderable;
-    page: (value: NValue<string>) => Renderable;
     pageBreakAfter: (value: NValue<string>) => Renderable;
     pageBreakBefore: (value: NValue<string>) => Renderable;
     pageBreakInside: (value: NValue<string>) => Renderable;

package/types/aria-attributes.d.ts

@@ -7,24 +7,28 @@ export type AriaAttributes = {
     activedescendant: string;
     atomic: boolean;
     autocomplete: 'none' | 'inline' | 'list' | 'both';
+    braillelabel: string;
+    brailleroledescription: string;
     busy: boolean;
     checked: boolean | 'mixed';
     colcount: number;
     colindex: number;
+    colindextext: string;
     colspan: number;
     controls: string;
-    current: string;
+    current: 'page' | 'step' | 'location' | 'date' | 'time' | 'true' | 'false' | string;
     describedby: string;
+    description: string;
     details: string;
     disabled: boolean;
     dropeffect: 'none' | 'copy' | 'execute' | 'link' | 'move' | 'popup';
     errormessage: string;
-    expanded: boolean;
+    expanded: boolean | 'undefined';
     flowto: string;
     grabbed: boolean;
-    haspopup: boolean;
-    hidden: boolean;
-    invalid: boolean | 'grammar' | 'spelling';
+    haspopup: boolean | 'false' | 'true' | 'menu' | 'listbox' | 'tree' | 'grid' | 'dialog';
+    hidden: boolean | 'undefined';
+    invalid: boolean | 'false' | 'true' | 'grammar' | 'spelling';
     keyshortcuts: string;
     label: string;
     labelledby: string;
@@ -33,19 +37,20 @@ export type AriaAttributes = {
     modal: boolean;
     multiline: boolean;
     multiselectable: boolean;
-    orientation: 'horizontal' | 'vertical';
+    orientation: 'horizontal' | 'vertical' | 'undefined';
     owns: string;
     placeholder: string;
     posinset: number;
-    pressed: boolean | 'mixed';
+    pressed: boolean | 'mixed' | 'undefined';
     readonly: boolean;
-    relevant: 'additions' | 'removals' | 'text' | 'all';
+    relevant: 'additions' | 'removals' | 'text' | 'all' | string;
     required: boolean;
     roledescription: string;
     rowcount: number;
     rowindex: number;
+    rowindextext: string;
     rowspan: number;
-    selected: boolean;
+    selected: boolean | 'undefined';
     setsize: number;
     sort: 'none' | 'ascending' | 'descending' | 'other';
     valuemax: number;

package/types/domain.d.ts

@@ -1,5 +1,5 @@
 import { DOMContext } from '../dom/dom-context';
-import { Computed, Prop, Signal } from '../std/signal';
+import { AnySignal, Computed, Prop, Signal } from '../std/signal';
 import { Value } from '../std/value';
 /**
  * A function that renders content into the DOM and returns a cleanup function.
@@ -149,13 +149,14 @@ export type Size = {
      */
     readonly height: number;
 };
-type WithNullish<X> = Value<X> | Value<X | null> | Value<X | undefined> | Value<X | null | undefined>;
 /**
  * Represents a nullable value or a signal of a nullable value.
  * @typeParam T - The type of the value.
  * @public
  */
-export type NValue<T> = WithNullish<T> | null | undefined;
+export type NValue<T> = Value<NonNullable<T>> | AnySignal<T> | AnySignal<T | null> | AnySignal<T | undefined> | AnySignal<T | null | undefined> | null | undefined;
+type TupleToUnion<T extends unknown[]> = T[number];
+export type SplitNValue<T> = (T extends unknown ? TupleToUnion<NValue<T>[]> : never) | NValue<T>;
 /**
  * Gets the value type of a given Value type.
  * If the type is a `Signal`, it returns the inferred value type.

package/types/html-attributes.d.ts

@@ -9,13 +9,19 @@ export type HTMLAttributes = {
     accesskey: string;
     action: string;
     align: string;
+    allow: string;
+    allowfullscreen: boolean;
+    allowpaymentrequest: boolean;
     alt: string;
+    as: string;
     async: boolean;
+    autocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
     autocomplete: string;
     autofocus: boolean;
     autoplay: boolean;
     bgcolor: string;
     border: string;
+    capture: boolean | 'user' | 'environment';
     charset: string;
     checked: boolean;
     cite: string;
@@ -24,40 +30,57 @@ export type HTMLAttributes = {
     cols: number;
     colspan: number;
     content: string;
-    contenteditable: boolean;
+    contenteditable: boolean | 'true' | 'false' | 'plaintext-only';
     controls: string;
     coords: string;
+    crossorigin: 'anonymous' | 'use-credentials' | '';
     data: string;
     datetime: string;
+    decoding: 'sync' | 'async' | 'auto';
     default: string;
     defer: string;
-    dir: string;
+    dir: 'ltr' | 'rtl' | 'auto';
     dirname: string;
     disabled: boolean;
     download: string;
-    draggable: string;
+    draggable: boolean | 'true' | 'false';
     dropzone: string;
     enctype: string;
+    enterkeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
     for: string;
     form: string;
     formaction: string;
+    formenctype: string;
+    formmethod: string;
+    formnovalidate: boolean;
+    formtarget: string;
     headers: string;
     height: string;
-    hidden: 'until-found' | 'hidden' | '';
+    hidden: 'until-found' | 'hidden' | '' | boolean;
     high: string;
     href: string;
     hreflang: string;
     'http-equiv': string;
     icon: string;
     id: string;
+    imagesizes: string;
+    imagesrcset: string;
+    inputmode: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
+    integrity: string;
+    is: string;
     ismap: string;
+    itemid: string;
     itemprop: string;
+    itemref: string;
+    itemscope: boolean;
+    itemtype: string;
     keytype: string;
     kind: string;
     label: string;
     lang: string;
     language: string;
     list: string;
+    loading: 'eager' | 'lazy';
     loop: string;
     low: string;
     manifest: string;
@@ -68,17 +91,25 @@ export type HTMLAttributes = {
     min: number;
     minlength: number;
     multiple: boolean;
+    muted: boolean;
     name: string;
+    nonce: string;
     novalidate: string;
     open: string;
     optimum: string;
+    part: string;
     pattern: string;
     ping: string;
     placeholder: string;
+    playsinline: boolean;
+    popover: 'auto' | 'manual' | '';
+    popovertarget: string;
+    popovertargetaction: 'hide' | 'show' | 'toggle';
     poster: string;
     preload: string;
     radiogroup: string;
     readonly: boolean;
+    referrerpolicy: 'no-referrer' | 'no-referrer-when-downgrade' | 'origin' | 'origin-when-cross-origin' | 'same-origin' | 'strict-origin' | 'strict-origin-when-cross-origin' | 'unsafe-url';
     rel: string;
     required: string;
     reversed: string;
@@ -93,8 +124,9 @@ export type HTMLAttributes = {
     shape: string;
     size: number;
     sizes: string;
+    slot: string;
     span: string;
-    spellcheck: string;
+    spellcheck: boolean | 'true' | 'false';
     src: string;
     srcdoc: string;
     srclang: string;
@@ -105,7 +137,7 @@ export type HTMLAttributes = {
     tabindex: number;
     target: string;
     title: string;
-    translate: string;
+    translate: 'yes' | 'no';
     type: string;
     usemap: string;
     value: string;

package/types/html-events.d.ts

@@ -5,11 +5,15 @@
  */
 export type HTMLEvents = {
     abort: Event;
+    afterprint: Event;
     animationcancel: AnimationEvent;
     animationend: AnimationEvent;
     animationiteration: AnimationEvent;
     animationstart: AnimationEvent;
     auxclick: MouseEvent;
+    beforeinput: InputEvent;
+    beforeprint: Event;
+    beforeunload: BeforeUnloadEvent;
     blur: FocusEvent;
     cancel: Event;
     canplay: Event;
@@ -17,8 +21,13 @@ export type HTMLEvents = {
     change: Event;
     click: MouseEvent;
     close: Event;
+    compositionend: CompositionEvent;
+    compositionstart: CompositionEvent;
+    compositionupdate: CompositionEvent;
     contextmenu: MouseEvent;
+    copy: ClipboardEvent;
     cuechange: Event;
+    cut: ClipboardEvent;
     dblclick: MouseEvent;
     drag: DragEvent;
     dragend: DragEvent;
@@ -35,18 +44,25 @@ export type HTMLEvents = {
     focus: FocusEvent;
     focusin: FocusEvent;
     focusout: FocusEvent;
+    formdata: FormDataEvent;
+    fullscreenchange: Event;
+    fullscreenerror: Event;
     gotpointercapture: PointerEvent;
+    hashchange: HashChangeEvent;
     input: Event;
     invalid: Event;
     keydown: KeyboardEvent;
     keypress: KeyboardEvent;
     keyup: KeyboardEvent;
+    languagechange: Event;
     load: Event;
     loadeddata: Event;
     loadedmetadata: Event;
     loadend: ProgressEvent;
     loadstart: ProgressEvent;
     lostpointercapture: PointerEvent;
+    message: MessageEvent;
+    messageerror: MessageEvent;
     mousedown: MouseEvent;
     mouseenter: MouseEvent;
     mouseleave: MouseEvent;
@@ -54,6 +70,12 @@ export type HTMLEvents = {
     mouseout: MouseEvent;
     mouseover: MouseEvent;
     mouseup: MouseEvent;
+    offline: Event;
+    online: Event;
+    orientationchange: Event;
+    pagehide: PageTransitionEvent;
+    pageshow: PageTransitionEvent;
+    paste: ClipboardEvent;
     pause: Event;
     play: Event;
     playing: Event;
@@ -61,23 +83,32 @@ export type HTMLEvents = {
     pointerdown: PointerEvent;
     pointerenter: PointerEvent;
     pointerleave: PointerEvent;
+    pointerlockchange: Event;
+    pointerlockerror: Event;
     pointermove: PointerEvent;
     pointerout: PointerEvent;
     pointerover: PointerEvent;
+    pointerrawupdate: PointerEvent;
     pointerup: PointerEvent;
+    popstate: PopStateEvent;
     progress: ProgressEvent;
     ratechange: Event;
+    readystatechange: Event;
+    rejectionhandled: PromiseRejectionEvent;
     reset: Event;
     resize: UIEvent;
     scroll: Event;
+    scrollend: Event;
     securitypolicyviolation: SecurityPolicyViolationEvent;
     seeked: Event;
     seeking: Event;
     select: Event;
     selectionchange: Event;
     selectstart: Event;
+    slotchange: Event;
     stalled: Event;
-    submit: Event;
+    storage: StorageEvent;
+    submit: SubmitEvent;
     suspend: Event;
     timeupdate: Event;
     toggle: Event;
@@ -89,6 +120,10 @@ export type HTMLEvents = {
     transitionend: TransitionEvent;
     transitionrun: TransitionEvent;
     transitionstart: TransitionEvent;
+    unhandledrejection: PromiseRejectionEvent;
+    unload: Event;
+    visibilitychange: Event;
     volumechange: Event;
     waiting: Event;
+    wheel: WheelEvent;
 };