this.gui 1.2.15 → 1.2.16

package/bin/cli.ts

@@ -0,0 +1,53 @@
+#!/usr/bin/env node
+
+/**
+ * This.GUI CLI (ESM version)
+ *
+ * Usage:
+ *   npx this.gui my-app
+ *
+ * This runs in native ESM mode.
+ */
+
+import { execSync } from "node:child_process";
+import fsExtra from "fs-extra";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const args = process.argv.slice(2);
+if (args.includes("--help") || args.includes("-h")) {
+  console.log(`This.GUI CLI
+
+Usage:
+  npx this.gui <project-name>
+
+Examples:
+  npx this.gui my-app
+`);
+  process.exit(0);
+}
+const appName = args[0] || "my-app";
+const distTemplateDir = path.resolve(__dirname, "../templates");
+const srcTemplateDir = path.resolve(__dirname, "../../templates");
+const templateDir = fsExtra.existsSync(distTemplateDir)
+  ? distTemplateDir
+  : srcTemplateDir;
+const targetDir = path.resolve(process.cwd(), appName);
+console.log(`\n🧩 Creating .GUI project: ${appName}\n`);
+
+try {
+  if (!fsExtra.existsSync(templateDir)) {
+    throw new Error(`Template directory not found at: ${templateDir}`);
+  }
+  fsExtra.copySync(templateDir, targetDir);
+  console.log(`📁 Project files copied to ${targetDir}`);
+  process.chdir(targetDir);
+  console.log(`📦 Installing dependencies...\n`);
+  execSync("npm install", { stdio: "inherit" });
+  console.log(`\n✅ Done!\n`);
+  console.log(`Next steps:\n  cd ${appName}\n  npm run storybook\n`);
+} catch (error) {
+  console.error("❌ Error creating project:", error);
+  process.exit(1);
+}

package/dist/bin/cli.d.ts

@@ -0,0 +1,10 @@
+#!/usr/bin/env node
+/**
+ * This.GUI CLI (ESM version)
+ *
+ * Usage:
+ *   npx this.gui my-app
+ *
+ * This runs in native ESM mode.
+ */
+export {};

package/dist/bin/cli.js

@@ -1,38 +1,51 @@
 #!/usr/bin/env node
-'use strict';
-
-var child_process = require('child_process');
-var fsExtra = require('fs-extra');
-var path = require('path');
-var url = require('url');
-
-var _documentCurrentScript = typeof document !== 'undefined' ? document.currentScript : null;
 /**
- * This.GUI CLI (TypeScript)
- * 
- * Initializes a new This.GUI project using:
- * 
- *   npx thisgui my-app
- * 
- * Compiles to dist/bin/cli.js when the package is built.
+ * This.GUI CLI (ESM version)
+ *
+ * Usage:
+ *   npx this.gui my-app
+ *
+ * This runs in native ESM mode.
  */
