juxscript 1.1.55 → 1.1.57

package/lib/utils/codeparser.d.ts

@@ -8,7 +8,7 @@ export interface ParsedLine {
  */
 declare function escapeHtml(text: string): string;
 /**
- * Parse code into lines with simple syntax highlighting
+ * Parse code into lines - CHARACTER-BY-CHARACTER TOKENIZATION
  */
 export declare function parseCode(code: string, language?: string): ParsedLine[];
 /**

package/lib/utils/codeparser.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"codeparser.d.ts","sourceRoot":"","sources":["codeparser.ts"],"names":[],"mappings":"AAaA,MAAM,WAAW,UAAU;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,iBAAS,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAOxC;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,GAAE,MAAqB,GAAG,UAAU,EAAE,CAQrF;AAuCD;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,UAAU,GAAG,MAAM,CAEnE;AAED;;GAEG;AACH,wBAAgB,qBAAqB,IAAI,MAAM,CA8D9C;;;;;;;AAED,wBAKE"}
+{"version":3,"file":"codeparser.d.ts","sourceRoot":"","sources":["codeparser.ts"],"names":[],"mappings":"AAeA,MAAM,WAAW,UAAU;IACvB,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,GAAG,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,iBAAS,UAAU,CAAC,IAAI,EAAE,MAAM,GAAG,MAAM,CAOxC;AAED;;GAEG;AACH,wBAAgB,SAAS,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,GAAE,MAAqB,GAAG,UAAU,EAAE,CAQrF;AAuFD;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,UAAU,GAAG,MAAM,CAEnE;AAED;;GAEG;AACH,wBAAgB,qBAAqB,IAAI,MAAM,CAiE9C;;;;;;;AAED,wBAKE"}

package/lib/utils/codeparser.js

@@ -8,7 +8,9 @@ const KEYWORDS = new Set([
     'let', 'new', 'return', 'super', 'switch', 'this', 'throw', 'try',
     'typeof', 'var', 'void', 'while', 'with', 'yield', 'from', 'of',
     'static', 'get', 'set', 'as', 'interface', 'type', 'enum', 'namespace',
-    'jux', 'state', 'registry', 'render', 'bind', 'sync'
+    'jux', 'state', 'registry', 'render', 'bind', 'sync', ';', '=', '==', '===',
+    '!=', '!==', '+', '-', '*', '/', '%', '++', '--', '&&', '||', '!', '<', '>',
+    '<=', '>=', '=>', '...', '.', ',', '(', ')', '{', '}', '[', ']', ':', '?'
 ]);
 /**
  * Escape HTML entities
@@ -22,47 +24,90 @@ function escapeHtml(text) {
         .replace(/'/g, '&#39;');
 }
 /**
- * Parse code into lines with simple syntax highlighting
+ * Parse code into lines - CHARACTER-BY-CHARACTER TOKENIZATION
  */
 export function parseCode(code, language = 'javascript') {
     const lines = code.split('\n');
     return lines.map((line, index) => ({
         lineNumber: index + 1,
-        html: highlightLine(line),
+        html: tokenizeLine(line),
         raw: line
     }));
 }
 /**
- * Highlight a single line - token-by-token approach to avoid nested spans
+ * Tokenize a single line character-by-character
  */
-function highlightLine(line) {
+function tokenizeLine(line) {
     if (!line.trim())
         return ' ';
-    // ✅ Split line into tokens (words, operators, whitespace)
-    const tokens = line.match(/\w+|[^\w\s]|\s+/g) || [];
     let result = '';
-    tokens.forEach(token => {
-        // Skip empty tokens
-        if (!token)
-            return;
-        // Whitespace - preserve as-is
-        if (/^\s+$/.test(token)) {
-            result += token;
-            return;
+    let i = 0;
+    const len = line.length;
+    while (i < len) {
+        const char = line[i];
+        // Whitespace - preserve
+        if (/\s/.test(char)) {
+            result += char;
+            i++;
+            continue;
         }
-        // Escape the token
-        const escaped = escapeHtml(token);
-        // Keywords
-        if (KEYWORDS.has(token)) {
-            result += `<span class="token-keyword">${escaped}</span>`;
+        // Word (identifier or keyword)
+        if (/[a-zA-Z_$]/.test(char)) {
+            const word = consumeWord(line, i);
+            const escaped = escapeHtml(word);
+            if (KEYWORDS.has(word)) {
+                result += `<span class="token-keyword">${escaped}</span>`;
+            }
+            else {
+                result += escaped;
+            }
+            i += word.length;
+            continue;
         }
-        // Everything else - plain text
-        else {
-            result += escaped;
+        // Number
+        if (/\d/.test(char)) {
+            const num = consumeNumber(line, i);
+            result += `<span class="token-number">${escapeHtml(num)}</span>`;
+            i += num.length;
+            continue;
         }
-    });
+        // Everything else - just escape and append
+        result += escapeHtml(char);
+        i++;
+    }
     return result || ' ';
 }
+/**
+ * Consume a complete word (identifier)
+ */
+function consumeWord(line, start) {
+    let i = start;
+    while (i < line.length && /[a-zA-Z0-9_$]/.test(line[i])) {
+        i++;
+    }
+    return line.substring(start, i);
+}
+/**
+ * Consume a complete number
+ */
+function consumeNumber(line, start) {
+    let i = start;
+    let hasDot = false;
+    while (i < line.length) {
+        const char = line[i];
+        if (/\d/.test(char)) {
+            i++;
+        }
+        else if (char === '.' && !hasDot) {
+            hasDot = true;
+            i++;
+        }
+        else {
+            break;
+        }
+    }
+    return line.substring(start, i);
+}
 /**
  * Render a parsed line
  */
@@ -74,7 +119,7 @@ export function renderLineWithTokens(parsedLine) {
  */
 export function getSyntaxHighlightCSS() {
     return `
-/* Simple Syntax Highlighting */
+/* Simple Code Highlighting */
 .jux-code {
     font-family: 'Fira Code', 'Consolas', 'Monaco', monospace;
     font-size: 14px;
@@ -128,10 +173,13 @@ export function getSyntaxHighlightCSS() {
     display: none;
 }
 
-/* Token colors - JUST KEYWORDS */
+/* Token colors */
 .token-keyword { 
     color: #c678dd; 
     font-weight: 600; 
+}
+.token-number {
+    color: #d19a66;
 }
   `;
 }

package/lib/utils/codeparser.ts

@@ -8,7 +8,9 @@ const KEYWORDS = new Set([
     'let', 'new', 'return', 'super', 'switch', 'this', 'throw', 'try',
     'typeof', 'var', 'void', 'while', 'with', 'yield', 'from', 'of',
     'static', 'get', 'set', 'as', 'interface', 'type', 'enum', 'namespace',
-    'jux', 'state', 'registry', 'render', 'bind', 'sync'
+    'jux', 'state', 'registry', 'render', 'bind', 'sync', ';', '=', '==', '===',
+    '!=', '!==', '+', '-', '*', '/', '%', '++', '--', '&&', '||', '!', '<', '>',
+    '<=', '>=', '=>', '...', '.', ',', '(', ')', '{', '}', '[', ']', ':', '?'
 ]);
 
 export interface ParsedLine {
@@ -30,55 +32,103 @@ function escapeHtml(text: string): string {
 }
 
 /**
- * Parse code into lines with simple syntax highlighting
+ * Parse code into lines - CHARACTER-BY-CHARACTER TOKENIZATION
  */
 export function parseCode(code: string, language: string = 'javascript'): ParsedLine[] {
     const lines = code.split('\n');
 
     return lines.map((line, index) => ({
         lineNumber: index + 1,
-        html: highlightLine(line),
+        html: tokenizeLine(line),
         raw: line
     }));
 }
 
 /**
- * Highlight a single line - token-by-token approach to avoid nested spans
+ * Tokenize a single line character-by-character
  */
-function highlightLine(line: string): string {
+function tokenizeLine(line: string): string {
     if (!line.trim()) return ' ';
 
-    // ✅ Split line into tokens (words, operators, whitespace)
-    const tokens = line.match(/\w+|[^\w\s]|\s+/g) || [];
-
     let result = '';
+    let i = 0;
+    const len = line.length;
 
-    tokens.forEach(token => {
-        // Skip empty tokens
-        if (!token) return;
+    while (i < len) {
+        const char = line[i];
 
-        // Whitespace - preserve as-is
-        if (/^\s+$/.test(token)) {
-            result += token;
-            return;
+        // Whitespace - preserve
+        if (/\s/.test(char)) {
+            result += char;
+            i++;
+            continue;
         }
 
-        // Escape the token
-        const escaped = escapeHtml(token);
+        // Word (identifier or keyword)
+        if (/[a-zA-Z_$]/.test(char)) {
+            const word = consumeWord(line, i);
+            const escaped = escapeHtml(word);
+
+            if (KEYWORDS.has(word)) {
+                result += `<span class="token-keyword">${escaped}</span>`;
+            } else {
+                result += escaped;
+            }
 
-        // Keywords
-        if (KEYWORDS.has(token)) {
-            result += `<span class="token-keyword">${escaped}</span>`;
+            i += word.length;
+            continue;
         }
-        // Everything else - plain text
-        else {
-            result += escaped;
+
+        // Number
+        if (/\d/.test(char)) {
+            const num = consumeNumber(line, i);
+            result += `<span class="token-number">${escapeHtml(num)}</span>`;
+            i += num.length;
+            continue;
         }
-    });
+
+        // Everything else - just escape and append
+        result += escapeHtml(char);
+        i++;
+    }
 
     return result || ' ';
 }
 
+/**
+ * Consume a complete word (identifier)
+ */
+function consumeWord(line: string, start: number): string {
+    let i = start;
+    while (i < line.length && /[a-zA-Z0-9_$]/.test(line[i])) {
+        i++;
+    }
+    return line.substring(start, i);
+}
+
+/**
+ * Consume a complete number
+ */
+function consumeNumber(line: string, start: number): string {
+    let i = start;
+    let hasDot = false;
+
+    while (i < line.length) {
+        const char = line[i];
+
+        if (/\d/.test(char)) {
+            i++;
+        } else if (char === '.' && !hasDot) {
+            hasDot = true;
+            i++;
+        } else {
+            break;
+        }
+    }
+
+    return line.substring(start, i);
+}
+
 /**
  * Render a parsed line
  */
@@ -91,7 +141,7 @@ export function renderLineWithTokens(parsedLine: ParsedLine): string {
  */
 export function getSyntaxHighlightCSS(): string {
     return `
-/* Simple Syntax Highlighting */
+/* Simple Code Highlighting */
 .jux-code {
     font-family: 'Fira Code', 'Consolas', 'Monaco', monospace;
     font-size: 14px;
@@ -145,10 +195,13 @@ export function getSyntaxHighlightCSS(): string {
     display: none;
 }
 
-/* Token colors - JUST KEYWORDS */
+/* Token colors */
 .token-keyword { 
     color: #c678dd; 
     font-weight: 600; 
+}
+.token-number {
+    color: #d19a66;
 }
   `;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "juxscript",
-  "version": "1.1.55",
+  "version": "1.1.57",
   "type": "module",
   "description": "A JavaScript UX authorship platform",
   "main": "index.js",