# List (/docs/products/dash-dots/reference/components/list)

Put a `ListItem` inside it for each row.

**Children:** Components

## Example

![The List component](/assets/images/dash-dots/components/list.webp)

```xml title="view.dml"
<List>
  <ListItem icon="send" title="Sent to Aminata" subtitle="Today, 09:41" value="SLE 50.00" />
  <ListItem icon="download" title="From Mohamed" subtitle="Yesterday" value="SLE 120.00" />
</List>
```

## Props

| Prop                                                                   | Type                                                             | What it is                                        |
| ---------------------------------------------------------------------- | ---------------------------------------------------------------- | ------------------------------------------------- |
| `size`                                                                 | `sm`, `md`                                                       | Default: `sm`.                                    |
| `padding`, `paddingTop`, `paddingStart`, `paddingEnd`, `paddingBottom` | [spacing](/docs/products/dash-dots/reference/components#spacing) | Space inside its edges, all round or on one side. |

## Events

| Event          | Sends   | Notes                                                                              |
| -------------- | ------- | ---------------------------------------------------------------------------------- |
| `onEndReached` | Nothing | The last row scrolled into view. Add more rows here to load as the person scrolls. |
