ttp-agent-sdk 2.31.0 → 2.32.0

package/dist/demos/test-widget.html

@@ -328,6 +328,40 @@
         </div>
       </div>
 
+      <div class="info-box" style="margin-top: 24px;">
+        <h3>👁️ Visual Assistant Configuration</h3>
+        <div class="config-grid" style="margin-top: 16px;">
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="visualAssistantEnabled" checked>
+              <span>Enable Visual Assistant</span>
+            </label>
+          </div>
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="allowHighlight" checked>
+              <span>Allow Highlight</span>
+            </label>
+          </div>
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="allowScroll" checked>
+              <span>Allow Scroll</span>
+            </label>
+          </div>
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="allowNavigate" checked>
+              <span>Allow Navigate</span>
+            </label>
+          </div>
+        </div>
+        <p style="margin-top: 12px; font-size: 13px; color: #1e3a8a;">
+          Visual Assistant enables the agent to see and interact with your page DOM. 
+          When enabled, page context is sent with the hello message.
+        </p>
+      </div>
+
       <div class="button-group">
         <button class="btn btn-primary" id="initBtn">Initialize Widget</button>
         <button class="btn btn-secondary" id="destroyBtn">Destroy Widget</button>
@@ -447,6 +481,18 @@
             };
           }
 
+          // Add Visual Assistant configuration
+          const visualAssistantEnabled = document.getElementById('visualAssistantEnabled').checked;
+          if (visualAssistantEnabled) {
+            config.visualAssistant = {
+              enabled: true,
+              allowHighlight: document.getElementById('allowHighlight').checked,
+              allowScroll: document.getElementById('allowScroll').checked,
+              allowNavigate: document.getElementById('allowNavigate').checked
+            };
+            console.log('👁️ Visual Assistant enabled:', config.visualAssistant);
+          }
+
           console.log('Initializing widget with config:', config);
           console.log('TTPChatWidget constructor:', window.TTPChatWidget);
           window.widgetInstance = new window.TTPChatWidget(config);
@@ -498,6 +544,11 @@
         document.getElementById('language').value = 'en';
         document.getElementById('mode').value = 'unified';
         document.getElementById('primaryColor').value = '#7C3AED';
+        // Reset Visual Assistant settings
+        document.getElementById('visualAssistantEnabled').checked = true;
+        document.getElementById('allowHighlight').checked = true;
+        document.getElementById('allowScroll').checked = true;
+        document.getElementById('allowNavigate').checked = true;
       };
 
       // Attach event listeners to buttons after module loads

package/dist/examples/test-client-tools.html

@@ -251,7 +251,7 @@
   </div>
 
   <!-- Load the SDK from local dist -->
-  <script src="/dist/agent-widget.js"></script>
+  <script src="/dist/agent-widget.js?v=20250127"></script>
   
   <script>
     let widget = null;
@@ -312,6 +312,14 @@
           behavior: {
             mode: 'unified',
             startOpen: false
+          },
+          visualAssistant: {
+            enabled: true,
+            allowHighlight: true,
+            allowScroll: true,
+            allowNavigate: true,
+            allowFillForm: true,
+            allowClick: true
           }
         });
 

package/dist/examples/test-widget.html

@@ -328,6 +328,40 @@
         </div>
       </div>
 
+      <div class="info-box" style="margin-top: 24px;">
+        <h3>👁️ Visual Assistant Configuration</h3>
+        <div class="config-grid" style="margin-top: 16px;">
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="visualAssistantEnabled" checked>
+              <span>Enable Visual Assistant</span>
+            </label>
+          </div>
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="allowHighlight" checked>
+              <span>Allow Highlight</span>
+            </label>
+          </div>
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="allowScroll" checked>
+              <span>Allow Scroll</span>
+            </label>
+          </div>
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="allowNavigate" checked>
+              <span>Allow Navigate</span>
+            </label>
+          </div>
+        </div>
+        <p style="margin-top: 12px; font-size: 13px; color: #1e3a8a;">
+          Visual Assistant enables the agent to see and interact with your page DOM. 
+          When enabled, page context is sent with the hello message.
+        </p>
+      </div>
+
       <div class="button-group">
         <button class="btn btn-primary" id="initBtn">Initialize Widget</button>
         <button class="btn btn-secondary" id="destroyBtn">Destroy Widget</button>
@@ -447,6 +481,18 @@
             };
           }
 
