# zan701/zan-recidences architecture

> Architecture diagram of the GitHub repository zan701/zan-recidences, generated by GitDiagram from its file tree, README and a sample of source files (last updated 2026-09-29). It is an AI-made overview: check details against the source.

- Interactive diagram: https://gitdiagram.com/zan701/zan-recidences
- Repository: https://github.com/zan701/zan-recidences

## Overview

Zan Residences is a single-page digital property showroom. Visitors move from the project introduction through unit discovery and selection, explore home and floor-plan details, consider lifestyle and location, compare units, then reach a private-viewing request form. `app/page.tsx` composes the experience; property data supports the interactive masterplan and available-unit form, while shared scroll-animation behavior supports selected sections. The README is a generic Next.js starter; feature names and the page composition establish the product capabilities. Unsampled section internals are represented by their exact paths without assuming their data wiring.

Main entry points: [`app/page.tsx`](https://github.com/zan701/zan-recidences/blob/main/app/page.tsx) (Showroom page), [`components/sections/S04_Masterplan.tsx`](https://github.com/zan701/zan-recidences/blob/main/components/sections/S04_Masterplan.tsx) (Interactive masterplan), [`components/sections/S12_PrivateViewing.tsx`](https://github.com/zan701/zan-recidences/blob/main/components/sections/S12_PrivateViewing.tsx) (Private viewing form), [`lib/hooks/useGsapScrollTrigger.ts`](https://github.com/zan701/zan-recidences/blob/main/lib/hooks/useGsapScrollTrigger.ts) (Scroll animation hooks)

## Diagram (Mermaid)

```mermaid
flowchart TD

subgraph group_shell["Page Shell"]
  node_home["Showroom page<br/>[page.tsx]"]
  node_navbar["Navigation<br/>[Navbar.tsx]"]
  node_footer["Footer<br/>[Footer.tsx]"]
  node_hero["Hero<br/>[S01_Hero.tsx]"]
  node_story["Project story<br/>[S02_Story.tsx]"]
  node_overview["Project overview"]
  node_scrollhooks["Scroll animation hooks"]
  node_types["Domain types<br/>[index.ts]"]
end

subgraph group_discovery["Unit Discovery"]
  node_masterplan["Interactive masterplan<br/>[S04_Masterplan.tsx]"]
  node_recommend["Home finder"]
  node_unitdetail["Unit details<br/>[S06_UnitDetail.tsx]"]
  node_compare["Unit comparison"]
  node_properties["Property catalog<br/>[properties.ts]"]
end

subgraph group_experience["Home Experience"]
  node_explore["Explore home"]
  node_floorplan["Floor plans<br/>[S08_FloorPlan.tsx]"]
  node_day["Daily-life timeline"]
  node_location["Location experience"]
  node_locations["Location data<br/>[locations.ts]"]
  node_rooms["Room data<br/>[rooms.ts]"]
  node_timeline["Timeline data<br/>[timeline.ts]"]
end

subgraph group_conversion["Engagement"]
  node_viewing["Private viewing form"]
end

node_visitor(("Site visitor"))

node_visitor -->|"opens"| node_home
node_home -->|"renders"| node_navbar
node_home -->|"renders"| node_hero
node_home -->|"renders"| node_story
node_home -->|"renders"| node_overview
node_home -->|"renders"| node_masterplan
node_home -->|"renders"| node_recommend
node_home -->|"renders"| node_unitdetail
node_home -->|"renders"| node_explore
node_home -->|"renders"| node_floorplan
node_home -->|"renders"| node_day
node_home -->|"renders"| node_location
node_home -->|"renders"| node_compare
node_home -->|"renders"| node_viewing
node_home -->|"renders"| node_footer
node_masterplan -->|"reads"| node_properties
node_viewing -->|"filters"| node_properties
node_masterplan -->|"uses"| node_scrollhooks
node_viewing -->|"uses"| node_scrollhooks
node_footer -->|"uses"| node_scrollhooks

click node_home "https://github.com/zan701/zan-recidences/blob/main/app/page.tsx"
click node_navbar "https://github.com/zan701/zan-recidences/blob/main/components/layout/Navbar.tsx"
click node_footer "https://github.com/zan701/zan-recidences/blob/main/components/layout/Footer.tsx"
click node_hero "https://github.com/zan701/zan-recidences/blob/main/components/sections/S01_Hero.tsx"
click node_story "https://github.com/zan701/zan-recidences/blob/main/components/sections/S02_Story.tsx"
click node_overview "https://github.com/zan701/zan-recidences/blob/main/components/sections/S03_ProjectOverview.tsx"
click node_masterplan "https://github.com/zan701/zan-recidences/blob/main/components/sections/S04_Masterplan.tsx"
click node_recommend "https://github.com/zan701/zan-recidences/blob/main/components/sections/S05_FindYourHome.tsx"
click node_unitdetail "https://github.com/zan701/zan-recidences/blob/main/components/sections/S06_UnitDetail.tsx"
click node_explore "https://github.com/zan701/zan-recidences/blob/main/components/sections/S07_ExploreHome.tsx"
click node_floorplan "https://github.com/zan701/zan-recidences/blob/main/components/sections/S08_FloorPlan.tsx"
click node_day "https://github.com/zan701/zan-recidences/blob/main/components/sections/S09_ImagineYourDay.tsx"
click node_location "https://github.com/zan701/zan-recidences/blob/main/components/sections/S10_LocationExperience.tsx"
click node_compare "https://github.com/zan701/zan-recidences/blob/main/components/sections/S11_CompareUnits.tsx"
click node_viewing "https://github.com/zan701/zan-recidences/blob/main/components/sections/S12_PrivateViewing.tsx"
click node_properties "https://github.com/zan701/zan-recidences/blob/main/lib/data/properties.ts"
click node_locations "https://github.com/zan701/zan-recidences/blob/main/lib/data/locations.ts"
click node_rooms "https://github.com/zan701/zan-recidences/blob/main/lib/data/rooms.ts"
click node_timeline "https://github.com/zan701/zan-recidences/blob/main/lib/data/timeline.ts"
click node_scrollhooks "https://github.com/zan701/zan-recidences/blob/main/lib/hooks/useGsapScrollTrigger.ts"
click node_types "https://github.com/zan701/zan-recidences/blob/main/lib/types/index.ts"

classDef toneNeutral fill:#f8fafc,stroke:#334155,stroke-width:1.5px,color:#0f172a
classDef toneBlue fill:#dbeafe,stroke:#2563eb,stroke-width:1.5px,color:#172554
classDef toneAmber fill:#fef3c7,stroke:#d97706,stroke-width:1.5px,color:#78350f
classDef toneMint fill:#dcfce7,stroke:#16a34a,stroke-width:1.5px,color:#14532d
classDef toneRose fill:#ffe4e6,stroke:#e11d48,stroke-width:1.5px,color:#881337
classDef toneIndigo fill:#e0e7ff,stroke:#4f46e5,stroke-width:1.5px,color:#312e81
classDef toneTeal fill:#ccfbf1,stroke:#0f766e,stroke-width:1.5px,color:#134e4a
class node_home,node_navbar,node_footer,node_hero,node_story,node_overview,node_scrollhooks,node_types toneBlue
class node_masterplan,node_recommend,node_unitdetail,node_compare,node_properties toneAmber
class node_explore,node_floorplan,node_day,node_location,node_locations,node_rooms,node_timeline toneMint
class node_viewing toneRose
class node_visitor toneIndigo
```

## Components

### Page Shell

- [Showroom page](https://github.com/zan701/zan-recidences/blob/main/app/page.tsx): `app/page.tsx`
- [Navigation](https://github.com/zan701/zan-recidences/blob/main/components/layout/Navbar.tsx): `components/layout/Navbar.tsx`
- [Footer](https://github.com/zan701/zan-recidences/blob/main/components/layout/Footer.tsx): `components/layout/Footer.tsx`
- [Hero](https://github.com/zan701/zan-recidences/blob/main/components/sections/S01_Hero.tsx): `components/sections/S01_Hero.tsx`
- [Project story](https://github.com/zan701/zan-recidences/blob/main/components/sections/S02_Story.tsx): `components/sections/S02_Story.tsx`
- [Project overview](https://github.com/zan701/zan-recidences/blob/main/components/sections/S03_ProjectOverview.tsx): `components/sections/S03_ProjectOverview.tsx`
- [Scroll animation hooks](https://github.com/zan701/zan-recidences/blob/main/lib/hooks/useGsapScrollTrigger.ts): `lib/hooks/useGsapScrollTrigger.ts`
- [Domain types](https://github.com/zan701/zan-recidences/blob/main/lib/types/index.ts): `lib/types/index.ts`

### Unit Discovery

- [Interactive masterplan](https://github.com/zan701/zan-recidences/blob/main/components/sections/S04_Masterplan.tsx): `components/sections/S04_Masterplan.tsx`
- [Home finder](https://github.com/zan701/zan-recidences/blob/main/components/sections/S05_FindYourHome.tsx): `components/sections/S05_FindYourHome.tsx`
- [Unit details](https://github.com/zan701/zan-recidences/blob/main/components/sections/S06_UnitDetail.tsx): `components/sections/S06_UnitDetail.tsx`
- [Unit comparison](https://github.com/zan701/zan-recidences/blob/main/components/sections/S11_CompareUnits.tsx): `components/sections/S11_CompareUnits.tsx`
- [Property catalog](https://github.com/zan701/zan-recidences/blob/main/lib/data/properties.ts): `lib/data/properties.ts`

### Home Experience

- [Explore home](https://github.com/zan701/zan-recidences/blob/main/components/sections/S07_ExploreHome.tsx): `components/sections/S07_ExploreHome.tsx`
- [Floor plans](https://github.com/zan701/zan-recidences/blob/main/components/sections/S08_FloorPlan.tsx): `components/sections/S08_FloorPlan.tsx`
- [Daily-life timeline](https://github.com/zan701/zan-recidences/blob/main/components/sections/S09_ImagineYourDay.tsx): `components/sections/S09_ImagineYourDay.tsx`
- [Location experience](https://github.com/zan701/zan-recidences/blob/main/components/sections/S10_LocationExperience.tsx): `components/sections/S10_LocationExperience.tsx`
- [Location data](https://github.com/zan701/zan-recidences/blob/main/lib/data/locations.ts): `lib/data/locations.ts`
- [Room data](https://github.com/zan701/zan-recidences/blob/main/lib/data/rooms.ts): `lib/data/rooms.ts`
- [Timeline data](https://github.com/zan701/zan-recidences/blob/main/lib/data/timeline.ts): `lib/data/timeline.ts`

### Engagement

- [Private viewing form](https://github.com/zan701/zan-recidences/blob/main/components/sections/S12_PrivateViewing.tsx): `components/sections/S12_PrivateViewing.tsx`

### Other components

- **Site visitor**

## Connections

- Site visitor → Showroom page: opens
- Showroom page → Navigation: renders
- Showroom page → Hero: renders
- Showroom page → Project story: renders
- Showroom page → Project overview: renders
- Showroom page → Interactive masterplan: renders
- Showroom page → Home finder: renders
- Showroom page → Unit details: renders
- Showroom page → Explore home: renders
- Showroom page → Floor plans: renders
- Showroom page → Daily-life timeline: renders
- Showroom page → Location experience: renders
- Showroom page → Unit comparison: renders
- Showroom page → Private viewing form: renders
- Showroom page → Footer: renders
- Interactive masterplan → Property catalog: reads
- Private viewing form → Property catalog: filters
- Interactive masterplan → Scroll animation hooks: uses
- Private viewing form → Scroll animation hooks: uses
- Footer → Scroll animation hooks: uses