@pie-element/multiple-choice 13.3.5-ng.0 → 13.3.6

package/dist/browser/print/index.js

@@ -1,43 +0,0 @@
-import { F as e, M as t, Vt as n } from "../Radio-Bbu0BH_k.js";
-import { t as r } from "../main-DahQxQZC.js";
-import { c as i, l as a } from "../dist-CHbLnyuX.js";
-import o from "react";
-import { createRoot as s } from "react-dom/client";
-var c = (0, (/* @__PURE__ */ n(e(), 1)).default)("pie-element:multiple-choice:print"), l = (e, t) => {
-	let n = t.role === "instructor";
-	return e.prompt = e.promptEnabled === !1 ? void 0 : e.prompt, e.teacherInstructions = n && e.teacherInstructionsEnabled !== !1 ? e.teacherInstructions : void 0, e.showTeacherInstructions = n, e.alwaysShowCorrect = n, e.mode = n ? "evaluate" : e.mode, e.disabled = !0, e.animationsDisabled = !0, e.lockChoiceOrder = !0, e.choicesLayout = e.choicesLayout || "vertical", e.choices = a(e.choices).map((t) => (t.rationale = n && e.rationaleEnabled !== !1 ? t.rationale : void 0, t.hideTick = n, t.feedback = void 0, t)), e.keyMode = e.choicePrefix || "letters", e;
-}, u = class extends HTMLElement {
-	constructor() {
-		super(), this._options = null, this._model = null, this._session = [], this._root = null, this._rerender = i(() => {
-			if (this._model && this._session) {
-				let e = l(this._model, this._options), n = this._options && o.createElement(r, {
-					model: e,
-					session: {},
-					options: this._options
-				});
-				this._root ||= s(this), this._root.render(n), requestAnimationFrame(() => {
-					requestAnimationFrame(() => {
-						c("render complete - render math"), t(this);
-					});
-				});
-			} else c("skip");
-		}, 50, {
-			leading: !1,
-			trailing: !0
-		});
-	}
-	set options(e) {
-		this._options = e;
-	}
-	set model(e) {
-		this._model = e, this._rerender();
-	}
-	connectedCallback() {}
-	disconnectedCallback() {
-		this._root && this._root.unmount();
-	}
-};
-//#endregion
-export { u as default };
-
-//# sourceMappingURL=index.js.map

