bitwrench 1.2.16 → 2.0.7

package/dist/bitwrench-code-edit.esm.min.js

@@ -0,0 +1,15 @@
+/*! bitwrench v2.0.7 | BSD-2-Clause | http://deftio.com/bitwrench */
+/**
+ * bitwrench-code-edit.js - syntax-highlighted contenteditable code editor addon
+ *
+ * Provides bw.highlight() for tokenizing JS/CSS/HTML into TACO spans,
+ * and bw.codeEditor() for a live editable code block with syntax coloring.
+ *
+ * Can be loaded standalone (browser script tag after bitwrench.umd.js),
+ * or imported as an ES module / CJS module.
+ *
+ * @module bitwrench-code-edit
+ * @license BSD-2-Clause
+ */
+var e=!1,t='.bw-ce{background:#1e293b;border-radius:6px;border:1px solid rgba(255,255,255,0.08);overflow:auto}.bw-ce pre{margin:0;padding:0}.bw-ce code{font-family:"SF Mono",Monaco,"Cascadia Code",Consolas,monospace;font-size:0.875rem;line-height:1.6;color:#e2e8f0;outline:none;white-space:pre-wrap;display:block;padding:0.75rem 1rem}.bw-ce code:empty::before{content:"\\200b"}.bw-ce .bw-ce-keyword{color:#c792ea}.bw-ce .bw-ce-string{color:#c3e88d}.bw-ce .bw-ce-comment{color:#546e7a;font-style:italic}.bw-ce .bw-ce-number{color:#f78c6c}.bw-ce .bw-ce-operator{color:#89ddff}.bw-ce .bw-ce-punctuation{color:#89ddff}.bw-ce .bw-ce-property{color:#82aaff}.bw-ce .bw-ce-function{color:#82aaff}.bw-ce .bw-ce-tag{color:#f07178}.bw-ce .bw-ce-attr-name{color:#ffcb6b}.bw-ce .bw-ce-attr-value{color:#c3e88d}.bw-ce .bw-ce-selector{color:#c792ea}.bw-ce .bw-ce-css-prop{color:#82aaff}.bw-ce .bw-ce-css-value{color:#f78c6c}.bw-ce .bw-ce-at-rule{color:#c792ea;font-style:italic}.bw-ce .bw-ce-color{color:#f78c6c}.bw-ce .bw-ce-template-interp{color:#89ddff}.bw-ce-light.bw-ce{background:#fafafa;border-color:#d8d8d8}.bw-ce-light.bw-ce code{color:#1a1a1a}.bw-ce-light.bw-ce .bw-ce-keyword{color:#7c3aed}.bw-ce-light.bw-ce .bw-ce-string{color:#16a34a}.bw-ce-light.bw-ce .bw-ce-comment{color:#9ca3af;font-style:italic}.bw-ce-light.bw-ce .bw-ce-number{color:#ea580c}.bw-ce-light.bw-ce .bw-ce-operator{color:#0891b2}.bw-ce-light.bw-ce .bw-ce-punctuation{color:#6b7280}.bw-ce-light.bw-ce .bw-ce-property{color:#2563eb}.bw-ce-light.bw-ce .bw-ce-function{color:#2563eb}.bw-ce-light.bw-ce .bw-ce-tag{color:#dc2626}.bw-ce-light.bw-ce .bw-ce-attr-name{color:#d97706}.bw-ce-light.bw-ce .bw-ce-attr-value{color:#16a34a}.bw-ce-light.bw-ce .bw-ce-selector{color:#7c3aed}.bw-ce-light.bw-ce .bw-ce-css-prop{color:#2563eb}.bw-ce-light.bw-ce .bw-ce-css-value{color:#ea580c}.bw-ce-light.bw-ce .bw-ce-at-rule{color:#7c3aed}.bw-ce-light.bw-ce .bw-ce-color{color:#ea580c}.bw-ce-light.bw-ce .bw-ce-template-interp{color:#0891b2}';var c={};function o(e){var t=[],r=0,n=e.length,a="";function l(e){a.length&&(t.push({type:e,text:a}),a="")}for(;r<n;){var s=e[r],i=e[r+1];if("/"!==s||"/"!==i)if("/"!==s||"*"!==i){if("/"===s&&"/"!==i&&"*"!==i){var p=t.length?t[t.length-1]:null,u=!1;if(a.trim().length||p&&"operator"!==p.type&&"punctuation"!==p.type&&"keyword"!==p.type||(u=!0),u){l("plain");for(var f="/",b=r+1,w=!1,h=!1;b<n;){var d=e[b];if(w)f+=d,w=!1,b++;else if("\\"!==d)if("["!==d)if("]"!==d){if("/"===d&&!h){f+=d,b++;break}if("\n"===d)break;f+=d,b++}else h=!1,f+=d,b++;else h=!0,f+=d,b++;else w=!0,f+=d,b++}for(;b<n&&/[gimsuvy]/.test(e[b]);)f+=e[b],b++;t.push({type:"string",text:f}),r=b;continue}}if('"'!==s&&"'"!==s&&"`"!==s)if(/[0-9]/.test(s)||"."===s&&i&&/[0-9]/.test(i)){l("plain");var g="";if("0"===s&&i&&/[xXbBoO]/.test(i))for(g=s+i,r+=2;r<n&&/[0-9a-fA-F_]/.test(e[r]);)g+=e[r],r++;else for(;r<n&&/[0-9._eE]/.test(e[r]);)"e"!==e[r]&&"E"!==e[r]||!e[r+1]||!/[+\-0-9]/.test(e[r+1])?(g+=e[r],r++):(g+=e[r]+e[r+1],r+=2);t.push({type:"number",text:g})}else if(/[a-zA-Z_$]/.test(s)){l("plain");for(var v="";r<n&&/[a-zA-Z0-9_$]/.test(e[r]);)v+=e[r],r++;for(var y=r;y<n&&(" "===e[y]||"\t"===e[y]);)y++;var x=t.length?t[t.length-1]:null,m=x&&"punctuation"===x.type&&"."===x.text;c[v]?t.push({type:"keyword",text:v}):m?y<n&&"("===e[y]?t.push({type:"function",text:v}):t.push({type:"property",text:v}):y<n&&"("===e[y]?t.push({type:"function",text:v}):t.push({type:"plain",text:v})}else if(-1==="=+-*/%!<>&|^~?:".indexOf(s))-1==="(){}[];,.".indexOf(s)?(a+=s,r++):(l("plain"),t.push({type:"punctuation",text:s}),r++);else{l("plain");var k=s;++r<n&&-1!=="=+-*/%!<>&|^~?:".indexOf(e[r])&&(k+=e[r],++r<n&&-1!=="=>&|".indexOf(e[r])&&(k+=e[r],r++)),t.push({type:"operator",text:k})}else{l("plain");var C=s,A=s,S=r+1;if("`"===C){for(;S<n;){var O=e[S];if("\\"!==O)if("$"!==O||"{"!==e[S+1]){if("`"===O){A+=O,S++;break}A+=O,S++}else{A.length&&t.push({type:"string",text:A}),A="",t.push({type:"template-interp",text:"${"}),S+=2;for(var E=1,T="";S<n&&E>0;){if("{"===e[S])E++;else if("}"===e[S]&&0===--E)break;T+=e[S],S++}var z=o(T);(t=t.concat(z)).push({type:"template-interp",text:"}"}),S++}else A+=O+(e[S+1]||""),S+=2}A.length&&t.push({type:"string",text:A})}else{for(;S<n;){var R=e[S];if("\\"!==R){if(R===C){A+=R,S++;break}if("\n"===R)break;A+=R,S++}else A+=R+(e[S+1]||""),S+=2}t.push({type:"string",text:A})}r=S}}else{l("plain");var _=e.indexOf("*/",r+2);-1===_&&(_=n-2),t.push({type:"comment",text:e.substring(r,_+2)}),r=_+2}else{l("plain");var Z=e.indexOf("\n",r);-1===Z&&(Z=n),t.push({type:"comment",text:e.substring(r,Z)}),r=Z}}return l("plain"),t}function r(e){var t=[],c=0,o=e.length,r="selector",n="";function a(e){n.length&&(t.push({type:e||"plain",text:n}),n="")}for(;c<o;){var l=e[c],s=e[c+1];if("/"!==l||"*"!==s)if('"'!==l&&"'"!==l||"value"!==r&&"selector"!==r)if("@"!==l||"selector"!==r)if("#"!==l||"value"!==r)if("value"===r&&/[0-9]/.test(l)){a("css-value");for(var i="";c<o&&/[0-9.]/.test(e[c]);)i+=e[c],c++;for(var p="";c<o&&/[a-zA-Z%]/.test(e[c]);)p+=e[c],c++;t.push({type:"number",text:i+p})}else"{"!==l?"}"!==l?":"!==l||"prop"!==r?";"!==l?","!==l?(n+=l,c++):(a("selector"===r?"selector":"value"===r?"css-value":"plain"),t.push({type:"punctuation",text:l}),c++):(a("value"===r?"css-value":"plain"),t.push({type:"punctuation",text:l}),r="prop",c++):(a("css-prop"),t.push({type:"punctuation",text:l}),r="value",c++):(a("prop"===r?"css-prop":"value"===r?"css-value":"plain"),t.push({type:"punctuation",text:l}),r="selector",c++):(a("selector"===r?"selector":"plain"),t.push({type:"punctuation",text:l}),r="prop",c++);else{a("css-value");var u="#";for(c++;c<o&&/[0-9a-fA-F]/.test(e[c]);)u+=e[c],c++;t.push({type:"color",text:u})}else{a("selector");var f="@";for(c++;c<o&&/[a-zA-Z\-]/.test(e[c]);)f+=e[c],c++;t.push({type:"at-rule",text:f})}else{a("selector"===r?"selector":"css-value");var b=l,w=l;for(c++;c<o;)if("\\"!==e[c]){if(e[c]===b){w+=e[c],c++;break}w+=e[c],c++}else w+=e[c]+(e[c+1]||""),c+=2;t.push({type:"string",text:w})}else{a("selector"===r?"selector":"prop"===r?"css-prop":"css-value");var h=e.indexOf("*/",c+2);-1===h&&(h=o-2),t.push({type:"comment",text:e.substring(c,h+2)}),c=h+2}}return a("selector"===r?"selector":"prop"===r?"css-prop":"css-value"),t}function n(e){var t=[],c=0,o=e.length,r="";function n(e){r.length&&(t.push({type:e,text:r}),r="")}for(;c<o;){var a=e[c];if("<"!==a||"\x3c!--"!==e.substring(c,c+4))if("<"!==a)if("&"!==a)r+=a,c++;else{n("plain");var l="&";for(c++;c<o&&";"!==e[c]&&/[a-zA-Z0-9#]/.test(e[c]);)l+=e[c],c++;c<o&&";"===e[c]&&(l+=";",c++),t.push({type:"string",text:l})}else{n("plain");var s="<";for(++c<o&&"/"===e[c]&&(s+="/",c++);c<o&&/[a-zA-Z0-9\-]/.test(e[c]);)s+=e[c],c++;for(t.push({type:"tag",text:s});c<o&&">"!==e[c]&&("/"!==e[c]||">"!==e[c+1]);)if(/\s/.test(e[c])){for(var i="";c<o&&/\s/.test(e[c]);)i+=e[c],c++;t.push({type:"plain",text:i})}else if(/[a-zA-Z_\-@:]/.test(e[c])){for(var p="";c<o&&/[a-zA-Z0-9_\-@:]/.test(e[c]);)p+=e[c],c++;if(t.push({type:"attr-name",text:p}),c<o&&"="===e[c])if(t.push({type:"punctuation",text:"="}),++c<o&&('"'===e[c]||"'"===e[c])){var u=e[c],f=u;for(c++;c<o&&e[c]!==u;)f+=e[c],c++;c<o&&(f+=e[c],c++),t.push({type:"attr-value",text:f})}else{for(var b="";c<o&&!/[\s>]/.test(e[c]);)b+=e[c],c++;t.push({type:"attr-value",text:b})}}else r+=e[c],c++,n("plain");var w="";c<o&&"/"===e[c]&&(w+="/",c++),c<o&&">"===e[c]&&(w+=">",c++),w&&t.push({type:"tag",text:w})}else{n("plain");var h=e.indexOf("--\x3e",c+4);-1===h&&(h=o-3),t.push({type:"comment",text:e.substring(c,h+3)}),c=h+3}}return n("plain"),t}"var,const,let,function,return,if,else,for,while,do,switch,case,break,continue,new,typeof,instanceof,this,class,extends,import,export,default,from,true,false,null,undefined,try,catch,throw,finally,async,await,yield,of,in,delete,void,with,super,static,get,set,debugger".split(",").forEach((function(e){c[e]=!0}));var a={js:o,javascript:o,css:r,html:n};function l(e,t){return function(e){for(var t=[],c=0;c<e.length;c++){var o=e[c];"plain"===o.type?t.push(o.text):t.push({t:"span",a:{class:"bw-ce-"+o.type},c:o.text})}return t}((a[t]||o)(e))}function s(e){var t=(e=e||{}).code||"",c=e.lang||"js",o=e.height||"180px",r=!!e.readOnly,n="bw-ce"+(e.className?" "+e.className:""),a=l(t,c),s={spellcheck:"false",class:"bw-ce-code"};return r||(s.contenteditable="true"),{t:"div",a:{class:n,style:"max-height:"+o+";overflow:auto"},c:[{t:"pre",c:{t:"code",a:s,c:a}}],o:{mounted:function(o){var n=o.querySelector(".bw-ce-code");if(n){var a=t,s=null,i="undefined"!=typeof window&&window.bw||{};o._bwCodeEdit={getValue:p,setValue:function(e){a=e;var t=l(e,c);i.html&&(n.innerHTML=i.html({t:"span",c:t}))}},r||(n.addEventListener("input",(function(){clearTimeout(s),s=setTimeout(u,50)})),n.addEventListener("keydown",(function(e){"Tab"===e.key&&(e.preventDefault(),document.execCommand("insertText",!1,"  "))})))}function p(){return n.textContent||""}function u(){var t=p();if(t!==a){a=t;var o=function(e){var t=window.getSelection();if(!t.rangeCount)return 0;var c=t.getRangeAt(0).cloneRange();return c.selectNodeContents(e),c.setEnd(t.getRangeAt(0).startContainer,t.getRangeAt(0).startOffset),c.toString().length}(n),r=l(t,c);i.html&&(n.innerHTML=i.html({t:"span",c:r})),function(e,t){for(var c,o=window.getSelection(),r=document.createRange(),n=document.createTreeWalker(e,NodeFilter.SHOW_TEXT,null,!1),a=0;c=n.nextNode();){var l=c.textContent.length;if(a+l>=t)return r.setStart(c,t-a),r.collapse(!0),o.removeAllRanges(),void o.addRange(r);a+=l}r.selectNodeContents(e),r.collapse(!1),o.removeAllRanges(),o.addRange(r)}(n,o),e.onChange&&e.onChange(t)}}}}}}function i(c){c&&(c.highlight=l,c.codeEditor=function(o){return function(c){e||(e=!0,c&&c.injectCSS&&c.injectCSS(t,{id:"bw-code-edit-styles"}))}(c),s(o)})}"undefined"!=typeof window&&window.bw&&i(window.bw);var p={highlight:l,codeEditor:s,install:i,CSS_TEXT:t};export{t as CSS_TEXT,s as codeEditor,p as default,l as highlight,i as install,r as tokenizeCSS,n as tokenizeHTML,o as tokenizeJS};
+//# sourceMappingURL=bitwrench-code-edit.esm.min.js.map

package/dist/bitwrench-code-edit.umd.js

@@ -0,0 +1,645 @@
+/*! bitwrench v2.0.7 | BSD-2-Clause | http://deftio.com/bitwrench */
+(function (global, factory) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
+  typeof define === 'function' && define.amd ? define(['exports'], factory) :
+  (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory(global.bwCodeEdit = {}));
+})(this, (function (exports) { 'use strict';
+
+  /**
+   * bitwrench-code-edit.js - syntax-highlighted contenteditable code editor addon
+   *
+   * Provides bw.highlight() for tokenizing JS/CSS/HTML into TACO spans,
+   * and bw.codeEditor() for a live editable code block with syntax coloring.
+   *
+   * Can be loaded standalone (browser script tag after bitwrench.umd.js),
+   * or imported as an ES module / CJS module.
+   *
+   * @module bitwrench-code-edit
+   * @license BSD-2-Clause
+   */
+
+  // -- CSS (injected once) ----------------------------------------------
+  var _cssInjected = false;
+  var CSS_TEXT =
+    '.bw-ce{background:#1e293b;border-radius:6px;border:1px solid rgba(255,255,255,0.08);overflow:auto}' +
+    '.bw-ce pre{margin:0;padding:0}' +
+    '.bw-ce code{font-family:"SF Mono",Monaco,"Cascadia Code",Consolas,monospace;font-size:0.875rem;line-height:1.6;color:#e2e8f0;outline:none;white-space:pre-wrap;display:block;padding:0.75rem 1rem}' +
+    '.bw-ce code:empty::before{content:"\\200b"}' +
+    '.bw-ce .bw-ce-keyword{color:#c792ea}' +
+    '.bw-ce .bw-ce-string{color:#c3e88d}' +
+    '.bw-ce .bw-ce-comment{color:#546e7a;font-style:italic}' +
+    '.bw-ce .bw-ce-number{color:#f78c6c}' +
+    '.bw-ce .bw-ce-operator{color:#89ddff}' +
+    '.bw-ce .bw-ce-punctuation{color:#89ddff}' +
+    '.bw-ce .bw-ce-property{color:#82aaff}' +
+    '.bw-ce .bw-ce-function{color:#82aaff}' +
+    '.bw-ce .bw-ce-tag{color:#f07178}' +
+    '.bw-ce .bw-ce-attr-name{color:#ffcb6b}' +
+    '.bw-ce .bw-ce-attr-value{color:#c3e88d}' +
+    '.bw-ce .bw-ce-selector{color:#c792ea}' +
+    '.bw-ce .bw-ce-css-prop{color:#82aaff}' +
+    '.bw-ce .bw-ce-css-value{color:#f78c6c}' +
+    '.bw-ce .bw-ce-at-rule{color:#c792ea;font-style:italic}' +
+    '.bw-ce .bw-ce-color{color:#f78c6c}' +
+    '.bw-ce .bw-ce-template-interp{color:#89ddff}' +
+    // Light theme
+    '.bw-ce-light.bw-ce{background:#fafafa;border-color:#d8d8d8}' +
+    '.bw-ce-light.bw-ce code{color:#1a1a1a}' +
+    '.bw-ce-light.bw-ce .bw-ce-keyword{color:#7c3aed}' +
+    '.bw-ce-light.bw-ce .bw-ce-string{color:#16a34a}' +
+    '.bw-ce-light.bw-ce .bw-ce-comment{color:#9ca3af;font-style:italic}' +
+    '.bw-ce-light.bw-ce .bw-ce-number{color:#ea580c}' +
+    '.bw-ce-light.bw-ce .bw-ce-operator{color:#0891b2}' +
+    '.bw-ce-light.bw-ce .bw-ce-punctuation{color:#6b7280}' +
+    '.bw-ce-light.bw-ce .bw-ce-property{color:#2563eb}' +
+    '.bw-ce-light.bw-ce .bw-ce-function{color:#2563eb}' +
+    '.bw-ce-light.bw-ce .bw-ce-tag{color:#dc2626}' +
+    '.bw-ce-light.bw-ce .bw-ce-attr-name{color:#d97706}' +
+    '.bw-ce-light.bw-ce .bw-ce-attr-value{color:#16a34a}' +
+    '.bw-ce-light.bw-ce .bw-ce-selector{color:#7c3aed}' +
+    '.bw-ce-light.bw-ce .bw-ce-css-prop{color:#2563eb}' +
+    '.bw-ce-light.bw-ce .bw-ce-css-value{color:#ea580c}' +
+    '.bw-ce-light.bw-ce .bw-ce-at-rule{color:#7c3aed}' +
+    '.bw-ce-light.bw-ce .bw-ce-color{color:#ea580c}' +
+    '.bw-ce-light.bw-ce .bw-ce-template-interp{color:#0891b2}';
+
+  function ensureCSS(bw) {
+    if (_cssInjected) return;
+    _cssInjected = true;
+    if (bw && bw.injectCSS) {
+      bw.injectCSS(CSS_TEXT, { id: 'bw-code-edit-styles' });
+    }
+  }
+
+  // -- JS keywords ------------------------------------------------------
+  var JS_KEYWORDS = {};
+  'var,const,let,function,return,if,else,for,while,do,switch,case,break,continue,new,typeof,instanceof,this,class,extends,import,export,default,from,true,false,null,undefined,try,catch,throw,finally,async,await,yield,of,in,delete,void,with,super,static,get,set,debugger'.split(',').forEach(function(k) { JS_KEYWORDS[k] = true; });
+
+  // -- JS Tokenizer -----------------------------------------------------
+  function tokenizeJS(code) {
+    var tokens = [];
+    var i = 0, len = code.length;
+    var buf = '';
+
+    function flush(type) {
+      if (buf.length) { tokens.push({ type: type, text: buf }); buf = ''; }
+    }
+
+    while (i < len) {
+      var ch = code[i];
+      var next = code[i + 1];
+
+      // Line comment
+      if (ch === '/' && next === '/') {
+        flush('plain');
+        var end = code.indexOf('\n', i);
+        if (end === -1) end = len;
+        tokens.push({ type: 'comment', text: code.substring(i, end) });
+        i = end;
+        continue;
+      }
+
+      // Block comment
+      if (ch === '/' && next === '*') {
+        flush('plain');
+        var end2 = code.indexOf('*/', i + 2);
+        if (end2 === -1) end2 = len - 2;
+        tokens.push({ type: 'comment', text: code.substring(i, end2 + 2) });
+        i = end2 + 2;
+        continue;
+      }
+
+      // Regex (simple heuristic: / after operator or start-of-line)
+      if (ch === '/' && next !== '/' && next !== '*') {
+        var prevToken = tokens.length ? tokens[tokens.length - 1] : null;
+        var prevBuf = buf.trim();
+        var isRegex = false;
+        if (!prevBuf.length) {
+          if (!prevToken) isRegex = true;
+          else if (prevToken.type === 'operator' || prevToken.type === 'punctuation' || prevToken.type === 'keyword') isRegex = true;
+        }
+        if (isRegex) {
+          flush('plain');
+          var rBuf = '/';
+          var ri = i + 1;
+          var escaped = false;
+          var inCharClass = false;
+          while (ri < len) {
+            var rc = code[ri];
+            if (escaped) { rBuf += rc; escaped = false; ri++; continue; }
+            if (rc === '\\') { escaped = true; rBuf += rc; ri++; continue; }
+            if (rc === '[') { inCharClass = true; rBuf += rc; ri++; continue; }
+            if (rc === ']') { inCharClass = false; rBuf += rc; ri++; continue; }
+            if (rc === '/' && !inCharClass) { rBuf += rc; ri++; break; }
+            if (rc === '\n') break;
+            rBuf += rc; ri++;
+          }
+          // Flags
+          while (ri < len && /[gimsuvy]/.test(code[ri])) { rBuf += code[ri]; ri++; }
+          tokens.push({ type: 'string', text: rBuf });
+          i = ri;
+          continue;
+        }
+      }
+
+      // Strings
+      if (ch === '"' || ch === "'" || ch === '`') {
+        flush('plain');
+        var quote = ch;
+        var sBuf = ch;
+        var si = i + 1;
+        if (quote === '`') {
+          // Template literal
+          while (si < len) {
+            var sc = code[si];
+            if (sc === '\\') { sBuf += sc + (code[si + 1] || ''); si += 2; continue; }
+            if (sc === '$' && code[si + 1] === '{') {
+              // Flush string part so far
+              if (sBuf.length) tokens.push({ type: 'string', text: sBuf }); sBuf = '';
+              // Find matching brace (simple: count braces)
+              tokens.push({ type: 'template-interp', text: '${' });
+              si += 2;
+              var depth = 1;
+              var interpBuf = '';
+              while (si < len && depth > 0) {
+                if (code[si] === '{') depth++;
+                else if (code[si] === '}') { depth--; if (depth === 0) break; }
+                interpBuf += code[si]; si++;
+              }
+              // Tokenize the interpolation content recursively
+              var interpTokens = tokenizeJS(interpBuf);
+              tokens = tokens.concat(interpTokens);
+              tokens.push({ type: 'template-interp', text: '}' });
+              si++; // skip closing }
+              continue;
+            }
+            if (sc === '`') { sBuf += sc; si++; break; }
+            sBuf += sc; si++;
+          }
+          if (sBuf.length) tokens.push({ type: 'string', text: sBuf });
+        } else {
+          while (si < len) {
+            var sc2 = code[si];
+            if (sc2 === '\\') { sBuf += sc2 + (code[si + 1] || ''); si += 2; continue; }
+            if (sc2 === quote) { sBuf += sc2; si++; break; }
+            if (sc2 === '\n') break;
+            sBuf += sc2; si++;
+          }
+          tokens.push({ type: 'string', text: sBuf });
+        }
+        i = si;
+        continue;
+      }
+
+      // Numbers
+      if (/[0-9]/.test(ch) || (ch === '.' && next && /[0-9]/.test(next))) {
+        flush('plain');
+        var nBuf = '';
+        if (ch === '0' && next && /[xXbBoO]/.test(next)) {
+          nBuf = ch + next; i += 2;
+          while (i < len && /[0-9a-fA-F_]/.test(code[i])) { nBuf += code[i]; i++; }
+        } else {
+          while (i < len && /[0-9._eE]/.test(code[i])) {
+            if ((code[i] === 'e' || code[i] === 'E') && code[i + 1] && /[+\-0-9]/.test(code[i + 1])) {
+              nBuf += code[i] + code[i + 1]; i += 2; continue;
+            }
+            nBuf += code[i]; i++;
+          }
+        }
+        tokens.push({ type: 'number', text: nBuf });
+        continue;
+      }
+
+      // Identifiers / keywords
+      if (/[a-zA-Z_$]/.test(ch)) {
+        flush('plain');
+        var wBuf = '';
+        while (i < len && /[a-zA-Z0-9_$]/.test(code[i])) { wBuf += code[i]; i++; }
+        // Look-ahead: is it a function call?
+        var la = i;
+        while (la < len && (code[la] === ' ' || code[la] === '\t')) la++;
+        // Look-back: is it a property (after dot)?
+        var prevTok = tokens.length ? tokens[tokens.length - 1] : null;
+        var isDot = prevTok && prevTok.type === 'punctuation' && prevTok.text === '.';
+
+        if (JS_KEYWORDS[wBuf]) {
+          tokens.push({ type: 'keyword', text: wBuf });
+        } else if (isDot) {
+          if (la < len && code[la] === '(') {
+            tokens.push({ type: 'function', text: wBuf });
+          } else {
+            tokens.push({ type: 'property', text: wBuf });
+          }
+        } else if (la < len && code[la] === '(') {
+          tokens.push({ type: 'function', text: wBuf });
+        } else {
+          tokens.push({ type: 'plain', text: wBuf });
+        }
+        continue;
+      }
+
+      // Operators
+      if ('=+-*/%!<>&|^~?:'.indexOf(ch) !== -1) {
+        flush('plain');
+        // Consume multi-char operators
+        var opBuf = ch;
+        i++;
+        if (i < len && '=+-*/%!<>&|^~?:'.indexOf(code[i]) !== -1) {
+          opBuf += code[i]; i++;
+          if (i < len && '=>&|'.indexOf(code[i]) !== -1) { opBuf += code[i]; i++; }
+        }
+        tokens.push({ type: 'operator', text: opBuf });
+        continue;
+      }
+
+      // Punctuation
+      if ('(){}[];,.'.indexOf(ch) !== -1) {
+        flush('plain');
+        tokens.push({ type: 'punctuation', text: ch });
+        i++;
+        continue;
+      }
+
+      // Plain (whitespace + anything else)
+      buf += ch;
+      i++;
+    }
+    flush('plain');
+    return tokens;
+  }
+
+  // -- CSS Tokenizer ----------------------------------------------------
+  function tokenizeCSS(code) {
+    var tokens = [];
+    var i = 0, len = code.length;
+    var state = 'selector'; // selector | prop | value
+    var buf = '';
+
+    function flush(type) {
+      if (buf.length) { tokens.push({ type: type || 'plain', text: buf }); buf = ''; }
+    }
+
+    while (i < len) {
+      var ch = code[i];
+      var next = code[i + 1];
+
+      // Block comment
+      if (ch === '/' && next === '*') {
+        flush(state === 'selector' ? 'selector' : state === 'prop' ? 'css-prop' : 'css-value');
+        var end = code.indexOf('*/', i + 2);
+        if (end === -1) end = len - 2;
+        tokens.push({ type: 'comment', text: code.substring(i, end + 2) });
+        i = end + 2;
+        continue;
+      }
+
+      // Strings in values
+      if ((ch === '"' || ch === "'") && (state === 'value' || state === 'selector')) {
+        flush(state === 'selector' ? 'selector' : 'css-value');
+        var quote = ch;
+        var sBuf = ch;
+        i++;
+        while (i < len) {
+          if (code[i] === '\\') { sBuf += code[i] + (code[i + 1] || ''); i += 2; continue; }
+          if (code[i] === quote) { sBuf += code[i]; i++; break; }
+          sBuf += code[i]; i++;
+        }
+        tokens.push({ type: 'string', text: sBuf });
+        continue;
+      }
+
+      // At-rules
+      if (ch === '@' && state === 'selector') {
+        flush('selector');
+        var aBuf = '@';
+        i++;
+        while (i < len && /[a-zA-Z\-]/.test(code[i])) { aBuf += code[i]; i++; }
+        tokens.push({ type: 'at-rule', text: aBuf });
+        continue;
+      }
+
+      // Hex colors in values
+      if (ch === '#' && state === 'value') {
+        flush('css-value');
+        var hBuf = '#';
+        i++;
+        while (i < len && /[0-9a-fA-F]/.test(code[i])) { hBuf += code[i]; i++; }
+        tokens.push({ type: 'color', text: hBuf });
+        continue;
+      }
+
+      // Numbers in values
+      if (state === 'value' && /[0-9]/.test(ch)) {
+        flush('css-value');
+        var nBuf2 = '';
+        while (i < len && /[0-9.]/.test(code[i])) { nBuf2 += code[i]; i++; }
+        // Unit
+        var uBuf = '';
+        while (i < len && /[a-zA-Z%]/.test(code[i])) { uBuf += code[i]; i++; }
+        tokens.push({ type: 'number', text: nBuf2 + uBuf });
+        continue;
+      }
+
+      // Punctuation and state transitions
+      if (ch === '{') {
+        flush(state === 'selector' ? 'selector' : 'plain');
+        tokens.push({ type: 'punctuation', text: ch });
+        state = 'prop';
+        i++; continue;
+      }
+      if (ch === '}') {
+        flush(state === 'prop' ? 'css-prop' : state === 'value' ? 'css-value' : 'plain');
+        tokens.push({ type: 'punctuation', text: ch });
+        state = 'selector';
+        i++; continue;
+      }
+      if (ch === ':' && state === 'prop') {
+        flush('css-prop');
+        tokens.push({ type: 'punctuation', text: ch });
+        state = 'value';
+        i++; continue;
+      }
+      if (ch === ';') {
+        flush(state === 'value' ? 'css-value' : 'plain');
+        tokens.push({ type: 'punctuation', text: ch });
+        state = 'prop';
+        i++; continue;
+      }
+      if (ch === ',') {
+        flush(state === 'selector' ? 'selector' : state === 'value' ? 'css-value' : 'plain');
+        tokens.push({ type: 'punctuation', text: ch });
+        i++; continue;
+      }
+
+      // Accumulate into buffer
+      buf += ch;
+      i++;
+    }
+    flush(state === 'selector' ? 'selector' : state === 'prop' ? 'css-prop' : 'css-value');
+    return tokens;
+  }
+
+  // -- HTML Tokenizer ---------------------------------------------------
+  function tokenizeHTML(code) {
+    var tokens = [];
+    var i = 0, len = code.length;
+    var buf = '';
+
+    function flush(type) {
+      if (buf.length) { tokens.push({ type: type, text: buf }); buf = ''; }
+    }
+
+    while (i < len) {
+      var ch = code[i];
+
+      // Comment
+      if (ch === '<' && code.substring(i, i + 4) === '<!--') {
+        flush('plain');
+        var end = code.indexOf('-->', i + 4);
+        if (end === -1) end = len - 3;
+        tokens.push({ type: 'comment', text: code.substring(i, end + 3) });
+        i = end + 3;
+        continue;
+      }
+
+      // Tag
+      if (ch === '<') {
+        flush('plain');
+        // Consume < and optional /
+        var tBuf = '<';
+        i++;
+        if (i < len && code[i] === '/') { tBuf += '/'; i++; }
+        // Tag name
+        while (i < len && /[a-zA-Z0-9\-]/.test(code[i])) { tBuf += code[i]; i++; }
+        tokens.push({ type: 'tag', text: tBuf });
+
+        // Attributes
+        while (i < len && code[i] !== '>' && !(code[i] === '/' && code[i + 1] === '>')) {
+          // Whitespace
+          if (/\s/.test(code[i])) {
+            var wBuf = '';
+            while (i < len && /\s/.test(code[i])) { wBuf += code[i]; i++; }
+            tokens.push({ type: 'plain', text: wBuf });
+            continue;
+          }
+          // Attribute name
+          if (/[a-zA-Z_\-@:]/.test(code[i])) {
+            var aBuf = '';
+            while (i < len && /[a-zA-Z0-9_\-@:]/.test(code[i])) { aBuf += code[i]; i++; }
+            tokens.push({ type: 'attr-name', text: aBuf });
+            // = sign
+            if (i < len && code[i] === '=') {
+              tokens.push({ type: 'punctuation', text: '=' });
+              i++;
+              // Attribute value
+              if (i < len && (code[i] === '"' || code[i] === "'")) {
+                var q = code[i];
+                var vBuf = q;
+                i++;
+                while (i < len && code[i] !== q) { vBuf += code[i]; i++; }
+                if (i < len) { vBuf += code[i]; i++; }
+                tokens.push({ type: 'attr-value', text: vBuf });
+              } else {
+                // Unquoted value
+                var uBuf2 = '';
+                while (i < len && !/[\s>]/.test(code[i])) { uBuf2 += code[i]; i++; }
+                tokens.push({ type: 'attr-value', text: uBuf2 });
+              }
+            }
+            continue;
+          }
+          // Anything else in tag
+          buf += code[i]; i++;
+          flush('plain');
+        }
+
+        // Close of tag
+        var closeBuf = '';
+        if (i < len && code[i] === '/') { closeBuf += '/'; i++; }
+        if (i < len && code[i] === '>') { closeBuf += '>'; i++; }
+        if (closeBuf) tokens.push({ type: 'tag', text: closeBuf });
+        continue;
+      }
+
+      // Entity
+      if (ch === '&') {
+        flush('plain');
+        var eBuf = '&';
+        i++;
+        while (i < len && code[i] !== ';' && /[a-zA-Z0-9#]/.test(code[i])) { eBuf += code[i]; i++; }
+        if (i < len && code[i] === ';') { eBuf += ';'; i++; }
+        tokens.push({ type: 'string', text: eBuf });
+        continue;
+      }
+
+      // Plain text
+      buf += ch;
+      i++;
+    }
+    flush('plain');
+    return tokens;
+  }
+
+  // -- Token to TACO conversion -----------------------------------------
+  var TOKENIZERS = { js: tokenizeJS, javascript: tokenizeJS, css: tokenizeCSS, html: tokenizeHTML };
+
+  function tokensToTACO(tokArr) {
+    var result = [];
+    for (var i = 0; i < tokArr.length; i++) {
+      var tok = tokArr[i];
+      if (tok.type === 'plain') {
+        result.push(tok.text);
+      } else {
+        result.push({ t: 'span', a: { class: 'bw-ce-' + tok.type }, c: tok.text });
+      }
+    }
+    return result;
+  }
+
+  // -- Public: highlight ------------------------------------------------
+  function highlight(code, lang) {
+    var tokenizer = TOKENIZERS[lang] || tokenizeJS;
+    var tokens = tokenizer(code);
+    return tokensToTACO(tokens);
+  }
+
+  // -- Caret save/restore -----------------------------------------------
+  function getCaretOffset(el) {
+    var sel = window.getSelection();
+    if (!sel.rangeCount) return 0;
+    var range = sel.getRangeAt(0).cloneRange();
+    range.selectNodeContents(el);
+    range.setEnd(sel.getRangeAt(0).startContainer, sel.getRangeAt(0).startOffset);
+    return range.toString().length;
+  }
+
+  function setCaretOffset(el, offset) {
+    var sel = window.getSelection();
+    var range = document.createRange();
+    var walker = document.createTreeWalker(el, NodeFilter.SHOW_TEXT, null, false);
+    var pos = 0;
+    var node;
+    while ((node = walker.nextNode())) {
+      var nodeLen = node.textContent.length;
+      if (pos + nodeLen >= offset) {
+        range.setStart(node, offset - pos);
+        range.collapse(true);
+        sel.removeAllRanges();
+        sel.addRange(range);
+        return;
+      }
+      pos += nodeLen;
+    }
+    // If offset exceeds content, place at end
+    range.selectNodeContents(el);
+    range.collapse(false);
+    sel.removeAllRanges();
+    sel.addRange(range);
+  }
+
+  // -- Public: codeEditor -----------------------------------------------
+  function codeEditor(opts) {
+    opts = opts || {};
+    var code = opts.code || '';
+    var lang = opts.lang || 'js';
+    var height = opts.height || '180px';
+    var readOnly = !!opts.readOnly;
+    var className = 'bw-ce' + (opts.className ? ' ' + opts.className : '');
+
+    var highlighted = highlight(code, lang);
+
+    var codeAttrs = {
+      spellcheck: 'false',
+      class: 'bw-ce-code'
+    };
+    if (!readOnly) {
+      codeAttrs.contenteditable = 'true';
+    }
+
+    return {
+      t: 'div',
+      a: { class: className, style: 'max-height:' + height + ';overflow:auto' },
+      c: [
+        { t: 'pre', c: { t: 'code', a: codeAttrs, c: highlighted } }
+      ],
+      o: {
+        mounted: function(el) {
+          var codeEl = el.querySelector('.bw-ce-code');
+          if (!codeEl) return;
+
+          var currentCode = code;
+          var debounceTimer = null;
+
+          // Resolve bw from global or import context
+          var bw = (typeof window !== 'undefined' && window.bw) || {};
+
+          function getValue() { return codeEl.textContent || ''; }
+
+          function setValue(newCode) {
+            currentCode = newCode;
+            var tacos = highlight(newCode, lang);
+            if (bw.html) codeEl.innerHTML = bw.html({ t: 'span', c: tacos });
+          }
+
+          // Expose API on the element
+          el._bwCodeEdit = { getValue: getValue, setValue: setValue };
+
+          if (readOnly) return;
+
+          function rehighlight() {
+            var newCode = getValue();
+            if (newCode === currentCode) return;
+            currentCode = newCode;
+            var offset = getCaretOffset(codeEl);
+            var tacos = highlight(newCode, lang);
+            if (bw.html) codeEl.innerHTML = bw.html({ t: 'span', c: tacos });
+            setCaretOffset(codeEl, offset);
+            if (opts.onChange) opts.onChange(newCode);
+          }
+
+          codeEl.addEventListener('input', function() {
+            clearTimeout(debounceTimer);
+            debounceTimer = setTimeout(rehighlight, 50);
+          });
+
+          // Tab key: insert 2 spaces
+          codeEl.addEventListener('keydown', function(e) {
+            if (e.key === 'Tab') {
+              e.preventDefault();
+              document.execCommand('insertText', false, '  ');
+            }
+          });
+        }
+      }
+    };
+  }
+
+  // -- Auto-attach to bw when loaded as script tag ----------------------
+  function install(bw) {
+    if (!bw) return;
+    bw.highlight = highlight;
+    bw.codeEditor = function(opts) {
+      ensureCSS(bw);
+      return codeEditor(opts);
+    };
+  }
+
+  // Auto-install if bw is on window (script tag usage)
+  if (typeof window !== 'undefined' && window.bw) {
+    install(window.bw);
+  }
+  var bitwrenchCodeEdit = { highlight, codeEditor, install, CSS_TEXT };
+
+  exports.CSS_TEXT = CSS_TEXT;
+  exports.codeEditor = codeEditor;
+  exports.default = bitwrenchCodeEdit;
+  exports.highlight = highlight;
+  exports.install = install;
+  exports.tokenizeCSS = tokenizeCSS;
+  exports.tokenizeHTML = tokenizeHTML;
+  exports.tokenizeJS = tokenizeJS;
+
+  Object.defineProperty(exports, '__esModule', { value: true });
+
+}));
+//# sourceMappingURL=bitwrench-code-edit.umd.js.map