eat-js-sdk 0.0.52 → 0.0.53

package/dist/eat-prompt-builder.mjs

@@ -5587,19 +5587,19 @@
     function select_block_type(ctx2, dirty) {
       if (
         /*resultType*/
-        ctx2[1] === ANSWER_CORRECT && !/*isWordItemSelected*/
+        ctx2[0] === ANSWER_CORRECT && !/*isWordItemSelected*/
         ctx2[10]
       )
         return 0;
       if (
         /*resultType*/
-        ctx2[1] === ANSWER_INCORRECT && !/*isWordItemSelected*/
+        ctx2[0] === ANSWER_INCORRECT && !/*isWordItemSelected*/
         ctx2[10]
       )
         return 1;
       if (
         /*resultType*/
-        ctx2[1] === ANSWER_MISSED
+        ctx2[0] === ANSWER_MISSED
       )
         return 2;
       return 3;
@@ -5608,8 +5608,8 @@
     if_block0 = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
     let if_block1 = (
       /*resultType*/
-      (ctx[1] === ANSWER_CORRECT || /*resultType*/
-      ctx[1] === ANSWER_INCORRECT) && create_if_block5(ctx)
+      (ctx[0] === ANSWER_CORRECT || /*resultType*/
+      ctx[0] === ANSWER_INCORRECT) && create_if_block5(ctx)
     );
     return {
       c() {
@@ -5617,7 +5617,7 @@
         span0 = element("span");
         t0 = text(
           /*word*/
-          ctx[0]
+          ctx[1]
         );
         t1 = space();
         div = element("div");
@@ -5644,21 +5644,21 @@
           ctx[3]
         );
         attr(button, "aria-label", button_aria_label_value = /*resultType*/
-        ctx[1] === ANSWER_INCORRECT && /*containerId*/
+        ctx[0] === ANSWER_INCORRECT && /*containerId*/
         ctx[5] === CONTAINER_WORD_BIN_ID && !/*isWordItemSelected*/
         ctx[10] ? `Skipped answer: ${/*word*/
-        ctx[0]}` : (
+        ctx[1]}` : (
           /*resultType*/
-          (ctx[1] === ANSWER_CORRECT || /*resultType*/
-          ctx[1] === ANSWER_INCORRECT) && !/*isWordItemSelected*/
+          (ctx[0] === ANSWER_CORRECT || /*resultType*/
+          ctx[0] === ANSWER_INCORRECT) && !/*isWordItemSelected*/
           ctx[10] ? `Student's answer: ${/*word*/
-          ctx[0]} (${/*resultType*/
-          ctx[1]})` : (
+          ctx[1]} (${/*resultType*/
+          ctx[0]})` : (
             /*resultType*/
-            ctx[1] === ANSWER_MISSED ? `Missing answer: ${/*word*/
-            ctx[0]}` : `${/*isWordItemSelected*/
+            ctx[0] === ANSWER_MISSED ? `Missing answer: ${/*word*/
+            ctx[1]}` : `${/*isWordItemSelected*/
             ctx[10] ? "Selected option" : "Option"}: ${/*word*/
-            ctx[0]}`
+            ctx[1]}`
           )
         ));
         attr(button, "class", button_class_value = "focus-ring flex items-center justify-between min-h-[54px] p-1 border border-gray-800 rounded-lg " + /*otherClass*/
@@ -5669,17 +5669,17 @@
         (ctx[10] ? "bg-blue-1000 !border-blue-1000 raw-focus-ring !cursor-pointer" : "bg-gray-100") + " " + (!/*currentSelectedItemId*/
         ctx[7] && !/*disabledClick*/
         ctx[6] ? "td:hover-focus-ring td:hover:bg-violet-100 !cursor-pointer" : "!cursor-default") + " " + /*resultType*/
-        (ctx[1] === ANSWER_CORRECT && !/*isWordItemSelected*/
+        (ctx[0] === ANSWER_CORRECT && !/*isWordItemSelected*/
         ctx[10] ? "border-green-800 bg-green-300" : (
           /*resultType*/
-          ctx[1] === ANSWER_INCORRECT && !/*isWordItemSelected*/
+          ctx[0] === ANSWER_INCORRECT && !/*isWordItemSelected*/
           ctx[10] ? "border-red-800 bg-red-300" : (
             /*resultType*/
-            ctx[1] === ANSWER_MISSED ? "border-green-800" : ""
+            ctx[0] === ANSWER_MISSED ? "border-green-800" : ""
           )
         )) + " " + /*resultType*/
-        ((ctx[1] === ANSWER_CORRECT || /*resultType*/
-        ctx[1] === ANSWER_INCORRECT) && !/*isWordItemSelected*/
+        ((ctx[0] === ANSWER_CORRECT || /*resultType*/
+        ctx[0] === ANSWER_INCORRECT) && !/*isWordItemSelected*/
         ctx[10] ? "td:hover:border-gray-800" : ""));
       },
       m(target, anchor) {
@@ -5695,7 +5695,7 @@
         append(span2, t3);
         if (if_block1)
           if_block1.m(span2, null);
-        ctx[15](button);
+        ctx[17](button);
         current = true;
         if (!mounted) {
           dispose = [
@@ -5738,11 +5738,11 @@
       p(new_ctx, [dirty]) {
         ctx = new_ctx;
         if (!current || dirty & /*word*/
-        1)
+        2)
           set_data(
             t0,
             /*word*/
-            ctx[0]
+            ctx[1]
           );
         if (!current || dirty & /*isWordItemSelected*/
         1024 && span0_class_value !== (span0_class_value = "text-charcoal text-base pl-3 mr-4 " + /*isWordItemSelected*/
@@ -5774,12 +5774,12 @@
         }
         if (
           /*resultType*/
-          ctx[1] === ANSWER_CORRECT || /*resultType*/
-          ctx[1] === ANSWER_INCORRECT
+          ctx[0] === ANSWER_CORRECT || /*resultType*/
+          ctx[0] === ANSWER_INCORRECT
         ) {
           if (if_block1) {
             if (dirty & /*resultType*/
-            2) {
+            1) {
               transition_in(if_block1, 1);
             }
           } else {
@@ -5812,27 +5812,27 @@
         }
         if (!current || dirty & /*resultType, containerId, isWordItemSelected, word*/
         1059 && button_aria_label_value !== (button_aria_label_value = /*resultType*/
-        ctx[1] === ANSWER_INCORRECT && /*containerId*/
+        ctx[0] === ANSWER_INCORRECT && /*containerId*/
         ctx[5] === CONTAINER_WORD_BIN_ID && !/*isWordItemSelected*/
         ctx[10] ? `Skipped answer: ${/*word*/
-        ctx[0]}` : (
+        ctx[1]}` : (
           /*resultType*/
-          (ctx[1] === ANSWER_CORRECT || /*resultType*/
-          ctx[1] === ANSWER_INCORRECT) && !/*isWordItemSelected*/
+          (ctx[0] === ANSWER_CORRECT || /*resultType*/
+          ctx[0] === ANSWER_INCORRECT) && !/*isWordItemSelected*/
           ctx[10] ? `Student's answer: ${/*word*/
-          ctx[0]} (${/*resultType*/
-          ctx[1]})` : (
+          ctx[1]} (${/*resultType*/
+          ctx[0]})` : (
             /*resultType*/
-            ctx[1] === ANSWER_MISSED ? `Missing answer: ${/*word*/
-            ctx[0]}` : `${/*isWordItemSelected*/
+            ctx[0] === ANSWER_MISSED ? `Missing answer: ${/*word*/
+            ctx[1]}` : `${/*isWordItemSelected*/
             ctx[10] ? "Selected option" : "Option"}: ${/*word*/
-            ctx[0]}`
+            ctx[1]}`
           )
         ))) {
           attr(button, "aria-label", button_aria_label_value);
         }
         if (!current || dirty & /*otherClass, isClonedItem, considerCloneItemId, wordButtonId, isWordItemSelected, currentSelectedItemId, disabledClick, resultType*/
-        1758 && button_class_value !== (button_class_value = "focus-ring flex items-center justify-between min-h-[54px] p-1 border border-gray-800 rounded-lg " + /*otherClass*/
+        1757 && button_class_value !== (button_class_value = "focus-ring flex items-center justify-between min-h-[54px] p-1 border border-gray-800 rounded-lg " + /*otherClass*/
         ctx[2] + " " + /*isClonedItem*/
         (ctx[4] ? "opacity-50 raw-focus-ring bg-violet-100" : "") + " " + /*considerCloneItemId*/
         (ctx[9] === /*wordButtonId*/
@@ -5840,17 +5840,17 @@
         (ctx[10] ? "bg-blue-1000 !border-blue-1000 raw-focus-ring !cursor-pointer" : "bg-gray-100") + " " + (!/*currentSelectedItemId*/
         ctx[7] && !/*disabledClick*/
         ctx[6] ? "td:hover-focus-ring td:hover:bg-violet-100 !cursor-pointer" : "!cursor-default") + " " + /*resultType*/
-        (ctx[1] === ANSWER_CORRECT && !/*isWordItemSelected*/
+        (ctx[0] === ANSWER_CORRECT && !/*isWordItemSelected*/
         ctx[10] ? "border-green-800 bg-green-300" : (
           /*resultType*/
-          ctx[1] === ANSWER_INCORRECT && !/*isWordItemSelected*/
+          ctx[0] === ANSWER_INCORRECT && !/*isWordItemSelected*/
           ctx[10] ? "border-red-800 bg-red-300" : (
             /*resultType*/
-            ctx[1] === ANSWER_MISSED ? "border-green-800" : ""
+            ctx[0] === ANSWER_MISSED ? "border-green-800" : ""
           )
         )) + " " + /*resultType*/
-        ((ctx[1] === ANSWER_CORRECT || /*resultType*/
-        ctx[1] === ANSWER_INCORRECT) && !/*isWordItemSelected*/
+        ((ctx[0] === ANSWER_CORRECT || /*resultType*/
+        ctx[0] === ANSWER_INCORRECT) && !/*isWordItemSelected*/
         ctx[10] ? "td:hover:border-gray-800" : ""))) {
           attr(button, "class", button_class_value);
         }
@@ -5874,7 +5874,7 @@
         if_blocks[current_block_type_index].d();
         if (if_block1)
           if_block1.d();
-        ctx[15](null);
+        ctx[17](null);
         mounted = false;
         run_all(dispose);
       }
@@ -5889,7 +5889,9 @@
     let { containerId = "" } = $$props;
     let { wordFocus = false } = $$props;
     let { disabledClick = false } = $$props;
+    let { isPreviewModeInteractive = false } = $$props;
     let { categoryData = [] } = $$props;
+    let { correctAnswerList = [] } = $$props;
     const dispatch = createEventDispatcher();
     let considerCloneItemId = "";
     let currentSelectedItemId = "";
@@ -5950,9 +5952,9 @@
     }
     $$self.$$set = ($$props2) => {
       if ("word" in $$props2)
-        $$invalidate(0, word = $$props2.word);
+        $$invalidate(1, word = $$props2.word);
       if ("resultType" in $$props2)
-        $$invalidate(1, resultType = $$props2.resultType);
+        $$invalidate(0, resultType = $$props2.resultType);
       if ("otherClass" in $$props2)
         $$invalidate(2, otherClass = $$props2.otherClass);
       if ("wordButtonId" in $$props2)
@@ -5965,8 +5967,12 @@
         $$invalidate(14, wordFocus = $$props2.wordFocus);
       if ("disabledClick" in $$props2)
         $$invalidate(6, disabledClick = $$props2.disabledClick);
+      if ("isPreviewModeInteractive" in $$props2)
+        $$invalidate(15, isPreviewModeInteractive = $$props2.isPreviewModeInteractive);
       if ("categoryData" in $$props2)
         $$invalidate(13, categoryData = $$props2.categoryData);
+      if ("correctAnswerList" in $$props2)
+        $$invalidate(16, correctAnswerList = $$props2.correctAnswerList);
     };
     $$self.$$.update = () => {
       if ($$self.$$.dirty & /*wordFocus, wordButton*/
@@ -5981,6 +5987,18 @@
             );
           }
       }
+      if ($$self.$$.dirty & /*correctAnswerList, isPreviewModeInteractive, containerId, wordButtonId, resultType*/
+      98345) {
+        $:
+          if (correctAnswerList && isPreviewModeInteractive) {
+            const { answerList } = correctAnswerList;
+            const answers = answerList[containerId];
+            if (containerId !== CONTAINER_WORD_BIN_ID && answers.length) {
+              $$invalidate(0, resultType = answers.includes(wordButtonId) ? ANSWER_CORRECT : ANSWER_INCORRECT);
+              console.log("result:", resultType);
+            }
+          }
+      }
       if ($$self.$$.dirty & /*categoryData, currentSelectedItemId, wordButtonId*/
       8328) {
         $:
@@ -5993,8 +6011,8 @@
       }
     };
     return [
-      word,
       resultType,
+      word,
       otherClass,
       wordButtonId,
       isClonedItem,
@@ -6008,6 +6026,8 @@
       removeContainerTabSelected,
       categoryData,
       wordFocus,
+      isPreviewModeInteractive,
+      correctAnswerList,
       button_binding
     ];
   }
@@ -6015,26 +6035,28 @@
     constructor(options) {
       super();
       init(this, options, instance5, create_fragment9, safe_not_equal, {
-        word: 0,
-        resultType: 1,
+        word: 1,
+        resultType: 0,
         otherClass: 2,
         wordButtonId: 3,
         isClonedItem: 4,
         containerId: 5,
         wordFocus: 14,
         disabledClick: 6,
-        categoryData: 13
+        isPreviewModeInteractive: 15,
+        categoryData: 13,
+        correctAnswerList: 16
       });
     }
     get word() {
-      return this.$$.ctx[0];
+      return this.$$.ctx[1];
     }
     set word(word) {
       this.$$set({ word });
       flush();
     }
     get resultType() {
-      return this.$$.ctx[1];
+      return this.$$.ctx[0];
     }
     set resultType(resultType) {
       this.$$set({ resultType });
@@ -6082,6 +6104,13 @@
       this.$$set({ disabledClick });
       flush();
     }
+    get isPreviewModeInteractive() {
+      return this.$$.ctx[15];
+    }
+    set isPreviewModeInteractive(isPreviewModeInteractive) {
+      this.$$set({ isPreviewModeInteractive });
+      flush();
+    }
     get categoryData() {
       return this.$$.ctx[13];
     }
@@ -6089,8 +6118,15 @@
       this.$$set({ categoryData });
       flush();
     }
+    get correctAnswerList() {
+      return this.$$.ctx[16];
+    }
+    set correctAnswerList(correctAnswerList) {
+      this.$$set({ correctAnswerList });
+      flush();
+    }
   };
-  customElements.define("prompt-categorise-word-button", create_custom_element(PromptCategoriseWordButton, { "word": {}, "resultType": {}, "otherClass": {}, "wordButtonId": {}, "isClonedItem": { "type": "Boolean" }, "containerId": {}, "wordFocus": { "type": "Boolean" }, "disabledClick": { "type": "Boolean" }, "categoryData": {} }, [], [], true));
+  customElements.define("prompt-categorise-word-button", create_custom_element(PromptCategoriseWordButton, { "word": {}, "resultType": {}, "otherClass": {}, "wordButtonId": {}, "isClonedItem": { "type": "Boolean" }, "containerId": {}, "wordFocus": { "type": "Boolean" }, "disabledClick": { "type": "Boolean" }, "isPreviewModeInteractive": { "type": "Boolean" }, "categoryData": {}, "correctAnswerList": {} }, [], [], true));
   var PromptCategoriseWordButton_default = PromptCategoriseWordButton;
 
   // src/lib/composables/useCategorise.ts
@@ -6145,7 +6181,7 @@
           ctx[7]
         );
         attr(button, "class", button_class_value = "focus-ring absolute inset-0 bg-transparent rounded-lg focus-visible:border " + /*isContainerWordBin*/
-        (ctx[20] ? "focus-visible:border-gray-400" : "focus-visible:border-gray-800"));
+        (ctx[22] ? "focus-visible:border-gray-400" : "focus-visible:border-gray-800"));
       },
       m(target, anchor) {
         insert(target, button, anchor);
@@ -6154,7 +6190,7 @@
             button,
             "click",
             /*addAnswerItem*/
-            ctx[23]
+            ctx[25]
           );
           mounted = true;
         }
