2026-07-03 01:26:30 +04:00
|
|
|
# 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.
|
2026-07-09 02:29:12 +04:00
|
|
|
- Have no project-name-specific behavior (including legacy variant naming paths).
|
2026-07-03 01:26:30 +04:00
|
|
|
- Have no auth/payment/authorization logic.
|
|
|
|
|
- Have no route navigation logic.
|
2026-07-09 02:29:12 +04:00
|
|
|
- Render no hardcoded UI copy when translation keys are expected.
|
2026-07-03 01:26:30 +04:00
|
|
|
|
|
|
|
|
## 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.
|
