eat-js-sdk 0.0.22 → 0.0.23

package/dist/eat-prompt-builder.mjs

@@ -2404,8 +2404,18 @@
       c() {
         textarea = element("textarea");
         attr(textarea, "id", idLabel);
-        attr(textarea, "aria-label", "Answer input: Please type your response");
-        attr(textarea, "placeholder", placeholder);
+        attr(
+          textarea,
+          "aria-label",
+          /*textAriaLabel*/
+          ctx[8]
+        );
+        attr(
+          textarea,
+          "placeholder",
+          /*placeholder*/
+          ctx[6]
+        );
         attr(textarea, "rows", "3");
         attr(textarea, "class", textarea_class_value = "typein-textbox overflow-hidden " + (!/*isFinished*/
         ctx[1] ? "" : (
@@ -2431,38 +2441,38 @@
               textarea,
               "input",
               /*textarea_input_handler*/
-              ctx[18]
+              ctx[21]
             ),
             listen(
               textarea,
               "mousedown",
               /*mousedown_handler*/
-              ctx[19]
+              ctx[22]
             ),
             listen(
               textarea,
               "touchstart",
               /*touchstart_handler*/
-              ctx[20],
+              ctx[23],
               { passive: true }
             ),
             listen(
               textarea,
               "focus",
               /*focus_handler*/
-              ctx[21]
+              ctx[24]
             ),
             listen(
               textarea,
               "focusout",
               /*focusout_handler_1*/
-              ctx[22]
+              ctx[25]
             ),
             listen(
               textarea,
               "keydown",
               /*keydown_handler_1*/
-              ctx[23]
+              ctx[26]
             ),
             action_destroyer(autosize_action = svelte_autosize_default.call(null, textarea))
           ];
@@ -2470,7 +2480,25 @@
         }
       },
       p(ctx2, dirty) {
-        if (dirty & /*isFinished, isResultCorrect*/
+        if (dirty[0] & /*textAriaLabel*/
+        256) {
+          attr(
+            textarea,
+            "aria-label",
+            /*textAriaLabel*/
+            ctx2[8]
+          );
+        }
+        if (dirty[0] & /*placeholder*/
+        64) {
+          attr(
+            textarea,
+            "placeholder",
+            /*placeholder*/
+            ctx2[6]
+          );
+        }
+        if (dirty[0] & /*isFinished, isResultCorrect*/
         6 && textarea_class_value !== (textarea_class_value = "typein-textbox overflow-hidden " + (!/*isFinished*/
         ctx2[1] ? "" : (
           /*isResultCorrect*/
@@ -2478,17 +2506,17 @@
         )))) {
           attr(textarea, "class", textarea_class_value);
         }
-        if (dirty & /*isDataSaving*/
+        if (dirty[0] & /*isDataSaving*/
         1) {
           textarea.disabled = /*isDataSaving*/
           ctx2[0];
         }
-        if (dirty & /*isFinished*/
+        if (dirty[0] & /*isFinished*/
         2) {
           textarea.readOnly = /*isFinished*/
           ctx2[1];
         }
-        if (dirty & /*typeinAnswer*/
+        if (dirty[0] & /*typeinAnswer*/
         8) {
           set_input_value(
             textarea,
@@ -2516,8 +2544,18 @@
         input = element("input");
         attr(input, "type", "text");
         attr(input, "id", idLabel);
-        attr(input, "aria-label", placeholder);
-        attr(input, "placeholder", placeholder);
+        attr(
+          input,
+          "aria-label",
+          /*textAriaLabel*/
+          ctx[8]
+        );
+        attr(
+          input,
+          "placeholder",
+          /*placeholder*/
+          ctx[6]
+        );
         attr(input, "class", input_class_value = "typein-textbox " + (!/*isFinished*/
         ctx[1] ? "" : (
           /*isResultCorrect*/
@@ -2542,26 +2580,44 @@
               input,
               "input",
               /*input_input_handler*/
-              ctx[15]
+              ctx[18]
             ),
             listen(
               input,
               "focusout",
               /*focusout_handler*/
-              ctx[16]
+              ctx[19]
             ),
             listen(
               input,
               "keydown",
               /*keydown_handler*/
-              ctx[17]
+              ctx[20]
             )
           ];
           mounted = true;
         }
       },
       p(ctx2, dirty) {
-        if (dirty & /*isFinished, isResultCorrect*/
+        if (dirty[0] & /*textAriaLabel*/
+        256) {
+          attr(
+            input,
+            "aria-label",
+            /*textAriaLabel*/
+            ctx2[8]
+          );
+        }
+        if (dirty[0] & /*placeholder*/
+        64) {
+          attr(
+            input,
+            "placeholder",
+            /*placeholder*/
+            ctx2[6]
+          );
+        }
+        if (dirty[0] & /*isFinished, isResultCorrect*/
         6 && input_class_value !== (input_class_value = "typein-textbox " + (!/*isFinished*/
         ctx2[1] ? "" : (
           /*isResultCorrect*/
@@ -2569,17 +2625,17 @@
         )))) {
           attr(input, "class", input_class_value);
         }
-        if (dirty & /*isDataSaving*/
+        if (dirty[0] & /*isDataSaving*/
         1) {
           input.disabled = /*isDataSaving*/
           ctx2[0];
         }
-        if (dirty & /*isFinished*/
+        if (dirty[0] & /*isFinished*/
         2) {
           input.readOnly = /*isFinished*/
           ctx2[1];
         }
-        if (dirty & /*typeinAnswer*/
+        if (dirty[0] & /*typeinAnswer*/
         8 && input.value !== /*typeinAnswer*/
         ctx2[3]) {
           set_input_value(
@@ -2603,12 +2659,12 @@
     function select_block_type(ctx2, dirty) {
       if (
         /*typeinType*/
-        ctx2[8] === TYPEIN_TYPE_SHORT
+        ctx2[11] === TYPEIN_TYPE_SHORT
       )
         return create_if_block_22;
       return create_else_block_1;
     }
-    let current_block_type = select_block_type(ctx, -1);
+    let current_block_type = select_block_type(ctx, [-1, -1]);
     let if_block = current_block_type(ctx);
     return {
       c() {
@@ -2638,10 +2694,6 @@
     let span0_class_value;
     let t0;
     let span1;
-    let t1_value = (
-      /*isResultCorrect*/
-      ctx[2] ? "Correct" : "Incorrect"
-    );
     let t1;
     let div_class_value;
     let t2;
@@ -2657,7 +2709,7 @@
         return 0;
       return 1;
     }
-    current_block_type_index = select_block_type_1(ctx, -1);
+    current_block_type_index = select_block_type_1(ctx, [-1, -1]);
     if_block = if_blocks[current_block_type_index] = if_block_creators[current_block_type_index](ctx);
     promptresult = new PromptResultFeedback_default({
       props: {
@@ -2682,14 +2734,18 @@
         if_block.c();
         t0 = space();
         span1 = element("span");
-        t1 = text(t1_value);
+        t1 = text(
+          /*resultLabel*/
+          ctx[7]
+        );
         t2 = space();
         create_component(promptresult.$$.fragment);
         attr(span0, "class", span0_class_value = /*isResultCorrect*/
         (ctx[2] ? "text-green-800" : "text-red-800") + " mr-2 p-0.5");
         attr(span1, "class", "p2");
+        attr(div, "aria-hidden", "true");
         attr(div, "class", div_class_value = "flex items-center text-charcoal " + /*typeinType*/
-        (ctx[8] === TYPEIN_TYPE_SHORT ? "mt-2" : "mt-0.5"));
+        (ctx[11] === TYPEIN_TYPE_SHORT ? "mt-2" : "mt-0.5"));
       },
       m(target, anchor) {
         insert(target, div, anchor);
@@ -2720,25 +2776,28 @@
           transition_in(if_block, 1);
           if_block.m(span0, null);
         }
-        if (!current || dirty & /*isResultCorrect*/
+        if (!current || dirty[0] & /*isResultCorrect*/
         4 && span0_class_value !== (span0_class_value = /*isResultCorrect*/
         (ctx2[2] ? "text-green-800" : "text-red-800") + " mr-2 p-0.5")) {
           attr(span0, "class", span0_class_value);
         }
-        if ((!current || dirty & /*isResultCorrect*/
-        4) && t1_value !== (t1_value = /*isResultCorrect*/
-        ctx2[2] ? "Correct" : "Incorrect"))
-          set_data(t1, t1_value);
+        if (!current || dirty[0] & /*resultLabel*/
+        128)
+          set_data(
+            t1,
+            /*resultLabel*/
+            ctx2[7]
+          );
         const promptresult_changes = {};
-        if (dirty & /*isResultCorrect*/
+        if (dirty[0] & /*isResultCorrect*/
         4)
           promptresult_changes.isResultCorrect = /*isResultCorrect*/
           ctx2[2];
-        if (dirty & /*resultFeedbackTitle*/
+        if (dirty[0] & /*resultFeedbackTitle*/
         16)
           promptresult_changes.resultFeedbackTitle = /*resultFeedbackTitle*/
           ctx2[4];
-        if (dirty & /*resultFeedback*/
+        if (dirty[0] & /*resultFeedback*/
         32)
           promptresult_changes.resultFeedback = /*resultFeedback*/
           ctx2[5];
@@ -2829,11 +2888,11 @@
       props: {
         rubric: (
           /*rubric*/
-          ctx[6].text
+          ctx[9].text
         ),
         prompt: (
           /*prompt*/
-          ctx[7]
+          ctx[10]
         ),
         $$slots: { default: [create_default_slot2] },
         $$scope: { ctx }
@@ -2859,10 +2918,11 @@
         insert(target, if_block_anchor, anchor);
         current = true;
       },
-      p(ctx2, [dirty]) {
+      p(ctx2, dirty) {
         const promptbody_changes = {};
-        if (dirty & /*$$scope, isFinished, isResultCorrect, isDataSaving, typeinAnswer*/
-        1073741839) {
+        if (dirty[0] & /*textAriaLabel, placeholder, isFinished, isResultCorrect, isDataSaving, typeinAnswer*/
+        335 | dirty[1] & /*$$scope*/
+        4) {
           promptbody_changes.$$scope = { dirty, ctx: ctx2 };
         }
         promptbody.$set(promptbody_changes);
@@ -2872,7 +2932,7 @@
         ) {
           if (if_block) {
             if_block.p(ctx2, dirty);
-            if (dirty & /*isFinished*/
+            if (dirty[0] & /*isFinished*/
             2) {
               transition_in(if_block, 1);
             }
@@ -2914,7 +2974,6 @@
     };
   }
   var idLabel = "answerText";
-  var placeholder = "Type your answer here";
   function instance4($$self, $$props, $$invalidate) {
     let { sessionData } = $$props;
     let { isDataSaving } = $$props;
@@ -2926,16 +2985,22 @@
     let latestAnswer = "";
     let resultFeedbackTitle = "";
     let resultFeedback = "";
+    let placeholder = "Type your answer here";
     let focusOrigin = "tab";
+    let resultLabel = "";
     const { rubric, interaction, metadata, scoringMetadata } = sessionData;
     const { prompt, typein_type: typeinType } = interaction;
     if (metadata) {
       const events = metadata.interactions.events.pop();
       latestAnswer = typeinAnswer = events.answer[0];
     }
+    let textAriaLabel = !latestAnswer ? "Answer input: Please type your response" : "Your response is";
     if (isFinished) {
       const { answer, hasAnswer } = scoringMetadata;
       typeinAnswer = answer && hasAnswer ? answer : typeinAnswer;
+      resultLabel = isResultCorrect ? "Correct" : "Incorrect";
+      textAriaLabel = `Submitted response is ${resultLabel.toLocaleLowerCase()}`;
+      placeholder = isResultCorrect ? placeholder : "No answer provided";
       if (!isPreviewMode) {
         const { correct: correctFeeback, incorrect: incorrectFeedback } = interaction.feedback;
         const { header, text: text2 } = isResultCorrect ? correctFeeback : incorrectFeedback;
@@ -2983,7 +3048,7 @@
     const keydown_handler_1 = (event) => saveOnEnter(event);
     $$self.$$set = ($$props2) => {
       if ("sessionData" in $$props2)
-        $$invalidate(13, sessionData = $$props2.sessionData);
+        $$invalidate(16, sessionData = $$props2.sessionData);
       if ("isDataSaving" in $$props2)
         $$invalidate(0, isDataSaving = $$props2.isDataSaving);
       if ("isFinished" in $$props2)
@@ -2991,7 +3056,7 @@
       if ("isResultCorrect" in $$props2)
         $$invalidate(2, isResultCorrect = $$props2.isResultCorrect);
       if ("isPreviewMode" in $$props2)
-        $$invalidate(14, isPreviewMode = $$props2.isPreviewMode);
+        $$invalidate(17, isPreviewMode = $$props2.isPreviewMode);
     };
     return [
       isDataSaving,
@@ -3000,6 +3065,9 @@
       typeinAnswer,
       resultFeedbackTitle,
       resultFeedback,
+      placeholder,
+      resultLabel,
+      textAriaLabel,
       rubric,
       prompt,
       typeinType,
@@ -3023,16 +3091,25 @@
   var PromptTypeIn = class extends SvelteComponent {
     constructor(options) {
       super();
-      init(this, options, instance4, create_fragment6, safe_not_equal, {
-        sessionData: 13,
-        isDataSaving: 0,
-        isFinished: 1,
-        isResultCorrect: 2,
-        isPreviewMode: 14
-      });
+      init(
+        this,
+        options,
+        instance4,
+        create_fragment6,
+        safe_not_equal,
+        {
+          sessionData: 16,
+          isDataSaving: 0,
+          isFinished: 1,
+          isResultCorrect: 2,
+          isPreviewMode: 17
+        },
+        null,
+        [-1, -1]
+      );
     }
     get sessionData() {
-      return this.$$.ctx[13];
+      return this.$$.ctx[16];
     }
     set sessionData(sessionData) {
       this.$$set({ sessionData });
@@ -3060,7 +3137,7 @@
       flush();
     }
     get isPreviewMode() {
-      return this.$$.ctx[14];
+      return this.$$.ctx[17];
     }
     set isPreviewMode(isPreviewMode) {
       this.$$set({ isPreviewMode });

package/package.json

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