Units table
A development's available homes, filterable.
The "available homes in this development" block on a property detail page (ADR 0023): a semantic <table> of individual homes — address, type, size, rooms, floor, rent, status — above two rows of filter chips (by rooms, by status), with a live count and an empty state. The same chip and swap-safe idiom as the properties browser.
Permanent since ADR 0041. It was a stopgap for EstateTool, which is dropped. It is now the complete, accessible way to browse a property's units, and the planned building viewer shares its selection. Today it has no search, no sorting and no pagination.
Ten rows, then "show all". Past ten matching rows the rest are hidden behind one button that names the full count (ADR 0023, amended 2026-10-29). Filters count every match, not only the shown ten. After the button is pressed, every row stays shown, and focus moves to the first new row. Without JS every row shows and the button doesn't.
On narrow screens the table scrolls horizontally and is never reflowed into cards, so the page body never scrolls sideways. A table of numbers you compare down a column stops being that the moment each row becomes a card. Resize the preview to check it.
The table
6 homes
| Address | Type | Size | Rooms | Floor | Rent | Status |
|---|---|---|---|---|---|---|
| Midgårdsvej 3, 1., 4 | Apartment | 42 m² | 1 room | 1 / 6 | 6.950 kr/md. | Available |
| Midgårdsvej 3, 2., 19 | Apartment | 56 m² | 2 rooms | 2 / 6 | 8.400 kr/md. | Available |
| Midgårdsvej 3, 3., 22 | Apartment | 63 m² | 2 rooms | 3 / 6 | 9.100 kr/md. | Reserved |
| Midgårdsvej 3, 4., 27 | Apartment | 78 m² | 3 rooms | 4 / 6 | 11.200 kr/md. | Available |
| Midgårdsvej 3, 5., 31 | Apartment | 84 m² | 3 rooms | 5 / 6 | 12.400 kr/md. | Let |
| Midgårdsvej 3, 6., 34 | Penthouse | 104 m² | 4 rooms | 6 / 6 | 15.800 kr/md. | Available from 1 Dec 2026 |
No homes match those filters.
Past the row limit
24 homes
| Address | Type | Size | Rooms | Floor | Rent | Status |
|---|---|---|---|---|---|---|
| Midgårdsvej 3, 1., 4 | Apartment | 42 m² | 1 room | 1 / 6 | 6.950 kr/md. | Available |
| Midgårdsvej 3, 2., 19 | Apartment | 56 m² | 2 rooms | 2 / 6 | 8.400 kr/md. | Available |
| Midgårdsvej 3, 3., 22 | Apartment | 63 m² | 2 rooms | 3 / 6 | 9.100 kr/md. | Reserved |
| Midgårdsvej 3, 4., 27 | Apartment | 78 m² | 3 rooms | 4 / 6 | 11.200 kr/md. | Available |
| Midgårdsvej 3, 5., 31 | Apartment | 84 m² | 3 rooms | 5 / 6 | 12.400 kr/md. | Let |
| Midgårdsvej 3, 6., 34 | Penthouse | 104 m² | 4 rooms | 6 / 6 | 15.800 kr/md. | Available from 1 Dec 2026 |
| Midgårdsvej 3, 1., 104 | Apartment | 42 m² | 1 room | 1 / 6 | 6.950 kr/md. | Available |
| Midgårdsvej 3, 2., 119 | Apartment | 56 m² | 2 rooms | 2 / 6 | 8.400 kr/md. | Available |
| Midgårdsvej 3, 3., 122 | Apartment | 63 m² | 2 rooms | 3 / 6 | 9.100 kr/md. | Reserved |
| Midgårdsvej 3, 4., 127 | Apartment | 78 m² | 3 rooms | 4 / 6 | 11.200 kr/md. | Available |
| Midgårdsvej 3, 5., 131 | Apartment | 84 m² | 3 rooms | 5 / 6 | 12.400 kr/md. | Let |
| Midgårdsvej 3, 6., 134 | Penthouse | 104 m² | 4 rooms | 6 / 6 | 15.800 kr/md. | Available from 1 Dec 2026 |
| Midgårdsvej 3, 1., 204 | Apartment | 42 m² | 1 room | 1 / 6 | 6.950 kr/md. | Available |
| Midgårdsvej 3, 2., 219 | Apartment | 56 m² | 2 rooms | 2 / 6 | 8.400 kr/md. | Available |
| Midgårdsvej 3, 3., 222 | Apartment | 63 m² | 2 rooms | 3 / 6 | 9.100 kr/md. | Reserved |
| Midgårdsvej 3, 4., 227 | Apartment | 78 m² | 3 rooms | 4 / 6 | 11.200 kr/md. | Available |
| Midgårdsvej 3, 5., 231 | Apartment | 84 m² | 3 rooms | 5 / 6 | 12.400 kr/md. | Let |
| Midgårdsvej 3, 6., 234 | Penthouse | 104 m² | 4 rooms | 6 / 6 | 15.800 kr/md. | Available from 1 Dec 2026 |
| Midgårdsvej 3, 1., 304 | Apartment | 42 m² | 1 room | 1 / 6 | 6.950 kr/md. | Available |
| Midgårdsvej 3, 2., 319 | Apartment | 56 m² | 2 rooms | 2 / 6 | 8.400 kr/md. | Available |
| Midgårdsvej 3, 3., 322 | Apartment | 63 m² | 2 rooms | 3 / 6 | 9.100 kr/md. | Reserved |
| Midgårdsvej 3, 4., 327 | Apartment | 78 m² | 3 rooms | 4 / 6 | 11.200 kr/md. | Available |
| Midgårdsvej 3, 5., 331 | Apartment | 84 m² | 3 rooms | 5 / 6 | 12.400 kr/md. | Let |
| Midgårdsvej 3, 6., 334 | Penthouse | 104 m² | 4 rooms | 6 / 6 | 15.800 kr/md. | Available from 1 Dec 2026 |
No homes match those filters.
Props
| Prop | Type | Required |
|---|---|---|
| units | Unit[] | yes |
| columns | { address: string; type: string; area: string; rooms: string; floor: string; price: string; status: string; } | yes |
| tableLabel Accessible name / caption for the table. | string | yes |
| allLabel | string | yes |
| filterRoomsLabel | string | yes |
| filterStatusLabel | string | yes |
| roomFacets | Facet[] | yes |
| statusFacets | Facet[] | yes |
| countLabelOne | string | yes |
| countLabelOther | string | yes |
| emptyLabel | string | yes |
| showAllLabel "Show all {count} homes". The button only shows above the row limit, so the count is never one and the template needs no singular. | string | yes |
| showInModelLabel The row action's label; the column renders only with it (ADR 0041). | string | — |
| Field | Type | Required |
|---|---|---|
| address | string | yes |
| typeLabel | string | yes |
| areaLabel | string | yes |
| roomsLabel | string | yes |
| floorLabel | string | yes |
| priceLabel | string | yes |
| availability | "available" | "reserved" | "let" | "coming-soon" | yes |
| statusLabel | string | yes |
| roomsKey | string | yes |
| href | string | yes |
| ref The drawing reference, when the building has a model (ADR 0041). | string | — |
| Field | Type | Required |
|---|---|---|
| key | string | yes |
| label | string | yes |