@pie-element/drawing-response 12.1.2-next.5 → 12.1.3

package/dist/author/defaults.d.ts

@@ -1,118 +0,0 @@
-/**
- * @synced-from pie-elements/packages/drawing-response/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: {
-        backgroundImageEnabled: boolean;
-        imageDimensions: {
-            height: number;
-            width: number;
-        };
-        imageUrl: string;
-        prompt: string;
-        promptEnabled: boolean;
-        spellCheckEnabled: boolean;
-        studentInstructionsEnabled: boolean;
-        teacherInstructions: string;
-        teacherInstructionsEnabled: boolean;
-        toolbarEditorPosition: string;
-    };
-    configuration: {
-        baseInputConfiguration: {
-            h3: {
-                disabled: boolean;
-            };
-            audio: {
-                disabled: boolean;
-            };
-            video: {
-                disabled: boolean;
-            };
-            image: {
-                disabled: boolean;
-            };
-            textAlign: {
-                disabled: boolean;
-            };
-            showParagraphs: {
-                disabled: boolean;
-            };
-            separateParagraphs: {
-                disabled: boolean;
-            };
-        };
-        spellCheck: {
-            label: string;
-            settings: boolean;
-            enabled: boolean;
-        };
-        backgroundImage: {
-            settings: boolean;
-            label: string;
-        };
-        prompt: {
-            settings: boolean;
-            label: string;
-            inputConfiguration: {
-                audio: {
-                    disabled: boolean;
-                };
-                video: {
-                    disabled: boolean;
-                };
-                image: {
-                    disabled: boolean;
-                };
-            };
-            required: boolean;
-        };
-        settingsPanelDisabled: boolean;
-        teacherInstructions: {
-            settings: boolean;
-            label: string;
-            inputConfiguration: {
-                audio: {
-                    disabled: boolean;
-                };
-                video: {
-                    disabled: boolean;
-                };
-                image: {
-                    disabled: boolean;
-                };
-            };
-            required: boolean;
-        };
-        maxImageWidth: {
-            teacherInstructions: number;
-            prompt: number;
-        };
-        maxImageHeight: {
-            teacherInstructions: number;
-            prompt: 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

@@ -1,86 +0,0 @@
-//#region src/author/defaults.ts
-var e = {
-	model: {
-		backgroundImageEnabled: !0,
-		imageDimensions: {
-			height: 0,
-			width: 0
-		},
-		imageUrl: "",
-		prompt: "",
-		promptEnabled: !0,
-		spellCheckEnabled: !0,
-		studentInstructionsEnabled: !0,
-		teacherInstructions: "",
-		teacherInstructionsEnabled: !0,
-		toolbarEditorPosition: "bottom"
-	},
-	configuration: {
-		baseInputConfiguration: {
-			h3: { disabled: !0 },
-			audio: { disabled: !1 },
-			video: { disabled: !1 },
-			image: { disabled: !1 },
-			textAlign: { disabled: !0 },
-			showParagraphs: { disabled: !1 },
-			separateParagraphs: { disabled: !0 }
-		},
-		spellCheck: {
-			label: "Spellcheck",
-			settings: !1,
-			enabled: !0
-		},
-		backgroundImage: {
-			settings: !0,
-			label: "Background Image"
-		},
-		prompt: {
-			settings: !0,
-			label: "Prompt",
-			inputConfiguration: {
-				audio: { disabled: !1 },
-				video: { disabled: !1 },
-				image: { disabled: !1 }
-			},
-			required: !1
-		},
-		settingsPanelDisabled: !1,
-		teacherInstructions: {
-			settings: !0,
-			label: "Teacher Instructions",
-			inputConfiguration: {
-				audio: { disabled: !1 },
-				video: { disabled: !1 },
-				image: { disabled: !1 }
-			},
-			required: !1
-		},
-		maxImageWidth: {
-			teacherInstructions: 300,
-			prompt: 300
-		},
-		maxImageHeight: {
-			teacherInstructions: 300,
-			prompt: 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/image-container.d.ts

@@ -1,42 +0,0 @@
-/**
- * @synced-from pie-elements/packages/drawing-response/configure/src/image-container.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, { Component } from 'react';
-import PropTypes from 'prop-types';
-export declare class ImageContainer extends Component {
-    static propTypes: {
-        imageDimensions: PropTypes.Requireable<object>;
-    };
-    static defaultProps: {};
-    constructor(props: any);
-    componentDidMount(): void;
-    handleFileRead: any;
-    handleUploadImage: any;
-    makeDropzoneActive: () => void;
-    makeDropzoneInactive: () => void;
-    handleOnDrop: any;
-    handleOnDragOver: any;
-    handleOnDragExit: any;
-    handleEnableDrag: () => void;
-    handleDisableDrag: () => void;
-    handleInputClick: any;
-    handleOnImageLoad: ({ target: { offsetHeight, offsetWidth, naturalHeight, naturalWidth } }: {
-        target: {
-            offsetHeight: any;
-            offsetWidth: any;
-            naturalHeight: any;
-            naturalWidth: any;
-        };
-    }) => void;
-    initialiseResize: any;
-    stopResizing: any;
-    startResizing: any;
-    renderUploadControl(label: any): React.JSX.Element;
-    render(): React.JSX.Element;
-}
-export default ImageContainer;

package/dist/author/image-container.js

@@ -1,183 +0,0 @@
-import e from "./button.js";
-import { Component as t } from "react";
-import n from "prop-types";
-import { jsx as r, jsxs as i } from "react/jsx-runtime";
-import { styled as a } from "@mui/material/styles";
-//#region src/author/image-container.tsx
-var o = (e) => e.type.match(/image.*/), s = a("div")(({ theme: e }) => ({ marginTop: e.spacing(1) })), c = a("div")(({ active: e }) => ({
-	border: e ? "1px solid #0032C2" : "1px solid #E0E1E6",
-	borderRadius: "5px"
-})), l = a("div")({
-	alignItems: "center",
-	display: "flex",
-	flexDirection: "column",
-	justifyContent: "center"
-}), u = a("div")({ minHeight: 350 }), d = a("img")({
-	alignItems: "center",
-	display: "flex",
-	justifyContent: "center"
-}), f = a("div")({
-	position: "relative",
-	width: "fit-content"
-}), p = a("div")({
-	borderBottom: "1px solid #727272",
-	borderRight: "1px solid #727272",
-	bottom: "-10px",
-	cursor: "se-resize",
-	height: "10px",
-	position: "absolute",
-	right: "-10px",
-	width: "10px"
-}), m = a("input")({ display: "none" }), h = a("div")({
-	backgroundColor: "#ECEDF1",
-	borderBottom: "1px solid #E0E1E6",
-	borderTopLeftRadius: "5px",
-	borderTopRightRadius: "5px",
-	display: "flex",
-	padding: "12px 8px"
-}), g = class extends t {
-	static propTypes = { imageDimensions: n.object };
-	static defaultProps = {};
-	constructor(e) {
-		super(e), this.state = {
-			maxImageWidth: "100%",
-			maxImageHeight: "auto",
-			dragEnabled: !0,
-			dropzoneActive: !1
-		}, this.fakeImageHandler = {
-			cancel: () => {},
-			done: (e, t) => this.props.onImageUpload(t),
-			fileChosen: () => {},
-			progress: () => {}
-		};
-	}
-	componentDidMount() {
-		if (this.imageSection) {
-			let { height: e, width: t } = this.imageSection.getBoundingClientRect();
-			this.setState({
-				maxImageWidth: t,
-				maxImageHeight: e
-			});
-		}
-	}
-	handleFileRead = (e) => {
-		let { onImageUpload: t, insertImage: n } = this.props, r = new FileReader();
-		r.onloadend = () => t(r.result), r.readAsDataURL(e), n && n({
-			...this.fakeImageHandler,
-			getChosenFile: () => e,
-			isPasted: !0
-		});
-	};
-	handleUploadImage = (e) => {
-		e.preventDefault();
-		let t = e.target.files[0];
-		this.handleFileRead(t);
-	};
-	makeDropzoneActive = () => this.setState({ dropzoneActive: !0 });
-	makeDropzoneInactive = () => this.setState({ dropzoneActive: !1 });
-	handleOnDrop = (e) => {
-		e.preventDefault();
-		let { items: t, files: n } = e.dataTransfer;
-		if (t && t[0].kind === "file") {
-			let e = t[0].getAsFile();
-			o(e) && this.handleFileRead(e);
-		} else o(n[0]) && this.handleFileRead(n[0]);
-		this.makeDropzoneInactive();
-	};
-	handleOnDragOver = (e) => {
-		e.preventDefault();
-		let { dropzoneActive: t } = this.state;
-		t || this.makeDropzoneActive();
-	};
-	handleOnDragExit = (e) => {
-		e.preventDefault(), this.makeDropzoneInactive();
-	};
-	handleEnableDrag = () => this.setState({ dragEnabled: !0 });
-	handleDisableDrag = () => this.setState({ dragEnabled: !1 });
-	handleInputClick = () => {
-		let { insertImage: e } = this.props;
-		e && e(this.fakeImageHandler);
-	};
-	handleOnImageLoad = ({ target: { offsetHeight: e, offsetWidth: t, naturalHeight: n, naturalWidth: r } }) => {
-		let { onUpdateImageDimension: i, imageDimensions: a } = this.props, o = this.resize, s = {
-			height: a && a.height || e || n,
-			width: a && a.width || t || r
-		}, c = r / n;
-		s.width !== s.height * c && (s.width = s.height * c), this.setState({ dimensions: s }), i(s), o.addEventListener("mousedown", this.initialiseResize, !1);
-	};
-	initialiseResize = () => {
-		window.addEventListener("mousemove", this.startResizing, !1), window.addEventListener("mouseup", this.stopResizing, !1);
-	};
-	stopResizing = () => {
-		let { onUpdateImageDimension: e } = this.props, { dimensions: t } = this.state;
-		this.handleEnableDrag(), e(t), window.removeEventListener("mousemove", this.startResizing, !1), window.removeEventListener("mouseup", this.stopResizing, !1);
-	};
-	startResizing = (e) => {
-		let t = this.image, { maxImageWidth: n, maxImageHeight: r, dimensions: i } = this.state, a = e.target.getBoundingClientRect(), o = e.clientX - a.left, s = e.clientY - a.top, c = i.width / i.height;
-		o <= n + 5 && o / c <= r + 5 && o > 150 && s > 150 && t && (t.style.width = `${o}px`, t.style.height = `${o / c}px`, this.setState({ dimensions: {
-			width: o,
-			height: o / c
-		} })), this.handleDisableDrag();
-	};
-	renderUploadControl(t) {
-		return /* @__PURE__ */ i("div", { children: [/* @__PURE__ */ r(e, {
-			label: t,
-			onClick: this.handleInputClick
-		}), /* @__PURE__ */ r(m, {
-			accept: "image/*",
-			onChange: this.handleUploadImage,
-			ref: (e) => {
-				this.input = e;
-			},
-			type: "file"
-		})] });
-	}
-	render() {
-		let { imageUrl: e, imageDimensions: t } = this.props, { dropzoneActive: n, dragEnabled: a, maxImageHeight: o, maxImageWidth: m } = this.state;
-		return /* @__PURE__ */ r(s, { children: /* @__PURE__ */ i(c, {
-			active: n,
-			...a ? {
-				onDragExit: this.handleOnDragExit,
-				onDragLeave: this.handleOnDragExit,
-				onDragOver: this.handleOnDragOver,
-				onDrop: this.handleOnDrop
-			} : {},
-			children: [/* @__PURE__ */ r(h, { children: this.renderUploadControl(e ? "Replace Image" : "Upload Image") }), /* @__PURE__ */ r(u, {
-				ref: (e) => {
-					this.imageSection = e;
-				},
-				children: e ? /* @__PURE__ */ i(f, { children: [/* @__PURE__ */ r(d, {
-					height: "auto",
-					onLoad: this.handleOnImageLoad,
-					ref: (e) => {
-						this.image = e;
-					},
-					src: e,
-					style: {
-						width: t && t.width ? t.width : void 0,
-						maxWidth: m,
-						maxHeight: o
-					},
-					alt: ""
-				}), /* @__PURE__ */ r(p, { ref: (e) => {
-					this.resize = e;
-				} })] }) : /* @__PURE__ */ i(u, {
-					as: l,
-					children: [
-						/* @__PURE__ */ r("label", { children: "Drag and drop or upload image from computer" }),
-						/* @__PURE__ */ r("br", {}),
-						this.renderUploadControl("Upload Image")
-					]
-				})
-			})]
-		}) });
-	}
-};
-g.propTypes = {
-	imageUrl: n.string.isRequired,
-	onImageUpload: n.func.isRequired,
-	onUpdateImageDimension: n.func.isRequired,
-	insertImage: n.func
-};
-//#endregion
-export { g as default };

package/dist/author/index.d.ts

@@ -1,37 +0,0 @@
-/**
- * @synced-from pie-elements/packages/drawing-response/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 DrawableResponseConfigure extends HTMLElement {
-    static createDefaultModel: (model: {} | undefined, config: any) => {
-        backgroundImageEnabled: boolean;
-        imageDimensions: {
-            height: number;
-            width: number;
-        };
-        imageUrl: string;
-        prompt: string;
-        promptEnabled: boolean;
-        spellCheckEnabled: boolean;
-        studentInstructionsEnabled: boolean;
-        teacherInstructions: string;
-        teacherInstructionsEnabled: boolean;
-        toolbarEditorPosition: string;
-    };
-    constructor();
-    set model(s: any);
-    set configuration(c: any);
-    dispatchModelUpdated(reset: any): void;
-    onModelChanged: any;
-    onConfigurationChanged: any;
-    insertImage: any;
-    onDeleteImage: any;
-    insertSound(handler: any): void;
-    onDeleteSound(src: any, done: any): void;
-    _render(): void;
-    disconnectedCallback(): void;
-}

package/dist/author/index.js

@@ -1,79 +0,0 @@
-import 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("hotspot:configure"), d = class i extends HTMLElement {
-	static createDefaultModel = (e = {}, n) => {
-		let r = {
-			...t.model,
-			...e
-		};
-		return n?.withRubric?.forceEnabled && !r.rubricEnabled && (r.rubricEnabled = !0), r;
-	};
-	constructor() {
-		super(), this._root = null, this._configuration = t.configuration, this._configuration.withRubric?.forceEnabled && (this._configuration.withRubric.settings = !1), this._model = i.createDefaultModel({}, this._configuration), this.onModelChanged = this.onModelChanged.bind(this);
-	}
-	set model(e) {
-		this._model = i.createDefaultModel(e, this._configuration), this._render();
-	}
-	set configuration(e) {
-		let n = {
-			...t.configuration,
-			...e
-		};
-		this._configuration = n;
-		let { withRubric: r = {} } = e || {};
-		r?.forceEnabled && (this._configuration.withRubric.settings = !1, this._model.rubricEnabled || (this._model.rubricEnabled = !0)), n?.language?.enabled ? n?.languageChoices?.options?.length && (this._model.language = n?.languageChoices.options[0].value) : n.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();
-	}
-	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, {
-			model: this._model,
-			configuration: this._configuration,
-			onModelChanged: this.onModelChanged,
-			onConfigurationChanged: this.onConfigurationChanged,
-			imageSupport: {
-				add: this.insertImage,
-				delete: this.onDeleteImage
-			},
-			uploadSoundSupport: {
-				add: this.insertSound.bind(this),
-				delete: this.onDeleteSound.bind(this)
-			}
-		});
-		this._root ||= r(this), this._root.render(t);
-	}
-	disconnectedCallback() {
-		this._root && this._root.unmount();
-	}
-};
-//#endregion
-export { d as default };

package/dist/author/root.d.ts

@@ -1,17 +0,0 @@
-/**
- * @synced-from pie-elements/packages/drawing-response/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 {
-    onPromptChanged: any;
-    onTeacherInstructionsChanged: any;
-    onUpdateImageDimension: any;
-    onImageUpload: any;
-    render(): React.JSX.Element;
-}
-export default Root;