@citolab/qti-components 7.28.0 → 8.0.0

package/dist/chunk-5QYII4OZ.js

@@ -0,0 +1,1374 @@
+import {
+  ActiveElementMixin,
+  QtiGapText,
+  QtiHotspotChoice,
+  QtiHottext,
+  QtiSimpleAssociableChoice,
+  QtiSimpleChoice,
+  c as c2,
+  dragDropContext,
+  elements,
+  elements10,
+  elements11,
+  elements12,
+  elements13,
+  elements14,
+  elements15,
+  elements16,
+  elements2,
+  elements3,
+  elements4,
+  elements5,
+  elements6,
+  elements7,
+  elements8,
+  elements9
+} from "./chunk-5SJS36BI.js";
+import {
+  Interaction,
+  T,
+  boxSizing,
+  c,
+  dropRegion,
+  i,
+  i2,
+  n2 as n,
+  r,
+  removeDoubleSlashes
+} from "./chunk-H3J7LFRO.js";
+
+// ../interactions/core/dist/elements/qti-associable-hotspot/qti-associable-hotspot.styles.js
+var qti_associable_hotspot_styles_default = [
+  boxSizing,
+  dropRegion,
+  i`
+    /* A drop target — see qti-gap.styles.ts. The interaction publishes the chip measurements as
+     custom properties on its host; the properties themselves live here. */
+    :host {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      user-select: none;
+      position: absolute;
+      min-height: var(--qti-dropzone-min-height, 0);
+      min-width: var(--qti-dropzone-min-width, 0);
+    }
+
+    /* The hotspot's own box comes from its authored coords; the drop region simply fills it. */
+    [part~='drop'] {
+      width: 100%;
+      height: 100%;
+    }
+  `
+];
+
+// ../interactions/core/dist/elements/qti-associable-hotspot/qti-associable-hotspot.js
+var __decorate = function(decorators, target, key, desc) {
+  var c3 = arguments.length, r2 = c3 < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r2 = Reflect.decorate(decorators, target, key, desc);
+  else for (var i3 = decorators.length - 1; i3 >= 0; i3--) if (d = decorators[i3]) r2 = (c3 < 3 ? d(r2) : c3 > 3 ? d(target, key, r2) : d(target, key)) || r2;
+  return c3 > 3 && r2 && Object.defineProperty(target, key, r2), r2;
+};
+var QtiAssociableHotspot = class extends i2 {
+  constructor() {
+    super(...arguments);
+    this.internals = this.attachInternals();
+    this.acceptsDeclarativeDrops = true;
+  }
+  static {
+    this.styles = qti_associable_hotspot_styles_default;
+  }
+  /** The chips this hotspot holds. Stable node references, cloned once at drop time. */
+  get drags() {
+    return this._dragDrop?.nodesByTarget?.[this.identifier] ?? [];
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.dispatchEvent(new CustomEvent("qti-register-hotspot", {
+      bubbles: true,
+      composed: true,
+      cancelable: false
+    }));
+  }
+  render() {
+    return T`<div part="drop">
+      ${c2(this.drags, (node) => node.getAttribute("identifier"), (node) => node)}
+    </div>`;
+  }
+};
+__decorate([
+  n({ type: String, reflect: true })
+], QtiAssociableHotspot.prototype, "identifier", void 0);
+__decorate([
+  c({ context: dragDropContext, subscribe: true }),
+  r()
+], QtiAssociableHotspot.prototype, "_dragDrop", void 0);
+
+// ../interactions/core/dist/elements/qti-gap/qti-gap.styles.js
+var qti_gap_styles_default = [
+  boxSizing,
+  dropRegion,
+  i`
+    /*
+   * A drop target. The interaction measures its chips and publishes the result as custom
+   * properties on its own host; the actual CSS properties live here, not in a style attribute.
+   *
+   * An authored data-choices-container-width takes the width axis: autoSizeDropzoneWidth goes
+   * false and the mixin never publishes --qti-dropzone-min-width at all, so the fallback below
+   * applies and the authored inline width is free to win. That works only because the token is
+   * never declared globally — min-width beats width, so a declared floor would silently outrank
+   * the author. See DROP-SIZING.md §2 and tools/stylelint/no-declared-measured-token.js.
+   */
+    /*
+     * A gap sits in a line of prose, so it is inline-flex and rides the text baseline. All four of
+     * these were in the theme, set on this host from the document — which also meant the
+     * 'display: flex' this file declared never took effect.
+     */
+    :host {
+      display: inline-flex;
+      align-items: center;
+      justify-content: center;
+      vertical-align: middle;
+      user-select: none;
+    }
+
+    /*
+   * The chip's box is reserved on the slot, not on the host.
+   *
+   * --qti-dropzone-min-* is the border-box of the widest and tallest chip, so whatever carries
+   * that minimum must have no border or padding of its own — otherwise the theme's dashed gap
+   * border eats into the reservation, the gap comes up short, and it grows the instant a chip
+   * lands in it. That reflows the sentence and drags the neighbouring gaps sideways while the
+   * user is still on their way to one.
+   *
+   * It cannot live on :host. A theme's universal reset matches the host element from the
+   * document, and document rules outrank :host — so the host is border-box no matter what this
+   * file says. This div is inside the shadow tree, out of the document's reach, and inherits
+   * border-box harmlessly since it has no border or padding of its own.
+   */
+    [part~='drop'] {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      min-height: var(--qti-dropzone-min-height, 0);
+      min-width: var(--qti-dropzone-min-width, 0);
+    }
+  `
+];
+
+// ../interactions/core/dist/elements/qti-gap/qti-gap.js
+var __decorate2 = function(decorators, target, key, desc) {
+  var c3 = arguments.length, r2 = c3 < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r2 = Reflect.decorate(decorators, target, key, desc);
+  else for (var i3 = decorators.length - 1; i3 >= 0; i3--) if (d = decorators[i3]) r2 = (c3 < 3 ? d(r2) : c3 > 3 ? d(target, key, r2) : d(target, key)) || r2;
+  return c3 > 3 && r2 && Object.defineProperty(target, key, r2), r2;
+};
+var QtiGap = class extends i2 {
+  constructor() {
+    super(...arguments);
+    this.internals = this.attachInternals();
+    this.acceptsDeclarativeDrops = true;
+    this.tabindex = 0;
+  }
+  static {
+    this.styles = qti_gap_styles_default;
+  }
+  /** The chips this gap holds. Stable node references, cloned once at drop time by the interaction. */
+  get drags() {
+    return this._dragDrop?.nodesByTarget?.[this.identifier] ?? [];
+  }
+  render() {
+    return T`<div part="drop">
+      ${c2(this.drags, (node) => node.getAttribute("identifier"), (node) => node)}
+    </div>`;
+  }
+};
+__decorate2([
+  n({ type: Number, reflect: true })
+], QtiGap.prototype, "tabindex", void 0);
+__decorate2([
+  n({ type: String, reflect: true })
+], QtiGap.prototype, "identifier", void 0);
+__decorate2([
+  c({ context: dragDropContext, subscribe: true }),
+  r()
+], QtiGap.prototype, "_dragDrop", void 0);
+
+// ../interactions/core/dist/elements/qti-gap-img/qti-gap-img.styles.js
+var qti_gap_img_styles_default = [
+  boxSizing,
+  i`
+    /* Centred, because a gap-img is a picture inside a drop the same size as it. Was in the theme's
+       graphic-gap-match rules, on the host from the document. */
+    :host {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      user-select: none;
+    }
+  `
+];
+
+// ../interactions/core/dist/elements/qti-gap-img/qti-gap-img.js
+var __decorate3 = function(decorators, target, key, desc) {
+  var c3 = arguments.length, r2 = c3 < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r2 = Reflect.decorate(decorators, target, key, desc);
+  else for (var i3 = decorators.length - 1; i3 >= 0; i3--) if (d = decorators[i3]) r2 = (c3 < 3 ? d(r2) : c3 > 3 ? d(target, key, r2) : d(target, key)) || r2;
+  return c3 > 3 && r2 && Object.defineProperty(target, key, r2), r2;
+};
+var QtiGapImg = class extends i2 {
+  constructor() {
+    super(...arguments);
+    this.tabindex = 0;
+    this.internals = this.attachInternals();
+  }
+  static {
+    this.styles = qti_gap_img_styles_default;
+  }
+  connectedCallback() {
+    this.setAttribute("slot", "drags");
+  }
+};
+__decorate3([
+  n({ type: Number, reflect: true })
+], QtiGapImg.prototype, "tabindex", void 0);
+
+// ../interactions/core/dist/elements/qti-inline-choice/qti-inline-choice.styles.js
+var styles = i`
+  /*
+   * An option row: one line, clipped, with its text centred against the row's min-height. All four
+   * were in the theme, set on this host from the document — which is also why the 'display: block'
+   * this file declared never took effect.
+   */
+  :host {
+    display: inline-flex;
+    align-items: center;
+    white-space: nowrap;
+    overflow: hidden;
+    box-sizing: border-box;
+  }
+
+  slot {
+    display: inline;
+  }
+`;
+var qti_inline_choice_styles_default = styles;
+
+// ../interactions/core/dist/elements/qti-inline-choice/qti-inline-choice.js
+var __decorate4 = function(decorators, target, key, desc) {
+  var c3 = arguments.length, r2 = c3 < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r2 = Reflect.decorate(decorators, target, key, desc);
+  else for (var i3 = decorators.length - 1; i3 >= 0; i3--) if (d = decorators[i3]) r2 = (c3 < 3 ? d(r2) : c3 > 3 ? d(target, key, r2) : d(target, key)) || r2;
+  return c3 > 3 && r2 && Object.defineProperty(target, key, r2), r2;
+};
+var QtiInlineChoice = class extends ActiveElementMixin(i2, "qti-inline-choice") {
+  static {
+    this.styles = qti_inline_choice_styles_default;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    this.addEventListener("click", this.#onSelectInlineChoice);
+    this.dispatchEvent(new CustomEvent("qti-inline-choice-register", {
+      bubbles: true,
+      composed: true,
+      cancelable: false
+    }));
+  }
+  disconnectedCallback() {
+    this.removeEventListener("click", this.#onSelectInlineChoice);
+  }
+  render() {
+    return T` <slot></slot> `;
+  }
+  #onSelectInlineChoice() {
+    this.dispatchEvent(new CustomEvent("qti-inline-choice-select", {
+      bubbles: true,
+      cancelable: false,
+      composed: true,
+      detail: { identifier: this.identifier }
+    }));
+  }
+};
+__decorate4([
+  n({ type: String })
+], QtiInlineChoice.prototype, "identifier", void 0);
+
+// ../interactions/core/dist/elements/qti-prompt/qti-prompt.styles.js
+var qti_prompt_styles_default = [
+  boxSizing,
+  i`
+    :host {
+      display: block;
+      margin: var(--qti-gap) 0;
+      width: 100%;
+    }
+  `
+];
+
+// ../interactions/core/dist/elements/qti-prompt/qti-prompt.js
+var QtiPrompt = class extends i2 {
+  static {
+    this.styles = qti_prompt_styles_default;
+  }
+  render() {
+    return T`<slot></slot>`;
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    const inInteraction = this.parentElement?.tagName.endsWith("INTERACTION");
+    if (inInteraction) {
+      this.setAttribute("slot", "prompt");
+    }
+  }
+};
+
+// ../interactions/custom-interaction/dist/qti-custom-interaction.styles.js
+var qti_custom_interaction_styles_default = [
+  boxSizing,
+  i`
+    /* The box this element already had. See the note in qti-match-interaction.styles.ts. */
+    :host {
+      display: block;
+    }
+  `
+];
+
+// ../interactions/custom-interaction/dist/qti-custom-interaction.js
+var __decorate5 = function(decorators, target, key, desc) {
+  var c3 = arguments.length, r2 = c3 < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r2 = Reflect.decorate(decorators, target, key, desc);
+  else for (var i3 = decorators.length - 1; i3 >= 0; i3--) if (d = decorators[i3]) r2 = (c3 < 3 ? d(r2) : c3 > 3 ? d(target, key, r2) : d(target, key)) || r2;
+  return c3 > 3 && r2 && Object.defineProperty(target, key, r2), r2;
+};
+var registerCES = `
+const postToParentWindows = (type, data) => {
+    window.top.postMessage(data ? { type, data } : { type }, '*');
+    let w = window.parent;
+    while (w) {
+      if (w !== window.top) {
+          w.postMessage({ type, data }, '*');
+      }
+      if (w !== w.parent) {
+        w = w.parent;
+      } else {
+        w = null;
+      }
+    }
+};
+
+window.CES = {
+    media: null,
+    response: null,
+    load: () => {
+      let resolveCount = 0;
+
+      const handleMessage = (event) => {
+        if (event.data.type === "mediaData") {
+          const media = event.data.data;
+          CES.media = media;
+          resolveCount++;
+        } else if (event.data.type === "responseData") {
+          const response = event.data.data;
+          if (response && Array.isArray(response) && response.length > 0) {
+            // state is stored in the first element of the array
+            CES.response = response[0];
+            // Wait a short moment to ensure CES.response is set
+            setTimeout(() => {
+              // Re-create the Controller instance if it exists
+              if (typeof Controller === 'function') {
+                console.log("Re-creating Controller instance");
+                ctrl = new Controller();
+              }
+            }, 50);
+          } else {  
+            CES.response = response;
+          }
+          resolveCount++;
+        }
+        if (resolveCount === 2) {
+          //window.removeEventListener("message", handleMessage);
+        }
+      };
+      window.addEventListener("message", handleMessage);
+      postToParentWindows("getMedia");
+      postToParentWindows("getResponse");
+    },
+    setResponse: (data) => {
+      postToParentWindows("setResponse", data);
+    },
+    getResponse: () => {
+      return CES.response;
+    },
+    getMedia: () => {
+      return CES.media;
+    },
+    setStageHeight: () => {
+      postToParentWindows("setStageHeight");
+    },
+};
+CES.load();
+`;
+var ciBootstrap = `
+  (function() {
+    var blobUrlReceived = null;
+    
+    const createIframe = () => {
+      if (!blobUrlReceived || !document.body) return;
+      var n = document.createElement('iframe');
+      n.frameBorder = '0';
+      n.scrolling = 'no';
+      n.src = blobUrlReceived;
+      n.style.width = '100%';
+      n.style.height = '100%';
+      document.body.appendChild(n);
+    };
+    
+    const handleMessage = (event) => {
+      if (event.data.type === 'blobUrl') {
+        blobUrlReceived = event.data.data;
+        window.removeEventListener('message', handleMessage);
+        createIframe();
+      }
+    };
+    
+    window.addEventListener('message', handleMessage);
+    
+    // Wait for document ready before requesting blobUrl
+    const requestBlobUrl = () => {
+      let w = window.parent;
+      while (w) {
+        w.postMessage({ type: 'getBlobUrl' }, '*');
+        if (w !== w.parent) {
+          w = w.parent;
+        } else {
+          w = null;
+        }
+      }
+    };
+    
+    if (document.readyState === 'loading') {
+      document.addEventListener('DOMContentLoaded', requestBlobUrl);
+    } else {
+      requestBlobUrl();
+    }
+  })();
+`;
+var QtiCustomInteraction = class extends Interaction {
+  #rawResponse;
+  #manifestUrl;
+  #resourceBaseUrl;
+  static {
+    this.styles = qti_custom_interaction_styles_default;
+  }
+  constructor() {
+    super();
+    this.#rawResponse = "";
+    this.#manifestUrl = null;
+    this.#resourceBaseUrl = null;
+    this._errorMessage = null;
+    this.#contentBlobUrl = null;
+    this.handlePostMessage = this.handlePostMessage.bind(this);
+  }
+  // Pre-created blob URL for the index.html with injected CES proxy
+  #contentBlobUrl;
+  connectedCallback() {
+    super.connectedCallback();
+    let manifestPath = this.data;
+    if (!manifestPath) {
+      const objectEl = this.querySelector("object[data]");
+      if (objectEl) {
+        manifestPath = objectEl.getAttribute("data");
+        const width = objectEl.getAttribute("width");
+        const height = objectEl.getAttribute("height");
+        if (width)
+          this.setAttribute("width", width);
+        if (height)
+          this.setAttribute("height", height);
+      }
+    }
+    if (!manifestPath) {
+      this._errorMessage = "No manifest path found (neither data attribute nor object child)";
+      return;
+    }
+    const uriToManifest = manifestPath.startsWith("http") || manifestPath.startsWith("blob") ? manifestPath : removeDoubleSlashes((this.baseItemUrl || "") + "/" + manifestPath);
+    this.#manifestUrl = new URL(uriToManifest, window.location.href).toString();
+    fetch(uriToManifest).then((response) => {
+      return response.json();
+    }).then((data) => {
+      this.manifest = data;
+      this.setupCES();
+    }).catch((err) => {
+      this._errorMessage = err;
+    });
+  }
+  /**
+   * Sets up the CES custom interaction by creating the iframe structure and
+   * handling the CES API communication via postMessage.
+   *
+   * For interactions that use CES, this method:
+   * 1. Fetches the original bootstrap.js and checks if it uses CES
+   * 2. If CES is used, fetches index.html and injects the registerCES proxy
+   * 3. Creates a blob URL for the modified HTML (stored in _contentBlobUrl)
+   * 4. Replaces bootstrap.js with ciBootstrap that loads the blob URL
+   * 5. Sets up postMessage listeners for CES API calls
+   */
+  async setupCES() {
+    await this.updateComplete;
+    const iframe = this.shadowRoot?.querySelector("#pciContainer");
+    if (!iframe) {
+      this._errorMessage = "pciContainer iframe not found";
+      return;
+    }
+    if (!iframe.getAttribute("src")) {
+      iframe.setAttribute("src", "about:blank");
+    }
+    let iframeDoc = iframe.contentDocument ?? iframe.contentWindow?.document ?? null;
+    if (!iframeDoc) {
+      await new Promise((resolve) => iframe.addEventListener("load", () => resolve(), { once: true }));
+      iframeDoc = iframe.contentDocument ?? iframe.contentWindow?.document ?? null;
+    }
+    if (!iframeDoc) {
+      this._errorMessage = "pciContainer iframe document not available";
+      return;
+    }
+    if (!this.manifest.script || this.manifest.script.length === 0) {
+      this._errorMessage = "No script found in manifest";
+      return;
+    }
+    if (!this.manifest.style || this.manifest.style.length === 0) {
+      this._errorMessage = "No style found in manifest";
+      return;
+    }
+    const cssRef = this.manifest.style[0];
+    const baseCandidates = this.#getBaseCandidates();
+    const cssResolved = await this.#resolveResourceWithFallback(cssRef, baseCandidates);
+    const cssUrl = cssResolved.url;
+    if (cssResolved.baseUrl && !this.#resourceBaseUrl) {
+      this.#resourceBaseUrl = cssResolved.baseUrl;
+    }
+    const usesCES = true;
+    if (usesCES) {
+      let indexUrl = "";
+      if (this.manifest.media && this.manifest.media.length > 0) {
+        const mediaRef = this.manifest.media[0];
+        const indexResolved = await this.#resolveResourceWithFallback(mediaRef, baseCandidates, {
+          returnText: true
+        });
+        indexUrl = indexResolved.url;
+        if (indexResolved.baseUrl && !this.#resourceBaseUrl) {
+          this.#resourceBaseUrl = indexResolved.baseUrl;
+        }
+        if (indexResolved.text) {
+          let html = indexResolved.text;
+          const alreadyModified = html.includes("postToParentWindows") || html.includes("window.CES");
+          if (!alreadyModified) {
+            const cesScript = "<script>" + registerCES + "</script>";
+            const headIndex = html.indexOf("<head>");
+            if (headIndex !== -1) {
+              html = html.slice(0, headIndex + 6) + cesScript + html.slice(headIndex + 6);
+            } else {
+              html = cesScript + html;
+            }
+          }
+          const blob = new Blob([html], { type: "text/html" });
+          this.#contentBlobUrl = URL.createObjectURL(blob);
+        }
+      } else {
+        const manifestPath = this.data || "manifest.json";
+        const basePath = manifestPath.includes("/") ? manifestPath.substring(0, manifestPath.lastIndexOf("/")) : "";
+        const indexPath = basePath ? `${basePath}/index.html` : "index.html";
+        const indexResolved = await this.#resolveResourceWithFallback(indexPath, baseCandidates, {
+          returnText: true
+        });
+        indexUrl = indexResolved.url;
+        if (indexResolved.baseUrl && !this.#resourceBaseUrl) {
+          this.#resourceBaseUrl = indexResolved.baseUrl;
+        }
+        if (indexResolved.text) {
+          let html = indexResolved.text;
+          const alreadyModified = html.includes("postToParentWindows") || html.includes("window.CES");
+          if (!alreadyModified) {
+            const cesScript = "<script>" + registerCES + "</script>";
+            const headIndex = html.indexOf("<head>");
+            if (headIndex !== -1) {
+              html = html.slice(0, headIndex + 6) + cesScript + html.slice(headIndex + 6);
+            } else {
+              html = cesScript + html;
+            }
+          }
+          const blob = new Blob([html], { type: "text/html" });
+          this.#contentBlobUrl = URL.createObjectURL(blob);
+        }
+      }
+      if (indexUrl && !this.#contentBlobUrl) {
+        try {
+          const indexResponse = await fetch(indexUrl);
+          if (indexResponse.ok) {
+            let html = await indexResponse.text();
+            const alreadyModified = html.includes("postToParentWindows") || html.includes("window.CES");
+            if (!alreadyModified) {
+              const cesScript = "<script>" + registerCES + "</script>";
+              const headIndex = html.indexOf("<head>");
+              if (headIndex !== -1) {
+                html = html.slice(0, headIndex + 6) + cesScript + html.slice(headIndex + 6);
+              } else {
+                html = cesScript + html;
+              }
+            }
+            const blob = new Blob([html], { type: "text/html" });
+            this.#contentBlobUrl = URL.createObjectURL(blob);
+          } else {
+            console.error(`Failed to fetch index.html: ${indexResponse.status}`);
+          }
+        } catch (e) {
+          console.error(`Error fetching index.html: ${e}`);
+        }
+      }
+    }
+    const inlineScript = `<script>${ciBootstrap}</script>`;
+    window.addEventListener("message", this.handlePostMessage);
+    const htmlContent = `
+      <!DOCTYPE html>
+      <html>
+        <head>
+          ${cssUrl ? `<link href='${cssUrl}' rel="stylesheet" />` : ""}
+          ${inlineScript}
+        </head>
+        <body></body>
+      </html>
+    `;
+    iframe.srcdoc = htmlContent;
+  }
+  #getIFrames() {
+    const iframesInShadowRoot = this.shadowRoot.querySelectorAll("iframe");
+    const iframe = this.querySelectorAll("iframe");
+    const outerIFrames = [...iframesInShadowRoot, ...iframe];
+    for (const iframe2 of outerIFrames) {
+      const iframeSrc = iframe2.src;
+      const isSameOrigin = new URL(iframeSrc, window.location.href).origin === window.location.origin;
+      if (isSameOrigin) {
+        try {
+          const outerDoc = iframe2.contentDocument || iframe2.contentWindow.document;
+          if (outerDoc) {
+            this.#getInnerIFrames(outerDoc, outerIFrames);
+          }
+        } catch (e) {
+          console.error("Error accessing nested iframe:", e);
+        }
+      }
+    }
+    outerIFrames.forEach((iframe2, index) => {
+      if (outerIFrames.indexOf(iframe2) !== index) {
+        outerIFrames.splice(index, 1);
+      }
+    });
+    return outerIFrames;
+  }
+  #getInnerIFrames(iframeDocument, iframes = []) {
+    const currentIframes = iframeDocument.querySelectorAll("iframe");
+    currentIframes.forEach((iframe) => {
+      iframes.push(iframe);
+      const iframeSrc = iframe.src;
+      const isSameOrigin = new URL(iframeSrc, window.location.href).origin === window.location.origin;
+      if (isSameOrigin) {
+        try {
+          const nestedDoc = iframe.contentDocument || iframe.contentWindow.document;
+          this.#getInnerIFrames(nestedDoc, iframes);
+        } catch (e) {
+          console.error("Error accessing nested iframe:", e);
+        }
+      } else {
+        console.warn("Skipped cross-origin iframe:", iframeSrc);
+      }
+    });
+    return iframes;
+  }
+  #postToWindowAndIframes(type, data) {
+    window.postMessage({ type, data }, "*");
+    const iframes = this.#getIFrames();
+    for (const iframe of iframes) {
+      if (iframe.contentWindow) {
+        iframe.contentWindow.postMessage({ type, data }, "*");
+      }
+    }
+  }
+  handlePostMessage(event) {
+    const { type, data } = event.data;
+    switch (type) {
+      case "setResponse":
+        if (data === null || !(Array.isArray(data) && data.length === 1 && data[0] === "")) {
+          this.#rawResponse = data;
+          this.saveResponse(data);
+        }
+        break;
+      case "getResponse": {
+        this.#postToWindowAndIframes("responseData", this.#rawResponse);
+        break;
+      }
+      case "getBlobUrl": {
+        if (this.#contentBlobUrl) {
+          this.#postToWindowAndIframes("blobUrl", this.#contentBlobUrl);
+          if (event.source && event.source !== window) {
+            event.source.postMessage({ type: "blobUrl", data: this.#contentBlobUrl }, "*");
+          }
+        }
+        break;
+      }
+      case "getMedia": {
+        const baseCandidates = this.#getBaseCandidates();
+        const mediaData = this.manifest.media.map((media) => {
+          if (media.startsWith("http") || media.startsWith("blob")) {
+            return media;
+          }
+          const baseUrl = this.#resourceBaseUrl || baseCandidates[0];
+          if (!baseUrl) {
+            return media;
+          }
+          return new URL(media, baseUrl.endsWith("/") ? baseUrl : `${baseUrl}/`).toString();
+        });
+        this.#postToWindowAndIframes("mediaData", mediaData);
+        break;
+      }
+      case "setStageHeight":
+        console.log("setStageHeight not implemented");
+        break;
+    }
+  }
+  validate() {
+    if (!this.#rawResponse) {
+      return false;
+    }
+    if (Array.isArray(this.#rawResponse)) {
+      if (this.#rawResponse.length === 0) {
+        return false;
+      }
+      for (const value of this.#rawResponse) {
+        if (value !== "" && value !== null) {
+          return true;
+        }
+      }
+    }
+    return true;
+  }
+  get response() {
+    return this.#rawResponse || null;
+  }
+  set response(val) {
+    if (typeof val === "string") {
+      this.#rawResponse = val;
+      this.saveResponse(val);
+    } else if (Array.isArray(val)) {
+      this.#rawResponse = val;
+    } else if (!val) {
+    } else {
+      throw new Error("Value must be a string or an array of strings");
+    }
+  }
+  disconnectedCallback() {
+    window.removeEventListener("message", this.handlePostMessage);
+    super.disconnectedCallback();
+  }
+  render() {
+    return T`<iframe
+        width=${this.getAttribute("width")}
+        height=${this.getAttribute("height")}
+        frameborder="0"
+        title="pciContainer"
+        id="pciContainer"
+      >
+      </iframe>
+      ${this._errorMessage && T`<div style="color:red">
+        <h1>Error</h1>
+        ${this._errorMessage}
+      </div>`}`;
+  }
+  #getBaseCandidates() {
+    const candidates = [this.#resourceBaseUrl, this.baseRefUrl, this.baseItemUrl, this.#getManifestBaseUrl()];
+    const resolved = candidates.filter(Boolean).map((base) => new URL(base, window.location.href).toString());
+    const manifestParent = this.#getManifestParentBaseUrl();
+    if (manifestParent) {
+      resolved.push(manifestParent);
+    }
+    return [...new Set(resolved)];
+  }
+  #getManifestBaseUrl() {
+    if (!this.#manifestUrl) {
+      return null;
+    }
+    return new URL(".", this.#manifestUrl).toString();
+  }
+  #getManifestParentBaseUrl() {
+    if (!this.#manifestUrl) {
+      return null;
+    }
+    return new URL("..", this.#manifestUrl).toString();
+  }
+  async #resolveResourceWithFallback(ref, baseCandidates, options = {}) {
+    if (!ref) {
+      return { url: "", baseUrl: null };
+    }
+    if (ref.startsWith("http") || ref.startsWith("blob")) {
+      return { url: ref, baseUrl: null };
+    }
+    for (const base of baseCandidates) {
+      const baseUrl = new URL(base, window.location.href).toString();
+      const url = new URL(ref, baseUrl.endsWith("/") ? baseUrl : `${baseUrl}/`).toString();
+      try {
+        const response = await fetch(url);
+        if (response.ok) {
+          if (options.returnText) {
+            const text = await response.text();
+            return { url, baseUrl, text };
+          }
+          return { url, baseUrl };
+        }
+      } catch (e) {
+      }
+    }
+    return { url: "", baseUrl: null };
+  }
+};
+__decorate5([
+  n({ type: String, attribute: "data" })
+], QtiCustomInteraction.prototype, "data", void 0);
+__decorate5([
+  n({ type: String, attribute: "data-base-item" })
+], QtiCustomInteraction.prototype, "baseItemUrl", void 0);
+__decorate5([
+  n({ type: String, attribute: "data-base-ref" })
+], QtiCustomInteraction.prototype, "baseRefUrl", void 0);
+__decorate5([
+  n({ type: String, attribute: "id" })
+], QtiCustomInteraction.prototype, "id", void 0);
+__decorate5([
+  r()
+], QtiCustomInteraction.prototype, "_errorMessage", void 0);
+
+// ../interactions/end-attempt-interaction/dist/qti-end-attempt-interaction.styles.js
+var qti_end_attempt_interaction_styles_default = [boxSizing];
+
+// ../interactions/end-attempt-interaction/dist/qti-end-attempt-interaction.js
+var __decorate6 = function(decorators, target, key, desc) {
+  var c3 = arguments.length, r2 = c3 < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r2 = Reflect.decorate(decorators, target, key, desc);
+  else for (var i3 = decorators.length - 1; i3 >= 0; i3--) if (d = decorators[i3]) r2 = (c3 < 3 ? d(r2) : c3 > 3 ? d(target, key, r2) : d(target, key)) || r2;
+  return c3 > 3 && r2 && Object.defineProperty(target, key, r2), r2;
+};
+var QtiEndAttemptInteraction = class extends i2 {
+  constructor() {
+    super(...arguments);
+    this.disabled = false;
+    this.countAttempt = null;
+    this.title = "end attempt";
+  }
+  static {
+    this.styles = qti_end_attempt_interaction_styles_default;
+  }
+  render() {
+    return T`<button ?disabled=${this.disabled} part="button" @click=${this.endAttempt}>${this.title}</button>`;
+  }
+  endAttempt(_) {
+    this.dispatchEvent(new CustomEvent("end-attempt", {
+      bubbles: true,
+      composed: true,
+      detail: { responseIdentifier: this.responseIdentifier, countAttempt: this.countAttempt === "true" }
+    }));
+  }
+};
+__decorate6([
+  n({ type: String, attribute: "response-identifier" })
+], QtiEndAttemptInteraction.prototype, "responseIdentifier", void 0);
+__decorate6([
+  n({ reflect: true, type: Boolean })
+], QtiEndAttemptInteraction.prototype, "disabled", void 0);
+__decorate6([
+  n({ type: String, attribute: "count-attempt" })
+], QtiEndAttemptInteraction.prototype, "countAttempt", void 0);
+__decorate6([
+  n({ type: String })
+], QtiEndAttemptInteraction.prototype, "title", void 0);
+
+// ../interactions/media-interaction/dist/qti-media-interaction.styles.js
+var qti_media_interaction_styles_default = [
+  boxSizing,
+  i`
+    /* The box this element already had. See the note in qti-match-interaction.styles.ts. */
+    :host {
+      display: block;
+    }
+  `
+];
+
+// ../interactions/media-interaction/dist/qti-media-interaction.js
+var QtiMediaInteraction = class extends Interaction {
+  static {
+    this.styles = qti_media_interaction_styles_default;
+  }
+  #value = null;
+  reset() {
+    this.#value = null;
+  }
+  validate() {
+    return true;
+  }
+  get response() {
+    return this.#value ? this.#value.toString() : null;
+  }
+  set response(val) {
+    if (val) {
+      const isNumber = !isNaN(parseInt(val?.toString()));
+      if (isNumber) {
+        this.#value = parseInt(val.toString());
+      } else {
+        throw new Error(`Value must be a number ${val}`);
+      }
+    }
+  }
+  static get properties() {
+    return {
+      ...Interaction.properties,
+      ...{
+        step: {
+          type: Number,
+          attribute: "step",
+          default: 10
+        }
+      }
+    };
+  }
+  render() {
+    return T` <slot name="prompt"></slot>
+      <slot></slot>`;
+  }
+  constructor() {
+    super();
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    const mediaObject = this.querySelector("audio") || this.querySelector("video") || this.querySelector("object");
+    if (mediaObject) {
+      mediaObject.addEventListener("ended", () => {
+        this.#value++;
+        this.saveResponse(this.value);
+      });
+    }
+  }
+};
+
+// ../interactions/position-object-interaction/dist/qti-position-object-interaction.styles.js
+var qti_position_object_interaction_styles_default = [
+  boxSizing,
+  i`
+    :host {
+      display: block;
+    }
+    ::slotted(img) {
+      position: absolute;
+      cursor: move;
+      user-select: none;
+      left: 50%;
+      transform: translateX(-50%);
+    }
+  `
+];
+
+// ../interactions/position-object-interaction/dist/qti-position-object-interaction.js
+var QtiPositionObjectInteraction = class extends i2 {
+  static {
+    this.styles = qti_position_object_interaction_styles_default;
+  }
+  render() {
+    return T`<slot></slot>`;
+  }
+};
+
+// ../interactions/position-object-interaction/dist/qti-position-object-stage.styles.js
+var qti_position_object_stage_styles_default = [
+  boxSizing,
+  i`
+    :host {
+      display: inline-block;
+      position: relative;
+    }
+  `
+];
+
+// ../interactions/position-object-interaction/dist/qti-position-object-stage.js
+var QtiPositionObjectStage = class extends i2 {
+  static {
+    this.styles = qti_position_object_stage_styles_default;
+  }
+  render() {
+    return T`<slot></slot>`;
+  }
+  constructor() {
+    super();
+    this.removeMoveListener = this.removeMoveListener.bind(this);
+    this.dragElementHandler = this.dragElementHandler.bind(this);
+  }
+  // Define a function to handle the mousemove event on the draggable element
+  dragElementHandler(event) {
+    event.preventDefault();
+    const deltaX = event.clientX - this.startX;
+    const deltaY = event.clientY - this.startY;
+    this.dragElement.style.left = this.dragElement.offsetLeft + deltaX + "px";
+    this.dragElement.style.top = this.dragElement.offsetTop + deltaY + "px";
+    this.startX = event.clientX;
+    this.startY = event.clientY;
+  }
+  firstUpdated(a) {
+    super.firstUpdated(a);
+    this.dragElement = this.querySelector("qti-position-object-interaction>img");
+    this.startX = 0;
+    this.startY = 0;
+    this.dragElement.addEventListener("mousedown", (event) => {
+      this.startX = event.clientX;
+      this.startY = event.clientY;
+      document.addEventListener("mousemove", this.dragElementHandler, true);
+    });
+    document.addEventListener("mouseup", this.removeMoveListener);
+  }
+  removeMoveListener() {
+    document.removeEventListener("mousemove", this.dragElementHandler, true);
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    document.removeEventListener("mousemove", this.dragElementHandler);
+    document.removeEventListener("mouseup", this.removeMoveListener);
+  }
+};
+
+// ../interactions/upload-interaction/dist/qti-upload-interaction.styles.js
+var qti_upload_interaction_styles_default = [
+  boxSizing,
+  i`
+    :host {
+      display: block;
+      margin: 1em 0;
+    }
+    input[type='file'] {
+      display: block;
+      margin-top: 0.5em;
+    }
+  `
+];
+
+// ../interactions/upload-interaction/dist/qti-upload-interaction.js
+var QtiUploadInteraction = class extends Interaction {
+  static {
+    this.styles = qti_upload_interaction_styles_default;
+  }
+  #file = null;
+  #base64 = null;
+  reset() {
+    this.#file = null;
+    this.#base64 = null;
+    this.saveResponse(null);
+  }
+  validate() {
+    return this.#base64 !== null;
+  }
+  get response() {
+    return this.#base64;
+  }
+  set response(base64) {
+    if (typeof base64 === "string") {
+      this.#base64 = base64;
+      this.saveResponse(base64);
+    } else if (base64 === null) {
+      this.reset();
+    } else {
+      throw new Error("Value must be a Base64-encoded string or null");
+    }
+  }
+  static get properties() {
+    return {
+      ...Interaction.properties
+    };
+  }
+  render() {
+    return T`
+      <div>
+        <slot name="prompt"></slot>
+        <input type="file" @change="${this.#onFileChange}" ?disabled="${this.disabled}" ?readonly="${this.readonly}" />
+      </div>
+    `;
+  }
+  async #onFileChange(event) {
+    const input = event.target;
+    if (input.files && input.files.length > 0) {
+      this.#file = input.files[0];
+      this.#base64 = await this.#convertToBase64(this.#file);
+      this.saveResponse(this.#base64);
+      this.dispatchEvent(new CustomEvent("qti-interaction-response", {
+        detail: { response: this.#base64 }
+      }));
+    }
+  }
+  #convertToBase64(file) {
+    return new Promise((resolve, reject) => {
+      const reader = new FileReader();
+      reader.onload = () => resolve(reader.result);
+      reader.onerror = () => reject(reader.error);
+      reader.readAsDataURL(file);
+    });
+  }
+};
+
+// ../interactions/core/dist/elements/qti-associable-hotspot/elements.js
+var elements17 = [{ tag: "qti-associable-hotspot", ctor: QtiAssociableHotspot }];
+
+// ../interactions/core/dist/elements/qti-gap/elements.js
+var elements18 = [{ tag: "qti-gap", ctor: QtiGap }];
+
+// ../interactions/core/dist/elements/qti-gap-img/elements.js
+var elements19 = [{ tag: "qti-gap-img", ctor: QtiGapImg }];
+
+// ../interactions/core/dist/elements/qti-gap-text/elements.js
+var elements20 = [{ tag: "qti-gap-text", ctor: QtiGapText }];
+
+// ../interactions/core/dist/elements/qti-hotspot-choice/elements.js
+var elements21 = [{ tag: "qti-hotspot-choice", ctor: QtiHotspotChoice }];
+
+// ../interactions/core/dist/elements/qti-hottext/elements.js
+var elements22 = [{ tag: "qti-hottext", ctor: QtiHottext }];
+
+// ../interactions/core/dist/elements/qti-inline-choice/elements.js
+var elements23 = [{ tag: "qti-inline-choice", ctor: QtiInlineChoice }];
+
+// ../interactions/core/dist/elements/qti-prompt/elements.js
+var elements24 = [{ tag: "qti-prompt", ctor: QtiPrompt }];
+
+// ../interactions/core/dist/elements/qti-simple-associable-choice/elements.js
+var elements25 = [{ tag: "qti-simple-associable-choice", ctor: QtiSimpleAssociableChoice }];
+
+// ../interactions/core/dist/elements/qti-simple-choice/elements.js
+var elements26 = [{ tag: "qti-simple-choice", ctor: QtiSimpleChoice }];
+
+// ../interactions/core/dist/elements.js
+var qtiInteractionCoreElements = [
+  ...elements17,
+  ...elements18,
+  ...elements19,
+  ...elements20,
+  ...elements21,
+  ...elements22,
+  ...elements23,
+  ...elements24,
+  ...elements25,
+  ...elements26
+];
+
+// ../interactions/custom-interaction/dist/elements.js
+var elements27 = [{ tag: "qti-custom-interaction", ctor: QtiCustomInteraction }];
+
+// ../interactions/end-attempt-interaction/dist/elements.js
+var elements28 = [{ tag: "qti-end-attempt-interaction", ctor: QtiEndAttemptInteraction }];
+
+// ../interactions/media-interaction/dist/elements.js
+var elements29 = [{ tag: "qti-media-interaction", ctor: QtiMediaInteraction }];
+
+// ../interactions/position-object-interaction/dist/elements.js
+var elements30 = [
+  { tag: "qti-position-object-interaction", ctor: QtiPositionObjectInteraction },
+  { tag: "qti-position-object-stage", ctor: QtiPositionObjectStage }
+];
+
+// ../interactions/upload-interaction/dist/elements.js
+var elements31 = [{ tag: "qti-upload-interaction", ctor: QtiUploadInteraction }];
+
+// ../qti-interactions/dist/elements.js
+var qtiInteractionElements = [
+  ...qtiInteractionCoreElements,
+  ...elements,
+  ...elements2,
+  ...elements27,
+  ...elements28,
+  ...elements3,
+  ...elements4,
+  ...elements5,
+  ...elements6,
+  ...elements7,
+  ...elements8,
+  ...elements9,
+  ...elements10,
+  ...elements11,
+  ...elements29,
+  ...elements12,
+  ...elements13,
+  ...elements30,
+  ...elements14,
+  ...elements15,
+  ...elements16,
+  ...elements31
+];
+
+// ../qti-interactions/dist/register-all.js
+for (const { tag, ctor } of qtiInteractionElements) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/associate-interaction/dist/register.js
+for (const { tag, ctor } of elements) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/choice-interaction/dist/register.js
+for (const { tag, ctor } of elements2) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/custom-interaction/dist/register.js
+for (const { tag, ctor } of elements27) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/end-attempt-interaction/dist/register.js
+for (const { tag, ctor } of elements28) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/extended-text-interaction/dist/register.js
+for (const { tag, ctor } of elements3) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/gap-match-interaction/dist/register.js
+for (const { tag, ctor } of elements4) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/graphic-associate-interaction/dist/register.js
+for (const { tag, ctor } of elements5) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/graphic-gap-match-interaction/dist/register.js
+for (const { tag, ctor } of elements6) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/graphic-order-interaction/dist/register.js
+for (const { tag, ctor } of elements7) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/hotspot-interaction/dist/register.js
+for (const { tag, ctor } of elements8) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/hottext-interaction/dist/register.js
+for (const { tag, ctor } of elements9) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/inline-choice-interaction/dist/register.js
+for (const { tag, ctor } of elements10) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/match-interaction/dist/register.js
+for (const { tag, ctor } of elements11) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/media-interaction/dist/register.js
+for (const { tag, ctor } of elements29) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/order-interaction/dist/register.js
+for (const { tag, ctor } of elements12) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/portable-custom-interaction/dist/register.js
+for (const { tag, ctor } of elements13) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/position-object-interaction/dist/register.js
+for (const { tag, ctor } of elements30) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/select-point-interaction/dist/register.js
+for (const { tag, ctor } of elements14) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/slider-interaction/dist/register.js
+for (const { tag, ctor } of elements15) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/text-entry-interaction/dist/register.js
+for (const { tag, ctor } of elements16) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+// ../interactions/upload-interaction/dist/register.js
+for (const { tag, ctor } of elements31) {
+  if (!customElements.get(tag)) {
+    customElements.define(tag, ctor);
+  }
+}
+
+export {
+  QtiAssociableHotspot,
+  QtiGap,
+  QtiGapImg,
+  QtiInlineChoice,
+  QtiPrompt,
+  QtiCustomInteraction,
+  QtiEndAttemptInteraction,
+  QtiMediaInteraction,
+  QtiPositionObjectInteraction,
+  QtiPositionObjectStage,
+  QtiUploadInteraction,
+  qtiInteractionElements
+};
+//# sourceMappingURL=chunk-5QYII4OZ.js.map