@pie-element/multi-trait-rubric 8.1.1 → 8.1.2-next.0

package/dist/controller/defaults.d.ts

@@ -0,0 +1,20 @@
+/**
+ * @synced-from pie-elements/packages/multi-trait-rubric/controller/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: {
+    addScaleEnabled: boolean;
+    description: boolean;
+    excludeZero: boolean;
+    halfScoring: boolean;
+    maxPointsEnabled: boolean;
+    pointLabels: boolean;
+    scales: never[];
+    standards: boolean;
+    visibleToStudent: boolean;
+};
+export default _default;

package/dist/controller/defaults.js

@@ -0,0 +1,14 @@
+//#region src/controller/defaults.ts
+var e = {
+	addScaleEnabled: !0,
+	description: !1,
+	excludeZero: !1,
+	halfScoring: !1,
+	maxPointsEnabled: !0,
+	pointLabels: !0,
+	scales: [],
+	standards: !1,
+	visibleToStudent: !0
+};
+//#endregion
+export { e as default };

package/dist/controller/index.d.ts

@@ -0,0 +1,26 @@
+/**
+ * @synced-from pie-elements/packages/multi-trait-rubric/controller/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 declare function createDefaultModel(model?: {}): Promise<unknown>;
+export declare const normalize: (question: any) => any;
+/**
+ *
+ * @param {*} question
+ * @param {*} session
+ * @param {*} env
+ */
+export declare function model(question: any, session: any, env: any): Promise<any>;
+export declare const getScore: () => number;
+/**
+ * @param {Object} model - the main model
+ * @param {*} session
+ * @param {Object} env
+ */
+export declare function outcome(): Promise<unknown>;
+export declare const createCorrectResponseSession: (question: any, env: any) => Promise<unknown>;
+export declare const validate: (model: any, config: any) => {};

package/dist/controller/index.js

@@ -0,0 +1,57 @@
+import e from "./defaults.js";
+import { markupToText as t } from "./utils.js";
+//#region src/controller/index.ts
+function n(t = {}) {
+	return new Promise((n) => n({
+		...e,
+		...t
+	}));
+}
+var r = (t) => ({
+	...e,
+	...t
+});
+async function i(e, t, n) {
+	let i = r(e);
+	!n.role || n.role === "student" ? i.visible = i.visibleToStudent : i.visible = !0;
+	let { scales: a, excludeZero: o } = i || {}, s = (a || []).map((e) => ({
+		...e,
+		excludeZero: o
+	}));
+	return {
+		...i,
+		scales: s
+	};
+}
+var a = () => 0;
+function o() {
+	return new Promise((e) => e({
+		score: 0,
+		empty: !0
+	}));
+}
+var s = (e, t) => new Promise((e) => {
+	t.mode !== "evaluate" && t.role === "instructor" ? e({ id: "1" }) : e(null);
+}), c = (e, n) => {
+	let { scales: r, description: i = !1, pointLabels: a = !1 } = e, o = {}, s = {}, c = {};
+	return (r || []).forEach((e, n) => {
+		let { traits: r = [] } = e, { scorePointsLabels: o = [] } = e, l = {}, u = {};
+		a && o.forEach((e, n) => {
+			!e || e === "<div></div>" ? u[n] = "Points labels should not be empty." : o.slice(n + 1).some((n) => t(n) === t(e)) && (u[n] = "Points labels should be unique.");
+		}), Object.keys(u).length > 0 && (c[n] = u), r.forEach((e, n) => {
+			if (!e.name || e.name === "<div></div>" ? l[n] = { name: "Trait names should not be empty." } : r.slice(n + 1).some((n) => t(n.name) === t(e.name)) && (l[n] = { name: "Trait names should be unique." }), i && (!e.description || e.description === "<div></div>")) l[n] = {
+				...l[n],
+				description: "Trait description should not be empty"
+			};
+			else {
+				let a = r.slice(n + 1).some((n) => t(n.description) === t(e.description));
+				i && a && (l[n] = {
+					...l[n],
+					description: "Trait descriptions should be unique."
+				});
+			}
+		}), Object.keys(l).length > 0 && (s[n] = l);
+	}), Object.keys(s).length > 0 && (o.traitsErrors = s), Object.keys(c).length > 0 && (o.scorePointsErrors = c), o;
+};
+//#endregion
+export { s as createCorrectResponseSession, n as createDefaultModel, a as getScore, i as model, r as normalize, o as outcome, c as validate };

