Certificate Widget
Component Detail
User Interface
medium complexity
mobile
0
Dependencies
1
Dependents
2
Entities
0
Integrations
Description
Reusable card-style widget that renders a compact or full representation of a peer mentor certificate. Uses the design token system for consistent styling and supports both summary (for dashboards or lists) and detailed (for the certificate screen) display modes. Implements WCAG 2.2 AA contrast and touch target requirements.
certificate-widget
Responsibilities
- Render certificate data in compact and detailed display modes
- Apply design token colors and typography for prestige card styling
- Indicate certification validity status visually (active, expiring, expired)
- Expose configurable display density for embedding in other screens
- Meet WCAG 2.2 AA accessibility requirements for all rendered elements
Interfaces
CertificateWidget({certificate, mode})
renderCompactCard(certificate)
renderDetailCard(certificate)
getStatusBadge(status)
formatExpiryDisplay(expiryDate)
onShareTap()
onTap()
Relationships
Related Data Entities (2)
Data entities managed by this component