@citolab/qti-components 7.3.18 → 7.3.20

package/dist/chunks/chunk-EBODGAT7.js

@@ -0,0 +1,113 @@
+import {
+  __decorateClass
+} from "./chunk-H2JE6IVU.js";
+
+// src/lib/exports/interaction.ts
+import { property, state } from "lit/decorators.js";
+import { LitElement } from "lit";
+var Interaction = class extends LitElement {
+  constructor() {
+    super();
+    this.disabled = false;
+    this.readonly = false;
+    this._isCorrect = null;
+    this._internals = this.attachInternals();
+  }
+  get correctResponse() {
+    return this._correctResponse;
+  }
+  set correctResponse(val) {
+    this._correctResponse = val;
+  }
+  get isCorrect() {
+    return this._isCorrect;
+  }
+  set isCorrect(val) {
+    this._isCorrect = val;
+  }
+  toggleCorrectResponse(responseVariable, show) {
+    this.correctResponse = show ? responseVariable?.correctResponse : responseVariable?.cardinality === "single" ? "" : [];
+  }
+  toggleCandidateCorrection(responseVariable, show) {
+    this.isCorrect = show ? responseVariable.correctResponse === responseVariable.value : null;
+    this._internals.states.delete("candidate-correct");
+    this._internals.states.delete("candidate-incorrect");
+    if (this.isCorrect === true) {
+      this._internals.states.add("candidate-correct");
+    }
+    if (this.isCorrect === false) {
+      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();
+    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
+        }
+      })
+    );
+  }
+};
+Interaction.formAssociated = true;
+__decorateClass([
+  property({ type: String, attribute: "response-identifier" })
+], Interaction.prototype, "responseIdentifier", 2);
+__decorateClass([
+  property({ reflect: true, type: Boolean })
+], Interaction.prototype, "disabled", 2);
+__decorateClass([
+  property({ reflect: true, type: Boolean })
+], Interaction.prototype, "readonly", 2);
+__decorateClass([
+  state()
+], Interaction.prototype, "_correctResponse", 2);
+__decorateClass([
+  state()
+], Interaction.prototype, "_isCorrect", 2);
+
+export {
+  Interaction
+};
+//# sourceMappingURL=chunk-EBODGAT7.js.map

