@payload/ui needs documentation

[ckruppe]

The problem: As i make many customisations to the admin backend (adding new fields, views and so on) i find it hard to find the right components from payload that are already there. Its also particularily hard to find out how they work. I have to dig into the repository all the time especially if my goal is that these custom changes integrate seamless in the UI of the existing admin.

The solution:
I would love to see an separate documentation of the the @payload/ui package or even an storybook with autodocs. This would help build custom features for the admin faster and easyier.

It would also boost creation of plugins i suppose as easier implementation brings mote people to actual building new stuff for the payload admin.

[matthijs166]

I agree!
Something like this would be awesome: https://ui.shadcn.com/docs/components/badge

[marpstar]

A lot of the individual components (inputs, buttons, etc) aren't too difficult to figure out but things like Table are much less straight-forward. I see the team is still shifting a lot of things between the payload and @payloadcms/ui packages, even as recently as this week, so I'm hoping that they're working to solidify the API in preparation of documenting things.

Pulling in other UI libraries feels wrong but is infinitely easier to do at the moment than pull in anything from @payloadcms/ui.

[michaelshowes]

For a platform that prides itself on customizability, it's definitely a chore to find some of these features and components. You'd think clear documentation would be a top priority. Unfortunately, to figure out some things to you have to reverse engineer existing code or ask in the discord.

[matthijs166]

Maybe we can start a PR to extend the docs on this topic. Where is the best place to start?

[ckruppe]

I thinkits fine for now that the documentation is not there. As there are other things with more priority. Also an good documentation much needs time. It would be easier if there is some, but i mostly intended this discussion as reminder that there is something missing. :)

[ericwaetke]

I've gone ahead and started a PR for this! Not much documented yet, so please feel free to help out! #11469

[zubricks]

Appreciate everyone's patience here—and I'm happy to report a PR has just been approved to address this gap! I took a first pass through our many components and built a new block for our docs so you can see the component, see the CSS it uses (how to target it) and read through the necessary docs + props for each component.

I've already started on the 4.0 variant for this initial work and that will come as a fast follow.

ui-components-preview.mp4

[zubricks]

Docs for 3.0 are live!—> https://payloadcms.com/docs/ui-components/overview

I’ve documented an initial batch of the most common and visually useful components, but feel free to call out any that ya'll use / want to use and I'll add the to the shortlist. I've already started work on a bunch more for v3, and alongside this the initial batch of component docs for v4 has an open PR.