lido-player 0.0.2-beta-18-dev → 0.0.2-beta-21-dev

package/dist/collection/components/image/lido-image.js

@@ -552,7 +552,7 @@ export class LidoImage {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Specifies the width for border-image slice (e.g., \"30px\", \"2em\").\r\nOnly used when `isSlice` is enabled."
+                    "text": "Specifies the width for border-image slice (e.g., \"30px\", \"2em\").\nOnly used when `isSlice` is enabled."
                 },
                 "getter": false,
                 "setter": false,
@@ -612,7 +612,7 @@ export class LidoImage {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "CSS margin value applied to each child element inside the container.\r\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
+                    "text": "CSS margin value applied to each child element inside the container.\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
                 },
                 "getter": false,
                 "setter": false,
@@ -632,7 +632,7 @@ export class LidoImage {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "CSS padding value applied to each child element inside the container.\r\nAccepts standard CSS padding formats (e.g., '10px', '5px 10px', etc.)."
+                    "text": "CSS padding value applied to each child element inside the container.\nAccepts standard CSS padding formats (e.g., '10px', '5px 10px', etc.)."
                 },
                 "getter": false,
                 "setter": false,
@@ -652,7 +652,7 @@ export class LidoImage {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "CSS filter to apply visual effects (e.g., blur, brightness) to the image.\r\nExample: 'blur(5px)', 'brightness(0.8)', 'grayscale(100%)'"
+                    "text": "CSS filter to apply visual effects (e.g., blur, brightness) to the image.\nExample: 'blur(5px)', 'brightness(0.8)', 'grayscale(100%)'"
                 },
                 "getter": false,
                 "setter": false,
@@ -672,7 +672,7 @@ export class LidoImage {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "CSS filter to apply border radius to the image.\r\nExample: '10px' for  images."
+                    "text": "CSS filter to apply border radius to the image.\nExample: '10px' for  images."
                 },
                 "getter": false,
                 "setter": false,
@@ -692,7 +692,7 @@ export class LidoImage {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "CSS transform property to apply transformations like rotate, scale, translate, etc.\r\nExample: 'rotate(45deg)' or 'scale(1.2)'."
+                    "text": "CSS transform property to apply transformations like rotate, scale, translate, etc.\nExample: 'rotate(45deg)' or 'scale(1.2)'."
                 },
                 "getter": false,
                 "setter": false,

package/dist/collection/components/keyboard/lido-keyboard.css

@@ -1,38 +1,38 @@
-.lido-keyboard {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  gap: 30px;
-}
-
-.input-area {
-  display: flex;
-  gap: 15px;
-}
-
-input[type="text"] {
-  font-size: 30px;
-  font-weight: 600;
-  padding-left: 20px;
-  width: 300px;
-  height: 70px;
-  border: 2px solid;
-  background: whitesmoke;
-  border-radius: 20px;
-  text-align: center;
-}
-
-.keyboard-wrapper {
-  justify-content: center;
-  width: 700px;
-}
-
-.disabled {
-  opacity: 0.5;
-  pointer-events: none;
-}
-
-.key-button {
-  background: aquamarine;
-  font-weight: 600;
-}
+.lido-keyboard {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 30px;
+}
+
+.input-area {
+  display: flex;
+  gap: 15px;
+}
+
+input[type="text"] {
+  font-size: 30px;
+  font-weight: 600;
+  padding-left: 20px;
+  width: 300px;
+  height: 70px;
+  border: 2px solid;
+  background: whitesmoke;
+  border-radius: 20px;
+  text-align: center;
+}
+
+.keyboard-wrapper {
+  justify-content: center;
+  width: 700px;
+}
+
+.disabled {
+  opacity: 0.5;
+  pointer-events: none;
+}
+
+.key-button {
+  background: aquamarine;
+  font-weight: 600;
+}

package/dist/collection/components/keyboard/lido-keyboard.js

@@ -139,10 +139,10 @@ export class LidoKeyboard {
         const keysArray = this.keys.split(',').map(k => k.trim());
         const container = document.getElementById(LidoContainer);
         const showCheck = container.getAttribute('show-check') === 'true';
-        return (h(Host, { key: '4de3b75fa2905744ad610d147d9b4fe9912dd732', class: "lido-keyboard", style: { width: this.style.width, height: this.style.height, position: 'relative', margin: this.style.margin, zIndex: this.z } }, this.keyboardInput && (h("div", { key: '7b5d293c52747700cde9c1069cfbbdae065e64f9', class: "input-area" }, h("input", { key: '03a91cd87e6bb4f09bf698087258426dd9232f67', type: "text", value: this.inputString, class: "input-area", readonly: true }), h("lido-text", { key: 'd30e033a055df52b30b2f2775c2b3410ee37df63', visible: showCheck ? 'true' : 'false', string: "<<", "bg-color": "black", "font-color": "white", "border-radius": "20px", "font-size": "30px", width: "100px", height: "70px", type: "click", onClick: () => {
+        return (h(Host, { key: '5773e8189c512e90d63217048f9372d00e4a7fe9', class: "lido-keyboard", style: { width: this.style.width, height: this.style.height, position: 'relative', margin: this.style.margin, zIndex: this.z } }, this.keyboardInput && (h("div", { key: '136fa3a2b0459a9a63e14ac8e212997e4bd32224', class: "input-area" }, h("input", { key: 'd9a1dc064d615b40b1e0e2b008dbf79ec70eb19b', type: "text", value: this.inputString, class: "input-area", readonly: true }), h("lido-text", { key: 'e6c53ea590c607b355d1f57d445d078c0bcf9085', visible: showCheck ? 'true' : 'false', string: "<<", "bg-color": "black", "font-color": "white", "border-radius": "20px", "font-size": "30px", width: "100px", height: "70px", type: "click", onClick: () => {
                 this.inputString = this.inputString.slice(0, -1);
                 this.inputValidation(event);
-            } }), h("lido-text", { key: '70d78aed7dedbe7d03a05c13c4c320029280bb03', visible: showCheck ? 'true' : 'false', id: "lido-checkButton", string: "Enter", "bg-color": "green", "font-color": "white", "border-radius": "20px", "font-size": "30px", width: "150px", height: "70px", type: "click" }))), this.letterLength && (h("lido-text", { key: '19306cd12bd98dc8dc7b54b20bad3f2f0318116f', visible: "true", string: `${this.numberOfClick}/${this.letterLength}`, "font-size": "60px", "font-color": "white", onEntry: "this.position='absolute'; this.right='0'; this.fontWeight='800';", x: "unset" })), h("div", { key: '826900d6ba26175eb45d2e7e4c02fccce2004db3', class: "keyboard-wrapper", style: {
+            } }), h("lido-text", { key: '815877bd027aa3540871c511df5937cfb0b6f149', visible: showCheck ? 'true' : 'false', id: "lido-checkButton", string: "Enter", "bg-color": "green", "font-color": "white", "border-radius": "20px", "font-size": "30px", width: "150px", height: "70px", type: "click" }))), this.letterLength && (h("lido-text", { key: '73c08eac4f9c154f47371e812fb337de26b10691', visible: "true", string: `${this.numberOfClick}/${this.letterLength}`, "font-size": "60px", "font-color": "white", onEntry: "this.position='absolute'; this.right='0'; this.fontWeight='800';", x: "unset" })), h("div", { key: '1e7855724f15fdb432320f6186fc356518a29224', class: "keyboard-wrapper", style: {
                 display: 'flex',
                 flexWrap: 'wrap',
                 justifyContent: 'center',
@@ -514,7 +514,7 @@ export class LidoKeyboard {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Indicates whether the keyboard input is enabled.\r\nWhen set to `true`, the component will respond to keyboard events."
+                    "text": "Indicates whether the keyboard input is enabled.\nWhen set to `true`, the component will respond to keyboard events."
                 },
                 "getter": false,
                 "setter": false,

package/dist/collection/components/mathMatrix/lido-math-matrix.css

@@ -1,56 +1,56 @@
-.math-matrix {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  justify-content: center;
-}
-
-.slot {
-  width: 100%;
-  height: 100%;
-  text-align: center;
-  align-content: center;
-  font-size: 42px;
-  font-weight: 800;
-  font-family: 'Baloo Bhai 2';
-  box-sizing: content-box;
-}
-
-.slot:hover {
-  /* background-color: rgba(0, 0, 0, 0.116); */
-  opacity: 0.7;
-}
-
-.slot-parent {
-  width: 100%;
-  height: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-direction: column;
-}
-
-.slot-active {
-  background-color: var(--active-bg-color);
-  background-image: var(--bg-image);
-  background-size: contain;
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.slot-inactive {
-  background-color: var(--deactive-bg-color);
-  background-size: cover;
-  background-position: center;
-  background-repeat: no-repeat;
-}
-
-.topIndex, .leftIndex, .bottomIndex {
-  height: 100%;
-  width: 100%;
-  text-align: center;
-  align-content: center;
-  font-size: 30px;
-  font-weight: 600;
-  font-family: 'Baloo Bhai 2';
-}
+.math-matrix {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+}
+
+.slot {
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  align-content: center;
+  font-size: 42px;
+  font-weight: 800;
+  font-family: 'Baloo Bhai 2';
+  box-sizing: content-box;
+}
+
+.slot:hover {
+  /* background-color: rgba(0, 0, 0, 0.116); */
+  opacity: 0.7;
+}
+
+.slot-parent {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+}
+
+.slot-active {
+  background-color: var(--active-bg-color);
+  background-image: var(--bg-image);
+  background-size: contain;
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.slot-inactive {
+  background-color: var(--deactive-bg-color);
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+.topIndex, .leftIndex, .bottomIndex {
+  height: 100%;
+  width: 100%;
+  text-align: center;
+  align-content: center;
+  font-size: 30px;
+  font-weight: 600;
+  font-family: 'Baloo Bhai 2';
+}

package/dist/collection/components/mathMatrix/lido-math-matrix.js

@@ -209,7 +209,7 @@ export class LidoMathMatrix {
     render() {
         let slotNumber = 1;
         const slotData = this.getSlotData();
-        return (h(Host, { key: '8a17727416da00fda95c401c3a005cdea1e732d0', class: "math-matrix", style: {
+        return (h(Host, { key: '2ef30835855363ba9fc7932122d1d505a451e055', class: "math-matrix", style: {
                 height: this.style.height,
                 width: this.style.width,
                 z: this.style.z,

package/dist/collection/components/position/lido-pos.css

@@ -1,16 +1,16 @@
-.lido-pos {
-  top: var(--y, 0);
-  left: var(--x, 0);
-  height: var(--height, 100%);
-  width: var(--width, 100%);
-  background-color: var(--bgColor, #eeeeee);
-  display: flex;
-  justify-content: space-around;
-  flex-direction: column;
-  position: fixed;
-  
-}
-
-.lido-pos > * {
-  position: absolute;
-}
+.lido-pos {
+  top: var(--y, 0);
+  left: var(--x, 0);
+  height: var(--height, 100%);
+  width: var(--width, 100%);
+  background-color: var(--bgColor, #eeeeee);
+  display: flex;
+  justify-content: space-around;
+  flex-direction: column;
+  position: fixed;
+  
+}
+
+.lido-pos > * {
+  position: absolute;
+}

package/dist/collection/components/position/lido-pos.js

@@ -131,7 +131,7 @@ export class LidoPos {
         };
     }
     render() {
-        return (h(Host, { key: 'cfd38900b31991e89c21a099fc4f91f77663ae94', id: this.id, class: "lido-pos", type: this.type, "tab-index": this.tabIndex, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, minDrops: this.minDrops, maxDrops: this.maxDrops, value: this.value, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, onEntry: this.onEntry }, h("slot", { key: '73f7bfe2d8214693d6f40a4dab6d735906ad4eaa' })));
+        return (h(Host, { key: '4c417a789cc167f7d701b8469890631f9871fe6f', id: this.id, class: "lido-pos", type: this.type, "tab-index": this.tabIndex, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, minDrops: this.minDrops, maxDrops: this.maxDrops, value: this.value, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, onEntry: this.onEntry }, h("slot", { key: 'd5026f61804b53e63aa1cc6c15b3de91543cf426' })));
     }
     static get is() { return "lido-pos"; }
     static get originalStyleUrls() {
@@ -558,7 +558,7 @@ export class LidoPos {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "CSS margin value applied to each child element inside the container.\r\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
+                    "text": "CSS margin value applied to each child element inside the container.\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
                 },
                 "getter": false,
                 "setter": false,

package/dist/collection/components/random/lido-random.css

@@ -1,9 +1,9 @@
-.lido-random {
-  position: relative; /* Ensures children position within this box */
-  width: 100%;
-  height: 100%;
-}
-
-.lido-random > * {
-  position: absolute;
+.lido-random {
+  position: relative; /* Ensures children position within this box */
+  width: 100%;
+  height: 100%;
+}
+
+.lido-random > * {
+  position: absolute;
 }

package/dist/collection/components/random/lido-random.js

@@ -142,7 +142,7 @@ export class LidoRandom {
             backgroundColor: this.bgColor,
             margin: this.margin,
         };
-        return (h(Host, { key: 'a4cec45d407b57833a4296a20230717534adf39b', class: "lido-random", type: this.type, "tab-index": this.tabIndex, value: this.value, style: style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, minDrops: this.minDrops, maxDrops: this.maxDrops, onInCorrect: this.onInCorrect, onEntry: this.onEntry }, h("slot", { key: 'b80726b68b7f1c009f35352b9d05cd573159f87b' })));
+        return (h(Host, { key: 'e0ed354e54ea3c5112d0e068b2a94356ef437874', class: "lido-random", type: this.type, "tab-index": this.tabIndex, value: this.value, style: style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, minDrops: this.minDrops, maxDrops: this.maxDrops, onInCorrect: this.onInCorrect, onEntry: this.onEntry }, h("slot", { key: 'ed0386cda3ba55d89fb08607775a49a4180f08b3' })));
     }
     static get is() { return "lido-random"; }
     static get originalStyleUrls() {
@@ -589,7 +589,7 @@ export class LidoRandom {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "CSS margin value applied to each child element inside the container.\r\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
+                    "text": "CSS margin value applied to each child element inside the container.\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
                 },
                 "getter": false,
                 "setter": false,

package/dist/collection/components/root/lido-root.js

@@ -165,7 +165,7 @@ export class LidoRoot {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "CSS margin value applied to each child element inside the container.\r\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
+                    "text": "CSS margin value applied to each child element inside the container.\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
                 },
                 "getter": false,
                 "setter": false,
@@ -245,7 +245,7 @@ export class LidoRoot {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Custom URL for the Exit button icon.\r\nFalls back to the default icon if not provided or invalid."
+                    "text": "Custom URL for the Exit button icon.\nFalls back to the default icon if not provided or invalid."
                 },
                 "getter": false,
                 "setter": false,
@@ -264,7 +264,7 @@ export class LidoRoot {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Custom URL for the Previous button icon.\r\nFalls back to the default icon if not provided or invalid."
+                    "text": "Custom URL for the Previous button icon.\nFalls back to the default icon if not provided or invalid."
                 },
                 "getter": false,
                 "setter": false,
@@ -283,7 +283,7 @@ export class LidoRoot {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Custom URL for the Next button icon.\r\nFalls back to the default icon if not provided or invalid."
+                    "text": "Custom URL for the Next button icon.\nFalls back to the default icon if not provided or invalid."
                 },
                 "getter": false,
                 "setter": false,
@@ -302,7 +302,7 @@ export class LidoRoot {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Custom URL for the Speaker button icon.\r\nFalls back to the default icon if not provided or invalid."
+                    "text": "Custom URL for the Speaker button icon.\nFalls back to the default icon if not provided or invalid."
                 },
                 "getter": false,
                 "setter": false,

package/dist/collection/components/row/lido-row.css

@@ -1,10 +1,10 @@
-.lido-row {
-  display: flex;
-  justify-content: space-around;
-  align-items: center;
-  /* position: absolute; */
-}
-
-.lido-row > * {
-  /* position: relative; */
-}
+.lido-row {
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  /* position: absolute; */
+}
+
+.lido-row > * {
+  /* position: relative; */
+}

package/dist/collection/components/row/lido-row.js

@@ -77,7 +77,7 @@ export class LidoRow {
         };
     }
     render() {
-        return (h(Host, { key: 'c69aea0b1b11d9aec167d1a4376f68073f91ca81', class: "lido-row", type: this.type, "tab-index": this.tabIndex, value: this.value, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, minDrops: this.minDrops, maxDrops: this.maxDrops, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, onEntry: this.onEntry, "disable-speak": this.disableSpeak }, h("slot", { key: '8756ee0447057cddb949e23decbde5fe4d1d25c8' })));
+        return (h(Host, { key: '30b1857fc65b826cfad9c08f71ea1c2f7cc966e4', class: "lido-row", type: this.type, "tab-index": this.tabIndex, value: this.value, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, minDrops: this.minDrops, maxDrops: this.maxDrops, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, onEntry: this.onEntry, "disable-speak": this.disableSpeak }, h("slot", { key: '747f20051ad1fd1dd075ba457b612e9d8ef7d27d' })));
     }
     static get is() { return "lido-row"; }
     static get originalStyleUrls() {
@@ -447,7 +447,7 @@ export class LidoRow {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The number of child elements that should be displayed inside the row.\r\nThis value is dynamically adjusted based on `minLength` and `maxLength`."
+                    "text": "The number of child elements that should be displayed inside the row.\nThis value is dynamically adjusted based on `minLength` and `maxLength`."
                 },
                 "getter": false,
                 "setter": false,
@@ -466,7 +466,7 @@ export class LidoRow {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The minimum number of child elements that must be displayed inside the row.\r\nIf `childElementsLength` is less than this value, additional elements may be shown to meet this minimum."
+                    "text": "The minimum number of child elements that must be displayed inside the row.\nIf `childElementsLength` is less than this value, additional elements may be shown to meet this minimum."
                 },
                 "getter": false,
                 "setter": false,
@@ -485,7 +485,7 @@ export class LidoRow {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "The maximum number of child elements that can be displayed inside the row.\r\nIf `childElementsLength` exceeds this value, excess elements will be hidden."
+                    "text": "The maximum number of child elements that can be displayed inside the row.\nIf `childElementsLength` exceeds this value, excess elements will be hidden."
                 },
                 "getter": false,
                 "setter": false,
@@ -563,7 +563,7 @@ export class LidoRow {
                 "optional": true,
                 "docs": {
                     "tags": [],
-                    "text": "Sets the CSS display property for the component.\r\nAccepts any valid CSS display value (e.g., 'block', 'flex', 'grid', 'none')."
+                    "text": "Sets the CSS display property for the component.\nAccepts any valid CSS display value (e.g., 'block', 'flex', 'grid', 'none')."
                 },
                 "getter": false,
                 "setter": false,
@@ -582,7 +582,7 @@ export class LidoRow {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "CSS margin value applied to each child element inside the container.\r\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
+                    "text": "CSS margin value applied to each child element inside the container.\nAccepts standard CSS margin formats (e.g., '10px', '5px 10px', etc.)."
                 },
                 "getter": false,
                 "setter": false,

package/dist/collection/components/scale/assets/Shadow.svg

@@ -1,9 +1,9 @@
-<svg width="120" height="60" viewBox="0 0 120 60" fill="none" xmlns="http://www.w3.org/2000/svg">
-  <defs>
-    <radialGradient id="shadowGradient" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(60 34) rotate(90) scale(34 46)">
-      <stop offset="0" stop-color="#000000" stop-opacity="0.35"/>
-      <stop offset="1" stop-color="#000000" stop-opacity="0"/>
-    </radialGradient>
-  </defs>
-  <ellipse cx="60" cy="34" rx="46" ry="14" fill="url(#shadowGradient)"/>
-</svg>
+<svg width="120" height="60" viewBox="0 0 120 60" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <radialGradient id="shadowGradient" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="translate(60 34) rotate(90) scale(34 46)">
+      <stop offset="0" stop-color="#000000" stop-opacity="0.35"/>
+      <stop offset="1" stop-color="#000000" stop-opacity="0"/>
+    </radialGradient>
+  </defs>
+  <ellipse cx="60" cy="34" rx="46" ry="14" fill="url(#shadowGradient)"/>
+</svg>