@trustquery/browser 0.1.0 → 0.2.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trustquery/browser",
-  "version": "0.1.0",
+  "version": "0.2.1",
   "description": "Turn any textarea into an interactive trigger-based editor with inline styling",
   "type": "module",
   "main": "dist/trustquery.js",

package/src/CommandScanner.js

@@ -103,8 +103,6 @@ export default class CommandScanner {
     // Sort by length (longest first) to match longer patterns first
     commands.sort((a, b) => b.match.length - a.match.length);
 
-    console.log('[CommandScanner] Parsed commands:', commands.length, commands);
-
     return commands;
   }
 
@@ -127,7 +125,11 @@ export default class CommandScanner {
       matches.push(...lineMatches);
     });
 
-    console.log('[CommandScanner] Found', matches.length, 'matches');
+    // Only log when matches are found
+    if (matches.length > 0) {
+      console.log(`[CommandScanner] Found ${matches.length} matches`);
+    }
+
     return matches;
   }
 

package/src/DropdownManager.js

@@ -21,7 +21,9 @@ export default class DropdownManager {
     this.selectedDropdownIndex = 0;
     this.keyboardHandler = null;
 
-    console.log('[DropdownManager] Initialized with offset:', this.options.dropdownOffset);
+    if (this.options.debug) {
+      console.log('[DropdownManager] Initialized with offset:', this.options.dropdownOffset);
+    }
   }
 
   /**
@@ -102,7 +104,9 @@ export default class DropdownManager {
       document.addEventListener('click', this.closeDropdownHandler);
     }, 0);
 
-    console.log('[DropdownManager] Dropdown shown with', options.length, 'options');
+    if (this.options.debug) {
+      console.log('[DropdownManager] Dropdown shown with', options.length, 'options');
+    }
   }
 
   /**
@@ -536,7 +540,9 @@ export default class DropdownManager {
    * @param {Object} matchData - Match data
    */
   handleDropdownSelect(option, matchData) {
-    console.log('[DropdownManager] Dropdown option selected:', option, 'for:', matchData.text);
+    if (this.options.debug) {
+      console.log('[DropdownManager] Dropdown option selected:', option, 'for:', matchData.text);
+    }
 
     // Check if option has on-select.display
     if (option['on-select'] && option['on-select'].display && this.options.textarea) {
@@ -562,7 +568,9 @@ export default class DropdownManager {
         const inputEvent = new Event('input', { bubbles: true });
         textarea.dispatchEvent(inputEvent);
 
-        console.log('[DropdownManager] Appended to', matchData.text, '→', newText);
+        if (this.options.debug) {
+          console.log('[DropdownManager] Appended to', matchData.text, '→', newText);
+        }
       }
     }
 
@@ -587,6 +595,8 @@ export default class DropdownManager {
    */
   destroy() {
     this.cleanup();
-    console.log('[DropdownManager] Destroyed');
+    if (this.options.debug) {
+      console.log('[DropdownManager] Destroyed');
+    }
   }
 }

package/src/InteractionHandler.js

@@ -28,17 +28,21 @@ export default class InteractionHandler {
     this.bubbleManager = new BubbleManager({
       bubbleDelay: this.options.bubbleDelay,
       styleManager: this.options.styleManager,
-      commandHandlers: this.options.commandHandlers
+      commandHandlers: this.options.commandHandlers,
+      debug: this.options.debug
     });
 
     this.dropdownManager = new DropdownManager({
       styleManager: this.options.styleManager,
       textarea: this.options.textarea,
       onWordClick: this.options.onWordClick,
-      dropdownOffset: this.options.dropdownOffset
+      dropdownOffset: this.options.dropdownOffset,
+      debug: this.options.debug
     });
 
-    console.log('[InteractionHandler] Initialized');
+    if (this.options.debug) {
+      console.log('[InteractionHandler] Initialized');
+    }
   }
 
   /**
@@ -76,7 +80,9 @@ export default class InteractionHandler {
       }
     });
 
-    console.log('[InteractionHandler] Updated with', matches.length, 'interactive elements');
+    if (this.options.debug) {
+      console.log('[InteractionHandler] Updated with', matches.length, 'interactive elements');
+    }
   }
 
   /**

package/src/OverlayRenderer.js

@@ -12,10 +12,13 @@ export default class OverlayRenderer {
     this.options = {
       theme: options.theme || 'light',
       commandHandlers: options.commandHandlers || null,
+      debug: options.debug || false,
       ...options
     };
 
-    console.log('[OverlayRenderer] Initialized');
+    if (this.options.debug) {
+      console.log('[OverlayRenderer] Initialized');
+    }
   }
 
   /**
@@ -35,7 +38,9 @@ export default class OverlayRenderer {
     // Update overlay
     this.overlay.innerHTML = linesHTML;
 
-    console.log('[OverlayRenderer] Rendered', lines.length, 'lines with', matches.length, 'matches');
+    if (this.options.debug) {
+      console.log('[OverlayRenderer] Rendered', lines.length, 'lines with', matches.length, 'matches');
+    }
   }
 
   /**

package/src/TrustQuery.js

@@ -7,6 +7,7 @@ import InteractionHandler from './InteractionHandler.js';
 import StyleManager from './StyleManager.js';
 import CommandHandlerRegistry from './CommandHandlers.js';
 import AutoGrow from './AutoGrow.js';
+import ValidationStateManager from './ValidationStateManager.js';
 
 export default class TrustQuery {
   // Store all instances
@@ -108,6 +109,7 @@ export default class TrustQuery {
       // Events (callbacks)
       onWordClick: events.onWordClick || options.onWordClick || null,
       onWordHover: events.onWordHover || options.onWordHover || null,
+      onValidationChange: events.onValidationChange || options.onValidationChange || null,
 
       // Theme/style options (passed to StyleManager)
       backgroundColor: ui.backgroundColor || options.backgroundColor,
@@ -144,7 +146,8 @@ export default class TrustQuery {
     // Initialize renderer
     this.renderer = new OverlayRenderer(this.overlay, {
       theme: this.options.theme,
-      commandHandlers: this.commandHandlers // Pass handlers for styling
+      commandHandlers: this.commandHandlers, // Pass handlers for styling
+      debug: this.options.debug // Pass debug flag
     });
 
     // Initialize scanner (will be configured when command map loads)
@@ -158,7 +161,13 @@ export default class TrustQuery {
       onWordHover: this.options.onWordHover,
       styleManager: this.styleManager, // Pass style manager for bubbles/dropdowns
       commandHandlers: this.commandHandlers, // Pass handlers for bubble content
-      textarea: this.textarea // Pass textarea for on-select display updates
+      textarea: this.textarea, // Pass textarea for on-select display updates
+      debug: this.options.debug // Pass debug flag
+    });
+
+    // Initialize validation state manager
+    this.validationStateManager = new ValidationStateManager({
+      onValidationChange: this.options.onValidationChange
     });
 
     // Initialize features
@@ -357,6 +366,11 @@ export default class TrustQuery {
 
     // Update interaction handler with new elements
     this.interactionHandler.update();
+
+    // Update validation state
+    if (this.validationStateManager) {
+      this.validationStateManager.update(matches);
+    }
   }
 
   /**

package/src/ValidationStateManager.js

@@ -0,0 +1,105 @@
+// ValidationStateManager - Tracks validation state and triggers callbacks
+
+export default class ValidationStateManager {
+  /**
+   * Create validation state manager
+   * @param {Object} options - Configuration
+   */
+  constructor(options = {}) {
+    this.options = {
+      onValidationChange: options.onValidationChange || null,
+      ...options
+    };
+
+    this.state = {
+      hasBlockingError: false,
+      errors: [],      // matches with message-state: 'error'
+      warnings: [],    // matches with message-state: 'warning'
+      info: []         // matches with message-state: 'info'
+    };
+
+    console.log('[ValidationStateManager] Initialized');
+  }
+
+  /**
+   * Update validation state based on current matches
+   * @param {Array} matches - Current matches from scanner
+   */
+  update(matches) {
+    // Reset state
+    const newState = {
+      hasBlockingError: false,
+      errors: [],
+      warnings: [],
+      info: []
+    };
+
+    // Categorize current matches
+    matches.forEach(match => {
+      const messageState = match.intent?.handler?.['message-state'];
+      const blockSubmit = match.intent?.handler?.['block-submit'] === true;
+
+      if (blockSubmit) {
+        newState.hasBlockingError = true;
+      }
+
+      switch (messageState) {
+        case 'error':
+          newState.errors.push(match);
+          break;
+        case 'warning':
+          newState.warnings.push(match);
+          break;
+        case 'info':
+          newState.info.push(match);
+          break;
+      }
+    });
+
+    // Check if state changed
+    const stateChanged =
+      this.state.hasBlockingError !== newState.hasBlockingError ||
+      this.state.errors.length !== newState.errors.length ||
+      this.state.warnings.length !== newState.warnings.length ||
+      this.state.info.length !== newState.info.length;
+
+    if (stateChanged) {
+      this.state = newState;
+
+      // Trigger callback
+      if (this.options.onValidationChange) {
+        this.options.onValidationChange(this.state);
+      }
+
+      console.log('[ValidationStateManager] State changed:', {
+        hasBlockingError: newState.hasBlockingError,
+        errors: newState.errors.length,
+        warnings: newState.warnings.length,
+        info: newState.info.length
+      });
+    }
+  }
+
+  /**
+   * Get current validation state
+   * @returns {Object} Current validation state
+   */
+  getState() {
+    return { ...this.state };
+  }
+
+  /**
+   * Reset validation state to empty
+   */
+  reset() {
+    this.update([]);
+  }
+
+  /**
+   * Check if there are blocking errors
+   * @returns {boolean} True if there are blocking errors
+   */
+  hasBlockingErrors() {
+    return this.state.hasBlockingError;
+  }
+}