docs: add sidebar docs

apps/www/components/component-preview.tsx

@@ -25,10 +25,12 @@ interface ComponentPreviewProps extends React.HTMLAttributes<HTMLDivElement> {
   align?: "center" | "start" | "end"
   description?: string
   hideCode?: boolean
+  type?: "block" | "component" | "example"
 }
 
 export function ComponentPreview({
   name,
+  type,
   children,
   className,
   extractClassname,
@@ -73,6 +75,19 @@ export function ComponentPreview({
     }
   }, [Code])
 
+  if (type === "block") {
+    return (
+      <div className="relative aspect-[4/2.5] w-full overflow-hidden rounded-md border">
+        <div className="absolute inset-0 w-[1600px] bg-background">
+          <iframe
+            src={`/blocks/${config.style}/${name}`}
+            className="size-full"
+          />
+        </div>
+      </div>
+    )
+  }
+
   return (
     <div
       className={cn("group relative my-4 flex flex-col space-y-2", className)}

apps/www/config/docs.ts

@@ -69,7 +69,6 @@ export const docsConfig: DocsConfig = {
         {
           title: "CLI",
           href: "/docs/cli",
-          label: "Updated",
           items: [],
         },
         {
@@ -81,7 +80,6 @@ export const docsConfig: DocsConfig = {
           title: "Open in v0",
           href: "/docs/v0",
           items: [],
-          label: "New",
         },
         {
           title: "Figma",
@@ -138,6 +136,12 @@ export const docsConfig: DocsConfig = {
     {
       title: "Components",
       items: [
+        {
+          title: "Sidebar",
+          href: "/docs/components/sidebar",
+          items: [],
+          label: "New",
+        },
         {
           title: "Accordion",
           href: "/docs/components/accordion",