usage
- Use verified UJ content
- Reuse semantic tokens
- Keep business logic in the owning application
Structure
Visually hidden content
Provide screen-reader context without visible duplication.
Production component
Live preview
This example is rendered from the same package consumed by UJ applications.
Visible label with additional screen-reader context
Contract
Usage and quality requirements
The contract keeps purpose, states and ownership visible before a component is reused.
states
- default
- focus-visible
- disabled or unavailable where applicable
- long content
- narrow viewport
- dark theme
purpose
Provide screen-reader context without visible duplication.
responsive
- 320px
- 768px
- 1440px
- 200% text resize
accessibility
- Native semantics first
- WCAG 2.2 AA
- Keyboard and touch operation
- No colour-only meaning