Table

useTableSelection

Composable interno per selezione righe singola, multipla e checkbox con eventi di selezione tipizzati.

Composable interno — utilizzato dal componente DataTable della libreria.

Firma TypeScript

export function useTableSelection<T = unknown>(
  options?: UseTableSelectionOptions<T>
): UseTableSelectionResult<T>

interface UseTableSelectionOptions<T> {
  selectionMode?: 'single' | 'multiple' | 'checkbox';
  initialSelection?: T[];
  dataKey?: string;   // default: 'id'
}

export interface UseTableSelectionResult<T> {
  selectedRows: Ref<T[]>;
  isRowSelected: (row: T) => boolean;
  isPartiallySelected: ComputedRef<boolean>;
  isAllSelected: ComputedRef<boolean>;
  toggleRowSelection: (row: T, event?: MouseEvent) => RowSelectEvent<T> | null;
  toggleAllSelection: (rows: T[]) => void;
  clearSelection: () => void;
  selectRows: (rows: T[]) => void;
  setSelection: (rows: T[]) => void;
}

export interface RowSelectEvent<T> {
  originalEvent?: MouseEvent;
  data: T;
  type: 'row-select' | 'row-unselect';
}

Parametri

Parametro	Tipo	Default	Descrizione
`selectionMode`	`'single' \| 'multiple' \| 'checkbox'`	`'single'`	Modalita di selezione
`initialSelection`	`T[]`	`[]`	Selezione iniziale
`dataKey`	`string`	`'id'`	Campo usato per confrontare le righe per identita

Valore di Ritorno

Proprietà	Tipo	Descrizione
`selectedRows`	`Ref<T[]>`	Array delle righe correntemente selezionate
`isRowSelected`	`(row: T) => boolean`	Verifica se una riga e selezionata
`isPartiallySelected`	`ComputedRef<boolean>`	True se alcune (non tutte) le righe sono selezionate — per checkbox header indeterminate
`isAllSelected`	`ComputedRef<boolean>`	True se tutte le righe visibili sono selezionate
`toggleRowSelection`	`(row, event?) => RowSelectEvent \| null`	Seleziona/deseleziona una riga; ritorna l'evento o null se nessuna variazione
`toggleAllSelection`	`(rows: T[]) => void`	Seleziona tutte o deseleziona tutte le righe passate
`clearSelection`	`() => void`	Azzera la selezione
`selectRows`	`(rows: T[]) => void`	Aggiunge righe alla selezione corrente
`setSelection`	`(rows: T[]) => void`	Sostituisce completamente la selezione

Esempio

const { selectedRows, isRowSelected, toggleRowSelection, toggleAllSelection, isPartiallySelected } =
  useTableSelection<User>({
    selectionMode: 'checkbox',
    dataKey: 'id',
  })

// Click su checkbox riga
const onRowCheckboxClick = (row: User, event: MouseEvent) => {
  const selEvent = toggleRowSelection(row, event)
  if (selEvent) emit('row-select', selEvent)
}

// Click su checkbox header
const onHeaderCheckboxClick = () => {
  toggleAllSelection(allRows.value)
}

Note

Il confronto delle righe usa dataKey quando disponibile; altrimenti confronto per riferimento (===).
toggleRowSelection in modalita single deseleziona sempre la riga precedente prima di selezionare quella nuova.
isPartiallySelected e isAllSelected dipendono dalle righe passate a toggleAllSelection; devono riflettere le righe visibili/filtrate, non il dataset completo.
In modalita multiple, Ctrl+click aggiunge/rimuove dalla selezione; click semplice sostituisce la selezione.
toggleRowSelection ritorna null quando la selezione non cambia (click su riga gia selezionata in single mode senza deselect).

useTablePagination

Composable interno per la paginazione client-side delle tabelle con navigazione e cambio rows-per-page.

useTableSort

Composable interno per ordinamento singolo e multi-colonna con dataType e icone configurabili.