package/dist/browser/print/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/print/index.tsx"],"sourcesContent":["// @ts-nocheck\n/**\n * @synced-from pie-elements/packages/multiple-choice/src/print.js\n * @auto-generated\n *\n * This file is automatically synced from pie-elements and converted to TypeScript.\n * Manual edits will be overwritten on next sync.\n * To make changes, edit the upstream JavaScript file and run sync again.\n */\n\nimport React from 'react';\nimport { createRoot } from 'react-dom/client';\nimport { cloneDeep, debounce } from '@pie-element/shared-lodash';\nimport Main from '../delivery/main.js';\nimport { renderMath } from '@pie-element/shared-math-rendering-mathjax';\nimport debug from 'debug';\n\nconst log = debug('pie-element:multiple-choice:print');\n\n/**\n * Live in same package as main element - so we can access some of the shared comps!\n *\n * - update pslb to build print if src/print.js is there\n * - update demo el\n * - get configure/controller building\n */\n\nconst preparePrintModel = (model, opts) => {\n  const instr = opts.role === 'instructor';\n\n  model.prompt = model.promptEnabled !== false ? model.prompt : undefined;\n  model.teacherInstructions =\n    instr && model.teacherInstructionsEnabled !== false ? model.teacherInstructions : undefined;\n  model.showTeacherInstructions = instr;\n  model.alwaysShowCorrect = instr;\n  model.mode = instr ? 'evaluate' : model.mode;\n\n  model.disabled = true;\n  model.animationsDisabled = true;\n  model.lockChoiceOrder = true;\n  model.choicesLayout = model.choicesLayout || 'vertical';\n\n  const choices = cloneDeep(model.choices);\n\n  model.choices = choices.map((c) => {\n    c.rationale = instr && model.rationaleEnabled !== false ? c.rationale : undefined;\n    c.hideTick = instr;\n    c.feedback = undefined;\n    return c;\n  });\n\n  model.keyMode = model.choicePrefix || 'letters';\n\n  return model;\n};\n\nexport default class MultipleChoicePrint extends HTMLElement {\n  constructor() {\n    super();\n    this._options = null;\n    this._model = null;\n    this._session = [];\n    this._root = null;\n    this._rerender = debounce(\n      () => {\n        if (this._model && this._session) {\n          const printModel = preparePrintModel(this._model, this._options);\n\n          const element =\n            this._options &&\n            React.createElement(Main, {\n              model: printModel,\n              session: {},\n              options: this._options,\n            });\n\n          if (!this._root) {\n            this._root = createRoot(this);\n          }\n          this._root.render(element);\n          // Use double requestAnimationFrame so React has committed to the DOM before we render math\n          requestAnimationFrame(() => {\n            requestAnimationFrame(() => {\n              log('render complete - render math');\n              renderMath(this);\n            });\n          });\n        } else {\n          log('skip');\n        }\n      },\n      50,\n      { leading: false, trailing: true },\n    );\n  }\n  set options(o) {\n    this._options = o;\n  }\n\n  set model(s) {\n    this._model = s;\n    this._rerender();\n  }\n\n  connectedCallback() {}\n\n  disconnectedCallback() {\n    if (this._root) {\n      this._root.unmount();\n    }\n  }\n}\n"],"mappings":";;;;;AAiBA,IAAM,KAAA,IAAA,wBAAA,EAAA,CAAA,QAAA,CAAY,mCAAmC,GAU/C,KAAqB,GAAO,MAAS;CACzC,IAAM,IAAQ,EAAK,SAAS;CAyB5B,OAvBA,EAAM,SAAS,EAAM,kBAAkB,KAAuB,KAAA,IAAf,EAAM,QACrD,EAAM,sBACJ,KAAS,EAAM,+BAA+B,KAAQ,EAAM,sBAAsB,KAAA,GACpF,EAAM,0BAA0B,GAChC,EAAM,oBAAoB,GAC1B,EAAM,OAAO,IAAQ,aAAa,EAAM,MAExC,EAAM,WAAW,IACjB,EAAM,qBAAqB,IAC3B,EAAM,kBAAkB,IACxB,EAAM,gBAAgB,EAAM,iBAAiB,YAI7C,EAAM,UAFU,EAAU,EAAM,OAEhB,CAAA,CAAQ,KAAK,OAC3B,EAAE,YAAY,KAAS,EAAM,qBAAqB,KAAQ,EAAE,YAAY,KAAA,GACxE,EAAE,WAAW,GACb,EAAE,WAAW,KAAA,GACN,EACR,GAED,EAAM,UAAU,EAAM,gBAAgB,WAE/B;AACT,GAEqB,IAArB,cAAiD,YAAY;CAC3D,cAAc;EAMZ,AALA,MAAM,GACN,KAAK,WAAW,MAChB,KAAK,SAAS,MACd,KAAK,WAAW,CAAC,GACjB,KAAK,QAAQ,MACb,KAAK,YAAY,QACT;GACJ,IAAI,KAAK,UAAU,KAAK,UAAU;IAChC,IAAM,IAAa,EAAkB,KAAK,QAAQ,KAAK,QAAQ,GAEzD,IACJ,KAAK,YACL,EAAM,cAAc,GAAM;KACxB,OAAO;KACP,SAAS,CAAC;KACV,SAAS,KAAK;IAChB,CAAC;IAOH,AALA,AACE,KAAK,UAAQ,EAAW,IAAI,GAE9B,KAAK,MAAM,OAAO,CAAO,GAEzB,4BAA4B;KAC1B,4BAA4B;MAE1B,AADA,EAAI,+BAA+B,GACnC,EAAW,IAAI;KACjB,CAAC;IACH,CAAC;GACH,OACE,EAAI,MAAM;EAEd,GACA,IACA;GAAE,SAAS;GAAO,UAAU;EAAK,CACnC;CACF;CACA,IAAI,QAAQ,GAAG;EACb,KAAK,WAAW;CAClB;CAEA,IAAI,MAAM,GAAG;EAEX,AADA,KAAK,SAAS,GACd,KAAK,UAAU;CACjB;CAEA,oBAAoB,CAAC;CAErB,uBAAuB;EACrB,AAAI,KAAK,SACP,KAAK,MAAM,QAAQ;CAEvB;AACF"}

package/dist/controller/defaults.d.ts

