tackl 2.0.0 → 2.2.0

package/README.md

@@ -11,6 +11,10 @@ bunx tackl                  # or: bun create tackl / npm create tackl@latest
 
 You'll be asked which CMS to use — **DatoCMS**, **Sanity**, or **None** — and the scaffold is pruned to match: only the chosen adapter, its dependencies, its docs, and its `.env.example` block survive.
 
+Choosing **Sanity** sets the whole thing up: an embedded Studio at `/studio`, example schemas, and draft-mode preview routes ship in the scaffold, and the CLI offers to run `sanity init` for you — logging in, creating/linking a project, and writing your `.env`. Scaffold → `bun run dev` → `/studio` → start editing.
+
+On your first `bun run dev`, a **setup wizard** greets you in the browser: it walks through every theme token (colours, spacing, motion, fonts, the type scale), writes your answers into `src/theme`, then deletes itself — skip it to keep the starter defaults. The scaffold commit the CLI makes is your restore point if you ever want to run it again.
+
 ## What it does
 
 1. Verifies the directory is empty (an existing `.git`, `.gitignore`, `README.md` or `LICENSE` is fine — your repo's `.git` and remote are kept)

package/bin/tackl.js

@@ -1,8 +1,8 @@
 #!/usr/bin/env node
-import { execSync } from 'child_process';
-import fs from 'fs';
-import os from 'os';
-import path from 'path';
+import { execSync } from 'node:child_process';
+import fs from 'node:fs';
+import os from 'node:os';
+import path from 'node:path';
 import pc from 'picocolors';
 import prompts from 'prompts';
 import * as tar from 'tar';
@@ -104,16 +104,21 @@ const stripDeps = (root, deps) => {
 		delete json.dependencies?.[d];
 		delete json.devDependencies?.[d];
 	}
-	fs.writeFileSync(p, JSON.stringify(json, null, '\t') + '\n');
+	fs.writeFileSync(p, `${JSON.stringify(json, null, '\t')}\n`);
 };
 
+// NOTE • Everything that exists solely for the embedded Sanity Studio
+const SANITY_STUDIO_PATHS = ['app/(studio)', 'app/api/draft-mode', 'sanity.config.ts', 'sanity'];
+const SANITY_DEPS = ['next-sanity', 'sanity', '@sanity/vision'];
+
 const CMS = {
 	dato: {
 		title: 'DatoCMS',
 		prune: root => {
 			rmrf(root, 'src/cms/sanity');
 			rmrf(root, 'docs/Sanity');
-			stripDeps(root, ['next-sanity']);
+			for (const p of SANITY_STUDIO_PATHS) rmrf(root, p);
+			stripDeps(root, SANITY_DEPS);
 			stripEnvBlock(root, '# CMS — Sanity');
 		},
 	},
@@ -138,7 +143,8 @@ const CMS = {
 			rmrf(root, 'docs/Sanity');
 			rmrf(root, 'docs/DatoCMS');
 			rmrf(root, 'docs/CMS.md');
-			stripDeps(root, ['next-sanity', '@datocms/cda-client', 'react-datocms', 'graphql', 'graphql-tag']);
+			for (const p of SANITY_STUDIO_PATHS) rmrf(root, p);
+			stripDeps(root, [...SANITY_DEPS, '@datocms/cda-client', 'react-datocms', 'graphql', 'graphql-tag']);
 			stripEnvBlock(root, '# CMS — Sanity');
 			stripEnvBlock(root, '# CMS — DatoCMS');
 		},
@@ -182,7 +188,9 @@ ${pc.bold('Repository:')} https://github.com/${OWNER}/${REPO}
 	const targetDir = process.cwd();
 
 	if (!dirIsScaffoldable(targetDir)) {
-		log.error('This directory is not empty. Run tackl inside an empty directory (a .git folder, .gitignore, README.md and LICENSE are fine).');
+		log.error(
+			'This directory is not empty. Run tackl inside an empty directory (a .git folder, .gitignore, README.md and LICENSE are fine).'
+		);
 		process.exit(1);
 	}
 
@@ -219,10 +227,11 @@ ${pc.bold('Repository:')} https://github.com/${OWNER}/${REPO}
 
 	const cms = cmsFlag || answers.cms;
 	const rawName = flagValue('--name') || path.basename(targetDir);
-	const projectName = rawName
-		.toLowerCase()
-		.replace(/[^a-z0-9\-._]/g, '-')
-		.replace(/^[-.]+|[-.]+$/g, '') || 'tackl-app';
+	const projectName =
+		rawName
+			.toLowerCase()
+			.replace(/[^a-z0-9\-._]/g, '-')
+			.replace(/^[-.]+|[-.]+$/g, '') || 'tackl-app';
 	const doInstall = !args.includes('--no-install');
 	const doGit = !args.includes('--no-git');
 	const hadGit = fs.existsSync(path.join(targetDir, '.git'));
@@ -294,7 +303,7 @@ ${pc.bold('Repository:')} https://github.com/${OWNER}/${REPO}
 			json.version = '0.1.0';
 			delete json.repository;
 			delete json.author;
-			fs.writeFileSync(pkgPath, JSON.stringify(json, null, '\t') + '\n');
+			fs.writeFileSync(pkgPath, `${JSON.stringify(json, null, '\t')}\n`);
 			log.ok('package.json updated.');
 		} catch (e) {
 			log.warn(`Could not update package.json: ${e.message}`);
@@ -330,11 +339,39 @@ ${pc.bold('Repository:')} https://github.com/${OWNER}/${REPO}
 		log.info('Skipped dependency install.');
 	}
 
