{"$schema":"https://ui.shadcn.com/schema/registry-item.json","name":"error-404","type":"registry:block","title":"Error 404","description":"A blueprint 404 with search and escape routes.","categories":["empty"],"dependencies":["lucide-react"],"registryDependencies":["button"],"css":{"@utility bg-grid-lg":{"background-image":"linear-gradient(to right, color-mix(in oklab, var(--foreground) 9%, transparent) 1px, transparent 1px), linear-gradient(to bottom, color-mix(in oklab, var(--foreground) 9%, transparent) 1px, transparent 1px)","background-size":"96px 96px"}},"files":[{"path":"registry/blocks/error-404.tsx","content":"import Link from \"next/link\";\nimport { ArrowLeft, Search } from \"lucide-react\";\n\nimport { Button } from \"@/components/ui/button\";\n\nconst escapes = [\n  { label: \"Documentation\", href: \"#\" },\n  { label: \"Changelog\", href: \"#\" },\n  { label: \"System status\", href: \"#\" },\n];\n\nexport default function Error404() {\n  return (\n    <section className=\"relative overflow-hidden bg-background\">\n      <div\n        aria-hidden\n        className=\"absolute inset-0 bg-grid-lg mask-[radial-gradient(ellipse_70%_70%_at_50%_40%,black,transparent)]\"\n      />\n      <div className=\"relative mx-auto flex min-h-[70vh] w-full max-w-xl flex-col items-center justify-center px-6 py-20 text-center\">\n        <p className=\"font-mono text-sm text-muted-foreground\">error 404</p>\n        <h1 className=\"mt-3 text-5xl font-semibold tracking-tight sm:text-7xl\">\n          Off the grid\n        </h1>\n        <p className=\"mt-4 max-w-sm text-muted-foreground\">\n          This page doesn't exist — or it moved without leaving coordinates.\n          Nothing broke on your side.\n        </p>\n\n        <form className=\"mt-8 flex w-full max-w-sm gap-2\">\n          <label htmlFor=\"search-404\" className=\"sr-only\">\n            Search the site\n          </label>\n          <div className=\"relative flex-1\">\n            <Search className=\"pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2 text-muted-foreground\" />\n            <input\n              id=\"search-404\"\n              type=\"search\"\n              placeholder=\"Search instead…\"\n              className=\"h-9 w-full rounded-lg border border-input bg-background pl-8 text-sm outline-none placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50\"\n            />\n          </div>\n          <Button type=\"submit\" variant=\"outline\">\n            Search\n          </Button>\n        </form>\n\n        <div className=\"mt-8 flex flex-wrap items-center justify-center gap-x-5 gap-y-2\">\n          {escapes.map((escape) => (\n            <Link\n              key={escape.label}\n              href={escape.href}\n              className=\"text-sm text-muted-foreground underline-offset-4 transition-colors hover:text-foreground hover:underline\"\n            >\n              {escape.label}\n            </Link>\n          ))}\n        </div>\n\n        <Button className=\"mt-10\" render={<Link href=\"#\" />}>\n          <ArrowLeft data-icon=\"inline-start\" />\n          Back to safety\n        </Button>\n      </div>\n    </section>\n  );\n}\n","type":"registry:block","target":"components/blocks/empty/error-404.tsx"}]}