@pie-element/passage 7.1.1 → 7.1.2-next.0

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/common.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @synced-from pie-elements/packages/passage/configure/src/common.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 RemoveAddButton: ({ label, type, onClick }: {
+    label: any;
+    type?: string | undefined;
+    onClick: any;
+}) => React.JSX.Element;
+export declare const PassageButton: any;
+export declare const ConfirmationDialog: {
+    ({ content, cancel, title, ok, open, onOk, onCancel }: {
+        content: any;
+        cancel: any;
+        title: any;
+        ok: any;
+        open: any;
+        onOk: any;
+        onCancel: any;
+    }): React.JSX.Element;
+    propTypes: {
+        content: PropTypes.Validator<string>;
+        title: PropTypes.Validator<string>;
+        cancel: PropTypes.Validator<string>;
+        ok: PropTypes.Validator<string>;
+        open: PropTypes.Validator<boolean>;
+        onCancel: PropTypes.Validator<(...args: any[]) => any>;
+        onOk: PropTypes.Validator<(...args: any[]) => any>;
+    };
+};

package/dist/author/common.js

@@ -0,0 +1,56 @@
+import "react";
+import e from "prop-types";
+import { styled as t } from "@mui/material/styles";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+import { Button as i } from "@mui/material";
+import a from "@mui/icons-material/RemoveCircle";
+import o from "@mui/icons-material/AddCircle";
+import s from "@mui/material/Dialog";
+import c from "@mui/material/DialogTitle";
+import l from "@mui/material/DialogContent";
+import u from "@mui/material/DialogContentText";
+import d from "@mui/material/DialogActions";
+var f = t(({ label: e, type: t = "add", onClick: s }) => /* @__PURE__ */ r(i, {
+	color: "primary",
+	size: "small",
+	onClick: s,
+	children: [/* @__PURE__ */ n(t === "add" ? o : a, {
+		fontSize: "small",
+		color: "primary",
+		style: { marginRight: 4 }
+	}), e]
+}))({
+	textDecoration: "underline",
+	"&:hover": {
+		textDecoration: "underline",
+		backgroundColor: "transparent"
+	},
+	display: "flex",
+	alignItems: "center"
+}), p = ({ content: e, cancel: t, title: a, ok: o, open: f, onOk: p, onCancel: m }) => /* @__PURE__ */ r(s, {
+	open: f,
+	children: [
+		/* @__PURE__ */ n(c, { children: a }),
+		/* @__PURE__ */ n(l, { children: /* @__PURE__ */ n(u, { children: e }) }),
+		/* @__PURE__ */ r(d, { children: [p && /* @__PURE__ */ n(i, {
+			onClick: p,
+			color: "primary",
+			children: o
+		}), m && /* @__PURE__ */ n(i, {
+			onClick: m,
+			color: "primary",
+			children: t
+		})] })
+	]
+});
+p.propTypes = {
+	content: e.string.isRequired,
+	title: e.string.isRequired,
+	cancel: e.string.isRequired,
+	ok: e.string.isRequired,
+	open: e.bool.isRequired,
+	onCancel: e.func.isRequired,
+	onOk: e.func.isRequired
+};
+//#endregion
+export { p as ConfirmationDialog, f as PassageButton };

package/dist/author/defaults.d.ts

