PropertyRoot is a premium, production-grade React 19 frontend dashboard template purpose-built for Short-Term Rental (STR) property managers, Airbnb host networks, and vacation rental operators. It ships with 15 fully-wired modules, an interactive AI Agent & Workflow Canvas, a granular 5-role RBAC system, and an offline-first IndexedDB architecture – covering every operational workflow a modern STR business needs.

Template Scope: PropertyRoot is a React 19 frontend-only template. All data is powered by a realistic local mock layer (Zustand + IndexedDB). It is designed so a developer can swap in any backend – REST API, GraphQL, Supabase, Firebase, Laravel, Node.js – by replacing the typed service interfaces in src/lib/. No real backend is included or required to run the demo.

VIEW LIVE DEMO → propertyroot.web.app

Role	Email	Password	Access Scope
Super Admin	admin@propertyroot.com	admin123	Full portfolio, system settings, all modules
Property Manager	manager@propertyroot.com	manager123	Bookings, calendar, service dispatch, owners
Owner	owner@propertyroot.com	owner123	Own properties, payout statements, reports
Maintenance	maintenance@propertyroot.com	maint123	Work orders, task dispatch, service hub
Analyst	analyst@propertyroot.com	analyst123	RevPAR analytics, AI reconciliation, financials

AI Canvas & Workflow Automation

The crown jewel of PropertyRoot is its interactive, node-based AI Agent Canvas – a visual drag-and-drop workflow builder that lets operators wire up data sources to intelligent micro-agents:

Visual Workflow Builder: Drag, connect, and arrange nodes on a live canvas (React DnD + Framer Motion). Zero code needed to build automation flows.
Revenue Gap Detection Agent: Automatically identifies calendar gaps between bookings and triggers pricing or marketing suggestions.
AI Revenue Reconciliation: Cross-references OTA gross totals (Airbnb, Booking.com, Expedia) against payout records to surface discrepancies instantly.
Owner Risk & Churn Scoring: Predictive engine scores each owner’s churn probability and flags at-risk relationships before they escalate.
Non-Blocking Web Worker Engine: All heavy analytics (gap detection, reconciliation, service scoring) execute in dedicated Web Workers, keeping the UI 60 fps and responsive at all times.

15 Fully-Built Application Modules

Dashboard: Executive KPI cards – portfolio health, RevPAR, ADR, occupancy, today’s schedule, AI insight strip.
Bookings: Multi-channel reservation list (Airbnb, Booking.com, Expedia, Direct) with status tracking, payout columns, guest details, and CSV export.
Calendar: Monthly / weekly color-coded multi-channel booking calendar with drag-to-reschedule support.
AI Agent Canvas: Node-based visual workflow builder for AI-powered STR automation (see above).
Financials: RevPAR / ADR trend charts, payout timelines, commission breakdowns, and revenue reconciliation reports.
Owner Portal: Per-owner property portfolios, performance metrics, churn risk scores, and contact management.
ServiceHub: Maintenance, cleaning, and inspection task dispatch with technician reliability scoring and real-time status tracking.
Portfolio: Bird’s-eye view of all managed properties with occupancy heat maps and property-level drill-downs.
Events & Demand: Local event tracking with demand-signal heat maps to inform dynamic pricing decisions.
Mid-Term Rentals: Dedicated module for 28–90 day rental management – a growing market vertical.
Template Library: Saved guest-communication message templates with variable substitution.
RBAC Manager: Visual role and permission matrix editor for all 5 system roles.
Settings & Branding: Live theme editor – switch accent color, typography, border radius, card style, spacing, and dark / light mode in real time.
Profile: User account management, notification preferences, and security settings.
Showcase: Component library and UI kit showcase for developers extending the template.

Granular 5-Role RBAC System

Module-level and action-level permission gating via reusable <PermissionGate> components and useAuthStore hook.
Each of the 5 roles (Super Admin, Property Manager, Owner, Analyst, Maintenance) sees a completely tailored UI – sidebar, actions, data columns – with no code changes required.
Extend or add roles by editing a single typed permissions map in src/lib/rbac/.

Technical Highlights

Offline-First Architecture: IndexedDB (via idb v8) provides persistent local storage – the app loads and works without a network connection.
PWA Ready: Includes a service worker and manifest – installable on desktop and mobile as a native-like app.
Strict TypeScript: Strict mode enabled throughout – no any casts, fully typed service interfaces ready for backend wiring.
Self-Hosted Fonts: Plus Jakarta Sans served from @fontsource – zero external CDN requests on load.
Bundled Asset Safe: All placeholder images are original bundled SVGs – no Unsplash or third-party license restrictions.
Test Suite Included: Vitest + Testing Library – 28 passing assertions covering RBAC engine and auth service.
Keyboard Power-User Features: Global Ctrl+K command palette and ? shortcut cheat sheet.
Export Utilities: One-click JSON and CSV export for bookings, financials, and portfolio data.

Tech Stack

Layer	Technology
Framework	React 19
Build Tool	Vite 6
Language	TypeScript 5.5+ (Strict Mode)
State Management	Zustand 5
Offline Storage	IndexedDB via `idb` 8
UI Primitives	Radix UI + shadcn/ui (MIT)
Styling	Tailwind CSS 4
Charts	Recharts 2
Animations	Framer Motion 12 (`motion`)
Drag & Drop	React DnD 16
Routing	React Router 8
Icons	Lucide React
Fonts	Plus Jakarta Sans (self-hosted via @fontsource)
Testing	Vitest 3 + Testing Library

Installation – Up and Running in 2 Minutes

# 1. Extract the ZIP and navigate into the source folder
cd "PropertyRoot React/source" 

# 2. Install all dependencies
npm install

# 3. Start the development server
npm run dev
# → Opens at http://localhost:5173

# 4. Build a production bundle
npm run build

# 5. Run the included test suite
npm test

Requirements: Node.js 18+ and npm 9+. No database or server setup needed – runs entirely in the browser.

Browser & Device Compatibility

Chrome 100+, Firefox 100+, Safari 15.4+, Edge 100+, Opera 86+
Fully responsive: Desktop (1920px), Laptop (1280px), Tablet (768px)
PWA installable on Windows, macOS, Android, and iOS

What’s Inside the ZIP

source/ – Complete React 19 + TypeScript source code (uncompiled, buyer-editable)
docs/documentation.html – Full offline HTML documentation
docs/installation.html – Step-by-step setup guide
README.md – Quick-start guide with tech stack overview
CHANGELOG.md – Full version history (Keep-a-Changelog format)
SUPPORT.md – Support policy and contact instructions
LICENSE – Envato Regular/Extended License
ATTRIBUTIONS.md – Third-party library attributions

Support Policy

Every purchase includes 6 months of dedicated author support via Envato messaging and item comments. Support covers installation questions, bug reports, configuration help, and backend integration guidance. Custom feature development and server-side backend builds are outside the scope of included support.

Response time: within 48 business hours (Mon–Fri, UTC+5:30).

PropertyRoot - STR Property Management Dashboard (React 19, TypeScript, AI Canvas & RBAC)