@citolab/qti-components 8.0.0 → 8.0.2

package/dist/base.d.ts

@@ -1,9 +1,135 @@
-export * from '@qti-components/base';
-import '@qti-components/corrections';
-import '@qti-components/elements';
-import '@qti-components/test';
-import '@qti-components/item';
-import '@qti-components/interactions';
-import '@qti-components/transformers';
-import '@qti-components/loader';
-import '@qti-components/processing';
+import { C as ComputedItemContext } from './computed-item.types.d-BKZdSLLJ.js';
+import { C as ComputedContext } from './computed.types.d-DpKIYO6e.js';
+export { a as ComputedItem, I as INITIAL_SESSION_CONTEXT, S as SessionContext, V as View, s as sessionContext } from './computed.types.d-DpKIYO6e.js';
+export { C as ConfigContext, V as ValidationDisplayMode, c as configContext } from './config.context.d-BvU9r-Mg.js';
+export { C as ChoiceRole, I as Interaction, a as InteractionContext, i as interactionContext } from './interaction.d-CJiMv8H7.js';
+import { I as ItemContext, B as BaseType } from './item.types.d-QU7LljEK.js';
+export { C as Calculate, a as Cardinality, M as Multiple, O as Ordered, b as OutcomeVariable, Q as QtiAreaMapEntry, c as QtiAreaMapping, d as QtiMapEntry, e as QtiMapping, R as ResponseInteraction, f as ResponseVariable, T as TemplateVariable, V as VariableDeclaration, g as VariableValue, h as areaShape, i as directedPair, j as float, k as integer, l as itemContextVariables } from './item.types.d-QU7LljEK.js';
+export { Q as QtiContext, a as QtiContextType, S as Seed, b as asSeed, i as isSeed, q as qtiContext } from './qti.context.d-CejJMlfZ.js';
+export { I as INITIAL_TEST_CONTEXT, Q as QtiExpression, a as QtiExpressionBase, T as TestContext, t as testContext } from './qti-expression.d-BietT_8b.js';
+import * as lit from 'lit';
+export { Q as QtiFeedback, a as QtiVariableDeclaration } from './qti-feedback.d-DZbad0RN.js';
+export { Q as QtiConditionExpression } from './qti-condition-expression.d-aMvBvpc6.js';
+export { D as DirectedPair, I as Identifier, P as Point, R as ResponseValue, i as iterResponseValues, p as parsePair, a as parsePoint, b as parseResponseAttribute, r as responseAttributeConverter, s as serializePair, c as serializePoint, d as serializeResponseAttribute } from './response.d-_8y4kjGP.js';
+export { F as FormAssociatedInteraction, I as IInteraction, R as ReadonlyInteraction, a as RegisteredInteraction, b as ResettableInteraction, c as ResponseIdentifiedInteraction, d as ResponseInteractionElement, V as ValidatableInteraction } from './interaction.interface.d-CvjHM2bi.js';
+export { Q as QtiRuleBase, a as QtiRuleElement } from './qti-rule-base.d-ajOnfGXY.js';
+
+declare const computedItemContext: {
+    __context__: Readonly<ComputedItemContext>;
+};
+
+declare const computedContext: {
+    __context__: Readonly<ComputedContext>;
+};
+
+declare const itemContext: {
+    __context__: ItemContext;
+};
+
+/**
+ * The border-box reset, for shadow trees.
+ *
+ * `modern-normalize` applies `*, ::before, ::after { box-sizing: border-box }` to the document,
+ * but a universal selector never crosses a shadow boundary: every shadow root starts over at
+ * the UA default, `content-box`. So each component has to opt in, and until now 15 of them did
+ * so ad hoc — one of them with `content-box`, one with `!important`.
+ *
+ * Why this matters beyond tidiness: under `content-box`, padding and border are *size*. A rule
+ * that only means to repaint a chip — `:state(dragging) { border: none }` — silently shrinks it
+ * by two pixels per axis, the drag bank rewraps, and a drop target slides out from under the
+ * user's pointer mid-drag. Border-box is what makes "a state may repaint but never re-lay-out"
+ * a rule the CSS can actually keep.
+ *
+ * `:host` is set explicitly and descendants inherit, so a component that genuinely needs
+ * `content-box` for a subtree (an image map, say) can opt out at one node and have it hold for
+ * everything below it.
+ */
+declare const boxSizing: lit.CSSResult;
+
+/**
+ * The `drop` region of every drop target.
+ *
+ * One rule: **a drop container hosts a chip, it never sizes one.** No `flex: 1`, no stretch, no
+ * centring. The chip's box is decided by the chip — in the drag bank, mid-flight as a clone, and
+ * once dropped — and a container that centres or stretches it makes the drop the one place where
+ * that stops being true. That is felt as the chip jumping the instant it lands.
+ *
+ * `flex: 0 1 auto` on the children says "intrinsic size, no growing, shrink if you must".
+ * `align-items: flex-start` stops the cross axis stretching them, which is the flex default and
+ * the reason a chip in a tall dropzone used to grow to fill it.
+ *
+ * The shrink half used to be 0 as well, on the reading that a drop must not resize a chip. It does
+ * not say that. `flex-shrink: 0` does not preserve the chip's size, it preserves the chip's
+ * UNCONSTRAINED max-content size — and those are the same number only while the bank is wide enough
+ * to give the chip its full width. Once the bank is narrower, the bank chip (`flex: 0 1 auto`, like
+ * any flex item) shrinks and wraps, the placed chip does not, and the two disagree.
+ *
+ * Measured on the order fixture, bank vs placed: 209x36 / 209x36 at a 480px interaction, but
+ * 204x55 / 209x36 at 440px and 154x55 / 209x36 at 340px — the placed chip a fixed 209px wide,
+ * overflowing a drop that had correctly reserved 156px for it. It reached CI as a font difference:
+ * the same label measures ~227px under the Linux fonts, which puts 480px on the wrong side of the
+ * boundary too.
+ *
+ * Shrinking cannot make a placed chip smaller than the reservation, because the reservation IS the
+ * measured chip (`--qti-dropzone-min-*`, applied to this region's content box). So the floor a
+ * shrink stops at is the chip's own size, which is the rule above, not an exception to it.
+ * `flex-grow: 0` is what actually prevents the stretch this block cares about, and it is untouched.
+ *
+ * A container that wants a *minimum* size still declares one (see `--qti-dropzone-min-*`). That
+ * sizes the container, never its contents.
+ *
+ * Verified by drag-drop.invariance.spec.ts: "a chip is the same chip wherever it lives" — including
+ * the narrow-bank order fixture, which is there because the wide one passes either way.
+ */
+declare const dropRegion: lit.CSSResult;
+
+/**
+ * The `#validation-message` region every interaction renders, hidden until there is a message.
+ *
+ * `Interaction` owns showing and hiding it: `reportValidity` sets
+ * `display: block !important` inline when `_internals.validationMessage` is non-empty, and clears the
+ * text and sets `display: none` inline again when it is not (see interaction.ts). An inline
+ * `!important` beats this rule, so the JS still wins whenever it speaks.
+ *
+ * What it did not own was the *initial* state. Before first validation the div has no inline style,
+ * so it needs a stylesheet to start hidden — otherwise it paints as an empty box with the theme's
+ * warning border and padding. That hide used to be a `display: none` inside the theme's
+ * `validation-message` mixin, which made a document stylesheet responsible for a shadow node's box.
+ * Two components had already noticed and worked around it with `style="display:none"` in their
+ * template; the other five relied on the theme.
+ *
+ * The theme still paints the message — colour, border, padding, radius — via `::part(message)`.
+ */
+declare const validationMessage: lit.CSSResult;
+
+declare class ScoringHelper {
+    /**
+     * Checks if a given point is within a specified area.
+     * @param point The point to test, represented as a string "x y" (e.g., "102 113").
+     * @param areaKey The area definition, including shape and coordinates (e.g., "circle,102,113,16").
+     * @param baseType The base type of the response, must be "point" for this method to proceed.
+     * @returns True if the point is within the area; false otherwise.
+     */
+    static isPointInArea(point: string, areaKey: string, baseType: string): boolean;
+    /**
+     * Checks if a point is inside a polygon using the ray-casting algorithm.
+     * @param point The point to test.
+     * @param vertices The vertices of the polygon in order (array of {x, y} objects).
+     * @returns True if the point is inside the polygon; false otherwise.
+     */
+    static isPointInPolygon(point: {
+        x: number;
+        y: number;
+    }, vertices: {
+        x: number;
+        y: number;
+    }[]): boolean;
+    static compareSingleValues(value1: Readonly<string>, value2: Readonly<string>, baseType: BaseType): boolean;
+}
+
+declare const decimalSeparator: () => string;
+declare const convertNumberToUniversalFormat: (number: number | string) => string;
+declare function IsNullOrUndefined(value: unknown): boolean;
+declare function removeDoubleSlashes(str: string): string;
+
+export { BaseType, ComputedContext, ComputedItemContext, IsNullOrUndefined, ItemContext, ScoringHelper, boxSizing, computedContext, computedItemContext, convertNumberToUniversalFormat, decimalSeparator, dropRegion, itemContext, removeDoubleSlashes, validationMessage };

