@yoobic/yobi 8.2.0-2 → 8.2.0-5

package/dist/design-system/yoo-ion-slides.entry.js

@@ -1,8 +1,8 @@
-export { Y as yoo_ion_slides } from './yoo-ion-slides-0be939d2.js';
+export { Y as yoo_ion_slides } from './yoo-ion-slides-bc619bf6.js';
 import './index-019c1b1a.js';
-import './index-dde1f033.js';
+import './index-504f216f.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
-import './common-helpers-d99b3c41.js';
-import './theme-b9b51257.js';
+import './index-93c86f26.js';
+import './common-helpers-b49fc758.js';
+import './theme-f4b3a1c4.js';

package/dist/design-system/yoo-ion-toast-controller.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance } from './index-019c1b1a.js';
-import { r as removeLastOverlay, c as createOverlay, d as dismissOverlay, g as getTopOverlay } from './overlays-527da268.js';
-import './index-dde1f033.js';
+import { r as removeLastOverlay, c as createOverlay, d as dismissOverlay, g as getTopOverlay } from './overlays-c5155785.js';
+import './index-504f216f.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const YooIonToastControllerComponent = class {
   constructor(hostRef) {

package/dist/design-system/yoo-kanban.entry.js

@@ -1,10 +1,10 @@
 import { r as registerInstance, i as createEvent, h, e as Host, g as getElement } from './index-019c1b1a.js';
-import { ey as fadeFromBottom, ez as fadeFromTop, t as translate, o as isWeb, dg as showContextMenu, af as showActionSheet, _ as getSession, cH as getAuthentication, a7 as getUserDisplayName, y as getCssColor, bg as getContrastColor } from './index-dde1f033.js';
+import { ey as fadeFromBottom, ez as fadeFromTop, t as translate, o as isWeb, dg as showContextMenu, af as showActionSheet, _ as getSession, cH as getAuthentication, a7 as getUserDisplayName, y as getCssColor, bg as getContrastColor } from './index-504f216f.js';
 import { X as uniqBy, c as compact, A as get, y as sortBy } from './lodash-494e728c.js';
 import { S as Sortable } from './sortable.esm-f788d1ca.js';
-import { b as getAppContext } from './common-helpers-d99b3c41.js';
+import { b as getAppContext } from './common-helpers-b49fc758.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const kanbanCss = ":host{position:absolute;top:0;right:0;bottom:0;left:0;overflow:auto;}:host::-webkit-scrollbar{width:var(--spacing-04, 0.25rem);height:var(--spacing-04, 0.25rem)}:host::-webkit-scrollbar-track{background-color:transparent;border-radius:var(--border-radius-04, 0.25rem)}:host::-webkit-scrollbar-thumb{background-color:transparent;border-radius:var(--border-radius-04, 0.25rem)}:host .kanban-outer-container{display:-ms-flexbox;display:flex;height:auto;padding:var(--spacing-16, 1rem);padding-top:var(--spacing-08, 0.5rem);padding-left:0}:host .kanban-outer-container .kanban-board-placeholder{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-width:17.5rem;max-width:17.5rem;height:1.3rem;padding:var(--spacing-08, 0.5rem);color:var(--app-color, #5a30f4);font-size:var(--font-size-14, 0.875rem);background:var(--app-color-20, rgba(90, 48, 244, 0.2));border-radius:0.25rem;cursor:pointer}:host .kanban-outer-container .kanban-board-placeholder yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .kanban-outer-container .kanban-board{min-width:17.5rem;max-width:17.5rem;margin-right:var(--spacing-08, 0.5rem)}:host .kanban-outer-container .kanban-board .header{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:var(--spacing-16, 1rem);color:var(--text-color, #807f83);font-weight:bold;font-size:var(--font-size-14, 0.875rem);background:var(--stable-light, #f1f1f1);border-top-left-radius:0.25rem;border-top-right-radius:0.25rem;cursor:-webkit-grab;cursor:grab}:host .kanban-outer-container .kanban-board .header .title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .kanban-outer-container .kanban-board .header .count{-ms-flex:1;flex:1;margin-left:var(--spacing-08, 0.5rem)}:host .kanban-outer-container .kanban-board .content{min-height:3.125rem;margin:0;padding:var(--spacing-08, 0.5rem);background:var(--stable-light, #f1f1f1)}:host .kanban-outer-container .kanban-board .content .item-container{position:relative;padding:0;overflow:hidden;background:var(--light, #ffffff);border-radius:0.25rem;border-radius:0.3125rem;-webkit-box-shadow:var(--card-shadow, 0 0.125rem 0.25rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--card-shadow, 0 0.125rem 0.25rem 0 rgba(40, 47, 54, 0.08));cursor:pointer}:host .kanban-outer-container .kanban-board .content .item-container yoo-icon.more{position:absolute;top:0.625rem;right:var(--spacing-08, 0.5rem);z-index:100;opacity:0;-webkit-transition:all 0.2s;transition:all 0.2s}:host .kanban-outer-container .kanban-board .content .item-container:hover yoo-icon.more{opacity:1}:host .kanban-outer-container .kanban-board .content .item-container:not(:last-child){margin-bottom:var(--spacing-08, 0.5rem)}:host .kanban-outer-container .kanban-board .content .item-container yoo-form-dynamic{margin:var(--spacing-08, 0.5rem);margin-top:0;border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .kanban-outer-container .kanban-board .content .item-container.sortable-drag{background:var(--light, #ffffff);border:solid var(--border-width-02, 0.125rem) var(--app-color, #5a30f4);border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:var(--web-shadow, 0 0.3125rem 0.8125rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--web-shadow, 0 0.3125rem 0.8125rem 0 rgba(40, 47, 54, 0.08))}:host .kanban-outer-container .kanban-board .content .item-container.sortable-ghost{border:dashed var(--border-width-02, 0.125rem) var(--stable-alt, #d0d0d0);border-radius:var(--border-radius-04, 0.25rem);cursor:-webkit-grabbing !important;cursor:grabbing !important}:host .kanban-outer-container .kanban-board .footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);padding-top:var(--spacing-08, 0.5rem);color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem);background:var(--stable-light, #f1f1f1);border-bottom-right-radius:0.25rem;border-bottom-left-radius:0.25rem;cursor:pointer}:host .kanban-outer-container .kanban-board .footer yoo-icon{margin-right:var(--spacing-08, 0.5rem);fill:inherit}:host .kanban-outer-container .kanban-board.sortable-drag .kanban-board-inner-container{background:var(--light, #ffffff);border:solid var(--border-width-02, 0.125rem) var(--app-color, #5a30f4);border-radius:var(--border-radius-04, 0.25rem);-webkit-box-shadow:var(--web-shadow, 0 0.3125rem 0.8125rem 0 rgba(40, 47, 54, 0.08));box-shadow:var(--web-shadow, 0 0.3125rem 0.8125rem 0 rgba(40, 47, 54, 0.08))}:host .kanban-outer-container .kanban-board.sortable-ghost .kanban-board-inner-container{border:dashed var(--border-width-02, 0.125rem) var(--stable-alt, #d0d0d0);border-radius:var(--border-radius-04, 0.25rem);cursor:-webkit-grabbing !important;cursor:grabbing !important}:host(.web:hover)::-webkit-scrollbar-track{background-color:var(--stable-light, #f1f1f1)}:host(.web:hover)::-webkit-scrollbar-thumb{background:var(--stable, #adadad)}:host(.mobile) .kanban-outer-container{padding-top:var(--spacing-08, 0.5rem);padding-left:var(--spacing-08, 0.5rem)}";
 

package/dist/design-system/yoo-kpi-card.entry.js

@@ -1,10 +1,10 @@
 import { h, r as registerInstance, i as createEvent, e as Host } from './index-019c1b1a.js';
-import { t as translate, aE as isPresent, W as pipes, dS as convertSecondsToTimeUnits } from './index-dde1f033.js';
+import { t as translate, aE as isPresent, W as pipes, dS as convertSecondsToTimeUnits } from './index-504f216f.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
-const kpiCardCss = ":host{--grid-auto-flow:column;--value-align-items:initial;--value-direction:column;--value-font-size:var(--font-size-36, 2.25rem);--value-font-weight:var(--font-weight-700, 700);--value-justify-content:initial;--value-line-height:1.5;--value-margin:calc(var(--spacing-04, 0.25rem) * -1) 0 0;--value-separator:none;--value-title-color:var(--dark, #000000);--value-title-font-size:var(--font-size-14, 0.875rem);--variation-font-size:var(--font-size-14, 0.875rem);--card-background:var(--light, #ffffff);--title-color:var(--stable, #adadad);--title-font-size:var(--font-size-12, 0.75rem);--title-position:start;--title-font-weight:var(--font-weight-400, 400);--card-margin:var(--spacing-16, 1rem);--values-gap:var(--spacing-08, 0.5rem);display:block}:host .empty-state{padding:var(--spacing-16, 1rem)}:host .empty-state div{padding-top:var(--spacing-16, 1rem);text-align:center}:host .header{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:end}:host .header.title{-ms-flex-pack:justify;justify-content:space-between}:host .header.title .title{display:-ms-flexbox;display:flex;-ms-flex-pack:var(--title-position);justify-content:var(--title-position);width:100%;margin-bottom:var(--spacing-08, 0.5rem);color:var(--title-color);font-weight:var(--title-font-weight);font-size:var(--title-font-size)}:host .kpi-container{display:-ms-flexbox;display:flex;-ms-flex-direction:var(--value-direction);flex-direction:var(--value-direction);-ms-flex-align:var(--value-align-items);align-items:var(--value-align-items);-ms-flex-pack:var(--value-justify-content);justify-content:var(--value-justify-content);opacity:1}:host .kpi-container:not(:last-of-type){border-right:var(--value-separator)}:host .kpi-container.hidden{opacity:0}:host .kpi-number{margin:var(--value-margin);font-weight:var(--value-font-weight);font-size:var(--value-font-size);line-height:var(--value-line-height);text-align:center}:host .kpi-number span{display:-ms-flexbox;display:flex;-ms-flex-align:baseline;align-items:baseline;-ms-flex-pack:center;justify-content:center}:host .kpi-number span .time{font-size:calc(var(--value-font-size) / 2)}:host .kpi-title{color:var(--value-title-color);font-size:var(--value-title-font-size);text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .kpis{display:grid;grid-auto-flow:var(--grid-auto-flow);grid-template-columns:var(--grid-template-columns);gap:var(--values-gap)}:host .kpi-variation{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;margin:var(--value-margin);font-size:var(--variation-font-size)}:host .kpi-variation .no-variation{width:0.625rem;height:0.125rem;margin:var(--spacing-08, 0.5rem) 0;background:var(--stable-alt, #d0d0d0)}:host .kpi-variation.positive{color:var(--success, #3aa76d)}:host .kpi-variation.negative{color:var(--danger, #d44333)}:host .kpi-variation yoo-icon{margin-right:var(--spacing-04, 0.25rem)}:host(:not(.vertical)) .kpi-number{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.vertical) .kpi-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(:not(.content-only)){--card-padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem) var(--spacing-16, 1rem)}:host(:not(.content-only)) .card{margin:var(--card-margin);padding:var(--card-padding);background-color:var(--card-background);border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1))}";
+const kpiCardCss = ":host{--grid-auto-flow:column;--value-align-items:initial;--value-direction:column;--value-font-size:var(--font-size-36, 2.25rem);--value-font-weight:var(--font-weight-700, 700);--value-justify-content:initial;--value-line-height:1.5;--value-margin:calc(var(--spacing-04, 0.25rem) * -1) 0 0;--value-separator:none;--value-title-color:var(--dark, #000000);--value-title-font-size:var(--font-size-14, 0.875rem);--variation-font-size:var(--font-size-14, 0.875rem);--card-background:var(--light, #ffffff);--title-color:var(--stable, #adadad);--title-font-size:var(--font-size-12, 0.75rem);--title-position:start;--title-font-weight:var(--font-weight-400, 400);--card-margin:var(--spacing-16, 1rem);--values-gap:var(--spacing-08, 0.5rem);display:block}:host .empty-state{padding:var(--spacing-16, 1rem)}:host .empty-state div{padding-top:var(--spacing-16, 1rem);text-align:center}:host .header{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:end}:host .header.title{-ms-flex-pack:justify;justify-content:space-between}:host .header.title .title{display:-ms-flexbox;display:flex;-ms-flex-pack:var(--title-position);justify-content:var(--title-position);width:100%;margin-bottom:var(--spacing-08, 0.5rem);color:var(--title-color);font-weight:var(--title-font-weight);font-size:var(--title-font-size)}:host .kpi-container{display:-ms-flexbox;display:flex;-ms-flex-direction:var(--value-direction);flex-direction:var(--value-direction);-ms-flex-align:var(--value-align-items);align-items:var(--value-align-items);-ms-flex-pack:var(--value-justify-content);justify-content:var(--value-justify-content);opacity:1}:host .kpi-container:not(:last-of-type){padding-right:var(--values-gap);border-right:var(--value-separator)}:host .kpi-container.hidden{padding-right:0;opacity:0}:host .kpi-number{margin:var(--value-margin);font-weight:var(--value-font-weight);font-size:var(--value-font-size);line-height:var(--value-line-height);text-align:center}:host .kpi-number span{display:-ms-flexbox;display:flex;-ms-flex-align:baseline;align-items:baseline;-ms-flex-pack:center;justify-content:center}:host .kpi-number span .time{font-size:calc(var(--value-font-size) / 2)}:host .kpi-title{color:var(--value-title-color);font-size:var(--value-title-font-size);text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host .kpis{display:grid;grid-auto-flow:var(--grid-auto-flow);grid-template-columns:var(--grid-template-columns);gap:var(--values-gap)}:host .kpi-variation{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;margin:var(--value-margin);font-size:var(--variation-font-size)}:host .kpi-variation .no-variation{width:0.625rem;height:0.125rem;margin:var(--spacing-08, 0.5rem) 0;background:var(--stable-alt, #d0d0d0)}:host .kpi-variation.positive{color:var(--success, #3aa76d)}:host .kpi-variation.negative{color:var(--danger, #d44333)}:host .kpi-variation yoo-icon{margin-right:var(--spacing-04, 0.25rem)}:host(:not(.vertical)) .kpi-number{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(.vertical) .kpi-container{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:host(:not(.content-only)){--card-padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem) var(--spacing-16, 1rem)}:host(:not(.content-only)) .card{margin:var(--card-margin);padding:var(--card-padding);background-color:var(--card-background);border-radius:var(--border-radius-08, 0.5rem);-webkit-box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1))}";
 
 const EmptyState = ({ type }) => (h("div", { class: "empty-state" }, h("yoo-empty-state", { type: type }), h("div", null, translate('LISTEMPTY'))));
 const Kpis = ({ data, title, help, onCardClick }) => {

package/dist/design-system/yoo-kpi-container.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, i as createEvent, h, e as Host, g as getElement } from './index-019c1b1a.js';
-import { ck as isIntersectionObserverSupported, cl as intersectionObserve, t as translate, cm as getChartTypes, o as isWeb, af as showActionSheet, T as translateMulti, d as isNativeMobile } from './index-dde1f033.js';
-import { b as getAppContext } from './common-helpers-d99b3c41.js';
+import { ck as isIntersectionObserverSupported, cl as intersectionObserve, t as translate, cm as getChartTypes, o as isWeb, af as showActionSheet, T as translateMulti, d as isNativeMobile } from './index-504f216f.js';
+import { b as getAppContext } from './common-helpers-b49fc758.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const kpiContainerCss = ":host{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;min-height:0}:host .container{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;width:100%;min-height:0;background:var(--light, #ffffff)}:host .container .error{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;padding:var(--spacing-16, 1rem);color:var(--danger, #d44333);text-align:center}:host .container.fullscreen{border-bottom:none}:host .container .content{position:relative;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;width:100%;min-height:0}:host .container .kpi-container{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;min-height:0}:host .container .kpi-container.carousel,:host .container .kpi-container.map{overflow:hidden}:host .container .kpi-container.carousel{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .heading{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding:var(--spacing-08, 0.5rem);padding-left:var(--spacing-16, 1rem);font-size:var(--font-size-16, 1rem);text-align:left;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .heading .title{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-align:center;align-items:center;font-weight:bold;white-space:nowrap}:host .heading .title yoo-icon{margin-left:var(--spacing-04, 0.25rem)}:host .heading yoo-icon:not(.margin-right){margin-left:var(--spacing-08, 0.5rem)}:host .heading yoo-icon.margin-right{margin-right:var(--spacing-08, 0.5rem)}:host .heading yoo-icon.draggable{margin-left:-0.5rem}:host .subheading{padding:0 var(--spacing-08, 0.5rem);padding-top:var(--spacing-08, 0.5rem);padding-left:var(--spacing-16, 1rem);color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem)}:host .subheading.grid{padding-bottom:var(--spacing-08, 0.5rem);border-bottom:0.0625rem solid var(--stable-light, #f1f1f1)}:host .empty-state{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-direction:column;flex-direction:column;height:100%}:host .empty-state yoo-empty-state{height:6.25rem}:host .empty-state div{color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem);opacity:0.7;text-align:center}:host(.mobile) .container{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.mobile) .container:not(.fullscreen) .content yoo-kpi:not(.interactive){pointer-events:none}:host(.no-border) .container{border-top:none;border-bottom:none}:host(.rounded){border-radius:var(--border-radius-08, 0.5rem)}:host(.rounded) .container{border-radius:var(--border-radius-08, 0.5rem)}:host(.chartio) .container .content yoo-kpi,:host(.external) .container .content yoo-kpi{pointer-events:initial}";
 

package/dist/design-system/yoo-kpi-external.entry.js

@@ -1,10 +1,10 @@
 import { r as registerInstance, i as createEvent, h, g as getElement } from './index-019c1b1a.js';
-import { o as isWeb, cu as updateSVGCustomColors, v as isIOS, d as isNativeMobile, t as translate } from './index-dde1f033.js';
-import { q as querySelectorDeep } from './common-helpers-d99b3c41.js';
+import { o as isWeb, cu as updateSVGCustomColors, v as isIOS, d as isNativeMobile, t as translate } from './index-504f216f.js';
+import { q as querySelectorDeep } from './common-helpers-b49fc758.js';
 import { g as getElementDimensions } from './dimensions-helpers-74309fae.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const kpiExternalCss = ":host{-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;width:100%}:host iframe{width:100%;height:100%;border:0 none}";
 

package/dist/design-system/yoo-kpi.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, i as createEvent, h, e as Host, g as getElement } from './index-019c1b1a.js';
-import { o as isWeb, t as translate } from './index-dde1f033.js';
+import { o as isWeb, t as translate } from './index-504f216f.js';
 import { k as getPhotoSVG } from './annotations-helpers-06bdd868.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const kpiCss = ":host{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;min-height:0}:host .photo-container{position:relative;width:100%;height:100%}:host .empty-state{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-direction:column;flex-direction:column;height:100%}:host .empty-state yoo-empty-state{height:6.25rem}:host .empty-state div{color:var(--text-color, #807f83);font-size:var(--font-size-16, 1rem);opacity:0.7}";
 

