Closed Jay-Karia closed 1 week ago
Hey Jay, could you please assign me this issue @Jay-Karia
And could you please specify in detail about the issue
Hey Jay, could you please assign me this issue @Jay-Karia
There is no need to assign issues, you can send a PR
Add a link to every component header which links to it's source.
There are two different sources for every component: Default and New York. Default: https://github.com/shadcn-ui/ui/tree/main/apps/www/registry/default/ui New York: https://github.com/shadcn-ui/ui/tree/main/apps/www/registry/new-york/ui
The link would be similar to:
Example:
The source for Accordion
lies here:
Default: https://github.com/shadcn-ui/ui/blob/main/apps/www/registry/default/ui/accordion.tsx
NewYork: https://github.com/shadcn-ui/ui/blob/main/apps/www/registry/new-york/ui/accordion.tsx
Yeah got it, so you want to add an extra button to every component to the documentation which refers it's source to the github page. Am I right ? New to open source, thus asking so many questions
Yeah got it, so you want to add an extra button to every component to the documentation which refers it's source to the github page. Am I right ? New to open source, thus asking so many questions
Yes
Hey, in the codebase the docs and api references are there via the content layer. They are found from the allDocs
array which is present in contentlayer/generated
and are mapped through based on the query params, like this:
{doc.links?.api && (
<Link
href={doc.links.api}
target="_blank"
rel="noreferrer"
className={cn(badgeVariants({ variant: "secondary" }), "gap-1")}
>
API Reference
<ExternalLinkIcon className="h-3 w-3" />
</Link>
)}
So if we want to add a new link like source, we would have to update the contentlayer/generated
file and add the sources to all components and then map them like this for example,
{doc.links?.source && (
<Link
href={doc.links.source}
target="_blank"
rel="noreferrer"
className={cn(badgeVariants({ variant: "secondary" }), "gap-1")}
>
Source
<ExternalLinkIcon className="h-3 w-3" />
</Link>
)}
But the problem is that the contentlayer
is not committed to the repo by the devs so we can't really do much about it.
Cheers!
The rendering logic seems correct.
But, we just have to modify mdx
file under apps/www/content/docs/component/accordion.mdx
to
links:
doc: https://www.radix-ui.com/docs/primitives/components/accordion
api: https://www.radix-ui.com/docs/primitives/components/accordion#api-reference
source: https://github.com/shadcn-ui/ui/blob/main/apps/www/registry/default/ui/accordion.tsx
(To all components mdx
files)
We should link only to the default ones? I am gonna create a python script which will Ctrl + P open 'name'.mdx, look for 'api:' and hit Ctrl + Enter. Then it'll write source: https://github.com/shadcn-ui/ui/blob/main/apps/www/registry/default/ui/name.tsx
and move to the next component. All the sources should be added correctly. The only edge cases i can think of are the typography and other small ones which don't specifically have a component, so we'll just skip those.
Should i do this and open a PR?
Yeah sure,
For now keep it default
Most of them do not have API Reference or Docs external links so I am gonna leave those
We can add it manually
This issue has been automatically closed because it received no activity for a while. If you think it was closed by accident, please leave a comment. Thank you.
Feature description
Add a link in every component documentation to their respective GitHub source.
Affected component/components
Every
Additional Context
Inspired from Radix UI
Next UI
Before submitting