DaisyUIComponents - A Phoenix LiveView + DaisyUI library 🌼

New version released
Now the welcome page have a theme switch and new components were added

Hero

The ideal component for your landing page

image799×298 34.1 KB

Storybook

Join

Join any component with the join component and utility classes

image414×282 3.12 KB

<.join direction="horizontal">
  <.button class="join-item">Button</.button>
  <.button class="join-item">Button</.button>
  <.button class="join-item">Button</.button>
</.join>

Storybook

Indicator

Component to place content on the corner of another element

image232×207 2.95 KB

<.indicator >
  <:badge color="success">hi</:badge>
  <div class="bg-base-300 grid h-32 w-32 place-items-center">content</div>
</.indicator>

Storybook

More components will be added soon, with plans to ensure compatibility with the upcoming DaisyUI 5.0, which is set to launch in two weeks

When I look into the storybook → Table, then the first table has the headers wrong:

table655×379 19.2 KB

Good catch! Just pushed a fix, missing the ID on the table header

Very nice! I integrate DaisyUI into most of my projects. I will give to this try next time!

Nice job! I was looking into using DaisyUI so I appreciate the work. Are you looking for some help implementing the components? If so let me know

Thanks, Adilson, for checking it out! Any help is welcome and I would love to have contributors on the project. If there is a specific component you would like to see, let me know, I can prioritize it right away.

How much effort is it to upgrade to DaisyUI 5? Looks like you’ve already started but I’d be happy to help complete that if it wouldn’t get in your way.

thank you @typesend, I was planning to finish on 23th of this month, when I come back from traveling. If you need it sooner I can definitively take a look on your PR.
Overall the upgrade is simple, only exception is daisyUI forms with fieldset and labels, since the new classes they made for forms are not backwards compatible, kinda breaks the form components I built. If you want to give a try I can check it out

Is this compatible w/ the new standalone mode?

i.e not requiring a build step?

Hey @zachdaniel,

Since this library doesn’t handle the assets, it should work with the tailwind standalone or using directly the DaisyUI CDN.
The assets are handled by the application (that is including this lib) build process. On the readme I added the conventional way of adding daisyUI assets in a phoenix project, which is through npm but anything can work - e.g using bun for example.