lido-player 0.0.2-alpha-7 → 0.0.2-alpha-8

package/dist/cjs/index.cjs.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const utils = require('./utils-2740b263.js');
+const utils = require('./utils-1697a6b5.js');
 require('./index-0d28e716.js');
 
 

package/dist/cjs/lido-avatar_13.cjs.entry.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-0d28e716.js');
-const utils = require('./utils-2740b263.js');
+const utils = require('./utils-1697a6b5.js');
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
@@ -6652,6 +6652,7 @@ const LidoContainer = class {
         index.registerInstance(this, hostRef);
         this.id = undefined;
         this.objective = undefined;
+        this.customStyle = undefined;
         this.value = undefined;
         this.height = undefined;
         this.width = undefined;
@@ -6727,6 +6728,11 @@ const LidoContainer = class {
         window.addEventListener('resize', () => this.scaleContainer(this.el));
         window.addEventListener('load', () => this.scaleContainer(this.el));
         utils.initEventsForElement(this.el, this.type);
+        if (this.customStyle) {
+            const styleElement = document.createElement('style');
+            styleElement.innerHTML = this.customStyle;
+            document.head.appendChild(styleElement);
+        }
     }
     render() {
         // Define the styles for the container element
@@ -6740,7 +6746,7 @@ const LidoContainer = class {
             transform: 'translate(-50%, -50%)', // Centering the container
         };
         console.log('🚀 ~ LidoContainer ~ canplay:', this.canplay);
-        return (index.h(index.Host, { key: '96c4e07b2e62aa2071d386da3d56d20b35778bd4', id: "lido-container", tabindex: 0, class: "lido-container", objective: this.objective, style: style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, onTouch: this.onTouch, onInCorrect: this.onInCorrect, onCorrect: this.onCorrect, onEntry: this.onEntry, showCheck: `${this.showCheck}`, isContinueOnCorrect: `${this.isContinueOnCorrect}`, isAllowOnlyCorrect: `${this.isAllowOnlyCorrect}`, canplay: `${this.canplay}` }, index.h("slot", { key: '30c3337dbd0d963c0d0a308f5b2a6d3e5514e15b' })));
+        return (index.h(index.Host, { key: 'be7c50232bd0362f217b44d7f4d723f1ed5c40ec', id: "lido-container", tabindex: 0, class: "lido-container", objective: this.objective, style: style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, onTouch: this.onTouch, onInCorrect: this.onInCorrect, onCorrect: this.onCorrect, onEntry: this.onEntry, showCheck: `${this.showCheck}`, isContinueOnCorrect: `${this.isContinueOnCorrect}`, isAllowOnlyCorrect: `${this.isAllowOnlyCorrect}`, canplay: `${this.canplay}` }, index.h("slot", { key: '8ce427c8388574aa7019b83cddae13a182db47ab' })));
     }
     get el() { return index.getElement(this); }
 };
@@ -6749,7 +6755,7 @@ LidoContainer.style = LidoContainerStyle0;
 const indexCss = "@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@400..800&display=swap'); body{overflow:hidden}.lido-disable-check-button{pointer-events:none;background-color:#9393935c !important;color:white}.lido-element-selected{border:2px solid;background-color:#ffdf7d !important}";
 const LidoHomeStyle0 = indexCss;
 
-const animationCss = "@keyframes rightToPlace{from{transform:translateX(2000px)}to{left:0}}@keyframes placeToLeft{from{}to{transform:translateX(-2000px)}}@keyframes shake{0%{transform:translateX(0)}10%{transform:translateX(-5px)}20%{transform:translateX(5px)}30%{transform:translateX(-5px)}40%{transform:translateX(5px)}50%{transform:translateX(-5px)}60%{transform:translateX(5px)}70%{transform:translateX(-5px)}80%{transform:translateX(5px)}90%{transform:translateX(-5px)}100%{transform:translateX(0)}}@keyframes fallAndBounce{0%{transform:translateY(-1000px)}25%{transform:translateY(0px)}50%{transform:translateY(-200px)}75%{transform:translateY(0)}90%{transform:translateY(-100px)}100%{transform:translateY(0)}}@keyframes placeToDown{0%{transform:translateY(0)}100%{transform:translateY(1000px)}}";
+const animationCss = "@keyframes rightToPlace{from{transform:translateX(2000px)}to{transform:translateX(0)}}@keyframes topToPlace{from{transform:translateY(-1000px)}to{transform:translateY(0)}}@keyframes bottomToPlace{from{transform:translateY(1000px)}to{transform:translateY(0)}}@keyframes placeToLeft{from{}to{transform:translateX(-2000px)}}@keyframes leftToPlace{from{transform:translateX(-2000px)}to{transform:translateX(0)}}@keyframes shake{0%{transform:translateX(0)}10%{transform:translateX(-5px)}20%{transform:translateX(5px)}30%{transform:translateX(-5px)}40%{transform:translateX(5px)}50%{transform:translateX(-5px)}60%{transform:translateX(5px)}70%{transform:translateX(-5px)}80%{transform:translateX(5px)}90%{transform:translateX(-5px)}100%{transform:translateX(0)}}@keyframes fallAndBounce{0%{transform:translateY(-1000px)}25%{transform:translateY(0px)}50%{transform:translateY(-200px)}75%{transform:translateY(0)}90%{transform:translateY(-100px)}100%{transform:translateY(0)}}@keyframes placeToDown{0%{transform:translateY(0)}100%{transform:translateY(1000px)}}";
 const LidoHomeStyle1 = animationCss;
 
 const lidoHomeCss = ".lido-snackbar{visibility:visible;min-width:250px;background-color:#333;color:#fff;text-align:center;border-radius:2px;padding:16px;position:fixed;z-index:1;bottom:30px;left:50%;transform:translateX(-50%);font-size:17px}.lido-dot-container{text-align:center;position:fixed;z-index:1;width:fit-content;top:1%;left:50%;transform:translate(-50%)}.lido-dot{height:15px;width:15px;margin:0 4px;background-color:#bbb;border-radius:50%;display:inline-block;transition:background-color 0.3s;cursor:pointer}.lido-dot.completed{background-color:grey}.lido-dot.current{background-color:green}.lido-dot:not(.completed):not(.current){background-color:#bbb}";
@@ -6799,7 +6805,7 @@ const LidoHome = class {
         this.initialIndex = 0;
         this.canplay = true;
         this.baseUrl = '';
-        this.height = '200px';
+        this.height = '';
         this.currentContainerIndex = this.initialIndex;
         this.showCompletionMessage = false;
         this.containers = [];