tackl 1.0.0

package/README.md

@@ -0,0 +1,75 @@
+# Tackl CLI
+
+The ultimate Next.js starter kit with Waffl Grid system.
+
+## Installation
+
+```bash
+npm install -g tackl
+```
+
+## Usage
+
+```bash
+tackl my-app
+```
+
+### Options
+
+- `--ref <branch>` - Template ref (branch or tag) (default: main)
+- `--no-install` - Skip dependency installation
+- `--no-git` - Skip git initialization
+- `--help` - Show help message
+
+### Examples
+
+```bash
+# Create a new project
+tackl my-app
+
+# Create with specific branch
+tackl my-app --ref develop
+
+# Skip installation and git
+tackl my-app --no-install --no-git
+```
+
+## What's Included
+
+- ⚡ **Next.js 15** with App Router
+- 🎨 **Waffl Grid System** - Responsive grid with smart breakpoint inheritance
+- 🎭 **Styled Components** - CSS-in-JS with TypeScript
+- 🎬 **GSAP** - Professional animations
+- 📱 **Responsive Design** - Mobile-first approach
+- 🔧 **TypeScript** - Full type safety
+- 🎯 **Performance** - Optimized for speed
+- 📦 **Modern Tooling** - ESLint, Prettier, Husky
+
+## Features
+
+### Waffl Grid System
+
+- Smart breakpoint inheritance (only specify what changes!)
+- Responsive grid columns
+- Semantic components
+- CSS custom properties
+
+### Example Usage
+
+```jsx
+<Waffl>
+	<Section $s='1/-1' $l='3/9'>
+		// Mobile: full width, Desktop: 3/9 // Tablet inherits mobile (full
+		width) Content
+	</Section>
+</Waffl>
+```
+
+## Repository
+
+- **GitHub**: https://github.com/12-studio/tackl
+- **Issues**: https://github.com/12-studio/tackl/issues
+
+## License
+
+MIT

package/bin/tackl.js

