create-supaslidev 0.1.3 → 0.2.0

package/README.md

@@ -43,6 +43,7 @@ pnpm create supaslidev --name my-slides --presentation intro-deck
 | `--install` / `--no-install` | Run pnpm install          | `true`                |
 
 The wizard creates a pnpm workspace with:
+
 - A `presentations/` directory for your decks
 - A `packages/shared/` directory with reusable components, layouts, and styles (configured as a Slidev addon)
 - Shared dependency management via pnpm catalog

package/dist/cli.js

@@ -10,8 +10,86 @@ import ejs from "ejs";
 import pc from "picocolors";
 import { tmpdir } from "node:os";
 
+//#region src/version.ts
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const pkg = JSON.parse(readFileSync(join(__dirname, "..", "package.json"), "utf-8"));
+const CLI_VERSION = pkg.version;
+const PACKAGE_NAME = "@supaslidev/cli";
+const CACHE_DIR = join(tmpdir(), "supaslidev-cli");
+const CACHE_FILE = join(CACHE_DIR, "version-cache.json");
+const CACHE_TTL_MS = 1440 * 60 * 1e3;
+function compareVersions(current, latest) {
+	const parseVersion = (v) => v.replace(/^v/, "").split(".").map((n) => parseInt(n, 10) || 0);
+	const currentParts = parseVersion(current);
+	const latestParts = parseVersion(latest);
+	for (let i = 0; i < Math.max(currentParts.length, latestParts.length); i++) {
+		const curr = currentParts[i] ?? 0;
+		const lat = latestParts[i] ?? 0;
+		if (lat > curr) return true;
+		if (lat < curr) return false;
+	}
+	return false;
+}
+function readCache() {
+	try {
+		if (!existsSync(CACHE_FILE)) return null;
+		const data = JSON.parse(readFileSync(CACHE_FILE, "utf-8"));
+		if (Date.now() - data.checkedAt > CACHE_TTL_MS) return null;
+		return data;
+	} catch {
+		return null;
+	}
+}
+function writeCache(latestVersion) {
+	try {
+		if (!existsSync(CACHE_DIR)) mkdirSync(CACHE_DIR, { recursive: true });
+		const cache = {
+			latestVersion,
+			checkedAt: Date.now()
+		};
+		writeFileSync(CACHE_FILE, JSON.stringify(cache));
+	} catch {}
+}
+async function fetchLatestPackageVersion(packageName) {
+	try {
+		const controller = new AbortController();
+		const timeoutId = setTimeout(() => controller.abort(), 5e3);
+		const response = await fetch(`https://registry.npmjs.org/${packageName}`, { signal: controller.signal });
+		clearTimeout(timeoutId);
+		if (!response.ok) return null;
+		return (await response.json())["dist-tags"].latest;
+	} catch {
+		return null;
+	}
+}
+async function fetchLatestVersion() {
+	const version = await fetchLatestPackageVersion(PACKAGE_NAME);
+	if (version) writeCache(version);
+	return version;
+}
+function getCachedLatestVersion() {
+	return readCache()?.latestVersion ?? null;
+}
+async function checkForUpdates() {
+	const latestVersion = await fetchLatestVersion();
+	return {
+		currentVersion: CLI_VERSION,
+		latestVersion,
+		updateAvailable: latestVersion ? compareVersions(CLI_VERSION, latestVersion) : false
+	};
+}
+function checkForUpdatesCached() {
+	const latestVersion = getCachedLatestVersion();
+	return {
+		currentVersion: CLI_VERSION,
+		latestVersion,
+		updateAvailable: latestVersion ? compareVersions(CLI_VERSION, latestVersion) : false
+	};
+}
+
+//#endregion
 //#region src/create.ts
