26:I[422844,["/_next/static/chunks/2sh36-vfcsvmu.js","/_next/static/chunks/2cm40zctwvgra.js","/_next/static/chunks/3xyjks4zm1kgq.js","/_next/static/chunks/42wa58-b7gqt5.js","/_next/static/chunks/2wyk65orzmrje.js","/_next/static/chunks/06i3fiwh2ze7u.js","/_next/static/chunks/3onfwfd1hea_z.js","/_next/static/chunks/0tiwao3lsaj0n.js","/_next/static/chunks/2u06s81i88dft.js","/_next/static/chunks/3i5g71-q5-g8m.js","/_next/static/chunks/204mnm936joms.js","/_next/static/chunks/43utqc8hd7aex.js","/_next/static/chunks/13bix5fh-g1uu.js","/_next/static/chunks/3al3szhba0yjk.js","/_next/static/chunks/34fz27ztbhz99.js","/_next/static/chunks/389jiafoijc2t.js","/_next/static/chunks/01wo8_s0r84t8.js","/_next/static/chunks/3iwmua3cnmn8f.js","/_next/static/chunks/0go_emxehaf55.js","/_next/static/chunks/3zqjjtudio2vd.js","/_next/static/chunks/2szak1lgin6pk.js","/_next/static/chunks/1pt4bo4g47prw.js"],"ThemeToggle"] 27:I[276592,["/_next/static/chunks/2sh36-vfcsvmu.js","/_next/static/chunks/2cm40zctwvgra.js","/_next/static/chunks/3xyjks4zm1kgq.js","/_next/static/chunks/42wa58-b7gqt5.js","/_next/static/chunks/2wyk65orzmrje.js","/_next/static/chunks/06i3fiwh2ze7u.js","/_next/static/chunks/3onfwfd1hea_z.js","/_next/static/chunks/0tiwao3lsaj0n.js","/_next/static/chunks/2u06s81i88dft.js","/_next/static/chunks/3i5g71-q5-g8m.js","/_next/static/chunks/204mnm936joms.js","/_next/static/chunks/43utqc8hd7aex.js","/_next/static/chunks/13bix5fh-g1uu.js","/_next/static/chunks/3al3szhba0yjk.js","/_next/static/chunks/34fz27ztbhz99.js","/_next/static/chunks/389jiafoijc2t.js","/_next/static/chunks/01wo8_s0r84t8.js","/_next/static/chunks/3iwmua3cnmn8f.js","/_next/static/chunks/0go_emxehaf55.js","/_next/static/chunks/3zqjjtudio2vd.js","/_next/static/chunks/2szak1lgin6pk.js","/_next/static/chunks/1pt4bo4g47prw.js"],"AccountMenu"] 28:I[32297,["/_next/static/chunks/2sh36-vfcsvmu.js","/_next/static/chunks/2cm40zctwvgra.js","/_next/static/chunks/3xyjks4zm1kgq.js","/_next/static/chunks/42wa58-b7gqt5.js","/_next/static/chunks/2wyk65orzmrje.js","/_next/static/chunks/06i3fiwh2ze7u.js","/_next/static/chunks/3onfwfd1hea_z.js","/_next/static/chunks/0tiwao3lsaj0n.js","/_next/static/chunks/2u06s81i88dft.js","/_next/static/chunks/3i5g71-q5-g8m.js","/_next/static/chunks/204mnm936joms.js","/_next/static/chunks/43utqc8hd7aex.js","/_next/static/chunks/13bix5fh-g1uu.js","/_next/static/chunks/3al3szhba0yjk.js","/_next/static/chunks/34fz27ztbhz99.js","/_next/static/chunks/389jiafoijc2t.js","/_next/static/chunks/01wo8_s0r84t8.js","/_next/static/chunks/3iwmua3cnmn8f.js","/_next/static/chunks/0go_emxehaf55.js","/_next/static/chunks/3zqjjtudio2vd.js","/_next/static/chunks/2szak1lgin6pk.js","/_next/static/chunks/1pt4bo4g47prw.js"],"MobileNav"] 29:I[505014,["/_next/static/chunks/2sh36-vfcsvmu.js","/_next/static/chunks/2cm40zctwvgra.js","/_next/static/chunks/3xyjks4zm1kgq.js","/_next/static/chunks/42wa58-b7gqt5.js","/_next/static/chunks/2wyk65orzmrje.js","/_next/static/chunks/06i3fiwh2ze7u.js","/_next/static/chunks/3onfwfd1hea_z.js","/_next/static/chunks/0tiwao3lsaj0n.js","/_next/static/chunks/2u06s81i88dft.js","/_next/static/chunks/3i5g71-q5-g8m.js","/_next/static/chunks/204mnm936joms.js","/_next/static/chunks/43utqc8hd7aex.js","/_next/static/chunks/13bix5fh-g1uu.js","/_next/static/chunks/3al3szhba0yjk.js","/_next/static/chunks/34fz27ztbhz99.js","/_next/static/chunks/389jiafoijc2t.js","/_next/static/chunks/01wo8_s0r84t8.js","/_next/static/chunks/3iwmua3cnmn8f.js","/_next/static/chunks/0go_emxehaf55.js","/_next/static/chunks/3zqjjtudio2vd.js","/_next/static/chunks/2szak1lgin6pk.js","/_next/static/chunks/1pt4bo4g47prw.js"],"default"] 2a:I[729657,["/_next/static/chunks/2sh36-vfcsvmu.js","/_next/static/chunks/2cm40zctwvgra.js","/_next/static/chunks/3xyjks4zm1kgq.js","/_next/static/chunks/42wa58-b7gqt5.js","/_next/static/chunks/2wyk65orzmrje.js","/_next/static/chunks/06i3fiwh2ze7u.js","/_next/static/chunks/3onfwfd1hea_z.js","/_next/static/chunks/0tiwao3lsaj0n.js","/_next/static/chunks/2u06s81i88dft.js","/_next/static/chunks/3i5g71-q5-g8m.js","/_next/static/chunks/204mnm936joms.js","/_next/static/chunks/43utqc8hd7aex.js","/_next/static/chunks/13bix5fh-g1uu.js","/_next/static/chunks/3al3szhba0yjk.js","/_next/static/chunks/34fz27ztbhz99.js","/_next/static/chunks/389jiafoijc2t.js","/_next/static/chunks/01wo8_s0r84t8.js","/_next/static/chunks/3iwmua3cnmn8f.js","/_next/static/chunks/0go_emxehaf55.js","/_next/static/chunks/3zqjjtudio2vd.js","/_next/static/chunks/2szak1lgin6pk.js","/_next/static/chunks/1pt4bo4g47prw.js"],"FavoriteButton"] 2b:I[534073,["/_next/static/chunks/2sh36-vfcsvmu.js","/_next/static/chunks/2cm40zctwvgra.js","/_next/static/chunks/3xyjks4zm1kgq.js","/_next/static/chunks/42wa58-b7gqt5.js","/_next/static/chunks/2wyk65orzmrje.js","/_next/static/chunks/06i3fiwh2ze7u.js","/_next/static/chunks/3onfwfd1hea_z.js","/_next/static/chunks/0tiwao3lsaj0n.js","/_next/static/chunks/2u06s81i88dft.js","/_next/static/chunks/3i5g71-q5-g8m.js","/_next/static/chunks/204mnm936joms.js","/_next/static/chunks/43utqc8hd7aex.js","/_next/static/chunks/13bix5fh-g1uu.js","/_next/static/chunks/3al3szhba0yjk.js","/_next/static/chunks/34fz27ztbhz99.js","/_next/static/chunks/389jiafoijc2t.js","/_next/static/chunks/01wo8_s0r84t8.js","/_next/static/chunks/3iwmua3cnmn8f.js","/_next/static/chunks/0go_emxehaf55.js","/_next/static/chunks/3zqjjtudio2vd.js","/_next/static/chunks/2szak1lgin6pk.js","/_next/static/chunks/1pt4bo4g47prw.js"],"InstallCommand"] 2c:I[868814,["/_next/static/chunks/2sh36-vfcsvmu.js","/_next/static/chunks/2cm40zctwvgra.js","/_next/static/chunks/3xyjks4zm1kgq.js","/_next/static/chunks/42wa58-b7gqt5.js","/_next/static/chunks/2wyk65orzmrje.js","/_next/static/chunks/06i3fiwh2ze7u.js","/_next/static/chunks/3onfwfd1hea_z.js","/_next/static/chunks/0tiwao3lsaj0n.js","/_next/static/chunks/2u06s81i88dft.js","/_next/static/chunks/3i5g71-q5-g8m.js","/_next/static/chunks/204mnm936joms.js","/_next/static/chunks/43utqc8hd7aex.js","/_next/static/chunks/13bix5fh-g1uu.js","/_next/static/chunks/3al3szhba0yjk.js","/_next/static/chunks/34fz27ztbhz99.js","/_next/static/chunks/389jiafoijc2t.js","/_next/static/chunks/01wo8_s0r84t8.js","/_next/static/chunks/3iwmua3cnmn8f.js","/_next/static/chunks/0go_emxehaf55.js","/_next/static/chunks/3zqjjtudio2vd.js","/_next/static/chunks/2szak1lgin6pk.js","/_next/static/chunks/1pt4bo4g47prw.js"],"BlockPreview"] 35:I[713354,["/_next/static/chunks/2sh36-vfcsvmu.js","/_next/static/chunks/2cm40zctwvgra.js","/_next/static/chunks/3xyjks4zm1kgq.js","/_next/static/chunks/42wa58-b7gqt5.js","/_next/static/chunks/2wyk65orzmrje.js","/_next/static/chunks/06i3fiwh2ze7u.js","/_next/static/chunks/3onfwfd1hea_z.js","/_next/static/chunks/0tiwao3lsaj0n.js","/_next/static/chunks/2u06s81i88dft.js","/_next/static/chunks/3i5g71-q5-g8m.js","/_next/static/chunks/204mnm936joms.js","/_next/static/chunks/43utqc8hd7aex.js","/_next/static/chunks/13bix5fh-g1uu.js","/_next/static/chunks/3al3szhba0yjk.js","/_next/static/chunks/34fz27ztbhz99.js","/_next/static/chunks/389jiafoijc2t.js","/_next/static/chunks/01wo8_s0r84t8.js","/_next/static/chunks/3iwmua3cnmn8f.js","/_next/static/chunks/0go_emxehaf55.js","/_next/static/chunks/3zqjjtudio2vd.js","/_next/static/chunks/2szak1lgin6pk.js","/_next/static/chunks/1pt4bo4g47prw.js"],"Toaster"] 1b:["$","$L1a","/themes",{"href":"/themes","children":"Themes","data-slot":"button","data-variant":"ghost","data-size":"sm","className":"group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50 h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5","ref":null}] 1c:["$","$L1a","/styles",{"href":"/styles","children":"Styles","data-slot":"button","data-variant":"ghost","data-size":"sm","className":"group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50 h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5","ref":null}] 1d:["$","$L1a","/components",{"href":"/components","children":"Components","data-slot":"button","data-variant":"ghost","data-size":"sm","className":"group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50 h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5","ref":null}] 1e:["$","$L1a","/docs",{"href":"/docs","children":"Docs","data-slot":"button","data-variant":"ghost","data-size":"sm","className":"group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50 h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5","ref":null}] 1f:["$","$L1a","/changelog",{"href":"/changelog","children":"Changelog","data-slot":"button","data-variant":"ghost","data-size":"sm","className":"group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50 h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5","ref":null}] 20:["$","$L1a","/#pricing",{"href":"/#pricing","children":"Pricing","data-slot":"button","data-variant":"ghost","data-size":"sm","className":"group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50 h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5","ref":null}] 21:["$","div",null,{"className":"ml-auto flex items-center gap-1","children":[["$","$L26",null,{}],["$","$L27",null,{}],["$","$L1a",null,{"href":"/blocks","children":"Browse blocks","data-slot":"button","data-variant":"default","data-size":"sm","className":"group/button inline-flex shrink-0 items-center justify-center border border-transparent bg-clip-padding font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 bg-primary text-primary-foreground hover:bg-primary/80 h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5 max-sm:hidden","ref":null}],["$","$L28",null,{"title":"lib","links":[{"href":"/blocks","label":"Blocks"},{"href":"/examples","label":"Examples"},{"href":"/builder","label":"Builder"},{"href":"/themes","label":"Themes"},{"href":"/styles","label":"Styles"},{"href":"/components","label":"Components"},{"href":"/docs","label":"Docs"},{"href":"/changelog","label":"Changelog"},{"href":"/#pricing","label":"Pricing"}],"primary":{"label":"Browse blocks","href":"/blocks"},"secondary":{"label":"Open the builder","href":"/builder"},"className":"md:inline-flex lg:hidden"}]]}] 22:["$","script",null,{"type":"application/ld+json","dangerouslySetInnerHTML":{"__html":"[{\"@context\":\"https://schema.org\",\"@type\":\"BreadcrumbList\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Blocks\",\"item\":\"https://shadcn.srv1505958.hstgr.cloud/blocks\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Empty states\",\"item\":\"https://shadcn.srv1505958.hstgr.cloud/blocks/empty-state\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Empty state 04: First-run dashboard\",\"item\":\"https://shadcn.srv1505958.hstgr.cloud/blocks/empty-state/empty-state-04\"}]},{\"@context\":\"https://schema.org\",\"@type\":\"SoftwareSourceCode\",\"name\":\"Empty state 04: First-run dashboard\",\"description\":\"Welcome page with three ways to get started.\",\"url\":\"https://shadcn.srv1505958.hstgr.cloud/blocks/empty-state/empty-state-04\",\"programmingLanguage\":\"TypeScript\",\"runtimePlatform\":\"React\",\"version\":\"1.0.0\",\"isAccessibleForFree\":true,\"publisher\":{\"@type\":\"Organization\",\"name\":\"lib\"}}]"}}] 2d:T554,

