@pie-element/image-cloze-association 10.2.0-beta.0 → 10.2.0-next.18

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,88 @@
+/**
+ * @synced-from pie-elements/packages/image-cloze-association/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.
+ */
+declare const _default: {
+    model: {
+        rationale: string;
+        rationaleEnabled: boolean;
+        studentInstructionsEnabled: boolean;
+        teacherInstructions: string;
+        teacherInstructionsEnabled: boolean;
+    };
+    configuration: {
+        baseInputConfiguration: {
+            h3: {
+                disabled: boolean;
+            };
+            audio: {
+                disabled: boolean;
+            };
+            video: {
+                disabled: boolean;
+            };
+            image: {
+                disabled: boolean;
+            };
+            textAlign: {
+                disabled: boolean;
+            };
+            showParagraphs: {
+                disabled: boolean;
+            };
+            separateParagraphs: {
+                disabled: boolean;
+            };
+        };
+        maxImageWidth: {
+            teacherInstructions: number;
+        };
+        maxImageHeight: {
+            teacherInstructions: number;
+        };
+        settingsPanelDisabled: boolean;
+        spellCheck: {
+            label: string;
+            settings: boolean;
+            enabled: boolean;
+        };
+        teacherInstructions: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        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,58 @@
+//#region src/author/defaults.ts
+var e = {
+	model: {
+		rationale: "",
+		rationaleEnabled: !0,
+		studentInstructionsEnabled: !0,
+		teacherInstructions: "",
+		teacherInstructionsEnabled: !0
+	},
+	configuration: {
+		baseInputConfiguration: {
+			h3: { disabled: !0 },
+			audio: { disabled: !1 },
+			video: { disabled: !1 },
+			image: { disabled: !1 },
+			textAlign: { disabled: !0 },
+			showParagraphs: { disabled: !1 },
+			separateParagraphs: { disabled: !0 }
+		},
+		maxImageWidth: { teacherInstructions: 300 },
+		maxImageHeight: { teacherInstructions: 300 },
+		settingsPanelDisabled: !1,
+		spellCheck: {
+			label: "Spellcheck",
+			settings: !1,
+			enabled: !0
+		},
+		teacherInstructions: {
+			settings: !0,
+			label: "Teacher Instructions",
+			inputConfiguration: {
+				audio: { disabled: !1 },
+				video: { disabled: !1 },
+				image: { disabled: !1 }
+			},
+			required: !1
+		},
+		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,35 @@
+/**
+ * @synced-from pie-elements/packages/image-cloze-association/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 ImageClozeAssociationConfigure extends HTMLElement {
+    static createDefaultModel: (model?: {}) => {
+        rationale: string;
+        rationaleEnabled: boolean;
+        studentInstructionsEnabled: boolean;
+        teacherInstructions: string;
+        teacherInstructionsEnabled: boolean;
+    };
+    constructor();
+    set model(s: any);
+    set configuration(c: any);
+    set disableSidePanel(s: any);
+    dispatchModelUpdated(reset: any): void;
+    onModelChanged(m: any, reset: any): void;
+    onConfigurationChanged(config: 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,74 @@
+import { Root as e } from "./root.js";
+import t from "./defaults.js";
+import n from "react";
+import { createRoot as r } from "react-dom/client";
+import i from "debug";
+import { DeleteImageEvent as a, DeleteSoundEvent as o, InsertImageEvent as s, InsertSoundEvent as c, ModelUpdatedEvent as l } from "@pie-element/shared-configure-events";
+//#region src/author/index.ts
+var u = i("image-cloze-association:configure"), d = class i extends HTMLElement {
+	static createDefaultModel = (e = {}) => ({
+		...t.model,
+		...e
+	});
+	constructor() {
+		super(), this._root = null, this._model = i.createDefaultModel(), this.onModelChanged = this.onModelChanged.bind(this), this._configuration = t.configuration;
+	}
+	set model(e) {
+		this._model = i.createDefaultModel(e), this._render();
+	}
+	set configuration(e) {
+		this._configuration = e, this._render();
+	}
+	set disableSidePanel(e) {
+		this._disableSidePanel = e, this._render();
+	}
+	dispatchModelUpdated(e) {
+		let t = !!e;
+		this.dispatchEvent(new l(this._model, t));
+	}
+	onModelChanged(e, t) {
+		this._model = e, this.dispatchModelUpdated(t), this._render();
+	}
+	onConfigurationChanged(e) {
+		this._configuration = e, this._render();
+	}
+	insertImage(e) {
+		this.dispatchEvent(new s(e));
+	}
+	onDeleteImage(e, t) {
+		this.dispatchEvent(new a(e, t));
+	}
+	insertSound(e) {
+		this.dispatchEvent(new c(e));
+	}
+	onDeleteSound(e, t) {
+		this.dispatchEvent(new o(e, t));
+	}
+	_render() {
+		u("_render");
+		let t = n.createElement(e, {
+			disableSidePanel: this._disableSidePanel,
+			model: this._model,
+			configuration: this._configuration,
+			onModelChanged: this.onModelChanged.bind(this),
+			onConfigurationChanged: this.onConfigurationChanged.bind(this),
+			imageSupport: {
+				add: this.insertImage.bind(this),
+				delete: this.onDeleteImage.bind(this)
+			},
+			uploadSoundSupport: {
+				add: this.insertSound.bind(this),
+				delete: this.onDeleteSound.bind(this)
+			}
+		});
+		this._root ||= r(this), this._root.render(t);
+	}
+	connectedCallback() {
+		this._render();
+	}
+	disconnectedCallback() {
+		this._root &&= (this._root.unmount(), null);
+	}
+};
+//#endregion
+export { d as default };

package/dist/author/root.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @synced-from pie-elements/packages/image-cloze-association/configure/src/root.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';
+export declare class Root extends React.Component {
+    onTeacherInstructionsChanged: any;
+    render(): React.JSX.Element;
+}
+export default Root;

package/dist/author/root.js

@@ -0,0 +1,80 @@
+import e from "react";
+import t from "prop-types";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { styled as i } from "@mui/material/styles";
+import { InputContainer as a, layout as o, settings as s } from "@pie-lib/config-ui";
+import c from "@pie-lib/editable-html-tip-tap";
+//#region src/author/root.tsx
+var { Panel: l, toggle: u, dropdown: d } = s, f = i(a)(({ theme: e }) => ({
+	width: "100%",
+	paddingTop: e.spacing(2),
+	marginBottom: e.spacing(2)
+})), p = i("div")(({ theme: e }) => ({
+	fontSize: e.typography.fontSize - 2,
+	color: e.palette.error.main,
+	paddingTop: e.spacing(1)
+})), m = class extends e.Component {
+	onTeacherInstructionsChanged = (e) => {
+		this.props.onModelChanged({
+			...this.props.model,
+			teacherInstructions: e
+		});
+	};
+	render() {
+		let { model: e, configuration: t, onModelChanged: i, onConfigurationChanged: a, imageSupport: s, uploadSoundSupport: m } = this.props, { baseInputConfiguration: h = {}, contentDimensions: g = {}, maxImageWidth: _ = {}, maxImageHeight: v = {}, settingsPanelDisabled: y, spellCheck: b = {}, teacherInstructions: x = {}, withRubric: S = {}, mathMlOptions: C = {}, language: w = {}, languageChoices: T = {} } = t || {}, { errors: E = {}, extraCSSRules: D, spellCheckEnabled: O } = e || {}, { teacherInstructions: k } = E, A = {
+			teacherInstructionsEnabled: x.settings && u(x.label),
+			spellCheckEnabled: b.settings && u(b.label),
+			rubricEnabled: S?.settings && u(S?.label),
+			"language.enabled": w.settings && u(w.label, !0),
+			language: w.settings && w.enabled && d(T.label, T.options)
+		};
+		return /* @__PURE__ */ r(o.ConfigLayout, {
+			extraCSSRules: D,
+			dimensions: g,
+			hideSettings: y,
+			settings: /* @__PURE__ */ n(l, {
+				model: e,
+				configuration: t,
+				onChangeModel: (e) => i(e),
+				onChangeConfiguration: (e) => a(e),
+				groups: { Properties: A }
+			}),
+			children: [e && e.teacherInstructionsEnabled && /* @__PURE__ */ r(f, {
+				label: x.label,
+				children: [/* @__PURE__ */ n(c, {
+					markup: e.teacherInstructions || "",
+					onChange: this.onTeacherInstructionsChanged,
+					imageSupport: s,
+					nonEmpty: !1,
+					error: k,
+					spellCheck: O,
+					pluginProps: ((e = {}) => ({
+						...h,
+						...e
+					}))(x?.inputConfiguration),
+					maxImageWidth: _ && _.teacherInstructions,
+					maxImageHeight: v && v.teacherInstructions,
+					uploadSoundSupport: m,
+					languageCharactersProps: [{ language: "spanish" }, { language: "special" }],
+					mathMlOptions: C
+				}), k && /* @__PURE__ */ n(p, { children: k })]
+			}), /* @__PURE__ */ n("div", { children: "Image cloze association" })]
+		});
+	}
+};
+m.propTypes = {
+	onModelChanged: t.func,
+	onConfigurationChanged: t.func,
+	model: t.object.isRequired,
+	configuration: t.object.isRequired,
+	imageSupport: t.shape({
+		add: t.func.isRequired,
+		delete: t.func.isRequired
+	}),
+	uploadSoundSupport: t.shape({
+		add: t.func.isRequired,
+		delete: t.func.isRequired
+	})
+};
+//#endregion
+export { m as Root, m as default };