package/dist/chunks/chunk-EBODGAT7.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lib/exports/interaction.ts"],"sourcesContent":["import { property, state } from 'lit/decorators.js';\nimport { LitElement } from 'lit';\n\nimport type { ResponseVariable } from './variables';\nimport type { IInteraction } from './interaction.interface';\n\nexport abstract class Interaction extends LitElement implements IInteraction {\n  static formAssociated = true;\n  protected _internals: ElementInternals;\n\n  @property({ type: String, attribute: 'response-identifier' }) responseIdentifier;\n\n  @property({ reflect: true, type: Boolean }) disabled = false;\n\n  @property({ reflect: true, type: Boolean }) readonly = false;\n\n  /* PK: Correct response */\n  @state()\n  protected _correctResponse: string | string[];\n\n  get correctResponse(): Readonly<string | string[]> {\n    return this._correctResponse;\n  }\n\n  set correctResponse(val: Readonly<string | string[]>) {\n    this._correctResponse = val as string | string[];\n  }\n\n  @state()\n  protected _isCorrect: boolean | null = null;\n\n  get isCorrect(): Readonly<boolean | null> {\n    return this._isCorrect;\n  }\n\n  set isCorrect(val: Readonly<boolean | null>) {\n    this._isCorrect = val as boolean;\n  }\n\n  public toggleCorrectResponse(responseVariable: ResponseVariable, show: boolean) {\n    this.correctResponse = show\n      ? responseVariable?.correctResponse\n      : responseVariable?.cardinality === 'single'\n        ? ''\n        : [];\n  }\n\n  public toggleCandidateCorrection(responseVariable: ResponseVariable, show: boolean) {\n    this.isCorrect = show\n      ? responseVariable.correctResponse === responseVariable.value\n      : null;\n\n    this._internals.states.delete('candidate-correct');\n    this._internals.states.delete('candidate-incorrect');\n\n    if (this.isCorrect === true) {\n      this._internals.states.add('candidate-correct');\n    }\n    if (this.isCorrect === false) {\n      this._internals.states.add('candidate-incorrect');\n    }\n  }\n\n  constructor() {\n    super();\n    this._internals = this.attachInternals();\n  }\n\n  abstract validate(): boolean;\n\n  get value(): string | null {\n    return JSON.stringify(this.response);\n  }\n\n  set value(val: string | null) {\n    this.response = val ? JSON.parse(val) : null;\n  }\n\n  abstract get response(): string | string[] | null;\n  abstract set response(val: string | string[] | null);\n\n  public reportValidity(): boolean {\n    return this._internals.reportValidity();\n  }\n\n  public reset(): void {\n    this.response = null;\n  }\n\n  // attributeChangedCallback(name: string, _old: string | null, value: string | null): void {\n  //   super.attributeChangedCallback(name, _old, value);\n  //   // changing attributes in lit is not a thing, they are defined in the QTI XML and will never change\n  //   // except in storybook where we can change the value of the attribute\n  //   // this can make the internal state out of sync with the attribute\n  //   // so we reset the value to null to force the internal state to be reset\n  //   const attributeNamesToExclude = ['style', 'class'];\n  //   if (!attributeNamesToExclude.includes(name)) {\n  //     this.reset();\n  //   }\n  // }\n\n  public override connectedCallback() {\n    super.connectedCallback();\n\n    this.dispatchEvent(\n      new CustomEvent('qti-register-interaction', {\n        bubbles: true,\n        composed: true,\n        cancelable: false,\n        detail: {\n          interactionElement: this,\n          responseIdentifier: this.responseIdentifier\n        }\n      })\n    );\n  }\n\n  public saveResponse(value: string | string[]) {\n    this.dispatchEvent(\n      new CustomEvent('qti-interaction-response', {\n        bubbles: true,\n        composed: true,\n        cancelable: false,\n        detail: {\n          responseIdentifier: this.responseIdentifier,\n          response: Array.isArray(value) ? [...value] : value\n        }\n      })\n    );\n  }\n}\n"],"mappings":";;;;;AAAA,SAAS,UAAU,aAAa;AAChC,SAAS,kBAAkB;AAKpB,IAAe,cAAf,cAAmC,WAAmC;AAAA,EAyD3E,cAAc;AACZ,UAAM;AApDoC,oBAAW;AAEX,oBAAW;AAevD,SAAU,aAA6B;AAoCrC,SAAK,aAAa,KAAK,gBAAgB;AAAA,EACzC;AAAA,EA9CA,IAAI,kBAA+C;AACjD,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,IAAI,gBAAgB,KAAkC;AACpD,SAAK,mBAAmB;AAAA,EAC1B;AAAA,EAKA,IAAI,YAAsC;AACxC,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,IAAI,UAAU,KAA+B;AAC3C,SAAK,aAAa;AAAA,EACpB;AAAA,EAEO,sBAAsB,kBAAoC,MAAe;AAC9E,SAAK,kBAAkB,OACnB,kBAAkB,kBAClB,kBAAkB,gBAAgB,WAChC,KACA,CAAC;AAAA,EACT;AAAA,EAEO,0BAA0B,kBAAoC,MAAe;AAClF,SAAK,YAAY,OACb,iBAAiB,oBAAoB,iBAAiB,QACtD;AAEJ,SAAK,WAAW,OAAO,OAAO,mBAAmB;AACjD,SAAK,WAAW,OAAO,OAAO,qBAAqB;AAEnD,QAAI,KAAK,cAAc,MAAM;AAC3B,WAAK,WAAW,OAAO,IAAI,mBAAmB;AAAA,IAChD;AACA,QAAI,KAAK,cAAc,OAAO;AAC5B,WAAK,WAAW,OAAO,IAAI,qBAAqB;AAAA,IAClD;AAAA,EACF;AAAA,EASA,IAAI,QAAuB;AACzB,WAAO,KAAK,UAAU,KAAK,QAAQ;AAAA,EACrC;AAAA,EAEA,IAAI,MAAM,KAAoB;AAC5B,SAAK,WAAW,MAAM,KAAK,MAAM,GAAG,IAAI;AAAA,EAC1C;AAAA,EAKO,iBAA0B;AAC/B,WAAO,KAAK,WAAW,eAAe;AAAA,EACxC;AAAA,EAEO,QAAc;AACnB,SAAK,WAAW;AAAA,EAClB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAcgB,oBAAoB;AAClC,UAAM,kBAAkB;AAExB,SAAK;AAAA,MACH,IAAI,YAAY,4BAA4B;AAAA,QAC1C,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,QAAQ;AAAA,UACN,oBAAoB;AAAA,UACpB,oBAAoB,KAAK;AAAA,QAC3B;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AAAA,EAEO,aAAa,OAA0B;AAC5C,SAAK;AAAA,MACH,IAAI,YAAY,4BAA4B;AAAA,QAC1C,SAAS;AAAA,QACT,UAAU;AAAA,QACV,YAAY;AAAA,QACZ,QAAQ;AAAA,UACN,oBAAoB,KAAK;AAAA,UACzB,UAAU,MAAM,QAAQ,KAAK,IAAI,CAAC,GAAG,KAAK,IAAI;AAAA,QAChD;AAAA,MACF,CAAC;AAAA,IACH;AAAA,EACF;AACF;AA5HsB,YACb,iBAAiB;AAGsC;AAAA,EAA7D,SAAS,EAAE,MAAM,QAAQ,WAAW,sBAAsB,CAAC;AAAA,GAJxC,YAI0C;AAElB;AAAA,EAA3C,SAAS,EAAE,SAAS,MAAM,MAAM,QAAQ,CAAC;AAAA,GANtB,YAMwB;AAEA;AAAA,EAA3C,SAAS,EAAE,SAAS,MAAM,MAAM,QAAQ,CAAC;AAAA,GARtB,YAQwB;AAIlC;AAAA,EADT,MAAM;AAAA,GAXa,YAYV;AAWA;AAAA,EADT,MAAM;AAAA,GAtBa,YAuBV;","names":[]}

package/dist/chunks/chunk-EFY3NEXY.js

@@ -0,0 +1,94 @@
+import {
+  item_default
+} from "./chunk-6TDSFDGN.js";
+import {
+  watch
+} from "./chunk-ELDMXTUQ.js";
+import {
+  qtiTransformTest
+} from "./chunk-DJWEI2NH.js";
+import {
+  __decorateClass
+} from "./chunk-H2JE6IVU.js";
+
+// src/lib/qti-test/components/test-container.ts
+import { LitElement, html } from "lit";
+import { customElement, property, state } from "lit/decorators.js";
+import { until } from "lit/directives/until.js";
+var TestContainer = class extends LitElement {
+  constructor() {
+    super(...arguments);
+    this.testURL = null;
+    this.testDoc = null;
+    this.testXML = null;
+    /** Template content if provided */
+    this.templateContent = null;
+  }
+  async handleTestURLChange() {
+    if (!this.testURL) return;
+    try {
+      const api = await qtiTransformTest().load(this.testURL);
+      this.testDoc = api.htmlDoc();
+    } catch (error) {
+      console.error("Error loading or parsing XML:", error);
+    }
+  }
+  handleTestXMLChange() {
+    if (!this.testXML) return;
+    try {
+      this.testDoc = qtiTransformTest().parse(this.testXML).htmlDoc();
+    } catch (error) {
+      console.error("Error parsing XML:", error);
+    }
+  }
+  async connectedCallback() {
+    super.connectedCallback();
+    this.initializeTemplateContent();
+    this.applyStyles();
+    if (this.testURL) {
+      this.handleTestURLChange();
+    }
+    if (this.testXML) {
+      this.handleTestXMLChange();
+    }
+  }
+  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.testDoc, html`<span>Loading...</span>`)}
+    `;
+  }
+};
+__decorateClass([
+  property({ type: String, attribute: "test-url" })
+], TestContainer.prototype, "testURL", 2);
+__decorateClass([
+  state()
+], TestContainer.prototype, "testDoc", 2);
+__decorateClass([
+  state()
+], TestContainer.prototype, "testXML", 2);
+__decorateClass([
+  watch("testURL", { waitUntilFirstUpdate: true })
+], TestContainer.prototype, "handleTestURLChange", 1);
+__decorateClass([
+  watch("testXML", { waitUntilFirstUpdate: true })
+], TestContainer.prototype, "handleTestXMLChange", 1);
+TestContainer = __decorateClass([
+  customElement("test-container")
+], TestContainer);
+
+export {
+  TestContainer
+};
+//# sourceMappingURL=chunk-EFY3NEXY.js.map

package/dist/chunks/chunk-EFY3NEXY.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lib/qti-test/components/test-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 { qtiTransformTest } from '../../qti-transformers';\n\n/**\n * `<test-container>` is a custom element designed for hosting the qti-assessment-item.\n * The `qti-assessment-test` will be placed inside the shadow DOM of this element.\n * The element loads the test from the provided URL and renders it inside the shadow DOM.\n *\n * ```html\n * <qti-test>\n *   <test-navigation>\n *      <test-container class=\"m-4 bg-white\" test-url=\"./path/to/assessmenttest.xml\"></test-container>\n *   </test-navigation>\n * </qti-test>\n * ```\n */\n@customElement('test-container')\nexport class TestContainer extends LitElement {\n  /** URL of the item to load */\n  @property({ type: String, attribute: 'test-url' })\n  testURL: string = null;\n\n  /** A parsed HTML document */\n  @state()\n  testDoc: DocumentFragment = null;\n\n  /** The raw XML string */\n  @state()\n  testXML: string = null;\n\n  /** Template content if provided */\n  private templateContent = null;\n\n  @watch('testURL', { waitUntilFirstUpdate: true })\n  protected async handleTestURLChange() {\n    if (!this.testURL) return;\n    try {\n      const api = await qtiTransformTest().load(this.testURL);\n      this.testDoc = api.htmlDoc();\n    } catch (error) {\n      console.error('Error loading or parsing XML:', error);\n    }\n  }\n\n  @watch('testXML', { waitUntilFirstUpdate: true })\n  protected handleTestXMLChange() {\n    if (!this.testXML) return;\n    try {\n      this.testDoc = qtiTransformTest().parse(this.testXML).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.testURL) {\n      this.handleTestURLChange();\n    }\n    if (this.testXML) {\n      this.handleTestXMLChange();\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.testDoc, html`<span>Loading...</span>`)}\n    `;\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'test-container': TestContainer;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;AAAA,SAAS,YAAY,YAAY;AACjC,SAAS,eAAe,UAAU,aAAa;AAC/C,SAAS,aAAa;AAoBf,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,MAAM,MAAM,iBAAiB,EAAE,KAAK,KAAK,OAAO;AACtD,WAAK,UAAU,IAAI,QAAQ;AAAA,IAC7B,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":[]}