diff --git a/sites/docs/src/lib/components/docs/block-toolbar.svelte b/sites/docs/src/lib/components/docs/block-toolbar.svelte
index b2ef01807..538b336b5 100644
--- a/sites/docs/src/lib/components/docs/block-toolbar.svelte
+++ b/sites/docs/src/lib/components/docs/block-toolbar.svelte
@@ -5,25 +5,22 @@
 	import Smartphone from "lucide-svelte/icons/smartphone";
 	import Tablet from "lucide-svelte/icons/tablet";
 	import Terminal from "lucide-svelte/icons/terminal";
-	import { getPackageManagerScriptCmd } from "$lib/utils.js";
 	import { Button } from "$lib/registry/new-york/ui/button/index.js";
 	import { Separator } from "$lib/registry/new-york/ui/separator/index.js";
 	import * as ToggleGroup from "$lib/registry/new-york/ui/toggle-group/index.js";
 	import type { Block } from "$lib/registry/schema.js";
 	import type { ResizablePane } from "$lib/registry/new-york/ui/resizable/index.js";
 	import { CopyToClipboard } from "$lib/utils/copy-to-clipboard.svelte.js";
-	import { getPackageManager } from "$lib/stores/package-manager.js";
+	import { getCommand, getPackageManager } from "$lib/stores/package-manager.js";
 
 	let { block, resizablePaneRef }: { block: Block; resizablePaneRef: ResizablePane } = $props();
 
 	const copier = new CopyToClipboard();
 	const selectedPackageManager = getPackageManager();
 
-	const addCommand = $derived.by(() => {
-		const start = getPackageManagerScriptCmd($selectedPackageManager);
-		const end = `shadcn-svelte@next add ${block.name}`;
-		return start + " " + end;
-	});
+	const addCommand = $derived(
+		getCommand($selectedPackageManager, "execute", `shadcn-svelte@next add ${block.name}`)
+	);
 
 	const blockSource = $derived(
 		`https://github.com/huntabyte/shadcn-svelte/tree/next/sites/docs/src/lib/registry/new-york/block/${block.name}`
@@ -40,7 +37,7 @@
 			class="bg-muted h-7 rounded-md border shadow-none"
 			size="sm"
 			onclick={() => {
-				copier.copyToClipboard(addCommand);
+				copier.copyToClipboard(addCommand.command + " " + addCommand.args.join(" "));
 			}}
 		>
 			{#if copier.isCopied}
diff --git a/sites/docs/src/lib/components/docs/pm-block.svelte b/sites/docs/src/lib/components/docs/pm-block.svelte
index de9ad014f..79e1c2269 100644
--- a/sites/docs/src/lib/components/docs/pm-block.svelte
+++ b/sites/docs/src/lib/components/docs/pm-block.svelte
@@ -1,12 +1,7 @@
 <script lang="ts">
 	import Pre from "./markdown/pre.svelte";
-	import { getPackageManager } from "$lib/stores/package-manager.js";
-	import {
-		resolveCommand,
-		type Agent,
-		type Command,
-		type ResolvedCommand,
-	} from "package-manager-detector";
+	import { getCommand, getPackageManager } from "$lib/stores/package-manager.js";
+	import { type Command } from "package-manager-detector";
 
 	type Props = {
 		type: Command | "create";
@@ -17,26 +12,7 @@
 
 	const selectedPackageManager = getPackageManager();
 
-	function getCmd(pm: Agent, type: Props["type"]): ResolvedCommand {
-		let args = [];
-		if (typeof command === "string") {
-			args = command.split(" ");
-		} else {
-			args = command;
-		}
-
-		// special handling for create
-		if (type === "create") return { command: pm, args: ["create", ...args] };
-
-		const cmd = resolveCommand(pm, type, args);
-
-		// since docs are static any unresolved command is a code error
-		if (cmd === null) throw new Error("Could not resolve command!");
-
-		return cmd;
-	}
-
-	let resolvedCommand = $derived(getCmd($selectedPackageManager, type));
+	let resolvedCommand = $derived(getCommand($selectedPackageManager, type, command));
 </script>
 
 <figure data-rehype-pretty-code-figure>
diff --git a/sites/docs/src/lib/stores/package-manager.ts b/sites/docs/src/lib/stores/package-manager.ts
index 74c2bad2b..401eeeea4 100644
--- a/sites/docs/src/lib/stores/package-manager.ts
+++ b/sites/docs/src/lib/stores/package-manager.ts
@@ -1,6 +1,11 @@
 import { getContext, setContext } from "svelte";
 import { persisted } from "svelte-persisted-store";
-import type { Agent } from "package-manager-detector";
+import {
+	resolveCommand,
+	type Agent,
+	type Command,
+	type ResolvedCommand,
+} from "package-manager-detector";
 
 const PACKAGE_MANAGER = Symbol("packageManager");
 
@@ -18,3 +23,28 @@ function createPackageManagerStore(key: string, initialValue: Agent) {
 	const store = persisted(key, initialValue);
 	return store;
 }
+
+export type PackageManagerCommand = Command | "create";
+
+export function getCommand(
+	pm: Agent,
+	type: PackageManagerCommand,
+	command: string | string[]
+): ResolvedCommand {
+	let args = [];
+	if (typeof command === "string") {
+		args = command.split(" ");
+	} else {
+		args = command;
+	}
+
+	// special handling for create
+	if (type === "create") return { command: pm, args: ["create", ...args] };
+
+	const cmd = resolveCommand(pm, type, args);
+
+	// since docs are static any unresolved command is a code error
+	if (cmd === null) throw new Error("Could not resolve command!");
+
+	return cmd;
+}
diff --git a/sites/docs/src/lib/utils.ts b/sites/docs/src/lib/utils.ts
index 5500b1d83..a574be0b2 100644
--- a/sites/docs/src/lib/utils.ts
+++ b/sites/docs/src/lib/utils.ts
@@ -260,38 +260,6 @@ export function getLiftMode(name: string) {
 	};
 }
 
-export const packageManagers = ["pnpm", "bun", "yarn", "npm"] as const;
-export type PackageManager = (typeof packageManagers)[number];
-
-export const selectedPackageManager = persisted<PackageManager>("package-manager", "npm");
-
-const packageManagerToScriptCmd: Record<PackageManager, string> = {
-	npm: "npx",
-	yarn: "yarn dlx",
-	pnpm: "pnpm dlx",
-	bun: "bunx",
-};
-
-export function getPackageManagerScriptCmd(pm: PackageManager): string {
-	return packageManagerToScriptCmd[pm];
-}
-
-const packageManagerToInstallCmd: Record<PackageManager, string> = {
-	npm: "install",
-	yarn: "add",
-	pnpm: "add",
-	bun: "add",
-};
-
-export function getPackageManagerInstallCmd(pm: PackageManager): string {
-	return packageManagerToInstallCmd[pm];
-}
-
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function isPackageManager(value: any): value is PackageManager {
-	return packageManagers.includes(value);
-}
-
 // Wrappers around svelte's `HTMLAttributes` types to add a `ref` prop can be bound to
 // to get a reference to the underlying DOM element the component is rendering.
 export type PrimitiveDivAttributes = WithElementRef<HTMLAttributes<HTMLDivElement>>;