@citolab/qti-components 7.1.6 → 7.2.0

package/dist/chunks/chunk-4EXSIVXY.js

@@ -0,0 +1,68 @@
+import {
+  sessionContext
+} from "./chunk-UZ4QB5IO.js";
+import {
+  __decorateClass
+} from "./chunk-H2JE6IVU.js";
+
+// src/lib/qti-test/components/test-view-toggle.ts
+import { consume } from "@lit/context";
+import { html, LitElement } from "lit";
+import { customElement, property } from "lit/decorators.js";
+var TestViewToggle = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.viewOptions = ["candidate", "scorer", ""];
+  }
+  createRenderRoot() {
+    return this;
+  }
+  _switchView(view) {
+    this.dispatchEvent(
+      new CustomEvent("on-test-switch-view", {
+        composed: true,
+        bubbles: true,
+        detail: view
+      })
+    );
+  }
+  render() {
+    return html`
+      <!-- <label for="viewToggle" part="label"> -->
+      <input
+        type="checkbox"
+        role="switch"
+        aria-checked=${this.sessionContext?.view === "scorer"}
+        id="viewToggle"
+        class=${`${this.classForInput}`}
+        ?checked=${this.sessionContext?.view === "scorer"}
+        @change=${(e) => {
+      const el = e.target;
+      if (el.checked) {
+        this._switchView("scorer");
+      } else {
+        this._switchView("candidate");
+      }
+    }}
+      />
+      <!-- for switch -->
+      <!-- <span class="toggle" part="toggle"></span> -->
+      <!-- <slot></slot> -->
+      <!-- </label> -->
+    `;
+  }
+};
+__decorateClass([
+  property({ type: String, reflect: true, attribute: "class-for-input" })
+], TestViewToggle.prototype, "classForInput", 2);
+__decorateClass([
+  consume({ context: sessionContext, subscribe: true })
+], TestViewToggle.prototype, "sessionContext", 2);
+TestViewToggle = __decorateClass([
+  customElement("test-view-toggle")
+], TestViewToggle);
+
+export {
+  TestViewToggle
+};
+//# sourceMappingURL=chunk-4EXSIVXY.js.map