@@ -0,0 +1,248 @@
+#!/usr/bin/env node
+import { execSync } from 'child_process';
+import fs from 'fs';
+import os from 'os';
+import path from 'path';
+import pc from 'picocolors';
+import prompts from 'prompts';
+import * as tar from 'tar';
+import { fileURLToPath } from 'url';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+const OWNER = 'joebentaylor1995';
+const REPO = 'tackl';
+const DEFAULT_REF = 'main';
+
+const log = {
+	info: m => console.log(pc.cyan('•'), m),
+	ok: m => console.log(pc.green('✔'), m),
+	warn: m => console.log(pc.yellow('▲'), m),
+	error: m => console.log(pc.red('✖'), m),
+};
+
+async function main() {
+	const args = process.argv.slice(2);
+
+	// Handle help flag
+	if (args.includes('--help') || args.includes('-h')) {
+		console.log(`
+${pc.bold('Tackl CLI')} - The ultimate Next.js starter kit
+
+${pc.bold('Usage:')}
+  tackl [project-name] [options]
+
+${pc.bold('Options:')}
+  --ref <branch>     Template ref (branch or tag) (default: main)
+  --no-install       Skip dependency installation
+  --no-git           Skip git initialization
+  -h, --help         Show this help message
+
+${pc.bold('Examples:')}
+  tackl my-app
+  tackl my-app --ref develop
+  tackl my-app --no-install --no-git
+
+${pc.bold('Repository:')} https://github.com/12-studio/tackl
+		`);
+		process.exit(0);
+	}
+
+	const argName = args.find(a => !a.startsWith('-'));
+	const getFlagVal = (key, fallback) => {
+		const idx = args.findIndex(a => a === key);
+		return idx >= 0 && args[idx + 1] && !args[idx + 1].startsWith('-')
+			? args[idx + 1]
+			: fallback;
+	};
+
+	const initial = {
+		name: argName,
+		ref: getFlagVal('--ref', DEFAULT_REF),
+		install: !args.includes('--no-install'),
+		git: !args.includes('--no-git'),
+	};
+
+	// Filter out null prompts
+	const promptQuestions = [
+		{
+			type: initial.name ? null : 'text',
+			name: 'name',
+			message: 'Project directory',
+			initial: 'my-tackl-app',
+			validate: v =>
+				/^[a-z0-9\-._]+$/.test(v)
+					? true
+					: 'Use lowercase letters, numbers, - . _',
+		},
+		{
+			type: 'text',
+			name: 'ref',
+			message: 'Template ref (branch or tag)',
+			initial: initial.ref,
+		},
+		{
+			type: 'toggle',
+			name: 'install',
+			message: 'Install dependencies?',
+			initial: initial.install,
+			active: 'yes',
+			inactive: 'no',
+		},
+		{
+			type: 'toggle',
+			name: 'git',
+			message: 'Initialize git?',
+			initial: initial.git,
+			active: 'yes',
+			inactive: 'no',
+		},
+	].filter(q => q.type !== null);
+
+	const answers = await prompts(promptQuestions, {
+		onCancel: () => {
+			log.warn('Cancelled.');
+			process.exit(1);
+		},
+		onSubmit: () => {
+			// Clean up terminal
+			process.stdout.write('\x1b[?25h');
+		},
+	});
+
+	const projectName = (answers.name || initial.name).trim();
+	const ref = (answers.ref || initial.ref).trim();
+	const doInstall = answers.install;
+	const doGit = answers.git;
+
+	// Validate project name
+	if (!projectName) {
+		log.error('Project name is required.');
+		process.exit(1);
+	}
+
+	const targetDir = path.resolve(process.cwd(), projectName);
+	if (fs.existsSync(targetDir) && fs.readdirSync(targetDir).length > 0) {
+		log.error(
+			`Directory "${projectName}" already exists and is not empty.`
+		);
+		process.exit(1);
+	}
+	fs.mkdirSync(targetDir, { recursive: true });
+
+	log.info(
+		`Scaffolding ${pc.bold(projectName)} from ${OWNER}/${REPO}@${ref} ...`
+	);
+
+	const tarUrl = `https://codeload.github.com/${OWNER}/${REPO}/tar.gz/${encodeURIComponent(ref)}`;
+	const tmpTar = path.join(os.tmpdir(), `tackl-${Date.now()}.tgz`);
+
+	try {
+		const res = await fetch(tarUrl);
+		if (!res.ok)
+			throw new Error(`Download failed: ${res.status} ${res.statusText}`);
+		const out = fs.createWriteStream(tmpTar);
+		await new Promise((resolve, reject) => {
+			res.body.pipe(out);
+			res.body.on('error', reject);
+			out.on('finish', resolve);
+		});
+		log.ok('Downloaded template.');
+	} catch (e) {
+		log.error(e.message);
+		process.exit(1);
+	}
+
+	try {
+		await tar.x({ file: tmpTar, cwd: targetDir, strip: 1 });
+		log.ok('Extracted files.');
+	} catch (e) {
+		log.error(`Extraction failed: ${e.message}`);
+		process.exit(1);
+	} finally {
+		try {
+			fs.unlinkSync(tmpTar);
+		} catch {}
+	}
+
+	// Remove template .git if present
+	try {
+		const gitPath = path.join(targetDir, '.git');
+		if (fs.existsSync(gitPath))
+			fs.rmSync(gitPath, { recursive: true, force: true });
+	} catch {}
+
+	// Patch package name
+	const pkg = path.join(targetDir, 'package.json');
+	if (fs.existsSync(pkg)) {
+		try {
+			const json = JSON.parse(fs.readFileSync(pkg, 'utf8'));
+			json.name = projectName.toLowerCase();
+			fs.writeFileSync(pkg, JSON.stringify(json, null, 2));
+			log.ok('Updated package.json name.');
+		} catch (e) {
+			log.warn(`Could not update package.json: ${e.message}`);
+		}
+	}
+
+	if (doGit) {
+		try {
+			execSync('git init', { cwd: targetDir, stdio: 'ignore' });
+			execSync('git add -A', { cwd: targetDir, stdio: 'ignore' });
+			execSync('git commit -m "chore: scaffold with tackl"', {
+				cwd: targetDir,
+				stdio: 'ignore',
+			});
+			log.ok('Initialized git repository.');
+		} catch (e) {
+			log.warn(`Git init failed: ${e.message}`);
+		}
+	}
+
+	if (doInstall) {
+		try {
+			const pm = detectPM();
+			log.info(`Installing dependencies with ${pm} ...`);
+			execSync(
+				pm === 'pnpm'
+					? 'pnpm install'
+					: pm === 'yarn'
+						? 'yarn'
+						: 'npm install',
+				{ cwd: targetDir, stdio: 'inherit' }
+			);
+			log.ok('Dependencies installed.');
+		} catch (e) {
+			log.warn(`Install failed: ${e.message}`);
+		}
+	} else {
+		log.info('Skipped dependency install.');
+	}
+
+	const rel = path.relative(process.cwd(), targetDir) || '.';
+	console.log(
+		'\n' + pc.bold(pc.green('Success!')) + ' Project scaffolded.\n'
+	);
+	console.log(`  Next steps:`);
+	console.log(`  1) cd ${rel}`);
+	if (!doInstall) console.log(`  2) npm install   (or pnpm/yarn)`);
+	console.log(`  ${doInstall ? '2' : '3'}) npm run dev`);
+}
+
+function detectPM() {
+	try {
+		execSync('pnpm --version', { stdio: 'ignore' });
+		return 'pnpm';
+	} catch {}
+	try {
+		execSync('yarn --version', { stdio: 'ignore' });
+		return 'yarn';
+	} catch {}
+	return 'npm';
+}
+
+main().catch(e => {
+	console.error(e);
+	process.exit(1);
+});

package/package.json

@@ -0,0 +1,45 @@
+{
+	"name": "tackl",
+	"version": "1.0.0",
+	"description": "The ultimate Next.js starter kit with Waffl Grid system",
+	"type": "module",
+	"bin": {
+		"tackl": "./bin/tackl.js"
+	},
+	"main": "index.js",
+	"scripts": {
+		"test": "echo \"Error: no test specified\" && exit 1"
+	},
+	"keywords": [
+		"nextjs",
+		"react",
+		"starter",
+		"template",
+		"grid",
+		"css",
+		"styled-components",
+		"typescript"
+	],
+	"author": "joebentaylor1995",
+	"license": "MIT",
+	"engines": {
+		"node": ">=20.0.0"
+	},
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/12-studio/tackl"
+	},
+	"homepage": "https://github.com/12-studio/tackl",
+	"bugs": {
+		"url": "https://github.com/12-studio/tackl/issues"
+	},
+	"files": [
+		"bin/",
+		"README.md"
+	],
+	"dependencies": {
+		"picocolors": "^1.1.1",
+		"prompts": "^2.4.2",
+		"tar": "^7.5.1"
+	}
+}