@@ -1,35 +0,0 @@
-/**
- * @synced-from pie-elements/packages/multiple-choice/controller/src/defaults.js
- * @auto-generated
- *
- * This file is automatically synced from pie-elements and converted to TypeScript.
- * Manual edits will be overwritten on next sync.
- * To make changes, edit the upstream JavaScript file and run sync again.
- */
-declare const _default: {
-    choiceMode: string;
-    choicePrefix: string;
-    choices: never[];
-    choicesLayout: string;
-    feedbackEnabled: boolean;
-    gridColumns: number;
-    lockChoiceOrder: boolean;
-    partialScoring: boolean;
-    prompt: string;
-    promptEnabled: boolean;
-    rationale: string;
-    rationaleEnabled: boolean;
-    scoringType: string;
-    studentInstructionsEnabled: boolean;
-    teacherInstructions: string;
-    teacherInstructionsEnabled: boolean;
-    toolbarEditorPosition: string;
-    selectedAnswerBackgroundColor: string;
-    selectedAnswerStrokeColor: string;
-    selectedAnswerStrokeWidth: string;
-    hoverAnswerBackgroundColor: string;
-    hoverAnswerStrokeColor: string;
-    hoverAnswerStrokeWidth: string;
-    keyboardEventsEnabled: boolean;
-};
-export default _default;

package/dist/controller/defaults.js

@@ -1,29 +0,0 @@
-//#region src/controller/defaults.ts
-var e = {
-	choiceMode: "checkbox",
-	choicePrefix: "letters",
-	choices: [],
-	choicesLayout: "vertical",
-	feedbackEnabled: !1,
-	gridColumns: 2,
-	lockChoiceOrder: !0,
-	partialScoring: !0,
-	prompt: "",
-	promptEnabled: !0,
-	rationale: "",
-	rationaleEnabled: !0,
-	scoringType: "auto",
-	studentInstructionsEnabled: !0,
-	teacherInstructions: "",
-	teacherInstructionsEnabled: !0,
-	toolbarEditorPosition: "bottom",
-	selectedAnswerBackgroundColor: "initial",
-	selectedAnswerStrokeColor: "initial",
-	selectedAnswerStrokeWidth: "initial",
-	hoverAnswerBackgroundColor: "initial",
-	hoverAnswerStrokeColor: "initial",
-	hoverAnswerStrokeWidth: "initial",
-	keyboardEventsEnabled: !1
-};
-//#endregion
-export { e as default };

package/dist/controller/index.d.ts

@@ -1,65 +0,0 @@
-/**
- * @synced-from pie-elements/packages/multiple-choice/controller/src/index.js
- * @auto-generated
- *
- * This file is automatically synced from pie-elements and converted to TypeScript.
- * Manual edits will be overwritten on next sync.
- * To make changes, edit the upstream JavaScript file and run sync again.
- */
-export declare function createDefaultModel(model?: {}): Promise<unknown>;
-export declare const normalize: (question: any) => any;
-/**
- *
- * @param {*} question
- * @param {*} session
- * @param {*} env
- * @param {*} updateSession - optional - a function that will set the properties passed into it on the session.
- */
-export declare function model(question: any, session: any, env: any, updateSession: any): Promise<{
-    disabled: boolean;
-    mode: any;
-    prompt: any;
-    choicesLayout: any;
-    gridColumns: any;
-    choiceMode: any;
-    keyMode: any;
-    choices: any;
-    responseCorrect: any;
-    language: any;
-    extraCSSRules: any;
-    fontSizeFactor: any;
-    isSelectionButtonBelow: any;
-    selectedAnswerBackgroundColor: any;
-    selectedAnswerStrokeColor: any;
-    selectedAnswerStrokeWidth: any;
-    hoverAnswerBackgroundColor: any;
-    hoverAnswerStrokeColor: any;
-    hoverAnswerStrokeWidth: any;
-    minSelections: any;
-    maxSelections: any;
-    keyboardEventsEnabled: any;
-    autoplayAudioEnabled: any;
-    completeAudioEnabled: any;
-    customAudioButton: any;
-}>;
-export declare const getScore: (config: any, session: any) => number;
-/**
- * Generates detailed trace log for scoring evaluation
- * @param {Object} model - the question model
- * @param {Object} session - the student session
- * @param {Object} env - the environment
- * @returns {Array} traceLog - array of trace messages
- */
-export declare const getLogTrace: (model: any, session: any, env: any) => string[];
-/**
- *
- * The score is partial by default for checkbox mode, allOrNothing for radio mode.
- * To disable partial scoring for checkbox mode you either set model.partialScoring = false or env.partialScoring = false. the value in `env` will
- * override the value in `model`.
- * @param {Object} model - the main model
- * @param {*} session
- * @param {Object} env
- */
-export declare function outcome(model: any, session: any, env: any): Promise<unknown>;
-export declare const createCorrectResponseSession: (question: any, env: any) => Promise<unknown>;
-export declare const validate: (model?: {}, config?: {}) => {};

