lido-player 0.0.2-alpha-57-dev → 0.0.2-alpha-59-dev

package/dist/types/components/container/lido-container.d.ts

@@ -164,11 +164,24 @@ export declare class LidoContainer {
      */
     delayVisible: string;
     /**
-      * When set to true, disables the speak functionality of long press for this component and its children.
-    */
+     * When set to true, disables the speak functionality of long press for this component and all its child components.
+     */
     disableSpeak: boolean;
+    /**
+     * Identifies the template type used by this component (e.g., mcq, flashcard, tracing, dragAndDrop).
+     */
+    templateId: string;
+    /**
+     * Stores the instruction audio/text key based on the current template.
+     */
+    instructName: string;
+    /**
+     * Indicates whether the speak action is currently active or in progress.
+     */
+    speakFlag: boolean;
     languageChanged(newLang: string): void;
     componentWillLoad(): void;
+    private resolveInstructionAudio;
     private resolveLanguage;
     convertToPixels(height: string, parentElement?: HTMLElement): number;
     /**

package/dist/types/components/trace/lido-trace.d.ts

@@ -22,7 +22,7 @@ export declare class LidoTrace {
     /**
      * Array of audio URLs to be played when tracing is completed, separated by semicolons.
      * This allows multiple audio files to be loaded and played in sequence.
-    */
+     */
     audioUrls: string[];
     /**
      * Index of the currently active SVG in the `svgUrls` array.
@@ -105,8 +105,8 @@ export declare class LidoTrace {
      */
     delayVisible: string;
     /**
-      * When set to true, disables the speak functionality of long press for this component and its children.
-      */
+     * When set to true, disables the speak functionality of long press for this component and its children.
+     */
     disableSpeak: boolean;
     el: HTMLElement;
     style: {

package/dist/types/components.d.ts

@@ -533,7 +533,7 @@ export namespace Components {
          */
         "delayVisible": string;
         /**
-          * When set to true, disables the speak functionality of long press for this component and its children.
+          * When set to true, disables the speak functionality of long press for this component and all its child components.
          */
         "disableSpeak": boolean;
         /**
@@ -616,6 +616,10 @@ export namespace Components {
           * TabIndex for keyboard navigation.
          */
         "tabIndex": number;
+        /**
+          * Identifies the template type used by this component (e.g., mcq, flashcard, tracing, dragAndDrop).
+         */
+        "templateId": string;
         /**
           * Type of the container, which can be used for conditional logic or styling purposes.
          */
@@ -2863,7 +2867,7 @@ declare namespace LocalJSX {
          */
         "delayVisible"?: string;
         /**
-          * When set to true, disables the speak functionality of long press for this component and its children.
+          * When set to true, disables the speak functionality of long press for this component and all its child components.
          */
         "disableSpeak"?: boolean;
         /**
@@ -2946,6 +2950,10 @@ declare namespace LocalJSX {
           * TabIndex for keyboard navigation.
          */
         "tabIndex"?: number;
+        /**
+          * Identifies the template type used by this component (e.g., mcq, flashcard, tracing, dragAndDrop).
+         */
+        "templateId"?: string;
         /**
           * Type of the container, which can be used for conditional logic or styling purposes.
          */

package/dist/types/stories/Templates/numberIdentification/numberIdentificationimageTotext.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const numberIdentificationimageTotext: StoryObj;

package/dist/types/stories/Templates/numberIdentification/numberIdentificationtextTotext.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const numberIdentificationtextTotext: StoryObj;

package/dist/types/stories/Templates/palEgmaCalculateSum/palEgmaMultiOption.stories.d.ts

@@ -0,0 +1,11 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+type PalEgma2Args = {
+    number1: string;
+    number2: string;
+    options: string[];
+    sign?: string;
+    isAllowOnlyCorrect?: boolean;
+};
+declare const meta: Meta<PalEgma2Args>;
+export default meta;
+export declare const PalEgmaMultiOption: StoryObj;

package/dist/types/stories/Templates/palEgmaCalculateSum/palEgmaSumTogether.stories.d.ts

@@ -0,0 +1,12 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+type PalEgma1Args = {
+    missingNumber: string;
+    number1: string;
+    number2: string;
+    options: string[];
+    sign?: string;
+    isAllowOnlyCorrect?: boolean;
+};
+declare const meta: Meta<PalEgma1Args>;
+export default meta;
+export declare const PalEgmaSumTogether: StoryObj;

package/dist/types/stories/Templates/palEgmaPatternMatching/palEgmaPatternMatching.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const palEgmaPatternMatching: StoryObj;

package/dist/types/stories/Templates/palEgmaWordProblem/palEgmaWordProblem.stories.d.ts

@@ -0,0 +1,5 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const palEgmaWordProblem1: StoryObj;
+export declare const palEgmaWordProblem2: StoryObj;

package/dist/types/stories/Templates/palEgraInventedSpelling/pal_egra_invented_spelling_schema.stories.d.ts

@@ -0,0 +1,4 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const Default: StoryObj;

package/dist/types/stories/Templates/palEgraMCQWithImage/palEgraMCQWithImage.stories.d.ts

@@ -0,0 +1,4 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const PalEgraMCQWithImage: StoryObj;

package/dist/types/stories/Templates/palEgraStoryMaking/pal_egra_story_making.stories.d.ts

@@ -0,0 +1,4 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const Default: StoryObj;

package/dist/types/stories/Templates/palEgraTemplate1/palEgraLetterIdentification.stories.d.ts

@@ -0,0 +1,4 @@
+import type { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const Default: StoryObj;

package/dist/types/stories/Templates/palEgra_OddOneOut/palEgra_oddOneOut.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const palEgra_OddOneOut: StoryObj;

package/dist/types/stories/Templates/palEgra_word_formation/palEgra_WordFormation.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const palEgraWordFormation: StoryObj;

package/dist/types/stories/Templates/pictureClues/pictureClues.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const pictureClues: StoryObj;

package/dist/types/stories/Templates/pictureWordMatch/pictureWordMatch1.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const pictureWordMatch1: StoryObj;

package/dist/types/stories/Templates/pictureWordMatch/pictureWordMatch2.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const pictureWordMatch2: StoryObj;

package/dist/types/stories/Templates/substraction/substractionWithimg.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const substractionWithimg: StoryObj;

package/dist/types/stories/Templates/substraction/substractionWithoutImg.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const substractionWithoutImg: StoryObj;

package/dist/types/stories/Templates/wordBuilding/wordBuildingwithimg.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const wordBuildingwithimg: StoryObj;

package/dist/types/stories/Templates/wordBuilding/wordBuildingwithoutimg.stories.d.ts

@@ -0,0 +1,4 @@
+import { Meta, StoryObj } from '@storybook/web-components';
+declare const meta: Meta;
+export default meta;
+export declare const wordBuildingwithoutimg: StoryObj;

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

@@ -19,6 +19,7 @@ export declare const LidoContainer = "lido-container";
 export declare const LangChangeEvent = "languageChanged";
 export declare const LIDO_COMMON_AUDIO_PATH = "__LIDO_COMMON_AUDIO_PATH__";
 export declare const LIDO_COMMON_AUDIO_READY_EVENT = "lidoCommonAudioPathReady";
+export declare const TemplateID = "template-id";
 export declare enum TraceMode {
     NoFlow = "noFlow",
     ShowFlow = "showFlow",
@@ -45,5 +46,12 @@ export declare enum DropAction {
 export declare const exitUrl = "https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/Navbar-buttons/Close.svg";
 export declare const prevUrl = "https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/Navbar-buttons/Previous.svg";
 export declare const nextUrl = "https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/Navbar-buttons/Next.svg";
-export declare const speakUrl = "https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/Navbar-buttons/Audio%20icon.svg";
+export declare const speakUrl = "https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/Navbar-buttons/audio.png";
 export declare const fingerUrl = "https://aeakbcdznktpsbrfsgys.supabase.co/storage/v1/object/public/template-assets/trace/Tracing-hand.svg";
+export declare const enum templateAudio {
+    dragAndDrop = "Match the items by dragging and dropping them into the correct places.",
+    mcq = "Select the correct answer from the options provided.",
+    tracing = "Trace the shape by following the outline carefully.",
+    flashcards = "Review the flashcards to reinforce your learning.",
+    hello = "hello"
+}

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

@@ -5,6 +5,7 @@ export declare const initEventsForElement: (element: HTMLElement, type?: string)
 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;
+export declare let countOfMistakes: number;
 export declare const storingEachActivityScore: (flag: boolean) => void;
 export declare const calculateScore: () => void;
 export declare function onActivityComplete(dragElement?: HTMLElement, dropElement?: HTMLElement): Promise<void>;

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

@@ -2,3 +2,4 @@ export declare function showWrongAnswerAnimation(elements: HTMLElement[]): void;
 export declare function removeHighlight(element: HTMLElement): void;
 export declare function highlightSpeakingElement(element: HTMLElement): void;
 export declare function stopHighlightForSpeakingElement(element: HTMLElement): void;
+export declare function highlightElement(): void;

package/package.json

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

package/dist/components/p-7ab0a273.js

@@ -1,204 +0,0 @@
-import { p as proxyCustomElement, H, d as setVisibilityWithDelay, i as initEventsForElement, t as attachSpeakIcon, L as LIDO_COMMON_AUDIO_READY_EVENT, e as convertUrlToRelative, k as parseProp, h, j as Host, u as LIDO_COMMON_AUDIO_PATH } from './p-0712a27e.js';
-import { i as instance } from './p-73e3f0f4.js';
-
-const lidoTextCss = ".lido-text{transition:background-color 0.3s ease;user-select:none;align-items:center;justify-content:center;text-align:center;border-radius:24px;color:#333;cursor:pointer;font-family:'Baloo Bhai 2', serif}.text-letters{transition:color 0.3s, text-shadow 0.3s;display:inline-block;padding:0 2px}.text-letters.letter-highlight{color:#8e24aa;background:none;border-radius:0;text-shadow:0 2px 8px #8e24aa88;animation:text-letter-bounce 0.4s}.text-words{transition:color 0.3s, text-shadow 0.3s;display:inline-block;padding:0 2px}.text-words.word-highlight{color:#8e24aa;background:none;border-radius:0;text-shadow:0 2px 8px #8e24aa88;animation:text-word-bounce 0.4s}@keyframes text-letter-bounce{0%{transform:scale(1)}60%{transform:scale(1.4)}100%{transform:scale(1)}}@keyframes text-word-bounce{0%{transform:scale(1)}60%{transform:scale(1.3)}100%{transform:scale(1)}}";
-const LidoTextStyle0 = lidoTextCss;
-
-const LidoText = /*@__PURE__*/ proxyCustomElement(class LidoText extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.showSpeakIcon = false;
-        this.id = '';
-        this.value = '';
-        this.string = '';
-        this.fontFamily = '';
-        this.fontSize = '20px';
-        this.fontColor = '';
-        this.highlightWhileSpeaking = false;
-        this.height = 'auto';
-        this.width = 'auto';
-        this.ariaLabel = '';
-        this.ariaHidden = '';
-        this.x = '0px';
-        this.y = '0px';
-        this.z = '0';
-        this.bgColor = '';
-        this.borderImage = '';
-        this.type = '';
-        this.tabIndex = 0;
-        this.visible = false;
-        this.audio = '';
-        this.onTouch = '';
-        this.onInCorrect = '';
-        this.onCorrect = '';
-        this.minDrops = 1;
-        this.maxDrops = 1;
-        this.onEntry = '';
-        this.margin = '';
-        this.padding = '';
-        this.borderRadius = '0px';
-        this.spanType = '';
-        this.style = {};
-        this.delayVisible = '';
-        this.disableSpeak = false;
-    }
-    /**
-     * Lifecycle hook that runs after the component is rendered in the DOM.
-     * It initializes custom events based on the `type` of the text component.
-     */
-    componentDidLoad() {
-        setVisibilityWithDelay(this.el, this.delayVisible);
-        initEventsForElement(this.el, this.type);
-        // only create span element if requested
-        if (this.spanType === 'words' || this.spanType === 'letters') {
-            this.addSpanToText();
-        }
-        if (this.showSpeakIcon) {
-            attachSpeakIcon(this.el);
-        }
-        if (!this.audio || this.audio.trim() === "") {
-            const applyAutoAudio = () => {
-                const autoAudio = this.resolveAutoAudio();
-                if (autoAudio) {
-                    this.audio = autoAudio;
-                    console.log("[LidoText] Auto audio applied:", autoAudio);
-                }
-            };
-            // If path is already available, apply immediately
-            if (window.__LIDO_COMMON_AUDIO_PATH__) {
-                applyAutoAudio();
-            }
-            else {
-                // Otherwise, wait for it
-                window.addEventListener(LIDO_COMMON_AUDIO_READY_EVENT, applyAutoAudio, { once: true });
-            }
-        }
-    }
-    resolveAutoAudio() {
-        const base = window[LIDO_COMMON_AUDIO_PATH];
-        if (!base || !this.string)
-            return null;
-        const fileName = this.string.toLowerCase().trim().replace(/\s+/g, "_").replace(/[^\w-]/g, "");
-        return `${base}/${fileName}.mp3`;
-    }
-    /**
-     * Lifecycle method that runs before the component is rendered.
-     * Initializes styles and sets up event listeners for resize and load events.
-     */
-    componentWillLoad() {
-        this.updateStyles();
-        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));
-    }
-    updateStyles() {
-        const borderImg = this.borderImage ? convertUrlToRelative(this.borderImage) : '';
-        const orientation = window.innerHeight > window.innerWidth ? 'portrait' : 'landscape';
-        this.style = {
-            height: parseProp(this.height, orientation),
-            width: parseProp(this.width, orientation),
-            backgroundColor: parseProp(this.bgColor, orientation),
-            top: parseProp(this.y, orientation),
-            left: parseProp(this.x, orientation),
-            zIndex: this.z,
-            fontSize: parseProp(this.fontSize, orientation),
-            fontFamily: this.fontFamily,
-            color: parseProp(this.fontColor, orientation),
-            display: parseProp(`${this.visible}`, orientation) === "true" ? 'flex' : 'none', // Toggle visibility
-            borderImage: `url(${borderImg})`,
-            borderImageSlice: borderImg ? '0 fill' : '',
-            margin: parseProp(this.margin, orientation),
-            padding: parseProp(this.padding, orientation),
-            borderRadius: parseProp(this.borderRadius, orientation),
-        };
-    }
-    async addSpanToText() {
-        const content = this.el.querySelector('.lido-text-content');
-        if (!content)
-            return;
-        const text = content.textContent || '';
-        content.innerHTML = '';
-        // Wrap each letters in a span inside .lido-text-content
-        if (this.spanType === 'letters') {
-            text.split('').forEach((letter, idx) => {
-                // Skip spaces
-                if (letter.trim() === '')
-                    return;
-                // Create a span for each letter
-                const letterSpan = document.createElement('span');
-                letterSpan.textContent = letter;
-                letterSpan.className = 'text-letters';
-                content.appendChild(letterSpan);
-            });
-        }
-        // Wrap each words in a span inside .lido-text-content
-        if (this.spanType === 'words') {
-            text.split(' ').forEach((word, idx) => {
-                const wordSpan = document.createElement('span');
-                wordSpan.textContent = word;
-                wordSpan.className = 'text-words';
-                content.appendChild(wordSpan);
-            });
-        }
-    }
-    render() {
-        return (h(Host, { key: '87d82cc0bf52e1eaba8f44d1bdd80c98e896ddbf', class: "lido-text", value: this.value, type: this.type, "tab-index": this.tabIndex, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, onEntry: this.onEntry, minDrops: this.minDrops, maxDrops: this.maxDrops, id: this.id, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, "span-type": this.spanType, "disable-speak": this.disableSpeak }, this.spanType !== '' ? h("div", { class: "lido-text-content" }, " ", instance.t(this.string)) : instance.t(this.string)));
-    }
-    get el() { return this; }
-    static get style() { return LidoTextStyle0; }
-}, [0, "lido-text", {
-        "showSpeakIcon": [4, "show-speak-icon"],
-        "id": [1],
-        "value": [1],
-        "string": [1],
-        "fontFamily": [1, "font-family"],
-        "fontSize": [1, "font-size"],
-        "fontColor": [1, "font-color"],
-        "highlightWhileSpeaking": [4, "highlight-while-speaking"],
-        "height": [1],
-        "width": [1],
-        "ariaLabel": [1, "aria-label"],
-        "ariaHidden": [1, "aria-hidden"],
-        "x": [1],
-        "y": [1],
-        "z": [1],
-        "bgColor": [1, "bg-color"],
-        "borderImage": [1, "border-image"],
-        "type": [1],
-        "tabIndex": [2, "tab-index"],
-        "visible": [8],
-        "audio": [1],
-        "onTouch": [1, "on-touch"],
-        "onInCorrect": [1, "on-in-correct"],
-        "onCorrect": [1, "on-correct"],
-        "minDrops": [2, "min-drops"],
-        "maxDrops": [2, "max-drops"],
-        "onEntry": [1, "on-entry"],
-        "margin": [1],
-        "padding": [1],
-        "borderRadius": [1, "border-radius"],
-        "spanType": [1, "span-type"],
-        "delayVisible": [1, "delay-visible"],
-        "disableSpeak": [4, "disable-speak"],
-        "style": [32]
-    }]);
-function defineCustomElement() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["lido-text"];
-    components.forEach(tagName => { switch (tagName) {
-        case "lido-text":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, LidoText);
-            }
-            break;
-    } });
-}
-defineCustomElement();
-
-export { LidoText as L, defineCustomElement as d };