package/dist/design-system/yoo-layout-sections.entry.js

@@ -0,0 +1,24 @@
+import { r as registerInstance, i as createEvent, h, e as Host } from './index-019c1b1a.js';
+import { t as translate } from './index-504f216f.js';
+import './lodash-494e728c.js';
+import './_commonjsHelpers-f4d11124.js';
+import './index-93c86f26.js';
+
+const layoutSectionsCss = ":host{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;overflow:hidden}.content{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;padding:var(--spacing-16, 1rem);padding:0;overflow-y:auto;}.content::-webkit-scrollbar{width:var(--spacing-04, 0.25rem);height:var(--spacing-04, 0.25rem)}.content::-webkit-scrollbar-track{background-color:transparent;border-radius:var(--border-radius-04, 0.25rem)}.content::-webkit-scrollbar-thumb{background-color:transparent;border-radius:var(--border-radius-04, 0.25rem)}.content:hover::-webkit-scrollbar-track{background-color:var(--stable-light, #f1f1f1)}.content:hover::-webkit-scrollbar-thumb{background:var(--stable, #adadad)}.content app-grid{-ms-flex:initial;flex:initial;height:10rem}.content .container{-ms-flex:1;flex:1;margin-bottom:var(--spacing-08, 0.5rem);padding:var(--spacing-16, 1rem);padding-top:0;background-color:var(--light, #ffffff)}.content .container.alternate{padding-top:var(--spacing-08, 0.5rem);padding-bottom:0;background-color:var(--stable-ultralight, #fafafa)}.content .container ::slotted(*){display:block;height:calc((100vh - 24rem) / 2)}.title{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin-bottom:var(--spacing-08, 0.5rem);font-weight:bold;font-size:var(--font-size-20, 1.25rem)}.title .flex{-ms-flex:1;flex:1}.title .see-all{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;color:var(--app-color, #5a30f4);font-size:var(--font-size-14, 0.875rem);cursor:pointer}.title .see-all yoo-icon{margin-left:var(--spacing-08, 0.5rem)}:host(.bordered) .container{border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host(.small-font) .content .title{font-size:var(--font-size-14, 0.875rem)}:host(.two-rows) .content .container ::slotted(*){height:calc((100vh - 16rem) / 2)}:host(.single-row) .content .container ::slotted(*){height:calc(100vh - 20rem)}:host(.mobile) .content .container.alternate{-ms-flex:initial;flex:initial}:host(.mobile) .content .container ::slotted(*){height:inherit}";
+
+const YooLayoutSectionsComponent = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.seeAllClicked = createEvent(this, "seeAllClicked", 7);
+  }
+  renderConfig(config) {
+    return h("div", { class: { container: true, alternate: config.isAlternate } }, h("div", { class: "title" }, translate(config.title), h("div", { class: "flex" }), config.showSeeAll && h("div", { class: "see-all", onClick: () => this.seeAllClicked.emit(config.seeAllType) }, translate('YOOBICSEEALL'), h("yoo-icon", { color: "app-color", name: "right", size: "small" }))), config.slotName && h("slot", { name: config.slotName }));
+  }
+  render() {
+    var _a;
+    return h(Host, null, h("div", { class: "content" }, (_a = this.config) === null || _a === void 0 ? void 0 : _a.map((c) => this.renderConfig(c))));
+  }
+};
+YooLayoutSectionsComponent.style = layoutSectionsCss;
+
+export { YooLayoutSectionsComponent as yoo_layout_sections };

package/dist/design-system/yoo-layout-tabs.entry.js

@@ -0,0 +1,29 @@
+import { r as registerInstance, i as createEvent, h, e as Host } from './index-019c1b1a.js';
+import { t as translate } from './index-504f216f.js';
+import './lodash-494e728c.js';
+import './_commonjsHelpers-f4d11124.js';
+import './index-93c86f26.js';
+
+const layoutTabsCss = ":host{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column}";
+
+const YooLayoutTabsComponent = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.tabSelected = createEvent(this, "tabSelected", 7);
+  }
+  renderHeader() {
+    return !this.hideHeader && h("yoo-header", null, h("yoo-navbar", null, h("yoo-items", { slot: "start" }, h("slot", { name: "top-left" })), h("yoo-truncate", null, translate(this.header), " ")));
+  }
+  renderTabs() {
+    return h("yoo-header", { class: "secondary" }, h("yoo-tabs", { tabs: this.tabs, initialIndex: this.selectedTabIndex, onTabSelected: (ev) => this.tabSelected.emit(ev.detail) }));
+  }
+  renderBody() {
+    return h("yoo-ion-content", { forceOverscroll: false, class: "bg-light" }, h("slot", { name: "content" }));
+  }
+  render() {
+    return h(Host, null, this.renderHeader(), this.renderTabs(), this.renderBody());
+  }
+};
+YooLayoutTabsComponent.style = layoutTabsCss;
+
+export { YooLayoutTabsComponent as yoo_layout_tabs };

package/dist/design-system/yoo-layout-two-columns.entry.js