package/dist/controller/utils.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @synced-from pie-elements/packages/multi-trait-rubric/controller/src/utils.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 markupToText: (s: any) => any;

package/dist/controller/utils.js

@@ -0,0 +1,4 @@
+//#region src/controller/utils.ts
+var e = (e) => (e || "").replace(/(<([^>]+)>)/gi, "");
+//#endregion
+export { e as markupToText };

package/dist/delivery/index.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @synced-from pie-elements/packages/multi-trait-rubric/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 MultiTraitRubric extends HTMLElement {
+    constructor();
+    set model(s: any);
+    set session(s: any);
+    get session(): any;
+    connectedCallback(): void;
+    _render(): void;
+    disconnectedCallback(): void;
+}

package/dist/delivery/index.js

@@ -0,0 +1,37 @@
+import e from "./main.js";
+import t from "react";
+import { createRoot as n } from "react-dom/client";
+import { ModelSetEvent as r } from "@pie-element/shared-player-events";
+import { renderMath as i } from "@pie-element/shared-math-rendering-mathjax";
+//#region src/delivery/index.ts
+var a = class extends HTMLElement {
+	constructor() {
+		super(), this._model = {}, this._session = null, this._root = null;
+	}
+	set model(e) {
+		this._model = e, this.dispatchEvent(new r(this.tagName.toLowerCase(), this._session, !!this._model)), this._render();
+	}
+	set session(e) {
+		this._session = e;
+	}
+	get session() {
+		return this._session;
+	}
+	connectedCallback() {
+		this._render();
+	}
+	_render() {
+		let r = t.createElement(e, {
+			model: this._model,
+			session: this._session
+		});
+		this._root ||= n(this), this._root.render(r), queueMicrotask(() => {
+			i(this);
+		});
+	}
+	disconnectedCallback() {
+		this._root && this._root.unmount();
+	}
+};
+//#endregion
+export { a as default };

package/dist/delivery/main.d.ts

@@ -0,0 +1,15 @@
+/**
+ * @synced-from pie-elements/packages/multi-trait-rubric/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';
+declare class Main extends React.Component {
+    constructor(props: any);
+    toggleRubric(): void;
+    render(): React.JSX.Element | null;
+}
+export default Main;

package/dist/delivery/main.js

@@ -0,0 +1,95 @@
+import e from "./scale.js";
+import t from "react";
+import n from "prop-types";
+import * as r from "@pie-lib/render-ui";
+import { UiLayout as i, color as a } from "@pie-lib/render-ui";
+import { jsx as o, jsxs as s } from "react/jsx-runtime";
+import c from "@mui/material/Link";
+import l from "@mui/material/Collapse";
+//#region src/delivery/main.tsx
+function u(e) {
+	return typeof e == "function" || typeof e == "object" && !!e && typeof e.$$typeof == "symbol";
+}
+function d(e, t) {
+	return !e || u(e) ? e : u(e.default) ? e.default : t && u(e[t]) ? e[t] : t && u(e[t]?.default) ? e[t].default : e;
+}
+var f = d(i, "UiLayout") || d(h.UiLayout, "UiLayout"), p = r, m = p.default, h = m && typeof m == "object" ? m : p, g = class extends t.Component {
+	constructor(e) {
+		super(e), this.state = {
+			rubricOpen: !1,
+			linkPrefix: "Show"
+		}, this.toggleRubric = this.toggleRubric.bind(this);
+	}
+	toggleRubric() {
+		this.setState({ rubricOpen: !this.state.rubricOpen }), this.setState({ linkPrefix: this.state.rubricOpen ? "Show" : "Hide" });
+	}
+	render() {
+		let { model: t } = this.props, { animationsDisabled: n } = this.props, { extraCSSRules: r, halfScoring: i, scales: u, visible: d, pointLabels: p, description: m, standards: h, arrowsDisabled: g } = t || {};
+		if (n ||= t.animationsDisabled, !u || !d) return null;
+		let _ = /* @__PURE__ */ s(f, {
+			extraCSSRules: r,
+			style: {
+				fontFamily: "Cerebri Sans",
+				color: a.text(),
+				backgroundColor: a.background()
+			},
+			children: [i ? /* @__PURE__ */ o("div", {
+				style: { marginBottom: "16px" },
+				children: "* Half-point or in-between scores are permitted under this rubric."
+			}) : null, u.map((t, n) => /* @__PURE__ */ o(e, {
+				scale: t,
+				scaleIndex: n,
+				showPointsLabels: p,
+				showDescription: m,
+				showStandards: h,
+				arrowsDisabled: g
+			}, `scale_${n}`))]
+		});
+		return n ? _ : /* @__PURE__ */ s(f, {
+			extraCSSRules: r,
+			style: {
+				color: a.text(),
+				backgroundColor: a.background()
+			},
+			children: [/* @__PURE__ */ s(c, {
+				style: { backgroundColor: a.background() },
+				href: this.dudUrl,
+				onClick: this.toggleRubric,
+				children: [this.state.linkPrefix, " Rubric"]
+			}), /* @__PURE__ */ o(l, {
+				style: { marginTop: "16px" },
+				in: this.state.rubricOpen,
+				timeout: {
+					enter: 225,
+					exit: 195
+				},
+				children: _
+			})]
+		});
+	}
+};
+g.propTypes = {
+	model: n.shape({
+		halfScoring: n.bool,
+		scales: n.arrayOf(n.shape({
+			excludeZero: n.bool,
+			maxPoints: n.number,
+			scorePointsLabels: n.arrayOf(n.string),
+			traitLabel: n.string,
+			traits: n.arrayOf(n.shape({
+				name: n.string,
+				description: n.string,
+				scorePointsDescriptors: n.arrayOf(n.string),
+				standards: n.arrayOf(n.string)
+			}))
+		})),
+		visible: n.bool,
+		pointLabels: n.bool,
+		description: n.bool,
+		standards: n.bool,
+		animationsDisabled: n.bool
+	}),
+	animationsDisabled: n.bool
+};
+//#endregion
+export { g as default };

