Skip to content

Browse components

← All components

Context Card

Retrieved knowledge chunks with their sources.

Install
npx shadcn@latest add https://ui.anuragroy.dev/r/context-card.json

Preview

Loading preview…

Installation

Add the component from this site. The shadcn CLI fetches the registry JSON over HTTPS — no named registry submission required.

Terminal
npx shadcn@latest add https://ui.anuragroy.dev/r/context-card.json

GitHub fallback if the website is down:

Terminal
npx shadcn@latest add https://raw.githubusercontent.com/anurag-roy/ui.anuragroy.dev/main/public/r/context-card.json

Usage

Import paths follow your components.json aliases. After install, the default path is @/components/ui/context-card.

Import
import {  ContextCard,  ContextCardContent,  ContextCardGroup,  ContextCardHeader,  ContextCardMeta,  ContextCardSource} from "@/components/ui/context-card"
example.tsx
import {  ContextCard,  ContextCardContent,  ContextCardGroup,  ContextCardHeader,  ContextCardMeta,  ContextCardSource,} from "@/components/ui/context-card"export function Example() {  return (    <ContextCardGroup>      <ContextCard>        <ContextCardHeader>          <ContextCardSource>Sidebar navigation guidelines</ContextCardSource>          <ContextCardMeta>290 characters</ContextCardMeta>        </ContextCardHeader>        <ContextCardContent>          Persistent sidebars should stay collapsed-friendly.        </ContextCardContent>      </ContextCard>    </ContextCardGroup>  )}

API Reference

ContextCard

Single retrieved chunk. Wrap several in `ContextCardGroup`.

PropTypeDefault
classNamestring—