Forms

useSelectOptions

Composable interno per normalizzazione, grouping e filtering delle opzioni per Select e MultiSelect.

Composable interno — utilizzato dai componenti Select e MultiSelect della libreria.

Firma TypeScript

export function useSelectOptions(params: UseSelectOptionsParams): UseSelectOptionsResult

export interface UseSelectOptionsParams {
  options: () => unknown[] | null | undefined;
  optionLabel: () => string | ((option: Record<string, unknown>) => string) | null | undefined;
  optionValue: () => string | ((option: Record<string, unknown>) => OptionValue) | null | undefined;
  optionDisabled: () => string | ((option: Record<string, unknown>) => boolean) | null | undefined;
  optionGroupLabel?: () => string | ((option: Record<string, unknown>) => string) | null | undefined;
  optionGroupChildren?: () => string | ((option: Record<string, unknown>) => unknown[]) | null | undefined;
  filter: () => boolean;
  filterMatchMode: () => DropdownFilterMatchMode;
}

export interface UseSelectOptionsResult {
  filterValue: Ref<string>;
  hasGroups: ComputedRef<boolean>;
  normalizedOptions: ComputedRef<NormalizedOption[]>;
  filteredOptions: ComputedRef<NormalizedOption[]>;
  resetFilter: () => void;
}

Parametri

Parametro	Tipo	Descrizione
`options`	`() => unknown[]`	Getter reattivo delle opzioni raw
`optionLabel`	getter	Proprieta o funzione per ottenere il testo visualizzato
`optionValue`	getter	Proprieta o funzione per ottenere il valore
`optionDisabled`	getter	Proprieta o funzione per lo stato disabilitato
`optionGroupLabel`	getter (opzionale)	Label del gruppo per opzioni raggruppate
`optionGroupChildren`	getter (opzionale)	Proprieta che contiene i children del gruppo
`filter`	`() => boolean`	Se il filtro e abilitato
`filterMatchMode`	`() => DropdownFilterMatchMode`	Modalita filtro: `startsWith`, `contains`, `endsWith`

Valore di Ritorno

Proprietà	Tipo	Descrizione
`filterValue`	`Ref<string>`	Testo di ricerca corrente
`hasGroups`	`ComputedRef<boolean>`	True se le opzioni hanno gruppi
`normalizedOptions`	`ComputedRef<NormalizedOption[]>`	Opzioni normalizzate (flat, con group header intercalati)
`filteredOptions`	`ComputedRef<NormalizedOption[]>`	Opzioni filtrate in base a `filterValue`
`resetFilter`	`() => void`	Resetta il testo di ricerca

Esempio

const { filterValue, filteredOptions, resetFilter } = useSelectOptions({
  options: () => props.options,
  optionLabel: () => props.optionLabel,
  optionValue: () => props.optionValue,
  optionDisabled: () => props.optionDisabled,
  filter: () => props.filter,
  filterMatchMode: () => props.filterMatchMode,
})

// In template
<input v-model="filterValue" placeholder="Cerca..." />
<div v-for="opt in filteredOptions" :key="opt.value">{{ opt.label }}</div>

Note

La rilevazione dei gruppi avviene verificando se la prima opzione ha la proprieta optionGroupChildren (default: 'items').
Le opzioni di gruppo vengono espanse in una lista flat con header di gruppo (isGroupHeader: true, disabled: true) intercalati.
Il filtro opera sulle normalizedOptions (dopo il grouping) comparando il label in lowercase.
NormalizedOption ha forma { label, value, disabled, isGroupHeader, original }.

useFormFieldMethods

Composable interno per metodi pubblici esposti dai campi form (focus, blur, select, setSelectionRange).

useTreeExpansion

Composable interno per gestire espansione/collasso dei nodi in TreeSelect.