package/dist/base.js

@@ -34,7 +34,7 @@ import {
   sessionContext,
   testContext,
   validationMessage
-} from "./chunk-H3J7LFRO.js";
+} from "./chunk-HQESINXH.js";
 export {
   INITIAL_SESSION_CONTEXT,
   INITIAL_TEST_CONTEXT,

package/dist/chunk-4DB4SC5K.js

@@ -0,0 +1,100 @@
+// ../qti-utilities/dist/decorators/watch.js
+function watch(propertyName, options) {
+  const resolvedOptions = {
+    waitUntilFirstUpdate: false,
+    ...options
+  };
+  return (proto, decoratedFnName) => {
+    const { update } = proto;
+    const watchedProperties = Array.isArray(propertyName) ? propertyName : [propertyName];
+    proto.update = function(changedProps) {
+      watchedProperties.forEach((property) => {
+        const key = property;
+        if (changedProps.has(key)) {
+          const oldValue = changedProps.get(key);
+          const newValue = this[key];
+          if (oldValue !== newValue) {
+            if (!resolvedOptions.waitUntilFirstUpdate || this.hasUpdated) {
+              this[decoratedFnName](oldValue, newValue);
+            }
+          }
+        }
+      });
+      update.call(this, changedProps);
+    };
+  };
+}
+
+// ../qti-utilities/dist/directives/spread-args.js
+import { nothing } from "lit/html.js";
+import { directive } from "lit/directive.js";
+import { AsyncDirective } from "lit/async-directive.js";
+var SpreadArgsDirective = class extends AsyncDirective {
+  constructor() {
+    super(...arguments);
+    this.prevData = {};
+  }
+  render(_spreadData) {
+    return nothing;
+  }
+  update(part, [spreadData]) {
+    if (this.element !== part.element) {
+      this.element = part.element;
+    }
+    this.host = part.options?.host || this.element;
+    this.apply(spreadData);
+    this.groom(spreadData);
+    this.prevData = { ...spreadData };
+    return nothing;
+  }
+  apply(data) {
+    const filteredData = this.#filterArgs(data);
+    const { prevData, element } = this;
+    for (const key in filteredData) {
+      const value = filteredData[key];
+      if (value === prevData[key]) {
+        continue;
+      }
+      if (value === true) {
+        element.setAttribute(key, "");
+      } else if (value === false) {
+        element.removeAttribute(key);
+      } else if (value != null) {
+        element.setAttribute(key, String(value));
+      } else {
+        element.removeAttribute(key);
+      }
+    }
+  }
+  groom(data) {
+    const { prevData, element } = this;
+    if (!prevData)
+      return;
+    const filteredData = data ? this.#filterArgs(data) : {};
+    for (const key in prevData) {
+      if (!filteredData || !(key in filteredData)) {
+        element.removeAttribute(key);
+      }
+    }
+  }
+  #filterArgs(args) {
+    return Object.fromEntries(Object.entries(args).filter(([key, value]) => {
+      if (typeof value === "function") {
+        return false;
+      }
+      if (key === "max-choices" && value === 0) {
+        return true;
+      }
+      if (value === "" || value === null || value === void 0) {
+        return false;
+      }
+      return true;
+    }));
+  }
+};
+var spreadArgs = directive(SpreadArgsDirective);
+
+export {
+  watch
+};
+//# sourceMappingURL=chunk-4DB4SC5K.js.map

