Skip to main content
Glama
shadcn.mdc4.66 kB
--- description: globs: alwaysApply: false --- The following official shadcn-ui components are available. Please check to see if they are installed under `./kit/dapp/components/ui` before installing them with `bunx shadcn@canary add <component-id>`. Notice that The 'shadcn-ui' package is deprecated. Please use the 'shadcn' package instead. For example: ```bash bunx shadcn@canary add progress --cwd kit/dapp ``` YOU MUST use `bunx shadcn@canary` when installing shadcn packages. Docs for each components are available at `https://ui.shadcn.com/docs/components/<component-id>`. Fetch and read the docs before using the component so that your knowledge is up-to-date. # Component ID (slug) Human-friendly name What it's for (1-sentence use-case) 1 accordion Accordion Stack of headings that expand/collapse to reveal hidden content. 2 alert Alert Static call-out box for status or info messages. 3 alert-dialog Alert Dialog Modal that interrupts the flow to confirm or warn about critical actions. 4 aspect-ratio Aspect Ratio Wrapper that locks children to a fixed width-to-height ratio (great for responsive media). 5 avatar Avatar Small user/asset image or initials placeholder. 6 badge Badge Tiny label for counts or status (e.g. “New”, “3”). 7 breadcrumb Breadcrumb Navigation trail that shows “where you are” in the app hierarchy. 8 button Button Click/tap element that triggers an action. 9 calendar Calendar Stand-alone calendar view, used by Date Picker or on its own. 10 card Card Content container with optional header/body/footer. 11 carousel Carousel Horizontal slider that cycles through a set of items or images. 12 chart Chart Light wrapper for quick bar/line/pie visualizations. 13 checkbox Checkbox Square control for on/off selection of independent items. 14 collapsible Collapsible Utility that hides/reveals content with smooth height animation. 15 combobox Combobox Autocomplete text input that filters a long list and lets users pick an item. 16 command Command Palette VS Code-style keyboard overlay for fuzzy-searching actions. 17 context-menu Context Menu Right-click (long-press) menu with context-specific commands. 18 data-table Data Table Table with helpers for sorting, filtering and pagination. 19 date-picker Date Picker Input field that pops a calendar for choosing dates or ranges. 20 dialog Dialog Generic modal overlay for arbitrary interactive content. 21 drawer Drawer Slide-in panel (often from edge/bottom) for secondary workflows. 22 dropdown-menu Dropdown Menu Triggered list of options/actions that auto-dismisses on selection. 23 form Form Helpers and styles for accessible, validated forms. 24 hover-card Hover Card Lightweight popover that appears on hover/focus to show extra info. 25 input Input Standard single-line text field. 26 input-otp Input OTP Grouped inputs optimised for entering one-time pass-codes. 27 label Label Accessible label element for any form control. 28 menubar Menubar Horizontal desktop-app-style menu with dropdown sub-menus. 29 navigation-menu Navigation Menu Multi-level nav bar with active indicators and hover previews. 30 pagination Pagination Next/previous + numbered page controls for paginated data sets. 31 popover Popover Non-modal floating panel anchored to a trigger (e.g. emoji picker). 32 progress Progress Linear bar that shows completion percentage. 33 radio-group Radio Group Set of mutually-exclusive selection buttons. 34 resizable Resizable Wrapper that lets users drag to resize split panes. 35 scroll-area Scroll Area Augments native scrolling with custom styling and shadows. 36 select Select Styled single-select dropdown (native <select> replacement). 37 separator Separator Horizontal or vertical rule dividing content. 38 sheet Sheet Mobile-friendly slide-up bottom sheet (from tiny to full-screen). 39 sidebar Sidebar Vertical navigation rail that can collapse/expand. 40 skeleton Skeleton Grey placeholder shapes shown while real content loads. 41 slider Slider Draggable handle on a track for numeric values or ranges. 42 sonner Sonner Opinionated toast component (thin wrapper around the Sonner library). 43 switch Switch Toggle switch for true/false settings. 44 table Table Basic static table markup & styling. 45 tabs Tabs Tab strip that swaps between associated panels. 46 textarea Textarea Multi-line text input. 47 toast Toast Ephemeral message that pops at screen edge and auto-dismisses. 48 toggle Toggle Pressable button that stays pressed/un-pressed to indicate state. 49 toggle-group Toggle Group Collection of toggles acting as single- or multi-select controls. 50 tooltip Tooltip Small hover/focus label supplying helper text.

Latest Blog Posts

MCP directory API

We provide all the information about MCP servers via our MCP API.

curl -X GET 'https://glama.ai/api/mcp/v1/servers/settlemint/sdk'

If you have feedback or need assistance with the MCP directory API, please join our Discord server