@telia-ace/widget-conversation-flamingo 1.1.76-rc.12 → 1.1.76-rc.14

package/index.js

@@ -62,7 +62,7 @@
         bottom: 20px;
         left: 20px;
       }
-    `];pa([w({attribute:!0})],ln.prototype,"anchor",2);const da=new WeakMap;let es=0;const Et=new Map,ts=new WeakSet,ns=()=>new Promise(s=>requestAnimationFrame(s)),fa=[{transform:"translateX(100%) scale(0)",opacity:0}],ga=[{opacity:0}],ss=[{opacity:0},{opacity:1}],is=(s,e)=>{const t=s-e;return t===0?void 0:t},rs=(s,e)=>{const t=s/e;return t===1?void 0:t},Tt={left:(s,e)=>{const t=is(s,e);return{value:t,transform:t==null||isNaN(t)?void 0:`translateX(${t}px)`}},top:(s,e)=>{const t=is(s,e);return{value:t,transform:t==null||isNaN(t)?void 0:`translateY(${t}px)`}},width:(s,e)=>{let t;e===0&&(e=1,t={width:"1px"});const n=rs(s,e);return{value:n,overrideFrom:t,transform:n==null||isNaN(n)?void 0:`scaleX(${n})`}},height:(s,e)=>{let t;e===0&&(e=1,t={height:"1px"});const n=rs(s,e);return{value:n,overrideFrom:t,transform:n==null||isNaN(n)?void 0:`scaleY(${n})`}}},ma={duration:333,easing:"ease-in-out"},va=["left","top","width","height","opacity","color","background"],os=new WeakMap;class ba extends hi{constructor(e){if(super(e),this.t=!1,this.i=null,this.o=null,this.h=!0,this.shouldLog=!1,e.type===ft.CHILD)throw Error("The `animate` directive must be used in attribute position.");this.createFinished()}createFinished(){var e;(e=this.resolveFinished)==null||e.call(this),this.finished=new Promise(t=>{this.l=t})}async resolveFinished(){var e;(e=this.l)==null||e.call(this),this.l=void 0}render(e){return g}getController(){return da.get(this.u)}isDisabled(){var e;return this.options.disabled||((e=this.getController())==null?void 0:e.disabled)}update(e,[t]){var i;const n=this.u===void 0;return n&&(this.u=(i=e.options)==null?void 0:i.host,this.u.addController(this),this.u.updateComplete.then(r=>this.t=!0),this.element=e.element,os.set(this.element,this)),this.optionsOrCallback=t,(n||typeof t!="function")&&this.p(t),this.render(t)}p(e){e=e??{};const t=this.getController();t!==void 0&&((e={...t.defaultOptions,...e}).keyframeOptions={...t.defaultOptions.keyframeOptions,...e.keyframeOptions}),e.properties??(e.properties=va),this.options=e}m(){const e={},t=this.element.getBoundingClientRect(),n=getComputedStyle(this.element);return this.options.properties.forEach(i=>{const r=t[i]??(Tt[i]?void 0:n[i]),o=Number(r);e[i]=isNaN(o)?r+"":o}),e}v(){let e,t=!0;return this.options.guard&&(e=this.options.guard(),t=((n,i)=>{if(Array.isArray(n)){if(Array.isArray(i)&&i.length===n.length&&n.every((r,o)=>r===i[o]))return!1}else if(i===n)return!1;return!0})(e,this._)),this.h=this.t&&!this.isDisabled()&&!this.isAnimating()&&t&&this.element.isConnected,this.h&&(this._=Array.isArray(e)?Array.from(e):e),this.h}hostUpdate(){typeof this.optionsOrCallback=="function"&&this.p(this.optionsOrCallback()),this.v()&&(this.A=this.m(),this.i=this.i??this.element.parentNode,this.o=this.element.nextSibling)}async hostUpdated(){if(!this.h||!this.element.isConnected||this.options.skipInitial&&!this.isHostRendered)return;let e;this.prepare(),await ns;const t=this.O(),n=this.j(this.options.keyframeOptions,t),i=this.m();if(this.A!==void 0){const{from:r,to:o}=this.N(this.A,i,t);this.log("measured",[this.A,i,r,o]),e=this.calculateKeyframes(r,o)}else{const r=Et.get(this.options.inId);if(r){Et.delete(this.options.inId);const{from:o,to:a}=this.N(r,i,t);e=this.calculateKeyframes(o,a),e=this.options.in?[{...this.options.in[0],...e[0]},...this.options.in.slice(1),e[1]]:e,es++,e.forEach(l=>l.zIndex=es)}else this.options.in&&(e=[...this.options.in,{}])}this.animate(e,n)}resetStyles(){this.P!==void 0&&(this.element.setAttribute("style",this.P??""),this.P=void 0)}commitStyles(){var e,t;this.P=this.element.getAttribute("style"),(e=this.webAnimation)==null||e.commitStyles(),(t=this.webAnimation)==null||t.cancel()}reconnected(){}async disconnected(){var t;if(!this.h||(this.options.id!==void 0&&Et.set(this.options.id,this.A),this.options.out===void 0))return;if(this.prepare(),await ns(),(t=this.i)==null?void 0:t.isConnected){const n=this.o&&this.o.parentNode===this.i?this.o:null;if(this.i.insertBefore(this.element,n),this.options.stabilizeOut){const i=this.m();this.log("stabilizing out");const r=this.A.left-i.left,o=this.A.top-i.top;getComputedStyle(this.element).position!=="static"||r===0&&o===0||(this.element.style.position="relative"),r!==0&&(this.element.style.left=r+"px"),o!==0&&(this.element.style.top=o+"px")}}const e=this.j(this.options.keyframeOptions);await this.animate(this.options.out,e),this.element.remove()}prepare(){this.createFinished()}start(){var e,t;(t=(e=this.options).onStart)==null||t.call(e,this)}didFinish(e){var t,n;e&&((n=(t=this.options).onComplete)==null||n.call(t,this)),this.A=void 0,this.animatingProperties=void 0,this.frames=void 0,this.resolveFinished()}O(){const e=[];for(let t=this.element.parentNode;t;t=t==null?void 0:t.parentNode){const n=os.get(t);n&&!n.isDisabled()&&n&&e.push(n)}return e}get isHostRendered(){const e=ts.has(this.u);return e||this.u.updateComplete.then(()=>{ts.add(this.u)}),e}j(e,t=this.O()){const n={...ma};return t.forEach(i=>Object.assign(n,i.options.keyframeOptions)),Object.assign(n,e),n}N(e,t,n){e={...e},t={...t};const i=n.map(a=>a.animatingProperties).filter(a=>a!==void 0);let r=1,o=1;return i.length>0&&(i.forEach(a=>{a.width&&(r/=a.width),a.height&&(o/=a.height)}),e.left!==void 0&&t.left!==void 0&&(e.left=r*e.left,t.left=r*t.left),e.top!==void 0&&t.top!==void 0&&(e.top=o*e.top,t.top=o*t.top)),{from:e,to:t}}calculateKeyframes(e,t,n=!1){const i={},r={};let o=!1;const a={};for(const l in t){const c=e[l],h=t[l];if(l in Tt){const u=Tt[l];if(c===void 0||h===void 0)continue;const p=u(c,h);p.transform!==void 0&&(a[l]=p.value,o=!0,i.transform=`${i.transform??""} ${p.transform}`,p.overrideFrom!==void 0&&Object.assign(i,p.overrideFrom))}else c!==h&&c!==void 0&&h!==void 0&&(o=!0,i[l]=c,r[l]=h)}return i.transformOrigin=r.transformOrigin=n?"center center":"top left",this.animatingProperties=a,o?[i,r]:void 0}async animate(e,t=this.options.keyframeOptions){this.start(),this.frames=e;let n=!1;if(!this.isAnimating()&&!this.isDisabled()&&(this.options.onFrames&&(this.frames=e=this.options.onFrames(this),this.log("modified frames",e)),e!==void 0)){this.log("animate",[e,t]),n=!0,this.webAnimation=this.element.animate(e,t);const i=this.getController();i==null||i.add(this);try{await this.webAnimation.finished}catch{}i==null||i.remove(this)}return this.didFinish(n),n}isAnimating(){var e,t;return((e=this.webAnimation)==null?void 0:e.playState)==="running"||((t=this.webAnimation)==null?void 0:t.pending)}log(e,t){this.shouldLog&&!this.isDisabled()&&console.log(e,this.options.id,t)}}const Nt=gt(ba),F=(s,e,t)=>{s&&t.style.setProperty(e,s)},ui=(s,e)=>{var t,n,i,r,o,a,l,c,h;F((t=s.colors)==null?void 0:t.primaryBackground,"--primary-background",e),F((n=s.colors)==null?void 0:n.textOnPrimaryBackground,"--text-on-primary-background",e),F((i=s.colors)==null?void 0:i.secondaryBackground,"--secondary-background",e),F((r=s.colors)==null?void 0:r.textOnSecondaryBackground,"--text-on-secondary-background",e),F((o=s.colors)==null?void 0:o.interactiveDestructiveBackground,"--destructive-color",e),F((a=s.colors)==null?void 0:a.interactiveTextOnDestructiveBackground,"--text-on-destructive-color",e),F((l=s.colors)==null?void 0:l.interactivePrimaryBackground,"--interactive-primary-background",e),F((c=s.colors)==null?void 0:c.interactiveTextOnPrimaryBackground,"--interactive-text-on-primary-background",e),F((h=s.colors)==null?void 0:h.focusColor,"--focus-color",e)};var ya=Object.defineProperty,$a=Object.getOwnPropertyDescriptor,Ue=(s,e,t,n)=>{for(var i=n>1?void 0:n?$a(e,t):e,r=s.length-1,o;r>=0;r--)(o=s[r])&&(i=(n?o(e,t,i):o(i))||i);return n&&i&&ya(e,t,i),i};class X extends k{constructor(){super(...arguments),this.active=!1,this.triggerVisible=!0,this.loaded=!1,this.containerRef=M(),this.widgetActive$=new U(!1),this.componentIsDestroyed$=new _}async connectedCallback(){super.connectedCallback(),this.icon=await this._renderSymbol(),this.loaded=!0,this._applyBranding()}disconnectedCallback(){super.disconnectedCallback(),this.componentIsDestroyed$.next(),this.componentIsDestroyed$.complete()}toggleActive(){var e;if(!((e=this.application)!=null&&e.root)){console.warn("Could not activate widget. No root element assigned to widget.");return}this.active=!this.active,this.active?(this.application.appendToDOM(),this.widgetActive$.next(!0),this.hideTrigger()):(this.application.hide(),this.widgetActive$.next(!1),this.showTrigger())}_applyBranding(){var e;(e=this.application)!=null&&e.settings&&ui(this.application.settings.branding,this)}async _renderSymbol(){var a,l,c;const e=(a=this.application)==null?void 0:a.branding(),t=(l=e==null?void 0:e.graphics)==null?void 0:l.trigger;if(t)return m` <img src=${t} class="trigger-icon" alt="" /> `;const n=(c=this.application)==null?void 0:c.triggerIcon;if(!n)return g;const i=async h=>no,{type:r,content:o}=n;switch(r){case"Telia":{const h=await i();return h?m`<telia-icon
+    `];pa([w({attribute:!0})],ln.prototype,"anchor",2);const da=new WeakMap;let es=0;const Et=new Map,ts=new WeakSet,ns=()=>new Promise(s=>requestAnimationFrame(s)),fa=[{transform:"translateX(100%) scale(0)",opacity:0}],ga=[{opacity:0}],ss=[{opacity:0},{opacity:1}],is=(s,e)=>{const t=s-e;return t===0?void 0:t},rs=(s,e)=>{const t=s/e;return t===1?void 0:t},Tt={left:(s,e)=>{const t=is(s,e);return{value:t,transform:t==null||isNaN(t)?void 0:`translateX(${t}px)`}},top:(s,e)=>{const t=is(s,e);return{value:t,transform:t==null||isNaN(t)?void 0:`translateY(${t}px)`}},width:(s,e)=>{let t;e===0&&(e=1,t={width:"1px"});const n=rs(s,e);return{value:n,overrideFrom:t,transform:n==null||isNaN(n)?void 0:`scaleX(${n})`}},height:(s,e)=>{let t;e===0&&(e=1,t={height:"1px"});const n=rs(s,e);return{value:n,overrideFrom:t,transform:n==null||isNaN(n)?void 0:`scaleY(${n})`}}},ma={duration:333,easing:"ease-in-out"},va=["left","top","width","height","opacity","color","background"],os=new WeakMap;class ba extends hi{constructor(e){if(super(e),this.t=!1,this.i=null,this.o=null,this.h=!0,this.shouldLog=!1,e.type===ft.CHILD)throw Error("The `animate` directive must be used in attribute position.");this.createFinished()}createFinished(){var e;(e=this.resolveFinished)==null||e.call(this),this.finished=new Promise(t=>{this.l=t})}async resolveFinished(){var e;(e=this.l)==null||e.call(this),this.l=void 0}render(e){return g}getController(){return da.get(this.u)}isDisabled(){var e;return this.options.disabled||((e=this.getController())==null?void 0:e.disabled)}update(e,[t]){var i;const n=this.u===void 0;return n&&(this.u=(i=e.options)==null?void 0:i.host,this.u.addController(this),this.u.updateComplete.then(r=>this.t=!0),this.element=e.element,os.set(this.element,this)),this.optionsOrCallback=t,(n||typeof t!="function")&&this.p(t),this.render(t)}p(e){e=e??{};const t=this.getController();t!==void 0&&((e={...t.defaultOptions,...e}).keyframeOptions={...t.defaultOptions.keyframeOptions,...e.keyframeOptions}),e.properties??(e.properties=va),this.options=e}m(){const e={},t=this.element.getBoundingClientRect(),n=getComputedStyle(this.element);return this.options.properties.forEach(i=>{const r=t[i]??(Tt[i]?void 0:n[i]),o=Number(r);e[i]=isNaN(o)?r+"":o}),e}v(){let e,t=!0;return this.options.guard&&(e=this.options.guard(),t=((n,i)=>{if(Array.isArray(n)){if(Array.isArray(i)&&i.length===n.length&&n.every((r,o)=>r===i[o]))return!1}else if(i===n)return!1;return!0})(e,this._)),this.h=this.t&&!this.isDisabled()&&!this.isAnimating()&&t&&this.element.isConnected,this.h&&(this._=Array.isArray(e)?Array.from(e):e),this.h}hostUpdate(){typeof this.optionsOrCallback=="function"&&this.p(this.optionsOrCallback()),this.v()&&(this.A=this.m(),this.i=this.i??this.element.parentNode,this.o=this.element.nextSibling)}async hostUpdated(){if(!this.h||!this.element.isConnected||this.options.skipInitial&&!this.isHostRendered)return;let e;this.prepare(),await ns;const t=this.O(),n=this.j(this.options.keyframeOptions,t),i=this.m();if(this.A!==void 0){const{from:r,to:o}=this.N(this.A,i,t);this.log("measured",[this.A,i,r,o]),e=this.calculateKeyframes(r,o)}else{const r=Et.get(this.options.inId);if(r){Et.delete(this.options.inId);const{from:o,to:a}=this.N(r,i,t);e=this.calculateKeyframes(o,a),e=this.options.in?[{...this.options.in[0],...e[0]},...this.options.in.slice(1),e[1]]:e,es++,e.forEach(l=>l.zIndex=es)}else this.options.in&&(e=[...this.options.in,{}])}this.animate(e,n)}resetStyles(){this.P!==void 0&&(this.element.setAttribute("style",this.P??""),this.P=void 0)}commitStyles(){var e,t;this.P=this.element.getAttribute("style"),(e=this.webAnimation)==null||e.commitStyles(),(t=this.webAnimation)==null||t.cancel()}reconnected(){}async disconnected(){var t;if(!this.h||(this.options.id!==void 0&&Et.set(this.options.id,this.A),this.options.out===void 0))return;if(this.prepare(),await ns(),(t=this.i)==null?void 0:t.isConnected){const n=this.o&&this.o.parentNode===this.i?this.o:null;if(this.i.insertBefore(this.element,n),this.options.stabilizeOut){const i=this.m();this.log("stabilizing out");const r=this.A.left-i.left,o=this.A.top-i.top;getComputedStyle(this.element).position!=="static"||r===0&&o===0||(this.element.style.position="relative"),r!==0&&(this.element.style.left=r+"px"),o!==0&&(this.element.style.top=o+"px")}}const e=this.j(this.options.keyframeOptions);await this.animate(this.options.out,e),this.element.remove()}prepare(){this.createFinished()}start(){var e,t;(t=(e=this.options).onStart)==null||t.call(e,this)}didFinish(e){var t,n;e&&((n=(t=this.options).onComplete)==null||n.call(t,this)),this.A=void 0,this.animatingProperties=void 0,this.frames=void 0,this.resolveFinished()}O(){const e=[];for(let t=this.element.parentNode;t;t=t==null?void 0:t.parentNode){const n=os.get(t);n&&!n.isDisabled()&&n&&e.push(n)}return e}get isHostRendered(){const e=ts.has(this.u);return e||this.u.updateComplete.then(()=>{ts.add(this.u)}),e}j(e,t=this.O()){const n={...ma};return t.forEach(i=>Object.assign(n,i.options.keyframeOptions)),Object.assign(n,e),n}N(e,t,n){e={...e},t={...t};const i=n.map(a=>a.animatingProperties).filter(a=>a!==void 0);let r=1,o=1;return i.length>0&&(i.forEach(a=>{a.width&&(r/=a.width),a.height&&(o/=a.height)}),e.left!==void 0&&t.left!==void 0&&(e.left=r*e.left,t.left=r*t.left),e.top!==void 0&&t.top!==void 0&&(e.top=o*e.top,t.top=o*t.top)),{from:e,to:t}}calculateKeyframes(e,t,n=!1){const i={},r={};let o=!1;const a={};for(const l in t){const c=e[l],h=t[l];if(l in Tt){const u=Tt[l];if(c===void 0||h===void 0)continue;const p=u(c,h);p.transform!==void 0&&(a[l]=p.value,o=!0,i.transform=`${i.transform??""} ${p.transform}`,p.overrideFrom!==void 0&&Object.assign(i,p.overrideFrom))}else c!==h&&c!==void 0&&h!==void 0&&(o=!0,i[l]=c,r[l]=h)}return i.transformOrigin=r.transformOrigin=n?"center center":"top left",this.animatingProperties=a,o?[i,r]:void 0}async animate(e,t=this.options.keyframeOptions){this.start(),this.frames=e;let n=!1;if(!this.isAnimating()&&!this.isDisabled()&&(this.options.onFrames&&(this.frames=e=this.options.onFrames(this),this.log("modified frames",e)),e!==void 0)){this.log("animate",[e,t]),n=!0,this.webAnimation=this.element.animate(e,t);const i=this.getController();i==null||i.add(this);try{await this.webAnimation.finished}catch{}i==null||i.remove(this)}return this.didFinish(n),n}isAnimating(){var e,t;return((e=this.webAnimation)==null?void 0:e.playState)==="running"||((t=this.webAnimation)==null?void 0:t.pending)}log(e,t){this.shouldLog&&!this.isDisabled()&&console.log(e,this.options.id,t)}}const Nt=gt(ba),F=(s,e,t)=>{s&&t.style.setProperty(e,s)},ui=(s,e)=>{var t,n,i,r,o,a,l,c,h;F((t=s.colors)==null?void 0:t.primaryBackground,"--primary-background",e),F((n=s.colors)==null?void 0:n.textOnPrimaryBackground,"--text-on-primary-background",e),F((i=s.colors)==null?void 0:i.secondaryBackground,"--secondary-background",e),F((r=s.colors)==null?void 0:r.textOnSecondaryBackground,"--text-on-secondary-background",e),F((o=s.colors)==null?void 0:o.interactiveDestructiveBackground,"--destructive-color",e),F((a=s.colors)==null?void 0:a.interactiveTextOnDestructiveBackground,"--text-on-destructive-color",e),F((l=s.colors)==null?void 0:l.interactivePrimaryBackground,"--interactive-primary-background",e),F((c=s.colors)==null?void 0:c.interactiveTextOnPrimaryBackground,"--interactive-text-on-primary-background",e),F((h=s.colors)==null?void 0:h.focusColor,"--focus-color",e)};var ya=Object.defineProperty,$a=Object.getOwnPropertyDescriptor,Ue=(s,e,t,n)=>{for(var i=n>1?void 0:n?$a(e,t):e,r=s.length-1,o;r>=0;r--)(o=s[r])&&(i=(n?o(e,t,i):o(i))||i);return n&&i&&ya(e,t,i),i};class X extends k{constructor(){super(...arguments),this.active=!1,this.triggerVisible=!0,this.loaded=!1,this.containerRef=M(),this.widgetActive$=new U(!1),this.componentIsDestroyed$=new _}async connectedCallback(){super.connectedCallback(),this.icon=await this._renderSymbol(),this.loaded=!0,this._applyBranding()}disconnectedCallback(){super.disconnectedCallback(),this.componentIsDestroyed$.next(),this.componentIsDestroyed$.complete()}toggleActive(){var e;if(!((e=this.application)!=null&&e.root)){console.warn("Could not activate widget. No root element assigned to widget.");return}this.active=!this.active,this.active?(this.application.appendToDOM(),this.notify("widget-set-active",{widgetId:this.application.id,active:!0}),this.widgetActive$.next(!0),this.hideTrigger()):(this.application.hide(),this.notify("widget-set-active",{widgetId:this.application.id,active:!1}),this.widgetActive$.next(!1),this.showTrigger())}notify(e,t={}){window!=null&&window.parent&&window.parent.postMessage({type:e,data:t},"*")}_applyBranding(){var e;(e=this.application)!=null&&e.settings&&ui(this.application.settings.branding,this)}async _renderSymbol(){var a,l,c;const e=(a=this.application)==null?void 0:a.branding(),t=(l=e==null?void 0:e.graphics)==null?void 0:l.trigger;if(t)return m` <img src=${t} class="trigger-icon" alt="" /> `;const n=(c=this.application)==null?void 0:c.triggerIcon;if(!n)return g;const i=async h=>no,{type:r,content:o}=n;switch(r){case"Telia":{const h=await i();return h?m`<telia-icon
             class="trigger-icon"
             svg=${h.svg}
             size="lg"

