{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "error-2",
  "title": "404 With Search And Links",
  "description": "404 not found page built for recovery, offering a docs search form plus a bordered list of popular pages to jump to.",
  "dependencies": [
    "@base-ui/react"
  ],
  "registryDependencies": [
    "button",
    "input"
  ],
  "files": [
    {
      "path": "registry/blocks/error/2/error-block.tsx",
      "content": "import { Button } from \"@/components/ui/button\"\nimport { Input } from \"@/components/ui/input\"\nimport { IconPlaceholder } from \"@/components/icons/icon-placeholder\"\n\nconst popularPages = [\n  \"Getting started\",\n  \"Installation guide\",\n  \"Components reference\",\n  \"Theming and tokens\",\n]\n\nexport default function ErrorBlock() {\n  return (\n    <section className=\"flex min-h-svh w-full flex-col items-center justify-center gap-8 bg-background px-6 py-12 text-center text-foreground\">\n      <div className=\"flex flex-col items-center gap-2\">\n        <span className=\"text-6xl font-bold tracking-tight tabular-nums sm:text-7xl\">\n          404\n        </span>\n        <h1 className=\"font-heading text-2xl font-bold tracking-tight sm:text-3xl\">\n          Page not found\n        </h1>\n        <p className=\"max-w-md text-sm text-muted-foreground\">\n          We could not find the page you were looking for. Try searching, or\n          pick one of the popular pages below.\n        </p>\n      </div>\n\n      <form\n        action=\"#\"\n        className=\"flex w-full max-w-md flex-col gap-2 sm:flex-row\"\n      >\n        <Input\n          type=\"search\"\n          placeholder=\"Search the docs...\"\n          aria-label=\"Search the docs\"\n          className=\"h-9 flex-1 text-sm\"\n        />\n        <Button type=\"submit\" size=\"lg\" className=\"w-full sm:w-auto\">\n          <IconPlaceholder\n            lucide=\"Search\"\n            tabler=\"IconSearch\"\n            hugeicons=\"SearchIcon\"\n            phosphor=\"MagnifyingGlass\"\n            remixicon=\"RiSearchLine\"\n            data-icon=\"inline-start\"\n            aria-hidden=\"true\"\n          />\n          Search\n        </Button>\n      </form>\n\n      <div className=\"flex w-full max-w-md flex-col gap-3\">\n        <p className=\"text-xs font-medium tracking-wide text-muted-foreground uppercase\">\n          Popular pages\n        </p>\n        <ul className=\"flex flex-col border-t border-border\">\n          {popularPages.map((page) => (\n            <li key={page} className=\"border-b border-border\">\n              <a\n                href=\"#\"\n                className=\"group flex items-center justify-between gap-4 py-2.5 text-sm text-foreground\"\n              >\n                <span>{page}</span>\n                <IconPlaceholder\n                  lucide=\"ArrowRight\"\n                  tabler=\"IconArrowRight\"\n                  hugeicons=\"ArrowRightIcon\"\n                  phosphor=\"ArrowRight\"\n                  remixicon=\"RiArrowRightLine\"\n                  className=\"size-4 text-muted-foreground transition-colors group-hover:text-foreground\"\n                  aria-hidden=\"true\"\n                />\n              </a>\n            </li>\n          ))}\n        </ul>\n      </div>\n    </section>\n  )\n}\n",
      "type": "registry:component",
      "target": "components/blocks/error-2.tsx"
    }
  ],
  "meta": {
    "height": "561px",
    "tier": "free"
  },
  "categories": [
    "error"
  ],
  "type": "registry:block"
}