@citolab/qti-components 7.0.8 → 7.0.9-beta.1

package/dist/chunks/{chunk-E4TWZ2DL.js → chunk-5E4OEZCA.js}

@@ -1,27 +1,27 @@
-import {
-  qtiTransformItem
-} from "./chunk-XDMSEAYC.js";
 import {
   liveQuery
 } from "./chunk-D3RGDWKP.js";
 import {
   watch
 } from "./chunk-ELDMXTUQ.js";
-import {
-  Interaction
-} from "./chunk-OIRWOI3E.js";
-import {
-  itemContextVariables
-} from "./chunk-DLUJN2FW.js";
 import {
   QtiConditionExpression
-} from "./chunk-XSI6FXGD.js";
+} from "./chunk-OOQLWOYU.js";
 import {
   QtiExpression
-} from "./chunk-BPHQLJWE.js";
+} from "./chunk-I7HVKMDI.js";
+import {
+  qtiTransformItem
+} from "./chunk-XDMSEAYC.js";
+import {
+  Interaction
+} from "./chunk-WRHEO7NG.js";
+import {
+  itemContextVariables
+} from "./chunk-W7ZXKJ5O.js";
 import {
   itemContext
-} from "./chunk-KOEILLVS.js";
+} from "./chunk-NJNQOQUU.js";
 import {
   __decorateClass
 } from "./chunk-H2JE6IVU.js";
@@ -243,13 +243,19 @@ var QtiAssessmentItem = class extends LitElement {
       value: this._context.variables.find((v) => v.identifier === identifier)?.value
     });
   }