package/dist/chunks/chunk-4EXSIVXY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lib/qti-test/components/test-view-toggle.ts"],"sourcesContent":["import { consume } from '@lit/context';\nimport { html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { sessionContext } from '../../exports/session.context';\n\nimport type { SessionContext } from '../../exports/session.context';\n\n@customElement('test-view-toggle')\nexport class TestViewToggle extends LitElement {\n  protected createRenderRoot(): HTMLElement | DocumentFragment {\n    return this;\n  }\n\n  @property({ type: String, reflect: true, attribute: 'class-for-input' })\n  classForInput: string;\n\n  @consume({ context: sessionContext, subscribe: true })\n  private sessionContext: SessionContext;\n\n  viewOptions = ['candidate', 'scorer', ''];\n\n  _switchView(view: string) {\n    this.dispatchEvent(\n      new CustomEvent('on-test-switch-view', {\n        composed: true,\n        bubbles: true,\n        detail: view\n      })\n    );\n  }\n\n  render() {\n    return html`\n      <!-- <label for=\"viewToggle\" part=\"label\"> -->\n      <input\n        type=\"checkbox\"\n        role=\"switch\"\n        aria-checked=${this.sessionContext?.view === 'scorer'}\n        id=\"viewToggle\"\n        class=${`${this.classForInput}`}\n        ?checked=${this.sessionContext?.view === 'scorer'}\n        @change=${(e: Event) => {\n          const el = e.target as HTMLInputElement;\n          if (el.checked) {\n            this._switchView('scorer');\n          } else {\n            this._switchView('candidate');\n          }\n        }}\n      />\n      <!-- for switch -->\n      <!-- <span class=\"toggle\" part=\"toggle\"></span> -->\n      <!-- <slot></slot> -->\n      <!-- </label> -->\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'test-view-toggle': TestViewToggle;\n  }\n}\n"],"mappings":";;;;;;;;AAAA,SAAS,eAAe;AACxB,SAAS,MAAM,kBAAkB;AACjC,SAAS,eAAe,gBAAgB;AAOjC,IAAM,iBAAN,cAA6B,WAAW;AAAA,EAAxC;AAAA;AAWL,uBAAc,CAAC,aAAa,UAAU,EAAE;AAAA;AAAA,EAV9B,mBAAmD;AAC3D,WAAO;AAAA,EACT;AAAA,EAUA,YAAY,MAAc;AACxB,SAAK;AAAA,MACH,IAAI,YAAY,uBAAuB;AAAA,QACrC,UAAU;AAAA,QACV,SAAS;AAAA,QACT,QAAQ;AAAA,MACV,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEA,SAAS;AACP,WAAO;AAAA;AAAA;AAAA;AAAA;AAAA,uBAKY,KAAK,gBAAgB,SAAS,QAAQ;AAAA;AAAA,gBAE7C,GAAG,KAAK,aAAa,EAAE;AAAA,mBACpB,KAAK,gBAAgB,SAAS,QAAQ;AAAA,kBACvC,CAAC,MAAa;AACtB,YAAM,KAAK,EAAE;AACb,UAAI,GAAG,SAAS;AACd,aAAK,YAAY,QAAQ;AAAA,MAC3B,OAAO;AACL,aAAK,YAAY,WAAW;AAAA,MAC9B;AAAA,IACF,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAOP;AACF;AA1CE;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,SAAS,MAAM,WAAW,kBAAkB,CAAC;AAAA,GAL5D,eAMX;AAGQ;AAAA,EADP,QAAQ,EAAE,SAAS,gBAAgB,WAAW,KAAK,CAAC;AAAA,GAR1C,eASH;AATG,iBAAN;AAAA,EADN,cAAc,kBAAkB;AAAA,GACpB;","names":[]}

package/dist/chunks/chunk-4JL6LXWC.js

@@ -0,0 +1,94 @@
+import {
+  item_default
+} from "./chunk-NQPY5GBW.js";
+import {
+  watch
+} from "./chunk-ELDMXTUQ.js";
+import {
+  qtiTransformItem
+} from "./chunk-H4XZSMVR.js";
+import {
+  __decorateClass
+} from "./chunk-H2JE6IVU.js";
+
+// src/lib/qti-item/components/item-container.ts
+import { LitElement, html } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { until } from "lit/directives/until.js";
+var ItemContainer = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.itemURL = null;
+    this.itemDoc = null;
+    this.itemXML = null;
+    /** Template content if provided */
+    this.templateContent = null;
+  }
+  async handleItemURLChange() {
+    if (!this.itemURL) return;
+    try {
+      const { api } = await qtiTransformItem().load(this.itemURL);
+      this.itemDoc = (await api).htmlDoc();
+    } catch (error) {
+      console.error("Error loading or parsing XML:", error);
+    }
+  }
+  handleItemXMLChange() {
+    if (!this.itemXML) return;
+    try {
+      this.itemDoc = qtiTransformItem().parse(this.itemXML).htmlDoc();
+    } catch (error) {
+      console.error("Error parsing XML:", error);
+    }
+  }
+  async connectedCallback() {
+    super.connectedCallback();
+    this.initializeTemplateContent();
+    this.applyStyles();
+    if (this.itemURL) {
+      this.handleItemURLChange();
+    }
+    if (this.itemXML) {
+      this.handleItemXMLChange();
+    }
+  }
+  initializeTemplateContent() {
+    const template = this.querySelector("template");
+    this.templateContent = template ? template.content : html``;
+  }
+  applyStyles() {
+    const sheet = new CSSStyleSheet();
+    sheet.replaceSync(item_default);
+    this.shadowRoot.adoptedStyleSheets = [sheet];
+  }
+  render() {
+    return html`
+      ${this.templateContent}
+      <slot></slot>
+      ${until(this.itemDoc, html`<span>Loading...</span>`)}
+    `;
+  }
+};
+__decorateClass([
+  property({ type: String, attribute: "item-url" })
+], ItemContainer.prototype, "itemURL", 2);
+__decorateClass([
+  state()
+], ItemContainer.prototype, "itemDoc", 2);
+__decorateClass([
+  state()
+], ItemContainer.prototype, "itemXML", 2);
+__decorateClass([
+  watch("itemURL", { waitUntilFirstUpdate: true })
+], ItemContainer.prototype, "handleItemURLChange", 1);
+__decorateClass([
+  watch("itemXML", { waitUntilFirstUpdate: true })
+], ItemContainer.prototype, "handleItemXMLChange", 1);
+ItemContainer = __decorateClass([
+  customElement("item-container")
+], ItemContainer);
+
+export {
+  ItemContainer
+};
+//# sourceMappingURL=chunk-4JL6LXWC.js.map

package/dist/chunks/chunk-4JL6LXWC.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lib/qti-item/components/item-container.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { until } from 'lit/directives/until.js';\n\nimport { watch } from '../../decorators/watch';\nimport itemCss from '../../../item.css?inline';\nimport { qtiTransformItem } from '../../qti-transformers';\n\n/**\n * `<item-container>` is a custom element designed for hosting the qti-assessment-item.\n * The `qti-assessment-item` will be placed inside the shadow DOM of this element.\n * The element loads the item from the provided URL and renders it inside the shadow DOM.\n *\n * ### Styling\n * Add a class to the element for styling.\n *\n * ```html\n * <qti-item>\n *   <item-container class=\"m-4 bg-white\" item-url=\"./path/to/item.xml\"></item-container>\n * </qti-item>\n * ```\n */\n@customElement('item-container')\nexport class ItemContainer extends LitElement {\n  /** URL of the item to load */\n  @property({ type: String, attribute: 'item-url' })\n  itemURL: string = null;\n\n  /** A parsed HTML document */\n  @state()\n  itemDoc: DocumentFragment = null;\n\n  /** The raw XML string */\n  @state()\n  itemXML: string = null;\n\n  /** Template content if provided */\n  private templateContent = null;\n\n  @watch('itemURL', { waitUntilFirstUpdate: true })\n  protected async handleItemURLChange() {\n    if (!this.itemURL) return;\n    try {\n      const { api } = await qtiTransformItem().load(this.itemURL);\n      this.itemDoc = (await api).htmlDoc();\n    } catch (error) {\n      console.error('Error loading or parsing XML:', error);\n    }\n  }\n\n  @watch('itemXML', { waitUntilFirstUpdate: true })\n  protected handleItemXMLChange() {\n    if (!this.itemXML) return;\n    try {\n      this.itemDoc = qtiTransformItem().parse(this.itemXML).htmlDoc();\n    } catch (error) {\n      console.error('Error parsing XML:', error);\n    }\n  }\n\n  async connectedCallback(): Promise<void> {\n    super.connectedCallback();\n    this.initializeTemplateContent();\n    this.applyStyles();\n    if (this.itemURL) {\n      this.handleItemURLChange();\n    }\n    if (this.itemXML) {\n      this.handleItemXMLChange();\n    }\n  }\n\n  private initializeTemplateContent() {\n    const template = this.querySelector('template') as HTMLTemplateElement;\n    this.templateContent = template ? template.content : html``;\n  }\n\n  private applyStyles() {\n    const sheet = new CSSStyleSheet();\n    sheet.replaceSync(itemCss);\n    this.shadowRoot.adoptedStyleSheets = [sheet];\n  }\n\n  render() {\n    return html`\n      ${this.templateContent}\n      <slot></slot>\n      ${until(this.itemDoc, html`<span>Loading...</span>`)}\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'item-container': ItemContainer;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;AAAA,SAAS,YAAY,YAAY;AACjC,SAAS,eAAe,UAAU,aAAa;AAC/C,SAAS,aAAa;AAqBf,IAAM,gBAAN,cAA4B,WAAW;AAAA,EAAvC;AAAA;AAGL,mBAAkB;AAIlB,mBAA4B;AAI5B,mBAAkB;AAGlB;AAAA,SAAQ,kBAAkB;AAAA;AAAA,EAG1B,MAAgB,sBAAsB;AACpC,QAAI,CAAC,KAAK,QAAS;AACnB,QAAI;AACF,YAAM,EAAE,IAAI,IAAI,MAAM,iBAAiB,EAAE,KAAK,KAAK,OAAO;AAC1D,WAAK,WAAW,MAAM,KAAK,QAAQ;AAAA,IACrC,SAAS,OAAO;AACd,cAAQ,MAAM,iCAAiC,KAAK;AAAA,IACtD;AAAA,EACF;AAAA,EAGU,sBAAsB;AAC9B,QAAI,CAAC,KAAK,QAAS;AACnB,QAAI;AACF,WAAK,UAAU,iBAAiB,EAAE,MAAM,KAAK,OAAO,EAAE,QAAQ;AAAA,IAChE,SAAS,OAAO;AACd,cAAQ,MAAM,sBAAsB,KAAK;AAAA,IAC3C;AAAA,EACF;AAAA,EAEA,MAAM,oBAAmC;AACvC,UAAM,kBAAkB;AACxB,SAAK,0BAA0B;AAC/B,SAAK,YAAY;AACjB,QAAI,KAAK,SAAS;AAChB,WAAK,oBAAoB;AAAA,IAC3B;AACA,QAAI,KAAK,SAAS;AAChB,WAAK,oBAAoB;AAAA,IAC3B;AAAA,EACF;AAAA,EAEQ,4BAA4B;AAClC,UAAM,WAAW,KAAK,cAAc,UAAU;AAC9C,SAAK,kBAAkB,WAAW,SAAS,UAAU;AAAA,EACvD;AAAA,EAEQ,cAAc;AACpB,UAAM,QAAQ,IAAI,cAAc;AAChC,UAAM,YAAY,YAAO;AACzB,SAAK,WAAW,qBAAqB,CAAC,KAAK;AAAA,EAC7C;AAAA,EAEA,SAAS;AACP,WAAO;AAAA,QACH,KAAK,eAAe;AAAA;AAAA,QAEpB,MAAM,KAAK,SAAS,6BAA6B,CAAC;AAAA;AAAA,EAExD;AACF;AAhEE;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,WAAW,CAAC;AAAA,GAFtC,cAGX;AAIA;AAAA,EADC,MAAM;AAAA,GANI,cAOX;AAIA;AAAA,EADC,MAAM;AAAA,GAVI,cAWX;AAMgB;AAAA,EADf,MAAM,WAAW,EAAE,sBAAsB,KAAK,CAAC;AAAA,GAhBrC,cAiBK;AAWN;AAAA,EADT,MAAM,WAAW,EAAE,sBAAsB,KAAK,CAAC;AAAA,GA3BrC,cA4BD;AA5BC,gBAAN;AAAA,EADN,cAAc,gBAAgB;AAAA,GAClB;","names":[]}

package/dist/chunks/chunk-4TQ3YR2O.js

@@ -0,0 +1,31 @@
+import {
+  qtiTransformItem,
+  qtiTransformManifest,
+  qtiTransformTest
+} from "./chunk-3YVVZ2MO.js";
+
+// src/lib/qti-loader/qti-loader.ts
+var getManifestInfo = async (manifestURL) => {
+  const baseURI = manifestURL.substring(0, manifestURL.lastIndexOf("/"));
+  const test = await qtiTransformManifest().load(`${manifestURL}`).then((api) => api.assessmentTest());
+  const testHTMLDoc = await qtiTransformTest().load(`${baseURI}/${test.href}`).then((api) => api.htmlDoc());
+  const items = await qtiTransformTest().load(`${baseURI}/${test.href}`).then((api) => api.items());
+  const testURL = `${baseURI}/${test.href}`;
+  const testURI = `${baseURI}/${test.href.substring(0, test.href.lastIndexOf("/"))}`;
+  return {
+    testHTMLDoc,
+    testURI,
+    testURL,
+    items,
+    testIdentifier: test.identifier
+  };
+};
+var getItemByUri = async (itemUri) => {
+  return qtiTransformItem().load(itemUri).then((api) => api.htmlDoc().firstElementChild);
+};
+
+export {
+  getManifestInfo,
+  getItemByUri
+};
+//# sourceMappingURL=chunk-4TQ3YR2O.js.map

package/dist/chunks/chunk-4TQ3YR2O.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lib/qti-loader/qti-loader.ts"],"sourcesContent":["import { qtiTransformItem, qtiTransformTest } from '../qti-transformers';\nimport { qtiTransformManifest } from '../qti-transformers/qti-transform-manifest';\n\nimport type { QtiAssessmentItem } from '../qti-components';\n\nexport type ManifestInfo = {\n  testIdentifier: string;\n  testHTMLDoc: DocumentFragment;\n  testURI: string;\n  testURL: string;\n  items: {\n    identifier: string;\n    href: string;\n    category: string;\n  }[];\n};\n\n// Utility function to ensure package URIs end with a '/'\n// const normalizeUri = (uri: string) => (uri.endsWith('/') ? uri : `${uri}/`);\n\n// Fetches assessment data from the manifest\nexport const getManifestInfo = async (manifestURL: string): Promise<ManifestInfo> => {\n  const baseURI = manifestURL.substring(0, manifestURL.lastIndexOf('/'));\n\n  const test = await qtiTransformManifest()\n    .load(`${manifestURL}`)\n    .then(api => api.assessmentTest());\n\n  const testHTMLDoc = await qtiTransformTest()\n    .load(`${baseURI}/${test.href}`)\n    .then(api => api.htmlDoc());\n\n  const items = await qtiTransformTest()\n    .load(`${baseURI}/${test.href}`)\n    .then(api => api.items());\n\n  const testURL = `${baseURI}/${test.href}`;\n  const testURI = `${baseURI}/${test.href.substring(0, test.href.lastIndexOf('/'))}`;\n\n  return {\n    testHTMLDoc,\n    testURI,\n    testURL,\n    items,\n    testIdentifier: test.identifier\n  };\n};\n\n// Fetches a single item by URI\nexport const getItemByUri = async (itemUri: string): Promise<QtiAssessmentItem> => {\n  return qtiTransformItem()\n    .load(itemUri)\n    .then(api => api.htmlDoc().firstElementChild as QtiAssessmentItem);\n};\n"],"mappings":";;;;;;;AAqBO,IAAM,kBAAkB,OAAO,gBAA+C;AACnF,QAAM,UAAU,YAAY,UAAU,GAAG,YAAY,YAAY,GAAG,CAAC;AAErE,QAAM,OAAO,MAAM,qBAAqB,EACrC,KAAK,GAAG,WAAW,EAAE,EACrB,KAAK,SAAO,IAAI,eAAe,CAAC;AAEnC,QAAM,cAAc,MAAM,iBAAiB,EACxC,KAAK,GAAG,OAAO,IAAI,KAAK,IAAI,EAAE,EAC9B,KAAK,SAAO,IAAI,QAAQ,CAAC;AAE5B,QAAM,QAAQ,MAAM,iBAAiB,EAClC,KAAK,GAAG,OAAO,IAAI,KAAK,IAAI,EAAE,EAC9B,KAAK,SAAO,IAAI,MAAM,CAAC;AAE1B,QAAM,UAAU,GAAG,OAAO,IAAI,KAAK,IAAI;AACvC,QAAM,UAAU,GAAG,OAAO,IAAI,KAAK,KAAK,UAAU,GAAG,KAAK,KAAK,YAAY,GAAG,CAAC,CAAC;AAEhF,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,KAAK;AAAA,EACvB;AACF;AAGO,IAAM,eAAe,OAAO,YAAgD;AACjF,SAAO,iBAAiB,EACrB,KAAK,OAAO,EACZ,KAAK,SAAO,IAAI,QAAQ,EAAE,iBAAsC;AACrE;","names":[]}