package/dist/delivery/scale.d.ts

@@ -0,0 +1,17 @@
+/**
+ * @synced-from pie-elements/packages/multi-trait-rubric/src/scale.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';
+declare class Scale extends React.Component {
+    state: {};
+    componentDidMount(): void;
+    scrollLeft: any;
+    scrollRight: any;
+    render(): React.JSX.Element;
+}
+export default Scale;

package/dist/delivery/scale.js

@@ -0,0 +1,175 @@
+import e from "./trait.js";
+import t from "react";
+import n from "prop-types";
+import { styled as r } from "@mui/material/styles";
+import { color as i } from "@pie-lib/render-ui";
+import { jsx as a, jsxs as o } from "react/jsx-runtime";
+import s from "@mui/icons-material/ArrowBackIos";
+import c from "@mui/icons-material/ArrowForwardIos";
+//#region src/delivery/scale.tsx
+var l = r("div")({
+	display: "flex",
+	position: "relative"
+}), u = r("div")({
+	width: "100%",
+	overflow: "auto"
+}), d = r("table")(({ theme: e }) => ({
+	borderSpacing: 0,
+	marginBottom: e.spacing(2),
+	borderRadius: "4px",
+	color: i.text(),
+	fontSize: e.typography.fontSize,
+	lineHeight: "16px",
+	overflow: "unset",
+	"& ul, ol": {
+		marginBlockStart: 0,
+		paddingInlineStart: e.spacing(2)
+	},
+	"& th": {
+		padding: e.spacing(2),
+		textAlign: "left",
+		backgroundColor: i.secondaryBackground(),
+		verticalAlign: "bottom"
+	},
+	"& th div": { width: "200px" },
+	"& td": {
+		width: "200px",
+		padding: `${e.spacing(2)} ${e.spacing(1)}`,
+		verticalAlign: "top"
+	}
+})), f = r("table")({ "& td": {
+	border: 0,
+	padding: 0,
+	textAlign: "center",
+	minWidth: "200px"
+} }), p = r("div")({ marginBottom: "4px" }), m = r("td")({ fontWeight: "normal" }), h = ({ show: e, onClick: t, extraStyles: n, children: r }) => /* @__PURE__ */ a("div", {
+	style: {
+		height: "calc(100% - 1px)",
+		top: "1px",
+		display: e ? "flex" : "none",
+		width: "50px",
+		margin: "auto",
+		position: "absolute",
+		alignItems: "center",
+		justifyContent: "center",
+		cursor: "pointer",
+		...n
+	},
+	onClick: t,
+	children: r
+});
+h.propTypes = {
+	show: n.bool,
+	onClick: n.func,
+	extraStyles: n.object,
+	children: n.object
+};
+var g = class extends t.Component {
+	state = {};
+	componentDidMount() {
+		this.tableWrapper && this.tableWrapper.offsetWidth < this.tableWrapper.scrollWidth && this.setState({ showRight: !0 });
+	}
+	scrollLeft = () => {
+		this.tableWrapper.scrollLeft -= this.tableWrapper.offsetWidth / 2, this.setState({
+			showRight: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth,
+			showLeft: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth && this.tableWrapper.scrollLeft > 0
+		});
+	};
+	scrollRight = () => {
+		let e = this.tableWrapper.scrollLeft;
+		this.tableWrapper.scrollLeft += this.tableWrapper.offsetWidth / 2, this.setState({
+			showRight: e !== this.tableWrapper.scrollLeft && this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth,
+			showLeft: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth && this.tableWrapper.scrollLeft > 0
+		});
+	};
+	render() {
+		let { showRight: t, showLeft: n } = this.state, { scale: r, scaleIndex: g, showDescription: _, showPointsLabels: v, showStandards: y, arrowsDisabled: b } = this.props, { excludeZero: x, maxPoints: S, traitLabel: C, traits: w, scorePointsLabels: T } = r || {}, E = [], D, O, k;
+		try {
+			for (let e = S; +(e >= x); --e) E.push(e);
+			let { traitStandards: e, traitDescriptions: t } = w.reduce((e, t) => ({
+				traitStandards: [...e.traitStandards, ...t.standards || []],
+				traitDescriptions: [...e.traitDescriptions, ...t.description || []]
+			}), {
+				traitStandards: [],
+				traitDescriptions: []
+			});
+			D = _ && t.length, O = v && T.length, k = y && e.length;
+		} catch {
+			D = !1, O = !1, k = !1;
+		}
+		return /* @__PURE__ */ o(l, { children: [
+			/* @__PURE__ */ a(h, {
+				show: n && !b,
+				onClick: this.scrollLeft,
+				extraStyles: {
+					left: 0,
+					background: `linear-gradient(to right, white, ${i.background()})`
+				},
+				children: /* @__PURE__ */ a(s, {})
+			}),
+			/* @__PURE__ */ o(u, {
+				ref: (e) => {
+					this.tableWrapper = e;
+				},
+				onScroll: () => {
+					this.setState({
+						showRight: this.tableWrapper.scrollLeft + this.tableWrapper.offsetWidth < this.tableWrapper.scrollWidth - 5 && this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth,
+						showLeft: this.tableWrapper.scrollLeft < this.tableWrapper.scrollWidth && this.tableWrapper.scrollLeft > 0
+					});
+				},
+				children: [b && (t || n) ? /* @__PURE__ */ a("div", { children: "The item is too large to fit in print mode." }) : null, /* @__PURE__ */ o(d, { children: [/* @__PURE__ */ a("thead", { children: /* @__PURE__ */ o("tr", { children: [
+					/* @__PURE__ */ a("th", { children: /* @__PURE__ */ a("div", { dangerouslySetInnerHTML: { __html: C } }) }),
+					k ? /* @__PURE__ */ a("th", { children: /* @__PURE__ */ a("div", { children: "Standard(s)" }) }) : null,
+					D ? /* @__PURE__ */ a("th", { children: /* @__PURE__ */ a("div", { children: "Description" }) }) : null,
+					E && E.map((e, t) => {
+						let n = "";
+						try {
+							n = T[E.length - t - 1] || "";
+						} catch {
+							n = "";
+						}
+						return /* @__PURE__ */ a("th", { children: /* @__PURE__ */ a(f, { children: /* @__PURE__ */ o("thead", { children: [O ? /* @__PURE__ */ a("tr", { children: /* @__PURE__ */ a("td", { children: /* @__PURE__ */ a(p, { dangerouslySetInnerHTML: { __html: n } }) }) }) : null, /* @__PURE__ */ a("tr", { children: /* @__PURE__ */ a(m, { children: e === 1 ? `${e} point` : `${e} points` }) })] }) }) }, `table-header-${t}`);
+					})
+				] }) }), /* @__PURE__ */ a("tbody", { children: w && w.map((t, n) => /* @__PURE__ */ a(e, {
+					trait: t,
+					traitIndex: n,
+					showDescription: !!D,
+					showStandards: !!k,
+					scaleIndex: g,
+					scorePointsValues: E,
+					excludeZero: x
+				}, `trait_${g}_${n}`)) })] }, `scale-${g}`)]
+			}),
+			/* @__PURE__ */ a(h, {
+				show: t && !b,
+				onClick: this.scrollRight,
+				extraStyles: {
+					right: 0,
+					background: `linear-gradient(to left, white, ${i.background()})`
+				},
+				children: /* @__PURE__ */ a(c, {})
+			})
+		] });
+	}
+};
+g.propTypes = {
+	scaleIndex: n.number,
+	scale: n.shape({
+		excludeZero: n.bool,
+		maxPoints: n.number,
+		scorePointsLabels: n.arrayOf(n.string),
+		traitLabel: n.string,
+		traits: n.arrayOf(n.shape({
+			name: n.string,
+			standards: n.arrayOf(n.string),
+			scorePointsDescriptors: n.arrayOf(n.string),
+			description: n.string
+		}))
+	}),
+	showPointsLabels: n.bool,
+	showDescription: n.bool,
+	showStandards: n.bool,
+	arrowsDisabled: n.bool
+};
+//#endregion
+export { g as default };

