@askrjs/themes/input

DebouncedInputtype

DebouncedInput: (props: DebouncedInputProps) => JSX.Element

DebouncedInput is a convenience wrapper around Input that emits a settled value for search and filter surfaces. One component-owned timer is re-timed when debounceMs changes (or emits at once when the delay drops to zero). A pending value is delivered to the latest onDebouncedInput, is dropped when onDebouncedInput is removed, and is cancelled on unmount.

DebouncedInputPropstype

DebouncedInputProps: Omit<InputInputProps, 'onInput' | 'type'> & {
  type?: JSX.IntrinsicElements['input']['type'];
  debounceMs?: number;
  onInput?: (event: InputEvent) => void;
  onDebouncedInput?: (value: string) => void;
}

Props for Debounced Input.

asChild

asChild?: false | undefined;

children

children?: unknown;

debounceMs

debounceMs?: number | undefined;

onDebouncedInput

onDebouncedInput?: ((value: string) => void) | undefined;

onInput

onInput?: ((event: InputEvent) => void) | undefined;

ref

ref?: Ref<HTMLInputElement>;

type

type?: ReactiveProp<IntrinsicTextValue>;

Inputtype

Input: { (props: InputInputProps): JSX.Element; (props: InputAsChildProps): JSX.Element; }

Renders the input part of input. Supports polymorphic rendering via asChild.

InputAsChildPropstype

InputAsChildProps: InputOwnProps & {
  asChild: true;
  children: JSXElement;
  ref?: Ref<Element>;
}

Props for the asChild (polymorphic) rendering of Input.

asChild

asChild: true;

children

children: JSXElement;

disabled

disabled?: boolean | undefined;

ref

ref?: Ref<Element>;

tabIndex

tabIndex?: number | undefined;

InputEventtype

InputEvent: Event & {
  currentTarget: HTMLInputElement;
  target: HTMLInputElement;
}

Input Event.

InputInputPropstype

InputInputProps: Omit<JSX.IntrinsicElements['input'], 'children' | 'ref'> & InputOwnProps & {
  asChild?: false;
  ref?: Ref<HTMLInputElement>;
}

Props for Input Input.

asChild

asChild?: false | undefined;

children

children?: unknown;

ref

ref?: Ref<HTMLInputElement>;

InputOwnPropstype

InputOwnProps: {
  children?: unknown;
  disabled?: boolean;
  tabIndex?: number;
}

Own props for Input, before merging with native element attributes.

children

children?: unknown;

disabled

disabled?: boolean | undefined;

tabIndex

tabIndex?: number | undefined;

InputPropstype

InputProps: InputInputProps | InputAsChildProps

Props for Input.

asChild

asChild?: boolean | undefined;

children

children?: unknown;

ref

ref?: ((value: Element | null) => void) | { current: Element | null; } | ((value: HTMLInputElement | null) => void) | { current: HTMLInputElement | null; } | null | undefined;