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

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;