create-harper 1.4.2 → 1.4.4

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "create-harper",
 	"description": "Scaffold a new Harper project in JavaScript or TypeScript.",
-	"version": "1.4.2",
+	"version": "1.4.4",
 	"type": "module",
 	"author": {
 		"name": "HarperDB",
@@ -18,7 +18,9 @@
 		"template-react/",
 		"template-react-ts/",
 		"template-vanilla/",
-		"template-vanilla-ts/"
+		"template-vanilla-ts/",
+		"template-vue/",
+		"template-vue-ts/"
 	],
 	"scripts": {
 		"commitlint": "commitlint --edit",

package/template-react/eslint.config.js

@@ -0,0 +1,23 @@
+import js from '@eslint/js';
+import globals from 'globals';
+
+export default [
+	js.configs.recommended,
+	{
+		languageOptions: {
+			globals: {
+				...globals.browser,
+				...globals.node,
+			},
+			ecmaVersion: 'latest',
+			sourceType: 'module',
+		},
+		rules: {
+			'no-unused-vars': 'warn',
+			'no-console': 'off',
+		},
+	},
+	{
+		ignores: ['node_modules/'],
+	},
+];

package/template-react/package.json

@@ -6,19 +6,25 @@
 	"scripts": {
 		"agent:run": "npx -y @harperfast/agent@latest",
 		"agent:skills:update": "npx -y skills@latest add harperfast/skills --all --yes",
-		"dev": "harper run .",
-		"test": "echo 'No tests implemented yet'",
-		"lint": "echo 'No lint implemented yet'",
+		"start": "harperdb run .",
+		"dev": "harperdb dev .",
+		"lint": "eslint .",
+		"format": "prettier --write .",
+		"test": "node --test test/*.test.js",
+		"test:watch": "node --watch --test test/*.test.js",
 		"build": "vite build",
-		"preview": "vite preview",
 		"deploy": "rm -Rf deploy && npm run build && mkdir deploy && mv web deploy/ && cp -R deploy-template/* deploy/ && dotenv -- npm run deploy:component && rm -Rf deploy",
 		"deploy:component": "(cd deploy && harperdb deploy_component . project=web restart=rolling replicated=true)"
 	},
 	"devDependencies": {
+		"@eslint/js": "^10.0.1",
 		"@harperfast/vite-plugin": "^0.0.1",
 		"@vitejs/plugin-react": "^5.1.2",
 		"dotenv-cli": "^11.0.0",
-		"harperdb": "^4.7.17",
+		"eslint": "^10.0.2",
+		"globals": "^17.4.0",
+		"harperdb": "^4.7.20",
+		"prettier": "^3.8.1",
 		"react": "^19.2.4",
 		"react-dom": "^19.2.4",
 		"vite": "npm:rolldown-vite@7.3.1"

package/template-react/src/App.jsx

@@ -2,11 +2,12 @@ import reactLogo from '/react.svg';
 import typescriptLogo from '/typescript.svg';
 import viteLogo from '/vite.svg';
 import { useCallback, useState } from 'react';
+import { increment } from './counter.js';
 
 export function App() {
 	const [counter, setCounter] = useState(0);
 	const countUp = useCallback(() => {
-		setCounter(counter => counter + 1);
+		setCounter(counter => increment(counter));
 	}, []);
 
 	return (

package/template-react/src/counter.js

@@ -0,0 +1,7 @@
+export function increment(value) {
+	return value + 1;
+}
+
+export function decrement(value) {
+	return value - 1;
+}

package/template-react/test/counter.test.js

@@ -0,0 +1,15 @@
+import assert from 'node:assert/strict';
+import { test } from 'node:test';
+import { decrement, increment } from '../src/counter.js';
+
+test('increment function', () => {
+	assert.strictEqual(increment(0), 1);
+	assert.strictEqual(increment(1), 2);
+	assert.strictEqual(increment(-1), 0);
+});
+
+test('decrement function', () => {
+	assert.strictEqual(decrement(0), -1);
+	assert.strictEqual(decrement(1), 0);
+	assert.strictEqual(decrement(-1), -2);
+});

package/template-react-ts/eslint.config.js

@@ -0,0 +1,23 @@
+import js from '@eslint/js';
+import globals from 'globals';
+
+export default [
+	js.configs.recommended,
+	{
+		languageOptions: {
+			globals: {
+				...globals.browser,
+				...globals.node,
+			},
+			ecmaVersion: 'latest',
+			sourceType: 'module',
+		},
+		rules: {
+			'no-unused-vars': 'warn',
+			'no-console': 'off',
+		},
+	},
+	{
+		ignores: ['node_modules/'],
+	},
+];

package/template-react-ts/package.json

@@ -6,22 +6,28 @@
 	"scripts": {
 		"agent:run": "npx -y @harperfast/agent@latest",
 		"agent:skills:update": "npx -y skills@latest add harperfast/skills --all --yes",
-		"dev": "harper run .",
-		"test": "echo 'No tests implemented yet'",
-		"lint": "echo 'No lint implemented yet'",
-		"build": "tsc -b && vite build",
-		"preview": "vite preview",
+		"start": "harperdb run .",
+		"dev": "harperdb dev .",
+		"lint": "eslint .",
+		"format": "prettier --write .",
+		"test": "node --test test/*.test.ts",
+		"test:watch": "node --watch --test test/*.test.ts",
+		"build": "vite build",
 		"deploy": "rm -Rf deploy && npm run build && mkdir deploy && mv web deploy/ && cp -R deploy-template/* deploy/ && dotenv -- npm run deploy:component && rm -Rf deploy",
 		"deploy:component": "(cd deploy && harperdb deploy_component . project=web restart=rolling replicated=true)"
 	},
 	"devDependencies": {
+		"@eslint/js": "^10.0.1",
 		"@harperfast/vite-plugin": "^0.0.1",
 		"@types/node": "^24.10.1",
 		"@types/react": "^19.2.10",
 		"@types/react-dom": "^19.2.3",
 		"@vitejs/plugin-react": "^5.1.2",
 		"dotenv-cli": "^11.0.0",
-		"harperdb": "^4.7.17",
+		"eslint": "^10.0.2",
+		"globals": "^17.4.0",
+		"harperdb": "^4.7.20",
+		"prettier": "^3.8.1",
 		"react": "^19.2.4",
 		"react-dom": "^19.2.4",
 		"typescript": "~5.9.3",

package/template-react-ts/src/App.tsx

@@ -1,12 +1,13 @@
 import reactLogo from '/react.svg';
 import typescriptLogo from '/typescript.svg';
 import viteLogo from '/vite.svg';
+import { increment } from '@/counter.ts';
 import { useCallback, useState } from 'react';
 
 export function App() {
 	const [counter, setCounter] = useState(0);
 	const countUp = useCallback(() => {
-		setCounter(counter => counter + 1);
+		setCounter((counter: number) => increment(counter));
 	}, []);
 
 	return (

package/template-react-ts/src/counter.ts

@@ -0,0 +1,7 @@
+export function increment(value: number) {
+	return value + 1;
+}
+
+export function decrement(value: number) {
+	return value - 1;
+}

package/template-react-ts/test/counter.test.ts

@@ -0,0 +1,15 @@
+import { strictEqual } from 'node:assert/strict';
+import { test } from 'node:test';
+import { decrement, increment } from '../src/counter.ts';
+
+test('increment function', () => {
+	strictEqual(increment(0), 1);
+	strictEqual(increment(1), 2);
+	strictEqual(increment(-1), 0);
+});
+
+test('decrement function', () => {
+	strictEqual(decrement(0), -1);
+	strictEqual(decrement(1), 0);
+	strictEqual(decrement(-1), -2);
+});

package/template-vanilla/eslint.config.js

@@ -0,0 +1,23 @@
+import js from '@eslint/js';
+import globals from 'globals';
+
+export default [
+	js.configs.recommended,
+	{
+		languageOptions: {
+			globals: {
+				...globals.browser,
+				...globals.node,
+			},
+			ecmaVersion: 'latest',
+			sourceType: 'module',
+		},
+		rules: {
+			'no-unused-vars': 'warn',
+			'no-console': 'off',
+		},
+	},
+	{
+		ignores: ['node_modules/'],
+	},
+];

package/template-vanilla/package.json

@@ -8,13 +8,19 @@
 		"agent:skills:update": "npx -y skills@latest add harperfast/skills --all --yes",
 		"start": "harperdb run .",
 		"dev": "harperdb dev .",
+		"lint": "eslint .",
+		"format": "prettier --write .",
+		"test": "node --test test/*.test.js",
+		"test:watch": "node --watch --test test/*.test.js",
 		"deploy": "dotenv -- npm run deploy:component",
-		"deploy:component": "harperdb deploy_component . restart=rolling replicated=true",
-		"test": "echo 'No tests implemented yet'",
-		"lint": "echo 'No lint implemented yet'"
+		"deploy:component": "harperdb deploy_component . restart=rolling replicated=true"
 	},
 	"devDependencies": {
+		"@eslint/js": "^10.0.1",
 		"dotenv-cli": "^11.0.0",
-		"harperdb": "^4.7.15"
+		"eslint": "^10.0.2",
+		"globals": "^17.4.0",
+		"harperdb": "^4.7.20",
+		"prettier": "^3.8.1"
 	}
 }

package/template-vanilla/test/counter.test.js

@@ -0,0 +1,15 @@
+import assert from 'node:assert/strict';
+import { test } from 'node:test';
+import { decrement, increment } from '../web/counter.js';
+
+test('increment function', () => {
+	assert.strictEqual(increment(0), 1);
+	assert.strictEqual(increment(1), 2);
+	assert.strictEqual(increment(-1), 0);
+});
+
+test('decrement function', () => {
+	assert.strictEqual(decrement(0), -1);
+	assert.strictEqual(decrement(1), 0);
+	assert.strictEqual(decrement(-1), -2);
+});

package/template-vanilla/web/counter.js

@@ -0,0 +1,7 @@
+export function increment(value) {
+	return value + 1;
+}
+
+export function decrement(value) {
+	return value - 1;
+}

package/template-vanilla/web/index.html

@@ -23,6 +23,6 @@
       </div>
     </main>
 
-    <script src="index.js"></script>
+    <script type="module" src="index.js"></script>
   </body>
 </html>

package/template-vanilla/web/index.js

@@ -1,3 +1,5 @@
+import { decrement, increment } from './counter.js';
+
 let count = 0;
 const counterDisplay = document.getElementById('count');
 const decrementButton = document.getElementById('decrement');
@@ -8,11 +10,11 @@ function updateDisplay() {
 }
 
 decrementButton.addEventListener('click', () => {
-	count--;
+	count = decrement(count);
 	updateDisplay();
 });
 
 incrementButton.addEventListener('click', () => {
-	count++;
+	count = increment(count);
 	updateDisplay();
 });

package/template-vanilla/web/styles.css

@@ -1,57 +1,57 @@
 body {
-  font-family: Arial, sans-serif;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100vh;
-  margin: 0;
-  background-color: #f5f5f5;
+	font-family: Arial, sans-serif;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	height: 100vh;
+	margin: 0;
+	background-color: #f5f5f5;
 }
 
 main {
-  text-align: center;
-  background-color: white;
-  padding: 2rem;
-  border-radius: 8px;
-  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+	text-align: center;
+	background-color: white;
+	padding: 2rem;
+	border-radius: 8px;
+	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
 }
 
 .count {
-  font-size: 4rem;
-  margin: 1rem 0;
-  color: #333;
+	font-size: 4rem;
+	margin: 1rem 0;
+	color: #333;
 }
 
 .counter-controls {
-  display: flex;
-  justify-content: center;
-  gap: 1rem;
+	display: flex;
+	justify-content: center;
+	gap: 1rem;
 }
 
 button {
-  font-size: 1.5rem;
-  width: 3rem;
-  height: 3rem;
-  border: none;
-  border-radius: 50%;
-  cursor: pointer;
-  transition: background-color 0.2s;
+	font-size: 1.5rem;
+	width: 3rem;
+	height: 3rem;
+	border: none;
+	border-radius: 50%;
+	cursor: pointer;
+	transition: background-color 0.2s;
 }
 
 .decrement {
-  background-color: #ff6b6b;
-  color: white;
+	background-color: #ff6b6b;
+	color: white;
 }
 
 .decrement:hover {
-  background-color: #ff5252;
+	background-color: #ff5252;
 }
 
 .increment {
-  background-color: #4ecdc4;
-  color: white;
+	background-color: #4ecdc4;
+	color: white;
 }
 
 .increment:hover {
-  background-color: #39b2a9;
+	background-color: #39b2a9;
 }

package/template-vanilla-ts/eslint.config.js

@@ -0,0 +1,23 @@
+import js from '@eslint/js';
+import globals from 'globals';
+
+export default [
+	js.configs.recommended,
+	{
+		languageOptions: {
+			globals: {
+				...globals.browser,
+				...globals.node,
+			},
+			ecmaVersion: 'latest',
+			sourceType: 'module',
+		},
+		rules: {
+			'no-unused-vars': 'warn',
+			'no-console': 'off',
+		},
+	},
+	{
+		ignores: ['node_modules/'],
+	},
+];

package/template-vanilla-ts/package.json

@@ -8,13 +8,19 @@
 		"agent:skills:update": "npx -y skills@latest add harperfast/skills --all --yes",
 		"start": "harperdb run .",
 		"dev": "harperdb dev .",
+		"lint": "eslint .",
+		"format": "prettier --write .",
+		"test": "node --test test/*.test.js",
+		"test:watch": "node --watch --test test/*.test.js",
 		"deploy": "dotenv -- npm run deploy:component",
-		"deploy:component": "harperdb deploy_component . restart=rolling replicated=true",
-		"test": "echo 'No tests implemented yet'",
-		"lint": "echo 'No lint implemented yet'"
+		"deploy:component": "harperdb deploy_component . restart=rolling replicated=true"
 	},
 	"devDependencies": {
+		"@eslint/js": "^10.0.1",
 		"dotenv-cli": "^11.0.0",
-		"harperdb": "^4.7.15"
+		"eslint": "^10.0.2",
+		"globals": "^17.4.0",
+		"harperdb": "^4.7.20",
+		"prettier": "^3.8.1"
 	}
 }

package/template-vanilla-ts/test/counter.test.js

@@ -0,0 +1,15 @@
+import assert from 'node:assert/strict';
+import { test } from 'node:test';
+import { decrement, increment } from '../web/counter.js';
+
+test('increment function', () => {
+	assert.strictEqual(increment(0), 1);
+	assert.strictEqual(increment(1), 2);
+	assert.strictEqual(increment(-1), 0);
+});
+
+test('decrement function', () => {
+	assert.strictEqual(decrement(0), -1);
+	assert.strictEqual(decrement(1), 0);
+	assert.strictEqual(decrement(-1), -2);
+});

package/template-vanilla-ts/web/counter.js

@@ -0,0 +1,7 @@
+export function increment(value) {
+	return value + 1;
+}
+
+export function decrement(value) {
+	return value - 1;
+}

package/template-vanilla-ts/web/index.html

@@ -23,6 +23,6 @@
       </div>
     </main>
 
-    <script src="index.js"></script>
+    <script type="module" src="index.js"></script>
   </body>
 </html>

package/template-vanilla-ts/web/index.js

@@ -1,3 +1,5 @@
+import { decrement, increment } from './counter.js';
+
 let count = 0;
 const counterDisplay = document.getElementById('count');
 const decrementButton = document.getElementById('decrement');
@@ -8,11 +10,11 @@ function updateDisplay() {
 }
 
 decrementButton.addEventListener('click', () => {
-	count--;
+	count = decrement(count);
 	updateDisplay();
 });
 
 incrementButton.addEventListener('click', () => {
-	count++;
+	count = increment(count);
 	updateDisplay();
 });

package/template-vanilla-ts/web/styles.css

@@ -1,57 +1,57 @@
 body {
-  font-family: Arial, sans-serif;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  height: 100vh;
-  margin: 0;
-  background-color: #f5f5f5;
+	font-family: Arial, sans-serif;
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	height: 100vh;
+	margin: 0;
+	background-color: #f5f5f5;
 }
 
 main {
-  text-align: center;
-  background-color: white;
-  padding: 2rem;
-  border-radius: 8px;
-  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
+	text-align: center;
+	background-color: white;
+	padding: 2rem;
+	border-radius: 8px;
+	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
 }
 
 .count {
-  font-size: 4rem;
-  margin: 1rem 0;
-  color: #333;
+	font-size: 4rem;
+	margin: 1rem 0;
+	color: #333;
 }
 
 .counter-controls {
-  display: flex;
-  justify-content: center;
-  gap: 1rem;
+	display: flex;
+	justify-content: center;
+	gap: 1rem;
 }
 
 button {
-  font-size: 1.5rem;
-  width: 3rem;
-  height: 3rem;
-  border: none;
-  border-radius: 50%;
-  cursor: pointer;
-  transition: background-color 0.2s;
+	font-size: 1.5rem;
+	width: 3rem;
+	height: 3rem;
+	border: none;
+	border-radius: 50%;
+	cursor: pointer;
+	transition: background-color 0.2s;
 }
 
 .decrement {
-  background-color: #ff6b6b;
-  color: white;
+	background-color: #ff6b6b;
+	color: white;
 }
 
 .decrement:hover {
-  background-color: #ff5252;
+	background-color: #ff5252;
 }
 
 .increment {
-  background-color: #4ecdc4;
-  color: white;
+	background-color: #4ecdc4;
+	color: white;
 }
 
 .increment:hover {
-  background-color: #39b2a9;
+	background-color: #39b2a9;
 }