# GenericRow

> Generic 3-column row (start / flexible content / end) for heterogeneous lists.

Source: https://ui.jcsoftdev.com/docs/components/generic-row

Generic 3-column row (start / flexible content / end) for heterogeneous
lists. The start and end slots take any content (icon, avatar, chip,
button). No top border on the first row of a consecutive list.

## Import

```ts
import { GenericRow } from "@jcsoftdev/ui/containers";
```

Single-component entry points tree-shake to just this component: `@jcsoftdev/ui/containers/generic-row`.

## Usage

```tsx
<GenericRow>
  <>
          <Avatar name="Luis Ramírez" />
          <GenericRowContent>
            <GenericRowTitle>Luis Ramírez</GenericRowTitle>
            <GenericRowMeta>Corte + barba · Hoy 16:30</GenericRowMeta>
          </GenericRowContent>
          <Chip tone="success">Confirmada</Chip>
        </>
</GenericRow>
```

## Props

This component declares no props of its own.

It also accepts the native props of the element or primitive it renders (for example `className`, `id`, `aria-*` and event handlers).

## Storybook stories

- [Default](/storybook/?path=/story/containers-genericrow--default)
- [Heterogeneous List](/storybook/?path=/story/containers-genericrow--heterogeneous-list)
- [Narrow](/storybook/?path=/story/containers-genericrow--narrow)

## Source

`packages/ui/src/containers/generic-row/generic-row.tsx`