@telia-ace/widget-components-area-flamingo 1.1.72-rc.24 → 1.1.72-rc.26

package/{area-24a4b792.mjs → area-3b36f4f8.mjs}

@@ -1616,7 +1616,7 @@ class w extends m {
       );
       return;
     }
-    this.active = !this.active, this.active ? (this.application.appendToDOM(), this.widgetActive$.next(!0)) : (this.application.hide(), this.widgetActive$.next(!1));
+    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 t;
@@ -2127,6 +2127,7 @@ At.styles = O`
 
       --header-height: 69px;
     }
+
     :host {
       --voca-rem-multiplier: 0.625;
       box-sizing: border-box;
@@ -2143,23 +2144,27 @@ At.styles = O`
       z-index: 6;
       position: fixed;
     }
+
     @media screen and (max-width: 800px) {
       :host(.floating) {
-        inset: 0 0 95px 0;
+        inset: 0;
         height: 100%;
       }
+
       :host(.third-party) {
-        inset: 0 0 95px 0;
+        inset: 0;
         height: 100vh;
       }
     }
+
     @media screen and (min-width: 801px) {
       :host(.floating) {
-        inset: auto 20px 95px auto;
+        inset: auto 20px 20px auto;
         max-height: calc(100vh - 120px);
         width: 400px;
-        height: 700px;
+        height: 775px;
       }
+
       :host(.third-party) {
         max-width: 1000px;
         height: 100vh;
@@ -2168,11 +2173,13 @@ At.styles = O`
         transform: translateX(-50%);
         margin: -10px 0;
       }
+
       :host(.floating.bottom-right) {
-        inset: auto 20px 95px auto;
+        inset: auto 20px 20px auto;
       }
+
       :host(.floating.bottom-left) {
-        inset: auto auto 95px 20px;
+        inset: auto auto 20px 20px;
       }
     }
 
@@ -2188,12 +2195,14 @@ At.styles = O`
     * {
       box-sizing: border-box;
     }
+
     .widget-container {
       height: 100%;
       background-color: var(--primary-background);
       padding: var(--spacing-sm);
       border: var(--widget-border, none);
     }
+
     @keyframes slideDown {
       from {
         transform: translateY(0);
@@ -2204,6 +2213,7 @@ At.styles = O`
         opacity: 0;
       }
     }
+
     @keyframes slideUp {
       from {
         transform: translateY(100%);
@@ -2214,10 +2224,12 @@ At.styles = O`
         opacity: 1;
       }
     }
+
     :host(.expanded) {
       opacity: 1;
       animation: slideUp 0.3s linear;
     }
+
     :host(.hidden) {
       opacity: 0;
       animation: slideDown 0.3s linear;

package/{area-9e1f05b1.js → area-929c9764.js}

@@ -66,7 +66,7 @@
  * @license
  * Copyright 2020 Google LLC
  * SPDX-License-Identifier: BSD-3-Clause
- */const ue=()=>new hi;class hi{}const ht=new WeakMap,de=_t(class extends le{render(s){return u}update(s,[t]){var i;const e=t!==this.Y;return e&&this.Y!==void 0&&this.rt(void 0),(e||this.lt!==this.ct)&&(this.Y=t,this.ht=(i=s.options)==null?void 0:i.host,this.rt(this.ct=s.element)),u}rt(s){if(typeof this.Y=="function"){const t=this.ht??globalThis;let e=ht.get(t);e===void 0&&(e=new WeakMap,ht.set(t,e)),e.get(this.Y)!==void 0&&this.Y.call(this.ht,void 0),e.set(this.Y,s),s!==void 0&&this.Y.call(this.ht,s)}else this.Y.value=s}get lt(){var s,t;return typeof this.Y=="function"?(s=ht.get(this.ht??globalThis))==null?void 0:s.get(this.Y):(t=this.Y)==null?void 0:t.value}disconnected(){this.lt===this.ct&&this.rt(void 0)}reconnected(){this.rt(this.ct)}});var li=Object.defineProperty,pi=Object.getOwnPropertyDescriptor,V=(s,t,e,i)=>{for(var r=i>1?void 0:i?pi(t,e):t,o=s.length-1,n;o>=0;o--)(n=s[o])&&(r=(i?n(t,e,r):n(r))||r);return i&&r&&li(t,e,r),r};class w extends m{constructor(){super(...arguments),this.active=!1,this.triggerVisible=!0,this.loaded=!1,this.containerRef=ue(),this.widgetActive$=new Ye(!1),this.componentIsDestroyed$=new yt}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 t;if(!((t=this.application)!=null&&t.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.application.hide(),this.widgetActive$.next(!1))}_applyBranding(){var t;(t=this.application)!=null&&t.settings&&pe(this.application.settings.branding,this)}async _renderSymbol(){var a,c,h;const t=(a=this.application)==null?void 0:a.branding(),e=(c=t==null?void 0:t.graphics)==null?void 0:c.trigger;if(e)return C` <img src=${e} class="trigger-icon" alt="" /> `;const i=(h=this.application)==null?void 0:h.triggerIcon;if(!i)return u;const r=async l=>ci,{type:o,content:n}=i;switch(o){case"Telia":{const l=await r();return l?C`<telia-icon
+ */const ue=()=>new hi;class hi{}const ht=new WeakMap,de=_t(class extends le{render(s){return u}update(s,[t]){var i;const e=t!==this.Y;return e&&this.Y!==void 0&&this.rt(void 0),(e||this.lt!==this.ct)&&(this.Y=t,this.ht=(i=s.options)==null?void 0:i.host,this.rt(this.ct=s.element)),u}rt(s){if(typeof this.Y=="function"){const t=this.ht??globalThis;let e=ht.get(t);e===void 0&&(e=new WeakMap,ht.set(t,e)),e.get(this.Y)!==void 0&&this.Y.call(this.ht,void 0),e.set(this.Y,s),s!==void 0&&this.Y.call(this.ht,s)}else this.Y.value=s}get lt(){var s,t;return typeof this.Y=="function"?(s=ht.get(this.ht??globalThis))==null?void 0:s.get(this.Y):(t=this.Y)==null?void 0:t.value}disconnected(){this.lt===this.ct&&this.rt(void 0)}reconnected(){this.rt(this.ct)}});var li=Object.defineProperty,pi=Object.getOwnPropertyDescriptor,V=(s,t,e,i)=>{for(var r=i>1?void 0:i?pi(t,e):t,o=s.length-1,n;o>=0;o--)(n=s[o])&&(r=(i?n(t,e,r):n(r))||r);return i&&r&&li(t,e,r),r};class w extends m{constructor(){super(...arguments),this.active=!1,this.triggerVisible=!0,this.loaded=!1,this.containerRef=ue(),this.widgetActive$=new Ye(!1),this.componentIsDestroyed$=new yt}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 t;if(!((t=this.application)!=null&&t.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 t;(t=this.application)!=null&&t.settings&&pe(this.application.settings.branding,this)}async _renderSymbol(){var a,c,h;const t=(a=this.application)==null?void 0:a.branding(),e=(c=t==null?void 0:t.graphics)==null?void 0:c.trigger;if(e)return C` <img src=${e} class="trigger-icon" alt="" /> `;const i=(h=this.application)==null?void 0:h.triggerIcon;if(!i)return u;const r=async l=>ci,{type:o,content:n}=i;switch(o){case"Telia":{const l=await r();return l?C`<telia-icon
             class="trigger-icon"
             svg=${l.svg}
             size="lg"
@@ -313,6 +313,7 @@
 
       --header-height: 69px;
     }
+
     :host {
       --voca-rem-multiplier: 0.625;
       box-sizing: border-box;
@@ -329,23 +330,27 @@
       z-index: 6;
       position: fixed;
     }
+
     @media screen and (max-width: 800px) {
       :host(.floating) {
-        inset: 0 0 95px 0;
+        inset: 0;
         height: 100%;
       }
+
       :host(.third-party) {
-        inset: 0 0 95px 0;
+        inset: 0;
         height: 100vh;
       }
     }
+
     @media screen and (min-width: 801px) {
       :host(.floating) {
-        inset: auto 20px 95px auto;
+        inset: auto 20px 20px auto;
         max-height: calc(100vh - 120px);
         width: 400px;
-        height: 700px;
+        height: 775px;
       }
+
       :host(.third-party) {
         max-width: 1000px;
         height: 100vh;
@@ -354,11 +359,13 @@
         transform: translateX(-50%);
         margin: -10px 0;
       }
+
       :host(.floating.bottom-right) {
-        inset: auto 20px 95px auto;
+        inset: auto 20px 20px auto;
       }
+
       :host(.floating.bottom-left) {
-        inset: auto auto 95px 20px;
+        inset: auto auto 20px 20px;
       }
     }
 
@@ -374,12 +381,14 @@
     * {
       box-sizing: border-box;
     }
+
     .widget-container {
       height: 100%;
       background-color: var(--primary-background);
       padding: var(--spacing-sm);
       border: var(--widget-border, none);
     }
+
     @keyframes slideDown {
       from {
         transform: translateY(0);
@@ -390,6 +399,7 @@
         opacity: 0;
       }
     }
+
     @keyframes slideUp {
       from {
         transform: translateY(100%);
@@ -400,10 +410,12 @@
         opacity: 1;
       }
     }
+
     :host(.expanded) {
       opacity: 1;
       animation: slideUp 0.3s linear;
     }
+
     :host(.hidden) {
       opacity: 0;
       animation: slideDown 0.3s linear;

package/index.js

@@ -1 +1 @@
-"use strict";const r=async e=>{e.registerComponent("area",Promise.resolve().then(()=>require("./area-9e1f05b1.js")))};module.exports=r;
+"use strict";const r=async e=>{e.registerComponent("area",Promise.resolve().then(()=>require("./area-929c9764.js")))};module.exports=r;

package/index.mjs

@@ -1,5 +1,5 @@
 const o = async (e) => {
-  e.registerComponent("area", import("./area-24a4b792.mjs"));
+  e.registerComponent("area", import("./area-3b36f4f8.mjs"));
 };
 export {
   o as default

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@telia-ace/widget-components-area-flamingo",
-  "version": "1.1.72-rc.24",
+  "version": "1.1.72-rc.26",
   "dependencies": {
-    "@telia-ace/widget-core-flamingo": "1.1.72-rc.24",
+    "@telia-ace/widget-core-flamingo": "1.1.72-rc.26",
     "lit": "^3.0.2"
   },
   "main": "./index.js",