# Signal Design System

> Exotel's React design system (`@exotel-npm-dev/signal-design-system`) — MUI-based components, theming, and product UX rules, exposed to AI coding agents via a Storybook MCP server so agents build against real props and rules instead of guessing.

## Start here

- [Signal MCP](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/mcp): MCP server URL — component docs, props, stories, and the UX Constitution, servable to any MCP-capable agent
- [Build with AI](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/?path=/docs/documentation-build-with-ai--docs): interactive per-agent setup walkthrough (Claude Code, Cursor, any MCP agent) with copy-paste prompts
- [Signal MCP reference](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/?path=/docs/documentation-signal-mcp--docs): full MCP tool reference — inputs, real example calls/responses

## Product rules

- [UX Constitution](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/?path=/docs/documentation-ux-constitution--docs): canonical product UX rulebook — shell layout, tables, drawers vs dialogs, settings, form inputs — read before component docs
- [App Shell](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/?path=/docs/documentation-app-shell--docs): canonical composed AppBar + Navigation + main content reference — the required starting point for a new app or screen

## Setup

- [Storybook — Overview](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/?path=/docs/documentation-overview--docs): what the design system provides, architecture, tech stack
- [Storybook — Installation](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/?path=/docs/documentation-installation--docs): npm install, peer deps, MUI X license key
- [Storybook — How to Use](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/?path=/docs/documentation-how-to-use--docs): theme setup and usage examples

## Reference

- [Storybook — all components](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/): full component catalog, variants, interactive examples
- [Storybook — Changelog](https://main--69ba4becb6eabba83cbd8bc1.chromatic.com/?path=/docs/documentation-changelog--docs): version history