@citolab/tspci-tao 2.0.9 → 2.3.0-alpha.0

package/src/init.mjs

@@ -0,0 +1,112 @@
+import fs, { cp, mkdirSync } from "fs";
+import path from "path";
+import readline from "readline";
+import chalk from "chalk";
+import inquirer from "inquirer";
+function askOption(prompt) {
+  const rl = readline.createInterface({
+    input: process.stdin,
+    output: process.stdout,
+  });
+  return new Promise((resolve) => {
+    rl.question(prompt, (option) => {
+      rl.close();
+      resolve(option);
+    });
+  });
+}
+
+function selectOptions(prompt, options) {
+  return inquirer.prompt([
+    {
+      type: "checkbox",
+      message: prompt,
+      name: "values",
+      choices: options.map((o) => ({ name: o, checked: true })),
+    },
+  ]);
+}
+
+export const init = async () => {
+  console.log("adding TAO support to PCI");
+  const PACKAGE_ROOT_PATH = process.cwd();
+  const packageData = JSON.parse(fs.readFileSync(path.join(PACKAGE_ROOT_PATH, "package.json"), "utf8"));
+  const typeIdentifer = packageData.config?.tspci?.typeIdentifier;
+  if (!typeIdentifer) {
+    console.error(
+      "No typeIdentifier found in package.json (config { tspci: { typeIdentifier: 'my-pci' }}). Add it and make sure it matches the PCI typeIdentifier property"
+    );
+    return;
+  }
+  // get first 5 chars of identifier
+  const defaultShort = typeIdentifer.length > 5 ? typeIdentifer.substring(0, 5) : typeIdentifer;
+  const short = (await askOption(
+    `Enter a short name for the PCI: (default: ${defaultShort})`
+  )) || defaultShort;
+
+  const defaultLabel = typeIdentifer.length > 5 ? typeIdentifer.substring(0, 5) : typeIdentifer;
+  const label = (await askOption(
+    `Enter the label of the PCI: (default: ${defaultLabel})`
+  )) || defaultLabel;
+  const scoringsMethods = await selectOptions("Which scoring methods do you want to support?", [
+    "MATCH_CORRECT", "NONE"
+  ]);
+  const scoreMethodArray = scoringsMethods.values
+
+  // adding short, label and typeIdentifer to packageData
+  packageData.config.tspci.short = short;
+  packageData.config.tspci.label = label;
+  packageData.config.tspci.typeIdentifier = typeIdentifer;
+  packageData.config.tspci.score = scoreMethodArray;
+
+  packageData.scripts = packageData.scripts || {};
+  packageData.scripts["package:tao"] = "tspci --target tao";
+  // store packageData
+  fs.writeFileSync(path.join(PACKAGE_ROOT_PATH, "package.json"), JSON.stringify(packageData, null, 2), "utf8");
+
+  console.log("Adding TAO interface to PCI");
+  if (!packageData.source) {
+    console.error("Failed implementing TAO interface; No source property found in package.json.");
+  }
+    
+  const sourceFile = fs.readFileSync(path.join(PACKAGE_ROOT_PATH, packageData.source), "utf8");
+  if (sourceFile.indexOf("implements IMSpci<PropTypes>, TAOpci") === -1) {
+    console.log("TAO interface not implemented yet; Implementing...");
+    if (sourceFile.indexOf("implements IMSpci<PropTypes> {") === -1) {
+      console.error("Cannot implement TAOpci interface automatically. Please implement it manually.");
+    } else {
+      let newSourceFile = sourceFile.replace(
+        "implements IMSpci<PropTypes> {",
+        "implements IMSpci<PropTypes>, TAOpci {"
+      );
+      // add import { TAOpci } from "@citolab/tspci-tao"; to the top of the file
+      newSourceFile = `import { TAOpci } from "@citolab/tspci-tao";\r\n${newSourceFile}`;
+      if (newSourceFile.indexOf(" QtiVariableJSON ") === -1) {
+        newSourceFile = `import { QtiVariableJSON } from "@citolab/tspci";\r\n${newSourceFile}`;
+      }
+      const defaultImplementation = `
+    off = () => {}; // called when setting correct response in tao
+    on = (val) => {};
+    trigger = (event: string, value: any) => {
+      this.config.properties[event] = value;
+      this.render();
+    };
+    resetResponse = () => {
+      // used in tao to reset the response. clean-up and re-render the PCI would be best. 
+      // this.render();
+    };
+    setResponse = (response: QtiVariableJSON) => {
+      // used to set the response in tao. E.g. when the item author has set a correct response. And you refresh TAO it will call this method to set the response in the PCI in the score-editor.
+    };
+      `
+      const lastBracket = newSourceFile.lastIndexOf("}");
+      newSourceFile = newSourceFile.substring(0, lastBracket) + defaultImplementation + newSourceFile.substring(lastBracket);
+
+      fs.writeFileSync(path.join(PACKAGE_ROOT_PATH, packageData.source), newSourceFile, "utf8");
+      console.log("TAO interface implemented");
+    }
+  } else {
+    console.log("TAO interface already implemented");
+  }
+};
+

