Forms

useAutoCompleteSearch

Composable interno per ricerca con debounce e minLength nel componente AutoComplete.

Composable interno — utilizzato dal componente AutoComplete della libreria.

Firma TypeScript

export function useAutoCompleteSearch(
  onComplete: (event: AutoCompleteCompleteEvent) => void,
  params?: UseAutoCompleteSearchParams
): UseAutoCompleteSearchResult

export interface UseAutoCompleteSearchParams {
  delay?: number;      // default: 300ms
  minLength?: number;  // default: 1
}

export interface AutoCompleteCompleteEvent {
  originalEvent: Event;
  query: string;
}

export interface UseAutoCompleteSearchResult {
  query: Ref<string>;
  isSearching: Ref<boolean>;
  search: (event: Event, value: string, onBelowMinLength?: () => void) => void;
  cancelSearch: () => void;
}

Parametri

Parametro	Tipo	Descrizione
`onComplete`	`(event: AutoCompleteCompleteEvent) => void`	Callback invocata quando la ricerca debounced scatta
`params.delay`	`number`	Delay debounce in ms (default: 300)
`params.minLength`	`number`	Numero minimo di caratteri per attivare la ricerca (default: 1)

Valore di Ritorno

Proprietà	Tipo	Descrizione
`query`	`Ref<string>`	Query corrente
`isSearching`	`Ref<boolean>`	True mentre il timer debounce e attivo
`search`	`(event, value, onBelowMinLength?) => void`	Avvia la ricerca con debounce
`cancelSearch`	`() => void`	Cancella il timer debounce in corso

Esempio

const { query, isSearching, search } = useAutoCompleteSearch(
  (event) => emit('complete', event),
  { delay: 300, minLength: 2 }
)

// In handler input del componente
const onInput = (event: Event) => {
  const value = (event.target as HTMLInputElement).value
  search(event, value, () => {
    // Meno di minLength caratteri: pulisci i suggerimenti
    suggestions.value = []
  })
}

Note

Ogni nuova chiamata a search annulla il timer precedente (debounce).
isSearching e true solo mentre il timer e attivo, non durante la richiesta API vera e propria.
Il cleanup del timer avviene automaticamente in onBeforeUnmount.
onBelowMinLength e un callback opzionale per gestire la pulizia dei risultati quando la query scende sotto minLength.

Forms

Composables per i componenti form — field classes, events, select options, autocomplete, dropdown, tree, clock, typeahead.

useClockDrag

Composable interno per la gestione dell'interazione mouse/drag sul componente Clock SVG.