+import { execSync } from "node:child_process";
+import fsExtra from "fs-extra";
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+const args = process.argv.slice(2);
+if (args.includes("--help") || args.includes("-h")) {
+    console.log(`This.GUI CLI
+
+Usage:
+  npx this.gui <project-name>
 
-const { copySync } = fsExtra;
-const __filename$1 = url.fileURLToPath((typeof document === 'undefined' ? require('u' + 'rl').pathToFileURL(__filename).href : (_documentCurrentScript && _documentCurrentScript.tagName.toUpperCase() === 'SCRIPT' && _documentCurrentScript.src || new URL('cli.js', document.baseURI).href)));
-const __dirname$1 = path.dirname(__filename$1);
-const appName = process.argv[2] || 'my-app';
-const templateDir = path.resolve(__dirname$1, '../templates');
+Examples:
+  npx this.gui my-app
+`);
+    process.exit(0);
+}
+const appName = args[0] || "my-app";
+const distTemplateDir = path.resolve(__dirname, "../templates");
+const srcTemplateDir = path.resolve(__dirname, "../../templates");
+const templateDir = fsExtra.existsSync(distTemplateDir)
+    ? distTemplateDir
+    : srcTemplateDir;
 const targetDir = path.resolve(process.cwd(), appName);
 console.log(`\n🧩 Creating .GUI project: ${appName}\n`);
 try {
-  copySync(templateDir, targetDir);
-  console.log(`📁 Project files copied to ${targetDir}`);
-  process.chdir(targetDir);
-  console.log(`📦 Installing dependencies...\n`);
-  child_process.execSync('npm install', { stdio: 'inherit' });
-  console.log(`\n✅ Done!\n`);
-  console.log(`Next steps:\n  cd ${appName}\n  npm run storybook\n`);
-} catch (error) {
-  console.error('❌ Error creating project:', error);
-  process.exit(1);
+    if (!fsExtra.existsSync(templateDir)) {
+        throw new Error(`Template directory not found at: ${templateDir}`);
+    }
+    fsExtra.copySync(templateDir, targetDir);
+    console.log(`📁 Project files copied to ${targetDir}`);
+    process.chdir(targetDir);
+    console.log(`📦 Installing dependencies...\n`);
+    execSync("npm install", { stdio: "inherit" });
+    console.log(`\n✅ Done!\n`);
+    console.log(`Next steps:\n  cd ${appName}\n  npm run storybook\n`);
+}
+catch (error) {
+    console.error("❌ Error creating project:", error);
+    process.exit(1);
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "this.gui",
   "private": false,
-  "version": "1.2.15",
+  "version": "1.2.16",
   "type": "module",
   "main": "dist/this-gui.umd.js",
   "module": "dist/this-gui.es.js",
@@ -14,11 +14,11 @@
     }
   },
   "bin": {
-    "gui": "./dist/bin/cli.cjs"
+    "gui": "./dist/bin/cli.ts"
   },
   "scripts": {
-    "build": "vite build && node -e \"import('./vite.config.js').then(m => m.buildFinished())\"",
-    "lint": "eslint .",
+    "build": "vite build && npm run build:cli",
+    "build:cli": "tsc --project tsconfig.cli.json",
     "dev": "vite",
     "dev:lib": "vite build --watch",
     "preview": "vite preview",

package/templates/index.html

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'><circle cx='32' cy='32' r='32' fill='%23006688'/><text x='50%' y='54%' text-anchor='middle' font-size='28' font-family='sans-serif' fill='white'>GUI</text></svg>" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>This.GUI Demo</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="/src/main.tsx"></script>
+  </body>
+</html>

package/templates/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "thisgui-demo",
+  "private": true,
+  "version": "0.0.0",
+  "type": "module",
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc --noEmit && vite build",
+    "preview": "vite preview",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "dependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "this.gui": "latest"
+  },
+  "devDependencies": {
+    "@storybook/addon-essentials": "^8.2.0",
+    "@storybook/react-vite": "^8.2.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "@vitejs/plugin-react": "^5.0.0",
+    "storybook": "^8.2.0",
+    "typescript": "^5.9.0",
+    "vite": "^6.0.0"
+  }
+}

package/templates/vite.config.ts

@@ -0,0 +1,11 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+
+export default defineConfig({
+  plugins: [react()],
+  resolve: {
+    alias: {
+      '@': '/src'
+    }
+  }
+});

package/tsconfig.cli.json

@@ -0,0 +1,9 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "module": "ES2022",
+    "target": "ES2022",
+    "outDir": "dist/bin"
+  },
+  "include": ["bin/**/*.ts"]
+}

package/bin/cli.cjs

@@ -1,30 +0,0 @@
-#!/usr/bin/env node
-/**
- * This.GUI CLI (TypeScript)
- * 
- * Initializes a new This.GUI project using:
- * 
- *   npx thisgui my-app
- * 
- * Compiles to dist/bin/cli.js when the package is built.
- */
-const { execSync } = require('child_process');
-const fsExtra = require('fs-extra');
-const { copySync } = fsExtra;
-const path = require('path');
-const appName = process.argv[2] || 'my-app';
-const templateDir = path.resolve(__dirname, '../templates');
-const targetDir = path.resolve(process.cwd(), appName);
-console.log(`\n🧩 Creating .GUI project: ${appName}\n`);
-try {
-  copySync(templateDir, targetDir);
-  console.log(`📁 Project files copied to ${targetDir}`);
-  process.chdir(targetDir);
-  console.log(`📦 Installing dependencies...\n`);
-  execSync('npm install', { stdio: 'inherit' });
-  console.log(`\n✅ Done!\n`);
-  console.log(`Next steps:\n  cd ${appName}\n  npm run storybook\n`);
-} catch (error) {
-  console.error('❌ Error creating project:', error);
-  process.exit(1);
-}