Arek UI: tailwindCSS + Ark UI

Copy paste components to your project.

Supported frameworks:

React https://arek-ui.fly.dev/

SolidJs https://arek-ui-solid.fly.dev/

Inspired by:

https://ui.shadcn.com/

https://park-ui.com/

https://chakra-ui.com/

Setup:

React:
setup tailwind css - https://tailwindcss.com/docs/installation
copy over the tailwind config
copy over the utils folder, it contains three key files:
- cn - merges tailwind class names
- styled - wraps a component in a tailwind variants recipe and adds a new unstyled prop
- create-styled-context - wraps root component and its slots in a tailwind variants recipe, adds classes and unstyled props to the root, and unstyled prop to the child slots
use the base css for tailwind
install -D tailwind-animate @savvywombat/tailwindcss-grid-areas
install @ark-ui/solid clsx tailwind-variants tailwind-merge
the default icons used are lucide-solid, you need to install those for some components
some components require individual dependencies, you need to install those to use them