@@ -0,0 +1,25 @@
+import { r as registerInstance, h, e as Host } from './index-019c1b1a.js';
+import { t as translate } from './index-504f216f.js';
+import './lodash-494e728c.js';
+import './_commonjsHelpers-f4d11124.js';
+import './index-93c86f26.js';
+
+const layoutTwoColumnsCss = ":host{position:absolute;top:0;right:0;bottom:0;left:0;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}:host .body{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;padding-top:0.0625rem;overflow:hidden}:host .body .left-part{display:-ms-flexbox;display:flex;width:25rem;min-width:25rem;overflow:hidden}:host .body .right-part{display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;overflow:hidden}:host .body .right-part ::slotted(*){display:-ms-flexbox;display:flex;-ms-flex:1;flex:1;-ms-flex-direction:column;flex-direction:column;overflow:hidden}";
+
+const YooLayoutTwoColumsComponent = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+  }
+  renderHeader() {
+    return h("yoo-header", { class: "no-border" }, h("yoo-navbar", { centerTitle: false }, h("yoo-items", { slot: "start" }, h("slot", { name: "top-left" })), h("yoo-truncate", null, " ", translate(this.header), " "), h("yoo-items", { slot: "end", class: "pointer-events" }, h("slot", { name: "top-right" }))));
+  }
+  renderBody() {
+    return h("div", { class: "body" }, h("div", { class: "left-part" }, h("slot", { name: "left-part" })), h("div", { class: "right-part" }, h("slot", { name: "right-part" })));
+  }
+  render() {
+    return h(Host, null, this.renderHeader(), this.renderBody());
+  }
+};
+YooLayoutTwoColumsComponent.style = layoutTwoColumnsCss;
+
+export { YooLayoutTwoColumsComponent as yoo_layout_two_columns };

package/dist/design-system/yoo-lesson-detail-card.entry.js

@@ -1,10 +1,10 @@
 import { r as registerInstance, i as createEvent, h } from './index-019c1b1a.js';