package/dist/chunk-4DB4SC5K.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../qti-utilities/src/decorators/watch.ts","../../qti-utilities/src/directives/spread-args.ts"],"sourcesContent":["import type { LitElement } from 'lit';\n\ntype UpdateHandler = (prev?: unknown, next?: unknown) => void;\n\ntype NonUndefined<A> = A extends undefined ? never : A;\n\nexport type UpdateHandlerFunctionKeys<T extends object> = {\n  [K in keyof T]-?: NonUndefined<T[K]> extends UpdateHandler ? K : never;\n}[keyof T];\n\ninterface WatchOptions {\n  /**\n   * If true, will only start watching after the initial update/render\n   */\n  waitUntilFirstUpdate?: boolean;\n}\n\n/**\n * Runs when observed properties change, e.g. @property or @state, but before the component updates. To wait for an\n * update to complete after a change occurs, use `await this.updateComplete` in the handler. To start watching after the\n * initial update/render, use `{ waitUntilFirstUpdate: true }` or `this.hasUpdated` in the handler.\n *\n * Usage:\n *\n * @watch('propName')\n * handlePropChange(oldValue, newValue) {\n *   ...\n * }\n */\nexport function watch(propertyName: string | string[], options?: WatchOptions) {\n  const resolvedOptions: Required<WatchOptions> = {\n    waitUntilFirstUpdate: false,\n    ...options\n  };\n  return <ElemClass extends LitElement>(\n    proto: ElemClass,\n    decoratedFnName: UpdateHandlerFunctionKeys<ElemClass> | any\n  ) => {\n    // @ts-expect-error - update is a protected property\n    const { update } = proto;\n    const watchedProperties = Array.isArray(propertyName) ? propertyName : [propertyName];\n\n    // @ts-expect-error - update is a protected property\n    proto.update = function (this: ElemClass, changedProps: Map<keyof ElemClass, ElemClass[keyof ElemClass]>) {\n      watchedProperties.forEach(property => {\n        const key = property as keyof ElemClass;\n        if (changedProps.has(key)) {\n          const oldValue = changedProps.get(key);\n          const newValue = this[key];\n\n          if (oldValue !== newValue) {\n            if (!resolvedOptions.waitUntilFirstUpdate || this.hasUpdated) {\n              ((this as any)[decoratedFnName] as unknown as UpdateHandler)(oldValue, newValue);\n            }\n          }\n        }\n      });\n\n      update.call(this, changedProps);\n    };\n  };\n}\n","import { nothing } from 'lit/html.js';\nimport { directive } from 'lit/directive.js';\nimport { AsyncDirective } from 'lit/async-directive.js';\n\nimport type { ElementPart, Part } from 'lit';\n\n/**\n * A directive that spreads arguments to HTML attributes with intelligent filtering.\n *\n * Features:\n * - Includes `max-choices=\"0\"` even though 0 is falsy\n * - Excludes boolean attributes with no value, empty string, null, or undefined\n * - Excludes event handlers and functions\n *\n * Based on the @open-wc/lit-helpers spread directive implementation.\n */\nexport class SpreadArgsDirective extends AsyncDirective {\n  host!: EventTarget | object | Element;\n  element!: Element;\n  prevData: { [key: string]: unknown } = {};\n\n  render(_spreadData: { [key: string]: unknown }) {\n    return nothing;\n  }\n\n  update(part: Part, [spreadData]: Parameters<this['render']>) {\n    if (this.element !== (part as ElementPart).element) {\n      this.element = (part as ElementPart).element;\n    }\n    this.host = part.options?.host || this.element;\n    this.apply(spreadData);\n    this.groom(spreadData);\n    this.prevData = { ...spreadData };\n    return nothing;\n  }\n\n  apply(data: { [key: string]: unknown }) {\n    // Filter the data according to our rules\n    const filteredData = this.#filterArgs(data);\n\n    const { prevData, element } = this;\n    for (const key in filteredData) {\n      const value = filteredData[key];\n      if (value === prevData[key]) {\n        continue;\n      }\n\n      // Handle different attribute types\n      if (value === true) {\n        // Boolean attribute - just set the attribute name\n        element.setAttribute(key, '');\n      } else if (value === false) {\n        // Remove false boolean attributes\n        element.removeAttribute(key);\n      } else if (value != null) {\n        // Standard attribute with value\n        element.setAttribute(key, String(value));\n      } else {\n        // Remove null/undefined attributes\n        element.removeAttribute(key);\n      }\n    }\n  }\n\n  groom(data: { [key: string]: unknown }) {\n    const { prevData, element } = this;\n    if (!prevData) return;\n\n    // Filter the current data to see what we should have\n    const filteredData = data ? this.#filterArgs(data) : {};\n\n    for (const key in prevData) {\n      if (!filteredData || !(key in filteredData)) {\n        // Remove attributes that are no longer present in filtered data\n        element.removeAttribute(key);\n      }\n    }\n  }\n\n  #filterArgs(args: Record<string, unknown>): Record<string, unknown> {\n    return Object.fromEntries(\n      Object.entries(args).filter(([key, value]) => {\n        // Always exclude functions (events/functions)\n        if (typeof value === 'function') {\n          return false;\n        }\n\n        // Special case for max-choices: include when value is 0\n        if (key === 'max-choices' && value === 0) {\n          return true;\n        }\n\n        // Exclude empty strings, null, and undefined\n        if (value === '' || value === null || value === undefined) {\n          return false;\n        }\n\n        // Include all other truthy values\n        return true;\n      })\n    );\n  }\n}\n\n/**\n * A directive that spreads arguments to HTML attributes with intelligent filtering.\n *\n * @param args - Object containing key-value pairs to spread as attributes\n *\n * @example\n * ```typescript\n * import { spreadArgs } from '@qti-components/utilities';\n *\n * const args = {\n *   'max-choices': 0,     // Will be included\n *   disabled: true,       // Will be included as disabled=\"\"\n *   hidden: false,        // Will be excluded\n *   title: '',            // Will be excluded\n *   onClick: () => {},    // Will be excluded\n *   id: 'my-element'      // Will be included as id=\"my-element\"\n * };\n *\n * html`<my-element ${spreadArgs(args)}></my-element>`;\n * ```\n */\nexport const spreadArgs = directive(SpreadArgsDirective);\n\n/**\n * Helper function version that works with @open-wc/lit-helpers spread directive.\n * @deprecated Use the spreadArgs directive directly instead.\n */\nexport function filterArgsForSpread(args: Record<string, unknown>): Record<string, unknown> {\n  return Object.fromEntries(\n    Object.entries(args).filter(([, value]) => {\n      if (typeof value === 'function') return false;\n      if (value === '' || value === null || value === undefined) return false;\n      return true;\n    })\n  );\n}\n"],"mappings":";AA6BM,SAAU,MAAM,cAAiC,SAAsB;AAC3E,QAAM,kBAA0C;IAC9C,sBAAsB;IACtB,GAAG;;AAEL,SAAO,CACL,OACA,oBACE;AAEF,UAAM,EAAE,OAAM,IAAK;AACnB,UAAM,oBAAoB,MAAM,QAAQ,YAAY,IAAI,eAAe,CAAC,YAAY;AAGpF,UAAM,SAAS,SAA2B,cAA8D;AACtG,wBAAkB,QAAQ,cAAW;AACnC,cAAM,MAAM;AACZ,YAAI,aAAa,IAAI,GAAG,GAAG;AACzB,gBAAM,WAAW,aAAa,IAAI,GAAG;AACrC,gBAAM,WAAW,KAAK,GAAG;AAEzB,cAAI,aAAa,UAAU;AACzB,gBAAI,CAAC,gBAAgB,wBAAwB,KAAK,YAAY;AAC1D,mBAAa,eAAe,EAA+B,UAAU,QAAQ;YACjF;UACF;QACF;MACF,CAAC;AAED,aAAO,KAAK,MAAM,YAAY;IAChC;EACF;AACF;;;AC7DA,SAAS,eAAe;AACxB,SAAS,iBAAiB;AAC1B,SAAS,sBAAsB;AAczB,IAAO,sBAAP,cAAmC,eAAc;EAAvD,cAAA;;AAGE,SAAA,WAAuC,CAAA;EAmFzC;EAjFE,OAAO,aAAuC;AAC5C,WAAO;EACT;EAEA,OAAO,MAAY,CAAC,UAAU,GAA6B;AACzD,QAAI,KAAK,YAAa,KAAqB,SAAS;AAClD,WAAK,UAAW,KAAqB;IACvC;AACA,SAAK,OAAO,KAAK,SAAS,QAAQ,KAAK;AACvC,SAAK,MAAM,UAAU;AACrB,SAAK,MAAM,UAAU;AACrB,SAAK,WAAW,EAAE,GAAG,WAAU;AAC/B,WAAO;EACT;EAEA,MAAM,MAAgC;AAEpC,UAAM,eAAe,KAAK,YAAY,IAAI;AAE1C,UAAM,EAAE,UAAU,QAAO,IAAK;AAC9B,eAAW,OAAO,cAAc;AAC9B,YAAM,QAAQ,aAAa,GAAG;AAC9B,UAAI,UAAU,SAAS,GAAG,GAAG;AAC3B;MACF;AAGA,UAAI,UAAU,MAAM;AAElB,gBAAQ,aAAa,KAAK,EAAE;MAC9B,WAAW,UAAU,OAAO;AAE1B,gBAAQ,gBAAgB,GAAG;MAC7B,WAAW,SAAS,MAAM;AAExB,gBAAQ,aAAa,KAAK,OAAO,KAAK,CAAC;MACzC,OAAO;AAEL,gBAAQ,gBAAgB,GAAG;MAC7B;IACF;EACF;EAEA,MAAM,MAAgC;AACpC,UAAM,EAAE,UAAU,QAAO,IAAK;AAC9B,QAAI,CAAC;AAAU;AAGf,UAAM,eAAe,OAAO,KAAK,YAAY,IAAI,IAAI,CAAA;AAErD,eAAW,OAAO,UAAU;AAC1B,UAAI,CAAC,gBAAgB,EAAE,OAAO,eAAe;AAE3C,gBAAQ,gBAAgB,GAAG;MAC7B;IACF;EACF;EAEA,YAAY,MAA6B;AACvC,WAAO,OAAO,YACZ,OAAO,QAAQ,IAAI,EAAE,OAAO,CAAC,CAAC,KAAK,KAAK,MAAK;AAE3C,UAAI,OAAO,UAAU,YAAY;AAC/B,eAAO;MACT;AAGA,UAAI,QAAQ,iBAAiB,UAAU,GAAG;AACxC,eAAO;MACT;AAGA,UAAI,UAAU,MAAM,UAAU,QAAQ,UAAU,QAAW;AACzD,eAAO;MACT;AAGA,aAAO;IACT,CAAC,CAAC;EAEN;;AAwBK,IAAM,aAAa,UAAU,mBAAmB;","names":[]}