package/dist/controller/index.js

@@ -1,129 +0,0 @@
-import { isResponseCorrect as e } from "./utils.js";
-import t from "./defaults.js";
-import { isEmpty as n } from "@pie-element/shared-lodash";
-import { getShuffledChoices as r, lockChoices as i, partialScoring as a } from "@pie-element/shared-controller-utils";
-//#region src/controller/index.ts
-var o = (e, t, n) => (r) => {
-	let { role: i, mode: a } = t || {}, o = {
-		label: r.label,
-		value: r.value
-	};
-	if (i === "instructor" && (a === "view" || a === "evaluate") ? o.rationale = e.rationaleEnabled ? r.rationale : null : o.rationale = null, a === "evaluate" && (o.correct = !!r.correct, e.feedbackEnabled)) {
-		let e = r.feedback && r.feedback.type || "none";
-		e === "default" ? o.feedback = n[r.correct ? "correct" : "incorrect"] : e === "custom" && (o.feedback = r.feedback.value);
-	}
-	return o;
-};
-function s(e = {}) {
-	return new Promise((n) => n({
-		...t,
-		...e
-	}));
-}
-var c = (e) => {
-	let { verticalMode: n, choicesLayout: r, ...i } = e || {};
-	return {
-		...t,
-		...i,
-		choicesLayout: r || n === !1 && "horizontal" || t.choicesLayout
-	};
-};
-async function l(t, n, a, s) {
-	let l = c(t), u = Object.assign({
-		correct: "Correct",
-		incorrect: "Incorrect"
-	}, l.defaultFeedback), d = (l.choices || []).map(o(l, a, u));
-	i(l, n, a) || (d = await r(d, n, s, "value"));
-	let f = {
-		disabled: a.mode !== "gather",
-		mode: a.mode,
-		prompt: l.promptEnabled ? l.prompt : null,
-		choicesLayout: l.choicesLayout,
-		gridColumns: l.gridColumns,
-		choiceMode: l.choiceMode,
-		keyMode: l.choicePrefix,
-		choices: d,
-		responseCorrect: a.mode === "evaluate" ? e(l, n) : void 0,
-		language: l.language,
-		extraCSSRules: l.extraCSSRules,
-		fontSizeFactor: l.fontSizeFactor,
-		isSelectionButtonBelow: l.isSelectionButtonBelow,
-		selectedAnswerBackgroundColor: l.selectedAnswerBackgroundColor || "initial",
-		selectedAnswerStrokeColor: l.selectedAnswerStrokeColor || "initial",
-		selectedAnswerStrokeWidth: l.selectedAnswerStrokeWidth || "initial",
-		hoverAnswerBackgroundColor: l.hoverAnswerBackgroundColor || "initial",
-		hoverAnswerStrokeColor: l.hoverAnswerStrokeColor || "initial",
-		hoverAnswerStrokeWidth: l.hoverAnswerStrokeWidth || "initial",
-		minSelections: l.minSelections,
-		maxSelections: l.maxSelections,
-		keyboardEventsEnabled: l.keyboardEventsEnabled,
-		autoplayAudioEnabled: l.autoplayAudioEnabled,
-		completeAudioEnabled: l.completeAudioEnabled,
-		customAudioButton: l.customAudioButton
-	}, { role: p, mode: m } = a || {};
-	return p === "instructor" && (m === "view" || m === "evaluate") ? f.teacherInstructions = l.teacherInstructionsEnabled ? l.teacherInstructions : null : f.teacherInstructions = null, f;
-}
-var u = (e, t) => {
-	if (!t || n(t)) return 0;
-	let r = t.value || [], i = (e.choices || []).filter((e) => e.correct), a = r.reduce((e, t) => e + +!!i.find((e) => e.value === t), 0);
-	i.length < r.length && (a -= r.length - i.length, a < 0 && (a = 0));
-	let o = i.length ? a / i.length : 0;
-	return parseFloat(o.toFixed(2));
-}, d = (e, t, n) => {
-	let r = [], i = t?.value || [], o = e.choiceMode === "radio" ? "multiple-choice (radio)" : "multiple-select (checkbox)";
-	r.push(`Question type: ${o}.`), i.length ? r.push(`Student selected ${i.length} answer(s): ${i.join(", ")}.`) : r.push("Student did not select any answers.");
-	let s = (e.choices || []).filter((e) => e.correct), c = s.map((e) => e.value);
-	if (r.push(`${s.length} correct answer(s) are defined for this question.`), i.length) {
-		let e = i.filter((e) => c.includes(e)), t = i.filter((e) => !c.includes(e));
-		r.push(`Student selected ${e.length} correct and ${t.length} incorrect answer(s).`);
-	}
-	let l = a.enabled(e, n) && e.choiceMode !== "radio" ? "partial scoring" : "all-or-nothing scoring";
-	r.push(`Score calculated using ${l}.`);
-	let d = u(e, t);
-	return r.push(`Final score: ${d}.`), r;
-};
-function f(e, t, r) {
-	return new Promise((i) => {
-		if (!t || n(t)) i({
-			score: 0,
-			empty: !0,
-			traceLog: ["Student did not select any answers. Score is 0."]
-		});
-		else {
-			let n = d(e, t, r), o = u(e, t);
-			i({
-				score: a.enabled(e, r) && e.choiceMode !== "radio" ? o : +(o === 1),
-				empty: !1,
-				traceLog: n
-			});
-		}
-	});
-}
-var p = (e, t) => new Promise((n) => {
-	if (t.mode !== "evaluate" && t.role === "instructor") {
-		let { choices: t } = e || { choices: [] };
-		n({
-			id: "1",
-			value: t.filter((e) => e.correct).map((e) => e.value)
-		});
-	} else n(null);
-}), m = (e) => (e || "").replace(/(<(?!img|iframe|source)([^>]+)>)/gi, ""), h = (e = {}, t = {}) => {
-	let { choices: r } = e, { minAnswerChoices: i = 2, maxAnswerChoices: a } = t, o = [...r || []].reverse(), s = {}, c = {}, l = {};
-	["teacherInstructions", "prompt"].forEach((n) => {
-		t[n]?.required && !m(e[n]) && (l[n] = "This field is required.");
-	});
-	let u = !1, d = 0;
-	o.forEach((e, n) => {
-		let { correct: r, value: i, label: a, rationale: l } = e;
-		r && (u = !0, d++), m(a) ? o.slice(n + 1).some((e) => e.label === a) && (s[i] = "Content should be unique.") : s[i] = "Content should not be empty.", t.rationale?.required && !m(l) && (c[i] = "This field is required.");
-	});
-	let f = (r || []).length;
-	if (f < i ? l.answerChoices = `There should be at least ${i} choices defined.` : f > a && (l.answerChoices = `No more than ${a} choices should be defined.`), !u) l.correctResponse = "No correct response defined.";
-	else {
-		let { maxSelections: t, choiceMode: n } = e;
-		n !== "radio" && t != null && d > t && (l.correctResponse = `The number of correct answers (${d}) exceeds max selections (${t}). Students won't be able to select all correct answers.`);
-	}
-	return n(s) || (l.choices = s), n(c) || (l.rationale = c), l;
-};
-//#endregion
-export { p as createCorrectResponseSession, s as createDefaultModel, d as getLogTrace, u as getScore, l as model, c as normalize, f as outcome, h as validate };