-import { t as translate, T as translateMulti, y as getCssColor } from './index-dde1f033.js';
+import { t as translate, T as translateMulti, y as getCssColor } from './index-504f216f.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
-const lessonDetailCardCss = ":host .card-container .top-bar{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:var(--spacing-56, 3.5rem);padding:0 var(--spacing-16, 1rem)}:host .card-container .top-bar .header .heading{margin:0}:host .card-container .top-bar .header .subheader{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;color:var(--stable);font-size:var(--font-size-12)}:host .card-container .top-bar .header .subheader yoo-icon{margin-right:var(--spacing-04, 0.25rem)}:host .card-container .top-bar .right-column{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}:host .card-container .top-bar .right-column .header-info{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start;margin:0 var(--spacing-08, 0.5rem)}:host .card-container .top-bar .right-column .header-info yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .card-container .top-bar .right-column .header-info p{font-size:var(--font-size-16)}:host .card-container .top-bar .right-column .tag-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin:0 var(--spacing-08, 0.5rem)}:host .card-container .top-bar .right-column .toggle-icon:hover{cursor:pointer}:host .card-container .content-container{max-height:18.75rem;overflow:hidden;-webkit-transition:max-height 200ms;transition:max-height 200ms}:host .card-container .content-container .warning-container{padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem)}:host .card-container .content-container .warning-container .warning{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;padding:var(--spacing-16, 1rem) var(--spacing-08, 0.5rem);background-color:var(--warning-10, rgba(237, 110, 51, 0.1));border-radius:var(--spacing-08, 0.5rem)}:host .card-container .content-container .warning-container .warning .content{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;width:100%;margin:0 var(--spacing-08, 0.5rem)}:host .card-container .content-container .warning-container .warning .content p{margin:0;font-size:var(--font-size-14, 0.875rem)}:host .card-container .content-container .text{margin:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);font-size:var(--font-size-14, 0.875rem)}:host .card-container .content-container .footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:var(--spacing-56, 3.5rem);padding:0 var(--spacing-16, 1rem);border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .card-container .content-container .footer yoo-button{min-width:6rem}:host .card-container .content-container .footer .time-indicator{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start}:host .card-container .content-container .footer .time-indicator yoo-progress-bar{--svg-width:1.8rem;--svg-height:1.8rem;padding:0 var(--spacing-08, 0.5rem)}:host .card-container .content-container .footer .time-indicator .time-text{font-size:var(--font-size-14, 0.875rem)}:host .card-container .content-container.hidden{max-height:0}:host([expanded]) .card-container{padding:var(--spacing-08, 0.5rem) 0}";
+const lessonDetailCardCss = ":host .card-container .top-bar{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:var(--spacing-56, 3.5rem);padding:0 var(--spacing-16, 1rem)}:host .card-container .top-bar .header .heading{margin:0}:host .card-container .top-bar .header .subheader{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;color:var(--stable);font-size:var(--font-size-12)}:host .card-container .top-bar .header .subheader yoo-icon{margin-right:var(--spacing-04, 0.25rem)}:host .card-container .top-bar .right-column{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end}:host .card-container .top-bar .right-column .header-info{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start;margin:0 var(--spacing-08, 0.5rem)}:host .card-container .top-bar .right-column .header-info yoo-icon{margin-right:var(--spacing-08, 0.5rem)}:host .card-container .top-bar .right-column .header-info p{font-size:var(--font-size-16)}:host .card-container .top-bar .right-column .tag-container{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;margin:0 var(--spacing-08, 0.5rem)}:host .card-container .top-bar .right-column .toggle-icon:hover{cursor:pointer}:host .card-container .content-container{max-height:18.75rem;overflow:hidden;-webkit-transition:max-height 200ms;transition:max-height 200ms}:host .card-container .content-container yoo-banner{--main-color:var(--warning-10, rgba(237, 110, 51, 0.1));width:95%;margin:var(--spacing-08, 0.5rem) auto;padding:var(--spacing-08, 0.5rem)}:host .card-container .content-container yoo-banner p{color:var(--dark, #000000)}:host .card-container .content-container .text{margin:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);font-size:var(--font-size-14, 0.875rem)}:host .card-container .content-container .footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:var(--spacing-56, 3.5rem);padding:0 var(--spacing-16, 1rem);border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .card-container .content-container .footer yoo-button{min-width:6rem}:host .card-container .content-container .footer .time-indicator{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:start;justify-content:flex-start}:host .card-container .content-container .footer .time-indicator yoo-progress-bar{--svg-width:1.8rem;--svg-height:1.8rem;padding:0 var(--spacing-08, 0.5rem)}:host .card-container .content-container .footer .time-indicator .time-text{font-size:var(--font-size-14, 0.875rem)}:host .card-container .content-container.hidden{max-height:0}:host([expanded]) .card-container{padding:var(--spacing-08, 0.5rem) 0}";
 
 const YooLessonDetailCard = class {
   constructor(hostRef) {
@@ -62,7 +62,7 @@ const YooLessonDetailCard = class {
   }
   renderWarning() {
     const icon = this.warning.icon ? this.warning.icon : 'warning';
-    return (h("div", { class: "warning-container" }, h("div", { class: "warning" }, h("yoo-icon", { name: icon, size: "medium", color: "warning" }), h("div", { class: "content" }, h("p", null, this.warning.text)), this.warning.button && h("yoo-button", { class: "auto", fill: "transparent", color: "warning", onClick: () => this.onWarningButtonClicked() }, translate(this.warning.button)))));
+    return (h("yoo-banner", { fill: true, leftIcon: { name: icon, color: 'warning' } }, h("p", { slot: "content" }, translate(this.warning.text)), h("yoo-button", { slot: "action", color: "warning", fill: "transparent", class: "auto", onClick: () => this.onWarningButtonClicked() }, translate(this.warning.button))));
   }
   onFooterButtonClick() {
     this.footerButtonClick.emit();

package/dist/design-system/yoo-lesson-detail.entry.js

@@ -1,11 +1,11 @@
 import { r as registerInstance, i as createEvent, h, e as Host, g as getElement } from './index-019c1b1a.js';
-import { o as isWeb, t as translate, T as translateMulti, ap as minsToMinsAndSecs } from './index-dde1f033.js';
+import { o as isWeb, t as translate, T as translateMulti, ap as minsToMinsAndSecs } from './index-504f216f.js';
 import { v as isEmpty, A as get } from './lodash-494e728c.js';
-import { b as getAppContext } from './common-helpers-d99b3c41.js';
+import { b as getAppContext } from './common-helpers-b49fc758.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
-const lessonDetailCss = ":host{display:block;height:100%}:host .lesson-detail{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%}:host .lesson-detail .lesson-content hr{height:0.0625rem;margin-top:0;margin-bottom:0;background:var(--stable-alt, #d0d0d0);border:0}:host .lesson-detail .lesson-content .warning-container{display:-ms-flexbox;display:flex;margin:var(--spacing-16, 1rem) var(--spacing-64, 4rem);padding:var(--spacing-16, 1rem) var(--spacing-08, 0.5rem);background-color:var(--warning-10, rgba(237, 110, 51, 0.1))}:host .lesson-detail .lesson-content .warning-container .content{display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;width:100%;margin:0 var(--spacing-08, 0.5rem)}:host .lesson-detail .lesson-content .warning-container .content p{margin:0;font-size:var(--font-size-14, 0.875rem)}:host .lesson-detail .lesson-content .warning-container .content yoo-button{--hover-color:transparent;margin-top:-0.375rem}:host .lesson-detail .lesson-content .menu{margin:0;padding-top:var(--spacing-16, 1rem);padding-bottom:var(--spacing-16, 1rem);list-style:none}:host .lesson-detail .lesson-content .menu .menu-item{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}:host .lesson-detail .lesson-content .menu .menu-item:not(:last-child) .menu-content{margin-bottom:var(--spacing-24, 1.5rem)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}:host .lesson-detail .lesson-content .menu .menu-item .menu-left.with-dot{width:2rem;margin-left:0.0313rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon{z-index:2;width:1.875rem;height:1.875rem;text-align:center}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon.menu-dot{width:1rem;height:1rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon yoo-icon{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;width:1.875rem;height:1.875rem;padding:0;color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem);line-height:1.875rem;background-color:var(--app-color, #5a30f4);border-radius:50%}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon yoo-icon.dark{background-color:var(--dark, #000000)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon yoo-icon.info{background-color:var(--info, #d84c96)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon yoo-icon.danger{background-color:var(--danger, #d44333)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border{width:0.0625rem;height:100%;background-color:var(--stable-alt, #d0d0d0)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.border-pre{height:2.5rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.border-pre.last{height:1rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.dark{background-color:var(--dark, #000000)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.danger{background-color:var(--danger, #d44333)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.info{background-color:var(--info, #d84c96)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right{width:100%;margin-left:var(--spacing-08, 0.5rem);overflow:hidden}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-title{font-weight:bold;line-height:1}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content{color:var(--text-color, #807f83)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content.menu-chart{margin-bottom:0}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-title{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content span{margin-right:0.5rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content yoo-avatar{margin-right:0.3125rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .font-medium{font-size:var(--font-size-14, 0.875rem)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .font-small{font-size:var(--font-size-12, 0.75rem)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .dark{color:var(--dark, #000000)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .success{color:var(--success, #3aa76d)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .danger{color:var(--danger, #d44333)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .text-color{color:var(--text-color, #807f83)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content table{width:100%;table-layout:fixed}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content table td{overflow:hidden;text-overflow:ellipsis}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .tags{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:4rem;color:var(--dark, #000000);font-size:var(--font-size-12, 0.75rem)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .tags yoo-tag{padding:var(--spacing-08, 0.5rem) 0}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .tags .tag-title{text-align:center}:host .lesson-detail .lesson-content .menu .menu-item:last-child .menu-left .border{display:none}:host .lesson-detail .lesson-content .menu yoo-lesson-highscores:last-child{--display-border:none}:host .lesson-detail .heading-container .title{padding-top:var(--spacing-32, 2rem);padding-bottom:var(--spacing-16, 1rem);color:var(--dark, #000000);font-weight:bold;font-size:var(--font-size-28, 1.75rem);background:var(--stable-light-40, rgba(241, 241, 241, 0.4))}:host .lesson-detail .heading-container yoo-form-dynamic{display:block}:host(.mobile) hr{margin-right:var(--spacing-16, 1rem);margin-left:var(--spacing-16, 1rem)}:host(.mobile) yoo-ion-content>div{padding-top:var(--spacing-16, 1rem);padding-bottom:var(--spacing-16, 1rem)}:host(.mobile) .lesson-detail .lesson-content .warning-container{margin:var(--spacing-16, 1rem)}:host(.mobile) .lesson-detail .lesson-content .warning-container .content{display:block}:host(.mobile) .lesson-detail .lesson-content .warning-container .content p{font-size:var(--font-size-16, 1rem)}:host(.mobile) .lesson-detail .lesson-content .warning-container .content yoo-button{margin:0 0 0 -0.625rem}:host(.mobile) .menu,:host(.mobile) .title{padding-right:var(--spacing-16, 1rem);padding-left:var(--spacing-16, 1rem)}:host(.web) hr{margin-right:var(--spacing-64, 4rem);margin-left:var(--spacing-64, 4rem)}:host(.web) .menu,:host(.web) .title{padding-right:var(--spacing-64, 4rem);padding-left:var(--spacing-64, 4rem)}:host(.web) .lesson-footer{-ms-flex-pack:start;justify-content:flex-start;padding-right:1.875rem;padding-left:1.875rem;border-radius:8px;-webkit-box-shadow:var(--tile-shadow, 0 1px 4px 0 rgba(0, 0, 0, 0.1));box-shadow:var(--tile-shadow, 0 1px 4px 0 rgba(0, 0, 0, 0.1))}:host(.web) .lesson-footer yoo-button{margin-right:var(--spacing-08, 0.5rem)}";
+const lessonDetailCss = ":host{display:block;height:100%}:host .lesson-detail{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;height:100%}:host .lesson-detail .lesson-content hr{height:0.0625rem;margin-top:0;margin-bottom:0;background:var(--stable-alt, #d0d0d0);border:0}:host .lesson-detail .lesson-content yoo-banner{--main-color:var(--warning-10, rgba(237, 110, 51, 0.1));--close-icon-color:var(--light, #ffffff)}:host .lesson-detail .lesson-content yoo-banner p{margin-bottom:0;color:var(--dark, #000000)}:host .lesson-detail .lesson-content .menu{margin:0;padding-top:var(--spacing-16, 1rem);padding-bottom:var(--spacing-16, 1rem);list-style:none}:host .lesson-detail .lesson-content .menu .menu-item{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}:host .lesson-detail .lesson-content .menu .menu-item:not(:last-child) .menu-content{margin-bottom:var(--spacing-24, 1.5rem)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}:host .lesson-detail .lesson-content .menu .menu-item .menu-left.with-dot{width:2rem;margin-left:0.0313rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon{z-index:2;width:1.875rem;height:1.875rem;text-align:center}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon.menu-dot{width:1rem;height:1rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon yoo-icon{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;width:1.875rem;height:1.875rem;padding:0;color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem);line-height:1.875rem;background-color:var(--app-color, #5a30f4);border-radius:50%}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon yoo-icon.dark{background-color:var(--dark, #000000)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon yoo-icon.info{background-color:var(--info, #d84c96)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .menu-icon yoo-icon.danger{background-color:var(--danger, #d44333)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border{width:0.0625rem;height:100%;background-color:var(--stable-alt, #d0d0d0)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.border-pre{height:2.5rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.border-pre.last{height:1rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.dark{background-color:var(--dark, #000000)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.danger{background-color:var(--danger, #d44333)}:host .lesson-detail .lesson-content .menu .menu-item .menu-left .border.info{background-color:var(--info, #d84c96)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right{width:100%;margin-left:var(--spacing-08, 0.5rem);overflow:hidden}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-title{font-weight:bold;line-height:1}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content{color:var(--text-color, #807f83)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content.menu-chart{margin-bottom:0}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-title{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content span{margin-right:0.5rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content yoo-avatar{margin-right:0.3125rem}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .font-medium{font-size:var(--font-size-14, 0.875rem)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .font-small{font-size:var(--font-size-12, 0.75rem)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .dark{color:var(--dark, #000000)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .success{color:var(--success, #3aa76d)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .danger{color:var(--danger, #d44333)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .text-color{color:var(--text-color, #807f83)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content table{width:100%;table-layout:fixed}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content table td{overflow:hidden;text-overflow:ellipsis}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .tags{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:4rem;color:var(--dark, #000000);font-size:var(--font-size-12, 0.75rem)}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .tags yoo-tag{padding:var(--spacing-08, 0.5rem) 0}:host .lesson-detail .lesson-content .menu .menu-item .menu-right .menu-content .tags .tag-title{text-align:center}:host .lesson-detail .lesson-content .menu .menu-item:last-child .menu-left .border{display:none}:host .lesson-detail .lesson-content .menu yoo-lesson-highscores:last-child{--display-border:none}:host .lesson-detail .heading-container .title{padding-top:var(--spacing-32, 2rem);padding-bottom:var(--spacing-16, 1rem);color:var(--dark, #000000);font-weight:bold;font-size:var(--font-size-28, 1.75rem);background:var(--stable-light-40, rgba(241, 241, 241, 0.4))}:host .lesson-detail .heading-container yoo-form-dynamic{display:block}:host(.mobile) hr{margin-right:var(--spacing-16, 1rem);margin-left:var(--spacing-16, 1rem)}:host(.mobile) yoo-ion-content>div{padding-top:var(--spacing-16, 1rem);padding-bottom:var(--spacing-16, 1rem)}:host(.mobile) .lesson-detail .lesson-content .warning-container{margin:var(--spacing-16, 1rem)}:host(.mobile) .lesson-detail .lesson-content .warning-container .content{display:block}:host(.mobile) .lesson-detail .lesson-content .warning-container .content p{font-size:var(--font-size-16, 1rem)}:host(.mobile) .lesson-detail .lesson-content .warning-container .content yoo-button{margin:0 0 0 -0.625rem}:host(.mobile) .menu,:host(.mobile) .title{padding-right:var(--spacing-16, 1rem);padding-left:var(--spacing-16, 1rem)}:host(.web) hr{margin-right:var(--spacing-64, 4rem);margin-left:var(--spacing-64, 4rem)}:host(.web) .menu,:host(.web) .title{padding-right:var(--spacing-64, 4rem);padding-left:var(--spacing-64, 4rem)}:host(.web) .lesson-footer{-ms-flex-pack:start;justify-content:flex-start;padding-right:1.875rem;padding-left:1.875rem;border-radius:8px;-webkit-box-shadow:var(--tile-shadow, 0 1px 4px 0 rgba(0, 0, 0, 0.1));box-shadow:var(--tile-shadow, 0 1px 4px 0 rgba(0, 0, 0, 0.1))}:host(.web) .lesson-footer yoo-button{margin-right:var(--spacing-08, 0.5rem)}";
 
 const YooLessonDetailComponent = class {
   constructor(hostRef) {
@@ -44,7 +44,7 @@ const YooLessonDetailComponent = class {
     return (h("div", { class: "tags" }, h("yoo-tag", { size: "extra-large", icon: badgeEarned ? this.getBadgeIcon(badge) : 'lock', customColor: badgeEarned ? badge.color : '#807F83' }), h("div", { class: "tag-title" }, translateMulti(badge === null || badge === void 0 ? void 0 : badge.title))));
   }
   renderConfidenceWarning() {
-    return (h("div", { class: "warning-container" }, h("yoo-icon", { name: "warning", size: "medium", color: "warning" }), h("div", { class: "content" }, h("p", null, translate('CONFIDENCEWARNING')), h("yoo-button", { class: "auto", fill: "transparent", color: "warning", onClick: () => this.onLearnMoreClicked() }, translate('LEARNMORE')))));
+    return (h("yoo-banner", { class: "sharp", fill: true, leftIcon: { name: 'warning', color: 'warning' } }, h("p", { slot: "content" }, translate('CONFIDENCEWARNING')), h("yoo-button", { slot: "action", color: "warning", fill: "transparent", class: "auto", onClick: () => this.onLearnMoreClicked() }, translate('LEARNMORE'))));
   }
   renderLesson() {
     const retryPrevented = get(this.lesson, 'description.preventRetry', false);

package/dist/design-system/yoo-lesson-heading.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, h, e as Host, g as getElement } from './index-019c1b1a.js';
-import { a3 as getPlanDueDate, t as translate, T as translateMulti } from './index-dde1f033.js';
+import { a3 as getPlanDueDate, t as translate, T as translateMulti } from './index-504f216f.js';
 import { A as get } from './lodash-494e728c.js';
-import { b as getAppContext } from './common-helpers-d99b3c41.js';
+import { b as getAppContext } from './common-helpers-b49fc758.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const lessonHeadingCss = ":host{display:block}:host .heading-container{color:var(--dark, #000000)}:host .heading-container yoo-tag{margin-bottom:var(--spacing-08, 0.5rem)}:host .heading-container .lesson-order{color:var(--app-color, #5a30f4);font-size:var(--font-size-12, 0.75rem);line-height:normal;letter-spacing:0.0625rem;text-transform:uppercase}:host .heading-container .lesson-title{font-weight:bold;font-size:var(--font-size-28, 1.75rem)}:host .heading-container .lesson-date{margin-top:0.3125rem;color:var(--app-color, #5a30f4)}:host .heading-container .lesson-date .date-label{margin-right:0.5rem;color:var(--dark, #000000)}:host(.mobile) .heading-container{padding:0 var(--spacing-16, 1rem) var(--spacing-08, 0.5rem)}:host(.web){margin-top:var(--spacing-32, 2rem)}:host(.web) .heading-container{padding:0 var(--spacing-64, 4rem) var(--spacing-16, 1rem)}";
 

package/dist/design-system/yoo-lesson-highscores.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, h } from './index-019c1b1a.js';
-import { t as translate } from './index-dde1f033.js';
+import { t as translate } from './index-504f216f.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const lessonHighscoresCss = ":host{--display-border:inherit}:host .menu-item{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}:host .menu-item:not(:last-child) .menu-content{margin-bottom:var(--spacing-24, 1.5rem)}:host .menu-item .menu-left{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center}:host .menu-item .menu-left.with-dot{width:2rem;margin-left:0.0313rem}:host .menu-item .menu-left .menu-icon{z-index:2;width:1.875rem;height:1.875rem;text-align:center}:host .menu-item .menu-left .menu-icon.menu-dot{width:1rem;height:1rem}:host .menu-item .menu-left .menu-icon yoo-icon{display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;width:1.875rem;height:1.875rem;padding:0;color:var(--light, #ffffff);font-size:var(--font-size-18, 1.125rem);line-height:1.875rem;background-color:var(--app-color, #5a30f4);border-radius:50%}:host .menu-item .menu-left .menu-icon yoo-icon.dark{background-color:var(--dark, #000000)}:host .menu-item .menu-left .menu-icon yoo-icon.info{background-color:var(--info, #d84c96)}:host .menu-item .menu-left .menu-icon yoo-icon.danger{background-color:var(--danger, #d44333)}:host .menu-item .menu-left .border{width:0.0625rem;height:100%;background-color:var(--stable-alt, #d0d0d0)}:host .menu-item .menu-left .border.border-pre{height:2.5rem}:host .menu-item .menu-left .border.border-pre.last{height:1rem}:host .menu-item .menu-left .border.dark{background-color:var(--dark, #000000)}:host .menu-item .menu-left .border.danger{background-color:var(--danger, #d44333)}:host .menu-item .menu-left .border.info{background-color:var(--info, #d84c96)}:host .menu-item .menu-right{width:100%;margin-left:var(--spacing-08, 0.5rem);overflow:hidden}:host .menu-item .menu-right .menu-title{font-weight:bold;line-height:1}:host .menu-item .menu-right .menu-content{color:var(--text-color, #807f83)}:host .menu-item .menu-right .menu-content.menu-chart{margin-bottom:0}:host .menu-item .menu-right .menu-title{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;height:2rem}:host .menu-item .menu-right .menu-content span{margin-right:0.5rem}:host .menu-item .menu-right .menu-content yoo-avatar{margin-right:0.3125rem}:host .menu-item .menu-right .menu-content .font-medium{font-size:var(--font-size-14, 0.875rem)}:host .menu-item .menu-right .menu-content .font-small{font-size:var(--font-size-12, 0.75rem)}:host .menu-item .menu-right .menu-content .dark{color:var(--dark, #000000)}:host .menu-item .menu-right .menu-content .success{color:var(--success, #3aa76d)}:host .menu-item .menu-right .menu-content .danger{color:var(--danger, #d44333)}:host .menu-item .menu-right .menu-content .text-color{color:var(--text-color, #807f83)}:host .menu-item .menu-right .menu-content table{width:100%;table-layout:fixed}:host .menu-item .menu-right .menu-content table td{overflow:hidden;text-overflow:ellipsis}:host .border{display:var(--display-border)}";
 

package/dist/design-system/yoo-lesson-question-result.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, i as createEvent, h, k as getAssetPath, e as Host, g as getElement } from './index-019c1b1a.js';
-import { cn as isContentOnly, co as getConfidencePoints, cp as getConfidenceDescriptionKey, t as translate, ap as minsToMinsAndSecs, o as isWeb, cq as showRatingDialog, bc as isOffline, E as getAsyncExtraData, y as getCssColor, T as translateMulti, ai as isImage, d as isNativeMobile, cr as isPdf, cs as answerIsValid, ct as getCorrectAnswersCount, cu as updateSVGCustomColors, cv as isQuiz } from './index-dde1f033.js';
+import { cn as isContentOnly, co as getConfidencePoints, cp as getConfidenceDescriptionKey, t as translate, ap as minsToMinsAndSecs, o as isWeb, cq as showRatingDialog, bc as isOffline, E as getAsyncExtraData, y as getCssColor, T as translateMulti, ai as isImage, d as isNativeMobile, cr as isPdf, cs as answerIsValid, ct as getCorrectAnswersCount, cu as updateSVGCustomColors, cv as isQuiz } from './index-504f216f.js';
 import { A as get, l as isNumber } from './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const lessonQuestionResultCss = ":host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;height:100%;background-color:var(--light, #ffffff)}:host yoo-navbar{background-color:var(--stable-light, #f1f1f1)}:host yoo-ion-scroll{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;width:100%}:host yoo-ion-scroll .result-title{margin:var(--spacing-08, 0.5rem) 0 var(--spacing-16, 1rem) 0;color:var(--app-color, #5a30f4);text-align:center}:host yoo-ion-scroll .result-text{margin:0 var(--spacing-64, 4rem);padding-bottom:var(--spacing-08, 0.5rem);color:var(--text-color, #807f83);line-height:1.5625rem;text-align:center}:host yoo-ion-scroll .result-explanation{margin:var(--spacing-08, 0.5rem) var(--spacing-64, 4rem);text-align:center}:host yoo-ion-scroll .result-explanation .explanation-value{color:var(--text-color, #807f83);line-height:1.5625rem}:host yoo-ion-scroll .result-explanation .explanation-title{padding-bottom:var(--spacing-08, 0.5rem);font-weight:bold}:host yoo-ion-scroll .separator{width:90%;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-alt, #d0d0d0)}:host yoo-ion-scroll .result-document{margin:var(--spacing-16, 1rem)}:host yoo-ion-scroll .result-document .document-title{padding-bottom:var(--spacing-08, 0.5rem);font-weight:bold;font-size:var(--font-size-16, 1rem);text-align:center}:host yoo-ion-scroll .result-tag{padding:var(--spacing-08, 0.5rem);text-align:center}:host yoo-ion-scroll .result-tag span{color:var(--dark, #000000);font-size:var(--font-size-16, 1rem)}:host yoo-ion-scroll .result-tag span.action{color:var(--stable, #adadad);font-size:var(--font-size-14, 0.875rem);cursor:pointer}:host yoo-ion-scroll .result-tag .tag{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;margin:auto;font-size:var(--font-size-12, 0.75rem)}:host yoo-ion-scroll .result-tag .tag .tag-title{text-align:center}:host yoo-ion-scroll .result-tag .tags{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center}:host yoo-ion-scroll .result-tag .tags .badge-container{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;width:var(--spacing-56, 3.5rem);margin:var(--spacing-08, 0.5rem) 0;font-size:var(--font-size-12, 0.75rem)}:host yoo-ion-scroll .result-tag .tags .badge-container yoo-tag{padding:var(--spacing-04, 0.25rem);background:var(--light, #ffffff);border-radius:var(--spacing-40, 2.5rem)}:host yoo-ion-scroll .document-image{display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0;-webkit-box-sizing:border-box;box-sizing:border-box;padding:var(--spacing-16, 1rem);overflow:hidden;--border-radius:var(--border-radius-08, 0.5rem)}:host yoo-ion-scroll yoo-progress-recap,:host yoo-ion-scroll yoo-points-recap{display:block;width:calc(100% - 2rem);max-width:30rem;margin:0 auto;padding:var(--spacing-08, 0.5rem)}:host .wall{position:absolute;width:100%;height:16rem;background-image:-webkit-gradient(linear, left bottom, left top, from(var(--light, #ffffff)), to(var(--stable-light, #f1f1f1)));background-image:linear-gradient(to top, var(--light, #ffffff), var(--stable-light, #f1f1f1));mix-blend-mode:multiply}:host yoo-lottie{height:12.5rem}:host yoo-tag{display:block;margin:0 auto}:host main{width:100%;padding-top:calc(var(--safe-area-inset-top) + var(--spacing-32, 2rem))}:host .answers{width:100%;padding-bottom:var(--spacing-16, 1rem)}:host .answers .title{padding:var(--spacing-08, 0.5rem) var(--spacing-16, 1rem);font-size:var(--font-size-24, 1.5rem)}";
 
@@ -243,7 +243,7 @@ const YooLessonQuestionResultComponent = class {
   renderCourseTopBadges(badges) {
     const topBadges = badges === null || badges === void 0 ? void 0 : badges.slice(0, 3);
     return ((topBadges === null || topBadges === void 0 ? void 0 : topBadges.length) > 0 && (h("div", { class: "result-tag" }, h("span", null, translate('NEWBADGESCOLLECTED', { smart_count: badges.length })), h("div", { class: "tags" }, h("yoo-img", { src: getAssetPath('./assets/bubbles/left-bubbles.svg'), svgOptions: { afterLoad: (_, svgString) => updateSVGCustomColors(svgString) } }), topBadges === null || topBadges === void 0 ? void 0 :
-      topBadges.map((badge, index) => (h("div", { class: "badge-container", style: { zIndex: `${topBadges.length - index}` } }, h("yoo-tag", { size: "extra-large", icon: badge === null || badge === void 0 ? void 0 : badge.icon, customColor: badge === null || badge === void 0 ? void 0 : badge.color })))), h("yoo-img", { src: getAssetPath('./assets/bubbles/right-bubbles.svg'), svgOptions: { afterLoad: (_, svgString) => updateSVGCustomColors(svgString) } })), h("span", { class: "action", onClick: () => this.onSeeAllBadges() }, translate('SEEALL')))));
+      topBadges.map((badge, index) => (h("div", { class: "badge-container", style: { zIndex: `${topBadges.length - index}` } }, h("yoo-tag", { size: "extra-large", icon: badge === null || badge === void 0 ? void 0 : badge.icon, customColor: badge === null || badge === void 0 ? void 0 : badge.color })))), h("yoo-img", { src: getAssetPath('./assets/bubbles/right-bubbles.svg'), svgOptions: { afterLoad: (_, svgString) => updateSVGCustomColors(svgString) } })), h("span", { class: "action", onClick: () => this.onSeeAllBadges() }, translate('YOOBICSEEALL')))));
   }
   renderLessonResult() {
     return [

package/dist/design-system/yoo-line-state.entry.js

@@ -1,5 +1,5 @@
 import { r as registerInstance, h, e as Host } from './index-019c1b1a.js';
-import { V as TLineState } from './index-21c7d38e.js';
+import { V as TLineState } from './index-93c86f26.js';
 
 const lineStateCss = ":host{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-negative:0;flex-shrink:0;-ms-flex-align:center;align-items:center;width:1.25rem;padding:0 var(--spacing-16, 1rem)}:host .line{width:1px;background-color:var(--app-color, #5a30f4)}:host .line.top{min-height:var(--spacing-08, 0.5rem)}:host .line.bottom{height:100%}:host .icon-gap{min-height:var(--spacing-24, 1.5rem)}:host yoo-icon{position:absolute;top:var(--spacing-08, 0.5rem)}:host([state=regular]) .line.top,:host([state=finished]) .line.top{min-height:0.625rem}:host([state=regular]) .icon-gap,:host([state=finished]) .icon-gap{min-height:1.188rem}:host(.mobile) .line{width:2px}";
 

package/dist/design-system/yoo-links-menu.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, i as createEvent, h, g as getElement } from './index-019c1b1a.js';
-import { o as isWeb, t as translate } from './index-dde1f033.js';
+import { o as isWeb, t as translate } from './index-504f216f.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const linksMenuCss = ":host{display:block}:host .links-menu{margin:0;padding:0;font-size:100%;vertical-align:baseline;list-style:none outside none;background:none repeat scroll 0 0 transparent;border:0 none;outline:0 none;-webkit-tap-highlight-color:transparent;margin:0;padding:0;list-style:none;cursor:pointer}:host .links-menu .links-menu-item{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:auto;min-height:var(--spacing-48, 3rem);padding:0 var(--spacing-16, 1rem);font-weight:var(--font-weight-400, 400);line-height:var(--font-size-36, 2.25rem);cursor:pointer}:host .links-menu .links-menu-item>div{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .links-menu .links-menu-item>div yoo-badge{margin-left:var(--spacing-08, 0.5rem)}:host .links-menu .links-menu-item yoo-icon:not([name=right]){margin-right:var(--spacing-16, 1rem)}:host .links-menu .links-menu-item .end-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}:host .links-menu .links-menu-item .end-container .subtitle-container{padding-right:var(--spacing-08, 0.5rem)}:host .links-menu .links-menu-item.active{color:var(--app-color, #5a30f4);background:var(--stable-alt-10, rgba(208, 208, 208, 0.1))}:host .links-menu .links-menu-item.active yoo-icon{fill:var(--app-color, #5a30f4)}:host .links-menu .help-container{margin:0 var(--spacing-16, 1rem);padding:var(--spacing-08, 0.5rem) 0;color:var(--stable, #adadad);font-size:var(--font-size-12, 0.75rem);border-top:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .links-menu.web .links-menu-item{font-weight:unset;border-bottom:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}";
 

package/dist/design-system/yoo-links-preview.entry.js

@@ -1,10 +1,10 @@
 import { r as registerInstance, i as createEvent, f as forceUpdate, h, e as Host, g as getElement } from './index-019c1b1a.js';
-import { c9 as replaceAndGetAllLinks, E as getAsyncExtraData, bC as screenOrientationUnlock, bD as screenOrientationLock, eA as isDeeplink, ai as isImage } from './index-dde1f033.js';
-import { s as setValidator } from './form-input-helpers-df1e7fe4.js';
+import { c9 as replaceAndGetAllLinks, E as getAsyncExtraData, bC as screenOrientationUnlock, bD as screenOrientationLock, eA as isDeeplink, ai as isImage } from './index-504f216f.js';
+import { s as setValidator } from './form-input-helpers-222c6af7.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
-import './common-helpers-d99b3c41.js';
+import './index-93c86f26.js';
+import './common-helpers-b49fc758.js';
 
 const linksPreviewCss = ":host{position:relative;display:block;color:var(--dark, #000000);background:var(--stable-ultralight, #fafafa);-webkit-box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));}:host #preview{display:grid;-ms-flex-align:center;align-items:center;-webkit-box-sizing:border-box;box-sizing:border-box;cursor:pointer}:host #preview #image-fallback{width:100%;height:var(--card-media-height, 14.375rem);background:var(--stable-light, #f1f1f1)}:host #preview #image-fallback yoo-icon[name=image-offline]{fill:var(--stable, #adadad);position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}:host #preview #image-fallback yoo-icon[name=image-offline].rtl{top:50%;right:50%;-webkit-transform:translate(50%, -50%);transform:translate(50%, -50%)}:host #preview #image{width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;margin:0 auto}:host #preview #description{display:inline-grid;-ms-flex-direction:column;flex-direction:column;grid-gap:var(--spacing-04, 0.25rem);-webkit-box-sizing:border-box;box-sizing:border-box;width:100%;padding:var(--spacing-08, 0.5rem)}:host #preview #description #title{color:var(--dark, #000000);font-weight:bold;font-size:var(--font-size-16, 1rem);overflow:hidden}@supports (display: -webkit-box){:host #preview #description #title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}}:host #preview #description #link{font-weight:bold;font-size:var(--font-size-12, 0.75rem)}:host #preview #description .url{margin-top:auto;color:var(--text-color, #807f83);font-size:var(--font-size-14, 0.875rem);text-decoration:none;overflow:hidden}@supports (display: -webkit-box){:host #preview #description .url{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}}:host.multi-link-previews #preview{margin-bottom:var(--spacing-16, 1rem)}:host.big-link-previews{padding-top:var(--spacing-16, 1rem)}:host.big-link-previews #preview{-ms-flex-direction:column;flex-direction:column}:host.big-link-previews #preview #image,:host.big-link-previews #preview #image-fallback{width:auto;height:auto}:host([closeable]) yoo-icon[name=cross]{position:absolute;top:50%;right:var(--spacing-04, 0.25rem);z-index:15;-webkit-transform:translateY(-50%);transform:translateY(-50%)}:host(:not([inline])) #preview yoo-img{border-top-left-radius:var(--border-radius-04, 0.25rem);border-top-right-radius:var(--border-radius-04, 0.25rem)}:host([inline]) #preview{height:5rem;margin:auto var(--spacing-08, 0.5rem)}:host([inline]) #preview:not(.no-image){grid-template-columns:1fr 2fr;gap:var(--spacing-16, 1rem)}:host([inline]) #preview #image yoo-img{--image-height:4.5rem;max-height:4.5rem;border-radius:var(--border-radius-04, 0.25rem)}:host([inline]) #preview #description{padding:inherit}:host([inline]) #preview #description #title{overflow:unset;font-size:var(--font-size-12, 0.75rem);white-space:unset;text-overflow:unset;overflow:hidden}@supports (display: -webkit-box){:host([inline]) #preview #description #title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}}";
 

package/dist/design-system/yoo-loader.entry.js

@@ -1,10 +1,10 @@
 import { r as registerInstance, h, e as Host } from './index-019c1b1a.js';
-import { t as translate } from './index-dde1f033.js';
+import { t as translate } from './index-504f216f.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
-const loaderCss = ":host([color=accent]) circle{stroke:var(--accent, #276ef1)}:host([color=anthracite]) circle{stroke:var(--anthracite, #1a1a1a)}:host([color=app-color]) circle{stroke:var(--app-color, #5a30f4)}:host([color=danger]) circle{stroke:var(--danger, #d44333)}:host([color=dark]) circle{stroke:var(--dark, #000000)}:host([color=energized]) circle{stroke:var(--energized, #ffc043)}:host([color=info]) circle{stroke:var(--info, #d84c96)}:host([color=light]) circle{stroke:var(--light, #ffffff)}:host([color=stable]) circle{stroke:var(--stable, #adadad)}:host([color=stable-alt]) circle{stroke:var(--stable-alt, #d0d0d0)}:host([color=stable-light]) circle{stroke:var(--stable-light, #f1f1f1)}:host([color=stable-ultralight]) circle{stroke:var(--stable-ultralight, #fafafa)}:host([color=success]) circle{stroke:var(--success, #3aa76d)}:host([color=text-color]) circle{stroke:var(--text-color, #807f83)}:host([color=warning]) circle{stroke:var(--warning, #ed6e33)}:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host circle{fill:none;stroke-dasharray:165;stroke-width:6}:host p{margin:var(--spacing-08, 0.5rem) 0 0 0;color:var(--stable, #adadad)}:host([animated]) svg{-webkit-animation:rotation 0.7s linear infinite;animation:rotation 0.7s linear infinite}@-webkit-keyframes rotation{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotation{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}:host([hidden]){display:none}:host([size=small]) svg{width:1.5rem}:host([size=small]) p{font-size:var(--font-size-12, 0.75rem)}:host([size=medium]) svg{width:2rem}:host([size=medium]) p{font-size:var(--font-size-14, 0.875rem)}:host([size=large]) svg{width:3rem}:host([size=large]) p{font-size:var(--font-size-16, 1rem)}:host(.absolute){position:absolute;top:0;right:0;bottom:0;left:0;z-index:9}:host(.fixed){position:fixed;top:0;right:0;bottom:0;left:0;z-index:9}:host(.backdrop){position:absolute;z-index:20500;background:var(--light-80, rgba(255, 255, 255, 0.8))}:host(.backdrop.fixed){position:fixed}:host(.backdrop-dark-40){background:var(--dark-40, rgba(0, 0, 0, 0.4))}:host(.backdrop-dark){background:var(--dark, #000000)}:host(.backdrop-light){background:var(--light, #ffffff)}:host(.backdrop-transparent){background:var(--stable-light-80, rgba(241, 241, 241, 0.8))}";
+const loaderCss = ":host([color=accent]) circle{stroke:var(--accent, #276ef1)}:host([color=anthracite]) circle{stroke:var(--anthracite, #1a1a1a)}:host([color=app-color]) circle{stroke:var(--app-color, #5a30f4)}:host([color=danger]) circle{stroke:var(--danger, #d44333)}:host([color=dark]) circle{stroke:var(--dark, #000000)}:host([color=energized]) circle{stroke:var(--energized, #ffc043)}:host([color=info]) circle{stroke:var(--info, #d84c96)}:host([color=light]) circle{stroke:var(--light, #ffffff)}:host([color=stable]) circle{stroke:var(--stable, #adadad)}:host([color=stable-alt]) circle{stroke:var(--stable-alt, #d0d0d0)}:host([color=stable-light]) circle{stroke:var(--stable-light, #f1f1f1)}:host([color=stable-ultralight]) circle{stroke:var(--stable-ultralight, #fafafa)}:host([color=success]) circle{stroke:var(--success, #3aa76d)}:host([color=text-color]) circle{stroke:var(--text-color, #807f83)}:host([color=warning]) circle{stroke:var(--warning, #ed6e33)}:host([size=extra-small]) svg{width:var(--icon-size-01, 1rem)}:host([size=extra-small]) p{font-size:var(--font-size-12, 0.75rem)}:host([size=small]) svg{width:var(--icon-size-02, 1.5rem)}:host([size=small]) p{font-size:var(--font-size-12, 0.75rem)}:host([size=medium]) svg{width:var(--icon-size-03, 2rem)}:host([size=medium]) p{font-size:var(--font-size-14, 0.875rem)}:host([size=large]) svg{width:var(--icon-size-04, 3rem)}:host([size=large]) p{font-size:var(--font-size-16, 1rem)}:host([size=extra-large]) svg{width:var(--icon-size-05, 4rem)}:host([size=extra-large]) p{font-size:var(--font-size-18, 1.125rem)}:host([size=extra-extra-large]) svg{width:var(--icon-size-06, 5rem)}:host([size=extra-extra-large]) p{font-size:var(--font-size-20, 1.25rem)}:host{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host circle{fill:none;stroke-dasharray:165;stroke-width:6}:host p{margin:var(--spacing-08, 0.5rem) 0 0 0;color:var(--stable, #adadad)}:host([animated]) svg{-webkit-animation:rotation 0.7s linear infinite;animation:rotation 0.7s linear infinite}@-webkit-keyframes rotation{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes rotation{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}:host([hidden]){display:none}:host(.absolute){position:absolute;top:0;right:0;bottom:0;left:0;z-index:9}:host(.fixed){position:fixed;top:0;right:0;bottom:0;left:0;z-index:9}:host(.backdrop){position:absolute;z-index:20500;background:var(--light-80, rgba(255, 255, 255, 0.8))}:host(.backdrop.fixed){position:fixed}:host(.backdrop-dark-40){background:var(--dark-40, rgba(0, 0, 0, 0.4))}:host(.backdrop-dark){background:var(--dark, #000000)}:host(.backdrop-light){background:var(--light, #ffffff)}:host(.backdrop-transparent){background:var(--stable-light-80, rgba(241, 241, 241, 0.8))}";
 
 const YooLoaderComponent = class {
   constructor(hostRef) {

package/dist/design-system/yoo-location-info.entry.js

@@ -1,8 +1,8 @@
 import { r as registerInstance, h } from './index-019c1b1a.js';
-import { t as translate, W as pipes } from './index-dde1f033.js';
+import { t as translate, W as pipes } from './index-504f216f.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const locationInfoCss = ":host .outer-container{margin-top:0.5rem;margin-bottom:0.5rem;padding:0.5rem 1rem;background:var(--light, #ffffff)}:host .outer-container .menu-content{padding-bottom:1rem;line-height:1.75}:host .outer-container .menu-content span{color:var(--dark, #000000);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);line-height:1em}:host .outer-container .menu-content .menu-content-contact{text-decoration:none}:host .outer-container .menu-content .menu-content-contact.name{font-size:var(--font-size-18, 1.125rem)}:host .outer-container .menu-content .menu-content-contact.email{color:var(--app-color, #5a30f4)}:host .outer-container .menu-content .menu-content-contact.phone{color:var(--dark, #000000)}";
 

package/dist/design-system/yoo-location-map.entry.js

@@ -1,9 +1,9 @@
 import { r as registerInstance, i as createEvent, h, g as getElement } from './index-019c1b1a.js';
-import { o as isWeb, n as showModal, t as translate } from './index-dde1f033.js';
-import { s as showDirectionsActionSheet } from './map-helpers-1dcaa4a9.js';
+import { o as isWeb, n as showModal, t as translate } from './index-504f216f.js';
+import { s as showDirectionsActionSheet } from './map-helpers-93e79959.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
 const locationMapCss = ":host .outer-container{margin:var(--spacing-08, 0.5rem) 1rem;padding:0.8rem 0;padding-bottom:0rem;overflow:hidden;background:var(--light-10, rgba(255, 255, 255, 0.1));background:var(--light, #ffffff);border-radius:8px;-webkit-box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1));box-shadow:var(--shadow-01, 0 0.0625rem 0.25rem 0 rgba(0, 0, 0, 0.1))}:host .outer-container .background-image{height:200px}:host .outer-container .content{padding:0 1rem}:host .outer-container .content .title{padding-bottom:1rem;color:var(--stable, #adadad);font-size:var(--font-size-12, 0.75rem);text-transform:uppercase}:host .outer-container .content .text-line{color:var(--dark, #000000);font-size:var(--font-size-14, 0.875rem);text-transform:none}:host .outer-container .content .text-line.top{padding-bottom:1rem;font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);line-height:1em}:host .outer-container .footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;background:var(--light, #ffffff);border-top:0.0625rem solid var(--stable-light, #f1f1f1)}";
 

package/dist/design-system/yoo-login.entry.js

@@ -1,12 +1,12 @@
 import { r as registerInstance, i as createEvent, f as forceUpdate, h, e as Host, g as getElement } from './index-019c1b1a.js';
-import { cw as setStatusBarDarkMode, aa as disableKeyboardResize, p as debounce, cx as LoginFocusAnimation, S as ScreenOrientation, ab as enableKeyboardResize, d as isNativeMobile, j as isTablet, ch as isIonic, P as isIphone5, v as isIOS, af as showActionSheet, t as translate, o as isWeb, cy as getContrastColorName, Q as isIphoneSE, e as isAndroid, _ as getSession, i as isChromatic, u as isIphoneX } from './index-dde1f033.js';
-import { f as querySelectorAllDeep, b as getAppContext } from './common-helpers-d99b3c41.js';
+import { cw as setStatusBarDarkMode, aa as disableKeyboardResize, p as debounce, cx as LoginFocusAnimation, S as ScreenOrientation, ab as enableKeyboardResize, d as isNativeMobile, j as isTablet, ch as isIonic, P as isIphone5, v as isIOS, af as showActionSheet, t as translate, o as isWeb, cy as getContrastColorName, Q as isIphoneSE, e as isAndroid, _ as getSession, i as isChromatic, u as isIphoneX } from './index-504f216f.js';
+import { f as querySelectorAllDeep, b as getAppContext } from './common-helpers-b49fc758.js';
 import { g as getElementDimensions } from './dimensions-helpers-74309fae.js';
 import './lodash-494e728c.js';
 import './_commonjsHelpers-f4d11124.js';
-import './index-21c7d38e.js';
+import './index-93c86f26.js';
 
-const loginCss = ":host{display:block;width:100%;height:100%}:host yoo-form-input-container:first-of-type{margin-bottom:1rem}:host p{margin:0}:host video{width:100%;-o-object-fit:cover;object-fit:cover}:host .inner-container{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end}:host .login-button{margin-top:var(--spacing-16, 1rem)}:host .powered-by{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;font-size:var(--font-size-12, 0.75rem)}:host .powered-by.light{color:var(--light, #ffffff)}:host .powered-by.dark{color:var(--dark, #000000)}:host .powered-by *{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .powered-by *+*{margin-top:var(--spacing-04, 0.25rem)}:host .powered-by img{margin:0 var(--spacing-04, 0.25rem)}:host .powered-by [hidden]{display:none}:host .outer-container{position:absolute;top:0;right:0;bottom:0;left:0;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}:host .outer-container .left-panel,:host .outer-container .right-panel{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;overflow:hidden;background-color:var(--light, #ffffff)}:host .outer-container .left-panel yoo-banner,:host .outer-container .right-panel yoo-banner{z-index:2}:host .outer-container .left-panel .content-container,:host .outer-container .right-panel .content-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:100%}:host .outer-container .left-panel .content-container .content,:host .outer-container .right-panel .content-container .content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host .outer-container .left-panel .content-container .header,:host .outer-container .left-panel .content-container .footer,:host .outer-container .right-panel .content-container .header,:host .outer-container .right-panel .content-container .footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:80%;padding:0 2rem}:host .outer-container .left-panel .background,:host .outer-container .right-panel .background{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background-repeat:no-repeat;background-position-x:50%;background-size:cover}:host .outer-container .left-panel .background-overlay,:host .outer-container .right-panel .background-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;background-color:var(--dark, #000000);opacity:0.5}:host .outer-container .left-panel{-ms-flex:0 0 25rem;flex:0 0 25rem;color:var(--light, #ffffff)}:host .outer-container .left-panel.border{border-right:var(--border-width-01, 0.0625rem) solid var(--stable-light, #f1f1f1)}:host .outer-container .left-panel video{position:absolute;height:100%}:host .outer-container .left-panel .content-container{z-index:2}:host .outer-container .left-panel .content-container .header{-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:start;justify-content:flex-start}:host .outer-container .left-panel .content-container .content{font-size:var(--font-size-18, 1.125rem)}:host .outer-container .left-panel .content-container .content .title-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:1.25rem;font-size:var(--font-size-14, 0.875rem)}:host .outer-container .left-panel .content-container .content .subtitle-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:0 2rem;letter-spacing:0.0625rem;text-align:center}:host .outer-container .left-panel .content-container .footer{-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}:host .outer-container .left-panel .text-container{padding-top:2rem;font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);text-align:center}:host .outer-container .right-panel{width:100%;height:100%;color:var(--text-color, #807f83)}:host .outer-container .right-panel yoo-alert{width:100%}:host .outer-container .right-panel.ios yoo-banner{--margin-top-inner-container:0.6315rem}:host .outer-container .right-panel .content-container .header{-ms-flex-pack:end;justify-content:flex-end}:host .outer-container .right-panel .content-container .header.no-padding{padding-top:0.375rem !important}:host .outer-container .right-panel .content-container .header.reset{-ms-flex-pack:justify;justify-content:space-between}:host .outer-container .right-panel .content-container .header.iphone-x{padding-top:3rem !important}:host .outer-container .right-panel .content-container .header .close{width:1.875rem;height:1.875rem;border:solid var(--border-width-01, 0.0625rem) var(--stable, #adadad);border-radius:var(--spacing-16, 1rem);opacity:0}:host .outer-container .right-panel .content-container .header .close:hover{cursor:pointer}:host .outer-container .right-panel .content-container .header .logo{display:-ms-flexbox;display:flex;padding-right:1rem}:host .outer-container .right-panel .content-container .header .logo.hide{display:none}:host .outer-container .right-panel .content-container .content{width:100%}:host .outer-container .right-panel .content-container .content .login-title{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:0.5rem;color:var(--dark, #000000);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-28, 1.75rem)}:host .outer-container .right-panel .content-container .content .login-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%;margin:auto}:host .outer-container .right-panel .content-container .content .login-container .login-subtitle{padding-bottom:2rem}:host .outer-container .right-panel .content-container .content .login-container .login-button{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center}:host .outer-container .right-panel .content-container .content .login-container-mobile{width:calc(100% - 4rem);height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:0 2rem;-webkit-transition:0.3s;transition:0.3s}:host .outer-container .right-panel .content-container .content .login-container-mobile.unfocused{margin-top:10%}:host .outer-container .right-panel .content-container .content .login-container-mobile.iphone-se-focus{margin-bottom:10rem}:host .outer-container .right-panel .content-container .content .login-container-mobile .login-button{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center;margin-bottom:var(--spacing-16, 1rem);-webkit-transition:0.3s;transition:0.3s}:host .outer-container .right-panel .content-container .content .login-container-mobile .login-button.device-padding{margin-top:var(--spacing-08, 0.5rem)}:host .outer-container .right-panel .content-container .footer{width:100%}:host .outer-container .right-panel .content-container .footer.iphone-x{padding-bottom:var(--spacing-16, 1rem)}:host .outer-container .right-panel .content-container .video-header-container-mobile{position:relative;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;width:80%;padding:0 2rem;text-align:center}:host .outer-container .right-panel .content-container .video-header-container-mobile:not(.hide):not(.focused){min-height:120px}:host .outer-container .right-panel .content-container .video-header-container-mobile.hide{display:none}:host .outer-container .right-panel .content-container .video-header-container-mobile .auto-margin{margin:auto}:host .outer-container .right-panel .content-container .video-header-container-mobile .text{position:absolute;top:0;left:2rem;margin-bottom:1.875rem;font-weight:var(--font-weight-700, 700);font-size:var(--font-size-28, 1.75rem);letter-spacing:normal;text-align:left;text-transform:initial;opacity:0}:host .outer-container .right-panel .content-container .video-header-container-mobile .text.iphone-5{margin-bottom:0}:host .outer-container .right-panel .background{position:absolute;z-index:0;min-width:100%;min-height:100%;-webkit-filter:blur(0.15rem);filter:blur(0.15rem)}:host .outer-container .right-panel.video-background{color:var(--light, #ffffff);background-color:var(--dark-40, rgba(0, 0, 0, 0.4))}@-webkit-keyframes show{from{visibility:hidden;opacity:0}to{visibility:visible;opacity:1}}@keyframes show{from{visibility:hidden;opacity:0}to{visibility:visible;opacity:1}}:host .outer-container .right-panel.video-background video{position:absolute;min-width:100%;min-height:100%;-webkit-filter:blur(0.15rem);filter:blur(0.15rem)}:host .outer-container .right-panel.video-background video.android{visibility:hidden;opacity:0;-webkit-animation:show 500ms forwards;animation:show 500ms forwards;-webkit-animation-delay:1s;animation-delay:1s}:host .outer-container .right-panel.video-background .content-container .login-container-mobile yoo-form-input-container yoo-form-input{--input-text-color:cssvar(light) !important}:host .outer-container .right-panel.video-background .content-container .login-container-mobile yoo-form-input-container yoo-form-input.has-invalid-format{margin-top:0}:host(.web) .outer-container .left-panel .content-container .footer,:host(.web) .outer-container .left-panel .content-container .header,:host(.web) .outer-container .right-panel .content-container .footer,:host(.web) .outer-container .right-panel .content-container .header{height:6rem}:host(.web) .outer-container .left-panel .content-container .subtitle-container,:host(.web) .outer-container .right-panel .content-container .subtitle-container{padding:0 3rem;font-weight:300;font-size:var(--font-size-14, 0.875rem);line-height:1.3125rem;letter-spacing:normal}:host(.web) .outer-container .left-panel .content-container .subtitle-container b,:host(.web) .outer-container .right-panel .content-container .subtitle-container b{font-size:var(--font-size-18, 1.125rem);text-transform:uppercase}:host(.web) .outer-container .left-panel .content-container .footer,:host(.web) .outer-container .right-panel .content-container .footer{-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;font-size:var(--font-size-14, 0.875rem)}:host(.web) .outer-container .left-panel .content-container .header{-ms-flex-pack:center;justify-content:center}:host(.web) .outer-container .left-panel .content-container .header .logo img{height:2rem}:host(.web) .outer-container .left-panel .content-container .header .logo.big img{height:6rem;margin-top:4rem}:host(.web) .outer-container .right-panel .content-container .content{max-width:25rem}:host(.web) .outer-container .right-panel .content-container .content .login-container{width:100%;margin:auto}:host(.mobile) .outer-container .right-panel yoo-banner{--padding-top-container:1.325rem}:host(.mobile) .outer-container .right-panel yoo-banner:not(.android){margin-bottom:-1rem}:host(.mobile) .outer-container .right-panel .background-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background-color:var(--dark, #000000);opacity:0.5}:host(.mobile) .outer-container .right-panel .content-container .header.reduce-padding,:host(.mobile) .outer-container .right-panel .content-container .footer.reduce-padding{padding-top:1rem}:host(.mobile) .outer-container .right-panel .content-container .header:not(.android){padding-top:2rem}:host(.mobile) .outer-container .right-panel .content-container .header.android{padding-top:1rem}:host(.mobile) .outer-container .right-panel .content-container .content{z-index:10;-ms-flex-pack:center;justify-content:center;width:100%;max-width:25rem;height:100%}:host(.mobile) .outer-container .right-panel .content-container .content.android{padding-top:0rem}:host(.mobile) .outer-container .right-panel .content-container .content .login-title{-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center;height:25%}:host(.mobile) .outer-container .right-panel .content-container .content .login-title .inner-title{text-align:center}:host(.mobile) .outer-container .right-panel .content-container .footer.android{padding-top:0}:host(.mobile) .outer-container .right-panel .content-container .footer.hide{display:none}:host(.mobile) .outer-container .right-panel .content-container .footer:not(.android){padding-bottom:1rem}@media (orientation: landscape){:host(.tablet.ios:not(.emulate-preview)) .outer-container .right-panel .content-container .content .video-header-container-mobile.focused{display:none}}";
+const loginCss = ":host{display:block;width:100%;height:100%}:host yoo-form-input-container:first-of-type{margin-bottom:1rem}:host p{margin:0}:host video{width:100%;-o-object-fit:cover;object-fit:cover}:host .inner-container{display:-ms-flexbox;display:flex;-ms-flex-pack:end;justify-content:flex-end}:host .login-button{margin-top:var(--spacing-16, 1rem)}:host .powered-by{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;font-size:var(--font-size-12, 0.75rem)}:host .powered-by.light{color:var(--light, #ffffff)}:host .powered-by.dark{color:var(--dark, #000000)}:host .powered-by *{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center}:host .powered-by *+*{margin-top:var(--spacing-04, 0.25rem)}:host .powered-by img{margin:0 var(--spacing-04, 0.25rem)}:host .powered-by [hidden]{display:none}:host .outer-container{position:absolute;top:0;right:0;bottom:0;left:0;display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row}:host .outer-container .left-panel,:host .outer-container .right-panel{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:justify;justify-content:space-between;overflow:hidden;background-color:var(--light, #ffffff)}:host .outer-container .left-panel yoo-banner,:host .outer-container .right-panel yoo-banner{--main-color:var(--danger, #d44333);--close-icon-color:var(--light, #ffffff);z-index:2}:host .outer-container .left-panel yoo-banner p,:host .outer-container .right-panel yoo-banner p{padding:var(--spacing-24, 1.5rem)}:host .outer-container .left-panel .content-container,:host .outer-container .right-panel .content-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-align:center;align-items:center;-ms-flex-pack:justify;justify-content:space-between;height:100%}:host .outer-container .left-panel .content-container .content,:host .outer-container .right-panel .content-container .content{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-line-pack:center;align-content:center;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center}:host .outer-container .left-panel .content-container .header,:host .outer-container .left-panel .content-container .footer,:host .outer-container .right-panel .content-container .header,:host .outer-container .right-panel .content-container .footer{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;width:80%;padding:0 2rem}:host .outer-container .left-panel .background,:host .outer-container .right-panel .background{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background-repeat:no-repeat;background-position-x:50%;background-size:cover}:host .outer-container .left-panel .background-overlay,:host .outer-container .right-panel .background-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;background-color:var(--dark, #000000);opacity:0.5}:host .outer-container .left-panel{-ms-flex:0 0 25rem;flex:0 0 25rem;color:var(--light, #ffffff)}:host .outer-container .left-panel video{position:absolute;height:100%}:host .outer-container .left-panel .content-container{z-index:2}:host .outer-container .left-panel .content-container .header{-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:start;justify-content:flex-start}:host .outer-container .left-panel .content-container .content{font-size:var(--font-size-18, 1.125rem)}:host .outer-container .left-panel .content-container .content .title-container{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:1.25rem;font-size:var(--font-size-14, 0.875rem)}:host .outer-container .left-panel .content-container .content .subtitle-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;padding:0 2rem;letter-spacing:0.0625rem;text-align:center}:host .outer-container .left-panel .content-container .footer{-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}:host .outer-container .left-panel .text-container{padding-top:2rem;font-weight:var(--font-weight-700, 700);font-size:var(--font-size-18, 1.125rem);text-align:center}:host .outer-container .right-panel{width:100%;height:100%;color:var(--text-color, #807f83)}:host .outer-container .right-panel yoo-alert{width:100%}:host .outer-container .right-panel.ios yoo-banner{--margin-top-inner-container:0.6315rem}:host .outer-container .right-panel .content-container .header{-ms-flex-pack:end;justify-content:flex-end}:host .outer-container .right-panel .content-container .header.no-padding{padding-top:0.375rem !important}:host .outer-container .right-panel .content-container .header.reset{-ms-flex-pack:justify;justify-content:space-between}:host .outer-container .right-panel .content-container .header.iphone-x{padding-top:3rem !important}:host .outer-container .right-panel .content-container .header .close{width:1.875rem;height:1.875rem;border:solid var(--border-width-01, 0.0625rem) var(--stable, #adadad);border-radius:var(--spacing-16, 1rem);opacity:0}:host .outer-container .right-panel .content-container .header .close:hover{cursor:pointer}:host .outer-container .right-panel .content-container .header .logo{display:-ms-flexbox;display:flex;padding-right:1rem}:host .outer-container .right-panel .content-container .header .logo.hide{display:none}:host .outer-container .right-panel .content-container .content{width:100%}:host .outer-container .right-panel .content-container .content .login-title{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;padding-bottom:0.5rem;color:var(--dark, #000000);font-weight:var(--font-weight-700, 700);font-size:var(--font-size-28, 1.75rem)}:host .outer-container .right-panel .content-container .content .login-container{display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%;margin:auto}:host .outer-container .right-panel .content-container .content .login-container .login-subtitle{padding-bottom:2rem}:host .outer-container .right-panel .content-container .content .login-container .login-button{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center}:host .outer-container .right-panel .content-container .content .login-container-mobile{width:calc(100% - 4rem);height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;padding:0 2rem;-webkit-transition:0.3s;transition:0.3s}:host .outer-container .right-panel .content-container .content .login-container-mobile.unfocused{margin-top:10%}:host .outer-container .right-panel .content-container .content .login-container-mobile.iphone-se-focus{margin-bottom:10rem}:host .outer-container .right-panel .content-container .content .login-container-mobile .login-button{display:-ms-flexbox;display:flex;-ms-flex-direction:row;flex-direction:row;-ms-flex-pack:center;justify-content:center;margin-bottom:var(--spacing-16, 1rem);-webkit-transition:0.3s;transition:0.3s}:host .outer-container .right-panel .content-container .content .login-container-mobile .login-button.device-padding{margin-top:var(--spacing-08, 0.5rem)}:host .outer-container .right-panel .content-container .footer{width:100%}:host .outer-container .right-panel .content-container .footer.iphone-x{padding-bottom:var(--spacing-16, 1rem)}:host .outer-container .right-panel .content-container .video-header-container-mobile{position:relative;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;width:80%;padding:0 2rem;text-align:center}:host .outer-container .right-panel .content-container .video-header-container-mobile:not(.hide):not(.focused){min-height:120px}:host .outer-container .right-panel .content-container .video-header-container-mobile.hide{display:none}:host .outer-container .right-panel .content-container .video-header-container-mobile .auto-margin{margin:auto}:host .outer-container .right-panel .content-container .video-header-container-mobile .text{position:absolute;top:0;left:2rem;margin-bottom:1.875rem;font-weight:var(--font-weight-700, 700);font-size:var(--font-size-28, 1.75rem);letter-spacing:normal;text-align:left;text-transform:initial;opacity:0}:host .outer-container .right-panel .content-container .video-header-container-mobile .text.iphone-5{margin-bottom:0}:host .outer-container .right-panel .background{position:absolute;z-index:0;min-width:100%;min-height:100%;-webkit-filter:blur(0.15rem);filter:blur(0.15rem)}:host .outer-container .right-panel.video-background{color:var(--light, #ffffff);background-color:var(--dark-40, rgba(0, 0, 0, 0.4))}@-webkit-keyframes show{from{visibility:hidden;opacity:0}to{visibility:visible;opacity:1}}@keyframes show{from{visibility:hidden;opacity:0}to{visibility:visible;opacity:1}}:host .outer-container .right-panel.video-background video{position:absolute;min-width:100%;min-height:100%;-webkit-filter:blur(0.15rem);filter:blur(0.15rem)}:host .outer-container .right-panel.video-background video.android{visibility:hidden;opacity:0;-webkit-animation:show 500ms forwards;animation:show 500ms forwards;-webkit-animation-delay:1s;animation-delay:1s}:host .outer-container .right-panel.video-background .content-container .login-container-mobile yoo-form-input-container yoo-form-input{--input-text-color:cssvar(light) !important}:host .outer-container .right-panel.video-background .content-container .login-container-mobile yoo-form-input-container yoo-form-input.has-invalid-format{margin-top:0}:host(.web) .outer-container .left-panel .content-container .footer,:host(.web) .outer-container .left-panel .content-container .header,:host(.web) .outer-container .right-panel .content-container .footer,:host(.web) .outer-container .right-panel .content-container .header{height:6rem}:host(.web) .outer-container .left-panel .content-container .subtitle-container,:host(.web) .outer-container .right-panel .content-container .subtitle-container{padding:0 3rem;font-weight:300;font-size:var(--font-size-14, 0.875rem);line-height:1.3125rem;letter-spacing:normal}:host(.web) .outer-container .left-panel .content-container .subtitle-container b,:host(.web) .outer-container .right-panel .content-container .subtitle-container b{font-size:var(--font-size-18, 1.125rem);text-transform:uppercase}:host(.web) .outer-container .left-panel .content-container .footer,:host(.web) .outer-container .right-panel .content-container .footer{-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;font-size:var(--font-size-14, 0.875rem)}:host(.web) .outer-container .left-panel .content-container .header{-ms-flex-pack:center;justify-content:center}:host(.web) .outer-container .left-panel .content-container .header .logo img{height:2rem}:host(.web) .outer-container .left-panel .content-container .header .logo.big img{height:6rem;margin-top:4rem}:host(.web) .outer-container .right-panel .content-container .content{max-width:25rem}:host(.web) .outer-container .right-panel .content-container .content .login-container{width:100%;margin:auto}:host(.mobile) .outer-container .right-panel yoo-banner{--padding-top-container:1.325rem;margin-bottom:-1rem}:host(.mobile) .outer-container .right-panel .background-overlay{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background-color:var(--dark, #000000);opacity:0.5}:host(.mobile) .outer-container .right-panel .content-container .header.reduce-padding,:host(.mobile) .outer-container .right-panel .content-container .footer.reduce-padding{padding-top:1rem}:host(.mobile) .outer-container .right-panel .content-container .header:not(.android){padding-top:2rem}:host(.mobile) .outer-container .right-panel .content-container .header.android{padding-top:1rem}:host(.mobile) .outer-container .right-panel .content-container .content{z-index:10;-ms-flex-pack:center;justify-content:center;width:100%;max-width:25rem;height:100%}:host(.mobile) .outer-container .right-panel .content-container .content.android{padding-top:0rem}:host(.mobile) .outer-container .right-panel .content-container .content .login-title{-ms-flex-align:end;align-items:flex-end;-ms-flex-pack:center;justify-content:center;height:25%}:host(.mobile) .outer-container .right-panel .content-container .content .login-title .inner-title{text-align:center}:host(.mobile) .outer-container .right-panel .content-container .footer.android{padding-top:0}:host(.mobile) .outer-container .right-panel .content-container .footer.hide{display:none}:host(.mobile) .outer-container .right-panel .content-container .footer:not(.android){padding-bottom:1rem}@media (orientation: landscape){:host(.tablet.ios:not(.emulate-preview)) .outer-container .right-panel .content-container .content .video-header-container-mobile.focused{display:none}}";
 
 const MIN_SCREEN_SIZE_LEFT_PANEL = 900;
 const IPHONE5_HEIGHT = 580;
@@ -308,10 +308,10 @@ const YooLoginComponent = class {
     if (!this.hasVideoBackground()) {
       backStyle = { backgroundImage: `url(${this.backgroundSrc})` };
     }
-    return (h("div", { class: { 'left-panel': true, border: !!this.backgroundColor } }, this.backgroundSrc && backStyle ? h("div", { class: "background", style: backStyle }) : this.hasVideoBackground() ? this.renderVideo() : null, h("div", { class: "background-overlay", style: { background: this.backgroundColor, opacity: ((_a = this.backgroundColor) === null || _a === void 0 ? void 0 : _a.startsWith('#')) ? '1' : null } }), h("div", { class: "content-container" }, this.renderHeader(), this.renderPanelBody('leftPanel'), h("div", { class: { footer: true, android: isAndroid() } }, this.renderFooter()))));
+    return (h("div", { class: "left-panel" }, this.backgroundSrc && backStyle ? h("div", { class: "background", style: backStyle }) : this.hasVideoBackground() ? this.renderVideo() : null, h("div", { class: "background-overlay", style: { background: this.backgroundColor, opacity: ((_a = this.backgroundColor) === null || _a === void 0 ? void 0 : _a.startsWith('#')) ? '1' : null } }), h("div", { class: "content-container" }, this.renderHeader(), this.renderPanelBody('leftPanel'), h("div", { class: { footer: true, android: isAndroid() } }, this.renderFooter()))));
   }
   renderErrorBanner() {
-    return (h("yoo-banner", { id: "error-alert", animationName: "sticky_up", class: { 'top danger embedded centered header': true, android: isAndroid() }, text: this.error, closable: !isIonic(this.host), link: !isIonic(this.host) ? 'NEEDHELP' : '', onAlertActionSelected: () => this.onAlertActionSelected(), onAlertClosed: () => this.onAlertClosed() }));
+    return (h("yoo-banner", { class: "center sharp", fill: true, closable: !isIonic(this.host), linkText: !isIonic(this.host) ? translate('NEEDHELP') : '', onLinkClick: () => this.onAlertActionSelected(), onCloseClick: () => this.onAlertClosed() }, h("p", { slot: "content" }, translate(this.error))));
   }
   renderRightPanel() {
     let backStyle;