package/dist/delivery/trait.d.ts

@@ -0,0 +1,27 @@
+/**
+ * @synced-from pie-elements/packages/multi-trait-rubric/src/trait.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';
+declare const Trait: {
+    (props: any): React.JSX.Element;
+    propTypes: {
+        showStandards: PropTypes.Requireable<boolean>;
+        showDescription: PropTypes.Requireable<boolean>;
+        scorePointsValues: PropTypes.Requireable<(number | null | undefined)[]>;
+        scaleIndex: PropTypes.Requireable<number>;
+        traitIndex: PropTypes.Requireable<number>;
+        trait: PropTypes.Requireable<PropTypes.InferProps<{
+            name: PropTypes.Requireable<string>;
+            standards: PropTypes.Requireable<(string | null | undefined)[]>;
+            scorePointsDescriptors: PropTypes.Requireable<(string | null | undefined)[]>;
+            description: PropTypes.Requireable<string>;
+        }>>;
+    };
+};
+export default Trait;

package/dist/delivery/trait.js

@@ -0,0 +1,44 @@
+import "react";
+import e from "prop-types";
+import { styled as t } from "@mui/material/styles";
+import { color as n } from "@pie-lib/render-ui";
+import { jsx as r, jsxs as i } from "react/jsx-runtime";
+//#region src/delivery/trait.tsx
+var a = t("td")({
+	color: n.primaryDark(),
+	verticalAlign: "middle"
+}), o = t("div")({
+	color: n.secondaryBackground(),
+	textAlign: "center"
+}), s = (e) => {
+	let { trait: t, traitIndex: n, scaleIndex: s, showStandards: c, showDescription: l, scorePointsValues: u } = e, { name: d, standards: f, scorePointsDescriptors: p, description: m } = t || {};
+	return /* @__PURE__ */ i("tr", { children: [
+		/* @__PURE__ */ r(a, { children: /* @__PURE__ */ r("div", { dangerouslySetInnerHTML: { __html: d } }) }),
+		c ? /* @__PURE__ */ r("td", { children: /* @__PURE__ */ r("div", { dangerouslySetInnerHTML: { __html: f.join(",") } }) }) : null,
+		l ? /* @__PURE__ */ r("td", { children: /* @__PURE__ */ r("div", { dangerouslySetInnerHTML: { __html: m } }) }) : null,
+		u && u.map((e, t) => {
+			let n;
+			try {
+				n = p[u.length - t - 1] || "";
+			} catch {
+				n = "";
+			}
+			return /* @__PURE__ */ r("td", { children: n ? /* @__PURE__ */ r("div", { dangerouslySetInnerHTML: { __html: n } }) : /* @__PURE__ */ r(o, { dangerouslySetInnerHTML: { __html: "No Description" } }) }, `table-cell-${t}`);
+		})
+	] }, `scale-${s}-trait-${n}`);
+};
+s.propTypes = {
+	showStandards: e.bool,
+	showDescription: e.bool,
+	scorePointsValues: e.arrayOf(e.number),
+	scaleIndex: e.number,
+	traitIndex: e.number,
+	trait: e.shape({
+		name: e.string,
+		standards: e.arrayOf(e.string),
+		scorePointsDescriptors: e.arrayOf(e.string),
+		description: e.string
+	})
+};
+//#endregion
+export { s as default };

package/dist/index.d.ts

@@ -0,0 +1 @@
+export { default } from './delivery/index.js';

package/dist/index.iife.d.ts

@@ -0,0 +1,8 @@
+/**
+ * IIFE entry point for multi-trait-rubric element
+ * This file is only used for IIFE builds and includes auto-registration
+ *
+ * @sync-generated - Auto-generated during sync from pie-elements
+ */
+import Element from './index.js';
+export default Element;