Introducing New Version of Components V3
Reusable Blocks for the Web
A collection of sleek, customizable blocks to speed up your workflow. Drop them into any React app and ship faster.
'use client'
import { SidebarInset, SidebarProvider } from '@gentleduck/registry-ui-duckui/sidebar'
import { AppSidebar } from './components/app-sidebar'
import { ChartAreaInteractive } from './components/chart-area-interactive'
import { DataTable } from './components/data-table'
import { SectionCards } from './components/section-cards'
import { SiteHeader } from './components/site-header'
import data from './data.json'
export function Page() {
return (
<SidebarProvider>
<AppSidebar />
<SidebarInset>
<SiteHeader />
<div className="flex flex-1 flex-col">
<div className="@container/main flex flex-1 flex-col gap-2">
<div className="flex flex-col gap-4 py-4 md:gap-6 md:py-6">
<SectionCards />
<div className="px-4 lg:px-6">
<ChartAreaInteractive />
</div>
<DataTable data={data} />
</div>
</div>
</div>
</SidebarInset>
</SidebarProvider>
)
}
dashboard-1