@pie-element/matrix 4.1.1 → 4.1.2-next.1

package/dist/author/MatrixValues.d.ts

@@ -0,0 +1,29 @@
+/**
+ * @synced-from pie-elements/packages/matrix/configure/src/MatrixValues.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 ScoringContainer: any;
+export declare const MatrixColumns: any;
+export declare const ColumnLabelWrapper: any;
+export declare const RowLabelWrapper: any;
+export declare const ValueRowWrapper: any;
+export declare const ValueItemWrapper: any;
+export declare const ScoringRows: any;
+export declare const ScoringNumberInputWrapper: any;
+export declare const GridSeparatorHorizontal: any;
+export declare const GridSeparatorVertical: any;
+export declare const Content: any;
+declare const MatrixValues: {
+    (props: any): React.JSX.Element;
+    propTypes: {
+        model: PropTypes.Validator<object>;
+        onChangeModel: PropTypes.Validator<(...args: any[]) => any>;
+    };
+};
+export default MatrixValues;

package/dist/author/MatrixValues.js

@@ -0,0 +1,156 @@
+import e from "./NumberInput.js";
+import t from "./isNumeric.js";
+import n, { ACTION_TYPE as r } from "./MatrixLabelEditableButton.js";
+import "react";
+import i from "prop-types";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import s from "styled-components";
+//#region src/author/MatrixValues.tsx
+var c = "120px", l = s.div`
+  display: grid;
+  grid-template-columns: min-content min-content auto;
+`, u = s.div`
+  display: flex;
+  justify-content: space-between;
+  padding: 5px;
+`, d = s.div`
+  width: ${c};
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`, f = s.div`
+  width: 200px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`, p = s.div`
+  display: flex;
+  justify-content: space-between;
+`, m = s.div`
+  width: ${c};
+  height: 50px;
+  margin: 1px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+`, h = s.div`
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding: 5px;
+`, g = s.div`
+  width: 60px;
+  justify-self: center;
+  align-self: center;
+`, _ = s.div`
+  background: gray;
+  width: 100%;
+  height: 1px;
+`, v = s.div`
+  background: gray;
+  width: 1px;
+  height: 100%;
+`, y = s.div`
+  padding: 5px;
+`, b = (i) => {
+	let { model: s, onChangeModel: c } = i, { rowLabels: b, columnLabels: x, matrixValues: S, spellCheckEnabled: C } = s, w = (e, n) => {
+		let r = { ...S };
+		t(n) ? r[e] = parseInt(n, 10) : delete r[e], c({
+			...s,
+			matrixValues: r
+		});
+	}, T = (e, t) => {
+		let n = [...x];
+		n[e] = t, c({
+			...s,
+			columnLabels: n
+		});
+	}, E = (e, t) => {
+		let n = [...b];
+		n[e] = t, c({
+			...s,
+			rowLabels: n
+		});
+	}, D = ({ resourceIndex: e, actionType: t, setValue: n }) => {
+		let i = e, a = { ...S };
+		b.forEach((e, o) => {
+			switch (t) {
+				case r.clear:
+					delete a[`${o}-${i}`];
+					break;
+				case r.sortAscending:
+					a[`${o}-${i}`] = o + 1;
+					break;
+				case r.sortDescending:
+					a[`${o}-${i}`] = b.length - o;
+					break;
+				case r.set:
+					a[`${o}-${i}`] = n;
+					break;
+				default: throw "Incorrect actionType";
+			}
+		}), c({
+			...s,
+			matrixValues: a
+		});
+	}, O = ({ resourceIndex: e, actionType: t, setValue: n }) => {
+		let i = e, a = { ...S };
+		x.forEach((e, o) => {
+			switch (t) {
+				case r.clear:
+					delete a[`${i}-${o}`];
+					break;
+				case r.sortAscending:
+					a[`${i}-${o}`] = i + 1;
+					break;
+				case r.sortDescending:
+					a[`${i}-${o}`] = b.length - i;
+					break;
+				case r.set:
+					a[`${i}-${o}`] = n;
+					break;
+				default: throw "Incorrect actionType";
+			}
+		}), c({
+			...s,
+			matrixValues: a
+		});
+	};
+	return /* @__PURE__ */ o(l, { children: [
+		/* @__PURE__ */ a("div", {}),
+		/* @__PURE__ */ a(v, {}),
+		/* @__PURE__ */ a(u, { children: x.map((e, t) => /* @__PURE__ */ a(d, { children: /* @__PURE__ */ a(n, {
+			resourceIndex: t,
+			onAction: D,
+			value: e,
+			onLabelUpdate: (e) => T(t, e),
+			spellCheck: C
+		}) }, t)) }),
+		/* @__PURE__ */ a(_, {}),
+		/* @__PURE__ */ a(v, {}),
+		/* @__PURE__ */ a(_, {}),
+		/* @__PURE__ */ a(h, { children: b.map((e, t) => /* @__PURE__ */ a(f, { children: /* @__PURE__ */ a(n, {
+			resourceIndex: t,
+			onAction: O,
+			value: e,
+			onLabelUpdate: (e) => E(t, e),
+			spellCheck: C
+		}) }, t)) }),
+		/* @__PURE__ */ a(v, {}),
+		/* @__PURE__ */ a(y, { children: b.map((n, r) => /* @__PURE__ */ a(p, { children: x.map((n, i) => {
+			let o = `${r}-${i}`;
+			return /* @__PURE__ */ a(m, { children: /* @__PURE__ */ a(g, { children: /* @__PURE__ */ a(e, {
+				onFieldUpdate: (e) => w(o, e),
+				name: o,
+				placeholder: "#",
+				fieldValue: { value: t(S[o]) ? S[o] : "" }
+			}) }) }, i);
+		}) }, r)) })
+	] });
+};
+b.propTypes = {
+	model: i.object.isRequired,
+	onChangeModel: i.func.isRequired
+};
+//#endregion
+export { b as default };

