@citolab/qti-components 7.3.20 → 7.3.21

package/dist/chunks/chunk-SZ3DDAJ7.js

@@ -0,0 +1,142 @@
+import {
+  computedItemContext
+} from "./chunk-4OGJBG35.js";
+import {
+  configContext
+} from "./chunk-NRKCQIQS.js";
+import {
+  __decorateClass
+} from "./chunk-H2JE6IVU.js";
+
+// src/lib/qti-item/core/qti-item.ts
+import { provide } from "@lit/context";
+import { html, LitElement } from "lit";
+import { customElement, state } from "lit/decorators.js";
+var QtiItem = class extends LitElement {
+  constructor() {
+    super();
+    this.view = "candidate";
+    this.configContext = {};
+    // Store event handlers as instance properties
+    this._onItemContextChanged = this._handleItemContextChanged.bind(this);
+    this._onAssessmentItemConnected = this._handleAssessmentItemConnected.bind(this);
+    this._onHandleShowCorrectResponse = this._handleShowCorrectResponse.bind(this);
+    this._onHandleShowCandidateCorrection = this._handleShowCandidateCorrection.bind(this);
+    this._onHandleSwitchCorrectResponseMode = this._handleSwitchCorrectResponseMode.bind(this);
+    this.addEventListener("qti-item-context-updated", this._onItemContextChanged);
+    this.addEventListener("qti-assessment-item-connected", this._onAssessmentItemConnected);
+    this.addEventListener("item-show-correct-response", this._onHandleShowCorrectResponse);
+    this.addEventListener("item-show-candidate-correction", this._onHandleShowCandidateCorrection);
+    this.addEventListener("item-switch-correct-response-mode", this._onHandleSwitchCorrectResponseMode);
+  }
+  updated(changedProperties) {
+    super.updated(changedProperties);
+    if (changedProperties.has("view")) {
+      this._updateElementView();
+      this._updateCorrectResponseVisibility();
+    }
+  }
+  _handleItemContextChanged(e) {
+    this._updateItemVariablesInTestContext(e.detail.itemContext.identifier, e.detail?.itemContext?.variables || []);
+  }
+  _handleAssessmentItemConnected(e) {
+    const fullVariables = e.detail._context.variables;
+    this._qtiAssessmentItem = e.detail;
+    this.computedContext = this.computedContext?.identifier === this._qtiAssessmentItem.identifier ? { ...this.computedContext, title: this._qtiAssessmentItem.title } : {
+      identifier: this._qtiAssessmentItem.identifier,
+      title: this._qtiAssessmentItem.title,
+      adaptive: this._qtiAssessmentItem.getAttribute("adaptive")?.toLowerCase() === "true" || false,
+      variables: fullVariables,
+      correctResponseMode: "internal"
+    };
+    this._updateItemVariablesInTestContext(this._qtiAssessmentItem.identifier, fullVariables || []);
+    this._updateElementView();
+    this._updateCorrectResponseVisibility();
+  }
+  _handleShowCorrectResponse(e) {
+    if (this._qtiAssessmentItem) {
+      this._qtiAssessmentItem.showCorrectResponse(e.detail);
+    }
+  }
+  _handleShowCandidateCorrection(e) {
+    if (this._qtiAssessmentItem) {
+      this._qtiAssessmentItem.showCandidateCorrection(e.detail);
+    }
+  }
+  _handleSwitchCorrectResponseMode(e) {
+    this._handleShowCorrectResponse(new CustomEvent("item-show-correct-response", { detail: false, bubbles: true }));
+    this.configContext = {
+      ...this.configContext,
+      correctResponseMode: e.detail
+    };
+  }
+  _updateItemVariablesInTestContext(identifier, variables) {
+    const rawscore = variables?.find((vr) => vr.identifier == "SCORE")?.value;
+    const score = parseFloat(rawscore?.toString());
+    const completionStatus = variables?.find((v) => v.identifier === "completionStatus")?.value;
+    const correct = score !== void 0 && !isNaN(score) && score > 0;
+    const incorrect = score !== void 0 && !isNaN(score) && score <= 0;
+    const completed = completionStatus === "completed";
+    this.computedContext = {
+      ...this.computedContext,
+      identifier,
+      correct,
+      incorrect,
+      completed,
+      variables
+    };
+  }
+  connectedCallback() {
+    super.connectedCallback();
+    debugger;
+    const newView = this.getAttribute("view") || "candidate";
+    this.view = newView;
+    this._updateElementView();
+    this._updateCorrectResponseVisibility();
+  }
+  // Method to handle view updates for elements based on the current view
+  _updateElementView() {
+    const viewElements = Array.from(this.querySelectorAll("[view]"));
+    viewElements.forEach((element) => {
+      element.classList.toggle("show", element.getAttribute("view") === this.view);
+    });
+  }
+  // Method to update correct response visibility based on view
+  _updateCorrectResponseVisibility() {
+    if (this._qtiAssessmentItem) {
+      this._qtiAssessmentItem.showCorrectResponse(this.view === "scorer");
+    }
+  }
+  /**
+   * Public method to programmatically change the view
+   */
+  switchView(newView) {
+    this.view = newView;
+    this._updateElementView();
+    this._updateCorrectResponseVisibility();
+  }
+  render() {
+    return html`<slot></slot>`;
+  }
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    this.removeEventListener("qti-item-context-changed", this._onItemContextChanged);
+    this.removeEventListener("qti-assessment-item-connected", this._onAssessmentItemConnected);
+  }
+};
+__decorateClass([
+  state(),
+  provide({ context: computedItemContext })
+], QtiItem.prototype, "computedContext", 2);
+__decorateClass([
+  state(),
+  provide({ context: configContext })
+], QtiItem.prototype, "configContext", 2);
+QtiItem = __decorateClass([
+  customElement("qti-item")
+], QtiItem);
+
+export {
+  QtiItem
+};
+//# sourceMappingURL=chunk-SZ3DDAJ7.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/lib/qti-item/core/qti-item.ts"],"sourcesContent":["import { provide } from '@lit/context';\nimport { html, LitElement } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { computedItemContext } from '../../exports/computed-item.context';\nimport { configContext } from '../../exports/config.context.ts';\n\nimport type { ConfigContext, CorrectResponseMode } from '../../exports/config.context.ts';\nimport type { QtiAssessmentItem } from '../../qti-components';\nimport type { ItemContext } from '../../exports/item.context';\nimport type { VariableDeclaration } from '../../exports/variables';\nimport type { ComputedItemContext } from '../../exports/computed-item.context';\n\nexport type View = 'author' | 'candidate' | 'proctor' | 'scorer' | 'testConstructor' | 'tutor' | '';\n\n/**\n * `<qti-item>` is a custom element designed for rendering a single `qti-assessment-item`.\n * It can also host some functionalities to interact with the item like scoring, showing feedback, etc.\n * Placing a mandatory `<item-container>` inside '<qti-item>' will load or parse the item and render it.\n * See `<item-container>` for more details.\n *\n * ```html\n * <qti-item view=\"scorer\">\n *   <item-container class=\"m-4 bg-white\" item-url=\"./path/to/item.xml\"></item-container>\n * </qti-item>\n * ```\n */\n@customElement('qti-item')\nexport class QtiItem extends LitElement {\n  public view: string = 'candidate';\n\n  @state()\n  @provide({ context: computedItemContext })\n  public computedContext: ComputedItemContext;\n  private _qtiAssessmentItem?: QtiAssessmentItem;\n\n  @state()\n  @provide({ context: configContext })\n  public configContext: ConfigContext = {};\n\n  // Store event handlers as instance properties\n  private _onItemContextChanged = this._handleItemContextChanged.bind(this);\n  private _onAssessmentItemConnected = this._handleAssessmentItemConnected.bind(this);\n\n  private _onHandleShowCorrectResponse = this._handleShowCorrectResponse.bind(this);\n  private _onHandleShowCandidateCorrection = this._handleShowCandidateCorrection.bind(this);\n  private _onHandleSwitchCorrectResponseMode = this._handleSwitchCorrectResponseMode.bind(this);\n\n  constructor() {\n    super();\n    this.addEventListener('qti-item-context-updated', this._onItemContextChanged);\n    this.addEventListener('qti-assessment-item-connected', this._onAssessmentItemConnected);\n    this.addEventListener('item-show-correct-response', this._onHandleShowCorrectResponse);\n    this.addEventListener('item-show-candidate-correction', this._onHandleShowCandidateCorrection);\n    this.addEventListener('item-switch-correct-response-mode', this._onHandleSwitchCorrectResponseMode);\n  }\n\n  protected updated(changedProperties: Map<string | number | symbol, unknown>) {\n    super.updated(changedProperties);\n    if (changedProperties.has('view')) {\n      this._updateElementView();\n      this._updateCorrectResponseVisibility();\n    }\n  }\n\n  private _handleItemContextChanged(e: CustomEvent<{ itemContext: ItemContext }>) {\n    this._updateItemVariablesInTestContext(e.detail.itemContext.identifier, e.detail?.itemContext?.variables || []);\n  }\n\n  private _handleAssessmentItemConnected(e: CustomEvent<QtiAssessmentItem>) {\n    const fullVariables = (e.detail as any)._context.variables;\n    this._qtiAssessmentItem = e.detail;\n    this.computedContext =\n      this.computedContext?.identifier === this._qtiAssessmentItem.identifier\n        ? { ...this.computedContext, title: this._qtiAssessmentItem.title }\n        : ({\n            identifier: this._qtiAssessmentItem.identifier,\n            title: this._qtiAssessmentItem.title,\n            adaptive: this._qtiAssessmentItem.getAttribute('adaptive')?.toLowerCase() === 'true' || false,\n            variables: fullVariables,\n            correctResponseMode: 'internal'\n          } as ComputedItemContext);\n    this._updateItemVariablesInTestContext(this._qtiAssessmentItem.identifier, fullVariables || []);\n\n    // Update view-related functionality when assessment item is connected\n    this._updateElementView();\n    this._updateCorrectResponseVisibility();\n  }\n\n  private _handleShowCorrectResponse(e: CustomEvent<boolean>) {\n    if (this._qtiAssessmentItem) {\n      this._qtiAssessmentItem.showCorrectResponse(e.detail);\n    }\n  }\n\n  private _handleShowCandidateCorrection(e: CustomEvent<boolean>) {\n    if (this._qtiAssessmentItem) {\n      this._qtiAssessmentItem.showCandidateCorrection(e.detail);\n    }\n  }\n\n  private _handleSwitchCorrectResponseMode(e: CustomEvent<CorrectResponseMode>) {\n    // Switch off the correct response first\n    this._handleShowCorrectResponse(new CustomEvent('item-show-correct-response', { detail: false, bubbles: true }));\n\n    this.configContext = {\n      ...this.configContext,\n      correctResponseMode: e.detail\n    };\n  }\n\n  private _updateItemVariablesInTestContext(\n    identifier: string,\n    variables: readonly VariableDeclaration<string | string[] | null>[]\n  ): void {\n    const rawscore = variables?.find(vr => vr.identifier == 'SCORE')?.value;\n    const score = parseFloat(rawscore?.toString());\n    const completionStatus = variables?.find(v => v.identifier === 'completionStatus')?.value;\n\n    const correct = score !== undefined && !isNaN(score) && score > 0;\n    const incorrect = score !== undefined && !isNaN(score) && score <= 0;\n    const completed = completionStatus === 'completed';\n    this.computedContext = {\n      ...this.computedContext,\n      identifier,\n      correct,\n      incorrect,\n      completed,\n      variables\n    };\n  }\n\n  public connectedCallback(): void {\n    super.connectedCallback();\n    debugger;\n    const newView = this.getAttribute('view') || 'candidate';\n    this.view = newView;\n    this._updateElementView();\n    this._updateCorrectResponseVisibility();\n  }\n\n  // Method to handle view updates for elements based on the current view\n  private _updateElementView() {\n    const viewElements = Array.from(this.querySelectorAll('[view]'));\n    viewElements.forEach((element: HTMLElement) => {\n      element.classList.toggle('show', element.getAttribute('view') === this.view);\n    });\n  }\n\n  // Method to update correct response visibility based on view\n  private _updateCorrectResponseVisibility() {\n    if (this._qtiAssessmentItem) {\n      this._qtiAssessmentItem.showCorrectResponse(this.view === 'scorer');\n    }\n  }\n\n  /**\n   * Public method to programmatically change the view\n   */\n  public switchView(newView: View) {\n    this.view = newView;\n    this._updateElementView();\n    this._updateCorrectResponseVisibility();\n  }\n\n  render() {\n    return html`<slot></slot>`;\n  }\n\n  override disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener('qti-item-context-changed', this._onItemContextChanged);\n    this.removeEventListener('qti-assessment-item-connected', this._onAssessmentItemConnected);\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'qti-item': QtiItem;\n  }\n}\n"],"mappings":"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","names":[]}