@@ -6199,13 +6235,13 @@
               div,
               "click",
               /*addAnswerItem*/
-              ctx[23]
+              ctx[25]
             ),
             listen(
               div,
               "keypress",
               /*addAnswerItem*/
-              ctx[23]
+              ctx[25]
             )
           ];
           mounted = true;
@@ -6266,14 +6302,14 @@
       props: {
         otherClass: "mr-2 mb-2 last:mr-0 " + /*item*/
         (ctx[38].id === /*considerItemId*/
-        ctx[9] ? "!bg-violet-150" : "") + "\n        " + (!/*showButton*/
+        ctx[11] ? "!bg-violet-150" : "") + "\n        " + (!/*showButton*/
         ctx[5] ? "hidden md:flex" : "") + "\n        " + /*items*/
-        (ctx[17][
+        (ctx[19][
           /*currentWordBinIndex*/
-          ctx[13]
+          ctx[15]
         ]?.id !== /*item*/
         ctx[38].id && /*isContainerWordBin*/
-        ctx[20] ? "hidden md:flex" : ""),
+        ctx[22] ? "hidden md:flex" : ""),
         word: (
           /*item*/
           ctx[38].text
@@ -6292,10 +6328,10 @@
         ),
         wordFocus: (
           /*currentTabContainer*/
-          ctx[15] === /*containerId*/
+          ctx[17] === /*containerId*/
           ctx[3] && /*item*/
           ctx[38].id === /*items*/
-          ctx[17][0].id
+          ctx[19][0].id
         ),
         disabledClick: (
           /*isFinished*/
@@ -6308,13 +6344,21 @@
         categoryData: (
           /*categoryData*/
           ctx[0]
+        ),
+        correctAnswerList: (
+          /*correctAnswerList*/
+          ctx[9]
+        ),
+        isPreviewModeInteractive: (
+          /*isPreviewModeInteractive*/
+          ctx[10]
         )
       }
     });
     promptcategorisewordbutton.$on(
       "updateCategorySettings",
       /*updateCategoryByButton*/
-      ctx[24]
+      ctx[26]
     );
     return {
       key: key_1,
@@ -6354,27 +6398,27 @@
         }
         const promptcategorisewordbutton_changes = {};
         if (dirty[0] & /*items, considerItemId, showButton, currentWordBinIndex*/
-        139808)
+        559136)
           promptcategorisewordbutton_changes.otherClass = "mr-2 mb-2 last:mr-0 " + /*item*/
           (ctx[38].id === /*considerItemId*/
-          ctx[9] ? "!bg-violet-150" : "") + "\n        " + (!/*showButton*/
+          ctx[11] ? "!bg-violet-150" : "") + "\n        " + (!/*showButton*/
           ctx[5] ? "hidden md:flex" : "") + "\n        " + /*items*/
