Components

Interactive shared components with live previews, prop documentation, and copy-ready code examples. All components use mock data for safe prototyping and experimentation.

Available Components

Layout

Complete layout system with header, navigation, and interactive full-screen demo

MenuGrid

Interactive grid component with hierarchical navigation and variant examples

PageHeader

Page headers with main and subnav variants, customizable styling options

Icon

Universal icon component with gallery showcase and size examples

MfaBanner (CMS)

MFA registration banner with prominent and alert variants for the CMS dashboard

WelcomeStrip

CMS dashboard welcome strip — greeting plus optional profile photo, with the legacy long-name layout

StatusPanel

Shared status card for auth and error fallbacks. Two tones (info, error) with full-screen and inline wrapper patterns.

What Each Component Includes

Live Preview

Interactive component examples

Code Examples

Copy-ready implementation

Props Table

Complete prop documentation

TypeScript

Full type definitions