@citolab/qti-components 7.3.22 → 7.4.0

package/dist/chunks/{chunk-LF6SO3JU.js → chunk-LN74Z5QM.js}

@@ -1,41 +1,77 @@
 import {
-  liveQuery
-} from "./chunk-YWEWSQJR.js";
+  QtiFeedback,
+  convertNumberToUniversalFormat,
+  itemContext,
+  qtiContext,
+  removeDoubleSlashes,
+  testContext
+} from "./chunk-GUDRSXIP.js";
 import {
+  configContext,
   watch
-} from "./chunk-ELDMXTUQ.js";
+} from "./chunk-O5N4DCU6.js";
 import {
+  __decorateClass,
   qtiTransformItem
-} from "./chunk-WFUXZ4UT.js";
-import {
-  QtiConditionExpression
-} from "./chunk-FL72PF4D.js";
-import {
-  QtiExpression
-} from "./chunk-QCB6P7DH.js";
-import {
-  testContext
-} from "./chunk-CJADUWEC.js";
-import {
-  Interaction
-} from "./chunk-HFAUM56X.js";
-import {
-  itemContext
-} from "./chunk-NJNQOQUU.js";
-import {
-  configContext
-} from "./chunk-ERYHQVOT.js";
-import {
-  itemContextVariables
-} from "./chunk-JQ6HWGRY.js";
-import {
-  __decorateClass
-} from "./chunk-H2JE6IVU.js";
+} from "./chunk-JDY5GL7E.js";
 
 // src/lib/qti-components/qti-assessment-item/qti-assessment-item.ts
 import { provide } from "@lit/context";
 import { LitElement, html } from "lit";
 import { customElement, property } from "lit/decorators.js";
