# apps/web/src/components (index)
dir: apps/web/src/components

## role
Provides reusable, type-safe React UI components for the web application including layout shells, data display states, iconography, code editing, syntax highlighting, authentication guards, and toast notification rules.
## parent
index: apps/web/src/.pi-map.index.md
map: apps/web/src/.pi-map.md
## children
- apps/web/src/components/features
  index: apps/web/src/components/features/.pi-map.index.md
  map: apps/web/src/components/features/.pi-map.md
## files
- app-shell.tsx
- code-editor.tsx
- data-states.tsx
- icon.tsx
- loading-overlay.tsx
- protected-route.test.tsx
- protected-route.tsx
- syntax-highlighter.tsx
- toast-rules.test.ts
- toast-rules.ts
## links
index: apps/web/src/components/.pi-map.index.md
map: apps/web/src/components/.pi-map.md
## workflows
- change components behavior
  read: app-shell.tsx, code-editor.tsx, data-states.tsx
- update components tests
  read: protected-route.test.tsx, toast-rules.test.ts
- explore components subdirectories
  index: apps/web/src/components/features/.pi-map.index.md
## dirty
-