lido-player 0.0.2-alpha-50-dev → 0.0.2-alpha-51-dev

package/dist/components/{p-bed94c37.js → p-d0131159.js}

@@ -1,5 +1,5 @@
 const NAMESPACE = 'lido-player';
-const BUILD = /* lido-player */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: false, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: false, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: false, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: false, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
+const BUILD = /* lido-player */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: true, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: true, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: false, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: false, lifecycle: true, lifecycleDOMEvents: false, member: true, method: true, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: true, propString: true, reflect: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: true, state: true, style: true, svg: false, taskQueue: true, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: true, vdomRender: true, vdomStyle: true, vdomText: true, vdomXlink: true, watchCallback: true };
 
 /*
  Stencil Client Platform v4.20.0 | MIT Licensed | https://stenciljs.com
@@ -45,7 +45,6 @@ var plt$1 = {
   rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
   ce: (eventName, opts) => new CustomEvent(eventName, opts)
 };
-var supportsShadow = BUILD.shadowDom;
 var promiseResolve = (v) => Promise.resolve(v);
 var supportsConstructableStylesheets = /* @__PURE__ */ (() => {
   try {
@@ -344,10 +343,15 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
 var attachStyles = (hostRef) => {
   const cmpMeta = hostRef.$cmpMeta$;
   const elm = hostRef.$hostElement$;
+  const flags = cmpMeta.$flags$;
   const endAttachStyles = createTime("attachStyles", cmpMeta.$tagName$);
-  addStyle(
-    elm.getRootNode(),
+  const scopeId2 = addStyle(
+    elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(),
     cmpMeta);
+  if (flags & 10 /* needsScopedEncapsulation */ && flags & 2 /* scopedCssEncapsulation */) {
+    elm["s-sc"] = scopeId2;
+    elm.classList.add(scopeId2 + "-h");
+  }
   endAttachStyles();
 };
 var getScopeId = (cmp, mode) => "sc-" + (cmp.$tagName$);
@@ -496,6 +500,9 @@ var createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
   if (!useNativeShadowDom) {
     checkSlotRelocate = true;
     if (newVNode2.$tag$ === "slot") {
+      if (scopeId) {
+        parentElm.classList.add(scopeId + "-s");
+      }
       newVNode2.$flags$ |= newVNode2.$children$ ? (
         // slot element has fallback content
         // still create an element that "mocks" the slot element
@@ -526,7 +533,7 @@ var createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
     }
     if (newVNode2.$children$) {
       for (i2 = 0; i2 < newVNode2.$children$.length; ++i2) {
-        childNode = createElm(oldParentVNode, newVNode2, i2);
+        childNode = createElm(oldParentVNode, newVNode2, i2, elm);
         if (childNode) {
           elm.appendChild(childNode);
         }
@@ -579,9 +586,12 @@ var putBackInOriginalLocation = (parentElm, recursive) => {
 var addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
   let containerElm = parentElm["s-cr"] && parentElm["s-cr"].parentNode || parentElm;
   let childNode;
+  if (containerElm.shadowRoot && containerElm.tagName === hostTagName) {
+    containerElm = containerElm.shadowRoot;
+  }
   for (; startIdx <= endIdx; ++startIdx) {
     if (vnodes[startIdx]) {
-      childNode = createElm(null, parentVNode, startIdx);
+      childNode = createElm(null, parentVNode, startIdx, parentElm);
       if (childNode) {
         vnodes[startIdx].$elm$ = childNode;
         insertBefore(containerElm, childNode, referenceNode(before) );
@@ -668,7 +678,7 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
       if (idxInOld >= 0) {
         elmToMove = oldCh[idxInOld];
         if (elmToMove.$tag$ !== newStartVnode.$tag$) {
-          node = createElm(oldCh && oldCh[newStartIdx], newVNode2, idxInOld);
+          node = createElm(oldCh && oldCh[newStartIdx], newVNode2, idxInOld, parentElm);
         } else {
           patch(elmToMove, newStartVnode, isInitialRender);
           oldCh[idxInOld] = void 0;
@@ -676,7 +686,7 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
         }
         newStartVnode = newCh[++newStartIdx];
       } else {
-        node = createElm(oldCh && oldCh[newStartIdx], newVNode2, newStartIdx);
+        node = createElm(oldCh && oldCh[newStartIdx], newVNode2, newStartIdx, parentElm);
         newStartVnode = newCh[++newStartIdx];
       }
       if (node) {
@@ -880,8 +890,11 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
   rootVnode.$tag$ = null;
   rootVnode.$flags$ |= 4 /* isHost */;
   hostRef.$vnode$ = rootVnode;
-  rootVnode.$elm$ = oldVNode.$elm$ = hostElm;
-  useNativeShadowDom = supportsShadow ;
+  rootVnode.$elm$ = oldVNode.$elm$ = hostElm.shadowRoot || hostElm ;
+  {
+    scopeId = hostElm["s-sc"];
+  }
+  useNativeShadowDom = (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) !== 0;
   {
     contentRef = hostElm["s-cr"];
     checkSlotFallbackVisibility = false;
@@ -1309,6 +1322,7 @@ var proxyCustomElement = (Cstr, compactMeta) => {
   {
     cmpMeta.$attrsToReflect$ = [];
   }
+  const originalConnectedCallback = Cstr.prototype.connectedCallback;
   const originalDisconnectedCallback = Cstr.prototype.disconnectedCallback;
   Object.assign(Cstr.prototype, {
     __registerHost() {
@@ -1317,6 +1331,9 @@ var proxyCustomElement = (Cstr, compactMeta) => {
     connectedCallback() {
       getHostRef(this);
       connectedCallback(this);
+      if (originalConnectedCallback) {
+        originalConnectedCallback.call(this);
+      }
     },
     disconnectedCallback() {
       disconnectedCallback(this);
@@ -1326,7 +1343,17 @@ var proxyCustomElement = (Cstr, compactMeta) => {
     },
     __attachShadow() {
       {
-        this.shadowRoot = this;
+        if (!this.shadowRoot) {
+          {
+            this.attachShadow({ mode: "open" });
+          }
+        } else {
+          if (this.shadowRoot.mode !== "open") {
+            throw new Error(
+              `Unable to re-use existing shadow root for ${cmpMeta.$tagName$}! Mode is set to ${this.shadowRoot.mode} but Stencil only supports open shadow roots.`
+            );
+          }
+        }
       }
     }
   });
@@ -1528,34 +1555,34 @@ function highlightSpeakingElement(element) {
     if (!document.querySelector(styleId)) {
         const style = document.createElement('style');
         style.id = styleId;
-        style.innerHTML = `
-      .speaking-highlight {
-        --base-transform: ${element.style.transform};
-        box-shadow: 0 0 20px 10px rgba(255, 165, 0, 0.9) !important; /* Stronger orange glow effect */
-        // border: 3px solid green !important;
-        // transition: box-shadow 0.5s ease-in-out, transform 0.5s ease-in-out;
-        // transform: scale(1.05); /* Subtle scale effect to pop the element */
-        // animation: pulseEffect 1.5s infinite; /* Pulsing animation */
-        
-      }
-
-      @keyframes pulseEffect {
-        0% {
-          box-shadow: 0 0 20px 10px rgba(255, 165, 0, 0.9);
-          // transform: var(--base-transform) scale(1.05);
-          // background-color: #FFFF0B;
-        }
-        50% {
-          box-shadow: 0 0 30px 15px rgba(255, 165, 0, 1);
-          // transform: var(--base-transform) scale(1.1);
-          // background-color: #FFFF0B;
-        }
-        100% {
-          box-shadow: 0 0 20px 10px rgba(255, 165, 0, 0.9);
-          // transform: var(--base-transform) scale(1.05);
-          // background-color: #FFFF0B;
-        }
-      }
+        style.innerHTML = `
+      .speaking-highlight {
+        --base-transform: ${element.style.transform};
+        box-shadow: 0 0 20px 10px rgba(255, 165, 0, 0.9) !important; /* Stronger orange glow effect */
+        // border: 3px solid green !important;
+        // transition: box-shadow 0.5s ease-in-out, transform 0.5s ease-in-out;
+        // transform: scale(1.05); /* Subtle scale effect to pop the element */
+        // animation: pulseEffect 1.5s infinite; /* Pulsing animation */
+        
+      }
+
+      @keyframes pulseEffect {
+        0% {
+          box-shadow: 0 0 20px 10px rgba(255, 165, 0, 0.9);
+          // transform: var(--base-transform) scale(1.05);
+          // background-color: #FFFF0B;
+        }
+        50% {
+          box-shadow: 0 0 30px 15px rgba(255, 165, 0, 1);
+          // transform: var(--base-transform) scale(1.1);
+          // background-color: #FFFF0B;
+        }
+        100% {
+          box-shadow: 0 0 20px 10px rgba(255, 165, 0, 0.9);
+          // transform: var(--base-transform) scale(1.05);
+          // background-color: #FFFF0B;
+        }
+      }
     `;
         document.head.appendChild(style);
     }
@@ -1627,8 +1654,8 @@ function balanceResult(container, objectiveString) {
         return false;
     const leftVal = Number((_c = (_a = balanceEl.leftVal) !== null && _a !== void 0 ? _a : (_b = balanceEl.dataset) === null || _b === void 0 ? void 0 : _b.leftVal) !== null && _c !== void 0 ? _c : 0);
     const rightVal = Number((_f = (_d = balanceEl.rightVal) !== null && _d !== void 0 ? _d : (_e = balanceEl.dataset) === null || _e === void 0 ? void 0 : _e.rightVal) !== null && _f !== void 0 ? _f : 0);
-    const hasLeft = !isNaN(leftVal) && leftVal !== 0;
-    const hasRight = !isNaN(rightVal) && rightVal !== 0;
+    const hasLeft = !isNaN(leftVal);
+    const hasRight = !isNaN(rightVal);
     if (!hasLeft || !hasRight) {
         return false;
     }
@@ -1678,6 +1705,7 @@ function enableOptionArea(element) {
 }
 let isDraggingDisabled = false;
 const setDraggingDisabled = (disabled) => {
+    console.log("Setting dragging disabled to:", disabled);
     isDraggingDisabled = disabled;
 };
 function enableDraggingWithScaling(element) {
@@ -2160,6 +2188,9 @@ async function onElementDropComplete(dragElement, dropElement) {
         if (!isCorrect) {
             dragElement.style.transition = 'transform 0.5s ease';
             animateDragToTarget(dragElement, dropElement, container);
+            const onInCorrect = dropElement.getAttribute('onInCorrect');
+            console.log("onincorrectttt", onInCorrect);
+            await executeActions(onInCorrect, dropElement, dragElement);
             setTimeout(() => {
                 dragElement.style.transform = 'translate(0, 0)';
                 // const oldDropIndex = dragToDropMap[dragElement.getAttribute('data-id')];
@@ -2428,14 +2459,14 @@ async function onClickDropOrDragElement(element, type) {
     if (!document.querySelector('#dynamic-highlight-style')) {
         const style = document.createElement('style');
         style.id = 'dynamic-highlight-style';
-        style.innerHTML = `
-      .highlight {
-        // border: 4px solid #e74c3c; /* Thicker red border for more visibility */
-        // border-radius: 12px; /* Larger rounded corners */
-        // background-color: rgba(231, 76, 60, 0.3); /* Stronger, more noticeable background */
-        // box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2), 0 12px 40px rgba(0, 0, 0, 0.2); /* Stronger shadow */
-        // outline: 4px solid rgba(231, 76, 60, 0.6); /* Glow effect */
-      }
+        style.innerHTML = `
+      .highlight {
+        // border: 4px solid #e74c3c; /* Thicker red border for more visibility */
+        // border-radius: 12px; /* Larger rounded corners */
+        // background-color: rgba(231, 76, 60, 0.3); /* Stronger, more noticeable background */
+        // box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2), 0 12px 40px rgba(0, 0, 0, 0.2); /* Stronger shadow */
+        // outline: 4px solid rgba(231, 76, 60, 0.6); /* Glow effect */
+      }
     `;
         document.head.appendChild(style);
     }
@@ -2477,7 +2508,11 @@ async function onClickDropOrDragElement(element, type) {
 }
 const dragToDropMap = new Map();
 async function onClickDragElement(element) {
-    AudioPlayer.getI().stop();
+    const audioAttr = element.getAttribute('audio');
+    const hasValidAudio = audioAttr && audioAttr.trim().length > 0;
+    if (hasValidAudio) {
+        AudioPlayer.getI().stop();
+    }
     const dropElements = buildDropHasDragFromDOM();
     const dragEl = element;
     if (!dragEl) {
@@ -2552,6 +2587,7 @@ class AudioPlayer {
         this.audioElement = document.createElement('audio');
         this.audioElement.id = 'audio';
         document.body.appendChild(this.audioElement);
+        this.registerGlobalStopEvents();
     }
     static getI() {
         if (!AudioPlayer.instance) {
@@ -2577,13 +2613,23 @@ class AudioPlayer {
         }
     }
     async play(targetElement) {
+        // Stop any currently playing audio first if target element has audio given
+        try {
+            await AudioPlayer.getI().stop();
+        }
+        catch (e) {
+            console.error('Error stopping audio before speak action:', e);
+        }
+        // then play the target element audio.
         let audioUrl = targetElement.getAttribute('audio') || '';
+        // If no direct audio attribute, check childrens for audio
         if (!audioUrl) {
             const childElements = targetElement.children;
             for (let i = 0; i < childElements.length; i++) {
                 const childAudioUrl = childElements[i].getAttribute('audio');
                 if (childAudioUrl) {
                     audioUrl = childAudioUrl;
+                    break;
                 }
             }
         }
@@ -2593,18 +2639,21 @@ class AudioPlayer {
             console.log('🚀 Playing audio:', this.audioElement.src);
             try {
                 setDraggingDisabled(true);
-                await this.audioElement.play();
                 highlightSpeakingElement(targetElement);
+                await this.audioElement.play();
                 await new Promise(resolve => {
                     this.audioElement.onended = () => {
-                        stopHighlightForSpeakingElement(targetElement);
                         resolve();
-                        setDraggingDisabled(false);
                     };
                 });
             }
             catch (error) {
-                console.log('🚀 Audio play error:', error);
+                console.log('🎧 Audio play error:', error);
+            }
+            finally {
+                this.audioElement.onended = null; // cleanup
+                setDraggingDisabled(false);
+                stopHighlightForSpeakingElement(targetElement);
             }
         }
         // If no audio, use text-to-speech
@@ -2614,12 +2663,34 @@ class AudioPlayer {
                 await speakText(targetElement.textContent, targetElement);
                 const highlightedElements = document.querySelectorAll('.speaking-highlight');
                 highlightedElements.forEach(element => stopHighlightForSpeakingElement(element));
-                setDraggingDisabled(false);
             }
             catch (error) {
-                console.log('🚀 TTS Error:', error);
+                console.log('🎧 TTS Error:', error);
             }
+            finally {
+                setDraggingDisabled(false);
+            }
+        }
+    }
+    // GLOBAL STOP EVENTS (container change, activity change…)
+    registerGlobalStopEvents() {
+        const stopEvents = [
+            NextContainerKey, PrevContainerKey, LessonEndKey, ActivityChangeKey,
+            ActivityEndKey, GameCompletedKey, GameExitKey
+        ];
+        stopEvents.forEach(key => {
+            window.addEventListener(key, () => this.stop());
+        });
+    }
+    // DESTROY (for hot-reload)
+    destroy() {
+        console.log("AudioPlayer destroyed (hot-reload safe)");
+        this.stop();
+        // Remove DOM element
+        if (this.audioElement.parentNode) {
+            this.audioElement.parentNode.removeChild(this.audioElement);
         }
+        AudioPlayer.instance = undefined;
     }
 }
 
@@ -2779,11 +2850,11 @@ function enableReorderDrag(element) {
                     onDropToCategory(element, category);
                 }
                 if (divEl) {
-                    const keyframes = `
-            @keyframes widthDecrease {
-              0% { width: ${divEl.offsetWidth}px; height: ${divEl.offsetHeight}px; }
-              100% { width: 0px; height: 0px;}
-            }
+                    const keyframes = `
+            @keyframes widthDecrease {
+              0% { width: ${divEl.offsetWidth}px; height: ${divEl.offsetHeight}px; }
+              100% { width: 0px; height: 0px;}
+            }
           `;
                     const styleSheet = document.styleSheets[0];
                     styleSheet.insertRule(keyframes, styleSheet.cssRules.length);
@@ -2993,11 +3064,11 @@ function moveWithAnimation(target, overlapped) {
         const dummy = createDummyElement(target);
         dummy.style.visibility = 'hidden';
         dummy.setAttribute('type', 'dummy');
-        const keyframes = `
-      @keyframes widthIncrease {
-        0% { width: 0px; height: 0px; }
-        100% { width: ${target.offsetWidth}px; height: ${target.offsetHeight}px;}
-      }
+        const keyframes = `
+      @keyframes widthIncrease {
+        0% { width: 0px; height: 0px; }
+        100% { width: ${target.offsetWidth}px; height: ${target.offsetHeight}px;}
+      }
     `;
         if (!overlapped) {
             const overlapCategory = findMostoverlappedElement(target, 'category');
@@ -4554,7 +4625,11 @@ function addClickListenerForClickType(element) {
         if (lido_buttons === 'lido-arrow-left' || lido_buttons === 'lido-arrow-right') {
             return;
         }
-        AudioPlayer.getI().stop();
+        const audioAttr = element.getAttribute('audio');
+        const hasValidAudio = audioAttr && audioAttr.trim().length > 0;
+        if (hasValidAudio) {
+            AudioPlayer.getI().stop();
+        }
         const container = document.getElementById(LidoContainer);
         const objective = container['objective'].split(',');
         const checkButton = document.querySelector('#lido-checkButton');
@@ -69467,15 +69542,15 @@ function calculateFill(input, currentFill = 0) {
 // Helper to animate and remove the active equation cell
 const animationToRemoveEquationSolvedCellForNimbleTable = (activeCell, allCalculateTypes) => {
     return new Promise((resolve) => {
-        const keyframes = `
-      @keyframes widthDecrease {
-        0% { 
-          background-color: ${activeCell.style.backgroundColor};
-          height: ${activeCell.style.height};
-          margin: ${activeCell.style.margin};
-          ${activeCell.innerHTML = ""}
-        }
-        100% { background-color: transparent; height: 0px; margin: 0px; }
+        const keyframes = `
+      @keyframes widthDecrease {
+        0% { 
+          background-color: ${activeCell.style.backgroundColor};
+          height: ${activeCell.style.height};
+          margin: ${activeCell.style.margin};
+          ${activeCell.innerHTML = ""}
+        }
+        100% { background-color: transparent; height: 0px; margin: 0px; }
       }`;
         const styleSheet = document.styleSheets[0];
         styleSheet.insertRule(keyframes, styleSheet.cssRules.length);
@@ -70008,7 +70083,15 @@ const executeActions = async (actionsString, thisElement, element) => {
                     break;
                 }
                 case 'speak': {
-                    await AudioPlayer.getI().play(targetElement);
+                    const val = (action.value || '').toString().trim().toLowerCase();
+                    if (val === 'true' || val === '1' || val === 'yes') {
+                        try {
+                            await AudioPlayer.getI().play(targetElement);
+                        }
+                        catch (err) {
+                            console.error('Error playing audio for speak action:', err);
+                        }
+                    }
                     break;
                 }
                 case 'fill-slide': {
@@ -70130,6 +70213,10 @@ const executeActions = async (actionsString, thisElement, element) => {
                     }
                     break;
                 }
+                case 'updatedAnswer': {
+                    updatedAnswer();
+                    break;
+                }
                 default: {
                     targetElement.style[action.action] = action.value;
                     break;
@@ -70160,11 +70247,11 @@ const afterDropDragHandling = (dragElement, dropElement) => {
             }
             dummyElement.setAttribute('id', dragElement.getAttribute('id'));
             dragElement.replaceWith(dummyElement);
-            const keyframes = `
-      @keyframes widthDecrease {
-        0% { width: ${dragElement.style.width}; height: ${dragElement.style.height}; margin: ${dragElement.style.margin}; }
-        100% { width: 0px; height: 0px; margin: 0px;}
-      }
+            const keyframes = `
+      @keyframes widthDecrease {
+        0% { width: ${dragElement.style.width}; height: ${dragElement.style.height}; margin: ${dragElement.style.margin}; }
+        100% { width: 0px; height: 0px; margin: 0px;}
+      }
     `;
             if (!isInfinite) {
                 dummyElement.style.width = element.style.width;
@@ -70327,10 +70414,6 @@ async function onActivityComplete(dragElement, dropElement) {
                 await executeActions(onCorrect, dropElement, dragElement);
             }
         }
-        else {
-            const onInCorrect = dropElement.getAttribute('onInCorrect');
-            await executeActions(onInCorrect, dropElement, dragElement);
-        }
     }
     let dragScore = buildDragSelectedMapFromDOM();
     const sortedValues = getSortedValuesArrayFromMap(dragScore);
@@ -70342,21 +70425,6 @@ async function onActivityComplete(dragElement, dropElement) {
         drag[index] = [];
     }
     drag[index].push(dragElement.id);
-    // localStorage.setItem(DragMapKey, JSON.stringify(drag));
-    Object.keys(dragScore).sort((a, b) => parseInt(a) - parseInt(b));
-    if (dragElement && dropElement) {
-        const isCorrect = dropElement['value'].toLowerCase().includes(dragElement['value'].toLowerCase());
-        if (isCorrect) {
-            const onCorrect = dropElement.getAttribute('onCorrect');
-            if (onCorrect) {
-                await executeActions(onCorrect, dropElement, dragElement);
-            }
-        }
-        else {
-            const onInCorrect = dropElement.getAttribute('onInCorrect');
-            await executeActions(onInCorrect, dropElement, dragElement);
-        }
-    }
     const allElements = document.querySelectorAll("[type='drop']");
     allElements.forEach(otherElement => {
         var _a;
@@ -70446,6 +70514,7 @@ const validateObjectiveStatus = async () => {
         return;
     const objectiveString = container['objective'];
     const additionalCheck = container.getAttribute('equationCheck');
+    container.getAttribute('isAllowOnlyCorrect') === 'true' || '';
     console.log('🚀 ~ validateObjectiveStatus ~ additionalCheck:', additionalCheck);
     let equationGiven = false;
     if (objectiveString == null || objectiveString.length === 0) {
@@ -70497,13 +70566,15 @@ const validateObjectiveStatus = async () => {
         await calculateScore();
     }
     else {
-        const onInCorrect = container.getAttribute('onInCorrect');
-        await executeActions(onInCorrect, container);
         const isContinueOnCorrect = container.getAttribute('is-continue-on-correct') === 'true';
         if (!isContinueOnCorrect) {
             triggerNextContainer();
             await calculateScore();
         }
+        else {
+            const onInCorrect = container.getAttribute('onInCorrect');
+            await executeActions(onInCorrect, container);
+        }
     }
 };
 const triggerNextContainer = () => {
@@ -71067,14 +71138,14 @@ const SumTogetherAnimation = async (element, value) => {
     const sign = ((signElement && ((signElement.getAttribute('string') || signElement.textContent) || '')).toString().trim() === '+') ? '+' : '-';
     if (sign === '-') {
         // '-' flow: reveal one by one then change bgColor of last B to red
-        for (let i = 0; i < topRowChildren.length; i++) {
+        for (let i = 0; i < Math.min(number1, topRowChildren.length); i++) {
             await new Promise(resolve => setTimeout(resolve, 75));
             showElement(topRowChildren[i]);
         }
         elementAppearance(true);
         await new Promise(r => setTimeout(r, 500));
         for (let k = 0; k < Math.min(number2, topRowChildren.length); k++) {
-            const idx = topRowChildren.length - 1 - k;
+            const idx = Math.min(number1, topRowChildren.length) - 1 - k;
             setImageBackground(topRowChildren[idx], 'red');
             await new Promise(r => setTimeout(r, 200));
         }
@@ -71099,5 +71170,16 @@ const SumTogetherAnimation = async (element, value) => {
         elementAppearance(false);
     }
 };
+const updatedAnswer = () => {
+    const container = document.getElementById(LidoContainer);
+    if (!container)
+        return;
+    const answerText = container.querySelector('#answer');
+    if (!answerText)
+        return;
+    const equationAttr = container.getAttribute('equationCheck') || '';
+    const calculatedValue = equationCheck(equationAttr);
+    answerText.setAttribute('string', String(calculatedValue));
+};
 
 export { ActivityScoreKey as A, generateUUIDFallback as B, exitUrl as C, prevUrl as D, nextUrl as E, speakUrl as F, getCancelBtnPopup as G, H, triggerPrevcontainer as I, setCancelBtnPopup as J, getDefaultExportFromCjs as K, LidoContainer as L, tinyColor as M, NextContainerKey as N, triggerNextContainer as O, PrevContainerKey as P, DropAction as Q, RiveService as R, SelectedValuesKey as S, validateObjectiveStatus as T, fraction as U, TraceMode as V, speakIcon as W, fingerUrl as X, setNonce as a, setPlatformOptions as b, commonjsGlobal as c, setVisibilityWithDelay as d, convertUrlToRelative as e, format as f, getAssetPath$1 as g, h, initEventsForElement as i, Host as j, parseProp as k, createEvent as l, equationCheck as m, storingEachActivityScore as n, executeActions as o, proxyCustomElement as p, handlingChildElements as q, attachSpeakIcon as r, setAssetPath as s, calculateScale as t, handleFloatElementPosition as u, handleElementClick as v, dispatchActivityChangeEvent as w, dispatchGameCompletedEvent as x, dispatchGameExitEvent as y, AudioPlayer as z };

package/dist/components/{p-29bdd953.js → p-d3f7d561.js}

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, d as setVisibilityWithDelay, i as initEventsForElement, q as handlingChildElements, r as attachSpeakIcon, k as parseProp, h, j as Host } from './p-bed94c37.js';
+import { p as proxyCustomElement, H, d as setVisibilityWithDelay, i as initEventsForElement, q as handlingChildElements, r as attachSpeakIcon, k as parseProp, h, j as Host } from './p-d0131159.js';
 
 const lidoCellCss = ".lido-col{top:var(--y, 0);left:var(--x, 0);height:var(--height, 100%);width:var(--width, 100%);background-color:var(--bgColor, #eeeeee);padding:15px;border-radius:10px;display:flex;justify-content:space-around;flex-direction:column;align-items:center}.lido-col>*{}.lido-row{display:flex;justify-content:space-around;align-items:center;}.lido-row>*{}.lido-wrap{display:grid;grid-gap:10px;grid-template-columns:repeat(auto-fill, minmax(186px, auto))}.lido-wrap>*{padding:10px;box-sizing:border-box}.lido-flex{display:flex;flex-wrap:wrap;align-content:flex-start;gap:10px}.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-random{position:relative;width:100%;height:100%}.lido-random>*{position:absolute}.lido-col::-webkit-scrollbar,.lido-wrap::-webkit-scrollbar,.lido-flex::-webkit-scrollbar{width:var(--scrollbar-width);height:var(--scrollbar-width)}.lido-col::-webkit-scrollbar-thumb,.lido-wrap::-webkit-scrollbar-thumb,.lido-flex::-webkit-scrollbar-thumb{background-color:#888;border-radius:10px;border:3px solid transparent;background-clip:content-box}.lido-col::-webkit-scrollbar-track,.lido-wrap::-webkit-scrollbar-track,.lido-flex::-webkit-scrollbar-track{background:#f1f1f1}";
 const LidoCellStyle0 = lidoCellCss;
@@ -129,7 +129,7 @@ const LidoCell = /*@__PURE__*/ proxyCustomElement(class LidoCell extends H {
         this.el.className = `lido-${parseProp(this.layout, orientation)}`;
     }
     render() {
-        return (h(Host, { key: '00183a8d67c4c64eae2d2bb2e3db5def7ffe3caf', id: this.id, class: "lido-cell", value: this.value, type: this.type, "tab-index": this.tabIndex, style: this.style, minDrops: this.minDrops, maxDrops: this.maxDrops, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, onEntry: this.onEntry, "flex-direction": this.flexDirection, "disable-speak": this.disableSpeak }, h("slot", { key: '33fbb691c5c8f015bc9c6cf1e86c237758f126c3' })));
+        return (h(Host, { key: 'eaf89c6fa3df6df4438063d4e2c2ca59cbf8aa25', id: this.id, class: "lido-cell", value: this.value, type: this.type, "tab-index": this.tabIndex, style: this.style, minDrops: this.minDrops, maxDrops: this.maxDrops, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, audio: this.audio, onTouch: this.onTouch, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, onEntry: this.onEntry, "flex-direction": this.flexDirection, "disable-speak": this.disableSpeak }, h("slot", { key: '9efb1d5e7de65783cab4de3e5479260c85ffc3b1' })));
     }
     get el() { return this; }
     static get style() { return LidoCellStyle0; }

package/dist/components/{p-90465904.js → p-d7693f47.js}

@@ -1,4 +1,4 @@
-import { p as proxyCustomElement, H, V as TraceMode, e as convertUrlToRelative, d as setVisibilityWithDelay, W as speakIcon, o as executeActions, O as triggerNextContainer, L as LidoContainer, k as parseProp, h, j as Host, X as fingerUrl } from './p-bed94c37.js';
+import { p as proxyCustomElement, H, V as TraceMode, e as convertUrlToRelative, d as setVisibilityWithDelay, W as speakIcon, o as executeActions, O as triggerNextContainer, L as LidoContainer, k as parseProp, h, j as Host, X as fingerUrl } from './p-d0131159.js';
 
 const lidoTraceCss = ":host{display:block;position:relative}#lido-svgContainer{display:flex;justify-content:center;align-items:center;overflow:hidden}svg{width:100%;height:100%;touch-action:none}#lido-draggableCircle{cursor:pointer;fill:#CF1565;transition:fill 0.2s, r 0.2s}.lido-blindTracing{stroke:none !important}.lido-blindFreeTrace{stroke:none !important}.lido-hovered{cursor:grab;fill:darkred}#lido-controls{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:10px;background-color:#f0f0f0;border-top:1px solid #ccc}button{padding:10px;font-size:16px}@media (max-width: 600px){button{padding:8px;font-size:14px}}.lido-trace-path-green{}.lido-flow-indicator{stroke:blue;stroke-width:2;stroke-dasharray:6, 6;fill:none}.lido-trace{height:700px;width:700px;z-index:1;justify-items:center;align-content:center}.trace-animate{animation:trace-bounce 0.5s}@keyframes trace-bounce{0%{transform:scale(1)}30%{transform:scale(1.05)}60%{transform:scale(0.95)}100%{transform:scale(1)}}";
 const LidoTraceStyle0 = lidoTraceCss;
@@ -715,7 +715,7 @@ const LidoTrace = /*@__PURE__*/ proxyCustomElement(class LidoTrace extends H {
         };
     }
     render() {
-        return (h(Host, { key: '6be6d97477a80afc0275eef5b17718a5f43ce358', class: "lido-trace", id: this.id, audio: this.audio, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, tabindex: this.tabIndex, "disable-speak": this.disableSpeak }, h("div", { key: '4e650d7142c61549aec021fd2a8da4e592eaf94e', style: this.style, id: "lido-svgContainer" })));
+        return (h(Host, { key: 'b562e07d98a06f422ce5b8ca1d08f9c4307a313c', class: "lido-trace", id: this.id, audio: this.audio, onCorrect: this.onCorrect, onInCorrect: this.onInCorrect, style: this.style, "aria-label": this.ariaLabel, "aria-hidden": this.ariaHidden, tabindex: this.tabIndex, "disable-speak": this.disableSpeak }, h("div", { key: 'fc2cb8355a26e5b483c24c59641bd20fa37e853b', style: this.style, id: "lido-svgContainer" })));
     }
     static get assetsDirs() { return ["svg", "images"]; }
     get el() { return this; }