domma-js 0.9.6-alpha → 0.9.7-alpha

package/bin/domma-cli.js

@@ -1,6 +1,6 @@
 #!/usr/bin/env node
 
-import {existsSync, mkdirSync, readdirSync, readFileSync, statSync, writeFileSync} from 'fs';
+import {existsSync, mkdirSync, readdirSync, readFileSync, statSync, writeFileSync, cpSync} from 'fs';
 import {dirname, join, relative} from 'path';
 import {fileURLToPath} from 'url';
 import * as readline from 'readline/promises';
@@ -10,24 +10,49 @@ const __filename = fileURLToPath(import.meta.url);
 const __dirname = dirname(__filename);
 
 const THEMES = [
-  'charcoal-dark',
-  'ocean-dark',
-  'forest-dark',
-  'sunset-light',
-  'silver-light',
-  'ocean-light',
-  'forest-light',
-  'sunset-dark',
-  'royal-dark',
-  'lemon-light'
+  'charcoal-dark', 'ocean-dark', 'forest-dark', 'sunset-light',
+  'silver-light', 'ocean-light', 'forest-light', 'sunset-dark',
+  'royal-dark', 'lemon-light'
 ];
 
 // Parse command-line arguments
 const args = process.argv.slice(2);
-const quickMode = args.includes('--quick');
+const command = args[0];
 
