kuito.
Commencer

HeaderSearch

The search field a screen's header carries.

type

Utilisation

Connect header search to a query.

tsx
// Connect header search to a query.
import { signal, type HeaderSearch, type RouteOptions } from 'kuito';

const query = signal('');

const search: HeaderSearch = {
  placeholder: 'Search shows',
  onChange: (text) => (query.value = text),
  onSubmit: (text) => console.log('search for', text),
};

export const options: RouteOptions = { title: 'Shows', header: { largeTitle: true, search } };

Déclaration du type

ts
export interface HeaderSearch {
  placeholder?: string;
  /** The text as the user types it. */
  onChange: (text: string) => void;
  /** The user pressed the search key. */
  onSubmit?: (text: string) => void;
}

Membres 3

NomTypeRequisDescription
placeholderstringNon—
onChange(text: string) => voidOuiThe text as the user types it.
onSubmit(text: string) => voidNonThe user pressed the search key.
onChange — signatures de méthode

Signatures

ts
(text: string): void

Paramètres

NomTypeRequisDescription
textstringOui—

Retourne

void

onSubmit — signatures de méthode

Signatures

ts
(text: string): void

Paramètres

NomTypeRequisDescription
textstringOui—

Retourne

void

Généré depuis les déclarations TypeScript publiques : signatures, props et valeurs par défaut viennent de la source vérifiée, les descriptions de sa JSDoc. Aucune valeur par défaut n'est inventée.