# 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 project-name-specific behavior (including legacy variant naming paths).
- Have no auth/payment/authorization logic.
- Have no route navigation logic.
- Render no hardcoded UI copy when translation keys are expected.

## 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.