-  validate() {
+  validate(reportValidity = true) {
     if (this._interactionElements.every((interactionElement) => interactionElement.validate())) return true;
     if (this._interactionElements.some((interactionElement) => interactionElement.validate())) return false;
+    if (reportValidity) this.reportValidity();
     return null;
   }
+  reportValidity() {
+    for (const interactionElement of this._interactionElements) {
+      interactionElement.reportValidity();
+    }
+  }
   _getCompletionStatus() {
-    const valid = this.validate();
+    const valid = this.validate(false);
     if (valid === true) return "completed";
     if (valid === false) return "incomplete";
     return "not_attempted";
@@ -677,6 +683,9 @@ QtiAssociableHotspot = __decorateClass([
 import { html as html7 } from "lit";
 import { customElement as customElement9, state as state3 } from "lit/decorators.js";
 
+// src/lib/qti-components/qti-interaction/internal/drag-drop/drag-drop-interaction-mixin.ts
+import { property as property4 } from "lit/decorators.js";
+
 // src/lib/qti-components/qti-interaction/internal/drag-drop/flippables-mixin.ts
 var FlippablesMixin = (superClass, _droppablesSel, _draggablesSel) => {
   class FlippablesElement extends superClass {
@@ -744,7 +753,6 @@ var FlippablesMixin = (superClass, _droppablesSel, _draggablesSel) => {
 };
 
 // src/lib/qti-components/qti-interaction/internal/drag-drop/drag-drop-interaction-mixin.ts
-import { property as property4 } from "lit/decorators.js";
 var DragDropInteractionMixin = (superClass, draggablesSelector, droppablesSelector, dragContainersSelector) => {
   class DragDropInteractionElement extends FlippablesMixin(
     superClass,
@@ -1078,7 +1086,6 @@ var DragDropInteractionMixin = (superClass, draggablesSelector, droppablesSelect
       }
       const lastElementChild = this.lastElementChild;
       this._internals.setValidity(isValid ? {} : { customError: true }, validityMessage, lastElementChild);
-      this.reportValidity();
       return isValid;
     }
     reportValidity() {
@@ -1098,7 +1105,7 @@ var DragDropInteractionMixin = (superClass, draggablesSelector, droppablesSelect
       const maxMatch = this.getMatchMaxValue(droppable);
       const currentAssociations = droppable.querySelectorAll('[qti-draggable="true"]').length;
       const unlimitedAssociations = maxMatch === 0;
-      return unlimitedAssociations || currentAssociations >= maxMatch;
+      return !unlimitedAssociations && currentAssociations >= maxMatch;
     }
     dropDraggableInDroppable(draggable, droppable) {
       const cleanClone = draggable.cloneNode(true);
@@ -1143,12 +1150,18 @@ var DragDropInteractionMixin = (superClass, draggablesSelector, droppablesSelect
       this.deactivateDroppables();
     }
     checkAllMaxAssociations() {
+      const currentAssociations = this.getValidAssociations();
+      const maxAssociationsInterationReached = this.maxAssociations !== 0 && currentAssociations >= this.maxAssociations;
       this.droppables.forEach((d) => {
-        const maxAssociationsReached = this.checkMaxAssociations(d);
-        if (maxAssociationsReached) {
+        if (maxAssociationsInterationReached) {
           this.disableDroppable(d);
         } else {
-          this.enableDroppable(d);
+          const maxAssociationsReached = this.checkMaxAssociations(d);
+          if (maxAssociationsReached) {
+            this.disableDroppable(d);
+          } else {
+            this.enableDroppable(d);
+          }
         }
       });
     }
@@ -1190,7 +1203,11 @@ var DragDropInteractionMixin = (superClass, draggablesSelector, droppablesSelect
       });
     }
     getValidAssociations() {
-      return this.droppables.filter((d) => d.childElementCount > 0).length;
+      let count = 0;
+      for (const droppable of this.droppables) {
+        count = count + this.getDraggablesFromDroppable(droppable).length;
+      }
+      return count;
     }
     saveResponse() {
       const response = this.collectResponseData();
@@ -1373,13 +1390,6 @@ var DragDropInteractionMixin = (superClass, draggablesSelector, droppablesSelect
       e.preventDefault();
       this.dragClone.setAttribute("dragging", "");
     }
-    findParentInteractionElement(element) {
-      let parent = element.parentElement;
-      while (parent && !parent.tagName?.toLowerCase().endsWith("-interaction")) {
-        parent = parent.parentElement;
-      }
-      return parent;
-    }
     findDraggableInDraggableContainer(identifier) {
       const allDragContainers = this.dragContainers.flat();
       for (const container of allDragContainers) {
@@ -1590,10 +1600,10 @@ var ChoicesMixin = (superClass, selector) => {
       let validityMessage = "";
       if (this.maxChoices !== 0 && selectedCount > this.maxChoices) {
         isValid = false;
-        validityMessage = this.dataset.maxSelectionsMessage || `You can select at most ${this.maxChoices} choices.`;
+        validityMessage = this.dataset.maxSelectionsMessage || `Please select no more than ${this.maxChoices} ${this.maxChoices === 1 ? "option" : "options"}.`;
       } else if (selectedCount < this.minChoices) {
         isValid = false;
-        validityMessage = this.dataset.minSelectionsMessage || `You must select at least ${this.minChoices} choices.`;
+        validityMessage = `Please select at least ${this.minChoices} ${this.minChoices === 1 ? "option" : "options"}.`;
       }
       if (selectedChoices.length > 0) {
         this._internals.setValidity(
@@ -1602,7 +1612,6 @@ var ChoicesMixin = (superClass, selector) => {
           selectedChoices[selectedCount - 1] || this._choiceElements[0] || this
         );
       }
-      this.reportValidity();
       return isValid;
     }
     reportValidity() {
@@ -2571,17 +2580,26 @@ function positionHotspots(shape, coordsNumber, img, hotspot) {
         hotspot.style.height = bottomYPer - topYPer + "%";
       }
       break;
+    case "ellipse":
+      {
+        const [centerX, centerY, radiusX, radiusY] = coordsNumber;
+        const centerXPer = centerX / img.width * 100;
+        const centerYPer = centerY / img.height * 100;
+        const radiusXPer = radiusX / img.width * 100;
+        const radiusYPer = radiusY / img.height * 100;
+        hotspot.style.left = centerXPer - radiusXPer + "%";
+        hotspot.style.top = centerYPer - radiusYPer + "%";
+        hotspot.style.width = 2 * radiusXPer + "%";
+        hotspot.style.height = 2 * radiusYPer + "%";
+        hotspot.style.borderRadius = `50%`;
+      }
+      break;
     case "poly":
       {
-        const polycoords = coordsNumber.reduce((acc, currentValue, currentIndex, polyC) => {
-          if (currentIndex % 2 === 1) {
-            const lastVal = acc.pop();
-            acc[acc.length] = { x: lastVal, y: polyC[currentIndex] };
-          } else {
-            acc.push(currentValue);
-          }
-          return acc;
-        }, []);
+        const polycoords = [];
+        for (let i = 0; i < coordsNumber.length; i += 2) {
+          polycoords.push({ x: coordsNumber[i], y: coordsNumber[i + 1] });
+        }
         const leftX = Math.min(...polycoords.map((point) => point.x));
         const rightX = Math.max(...polycoords.map((point) => point.x));
         const topY = Math.min(...polycoords.map((point) => point.y));
@@ -2590,19 +2608,20 @@ function positionHotspots(shape, coordsNumber, img, hotspot) {
         const topYPer = topY / img.height * 100;
         const rightXPer = rightX / img.width * 100;
         const bottomYPer = bottomY / img.height * 100;
-        hotspot.style.left = leftX / img.width * 100 + "%";
-        hotspot.style.top = topY / img.height * 100 + "%";
+        hotspot.style.left = leftXPer + "%";
+        hotspot.style.top = topYPer + "%";
         hotspot.style.width = rightXPer - leftXPer + "%";
         hotspot.style.height = bottomYPer - topYPer + "%";
         const polygonData = polycoords.map((point) => ({
           x: (point.x - leftX) / (rightX - leftX) * 100,
           y: (point.y - topY) / (bottomY - topY) * 100
         }));
-        const polyD = polygonData.map((p) => Math.round(p.x) + "% " + Math.round(p.y) + "%").join(",");
+        const polyD = polygonData.map((p) => `${p.x}% ${p.y}%`).join(",");
         hotspot.style.clipPath = `polygon(${polyD})`;
       }
       break;
     default:
+      console.error(`Unsupported shape: ${shape}`);
       break;
   }
 }
@@ -2912,25 +2931,25 @@ var QtiGraphicOrderInteraction = class extends ChoicesMixin(Interaction, "qti-ho
   setHotspotOrder(e) {
     const { identifier } = e.detail;
     const hotspot = this._choiceElements.find((el) => el.getAttribute("identifier") === identifier);
+    if (!hotspot) return;
     const maxSelection = this._choiceElements.length;
     if (!this.choiceOrdering) {
       this.choiceOrdering = true;
       if (hotspot.order == null) {
-        if (this._choiceElements.filter((i) => i.order > 0).length >= maxSelection) {
+        const currentSelection = this._choiceElements.filter((i) => i.order != null).length;
+        if (currentSelection >= maxSelection) {
           this.choiceOrdering = false;
           return;
         }
-        hotspot.order = this._choiceElements.filter((i) => !!i.order).length + 1;
-        this.choiceOrdering = false;
-        return;
+        hotspot.order = currentSelection + 1;
       } else {
+        const removedOrder = hotspot.order;
+        hotspot.order = null;
         this._choiceElements.forEach((hotspot2) => {
-          if (hotspot2.order > hotspot2.order) {
+          if (hotspot2.order != null && hotspot2.order > removedOrder) {
             hotspot2.order--;
           }
-          return hotspot2;
         });
-        hotspot.order = null;
       }
       this.choiceOrdering = false;
     }
@@ -3236,11 +3255,6 @@ QtiInlineChoice = __decorateClass([
   customElement26("qti-inline-choice")
 ], QtiInlineChoice);
 
-// src/lib/qti-components/qti-interaction/qti-match-interaction/qti-match-interaction.ts
-import { html as html25, nothing } from "lit";
-import { customElement as customElement28, property as property20, state as state8 } from "lit/decorators.js";
-import { unsafeHTML as unsafeHTML2 } from "lit/directives/unsafe-html.js";
-
 // src/lib/qti-components/qti-interaction/qti-simple-associable-choice.ts
 import { css as css20, html as html24, LitElement as LitElement14 } from "lit";
 import { customElement as customElement27, property as property19 } from "lit/decorators.js";
@@ -3305,6 +3319,11 @@ QtiSimpleAssociableChoice = __decorateClass([
   customElement27("qti-simple-associable-choice")
 ], QtiSimpleAssociableChoice);
 
+// src/lib/qti-components/qti-interaction/qti-match-interaction/qti-match-interaction.ts
+import { html as html25, nothing } from "lit";
+import { customElement as customElement28, property as property20, state as state8 } from "lit/decorators.js";
+import { unsafeHTML as unsafeHTML2 } from "lit/directives/unsafe-html.js";
+
 // src/lib/qti-components/qti-interaction/qti-match-interaction/qti-match-interaction.styles.ts
 import { css as css21 } from "lit";
 var qti_match_interaction_styles_default = css21`
@@ -3445,7 +3464,7 @@ var QtiMatchInteraction = class extends DragDropInteractionMixin(
         const selectedInRowCount = this.value.filter((v) => v.split(" ")[0] === rowId).length || 0;
         const checked = this.value.includes(value);
         const part = `rb ${checked ? "rb-checked" : ""} ${this.correctOptions.includes(value) ? "rb-correct" : ""}`;
-        const disable = this.correctOptions.length > 0 ? true : row.matchMax === 1 ? false : selectedInRowCount >= row.matchMax && !checked;
+        const disable = this.correctOptions.length > 0 ? true : row.matchMax === 1 ? false : row.matchMax !== 0 && selectedInRowCount >= row.matchMax && !checked;
         return html25`<td>
                         <input
                           type=${row.matchMax === 1 ? "radio" : `checkbox`}
@@ -3732,14 +3751,38 @@ var QtiPortableCustomInteraction = class extends Interaction {
     }
     return null;
   }
+  addHyphenatedKeys(properties) {
+    const updatedProperties = { ...properties };
+    for (const key in properties) {
+      if (Object.prototype.hasOwnProperty.call(properties, key)) {
+        const hyphenatedKey = key.replace(/[A-Z]/g, (char) => `-${char.toLowerCase()}`);
+        updatedProperties[hyphenatedKey] = properties[key];
+      }
+    }
+    return updatedProperties;
+  }
+  responseVariablesToQtiVariableJSON(input) {
+    if (Array.isArray(input)) {
+      return {
+        list: {
+          string: input
+        }
+      };
+    } else {
+      return {
+        base: {
+          string: input || ""
+        }
+      };
+    }
+  }
   startChecking() {
     this.intervalId = setInterval(() => {
       const response = this.pci.getResponse();
-      const newResponse = this.pci.getResponse();
       const stringified = JSON.stringify(response);
       if (stringified !== this.rawResponse) {
         this.rawResponse = stringified;
-        const value = this.convertQtiVariableJSON(newResponse);
+        const value = this.convertQtiVariableJSON(response);
         this.value = value;
         this.saveResponse(value);
       }
@@ -3758,77 +3801,77 @@ var QtiPortableCustomInteraction = class extends Interaction {
   get value() {
     return this.rawResponse;
   }
-  getTAOConfig(node) {
-    const a = node.querySelectorAll("properties");
-    let config = {};
-    const getPropertyValue = (el) => {
-      const property38 = {};
-      const key = el.getAttribute("key");
-      if (key) {
-        const children = Array.from(el.children);
-        const allKey = children.map((c) => c.getAttribute("key"));
-        const isArray = allKey.length > 0 && !allKey.find((k) => !Number.isInteger(+k));
-        if (isArray) {
-          property38[key] = children.map((c) => getChildProperties(c));
-        } else {
-          property38[key] = el.textContent;
-        }
-      }
-      return property38;
-    };
-    const getChildProperties = (el) => {
-      if (el) {
-        let properties = {};
-        for (const child of el.children) {
-          properties = { ...properties, ...getPropertyValue(child) };
-        }
-        return properties;
-      }
-    };
-    for (const properties of a) {
-      const key = properties.getAttribute("key");
-      if (!key) {
-        config = { ...config, ...getChildProperties(properties) };
-      }
-      return config;
-    }
-    console.log("Can not find qti-custom-interaction config");
-    return null;
-  }
   register(pci) {
     this.pci = pci;
-    const type = this.parentElement.tagName === "QTI-CUSTOM-INTERACTION" ? "TAO" : "IMS";
-    const dom = type == "IMS" ? this.querySelector("qti-interaction-markup") : this.querySelector("markup");
+    const dom = this.querySelector("qti-interaction-markup");
     dom.classList.add("qti-customInteraction");
-    if (type == "TAO" && this.querySelector("properties")) {
+    if (this.querySelector("properties")) {
       this.querySelector("properties").style.display = "none";
     }
-    const config = type == "IMS" ? {
-      properties: this.dataset,
-      onready: () => {
-        console.log("onready");
-      }
-    } : this.getTAOConfig(this);
-    if (type == "IMS") {
+    const jsonValue = this.responseVariablesToQtiVariableJSON(this.value);
+    const config = {
+      properties: this.addHyphenatedKeys({ ...this.dataset }),
+      onready: (pciInstance) => {
+        this.pci = pciInstance;
+      },
+      responseIdentifier: this.responseIdentifier,
+      boundTo: jsonValue.base || jsonValue.list
+      // TODO: implement the following properties:
+      //       templateVariables	An object containing all of the template variables referenced (via qti-template-variable elements) in the qti-portable-custom-interaction and their current values.The values of variables MUST follow the structure defined in Appendix C.
+      // contextVariables	An object containing all of the context variables referenced (via qti-context-variable elements) in the qti-portable-custom-interaction and their current values. The values of variables MUST follow the structure defined in Appendix C.
+    };
+    if (pci.getInstance) {
       pci.getInstance(dom, config, void 0);
     } else {
-      pci.initialize(this.customInteractionTypeIdentifier, dom.firstElementChild, config);
-    }
-    if (type == "TAO") {
-      const links = Array.from(this.querySelectorAll("link")).map((acc) => acc.getAttribute("href"));
-      links.forEach((link) => {
-        const styles = document.createElement("link");
-        styles.rel = "stylesheet";
-        styles.type = "text/css";
-        styles.media = "screen";
-        styles.href = link;
-        dom.appendChild(styles);
-      });
+      const restoreTAOConfig = (element) => {
+        const config2 = {};
+        const parseDataAttributes = (element2) => {
+          const result = {};
+          Object.entries(element2.dataset).forEach(([key, value]) => {
+            if (!key.includes("__")) {
+              result[key] = value;
+            }
+          });
+          const nestedData = {};
+          Object.entries(element2.dataset).forEach(([key, value]) => {
+            const parts = key.split("__");
+            if (parts.length > 1) {
+              const [group, index, prop] = parts;
+              nestedData[group] = nestedData[group] || {};
+              nestedData[group][index] = nestedData[group][index] || {};
+              nestedData[group][index][prop] = value;
+            }
+          });
+          Object.entries(nestedData).forEach(([key, group]) => {
+            result[key] = Object.values(group);
+          });
+          return result;
+        };
+        const data = parseDataAttributes(element);
+        for (const key in data) {
+          if (Object.prototype.hasOwnProperty.call(data, key)) {
+            const value = data[key];
+            if (key === "config") {
+              config2[key] = JSON.parse(value);
+            } else {
+              config2[key] = value;
+            }
+          }
+        }
+        return config2;
+      };
+      const taoConfig = restoreTAOConfig(this);
+      pci.initialize(
+        this.customInteractionTypeIdentifier,
+        dom.firstElementChild,
+        Object.keys(taoConfig).length ? taoConfig : null
+      );
     }
     this.startChecking();
   }
   connectedCallback() {
     super.connectedCallback();
+    console.log("connectedCallback");
     define("qtiCustomInteractionContext", () => {
       return {
         register: (ctxA) => {
@@ -3840,8 +3883,22 @@ var QtiPortableCustomInteraction = class extends Interaction {
     });
     const config = this.buildRequireConfig();
     const requirePCI = requirejs.config(config);
+    requirejs.onError = function(err) {
+      console.error("RequireJS error:", err);
+      if (err.requireType === "timeout") {
+        console.error("Modules that timed out:", err.requireModules);
+      }
+      throw err;
+    };
     requirePCI(["require"], (require2) => {
-      require2([this.module]);
+      try {
+        require2([this.module], () => {
+        }, (err) => {
+          console.error("Error loading module:", err);
+        });
+      } catch (error) {
+        console.error("Error in require call:", error);
+      }
     });
   }
   disconnectedCallback() {
@@ -3885,7 +3942,7 @@ var QtiPortableCustomInteraction = class extends Interaction {
   combineRequireResolvePaths(path1, path2) {
     const path1Array = Array.isArray(path1) ? path1 : [path1];
     const path2Array = Array.isArray(path2) ? path2 : [path2];
-    return path1Array.concat(path2Array);
+    return path1Array.concat(path2Array).filter((value, index, self) => self.indexOf(value) === index);
   }
   removeDoubleSlashes(str) {
     const singleForwardSlashes = str.replace(/([^:]\/)\/+/g, "$1").replace(/\/\//g, "/").replace("http:/", "http://").replace("https:/", "https://");
@@ -4004,7 +4061,7 @@ var QtiSelectPointInteraction = class extends Interaction {
     this._imgElement = null;
     // Extracted click handler method
     this._onImageClick = (event) => {
-      if (this._points.length < this.maxChoices) {
+      if (this.maxChoices === 0 || this._points.length < this.maxChoices) {
         const x = event.offsetX;
         const y = event.offsetY;
         this._points = [...this._points, `${x} ${y}`];
@@ -5110,6 +5167,82 @@ import { property as property30 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-response-processing/utilities/scoring-helper.ts
 var ScoringHelper = class {
+  /**
+   * Checks if a given point is within a specified area.
+   * @param point The point to test, represented as a string "x y" (e.g., "102 113").
+   * @param areaKey The area definition, including shape and coordinates (e.g., "circle,102,113,16").
+   * @param baseType The base type of the response, must be "point" for this method to proceed.
+   * @returns True if the point is within the area; false otherwise.
+   */
+  static isPointInArea(point, areaKey, baseType) {
+    if (baseType !== "point") {
+      console.warn(`Base type ${baseType} is not supported for point area mapping.`);
+      return false;
+    }
+    const [px, py] = point.split(" ").map(Number);
+    const [shape, ...coords] = areaKey.split(",");
+    const coordinates = coords.map(Number);
+    switch (shape.toLowerCase()) {
+      case "circle":
+      case "default": {
+        const [cx, cy, radius] = coordinates;
+        if (coordinates.length !== 3) {
+          console.warn(`Invalid circle definition: ${areaKey}`);
+          return false;
+        }
+        const distance = Math.sqrt((px - cx) ** 2 + (py - cy) ** 2);
+        return distance <= radius;
+      }
+      case "rect": {
+        const [x1, y1, x2, y2] = coordinates;
+        if (coordinates.length !== 4) {
+          console.warn(`Invalid rectangle definition: ${areaKey}`);
+          return false;
+        }
+        return px >= x1 && px <= x2 && py >= y1 && py <= y2;
+      }
+      case "ellipse": {
+        const [cx, cy, rx, ry] = coordinates;
+        if (coordinates.length !== 4) {
+          console.warn(`Invalid ellipse definition: ${areaKey}`);
+          return false;
+        }
+        const normalizedX = (px - cx) ** 2 / rx ** 2;
+        const normalizedY = (py - cy) ** 2 / ry ** 2;
+        return normalizedX + normalizedY <= 1;
+      }
+      case "poly": {
+        if (coordinates.length < 6 || coordinates.length % 2 !== 0) {
+          console.warn(`Invalid polygon definition: ${areaKey}`);
+          return false;
+        }
+        const vertices = [];
+        for (let i = 0; i < coordinates.length; i += 2) {
+          vertices.push({ x: coordinates[i], y: coordinates[i + 1] });
+        }
+        return this.isPointInPolygon({ x: px, y: py }, vertices);
+      }
+      default:
+        console.warn(`Unsupported shape type: ${shape}`);
+        return false;
+    }
+  }
+  /**
+   * Checks if a point is inside a polygon using the ray-casting algorithm.
+   * @param point The point to test.
+   * @param vertices The vertices of the polygon in order (array of {x, y} objects).
+   * @returns True if the point is inside the polygon; false otherwise.
+   */
+  static isPointInPolygon(point, vertices) {
+    let inside = false;
+    for (let i = 0, j = vertices.length - 1; i < vertices.length; j = i++) {
+      const xi = vertices[i].x, yi = vertices[i].y;
+      const xj = vertices[j].x, yj = vertices[j].y;
+      const intersect = yi > point.y !== yj > point.y && point.x < (xj - xi) * (point.y - yi) / (yj - yi) + xi;
+      if (intersect) inside = !inside;
+    }
+    return inside;
+  }
   static compareSingleValues(value1, value2, baseType) {
     switch (baseType) {
       case "identifier":
@@ -5285,8 +5418,8 @@ import { property as property31 } from "lit/decorators.js";
 var QtiMapResponse = class extends QtiExpression {
   getResult() {
     const response = this.context.variables.find((r) => r.identifier === this.identifier);
-    if (!response) {
-      console.warn(`Response ${this.identifier} can not be found`);
+    if (!response || !response.mapping) {
+      console.error(`Response ${this.identifier} can not be found`);
       return null;
     }
     const mapping = response.mapping;
@@ -5316,10 +5449,157 @@ __decorateClass([
 ], QtiMapResponse.prototype, "identifier", 2);
 customElements.define("qti-map-response", QtiMapResponse);
 
-// src/lib/qti-components/qti-response-processing/qti-expression/qti-mapping/qti-mapping.ts
+// src/lib/qti-components/qti-response-processing/qti-expression/qti-map-response-point/qti-map-response-point.ts
 import { property as property32 } from "lit/decorators.js";
-import { LitElement as LitElement25 } from "lit";
-var QtiMapping = class extends LitElement25 {
+
+// src/lib/qti-components/internal/qti-expression.ts
+import { consume as consume3 } from "@lit/context";
+import { css as css34, html as html44, LitElement as LitElement25 } from "lit";
+import { state as state13 } from "lit/decorators.js";
+var QtiExpression2 = class extends LitElement25 {
+  constructor() {
+    super(...arguments);
+    this.getVariables = () => (
+      // FIXME: if this itself is multiple, this will never enter the qti-multiple switch
+      // See this example here: https://github.com/1EdTech/qti-examples/blob/master/qtiv3-examples/packaging/items/Example05-feedbackBlock-adaptive.xml
+      Array.from(this.children).map((e) => {
+        switch (e.tagName.toLowerCase()) {
+          case "qti-base-value": {
+            return {
+              baseType: e.getAttribute("base-type"),
+              value: e.textContent.trim(),
+              cardinality: "single"
+            };
+          }
+          case "qti-variable": {
+            const identifier = e.getAttribute("identifier") || "";
+            const variable = this.context.variables.find((v) => v.identifier === identifier) || null;
+            return variable;
+          }
+          case "qti-multiple": {
+            const multiple = e;
+            const values = multiple.getResult();
+            if (values.length > 0) {
+              return {
+                identifier: "",
+                baseType: values[0].baseType,
+                value: values.map((v) => v.value),
+                cardinality: "multiple",
+                type: "response"
+              };
+            }
+            return null;
+          }
+          case "qti-correct": {
+            const identifier = e.getAttribute("identifier") || "";
+            const responseVariable = this.context.variables.find((v) => v.identifier === identifier) || null;
+            return {
+              baseType: responseVariable.baseType,
+              value: responseVariable.correctResponse,
+              cardinality: responseVariable.cardinality
+            };
+          }
+          default: {
+            try {
+              const expression = e;
+              const value = expression.getResult();
+              return {
+                baseType: "integer",
+                value: value.toString(),
+                cardinality: "single"
+              };
+            } catch (error) {
+              console.warn("default not sufficient");
+            }
+            return null;
+          }
+        }
+      }).filter((v) => v !== null)
+    );
+  }
+  render() {
+    return html44`<pre>${JSON.stringify(this.result, null, 2)}</pre>
+      <slot></slot>`;
+  }
+  calculate() {
+    this.result = this.getResult();
+    return this.result;
+  }
+  getResult() {
+    throw new Error("Not implemented");
+  }
+};
+// hide the slot with css
+QtiExpression2.styles = css34`
+    slot {
+      display: none;
+    }
+  `;
+__decorateClass([
+  state13()
+], QtiExpression2.prototype, "result", 2);
+__decorateClass([
+  consume3({ context: itemContext, subscribe: true }),
+  state13()
+], QtiExpression2.prototype, "context", 2);
+
+// src/lib/qti-components/qti-response-processing/qti-expression/qti-map-response-point/qti-map-response-point.ts
+var QtiMapResponsePoint = class extends QtiExpression2 {
+  getResult() {
+    const response = this.context.variables.find((r) => r.identifier === this.identifier);
+    if (!response) {
+      console.warn(`Response ${this.identifier} cannot be found`);
+      return null;
+    }
+    const areaMapping = response.areaMapping;
+    if (!areaMapping) {
+      console.warn(`Area mapping not found for response ${this.identifier}`);
+      return null;
+    }
+    const candidateResponses = !Array.isArray(response.value) ? [response.value] : response.value;
+    if (!candidateResponses || candidateResponses.length === 0) {
+      console.warn(`No candidate responses for response ${this.identifier}`);
+      return null;
+    }
+    let result = 0;
+    const mappedAreas = /* @__PURE__ */ new Set();
+    for (const candidateResponse of candidateResponses) {
+      for (const entry of areaMapping.mapEntries) {
+        if (mappedAreas.has(entry.coords)) {
+          continue;
+        }
+        const isPointInArea = ScoringHelper.isPointInArea(
+          candidateResponse,
+          `${entry.shape},${entry.coords}`,
+          response.baseType
+        );
+        if (isPointInArea) {
+          result += entry.mappedValue ?? 0;
+          mappedAreas.add(entry.coords);
+        }
+      }
+    }
+    if (mappedAreas.size < candidateResponses.length) {
+      result += areaMapping.defaultValue;
+    }
+    if (areaMapping.lowerBound != null) {
+      result = Math.max(areaMapping.lowerBound, result);
+    }
+    if (areaMapping.upperBound != null) {
+      result = Math.min(areaMapping.upperBound, result);
+    }
+    return result;
+  }
+};
+__decorateClass([
+  property32({ type: String })
+], QtiMapResponsePoint.prototype, "identifier", 2);
+customElements.define("qti-map-response-point", QtiMapResponsePoint);
+
+// src/lib/qti-components/qti-response-processing/qti-expression/qti-mapping/qti-mapping.ts
+import { property as property33 } from "lit/decorators.js";
+import { LitElement as LitElement26 } from "lit";
+var QtiMapping = class extends LitElement26 {
   constructor() {
     super(...arguments);
     this.defaultValue = 0;
@@ -5334,16 +5614,46 @@ var QtiMapping = class extends LitElement25 {
   }
 };
 __decorateClass([
-  property32({ attribute: "default-value", type: Number })
+  property33({ attribute: "default-value", type: Number })
 ], QtiMapping.prototype, "defaultValue", 2);
 __decorateClass([
-  property32({ attribute: "lower-bound", type: Number })
+  property33({ attribute: "lower-bound", type: Number })
 ], QtiMapping.prototype, "lowerBound", 2);
 __decorateClass([
-  property32({ attribute: "upper-bound", type: Number })
+  property33({ attribute: "upper-bound", type: Number })
 ], QtiMapping.prototype, "upperBound", 2);
 customElements.define("qti-mapping", QtiMapping);
 
+// src/lib/qti-components/qti-response-processing/qti-expression/qti-area-mapping/qti-area-mapping.ts
+import { property as property34 } from "lit/decorators.js";
+import { LitElement as LitElement27 } from "lit";
+var QtiAreaMapping = class extends LitElement27 {
+  constructor() {
+    super(...arguments);
+    this.defaultValue = 0;
+  }
+  get mapEntries() {
+    return Array.from(this.querySelectorAll("qti-area-map-entry")).map((el) => {
+      return {
+        shape: el.getAttribute("shape"),
+        coords: el.getAttribute("coords"),
+        mappedValue: +el.getAttribute("mapped-value"),
+        defaultValue: el.getAttribute("default-value") ? +el.getAttribute("default-value") : 0
+      };
+    });
+  }
+};
+__decorateClass([
+  property34({ attribute: "default-value", type: Number })
+], QtiAreaMapping.prototype, "defaultValue", 2);
+__decorateClass([
+  property34({ attribute: "lower-bound", type: Number })
+], QtiAreaMapping.prototype, "lowerBound", 2);
+__decorateClass([
+  property34({ attribute: "upper-bound", type: Number })
+], QtiAreaMapping.prototype, "upperBound", 2);
+customElements.define("qti-area-mapping", QtiAreaMapping);
+
 // src/lib/qti-components/qti-response-processing/qti-expression/qti-match/qti-match.ts
 var QtiMatch = class _QtiMatch extends QtiExpression {
   //PK : FIXME.
@@ -5483,10 +5793,10 @@ var QtiMultiple = class extends QtiExpression {
 customElements.define("qti-multiple", QtiMultiple);
 
 // src/lib/qti-components/qti-response-processing/qti-expression/qti-not/qti-not.ts
-import { html as html44 } from "lit";
+import { html as html45 } from "lit";
 var QtiNot = class extends QtiExpression {
   render() {
-    return html44`${super.render()}`;
+    return html45`${super.render()}`;
   }
   getResult() {
     const expression = this.firstElementChild;
@@ -5550,13 +5860,13 @@ var QtiOrdered = class extends QtiExpression {
 customElements.define("qti-ordered", QtiOrdered);
 
 // src/lib/qti-components/qti-response-processing/qti-expression/qti-printed-variable/qti-printed-variable.ts
-import { consume as consume3 } from "@lit/context";
-import { LitElement as LitElement26, html as html45 } from "lit";
-import { property as property33, state as state13 } from "lit/decorators.js";
-var QtiPrintedVariable = class extends LitElement26 {
+import { consume as consume4 } from "@lit/context";
+import { LitElement as LitElement28, html as html46 } from "lit";
+import { property as property35, state as state14 } from "lit/decorators.js";
+var QtiPrintedVariable = class extends LitElement28 {
   render() {
     const value = this.context?.variables.find((v) => v.identifier === this.identifier)?.value;
-    return html45`${JSON.stringify(value, null, 2)}`;
+    return html46`${JSON.stringify(value, null, 2)}`;
   }
   calculate() {
     const result = this.context.variables.find((v) => v.identifier === this.identifier) || null;
@@ -5564,11 +5874,11 @@ var QtiPrintedVariable = class extends LitElement26 {
   }
 };
 __decorateClass([
-  property33({ type: String })
+  property35({ type: String })
 ], QtiPrintedVariable.prototype, "identifier", 2);
 __decorateClass([
-  consume3({ context: itemContext, subscribe: true }),
-  state13()
+  consume4({ context: itemContext, subscribe: true }),
+  state14()
 ], QtiPrintedVariable.prototype, "context", 2);
 customElements.define("qti-printed-variable", QtiPrintedVariable);
 
@@ -5628,7 +5938,7 @@ function qtiSubtractMixin(Base) {
 customElements.define("qti-subtract", QtiSubtract);
 
 // src/lib/qti-components/qti-response-processing/qti-expression/qti-string-match/qti-string-match.ts
-import { property as property34 } from "lit/decorators.js";
+import { property as property36 } from "lit/decorators.js";
 var QtiStringMatch = class extends QtiExpression {
   constructor() {
     super(...arguments);
@@ -5652,7 +5962,7 @@ var QtiStringMatch = class extends QtiExpression {
   }
 };
 __decorateClass([
-  property34({ type: String, attribute: "case-sensitive" })
+  property36({ type: String, attribute: "case-sensitive" })
 ], QtiStringMatch.prototype, "caseSensitive", 2);
 customElements.define("qti-string-match", QtiStringMatch);
 
@@ -5700,11 +6010,11 @@ var QtiVariable = class extends QtiExpression {
 customElements.define("qti-variable", QtiVariable);
 
 // src/lib/qti-components/qti-rubric-block/qti-content-body.ts
-import { LitElement as LitElement27, html as html46 } from "lit";
+import { LitElement as LitElement29, html as html47 } from "lit";
 import { customElement as customElement43 } from "lit/decorators.js";
-var QtiContentBody = class extends LitElement27 {
+var QtiContentBody = class extends LitElement29 {
   render() {
-    return html46`<slot></slot>`;
+    return html47`<slot></slot>`;
   }
 };
 QtiContentBody = __decorateClass([
@@ -5712,9 +6022,9 @@ QtiContentBody = __decorateClass([
 ], QtiContentBody);
 
 // src/lib/qti-components/qti-rubric-block/qti-rubric-block.ts
-import { LitElement as LitElement28, css as css34, html as html47 } from "lit";
-import { customElement as customElement44, property as property35 } from "lit/decorators.js";
-var QtiRubricBlock = class extends LitElement28 {
+import { LitElement as LitElement30, css as css35, html as html48 } from "lit";
+import { customElement as customElement44, property as property37 } from "lit/decorators.js";
+var QtiRubricBlock = class extends LitElement30 {
   handleclassNamesChange() {
     const classNames = this.classNames.split(" ");
     classNames.forEach((className) => {
@@ -5731,29 +6041,29 @@ var QtiRubricBlock = class extends LitElement28 {
     });
   }
   render() {
-    return html47`<slot></slot>`;
+    return html48`<slot></slot>`;
   }
   connectedCallback() {
     super.connectedCallback();
     this.setAttribute("slot", "qti-rubric-block");
   }
 };
-QtiRubricBlock.styles = css34`
+QtiRubricBlock.styles = css35`
     :host {
       display: block;
     }
   `;
 __decorateClass([
-  property35({ type: String })
+  property37({ type: String })
 ], QtiRubricBlock.prototype, "id", 2);
 __decorateClass([
-  property35({ type: String })
+  property37({ type: String })
 ], QtiRubricBlock.prototype, "use", 2);
 __decorateClass([
-  property35({ type: String })
+  property37({ type: String })
 ], QtiRubricBlock.prototype, "view", 2);
 __decorateClass([
-  property35({ type: String, attribute: "class" })
+  property37({ type: String, attribute: "class" })
 ], QtiRubricBlock.prototype, "classNames", 2);
 __decorateClass([
   watch("classNames", { waitUntilFirstUpdate: true })
@@ -5763,9 +6073,9 @@ QtiRubricBlock = __decorateClass([
 ], QtiRubricBlock);
 
 // src/lib/qti-components/qti-stylesheet/qti-stylesheet.ts
-import { LitElement as LitElement29 } from "lit";
+import { LitElement as LitElement31 } from "lit";
 import { customElement as customElement45 } from "lit/decorators.js";
-var QtiStylesheet = class extends LitElement29 {
+var QtiStylesheet = class extends LitElement31 {
   constructor() {
     super(...arguments);
     this.styleElement = null;
@@ -5819,16 +6129,16 @@ QtiStylesheet = __decorateClass([
 ], QtiStylesheet);
 
 // src/lib/qti-components/qti-variable-declaration/qti-outcome-declaration/qti-outcome-declaration.ts
-import { consume as consume4 } from "@lit/context";
-import { css as css35, html as html49 } from "lit";
-import { customElement as customElement47, property as property36, state as state14 } from "lit/decorators.js";
+import { consume as consume5 } from "@lit/context";
+import { css as css36, html as html50 } from "lit";
+import { customElement as customElement47, property as property38, state as state15 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-variable-declaration/qti-variable-declaration.ts
-import { html as html48, LitElement as LitElement30 } from "lit";
+import { html as html49, LitElement as LitElement32 } from "lit";
 import { customElement as customElement46 } from "lit/decorators.js";
-var QtiVariableDeclaration = class extends LitElement30 {
+var QtiVariableDeclaration = class extends LitElement32 {
   render() {
-    return html48`<slot></slot>`;
+    return html49`<slot></slot>`;
   }
   defaultValues(variable) {
     const htmlValues = Array.from(this.querySelectorAll("qti-default-value > qti-value"));
@@ -5854,7 +6164,7 @@ var QtiOutcomeDeclaration = class extends QtiVariableDeclaration {
   }
   render() {
     const value = this.itemContext?.variables.find((v) => v.identifier === this.identifier)?.value;
-    return html49`${JSON.stringify(value, null, 2)}`;
+    return html50`${JSON.stringify(value, null, 2)}`;
   }
   get interpolationTable() {
     const table = this.querySelector("qti-interpolation-table");
@@ -5897,40 +6207,40 @@ var QtiOutcomeDeclaration = class extends QtiVariableDeclaration {
   }
 };
 QtiOutcomeDeclaration.styles = [
-  css35`
+  css36`
       :host {
         display: none;
       }
     `
 ];
 __decorateClass([
-  property36({ type: String, attribute: "base-type" })
+  property38({ type: String, attribute: "base-type" })
 ], QtiOutcomeDeclaration.prototype, "baseType", 2);
 __decorateClass([
-  property36({ type: String, attribute: "external-scored" })
+  property38({ type: String, attribute: "external-scored" })
 ], QtiOutcomeDeclaration.prototype, "externalScored", 2);
 __decorateClass([
-  property36({ type: String })
+  property38({ type: String })
 ], QtiOutcomeDeclaration.prototype, "identifier", 2);
 __decorateClass([
-  property36({ type: String })
+  property38({ type: String })
 ], QtiOutcomeDeclaration.prototype, "cardinality", 2);
 __decorateClass([
-  consume4({ context: itemContext, subscribe: true }),
-  state14()
+  consume5({ context: itemContext, subscribe: true }),
+  state15()
 ], QtiOutcomeDeclaration.prototype, "itemContext", 2);
 QtiOutcomeDeclaration = __decorateClass([
   customElement47("qti-outcome-declaration")
 ], QtiOutcomeDeclaration);
 
 // src/lib/qti-components/qti-variable-declaration/qti-response-declaration/qti-response-declaration.ts
-import { consume as consume5 } from "@lit/context";
-import { css as css36, html as html50 } from "lit";
-import { customElement as customElement48, property as property37, state as state15 } from "lit/decorators.js";
+import { consume as consume6 } from "@lit/context";
+import { css as css37, html as html51 } from "lit";
+import { customElement as customElement48, property as property39, state as state16 } from "lit/decorators.js";
 var QtiResponseDeclaration = class extends QtiVariableDeclaration {
   render() {
     const value = this.itemContext?.variables.find((v) => v.identifier === this.identifier)?.value;
-    return html50`${JSON.stringify(value, null, 2)}`;
+    return html51`${JSON.stringify(value, null, 2)}`;
   }
   connectedCallback() {
     super.connectedCallback();
@@ -5940,6 +6250,7 @@ var QtiResponseDeclaration = class extends QtiVariableDeclaration {
       correctResponse: this.correctResponse,
       cardinality: this.cardinality || "single",
       mapping: this.mapping,
+      areaMapping: this.areaMapping,
       value: null,
       type: "response",
       candidateResponse: null
@@ -5974,26 +6285,29 @@ var QtiResponseDeclaration = class extends QtiVariableDeclaration {
   get mapping() {
     return this.querySelector("qti-mapping");
   }
+  get areaMapping() {
+    return this.querySelector("qti-area-mapping");
+  }
 };
 QtiResponseDeclaration.styles = [
-  css36`
+  css37`
       :host {
         display: none;
       }
     `
 ];
 __decorateClass([
-  property37({ type: String, attribute: "base-type" })
+  property39({ type: String, attribute: "base-type" })
 ], QtiResponseDeclaration.prototype, "baseType", 2);
 __decorateClass([
-  property37({ type: String })
+  property39({ type: String })
 ], QtiResponseDeclaration.prototype, "identifier", 2);
 __decorateClass([
-  property37({ type: String })
+  property39({ type: String })
 ], QtiResponseDeclaration.prototype, "cardinality", 2);
 __decorateClass([
-  consume5({ context: itemContext, subscribe: true }),
-  state15()
+  consume6({ context: itemContext, subscribe: true }),
+  state16()
 ], QtiResponseDeclaration.prototype, "itemContext", 2);
 QtiResponseDeclaration = __decorateClass([
   customElement48("qti-response-declaration")
@@ -6064,7 +6378,9 @@ export {
   QtiLt,
   QtiLte,
   QtiMapResponse,
+  QtiMapResponsePoint,
   QtiMapping,
+  QtiAreaMapping,
   QtiMatch,
   QtiMember,
   QtiMultiple,
@@ -6085,4 +6401,4 @@ export {
   QtiOutcomeDeclaration,
   QtiResponseDeclaration
 };
-//# sourceMappingURL=chunk-E4TWZ2DL.js.map
+//# sourceMappingURL=chunk-5E4OEZCA.js.map