PrimerLive
Function components to create Phoenix applications, based on GitHub's Primer Design System.

This is a blank slate
Use it to provide information when no dynamic content exists.
- Option
- Option
- Option
50+ components
PrimerLive components can be used in Phoenix LiveView pages and regular (non-LiveView) views in Phoenix applications.
The Primer Design System provides a strong base for creating data driven applications such as rich CRUD applications with interactive forms.
Since this implementation closely adheres to the Primer CSS documentation, extending components with Primer's utility classes should be simple.
Enhancements
In comparison to Primer CSS, PrimerLive has a couple of extra features.
Dialogs
Dialog with attributes for custom showing and hiding, backdrop, modal behaviour, escape key, focus first and focus wrap.
Drawer
A drawer component with attributes for custom showing and hiding, backdrop, modal behaviour, escape key, focus first and focus wrap.
Menus
- Action menu: implemented Primer React's Action menu to show Action list in a menu .
- Select menu: improved animations, a touch layer and optional backdrop.
Form validation styles
Form validation styles are updated to the latest guidelines documented in view-component textfield.
CSS improvements
See CSS overrides.
Status
The list of components is almost complete, with a couple of components on the backlog:
- AvatarStack
- Diffstat
- Popover
- Toasts
- Tooltips