-          (ctx[17][
+          (ctx[19][
             /*currentWordBinIndex*/
-            ctx[13]
+            ctx[15]
           ]?.id !== /*item*/
           ctx[38].id && /*isContainerWordBin*/
-          ctx[20] ? "hidden md:flex" : "");
+          ctx[22] ? "hidden md:flex" : "");
         if (dirty[0] & /*items*/
-        131072)
+        524288)
           promptcategorisewordbutton_changes.word = /*item*/
           ctx[38].text;
         if (dirty[0] & /*items*/
-        131072)
+        524288)
           promptcategorisewordbutton_changes.wordButtonId = /*item*/
           ctx[38].id;
         if (dirty[0] & /*items*/
-        131072)
+        524288)
           promptcategorisewordbutton_changes.isClonedItem = /*item*/
           ctx[38].isClonedItem;
         if (dirty[0] & /*containerId*/
@@ -6382,24 +6426,32 @@
           promptcategorisewordbutton_changes.containerId = /*containerId*/
           ctx[3];
         if (dirty[0] & /*currentTabContainer, containerId, items*/
-        163848)
+        655368)
           promptcategorisewordbutton_changes.wordFocus = /*currentTabContainer*/
-          ctx[15] === /*containerId*/
+          ctx[17] === /*containerId*/
           ctx[3] && /*item*/
           ctx[38].id === /*items*/
