Salad ui
A Phoenix LiveView component library inspired by shadcn UI, offering a collection of customizable elements for rapid UI development.

Salad UI: Customizable Phoenix LiveView Components Inspired by Shadcn
Salad UI is a comprehensive component library for Phoenix LiveView, drawing inspiration from the popular shadcn/ui. It provides developers with a rich set of pre-built, yet highly customizable, UI elements designed to accelerate the development of modern and interactive web applications. Easily integrate and tailor components to fit your project's specific needs, whether you prefer using it as a library or embedding the source code for deeper modifications.
Features:
- Rich Component Set: Offers a wide variety of pre-built UI components including Accordion, Alert, Button, Card, Dialog, Form elements, Input, Table, and Tooltip.
- CLI for Project Integration: Easily initialize Salad UI (
mix salad.init) and add specific components (mix salad.add) to your Phoenix project. - Flexible Usage Options: Integrate as a dependency or embed source code for complete customization of individual components.
- Tailwind CSS Styling: Components are styled with Tailwind CSS, with
TwMerge.Cachesupport for efficient class management and easy theming. - Inspired by shadcn/ui: Adopts a composable and customizable approach similar to shadcn/ui, designed for Phoenix LiveView.
- Customizable Error Handling: Allows configuration of a custom error translation function for form components and alerts.
- Interactive Storybook Demo: Provides a live Storybook for developers to explore, visualize, and test components available at salad-storybook.fly.dev.
- Comprehensive Form Building: Includes essential elements like
Input,Label,Checkbox,Selectfor creating robust forms. - Dialogs & Modals: Features
Dialog,Alert Dialog,Popover, andSheetfor various overlay and modal interactions.
Summary:
Salad UI empowers Elixir and Phoenix developers to build sophisticated user interfaces with less effort. By offering a collection of shadcn-inspired, customizable LiveView components, complete with CLI tools for easy management and deep integration options, it streamlines the UI development process. It's ideal for projects requiring a consistent, modern look and feel, backed by Tailwind CSS and the reactivity of Phoenix LiveView.