+          // Add Visual Assistant configuration
+          const visualAssistantEnabled = document.getElementById('visualAssistantEnabled').checked;
+          if (visualAssistantEnabled) {
+            config.visualAssistant = {
+              enabled: true,
+              allowHighlight: document.getElementById('allowHighlight').checked,
+              allowScroll: document.getElementById('allowScroll').checked,
+              allowNavigate: document.getElementById('allowNavigate').checked
+            };
+            console.log('👁️ Visual Assistant enabled:', config.visualAssistant);
+          }
+
           console.log('Initializing widget with config:', config);
           console.log('TTPChatWidget constructor:', window.TTPChatWidget);
           window.widgetInstance = new window.TTPChatWidget(config);
@@ -498,6 +544,11 @@
         document.getElementById('language').value = 'en';
         document.getElementById('mode').value = 'unified';
         document.getElementById('primaryColor').value = '#7C3AED';
+        // Reset Visual Assistant settings
+        document.getElementById('visualAssistantEnabled').checked = true;
+        document.getElementById('allowHighlight').checked = true;
+        document.getElementById('allowScroll').checked = true;
+        document.getElementById('allowNavigate').checked = true;
       };
 
       // Attach event listeners to buttons after module loads

package/examples/test-client-tools.html

@@ -251,7 +251,7 @@
   </div>
 
   <!-- Load the SDK from local dist -->
-  <script src="/dist/agent-widget.js"></script>
+  <script src="/dist/agent-widget.js?v=20250127"></script>
   
   <script>
     let widget = null;
@@ -312,6 +312,14 @@
           behavior: {
             mode: 'unified',
             startOpen: false
+          },
+          visualAssistant: {
+            enabled: true,
+            allowHighlight: true,
+            allowScroll: true,
+            allowNavigate: true,
+            allowFillForm: true,
+            allowClick: true
           }
         });
 

package/examples/test-widget.html

@@ -328,6 +328,40 @@
         </div>
       </div>
 
+      <div class="info-box" style="margin-top: 24px;">
+        <h3>👁️ Visual Assistant Configuration</h3>
+        <div class="config-grid" style="margin-top: 16px;">
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="visualAssistantEnabled" checked>
+              <span>Enable Visual Assistant</span>
+            </label>
+          </div>
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="allowHighlight" checked>
+              <span>Allow Highlight</span>
+            </label>
+          </div>
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="allowScroll" checked>
+              <span>Allow Scroll</span>
+            </label>
+          </div>
+          <div class="config-group">
+            <label style="display: flex; align-items: center; gap: 8px;">
+              <input type="checkbox" id="allowNavigate" checked>
+              <span>Allow Navigate</span>
+            </label>
+          </div>
+        </div>
+        <p style="margin-top: 12px; font-size: 13px; color: #1e3a8a;">
+          Visual Assistant enables the agent to see and interact with your page DOM. 
+          When enabled, page context is sent with the hello message.
+        </p>
+      </div>
+
       <div class="button-group">
         <button class="btn btn-primary" id="initBtn">Initialize Widget</button>
         <button class="btn btn-secondary" id="destroyBtn">Destroy Widget</button>
@@ -447,6 +481,18 @@
             };
           }
 
+          // Add Visual Assistant configuration
+          const visualAssistantEnabled = document.getElementById('visualAssistantEnabled').checked;
+          if (visualAssistantEnabled) {
+            config.visualAssistant = {
+              enabled: true,
+              allowHighlight: document.getElementById('allowHighlight').checked,
+              allowScroll: document.getElementById('allowScroll').checked,
+              allowNavigate: document.getElementById('allowNavigate').checked
+            };
+            console.log('👁️ Visual Assistant enabled:', config.visualAssistant);
+          }
+
           console.log('Initializing widget with config:', config);
           console.log('TTPChatWidget constructor:', window.TTPChatWidget);
           window.widgetInstance = new window.TTPChatWidget(config);
@@ -498,6 +544,11 @@
         document.getElementById('language').value = 'en';
         document.getElementById('mode').value = 'unified';
         document.getElementById('primaryColor').value = '#7C3AED';
+        // Reset Visual Assistant settings
+        document.getElementById('visualAssistantEnabled').checked = true;
+        document.getElementById('allowHighlight').checked = true;
+        document.getElementById('allowScroll').checked = true;
+        document.getElementById('allowNavigate').checked = true;
       };
 
       // Attach event listeners to buttons after module loads

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ttp-agent-sdk",
-  "version": "2.31.0",
+  "version": "2.32.0",
   "description": "Comprehensive Voice Agent SDK with Customizable Widget - Real-time audio, WebSocket communication, React components, and extensive customization options",
   "main": "dist/agent-widget.js",
   "module": "dist/agent-widget.esm.js",