-          ctx[17][0].id;
+          ctx[19][0].id;
         if (dirty[0] & /*isFinished*/
         256)
           promptcategorisewordbutton_changes.disabledClick = /*isFinished*/
           ctx[8];
         if (dirty[0] & /*items*/
-        131072)
+        524288)
           promptcategorisewordbutton_changes.resultType = /*item*/
           ctx[38].type;
         if (dirty[0] & /*categoryData*/
         1)
           promptcategorisewordbutton_changes.categoryData = /*categoryData*/
           ctx[0];
+        if (dirty[0] & /*correctAnswerList*/
+        512)
+          promptcategorisewordbutton_changes.correctAnswerList = /*correctAnswerList*/
+          ctx[9];
+        if (dirty[0] & /*isPreviewModeInteractive*/
+        1024)
+          promptcategorisewordbutton_changes.isPreviewModeInteractive = /*isPreviewModeInteractive*/
+          ctx[10];
         promptcategorisewordbutton.$set(promptcategorisewordbutton_changes);
       },
       i(local) {
@@ -6437,19 +6489,19 @@
     let dispose;
     let if_block0 = (
       /*dragDisabled*/
-      ctx[11] && /*sourceSelectedContainerId*/
-      ctx[12] !== /*containerId*/
+      ctx[13] && /*sourceSelectedContainerId*/
+      ctx[14] !== /*containerId*/
       ctx[3] && !/*isFinished*/
       ctx[8] && create_if_block_24(ctx)
     );
     let if_block1 = (
       /*totalRemainingWordBinItem*/
-      ctx[14] <= 0 && /*isContainerWordBin*/
-      ctx[20] && create_if_block_16(ctx)
+      ctx[16] <= 0 && /*isContainerWordBin*/
+      ctx[22] && create_if_block_16(ctx)
     );
     let each_value = ensure_array_like(Object.values(
       /*items*/
-      ctx[17]
+      ctx[19]
     ));
     const get_key = (ctx2) => (
       /*item*/
@@ -6479,7 +6531,7 @@
           section,
           "aria-hidden",
           /*isItemsAriaHidden*/
-          ctx[18]
+          ctx[20]
         );
         attr(section, "aria-dropeffect", "move");
         attr(
@@ -6489,7 +6541,7 @@
           ctx[3]
         );
         attr(section, "style", section_style_value = !/*isContainerWordBin*/
-        ctx[20] ? `padding-top: ${/*paddingTop*/
+        ctx[22] ? `padding-top: ${/*paddingTop*/
         ctx[6]}px;` : "");
       },
       m(target, anchor) {
@@ -6511,7 +6563,7 @@
             action_destroyer(dndzone_action = dndzone$2.call(null, section, {
               items: (
                 /*items*/
-                ctx[17]
+                ctx[19]
               ),
               flipDurationMs: (
                 /*flipDurationMs*/
@@ -6523,20 +6575,20 @@
               ),
               dropTargetClasses: (
                 /*dropTargetClasses*/
-                ctx[19]
+                ctx[21]
               ),
               morphDisabled: true,
               dragDisabled: (
                 /*dragDisabled*/
-                ctx[11]
+                ctx[13]
               ),
               autoAriaDisabled: true,
               zoneItemTabIndex: (
                 /*currentTabContainer*/
-                ctx[15] !== /*containerId*/
+                ctx[17] !== /*containerId*/
                 ctx[3] || /*selectedItemId*/
-                ctx[10] || /*isModalOpen*/
-                ctx[16] ? -1 : 0
+                ctx[12] || /*isModalOpen*/
+                ctx[18] ? -1 : 0
               ),
               zoneTabIndex: -1
             })),
@@ -6544,13 +6596,13 @@
               section,
               "consider",
               /*handleDndConsider*/
-              ctx[21]
+              ctx[23]
             ),
             listen(
               section,
               "finalize",
               /*handleDndFinalize*/
-              ctx[22]
+              ctx[24]
             )
           ];
           mounted = true;
@@ -6559,8 +6611,8 @@
       p(ctx2, dirty) {
         if (
           /*dragDisabled*/
-          ctx2[11] && /*sourceSelectedContainerId*/
-          ctx2[12] !== /*containerId*/
+          ctx2[13] && /*sourceSelectedContainerId*/
+          ctx2[14] !== /*containerId*/
           ctx2[3] && !/*isFinished*/
           ctx2[8]
         ) {
@@ -6577,8 +6629,8 @@
         }
         if (
           /*totalRemainingWordBinItem*/
-          ctx2[14] <= 0 && /*isContainerWordBin*/
-          ctx2[20]
+          ctx2[16] <= 0 && /*isContainerWordBin*/
+          ctx2[22]
         ) {
           if (if_block1) {
             if_block1.p(ctx2, dirty);
@@ -6591,11 +6643,11 @@
           if_block1.d(1);
           if_block1 = null;
         }
-        if (dirty[0] & /*items, considerItemId, showButton, currentWordBinIndex, isContainerWordBin, containerId, currentTabContainer, isFinished, categoryData, updateCategoryByButton*/
-        17998633) {
+        if (dirty[0] & /*items, considerItemId, showButton, currentWordBinIndex, isContainerWordBin, containerId, currentTabContainer, isFinished, categoryData, correctAnswerList, isPreviewModeInteractive, updateCategoryByButton*/
+        71995177) {
           each_value = ensure_array_like(Object.values(
             /*items*/
-            ctx2[17]
+            ctx2[19]
           ));
           group_outros();
           each_blocks = update_keyed_each(each_blocks, dirty, get_key, 1, ctx2, each_value, each_1_lookup, section, outro_and_destroy_block, create_each_block2, null, get_each_context2);
@@ -6607,12 +6659,12 @@
           attr(section, "class", section_class_value);
         }
         if (!current || dirty[0] & /*isItemsAriaHidden*/
-        262144) {
+        1048576) {
           attr(
             section,
             "aria-hidden",
             /*isItemsAriaHidden*/
-            ctx2[18]
+            ctx2[20]
           );
         }
         if (!current || dirty[0] & /*containerId*/
@@ -6626,16 +6678,16 @@
         }
         if (!current || dirty[0] & /*paddingTop*/
         64 && section_style_value !== (section_style_value = !/*isContainerWordBin*/
-        ctx2[20] ? `padding-top: ${/*paddingTop*/
+        ctx2[22] ? `padding-top: ${/*paddingTop*/
         ctx2[6]}px;` : "")) {
           attr(section, "style", section_style_value);
         }
         if (dndzone_action && is_function(dndzone_action.update) && dirty[0] & /*items, flipDurationMs, type, dragDisabled, currentTabContainer, containerId, selectedItemId, isModalOpen*/
-        232476)
+        929820)
           dndzone_action.update.call(null, {
             items: (
               /*items*/
-              ctx2[17]
+              ctx2[19]
             ),
             flipDurationMs: (
               /*flipDurationMs*/
@@ -6647,20 +6699,20 @@
             ),
             dropTargetClasses: (
               /*dropTargetClasses*/
-              ctx2[19]
+              ctx2[21]
             ),
             morphDisabled: true,
             dragDisabled: (
               /*dragDisabled*/
-              ctx2[11]
+              ctx2[13]
             ),
             autoAriaDisabled: true,
             zoneItemTabIndex: (
               /*currentTabContainer*/
-              ctx2[15] !== /*containerId*/
+              ctx2[17] !== /*containerId*/
               ctx2[3] || /*selectedItemId*/
-              ctx2[10] || /*isModalOpen*/
-              ctx2[16] ? -1 : 0
+              ctx2[12] || /*isModalOpen*/
+              ctx2[18] ? -1 : 0
             ),
             zoneTabIndex: -1
           });
