lido-player 0.0.2-alpha-49 → 0.0.2-alpha-43-dev

package/dist/types/utils/utils.d.ts

@@ -1,5 +1,7 @@
+export declare function buildDragSelectedMapFromDOM(): Record<string, string[]>;
+export declare function getSortedValuesArrayFromMap(map: Record<string, string[]>): string[];
 export declare function format(first?: string, middle?: string, last?: string): string;
-export declare const initEventsForElement: (element: HTMLElement, type: string) => Promise<void>;
+export declare const initEventsForElement: (element: HTMLElement, type?: string) => Promise<void>;
 export declare const executeActions: (actionsString: string, thisElement: HTMLElement, element?: HTMLElement) => Promise<void>;
 export declare const matchStringPattern: (pattern: string, arr: string[]) => boolean;
 export declare const countPatternWords: (pattern: string) => number;
@@ -25,7 +27,6 @@ export declare const handlingElementFlexibleWidth: (element: HTMLElement, type:
 export declare const equationCheck: (additionalCheck: string) => boolean;
 export declare const speakIcon: (targetElement: HTMLElement) => HTMLDivElement;
 export declare const attachSpeakIcon: (element: HTMLElement) => Promise<void>;
-export declare const clearLocalStorage: () => void;
 /**
  * Applies a delay to the element's visibility based on `delayVisible`.
  */
@@ -36,3 +37,8 @@ export declare function calculateScale(): number;
 export declare function setCancelBtnPopup(value: boolean): void;
 export declare function getCancelBtnPopup(): boolean;
 export declare function generateUUIDFallback(): string;
+export declare const revealImageValue: (imageEl: HTMLElement) => void;
+export declare const HighlightStarsOneByOne: (element: HTMLElement, value: string) => Promise<void>;
+export declare const animateBoxCells: (element: HTMLElement, value: string) => Promise<void>;
+export declare const questionBoxAnimation: (element: HTMLElement, value: string) => Promise<void>;
+export declare const SumTogetherAnimation: (element: HTMLElement, value: string) => Promise<void>;

package/dist/types/utils/utilsHandlers/dragDropHandler.d.ts

@@ -1,3 +1,7 @@
+export declare function buildDropHasDragFromDOM(): Record<string, {
+    drop: string;
+    isFull: boolean;
+}>;
 export declare const getElementScale: (el: HTMLElement) => number;
 export declare function enableOptionArea(element: HTMLElement): void;
 export declare const setDraggingDisabled: (disabled: boolean) => void;

package/dist/types/utils/utilsHandlers/lidoBalanceHandler.d.ts

@@ -0,0 +1,2 @@
+export declare function updateBalanceOnDrop(dragElement: HTMLElement, dropElement?: HTMLElement): void;
+export declare function balanceResult(container: HTMLElement, objectiveString: string): boolean;

package/dist/types/utils/utilsHandlers/lidoCalculatorHandler.d.ts

@@ -0,0 +1 @@
+export declare const handleSolvedEquationSubmissionAndScoreUpdate: () => Promise<void>;

package/dist/types/utils/utilsHandlers/matrixHandler.d.ts

@@ -0,0 +1 @@
+export declare function handlingMatrix(element: HTMLElement): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "lido-player",
-  "version": "0.0.2-alpha-49",
+  "version": "0.0.2-alpha-43-dev",
   "description": "Stencil Component For  Lido Player",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

package/dist/components/p-a8ab771b.js

@@ -1,160 +0,0 @@
-import { p as proxyCustomElement, H, e as convertUrlToRelative, m as parseProp, h, j as Host } from './p-cfa2aec8.js';
-
-const lidoMathMatrixCss = ".math-matrix{width:100%;height:100%;display:flex;justify-content:center}.slot{width:100%;height:100%}.slot:hover{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:cover;background-position:center;background-repeat:no-repeat}.slot-inactive{background-color:var(--inactive-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}";
-const LidoMathMatrixStyle0 = lidoMathMatrixCss;
-
-const LidoMathMatrix = /*@__PURE__*/ proxyCustomElement(class LidoMathMatrix extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.rows = 7;
-        this.cols = 5;
-        this.defualtFill = 0;
-        this.leftIndex = false;
-        this.topIndex = false;
-        this.bottomIndex = false;
-        this.clickable = true;
-        this.activeOnlyVisible = false;
-        this.matrixImage = undefined;
-        this.activeBgColor = 'red';
-        this.inactiveBgColor = 'transparent';
-        this.border = '2px solid green';
-        this.height = '100%';
-        this.width = '100%';
-        this.borderRadius = '5px';
-        this.z = undefined;
-        this.margin = undefined;
-        this.padding = undefined;
-        this.visible = 'false';
-        this.style = {};
-    }
-    componentDidLoad() {
-        const slotElements = this.el.querySelectorAll('.slot');
-        slotElements.forEach((el, i) => {
-            const slot = el;
-            slot.style.setProperty('--active-bg-color', this.activeBgColor);
-            slot.style.setProperty('--inactive-bg-color', this.inactiveBgColor);
-            this.clickable ? (slot.style.pointerEvents = '') : (slot.style.pointerEvents = 'none');
-            slot.style.border = this.border;
-            if (slot.className.includes('slot-active')) {
-                slot.style.visibility = 'visible';
-                if (this.matrixImage) {
-                    slot.style.setProperty('--bg-image', `url(${convertUrlToRelative(this.matrixImage)})`);
-                }
-            }
-            else if (this.activeOnlyVisible) {
-                slot.style.visibility = 'hidden';
-            }
-        });
-        this.updateSlots();
-        this.updateStyles();
-    }
-    /**
-     * Lifecycle method that runs before the component is rendered.
-     * Initializes styles and sets up event listeners for resize and load events.
-     */
-    componentWillLoad() {
-        this.updateStyles();
-        this.updateSlots();
-        window.addEventListener('resize', this.updateStyles.bind(this));
-        window.addEventListener('load', this.updateStyles.bind(this));
-    }
-    disconnectedCallback() {
-        window.removeEventListener('resize', this.updateStyles.bind(this));
-        window.removeEventListener('load', this.updateStyles.bind(this));
-    }
-    updateSlots() {
-        const slotElement = this.el.querySelectorAll('.slot');
-        const fristElement = this.el.querySelector('.slot');
-        if (!slotElement.length || !fristElement)
-            return;
-        const slotMaxValues = fristElement.offsetWidth < fristElement.offsetHeight ? fristElement.offsetWidth : fristElement.offsetHeight;
-        const slotParent = this.el.querySelectorAll('.slot-parent');
-        slotParent.forEach(parent => {
-            parent.style.width = `${slotMaxValues}px`;
-            Array.from(parent.children).forEach(el => {
-                const item = el;
-                item.style.width = `${slotMaxValues}px`;
-                item.style.height = `${slotMaxValues}px`;
-                if ((!this.topIndex && item.classList.contains('topIndex')) ||
-                    (!this.leftIndex && item.classList.contains('leftIndex')) ||
-                    (!this.bottomIndex && item.classList.contains('bottomIndex'))) {
-                    if (item.classList.contains('leftIndex'))
-                        item.parentElement.remove();
-                    item.remove();
-                }
-            });
-        });
-    }
-    updateStyles() {
-        const orientation = window.innerHeight > window.innerWidth ? 'portrait' : 'landscape';
-        this.style = {
-            height: parseProp(this.height, orientation),
-            width: parseProp(this.width, orientation),
-            zIndex: this.z,
-            display: parseProp(`${this.visible}`, orientation) === 'true' ? 'flex' : 'none',
-            borderRadius: parseProp(this.borderRadius, orientation),
-        };
-    }
-    handleClickSlot(element) {
-        const index = parseInt(element.className.split(' ')[1].split('-')[1]);
-        const slotElements = document.querySelectorAll('.slot');
-        slotElements.forEach((el, i) => {
-            const slotEl = el;
-            if (i < index) {
-                slotEl.classList.add('slot-active');
-                slotEl.classList.remove('slot-inactive');
-                if (this.matrixImage) {
-                    slotEl.style.setProperty('--bg-image', `url(${convertUrlToRelative(this.matrixImage)})`);
-                }
-            }
-            else {
-                slotEl.classList.remove('slot-active');
-                slotEl.classList.add('slot-inactive');
-            }
-        });
-    }
-    render() {
-        let slotNumber = 1;
-        return (h(Host, { key: 'bfde8ad01e4b47a0b13dc0fd325d78e5014cfef9', class: "math-matrix", style: { height: this.style.height, width: this.style.width, z: this.style.z, display: this.style.display } }, Array.from({ length: this.rows + 1 }, (_, rowIndex) => (h("div", { class: "slot-parent", key: `row-${rowIndex}` }, h("div", { style: rowIndex === 0 && { visibility: 'hidden' }, class: "topIndex" }, rowIndex), Array.from({ length: this.cols }, (_, colIndex) => rowIndex === 0 ? (h("div", { class: "leftIndex" }, ++colIndex)) : (h("div", { class: `slot slot-${slotNumber++} ${this.defualtFill + 1 >= slotNumber ? 'slot-active' : 'slot-inactive'}`, onClick: () => this.handleClickSlot(event.target), key: `slot-${rowIndex}-${colIndex}`, style: { borderRadius: this.style.borderRadius } }))), h("div", { style: rowIndex === 0 && { visibility: 'hidden' }, class: "bottomIndex" }, this.cols * rowIndex))))));
-    }
-    get el() { return this; }
-    static get style() { return LidoMathMatrixStyle0; }
-}, [0, "lido-math-matrix", {
-        "rows": [2],
-        "cols": [2],
-        "defualtFill": [2, "defualt-fill"],
-        "leftIndex": [4, "left-index"],
-        "topIndex": [4, "top-index"],
-        "bottomIndex": [4, "bottom-index"],
-        "clickable": [4],
-        "activeOnlyVisible": [4, "active-only-visible"],
-        "matrixImage": [1, "matrix-image"],
-        "activeBgColor": [1, "active-bg-color"],
-        "inactiveBgColor": [1, "inactive-bg-color"],
-        "border": [1],
-        "height": [1],
-        "width": [1],
-        "borderRadius": [1, "border-radius"],
-        "z": [1],
-        "margin": [1],
-        "padding": [1],
-        "visible": [1],
-        "style": [32]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["lido-math-matrix"];
-    components.forEach(tagName => { switch (tagName) {
-        case "lido-math-matrix":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, LidoMathMatrix);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { LidoMathMatrix as L, defineCustomElement as d };