Overview:
The SaladUITestsModule is a library aimed at porting the shadcn UI to Phoenix Liveview Component. It is still in its early stages, with potential breaking changes in minor releases until version 1.0. The library offers a variety of components for UI development and provides a demo at a provided link.
Features:
- Custom Color: Easily add custom colors to your app.css file.
- Tailwind Configuration: Configure Tailwind CSS to integrate with SaladUI.
- Development Environment: Instructions on setting up and developing with SaladUI locally.
- Unit Testing: Guidelines for running tests and maintaining code quality.
Installation:
To install SaladUI, follow these steps:
- Add SaladUI to your list of dependencies in
mix.exs
:{:salad_ui, "~> 0.1"}
- Customize colors by visiting https://ui.shadcn.com/themes and following the provided instructions.
- Create a new file
tailwind.colors.json
in your assets directory. - Configure Tailwind to extract classes from SaladUI and install Tailwind CSS plugins.
- Develop SaladUI by cloning the repo and starting Storybook.
- Ensure dependencies are installed in your project folder by running
mix deps.get
. - Run tests using
mix test
ormix test.watch
. - Format your code with
mix format
before submitting pull requests.
Summary:
SaladUITestsModule offers a promising approach to incorporating shadcn UI into Phoenix Liveview Component. The library is under active development, and users can expect enhancements and adjustments in upcoming releases. With a variety of components available and clear installation and development instructions, SaladUI presents a valuable tool for UI development projects.