Table

useTableExpansion

Composable interno per l'espansione delle righe della tabella con slot di dettaglio e gestione eventi.

Composable interno — utilizzato dal componente DataTable della libreria.

Firma TypeScript

export function useTableExpansion<T = unknown>(
  options?: UseTableExpansionOptions
): UseTableExpansionResult<T>

interface UseTableExpansionOptions {
  dataKey?: string;   // default: 'id'
}

export interface UseTableExpansionResult<T> {
  expandedRowKeys: Ref<Set<string | number>>;
  isRowExpanded: (row: T) => boolean;
  toggleRowExpansion: (row: T, event?: MouseEvent) => void;
  expandAll: (rows: T[]) => void;
  collapseAll: () => void;
}

Parametri

Parametro	Tipo	Default	Descrizione
`dataKey`	`string`	`'id'`	Campo usato come chiave univoca per identificare le righe espanse

Valore di Ritorno

Proprietà	Tipo	Descrizione
`expandedRowKeys`	`Ref<Set<string \| number>>`	Set reattivo dei valori-chiave delle righe espanse
`isRowExpanded`	`(row: T) => boolean`	True se la riga specificata e espansa
`toggleRowExpansion`	`(row, event?) => void`	Apre/chiude la riga; emette `rowExpand` o `rowCollapse`
`expandAll`	`(rows: T[]) => void`	Espande tutte le righe dell'array passato
`collapseAll`	`() => void`	Chiude tutte le righe espanse

Esempio

const { expandedRowKeys, isRowExpanded, toggleRowExpansion } =
  useTableExpansion<Order>({ dataKey: 'id' })

// Template — pulsante expander per ogni riga
// <button @click="toggleRowExpansion(row, $event)">
//   <Icon :name="isRowExpanded(row) ? 'chevron-down' : 'chevron-right'" />
// </button>

// Ascolta eventi emessi dal composable
// emit('rowExpand', { data: row, originalEvent: event })
// emit('rowCollapse', { data: row, originalEvent: event })

Note

expandedRowKeys contiene il valore di row[dataKey]; se dataKey non e presente nella riga, si usa l'indice come fallback.
toggleRowExpansion emette rowExpand alla prima apertura e rowCollapse alla chiusura tramite la funzione emit iniettata nelle options.
expandAll aggiunge tutte le chiavi delle righe passate al Set senza sovrascriverlo; le righe gia espanse rimangono espanse.
collapseAll svuota completamente expandedRowKeys.
Il contenuto del pannello espanso e reso tramite lo slot expansion del DataTable; il composable gestisce solo la logica di stato, non il rendering.

useTableEditing

Composable interno per editing inline di celle e righe con tracking delle modifiche e API di completamento/annullamento.

useTableFilter

Composable interno per filtri per-colonna e filtro globale con multi-constraint e match mode configurabili.