@lookalike/widget 1.2.1 → 1.2.3

package/dist/lookalike-widget.js

@@ -10,7 +10,7 @@
 // Uses shadow DOM for complete encapsulation
 // Version 1.2.0 - Debug Enhanced
 
-const WIDGET_VERSION = '1.2.0';
+const WIDGET_VERSION = '1.2.3';
 const DEFAULT_UUID = '019b4c51-7701-726a-8f59-e89a854682f3';
 
 console.log(`🚀 Lookalike Widget v${WIDGET_VERSION} loading...`);
@@ -69,6 +69,19 @@ class LookalikeWidget extends HTMLElement {
 
   detectWixEmbed() {
     console.log('🔍 Starting Wix embed detection...');
+    console.log('🔗 Current URL:', window.location.href);
+    console.log('🔗 Search params:', window.location.search);
+    
+    // Check for force mode FIRST
+    const forceWixMode = window.location.search.includes('force-wix-mode') || 
+                        window.location.href.includes('force-wix-mode') ||
+                        document.querySelector('script[src*="force-wix-mode"]');
+    
+    if (forceWixMode) {
+      console.log('🧪 FORCE WIX MODE DETECTED - overriding all detection');
+      this.isInWixEmbed = true;
+      return;
+    }
     
     try {
       // Check if we're in an iframe and can't access parent
@@ -87,7 +100,9 @@ class LookalikeWidget extends HTMLElement {
         wixSearch, 
         wixReferrer,
         smallDimensions,
-        windowSize: `${window.innerWidth}x${window.innerHeight}`
+        windowSize: `${window.innerWidth}x${window.innerHeight}`,
+        referrer: document.referrer,
+        parentAccessible: this.canAccessParent()
       });
       
       const hasWixIndicators = wixHostname || wixSearch || wixReferrer || (inIframe && smallDimensions);
@@ -100,12 +115,6 @@ class LookalikeWidget extends HTMLElement {
         console.log('❌ Standard environment detected - using normal positioning');
       }
       
-      // Force Wix mode for testing if URL contains debug parameter
-      if (window.location.search.includes('force-wix-mode')) {
-        console.log('🧪 FORCE WIX MODE activated via URL parameter');
-        this.isInWixEmbed = true;
-      }
-      
     } catch (error) {
       // If we can't access parent due to cross-origin, assume we're in an embed
       console.log('⚠️ Cross-origin iframe error:', error.message);
@@ -114,6 +123,14 @@ class LookalikeWidget extends HTMLElement {
     }
   }
 
+  canAccessParent() {
+    try {
+      return !!window.parent.location.href;
+    } catch (e) {
+      return false;
+    }
+  }
+
   loadConfiguration() {
     // Read configuration from HTML attributes
     if (this.hasAttribute('uuid')) {
@@ -287,17 +304,19 @@ class LookalikeWidget extends HTMLElement {
       .debug-info {
         position: absolute;
         top: 10px;
-        left: 10px;
+        right: 10px;
         background: rgba(0, 0, 0, 0.8);
         color: white;
-        padding: 8px;
+        padding: 6px 8px;
         border-radius: 4px;
-        font-size: 11px;
+        font-size: 10px;
         font-family: monospace;
         z-index: 10000;
-        max-width: 300px;
+        max-width: 200px;
         pointer-events: none;
         white-space: pre-line;
+        opacity: 0.7;
+        transform: translateY(0);
       }
 
       :host(.wix-embed.collapsed) .wix-widget-container {
@@ -456,17 +475,15 @@ class LookalikeWidget extends HTMLElement {
     const debugDiv = document.createElement('div');
     debugDiv.className = 'debug-info';
     
-    const info = `Lookalike Widget v${WIDGET_VERSION}
-Mode: ${this.isInWixEmbed ? 'Wix Embed' : 'Standard'}
-Viewport: ${window.innerWidth}x${window.innerHeight}
-In iframe: ${window !== window.parent}
-Hostname: ${window.location.hostname}
-Classes: ${this.className}`;
+    const info = `v${WIDGET_VERSION} | ${this.isInWixEmbed ? 'Wix' : 'Std'}
+${window.innerWidth}x${window.innerHeight}
+iframe: ${window !== window.parent}
+classes: ${this.className}`;
     
     debugDiv.textContent = info;
     this.shadow.appendChild(debugDiv);
     
-    console.log('🐛 Debug info added to widget');
+    console.log('🐛 Debug info added to widget (top-right corner)');
   }
 
   buildIframeSrc() {

package/dist/lookalike-widget.min.js

@@ -5,4 +5,4 @@
  * Copy/paste embed widget for conversational AI avatars
  * Usage: <lookalike-widget uuid="your-uuid"></lookalike-widget>
  */
-const WIDGET_VERSION="1.2.0",DEFAULT_UUID="019b4c51-7701-726a-8f59-e89a854682f3";function getBaseUrl(){const e=window.location.hostname;return"localhost"===e||"127.0.0.1"===e?(console.log("🏠 Local development detected"),"http://localhost:3000"):(console.log("🌐 Using production URL"),"https://lookalike.com")}console.log("🚀 Lookalike Widget v1.2.0 loading...");const BASE_URL=getBaseUrl();class LookalikeWidget extends HTMLElement{constructor(){super(),this.config={storyfileUuid:null,primaryColor:"#2563eb",enableText:!0,enableVideo:!0,enableAudio:!0},this.currentIframe=null,this.shadow=null,this.messageHandler=null,this.isInWixEmbed=!1}connectedCallback(){console.log("🚀 Lookalike Widget v1.2.0 initializing..."),console.log("📊 Environment Info:",{hostname:window.location.hostname,href:window.location.href,referrer:document.referrer,userAgent:navigator.userAgent,viewport:`${window.innerWidth}x${window.innerHeight}`,inIframe:window!==window.parent}),this.detectWixEmbed(),this.shadow=this.attachShadow({mode:"closed"}),this.loadConfiguration(),this.initLive()}detectWixEmbed(){console.log("🔍 Starting Wix embed detection...");try{const e=window!==window.parent;console.log("📱 In iframe:",e);const n=window.location.hostname.includes("wix.com")||window.location.hostname.includes("wixsite.com"),i=window.location.search.includes("wix"),t=document.referrer.includes("wix"),o=window.innerWidth<500||window.innerHeight<300;console.log("🔍 Wix Detection Results:",{inIframe:e,wixHostname:n,wixSearch:i,wixReferrer:t,smallDimensions:o,windowSize:`${window.innerWidth}x${window.innerHeight}`});const s=n||i||t||e&&o;this.isInWixEmbed=e&&s,this.isInWixEmbed?console.log("✅ Wix embed environment DETECTED - using full-screen overlay mode"):console.log("❌ Standard environment detected - using normal positioning"),window.location.search.includes("force-wix-mode")&&(console.log("🧪 FORCE WIX MODE activated via URL parameter"),this.isInWixEmbed=!0)}catch(e){console.log("⚠️ Cross-origin iframe error:",e.message),this.isInWixEmbed=!0,console.log("🔒 Cross-origin iframe detected - using full-screen overlay mode")}}loadConfiguration(){this.hasAttribute("uuid")&&(this.config.storyfileUuid=this.getAttribute("uuid")),this.hasAttribute("color")&&(this.config.primaryColor=this.getAttribute("color")),this.hasAttribute("text")&&(this.config.enableText="false"!==this.getAttribute("text")),this.hasAttribute("video")&&(this.config.enableVideo="false"!==this.getAttribute("video")),this.hasAttribute("audio")&&(this.config.enableAudio="false"!==this.getAttribute("audio")),this.config.storyfileUuid||(this.config.storyfileUuid=DEFAULT_UUID,console.log("🔧 Using default UUID:",DEFAULT_UUID)),console.log("📥 Loaded config from attributes:",this.config)}static get observedAttributes(){return["uuid","color","text","video","audio"]}attributeChangedCallback(e,n,i){if(n!==i&&this.shadow){switch(console.log(`🔄 Attribute changed: ${e} = ${i}`),e){case"uuid":this.config.storyfileUuid=i;break;case"color":this.config.primaryColor=i;break;case"text":this.config.enableText="false"!==i;break;case"video":this.config.enableVideo="false"!==i;break;case"audio":this.config.enableAudio="false"!==i}console.log("🔄 Updated config after attribute change:",this.config),this.isConnected&&(this.shadow.innerHTML="",this.initLive())}}initLive(){console.log("🚀 Initializing live widget with config:",this.config),this.isInWixEmbed?this.initWixEmbedMode():this.initStandardMode(),this.injectShadowContent(),this.injectIframe()}initWixEmbedMode(){console.log("📱 Initializing Wix embed mode with full-screen overlay");const e="\n      position: fixed;\n      top: 0;\n      left: 0;\n      width: 100vw;\n      height: 100vh;\n      border: 0;\n      z-index: 9999;\n      background: transparent;\n      pointer-events: none;\n      display: block;\n    ";this.style.cssText=e,console.log("🎨 Applied overlay styles:",e),console.log("📏 Host element computed styles:",{position:getComputedStyle(this).position,width:getComputedStyle(this).width,height:getComputedStyle(this).height,zIndex:getComputedStyle(this).zIndex,pointerEvents:getComputedStyle(this).pointerEvents}),this.className="collapsed wix-embed",console.log("🏷️ Applied classes:",this.className)}initStandardMode(){console.log("💻 Initializing standard mode"),this.style.cssText="\n      position: fixed;\n      bottom: 16px;\n      right: 16px;\n      width: 380px;\n      height: 60px;\n      max-width: calc(100vw - 32px);\n      border: 0;\n      border-radius: 16px;\n      z-index: 9999;\n      box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);\n      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n      background: transparent;\n      display: block;\n    ",this.className="collapsed"}injectShadowContent(){const e=document.createElement("style");e.textContent="\n      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');\n      \n      :host {\n        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n      }\n\n      /* Standard mode styles */\n      :host(.collapsed:not(.wix-embed)) {\n        height: 60px !important;\n        max-height: 60px !important;\n      }\n\n      :host(.expanded:not(.wix-embed)) {\n        height: 520px;\n        max-height: calc(100vh - 32px);\n      }\n\n      /* Wix embed mode: container for positioned widget */\n      .wix-widget-container {\n        position: absolute;\n        bottom: 16px;\n        right: 16px;\n        width: 380px;\n        height: 60px;\n        max-width: calc(100vw - 32px);\n        border-radius: 16px;\n        box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);\n        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n        background: transparent;\n        pointer-events: auto;\n      }\n\n      /* Debug info overlay */\n      .debug-info {\n        position: absolute;\n        top: 10px;\n        left: 10px;\n        background: rgba(0, 0, 0, 0.8);\n        color: white;\n        padding: 8px;\n        border-radius: 4px;\n        font-size: 11px;\n        font-family: monospace;\n        z-index: 10000;\n        max-width: 300px;\n        pointer-events: none;\n        white-space: pre-line;\n      }\n\n      :host(.wix-embed.collapsed) .wix-widget-container {\n        height: 60px;\n      }\n\n      :host(.wix-embed.expanded) .wix-widget-container {\n        height: 520px;\n        max-height: calc(100vh - 32px);\n      }\n\n      @media (max-width: 639px) {\n        :host(.expanded:not(.wix-embed)) {\n          width: 100vw;\n          height: 100vh;\n          max-width: none;\n          max-height: none;\n          bottom: 0;\n          right: 0;\n          border-radius: 0;\n          box-shadow: none;\n        }\n        \n        :host(:not(.wix-embed)) {\n          width: calc(100vw - 16px);\n          right: 8px;\n          bottom: 8px;\n        }\n        \n        :host(.collapsed:not(.wix-embed)) {\n          height: 60px !important;\n          max-height: 60px !important;\n          width: calc(100vw - 16px);\n          right: 8px;\n          bottom: 8px;\n          border-radius: 16px;\n          box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);\n        }\n\n        /* Wix embed mobile styles */\n        :host(.wix-embed.expanded) .wix-widget-container {\n          width: 100vw;\n          height: 100vh;\n          max-width: none;\n          max-height: none;\n          bottom: 0;\n          right: 0;\n          border-radius: 0;\n          box-shadow: none;\n        }\n        \n        .wix-widget-container {\n          width: calc(100vw - 16px);\n          right: 8px;\n          bottom: 8px;\n        }\n        \n        :host(.wix-embed.collapsed) .wix-widget-container {\n          height: 60px !important;\n          width: calc(100vw - 16px);\n          right: 8px;\n          bottom: 8px;\n          border-radius: 16px;\n          box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);\n        }\n      }\n      \n      .loading {\n        background: #f3f4f6;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        width: 100%;\n        height: 100%;\n        border-radius: inherit;\n      }\n      \n      .loading::after {\n        content: 'Loading chat...';\n        color: #6b7280;\n        font-size: 14px;\n      }\n\n      .error-container {\n        width: 100%;\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-direction: column;\n        background: #f9fafb;\n        border-radius: inherit;\n        border: 2px dashed #d1d5db;\n        color: #6b7280;\n        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n        text-align: center;\n        padding: 20px;\n        box-sizing: border-box;\n      }\n\n      .error-icon {\n        font-size: 24px;\n        margin-bottom: 8px;\n      }\n\n      .error-title {\n        font-size: 14px;\n        font-weight: 500;\n        margin-bottom: 4px;\n      }\n\n      .error-message {\n        font-size: 12px;\n      }\n\n      .error-uuid {\n        font-size: 11px;\n        margin-top: 8px;\n        opacity: 0.7;\n      }\n\n      iframe {\n        width: 100%;\n        height: 100%;\n        border: 0;\n        border-radius: inherit;\n      }\n    ",this.shadow.appendChild(e),(window.location.search.includes("debug")||window.location.search.includes("force-wix-mode"))&&this.addDebugInfo();const n=document.createElement("div");this.isInWixEmbed?n.className="wix-widget-container":n.style.cssText="\n        width: 100%;\n        height: 100%;\n        border-radius: inherit;\n      ",this.shadow.appendChild(n)}addDebugInfo(){const e=document.createElement("div");e.className="debug-info";const n=`Lookalike Widget v1.2.0\nMode: ${this.isInWixEmbed?"Wix Embed":"Standard"}\nViewport: ${window.innerWidth}x${window.innerHeight}\nIn iframe: ${window!==window.parent}\nHostname: ${window.location.hostname}\nClasses: ${this.className}`;e.textContent=n,this.shadow.appendChild(e),console.log("🐛 Debug info added to widget")}buildIframeSrc(){if(!this.config.storyfileUuid)return console.error("❌ No storyfile UUID configured"),null;const e=new URL(`/${this.config.storyfileUuid}/chat`,BASE_URL);e.searchParams.set("embed",""),e.searchParams.set("variant","floating"),e.searchParams.set("anchor","bottom-right");const n=[];return this.config.enableText&&n.push("text"),this.config.enableAudio&&n.push("audio"),this.config.enableVideo&&n.push("video"),n.length>0&&n.length<3&&e.searchParams.set("modes",n.join(",")),this.config.primaryColor&&"#2563eb"!==this.config.primaryColor&&e.searchParams.set("theme",`primary:${this.config.primaryColor}`),console.log("🔗 Built iframe URL:",e.toString()),e.toString()}injectIframe(){const e=this.isInWixEmbed?".wix-widget-container":"div:last-child",n=this.shadow.querySelector(e);console.log("🖼️ Injecting iframe into container:",e),console.log("📦 Container found:",!!n),n&&(console.log("📐 Container rect:",n.getBoundingClientRect()),console.log("🎨 Container computed styles:",{position:getComputedStyle(n).position,width:getComputedStyle(n).width,height:getComputedStyle(n).height,bottom:getComputedStyle(n).bottom,right:getComputedStyle(n).right}));const i=n?.querySelector("iframe");i&&(console.log("🗑️ Removing existing iframe"),i.remove());const t=this.buildIframeSrc();if(!t)return void this.showConfigurationError(n);console.log("🔗 Creating iframe with src:",t);const o=document.createElement("iframe");o.className="loading",o.src=t,o.allow="microphone; camera",o.loading="lazy",o.setAttribute("sandbox","allow-scripts allow-same-origin allow-forms allow-popups allow-presentation"),o.onerror=e=>{console.error("❌ Failed to load widget iframe:",e),this.showLoadingError(n)},o.onload=()=>{console.log("✅ Iframe loaded successfully"),console.log("📐 Iframe rect after load:",o.getBoundingClientRect()),o.classList.remove("loading")},this.currentIframe=o,this.setupMessageHandling(o),n.appendChild(o),console.log("🎯 Iframe injection complete")}setupMessageHandling(e){this.messageHandler&&window.removeEventListener("message",this.messageHandler),this.messageHandler=n=>{if(console.log("📨 Received message:",n.data,"from:",n.origin),n.source===e.contentWindow&&"lookalike-widget-ready"===n.data?.type){console.log("🎉 Widget ready, setting up communication");const n=new MessageChannel;n.port1.onmessage=e=>{if(console.log("📏 Received resize message:",e.data),"lookalike-widget-resize"===e.data?.type){const n=e.data.collapsed?"collapsed":"expanded";console.log(`📏 Widget resize: ${this.className} → ${n}`),console.log("📐 Before resize - Host element rect:",this.getBoundingClientRect()),this.className=this.isInWixEmbed?`${n} wix-embed`:n,setTimeout(()=>{console.log("📐 After resize - Host element rect:",this.getBoundingClientRect());const e=this.shadow.querySelector(this.isInWixEmbed?".wix-widget-container":"div:last-child");e&&console.log("📐 Widget container rect:",e.getBoundingClientRect())},100)}},e.contentWindow.postMessage({type:"lookalike-init-channel"},BASE_URL,[n.port2])}},window.addEventListener("message",this.messageHandler),console.log("👂 Message handler installed")}showConfigurationError(e){e.innerHTML='\n      <div class="error-container">\n        <div class="error-icon">⚠️</div>\n        <div class="error-title">Configuration Error</div>\n        <div class="error-message">No UUID configured. Please add a uuid attribute.</div>\n        <div class="error-uuid">Expected: &lt;lookalike-widget uuid="your-uuid"&gt;</div>\n      </div>\n    '}showLoadingError(e){e.innerHTML=`\n      <div class="error-container">\n        <div class="error-icon">⚠️</div>\n        <div class="error-title">Widget Loading Error</div>\n        <div class="error-message">Check console for details</div>\n        <div class="error-uuid">UUID: ${this.config.storyfileUuid}</div>\n      </div>\n    `}disconnectedCallback(){this.messageHandler&&(window.removeEventListener("message",this.messageHandler),this.messageHandler=null)}}customElements.define("lookalike-widget",LookalikeWidget),"undefined"!=typeof module&&module.exports&&(module.exports=LookalikeWidget);
+const WIDGET_VERSION="1.2.3",DEFAULT_UUID="019b4c51-7701-726a-8f59-e89a854682f3";function getBaseUrl(){const e=window.location.hostname;return"localhost"===e||"127.0.0.1"===e?(console.log("🏠 Local development detected"),"http://localhost:3000"):(console.log("🌐 Using production URL"),"https://lookalike.com")}console.log("🚀 Lookalike Widget v1.2.3 loading...");const BASE_URL=getBaseUrl();class LookalikeWidget extends HTMLElement{constructor(){super(),this.config={storyfileUuid:null,primaryColor:"#2563eb",enableText:!0,enableVideo:!0,enableAudio:!0},this.currentIframe=null,this.shadow=null,this.messageHandler=null,this.isInWixEmbed=!1}connectedCallback(){console.log("🚀 Lookalike Widget v1.2.3 initializing..."),console.log("📊 Environment Info:",{hostname:window.location.hostname,href:window.location.href,referrer:document.referrer,userAgent:navigator.userAgent,viewport:`${window.innerWidth}x${window.innerHeight}`,inIframe:window!==window.parent}),this.detectWixEmbed(),this.shadow=this.attachShadow({mode:"closed"}),this.loadConfiguration(),this.initLive()}detectWixEmbed(){if(console.log("🔍 Starting Wix embed detection..."),console.log("🔗 Current URL:",window.location.href),console.log("🔗 Search params:",window.location.search),window.location.search.includes("force-wix-mode")||window.location.href.includes("force-wix-mode")||document.querySelector('script[src*="force-wix-mode"]'))return console.log("🧪 FORCE WIX MODE DETECTED - overriding all detection"),void(this.isInWixEmbed=!0);try{const e=window!==window.parent;console.log("📱 In iframe:",e);const n=window.location.hostname.includes("wix.com")||window.location.hostname.includes("wixsite.com"),i=window.location.search.includes("wix"),t=document.referrer.includes("wix"),o=window.innerWidth<500||window.innerHeight<300;console.log("🔍 Wix Detection Results:",{inIframe:e,wixHostname:n,wixSearch:i,wixReferrer:t,smallDimensions:o,windowSize:`${window.innerWidth}x${window.innerHeight}`,referrer:document.referrer,parentAccessible:this.canAccessParent()});const s=n||i||t||e&&o;this.isInWixEmbed=e&&s,this.isInWixEmbed?console.log("✅ Wix embed environment DETECTED - using full-screen overlay mode"):console.log("❌ Standard environment detected - using normal positioning")}catch(e){console.log("⚠️ Cross-origin iframe error:",e.message),this.isInWixEmbed=!0,console.log("🔒 Cross-origin iframe detected - using full-screen overlay mode")}}canAccessParent(){try{return!!window.parent.location.href}catch(e){return!1}}loadConfiguration(){this.hasAttribute("uuid")&&(this.config.storyfileUuid=this.getAttribute("uuid")),this.hasAttribute("color")&&(this.config.primaryColor=this.getAttribute("color")),this.hasAttribute("text")&&(this.config.enableText="false"!==this.getAttribute("text")),this.hasAttribute("video")&&(this.config.enableVideo="false"!==this.getAttribute("video")),this.hasAttribute("audio")&&(this.config.enableAudio="false"!==this.getAttribute("audio")),this.config.storyfileUuid||(this.config.storyfileUuid=DEFAULT_UUID,console.log("🔧 Using default UUID:",DEFAULT_UUID)),console.log("📥 Loaded config from attributes:",this.config)}static get observedAttributes(){return["uuid","color","text","video","audio"]}attributeChangedCallback(e,n,i){if(n!==i&&this.shadow){switch(console.log(`🔄 Attribute changed: ${e} = ${i}`),e){case"uuid":this.config.storyfileUuid=i;break;case"color":this.config.primaryColor=i;break;case"text":this.config.enableText="false"!==i;break;case"video":this.config.enableVideo="false"!==i;break;case"audio":this.config.enableAudio="false"!==i}console.log("🔄 Updated config after attribute change:",this.config),this.isConnected&&(this.shadow.innerHTML="",this.initLive())}}initLive(){console.log("🚀 Initializing live widget with config:",this.config),this.isInWixEmbed?this.initWixEmbedMode():this.initStandardMode(),this.injectShadowContent(),this.injectIframe()}initWixEmbedMode(){console.log("📱 Initializing Wix embed mode with full-screen overlay");const e="\n      position: fixed;\n      top: 0;\n      left: 0;\n      width: 100vw;\n      height: 100vh;\n      border: 0;\n      z-index: 9999;\n      background: transparent;\n      pointer-events: none;\n      display: block;\n    ";this.style.cssText=e,console.log("🎨 Applied overlay styles:",e),console.log("📏 Host element computed styles:",{position:getComputedStyle(this).position,width:getComputedStyle(this).width,height:getComputedStyle(this).height,zIndex:getComputedStyle(this).zIndex,pointerEvents:getComputedStyle(this).pointerEvents}),this.className="collapsed wix-embed",console.log("🏷️ Applied classes:",this.className)}initStandardMode(){console.log("💻 Initializing standard mode"),this.style.cssText="\n      position: fixed;\n      bottom: 16px;\n      right: 16px;\n      width: 380px;\n      height: 60px;\n      max-width: calc(100vw - 32px);\n      border: 0;\n      border-radius: 16px;\n      z-index: 9999;\n      box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);\n      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n      background: transparent;\n      display: block;\n    ",this.className="collapsed"}injectShadowContent(){const e=document.createElement("style");e.textContent="\n      @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap');\n      \n      :host {\n        font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n      }\n\n      /* Standard mode styles */\n      :host(.collapsed:not(.wix-embed)) {\n        height: 60px !important;\n        max-height: 60px !important;\n      }\n\n      :host(.expanded:not(.wix-embed)) {\n        height: 520px;\n        max-height: calc(100vh - 32px);\n      }\n\n      /* Wix embed mode: container for positioned widget */\n      .wix-widget-container {\n        position: absolute;\n        bottom: 16px;\n        right: 16px;\n        width: 380px;\n        height: 60px;\n        max-width: calc(100vw - 32px);\n        border-radius: 16px;\n        box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);\n        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);\n        background: transparent;\n        pointer-events: auto;\n      }\n\n      /* Debug info overlay */\n      .debug-info {\n        position: absolute;\n        top: 10px;\n        right: 10px;\n        background: rgba(0, 0, 0, 0.8);\n        color: white;\n        padding: 6px 8px;\n        border-radius: 4px;\n        font-size: 10px;\n        font-family: monospace;\n        z-index: 10000;\n        max-width: 200px;\n        pointer-events: none;\n        white-space: pre-line;\n        opacity: 0.7;\n        transform: translateY(0);\n      }\n\n      :host(.wix-embed.collapsed) .wix-widget-container {\n        height: 60px;\n      }\n\n      :host(.wix-embed.expanded) .wix-widget-container {\n        height: 520px;\n        max-height: calc(100vh - 32px);\n      }\n\n      @media (max-width: 639px) {\n        :host(.expanded:not(.wix-embed)) {\n          width: 100vw;\n          height: 100vh;\n          max-width: none;\n          max-height: none;\n          bottom: 0;\n          right: 0;\n          border-radius: 0;\n          box-shadow: none;\n        }\n        \n        :host(:not(.wix-embed)) {\n          width: calc(100vw - 16px);\n          right: 8px;\n          bottom: 8px;\n        }\n        \n        :host(.collapsed:not(.wix-embed)) {\n          height: 60px !important;\n          max-height: 60px !important;\n          width: calc(100vw - 16px);\n          right: 8px;\n          bottom: 8px;\n          border-radius: 16px;\n          box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);\n        }\n\n        /* Wix embed mobile styles */\n        :host(.wix-embed.expanded) .wix-widget-container {\n          width: 100vw;\n          height: 100vh;\n          max-width: none;\n          max-height: none;\n          bottom: 0;\n          right: 0;\n          border-radius: 0;\n          box-shadow: none;\n        }\n        \n        .wix-widget-container {\n          width: calc(100vw - 16px);\n          right: 8px;\n          bottom: 8px;\n        }\n        \n        :host(.wix-embed.collapsed) .wix-widget-container {\n          height: 60px !important;\n          width: calc(100vw - 16px);\n          right: 8px;\n          bottom: 8px;\n          border-radius: 16px;\n          box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);\n        }\n      }\n      \n      .loading {\n        background: #f3f4f6;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        width: 100%;\n        height: 100%;\n        border-radius: inherit;\n      }\n      \n      .loading::after {\n        content: 'Loading chat...';\n        color: #6b7280;\n        font-size: 14px;\n      }\n\n      .error-container {\n        width: 100%;\n        height: 100%;\n        display: flex;\n        align-items: center;\n        justify-content: center;\n        flex-direction: column;\n        background: #f9fafb;\n        border-radius: inherit;\n        border: 2px dashed #d1d5db;\n        color: #6b7280;\n        font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n        text-align: center;\n        padding: 20px;\n        box-sizing: border-box;\n      }\n\n      .error-icon {\n        font-size: 24px;\n        margin-bottom: 8px;\n      }\n\n      .error-title {\n        font-size: 14px;\n        font-weight: 500;\n        margin-bottom: 4px;\n      }\n\n      .error-message {\n        font-size: 12px;\n      }\n\n      .error-uuid {\n        font-size: 11px;\n        margin-top: 8px;\n        opacity: 0.7;\n      }\n\n      iframe {\n        width: 100%;\n        height: 100%;\n        border: 0;\n        border-radius: inherit;\n      }\n    ",this.shadow.appendChild(e),(window.location.search.includes("debug")||window.location.search.includes("force-wix-mode"))&&this.addDebugInfo();const n=document.createElement("div");this.isInWixEmbed?n.className="wix-widget-container":n.style.cssText="\n        width: 100%;\n        height: 100%;\n        border-radius: inherit;\n      ",this.shadow.appendChild(n)}addDebugInfo(){const e=document.createElement("div");e.className="debug-info";const n=`v1.2.3 | ${this.isInWixEmbed?"Wix":"Std"}\n${window.innerWidth}x${window.innerHeight}\niframe: ${window!==window.parent}\nclasses: ${this.className}`;e.textContent=n,this.shadow.appendChild(e),console.log("🐛 Debug info added to widget (top-right corner)")}buildIframeSrc(){if(!this.config.storyfileUuid)return console.error("❌ No storyfile UUID configured"),null;const e=new URL(`/${this.config.storyfileUuid}/chat`,BASE_URL);e.searchParams.set("embed",""),e.searchParams.set("variant","floating"),e.searchParams.set("anchor","bottom-right");const n=[];return this.config.enableText&&n.push("text"),this.config.enableAudio&&n.push("audio"),this.config.enableVideo&&n.push("video"),n.length>0&&n.length<3&&e.searchParams.set("modes",n.join(",")),this.config.primaryColor&&"#2563eb"!==this.config.primaryColor&&e.searchParams.set("theme",`primary:${this.config.primaryColor}`),console.log("🔗 Built iframe URL:",e.toString()),e.toString()}injectIframe(){const e=this.isInWixEmbed?".wix-widget-container":"div:last-child",n=this.shadow.querySelector(e);console.log("🖼️ Injecting iframe into container:",e),console.log("📦 Container found:",!!n),n&&(console.log("📐 Container rect:",n.getBoundingClientRect()),console.log("🎨 Container computed styles:",{position:getComputedStyle(n).position,width:getComputedStyle(n).width,height:getComputedStyle(n).height,bottom:getComputedStyle(n).bottom,right:getComputedStyle(n).right}));const i=n?.querySelector("iframe");i&&(console.log("🗑️ Removing existing iframe"),i.remove());const t=this.buildIframeSrc();if(!t)return void this.showConfigurationError(n);console.log("🔗 Creating iframe with src:",t);const o=document.createElement("iframe");o.className="loading",o.src=t,o.allow="microphone; camera",o.loading="lazy",o.setAttribute("sandbox","allow-scripts allow-same-origin allow-forms allow-popups allow-presentation"),o.onerror=e=>{console.error("❌ Failed to load widget iframe:",e),this.showLoadingError(n)},o.onload=()=>{console.log("✅ Iframe loaded successfully"),console.log("📐 Iframe rect after load:",o.getBoundingClientRect()),o.classList.remove("loading")},this.currentIframe=o,this.setupMessageHandling(o),n.appendChild(o),console.log("🎯 Iframe injection complete")}setupMessageHandling(e){this.messageHandler&&window.removeEventListener("message",this.messageHandler),this.messageHandler=n=>{if(console.log("📨 Received message:",n.data,"from:",n.origin),n.source===e.contentWindow&&"lookalike-widget-ready"===n.data?.type){console.log("🎉 Widget ready, setting up communication");const n=new MessageChannel;n.port1.onmessage=e=>{if(console.log("📏 Received resize message:",e.data),"lookalike-widget-resize"===e.data?.type){const n=e.data.collapsed?"collapsed":"expanded";console.log(`📏 Widget resize: ${this.className} → ${n}`),console.log("📐 Before resize - Host element rect:",this.getBoundingClientRect()),this.className=this.isInWixEmbed?`${n} wix-embed`:n,setTimeout(()=>{console.log("📐 After resize - Host element rect:",this.getBoundingClientRect());const e=this.shadow.querySelector(this.isInWixEmbed?".wix-widget-container":"div:last-child");e&&console.log("📐 Widget container rect:",e.getBoundingClientRect())},100)}},e.contentWindow.postMessage({type:"lookalike-init-channel"},BASE_URL,[n.port2])}},window.addEventListener("message",this.messageHandler),console.log("👂 Message handler installed")}showConfigurationError(e){e.innerHTML='\n      <div class="error-container">\n        <div class="error-icon">⚠️</div>\n        <div class="error-title">Configuration Error</div>\n        <div class="error-message">No UUID configured. Please add a uuid attribute.</div>\n        <div class="error-uuid">Expected: &lt;lookalike-widget uuid="your-uuid"&gt;</div>\n      </div>\n    '}showLoadingError(e){e.innerHTML=`\n      <div class="error-container">\n        <div class="error-icon">⚠️</div>\n        <div class="error-title">Widget Loading Error</div>\n        <div class="error-message">Check console for details</div>\n        <div class="error-uuid">UUID: ${this.config.storyfileUuid}</div>\n      </div>\n    `}disconnectedCallback(){this.messageHandler&&(window.removeEventListener("message",this.messageHandler),this.messageHandler=null)}}customElements.define("lookalike-widget",LookalikeWidget),"undefined"!=typeof module&&module.exports&&(module.exports=LookalikeWidget);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lookalike/widget",
-  "version": "1.2.1",
+  "version": "1.2.3",
   "description": "Lookalike conversational AI widget for easy embedding",
   "main": "dist/lookalike-widget.js",
   "module": "dist/lookalike-widget.js",