Add Bun support and sticky package manager tabs (#698)

- Add Bun as a package manager option alongside npm, pnpm, yarn
- Add storageKey to tabs so selection persists across the page

Co-authored-by: Rachel Lee Nabors <[email protected]>
Co-authored-by: Claude Opus 4.5 <[email protected]>

Author: nearestnabors

app/en/get-started/agent-frameworks/mastra/page.mdx

@@ -60,7 +60,7 @@ Select your preferred model provider when prompted (we recommend OpenAI). Enter
 
 Then navigate to the project directory and install the Arcade client:
 
-<Tabs items={["npm", "pnpm", "yarn"]}>
+<Tabs items={["npm", "pnpm", "yarn", "bun"]} storageKey="package-manager">
 
 <Tabs.Tab>
 
@@ -89,6 +89,15 @@ yarn add @arcadeai/arcadejs @ai-sdk/openai zod@3
 
 </Tabs.Tab>
 
+<Tabs.Tab>
+
+```bash
+cd arcade-agent
+bun add @arcadeai/arcadejs @ai-sdk/openai zod@3
+```
+
+</Tabs.Tab>
+
 </Tabs>
 
 <Callout type="info">
@@ -311,7 +320,7 @@ export const mastra = new Mastra({
 
 Start the development server:
 
-<Tabs items={["npm", "pnpm", "yarn"]}>
+<Tabs items={["npm", "pnpm", "yarn", "bun"]} storageKey="package-manager">
 
 <Tabs.Tab>
 
@@ -337,6 +346,14 @@ yarn dev
 
 </Tabs.Tab>
 
+<Tabs.Tab>
+
+```bash
+bun dev
+```
+
+</Tabs.Tab>
+
 </Tabs>
 
 Open [http://localhost:4111](http://localhost:4111) to access Mastra Studio. Select **arcadeAgent** from the list and try prompts like:

app/en/get-started/agent-frameworks/vercelai/page.mdx

@@ -61,7 +61,7 @@ Use the default settings for the project.
 
 Install the required dependencies and [AI Elements](https://ai-sdk.dev/elements) (pre-built React components for chat interfaces):
 
-<Tabs items={["npm", "pnpm", "yarn"]}>
+<Tabs items={["npm", "pnpm", "yarn", "bun"]} storageKey="package-manager">
 
 <Tabs.Tab>
 
@@ -90,6 +90,15 @@ yarn dlx ai-elements@latest
 
 </Tabs.Tab>
 
+<Tabs.Tab>
+
+```bash
+bun add ai @ai-sdk/openai @ai-sdk/react @arcadeai/arcadejs zod
+bunx ai-elements@latest
+```
+
+</Tabs.Tab>
+
 </Tabs>
 
 Follow the AI Elements prompts to complete the installation.
@@ -531,7 +540,7 @@ export default function Chat() {
 
 ### Run the chatbot
 
-<Tabs items={["npm", "pnpm", "yarn"]}>
+<Tabs items={["npm", "pnpm", "yarn", "bun"]} storageKey="package-manager">
 
 <Tabs.Tab>
 
@@ -557,6 +566,14 @@ yarn dev
 
 </Tabs.Tab>
 
+<Tabs.Tab>
+
+```bash
+bun dev
+```
+
+</Tabs.Tab>
+
 </Tabs>
 
 Open [http://localhost:3000](http://localhost:3000) and try prompts like: