Use Case Tabs
Features
Source and install need .
pnpm dlx shadcn@latest add @assembli/security-certificateSecurity Certificate
Security and compliance section printed like a banknote. Each certification is a certificate with its own guilloché rosette and ink that engraves itself when chosen. A UV lamp follows the pointer to reveal fibres and a hidden verification line, the hologram seal catches the light, and pending audits are stamped. Plus a controls ledger and a report request form.
Props
Other props pass through to the root element.
eyebrow
React.ReactNode
Default
"Security & compliance"title
React.ReactNode
Default
"Security you can check for yourself"intro
React.ReactNode
Default
"Independent auditors test our controls every year. Hold a …issuer
string
Your company, printed as "Issued to …" and in the microtext border.
certifications
SecurityCertification[]
Default
DEFAULT_CERTIFICATIONSdefaultCertification
string
controls
SecurityControl[]
Default
DEFAULT_CONTROLScontrolsTitle
React.ReactNode
Default
"Built into every plan"note
React.ReactNode
A footnote beside the links, e.g. when controls were last reviewed.
links
{ label: string; href: string }[]
onRequestReport
(request: { certification: SecurityCertification; email: string }) => void | Pr…
Called with the email from the request form. Return a promise to show a pending state.
| Prop | Type | Default | Description |
|---|---|---|---|
| eyebrow | React.ReactNode | "Security & compliance" | |
| title | React.ReactNode | "Security you can check for yourself" | |
| intro | React.ReactNode | "Independent auditors test our controls every year. Hold a … | |
| issuer | string | – | Your company, printed as "Issued to …" and in the microtext border. |
| certifications | SecurityCertification[] | DEFAULT_CERTIFICATIONS | |
| defaultCertification | string | – | |
| controls | SecurityControl[] | DEFAULT_CONTROLS | |
| controlsTitle | React.ReactNode | "Built into every plan" | |
| note | React.ReactNode | – | A footnote beside the links, e.g. when controls were last reviewed. |
| links | { label: string; href: string }[] | – | |
| onRequestReport | (request: { certification: SecurityCertification; email: string }) => void | Pr… | – | Called with the email from the request form. Return a promise to show a pending state. |
