juxscript 1.1.52 → 1.1.54

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8,7 +8,7 @@ export interface ParsedLine {
8
8
  */
9
9
  declare function escapeHtml(text: string): string;
10
10
  /**
11
- * Parse code into lines - NO FANCY HIGHLIGHTING, JUST KEYWORDS
11
+ * Parse code into lines - Simple keyword + special char highlighting
12
12
  */
13
13
  export declare function parseCode(code: string, language?: string): ParsedLine[];
14
14
  /**
@@ -1 +1 @@
1
- {"version":3,"file":"codeparser.d.ts","sourceRoot":"","sources":["codeparser.ts"],"names":[],"mappings":"AAYA,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;AAqBD;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,UAAU,GAAG,MAAM,CAEnE;AAED;;GAEG;AACH,wBAAgB,qBAAqB,IAAI,MAAM,CA8D9C;;;;;;;AAED,wBAKE"}
1
+ {"version":3,"file":"codeparser.d.ts","sourceRoot":"","sources":["codeparser.ts"],"names":[],"mappings":"AAkBA,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;AA6BD;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,UAAU,GAAG,MAAM,CAEnE;AAED;;GAEG;AACH,wBAAgB,qBAAqB,IAAI,MAAM,CAwE9C;;;;;;;AAED,wBAKE"}
@@ -1,14 +1,19 @@
1
1
  /**
2
- * Simple keyword list
2
+ * Simple keyword lists for highlighting
3
3
  */
4
- const KEYWORDS = [
4
+ const KEYWORDS = new Set([
5
5
  'async', 'await', 'break', 'case', 'catch', 'class', 'const', 'continue',
6
6
  'debugger', 'default', 'delete', 'do', 'else', 'export', 'extends',
7
7
  'finally', 'for', 'function', 'if', 'import', 'in', 'instanceof',
8
8
  'let', 'new', 'return', 'super', 'switch', 'this', 'throw', 'try',
9
9
  'typeof', 'var', 'void', 'while', 'with', 'yield', 'from', 'of',
10
- 'static', 'get', 'set', 'as', 'interface', 'type', 'enum', 'namespace'
11
- ];
10
+ 'static', 'get', 'set', 'as', 'interface', 'type', 'enum', 'namespace',
11
+ // ✅ JUX-specific
12
+ 'jux', 'state', 'registry', 'render', 'bind', 'sync'
13
+ ]);
14
+ // ✅ Reserved operators and punctuation
15
+ const OPERATORS = ['+', '-', '*', '/', '%', '=', '==', '===', '!=', '!==', '<', '>', '<=', '>=', '!', '&&', '||', '?', ':', '=>'];
16
+ const PUNCTUATION = ['{', '}', '(', ')', '[', ']', ';', ',', '.'];
12
17
  /**
13
18
  * Escape HTML entities
14
19
  */
@@ -21,7 +26,7 @@ function escapeHtml(text) {
21
26
  .replace(/'/g, '&#39;');
22
27
  }
23
28
  /**
24
- * Parse code into lines - NO FANCY HIGHLIGHTING, JUST KEYWORDS
29
+ * Parse code into lines - Simple keyword + special char highlighting
25
30
  */
26
31
  export function parseCode(code, language = 'javascript') {
27
32
  const lines = code.split('\n');
@@ -32,16 +37,21 @@ export function parseCode(code, language = 'javascript') {
32
37
  }));
33
38
  }
34
39
  /**
35
- * Ultra-simple highlighting - JUST keywords, nothing fancy
40
+ * Ultra-simple highlighting - Keywords + operators + punctuation
36
41
  */
