docs(www): add radix-ui deps install (#827)

apps/www/content/docs/components/accordion.mdx

@@ -67,6 +67,12 @@ module.exports = {
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-accordion
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="accordion" />

apps/www/content/docs/components/alert-dialog.mdx

@@ -30,6 +30,12 @@ npx shadcn-ui@latest add alert-dialog
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-alert-dialog
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="alert-dialog" />

apps/www/content/docs/components/aspect-ratio.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add aspect-ratio
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-aspect-ratio
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="aspect-ratio" />

apps/www/content/docs/components/avatar.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add avatar
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-avatar
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="avatar" />

apps/www/content/docs/components/button.mdx

@@ -27,6 +27,12 @@ npx shadcn-ui@latest add button
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-slot
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="button" />

apps/www/content/docs/components/calendar.mdx

@@ -30,6 +30,16 @@ npx shadcn-ui@latest add calendar
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install react-day-picker date-fns
+```
+
+<Step>Add the `Button` component to your project.</Step>
+
+The `Calendar` component uses the `Button` component. Make sure you have it installed in your project.
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="calendar" />

apps/www/content/docs/components/checkbox.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add checkbox
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-checkbox
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="checkbox" />

apps/www/content/docs/components/collapsible.mdx

@@ -30,6 +30,12 @@ npx shadcn-ui@latest add collapsible
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-collapsible
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="collapsible" />

apps/www/content/docs/components/command.mdx

@@ -34,6 +34,12 @@ npx shadcn-ui@latest add command
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install cmdk
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="command" />

apps/www/content/docs/components/context-menu.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add context-menu
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-context-menu
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="context-menu" />

apps/www/content/docs/components/dialog.mdx

@@ -30,6 +30,12 @@ npx shadcn-ui@latest add dialog
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-dialog
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="dialog" />

apps/www/content/docs/components/dropdown-menu.mdx

@@ -30,6 +30,12 @@ npx shadcn-ui@latest add dropdown-menu
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-dropdown-menu
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="dropdown-menu" />

apps/www/content/docs/components/hover-card.mdx

@@ -27,6 +27,12 @@ npx shadcn-ui@latest add hover-card
 
 <TabsContent value="manual">
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-hover-card
+```
+
 <Steps>
 
 <Step>Copy and paste the following code into your project.</Step>

apps/www/content/docs/components/label.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add label
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-label
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="label" />

apps/www/content/docs/components/menubar.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add menubar
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-menubar
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="menubar" />

apps/www/content/docs/components/navigation-menu.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add navigation-menu
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-navigation-menu
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="navigation-menu" />

apps/www/content/docs/components/popover.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add popover
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-popover
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="popover" />

apps/www/content/docs/components/progress.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add progress
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-progress
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="progress" />

apps/www/content/docs/components/radio-group.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add radio-group
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-radio-group
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="radio-group" />

apps/www/content/docs/components/scroll-area.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add scroll-area
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-scroll-area
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="scroll-area" />

apps/www/content/docs/components/select.mdx

@@ -30,6 +30,12 @@ npx shadcn-ui@latest add select
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-select
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="select" />

apps/www/content/docs/components/separator.mdx

@@ -28,6 +28,11 @@ npx shadcn-ui@latest add separator
 <TabsContent value="manual">
 
 <Steps>
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-separator
+```
 
 <Step>Copy and paste the following code into your project.</Step>
 

apps/www/content/docs/components/sheet.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add sheet
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-dialog
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="sheet" />

apps/www/content/docs/components/slider.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add slider
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-slider
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="slider" />

apps/www/content/docs/components/switch.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add switch
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-switch
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="switch" />

apps/www/content/docs/components/tabs.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add tabs
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-tabs
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="tabs" />

apps/www/content/docs/components/toast.mdx

@@ -53,6 +53,12 @@ export default function RootLayout({ children }) {
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-toast
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="toast" />

apps/www/content/docs/components/toggle.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add toggle
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-toggle
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="toggle" />

apps/www/content/docs/components/tooltip.mdx

@@ -29,6 +29,12 @@ npx shadcn-ui@latest add tooltip
 
 <Steps>
 
+<Step>Install the following dependencies:</Step>
+
+```bash
+npm install @radix-ui/react-tooltip
+```
+
 <Step>Copy and paste the following code into your project.</Step>
 
 <ComponentSource name="tooltip" />