-// ASCII Art Banner
-console.log(`
+// Command routing
+// Check if first arg is a flag (starts with --)
+if (command && command.startsWith('--')) {
+  // Treat flags as init command
+  handleInit();
+} else {
+  switch (command) {
+    case 'init':
+    case undefined:
+      handleInit();
+      break;
+    case 'add':
+      handleAdd();
+      break;
+    case 'help':
+    case '--help':
+    case '-h':
+      showHelp();
+      break;
+    default:
+      console.error(`Unknown command: ${command}`);
+      showHelp();
+      process.exit(1);
+  }
+}
+
+/**
+ * Handle project initialisation
+ */
+async function handleInit() {
+  const quickMode = args.includes('--quick');
+
+  // ASCII Art Banner
+  console.log(`
 ╔═══════════════════════════════════════╗
 ║                                       ║
 ║       Welcome to Domma CLI!           ║
@@ -37,7 +62,6 @@ console.log(`
   Let's set up your project.
 `);
 
-async function main() {
   let projectName = 'my-app';
   let theme = 'charcoal-dark';
   let includeThemeSelector = false;
@@ -78,6 +102,7 @@ async function main() {
 
   // Find templates directory
   const templatesDir = join(__dirname, '..', 'templates', 'kickstart');
+  const distDir = join(__dirname, '..', 'public', 'dist');
 
   if (!existsSync(templatesDir)) {
     console.error(`\n  ✗ Error: Templates directory not found at ${templatesDir}`);
@@ -98,15 +123,180 @@ async function main() {
   // Copy all templates with variable substitution
   copyTemplatesRecursive(templatesDir, process.cwd(), vars);
 
+  // Copy Domma dist files to frontend/dist
+  const frontendDistDir = join(process.cwd(), 'frontend', 'dist');
+  console.log(`\n  Copying Domma distribution files...\n`);
+
+  if (!existsSync(frontendDistDir)) {
+    mkdirSync(frontendDistDir, {recursive: true});
+  }
+
+  // Copy required dist files
+  const distFiles = [
+    'domma.min.js',
+    'domma.css',
+    'grid.css',
+    'elements.css',
+    'syntax.css',
+    'domma-syntax.min.js'
+  ];
+
+  for (const file of distFiles) {
+    const srcPath = join(distDir, file);
+    const destPath = join(frontendDistDir, file);
+    if (existsSync(srcPath)) {
+      cpSync(srcPath, destPath);
+      console.log(`  ✓ Copied ${file}`);
+    }
+  }
+
+  // Copy themes folder
+  const themesDir = join(distDir, 'themes');
+  const destThemesDir = join(frontendDistDir, 'themes');
+  if (existsSync(themesDir)) {
+    cpSync(themesDir, destThemesDir, {recursive: true});
+    console.log(`  ✓ Copied themes/`);
+  }
+
   console.log(`\n  ✓ Done! Your project "${projectName}" is ready.\n`);
   console.log(`  Next steps:`);
-  console.log(`    1. Open index.html in your browser`);
+  console.log(`    1. Open frontend/pages/index.html in your browser`);
   console.log(`    2. Edit domma.config.json to customise`);
-  console.log(`    3. Read the docs: https://github.com/dcbw-it/domma\n`);
+  console.log(`    3. Add new pages: npx domma-js add page <name>`);
+  console.log(`    4. Read the docs: https://github.com/dcbw-it/domma\n`);
+}
+
+/**
+ * Handle 'add' sub-commands
+ */
+async function handleAdd() {
+  const subCommand = args[1];
+
+  switch (subCommand) {
+    case 'page':
+      await handleAddPage();
+      break;
+    default:
+      console.error(`Unknown add command: ${subCommand}`);
+      console.log('Usage: npx domma-js add page <name>');
+      process.exit(1);
+  }
+}
+
+/**
+ * Handle adding a new page
+ */
+async function handleAddPage() {
+  const quickMode = args.includes('--quick');
+  let pageName = args[2];
+
+  // Check if we're in a Domma project
+  const configPath = join(process.cwd(), 'domma.config.json');
+  if (!existsSync(configPath)) {
+    console.error('\n  ✗ Error: Not in a Domma project directory');
+    console.error('  Run this command from your project root (where domma.config.json is located)\n');
+    process.exit(1);
+  }
+
+  if (!pageName && quickMode) {
+    console.error('Page name required with --quick flag');
+    console.log('Usage: npx domma-js add page <name> --quick');
+    process.exit(1);
+  }
+
+  if (!quickMode) {
+    const rl = readline.createInterface({input, output});
+
+    if (!pageName) {
+      const nameAnswer = await rl.question('  Page name: ');
+      pageName = nameAnswer.trim();
+    }
+
+    if (!pageName) {
+      console.error('  ✗ Page name is required');
+      rl.close();
+      process.exit(1);
+    }
+
+    rl.close();
+  }
+
+  // Validate and sanitize page name
+  pageName = pageName.toLowerCase().replace(/[^a-z0-9-]/g, '-');
+
+  // Create page
+  createPage(pageName);
+}
+
+/**
+ * Create a new page from template
+ */
+function createPage(pageName) {
+  const pagesDir = join(process.cwd(), 'frontend', 'pages', pageName);
+
+  if (existsSync(pagesDir)) {
+    console.error(`\n  ✗ Page "${pageName}" already exists`);
+    process.exit(1);
+  }
+
+  // Create directory
+  mkdirSync(pagesDir, {recursive: true});
+
+  // Get templates
+  const pageTemplateDir = join(__dirname, '..', 'templates', 'page-template');
+
+  if (!existsSync(pageTemplateDir)) {
+    console.error(`\n  ✗ Error: Page template not found at ${pageTemplateDir}`);
+    process.exit(1);
+  }
+
+  // Read templates
+  const htmlTemplate = readFileSync(join(pageTemplateDir, 'page.html'), 'utf-8');
+  const jsTemplate = readFileSync(join(pageTemplateDir, 'page.js'), 'utf-8');
+
+  // Get project config for theme
+  let theme = 'charcoal-dark';
+  const configPath = join(process.cwd(), 'domma.config.json');
+  if (existsSync(configPath)) {
+    try {
+      const config = JSON.parse(readFileSync(configPath, 'utf-8'));
+      theme = config.theme?.default || theme;
+    } catch (e) {
+      // Use default theme
+    }
+  }
+
+  // Variable substitution
+  const titleCase = pageName.split('-').map(w =>
+    w.charAt(0).toUpperCase() + w.slice(1)
+  ).join(' ');
+
+  const vars = {
+    '{{pageName}}': pageName,
+    '{{pageTitle}}': titleCase,
+    '{{theme}}': theme
+  };
+
+  let html = htmlTemplate;
+  let js = jsTemplate;
+
+  for (const [key, value] of Object.entries(vars)) {
+    html = html.replaceAll(key, value);
+    js = js.replaceAll(key, value);
+  }
+
+  // Write files
+  writeFileSync(join(pagesDir, 'index.html'), html);
+  writeFileSync(join(pagesDir, `${pageName}.js`), js);
+
+  console.log(`\n  ✓ Page created: frontend/pages/${pageName}/`);
+  console.log(`    - index.html`);
+  console.log(`    - ${pageName}.js\n`);
+  console.log(`  Don't forget to add it to your navbar in domma.config.json!\n`);
 }
 
 /**
- * Recursively copy templates with variable substitution
+ * Copy templates recursively with variable substitution
  */
 function copyTemplatesRecursive(srcDir, destDir, vars) {
   const items = readdirSync(srcDir);
@@ -138,7 +328,26 @@ function copyTemplatesRecursive(srcDir, destDir, vars) {
   }
 }
 
-main().catch((error) => {
-  console.error(`\n  ✗ Error: ${error.message}`);
-  process.exit(1);
-});
+/**
+ * Show help information
+ */
+function showHelp() {
+  console.log(`
+Domma CLI - Project scaffolding and management
+
+Commands:
+  npx domma-js              Initialize a new Domma project
+  npx domma-js init         Initialize a new Domma project
+  npx domma-js add page <name>  Add a new page
+    --quick                 Skip interactive prompts
+
+Options:
+  --help, -h               Show this help message
+
+Examples:
+  npx domma-js                     # Interactive project setup
+  npx domma-js --quick             # Quick project setup with defaults
+  npx domma-js add page dashboard  # Add a dashboard page (interactive)
+  npx domma-js add page faq --quick  # Add FAQ page (non-interactive)
+`);
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "domma-js",
-  "version": "0.9.6-alpha",
+  "version": "0.9.7-alpha",
   "description": "Dynamic Object Manipulation & Modeling API - A complete front-end toolkit.",
   "main": "public/dist/domma.min.js",
   "module": "public/dist/domma.esm.js",

package/public/dist/domma-syntax.min.js

@@ -1,8 +1,8 @@
 /*!
- * Domma Syntax Highlighter v0.9.5-alpha
+ * Domma Syntax Highlighter v0.9.6-alpha
  * Lightweight code syntax highlighting for JavaScript, HTML, and CSS
  * (c) 2026 Darryl Waterhouse & DCBW-IT
- * Built: 2026-01-16T09:03:27.082Z
- * Commit: 72d7b45
+ * Built: 2026-01-16T11:22:47.592Z
+ * Commit: 90ec825
  */
 !function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).DommaSyntax={})}(this,function(t){"use strict";const e={javascript:[{type:"comment",pattern:/\/\*[\s\S]*?\*\//g},{type:"comment",pattern:/\/\/.*/g},{type:"template-string",pattern:/`(?:\\.|[^`\\])*`/g},{type:"string",pattern:/"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'/g},{type:"keyword",pattern:/\b(const|let|var|function|return|if|else|for|while|do|break|continue|switch|case|default|try|catch|finally|throw|async|await|class|extends|static|new|this|super|import|export|from|as|default|yield|typeof|instanceof|in|of|delete|void)\b/g},{type:"boolean",pattern:/\b(true|false|null|undefined|NaN|Infinity)\b/g},{type:"number",pattern:/\b\d+\.?\d*([eE][+-]?\d+)?\b/g},{type:"function",pattern:/\b([a-zA-Z_$][\w$]*)\s*(?=\()/g},{type:"class-name",pattern:/\b[A-Z][\w$]*\b/g},{type:"operator",pattern:/[+\-*/%=<>!&|^~?:]+|===|!==|==|!=|<=|>=|&&|\|\||<<|>>|>>>/g},{type:"punctuation",pattern:/[{}[\]();,.]/g}],html:[{type:"comment",pattern:/<!--[\s\S]*?-->/g},{type:"doctype",pattern:/<!DOCTYPE[^>]*>/gi},{type:"tag-open",pattern:/<\/?[a-zA-Z][\w-]*/g},{type:"tag-close",pattern:/\/?>/g},{type:"attr-name",pattern:/\s+[a-zA-Z:@][\w:.-]*(?=\s*=)/g},{type:"attr-value",pattern:/=\s*"[^"]*"|=\s*'[^']*'/g},{type:"entity",pattern:/&[#\w]+;/g}],css:[{type:"comment",pattern:/\/\*[\s\S]*?\*\//g},{type:"at-rule",pattern:/@[\w-]+/g},{type:"selector",pattern:/[.#]?[a-zA-Z][\w-]*(?=\s*[{,])/g},{type:"property",pattern:/\b[\w-]+(?=\s*:)/g},{type:"string",pattern:/"(?:\\.|[^"\\])*"|'(?:\\.|[^'\\])*'/g},{type:"function",pattern:/\b[\w-]+(?=\()/g},{type:"important",pattern:/!important\b/g},{type:"number",pattern:/\b\d+\.?\d*(px|em|rem|%|vh|vw|pt|cm|mm|in|pc|ex|ch|vmin|vmax|fr)?\b/g},{type:"color",pattern:/#[\da-fA-F]{3,8}\b/g},{type:"punctuation",pattern:/[{}:;,()]/g}]};function n(t){const e={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#39;"};return t.replace(/[&<>"']/g,t=>e[t])}class a{constructor(){this.config={autoDetect:!0,preserveOriginal:!0,selector:".code-block",showLanguageBadge:!1,languagePrefix:"language-"}}highlight(t,a=null){const r="string"==typeof t?document.querySelector(t):t;if(!r||r.hasAttribute("data-syntax-highlighted"))return!1;if(!a&&this.config.autoDetect){const t=Array.from(r.classList).find(t=>t.startsWith(this.config.languagePrefix));t&&(a=t.substring(this.config.languagePrefix.length))}if(!a||!e[a])return!1;const o=r.textContent||"";this.config.preserveOriginal&&r.setAttribute("data-original-code",o);const i=function(t,a){const r=e[a];if(!r)return n(t);const o=[];for(const{type:e,pattern:n}of r){if("html"===a&&"entity"===e)continue;let r;for(n.lastIndex=0;null!==(r=n.exec(t));)o.push({start:r.index,end:r.index+r[0].length,text:r[0],type:e})}o.sort((t,e)=>t.start-e.start);const i=[];let s=0;for(const t of o)t.start>=s&&(i.push(t),s=t.end);let c="",p=0;for(const e of i)e.start>p&&(c+=n(t.substring(p,e.start))),c+=`<span class="syntax-${e.type}">${n(e.text)}</span>`,p=e.end;return p<t.length&&(c+=n(t.substring(p))),c}(o,a);return r.innerHTML=i,r.setAttribute("data-syntax-highlighted","true"),r.setAttribute("data-language",a),this.config.showLanguageBadge&&this.addLanguageBadge(r,a),!0}scan(t={}){const e=t.selector||this.config.selector,n=document.querySelectorAll(e);let a=0;return n.forEach(e=>{this.highlight(e,t.language||null)&&(this.addCopyButton(e),a++)}),a}register(t,n){t&&Array.isArray(n)?e[t]=n:console.error("SyntaxHighlighter: Invalid language registration")}configure(t){return t?(Object.assign(this.config,t),this.config):{...this.config}}addLanguageBadge(t,e){if(t.querySelector(".syntax-language-badge"))return;const n=document.createElement("div");n.className="syntax-language-badge",n.textContent=e.toUpperCase(),t.style.position="relative",t.insertBefore(n,t.firstChild)}getLanguages(){return Object.keys(e)}isLanguageSupported(t){return t in e}addCopyButton(t){if(t.parentElement&&t.parentElement.classList.contains("code-block-wrapper"))return;const e=document.createElement("div");e.className="code-block-wrapper";const n=document.createElement("button");n.className="code-block-copy",n.setAttribute("aria-label","Copy code to clipboard"),n.innerHTML='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>',n.addEventListener("click",async()=>{const e=t.getAttribute("data-original-code")||t.textContent;try{if(navigator.clipboard&&navigator.clipboard.writeText)await navigator.clipboard.writeText(e);else{const t=document.createElement("textarea");t.value=e,t.style.position="fixed",t.style.opacity="0",document.body.appendChild(t),t.select(),document.execCommand("copy"),document.body.removeChild(t)}n.classList.add("copied"),n.innerHTML='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"></polyline></svg>',setTimeout(()=>{n.classList.remove("copied"),n.innerHTML='<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect><path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path></svg>'},2e3)}catch(t){console.error("Failed to copy code:",t)}}),t.parentNode.insertBefore(e,t),e.appendChild(t),e.appendChild(n)}}const r=new a;"undefined"!=typeof document&&("loading"===document.readyState?document.addEventListener("DOMContentLoaded",()=>{r.scan()}):setTimeout(()=>r.scan(),0)),"undefined"!=typeof window&&(window.Domma&&(window.Domma.syntax=r),window.DommaSyntax=r),t.LANGUAGES=e,t.SyntaxHighlighter=a,t.default=r,t.syntax=r,Object.defineProperty(t,"__esModule",{value:!0})});

package/public/dist/domma.css

@@ -1,9 +1,9 @@
 /*!
- * Domma Core CSS v0.9.5-alpha
+ * Domma Core CSS v0.9.6-alpha
  * Dynamic Object Manipulation & Modeling API
  * (c) 2026 Darryl Waterhouse & DCBW-IT
- * Built: 2026-01-16T09:03:57.612Z
- * Commit: 72d7b45
+ * Built: 2026-01-16T11:23:01.056Z
+ * Commit: 90ec825
  */
 
 /**