Skip to content

FormAssociated<T> ​

Convenient interface to implement form-associated custom elements.

See ​

https://web.dev/articles/more-capable-form-controls

Example ​

ts
@customElement('text-input')
export class TextInputElement
  extends LitElement
  implements FormAssociated<string> {}
  ...
}

Type Parameters ​

T ​

T

Properties ​

disabled? ​

ts
disabled?: boolean;

formAssociatedCallback? ​

ts
formAssociatedCallback?: (form: HTMLFormElement) => void;

Parameters ​

form ​

HTMLFormElement

Returns ​

void


formDisabledCallback? ​

ts
formDisabledCallback?: (disabled: boolean) => void;

Parameters ​

disabled ​

boolean

Returns ​

void


formResetCallback? ​

ts
formResetCallback?: () => void;

Returns ​

void


formStateRestoreCallback? ​

ts
formStateRestoreCallback?: (state: string | File | FormData | null, mode: "autocomplete" | "restore") => void;

Parameters ​

state ​

string | File | FormData | null

mode ​

"autocomplete" | "restore"

Returns ​

void


label? ​

ts
label?: string;

name? ​

ts
name?: string;

readonly? ​

ts
readonly?: boolean;

required? ​

ts
required?: boolean;

value? ​

ts
value?: T;