juxscript 1.1.53 → 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.
Files changed (4) hide show
  1. package/lib/utils/codeparser.d.ts.map +1 -1
  2. package/lib/utils/codeparser.js +15 -19
  3. package/lib/utils/codeparser.ts +18 -21
  4. package/package.json +1 -1
package/lib/utils/codeparser.d.ts.map CHANGED
@@ -1 +1 @@
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;AAmCD;;GAEG;AACH,wBAAgB,oBAAoB,CAAC,UAAU,EAAE,UAAU,GAAG,MAAM,CAEnE;AAED;;GAEG;AACH,wBAAgB,qBAAqB,IAAI,MAAM,CAqE9C;;;;;;;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"}
package/lib/utils/codeparser.js CHANGED
@@ -44,24 +44,17 @@ function highlightLine(line) {
44
44
  return ' ';
45
45
  // Escape everything first
46
46
  let result = escapeHtml(line);
47
- // 1. Highlight keywords (whole words only)
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)
48
54
  KEYWORDS.forEach(keyword => {
49
55
  const regex = new RegExp(`\\b(${keyword})\\b`, 'g');
50
56
  result = result.replace(regex, '<span class="token-keyword">$1</span>');
51
57
  });
52
- // 2. Highlight operators (multi-char first, then single-char)
53
- const sortedOps = [...OPERATORS].sort((a, b) => b.length - a.length);
54
- sortedOps.forEach(op => {
55
- const escaped = op.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
56
- const regex = new RegExp(escaped, 'g');
57
- result = result.replace(regex, `<span class="token-operator">${escapeHtml(op)}</span>`);
58
- });
59
- // 3. Highlight punctuation
60
- PUNCTUATION.forEach(punct => {
61
- const escaped = punct.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
62
- const regex = new RegExp(escaped, 'g');
63
- result = result.replace(regex, `<span class="token-punctuation">${escapeHtml(punct)}</span>`);
64
- });
65
58
  return result;
66
59
  }
67
60
  /**
@@ -134,12 +127,15 @@ export function getSyntaxHighlightCSS() {
134
127
  color: #c678dd;
135
128
  font-weight: 600;
136
129
  }
137
- .token-operator {
138
- color: #56b6c2;
139
- font-weight: 500;
130
+ .token-string {
131
+ color: #98c379;
132
+ }
133
+ .token-number {
134
+ color: #d19a66;
140
135
  }
141
- .token-punctuation {
142
- color: #abb2bf;
136
+ .token-comment {
137
+ color: #5c6370;
138
+ font-style: italic;
143
139
  }
144
140
  `;
145
141
  }
package/lib/utils/codeparser.ts CHANGED
@@ -56,27 +56,21 @@ function highlightLine(line: string): string {
56
56
  // Escape everything first
57
57
  let result = escapeHtml(line);
58
58
 
59
- // 1. Highlight keywords (whole words only)
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)
60
69
  KEYWORDS.forEach(keyword => {
61
70
  const regex = new RegExp(`\\b(${keyword})\\b`, 'g');
62
71
  result = result.replace(regex, '<span class="token-keyword">$1</span>');
63
72
  });
64
73
 
65
- // 2. Highlight operators (multi-char first, then single-char)
66
- const sortedOps = [...OPERATORS].sort((a, b) => b.length - a.length);
67
- sortedOps.forEach(op => {
68
- const escaped = op.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
69
- const regex = new RegExp(escaped, 'g');
70
- result = result.replace(regex, `<span class="token-operator">${escapeHtml(op)}</span>`);
71
- });
72
-
73
- // 3. Highlight punctuation
74
- PUNCTUATION.forEach(punct => {
75
- const escaped = punct.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
76
- const regex = new RegExp(escaped, 'g');
77
- result = result.replace(regex, `<span class="token-punctuation">${escapeHtml(punct)}</span>`);
78
- });
79
-
80
74
  return result;
81
75
  }
82
76
 
@@ -151,12 +145,15 @@ export function getSyntaxHighlightCSS(): string {
151
145
  color: #c678dd;
152
146
  font-weight: 600;
153
147
  }
154
- .token-operator {
155
- color: #56b6c2;
156
- font-weight: 500;
148
+ .token-string {
149
+ color: #98c379;
150
+ }
151
+ .token-number {
152
+ color: #d19a66;
157
153
  }
158
- .token-punctuation {
159
- color: #abb2bf;
154
+ .token-comment {
155
+ color: #5c6370;
156
+ font-style: italic;
160
157
  }
161
158
  `;
162
159
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "juxscript",
3
- "version": "1.1.53",
3
+ "version": "1.1.54",
4
4
  "type": "module",
5
5
  "description": "A JavaScript UX authorship platform",
6
6
  "main": "index.js",