Interactive Examples

Live Component Demos

Interactive examples showcasing real-world usage patterns. Click, type, and interact with these components to see how they behave in production.

E-Commerce Cart

Your Cart

3 items in cart

Industrial Land Plot - Zone A

QAR 250,000

Warehouse Unit - 500 sqm

QAR 75,000

Office Space - Premium

QAR 45,000

Total

QAR 445,000

User Profile Card

Ahmed Hassan

@ahmedh

Senior Operations Manager at Manateq. Passionate about logistics and supply chain optimization.

Doha, QatarManateq

1,234

Followers

567

Following

Posts

Notification Center

Notifications

New zone available

Industrial Zone B is now open for applications

5 min ago

Application approved

Your warehouse lease has been approved

1 hour ago

Document expiring

Your trade license expires in 30 days

2 hours ago

Scheduled maintenance

System maintenance on Dec 25, 2025

1 day ago

File Upload

Upload Documents

Drag and drop files or click to browse

Drag files here or browse

PDF, DOC, XLS up to 10MB

Settings Panel

Settings

Notifications

Email Notifications

Receive updates via email

SMS Notifications

Receive SMS alerts

Marketing Emails

Receive promotional content

Security

Two-Factor Authentication

Add an extra layer of security

Preferences

Language

Dashboard Metrics

Performance Overview

Key metrics for your zones

+12.5%

QAR 2.4M

Total Revenue

+8.2%

1,847

Active Tenants

+2.1%

87.3%

Occupancy Rate

-15%

Support Tickets

Zone Performance

Logistics Park92%

QAR 890K

Revenue

Industrial Zone85%

QAR 1.2M

Revenue

Warehousing Park78%

QAR 320K

Revenue