A favicon of Salad ui

Salad ui

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

A screenshot of Salad uiVisit

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.Cache support 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, Select for creating robust forms.
  • Dialogs & Modals: Features Dialog, Alert Dialog, Popover, and Sheet for 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.

Distribution:
opensource
GitHub:
0 Stars
0 Forks
Share:

 

  
 

Similar to Salad ui: