@pie-element/multiple-choice 13.4.0-beta.0 → 13.4.0-next.13

package/author.js

@@ -0,0 +1,2 @@
+export { default } from './dist/author/index.js';
+export * from './dist/author/index.js';

package/configure.js

@@ -0,0 +1,2 @@
+export { default } from './dist/author/index.js';
+export * from './dist/author/index.js';

package/controller.js

@@ -0,0 +1 @@
+export * from './dist/controller/index.js';

package/dist/author/defaults.d.ts

@@ -0,0 +1,205 @@
+/**
+ * @synced-from pie-elements/packages/multiple-choice/configure/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.
+ */
+/** NOTE: teacherInstructions, studentInstructions, rationale & scoringType
+ * functionalities are not defined yet - the value for those can belong to
+ * model or to configure
+ */
+declare const _default: {
+    model: {
+        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;
+        keyboardEventsEnabled: boolean;
+    };
+    configuration: {
+        baseInputConfiguration: {
+            h3: {
+                disabled: boolean;
+            };
+            audio: {
+                disabled: boolean;
+            };
+            video: {
+                disabled: boolean;
+            };
+            image: {
+                disabled: boolean;
+            };
+            textAlign: {
+                disabled: boolean;
+            };
+            showParagraphs: {
+                disabled: boolean;
+            };
+            separateParagraphs: {
+                disabled: boolean;
+            };
+        };
+        choices: {
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+        };
+        spellCheck: {
+            label: string;
+            settings: boolean;
+            enabled: boolean;
+        };
+        choicesLayout: {
+            settings: boolean;
+            label: string;
+        };
+        gridColumns: {
+            label: string;
+        };
+        answerChoiceCount: number;
+        addChoiceButton: {
+            settings: boolean;
+            label: string;
+        };
+        choiceMode: {
+            settings: boolean;
+            label: string;
+        };
+        choicePrefix: {
+            settings: boolean;
+            label: string;
+        };
+        deleteChoice: {
+            settings: boolean;
+        };
+        feedback: {
+            settings: boolean;
+            label: string;
+        };
+        prompt: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        lockChoiceOrder: {
+            settings: boolean;
+            label: string;
+        };
+        partialScoring: {
+            settings: boolean;
+            label: string;
+        };
+        rationale: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        scoringType: {
+            settings: boolean;
+            label: string;
+        };
+        studentInstructions: {
+            settings: boolean;
+            label: string;
+        };
+        teacherInstructions: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        toolbarEditorPosition: {
+            settings: boolean;
+            label: string;
+        };
+        minAnswerChoices: number;
+        maxAnswerChoices: number;
+        maxImageWidth: {
+            teacherInstructions: number;
+            prompt: number;
+            rationale: number;
+            choices: number;
+        };
+        maxImageHeight: {
+            teacherInstructions: number;
+            prompt: number;
+            rationale: number;
+            choices: number;
+        };
+        withRubric: {
+            settings: boolean;
+            label: string;
+        };
+        mathMlOptions: {
+            mmlOutput: boolean;
+            mmlEditing: boolean;
+        };
+        language: {
+            settings: boolean;
+            label: string;
+            enabled: boolean;
+        };
+        languageChoices: {
+            label: string;
+            options: never[];
+        };
+    };
+};
+export default _default;

package/dist/author/defaults.js

@@ -0,0 +1,151 @@
+//#region src/author/defaults.ts
+var e = {
+	model: {
+		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",
+		keyboardEventsEnabled: !1
+	},
+	configuration: {
+		baseInputConfiguration: {
+			h3: { disabled: !0 },
+			audio: { disabled: !1 },
+			video: { disabled: !1 },
+			image: { disabled: !1 },
+			textAlign: { disabled: !0 },
+			showParagraphs: { disabled: !1 },
+			separateParagraphs: { disabled: !0 }
+		},
+		choices: { inputConfiguration: {
+			audio: { disabled: !1 },
+			video: { disabled: !1 },
+			image: { disabled: !1 }
+		} },
+		spellCheck: {
+			label: "Spellcheck",
+			settings: !1,
+			enabled: !0
+		},
+		choicesLayout: {
+			settings: !1,
+			label: "Choices Layout"
+		},
+		gridColumns: { label: "Grid columns" },
+		answerChoiceCount: 0,
+		addChoiceButton: {
+			settings: !0,
+			label: "Add a Choice"
+		},
+		choiceMode: {
+			settings: !0,
+			label: "Response Type"
+		},
+		choicePrefix: {
+			settings: !0,
+			label: "Choice Labels"
+		},
+		deleteChoice: { settings: !0 },
+		feedback: {
+			settings: !0,
+			label: "Feedback"
+		},
+		prompt: {
+			settings: !0,
+			label: "Prompt",
+			inputConfiguration: {
+				audio: { disabled: !1 },
+				video: { disabled: !1 },
+				image: { disabled: !1 }
+			},
+			required: !1
+		},
+		lockChoiceOrder: {
+			settings: !0,
+			label: "Lock Choice Order"
+		},
+		partialScoring: {
+			settings: !1,
+			label: "Allow Partial Scoring"
+		},
+		rationale: {
+			settings: !0,
+			label: "Rationale",
+			inputConfiguration: {
+				audio: { disabled: !0 },
+				video: { disabled: !0 },
+				image: { disabled: !1 }
+			},
+			required: !1
+		},
+		scoringType: {
+			settings: !1,
+			label: "Scoring Type"
+		},
+		studentInstructions: {
+			settings: !1,
+			label: "Student Instructions"
+		},
+		teacherInstructions: {
+			settings: !0,
+			label: "Teacher Instructions",
+			inputConfiguration: {
+				audio: { disabled: !1 },
+				video: { disabled: !1 },
+				image: { disabled: !1 }
+			},
+			required: !1
+		},
+		toolbarEditorPosition: {
+			settings: !1,
+			label: "Toolbar Editor Position"
+		},
+		minAnswerChoices: 2,
+		maxAnswerChoices: 5,
+		maxImageWidth: {
+			teacherInstructions: 300,
+			prompt: 300,
+			rationale: 636,
+			choices: 900
+		},
+		maxImageHeight: {
+			teacherInstructions: 300,
+			prompt: 300,
+			rationale: 300,
+			choices: 300
+		},
+		withRubric: {
+			settings: !1,
+			label: "Add Rubric"
+		},
+		mathMlOptions: {
+			mmlOutput: !1,
+			mmlEditing: !1
+		},
+		language: {
+			settings: !1,
+			label: "Specify Language",
+			enabled: !1
+		},
+		languageChoices: {
+			label: "Language Choices",
+			options: []
+		}
+	}
+};
+//#endregion
+export { e as default };

package/dist/author/index.d.ts

@@ -0,0 +1,26 @@
+/**
+ * @synced-from pie-elements/packages/multiple-choice/configure/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 default class MultipleChoice extends HTMLElement {
+    static createDefaultModel: (model?: {}) => any;
+    constructor();
+    set model(s: any);
+    set configuration(c: any);
+    set disableSidePanel(s: any);
+    dispatchModelUpdated(reset: any): void;
+    onModelChanged(m: any, reset: any): void;
+    onConfigurationChanged(c: any): void;
+    /** @param {done, progress, file} handler */
+    insertImage(handler: any): void;
+    onDeleteImage(src: any, done: any): void;
+    insertSound(handler: any): void;
+    onDeleteSound(src: any, done: any): void;
+    _render(): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+}

package/dist/author/index.js

