jolbol1 / jolly-ui Goto Github PK

Tracking contentlayerdev/contentlayer#429 contentlayer has not received/planning to receive support going forward.

Alternatives:
Velite - Seems prertty one to one replacement
MDXTS - Looks like a really cool solution for a documentation site like this.

Some components are not 1-to-1 with shadcn/ui.

In the case of the combobox (shadcn | jolly), for example, one is a field you can click and type into while the other acts more like a button.

I think it would be most helpful if both the components and examples led a 1:1 relationship to shadcn/ui, especially if the goal is to be a direct and more accessible alternative until shadcn/ui switches to using React Aria or similar.

In v2 components I have extended the render props methods of styling certain components. This works however you do have to do a work around with tailwind at the moment, by making all duplicate styles important that you want to appear.

Example - Button:

To style this button we can use the render props:

import { Button } from "@/components/ui/button"
 
export function ButtonDemo() {
  return <Button className={({ isHovered }) => isHovered ? "!bg-red-600" : ""}>Button</Button>
}

Since the default styles however have a data-[hovered]:bg-primary/90. The default styles will be applied, unless as above we make the class important !

You could get around this by allowing the correct merge behaviour by changing the string too data-[hovered]:bg-red-600 but it seems like bad DX to check for hovering twice.

My plan, to enable all forms of styling to have good DX in the future is change all defaults to use the render prop methods, this way tailwind merge should correctly apply passed in classNames.

Render props docs

https://github.com/adobe/react-spectrum/tree/main/starters/tailwind

Cool that you're working on this! Good call on the name change as well 👍

I noticed you have manual installation. DraftUI opted to use https://sly-cli.fly.dev/ to support automatic installation of components and I think you may find that useful as well.

Hey, thanks for this amazing option to use react aria components, I've been trying to use it, but I always get this error:

`➜ pnpm dlx @sly-cli/sly add jolly-ui button

Packages: +78
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Progress: resolved 100, reused 74, downloaded 4, added 78, done
Library/Caches/pnpm/dlx/wir6pp3fuan2dhdnga36uy5t6u/18f1504216a-3f66/node_modules/.pnpm/[email protected]/node_modules/esbuild: Running postinstall scriptLibrary/Caches/pnpm/dlx/wir6pp3fuan2dhdnga36uy5t6u/18f1504216a-3f66/node_modules/.pnpm/[email protected]/node_modules/esbuild: Running postinstall script, done in 565ms
Could not connect to the registry at https://sly-cli.fly.dev/registry/index.json.
Check to see if the registry is running, or provide a custom URL by setting the REGISTRY_URL environment variable.`

Hi, there.

This project and shadcnui are amazing. It makes so easy for people to migrate from one ui lib to another and keep the customisability at the same time.

I see this project is still at initial stage, would be nice you can put out a list of work items so that the community and submit PRs accordingly. Something like fabian-hiller/valibot#287

Great work on getting this library started. I was wondering if you've considered collaborating with the folks working on the Draft UI project, which appears to share some of the goals as shadcn-aria. If the two are as closely aligned as they seem, it might be a great opportunity to focus efforts on a single project.

cc @IHIutch

When the dialog is in sheet mode the animation in works however when closing it appears to flash at the end of the animation

https://www.jollyui.dev/docs/components/tabs

The copy paste tab just shows the headings without the code box to copy the code from

Just encountered this impressive UI lib！
However, I noticed that the comp at the bottom of the doc page cause left&right sidebar to reflow during tab switch, which seem like a bad UX in my opinion.

Wanna know your opinion