# Persona component coverage

Reviewed 26 October 2026 against the [official Persona component navigation](https://privy-open-source.github.io/design-system/components/accordion/) and [Getting Started](https://privy-open-source.github.io/design-system/docs/getting-started.html).

**80 reference entries** mapped to local examples. This covers UI patterns, not Persona Vue API compatibility or complete feature parity. Local styling follows Hermod. PDF and signature previews do not perform PDF editing or digital signing.

| Persona entry | Local example | Coverage | Boundaries |
| --- | --- | --- | --- |
| [Accordion](https://privy-open-source.github.io/design-system/components/accordion/) | [overlays](index.html#overlays) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Avatar](https://privy-open-source.github.io/design-system/components/avatar/) | [data](index.html#data) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Badge](https://privy-open-source.github.io/design-system/components/badge/) | [data](index.html#data) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Banner](https://privy-open-source.github.io/design-system/components/banner/) | [feedback](index.html#feedback) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Button](https://privy-open-source.github.io/design-system/components/button/) | [buttons](index.html#buttons) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Button Group](https://privy-open-source.github.io/design-system/components/button-group/) | [extra-navigation](index.html#extra-navigation) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Camera](https://privy-open-source.github.io/design-system/components/camera/) | [camera-cropper](index.html#camera-cropper) | Companion example | Browser camera API; permission only after Enable; no stream upload. |
| [Card](https://privy-open-source.github.io/design-system/components/card/) | [data](index.html#data) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Carousel](https://privy-open-source.github.io/design-system/components/carousel/) | [carousel-charts](index.html#carousel-charts) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Chart](https://privy-open-source.github.io/design-system/components/chart/) | [carousel-charts](index.html#carousel-charts) | Companion example | Synthetic bar chart and data table; not a charting library. |
| [Collapse](https://privy-open-source.github.io/design-system/components/collapse/) | [overlays](index.html#overlays) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Contextual Bar](https://privy-open-source.github.io/design-system/components/contextual-bar/) | [interactive-table](index.html#interactive-table) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Cropper](https://privy-open-source.github.io/design-system/components/cropper/) | [camera-cropper](index.html#camera-cropper) | Companion example | Square crop with zoom and x/y controls; no rotation or arbitrary aspect-ratio API. |
| [Dot](https://privy-open-source.github.io/design-system/components/dot/) | [feedback](index.html#feedback) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Dropdown](https://privy-open-source.github.io/design-system/components/dropdown/) | [app-navbar](index.html#app-navbar) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Dropdown Subitem](https://privy-open-source.github.io/design-system/components/dropdown-subitem/) | [extra-navigation](index.html#extra-navigation) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Label](https://privy-open-source.github.io/design-system/components/label/) | [forms](index.html#forms) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [List Group](https://privy-open-source.github.io/design-system/components/list-group/) | [member-lists](index.html#member-lists) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Modal](https://privy-open-source.github.io/design-system/components/modal/) | [overlays](index.html#overlays) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Nav](https://privy-open-source.github.io/design-system/components/nav/) | [navigation](index.html#navigation) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Pagination](https://privy-open-source.github.io/design-system/components/pagination/) | [interactive-table](index.html#interactive-table) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Progress](https://privy-open-source.github.io/design-system/components/progress/) | [feedback](index.html#feedback) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Progress Indicator](https://privy-open-source.github.io/design-system/components/progress-indicator/) | [carousel-charts](index.html#carousel-charts) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Progressbar](https://privy-open-source.github.io/design-system/components/progressbar/) | [feedback](index.html#feedback) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Qrcode](https://privy-open-source.github.io/design-system/components/qrcode/) | [signature-qr](index.html#signature-qr) | Companion example | Generated static QR asset for the public documentation URL; not an authentication QR. |
| [Ringbar](https://privy-open-source.github.io/design-system/components/ringbar/) | [carousel-charts](index.html#carousel-charts) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Sheet](https://privy-open-source.github.io/design-system/components/sheet/) | [drawers](index.html#drawers) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Shimmer](https://privy-open-source.github.io/design-system/components/shimmer/) | [skeletons](index.html#skeletons) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Spinner](https://privy-open-source.github.io/design-system/components/spinner/) | [feedback](index.html#feedback) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Strengthbar](https://privy-open-source.github.io/design-system/components/strengthbar/) | [advanced-inputs](index.html#advanced-inputs) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Tabs](https://privy-open-source.github.io/design-system/components/tabs/) | [navigation](index.html#navigation) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Wizard](https://privy-open-source.github.io/design-system/components/wizard/) | [stepper](index.html#stepper) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Caption](https://privy-open-source.github.io/design-system/components/caption/) | [typography](index.html#typography) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Heading](https://privy-open-source.github.io/design-system/components/heading/) | [typography](index.html#typography) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Subheading](https://privy-open-source.github.io/design-system/components/subheading/) | [typography](index.html#typography) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Text](https://privy-open-source.github.io/design-system/components/text/) | [typography](index.html#typography) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Truncate](https://privy-open-source.github.io/design-system/components/truncate/) | [carousel-charts](index.html#carousel-charts) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Table Flex](https://privy-open-source.github.io/design-system/components/table-flex/) | [interactive-table](index.html#interactive-table) | Companion example | Responsive semantic table inside a scroll container, not Persona Table Flex API. |
| [Table Static](https://privy-open-source.github.io/design-system/components/table-static/) | [data](index.html#data) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Calendar](https://privy-open-source.github.io/design-system/components/calendar/) | [calendar-time](index.html#calendar-time) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Checkbox](https://privy-open-source.github.io/design-system/components/checkbox/) | [selection](index.html#selection) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Datepicker](https://privy-open-source.github.io/design-system/components/datepicker/) | [date-filters](index.html#date-filters) | Companion example | Native date controls plus a separate inline calendar; native popup styling depends on browser. |
| [Form Group](https://privy-open-source.github.io/design-system/components/form-group/) | [forms](index.html#forms) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Input](https://privy-open-source.github.io/design-system/components/input/) | [forms](index.html#forms) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Input Color](https://privy-open-source.github.io/design-system/components/input-color/) | [selection](index.html#selection) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Input File](https://privy-open-source.github.io/design-system/components/input-file/) | [uploads](index.html#uploads) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Input Group](https://privy-open-source.github.io/design-system/components/input-group/) | [advanced-inputs](index.html#advanced-inputs) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Input Password](https://privy-open-source.github.io/design-system/components/input-password/) | [advanced-inputs](index.html#advanced-inputs) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Input Pin](https://privy-open-source.github.io/design-system/components/input-pin/) | [advanced-inputs](index.html#advanced-inputs) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Input Range](https://privy-open-source.github.io/design-system/components/input-range/) | [selection](index.html#selection) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Radio](https://privy-open-source.github.io/design-system/components/radio/) | [selection](index.html#selection) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Richtext](https://privy-open-source.github.io/design-system/components/richtext/) | [richtext](index.html#richtext) | Companion example | Small editable toolbar; legacy execCommand for browser undo; allowlisted preview and text-only paste. Not the Persona richtext package. |
| [Select](https://privy-open-source.github.io/design-system/components/select/) | [comboboxes](index.html#comboboxes) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Textarea](https://privy-open-source.github.io/design-system/components/textarea/) | [forms](index.html#forms) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Time](https://privy-open-source.github.io/design-system/components/time/) | [calendar-time](index.html#calendar-time) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Timepicker](https://privy-open-source.github.io/design-system/components/timepicker/) | [calendar-time](index.html#calendar-time) | Companion example | Native time control; browser popup varies. |
| [Toggle](https://privy-open-source.github.io/design-system/components/toggle/) | [selection](index.html#selection) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Breadcrumbs](https://privy-open-source.github.io/design-system/components/breadcrumbs/) | [navigation](index.html#navigation) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Navbar](https://privy-open-source.github.io/design-system/components/navbar/) | [app-navbar](index.html#app-navbar) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Page](https://privy-open-source.github.io/design-system/components/page/) | [page-examples](index.html#page-examples) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Sidebar](https://privy-open-source.github.io/design-system/components/sidebar/) | [navigation](index.html#navigation) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Sidebar Menu](https://privy-open-source.github.io/design-system/components/sidebar-menu/) | [navigation](index.html#navigation) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Signature Draw](https://privy-open-source.github.io/design-system/components/signature-draw/) | [signature-qr](index.html#signature-qr) | Companion example | Pointer drawing and PNG export only; no digital-signing/verification backend. |
| [Signature Text](https://privy-open-source.github.io/design-system/components/signature-text/) | [signature-qr](index.html#signature-qr) | Companion example | Typed visual signature and PNG export only. |
| [PDF Viewer](https://privy-open-source.github.io/design-system/components/pdf-viewer/) | [pdf-patterns](index.html#pdf-patterns) | Companion example | Native embedded local PDF with open/download fallback; no PDF.js search or page virtualization. |
| [PDF Object](https://privy-open-source.github.io/design-system/components/pdf-object/) | [pdf-patterns](index.html#pdf-patterns) | Companion example | Movable/resizable local overlay surface; does not edit the PDF bytes. |
| [PDF Helipad](https://privy-open-source.github.io/design-system/components/pdf-helipad/) | [pdf-patterns](index.html#pdf-patterns) | Companion example | Drag/drop or click insertion into the placement surface; no PDF serialization. |
| [PDF Text](https://privy-open-source.github.io/design-system/components/pdf-text/) | [pdf-patterns](index.html#pdf-patterns) | Companion example | Editable text overlay; no PDF font embedding or export. |
| [Dialog](https://privy-open-source.github.io/design-system/components/dialog/) | [overlays](index.html#overlays) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Overlay](https://privy-open-source.github.io/design-system/components/overlay/) | [overlays](index.html#overlays) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Popup](https://privy-open-source.github.io/design-system/components/popup/) | [context-help](index.html#context-help) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Toast](https://privy-open-source.github.io/design-system/components/toast/) | [feedback](index.html#feedback) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Tour](https://privy-open-source.github.io/design-system/components/tour/) | [extra-navigation](index.html#extra-navigation) | Companion example | Three-step modal walkthrough; no element spotlight positioning. |
| [Dropzone](https://privy-open-source.github.io/design-system/components/dropzone/) | [uploads](index.html#uploads) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Popover](https://privy-open-source.github.io/design-system/components/popover/) | [context-help](index.html#context-help) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Spread](https://privy-open-source.github.io/design-system/components/spread/) | [extra-navigation](index.html#extra-navigation) | Companion example | Local flex layout with separated content; headless API parity is not claimed. |
| [Steps](https://privy-open-source.github.io/design-system/components/steps/) | [stepper](index.html#stepper) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Aspect Ratio](https://privy-open-source.github.io/design-system/components/aspect-ratio/) | [carousel-charts](index.html#carousel-charts) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |
| [Markdown](https://privy-open-source.github.io/design-system/components/markdown/) | [composer](index.html#composer) | Companion example | Restricted inline strong/em/code/link preview; not a full CommonMark renderer. |
| [Tooltip](https://privy-open-source.github.io/design-system/components/tooltip/) | [context-help](index.html#context-help) | Local equivalent | Uses local HTML/CSS/JavaScript and Hermod tokens; no Persona props/API compatibility implied. |