@@ -6743,7 +6795,7 @@
       const { sourceContainerId, sourceCloneContainerId } = categoryData;
       if (trigger === TRIGGERS.DRAG_STARTED) {
         const { items: cateoryItems } = detail;
-        $$invalidate(17, items = cateoryItems);
+        $$invalidate(19, items = cateoryItems);
         const orginalId = items.filter((item) => item[SHADOW_ITEM_MARKER_PROPERTY_NAME]);
         const originalItemIndex = items.findIndex((item) => item.id === orginalId[0].id);
         items.splice(originalItemIndex, 1, {
@@ -6769,7 +6821,7 @@
     const handleDndFinalize = (e2) => {
       const { items: categoryItems, info } = e2.detail;
       const { trigger, id } = info;
-      $$invalidate(17, items = categoryItems.filter((item) => !item.isClonedItem));
+      $$invalidate(19, items = categoryItems.filter((item) => !item.isClonedItem));
       if (trigger === TRIGGERS.DROPPED_INTO_ZONE) {
         const { currentTarget } = e2;
         addAnswerItemStore(id, currentTarget.id);
@@ -6937,9 +6989,9 @@
       if ("isFinished" in $$props2)
         $$invalidate(8, isFinished = $$props2.isFinished);
       if ("correctAnswerList" in $$props2)
-        $$invalidate(25, correctAnswerList = $$props2.correctAnswerList);
+        $$invalidate(9, correctAnswerList = $$props2.correctAnswerList);
       if ("isPreviewModeInteractive" in $$props2)
-        $$invalidate(26, isPreviewModeInteractive = $$props2.isPreviewModeInteractive);
+        $$invalidate(10, isPreviewModeInteractive = $$props2.isPreviewModeInteractive);
       if ("categoryData" in $$props2)
         $$invalidate(0, categoryData = $$props2.categoryData);
       if ("modalData" in $$props2)
@@ -6951,28 +7003,28 @@
         $:
           if (modalData) {
             const { isModalOpen: storeIsModalOpen } = modalData;
-            $$invalidate(16, isModalOpen = storeIsModalOpen);
+            $$invalidate(18, isModalOpen = storeIsModalOpen);
           }
       }
       if ($$self.$$.dirty[0] & /*categoryData, isFinished, currentAnswer, containerId, considerItemId, isPreviewModeInteractive*/
-      335545097) {
+      268438793) {
         $:
           if (categoryData) {
             const { considerItemId: storeconsiderItemId, selectedItemId: storeSelectedItemId, currentAnswer: storeCurrentAnswer, sourceSelectedContainerId: storeSourceSelectedContainerId, currentWordBinIndex: storeCurrentWordBinIndex, currentTabContainer: storeCurrentTabContainer, isItemsAriaHidden: storeisItemsAriaHidden } = categoryData;
-            $$invalidate(9, considerItemId = storeconsiderItemId);
-            $$invalidate(11, dragDisabled = isFinished || !!storeSelectedItemId);
+            $$invalidate(11, considerItemId = storeconsiderItemId);
+            $$invalidate(13, dragDisabled = isFinished || !!storeSelectedItemId);
             $$invalidate(28, currentAnswer = storeCurrentAnswer);
-            $$invalidate(10, selectedItemId = storeSelectedItemId);
-            $$invalidate(12, sourceSelectedContainerId = storeSourceSelectedContainerId);
-            $$invalidate(13, currentWordBinIndex = storeCurrentWordBinIndex);
-            $$invalidate(15, currentTabContainer = storeCurrentTabContainer);
-            $$invalidate(18, isItemsAriaHidden = storeisItemsAriaHidden);
+            $$invalidate(12, selectedItemId = storeSelectedItemId);
+            $$invalidate(14, sourceSelectedContainerId = storeSourceSelectedContainerId);
+            $$invalidate(15, currentWordBinIndex = storeCurrentWordBinIndex);
+            $$invalidate(17, currentTabContainer = storeCurrentTabContainer);
+            $$invalidate(20, isItemsAriaHidden = storeisItemsAriaHidden);
             const storeWordBinItem = currentAnswer.filter((answer) => answer.categoryId === CONTAINER_WORD_BIN_ID);
-            $$invalidate(14, totalRemainingWordBinItem = storeWordBinItem[0].itemId.length);
+            $$invalidate(16, totalRemainingWordBinItem = storeWordBinItem[0].itemId.length);
             if (storeCurrentAnswer) {
               const currentAnswerList = currentAnswer.filter((answer) => answer.categoryId === containerId);
               if (currentAnswerList.length) {
-                $$invalidate(17, items = currentAnswerList[0].itemId.map((rawAnswerId) => {
+                $$invalidate(19, items = currentAnswerList[0].itemId.map((rawAnswerId) => {
                   const splitId = rawAnswerId.split(EAT_DASH);
                   const answerId = splitId[0];
                   const answerIndex = rawCategoryItems.findIndex((answer) => answer.id === answerId);
@@ -7004,6 +7056,8 @@
       paddingTop,
       ariaLabel,
       isFinished,
+      correctAnswerList,
+      isPreviewModeInteractive,
       considerItemId,
       selectedItemId,
       dragDisabled,
@@ -7020,8 +7074,6 @@
       handleDndFinalize,
       addAnswerItem,
       updateCategoryByButton,
-      correctAnswerList,
-      isPreviewModeInteractive,
       modalData,
       currentAnswer
     ];
@@ -7044,8 +7096,8 @@
           paddingTop: 6,
           ariaLabel: 7,
           isFinished: 8,
-          correctAnswerList: 25,
-          isPreviewModeInteractive: 26,
+          correctAnswerList: 9,
+          isPreviewModeInteractive: 10,
           categoryData: 0,
           modalData: 27
         },
@@ -7110,14 +7162,14 @@
       flush();
     }
     get correctAnswerList() {
-      return this.$$.ctx[25];
+      return this.$$.ctx[9];
     }
     set correctAnswerList(correctAnswerList) {
       this.$$set({ correctAnswerList });
       flush();
     }
     get isPreviewModeInteractive() {
-      return this.$$.ctx[26];
+      return this.$$.ctx[10];
     }
     set isPreviewModeInteractive(isPreviewModeInteractive) {
       this.$$set({ isPreviewModeInteractive });

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "eat-js-sdk",
-    "version": "0.0.52",
+    "version": "0.0.53",
     "description": "Authoring tool frontend SDK",
     "contributors": [
         {