-const CLI_VERSION$1 = "0.1.0";
+const SUPASLIDEV_FALLBACK_VERSION = "0.1.4";
 function createSafeSpinner() {
 	if (process.stdout.isTTY && process.stdin.isTTY) {
 		const spinner = p.spinner();
@@ -80,11 +158,7 @@ async function renderTemplatesRecursively(sourceDir, targetDir, data) {
 	}
 }
 function createDirectoryStructure(targetDir) {
-	for (const dir of [
-		"presentations",
-		"packages",
-		"scripts"
-	]) {
+	for (const dir of ["presentations", "packages"]) {
 		const fullPath = join(targetDir, dir);
 		mkdirSync(fullPath, { recursive: true });
 		trackPath(fullPath);
@@ -143,90 +217,7 @@ Add your content here
 [Slidev Documentation](https://sli.dev/)
 `;
 	writeFileSync(join(presentationDir, "slides.md"), slidesContent, "utf-8");
-	writeFileSync(join(presentationDir, ".gitignore"), "node_modules\ndist\n.slidev\n", "utf-8");
-	writeFileSync(join(presentationDir, ".npmrc"), "shamefully-hoist=true\n", "utf-8");
-}
-function createScripts(targetDir) {
-	writeFileSync(join(join(targetDir, "scripts"), "dev-presentation.mjs"), `#!/usr/bin/env node
-
-import { existsSync, readdirSync, statSync } from 'node:fs';
-import { join, dirname } from 'node:path';
-import { fileURLToPath } from 'node:url';
-import { spawn } from 'node:child_process';
-
-const __dirname = dirname(fileURLToPath(import.meta.url));
-const rootDir = join(__dirname, '..');
-const presentationsDir = join(rootDir, 'presentations');
-
-function getPresentations() {
-  if (!existsSync(presentationsDir)) {
-    return [];
-  }
-
-  return readdirSync(presentationsDir)
-    .filter((name) => {
-      const fullPath = join(presentationsDir, name);
-      return statSync(fullPath).isDirectory() && existsSync(join(fullPath, 'slides.md'));
-    })
-    .sort();
-}
-
-function printUsage(presentations) {
-  console.error('Usage: pnpm dev <presentation-name>');
-  console.error('\\nAvailable presentations:');
-
-  if (presentations.length === 0) {
-    console.error('  No presentations found');
-  } else {
-    presentations.forEach((name) => {
-      console.error(\`  \${name}\`);
-    });
-  }
-}
-
-function runDev(name) {
-  const packageName = \`@supaslidev/\${name}\`;
-
-  console.log(\`\\nStarting dev server for \${name}...\\n\`);
-
-  const pnpm = spawn('pnpm', ['--filter', packageName, 'dev'], {
-    cwd: rootDir,
-    stdio: 'inherit',
-    shell: true,
-  });
-
-  pnpm.on('error', (err) => {
-    console.error(\`Failed to start dev server: \${err.message}\`);
-    process.exit(1);
-  });
-
-  pnpm.on('close', (code) => {
-    process.exit(code ?? 0);
-  });
-}
-
-function main() {
-  const args = process.argv.slice(2);
-  const name = args[0];
-  const presentations = getPresentations();
-
-  if (!name) {
-    console.error('Error: Presentation name is required');
-    printUsage(presentations);
-    process.exit(1);
-  }
-
-  if (!presentations.includes(name)) {
-    console.error(\`Error: Presentation "\${name}" not found\`);
-    printUsage(presentations);
-    process.exit(1);
-  }
-
-  runDev(name);
-}
-
-main();
-`, "utf-8");
+	writeFileSync(join(presentationDir, ".gitignore"), "node_modules\n.DS_Store\ndist\n*.local\n.vite-inspect\n.remote-assets\ncomponents.d.ts\n", "utf-8");
 }
 function createSharedPackage(targetDir) {
 	const sharedDir = join(targetDir, "packages", "shared");
@@ -248,49 +239,99 @@ function createSharedPackage(targetDir) {
 		keywords: ["slidev-addon", "slidev"],
 		dependencies: { vue: "catalog:" }
 	}, null, 2) + "\n", "utf-8");
-	writeFileSync(join(sharedDir, "components", "SharedBadge.vue"), `<template>
-  <span class="shared-badge">
-    <slot />
-  </span>
+	writeFileSync(join(sharedDir, "components", "SharedBadge.vue"), `<script setup lang="ts">
+defineProps<{
+  text?: string;
+}>();
+<\/script>
+
+<template>
+  <span class="shared-badge">{{ text ?? 'Shared' }}</span>
 </template>
 
 <style scoped>
 .shared-badge {
   display: inline-block;
-  padding: 0.25rem 0.5rem;
-  border-radius: 0.25rem;
-  background-color: var(--slidev-theme-primary, #3b82f6);
-  color: white;
-  font-size: 0.875rem;
-  font-weight: 500;
+  padding: 0.25rem 0.75rem;
+  font-size: 0.75rem;
+  font-weight: 600;
+  line-height: 1;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: #fff;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  border-radius: 9999px;
 }
 </style>
 `, "utf-8");
 	writeFileSync(join(sharedDir, "README.md"), `# @supaslidev/shared
 
-Shared components, layouts, and styles for your Slidev presentations.
+A local Slidev addon for sharing components, layouts, and styles across all presentations in your workspace.
+
+## How It Works
+
+This package follows the [Slidev addon pattern](https://sli.dev/guide/write-addon). Slidev automatically discovers and imports resources from the following directories:
+
+- **components/** - Vue components available in all slides
+- **layouts/** - Custom slide layouts
+- **styles/** - Shared CSS/SCSS styles
+
+## Using This Addon
+
+Add the addon to your presentation's frontmatter:
+
+\`\`\`yaml
+---
+addons:
+  - '@supaslidev/shared'
+---
+\`\`\`
+
+## Example: Using SharedBadge
 
-## Usage
+The \`SharedBadge\` component is available globally once the addon is configured:
 
-This package is configured as a Slidev addon. Components in the \`components\` directory are automatically available in all presentations that include this addon.
+\`\`\`md
+---
+addons:
+  - '@supaslidev/shared'
+---
+
+# My Slide
+
+<SharedBadge text="New" />
+\`\`\`
 
-## Structure
+## Directory Structure
+
+\`\`\`
+shared/
+├── components/       # Vue components (auto-imported)
+│   └── SharedBadge.vue
+├── layouts/          # Custom layouts
+├── styles/           # Shared styles
+├── package.json
+└── README.md
+\`\`\`
+
+## Adding New Components
+
+Create a \`.vue\` file in \`components/\`:
+
+\`\`\`vue
+<script setup lang="ts">
+defineProps<{
+  label: string;
+}>();
+<\/script>
+
+<template>
+  <div class="my-component">{{ label }}</div>
+</template>
+\`\`\`
 
-- \`components/\` - Shared Vue components
-- \`layouts/\` - Custom slide layouts
-- \`styles/\` - Global styles
+The component is immediately available in all presentations using this addon.
 `, "utf-8");
-	writeFileSync(join(sharedDir, "tsconfig.json"), JSON.stringify({
-		compilerOptions: {
-			target: "ESNext",
-			module: "ESNext",
-			moduleResolution: "bundler",
-			strict: true,
-			jsx: "preserve",
-			skipLibCheck: true
-		},
-		include: ["**/*.ts", "**/*.vue"]
-	}, null, 2) + "\n", "utf-8");
 }
 async function create(options = {}) {
 	const spinner = createSafeSpinner();
@@ -379,20 +420,20 @@ async function create(options = {}) {
 		trackPath(targetDir);
 		spinner.start("Creating workspace structure...");
 		createDirectoryStructure(targetDir);
+		const supaslidevVersion = `^${await fetchLatestPackageVersion("supaslidev") ?? SUPASLIDEV_FALLBACK_VERSION}`;
 		const templateData = {
 			projectName,
 			presentationName,
 			description: `${projectName} - Slidev presentations monorepo`,
-			cliVersion: CLI_VERSION$1,
-			createdAt: (/* @__PURE__ */ new Date()).toISOString()
+			cliVersion: CLI_VERSION,
+			createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+			supaslidevVersion
 		};
 		await renderWorkspaceTemplates(targetDir, options.template ?? "default", templateData);
 		spinner.message("Creating presentation...");
 		await createPresentation(targetDir, presentationName);
 		spinner.message("Creating shared package...");
 		createSharedPackage(targetDir);
-		spinner.message("Creating scripts...");
-		createScripts(targetDir);
 		spinner.stop("Workspace structure created");
 		if (initGit) {
 			spinner.start("Initializing git repository...");
@@ -548,79 +589,6 @@ function getMigrationOrder(manifest) {
 	return order;
 }
 
-//#endregion
-//#region src/version.ts
-const CLI_VERSION = "0.1.0";
-const PACKAGE_NAME = "@supaslidev/cli";
-const CACHE_DIR = join(tmpdir(), "supaslidev-cli");
-const CACHE_FILE = join(CACHE_DIR, "version-cache.json");
-const CACHE_TTL_MS = 1440 * 60 * 1e3;
-function compareVersions(current, latest) {
-	const parseVersion = (v) => v.replace(/^v/, "").split(".").map((n) => parseInt(n, 10) || 0);
-	const currentParts = parseVersion(current);
-	const latestParts = parseVersion(latest);
-	for (let i = 0; i < Math.max(currentParts.length, latestParts.length); i++) {
-		const curr = currentParts[i] ?? 0;
-		const lat = latestParts[i] ?? 0;
-		if (lat > curr) return true;
-		if (lat < curr) return false;
-	}
-	return false;
-}
-function readCache() {
-	try {
-		if (!existsSync(CACHE_FILE)) return null;
-		const data = JSON.parse(readFileSync(CACHE_FILE, "utf-8"));
-		if (Date.now() - data.checkedAt > CACHE_TTL_MS) return null;
-		return data;
-	} catch {
-		return null;
-	}
-}
-function writeCache(latestVersion) {
-	try {
-		if (!existsSync(CACHE_DIR)) mkdirSync(CACHE_DIR, { recursive: true });
-		const cache = {
-			latestVersion,
-			checkedAt: Date.now()
-		};
-		writeFileSync(CACHE_FILE, JSON.stringify(cache));
-	} catch {}
-}
-async function fetchLatestVersion() {
-	try {
-		const controller = new AbortController();
-		const timeoutId = setTimeout(() => controller.abort(), 5e3);
-		const response = await fetch(`https://registry.npmjs.org/${PACKAGE_NAME}`, { signal: controller.signal });
-		clearTimeout(timeoutId);
-		if (!response.ok) return null;
-		const version = (await response.json())["dist-tags"].latest;
-		writeCache(version);
-		return version;
-	} catch {
-		return null;
-	}
-}
-function getCachedLatestVersion() {
-	return readCache()?.latestVersion ?? null;
-}
-async function checkForUpdates() {
-	const latestVersion = await fetchLatestVersion();
-	return {
-		currentVersion: CLI_VERSION,
-		latestVersion,
-		updateAvailable: latestVersion ? compareVersions(CLI_VERSION, latestVersion) : false
-	};
-}
-function checkForUpdatesCached() {
-	const latestVersion = getCachedLatestVersion();
-	return {
-		currentVersion: CLI_VERSION,
-		latestVersion,
-		updateAvailable: latestVersion ? compareVersions(CLI_VERSION, latestVersion) : false
-	};
-}
-
 //#endregion
 //#region src/commands/status.ts
 function getPendingMigrationsCount(workspaceDir) {
@@ -1252,7 +1220,7 @@ function printUpdateNotification(latestVersion) {
 //#endregion
 //#region src/cli.ts
 const program = new Command();
-program.name("create-supaslidev").description("CLI tool for scaffolding Supaslidev presentations").version("0.1.0");
+program.name("create-supaslidev").description("CLI tool for scaffolding Supaslidev presentations").version(CLI_VERSION);
 program.command("create", { isDefault: true }).description("Create a new Supaslidev workspace").option("-n, --name <name>", "Name of the workspace").option("-p, --presentation <name>", "Name of the first presentation").option("-t, --template <template>", "Template to use", "default").option("--git", "Initialize a git repository").option("--no-git", "Skip git initialization").option("--install", "Run pnpm install after scaffolding").option("--no-install", "Skip pnpm install").action(async (options) => {
 	await create(options);
 });

package/dist/index.js

@@ -10,8 +10,86 @@ import { tmpdir } from "node:os";
 import { parse, parseDocument, stringify } from "yaml";
 import { IndentationText, Node, Project, SyntaxKind } from "ts-morph";
 
+//#region src/version.ts
+const __dirname = dirname(fileURLToPath(import.meta.url));
+const pkg = JSON.parse(readFileSync(join(__dirname, "..", "package.json"), "utf-8"));
+const CLI_VERSION = pkg.version;
+const PACKAGE_NAME = "@supaslidev/cli";
+const CACHE_DIR = join(tmpdir(), "supaslidev-cli");
+const CACHE_FILE = join(CACHE_DIR, "version-cache.json");
+const CACHE_TTL_MS = 1440 * 60 * 1e3;
+function compareVersions(current, latest) {
+	const parseVersion = (v) => v.replace(/^v/, "").split(".").map((n) => parseInt(n, 10) || 0);
+	const currentParts = parseVersion(current);
+	const latestParts = parseVersion(latest);
+	for (let i = 0; i < Math.max(currentParts.length, latestParts.length); i++) {
+		const curr = currentParts[i] ?? 0;
+		const lat = latestParts[i] ?? 0;
+		if (lat > curr) return true;
+		if (lat < curr) return false;
+	}
+	return false;
+}
+function readCache() {
+	try {
+		if (!existsSync(CACHE_FILE)) return null;
+		const data = JSON.parse(readFileSync(CACHE_FILE, "utf-8"));
+		if (Date.now() - data.checkedAt > CACHE_TTL_MS) return null;
+		return data;
+	} catch {
+		return null;
+	}
+}
+function writeCache(latestVersion) {
+	try {
+		if (!existsSync(CACHE_DIR)) mkdirSync(CACHE_DIR, { recursive: true });
+		const cache = {
+			latestVersion,
+			checkedAt: Date.now()
+		};
+		writeFileSync(CACHE_FILE, JSON.stringify(cache));
+	} catch {}
+}
+async function fetchLatestPackageVersion(packageName) {
+	try {
+		const controller = new AbortController();
+		const timeoutId = setTimeout(() => controller.abort(), 5e3);
+		const response = await fetch(`https://registry.npmjs.org/${packageName}`, { signal: controller.signal });
+		clearTimeout(timeoutId);
+		if (!response.ok) return null;
+		return (await response.json())["dist-tags"].latest;
+	} catch {
+		return null;
+	}
+}
+async function fetchLatestVersion() {
+	const version = await fetchLatestPackageVersion(PACKAGE_NAME);
+	if (version) writeCache(version);
+	return version;
+}
+function getCachedLatestVersion() {
+	return readCache()?.latestVersion ?? null;
+}
+async function checkForUpdates() {
+	const latestVersion = await fetchLatestVersion();
+	return {
+		currentVersion: CLI_VERSION,
+		latestVersion,
+		updateAvailable: latestVersion ? compareVersions(CLI_VERSION, latestVersion) : false
+	};
+}
+function checkForUpdatesCached() {
+	const latestVersion = getCachedLatestVersion();
+	return {
+		currentVersion: CLI_VERSION,
+		latestVersion,
+		updateAvailable: latestVersion ? compareVersions(CLI_VERSION, latestVersion) : false
+	};
+}
+
+//#endregion
 //#region src/create.ts
-const CLI_VERSION$2 = "0.1.0";
+const SUPASLIDEV_FALLBACK_VERSION = "0.1.4";
 function createSafeSpinner() {
 	if (process.stdout.isTTY && process.stdin.isTTY) {
 		const spinner = p.spinner();
@@ -80,11 +158,7 @@ async function renderTemplatesRecursively(sourceDir, targetDir, data) {
 	}
 }
 function createDirectoryStructure(targetDir) {
-	for (const dir of [
-		"presentations",
-		"packages",
-		"scripts"
-	]) {
+	for (const dir of ["presentations", "packages"]) {
 		const fullPath = join(targetDir, dir);
 		mkdirSync(fullPath, { recursive: true });
 		trackPath(fullPath);
@@ -143,90 +217,7 @@ Add your content here
 [Slidev Documentation](https://sli.dev/)
 `;
 	writeFileSync(join(presentationDir, "slides.md"), slidesContent, "utf-8");
-	writeFileSync(join(presentationDir, ".gitignore"), "node_modules\ndist\n.slidev\n", "utf-8");
-	writeFileSync(join(presentationDir, ".npmrc"), "shamefully-hoist=true\n", "utf-8");
-}
-function createScripts(targetDir) {
-	writeFileSync(join(join(targetDir, "scripts"), "dev-presentation.mjs"), `#!/usr/bin/env node
-
-import { existsSync, readdirSync, statSync } from 'node:fs';
-import { join, dirname } from 'node:path';
-import { fileURLToPath } from 'node:url';
-import { spawn } from 'node:child_process';
-
-const __dirname = dirname(fileURLToPath(import.meta.url));
-const rootDir = join(__dirname, '..');
-const presentationsDir = join(rootDir, 'presentations');
-
-function getPresentations() {
-  if (!existsSync(presentationsDir)) {
-    return [];
-  }
-
-  return readdirSync(presentationsDir)
-    .filter((name) => {
-      const fullPath = join(presentationsDir, name);
-      return statSync(fullPath).isDirectory() && existsSync(join(fullPath, 'slides.md'));
-    })
-    .sort();
-}
-
-function printUsage(presentations) {
-  console.error('Usage: pnpm dev <presentation-name>');
-  console.error('\\nAvailable presentations:');
-
-  if (presentations.length === 0) {
-    console.error('  No presentations found');
-  } else {
-    presentations.forEach((name) => {
-      console.error(\`  \${name}\`);
-    });
-  }
-}
-
-function runDev(name) {
-  const packageName = \`@supaslidev/\${name}\`;
-
-  console.log(\`\\nStarting dev server for \${name}...\\n\`);
-
-  const pnpm = spawn('pnpm', ['--filter', packageName, 'dev'], {
-    cwd: rootDir,
-    stdio: 'inherit',
-    shell: true,
-  });
-
-  pnpm.on('error', (err) => {
-    console.error(\`Failed to start dev server: \${err.message}\`);
-    process.exit(1);
-  });
-
-  pnpm.on('close', (code) => {
-    process.exit(code ?? 0);
-  });
-}
-
-function main() {
-  const args = process.argv.slice(2);
-  const name = args[0];
-  const presentations = getPresentations();
-
-  if (!name) {
-    console.error('Error: Presentation name is required');
-    printUsage(presentations);
-    process.exit(1);
-  }
-
-  if (!presentations.includes(name)) {
-    console.error(\`Error: Presentation "\${name}" not found\`);
-    printUsage(presentations);
-    process.exit(1);
-  }
-
-  runDev(name);
-}
-
-main();
-`, "utf-8");
+	writeFileSync(join(presentationDir, ".gitignore"), "node_modules\n.DS_Store\ndist\n*.local\n.vite-inspect\n.remote-assets\ncomponents.d.ts\n", "utf-8");
 }
 function createSharedPackage(targetDir) {
 	const sharedDir = join(targetDir, "packages", "shared");
@@ -248,49 +239,99 @@ function createSharedPackage(targetDir) {
 		keywords: ["slidev-addon", "slidev"],
 		dependencies: { vue: "catalog:" }
 	}, null, 2) + "\n", "utf-8");
-	writeFileSync(join(sharedDir, "components", "SharedBadge.vue"), `<template>
-  <span class="shared-badge">
-    <slot />
-  </span>
+	writeFileSync(join(sharedDir, "components", "SharedBadge.vue"), `<script setup lang="ts">
+defineProps<{
+  text?: string;
+}>();
+<\/script>
+
+<template>
+  <span class="shared-badge">{{ text ?? 'Shared' }}</span>
 </template>
 
 <style scoped>
 .shared-badge {
   display: inline-block;
-  padding: 0.25rem 0.5rem;
-  border-radius: 0.25rem;
-  background-color: var(--slidev-theme-primary, #3b82f6);
-  color: white;
-  font-size: 0.875rem;
-  font-weight: 500;
+  padding: 0.25rem 0.75rem;
+  font-size: 0.75rem;
+  font-weight: 600;
+  line-height: 1;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  color: #fff;
+  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  border-radius: 9999px;
 }
 </style>
 `, "utf-8");
 	writeFileSync(join(sharedDir, "README.md"), `# @supaslidev/shared
 
-Shared components, layouts, and styles for your Slidev presentations.
+A local Slidev addon for sharing components, layouts, and styles across all presentations in your workspace.
 
-## Usage
+## How It Works
 
-This package is configured as a Slidev addon. Components in the \`components\` directory are automatically available in all presentations that include this addon.
+This package follows the [Slidev addon pattern](https://sli.dev/guide/write-addon). Slidev automatically discovers and imports resources from the following directories:
 
-## Structure
+- **components/** - Vue components available in all slides
+- **layouts/** - Custom slide layouts
+- **styles/** - Shared CSS/SCSS styles
 
-- \`components/\` - Shared Vue components
-- \`layouts/\` - Custom slide layouts
-- \`styles/\` - Global styles
+## Using This Addon
+
+Add the addon to your presentation's frontmatter:
+
+\`\`\`yaml
+---
+addons:
+  - '@supaslidev/shared'
+---
+\`\`\`
+
+## Example: Using SharedBadge
+
+The \`SharedBadge\` component is available globally once the addon is configured:
+
+\`\`\`md
+---
+addons:
+  - '@supaslidev/shared'
+---
+
+# My Slide
+
+<SharedBadge text="New" />
+\`\`\`
+
+## Directory Structure
+
+\`\`\`
+shared/
+├── components/       # Vue components (auto-imported)
+│   └── SharedBadge.vue
+├── layouts/          # Custom layouts
+├── styles/           # Shared styles
+├── package.json
+└── README.md
+\`\`\`
+
+## Adding New Components
+
+Create a \`.vue\` file in \`components/\`:
+
+\`\`\`vue
+<script setup lang="ts">
+defineProps<{
+  label: string;
+}>();
+<\/script>
+
+<template>
+  <div class="my-component">{{ label }}</div>
+</template>
+\`\`\`
+
+The component is immediately available in all presentations using this addon.
 `, "utf-8");
-	writeFileSync(join(sharedDir, "tsconfig.json"), JSON.stringify({
-		compilerOptions: {
-			target: "ESNext",
-			module: "ESNext",
-			moduleResolution: "bundler",
-			strict: true,
-			jsx: "preserve",
-			skipLibCheck: true
-		},
-		include: ["**/*.ts", "**/*.vue"]
-	}, null, 2) + "\n", "utf-8");
 }
 async function create(options = {}) {
 	const spinner = createSafeSpinner();
@@ -379,20 +420,20 @@ async function create(options = {}) {
 		trackPath(targetDir);
 		spinner.start("Creating workspace structure...");
 		createDirectoryStructure(targetDir);
+		const supaslidevVersion = `^${await fetchLatestPackageVersion("supaslidev") ?? SUPASLIDEV_FALLBACK_VERSION}`;
 		const templateData = {
 			projectName,
 			presentationName,
 			description: `${projectName} - Slidev presentations monorepo`,
-			cliVersion: CLI_VERSION$2,
-			createdAt: (/* @__PURE__ */ new Date()).toISOString()
+			cliVersion: CLI_VERSION,
+			createdAt: (/* @__PURE__ */ new Date()).toISOString(),
+			supaslidevVersion
 		};
 		await renderWorkspaceTemplates(targetDir, options.template ?? "default", templateData);
 		spinner.message("Creating presentation...");
 		await createPresentation(targetDir, presentationName);
 		spinner.message("Creating shared package...");
 		createSharedPackage(targetDir);
-		spinner.message("Creating scripts...");
-		createScripts(targetDir);
 		spinner.stop("Workspace structure created");
 		if (initGit) {
 			spinner.start("Initializing git repository...");
@@ -437,7 +478,6 @@ async function create(options = {}) {
 
 //#endregion
 //#region src/state.ts
-const CLI_VERSION$1 = "0.1.0";
 const STATE_DIR = ".supaslidev";
 const STATE_FILE = "state.json";
 function getStatePath(workspaceDir) {
@@ -449,7 +489,7 @@ function getStateDir(workspaceDir) {
 function createInitialState() {
 	const now = (/* @__PURE__ */ new Date()).toISOString();
 	return {
-		cliVersion: CLI_VERSION$1,
+		cliVersion: CLI_VERSION,
 		createdAt: now,
 		lastUpdatedAt: now,
 		appliedMigrations: []
@@ -501,7 +541,7 @@ function hasMigration(workspaceDir, migrationId) {
 function updateCliVersion(workspaceDir) {
 	const state = readState(workspaceDir);
 	if (!state) throw new Error("State file not found. Is this a Supaslidev workspace?");
-	state.cliVersion = CLI_VERSION$1;
+	state.cliVersion = CLI_VERSION;
 	writeState(workspaceDir, state);
 }
 function findWorkspaceRoot(startDir = process.cwd()) {
@@ -594,79 +634,6 @@ function getMigrationOrder(manifest) {
 	return order;
 }
 
-//#endregion
-//#region src/version.ts
-const CLI_VERSION = "0.1.0";
-const PACKAGE_NAME = "@supaslidev/cli";
-const CACHE_DIR = join(tmpdir(), "supaslidev-cli");
-const CACHE_FILE = join(CACHE_DIR, "version-cache.json");
-const CACHE_TTL_MS = 1440 * 60 * 1e3;
-function compareVersions(current, latest) {
-	const parseVersion = (v) => v.replace(/^v/, "").split(".").map((n) => parseInt(n, 10) || 0);
-	const currentParts = parseVersion(current);
-	const latestParts = parseVersion(latest);
-	for (let i = 0; i < Math.max(currentParts.length, latestParts.length); i++) {
-		const curr = currentParts[i] ?? 0;
-		const lat = latestParts[i] ?? 0;
-		if (lat > curr) return true;
-		if (lat < curr) return false;
-	}
-	return false;
-}
-function readCache() {
-	try {
-		if (!existsSync(CACHE_FILE)) return null;
-		const data = JSON.parse(readFileSync(CACHE_FILE, "utf-8"));
-		if (Date.now() - data.checkedAt > CACHE_TTL_MS) return null;
-		return data;
-	} catch {
-		return null;
-	}
-}
-function writeCache(latestVersion) {
-	try {
-		if (!existsSync(CACHE_DIR)) mkdirSync(CACHE_DIR, { recursive: true });
-		const cache = {
-			latestVersion,
-			checkedAt: Date.now()
-		};
-		writeFileSync(CACHE_FILE, JSON.stringify(cache));
-	} catch {}
-}
-async function fetchLatestVersion() {
-	try {
-		const controller = new AbortController();
-		const timeoutId = setTimeout(() => controller.abort(), 5e3);
-		const response = await fetch(`https://registry.npmjs.org/${PACKAGE_NAME}`, { signal: controller.signal });
-		clearTimeout(timeoutId);
-		if (!response.ok) return null;
-		const version = (await response.json())["dist-tags"].latest;
-		writeCache(version);
-		return version;
-	} catch {
-		return null;
-	}
-}
-function getCachedLatestVersion() {
-	return readCache()?.latestVersion ?? null;
-}
-async function checkForUpdates() {
-	const latestVersion = await fetchLatestVersion();
-	return {
-		currentVersion: CLI_VERSION,
-		latestVersion,
-		updateAvailable: latestVersion ? compareVersions(CLI_VERSION, latestVersion) : false
-	};
-}
-function checkForUpdatesCached() {
-	const latestVersion = getCachedLatestVersion();
-	return {
-		currentVersion: CLI_VERSION,
-		latestVersion,
-		updateAvailable: latestVersion ? compareVersions(CLI_VERSION, latestVersion) : false
-	};
-}
-
 //#endregion
 //#region src/commands/status.ts
 function getPendingMigrationsCount(workspaceDir) {
@@ -1346,7 +1313,7 @@ function printUpdateNotification(latestVersion) {
 //#endregion
 //#region src/cli.ts
 const program = new Command();
-program.name("create-supaslidev").description("CLI tool for scaffolding Supaslidev presentations").version("0.1.0");
+program.name("create-supaslidev").description("CLI tool for scaffolding Supaslidev presentations").version(CLI_VERSION);
 program.command("create", { isDefault: true }).description("Create a new Supaslidev workspace").option("-n, --name <name>", "Name of the workspace").option("-p, --presentation <name>", "Name of the first presentation").option("-t, --template <template>", "Template to use", "default").option("--git", "Initialize a git repository").option("--no-git", "Skip git initialization").option("--install", "Run pnpm install after scaffolding").option("--no-install", "Skip pnpm install").action(async (options) => {
 	await create(options);
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-supaslidev",
-  "version": "0.1.3",
+  "version": "0.2.0",
   "description": "CLI tool for scaffolding Supaslidev presentations",
   "keywords": [
     "slidev",
@@ -50,7 +50,7 @@
     "tsdown": "^0.12.5",
     "tsx": "^4.19.0",
     "typescript": "^5.3.3",
-    "vitest": "^3.0.0"
+    "vitest": "^4.0.0"
   },
   "scripts": {
     "build": "tsdown",

package/templates/default/gitignore.ejs

@@ -4,4 +4,3 @@ deploy
 .DS_Store
 *.log
 .slidev
-.turbo

package/templates/default/nuxt.config.ts.ejs

@@ -0,0 +1,3 @@
+import { defineSupaslidevConfig } from 'supaslidev';
+
+export default defineNuxtConfig(defineSupaslidevConfig({}));

package/templates/default/package.json.ejs

@@ -9,10 +9,13 @@
     "new": "supaslidev new",
     "present": "supaslidev present",
     "export": "supaslidev export",
-    "deploy": "supaslidev deploy"
+    "deploy": "supaslidev deploy",
+    "build": "pnpm --filter @supaslidev/* run build"
   },
   "devDependencies": {
-    "supaslidev": "^0.1.4"
+    "nuxt": "catalog:core",
+    "playwright-chromium": "catalog:",
+    "supaslidev": "<%= supaslidevVersion %>"
   },
   "engines": {
     "node": ">=18.0.0"

package/templates/default/pnpm-workspace.yaml.ejs

@@ -8,6 +8,27 @@ catalog:
   '@slidev/theme-seriph': latest
   '@slidev/theme-apple-basic': latest
   vue: ^3.5.26
-  '@vue/compiler-sfc': ^3.5.27
-  typescript: ^5.3.3
-  vue-tsc: ^2.0.0
+  playwright-chromium: ^1.58.2
+
+catalogs:
+  core:
+    nuxt: ^4.4.2
+    '@vue/compiler-sfc': ^3.5.27
+    typescript: ^5.3.3
+    vue-tsc: ^2.0.0
+
+catalogMode: prefer
+
+linkWorkspacePackages: true
+
+shellEmulator: true
+
+trustPolicy: no-downgrade
+
+trustPolicyExclude:
+  - axios
+  - chokidar
+  - semver
+  - undici
+  - undici-types
+  - vite

package/templates/default/npmrc.ejs

@@ -1 +0,0 @@
-shamefully-hoist=true

package/templates/default/tsconfig.json.ejs

@@ -1,17 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ESNext",
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "strict": true,
-    "jsx": "preserve",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "esModuleInterop": true,
-    "lib": ["ESNext", "DOM"],
-    "skipLibCheck": true,
-    "noEmit": true
-  },
-  "include": ["packages/**/*.ts", "packages/**/*.vue"],
-  "exclude": ["node_modules", "**/dist"]
-}

package/templates/default/turbo.json.ejs

@@ -1,24 +0,0 @@
-{
-  "$schema": "https://turbo.build/schema.json",
-  "tasks": {
-    "typecheck": {
-      "dependsOn": ["^typecheck"],
-      "inputs": ["**/*.ts", "**/*.tsx", "**/*.vue", "tsconfig.json"],
-      "outputs": []
-    },
-    "lint": {
-      "dependsOn": ["^lint"],
-      "inputs": ["**/*.ts", "**/*.tsx", "**/*.vue", "**/*.js", "**/*.mjs"],
-      "outputs": []
-    },
-    "build": {
-      "dependsOn": ["^build"],
-      "inputs": ["src/**", "**/*.ts", "**/*.vue", "package.json"],
-      "outputs": ["dist/**"]
-    },
-    "dev": {
-      "cache": false,
-      "persistent": true
-    }
-  }
-}