-	console.log('\n' + pc.bold(pc.green('Success!')) + ' Project scaffolded.\n');
+	// SECTION • Sanity project link
+	// NOTE • A Sanity scaffold isn't usable until a project id exists —
+	// sanity's own init logs in, creates/links a project and writes .env.
+	let sanityLinked = false;
+	if (cms === 'sanity' && process.stdout.isTTY) {
+		const { link } = await prompts({
+			type: 'confirm',
+			name: 'link',
+			message: 'Link a Sanity project now? (opens a browser login, writes .env)',
+			initial: true,
+		});
+		if (link) {
+			try {
+				execSync('bunx sanity@latest init --env .env', { cwd: targetDir, stdio: 'inherit' });
+				sanityLinked = true;
+				log.ok('Sanity project linked!');
+			} catch (e) {
+				log.warn(`sanity init did not complete: ${e.message}`);
+			}
+		}
+	}
+
+	console.log(`\n${pc.bold(pc.green('Success!'))} Project scaffolded.\n`);
 	console.log('  Next steps:');
-	console.log('  1) cp .env.example .env   # then fill in your values');
-	if (!doInstall) console.log('  2) bun install');
-	console.log(`  ${doInstall ? '2' : '3'}) bun run dev`);
+	let step = 1;
+	if (cms === 'sanity' && !sanityLinked) {
+		console.log(`  ${step++}) bunx sanity init --env .env   # create/link your Sanity project`);
+	} else if (cms !== 'sanity') {
+		console.log(`  ${step++}) cp .env.example .env   # then fill in your values`);
+	}
+	if (!doInstall) console.log(`  ${step++}) bun install`);
+	console.log(`  ${step++}) bun run dev   # a first-run setup wizard walks you through your theme`);
+	if (cms === 'sanity') console.log(`  ${step}) open http://localhost:3000/studio to start editing content`);
 }
 
 main().catch(e => {

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "tackl",
-	"version": "2.0.0",
+	"version": "2.2.0",
 	"description": "Scaffold a Tackl project into the current directory — Next.js, styled-components, Waffl grid, DatoCMS/Sanity adapters",
 	"type": "module",
 	"bin": {