Snippet

RAC

NPM

PNPM

Yarn

Bun

npm install react-aria-components

Installation

Install the component via the CLI in one command.

npm

pnpm

yarn

bun

npx shadcn@latest add @intentui/snippet

Manual installation

Use this approach if you prefer to install and wire up the component yourself instead of using the CLI.

npm

pnpm

yarn

bun

npm install react-aria-components

Anatomy

import {
  Snippet,
  SnippetTab,
  SnippetTabPanel,
  SnippetTabPanels,
  SnippetTabsList,
} from "@/components/ui/snippet"

const commands = [
  { id: "npm", label: "NPM", command: "npm install react-aria-components" },
  { id: "pnpm", label: "PNPM", command: "pnpm add react-aria-components" },
  { id: "yarn", label: "Yarn", command: "yarn add react-aria-components" },
  { id: "bun", label: "Bun", command: "bun add react-aria-components" },
]

<Snippet>
  <SnippetTabsList items={commands}>
    {(cmd) => <SnippetTab key={cmd.id}>{cmd.label}</SnippetTab>}
  </SnippetTabsList>
  <SnippetTabPanels items={commands}>
    {(cmd) => <SnippetTabPanel id={cmd.id}>{cmd.command}</SnippetTabPanel>}
  </SnippetTabPanels>
</Snippet>