Saltar al contenido
El Muestrario

componente · @solu30/ui-kit/input

ClickableRow

Fila de ancho completo que es un botón entero, para listados donde se toca cualquier parte de la fila.

Seguir leyendo — 1 párrafo más

Full-width row button — the direct replacement for the 21 hand-rolled <button> resets found in RRHH's row-style click targets.

2 sitios de import en 1 de 15 verticales — un archivo que la importa cuenta una vez, monte una instancia o veinte.

  • gestorsalon

El componente, montado

Cargando el componente del paquete instalado…

Cómo se usa

import { ClickableRow } from '@solu30/ui-kit/input'

Props

1 props declaradas en los tipos de la versión instalada.
PropRequeridaTipoQué hace
denseopcionalbooleanVisual density, mirrors `DataTable`'s `dense` variant. Default `false`.

Ejemplo del paquete

<ClickableRow onClick={() => openDetail(person.id)}>
  <Avatar name={person.name} />
  <span className="flex-1 text-left">{person.name}</span>
  <ChevronRight className="h-4 w-4 text-content/40" />
</ClickableRow>

Del @example del JSDoc de @solu30/ui-kit, sin editar: son 65 de los 541 símbolos. La sangría y los renglones en blanco son los del paquete.