I am working on framework where I want to add all components of shadcn/ui (https://ui.shadcn.com/) in strapi and use that on frontend using same component library depending on data model.
Individual components like button,alert can be added under strapi (ContentTypeBuilder - Components) and we can create content-type easily,
but I am confused for other shadcn components like accordion. Below is the simple snippet for tab component, can someone tell me how should anyone create content type if i want to use below code on frontend. Just do content type modelling for below, I’ll get an idea.
<Tabs defaultValue="1" orientation="horizontal" >
<TabsList className="grid w-full grid-cols-3" loop={true}>
<TabsTrigger value="1">Tab 1</TabsTrigger>
<TabsTrigger value="2">Tab 2</TabsTrigger>
<TabsTrigger value="3">Tab 3</TabsTrigger>
</TabsList>
<TabsContent value="1">Content 1</TabsContent>
<TabsContent value="2">Content 2</TabsContent>
<TabsContent value="3">
<Card>
<CardContent className="flex aspect-square items-center justify-center p-6">
<Button variant={'outline'}>Outline</Button>
</CardContent>
</Card>
</TabsContent>
</Tabs>
As this is not an independent component. TabsContent can have any other component as children. I can’t figure out how to do it in strapi.
Please note that this is one example of tab, I can have multiple tabs content based on different landing page.
This topic has been created from a Discord post (1290568682182934529) to give it more visibility.
It will be on Read-Only mode here.
Join the conversation on Discord