Elements

Components / Application

Lot

Strata lot identity primitives for Instant Strata. A lot is an entry on the strata roll within a scheme: it has a number, unit entitlement, registered owner, levy status, and proxy eligibility. Use these elements on owner rolls, levy notices, AGM proxy validation, and complaint registers.

Design rationale

Lots are the atomic unit of strata operations. Levy calculations, proxy validation, breach notices, and maintenance requests all resolve to a lot number. The LotSummary type is the shared contract, nested under a scheme via schemePlan when shown in cross-scheme views.

LotBadge is the canonical compact identifier. Use it inline in correspondence, AI entity tags, and table cells. Full rows use LotCard with the layout that matches the container width, matching the Document and Scheme patterns.

Primitives

Compose these in custom layouts, levy notices, and inline references. All lot badges compose Badge. LotRollHeader summary counts use Badge directly. See the Badge docs for every levy and proxy state.

LotBadge, LotLevyBadge, LotProxyBadge, LotIdentity

Lot 12Lot 14Lot 22

PaidDueOverdue

Proxy eligibleIneligible

Lot 12 · Unit 12

James & Sarah Chen

Alex Rivera · Unit 14 · 14/100 Harbour St · SP 1042 · UE 85 · Agent: Coastal Realty

List layout

Default strata roll row. Pair with LotRollHeader for summary counts.

LotList with roll header

Strata roll

4 lots

2 paid1 due1 overdue

James & Sarah Chen

Unit 12 · 12/100 Harbour St · UE 85 · SP 1042

Alex Rivera

Unit 14 · 14/100 Harbour St · UE 85 · SP 1042

Margaret O'Brien

Unit 18 · 18/100 Harbour St · UE 92 · SP 1042

Vacant

Penthouse · PH/100 Harbour St · UE 120 · SP 1042

tsx

import { LotCard, LotList, LotRollHeader } from "@/components/ui/lot"

<LotList
  header={
    <LotRollHeader
      totalLots={lots.length}
      paidCount={paid}
      dueCount={due}
      overdueCount={overdue}
    />
  }
>
  {lots.map((lot) => (
    <LotCard
      key={lot.id}
      lot={lot}
      layout="list"
      showLevyStatus
      showChevron
      href={`/schemes/${schemeId}/lots/${lot.id}`}
    />
  ))}
</LotList>

Wide layout

Full strata roll table with entitlement, levy, and proxy columns. Used for AGM proxy validation and committee review.

LotList with wide rows

Lot

Owner

Entitlement

Levy

Proxy

Lot 12

Unit 12

James & Sarah Chen

85

Lot 14

Unit 14

Alex Rivera

85

Lot 18

Unit 18

Margaret O'Brien

92

Lot 22

Penthouse

Vacant

120

tsx

import { LotCard, LotList } from "@/components/ui/lot"

<LotList showWideHeader>
  {lots.map((lot) => (
    <LotCard
      key={lot.id}
      lot={lot}
      layout="wide"
      showLevyStatus
      showProxyStatus
      showChevron
      href="#"
    />
  ))}
</LotList>

Card and compact layouts

Card tiles for lot pickers (e.g. maintenance requests). Compact rows for dropdowns and search results.

LotGrid with card tiles

PaidProxy eligible

James & Sarah Chen

Unit 12 · 12/100 Harbour St · UE 85 · SP 1042

DueProxy eligible

Alex Rivera

Unit 14 · 14/100 Harbour St · UE 85 · SP 1042

Compact rows for pickers

James & Sarah Chen

Unit 12

Alex Rivera

Unit 14

Margaret O'Brien

Unit 18

Vacant

Penthouse

Cross-scheme lists

When listing lots across a portfolio, pass showScheme to surface the parent plan number.

Lots from multiple schemes

James & Sarah Chen

Unit 12 · 12/100 Harbour St · UE 85 · SP 1042

Alex Rivera

Unit 14 · 14/100 Harbour St · UE 85 · SP 1042

Margaret O'Brien

Unit 18 · 18/100 Harbour St · UE 92 · SP 1042

Vacant

Penthouse · PH/100 Harbour St · UE 120 · SP 1042

Priya Sharma

Unit 3 · UE 72 · SP 8871

Kim & Pat Foster

Unit 7 · UE 72 · SP 8871

Related patterns

Scheme context: show SchemeContextBar above lot roll pages. Use LotRollHeader for roll-specific counts beneath it.

Owner directory: use the Owner component for proprietor-centric views with contact details and portal status.

Badges: LotBadge, LotLevyBadge, and LotProxyBadge are documented with every state on the Badge page.

Inline references: use LotBadge in correspondence and AI drafts where a full card is too heavy.

Install

tsx

npx shadcn add https://raw.githubusercontent.com/levi-putna/elements/main/registry/lot/registry.json

Requires the badge component.

Reference

LotSummary

Prop	Type	Default	Description
id	string	-	Stable identifier for routing and API calls.
number	string \| number	-	Lot number, e.g. 12 or "Lot 12". Normalised by formatLotNumber.
unit	string	-	Unit label when different from lot number, e.g. Unit 4B.
address	string	-	Unit address within the building.
entitlement	number	-	Unit entitlement for levy calculations.
ownerName	string	-	Registered owner display name.
tenantName	string	-	Current tenant when tenanted.
levyStatus	LotLevyStatus	-	paid \| due \| overdue \| not_assessed.
occupancy	LotOccupancy	-	owner_occupied \| tenanted \| vacant.
proxyEligible	boolean	-	Whether the lot may lodge an AGM proxy.
schemePlan	string	-	Parent scheme plan for cross-scheme lists.

LotCard

Prop	Type	Default	Description
lot	LotSummary	-	Lot data object.
layout	"list" \| "card" \| "compact" \| "wide"	"list"	list = roll row. card = tile. compact = picker row. wide = table row.
href	string	-	When set, renders the card as a link.
showChevron	boolean	false	Trailing chevron for navigable rows.
showLevyStatus	boolean	false	Shows the levy status badge.
showProxyStatus	boolean	false	Shows proxy eligibility (wide and card layouts).
showScheme	boolean	false	Shows parent scheme plan in list layout.
selected	boolean	false	Highlights the row with lime-soft background.
actions	ReactNode	-	Custom trailing actions.