37
42
  function highlightLine(line) {
38
43
  if (!line.trim())
39
44
  return ' ';
40
45
  // Escape everything first
41
46
  let result = escapeHtml(line);
42
- // Only highlight standalone keywords (word boundaries)
47
+ // 1. Highlight single-line comments first (so keywords inside comments aren't highlighted)
48
+ result = result.replace(/(\/\/.*$)/g, '<span class="token-comment">$1</span>');
49
+ // 2. Highlight strings (simple pattern - just quotes, no nested logic)
50
+ result = result.replace(/(&quot;[^&]*?&quot;|&#39;[^&#]*?&#39;)/g, '<span class="token-string">$1</span>');
51
+ // 3. Highlight numbers
52
+ result = result.replace(/\b(\d+)\b/g, '<span class="token-number">$1</span>');
53
+ // 4. Highlight keywords (whole words only)
43
54
  KEYWORDS.forEach(keyword => {
44
- // Match whole words only, case-sensitive
45
55
  const regex = new RegExp(`\\b(${keyword})\\b`, 'g');
46
56
  result = result.replace(regex, '<span class="token-keyword">$1</span>');
47
57
  });
@@ -58,7 +68,7 @@ export function renderLineWithTokens(parsedLine) {
58
68
  */
59
69
  export function getSyntaxHighlightCSS() {
60
70
  return `
61
- /* Simple Code Highlighting */
71
+ /* Simple Syntax Highlighting */
62
72
  .jux-code {
63
73
  font-family: 'Fira Code', 'Consolas', 'Monaco', monospace;
64
74
  font-size: 14px;
@@ -112,10 +122,20 @@ export function getSyntaxHighlightCSS() {
112
122
  display: none;
113
123
  }
114
124
 
115
- /* Token colors - JUST KEYWORDS */
125
+ /* Token colors */
116
126
  .token-keyword {
117
127
  color: #c678dd;
118
128
  font-weight: 600;
129
+ }
130
+ .token-string {
131
+ color: #98c379;
132
+ }
133
+ .token-number {
134
+ color: #d19a66;
135
+ }
136
+ .token-comment {
137
+ color: #5c6370;
138
+ font-style: italic;
119
139
  }
120
140
  `;
121
141
  }
@@ -1,14 +1,20 @@
1
1
  /**
2
- * Simple keyword list
2
+ * Simple keyword lists for highlighting
3
3
  */
4
- const KEYWORDS = [
4
+ const KEYWORDS = new Set([
5
5
  'async', 'await', 'break', 'case', 'catch', 'class', 'const', 'continue',
6
6
  'debugger', 'default', 'delete', 'do', 'else', 'export', 'extends',
7
7
  'finally', 'for', 'function', 'if', 'import', 'in', 'instanceof',
8
8
  'let', 'new', 'return', 'super', 'switch', 'this', 'throw', 'try',
9
9
  'typeof', 'var', 'void', 'while', 'with', 'yield', 'from', 'of',
10
- 'static', 'get', 'set', 'as', 'interface', 'type', 'enum', 'namespace'
11
- ];
10
+ 'static', 'get', 'set', 'as', 'interface', 'type', 'enum', 'namespace',
11
+ // ✅ JUX-specific
12
+ 'jux', 'state', 'registry', 'render', 'bind', 'sync'
13
+ ]);
14
+
15
+ // ✅ Reserved operators and punctuation
16
+ const OPERATORS = ['+', '-', '*', '/', '%', '=', '==', '===', '!=', '!==', '<', '>', '<=', '>=', '!', '&&', '||', '?', ':', '=>'];
17
+ const PUNCTUATION = ['{', '}', '(', ')', '[', ']', ';', ',', '.'];
12
18
 
13
19
  export interface ParsedLine {
14
20
  lineNumber: number;
@@ -29,7 +35,7 @@ function escapeHtml(text: string): string {
29
35
  }
30
36
 
31
37
  /**
32
- * Parse code into lines - NO FANCY HIGHLIGHTING, JUST KEYWORDS
38
+ * Parse code into lines - Simple keyword + special char highlighting
33
39
  */
34
40
  export function parseCode(code: string, language: string = 'javascript'): ParsedLine[] {
35
41
  const lines = code.split('\n');
@@ -42,7 +48,7 @@ export function parseCode(code: string, language: string = 'javascript'): Parsed
42
48
  }
43
49
 
44
50
  /**
45
- * Ultra-simple highlighting - JUST keywords, nothing fancy
51
+ * Ultra-simple highlighting - Keywords + operators + punctuation
46
52
  */
47
53
  function highlightLine(line: string): string {
48
54
  if (!line.trim()) return ' ';
@@ -50,9 +56,17 @@ function highlightLine(line: string): string {
50
56
  // Escape everything first
51
57
  let result = escapeHtml(line);
52
58
 
53
- // Only highlight standalone keywords (word boundaries)
59
+ // 1. Highlight single-line comments first (so keywords inside comments aren't highlighted)
60
+ result = result.replace(/(\/\/.*$)/g, '<span class="token-comment">$1</span>');
61
+
62
+ // 2. Highlight strings (simple pattern - just quotes, no nested logic)
63
+ result = result.replace(/(&quot;[^&]*?&quot;|&#39;[^&#]*?&#39;)/g, '<span class="token-string">$1</span>');
64
+
65
+ // 3. Highlight numbers
66
+ result = result.replace(/\b(\d+)\b/g, '<span class="token-number">$1</span>');
67
+
68
+ // 4. Highlight keywords (whole words only)
54
69
  KEYWORDS.forEach(keyword => {
55
- // Match whole words only, case-sensitive
56
70
  const regex = new RegExp(`\\b(${keyword})\\b`, 'g');
57
71
  result = result.replace(regex, '<span class="token-keyword">$1</span>');
58
72
  });
@@ -72,7 +86,7 @@ export function renderLineWithTokens(parsedLine: ParsedLine): string {
72
86
  */
73
87
  export function getSyntaxHighlightCSS(): string {
74
88
  return `
75
- /* Simple Code Highlighting */
89
+ /* Simple Syntax Highlighting */
76
90
  .jux-code {
77
91
  font-family: 'Fira Code', 'Consolas', 'Monaco', monospace;
78
92
  font-size: 14px;
@@ -126,10 +140,20 @@ export function getSyntaxHighlightCSS(): string {
126
140
  display: none;
127
141
  }
128
142
 
129
- /* Token colors - JUST KEYWORDS */
143
+ /* Token colors */
130
144
  .token-keyword {
131
145
  color: #c678dd;
132
146
  font-weight: 600;
147
+ }
148
+ .token-string {
149
+ color: #98c379;
150
+ }
151
+ .token-number {
152
+ color: #d19a66;
153
+ }
154
+ .token-comment {
155
+ color: #5c6370;
156
+ font-style: italic;
133
157
  }
134
158
  `;
135
159
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "juxscript",
3
- "version": "1.1.52",
3
+ "version": "1.1.54",
4
4
  "type": "module",
5
5
  "description": "A JavaScript UX authorship platform",
6
6
  "main": "index.js",