@@ -0,0 +1,175 @@
+/**
+ * @synced-from pie-elements/packages/passage/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: {
+        authorEnabled: boolean;
+        passages: {
+            teacherInstructions: string;
+            title: string;
+            subtitle: string;
+            author: string;
+            text: string;
+        }[];
+        subtitleEnabled: boolean;
+        teacherInstructionsEnabled: boolean;
+        textEnabled: boolean;
+        titleEnabled: boolean;
+    };
+    configuration: {
+        baseInputConfiguration: {
+            audio: {
+                disabled: boolean;
+            };
+            video: {
+                disabled: boolean;
+            };
+            image: {
+                disabled: boolean;
+            };
+            h3: {
+                disabled: boolean;
+            };
+            blockquote: {
+                disabled: boolean;
+            };
+            textAlign: {
+                disabled: boolean;
+            };
+            showParagraphs: {
+                disabled: boolean;
+            };
+            separateParagraphs: {
+                disabled: boolean;
+            };
+        };
+        settingsPanelDisabled: boolean;
+        title: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+                textAlign: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        subtitle: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+                textAlign: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        author: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        text: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+                h3: {
+                    disabled: boolean;
+                };
+                blockquote: {
+                    disabled: boolean;
+                };
+                textAlign: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        teacherInstructions: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        maxImageWidth: {
+            teacherInstructions: number;
+            text: number;
+        };
+        maxImageHeight: {
+            teacherInstructions: number;
+            text: number;
+        };
+        mathMlOptions: {
+            mmlOutput: boolean;
+            mmlEditing: boolean;
+        };
+        language: {
+            settings: boolean;
+            label: string;
+            enabled: boolean;
+        };
+        languageChoices: {
+            label: string;
+            options: never[];
+        };
+        additionalPassage: {
+            settings: boolean;
+            label: string;
+            enabled: boolean;
+        };
+    };
+};
+export default _default;

package/dist/author/defaults.js

@@ -0,0 +1,113 @@
+//#region src/author/defaults.ts
+var e = {
+	model: {
+		authorEnabled: !0,
+		passages: [{
+			teacherInstructions: "",
+			title: "",
+			subtitle: "",
+			author: "",
+			text: ""
+		}],
+		subtitleEnabled: !0,
+		teacherInstructionsEnabled: !0,
+		textEnabled: !0,
+		titleEnabled: !0
+	},
+	configuration: {
+		baseInputConfiguration: {
+			audio: { disabled: !1 },
+			video: { disabled: !1 },
+			image: { disabled: !1 },
+			h3: { disabled: !0 },
+			blockquote: { disabled: !0 },
+			textAlign: { disabled: !0 },
+			showParagraphs: { disabled: !1 },
+			separateParagraphs: { disabled: !0 }
+		},
+		settingsPanelDisabled: !1,
+		title: {
+			settings: !0,
+			label: "Title",
+			inputConfiguration: {
+				audio: { disabled: !0 },
+				video: { disabled: !0 },
+				image: { disabled: !0 },
+				textAlign: { disabled: !1 }
+			},
+			required: !0
+		},
+		subtitle: {
+			settings: !0,
+			label: "Subtitle",
+			inputConfiguration: {
+				audio: { disabled: !0 },
+				video: { disabled: !0 },
+				image: { disabled: !0 },
+				textAlign: { disabled: !1 }
+			},
+			required: !1
+		},
+		author: {
+			settings: !0,
+			label: "Author",
+			inputConfiguration: {
+				audio: { disabled: !0 },
+				video: { disabled: !0 },
+				image: { disabled: !0 }
+			},
+			required: !1
+		},
+		text: {
+			settings: !0,
+			label: "Text",
+			inputConfiguration: {
+				audio: { disabled: !1 },
+				video: { disabled: !1 },
+				image: { disabled: !1 },
+				h3: { disabled: !1 },
+				blockquote: { disabled: !1 },
+				textAlign: { disabled: !1 }
+			},
+			required: !0
+		},
+		teacherInstructions: {
+			settings: !0,
+			label: "Teacher Instructions",
+			inputConfiguration: {
+				audio: { disabled: !1 },
+				video: { disabled: !1 },
+				image: { disabled: !1 }
+			},
+			required: !1
+		},
+		maxImageWidth: {
+			teacherInstructions: 300,
+			text: 300
+		},
+		maxImageHeight: {
+			teacherInstructions: 300,
+			text: 300
+		},
+		mathMlOptions: {
+			mmlOutput: !1,
+			mmlEditing: !1
+		},
+		language: {
+			settings: !1,
+			label: "Specify Language",
+			enabled: !1
+		},
+		languageChoices: {
+			label: "Language Choices",
+			options: []
+		},
+		additionalPassage: {
+			settings: !0,
+			label: "Additional Passage",
+			enabled: !1
+		}
+	}
+};
+//#endregion
+export { e as default };

package/dist/author/design.d.ts

@@ -0,0 +1,28 @@
+/**
+ * @synced-from pie-elements/packages/passage/configure/src/design.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: {
+        onModelChanged: PropTypes.Validator<(...args: any[]) => any>;
+        onConfigurationChanged: PropTypes.Requireable<(...args: any[]) => any>;
+        model: PropTypes.Validator<object>;
+        configuration: PropTypes.Validator<object>;
+        imageSupport: PropTypes.Validator<object>;
+        uploadSoundSupport: PropTypes.Validator<object>;
+        classes: PropTypes.Validator<object>;
+    };
+    constructor(props: any);
+    getInnerText: (html: any) => any;
+    onDelete: any;
+    removeAdditionalPassage: any;
+    addAdditionalPassage: any;
+    render(): React.JSX.Element;
+}
+export default Main;

package/dist/author/design.js

@@ -0,0 +1,120 @@
+import { ConfirmationDialog as e, PassageButton as t } from "./common.js";
+import n from "./passage.js";
+import r from "react";
+import i from "prop-types";
+import { styled as a } from "@mui/material/styles";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import { layout as c, settings as l } from "@pie-lib/config-ui";
+import u from "@mui/material/Typography";
+//#region src/author/design.tsx
+var { Panel: d, toggle: f, dropdown: p } = l, m = a(u)(({ theme: e }) => ({
+	paddingTop: e.spacing(2),
+	marginBottom: e.spacing(2)
+})), h = class extends r.Component {
+	static propTypes = {
+		onModelChanged: i.func.isRequired,
+		onConfigurationChanged: i.func,
+		model: i.object.isRequired,
+		configuration: i.object.isRequired,
+		imageSupport: i.object.isRequired,
+		uploadSoundSupport: i.object.isRequired,
+		classes: i.object.isRequired
+	};
+	constructor(e) {
+		super(e), this.state = {
+			showConfirmationDialog: !1,
+			indexToRemove: -1
+		};
+	}
+	getInnerText = (e) => (e || "").replaceAll(/<[^>]*>/g, "");
+	onDelete = (e, t, n) => {
+		let r = e.passages;
+		r.splice(t, 1), n({
+			...e,
+			passages: r
+		}), this.setState({
+			showConfirmationDialog: !1,
+			indexToRemove: -1
+		});
+	};
+	removeAdditionalPassage = (e) => {
+		let { model: t = {}, onModelChanged: n } = this.props, { passages: r = [] } = t, { teacherInstructions: i = "", title: a = "", subtitle: o = "", author: s = "", text: c = "" } = r[e];
+		this.getInnerText(i).trim() || this.getInnerText(a).trim() || this.getInnerText(o).trim() || this.getInnerText(s).trim() || this.getInnerText(c).trim() ? this.setState({
+			showConfirmationDialog: !0,
+			indexToRemove: e
+		}) : this.onDelete(t, e, n);
+	};
+	addAdditionalPassage = () => {
+		let { model: e, onModelChanged: t } = this.props, n = [...e.passages, {
+			teacherInstructions: "",
+			title: "",
+			subtitle: "",
+			author: "",
+			text: ""
+		}];
+		t({
+			...e,
+			passages: n
+		});
+	};
+	render() {
+		let { model: i, configuration: a, imageSupport: l, onConfigurationChanged: u, onModelChanged: h, uploadSoundSupport: g } = this.props, { settingsPanelDisabled: _, language: v = {}, languageChoices: y = {}, teacherInstructions: b = {}, title: x = {}, subtitle: S = {}, text: C = {}, author: w = {}, additionalPassage: T = {} } = a || {}, { extraCSSRules: E, passages: D } = i || {}, O = {
+			titleEnabled: x && x.settings && f(x.label),
+			subtitleEnabled: S && S.settings && f(S.label),
+			authorEnabled: w && w.settings && f(w.label),
+			textEnabled: C && C.settings && f(C.label),
+			"additionalPassage.enabled": T && T.settings && f(T.label, !0)
+		}, k = {
+			teacherInstructionsEnabled: b && b.settings && f(b.label),
+			"language.enabled": v && v.settings && f(v.label, !0),
+			language: v && v.settings && v.enabled && p(y.label, y.options)
+		}, A = `${T.label} will be deleted`, { indexToRemove: j, showConfirmationDialog: M } = this.state;
+		return /* @__PURE__ */ s(c.ConfigLayout, {
+			extraCSSRules: E,
+			hideSettings: _,
+			settings: /* @__PURE__ */ o(d, {
+				model: i,
+				configuration: a,
+				onChangeModel: (e) => h(e),
+				onChangeConfiguration: (e) => u(e),
+				groups: {
+					Settings: O,
+					Properties: k
+				}
+			}),
+			children: [D.map((e, c) => /* @__PURE__ */ s(r.Fragment, { children: [
+				c > 0 && /* @__PURE__ */ o(m, {
+					variant: "h5",
+					children: T.label
+				}),
+				/* @__PURE__ */ o(n, {
+					imageSupport: l,
+					uploadSoundSupport: g,
+					model: i,
+					configuration: a,
+					passageIndex: c,
+					onModelChanged: h
+				}),
+				c > 0 && T.enabled && /* @__PURE__ */ o(t, {
+					type: "remove",
+					label: `Remove ${T.label}`,
+					onClick: () => this.removeAdditionalPassage(c)
+				}),
+				c === 0 && T.enabled && D.length < 2 && /* @__PURE__ */ o(t, {
+					label: `Add ${T.label}`,
+					onClick: this.addAdditionalPassage
+				})
+			] }, c)), /* @__PURE__ */ o(e, {
+				open: M,
+				title: "Warning",
+				content: A,
+				cancel: "Cancel",
+				ok: "Ok",
+				onCancel: () => this.setState({ showConfirmationDialog: !1 }),
+				onOk: () => this.onDelete(i, j, h)
+			})]
+		});
+	}
+};
+//#endregion
+export { h as default };