+
+// src/lib/decorators/live-query.ts
+function liveQuery(querySelector, _options) {
+  let observer;
+  return (proto, decoratedFnName) => {
+    const { connectedCallback, disconnectedCallback } = proto;
+    proto.connectedCallback = function() {
+      connectedCallback.call(this);
+      const callback = (mutationList) => {
+        const elementsToWatch = Array.from(this.querySelectorAll(querySelector)).concat(
+          Array.from(this.shadowRoot?.querySelectorAll(querySelector) || [])
+        );
+        for (const mutation of mutationList) {
+          const addedNodes = Array.from(mutation.addedNodes).map((e) => e);
+          const removedNodes = Array.from(mutation.addedNodes).map((e) => e);
+          if (mutation.type === "childList" && addedNodes.find((n) => elementsToWatch.includes(n))) {
+            this[decoratedFnName](addedNodes, removedNodes);
+          }
+        }
+      };
+      observer = new MutationObserver(callback);
+      observer.observe(this, { childList: true, subtree: true });
+      const elementsAdded = Array.from(this.querySelectorAll(querySelector)).concat(
+        Array.from(this.shadowRoot?.querySelectorAll(querySelector) || [])
+      );
+      this[decoratedFnName](Array.from(elementsAdded), []);
+    };
+    proto.disconnectedCallback = function() {
+      disconnectedCallback.call(this);
+      observer.disconnect();
+    };
+  };
+}
+
+// src/lib/exports/item.context.ts
+var itemContextVariables = [
+  {
+    identifier: "completionStatus",
+    cardinality: "single",
+    baseType: "string",
+    value: "unknown",
+    type: "outcome"
+  },
+  {
+    identifier: "numAttempts",
+    cardinality: "single",
+    baseType: "integer",
+    value: "0",
+    type: "response"
+  }
+];
+
+// src/lib/qti-components/qti-assessment-item/qti-assessment-item.ts
 var QtiAssessmentItem = class extends LitElement {
   constructor() {
     super(...arguments);
@@ -555,80 +591,6 @@ QtiCustomOperator = __decorateClass([
 // src/lib/qti-components/qti-feedback/qti-feedback-block/qti-feedback-block.ts
 import { css, html as html3 } from "lit";
 import { customElement as customElement5 } from "lit/decorators.js";
-
-// src/lib/qti-components/qti-feedback/qti-feedback.ts
-import { consume as consume2 } from "@lit/context";
-import { LitElement as LitElement5 } from "lit";
-import { property as property3, state as state2 } from "lit/decorators.js";
-
-// src/lib/qti-components/internal/utils.ts
-var decimalSeparator = () => {
-  return new Intl.NumberFormat().format(0.1).replace(/\d/g, "");
-};
-var convertNumberToUniversalFormat = (number) => {
-  if (typeof number === "string") {
-    return number;
-  }
-  const dSep = decimalSeparator();
-  if (dSep === ".") {
-    return number.toLocaleString();
-  } else {
-    return number.toString().replace(".", "").replace(dSep, ".");
-  }
-};
-function IsNullOrUndefined(value) {
-  return value === null || value === void 0;
-}
-function removeDoubleSlashes(str) {
-  const singleForwardSlashes = str.replace(/([^:]\/)\/+/g, "$1").replace(/\/\//g, "/").replace("http:/", "http://").replace("https:/", "https://");
-  return singleForwardSlashes;
-}
-
-// src/lib/qti-components/qti-feedback/qti-feedback.ts
-var QtiFeedback = class extends LitElement5 {
-  connectedCallback() {
-    super.connectedCallback();
-    this.dispatchEvent(
-      new CustomEvent("qti-register-feedback", {
-        bubbles: true,
-        composed: true,
-        detail: this
-      })
-    );
-  }
-  checkShowFeedback(outcomeIdentifier) {
-    const outcomeVariable = this._context.variables.find((v) => v.identifier === outcomeIdentifier) || null;
-    if (this.outcomeIdentifier !== outcomeIdentifier || !outcomeVariable) return;
-    let isFound = false;
-    if (Array.isArray(outcomeVariable.value)) {
-      isFound = outcomeVariable.value.includes(this.identifier);
-    } else {
-      isFound = !IsNullOrUndefined(this.identifier) && !IsNullOrUndefined(outcomeVariable?.value) && this.identifier === outcomeVariable.value || false;
-    }
-    this.showFeedback(isFound);
-  }
-  showFeedback(value) {
-    this.showStatus = value && this.showHide === "show" || !value && this.showHide === "hide" ? "on" : "off";
-  }
-};
-__decorateClass([
-  property3({ type: String, attribute: "show-hide" })
-], QtiFeedback.prototype, "showHide", 2);
-__decorateClass([
-  property3({ type: String, attribute: "outcome-identifier" })
-], QtiFeedback.prototype, "outcomeIdentifier", 2);
-__decorateClass([
-  property3({ type: String })
-], QtiFeedback.prototype, "identifier", 2);
-__decorateClass([
-  property3({ type: String, attribute: false })
-], QtiFeedback.prototype, "showStatus", 2);
-__decorateClass([
-  consume2({ context: itemContext, subscribe: true }),
-  state2()
-], QtiFeedback.prototype, "_context", 2);
-
-// src/lib/qti-components/qti-feedback/qti-feedback-block/qti-feedback-block.ts
 var QtiFeedbackBlock = class extends QtiFeedback {
   render() {
     return html3` <slot part="feedback" class="feedback ${this.showStatus}"></slot> `;
@@ -679,97 +641,10 @@ QtiFeedbackInline = __decorateClass([
   customElement6("qti-feedback-inline")
 ], QtiFeedbackInline);
 
-// src/lib/qti-components/qti-feedback/qti-modal-feedback/qti-modal-feedback.ts
-import { css as css3, html as html5 } from "lit";
-import { customElement as customElement7 } from "lit/decorators.js";
-var QtiModalFeedback = class extends QtiFeedback {
-  render() {
-    return html5`
-      <dialog class="qti-dialog" part="feedback" ?open="${this.showStatus === "on"}">
-        <slot></slot>
-        <div style="margin-top: var(--qti-gap-size); text-align: center;">
-          <button class="button close-button" @click="${this.closeFeedback}">Close</button>
-        </div>
-      </dialog>
-    `;
-  }
-  openFeedback() {
-    const dialog = this.shadowRoot?.querySelector("dialog");
-    if (dialog && !dialog.open) {
-      dialog.showModal();
-    }
-  }
-  closeFeedback() {
-    const dialog = this.shadowRoot?.querySelector("dialog");
-    if (dialog && dialog.open) {
-      dialog.close();
-      this.showStatus = "off";
-    }
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    if (this.showStatus === "on") {
-      this.openFeedback();
-    }
-  }
-  updated(changedProperties) {
-    if (changedProperties.has("showStatus")) {
-      if (this.showStatus === "on") {
-        this.openFeedback();
-      } else {
-        this.closeFeedback();
-      }
-    }
-  }
-};
-QtiModalFeedback.styles = css3`
-    .qti-dialog {
-      background: var(--qti-bg);
-      border: var(--qti-border-thickness) var(--qti-border-style) var(--qti-border-color);
-      border-radius: var(--qti-border-radius);
-      padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);
-      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-      position: fixed;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-      z-index: 1000;
-      width: auto;
-      max-width: 90%;
-    }
-
-    .button {
-      border-radius: var(--qti-border-radius);
-      padding: var(--qti-padding-vertical) var(--qti-padding-horizontal);
-      background-color: var(--qti-bg-active);
-      border: var(--qti-border-active);
-      cursor: pointer;
-      position: relative;
-      display: inline-block;
-    }
-
-    .button:hover {
-      background-color: var(--qti-hover-bg);
-    }
-
-    .button:disabled {
-      background-color: var(--qti-disabled-bg);
-      color: var(--qti-disabled-color);
-      cursor: not-allowed;
-    }
-
-    .button:focus {
-      outline: var(--qti-focus-border-width) solid var(--qti-focus-color);
-    }
-  `;
-QtiModalFeedback = __decorateClass([
-  customElement7("qti-modal-feedback")
-], QtiModalFeedback);
-
 // src/lib/qti-components/qti-interaction/qti-associable-hotspot.ts
-import { LitElement as LitElement6, css as css4, html as html6 } from "lit";
-import { customElement as customElement8 } from "lit/decorators.js";
-var QtiAssociableHotspot = class extends LitElement6 {
+import { LitElement as LitElement5, css as css3, html as html5 } from "lit";
+import { customElement as customElement7 } from "lit/decorators.js";
+var QtiAssociableHotspot = class extends LitElement5 {
   connectedCallback() {
     super.connectedCallback();
     this.dispatchEvent(
@@ -781,10 +656,10 @@ var QtiAssociableHotspot = class extends LitElement6 {
     );
   }
   render() {
-    return html6` <slot name="drags"></slot> `;
+    return html5` <slot name="drags"></slot> `;
   }
 };
-QtiAssociableHotspot.styles = css4`
+QtiAssociableHotspot.styles = css3`
     :host {
       display: flex;
       user-select: none;
@@ -792,15 +667,15 @@ QtiAssociableHotspot.styles = css4`
     }
   `;
 QtiAssociableHotspot = __decorateClass([
-  customElement8("qti-associable-hotspot")
+  customElement7("qti-associable-hotspot")
 ], QtiAssociableHotspot);
 
 // src/lib/qti-components/qti-interaction/qti-associate-interaction/qti-associate-interaction.ts
-import { html as html7 } from "lit";
-import { customElement as customElement9, state as state3 } from "lit/decorators.js";
+import { html as html6 } from "lit";
+import { customElement as customElement8, 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";
+import { property as property3 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/internal/drag-drop/flippables-mixin.ts
 var FlippablesMixin = (superClass, _droppablesSel, _draggablesSel) => {
@@ -1575,13 +1450,13 @@ var DragDropInteractionMixin = (superClass, draggablesSelector, droppablesSelect
     }
   }
   __decorateClass([
-    property4({ attribute: false, type: Object })
+    property3({ attribute: false, type: Object })
   ], DragDropInteractionElement.prototype, "configuration", 2);
   __decorateClass([
-    property4({ type: Number, reflect: true, attribute: "min-associations" })
+    property3({ type: Number, reflect: true, attribute: "min-associations" })
   ], DragDropInteractionElement.prototype, "minAssociations", 2);
   __decorateClass([
-    property4({ type: Number, reflect: true, attribute: "max-associations" })
+    property3({ type: Number, reflect: true, attribute: "max-associations" })
   ], DragDropInteractionElement.prototype, "maxAssociations", 2);
   __decorateClass([
     liveQuery(dragContainersSelector)
@@ -1596,8 +1471,8 @@ var DragDropInteractionMixin = (superClass, draggablesSelector, droppablesSelect
 };
 
 // src/lib/qti-components/qti-interaction/qti-associate-interaction/qti-associate-interaction.styles.ts
-import { css as css5 } from "lit";
-var qti_associate_interaction_styles_default = css5`
+import { css as css4 } from "lit";
+var qti_associate_interaction_styles_default = css4`
   :host {
     display: block; /* necessary to calculate scaling position */
   }
@@ -1624,6 +1499,193 @@ var qti_associate_interaction_styles_default = css5`
   }
 `;
 
+// src/lib/exports/interaction.ts
+import { property as property4, state as state2 } from "lit/decorators.js";
+import { LitElement as LitElement6 } from "lit";
+import { consume as consume2 } from "@lit/context";
+var Interaction = class extends LitElement6 {
+  constructor() {
+    super();
+    this.disabled = false;
+    this.readonly = false;
+    this._internals = this.attachInternals();
+  }
+  static {
+    this.formAssociated = true;
+  }
+  get internals() {
+    return this._internals;
+  }
+  get isFullCorrectResponse() {
+    return this._isFullCorrectResponse;
+  }
+  set isFullCorrectResponse(val) {
+    this._isFullCorrectResponse = val;
+    if (val) {
+      this.disabled = true;
+      this.setAttribute("response-identifier", this.responseIdentifier + "_cr");
+    }
+  }
+  get correctResponse() {
+    return this._correctResponse;
+  }
+  set correctResponse(val) {
+    this._correctResponse = val;
+  }
+  get correctness() {
+    const responseVariable = this.responseVariable;
+    if (!responseVariable || responseVariable.correctResponse === null) return null;
+    return responseVariable.correctResponse === responseVariable.value ? "correct" /* Correct */ : "incorrect" /* Incorrect */;
+  }
+  get isInline() {
+    return false;
+  }
+  get responseVariable() {
+    const responseVariables = this._context.variables.filter((v) => v.type === "response");
+    const responseIdentifier = this.getAttribute("response-identifier");
+    return responseVariables.find((v) => v.identifier === responseIdentifier);
+  }
+  toggleCorrectResponse(show) {
+    const correctResponseMode = this?.configContext?.correctResponseMode || "internal";
+    if (correctResponseMode === "full") {
+      this.toggleFullCorrectResponse(show);
+    } else {
+      this.toggleInternalCorrectResponse(show);
+    }
+  }
+  async toggleFullCorrectResponse(show) {
+    const nextSibling = this.nextSibling;
+    const nextSiblingIsFullCorrectResponse = nextSibling instanceof HTMLDivElement && nextSibling?.classList.contains("full-correct-response");
+    const responseVariable = this.responseVariable;
+    if (!responseVariable) {
+      return;
+    }
+    if (!show || this.correctness === "correct" /* Correct */) {
+      if (!nextSiblingIsFullCorrectResponse) {
+        return;
+      }
+      this.parentElement?.removeChild(nextSibling);
+    }
+    if (nextSiblingIsFullCorrectResponse) {
+      return;
+    }
+    if (this.correctness === "correct" /* Correct */) {
+      return;
+    }
+    const clone = this.cloneNode(true);
+    const containerDiv = document.createElement("div");
+    containerDiv.classList.add("full-correct-response");
+    if (this.isInline) {
+      containerDiv.classList.add("full-correct-response-inline");
+    } else {
+      containerDiv.classList.add("full-correct-response-block");
+    }
+    containerDiv.role = "full-correct-response";
+    containerDiv.appendChild(clone);
+    clone.isFullCorrectResponse = true;
+    this.parentElement?.insertBefore(containerDiv, this.nextSibling);
+    await clone.updateComplete;
+    clone.response = Array.isArray(responseVariable.correctResponse) ? [...responseVariable.correctResponse] : responseVariable.correctResponse;
+  }
+  toggleInternalCorrectResponse(show) {
+    const responseVariable = this.responseVariable;
+    this.correctResponse = show ? responseVariable?.correctResponse : responseVariable?.cardinality === "single" ? "" : [];
+  }
+  toggleCandidateCorrection(show) {
+    const responseVariable = this.responseVariable;
+    if (!responseVariable) return;
+    this._internals.states.delete("candidate-correct");
+    this._internals.states.delete("candidate-partially-correct");
+    this._internals.states.delete("candidate-incorrect");
+    if (!show) {
+      return;
+    }
+    if (this.correctness === "correct" /* Correct */) {
+      this._internals.states.add("candidate-correct");
+    }
+    if (this.correctness === "partially-correct" /* PartiallyCorrect */) {
+      this._internals.states.add("candidate-partially-correct");
+    }
+    if (this.correctness === "incorrect" /* Incorrect */) {
+      this._internals.states.add("candidate-incorrect");
+    }
+  }
+  get value() {
+    return JSON.stringify(this.response);
+  }
+  set value(val) {
+    this.response = val ? JSON.parse(val) : null;
+  }
+  reportValidity() {
+    return this._internals.reportValidity();
+  }
+  reset() {
+    this.response = null;
+  }
+  // attributeChangedCallback(name: string, _old: string | null, value: string | null): void {
+  //   super.attributeChangedCallback(name, _old, value);
+  //   // changing attributes in lit is not a thing, they are defined in the QTI XML and will never change
+  //   // except in storybook where we can change the value of the attribute
+  //   // this can make the internal state out of sync with the attribute
+  //   // so we reset the value to null to force the internal state to be reset
+  //   const attributeNamesToExclude = ['style', 'class'];
+  //   if (!attributeNamesToExclude.includes(name)) {
+  //     this.reset();
+  //   }
+  // }
+  connectedCallback() {
+    super.connectedCallback();
+    if (this.isFullCorrectResponse) {
+      return;
+    }
+    this.dispatchEvent(
+      new CustomEvent("qti-register-interaction", {
+        bubbles: true,
+        composed: true,
+        cancelable: false,
+        detail: {
+          interactionElement: this,
+          responseIdentifier: this.responseIdentifier
+        }
+      })
+    );
+  }
+  saveResponse(value) {
+    this.dispatchEvent(
+      new CustomEvent("qti-interaction-response", {
+        bubbles: true,
+        composed: true,
+        cancelable: false,
+        detail: {
+          responseIdentifier: this.responseIdentifier,
+          response: Array.isArray(value) ? [...value] : value
+        }
+      })
+    );
+  }
+};
+__decorateClass([
+  consume2({ context: itemContext, subscribe: true })
+], Interaction.prototype, "_context", 2);
+__decorateClass([
+  consume2({ context: configContext, subscribe: true })
+], Interaction.prototype, "configContext", 2);
+__decorateClass([
+  property4({ type: String, attribute: "response-identifier" })
+], Interaction.prototype, "responseIdentifier", 2);
+__decorateClass([
+  property4({ reflect: true, type: Boolean })
+], Interaction.prototype, "disabled", 2);
+__decorateClass([
+  property4({ reflect: true, type: Boolean })
+], Interaction.prototype, "readonly", 2);
+__decorateClass([
+  state2()
+], Interaction.prototype, "_isFullCorrectResponse", 2);
+__decorateClass([
+  state2()
+], Interaction.prototype, "_correctResponse", 2);
+
 // src/lib/qti-components/qti-interaction/qti-associate-interaction/qti-associate-interaction.ts
 var QtiAssociateInteraction = class extends DragDropInteractionMixin(
   Interaction,
@@ -1642,11 +1704,11 @@ var QtiAssociateInteraction = class extends DragDropInteractionMixin(
     this._childrenMap.push(choice);
   }
   render() {
-    return html7` <slot name="prompt"></slot>
+    return html6` <slot name="prompt"></slot>
       <slot name="qti-simple-associable-choice"></slot>
       <div part="drop-container">
         ${this._childrenMap.length > 0 && Array.from(Array(Math.ceil(this._childrenMap.length / 2)).keys()).map(
-      (_, index) => html7`<div part="associables-container">
+      (_, index) => html6`<div part="associables-container">
               <div name="left${index}" part="drop-list" class="dl" identifier="droplist${index}_left"></div>
               <div name="right${index}" part="drop-list" class="dl" identifier="droplist${index}_right"></div>
             </div>`
@@ -1665,12 +1727,12 @@ __decorateClass([
   state3()
 ], QtiAssociateInteraction.prototype, "_childrenMap", 2);
 QtiAssociateInteraction = __decorateClass([
-  customElement9("qti-associate-interaction")
+  customElement8("qti-associate-interaction")
 ], QtiAssociateInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-choice-interaction/qti-choice-interaction.ts
-import { html as html8 } from "lit";
-import { customElement as customElement10, property as property7 } from "lit/decorators.js";
+import { html as html7 } from "lit";
+import { customElement as customElement9, property as property7 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/internal/choices/choices.mixin.ts
 import { property as property5, query, state as state4 } from "lit/decorators.js";
@@ -1988,8 +2050,8 @@ var VocabularyMixin = (superClass, _selector) => {
 };
 
 // src/lib/qti-components/qti-interaction/qti-choice-interaction/qti-choice-interaction.styles.ts
-import { css as css6 } from "lit";
-var qti_choice_interaction_styles_default = css6`
+import { css as css5 } from "lit";
+var qti_choice_interaction_styles_default = css5`
   :host {
     display: block;
   }
@@ -2072,7 +2134,7 @@ var QtiChoiceInteraction = class extends VocabularyMixin(ChoicesMixin(Interactio
     this.style.setProperty("--item-count", choices.length.toString());
   }
   render() {
-    return html8`
+    return html7`
       <slot part="prompt" name="prompt"></slot>
       <slot part="slot" @slotchange=${this._handleSlotChange}></slot>
       <div part="message" role="alert" id="validation-message"></div>
@@ -2084,12 +2146,12 @@ __decorateClass([
   property7({ type: String })
 ], QtiChoiceInteraction.prototype, "orientation", 2);
 QtiChoiceInteraction = __decorateClass([
-  customElement10("qti-choice-interaction")
+  customElement9("qti-choice-interaction")
 ], QtiChoiceInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-custom-interaction/qti-custom-interaction.ts
-import { html as html9 } from "lit";
-import { customElement as customElement11, property as property8, state as state5 } from "lit/decorators.js";
+import { html as html8 } from "lit";
+import { customElement as customElement10, property as property8, state as state5 } from "lit/decorators.js";
 var QtiCustomInteraction = class extends Interaction {
   constructor() {
     super();
@@ -2265,7 +2327,7 @@ var QtiCustomInteraction = class extends Interaction {
     super.disconnectedCallback();
   }
   render() {
-    return html9`<iframe
+    return html8`<iframe
         width=${this.getAttribute("width")}
         height=${this.getAttribute("height")}
         frameborder="0"
@@ -2273,7 +2335,7 @@ var QtiCustomInteraction = class extends Interaction {
         id="pciContainer"
       >
       </iframe>
-      ${this._errorMessage && html9`<div style="color:red">
+      ${this._errorMessage && html8`<div style="color:red">
         <h1>Error</h1>
         ${this._errorMessage}
       </div>`}`;
@@ -2295,12 +2357,12 @@ __decorateClass([
   state5()
 ], QtiCustomInteraction.prototype, "_errorMessage", 2);
 QtiCustomInteraction = __decorateClass([
-  customElement11("qti-custom-interaction")
+  customElement10("qti-custom-interaction")
 ], QtiCustomInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-end-attempt-interaction/qti-end-attempt-interaction.ts
-import { html as html10, LitElement as LitElement7 } from "lit";
-import { customElement as customElement12, property as property9 } from "lit/decorators.js";
+import { html as html9, LitElement as LitElement7 } from "lit";
+import { customElement as customElement11, property as property9 } from "lit/decorators.js";
 var QtiEndAttemptInteraction = class extends LitElement7 {
   constructor() {
     super(...arguments);
@@ -2309,7 +2371,7 @@ var QtiEndAttemptInteraction = class extends LitElement7 {
     this.title = "end attempt";
   }
   render() {
-    return html10`<button ?disabled=${this.disabled} part="button" @click=${this.endAttempt}>${this.title}</button>`;
+    return html9`<button ?disabled=${this.disabled} part="button" @click=${this.endAttempt}>${this.title}</button>`;
   }
   endAttempt(_) {
     this.dispatchEvent(
@@ -2334,17 +2396,17 @@ __decorateClass([
   property9({ type: String })
 ], QtiEndAttemptInteraction.prototype, "title", 2);
 QtiEndAttemptInteraction = __decorateClass([
-  customElement12("qti-end-attempt-interaction")
+  customElement11("qti-end-attempt-interaction")
 ], QtiEndAttemptInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-extended-text-interaction/qti-extended-text-interaction.ts
-import { html as html11 } from "lit";
+import { html as html10 } from "lit";
 import { ifDefined as ifDefined2 } from "lit/directives/if-defined.js";
-import { customElement as customElement13, property as property10, state as state6 } from "lit/decorators.js";
+import { customElement as customElement12, property as property10, state as state6 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/qti-extended-text-interaction/qti-extended-text-interaction.styles.ts
-import { css as css7 } from "lit";
-var qti_extended_text_interaction_styles_default = css7`
+import { css as css6 } from "lit";
+var qti_extended_text_interaction_styles_default = css6`
   /* PK: display host as block, else design will be collapsed */
   :host {
     display: block;
@@ -2420,7 +2482,7 @@ var QtiExtendedTextInteraction = class extends Interaction {
     return isValid;
   }
   render() {
-    return html11`<slot name="prompt"></slot
+    return html10`<slot name="prompt"></slot
       ><textarea
         part="textarea"
         name="${this.responseIdentifier}"
@@ -2482,12 +2544,12 @@ __decorateClass([
   watch("response", { waitUntilFirstUpdate: true })
 ], QtiExtendedTextInteraction.prototype, "_handleResponseChange", 2);
 QtiExtendedTextInteraction = __decorateClass([
-  customElement13("qti-extended-text-interaction")
+  customElement12("qti-extended-text-interaction")
 ], QtiExtendedTextInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-gap-img.ts
-import { css as css8, LitElement as LitElement8 } from "lit";
-import { customElement as customElement14, property as property11 } from "lit/decorators.js";
+import { css as css7, LitElement as LitElement8 } from "lit";
+import { customElement as customElement13, property as property11 } from "lit/decorators.js";
 var QtiGapImg = class extends LitElement8 {
   constructor() {
     super(...arguments);
@@ -2497,7 +2559,7 @@ var QtiGapImg = class extends LitElement8 {
     this.setAttribute("slot", "drags");
   }
 };
-QtiGapImg.styles = css8`
+QtiGapImg.styles = css7`
     :host {
       display: flex;
       user-select: none;
@@ -2507,16 +2569,16 @@ __decorateClass([
   property11({ type: Number, reflect: true })
 ], QtiGapImg.prototype, "tabindex", 2);
 QtiGapImg = __decorateClass([
-  customElement14("qti-gap-img")
+  customElement13("qti-gap-img")
 ], QtiGapImg);
 
 // src/lib/qti-components/qti-interaction/qti-gap-match-interaction/qti-gap-match-interaction.ts
-import { html as html12 } from "lit";
-import { customElement as customElement15 } from "lit/decorators.js";
+import { html as html11 } from "lit";
+import { customElement as customElement14 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/qti-gap-match-interaction/qti-gap-match-interaction.styles.ts
-import { css as css9 } from "lit";
-var qti_gap_match_interaction_styles_default = css9`
+import { css as css8 } from "lit";
+var qti_gap_match_interaction_styles_default = css8`
   :host {
     display: flex;
     align-items: flex-start;
@@ -2560,7 +2622,7 @@ var QtiGapMatchInteraction = class extends DragDropInteractionMixin(
   `slot[part='drags']`
 ) {
   render() {
-    return html12`<slot name="prompt"> </slot>
+    return html11`<slot name="prompt"> </slot>
       <slot part="drags" name="drags"></slot>
       <slot part="drops"></slot>
       <div role="alert" part="message" id="validation-message"></div>`;
@@ -2606,15 +2668,15 @@ var QtiGapMatchInteraction = class extends DragDropInteractionMixin(
 };
 QtiGapMatchInteraction.styles = qti_gap_match_interaction_styles_default;
 QtiGapMatchInteraction = __decorateClass([
-  customElement15("qti-gap-match-interaction")
+  customElement14("qti-gap-match-interaction")
 ], QtiGapMatchInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-gap-text.ts
-import { css as css10, html as html14, LitElement as LitElement9 } from "lit";
-import { customElement as customElement16, property as property13 } from "lit/decorators.js";
+import { css as css9, html as html13, LitElement as LitElement9 } from "lit";
+import { customElement as customElement15, property as property13 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/internal/active-element/active-element.mixin.ts
-import { html as html13 } from "lit";
+import { html as html12 } from "lit";
 import { property as property12 } from "lit/decorators.js";
 var ariaBooleanConverter = {
   toAttribute: (value) => value ? "true" : "false",
@@ -2681,7 +2743,7 @@ function ActiveElementMixin(Base, type) {
       );
     }
     render() {
-      return html13`<slot></slot>`;
+      return html12`<slot></slot>`;
     }
   }
   __decorateClass([
@@ -2723,10 +2785,10 @@ var QtiGapText = class extends ActiveElementMixin(LitElement9, "qti-gap-text") {
     this.setAttribute("slot", "drags");
   }
   render() {
-    return html14`<slot></slot>`;
+    return html13`<slot></slot>`;
   }
 };
-QtiGapText.styles = css10`
+QtiGapText.styles = css9`
     :host {
       display: inline-flex;
       user-select: none;
@@ -2736,22 +2798,22 @@ __decorateClass([
   property13({ type: Number, reflect: true })
 ], QtiGapText.prototype, "tabindex", 2);
 QtiGapText = __decorateClass([
-  customElement16("qti-gap-text")
+  customElement15("qti-gap-text")
 ], QtiGapText);
 
 // src/lib/qti-components/qti-interaction/qti-gap.ts
-import { css as css11, html as html15, LitElement as LitElement10 } from "lit";
-import { customElement as customElement17, property as property14 } from "lit/decorators.js";
+import { css as css10, html as html14, LitElement as LitElement10 } from "lit";
+import { customElement as customElement16, property as property14 } from "lit/decorators.js";
 var QtiGap = class extends LitElement10 {
   constructor() {
     super(...arguments);
     this.tabindex = 0;
   }
   render() {
-    return html15` <slot name="drags"></slot>`;
+    return html14` <slot name="drags"></slot>`;
   }
 };
-QtiGap.styles = css11`
+QtiGap.styles = css10`
     :host {
       display: flex;
       user-select: none;
@@ -2761,12 +2823,12 @@ __decorateClass([
   property14({ type: Number, reflect: true })
 ], QtiGap.prototype, "tabindex", 2);
 QtiGap = __decorateClass([
-  customElement17("qti-gap")
+  customElement16("qti-gap")
 ], QtiGap);
 
 // src/lib/qti-components/qti-interaction/qti-graphic-associate-interaction/qti-graphic-associate-interaction.ts
-import { html as html16, svg } from "lit";
-import { customElement as customElement18, queryAssignedElements, state as state7 } from "lit/decorators.js";
+import { html as html15, svg } from "lit";
+import { customElement as customElement17, queryAssignedElements, state as state7 } from "lit/decorators.js";
 import { ifDefined as ifDefined3 } from "lit/directives/if-defined.js";
 import { repeat } from "lit/directives/repeat.js";
 
@@ -2865,8 +2927,8 @@ function positionShapes(shape, coordsNumber, img, hotspot) {
 }
 
 // src/lib/qti-components/qti-interaction/qti-graphic-associate-interaction/qti-graphic-associate-interaction.styles.ts
-import { css as css12 } from "lit";
-var qti_graphic_associate_interaction_styles_default = css12`
+import { css as css11 } from "lit";
+var qti_graphic_associate_interaction_styles_default = css11`
   slot:not([name='prompt']) {
     // position: relative; /* qti-hotspot-choice relative to the slot */
     display: block;
@@ -2929,7 +2991,7 @@ var QtiGraphicAssociateInteraction = class extends Interaction {
     this._correctLines = correctResponses;
   }
   render() {
-    return html16`<slot name="prompt"></slot>
+    return html15`<slot name="prompt"></slot>
       <line-container>
         <svg
           width=${ifDefined3(this.grImage[0]?.width)}
@@ -3052,16 +3114,16 @@ __decorateClass([
   state7()
 ], QtiGraphicAssociateInteraction.prototype, "_response", 2);
 QtiGraphicAssociateInteraction = __decorateClass([
-  customElement18("qti-graphic-associate-interaction")
+  customElement17("qti-graphic-associate-interaction")
 ], QtiGraphicAssociateInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-graphic-gap-match-interaction/qti-graphic-gap-match-interaction.ts
-import { html as html17 } from "lit";
-import { customElement as customElement19 } from "lit/decorators.js";
+import { html as html16 } from "lit";
+import { customElement as customElement18 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/qti-graphic-gap-match-interaction/qti-graphic-gap-match-interaction.styles.ts
-import { css as css13 } from "lit";
-var qti_graphic_gap_match_interaction_styles_default = css13`
+import { css as css12 } from "lit";
+var qti_graphic_gap_match_interaction_styles_default = css12`
   :host {
     display: flex;
     align-items: flex-start;
@@ -3125,7 +3187,7 @@ var QtiGraphicGapMatchInteraction = class extends DragDropInteractionMixin(
   `slot[part='drags']`
 ) {
   render() {
-    return html17` <slot name="prompt"></slot>
+    return html16` <slot name="prompt"></slot>
       <slot part="image"></slot>
       <slot part="drags" name="drags" class="hover-border"></slot>
       <div role="alert" part="message" id="validation-message"></div>`;
@@ -3168,16 +3230,16 @@ var QtiGraphicGapMatchInteraction = class extends DragDropInteractionMixin(
 };
 QtiGraphicGapMatchInteraction.styles = qti_graphic_gap_match_interaction_styles_default;
 QtiGraphicGapMatchInteraction = __decorateClass([
-  customElement19("qti-graphic-gap-match-interaction")
+  customElement18("qti-graphic-gap-match-interaction")
 ], QtiGraphicGapMatchInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-graphic-order-interaction/qti-graphic-order-interaction.ts
-import { html as html18 } from "lit";
-import { customElement as customElement20 } from "lit/decorators.js";
+import { html as html17 } from "lit";
+import { customElement as customElement19 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/qti-graphic-order-interaction/qti-graphic-order-interaction.styles.ts
-import { css as css14 } from "lit";
-var qti_graphic_order_interaction_styles_default = css14`
+import { css as css13 } from "lit";
+var qti_graphic_order_interaction_styles_default = css13`
   slot:not([name='prompt']) {
     position: relative; /* qti-hotspot-choice relative to the slot */
     display: block;
@@ -3197,7 +3259,7 @@ var QtiGraphicOrderInteraction = class extends ChoicesMixin(Interaction, "qti-ho
     this._choiceElements = [];
   }
   render() {
-    return html18`
+    return html17`
       <slot name="prompt"></slot>
       <slot></slot>
       <div role="alert" part="message" id="validation-message"></div>
@@ -3266,15 +3328,15 @@ var QtiGraphicOrderInteraction = class extends ChoicesMixin(Interaction, "qti-ho
 };
 QtiGraphicOrderInteraction.styles = qti_graphic_order_interaction_styles_default;
 QtiGraphicOrderInteraction = __decorateClass([
-  customElement20("qti-graphic-order-interaction")
+  customElement19("qti-graphic-order-interaction")
 ], QtiGraphicOrderInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-hotspot-choice.ts
-import { css as css15, LitElement as LitElement11 } from "lit";
-import { customElement as customElement21, property as property15 } from "lit/decorators.js";
+import { css as css14, LitElement as LitElement11 } from "lit";
+import { customElement as customElement20, property as property15 } from "lit/decorators.js";
 var QtiHotspotChoice = class extends ActiveElementMixin(LitElement11, "qti-hotspot-choice") {
 };
-QtiHotspotChoice.styles = css15`
+QtiHotspotChoice.styles = css14`
     :host {
       display: flex;
       user-select: none;
@@ -3288,16 +3350,16 @@ __decorateClass([
   property15({ attribute: "aria-ordercorrectvalue", type: Number, reflect: true })
 ], QtiHotspotChoice.prototype, "orderCorrect", 2);
 QtiHotspotChoice = __decorateClass([
-  customElement21("qti-hotspot-choice")
+  customElement20("qti-hotspot-choice")
 ], QtiHotspotChoice);
 
 // src/lib/qti-components/qti-interaction/qti-hotspot-interaction/qti-hotspot-interaction.ts
-import { html as html19 } from "lit";
-import { customElement as customElement22 } from "lit/decorators.js";
+import { html as html18 } from "lit";
+import { customElement as customElement21 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/qti-hotspot-interaction/qti-hotspot-interaction.styles.ts
-import { css as css16 } from "lit";
-var qti_hotspot_interaction_styles_default = css16`
+import { css as css15 } from "lit";
+var qti_hotspot_interaction_styles_default = css15`
   slot:not([name='prompt']) {
     position: relative; /* qti-hotspot-choice relative to the slot */
     display: block;
@@ -3314,7 +3376,7 @@ var qti_hotspot_interaction_styles_default = css16`
 // src/lib/qti-components/qti-interaction/qti-hotspot-interaction/qti-hotspot-interaction.ts
 var QtiHotspotInteraction = class extends ChoicesMixin(Interaction, "qti-hotspot-choice") {
   render() {
-    return html19`
+    return html18`
       <slot name="prompt"></slot>
       <slot></slot>
     `;
@@ -3338,17 +3400,17 @@ var QtiHotspotInteraction = class extends ChoicesMixin(Interaction, "qti-hotspot
 };
 QtiHotspotInteraction.styles = qti_hotspot_interaction_styles_default;
 QtiHotspotInteraction = __decorateClass([
-  customElement22("qti-hotspot-interaction")
+  customElement21("qti-hotspot-interaction")
 ], QtiHotspotInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-hottext-interaction/qti-hottext-interaction.ts
-import { html as html20 } from "lit";
-import { customElement as customElement23, property as property16 } from "lit/decorators.js";
+import { html as html19 } from "lit";
+import { customElement as customElement22, property as property16 } from "lit/decorators.js";
 var QtiHottextInteraction = class extends ChoicesMixin(Interaction, "qti-hottext") {
   constructor() {
     super(...arguments);
     this.class = "";
-    this.render = () => html20`<slot></slot>
+    this.render = () => html19`<slot></slot>
       <div part="message" role="alert" id="validation-message"></div>`;
   }
   // NOTE: there is no way to get the variant with radiobuttons or checkboxes
@@ -3385,31 +3447,31 @@ __decorateClass([
   property16({ type: String, reflect: true })
 ], QtiHottextInteraction.prototype, "class", 2);
 QtiHottextInteraction = __decorateClass([
-  customElement23("qti-hottext-interaction")
+  customElement22("qti-hottext-interaction")
 ], QtiHottextInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-hottext.ts
-import { css as css17, html as html21, LitElement as LitElement12 } from "lit";
-import { customElement as customElement24 } from "lit/decorators.js";
+import { css as css16, html as html20, LitElement as LitElement12 } from "lit";
+import { customElement as customElement23 } from "lit/decorators.js";
 var QtiHottext = class extends ActiveElementMixin(LitElement12, "qti-hottext") {
   render() {
-    return html21`<div part="ch"><div part="cha"></div></div>
+    return html20`<div part="ch"><div part="cha"></div></div>
       <slot></slot> `;
   }
 };
-QtiHottext.styles = css17`
+QtiHottext.styles = css16`
     :host {
       display: flex;
       user-select: none;
     }
   `;
 QtiHottext = __decorateClass([
-  customElement24("qti-hottext")
+  customElement23("qti-hottext")
 ], QtiHottext);
 
 // src/lib/qti-components/qti-interaction/qti-inline-choice-interaction/qti-inline-choice-interaction.ts
-import { css as css18, html as html22 } from "lit";
-import { customElement as customElement25, property as property17, state as state8 } from "lit/decorators.js";
+import { css as css17, html as html21 } from "lit";
+import { customElement as customElement24, property as property17, state as state8 } from "lit/decorators.js";
 import { unsafeHTML } from "lit/directives/unsafe-html.js";
 import { consume as consume4 } from "@lit/context";
 var QtiInlineChoiceInteraction = class extends Interaction {
@@ -3424,7 +3486,7 @@ var QtiInlineChoiceInteraction = class extends Interaction {
   }
   static get styles() {
     return [
-      css18`
+      css17`
         :host {
           display: inline-block;
         }
@@ -3450,10 +3512,10 @@ var QtiInlineChoiceInteraction = class extends Interaction {
     ];
   }
   render() {
-    return html22`
+    return html21`
       <select part="select" @change="${this.choiceSelected}" ?disabled="${this.disabled}" ?readonly="${this.readonly}">
         ${this.options.map(
-      (option) => html22`
+      (option) => html21`
             <option value="${option.value}" ?selected="${option.selected}">${unsafeHTML(option.textContent)}</option>
           `
     )}
@@ -3549,16 +3611,16 @@ __decorateClass([
   property17({ attribute: false })
 ], QtiInlineChoiceInteraction.prototype, "configContext", 2);
 QtiInlineChoiceInteraction = __decorateClass([
-  customElement25("qti-inline-choice-interaction")
+  customElement24("qti-inline-choice-interaction")
 ], QtiInlineChoiceInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-inline-choice.ts
-import { css as css19, html as html23, LitElement as LitElement13 } from "lit";
-import { customElement as customElement26, property as property18 } from "lit/decorators.js";
+import { css as css18, html as html22, LitElement as LitElement13 } from "lit";
+import { customElement as customElement25, property as property18 } from "lit/decorators.js";
 var QtiInlineChoice = class extends LitElement13 {
   static get styles() {
     return [
-      css19`
+      css18`
         :host {
           display: block;
           cursor: pointer;
@@ -3581,7 +3643,7 @@ var QtiInlineChoice = class extends LitElement13 {
     this.removeEventListener("click", this._onSelectInlineChoice);
   }
   render() {
-    return html23` <slot></slot> `;
+    return html22` <slot></slot> `;
   }
   _onSelectInlineChoice() {
     this.dispatchEvent(
@@ -3598,12 +3660,12 @@ __decorateClass([
   property18({ type: String })
 ], QtiInlineChoice.prototype, "identifier", 2);
 QtiInlineChoice = __decorateClass([
-  customElement26("qti-inline-choice")
+  customElement25("qti-inline-choice")
 ], QtiInlineChoice);
 
 // 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";
+import { css as css19, html as html23, LitElement as LitElement14 } from "lit";
+import { customElement as customElement26, property as property19 } from "lit/decorators.js";
 var QtiSimpleAssociableChoice = class extends ActiveElementMixin(LitElement14, "qti-simple-associable-choice") {
   constructor() {
     super(...arguments);
@@ -3624,13 +3686,13 @@ var QtiSimpleAssociableChoice = class extends ActiveElementMixin(LitElement14, "
   // So we have a slot for whenever another qti-simple-associable-choice is dropped in here.
   // And we have slot for content like in this associate interaction
   render() {
-    return html24`
+    return html23`
       <slot part="slot"></slot>
       <slot part="dropslot" name="qti-simple-associable-choice"></slot>
     `;
   }
 };
-QtiSimpleAssociableChoice.styles = css20`
+QtiSimpleAssociableChoice.styles = css19`
     :host {
       display: flex;
       user-select: none;
@@ -3666,17 +3728,17 @@ __decorateClass([
   })
 ], QtiSimpleAssociableChoice.prototype, "fixed", 2);
 QtiSimpleAssociableChoice = __decorateClass([
-  customElement27("qti-simple-associable-choice")
+  customElement26("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 state9 } from "lit/decorators.js";
+import { html as html24, nothing } from "lit";
+import { customElement as customElement27, property as property20, state as state9 } 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`
+import { css as css20 } from "lit";
+var qti_match_interaction_styles_default = css20`
   slot:not([hidden]) {
     /* slot where the */
     display: flex;
@@ -3867,19 +3929,19 @@ var QtiMatchInteraction = class extends DragDropInteractionMixin(
   render() {
     const isTabular = this.class.split(" ").includes("qti-match-tabular");
     const hasCorrectResponse = this.correctOptions !== null;
-    return html25`
+    return html24`
       <slot name="prompt"></slot>
       <slot ?hidden=${isTabular}></slot>
 
-      ${isTabular ? html25`
+      ${isTabular ? html24`
             <table part="table">
               <tr part="r-header">
                 <td></td>
-                ${this.targetChoices.map((col) => html25`<th part="r-header">${unsafeHTML2(col.innerHTML)}</th>`)}
+                ${this.targetChoices.map((col) => html24`<th part="r-header">${unsafeHTML2(col.innerHTML)}</th>`)}
               </tr>
 
               ${this.sourceChoices.map(
-      (row) => html25`<tr part="row">
+      (row) => html24`<tr part="row">
                     <td part="c-header">${unsafeHTML2(row.innerHTML)}</td>
                     ${this.targetChoices.map((col) => {
         const rowId = row.getAttribute("identifier");
@@ -3891,7 +3953,7 @@ var QtiMatchInteraction = class extends DragDropInteractionMixin(
         const isCorrect = !!this.correctOptions?.find((option) => option.source === rowId && option.target === colId);
         const part = type === "radio" ? `rb ${checked ? "rb-checked" : ""} ${hasCorrectResponse ? isCorrect ? "rb-correct" : "rb-incorrect" : ""}` : `cb ${checked ? "cb-checked" : ""} ${hasCorrectResponse ? isCorrect ? "cb-correct" : "cb-incorrect" : ""}`;
         const disable = this.correctOptions?.length > 0 ? true : row.matchMax === 1 ? false : row.matchMax !== 0 && selectedInRowCount >= row.matchMax && !checked;
-        return html25`<td part="input-cell">
+        return html24`<td part="input-cell">
                         <div
                           class="input-container"
                           style="position: relative; width: 24px; height: 24px; margin: 0 auto;"
@@ -3905,7 +3967,7 @@ var QtiMatchInteraction = class extends DragDropInteractionMixin(
                             @change=${(e) => this.handleRadioChange(e)}
                             @click=${(e) => row.matchMax === 1 ? this.handleRadioClick(e) : null}
                           />
-                          ${type === "checkbox" && checked ? html25`
+                          ${type === "checkbox" && checked ? html24`
                                 <svg
                                   part="checkmark"
                                   viewBox="0 0 24 24"
@@ -3940,12 +4002,12 @@ __decorateClass([
   state9()
 ], QtiMatchInteraction.prototype, "correctOptions", 2);
 QtiMatchInteraction = __decorateClass([
-  customElement28("qti-match-interaction")
+  customElement27("qti-match-interaction")
 ], QtiMatchInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-media-interaction/qti-media-interaction.ts
-import { css as css22, html as html26 } from "lit";
-import { customElement as customElement29 } from "lit/decorators.js";
+import { css as css21, html as html25 } from "lit";
+import { customElement as customElement28 } from "lit/decorators.js";
 var QtiMediaInteraction = class extends Interaction {
   constructor() {
     super();
@@ -3982,7 +4044,7 @@ var QtiMediaInteraction = class extends Interaction {
     };
   }
   render() {
-    return html26` <slot name="prompt"></slot>
+    return html25` <slot name="prompt"></slot>
       <slot></slot>`;
   }
   connectedCallback() {
@@ -3996,18 +4058,18 @@ var QtiMediaInteraction = class extends Interaction {
     }
   }
 };
-QtiMediaInteraction.styles = [css22``];
+QtiMediaInteraction.styles = [css21``];
 QtiMediaInteraction = __decorateClass([
-  customElement29("qti-media-interaction")
+  customElement28("qti-media-interaction")
 ], QtiMediaInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-order-interaction/qti-order-interaction.ts
-import { html as html27 } from "lit";
-import { customElement as customElement30, property as property21, state as state10 } from "lit/decorators.js";
+import { html as html26 } from "lit";
+import { customElement as customElement29, property as property21, state as state10 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/qti-order-interaction/qti-order-interaction.styles.ts
-import { css as css23 } from "lit";
-var qti_order_interaction_styles_default = css23`
+import { css as css22 } from "lit";
+var qti_order_interaction_styles_default = css22`
   [part='drags'] {
     display: flex;
     align-items: flex-start;
@@ -4076,12 +4138,12 @@ var QtiOrderInteraction = class extends DragDropInteractionMixin(
     if (this.nrChoices < choices.length) {
       this.nrChoices = choices.length;
     }
-    return html27` <slot name="prompt"> </slot>
+    return html26` <slot name="prompt"> </slot>
       <div part="container">
         <slot part="drags"> </slot>
         <div part="drops">
           ${[...Array(this.nrChoices)].map(
-      (_, i) => html27`<drop-list role="region" part="drop-list" identifier="droplist${i}"></drop-list>`
+      (_, i) => html26`<drop-list role="region" part="drop-list" identifier="droplist${i}"></drop-list>`
     )}
         </div>
       </div>`;
@@ -4156,17 +4218,17 @@ __decorateClass([
   property21({ type: String })
 ], QtiOrderInteraction.prototype, "orientation", 2);
 QtiOrderInteraction = __decorateClass([
-  customElement30("qti-order-interaction")
+  customElement29("qti-order-interaction")
 ], QtiOrderInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-portable-custom-interaction/qti-portable-custom-interaction.ts
-import { css as css25, html as html28 } from "lit";
-import { customElement as customElement31, property as property22, state as state11 } from "lit/decorators.js";
+import { css as css24, html as html27 } from "lit";
+import { customElement as customElement30, property as property22, state as state11 } from "lit/decorators.js";
 import { consume as consume5 } from "@lit/context";
 
 // src/lib/qti-components/qti-interaction/qti-portable-custom-interaction/qti-portable-custom-interaction.styles.ts
-import { css as css24 } from "lit";
-var qti_portable_custom_interaction_styles_default = css24`
+import { css as css23 } from "lit";
+var qti_portable_custom_interaction_styles_default = css23`
   ::slotted(qti-interaction-markup) {
     display: none;
   }
@@ -5420,9 +5482,9 @@ var QtiPortableCustomInteraction = class extends Interaction {
     }
   }
   render() {
-    return html28`
+    return html27`
       <slot></slot>
-      ${this._errorMessage ? html28`<div style="color:red">
+      ${this._errorMessage ? html27`<div style="color:red">
             <h1>Error</h1>
             ${this._errorMessage}
           </div>` : ""}
@@ -5433,7 +5495,7 @@ var QtiPortableCustomInteraction = class extends Interaction {
 QtiPortableCustomInteraction.styles = [
   qti_portable_custom_interaction_styles_default,
   // Add default width/height for direct mode
-  css25`
+  css24`
       :host {
         display: block;
         width: 100%;
@@ -5484,18 +5546,18 @@ __decorateClass([
   state11()
 ], QtiPortableCustomInteraction.prototype, "response", 2);
 QtiPortableCustomInteraction = __decorateClass([
-  customElement31("qti-portable-custom-interaction")
+  customElement30("qti-portable-custom-interaction")
 ], QtiPortableCustomInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-position-object-interaction/qti-position-object-interaction.ts
-import { LitElement as LitElement15, css as css26, html as html29 } from "lit";
+import { LitElement as LitElement15, css as css25, html as html28 } from "lit";
 var QtiPositionObjectInteraction = class extends LitElement15 {
   render() {
-    return html29`<slot></slot>`;
+    return html28`<slot></slot>`;
   }
   static {
     this.styles = [
-      css26`
+      css25`
       :host {
         display: block;
       }
@@ -5513,11 +5575,11 @@ var QtiPositionObjectInteraction = class extends LitElement15 {
 customElements.define("qti-position-object-interaction", QtiPositionObjectInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-position-object-interaction/qti-position-object-stage.ts
-import { LitElement as LitElement16, css as css27, html as html30 } from "lit";
-import { customElement as customElement32 } from "lit/decorators.js";
+import { LitElement as LitElement16, css as css26, html as html29 } from "lit";
+import { customElement as customElement31 } from "lit/decorators.js";
 var QtiPositionObjectStage = class extends LitElement16 {
   render() {
-    return html30`<slot></slot>`;
+    return html29`<slot></slot>`;
   }
   constructor() {
     super();
@@ -5556,7 +5618,7 @@ var QtiPositionObjectStage = class extends LitElement16 {
   }
 };
 QtiPositionObjectStage.styles = [
-  css27`
+  css26`
       :host {
         display: inline-block;
         position: relative;
@@ -5564,12 +5626,12 @@ QtiPositionObjectStage.styles = [
     `
 ];
 QtiPositionObjectStage = __decorateClass([
-  customElement32("qti-position-object-stage")
+  customElement31("qti-position-object-stage")
 ], QtiPositionObjectStage);
 
 // src/lib/qti-components/qti-interaction/qti-select-point-interaction/qti-select-point-interaction.ts
-import { css as css28, html as html31 } from "lit";
-import { customElement as customElement33, property as property23, state as state12 } from "lit/decorators.js";
+import { css as css27, html as html30 } from "lit";
+import { customElement as customElement32, property as property23, state as state12 } from "lit/decorators.js";
 import { repeat as repeat2 } from "lit/directives/repeat.js";
 import { styleMap } from "lit/directives/style-map.js";
 
@@ -5816,7 +5878,7 @@ var QtiSelectPointInteraction = class extends Interaction {
     }
   }
   render() {
-    return html31` <slot name="prompt"></slot>
+    return html30` <slot name="prompt"></slot>
       <point-container>
         ${repeat2(
       (this.response || []).filter((point) => point),
@@ -5834,7 +5896,7 @@ var QtiSelectPointInteraction = class extends Interaction {
         } else if (this._responseCorrection[index] === false) {
           correctionPart = " incorrect";
         }
-        return html31`
+        return html30`
               <button
                 part="point${correctionPart}"
                 style=${styleMap({
@@ -5866,7 +5928,7 @@ var QtiSelectPointInteraction = class extends Interaction {
         ${repeat2(
       this._correctAreas?.filter((area) => area) || [],
       (area) => area,
-      (area, i) => html31`<div
+      (area, i) => html30`<div
               style=${styleMap({
         position: "absolute",
         pointerEvents: "none",
@@ -5909,7 +5971,7 @@ var QtiSelectPointInteraction = class extends Interaction {
   }
 };
 QtiSelectPointInteraction.styles = [
-  css28`
+  css27`
       :host {
         display: block;
       }
@@ -5948,12 +6010,12 @@ __decorateClass([
   state12()
 ], QtiSelectPointInteraction.prototype, "_responseCorrection", 2);
 QtiSelectPointInteraction = __decorateClass([
-  customElement33("qti-select-point-interaction")
+  customElement32("qti-select-point-interaction")
 ], QtiSelectPointInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-simple-choice.ts
-import { css as css29, html as html32, LitElement as LitElement17, nothing as nothing2 } from "lit";
-import { customElement as customElement34, property as property24 } from "lit/decorators.js";
+import { css as css28, html as html31, LitElement as LitElement17, nothing as nothing2 } from "lit";
+import { customElement as customElement33, property as property24 } from "lit/decorators.js";
 var QtiSimpleChoice = class extends ActiveElementMixin(LitElement17, "qti-simple-choice") {
   constructor() {
     super(...arguments);
@@ -5965,14 +6027,14 @@ var QtiSimpleChoice = class extends ActiveElementMixin(LitElement17, "qti-simple
     return this["internals"].states.has("--checked");
   }
   render() {
-    return html32`<div part="ch">
+    return html31`<div part="ch">
         <div part="cha"></div>
       </div>
-      ${this.marker ? html32`<div id="label">${this.marker}</div>` : nothing2}
+      ${this.marker ? html31`<div id="label">${this.marker}</div>` : nothing2}
       <slot part="slot"></slot>`;
   }
 };
-QtiSimpleChoice.styles = css29`
+QtiSimpleChoice.styles = css28`
     :host {
       display: flex;
       align-items: center;
@@ -6009,16 +6071,16 @@ __decorateClass([
   property24({ type: String, attribute: false })
 ], QtiSimpleChoice.prototype, "marker", 2);
 QtiSimpleChoice = __decorateClass([
-  customElement34("qti-simple-choice")
+  customElement33("qti-simple-choice")
 ], QtiSimpleChoice);
 
 // src/lib/qti-components/qti-interaction/qti-slider-interaction/qti-slider-interaction.ts
-import { html as html33 } from "lit";
-import { customElement as customElement35, property as property25, query as query2 } from "lit/decorators.js";
+import { html as html32 } from "lit";
+import { customElement as customElement34, property as property25, query as query2 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-interaction/qti-slider-interaction/qti-slider-interaction.styles.ts
-import { css as css30 } from "lit";
-var qti_slider_interaction_styles_default = css30`
+import { css as css29 } from "lit";
+var qti_slider_interaction_styles_default = css29`
   :host {
     display: block;
     --show-bounds: true;
@@ -6159,7 +6221,7 @@ var QtiSliderInteraction = class extends Interaction {
     this.requestUpdate();
   }
   render() {
-    return html33`
+    return html32`
       <slot name="prompt"></slot>
       <div id="slider" part="slider">
         <div id="bounds" part="bounds">
@@ -6174,7 +6236,7 @@ var QtiSliderInteraction = class extends Interaction {
             <div id="value" part="value">${this.response}</div>
           </div>
 
-          ${this._correctResponseNumber !== null ? html33`
+          ${this._correctResponseNumber !== null ? html32`
                 <div id="knob-correct" part="knob-correct">
                   <div id="value" part="value">${this._correctResponseNumber}</div>
                 </div>
@@ -6233,18 +6295,18 @@ __decorateClass([
   property25({ type: Number, attribute: "step" })
 ], QtiSliderInteraction.prototype, "step", 2);
 QtiSliderInteraction = __decorateClass([
-  customElement35("qti-slider-interaction")
+  customElement34("qti-slider-interaction")
 ], QtiSliderInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-text-entry-interaction/qti-text-entry-interaction.ts
-import { html as html34, nothing as nothing3 } from "lit";
-import { customElement as customElement36, property as property26, query as query3, state as state13 } from "lit/decorators.js";
+import { html as html33, nothing as nothing3 } from "lit";
+import { customElement as customElement35, property as property26, query as query3, state as state13 } from "lit/decorators.js";
 import { ifDefined as ifDefined4 } from "lit/directives/if-defined.js";
 import { createRef } from "lit/directives/ref.js";
 
 // src/lib/qti-components/qti-interaction/qti-text-entry-interaction/qti-text-entry-interaction.styles.ts
-import { css as css31 } from "lit";
-var qti_text_entry_interaction_styles_default = css31`
+import { css as css30 } from "lit";
+var qti_text_entry_interaction_styles_default = css30`
   :host {
     display: inline-block;
   }
@@ -6430,7 +6492,7 @@ var QtiTextEntryInteraction = class extends Interaction {
     }
   }
   render() {
-    return html34`
+    return html33`
       <input
         part="input"
         name="${this.responseIdentifier}"
@@ -6450,7 +6512,7 @@ var QtiTextEntryInteraction = class extends Interaction {
         ?disabled="${this.disabled}"
         ?readonly="${this.readonly}"
       />
-      ${this._correctResponse ? html34`<div part="correct">${this._correctResponse}</div>` : nothing3}
+      ${this._correctResponse ? html33`<div part="correct">${this._correctResponse}</div>` : nothing3}
     `;
   }
   // ${this._correctResponse ? html`<div popover part="correct">${this._correctResponse}</div>` : nothing}
@@ -6502,12 +6564,12 @@ __decorateClass([
   watch("response", { waitUntilFirstUpdate: true })
 ], QtiTextEntryInteraction.prototype, "_handleValueChange", 2);
 QtiTextEntryInteraction = __decorateClass([
-  customElement36("qti-text-entry-interaction")
+  customElement35("qti-text-entry-interaction")
 ], QtiTextEntryInteraction);
 
 // src/lib/qti-components/qti-interaction/qti-upload-interaction/qti-upload-interaction.ts
-import { css as css32, html as html35 } from "lit";
-import { customElement as customElement37 } from "lit/decorators.js";
+import { css as css31, html as html34 } from "lit";
+import { customElement as customElement36 } from "lit/decorators.js";
 var QtiUploadInteraction = class extends Interaction {
   constructor() {
     super(...arguments);
@@ -6541,7 +6603,7 @@ var QtiUploadInteraction = class extends Interaction {
     };
   }
   render() {
-    return html35`
+    return html34`
       <div>
         <slot name="prompt"></slot>
         <input type="file" @change="${this._onFileChange}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" />
@@ -6571,7 +6633,7 @@ var QtiUploadInteraction = class extends Interaction {
   }
 };
 QtiUploadInteraction.styles = [
-  css32`
+  css31`
       :host {
         display: block;
         margin: 1em 0;
@@ -6583,16 +6645,16 @@ QtiUploadInteraction.styles = [
     `
 ];
 QtiUploadInteraction = __decorateClass([
-  customElement37("qti-upload-interaction")
+  customElement36("qti-upload-interaction")
 ], QtiUploadInteraction);
 
 // src/lib/qti-components/qti-item-body/qti-item-body.ts
-import { customElement as customElement38 } from "lit/decorators.js";
-import { html as html36, LitElement as LitElement18 } from "lit";
+import { customElement as customElement37 } from "lit/decorators.js";
+import { html as html35, LitElement as LitElement18 } from "lit";
 
 // src/lib/qti-components/qti-item-body/qti-item-body.styles.ts
-import { css as css33 } from "lit";
-var qti_item_body_styles_default = css33`
+import { css as css32 } from "lit";
+var qti_item_body_styles_default = css32`
   :host {
     display: block;
   }
@@ -6601,20 +6663,20 @@ var qti_item_body_styles_default = css33`
 // src/lib/qti-components/qti-item-body/qti-item-body.ts
 var QtiItemBody = class extends LitElement18 {
   render() {
-    return html36`<slot part="qti-rubric-blocks" name="qti-rubric-block"></slot><slot></slot>`;
+    return html35`<slot part="qti-rubric-blocks" name="qti-rubric-block"></slot><slot></slot>`;
   }
 };
 QtiItemBody.styles = qti_item_body_styles_default;
 QtiItemBody = __decorateClass([
-  customElement38("qti-item-body")
+  customElement37("qti-item-body")
 ], QtiItemBody);
 
 // src/lib/qti-components/qti-outcome-processing/qti-outcome-processing.ts
-import { css as css34, html as html37, LitElement as LitElement19 } from "lit";
-import { customElement as customElement39 } from "lit/decorators.js";
+import { css as css33, html as html36, LitElement as LitElement19 } from "lit";
+import { customElement as customElement38 } from "lit/decorators.js";
 var QtiOutcomeProcessing = class extends LitElement19 {
   render() {
-    return html37`<slot></slot>`;
+    return html36`<slot></slot>`;
   }
   process() {
     const logic = new QtiOutcomeProcessingProcessor();
@@ -6623,14 +6685,14 @@ var QtiOutcomeProcessing = class extends LitElement19 {
   }
 };
 QtiOutcomeProcessing.styles = [
-  css34`
+  css33`
       :host {
         display: none;
       }
     `
 ];
 QtiOutcomeProcessing = __decorateClass([
-  customElement39("qti-outcome-processing")
+  customElement38("qti-outcome-processing")
 ], QtiOutcomeProcessing);
 var QtiOutcomeProcessingProcessor = class {
   process(rules) {
@@ -6641,11 +6703,11 @@ var QtiOutcomeProcessingProcessor = class {
 };
 
 // src/lib/qti-components/qti-prompt/qti-prompt.ts
-import { html as html38, LitElement as LitElement20 } from "lit";
-import { customElement as customElement40 } from "lit/decorators.js";
+import { html as html37, LitElement as LitElement20 } from "lit";
+import { customElement as customElement39 } from "lit/decorators.js";
 var QtiPrompt = class extends LitElement20 {
   render() {
-    return html38`<slot></slot>`;
+    return html37`<slot></slot>`;
   }
   connectedCallback() {
     const inInteraction = this.parentElement.tagName.endsWith("INTERACTION");
@@ -6655,12 +6717,12 @@ var QtiPrompt = class extends LitElement20 {
   }
 };
 QtiPrompt = __decorateClass([
-  customElement40("qti-prompt")
+  customElement39("qti-prompt")
 ], QtiPrompt);
 
 // src/lib/qti-components/qti-response-processing/qti-response-processing/qti-response-processing.ts
-import { css as css35, html as html39, LitElement as LitElement21 } from "lit";
-import { customElement as customElement41 } from "lit/decorators.js";
+import { css as css34, html as html38, LitElement as LitElement21 } from "lit";
+import { customElement as customElement40 } from "lit/decorators.js";
 
 // src/lib/qti-components/internal/template-strings.ts
 var matchCorrect = `<qti-response-processing>
@@ -6719,7 +6781,7 @@ var mapResponsePoint = `<qti-response-processing>
 // src/lib/qti-components/qti-response-processing/qti-response-processing/qti-response-processing.ts
 var QtiResponseProcessing = class extends LitElement21 {
   render() {
-    return html39`<slot></slot>`;
+    return html38`<slot></slot>`;
   }
   process() {
     const assessmentItem = this.closest("qti-assessment-item");
@@ -6754,14 +6816,14 @@ var QtiResponseProcessing = class extends LitElement21 {
   }
 };
 QtiResponseProcessing.styles = [
-  css35`
+  css34`
       :host {
         display: none;
       }
     `
 ];
 QtiResponseProcessing = __decorateClass([
-  customElement41("qti-response-processing")
+  customElement40("qti-response-processing")
 ], QtiResponseProcessing);
 
 // src/lib/qti-components/qti-response-processing/qti-rule/qti-lookup-outcome-value/qti-lookup-outcome-value.ts
@@ -6769,18 +6831,18 @@ import { property as property27, state as state14 } from "lit/decorators.js";
 import { consume as consume6 } from "@lit/context";
 
 // src/lib/qti-components/qti-response-processing/qti-rule/qti-rule.ts
-import { customElement as customElement42 } from "lit/decorators.js";
-import { html as html40, LitElement as LitElement22 } from "lit";
+import { customElement as customElement41 } from "lit/decorators.js";
+import { html as html39, LitElement as LitElement22 } from "lit";
 var QtiRule = class extends LitElement22 {
   render() {
-    return html40`<slot></slot>`;
+    return html39`<slot></slot>`;
   }
   process() {
     throw new Error("Not implemented");
   }
 };
 QtiRule = __decorateClass([
-  customElement42("qti-rule")
+  customElement41("qti-rule")
 ], QtiRule);
 
 // src/lib/qti-components/qti-response-processing/qti-rule/qti-lookup-outcome-value/qti-lookup-outcome-value.ts
@@ -6822,10 +6884,10 @@ __decorateClass([
 customElements.define("qti-lookup-outcome-value", QtiLookupOutcomeValue);
 
 // src/lib/qti-components/qti-response-processing/qti-rule/qti-response-condition/qti-response-condition.ts
-import { html as html41 } from "lit";
+import { html as html40 } from "lit";
 var QtiResponseCondition = class extends QtiRule {
   render() {
-    return html41`<slot></slot>`;
+    return html40`<slot></slot>`;
   }
   process() {
     const branches = [...this.children];
@@ -6898,10 +6960,10 @@ var QtiSetOutcomeValueRule = class {
 customElements.define("qti-set-outcome-value", QtiSetOutcomeValue);
 
 // src/lib/qti-components/qti-response-processing/qti-response-else/qti-response-else.ts
-import { LitElement as LitElement23, html as html42 } from "lit";
+import { LitElement as LitElement23, html as html41 } from "lit";
 var QtiResponseElse = class extends LitElement23 {
   render() {
-    return html42`<slot></slot>`;
+    return html41`<slot></slot>`;
   }
   calculate() {
     return true;
@@ -6920,7 +6982,7 @@ var QtiResponseElse = class extends LitElement23 {
 customElements.define("qti-response-else", QtiResponseElse);
 
 // src/lib/qti-components/qti-response-processing/qti-response-else/qti-response-if/qti-response-else-if/qti-response-else-if.ts
-import { html as html43 } from "lit";
+import { html as html42 } from "lit";
 
 // src/lib/qti-components/qti-response-processing/qti-response-else/qti-response-if/qti-response-if.ts
 var QtiResponseIf = class extends QtiResponseElse {
@@ -6942,20 +7004,165 @@ customElements.define("qti-response-if", QtiResponseIf);
 // src/lib/qti-components/qti-response-processing/qti-response-else/qti-response-if/qti-response-else-if/qti-response-else-if.ts
 var QtiResponseElseIf = class extends QtiResponseIf {
   render() {
-    return html43`${super.render()}`;
+    return html42`${super.render()}`;
   }
 };
 customElements.define("qti-response-else-if", QtiResponseElseIf);
 
 // src/lib/qti-components/qti-response-processing/qti-expression/qti-and/qti-and.ts
-import { customElement as customElement43 } from "lit/decorators.js";
+import { customElement as customElement42 } from "lit/decorators.js";
+
+// src/lib/exports/qti-expression.ts
+import { consume as consume7 } from "@lit/context";
+import { css as css35, html as html43, LitElement as LitElement24 } from "lit";
+import { state as state15 } from "lit/decorators.js";
+var QtiExpression = class extends LitElement24 {
+  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) => {
+        console.debug("getVariables", e.tagName.toLowerCase());
+        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") || "";
+            if (identifier === "QTI_CONTEXT") {
+              if (!this.qtiContext?.QTI_CONTEXT) {
+                console.warn("QTI_CONTEXT not available");
+                return {
+                  identifier: "QTI_CONTEXT",
+                  baseType: "record",
+                  value: this.qtiContext.QTI_CONTEXT,
+                  cardinality: "record",
+                  type: "context"
+                };
+              }
+              return {
+                identifier: "QTI_CONTEXT",
+                baseType: "record",
+                value: this.qtiContext.QTI_CONTEXT,
+                cardinality: "record",
+                type: "context"
+              };
+            }
+            const variable = this.context.variables.find((v) => v.identifier === identifier) || null;
+            return variable;
+          }
+          case "qti-multiple": {
+            const multiple = e;
+            const values = multiple.getResult();
+            console.debug("values", values);
+            if (values?.length > 0) {
+              return {
+                identifier: "",
+                baseType: values[0].baseType,
+                value: values.map((v) => v.value),
+                cardinality: "multiple",
+                type: "response"
+              };
+            }
+            return null;
+          }
+          case "qti-ordered": {
+            const multiple = e;
+            const values = multiple.getResult();
+            if (values?.length > 0) {
+              return {
+                identifier: "",
+                baseType: values[0].baseType,
+                value: values.map((v) => v.value),
+                cardinality: "ordered",
+                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() || null,
+                cardinality: "single"
+              };
+            } catch (error) {
+              console.warn("default not sufficient");
+            }
+            return null;
+          }
+        }
+      }).filter((v) => v !== null)
+    );
+  }
+  static {
+    // hide the slot with css
+    this.styles = css35`
+    slot {
+      display: none;
+    }
+  `;
+  }
+  render() {
+    return html43`<pre>${JSON.stringify(this.result, null, 2)}</pre>
+      <slot></slot>`;
+  }
+  calculate() {
+    this.result = this.getResult();
+    return this.result;
+  }
+  getResult() {
+    throw new Error("Not implemented");
+  }
+};
+__decorateClass([
+  state15()
+], QtiExpression.prototype, "result", 2);
+__decorateClass([
+  consume7({ context: itemContext, subscribe: true }),
+  state15()
+], QtiExpression.prototype, "context", 2);
+__decorateClass([
+  consume7({ context: qtiContext, subscribe: true }),
+  state15()
+], QtiExpression.prototype, "qtiContext", 2);
+
+// src/lib/exports/qti-condition-expression.ts
+var QtiConditionExpression = class extends QtiExpression {
+  calculate() {
+    this.result = this.getResult();
+    return this.result;
+  }
+  getResult() {
+    throw new Error("Not implemented");
+  }
+};
+
+// src/lib/qti-components/qti-response-processing/qti-expression/qti-and/qti-and.ts
 var QtiAnd = class extends qtiAndMixin(QtiConditionExpression) {
   calculate() {
     return this.calculateChildren(Array.from(this.children));
   }
 };
 QtiAnd = __decorateClass([
-  customElement43("qti-and")
+  customElement42("qti-and")
 ], QtiAnd);
 function qtiAndMixin(Base) {
   return class MockQtiAnd extends Base {
@@ -7084,8 +7291,8 @@ var QtiCorrect = class extends QtiExpression {
 customElements.define("qti-correct", QtiCorrect);
 
 // src/lib/qti-components/qti-response-processing/qti-expression/qti-default/qti-default.ts
-import { property as property29, state as state15 } from "lit/decorators.js";
-import { consume as consume7 } from "@lit/context";
+import { property as property29, state as state16 } from "lit/decorators.js";
+import { consume as consume8 } from "@lit/context";
 var QtiDefault = class extends QtiExpression {
   constructor() {
     super(...arguments);
@@ -7138,12 +7345,12 @@ __decorateClass([
   property29({ type: String })
 ], QtiDefault.prototype, "identifier", 2);
 __decorateClass([
-  consume7({ context: itemContext, subscribe: true }),
-  state15()
+  consume8({ context: itemContext, subscribe: true }),
+  state16()
 ], QtiDefault.prototype, "context", 2);
 __decorateClass([
-  state15(),
-  consume7({ context: testContext, subscribe: true })
+  state16(),
+  consume8({ context: testContext, subscribe: true })
 ], QtiDefault.prototype, "_testContext", 2);
 customElements.define("qti-default", QtiDefault);
 
@@ -8154,10 +8361,10 @@ var QtiPower = class extends QtiExpression {
 customElements.define("qti-power", QtiPower);
 
 // src/lib/qti-components/qti-response-processing/qti-expression/qti-printed-variable/qti-printed-variable.ts
-import { consume as consume8 } from "@lit/context";
-import { LitElement as LitElement24, html as html45, nothing as nothing4 } from "lit";
-import { property as property36, state as state16 } from "lit/decorators.js";
-var QtiPrintedVariable = class extends LitElement24 {
+import { consume as consume9 } from "@lit/context";
+import { LitElement as LitElement25, html as html45, nothing as nothing4 } from "lit";
+import { property as property36, state as state17 } from "lit/decorators.js";
+var QtiPrintedVariable = class extends LitElement25 {
   render() {
     const value = this.context?.variables.find((v) => v.identifier === this.identifier)?.value;
     return value === null ? nothing4 : html45`${JSON.stringify(value, null, 2)}`;
@@ -8171,8 +8378,8 @@ __decorateClass([
   property36({ type: String })
 ], QtiPrintedVariable.prototype, "identifier", 2);
 __decorateClass([
-  consume8({ context: itemContext, subscribe: true }),
-  state16()
+  consume9({ context: itemContext, subscribe: true }),
+  state17()
 ], QtiPrintedVariable.prototype, "context", 2);
 customElements.define("qti-printed-variable", QtiPrintedVariable);
 
@@ -8228,9 +8435,6 @@ function qtiSubtractMixin(Base) {
   };
 }
 
-// src/lib/qti-components/qti-response-processing/qti-expression/qti-subtract/index.ts
-customElements.define("qti-subtract", QtiSubtract);
-
 // src/lib/qti-components/qti-response-processing/qti-expression/qti-string-match/qti-string-match.ts
 import { property as property37 } from "lit/decorators.js";
 var QtiStringMatch = class extends QtiExpression {
@@ -8414,7 +8618,7 @@ var QtiDelete = class extends QtiExpression {
 customElements.define("qti-delete", QtiDelete);
 
 // src/lib/qti-components/qti-response-processing/qti-expression/qti-index/qti-index.ts
-import { customElement as customElement44, property as property39 } from "lit/decorators.js";
+import { customElement as customElement43, property as property39 } from "lit/decorators.js";
 var QtiIndex = class extends QtiExpression {
   // Required attribute, can be a number or an identifier
   getResult() {
@@ -8471,25 +8675,25 @@ __decorateClass([
   property39({ type: String })
 ], QtiIndex.prototype, "n", 2);
 QtiIndex = __decorateClass([
-  customElement44("qti-index")
+  customElement43("qti-index")
 ], QtiIndex);
 
 // src/lib/qti-components/qti-rubric-block/qti-content-body.ts
-import { LitElement as LitElement25, html as html46 } from "lit";
-import { customElement as customElement45 } from "lit/decorators.js";
-var QtiContentBody = class extends LitElement25 {
+import { LitElement as LitElement26, html as html46 } from "lit";
+import { customElement as customElement44 } from "lit/decorators.js";
+var QtiContentBody = class extends LitElement26 {
   render() {
     return html46`<slot></slot>`;
   }
 };
 QtiContentBody = __decorateClass([
-  customElement45("qti-content-body")
+  customElement44("qti-content-body")
 ], QtiContentBody);
 
 // src/lib/qti-components/qti-rubric-block/qti-rubric-block.ts
-import { LitElement as LitElement26, css as css36, html as html47 } from "lit";
-import { customElement as customElement46, property as property40 } from "lit/decorators.js";
-var QtiRubricBlock = class extends LitElement26 {
+import { LitElement as LitElement27, css as css36, html as html47 } from "lit";
+import { customElement as customElement45, property as property40 } from "lit/decorators.js";
+var QtiRubricBlock = class extends LitElement27 {
   handleclassNamesChange() {
     const classNames = this.classNames.split(" ");
     classNames.forEach((className) => {
@@ -8540,13 +8744,13 @@ __decorateClass([
   watch("classNames", { waitUntilFirstUpdate: true })
 ], QtiRubricBlock.prototype, "handleclassNamesChange", 1);
 QtiRubricBlock = __decorateClass([
-  customElement46("qti-rubric-block")
+  customElement45("qti-rubric-block")
 ], QtiRubricBlock);
 
 // src/lib/qti-components/qti-stylesheet/qti-stylesheet.ts
-import { LitElement as LitElement27 } from "lit";
-import { customElement as customElement47 } from "lit/decorators.js";
-var QtiStylesheet = class extends LitElement27 {
+import { LitElement as LitElement28 } from "lit";
+import { customElement as customElement46 } from "lit/decorators.js";
+var QtiStylesheet = class extends LitElement28 {
   constructor() {
     super(...arguments);
     this.styleElement = null;
@@ -8596,18 +8800,18 @@ var QtiStylesheet = class extends LitElement27 {
   }
 };
 QtiStylesheet = __decorateClass([
-  customElement47("qti-stylesheet")
+  customElement46("qti-stylesheet")
 ], QtiStylesheet);
 
 // src/lib/qti-components/qti-variable-declaration/qti-outcome-declaration/qti-outcome-declaration.ts
-import { consume as consume9 } from "@lit/context";
+import { consume as consume10 } from "@lit/context";
 import { css as css37, html as html49 } from "lit";
-import { customElement as customElement49, property as property41, state as state17 } from "lit/decorators.js";
+import { customElement as customElement48, property as property41, state as state18 } from "lit/decorators.js";
 
 // src/lib/qti-components/qti-variable-declaration/qti-variable-declaration.ts
-import { html as html48, LitElement as LitElement28 } from "lit";
-import { customElement as customElement48 } from "lit/decorators.js";
-var QtiVariableDeclaration = class extends LitElement28 {
+import { html as html48, LitElement as LitElement29 } from "lit";
+import { customElement as customElement47 } from "lit/decorators.js";
+var QtiVariableDeclaration = class extends LitElement29 {
   render() {
     return html48`<slot></slot>`;
   }
@@ -8624,7 +8828,7 @@ var QtiVariableDeclaration = class extends LitElement28 {
   }
 };
 QtiVariableDeclaration = __decorateClass([
-  customElement48("qti-variabledeclaration")
+  customElement47("qti-variabledeclaration")
 ], QtiVariableDeclaration);
 
 // src/lib/qti-components/qti-variable-declaration/qti-outcome-declaration/qti-outcome-declaration.ts
@@ -8702,17 +8906,17 @@ __decorateClass([
   property41({ type: String })
 ], QtiOutcomeDeclaration.prototype, "cardinality", 2);
 __decorateClass([
-  consume9({ context: itemContext, subscribe: true }),
-  state17()
+  consume10({ context: itemContext, subscribe: true }),
+  state18()
 ], QtiOutcomeDeclaration.prototype, "itemContext", 2);
 QtiOutcomeDeclaration = __decorateClass([
-  customElement49("qti-outcome-declaration")
+  customElement48("qti-outcome-declaration")
 ], QtiOutcomeDeclaration);
 
 // src/lib/qti-components/qti-variable-declaration/qti-response-declaration/qti-response-declaration.ts
-import { consume as consume10 } from "@lit/context";
+import { consume as consume11 } from "@lit/context";
 import { css as css38, html as html50 } from "lit";
-import { customElement as customElement50, property as property42, state as state18 } from "lit/decorators.js";
+import { customElement as customElement49, property as property42, state as state19 } from "lit/decorators.js";
 var QtiResponseDeclaration = class extends QtiVariableDeclaration {
   render() {
     const value = this.itemContext?.variables.find((v) => v.identifier === this.identifier)?.value;
@@ -8814,11 +9018,11 @@ __decorateClass([
   property42({ type: String })
 ], QtiResponseDeclaration.prototype, "cardinality", 2);
 __decorateClass([
-  consume10({ context: itemContext, subscribe: true }),
-  state18()
+  consume11({ context: itemContext, subscribe: true }),
+  state19()
 ], QtiResponseDeclaration.prototype, "itemContext", 2);
 QtiResponseDeclaration = __decorateClass([
-  customElement50("qti-response-declaration")
+  customElement49("qti-response-declaration")
 ], QtiResponseDeclaration);
 
 export {
@@ -8828,7 +9032,6 @@ export {
   QtiCustomOperator,
   QtiFeedbackBlock,
   QtiFeedbackInline,
-  QtiModalFeedback,
   QtiAssociableHotspot,
   QtiAssociateInteraction,
   QtiChoiceInteraction,
@@ -8920,4 +9123,4 @@ export {
   QtiOutcomeDeclaration,
   QtiResponseDeclaration
 };
-//# sourceMappingURL=chunk-LF6SO3JU.js.map
+//# sourceMappingURL=chunk-LN74Z5QM.js.map