package/dist/author/NumberInput.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @synced-from pie-elements/packages/matrix/configure/src/NumberInput.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 * as React from 'react';
+import PropTypes from 'prop-types';
+declare const NumericInput: {
+    (props: any): React.JSX.Element;
+    propTypes: {
+        name: PropTypes.Validator<string>;
+        placeholder: PropTypes.Validator<string>;
+        fieldValue: PropTypes.Validator<object>;
+        onFieldUpdate: PropTypes.Validator<(...args: any[]) => any>;
+    };
+};
+export default NumericInput;

package/dist/author/NumberInput.js

@@ -0,0 +1,61 @@
+import "react";
+import e from "prop-types";
+import { jsx as t } from "react/jsx-runtime";
+import { styled as n } from "@mui/material/styles";
+import { TextField as r } from "@mui/material";
+//#region src/author/NumberInput.tsx
+var i = n("div")`
+  width: 100%;
+  height: 100%;
+  input[type='number'] {
+    -moz-appearance: textfield;
+  }
+
+  input::-webkit-outer-spin-button,
+  input::-webkit-inner-spin-button {
+    -webkit-appearance: none;
+  }
+`, a = n(r)({
+	"& .MuiOutlinedInput-root": {
+		fontSize: "16px",
+		textAlign: "center!important",
+		padding: "0!important",
+		margin: "5px 0",
+		"&:hover .MuiOutlinedInput-notchedOutline": { borderColor: "gray !important" },
+		"&.Mui-focused .MuiOutlinedInput-notchedOutline": {
+			borderColor: "green !important",
+			borderWidth: "1px !important"
+		}
+	},
+	"& .MuiOutlinedInput-input": {
+		fontSize: "16px",
+		textAlign: "center",
+		padding: "0",
+		margin: "5px 0"
+	},
+	"& .MuiOutlinedInput-notchedOutline": {
+		borderWidth: "1px !important",
+		borderColor: "#d6d6d6 !important"
+	}
+}), o = (e) => {
+	let { onFieldUpdate: n, name: r, placeholder: o, fieldValue: s } = e;
+	return /* @__PURE__ */ t(i, { children: /* @__PURE__ */ t(a, {
+		name: r,
+		value: s.value,
+		inputRef: s.ref,
+		type: "number",
+		placeholder: o,
+		onChange: (e) => {
+			n(e.target.value);
+		},
+		variant: "outlined"
+	}) });
+};
+o.propTypes = {
+	name: e.string.isRequired,
+	placeholder: e.string.isRequired,
+	fieldValue: e.object.isRequired,
+	onFieldUpdate: e.func.isRequired
+};
+//#endregion
+export { o as default };