package/dist/author/index.d.ts

@@ -0,0 +1,36 @@
+/**
+ * @synced-from pie-elements/packages/passage/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 PassageConfigure extends HTMLElement {
+    static createDefaultModel: (model?: {}) => {
+        authorEnabled: boolean;
+        passages: {
+            teacherInstructions: string;
+            title: string;
+            subtitle: string;
+            author: string;
+            text: string;
+        }[];
+        subtitleEnabled: boolean;
+        teacherInstructionsEnabled: boolean;
+        textEnabled: boolean;
+        titleEnabled: boolean;
+    };
+    constructor();
+    set model(m: any);
+    set configuration(c: any);
+    connectedCallback(): void;
+    modelChanged(m: any): void;
+    onConfigurationChanged(c: any): void;
+    insertImage(handler: any): void;
+    onDeleteImage(src: any, done: any): void;
+    insertSound(handler: any): void;
+    onDeleteSound(src: any, done: any): void;
+    render(): void;
+    disconnectedCallback(): void;
+}

package/dist/author/index.js

@@ -0,0 +1,66 @@
+import e from "./design.js";
+import t from "./defaults.js";
+import n from "react";
+import { createRoot as r } from "react-dom/client";
+import { DeleteImageEvent as i, DeleteSoundEvent as a, InsertImageEvent as o, InsertSoundEvent as s, ModelUpdatedEvent as c } from "@pie-element/shared-configure-events";
+//#region src/author/index.ts
+var l = class l extends HTMLElement {
+	static createDefaultModel = (e = {}) => ({
+		...t.model,
+		...e
+	});
+	constructor() {
+		super(), this._root = null, this._model = l.createDefaultModel(), this._configuration = t.configuration;
+	}
+	set model(e) {
+		this._model = l.createDefaultModel(e), this.render();
+	}
+	set configuration(e) {
+		this._configuration = e, this.render();
+	}
+	connectedCallback() {
+		this.render();
+	}
+	modelChanged(e) {
+		this._model = e, this.dispatchEvent(new c(this._model), !0), this.render();
+	}
+	onConfigurationChanged(e) {
+		this._configuration = e, this.render();
+	}
+	insertImage(e) {
+		this.dispatchEvent(new o(e));
+	}
+	onDeleteImage(e, t) {
+		this.dispatchEvent(new i(e, t));
+	}
+	insertSound(e) {
+		this.dispatchEvent(new s(e));
+	}
+	onDeleteSound(e, t) {
+		this.dispatchEvent(new a(e, t));
+	}
+	render() {
+		if (this._model) {
+			let t = n.createElement(e, {
+				model: this._model,
+				configuration: this._configuration,
+				onModelChanged: this.modelChanged.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);
+		}
+	}
+	disconnectedCallback() {
+		this._root && this._root.unmount();
+	}
+};
+//#endregion
+export { l as default };

package/dist/author/passage.d.ts

@@ -0,0 +1,27 @@
+/**
+ * @synced-from pie-elements/packages/passage/configure/src/passage.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 PassageComponent extends React.Component {
+    static propTypes: {
+        onModelChanged: PropTypes.Validator<(...args: any[]) => any>;
+        model: PropTypes.Validator<object>;
+        configuration: PropTypes.Validator<object>;
+        imageSupport: PropTypes.Validator<object>;
+        passageIndex: PropTypes.Validator<number>;
+        uploadSoundSupport: PropTypes.Validator<object>;
+    };
+    static defaultProps: {
+        passageIndex: number;
+    };
+    constructor(props: any);
+    handleChange: any;
+    render(): React.JSX.Element;
+}
+export default PassageComponent;