package/dist/controller/utils.d.ts

@@ -1,10 +0,0 @@
-/**
- * @synced-from pie-elements/packages/multiple-choice/controller/src/utils.js
- * @auto-generated
- *
- * This file is automatically synced from pie-elements and converted to TypeScript.
- * Manual edits will be overwritten on next sync.
- * To make changes, edit the upstream JavaScript file and run sync again.
- */
-export declare const getCorrectResponse: (choices: any) => any;
-export declare const isResponseCorrect: (question: any, session: any) => any;

package/dist/controller/utils.js

@@ -1,8 +0,0 @@
-import { isEqual as e } from "@pie-element/shared-lodash";
-//#region src/controller/utils.ts
-var t = (e) => e.filter((e) => e.correct).map((e) => e.value).sort(), n = (n, r) => {
-	let i = t(n.choices);
-	return r && e((r.value || []).sort(), i);
-};
-//#endregion
-export { t as getCorrectResponse, n as isResponseCorrect };

package/dist/delivery/choice-input.d.ts

@@ -1,44 +0,0 @@
-/**
- * @synced-from pie-elements/packages/multiple-choice/src/choice-input.jsx
- * @auto-generated
- *
- * This file is automatically synced from pie-elements and converted to TypeScript.
- * Manual edits will be overwritten on next sync.
- * To make changes, edit the upstream JavaScript file and run sync again.
- */
-import React from 'react';
-import PropTypes from 'prop-types';
-export declare const StyledFormControlLabel: any;
-export declare const StyledCheckbox: (props: any) => React.JSX.Element;
-export declare const StyledRadio: (props: any) => React.JSX.Element;
-export declare class ChoiceInput extends React.Component {
-    static propTypes: {
-        choiceMode: PropTypes.Requireable<string>;
-        displayKey: PropTypes.Requireable<string>;
-        checked: PropTypes.Validator<boolean>;
-        correctness: PropTypes.Requireable<string>;
-        disabled: PropTypes.Validator<boolean>;
-        feedback: PropTypes.Requireable<string>;
-        label: PropTypes.Validator<string>;
-        rationale: PropTypes.Requireable<string>;
-        onChange: PropTypes.Validator<(...args: any[]) => any>;
-        value: PropTypes.Validator<string>;
-        className: PropTypes.Requireable<string>;
-        tagName: PropTypes.Requireable<string>;
-        hideTick: PropTypes.Requireable<boolean>;
-        isEvaluateMode: PropTypes.Requireable<boolean>;
-        choicesLayout: PropTypes.Requireable<string>;
-        isSelectionButtonBelow: PropTypes.Requireable<boolean>;
-    };
-    static defaultProps: {
-        rationale: null;
-        checked: boolean;
-        isEvaluateMode: boolean;
-    };
-    constructor(props: any);
-    onToggleChoice(event: any): void;
-    generateChoiceId(): string;
-    handleKeyDown: any;
-    render(): React.JSX.Element;
-}
-export default ChoiceInput;