package/dist/author/columnLabelsGenerator.d.ts

@@ -0,0 +1,11 @@
+/**
+ * @synced-from pie-elements/packages/matrix/configure/src/columnLabelsGenerator.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 AGREEMENT_3: string[];
+declare const generateColumnLabels: (labelType: any, size: any) => any;
+export default generateColumnLabels;

package/dist/author/columnLabelsGenerator.js

@@ -0,0 +1,101 @@
+//#region src/author/columnLabelsGenerator.ts
+var e = [
+	"Disagree",
+	"Unsure",
+	"Agree"
+], t = [
+	"Strongly Disagree",
+	...e,
+	"Strongly Agree"
+], n = [
+	"Extremely Disagree",
+	...t,
+	"Extremely Agree"
+], r = [
+	"Infrequently",
+	"Unsure",
+	"Frequently"
+], i = [
+	"Very Infrequently",
+	...r,
+	"Very Frequently"
+], a = [
+	"Never",
+	...i,
+	"Always"
+], o = [
+	"No",
+	"Unsure",
+	"Yes"
+], s = [
+	"No",
+	"Not really",
+	"Unsure",
+	"Sometimes",
+	"Yes"
+], c = [
+	"No",
+	"Rarely",
+	"Not really",
+	"Unsure",
+	"Sometimes",
+	"Very Often",
+	"Always"
+], l = [
+	"Not Likely",
+	"Unsure",
+	"Likely"
+], u = [
+	"Very Unlikely",
+	...l,
+	"Very Likely"
+], d = [
+	"Extremely Unlikely",
+	...u,
+	"Extremely Likely"
+], f = [
+	"Not Important",
+	"Unsure",
+	"Important"
+], p = [
+	"Very Not Important",
+	...f,
+	"Very Important"
+], m = [
+	"Extremely Not Important",
+	...p,
+	"Extremely Important"
+], h = [
+	"Dislike",
+	"Unsure",
+	"Like"
+], g = [
+	"Really Dislike",
+	...h,
+	"Really Like"
+], _ = {
+	agreement_3: e,
+	agreement_5: t,
+	agreement_7: n,
+	frequency_3: r,
+	frequency_5: i,
+	frequency_7: a,
+	yesNo_3: o,
+	yesNo_5: s,
+	yesNo_7: c,
+	likelihood_3: l,
+	likelihood_5: u,
+	likelihood_7: d,
+	importance_3: f,
+	importance_5: p,
+	importance_7: m,
+	like_3: h,
+	like_5: g,
+	like_7: [
+		"Extremely Dislike",
+		...g,
+		"Extremely Like"
+	]
+}, v = (e, t) => _[`${e}_${t}`];
+//#endregion
+export { v as default };

package/dist/author/defaults.d.ts

@@ -0,0 +1,88 @@
+/**
+ * @synced-from pie-elements/packages/matrix/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: {
+        columnLabels: string[];
+        labelType: string;
+        matrixValues: {};
+        prompt: string;
+        promptEnabled: boolean;
+        rowLabels: string[];
+        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;
+            };
+        };
+        prompt: {
+            settings: boolean;
+            label: string;
+            inputConfiguration: {
+                audio: {
+                    disabled: boolean;
+                };
+                video: {
+                    disabled: boolean;
+                };
+                image: {
+                    disabled: boolean;
+                };
+            };
+            required: boolean;
+        };
+        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;
+        };
+    };
+};
+export default _default;

package/dist/author/defaults.js

@@ -0,0 +1,56 @@
+//#region src/author/defaults.ts
+var e = {
+	model: {
+		columnLabels: [
+			"COLUMN 1",
+			"COLUMN 2",
+			"COLUMN 3"
+		],
+		labelType: "agreement",
+		matrixValues: {},
+		prompt: "",
+		promptEnabled: !0,
+		rowLabels: ["STATEMENT 1", "STATEMENT 2"],
+		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 }
+		},
+		prompt: {
+			settings: !0,
+			label: "Prompt",
+			inputConfiguration: {
+				audio: { disabled: !1 },
+				video: { disabled: !1 },
+				image: { disabled: !1 }
+			},
+			required: !1
+		},
+		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
+		}
+	}
+};
+//#endregion
+export { e as default };

package/dist/author/index.d.ts

@@ -0,0 +1,31 @@
+/**
+ * @synced-from pie-elements/packages/matrix/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 Matrix extends HTMLElement {
+    static createDefaultModel: (model?: {}) => {
+        columnLabels: string[];
+        labelType: string;
+        matrixValues: {};
+        prompt: string;
+        promptEnabled: boolean;
+        rowLabels: string[];
+        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(c: 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 "./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 { DeleteSoundEvent as o, InsertSoundEvent as s, ModelUpdatedEvent as c } from "@pie-element/shared-configure-events";
+//#region src/author/index.ts
+var l = a("matrix:configure"), u = (e, n) => ({
+	configuration: i(e, t.configuration),
+	model: n
+}), d = class i extends HTMLElement {
+	static createDefaultModel = (e = {}) => ({
+		...t.model,
+		...e
+	});
+	constructor() {
+		super(), this._root = 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 t = u(e, this._model);
+		this.onModelChanged(t.model), this._configuration = t.configuration, this._render();
+	}
+	set disableSidePanel(e) {
+		this._disableSidePanel = e, this._render();
+	}
+	dispatchModelUpdated(e) {
+		let t = !!e;
+		this.dispatchEvent(new c(this._model, t));
+	}
+	onModelChanged(e, t) {
+		this._model = e, this._render(), this.dispatchModelUpdated(t);
+	}
+	onConfigurationChanged(e) {
+		this._configuration = u(e, this._model).configuration, this._model && this.onModelChanged(this._model), this._render();
+	}
+	insertSound(e) {
+		this.dispatchEvent(new s(e));
+	}
+	onDeleteSound(e, t) {
+		this.dispatchEvent(new o(e, t));
+	}
+	_render() {
+		l("_render");
+		let t = n.createElement(e, {
+			model: this._model,
+			configuration: this._configuration,
+			onModelChanged: this.onModelChanged,
+			onConfigurationChanged: this.onConfigurationChanged,
+			disableSidePanel: this._disableSidePanel,
+			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/isNumeric.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @synced-from pie-elements/packages/matrix/configure/src/isNumeric.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: (value: any) => boolean;
+export default _default;

package/dist/author/isNumeric.js

@@ -0,0 +1,4 @@
+//#region src/author/isNumeric.ts
+var e = (e) => /^-?\d+$/.test(e);
+//#endregion
+export { e as default };

package/dist/author/matrixEntities.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @synced-from pie-elements/packages/matrix/configure/src/matrixEntities.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 MATRIX_LABEL_TYPE: {
+    agreement: string;
+    frequency: string;
+    yesNo: string;
+    importance: string;
+    likelihood: string;
+    like: string;
+    custom: string;
+};

package/dist/author/matrixEntities.js

@@ -0,0 +1,12 @@
+//#region src/author/matrixEntities.ts
+var e = {
+	agreement: "agreement",
+	frequency: "frequency",
+	yesNo: "yesNo",
+	importance: "importance",
+	likelihood: "likelihood",
+	like: "like",
+	custom: "custom"
+};
+//#endregion
+export { e as MATRIX_LABEL_TYPE };