overtype 2.0.4 → 2.0.6

package/dist/overtype-webcomponent.js

@@ -1,5 +1,5 @@
 /**
- * OverType v2.0.4
+ * OverType v2.0.6
  * A lightweight markdown editor library with perfect WYSIWYG alignment
  * @license MIT
  * @author David Miranda
@@ -114,7 +114,7 @@ var OverTypeEditor = (() => {
      * @returns {string} Parsed bullet list item
      */
     static parseBulletList(html) {
-      return html.replace(/^((?: )*)([-*])\s(.+)$/, (match, indent, marker, content) => {
+      return html.replace(/^((?: )*)([-*+])\s(.+)$/, (match, indent, marker, content) => {
         return `${indent}<li class="bullet-list"><span class="syntax-marker">${marker} </span>${content}</li>`;
       });
     }
@@ -173,7 +173,7 @@ var OverTypeEditor = (() => {
      * @returns {string} HTML with italic styling
      */
     static parseItalic(html) {
-      html = html.replace(new RegExp("(?<!\\*)\\*(?!\\*)(.+?)(?<!\\*)\\*(?!\\*)", "g"), '<em><span class="syntax-marker">*</span>$1<span class="syntax-marker">*</span></em>');
+      html = html.replace(new RegExp("(?<![\\*>])\\*(?!\\*)(.+?)(?<!\\*)\\*(?!\\*)", "g"), '<em><span class="syntax-marker">*</span>$1<span class="syntax-marker">*</span></em>');
       html = html.replace(new RegExp("(?<=^|\\s)_(?!_)(.+?)(?<!_)_(?!_)(?=\\s|$)", "g"), '<em><span class="syntax-marker">_</span>$1<span class="syntax-marker">_</span></em>');
       return html;
     }
@@ -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",
@@ -2285,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;
@@ -2756,6 +2785,28 @@ ${blockSuffix}` : suffix;
       button.addEventListener("click", button._clickHandler);
       return button;
     }
+    /**
+     * Handle button action programmatically (used by keyboard shortcuts)
+     * @param {Object} buttonConfig - Button configuration object with action function
+     */
+    async handleAction(buttonConfig) {
+      this.editor.textarea.focus();
+      try {
+        if (buttonConfig.action) {
+          await buttonConfig.action({
+            editor: this.editor,
+            getValue: () => this.editor.getValue(),
+            setValue: (value) => this.editor.setValue(value),
+            event: null
+          });
+        }
+      } catch (error) {
+        console.error(`Action "${buttonConfig.name}" error:`, error);
+        this.editor.wrapper.dispatchEvent(new CustomEvent("button-error", {
+          detail: { buttonName: buttonConfig.name, error }
+        }));
+      }
+    }
     /**
      * Sanitize SVG to prevent XSS
      */
@@ -3694,10 +3745,13 @@ ${blockSuffix}` : suffix;
      */
     handleKeydown(event) {
       if (event.key === "Tab") {
-        event.preventDefault();
         const start = this.textarea.selectionStart;
         const end = this.textarea.selectionEnd;
         const value = this.textarea.value;
+        if (event.shiftKey && start === end) {
+          return;
+        }
+        event.preventDefault();
         if (start !== end && event.shiftKey) {
           const before = value.substring(0, start);
           const selection = value.substring(start, end);
@@ -4534,6 +4588,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) {