overtype 2.0.3 → 2.0.5

package/dist/overtype.min.js

@@ -1,5 +1,5 @@
 /**
- * OverType v2.0.3
+ * OverType v2.0.5
  * A lightweight markdown editor library with perfect WYSIWYG alignment
  * @license MIT
  * @author David Miranda
@@ -33,7 +33,7 @@ ${a}`:r;if(d){let L=o.value[o.selectionStart-1];o.selectionStart!==0&&L!=null&&!
 `)+u;return t?(n=Math.max(n+_(0,e.unorderedList).length+h.length,0),i=n):a.processed?(n=Math.max(o.selectionStart+h.length,0),i=o.selectionEnd+h.length+l-c):(n=Math.max(o.selectionStart+h.length,0),i=o.selectionEnd+h.length+l),{text:f,selectionStart:n,selectionEnd:i}}function he(o,e){let t=R(o,n=>Qe(n,e),{adjustSelection:(n,i,r,s)=>{let a=o.value.slice(s,o.selectionEnd),p=/^\d+\.\s+/,d=/^- /,l=p.test(a),c=d.test(a),h=e.orderedList&&l||e.unorderedList&&c;if(i===r)if(h){let u=a.match(e.orderedList?p:d),f=u?u[0].length:0;return{start:Math.max(i-f,s),end:Math.max(i-f,s)}}else if(l||c){let u=a.match(l?p:d),f=u?u[0].length:0,g=(e.unorderedList?2:3)-f;return{start:i+g,end:i+g}}else{let u=e.unorderedList?2:3;return{start:i+u,end:i+u}}else if(h){let u=a.match(e.orderedList?p:d),f=u?u[0].length:0;return{start:Math.max(i-f,s),end:Math.max(r-f,s)}}else if(l||c){let u=a.match(l?p:d),f=u?u[0].length:0,g=(e.unorderedList?2:3)-f;return{start:i+g,end:r+g}}else{let u=e.unorderedList?2:3;return{start:i+u,end:r+u}}}});I(o,t)}function Xe(o){if(!o)return[];let e=[],{selectionStart:t,selectionEnd:n,value:i}=o,r=i.split(`
 `),s=0,a="";for(let c of r){if(t>=s&&t<=s+c.length){a=c;break}s+=c.length+1}a.startsWith("- ")&&(a.startsWith("- [ ] ")||a.startsWith("- [x] ")?e.push("task-list"):e.push("bullet-list")),/^\d+\.\s/.test(a)&&e.push("numbered-list"),a.startsWith("> ")&&e.push("quote"),a.startsWith("# ")&&e.push("header"),a.startsWith("## ")&&e.push("header-2"),a.startsWith("### ")&&e.push("header-3");let p=Math.max(0,t-10),d=Math.min(i.length,n+10),l=i.slice(p,d);if(l.includes("**")){let c=i.slice(Math.max(0,t-100),t),h=i.slice(n,Math.min(i.length,n+100)),u=c.lastIndexOf("**"),f=h.indexOf("**");u!==-1&&f!==-1&&e.push("bold")}if(l.includes("_")){let c=i.slice(Math.max(0,t-100),t),h=i.slice(n,Math.min(i.length,n+100)),u=c.lastIndexOf("_"),f=h.indexOf("_");u!==-1&&f!==-1&&e.push("italic")}if(l.includes("`")){let c=i.slice(Math.max(0,t-100),t),h=i.slice(n,Math.min(i.length,n+100));c.includes("`")&&h.includes("`")&&e.push("code")}if(l.includes("[")&&l.includes("]")){let c=i.slice(Math.max(0,t-100),t),h=i.slice(n,Math.min(i.length,n+100)),u=c.lastIndexOf("["),f=h.indexOf("]");u!==-1&&f!==-1&&i.slice(n+f+1,n+f+10).startsWith("(")&&e.push("link")}return e}function U(o){if(!o||o.disabled||o.readOnly)return;y("toggleBold","Starting"),z(o,"Before");let e=$(E.bold),t=V(o,e);ce(t),I(o,t),z(o,"After")}function D(o){if(!o||o.disabled||o.readOnly)return;let e=$(E.italic),t=V(o,e);I(o,t)}function ue(o){if(!o||o.disabled||o.readOnly)return;let e=$(E.code),t=V(o,e);I(o,t)}function q(o,e={}){if(!o||o.disabled||o.readOnly)return;let t=o.value.slice(o.selectionStart,o.selectionEnd),n=$(E.link);if(t&&t.match(/^https?:\/\//)&&!e.url?(n.suffix=`](${t})`,n.replaceNext=""):e.url&&(n.suffix=`](${e.url})`,n.replaceNext=""),e.text&&!t){let s=o.selectionStart;o.value=o.value.slice(0,s)+e.text+o.value.slice(s),o.selectionStart=s,o.selectionEnd=s+e.text.length}let r=V(o,n);I(o,r)}function W(o){if(!o||o.disabled||o.readOnly)return;let e=$(E.bulletList);he(o,e)}function K(o){if(!o||o.disabled||o.readOnly)return;let e=$(E.numberedList);he(o,e)}function me(o){if(!o||o.disabled||o.readOnly)return;y("toggleQuote","Starting"),z(o,"Initial");let e=$(E.quote),t=R(o,n=>de(n,e),{prefix:e.prefix});ce(t),I(o,t),z(o,"Final")}function X(o){if(!o||o.disabled||o.readOnly)return;let e=$(E.taskList),t=R(o,n=>de(n,e),{prefix:e.prefix});I(o,t)}function Y(o,e=1,t=!1){if(!o||o.disabled||o.readOnly)return;(e<1||e>6)&&(e=1),y("insertHeader","============ START ============"),y("insertHeader",`Level: ${e}, Toggle: ${t}`),y("insertHeader",`Initial cursor: ${o.selectionStart}-${o.selectionEnd}`);let n=`header${e===1?"1":e}`,i=$(E[n]||E.header1);y("insertHeader",`Style prefix: "${i.prefix}"`);let r=o.value,s=o.selectionStart,a=o.selectionEnd,p=s;for(;p>0&&r[p-1]!==`
 `;)p--;let d=a;for(;d<r.length&&r[d]!==`
-`;)d++;let l=r.slice(p,d);y("insertHeader",`Current line (before): "${l}"`);let c=l.match(/^(#{1,6})\s*/),h=c?c[1].length:0,u=c?c[0].length:0;y("insertHeader","Existing header check:"),y("insertHeader",`  - Match: ${c?`"${c[0]}"`:"none"}`),y("insertHeader",`  - Existing level: ${h}`),y("insertHeader",`  - Existing prefix length: ${u}`),y("insertHeader",`  - Target level: ${e}`);let f=t&&h===e;y("insertHeader",`Should toggle OFF: ${f} (toggle=${t}, existingLevel=${h}, level=${e})`);let m=R(o,g=>{let v=g.value.slice(g.selectionStart,g.selectionEnd);y("insertHeader",`Line in operation: "${v}"`);let b=v.replace(/^#{1,6}\s*/,"");y("insertHeader",`Cleaned line: "${b}"`);let k;return f?(y("insertHeader","ACTION: Toggling OFF - removing header"),k=b):h>0?(y("insertHeader",`ACTION: Replacing H${h} with H${e}`),k=i.prefix+b):(y("insertHeader","ACTION: Adding new header"),k=i.prefix+b),y("insertHeader",`New line: "${k}"`),{text:k,selectionStart:g.selectionStart,selectionEnd:g.selectionEnd}},{prefix:i.prefix,adjustSelection:(g,v,b,k)=>{if(y("insertHeader","Adjusting selection:"),y("insertHeader",`  - isRemoving param: ${g}`),y("insertHeader",`  - shouldToggleOff: ${f}`),y("insertHeader",`  - selStart: ${v}, selEnd: ${b}`),y("insertHeader",`  - lineStartPos: ${k}`),f){let M=Math.max(v-u,k);return y("insertHeader",`  - Removing header, adjusting by -${u}`),{start:M,end:v===b?M:Math.max(b-u,k)}}else if(u>0){let M=i.prefix.length-u;return y("insertHeader",`  - Replacing header, adjusting by ${M}`),{start:v+M,end:b+M}}else return y("insertHeader",`  - Adding header, adjusting by +${i.prefix.length}`),{start:v+i.prefix.length,end:b+i.prefix.length}}});y("insertHeader",`Final result: text="${m.text}", cursor=${m.selectionStart}-${m.selectionEnd}`),y("insertHeader","============ END ============"),I(o,m)}function fe(o){Y(o,1,!0)}function ge(o){Y(o,2,!0)}function ve(o){Y(o,3,!0)}function ye(o){return Xe(o)}var O=class{constructor(e){this.editor=e,this.textarea=e.textarea}handleKeydown(e){if(!(navigator.platform.toLowerCase().includes("mac")?e.metaKey:e.ctrlKey))return!1;let i=null;switch(e.key.toLowerCase()){case"b":e.shiftKey||(i="toggleBold");break;case"i":e.shiftKey||(i="toggleItalic");break;case"k":e.shiftKey||(i="insertLink");break;case"7":e.shiftKey&&(i="toggleNumberedList");break;case"8":e.shiftKey&&(i="toggleBulletList");break}return i?(e.preventDefault(),this.editor.toolbar?this.editor.toolbar.handleAction(i):this.handleAction(i),!0):!1}async handleAction(e){let t=this.textarea;if(t){t.focus();try{switch(e){case"toggleBold":U(t);break;case"toggleItalic":D(t);break;case"insertLink":q(t);break;case"toggleBulletList":W(t);break;case"toggleNumberedList":K(t);break}t.dispatchEvent(new Event("input",{bubbles:!0}))}catch(n){console.error("Error in markdown action:",n)}}}destroy(){}};var P={name:"solar",colors:{bgPrimary:"#faf0ca",bgSecondary:"#ffffff",text:"#0d3b66",h1:"#f95738",h2:"#ee964b",h3:"#3d8a51",strong:"#ee964b",em:"#f95738",link:"#0d3b66",code:"#0d3b66",codeBg:"rgba(244, 211, 94, 0.4)",blockquote:"#5a7a9b",hr:"#5a7a9b",syntaxMarker:"rgba(13, 59, 102, 0.52)",cursor:"#f95738",selection:"rgba(244, 211, 94, 0.4)",listMarker:"#ee964b",toolbarBg:"#ffffff",toolbarBorder:"rgba(13, 59, 102, 0.15)",toolbarIcon:"#0d3b66",toolbarHover:"#f5f5f5",toolbarActive:"#faf0ca"}},be={name:"cave",colors:{bgPrimary:"#141E26",bgSecondary:"#1D2D3E",text:"#c5dde8",h1:"#d4a5ff",h2:"#f6ae2d",h3:"#9fcfec",strong:"#f6ae2d",em:"#9fcfec",link:"#9fcfec",code:"#c5dde8",codeBg:"#1a232b",blockquote:"#9fcfec",hr:"#c5dde8",syntaxMarker:"rgba(159, 207, 236, 0.73)",cursor:"#f26419",selection:"rgba(51, 101, 138, 0.4)",listMarker:"#f6ae2d",toolbarBg:"#1D2D3E",toolbarBorder:"rgba(197, 221, 232, 0.1)",toolbarIcon:"#c5dde8",toolbarHover:"#243546",toolbarActive:"#2a3f52"}},we={solar:P,cave:be,light:P,dark:be};function B(o){return typeof o=="string"?{...we[o]||we.solar,name:o}:o}function N(o){let e=[];for(let[t,n]of Object.entries(o)){let i=t.replace(/([A-Z])/g,"-$1").toLowerCase();e.push(`--${i}: ${n};`)}return e.join(`
+`;)d++;let l=r.slice(p,d);y("insertHeader",`Current line (before): "${l}"`);let c=l.match(/^(#{1,6})\s*/),h=c?c[1].length:0,u=c?c[0].length:0;y("insertHeader","Existing header check:"),y("insertHeader",`  - Match: ${c?`"${c[0]}"`:"none"}`),y("insertHeader",`  - Existing level: ${h}`),y("insertHeader",`  - Existing prefix length: ${u}`),y("insertHeader",`  - Target level: ${e}`);let f=t&&h===e;y("insertHeader",`Should toggle OFF: ${f} (toggle=${t}, existingLevel=${h}, level=${e})`);let m=R(o,g=>{let v=g.value.slice(g.selectionStart,g.selectionEnd);y("insertHeader",`Line in operation: "${v}"`);let b=v.replace(/^#{1,6}\s*/,"");y("insertHeader",`Cleaned line: "${b}"`);let k;return f?(y("insertHeader","ACTION: Toggling OFF - removing header"),k=b):h>0?(y("insertHeader",`ACTION: Replacing H${h} with H${e}`),k=i.prefix+b):(y("insertHeader","ACTION: Adding new header"),k=i.prefix+b),y("insertHeader",`New line: "${k}"`),{text:k,selectionStart:g.selectionStart,selectionEnd:g.selectionEnd}},{prefix:i.prefix,adjustSelection:(g,v,b,k)=>{if(y("insertHeader","Adjusting selection:"),y("insertHeader",`  - isRemoving param: ${g}`),y("insertHeader",`  - shouldToggleOff: ${f}`),y("insertHeader",`  - selStart: ${v}, selEnd: ${b}`),y("insertHeader",`  - lineStartPos: ${k}`),f){let M=Math.max(v-u,k);return y("insertHeader",`  - Removing header, adjusting by -${u}`),{start:M,end:v===b?M:Math.max(b-u,k)}}else if(u>0){let M=i.prefix.length-u;return y("insertHeader",`  - Replacing header, adjusting by ${M}`),{start:v+M,end:b+M}}else return y("insertHeader",`  - Adding header, adjusting by +${i.prefix.length}`),{start:v+i.prefix.length,end:b+i.prefix.length}}});y("insertHeader",`Final result: text="${m.text}", cursor=${m.selectionStart}-${m.selectionEnd}`),y("insertHeader","============ END ============"),I(o,m)}function fe(o){Y(o,1,!0)}function ge(o){Y(o,2,!0)}function ve(o){Y(o,3,!0)}function ye(o){return Xe(o)}var O=class{constructor(e){this.editor=e,this.textarea=e.textarea}handleKeydown(e){if(!(navigator.platform.toLowerCase().includes("mac")?e.metaKey:e.ctrlKey))return!1;let i=null;switch(e.key.toLowerCase()){case"b":e.shiftKey||(i="toggleBold");break;case"i":e.shiftKey||(i="toggleItalic");break;case"k":e.shiftKey||(i="insertLink");break;case"7":e.shiftKey&&(i="toggleNumberedList");break;case"8":e.shiftKey&&(i="toggleBulletList");break}return i?(e.preventDefault(),this.editor.toolbar?this.editor.toolbar.handleAction(i):this.handleAction(i),!0):!1}async handleAction(e){let t=this.textarea;if(t){t.focus();try{switch(e){case"toggleBold":U(t);break;case"toggleItalic":D(t);break;case"insertLink":q(t);break;case"toggleBulletList":W(t);break;case"toggleNumberedList":K(t);break}t.dispatchEvent(new Event("input",{bubbles:!0}))}catch(n){console.error("Error in markdown action:",n)}}}destroy(){}};var P={name:"solar",colors:{bgPrimary:"#faf0ca",bgSecondary:"#ffffff",text:"#0d3b66",textPrimary:"#0d3b66",textSecondary:"#5a7a9b",h1:"#f95738",h2:"#ee964b",h3:"#3d8a51",strong:"#ee964b",em:"#f95738",del:"#ee964b",link:"#0d3b66",code:"#0d3b66",codeBg:"rgba(244, 211, 94, 0.4)",blockquote:"#5a7a9b",hr:"#5a7a9b",syntaxMarker:"rgba(13, 59, 102, 0.52)",syntax:"#999999",cursor:"#f95738",selection:"rgba(244, 211, 94, 0.4)",listMarker:"#ee964b",rawLine:"#5a7a9b",border:"#e0e0e0",hoverBg:"#f0f0f0",primary:"#0d3b66",toolbarBg:"#ffffff",toolbarIcon:"#0d3b66",toolbarHover:"#f5f5f5",toolbarActive:"#faf0ca"}},be={name:"cave",colors:{bgPrimary:"#141E26",bgSecondary:"#1D2D3E",text:"#c5dde8",textPrimary:"#c5dde8",textSecondary:"#9fcfec",h1:"#d4a5ff",h2:"#f6ae2d",h3:"#9fcfec",strong:"#f6ae2d",em:"#9fcfec",del:"#f6ae2d",link:"#9fcfec",code:"#c5dde8",codeBg:"#1a232b",blockquote:"#9fcfec",hr:"#c5dde8",syntaxMarker:"rgba(159, 207, 236, 0.73)",syntax:"#7a8c98",cursor:"#f26419",selection:"rgba(51, 101, 138, 0.4)",listMarker:"#f6ae2d",rawLine:"#9fcfec",border:"#2a3f52",hoverBg:"#243546",primary:"#9fcfec",toolbarBg:"#1D2D3E",toolbarIcon:"#c5dde8",toolbarHover:"#243546",toolbarActive:"#2a3f52"}},we={solar:P,cave:be,light:P,dark:be};function B(o){return typeof o=="string"?{...we[o]||we.solar,name:o}:o}function N(o){let e=[];for(let[t,n]of Object.entries(o)){let i=t.replace(/([A-Z])/g,"-$1").toLowerCase();e.push(`--${i}: ${n};`)}return e.join(`
 `)}function ke(o,e={}){return{...o,colors:{...o.colors,...e}}}function xe(o={}){let{fontSize:e="14px",lineHeight:t=1.6,fontFamily:n='"SF Mono", SFMono-Regular, Menlo, Monaco, "Cascadia Code", Consolas, "Roboto Mono", "Noto Sans Mono", "Droid Sans Mono", "Ubuntu Mono", "DejaVu Sans Mono", "Liberation Mono", "Courier New", Courier, monospace',padding:i="20px",theme:r=null,mobile:s={}}=o,a=Object.keys(s).length>0?`
     @media (max-width: 640px) {
       .overtype-wrapper .overtype-input,
@@ -459,6 +459,8 @@ ${a}`:r;if(d){let L=o.value[o.selectionStart-1];o.selectionStart!==0&&L!=null&&!
       font-size: 0.85rem !important;
       color: #666 !important;
       flex-shrink: 0 !important; /* Don't shrink */
+      z-index: 10001 !important; /* Above link tooltip */
+      position: relative !important; /* Enable z-index */
     }
     
     /* Dark theme stats bar */
@@ -496,6 +498,7 @@ ${a}`:r;if(d){let L=o.value[o.selectionStart-1];o.selectionStart!==0&&L!=null&&!
       gap: 4px !important;
       padding: 8px !important; /* Override reset */
       background: var(--toolbar-bg, var(--bg-primary, #f8f9fa)) !important; /* Override reset */
+      border-bottom: 1px solid var(--toolbar-border, transparent) !important; /* Override reset */
       overflow-x: auto !important; /* Allow horizontal scrolling */
       overflow-y: hidden !important; /* Hide vertical overflow */
       -webkit-overflow-scrolling: touch !important;
@@ -936,7 +939,7 @@ ${a}`:r;if(d){let L=o.value[o.selectionStart-1];o.selectionStart!==0&&L!=null&&!
 </svg>`,Be=`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
   <path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z" fill="none"></path>
   <circle cx="12" cy="12" r="3" fill="none"></circle>
-</svg>`;var x={bold:{name:"bold",icon:Le,title:"Bold (Ctrl+B)",action:({editor:o,event:e})=>{U(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},italic:{name:"italic",icon:Se,title:"Italic (Ctrl+I)",action:({editor:o,event:e})=>{D(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},code:{name:"code",icon:$e,title:"Inline Code",action:({editor:o,event:e})=>{ue(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},separator:{name:"separator"},link:{name:"link",icon:Ae,title:"Insert Link",action:({editor:o,event:e})=>{q(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},h1:{name:"h1",icon:Ee,title:"Heading 1",action:({editor:o,event:e})=>{fe(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},h2:{name:"h2",icon:Ce,title:"Heading 2",action:({editor:o,event:e})=>{ge(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},h3:{name:"h3",icon:Te,title:"Heading 3",action:({editor:o,event:e})=>{ve(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},bulletList:{name:"bulletList",icon:He,title:"Bullet List",action:({editor:o,event:e})=>{W(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},orderedList:{name:"orderedList",icon:Me,title:"Numbered List",action:({editor:o,event:e})=>{K(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},taskList:{name:"taskList",icon:Pe,title:"Task List",action:({editor:o,event:e})=>{X&&(X(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0})))}},quote:{name:"quote",icon:Ie,title:"Quote",action:({editor:o,event:e})=>{me(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},viewMode:{name:"viewMode",icon:Be,title:"View mode"}},G=[x.bold,x.italic,x.code,x.separator,x.link,x.separator,x.h1,x.h2,x.h3,x.separator,x.bulletList,x.orderedList,x.taskList,x.separator,x.quote,x.separator,x.viewMode];var w=class w{constructor(e,t={}){let n;if(typeof e=="string"){if(n=document.querySelectorAll(e),n.length===0)throw new Error(`No elements found for selector: ${e}`);n=Array.from(n)}else if(e instanceof Element)n=[e];else if(e instanceof NodeList)n=Array.from(e);else if(Array.isArray(e))n=e;else throw new Error("Invalid target: must be selector string, Element, NodeList, or Array");return n.map(r=>{if(r.overTypeInstance)return r.overTypeInstance.reinit(t),r.overTypeInstance;let s=Object.create(w.prototype);return s._init(r,t),r.overTypeInstance=s,w.instances.set(r,s),s})}_init(e,t={}){this.element=e,this.instanceTheme=t.theme||null,this.options=this._mergeOptions(t),this.instanceId=++w.instanceCount,this.initialized=!1,w.injectStyles(),w.initGlobalListeners();let n=e.querySelector(".overtype-container"),i=e.querySelector(".overtype-wrapper");n||i?this._recoverFromDOM(n,i):this._buildFromScratch(),this.shortcuts=new O(this),this.linkTooltip=new J(this),this.initialized=!0,this.options.onChange&&this.options.onChange(this.getValue(),this)}_mergeOptions(e){let t={fontSize:"14px",lineHeight:1.6,fontFamily:'"SF Mono", SFMono-Regular, Menlo, Monaco, "Cascadia Code", Consolas, "Roboto Mono", "Noto Sans Mono", "Droid Sans Mono", "Ubuntu Mono", "DejaVu Sans Mono", "Liberation Mono", "Courier New", Courier, monospace',padding:"16px",mobile:{fontSize:"16px",padding:"12px",lineHeight:1.5},textareaProps:{},autofocus:!1,autoResize:!1,minHeight:"100px",maxHeight:null,placeholder:"Start typing...",value:"",onChange:null,onKeydown:null,showActiveLineRaw:!1,showStats:!1,toolbar:!1,toolbarButtons:null,statsFormatter:null,smartLists:!0,codeHighlighter:null},{theme:n,colors:i,...r}=e;return{...t,...r}}_recoverFromDOM(e,t){if(e&&e.classList.contains("overtype-container"))this.container=e,this.wrapper=e.querySelector(".overtype-wrapper");else if(t){this.wrapper=t,this.container=document.createElement("div"),this.container.className="overtype-container";let n=this.instanceTheme||w.currentTheme||P,i=typeof n=="string"?n:n.name;if(i&&this.container.setAttribute("data-theme",i),this.instanceTheme){let r=typeof this.instanceTheme=="string"?B(this.instanceTheme):this.instanceTheme;if(r&&r.colors){let s=N(r.colors);this.container.style.cssText+=s}}t.parentNode.insertBefore(this.container,t),this.container.appendChild(t)}if(!this.wrapper){e&&e.remove(),t&&t.remove(),this._buildFromScratch();return}if(this.textarea=this.wrapper.querySelector(".overtype-input"),this.preview=this.wrapper.querySelector(".overtype-preview"),!this.textarea||!this.preview){this.container.remove(),this._buildFromScratch();return}this.wrapper._instance=this,this.options.fontSize&&this.wrapper.style.setProperty("--instance-font-size",this.options.fontSize),this.options.lineHeight&&this.wrapper.style.setProperty("--instance-line-height",String(this.options.lineHeight)),this.options.padding&&this.wrapper.style.setProperty("--instance-padding",this.options.padding),this._configureTextarea(),this._applyOptions()}_buildFromScratch(){let e=this._extractContent();this.element.innerHTML="",this._createDOM(),(e||this.options.value)&&this.setValue(e||this.options.value),this._applyOptions()}_extractContent(){let e=this.element.querySelector(".overtype-input");return e?e.value:this.element.textContent||""}_createDOM(){this.container=document.createElement("div"),this.container.className="overtype-container";let e=this.instanceTheme||w.currentTheme||P,t=typeof e=="string"?e:e.name;if(t&&this.container.setAttribute("data-theme",t),this.instanceTheme){let n=typeof this.instanceTheme=="string"?B(this.instanceTheme):this.instanceTheme;if(n&&n.colors){let i=N(n.colors);this.container.style.cssText+=i}}this.wrapper=document.createElement("div"),this.wrapper.className="overtype-wrapper",this.options.fontSize&&this.wrapper.style.setProperty("--instance-font-size",this.options.fontSize),this.options.lineHeight&&this.wrapper.style.setProperty("--instance-line-height",String(this.options.lineHeight)),this.options.padding&&this.wrapper.style.setProperty("--instance-padding",this.options.padding),this.wrapper._instance=this,this.textarea=document.createElement("textarea"),this.textarea.className="overtype-input",this.textarea.placeholder=this.options.placeholder,this._configureTextarea(),this.options.textareaProps&&Object.entries(this.options.textareaProps).forEach(([n,i])=>{n==="className"||n==="class"?this.textarea.className+=" "+i:n==="style"&&typeof i=="object"?Object.assign(this.textarea.style,i):this.textarea.setAttribute(n,i)}),this.preview=document.createElement("div"),this.preview.className="overtype-preview",this.preview.setAttribute("aria-hidden","true"),this.wrapper.appendChild(this.textarea),this.wrapper.appendChild(this.preview),this.container.appendChild(this.wrapper),this.options.showStats&&(this.statsBar=document.createElement("div"),this.statsBar.className="overtype-stats",this.container.appendChild(this.statsBar),this._updateStats()),this.element.appendChild(this.container),this.options.autoResize?this._setupAutoResize():this.container.classList.remove("overtype-auto-resize")}_configureTextarea(){this.textarea.setAttribute("autocomplete","off"),this.textarea.setAttribute("autocorrect","off"),this.textarea.setAttribute("autocapitalize","off"),this.textarea.setAttribute("spellcheck","false"),this.textarea.setAttribute("data-gramm","false"),this.textarea.setAttribute("data-gramm_editor","false"),this.textarea.setAttribute("data-enable-grammarly","false")}_createToolbar(){let e=this.options.toolbarButtons||G;this.toolbar=new Z(this,{toolbarButtons:e}),this.toolbar.create(),this._toolbarSelectionListener=()=>{this.toolbar&&this.toolbar.updateButtonStates()},this._toolbarInputListener=()=>{this.toolbar&&this.toolbar.updateButtonStates()},this.textarea.addEventListener("selectionchange",this._toolbarSelectionListener),this.textarea.addEventListener("input",this._toolbarInputListener)}_cleanupToolbarListeners(){this._toolbarSelectionListener&&(this.textarea.removeEventListener("selectionchange",this._toolbarSelectionListener),this._toolbarSelectionListener=null),this._toolbarInputListener&&(this.textarea.removeEventListener("input",this._toolbarInputListener),this._toolbarInputListener=null)}_applyOptions(){this.options.autofocus&&this.textarea.focus(),this.options.autoResize?this.container.classList.contains("overtype-auto-resize")||this._setupAutoResize():this.container.classList.remove("overtype-auto-resize"),this.options.toolbar&&!this.toolbar?this._createToolbar():!this.options.toolbar&&this.toolbar&&(this._cleanupToolbarListeners(),this.toolbar.destroy(),this.toolbar=null),this.updatePreview()}updatePreview(){let e=this.textarea.value,t=this.textarea.selectionStart,n=this._getCurrentLine(e,t),i=this.container.dataset.mode==="preview",r=S.parse(e,n,this.options.showActiveLineRaw,this.options.codeHighlighter,i);this.preview.innerHTML=r||'<span style="color: #808080;">Start typing...</span>',this._applyCodeBlockBackgrounds(),this.options.showStats&&this.statsBar&&this._updateStats(),this.options.onChange&&this.initialized&&this.options.onChange(e,this)}_applyCodeBlockBackgrounds(){let e=this.preview.querySelectorAll(".code-fence");for(let t=0;t<e.length-1;t+=2){let n=e[t],i=e[t+1],r=n.parentElement,s=i.parentElement;!r||!s||(n.style.display="block",i.style.display="block",r.classList.add("code-block-line"),s.classList.add("code-block-line"))}}_getCurrentLine(e,t){return e.substring(0,t).split(`
+</svg>`;var x={bold:{name:"bold",icon:Le,title:"Bold (Ctrl+B)",action:({editor:o,event:e})=>{U(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},italic:{name:"italic",icon:Se,title:"Italic (Ctrl+I)",action:({editor:o,event:e})=>{D(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},code:{name:"code",icon:$e,title:"Inline Code",action:({editor:o,event:e})=>{ue(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},separator:{name:"separator"},link:{name:"link",icon:Ae,title:"Insert Link",action:({editor:o,event:e})=>{q(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},h1:{name:"h1",icon:Ee,title:"Heading 1",action:({editor:o,event:e})=>{fe(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},h2:{name:"h2",icon:Ce,title:"Heading 2",action:({editor:o,event:e})=>{ge(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},h3:{name:"h3",icon:Te,title:"Heading 3",action:({editor:o,event:e})=>{ve(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},bulletList:{name:"bulletList",icon:He,title:"Bullet List",action:({editor:o,event:e})=>{W(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},orderedList:{name:"orderedList",icon:Me,title:"Numbered List",action:({editor:o,event:e})=>{K(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},taskList:{name:"taskList",icon:Pe,title:"Task List",action:({editor:o,event:e})=>{X&&(X(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0})))}},quote:{name:"quote",icon:Ie,title:"Quote",action:({editor:o,event:e})=>{me(o.textarea),o.textarea.dispatchEvent(new Event("input",{bubbles:!0}))}},viewMode:{name:"viewMode",icon:Be,title:"View mode"}},G=[x.bold,x.italic,x.code,x.separator,x.link,x.separator,x.h1,x.h2,x.h3,x.separator,x.bulletList,x.orderedList,x.taskList,x.separator,x.quote,x.separator,x.viewMode];var w=class w{constructor(e,t={}){let n;if(typeof e=="string"){if(n=document.querySelectorAll(e),n.length===0)throw new Error(`No elements found for selector: ${e}`);n=Array.from(n)}else if(e instanceof Element)n=[e];else if(e instanceof NodeList)n=Array.from(e);else if(Array.isArray(e))n=e;else throw new Error("Invalid target: must be selector string, Element, NodeList, or Array");return n.map(r=>{if(r.overTypeInstance)return r.overTypeInstance.reinit(t),r.overTypeInstance;let s=Object.create(w.prototype);return s._init(r,t),r.overTypeInstance=s,w.instances.set(r,s),s})}_init(e,t={}){this.element=e,this.instanceTheme=t.theme||null,this.options=this._mergeOptions(t),this.instanceId=++w.instanceCount,this.initialized=!1,w.injectStyles(),w.initGlobalListeners();let n=e.querySelector(".overtype-container"),i=e.querySelector(".overtype-wrapper");n||i?this._recoverFromDOM(n,i):this._buildFromScratch(),this.shortcuts=new O(this),this.linkTooltip=new J(this),requestAnimationFrame(()=>{requestAnimationFrame(()=>{this.textarea.scrollTop=this.preview.scrollTop,this.textarea.scrollLeft=this.preview.scrollLeft})}),this.initialized=!0,this.options.onChange&&this.options.onChange(this.getValue(),this)}_mergeOptions(e){let t={fontSize:"14px",lineHeight:1.6,fontFamily:'"SF Mono", SFMono-Regular, Menlo, Monaco, "Cascadia Code", Consolas, "Roboto Mono", "Noto Sans Mono", "Droid Sans Mono", "Ubuntu Mono", "DejaVu Sans Mono", "Liberation Mono", "Courier New", Courier, monospace',padding:"16px",mobile:{fontSize:"16px",padding:"12px",lineHeight:1.5},textareaProps:{},autofocus:!1,autoResize:!1,minHeight:"100px",maxHeight:null,placeholder:"Start typing...",value:"",onChange:null,onKeydown:null,showActiveLineRaw:!1,showStats:!1,toolbar:!1,toolbarButtons:null,statsFormatter:null,smartLists:!0,codeHighlighter:null},{theme:n,colors:i,...r}=e;return{...t,...r}}_recoverFromDOM(e,t){if(e&&e.classList.contains("overtype-container"))this.container=e,this.wrapper=e.querySelector(".overtype-wrapper");else if(t){this.wrapper=t,this.container=document.createElement("div"),this.container.className="overtype-container";let n=this.instanceTheme||w.currentTheme||P,i=typeof n=="string"?n:n.name;if(i&&this.container.setAttribute("data-theme",i),this.instanceTheme){let r=typeof this.instanceTheme=="string"?B(this.instanceTheme):this.instanceTheme;if(r&&r.colors){let s=N(r.colors);this.container.style.cssText+=s}}t.parentNode.insertBefore(this.container,t),this.container.appendChild(t)}if(!this.wrapper){e&&e.remove(),t&&t.remove(),this._buildFromScratch();return}if(this.textarea=this.wrapper.querySelector(".overtype-input"),this.preview=this.wrapper.querySelector(".overtype-preview"),!this.textarea||!this.preview){this.container.remove(),this._buildFromScratch();return}this.wrapper._instance=this,this.options.fontSize&&this.wrapper.style.setProperty("--instance-font-size",this.options.fontSize),this.options.lineHeight&&this.wrapper.style.setProperty("--instance-line-height",String(this.options.lineHeight)),this.options.padding&&this.wrapper.style.setProperty("--instance-padding",this.options.padding),this._configureTextarea(),this._applyOptions()}_buildFromScratch(){let e=this._extractContent();this.element.innerHTML="",this._createDOM(),(e||this.options.value)&&this.setValue(e||this.options.value),this._applyOptions()}_extractContent(){let e=this.element.querySelector(".overtype-input");return e?e.value:this.element.textContent||""}_createDOM(){this.container=document.createElement("div"),this.container.className="overtype-container";let e=this.instanceTheme||w.currentTheme||P,t=typeof e=="string"?e:e.name;if(t&&this.container.setAttribute("data-theme",t),this.instanceTheme){let n=typeof this.instanceTheme=="string"?B(this.instanceTheme):this.instanceTheme;if(n&&n.colors){let i=N(n.colors);this.container.style.cssText+=i}}this.wrapper=document.createElement("div"),this.wrapper.className="overtype-wrapper",this.options.fontSize&&this.wrapper.style.setProperty("--instance-font-size",this.options.fontSize),this.options.lineHeight&&this.wrapper.style.setProperty("--instance-line-height",String(this.options.lineHeight)),this.options.padding&&this.wrapper.style.setProperty("--instance-padding",this.options.padding),this.wrapper._instance=this,this.textarea=document.createElement("textarea"),this.textarea.className="overtype-input",this.textarea.placeholder=this.options.placeholder,this._configureTextarea(),this.options.textareaProps&&Object.entries(this.options.textareaProps).forEach(([n,i])=>{n==="className"||n==="class"?this.textarea.className+=" "+i:n==="style"&&typeof i=="object"?Object.assign(this.textarea.style,i):this.textarea.setAttribute(n,i)}),this.preview=document.createElement("div"),this.preview.className="overtype-preview",this.preview.setAttribute("aria-hidden","true"),this.wrapper.appendChild(this.textarea),this.wrapper.appendChild(this.preview),this.container.appendChild(this.wrapper),this.options.showStats&&(this.statsBar=document.createElement("div"),this.statsBar.className="overtype-stats",this.container.appendChild(this.statsBar),this._updateStats()),this.element.appendChild(this.container),this.options.autoResize?this._setupAutoResize():this.container.classList.remove("overtype-auto-resize")}_configureTextarea(){this.textarea.setAttribute("autocomplete","off"),this.textarea.setAttribute("autocorrect","off"),this.textarea.setAttribute("autocapitalize","off"),this.textarea.setAttribute("spellcheck","false"),this.textarea.setAttribute("data-gramm","false"),this.textarea.setAttribute("data-gramm_editor","false"),this.textarea.setAttribute("data-enable-grammarly","false")}_createToolbar(){let e=this.options.toolbarButtons||G;this.toolbar=new Z(this,{toolbarButtons:e}),this.toolbar.create(),this._toolbarSelectionListener=()=>{this.toolbar&&this.toolbar.updateButtonStates()},this._toolbarInputListener=()=>{this.toolbar&&this.toolbar.updateButtonStates()},this.textarea.addEventListener("selectionchange",this._toolbarSelectionListener),this.textarea.addEventListener("input",this._toolbarInputListener)}_cleanupToolbarListeners(){this._toolbarSelectionListener&&(this.textarea.removeEventListener("selectionchange",this._toolbarSelectionListener),this._toolbarSelectionListener=null),this._toolbarInputListener&&(this.textarea.removeEventListener("input",this._toolbarInputListener),this._toolbarInputListener=null)}_applyOptions(){this.options.autofocus&&this.textarea.focus(),this.options.autoResize?this.container.classList.contains("overtype-auto-resize")||this._setupAutoResize():this.container.classList.remove("overtype-auto-resize"),this.options.toolbar&&!this.toolbar?this._createToolbar():!this.options.toolbar&&this.toolbar&&(this._cleanupToolbarListeners(),this.toolbar.destroy(),this.toolbar=null),this.updatePreview()}updatePreview(){let e=this.textarea.value,t=this.textarea.selectionStart,n=this._getCurrentLine(e,t),i=this.container.dataset.mode==="preview",r=S.parse(e,n,this.options.showActiveLineRaw,this.options.codeHighlighter,i);this.preview.innerHTML=r||'<span style="color: #808080;">Start typing...</span>',this._applyCodeBlockBackgrounds(),this.options.showStats&&this.statsBar&&this._updateStats(),this.options.onChange&&this.initialized&&this.options.onChange(e,this)}_applyCodeBlockBackgrounds(){let e=this.preview.querySelectorAll(".code-fence");for(let t=0;t<e.length-1;t+=2){let n=e[t],i=e[t+1],r=n.parentElement,s=i.parentElement;!r||!s||(n.style.display="block",i.style.display="block",r.classList.add("code-block-line"),s.classList.add("code-block-line"))}}_getCurrentLine(e,t){return e.substring(0,t).split(`
 `).length-1}handleInput(e){this.updatePreview()}handleKeydown(e){if(e.key==="Tab"){e.preventDefault();let n=this.textarea.selectionStart,i=this.textarea.selectionEnd,r=this.textarea.value;if(n!==i&&e.shiftKey){let s=r.substring(0,n),a=r.substring(n,i),p=r.substring(i),l=a.split(`
 `).map(c=>c.replace(/^  /,"")).join(`
 `);document.execCommand?(this.textarea.setSelectionRange(n,i),document.execCommand("insertText",!1,l)):(this.textarea.value=s+l+p,this.textarea.selectionStart=n,this.textarea.selectionEnd=n+l.length)}else if(n!==i){let s=r.substring(0,n),a=r.substring(n,i),p=r.substring(i),l=a.split(`

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "overtype",
-  "version": "2.0.3",
+  "version": "2.0.5",
   "description": "A lightweight markdown editor library with perfect WYSIWYG alignment using an invisible textarea overlay",
   "main": "dist/overtype.cjs",
   "module": "dist/overtype.esm.js",
@@ -26,7 +26,8 @@
   },
   "type": "module",
   "scripts": {
-    "build": "node scripts/build.js",
+    "generate:types": "node scripts/generate-types.js",
+    "build": "npm run generate:types && node scripts/build.js",
     "build:prod": "npm test && npm run build",
     "dev": "http-server website -p 8080 -c-1",
     "watch": "node scripts/build.js --watch",

package/src/overtype-webcomponent.js

@@ -315,8 +315,12 @@ class OverTypeEditor extends HTMLElement {
         break;
 
       case 'theme':
-        // Theme changes require re-injecting styles
+        // Theme changes require re-injecting styles and updating the editor instance
         this._reinjectStyles();
+        // Update the OverType instance's theme so it sets data-theme attribute
+        if (this._editor && this._editor.setTheme) {
+          this._editor.setTheme(value || 'solar');
+        }
         break;
 
       case 'placeholder':

package/src/overtype.d.ts

@@ -1,35 +1,41 @@
 // Type definitions for OverType
 // Project: https://github.com/panphora/overtype
-// Definitions generated from JSDoc comments and implementation
+// Definitions generated from themes.js and styles.js
+// DO NOT EDIT MANUALLY - Run 'npm run generate:types' to regenerate
 
 export interface Theme {
   name: string;
   colors: {
     bgPrimary?: string;
     bgSecondary?: string;
-    text?: string;
-    textSecondary?: string;
+    blockquote?: string;
+    border?: string;
+    code?: string;
+    codeBg?: string;
+    cursor?: string;
+    del?: string;
+    em?: string;
     h1?: string;
     h2?: string;
     h3?: string;
-    strong?: string;
-    em?: string;
-    link?: string;
-    code?: string;
-    codeBg?: string;
-    blockquote?: string;
+    hoverBg?: string;
     hr?: string;
-    syntaxMarker?: string;
+    link?: string;
     listMarker?: string;
-    cursor?: string;
-    selection?: string;
+    primary?: string;
     rawLine?: string;
-    // Toolbar theme colors
+    selection?: string;
+    strong?: string;
+    syntax?: string;
+    syntaxMarker?: string;
+    text?: string;
+    textPrimary?: string;
+    textSecondary?: string;
+    toolbarActive?: string;
     toolbarBg?: string;
-    toolbarIcon?: string;
+    toolbarBorder?: string;
     toolbarHover?: string;
-    toolbarActive?: string;
-    border?: string;
+    toolbarIcon?: string;
   };
 }
 
@@ -166,12 +172,12 @@ export interface OverTypeInstance {
   setTheme(theme: string | Theme): this;
   setCodeHighlighter(highlighter: ((code: string, language: string) => string) | null): void;
   updatePreview(): void;
-  
+
   // HTML output methods
   getRenderedHTML(options?: RenderOptions): string;
   getCleanHTML(): string;
   getPreviewHTML(): string;
-  
+
   // View mode methods
   showNormalEditMode(): this;
   showPlainTextarea(): this;
@@ -209,4 +215,4 @@ export const toolbarButtons: {
 /**
  * Default toolbar button layout with separators
  */
-export const defaultToolbarButtons: ToolbarButton[];
+export const defaultToolbarButtons: ToolbarButton[];

package/src/overtype.js

@@ -103,6 +103,16 @@ class OverType {
       // Setup link tooltip
       this.linkTooltip = new LinkTooltip(this);
 
+      // Sync scroll positions on initial render
+      // This ensures textarea matches preview scroll if page is reloaded while scrolled
+      // Double requestAnimationFrame waits for browser to restore scroll position
+      requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          this.textarea.scrollTop = this.preview.scrollTop;
+          this.textarea.scrollLeft = this.preview.scrollLeft;
+        });
+      });
+
       // Mark as initialized
       this.initialized = true;
 

package/src/styles.js

@@ -456,6 +456,8 @@ export function generateStyles(options = {}) {
       font-size: 0.85rem !important;
       color: #666 !important;
       flex-shrink: 0 !important; /* Don't shrink */
+      z-index: 10001 !important; /* Above link tooltip */
+      position: relative !important; /* Enable z-index */
     }
     
     /* Dark theme stats bar */
@@ -493,6 +495,7 @@ export function generateStyles(options = {}) {
       gap: 4px !important;
       padding: 8px !important; /* Override reset */
       background: var(--toolbar-bg, var(--bg-primary, #f8f9fa)) !important; /* Override reset */
+      border-bottom: 1px solid var(--toolbar-border, transparent) !important; /* Override reset */
       overflow-x: auto !important; /* Allow horizontal scrolling */
       overflow-y: hidden !important; /* Hide vertical overflow */
       -webkit-overflow-scrolling: touch !important;

package/src/themes.js

@@ -12,23 +12,30 @@ export const solar = {
     bgPrimary: '#faf0ca',        // Lemon Chiffon - main background
     bgSecondary: '#ffffff',      // White - editor background
     text: '#0d3b66',             // Yale Blue - main text
+    textPrimary: '#0d3b66',      // Yale Blue - primary text (same as text)
+    textSecondary: '#5a7a9b',    // Muted blue - secondary text
     h1: '#f95738',               // Tomato - h1 headers
-    h2: '#ee964b',               // Sandy Brown - h2 headers  
+    h2: '#ee964b',               // Sandy Brown - h2 headers
     h3: '#3d8a51',               // Forest green - h3 headers
     strong: '#ee964b',           // Sandy Brown - bold text
     em: '#f95738',               // Tomato - italic text
+    del: '#ee964b',              // Sandy Brown - deleted text (same as strong)
     link: '#0d3b66',             // Yale Blue - links
     code: '#0d3b66',             // Yale Blue - inline code
     codeBg: 'rgba(244, 211, 94, 0.4)', // Naples Yellow with transparency
     blockquote: '#5a7a9b',       // Muted blue - blockquotes
     hr: '#5a7a9b',               // Muted blue - horizontal rules
     syntaxMarker: 'rgba(13, 59, 102, 0.52)', // Yale Blue with transparency
+    syntax: '#999999',           // Gray - syntax highlighting fallback
     cursor: '#f95738',           // Tomato - cursor
     selection: 'rgba(244, 211, 94, 0.4)', // Naples Yellow with transparency
     listMarker: '#ee964b',       // Sandy Brown - list markers
+    rawLine: '#5a7a9b',          // Muted blue - raw line indicators
+    border: '#e0e0e0',           // Light gray - borders
+    hoverBg: '#f0f0f0',          // Very light gray - hover backgrounds
+    primary: '#0d3b66',          // Yale Blue - primary accent
     // Toolbar colors
     toolbarBg: '#ffffff',        // White - toolbar background
-    toolbarBorder: 'rgba(13, 59, 102, 0.15)', // Yale Blue border
     toolbarIcon: '#0d3b66',      // Yale Blue - icon color
     toolbarHover: '#f5f5f5',     // Light gray - hover background
     toolbarActive: '#faf0ca',    // Lemon Chiffon - active button background
@@ -44,23 +51,30 @@ export const cave = {
     bgPrimary: '#141E26',        // Deep ocean - main background
     bgSecondary: '#1D2D3E',      // Darker charcoal - editor background
     text: '#c5dde8',             // Light blue-gray - main text
+    textPrimary: '#c5dde8',      // Light blue-gray - primary text (same as text)
+    textSecondary: '#9fcfec',    // Brighter blue - secondary text
     h1: '#d4a5ff',               // Rich lavender - h1 headers
     h2: '#f6ae2d',               // Hunyadi Yellow - h2 headers
     h3: '#9fcfec',               // Brighter blue - h3 headers
     strong: '#f6ae2d',           // Hunyadi Yellow - bold text
     em: '#9fcfec',               // Brighter blue - italic text
+    del: '#f6ae2d',              // Hunyadi Yellow - deleted text (same as strong)
     link: '#9fcfec',             // Brighter blue - links
     code: '#c5dde8',             // Light blue-gray - inline code
     codeBg: '#1a232b',           // Very dark blue - code background
     blockquote: '#9fcfec',       // Brighter blue - same as italic
     hr: '#c5dde8',               // Light blue-gray - horizontal rules
     syntaxMarker: 'rgba(159, 207, 236, 0.73)', // Brighter blue semi-transparent
+    syntax: '#7a8c98',           // Muted gray-blue - syntax highlighting fallback
     cursor: '#f26419',           // Orange Pantone - cursor
     selection: 'rgba(51, 101, 138, 0.4)', // Lapis Lazuli with transparency
     listMarker: '#f6ae2d',       // Hunyadi Yellow - list markers
+    rawLine: '#9fcfec',          // Brighter blue - raw line indicators
+    border: '#2a3f52',           // Dark blue-gray - borders
+    hoverBg: '#243546',          // Slightly lighter charcoal - hover backgrounds
+    primary: '#9fcfec',          // Brighter blue - primary accent
     // Toolbar colors for dark theme
     toolbarBg: '#1D2D3E',        // Darker charcoal - toolbar background
-    toolbarBorder: 'rgba(197, 221, 232, 0.1)', // Light blue-gray border
     toolbarIcon: '#c5dde8',      // Light blue-gray - icon color
     toolbarHover: '#243546',     // Slightly lighter charcoal - hover background
     toolbarActive: '#2a3f52',    // Even lighter - active button background