package/index.mjs

@@ -3222,7 +3222,22 @@ class X extends k {
       );
       return;
     }
-    this.active = !this.active, this.active ? (this.application.appendToDOM(), this.widgetActive$.next(!0), this.hideTrigger()) : (this.application.hide(), this.widgetActive$.next(!1), this.showTrigger());
+    this.active = !this.active, this.active ? (this.application.appendToDOM(), this.notify("widget-set-active", {
+      widgetId: this.application.id,
+      active: !0
+    }), this.widgetActive$.next(!0), this.hideTrigger()) : (this.application.hide(), this.notify("widget-set-active", {
+      widgetId: this.application.id,
+      active: !1
+    }), this.widgetActive$.next(!1), this.showTrigger());
+  }
+  notify(e, t = {}) {
+    window != null && window.parent && window.parent.postMessage(
+      {
+        type: e,
+        data: t
+      },
+      "*"
+    );
   }
   _applyBranding() {
     var e;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@telia-ace/widget-conversation-flamingo",
-  "version": "1.1.76-rc.12",
+  "version": "1.1.76-rc.14",
   "publishConfig": {
     "registry": "https://registry.npmjs.org"
   },
@@ -9,7 +9,7 @@
     "@lit-labs/motion": "^1.0.4",
     "@teliads/icons": "^8.4.0",
     "@teliads/components": "^22.1.1",
-    "@telia-ace/widget-core-flamingo": "1.1.76-rc.12",
+    "@telia-ace/widget-core-flamingo": "1.1.76-rc.14",
     "lit-html": "^3.0.2",
     "rxjs": "^7.8.1",
     "marked": "^12.0.2"