import { EmptyState04 } from "@/components/empty-state-04"

export default function Page() {
  return <EmptyState04 />
}

2e:T7ab,// @lib/empty-state-04@1.0.0 · changes: https://shadcn.srv1505958.hstgr.cloud/changelog "use client" import { ChartLine, PlugZap, UserPlus } from "lucide-react" import { Button } from "@/components/ui/button" import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card" const starts = [ { title: "Connect billing", description: "Import customers and invoices from Stripe or Paddle.", icon: PlugZap, action: "Connect", primary: true }, { title: "Explore a demo", description: "Look around with sample data from a real SaaS.", icon: ChartLine, action: "Open demo" }, { title: "Invite your team", description: "Bring finance and founders into the same numbers.", icon: UserPlus, action: "Invite" }, ] export function EmptyState04() { return (

Welcome, Ada

Your dashboard fills up as soon as data comes in. Pick a place to start.

{starts.map((start) => (

{start.title} {start.description} ))}

) } 2f:T3893,

// @lib/empty-state-04@1.0.0 · changes: https://shadcn.srv1505958.hstgr.cloud/changelog
"use client"

import { ChartLine, PlugZap, UserPlus } from "lucide-react"

import { Button } from "@/components/ui/button"
import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"

const starts = [
  { title: "Connect billing", description: "Import customers and invoices from Stripe or Paddle.", icon: PlugZap, action: "Connect", primary: true },
  { title: "Explore a demo", description: "Look around with sample data from a real SaaS.", icon: ChartLine, action: "Open demo" },
  { title: "Invite your team", description: "Bring finance and founders into the same numbers.", icon: UserPlus, action: "Invite" },
]