package/toa_pci_default/imsPciCreator.js

@@ -1,67 +1,67 @@
-define([
-    'lodash',
-    '##typeIdentifier##/interaction/creator/widget/Widget',
-    'tpl!##typeIdentifier##/interaction/creator/tpl/markup'
-], function(_, Widget, markupTpl){
-
-    var _typeIdentifier = '##typeIdentifier##';
-
-    var interactionCreator = {
-        /**
-         * (required) Get the typeIdentifier of the custom interaction
-         * 
-         * @returns {String}
-         */
-        gettypeIdentifier : function(){
-            return _typeIdentifier;
-        },
-        /**
-         * (required) Get the widget prototype
-         * Used in the renderer
-         * 
-         * @returns {Object} Widget
-         */
-        getWidget : function(){
-            return Widget;
-        },
-        /**
-         * (optional) Get the default properties values of the pci.
-         * Used on new pci instance creation
-         * 
-         * @returns {Object}
-         */
-        getDefaultProperties : function(pci){
-            return '##__DEFAULT_VALUES__##'
-        },
-        /**
-         * (optional) Callback to execute on the 
-         * Used on new pci instance creation
-         * 
-         * @returns {Object}
-         */
-        afterCreate : function(pci){
-            pci.getResponseDeclaration().setTemplate('###_FIRST_SCORING_METHOD_###');
-        },
-        /**
-         * (required) Gives the qti pci xml template 
-         * 
-         * @returns {function} handlebar template
-         */
-        getMarkupTemplate : function(){
-            return markupTpl;
-        },
-        /**
-         * (optional) Allows passing additional data to xml template
-         * 
-         * @returns {function} handlebar template
-         */
-        getMarkupData : function(pci, defaultData){
-            defaultData.prompt = pci.data('prompt');
-            return defaultData;
-        }
-    };
-
-    //since we assume we are in a tao context, there is no use to expose the a global object for lib registration
-    //all libs should be declared here
-    return interactionCreator;
+define([
+    'lodash',
+    '##typeIdentifier##/interaction/creator/widget/Widget',
+    'tpl!##typeIdentifier##/interaction/creator/tpl/markup'
+], function(_, Widget, markupTpl){
+
+    var _typeIdentifier = '##typeIdentifier##';
+
+    var interactionCreator = {
+        /**
+         * (required) Get the typeIdentifier of the custom interaction
+         * 
+         * @returns {String}
+         */
+        getTypeIdentifier : function(){
+            return _typeIdentifier;
+        },
+        /**
+         * (required) Get the widget prototype
+         * Used in the renderer
+         * 
+         * @returns {Object} Widget
+         */
+        getWidget : function(){
+            return Widget;
+        },
+        /**
+         * (optional) Get the default properties values of the pci.
+         * Used on new pci instance creation
+         * 
+         * @returns {Object}
+         */
+        getDefaultProperties : function(pci){
+            return '##__DEFAULT_VALUES__##'
+        },
+        /**
+         * (optional) Callback to execute on the 
+         * Used on new pci instance creation
+         * 
+         * @returns {Object}
+         */
+        afterCreate : function(pci){
+            pci.getResponseDeclaration().setTemplate('###_FIRST_SCORING_METHOD_###');
+        },
+        /**
+         * (required) Gives the qti pci xml template 
+         * 
+         * @returns {function} handlebar template
+         */
+        getMarkupTemplate : function(){
+            return markupTpl;
+        },
+        /**
+         * (optional) Allows passing additional data to xml template
+         * 
+         * @returns {function} handlebar template
+         */
+        getMarkupData : function(pci, defaultData){
+            defaultData.prompt = pci.data('prompt');
+            return defaultData;
+        }
+    };
+
+    //since we assume we are in a tao context, there is no use to expose the a global object for lib registration
+    //all libs should be declared here
+    return interactionCreator;
 });

package/toa_pci_default/imsPciCreator.json

@@ -1,42 +1,42 @@
-{
-    "model" : "IMSPCI",
-    "typeIdentifier": "##typeIdentifier##",
-    "label": "##label##",
-    "short": "##short##",
-    "description": "##description##",
-    "version": "##version##",
-    "author": "Citolab",
-    "email": "getinspiredbycitolab@gmail.com",
-    "tags": [
-        "pci"
-    ],
-    "response": {
-        "baseType": "string",
-        "cardinality": "single"
-    },
-    "runtime" : {
-        "hook" : "interaction/runtime/js/index.js",
-        "modules" : {
-            "##typeIdentifier##/interaction/runtime/js/index" : [
-                "interaction/runtime/js/index.js"
-            ]
-        },
-        "src" : [
-            "./interaction/runtime/js/index.js"
-        ]
-    },
-    "creator" : {
-        "icon": "./interaction/creator/img/icon.svg",
-        "hook": "./imsPciCreator.js",
-        "src" : [
-            "./imsPciCreator.js",
-            "./interaction/creator/tpl/markup.tpl",
-            "./interaction/creator/tpl/propertiesForm.tpl",
-            "./interaction/creator/widget/Widget.js",
-            "./interaction/creator/widget/states/Question.js",
-            "./interaction/creator/widget/states/Answer.js",
-            "./interaction/creator/widget/states/Correct.js",
-            "./interaction/creator/widget/states/states.js"
-        ]
-    }
+{
+    "model" : "IMSPCI",
+    "typeIdentifier": "##typeIdentifier##",
+    "label": "##label##",
+    "short": "##short##",
+    "description": "##description##",
+    "version": "##version##",
+    "author": "Citolab",
+    "email": "getinspiredbycitolab@gmail.com",
+    "tags": [
+        "pci"
+    ],
+    "response": {
+        "baseType": "string",
+        "cardinality": "single"
+    },
+    "runtime" : {
+        "hook" : "interaction/runtime/js/index.js",
+        "modules" : {
+            "##typeIdentifier##/interaction/runtime/js/index" : [
+                "interaction/runtime/js/index.js"
+            ]
+        },
+        "src" : [
+            "./interaction/runtime/js/index.js"
+        ]
+    },
+    "creator" : {
+        "icon": "./interaction/creator/img/icon.svg",
+        "hook": "./imsPciCreator.js",
+        "src" : [
+            "./imsPciCreator.js",
+            "./interaction/creator/tpl/markup.tpl",
+            "./interaction/creator/tpl/propertiesForm.tpl",
+            "./interaction/creator/widget/Widget.js",
+            "./interaction/creator/widget/states/Question.js",
+            "./interaction/creator/widget/states/Answer.js",
+            "./interaction/creator/widget/states/Correct.js",
+            "./interaction/creator/widget/states/states.js"
+        ]
+    }
 }

package/toa_pci_default/interaction/creator/img/icon.svg

@@ -1,8 +1,8 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<svg xmlns:svg="http://www.w3.org/2000/svg"
-     xmlns="http://www.w3.org/2000/svg"
-     height="28" width="28">
-     <g transform="scale(0.88 0.88)">
-        <path d="M29.164 10.472c-1.25-0.328-4.189-0.324-8.488-0.438 0.203-0.938 0.25-1.784 0.25-3.286 0-3.588-2.614-6.748-4.926-6.748-1.633 0-2.979 1.335-3 2.977-0.022 2.014-0.645 5.492-4 7.256-0.246 0.13-0.95 0.477-1.053 0.522l0.053 0.045c-0.525-0.453-1.253-0.8-2-0.8h-3c-1.654 0-3 1.346-3 3v16c0 1.654 1.346 3 3 3h3c1.19 0 2.186-0.719 2.668-1.727 0.012 0.004 0.033 0.010 0.047 0.012 0.066 0.018 0.144 0.037 0.239 0.062 0.018 0.005 0.027 0.007 0.046 0.012 0.576 0.143 1.685 0.408 4.055 0.953 0.508 0.116 3.192 0.688 5.972 0.688h5.467c1.666 0 2.867-0.641 3.582-1.928 0.010-0.020 0.24-0.469 0.428-1.076 0.141-0.457 0.193-1.104 0.023-1.76 1.074-0.738 1.42-1.854 1.645-2.58 0.377-1.191 0.264-2.086 0.002-2.727 0.604-0.57 1.119-1.439 1.336-2.766 0.135-0.822-0.010-1.668-0.389-2.372 0.566-0.636 0.824-1.436 0.854-2.176l0.012-0.209c0.007-0.131 0.013-0.212 0.013-0.5 0-1.263-0.875-2.874-2.836-3.434zM7 29c0 0.553-0.447 1-1 1h-3c-0.553 0-1-0.447-1-1v-16c0-0.553 0.447-1 1-1h3c0.553 0 1 0.447 1 1v16zM29.977 14.535c-0.020 0.494-0.227 1.465-1.977 1.465-1.5 0-2 0-2 0-0.277 0-0.5 0.224-0.5 0.5s0.223 0.5 0.5 0.5c0 0 0.438 0 1.938 0s1.697 1.244 1.6 1.844c-0.124 0.746-0.474 2.156-2.163 2.156-1.687 0-2.375 0-2.375 0-0.277 0-0.5 0.223-0.5 0.5 0 0.275 0.223 0.5 0.5 0.5 0 0 1.188 0 1.969 0 1.688 0 1.539 1.287 1.297 2.055-0.319 1.009-0.514 1.945-2.641 1.945-0.719 0-1.631 0-1.631 0-0.277 0-0.5 0.223-0.5 0.5 0 0.275 0.223 0.5 0.5 0.5 0 0 0.693 0 1.568 0 1.094 0 1.145 1.035 1.031 1.406-0.125 0.406-0.273 0.707-0.279 0.721-0.302 0.545-0.789 0.873-1.82 0.873h-5.467c-2.746 0-5.47-0.623-5.54-0.639-4.154-0.957-4.373-1.031-4.634-1.105 0 0-0.846-0.143-0.846-0.881l-0.007-13.812c0-0.469 0.299-0.893 0.794-1.042 0.062-0.024 0.146-0.050 0.206-0.075 4.568-1.892 5.959-6.040 6-9.446 0.006-0.479 0.375-1 1-1 1.057 0 2.926 2.122 2.926 4.748 0 2.371-0.096 2.781-0.926 5.252 10 0 9.93 0.144 10.812 0.375 1.094 0.313 1.188 1.219 1.188 1.531 0 0.343-0.010 0.293-0.023 0.629zM4.5 26c-0.828 0-1.5 0.672-1.5 1.5s0.672 1.5 1.5 1.5 1.5-0.672 1.5-1.5-0.672-1.5-1.5-1.5zM4.5 28c-0.275 0-0.5-0.225-0.5-0.5s0.225-0.5 0.5-0.5 0.5 0.225 0.5 0.5-0.225 0.5-0.5 0.5z"></path>
-     </g>
-</svg>
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns:svg="http://www.w3.org/2000/svg"
+     xmlns="http://www.w3.org/2000/svg"
+     height="28" width="28">
+     <g transform="scale(0.88 0.88)">
+        <path d="M29.164 10.472c-1.25-0.328-4.189-0.324-8.488-0.438 0.203-0.938 0.25-1.784 0.25-3.286 0-3.588-2.614-6.748-4.926-6.748-1.633 0-2.979 1.335-3 2.977-0.022 2.014-0.645 5.492-4 7.256-0.246 0.13-0.95 0.477-1.053 0.522l0.053 0.045c-0.525-0.453-1.253-0.8-2-0.8h-3c-1.654 0-3 1.346-3 3v16c0 1.654 1.346 3 3 3h3c1.19 0 2.186-0.719 2.668-1.727 0.012 0.004 0.033 0.010 0.047 0.012 0.066 0.018 0.144 0.037 0.239 0.062 0.018 0.005 0.027 0.007 0.046 0.012 0.576 0.143 1.685 0.408 4.055 0.953 0.508 0.116 3.192 0.688 5.972 0.688h5.467c1.666 0 2.867-0.641 3.582-1.928 0.010-0.020 0.24-0.469 0.428-1.076 0.141-0.457 0.193-1.104 0.023-1.76 1.074-0.738 1.42-1.854 1.645-2.58 0.377-1.191 0.264-2.086 0.002-2.727 0.604-0.57 1.119-1.439 1.336-2.766 0.135-0.822-0.010-1.668-0.389-2.372 0.566-0.636 0.824-1.436 0.854-2.176l0.012-0.209c0.007-0.131 0.013-0.212 0.013-0.5 0-1.263-0.875-2.874-2.836-3.434zM7 29c0 0.553-0.447 1-1 1h-3c-0.553 0-1-0.447-1-1v-16c0-0.553 0.447-1 1-1h3c0.553 0 1 0.447 1 1v16zM29.977 14.535c-0.020 0.494-0.227 1.465-1.977 1.465-1.5 0-2 0-2 0-0.277 0-0.5 0.224-0.5 0.5s0.223 0.5 0.5 0.5c0 0 0.438 0 1.938 0s1.697 1.244 1.6 1.844c-0.124 0.746-0.474 2.156-2.163 2.156-1.687 0-2.375 0-2.375 0-0.277 0-0.5 0.223-0.5 0.5 0 0.275 0.223 0.5 0.5 0.5 0 0 1.188 0 1.969 0 1.688 0 1.539 1.287 1.297 2.055-0.319 1.009-0.514 1.945-2.641 1.945-0.719 0-1.631 0-1.631 0-0.277 0-0.5 0.223-0.5 0.5 0 0.275 0.223 0.5 0.5 0.5 0 0 0.693 0 1.568 0 1.094 0 1.145 1.035 1.031 1.406-0.125 0.406-0.273 0.707-0.279 0.721-0.302 0.545-0.789 0.873-1.82 0.873h-5.467c-2.746 0-5.47-0.623-5.54-0.639-4.154-0.957-4.373-1.031-4.634-1.105 0 0-0.846-0.143-0.846-0.881l-0.007-13.812c0-0.469 0.299-0.893 0.794-1.042 0.062-0.024 0.146-0.050 0.206-0.075 4.568-1.892 5.959-6.040 6-9.446 0.006-0.479 0.375-1 1-1 1.057 0 2.926 2.122 2.926 4.748 0 2.371-0.096 2.781-0.926 5.252 10 0 9.93 0.144 10.812 0.375 1.094 0.313 1.188 1.219 1.188 1.531 0 0.343-0.010 0.293-0.023 0.629zM4.5 26c-0.828 0-1.5 0.672-1.5 1.5s0.672 1.5 1.5 1.5 1.5-0.672 1.5-1.5-0.672-1.5-1.5-1.5zM4.5 28c-0.275 0-0.5-0.225-0.5-0.5s0.225-0.5 0.5-0.5 0.5 0.225 0.5 0.5-0.225 0.5-0.5 0.5z"></path>
+     </g>
+</svg>

package/toa_pci_default/interaction/creator/tpl/markup.tpl

@@ -1,19 +1,19 @@
-<div class="pciInteraction">
-    <style>
-        .pciInteraction ul.pci{
-            list-style-type: none;
-            margin: 0 5px;
-            padding: 0;
-            display: inline-block;
-            position: relative;
-            top: 7px;
-        }
-        .pciInteraction ul.pci li{
-            float: left;
-            text-align: left;
-            list-style-type: none;
-        }
-    </style>
-    <div class="prompt">{{{prompt}}}</div>
-    <ul class="pci"></ul>
+<div class="pciInteraction">
+    <style>
+        .pciInteraction ul.pci{
+            list-style-type: none;
+            margin: 0 5px;
+            padding: 0;
+            display: inline-block;
+            position: relative;
+            top: 7px;
+        }
+        .pciInteraction ul.pci li{
+            float: left;
+            text-align: left;
+            list-style-type: none;
+        }
+    </style>
+    <div class="prompt">{{{prompt}}}</div>
+    <ul class="pci"></ul>
 </div>

package/toa_pci_default/interaction/creator/tpl/propertiesForm.tpl

@@ -1,8 +1,8 @@
-<div class="panel">
-    <input type="text" 
-           name="identifier" 
-           value="{{identifier}}" 
-           placeholder="e.g. RESPONSE" 
-           data-validate="$notEmpty; $qtiIdentifier; $availableIdentifier(serial={{serial}});">
-    <!-- ##_HTML_CONTROLS_## -->
+<div class="panel">
+    <input type="text" 
+           name="identifier" 
+           value="{{identifier}}" 
+           placeholder="e.g. RESPONSE" 
+           data-validate="$notEmpty; $qtiIdentifier; $availableIdentifier(serial={{serial}});">
+    <!-- ##_HTML_CONTROLS_## -->
 </div>

package/toa_pci_default/interaction/creator/widget/Widget.js

@@ -1,15 +1,15 @@
-define([
-    'taoQtiItem/qtiCreator/widgets/interactions/customInteraction/Widget',
-    '##typeIdentifier##/interaction/creator/widget/states/states'
-], function(Widget, states){
-
-    var InteractionWidget = Widget.clone();
-
-    InteractionWidget.initCreator = function(){
-        this.registerStates(states);
-        
-        Widget.initCreator.call(this);
-    };
-    
-    return InteractionWidget;
+define([
+    'taoQtiItem/qtiCreator/widgets/interactions/customInteraction/Widget',
+    '##typeIdentifier##/interaction/creator/widget/states/states'
+], function(Widget, states){
+
+    var InteractionWidget = Widget.clone();
+
+    InteractionWidget.initCreator = function(){
+        this.registerStates(states);
+        
+        Widget.initCreator.call(this);
+    };
+    
+    return InteractionWidget;
 });

package/toa_pci_default/interaction/creator/widget/states/Answer.js

@@ -1,26 +1,26 @@
-define([
-    'taoQtiItem/qtiCreator/widgets/states/factory',
-    'taoQtiItem/qtiCreator/widgets/interactions/states/Answer',
-    'taoQtiItem/qtiCreator/widgets/interactions/helpers/answerState'
-], function(stateFactory, Answer, answerStateHelper){
-
-    var InteractionStateAnswer = stateFactory.extend(Answer, function(){
-
-        //forward to one of the available sub state, according to the response processing template
-        answerStateHelper.forward(this.widget);
-
-    }, function(){
-
-    });
-
-    InteractionStateAnswer.prototype.initResponseForm = function initResponseForm() {
-        answerStateHelper.initResponseForm(
-            this.widget,
-            {
-                rpTemplates: ['###_RD_TEMPLATES_###'],
-            }
-        );
-    };
-
-    return  InteractionStateAnswer;
-});
+define([
+    'taoQtiItem/qtiCreator/widgets/states/factory',
+    'taoQtiItem/qtiCreator/widgets/interactions/states/Answer',
+    'taoQtiItem/qtiCreator/widgets/interactions/helpers/answerState'
+], function(stateFactory, Answer, answerStateHelper){
+
+    var InteractionStateAnswer = stateFactory.extend(Answer, function(){
+
+        //forward to one of the available sub state, according to the response processing template
+        answerStateHelper.forward(this.widget);
+
+    }, function(){
+
+    });
+
+    InteractionStateAnswer.prototype.initResponseForm = function initResponseForm() {
+        answerStateHelper.initResponseForm(
+            this.widget,
+            {
+                rpTemplates: ['###_RD_TEMPLATES_###'],
+            }
+        );
+    };
+
+    return  InteractionStateAnswer;
+});

package/toa_pci_default/interaction/creator/widget/states/Correct.js

@@ -1,44 +1,44 @@
-define([
-  "taoQtiItem/qtiCreator/widgets/states/factory",
-  "taoQtiItem/qtiCreator/widgets/interactions/states/Correct",
-  "lodash",
-], function (stateFactory, Correct, _) {
-  var InteractionStateCorrect = stateFactory.create(
-    Correct,
-    function () {
-      var widget = this.widget;
-      var interaction = widget.element;
-      var responseDeclaration = interaction.getResponseDeclaration();
-      var correct = _.values(responseDeclaration.getCorrect());
-          // show correct response in the pci.
-      if (correct && typeof correct[0] !== "undefined") {
-        interaction?.setResponse && interaction.setResponse({ base: { string: correct[0] } });
-      }
-    },
-    function () {
-      var widget = this.widget;
-      var interaction = widget.element;
-      var responseDeclaration = interaction.getResponseDeclaration();
-      var correct = interaction && interaction.getResponse ? interaction.getResponse() : undefined;
-      var correctString = '';
-      if (correct !== undefined && correct.base) {
-        if (correct.base.string !== null && (correct.base.string !== undefined)) {
-            correctString = correct.base.string;
-        } else if (correct.base.integer !== null && (correct.base.integer !== undefined)) {
-            correctString = correct.base.integer;
-        } else if (correct.base.boolean !== null && (correct.base.boolean !== undefined)) {
-            correctString = correct.base.boolean;
-        }
-      }
-     
-      //   getResponse
-      //   var correct = _.values(responseDeclaration.getCorrect());
-      responseDeclaration.setCorrect(correctString);
-
-      interaction.resetResponse();
-      interaction.offPci(".question");
-    }
-  );
-
-  return InteractionStateCorrect;
-});
+define([
+  "taoQtiItem/qtiCreator/widgets/states/factory",
+  "taoQtiItem/qtiCreator/widgets/interactions/states/Correct",
+  "lodash",
+], function (stateFactory, Correct, _) {
+  var InteractionStateCorrect = stateFactory.create(
+    Correct,
+    function () {
+      var widget = this.widget;
+      var interaction = widget.element;
+      var responseDeclaration = interaction.getResponseDeclaration();
+      var correct = _.values(responseDeclaration.getCorrect());
+          // show correct response in the pci.
+      if (correct && typeof correct[0] !== "undefined") {
+        interaction?.setResponse && interaction.setResponse({ base: { string: correct[0] } });
+      }
+    },
+    function () {
+      var widget = this.widget;
+      var interaction = widget.element;
+      var responseDeclaration = interaction.getResponseDeclaration();
+      var correct = interaction && interaction.getResponse ? interaction.getResponse() : undefined;
+      var correctString = '';
+      if (correct !== undefined && correct.base) {
+        if (correct.base.string !== null && (correct.base.string !== undefined)) {
+            correctString = correct.base.string;
+        } else if (correct.base.integer !== null && (correct.base.integer !== undefined)) {
+            correctString = correct.base.integer;
+        } else if (correct.base.boolean !== null && (correct.base.boolean !== undefined)) {
+            correctString = correct.base.boolean;
+        }
+      }
+     
+      //   getResponse
+      //   var correct = _.values(responseDeclaration.getCorrect());
+      responseDeclaration.setCorrect(correctString);
+
+      interaction.resetResponse();
+      interaction.offPci(".question");
+    }
+  );
+
+  return InteractionStateCorrect;
+});