overtype 2.0.3 → 2.0.5

package/dist/overtype-webcomponent.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
@@ -1683,16 +1683,22 @@ ${blockSuffix}` : suffix;
       // 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  
+      // 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",
@@ -1705,17 +1711,25 @@ ${blockSuffix}` : suffix;
       // 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",
@@ -1733,6 +1747,10 @@ ${blockSuffix}` : suffix;
       // 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",
@@ -1743,6 +1761,8 @@ ${blockSuffix}` : suffix;
       // 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",
@@ -1755,17 +1775,25 @@ ${blockSuffix}` : suffix;
       // 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",
@@ -2246,6 +2274,8 @@ ${blockSuffix}` : suffix;
       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 */
@@ -2283,6 +2313,7 @@ ${blockSuffix}` : suffix;
       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;
@@ -3356,6 +3387,12 @@ ${blockSuffix}` : suffix;
       }
       this.shortcuts = new ShortcutsManager(this);
       this.linkTooltip = new LinkTooltip(this);
+      requestAnimationFrame(() => {
+        requestAnimationFrame(() => {
+          this.textarea.scrollTop = this.preview.scrollTop;
+          this.textarea.scrollLeft = this.preview.scrollLeft;
+        });
+      });
       this.initialized = true;
       if (this.options.onChange) {
         this.options.onChange(this.getValue(), this);
@@ -4526,6 +4563,9 @@ ${blockSuffix}` : suffix;
           break;
         case "theme":
           this._reinjectStyles();
+          if (this._editor && this._editor.setTheme) {
+            this._editor.setTheme(value || "solar");
+          }
           break;
         case "placeholder":
           if (this._editor.textarea) {