package/dist/delivery/choice-input.js

@@ -1,280 +0,0 @@
-import { clsx as e } from "../node_modules/.bun/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
-import t from "./feedback-tick.js";
-import n from "react";
-import r from "prop-types";
-import * as i from "@pie-lib/render-ui";
-import { Feedback as a, PreviewPrompt as o, color as s } from "@pie-lib/render-ui";
-import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
-import { styled as d } from "@mui/material/styles";
-import f from "@mui/material/Box";
-import p from "@mui/material/FormControlLabel";
-import m from "@mui/material/Checkbox";
-import h from "@mui/material/Radio";
-//#region src/delivery/choice-input.tsx
-function g(e) {
-	return typeof e == "function" || typeof e == "object" && !!e && typeof e.$$typeof == "symbol";
-}
-function _(e, t) {
-	return !e || g(e) ? e : g(e.default) ? e.default : t && g(e[t]) ? e[t] : t && g(e[t]?.default) ? e[t].default : e;
-}
-var v = _(o, "PreviewPrompt") || _(S.PreviewPrompt, "PreviewPrompt"), y = _(a, "Feedback") || _(S.Feedback, "Feedback"), b = i, x = b.default, S = x && typeof x == "object" ? x : b, C = "multiple-choice-component", w = d(f)({
-	display: "flex",
-	alignItems: "center",
-	backgroundColor: s.background()
-}), T = d(f)({
-	display: "flex",
-	alignItems: "center",
-	backgroundColor: s.background(),
-	flex: 1,
-	"& .MuiFormControlLabel-root": { marginLeft: "-14px" },
-	"& label": {
-		color: s.text(),
-		"& > span": { fontSize: "inherit" },
-		"& > .MuiButtonBase-root": { padding: "12px" }
-	}
-}), E = d("span")(({ theme: e }) => ({
-	display: "flex",
-	alignItems: "center",
-	"& > span": { marginLeft: `-${e.spacing(1)}` }
-})), D = d("span")({
-	position: "absolute",
-	left: "-10000px",
-	top: "auto",
-	width: "1px",
-	height: "1px",
-	overflow: "hidden"
-}), O = d(p)({
-	"& .MuiFormControlLabel-label": {
-		color: `${s.text()} !important`,
-		backgroundColor: s.background(),
-		letterSpacing: "normal"
-	},
-	"&.Mui-disabled *": { cursor: "not-allowed !important" }
-}), k = (e, t) => ({ [`&.${C}`]: { color: `var(--choice-input-${e}, ${t}) !important` } }), A = (e) => {
-	let t = (t) => e ? `${e}-${t}` : t;
-	return {
-		[t("root")]: {
-			...k("color", s.text()),
-			...e === "correct" ? k("correct-color", s.text()) : {},
-			...e === "incorrect" ? k("incorrect-color", s.incorrect()) : {}
-		},
-		[t("checked")]: {
-			...e === "correct" ? k("correct-selected-color", s.correct()) : {},
-			...e === "incorrect" ? k("incorrect-checked", s.incorrect()) : {},
-			...e ? {} : k("selected-color", s.primary())
-		},
-		[t("disabled")]: {
-			...k("disabled-color", s.text()),
-			...e === "correct" ? k("correct-disabled-color", s.disabled()) : {},
-			...e === "incorrect" ? k("incorrect-disabled-color", s.disabled()) : {},
-			opacity: .6,
-			cursor: "not-allowed !important",
-			pointerEvents: "initial !important"
-		},
-		focusVisibleUnchecked: {
-			outline: `2px solid ${s.keyBoardFocusIndicator()}`,
-			backgroundColor: "transparent"
-		},
-		focusVisibleChecked: {
-			outline: `2px solid ${s.keyBoardFocusIndicator()}`,
-			backgroundColor: "transparent"
-		}
-	};
-}, j = d(m, { shouldForwardProp: (e) => e !== "correctness" })(({ correctness: e }) => {
-	let t = A(e), n = (t) => e ? `${e}-${t}` : t;
-	return {
-		[`&.${C}`]: {
-			...t[n("root")],
-			"&.Mui-checked": t[n("checked")],
-			"&.Mui-disabled": e ? {} : t[n("disabled")],
-			"&:hover:not(.Mui-disabled) svg": {
-				boxShadow: `0px 0px 0px 2px ${s.keyBoardFocusIndicator()}`,
-				borderRadius: "4px"
-			}
-		},
-		"&.Mui-focusVisible": {
-			"&:not(.Mui-checked)": t.focusVisibleUnchecked,
-			"&.Mui-checked": t.focusVisibleChecked
-		}
-	};
-}), M = (e) => {
-	let { correctness: t, checked: n, onChange: r, disabled: i, value: a, id: o, onKeyDown: s, inputRef: c } = e;
-	return /* @__PURE__ */ l(j, {
-		id: o,
-		slotProps: { input: { ref: c } },
-		onKeyDown: s,
-		disableRipple: !0,
-		checked: n,
-		onChange: r,
-		disabled: i,
-		value: a,
-		correctness: t,
-		className: C
-	});
-}, N = d(h, { shouldForwardProp: (e) => e !== "correctness" })(({ correctness: e }) => {
-	let t = A(e), n = (t) => e ? `${e}-${t}` : t;
-	return {
-		[`&.${C}`]: {
-			...t[n("root")],
-			"&.Mui-checked": t[n("checked")],
-			"&.Mui-disabled": e ? {} : t[n("disabled")],
-			"&.Mui-focusVisible:not(.Mui-checked)": t.focusVisibleUnchecked,
-			"&.Mui-focusVisible.Mui-checked": t.focusVisibleChecked,
-			"&:hover:not(.Mui-disabled) svg": {
-				boxShadow: `0px 0px 0px 2px ${s.keyBoardFocusIndicator()}`,
-				borderRadius: "50%"
-			}
-		},
-		"&.Mui-focusVisible": {
-			"& input": { outline: 0 },
-			"& .MuiTouchRipple-root": { display: "none" }
-		}
-	};
-}), P = (e) => {
-	let { correctness: t, checked: n, onChange: r, disabled: i, value: a, id: o, tagName: s, inputRef: c } = e;
-	return /* @__PURE__ */ l(N, {
-		id: o,
-		slotProps: { input: { ref: c } },
-		disableRipple: !0,
-		checked: n,
-		onChange: r,
-		disabled: i,
-		value: a,
-		correctness: t,
-		className: C,
-		name: s
-	});
-}, F = class extends n.Component {
-	static propTypes = {
-		choiceMode: r.oneOf(["radio", "checkbox"]),
-		displayKey: r.string,
-		checked: r.bool.isRequired,
-		correctness: r.string,
-		disabled: r.bool.isRequired,
-		feedback: r.string,
-		label: r.string.isRequired,
-		rationale: r.string,
-		onChange: r.func.isRequired,
-		value: r.string.isRequired,
-		className: r.string,
-		tagName: r.string,
-		hideTick: r.bool,
-		isEvaluateMode: r.bool,
-		choicesLayout: r.oneOf([
-			"vertical",
-			"grid",
-			"horizontal"
-		]),
-		isSelectionButtonBelow: r.bool
-	};
-	static defaultProps = {
-		rationale: null,
-		checked: !1,
-		isEvaluateMode: !1
-	};
-	constructor(e) {
-		super(e), this.onToggleChoice = this.onToggleChoice.bind(this), this.choiceId = this.generateChoiceId(), this.descId = `${this.choiceId}-desc`;
-	}
-	onToggleChoice(e) {
-		this.props.onChange(e);
-	}
-	generateChoiceId() {
-		return "choice-" + (Math.random() * 1e4).toFixed();
-	}
-	handleKeyDown = (e) => {
-		let { choiceMode: t } = this.props;
-		if (t !== "checkbox") return;
-		let n = e.key === "ArrowDown", r = e.key === "ArrowUp";
-		if (!n && !r) return;
-		e.preventDefault();
-		let i = document.getElementById(this.choiceId);
-		if (!i) return;
-		let a = i.closest("fieldset");
-		if (!a) return;
-		let o = Array.from(a.querySelectorAll("input[type=\"checkbox\"]")), s = o.findIndex((e) => e === i);
-		if (s === -1) return;
-		let c = o[n ? s + 1 : s - 1];
-		c && c.focus();
-	};
-	render() {
-		let { choiceMode: n, disabled: r, displayKey: i, feedback: a, label: o, correctness: s, className: d, rationale: f, hideTick: p, isEvaluateMode: m, choicesLayout: h, value: g, checked: _, tagName: b, isSelectionButtonBelow: x } = this.props, S = n === "checkbox" ? M : P, k = n === "checkbox" ? "checkbox" : "radio-button", A = {
-			...h === "horizontal" && { [`& .${C}`]: {
-				padding: "8px",
-				margin: "4px 0 4px 4px"
-			} },
-			...x && h !== "grid" && { "& > label": { alignItems: "flex-start" } },
-			...x && h === "grid" && {
-				justifyContent: "center",
-				"& > label": { alignItems: "center" }
-			}
-		}, j = typeof o == "string" && (o.includes("<math") || o.includes("\\(") || o.includes("\\[") || o.includes("<img") || o.includes("data-latex") || o.includes("data-raw") || o.includes("<mjx-container")), N = i ? /* @__PURE__ */ l(D, {
-			id: this.descId,
-			children: j ? `Pick the answer below, ${i}` : i
-		}) : null, F = /* @__PURE__ */ l(c, { children: i && !x ? /* @__PURE__ */ u(w, {
-			component: "span",
-			children: [/* @__PURE__ */ u("span", {
-				"aria-hidden": "true",
-				children: [
-					i,
-					".",
-					"\xA0"
-				]
-			}), /* @__PURE__ */ l(v, {
-				className: "prompt-label",
-				prompt: o,
-				tagName: "span"
-			})]
-		}) : /* @__PURE__ */ l(v, {
-			className: "prompt-label",
-			prompt: o,
-			tagName: "span"
-		}) }), I = {
-			disabled: r,
-			checked: _,
-			correctness: s,
-			tagName: b,
-			value: g,
-			id: this.choiceId,
-			onChange: this.onToggleChoice,
-			onKeyDown: this.handleKeyDown,
-			...N ? { "aria-describedby": this.descId } : {}
-		}, L = x ? /* @__PURE__ */ u(E, { children: [
-			N,
-			/* @__PURE__ */ l(S, {
-				...I,
-				style: { padding: 0 }
-			}),
-			/* @__PURE__ */ l("span", {
-				"aria-hidden": "true",
-				children: i ? `${i}.` : ""
-			})
-		] }) : /* @__PURE__ */ u(c, { children: [N, /* @__PURE__ */ l(S, { ...I })] });
-		return /* @__PURE__ */ u("div", {
-			className: e(d, "corespring-" + k, "choice-input"),
-			children: [
-				/* @__PURE__ */ u(w, { children: [!p && m && /* @__PURE__ */ l(t, { correctness: s }), /* @__PURE__ */ l(T, {
-					className: "checkbox-holder",
-					sx: A,
-					children: /* @__PURE__ */ l(O, {
-						label: F,
-						value: g,
-						htmlFor: this.choiceId,
-						labelPlacement: x ? "top" : void 0,
-						control: L
-					})
-				})] }),
-				f && /* @__PURE__ */ l(v, {
-					className: "rationale",
-					defaultClassName: "rationale",
-					prompt: f
-				}),
-				/* @__PURE__ */ l(y, {
-					feedback: a,
-					correctness: s
-				})
-			]
-		});
-	}
-};
-//#endregion
-export { F as ChoiceInput, F as default, M as StyledCheckbox, O as StyledFormControlLabel, P as StyledRadio };