{
  "$schema": "https://ui.shadcn.com/schema/registry.json",
  "name": "akoder",
  "homepage": "https://akoder.xyz",
  "items": [
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "todo-list",
      "type": "registry:ui",
      "title": "Todo list",
      "description": "Content-sized task rows with completion checks in your primary color, an animated strike-through, and spring reordering that moves finished tasks to the bottom.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "tasks",
        "animation",
        "interactive",
        "accessibility"
      ],
      "dependencies": [
        "lucide-react",
        "motion"
      ],
      "registryDependencies": [],
      "meta": {
        "docs": "https://akoder.xyz/components/todo-list",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/todo-list.tsx"
      },
      "files": [
        {
          "path": "components/ui/todo-list.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn add @akoder/todo-list\n```\n\n## Usage\n\n```tsx\nimport { TodoList } from \"@/components/ui/todo-list\";\n\nconst tasks = [\n  { id: \"user-testing\", title: \"Organize a user testing session\" },\n  { id: \"client-review\", title: \"Prepare designs for client review\" },\n  { id: \"meditation\", title: \"15-minute meditation\" },\n];\n\nexport function Tasks() {\n  return <TodoList defaultItems={tasks} />;\n}\n```\n\nClick a task to complete or reopen it. Completed tasks spring to the bottom while the checkmark and strike-through animate. Use `items` and `onItemsChange` for controlled state, or `defaultItems` for local state. Tasks need unique, stable ids and non-empty titles. Completed checkboxes use your primary color. `accentColor` customizes the fill, and `disabled` prevents changes. Reduced motion removes movement. See https://akoder.xyz/components/todo-list for the complete props reference."
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "theme-switcher",
      "type": "registry:ui",
      "title": "Theme switcher",
      "description": "A visual Light, Dark, and System theme selector with textured previews, an animated selection outline, and keyboard navigation.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "theming",
        "dark-mode",
        "animation"
      ],
      "dependencies": [
        "motion",
        "next-themes"
      ],
      "registryDependencies": [],
      "meta": {
        "docs": "https://akoder.xyz/components/theme-switcher",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/theme-switcher.tsx"
      },
      "files": [
        {
          "path": "components/ui/theme-switcher.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn add @akoder/theme-switcher\n```\n\n## Usage\n\n```tsx\nimport { ThemeSwitcher } from \"@/components/ui/theme-switcher\";\n\nexport function AppearanceSettings() {\n  return <ThemeSwitcher />;\n}\n```\n\nWrap your app in a next-themes ThemeProvider with attribute=\"class\" and enableSystem. Reuse an existing provider when present. Add suppressHydrationWarning to your root html element."
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "ask-ai",
      "type": "registry:ui",
      "title": "Ask AI",
      "description": "A popover prompt launcher with an animated mascot trigger, one-click query links for major AI providers, and instant clipboard fallback.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "ai",
        "assistant",
        "popover",
        "dialog",
        "interactive"
      ],
      "dependencies": [
        "lucide-react",
        "radix-ui"
      ],
      "registryDependencies": [
        "popover",
        "tooltip"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/ask-ai",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/ask-ai.tsx"
      },
      "files": [
        {
          "path": "components/ui/ask-ai.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/ask-ai\n```\n\n## Usage\n\n```tsx\nimport { AskAI } from \"@/components/ui/ask-ai\";\n\nexport function Hero() {\n  return (\n    <AskAI\n      prompt=\"Introduce this project and explain what makes it unique.\"\n      label=\"ask an ai\"\n    />\n  );\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "model-picker",
      "type": "registry:ui",
      "title": "Model Picker",
      "description": "A chat-style model switcher. Provider icons on a side rail filter the list to models available from that provider.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "ai",
        "chat",
        "popover",
        "select",
        "interactive"
      ],
      "dependencies": [
        "lucide-react",
        "radix-ui"
      ],
      "registryDependencies": [
        "popover",
        "tooltip"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/model-picker",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/model-picker.tsx"
      },
      "files": [
        {
          "path": "components/ui/model-picker.tsx",
          "type": "registry:ui"
        },
        {
          "path": "public/ai/openai.svg",
          "type": "registry:file",
          "target": "public/ai/openai.svg"
        },
        {
          "path": "public/ai/claude.svg",
          "type": "registry:file",
          "target": "public/ai/claude.svg"
        },
        {
          "path": "public/ai/gemini.svg",
          "type": "registry:file",
          "target": "public/ai/gemini.svg"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/model-picker\n```\n\n## Usage\n\n```tsx\nimport { useState } from \"react\";\nimport { ModelPicker, defaultModelProviders } from \"@/components/ui/model-picker\";\n\nexport function ChatComposer() {\n  const [model, setModel] = useState(\"grok-4.6\");\n  return (\n    <ModelPicker\n      providers={defaultModelProviders}\n      value={model}\n      onValueChange={setModel}\n    />\n  );\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "command-palette",
      "type": "registry:ui",
      "title": "Command Palette",
      "description": "A keyboard-first ⌘K palette with grouped actions, drill-down pages, recent items, and directional motion, built on cmdk inside a self-contained dialog shell.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "navigation",
        "search",
        "dialog",
        "keyboard"
      ],
      "dependencies": [
        "cmdk",
        "lucide-react",
        "motion",
        "radix-ui"
      ],
      "registryDependencies": [
        "kbd"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/command-palette",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/command-palette.tsx"
      },
      "files": [
        {
          "path": "components/ui/command-palette.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/command-palette\n```\n\n## Usage\n\n```tsx\nimport { CommandPalette } from \"@/components/ui/command-palette\";\n\nexport function AppShell() {\n  const [open, setOpen] = useState(false);\n\n  return (\n    <>\n      <button onClick={() => setOpen(true)}>open palette</button>\n      <CommandPalette open={open} onOpenChange={setOpen} recents />\n    </>\n  );\n}\n```\n\nPass `groups` for top-level actions, `pages` plus `page` ids on items for drill-down navigation, and ⌘K / Ctrl+K toggles the palette by default. Recents persist per `storageKey` when `recents` is on."
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "dotted-world-map",
      "type": "registry:ui",
      "title": "Dotted World Map",
      "description": "A dependency-free SVG world map drawn with dots, tinted by heat value. Ships with interactive markers, tooltips, and a GitHub-style legend.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "visualization",
        "map",
        "chart",
        "svg"
      ],
      "dependencies": [
        "radix-ui",
        "lucide-react"
      ],
      "registryDependencies": [
        "tooltip"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/dotted-world-map",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/dotted-world-map.tsx"
      },
      "files": [
        {
          "path": "components/ui/dotted-world-map.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/dotted-world-map\n```\n\n## Usage\n\n```tsx\nimport { DottedWorldMap } from \"@/components/ui/dotted-world-map\";\n\nconst points = [\n  { name: \"London\", countryCode: \"GB\", lat: 51.5074, lng: -0.1278, value: 0.9, radius: 12 },\n  { name: \"Tokyo\", countryCode: \"JP\", lat: 35.6762, lng: 139.6503, value: 0.8, radius: 12 },\n  { name: \"New York\", countryCode: \"US\", lat: 40.7128, lng: -74.006, value: 0.95, radius: 13 },\n];\n\nexport function VisitorsMap() {\n  return <DottedWorldMap points={points} />;\n}\n```\n\n`countryCode` is optional and uses uppercase ISO 3166-1 alpha-2 codes. Invalid codes or failed flag images show a globe. Omit it for text-only tooltips. If your site uses a Content Security Policy, allow https://flagcdn.com in img-src."
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "copy-command-block",
      "type": "registry:ui",
      "title": "Copy Command Block",
      "description": "A multi-package manager terminal command box with tab switcher (npm, pnpm, yarn, bun), persistent storage, copy feedback animation, and blueprint styling.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "developer-tools",
        "terminal",
        "copy",
        "tabs"
      ],
      "dependencies": [
        "lucide-react",
        "motion",
        "radix-ui"
      ],
      "registryDependencies": [
        "tooltip"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/copy-command-block",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/copy-command-block.tsx"
      },
      "files": [
        {
          "path": "components/ui/copy-command-block.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/copy-command-block\n```\n\n## Usage\n\n```tsx\nimport { CopyCommandBlock } from \"@/components/ui/copy-command-block\";\n\nexport function Command() {\n  return <CopyCommandBlock commands={{ npm: \"npm i motion\", pnpm: \"pnpm add motion\" }} />;\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "github-map",
      "type": "registry:ui",
      "title": "GitHub Heatmap",
      "description": "An interactive 52-week contribution activity graph with date-fns interval calculation, theme-aware level colors, and date tooltips.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "visualization",
        "calendar",
        "github",
        "chart"
      ],
      "dependencies": [
        "date-fns",
        "radix-ui"
      ],
      "registryDependencies": [
        "tooltip"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/github-map",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/github-map.tsx"
      },
      "files": [
        {
          "path": "components/ui/github-map.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/github-map\n```\n\n## Usage\n\n```tsx\nimport { GitHubCalendar } from \"@/components/ui/github-map\";\n\nexport function ActivityGraph() {\n  return <GitHubCalendar data={[{ date: \"2025-01-01\", count: 4 }]} />;\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "project-explorer",
      "type": "registry:ui",
      "title": "Interactive Project Explorer",
      "description": "An IDE-style project showcase with collapsible year folders, status badges, and floating cursor image hover previews.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "portfolio",
        "projects",
        "showcase",
        "motion"
      ],
      "dependencies": [
        "lucide-react",
        "motion"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/project-explorer",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/project-explorer.tsx"
      },
      "files": [
        {
          "path": "components/project-explorer.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/project-explorer\n```\n\n## Usage\n\n```tsx\nimport { ProjectExplorer } from \"@/components/project-explorer\";\n\nexport function WorkShowcase() {\n  return <ProjectExplorer />;\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "carousel",
      "type": "registry:ui",
      "title": "Fluid Carousel",
      "description": "Accessible touch-swipeable slide carousel with directional spring animations, keyboard arrow navigation, and pagination indicators.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "carousel",
        "slider",
        "motion",
        "interactive"
      ],
      "dependencies": [
        "motion"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/carousel",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/carousel.tsx"
      },
      "files": [
        {
          "path": "components/ui/carousel.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/carousel\n```\n\n## Usage\n\n```tsx\nimport { Carousel } from \"@/components/ui/carousel\";\n\nexport function SlideShow() {\n  return (\n    <Carousel\n      items={[\n        { id: \"1\", title: \"Slide 1\", content: <div>Content 1</div> },\n        { id: \"2\", title: \"Slide 2\", content: <div>Content 2</div> },\n      ]}\n    />\n  );\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "mode-toggler",
      "type": "registry:ui",
      "title": "Mode Toggler",
      "description": "A minimal Sun / Moon theme toggle button built on next-themes. Supports an optional click sound, composable className, and dynamic aria-label.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "theming",
        "toggle",
        "dark-mode",
        "accessibility"
      ],
      "dependencies": [
        "lucide-react",
        "next-themes"
      ],
      "registryDependencies": [
        "button"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/mode-toggler",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/mode-toggler.tsx"
      },
      "files": [
        {
          "path": "components/ui/mode-toggler.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/mode-toggler\n```\n\n## Usage\n\n```tsx\nimport { ModeToggler } from \"@/components/ui/mode-toggler\";\n\nexport function Header() {\n  return (\n    <header className=\"flex items-center justify-between px-4 h-12\">\n      <span>my app</span>\n      <ModeToggler />\n    </header>\n  );\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "interactive-skill-cloud",
      "type": "registry:ui",
      "title": "Interactive Skill Cloud",
      "description": "A draggable physics pill cloud powered by matter.js, pills rain down, pile at the bottom, and collide; grab one and fling it.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "skills",
        "tags",
        "physics",
        "interactive"
      ],
      "dependencies": [
        "matter-js"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/interactive-skill-cloud",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/interactive-skill-cloud.tsx"
      },
      "files": [
        {
          "path": "components/ui/interactive-skill-cloud.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/interactive-skill-cloud\n```\n\n## Usage\n\n```tsx\nimport { InteractiveSkillCloud } from \"@/components/ui/interactive-skill-cloud\";\nimport { Code2, Zap } from \"lucide-react\";\n\nconst items = [\n  { id: \"react\", name: \"React\", icon: <Code2 className=\"size-4\" /> },\n  { id: \"zap\", name: \"tRPC\", icon: <Zap className=\"size-4\" /> },\n];\n\nexport function TechStack() {\n  return <InteractiveSkillCloud items={items} height={360} />;\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "contact-channels",
      "type": "registry:ui",
      "title": "Contact Channels",
      "description": "A hairline grid of contact cells with copy-to-clipboard actions, single-key shortcuts, tooltips, and blueprint hover styling.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "contact",
        "social",
        "copy",
        "grid"
      ],
      "dependencies": [
        "lucide-react",
        "motion",
        "radix-ui"
      ],
      "registryDependencies": [
        "tooltip"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/contact-channels",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/contact-channels.tsx"
      },
      "files": [
        {
          "path": "components/ui/contact-channels.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/contact-channels\n```\n\n## Usage\n\n```tsx\nimport { ContactChannels } from \"@/components/ui/contact-channels\";\nimport { Github, Mail } from \"lucide-react\";\n\nconst channels = [\n  { id: \"github\", platform: \"github\", handle: \"@octocat\", href: \"https://github.com\", action: \"external\", icon: <Github className=\"size-4\" /> },\n  { id: \"email\", platform: \"email\", handle: \"hi@example.com\", action: \"copy\", copyValue: \"hi@example.com\", shortcutKey: \"e\", icon: <Mail className=\"size-4\" /> },\n];\n\nexport function Contact() {\n  return <ContactChannels items={channels} columns={2} />;\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "section-rail",
      "type": "registry:ui",
      "title": "Section Rail",
      "description": "A responsive section navigation rail with scroll tracking, smooth anchor jumps, link mode, and optional rich hover previews.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "navigation",
        "scroll",
        "anchors",
        "accessibility"
      ],
      "dependencies": [
        "radix-ui"
      ],
      "registryDependencies": [
        "tooltip"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/section-rail",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/section-rail.tsx"
      },
      "files": [
        {
          "path": "components/section-rail.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/section-rail\n```\n\n## Usage\n\n```tsx\nimport { SectionRail } from \"@/components/section-rail\";\n\nconst items = [\n  { id: \"about\", label: \"about\" },\n  { id: \"projects\", label: \"projects\" },\n  { id: \"contact\", label: \"contact\" },\n];\n\nexport function Page() {\n  return (\n    <>\n      <SectionRail items={items} />\n      <main>\n        {items.map((item) => (\n          <section key={item.id} id={item.id}>\n            <h2>{item.label}</h2>\n          </section>\n        ))}\n      </main>\n    </>\n  );\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "progress-bars",
      "type": "registry:ui",
      "title": "Progress Bars",
      "description": "A minimal textured bar chart with vertical and horizontal layouts, shipping a line fill and a dot matrix fill, driven by nothing more than a value per item.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "chart",
        "progress",
        "visualization",
        "accessibility"
      ],
      "dependencies": [
        "motion",
        "radix-ui"
      ],
      "registryDependencies": [
        "tooltip"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/progress-bars",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/progress-bars.tsx"
      },
      "files": [
        {
          "path": "components/ui/progress-bars.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/progress-bars\n```\n\n## Usage\n\n```tsx\nimport { DotProgress, ProgressBars } from \"@/components/ui/progress-bars\";\n\nconst milestones = [\n  { id: \"design\", label: \"design\", value: 82 },\n  { id: \"build\", label: \"build\", value: 64 },\n  { id: \"launch\", label: \"launch\", value: 49 },\n];\n\nexport function ProjectProgress() {\n  return <ProgressBars items={milestones} />;\n}\n\n// Same props, dot matrix fill instead of etched rules.\nexport function ProjectDots() {\n  return <DotProgress items={milestones} orientation=\"horizontal\" />;\n}\n```"
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "workflow-status",
      "type": "registry:ui",
      "title": "Workflow Status",
      "description": "Compact workflow badges with semantic defaults, custom states, icon and colour overrides, two sizes, and an icon-only form.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "status",
        "workflow",
        "badge",
        "accessibility"
      ],
      "dependencies": [
        "lucide-react",
        "clsx",
        "tailwind-merge"
      ],
      "registryDependencies": [],
      "meta": {
        "docs": "https://akoder.xyz/components/workflow-status",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/workflow-status.tsx"
      },
      "files": [
        {
          "path": "components/ui/workflow-status.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/workflow-status\n```\n\n## Usage\n\n```tsx\nimport { WorkflowStatusBadge } from \"@/components/ui/workflow-status\";\n\nexport function DeploymentState() {\n  return <WorkflowStatusBadge status=\"in-progress\" />;\n}\n```\n\nPass any of the built-in semantic states: `pending`, `in-progress`, `submitted`, `in-review`, `success`, `failed`, or `expired`. Use `label` for product-specific language, or `iconOnly` for compact interface areas."
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "glyph-card",
      "type": "registry:ui",
      "title": "Glyph Card",
      "description": "A hairline card whose background resolves into tiny plus marks on hover, gathering inside the glyph. Draws itself from a single SVG path on a 24x24 grid.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "card",
        "hover",
        "svg",
        "interactive"
      ],
      "dependencies": [
        "lucide-react",
        "motion"
      ],
      "registryDependencies": [],
      "meta": {
        "docs": "https://akoder.xyz/components/glyph-card",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/glyph-card.tsx"
      },
      "files": [
        {
          "path": "components/ui/glyph-card.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/glyph-card\n```\n\n## Usage\n\n```tsx\nimport { GlyphCard } from \"@/components/ui/glyph-card\";\n\nconst NEXTJS_GLYPH =\n  \"M18.665 21.978C16.758 23.255 14.465 24 12 24 5.377 24 0 18.623 0 12S5.377 0 12 0s12 5.377 12 12c0 3.583-1.574 6.801-4.067 9.001L9.219 7.2H7.2v9.596h1.615V9.251l9.85 12.727Zm-3.332-8.533 1.6 2.061V7.2h-1.6v6.245Z\";\n\nexport function Stack() {\n  return (\n    <GlyphCard\n      eyebrow=\"Framework\"\n      title=\"Next.js\"\n      subtitle=\"The React framework\"\n      href=\"https://nextjs.org\"\n      glyph={NEXTJS_GLYPH}\n    />\n  );\n}\n```\n\n`glyph` is SVG path data authored on a 24x24 grid. Omit `href` for a static card, pass `accent` to tint the artwork, and use `glyphOffset` in grid units when a mark is drawn off-center."
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "snake",
      "type": "registry:ui",
      "title": "Snake",
      "description": "A monochrome snake game on a dot-lattice field. Steer with the arrow keys, WASD, or a swipe, eat to grow by one segment, and wrap around the edges.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "game",
        "canvas",
        "interactive"
      ],
      "dependencies": [
        "lucide-react",
        "motion",
        "react-icons"
      ],
      "registryDependencies": [
        "button"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/snake",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/snake.tsx"
      },
      "files": [
        {
          "path": "components/ui/snake.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/snake\n```\n\n## Usage\n\n```tsx\nimport { Snake } from \"@/components/ui/snake\";\n\nexport function Game() {\n  return <Snake />;\n}\n```\n\nSteer with the arrow keys, WASD, or a swipe. `gridSize` sets the cells per side (20 means 20x20), `speed` is the milliseconds per step, and `initialLength` is the starting segment count. The colors are `var(--token, literal)` references resolved at runtime, so the field follows your theme and falls back to the literal in projects without the tokens; pass a literal color to `fieldColor`, `dotColor`, or `snakeColor` to opt out."
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "stack-rolodex",
      "type": "registry:ui",
      "title": "Stack Rolodex",
      "description": "A rotating vertical pill stack that cycles through a list rolodex-style, with depth scaling, edge fading, and an optional side label.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "animation",
        "marquee",
        "stack",
        "interactive"
      ],
      "dependencies": [
        "motion"
      ],
      "registryDependencies": [],
      "meta": {
        "docs": "https://akoder.xyz/components/stack-rolodex",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/stack-rolodex.tsx"
      },
      "files": [
        {
          "path": "components/ui/stack-rolodex.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn@latest add @akoder/stack-rolodex\n```\n\n## Usage\n\n```tsx\nimport { StackRolodex } from \"@/components/ui/stack-rolodex\";\nimport { SiGithub, SiPrisma, SiSupabase, SiVercel } from \"react-icons/si\";\n\nconst STACK = [\n  { id: \"vercel\", name: \"Vercel\", icon: SiVercel },\n  { id: \"github\", name: \"GitHub\", icon: SiGithub },\n  { id: \"supabase\", name: \"Supabase\", icon: SiSupabase, color: \"#3ECF8E\" },\n  { id: \"prisma\", name: \"Prisma\", icon: SiPrisma, color: \"#16A394\" },\n];\n\nexport function StackSection() {\n  return <StackRolodex items={STACK} label=\"in my stack\" />;\n}\n```\n\n`items` takes any icon component that accepts a `className`, such as react-icons, lucide-react, or your own SVG components. `interval` is the milliseconds between rotations and `step` the pixel distance between pills, with three pills visible on each side of the active one. Omit `label` to render the stack on its own. An item can carry its brand `color`, which the icon takes while its pill is the active one; items without a color keep the neutral styling."
    },
    {
      "$schema": "https://ui.shadcn.com/schema/registry-item.json",
      "name": "prompt-bar",
      "type": "registry:ui",
      "title": "Prompt Bar",
      "description": "A compact prompt input with removable context chips, a toolbar slot for your model picker, and async send, stop, and retry states.",
      "author": "Aditya Ojha <https://akoder.xyz>",
      "categories": [
        "ai",
        "input",
        "context",
        "accessibility"
      ],
      "dependencies": [
        "lucide-react",
        "motion",
        "@tiptap/react@3.31.4",
        "@tiptap/pm@3.31.4",
        "@tiptap/starter-kit@3.31.4"
      ],
      "registryDependencies": [
        "badge",
        "command",
        "field",
        "hover-card",
        "input-group",
        "popover",
        "progress",
        "separator"
      ],
      "meta": {
        "docs": "https://akoder.xyz/components/prompt-bar",
        "source": "https://github.com/AdityaKodez/adityaojha/blob/main/components/ui/prompt-bar.tsx"
      },
      "files": [
        {
          "path": "components/ui/prompt-bar.tsx",
          "type": "registry:ui"
        }
      ],
      "docs": "## Installation\n\n```bash\nnpx shadcn add @akoder/prompt-bar\n```\n\n## Usage\n\n```tsx\nimport { PromptBar } from \"@/components/ui/prompt-bar\";\n\nexport function Input({ send }: { send: (text: string) => Promise<void> }) {\n  return <PromptBar onSubmit={({ text }) => send(text)} />;\n}\n```\n\nSupply `/` choices through `skills` and `@` choices through `contextOptions`. Update `contexts` in `onContextAdd` and `onContextRemove`. Skills accept `instructions`; both item types accept consumer-defined `data`, preserved in callbacks and `onSubmit`. Use `PromptBar<TContextData, TSkillData>` for typed payloads. Control skill selection with `skill` and `onSkillChange`, or initialize it with `defaultSkill`. Your app builds the prompt and loads or uploads files; the prompt bar does not execute commands or append their payloads to text. See https://akoder.xyz/components/prompt-bar for a complete prompt-building example and the props reference. Compose an optional model picker through `toolbar`. The component awaits `onSubmit`, clears the draft and selected skill only on success, and preserves them on failure or cancellation. Use `onStop` to cancel work in your app. No AI client or site analytics are bundled."
    }
  ]
}