40 lines
1.1 KiB
Markdown
40 lines
1.1 KiB
Markdown
|
# Component Standards
|
||
|
|
|
||
|
|
Status: Mandatory
|
||
|
|
Date: 2026-07-03
|
||
|
|
|
||
|
|
## Component Categories
|
||
|
|
|
||
|
|
- UI Component: presentational, reusable, stateless or locally visual state only.
|
||
|
|
- Container Component: binds facades and maps view model to UI inputs.
|
||
|
|
- Layout Component: structural composition of sections/widgets.
|
||
|
|
|
||
|
|
## Reusable UI Rules
|
||
|
|
|
||
|
|
A reusable component must:
|
||
|
|
|
||
|
|
- Receive data via Inputs.
|
||
|
|
- Emit user intent via Outputs.
|
||
|
|
- Contain no HttpClient usage.
|
||
|
|
- Contain no localStorage/sessionStorage usage.
|
||
|
|
- Import no environment data.
|
||
|
|
- Have no tenant-specific behavior.
|
||
|
|
- Have no auth/payment/authorization logic.
|
||
|
|
- Have no route navigation logic.
|
||
|
|
|
||
|
|
## Container Rules
|
||
|
|
|
||
|
|
- Orchestrate business behavior through facades.
|
||
|
|
- Map facade state into UI-friendly view model.
|
||
|
|
- Handle route and guard interactions.
|
||
|
|
- Never leak domain internals to UI components.
|
||
|
|
|
||
|
|
## Reuse and Duplication Rule
|
||
|
|
|
||
|
|
- If two components share more than 70 percent behavior or template structure, extract reusable component.
|
||
|
|
|
||
|
|
## Accessibility and UX
|
||
|
|
|
||
|
|
- Components must provide semantic markup and keyboard support.
|
||
|
|
- Outputs must represent intent, not implementation details.
|