export function EmptyState04() {
  return (
    <div className="mx-auto flex w-full max-w-5xl flex-col gap-8 p-4 md:p-10">
      <div className="flex flex-col gap-2">
        <h1 className="font-heading text-3xl font-semibold tracking-tight">Welcome, Ada</h1>
        <p className="text-muted-foreground">
          Your dashboard fills up as soon as data comes in. Pick a place to start.
        </p>
      </div>
      <div className="grid grid-cols-1 gap-4 md:grid-cols-3">
        {starts.map((start) => (
          <Card key={start.title}>
            <CardHeader>
              <div className="mb-2 flex size-10 items-center justify-center rounded-lg bg-primary/10 text-primary">
                <start.icon className="size-5" />
              </div>
              <CardTitle>{start.title}</CardTitle>
              <CardDescription>{start.description}</CardDescription>
            </CardHeader>
            <CardContent className="flex-1" />
            <CardFooter>
              <Button variant={start.primary ? "default" : "outline"} className="w-full">
                {start.action}
              </Button>
            </CardFooter>
          </Card>
        ))}
      </div>
    </div>
  )
}

30:Td2f,import * as React from "react" import { cva, type VariantProps } from "class-variance-authority" import { cn } from "cn" import { Slot } from "radix-ui" const buttonVariants = cva( "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", { variants: { variant: { default: "bg-primary text-primary-foreground hover:bg-primary/80", outline: "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50", secondary: "bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground", ghost: "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50", destructive: "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40", link: "text-primary underline-offset-4 hover:underline", }, size: { default: "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2", xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3", sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5", lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2", icon: "size-8", "icon-xs": "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3", "icon-sm": "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg", "icon-lg": "size-9", }, }, defaultVariants: { variant: "default", size: "default", }, } ) function Button({ className, variant = "default", size = "default", asChild = false, ...props }: React.ComponentProps<"button"> & VariantProps & { asChild?: boolean }) { const Comp = asChild ? Slot.Root : "button" return ( ) } export { Button, buttonVariants } 31:T3dae,

import * as React from "react"
import { cva, type VariantProps } from "class-variance-authority"
import { cn } from "cn"
import { Slot } from "radix-ui"

const buttonVariants = cva(
  "group/button inline-flex shrink-0 items-center justify-center rounded-lg border border-transparent bg-clip-padding text-sm font-medium whitespace-nowrap transition-all outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 active:not-aria-[haspopup]:translate-y-px disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
  {
    variants: {
      variant: {
        default: "bg-primary text-primary-foreground hover:bg-primary/80",
        outline:
          "border-border bg-background hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:border-input dark:bg-input/30 dark:hover:bg-input/50",
        secondary:
          "bg-secondary text-secondary-foreground hover:bg-[color-mix(in_oklch,var(--secondary),var(--foreground)_5%)] aria-expanded:bg-secondary aria-expanded:text-secondary-foreground",
        ghost:
          "hover:bg-muted hover:text-foreground aria-expanded:bg-muted aria-expanded:text-foreground dark:hover:bg-muted/50",
        destructive:
          "bg-destructive/10 text-destructive hover:bg-destructive/20 focus-visible:border-destructive/40 focus-visible:ring-destructive/20 dark:bg-destructive/20 dark:hover:bg-destructive/30 dark:focus-visible:ring-destructive/40",
        link: "text-primary underline-offset-4 hover:underline",
      },
      size: {
        default:
          "h-8 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
        xs: "h-6 gap-1 rounded-[min(var(--radius-md),10px)] px-2 text-xs in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3",
        sm: "h-7 gap-1 rounded-[min(var(--radius-md),12px)] px-2.5 text-[0.8rem] in-data-[slot=button-group]:rounded-lg has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 [&_svg:not([class*='size-'])]:size-3.5",
        lg: "h-9 gap-1.5 px-2.5 has-data-[icon=inline-end]:pr-2 has-data-[icon=inline-start]:pl-2",
        icon: "size-8",
        "icon-xs":
          "size-6 rounded-[min(var(--radius-md),10px)] in-data-[slot=button-group]:rounded-lg [&_svg:not([class*='size-'])]:size-3",
        "icon-sm":
          "size-7 rounded-[min(var(--radius-md),12px)] in-data-[slot=button-group]:rounded-lg",
        "icon-lg": "size-9",
      },
    },
    defaultVariants: {
      variant: "default",
      size: "default",
    },
  }
)

function Button({
  className,
  variant = "default",
  size = "default",
  asChild = false,
  ...props
}: React.ComponentProps<"button"> &
  VariantProps<typeof buttonVariants> & {
    asChild?: boolean
  }) {
  const Comp = asChild ? Slot.Root : "button"

  return (
    <Comp
      data-slot="button"
      data-variant={variant}
      data-size={size}
      className={cn(buttonVariants({ variant, size, className }))}
      {...props}
    />
  )
}

export { Button, buttonVariants }

32:Ta3c,import * as React from "react" import { cn } from "cn" function Card({ className, size = "default", ...props }: React.ComponentProps<"div"> & { size?: "default" | "sm" }) { return (

img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(3)] data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl", className )} {...props} /> ) } function CardHeader({ className, ...props }: React.ComponentProps<"div">) { return (

) } function CardTitle({ className, ...props }: React.ComponentProps<"div">) { return (

) } function CardDescription({ className, ...props }: React.ComponentProps<"div">) { return (

) } function CardAction({ className, ...props }: React.ComponentProps<"div">) { return (

) } function CardContent({ className, ...props }: React.ComponentProps<"div">) { return (

) } function CardFooter({ className, ...props }: React.ComponentProps<"div">) { return (

) } export { Card, CardHeader, CardFooter, CardTitle, CardAction, CardDescription, CardContent, } 33:T5e37,

import * as React from "react"
import { cn } from "cn"

function Card({
  className,
  size = "default",
  ...props
}: React.ComponentProps<"div"> & { size?: "default" | "sm" }) {
  return (
    <div
      data-slot="card"
      data-size={size}
      className={cn(
        "group/card flex flex-col gap-(--card-spacing) overflow-hidden rounded-xl bg-card py-(--card-spacing) text-sm text-card-foreground ring-1 ring-foreground/10 [--card-spacing:--spacing(4)] has-data-[slot=card-footer]:pb-0 has-[>img:first-child]:pt-0 data-[size=sm]:[--card-spacing:--spacing(3)] data-[size=sm]:has-data-[slot=card-footer]:pb-0 *:[img:first-child]:rounded-t-xl *:[img:last-child]:rounded-b-xl",
        className
      )}
      {...props}
    />
  )
}

function CardHeader({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-header"
      className={cn(
        "group/card-header @container/card-header grid auto-rows-min items-start gap-1 rounded-t-xl px-(--card-spacing) has-data-[slot=card-action]:grid-cols-[1fr_auto] has-data-[slot=card-description]:grid-rows-[auto_auto] [.border-b]:pb-(--card-spacing)",
        className
      )}
      {...props}
    />
  )
}

function CardTitle({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-title"
      className={cn(
        "font-heading text-base leading-snug font-medium group-data-[size=sm]/card:text-sm",
        className
      )}
      {...props}
    />
  )
}

function CardDescription({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-description"
      className={cn("text-sm text-muted-foreground", className)}
      {...props}
    />
  )
}

function CardAction({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-action"
      className={cn(
        "col-start-2 row-span-2 row-start-1 self-start justify-self-end",
        className
      )}
      {...props}
    />
  )
}

function CardContent({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-content"
      className={cn("px-(--card-spacing)", className)}
      {...props}
    />
  )
}

function CardFooter({ className, ...props }: React.ComponentProps<"div">) {
  return (
    <div
      data-slot="card-footer"
      className={cn(
        "flex items-center rounded-b-xl border-t bg-muted/50 p-(--card-spacing)",
        className
      )}
      {...props}
    />
  )
}

export {
  Card,
  CardHeader,
  CardFooter,
  CardTitle,
  CardAction,
  CardDescription,
  CardContent,
}

23:["$","main",null,{"className":"mx-auto flex w-full max-w-7xl flex-1 flex-col gap-8 px-4 py-10 sm:px-6","children":[["$","nav",null,{"aria-label":"breadcrumb","data-slot":"breadcrumb","className":"","children":["$","ol",null,{"data-slot":"breadcrumb-list","className":"flex flex-wrap items-center gap-1.5 text-sm wrap-break-word text-muted-foreground","children":[["$","li",null,{"data-slot":"breadcrumb-item","className":"inline-flex items-center gap-1","children":["$","$L1a",null,{"href":"/blocks","children":"Blocks","data-slot":"breadcrumb-link","className":"transition-colors hover:text-foreground","ref":null}]}],["$","li",null,{"data-slot":"breadcrumb-separator","role":"presentation","aria-hidden":"true","className":"[&>svg]:size-3.5","children":["$","$L29",null,{"ref":"$undefined","icon":{"name":"chevron-right","size":24,"node":[["path",{"d":"m9 18 6-6-6-6","key":"mthhwq"}]]},"className":"$undefined"}]}],["$","li",null,{"data-slot":"breadcrumb-item","className":"inline-flex items-center gap-1","children":["$","$L1a",null,{"href":"/blocks/empty-state","children":"Empty states","data-slot":"breadcrumb-link","className":"transition-colors hover:text-foreground","ref":null}]}],["$","li",null,{"data-slot":"breadcrumb-separator","role":"presentation","aria-hidden":"true","className":"[&>svg]:size-3.5","children":["$","$L29",null,{"ref":"$undefined","icon":"$23:props:children:0:props:children:props:children:1:props:children:props:icon","className":"$undefined"}]}],["$","li",null,{"data-slot":"breadcrumb-item","className":"inline-flex items-center gap-1","children":["$","span",null,{"data-slot":"breadcrumb-page","role":"link","aria-disabled":"true","aria-current":"page","className":"font-normal text-foreground","children":"Empty state 04"}]}]]}]}],["$","header",null,{"className":"flex flex-col gap-4 lg:flex-row lg:items-end lg:justify-between","children":[["$","div",null,{"className":"flex max-w-3xl flex-col gap-3","children":[["$","div",null,{"className":"flex flex-wrap items-center gap-2","children":[["$","h1",null,{"className":"font-heading text-3xl font-semibold tracking-tight sm:text-4xl","children":"First-run dashboard"}],["$","span",null,{"data-slot":"badge","data-variant":"outline","className":"group/badge inline-flex h-5 w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-4xl border px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 has-data-[icon=inline-end]:pr-1.5 has-data-[icon=inline-start]:pl-1.5 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&>svg]:pointer-events-none [&>svg]:size-3! border-border text-foreground [a]:hover:bg-muted [a]:hover:text-muted-foreground","children":"Free"}]]}],["$","p",null,{"className":"text-lg text-pretty text-muted-foreground","children":"Welcome page with three ways to get started."}],["$","p",null,{"className":"font-mono text-xs text-muted-foreground","children":["empty-state-04"," · v","1.0.0"," · ","Empty states"," block ",4," of ",10]}]]}],["$","div",null,{"className":"flex flex-wrap items-center gap-2","children":[["$","$L2a",null,{"name":"empty-state-04","withLabel":true}],["$","$L2b",null,{"name":"empty-state-04","className":"w-full sm:w-auto sm:min-w-80"}]]}]]}],["$","$L2c",null,{"item":{"name":"empty-state-04","type":"registry:block","title":"Empty state 04: First-run dashboard","description":"Welcome page with three ways to get started.","categories":["app","empty-state"],"tier":"free","version":"1.0.0","defaultTier":"free"},"files":[{"path":"app/page.tsx","code":"import { EmptyState04 } from \"@/components/empty-state-04\"\n\nexport default function Page() {\n return \n}\n","html":"$2d"},{"path":"components/empty-state-04.tsx","code":"$2e","html":"$2f"},{"path":"components/ui/button.tsx","code":"$30","html":"$31"},{"path":"components/ui/card.tsx","code":"$32","html":"$33"}],"plans":[{"name":"Hobby","description":"Every free block, to build on your own.","price":0,"priceNote":"Just for you","features":["All free blocks","shadcn CLI and MCP","Add to favorites"],"cta":{"label":"Join now","href":"/sign-up"}},{"name":"Pro","description":"Every block, for one developer.","price":147,"originalPrice":249,"priceNote":"One-time payment","featuresIntro":"Everything in Hobby, plus:","features":["All Pro blocks","Lifetime updates","Commercial license","Priority support"],"cta":{"label":"Join the waitlist","href":"#"},"highlighted":true},{"name":"Team","description":"Every block, for a whole team.","price":497,"originalPrice":899,"priceNote":"One-time payment","featuresIntro":"Everything in Pro, plus:","features":["Up to 10 members","Team workspace","Role-based permissions"],"cta":{"label":"Join the waitlist","href":"#"}}],"height":760,"hideHeader":true}],"$L34"]}]

What it installs

Versions

More empty states blocks