@@ -0,0 +1,119 @@
+import { Main as e } from "./main.js";
+import t from "./defaults.js";
+import n from "react";
+import { createRoot as r } from "react-dom/client";
+import { defaults as i } from "@pie-element/shared-lodash";
+import a from "debug";
+import { DeleteImageEvent as o, DeleteSoundEvent as s, InsertImageEvent as c, InsertSoundEvent as l, ModelUpdatedEvent as u } from "@pie-element/shared-configure-events";
+import { choiceUtils as d } from "@pie-lib/config-ui";
+//#region src/author/index.ts
+var f = a("multiple-choice:configure"), p = (e, t = 0) => {
+	if (!e || e.length === 0) {
+		let e = [];
+		for (let n = 0; n < t; n++) e.push({
+			value: `${n}`,
+			label: "",
+			feedback: {
+				type: "none",
+				value: ""
+			}
+		});
+		return e;
+	}
+	return e;
+}, m = (e, n) => {
+	let r = i(e, t.configuration);
+	return {
+		configuration: r,
+		model: {
+			...n,
+			choices: p(n && n.choices || [], r && r.answerChoiceCount)
+		}
+	};
+}, h = class i extends HTMLElement {
+	static createDefaultModel = (e = {}) => {
+		let n = d.normalizeChoices({
+			...t.model,
+			...e,
+			choices: p(e && e.choices || [])
+		});
+		return n.choicesLayout = e.choicesLayout || e.verticalMode === !1 && "horizontal" || t.model.choicesLayout, n;
+	};
+	constructor() {
+		super(), this._root = null, this._reactContainer = null, this._model = i.createDefaultModel(), this._configuration = t.configuration, this.onModelChanged = this.onModelChanged.bind(this), this.onConfigurationChanged = this.onConfigurationChanged.bind(this);
+	}
+	set model(e) {
+		this._model = i.createDefaultModel(e), this._render();
+	}
+	set configuration(e) {
+		let n = m(e, this._model);
+		this.onModelChanged(n.model);
+		let r = {
+			...t.configuration,
+			...n.configuration
+		};
+		this._configuration = r, r?.language?.enabled ? r?.languageChoices?.options?.length && (this._model.language = r?.languageChoices.options[0].value) : r.language.settings && this._model.language ? (this._configuration.language.enabled = !0, (!this._configuration.languageChoices.options || !this._configuration.languageChoices.options.length) && (this._configuration.languageChoices.options = []), this._configuration.languageChoices.options.find((e) => e.value === this._model.language) || this._configuration.languageChoices.options.push({
+			value: this._model.language,
+			label: this._model.language
+		})) : delete this._model.language, this._render();
+	}
+	set disableSidePanel(e) {
+		this._disableSidePanel = e, this._render();
+	}
+	dispatchModelUpdated(e) {
+		let t = !!e;
+		this.dispatchEvent(new u(this._model, t));
+	}
+	onModelChanged(e, t) {
+		this._model = {
+			...this._model,
+			...e
+		}, this._render(), this.dispatchModelUpdated(t);
+	}
+	onConfigurationChanged(e) {
+		this._configuration = m(e, this._model).configuration, this._model && this.onModelChanged(this._model), this._render();
+	}
+	insertImage(e) {
+		this.dispatchEvent(new c(e));
+	}
+	onDeleteImage(e, t) {
+		this.dispatchEvent(new o(e, t));
+	}
+	insertSound(e) {
+		this.dispatchEvent(new l(e));
+	}
+	onDeleteSound(e, t) {
+		this.dispatchEvent(new s(e, t));
+	}
+	_render() {
+		f("_render - Starting render"), f("_render - Model:", this._model ? "present" : "missing"), f("_render - Configuration:", this._configuration ? "present" : "missing"), f("_render - Root exists:", !!this._root);
+		try {
+			let t = n.createElement(e, {
+				model: this._model,
+				configuration: this._configuration,
+				onModelChanged: this.onModelChanged,
+				onConfigurationChanged: this.onConfigurationChanged,
+				disableSidePanel: this._disableSidePanel,
+				imageSupport: {
+					add: this.insertImage.bind(this),
+					delete: this.onDeleteImage.bind(this)
+				},
+				uploadSoundSupport: {
+					add: this.insertSound.bind(this),
+					delete: this.onDeleteSound.bind(this)
+				}
+			});
+			this._root || (f("_render - Creating React container"), this._reactContainer = document.createElement("div"), this._reactContainer.className = "pie-configure-wrapper", this.appendChild(this._reactContainer), f("_render - Creating new React root"), this._root = r(this._reactContainer), f("_render - React root created successfully")), f("_render - Calling root.render()"), this._root.render(t), f("_render - Render completed successfully");
+		} catch (e) {
+			throw console.error("❌ [multiple-choice-configure] Render error:", e), console.error("Error stack:", e.stack), e;
+		}
+	}
+	connectedCallback() {
+		f("connectedCallback - Component connected to DOM"), f("connectedCallback - Model:", this._model ? "present" : "missing"), f("connectedCallback - Configuration:", this._configuration ? "present" : "missing"), this._render();
+	}
+	disconnectedCallback() {
+		f("disconnectedCallback - Component disconnected from DOM"), this._root &&= (f("disconnectedCallback - Unmounting React root"), this._root.unmount(), null), this._reactContainer &&= null;
+	}
+};
+//#endregion
+export { h as default };

package/dist/author/main.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @synced-from pie-elements/packages/multiple-choice/configure/src/main.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 class Main extends React.Component {
+    static propTypes: {
+        model: PropTypes.Validator<object>;
+        configuration: PropTypes.Validator<object>;
+        disableSidePanel: PropTypes.Requireable<boolean>;
+        onModelChanged: PropTypes.Validator<(...args: any[]) => any>;
+        onConfigurationChanged: PropTypes.Validator<(...args: any[]) => any>;
+        imageSupport: PropTypes.Requireable<PropTypes.InferProps<{
+            add: PropTypes.Validator<(...args: any[]) => any>;
+            delete: PropTypes.Validator<(...args: any[]) => any>;
+        }>>;
+    };
+    state: {
+        showWarning: boolean;
+    };
+    onRemoveChoice: any;
+    onAddChoice: any;
+    onChoiceChanged: any;
+    onPromptChanged: any;
+    onTeacherInstructionsChanged: any;
+    onModelChanged: any;
+    render(): React.JSX.Element;
+}
+export default Main;