@pie-element/placement-ordering 14.1.2-next.5 → 14.1.3

package/dist/browser/delivery/index.js

@@ -1,1035 +0,0 @@
-import { C as e, _ as t, b as n, g as r, k as i, l as a, r as o, t as s, u as c, v as l } from "../browser-DHPggtaA.js";
-import { Mt as u, Pt as d, T as f, c as p, ct as m, dt as h, ft as g, l as _, lt as v, mt as y, n as b, s as x, st as S, t as C, u as ee, ut as te, v as w, yt as T } from "../drag-provider-C1slTlsc.js";
-import { t as E } from "../dist-D9ARZhQk.js";
-import D, { createElement as O, useRef as ne } from "react";
-import { createRoot as re } from "react-dom/client";
-import ie from "react-dom";
-import { jsx as k, jsxs as A } from "react/jsx-runtime";
-//#region ../../shared/player-events/dist/index.js
-var j = /* @__PURE__ */ i(s(), 1);
-(class e extends CustomEvent {
-	static {
-		this.TYPE = "model-set";
-	}
-	constructor(t, n, r) {
-		super(e.TYPE, {
-			bubbles: !0,
-			composed: !0,
-			detail: {
-				complete: n,
-				component: t,
-				hasModel: r
-			}
-		}), this.component = t, this.complete = n;
-	}
-});
-var ae = class e extends CustomEvent {
-	static {
-		this.TYPE = "session-changed";
-	}
-	constructor(t, n) {
-		super(e.TYPE, {
-			bubbles: !0,
-			composed: !0,
-			detail: {
-				complete: n,
-				component: t
-			}
-		}), this.component = t, this.complete = n;
-	}
-}, M = /* @__PURE__ */ i(u(), 1), oe = ({ bgFill: e, fgFill: t }) => /* @__PURE__ */ A("svg", {
-	preserveAspectRatio: "xMinYMin meet",
-	version: "1.1",
-	viewBox: "-283 359 34 35",
-	style: { enableBackground: "new -283 359 34 35" },
-	children: [
-		/* @__PURE__ */ k("circle", {
-			cx: "-266",
-			cy: "375.9",
-			r: "14",
-			fill: e
-		}),
-		/* @__PURE__ */ k("path", {
-			d: "M-280.5,375.9c0-8,6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5s-6.5,14.5-14.5,14.5S-280.5,383.9-280.5,375.9z\n         M-279.5,375.9c0,7.4,6.1,13.5,13.5,13.5c7.4,0,13.5-6.1,13.5-13.5s-6.1-13.5-13.5-13.5C-273.4,362.4-279.5,368.5-279.5,375.9z",
-			fill: e
-		}),
-		/* @__PURE__ */ k("polygon", {
-			points: "-265.4,383.1 -258.6,377.2 -261.2,374.2 -264.3,376.9 -268.9,368.7 -272.4,370.6",
-			fill: t
-		})
-	]
-});
-oe.propTypes = {
-	bgFill: M.default.string.isRequired,
-	fgFill: M.default.string.isRequired
-};
-var se = ({ bgFill: e, fgFill: t, borderFill: n }) => /* @__PURE__ */ A("svg", {
-	preserveAspectRatio: "xMinYMin meet",
-	version: "1.1",
-	viewBox: "-129.5 127 34 35",
-	style: { enableBackground: "new -129.5 127 34 35" },
-	children: [
-		/* @__PURE__ */ k("path", {
-			style: {
-				fill: "#D0CAC5",
-				stroke: "#E6E3E0",
-				strokeWidth: .75,
-				strokeMiterlimit: 10
-			},
-			d: "M-112.9,160.4c-8.5,0-15.5-6.9-15.5-15.5c0-8.5,6.9-15.5,15.5-15.5s15.5,6.9,15.5,15.5\n         C-97.4,153.5-104.3,160.4-112.9,160.4z"
-		}),
-		/* @__PURE__ */ k("path", {
-			style: {
-				fill: "#B3ABA4",
-				stroke: "#CDC7C2",
-				strokeWidth: .5,
-				strokeMiterlimit: 10
-			},
-			d: "M-113.2,159c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-105.2,159-113.2,159z"
-		}),
-		/* @__PURE__ */ k("circle", {
-			cx: "-114.2",
-			cy: "143.5",
-			r: "14",
-			fill: e
-		}),
-		/* @__PURE__ */ k("path", {
-			d: "M-114.2,158c-8,0-14.5-6.5-14.5-14.5s6.5-14.5,14.5-14.5s14.5,6.5,14.5,14.5S-106.2,158-114.2,158z\n         M-114.2,130c-7.4,0-13.5,6.1-13.5,13.5s6.1,13.5,13.5,13.5s13.5-6.1,13.5-13.5S-106.8,130-114.2,130z",
-			fill: n
-		}),
-		/* @__PURE__ */ k("polygon", {
-			points: "-114.8,150.7 -121.6,144.8 -119,141.8 -115.9,144.5 -111.3,136.3 -107.8,138.2",
-			fill: t
-		})
-	]
-});
-se.propTypes = {
-	bgFill: M.default.string.isRequired,
-	fgFill: M.default.string.isRequired,
-	borderFill: M.default.string.isRequired
-};
-var ce = y("div")(({ size: e }) => ({
-	width: e || "25px",
-	height: e || "25px"
-})), N = ({ open: e, size: t }) => /* @__PURE__ */ k(ce, {
-	size: t,
-	children: e ? /* @__PURE__ */ k(oe, {
-		bgFill: "#bce2ff",
-		fgFill: "#1a9cff"
-	}) : /* @__PURE__ */ k(se, {
-		bgFill: "white",
-		fgFill: "#1a9cff",
-		borderFill: "#bce2ff"
-	})
-});
-N.propTypes = {
-	open: M.default.bool,
-	size: M.default.string
-}, N.defaultProps = { open: !1 };
-//#endregion
-//#region ../../lib-react/correct-answer-toggle/dist/expander.js
-var le = "height ease-in 300ms, opacity ease-in 300ms", ue = y("div")(() => ({
-	position: "relative",
-	height: 0,
-	overflow: "hidden",
-	display: "flex",
-	visibility: "hidden",
-	width: 0,
-	"&.enter": {
-		transition: le,
-		opacity: 1,
-		height: "auto",
-		width: "auto",
-		visibility: "visible",
-		minHeight: "25px"
-	},
-	"&.enter-done": {
-		height: "auto",
-		visibility: "visible",
-		width: "auto",
-		minHeight: "25px"
-	},
-	"&.exit": {
-		transition: le,
-		opacity: 0,
-		height: 0,
-		visibility: "visible",
-		width: 0
-	},
-	"&.exit-done": {
-		opacity: 0,
-		visibility: "hidden",
-		height: 0,
-		width: 0
-	}
-})), de = (e) => {
-	let { show: t, children: n, className: r } = e, i = ne(null);
-	return /* @__PURE__ */ k(m, {
-		nodeRef: i,
-		in: t,
-		appear: !0,
-		mountOnEnter: !1,
-		timeout: 300,
-		classNames: {
-			enter: "enter",
-			enterDone: "enter-done",
-			exit: "exit",
-			exitDone: "exit-done"
-		},
-		children: /* @__PURE__ */ k(ue, {
-			ref: i,
-			className: r,
-			children: n
-		})
-	});
-};
-de.propTypes = {
-	show: M.default.bool.isRequired,
-	className: M.default.string,
-	children: M.default.oneOfType([M.default.arrayOf(M.default.node), M.default.node]).isRequired
-};
-//#endregion
-//#region ../../lib-react/correct-answer-toggle/dist/index.js
-function P(e) {
-	return typeof e == "function" || typeof e == "object" && !!e && typeof e.$$typeof == "symbol";
-}
-function F(e, t) {
-	return !e || P(e) ? e : P(e.default) ? e.default : t && P(e[t]) ? e[t] : t && P(e[t]?.default) ? e[t].default : e;
-}
-var fe = F(_, "Readable") || F(pe.Readable, "Readable"), I = b, L = I.default, pe = L && typeof L == "object" ? L : I, { translator: R } = E, me = {
-	WebkitTouchCallout: "none",
-	WebkitUserSelect: "none",
-	KhtmlUserSelect: "none",
-	MozUserSelect: "none",
-	msUserSelect: "none",
-	userSelect: "none"
-}, he = y("div")(() => ({
-	width: "100%",
-	cursor: "pointer"
-})), ge = y("div")(() => ({
-	margin: "0 auto",
-	textAlign: "center",
-	display: "flex"
-})), _e = y("div")(() => ({
-	width: "fit-content",
-	minWidth: "140px",
-	alignSelf: "center",
-	verticalAlign: "middle",
-	color: `var(--correct-answer-toggle-label-color, ${v.text()})`,
-	fontWeight: "normal",
-	...me
-})), z = y("div")(() => ({
-	position: "absolute",
-	width: "25px",
-	"&.enter": { opacity: "0" },
-	"&.enter-active": {
-		opacity: "1",
-		transition: "opacity 0.3s ease-in"
-	},
-	"&.exit": { opacity: "1" },
-	"&.exit-active": {
-		opacity: "0",
-		transition: "opacity 0.3s ease-in"
-	}
-})), ve = y("div")(() => ({
-	width: "25px",
-	marginRight: "5px",
-	display: "flex",
-	alignItems: "center"
-})), ye = class e extends D.Component {
-	static propTypes = {
-		onToggle: M.default.func,
-		toggled: M.default.bool,
-		show: M.default.bool,
-		hideMessage: M.default.string,
-		showMessage: M.default.string,
-		className: M.default.string,
-		language: M.default.string
-	};
-	static defaultProps = {
-		showMessage: "Show correct answer",
-		hideMessage: "Hide correct answer",
-		show: !1,
-		toggled: !1
-	};
-	constructor(t) {
-		super(t), this.state = { show: t.show }, this.openIconRef = D.createRef(), this.closedIconRef = D.createRef(), e.defaultProps = {
-			...e.defaultProps,
-			showMessage: R.t("common:showCorrectAnswer", { lng: t.language }),
-			hideMessage: R.t("common:hideCorrectAnswer", { lng: t.language })
-		};
-	}
-	onClick() {
-		this.props.onToggle(!this.props.toggled);
-	}
-	onTouch(e) {
-		e.preventDefault(), this.props.onToggle(!this.props.toggled);
-	}
-	UNSAFE_componentWillReceiveProps(t) {
-		this.setState({ show: t.show }), t.language !== this.props?.language && (e.defaultProps = {
-			...e.defaultProps,
-			showMessage: R.t("common:showCorrectAnswer", { lng: t.language }),
-			hideMessage: R.t("common:hideCorrectAnswer", { lng: t.language })
-		});
-	}
-	render() {
-		let { className: e, toggled: t, hideMessage: n, showMessage: r } = this.props;
-		return /* @__PURE__ */ k(he, {
-			className: e,
-			children: /* @__PURE__ */ k(de, {
-				show: this.state.show,
-				children: /* @__PURE__ */ A(ge, {
-					onClick: this.onClick.bind(this),
-					onTouchEnd: this.onTouch.bind(this),
-					children: [/* @__PURE__ */ A(ve, { children: [/* @__PURE__ */ k(m, {
-						nodeRef: this.openIconRef,
-						timeout: 400,
-						in: t,
-						exit: !t,
-						classNames: {
-							enter: "enter",
-							enterActive: "enter-active",
-							exit: "exit",
-							exitActive: "exit-active"
-						},
-						children: /* @__PURE__ */ k(z, {
-							ref: this.openIconRef,
-							children: /* @__PURE__ */ k(N, { open: t }, "correct-open")
-						})
-					}), /* @__PURE__ */ k(m, {
-						nodeRef: this.closedIconRef,
-						timeout: 5e3,
-						in: !t,
-						exit: t,
-						classNames: {
-							enter: "enter",
-							enterActive: "enter-active",
-							exit: "exit",
-							exitActive: "exit-active"
-						},
-						children: /* @__PURE__ */ k(z, {
-							ref: this.closedIconRef,
-							children: /* @__PURE__ */ k(N, { open: t }, "correct-closed")
-						})
-					})] }), /* @__PURE__ */ k(fe, {
-						false: !0,
-						children: /* @__PURE__ */ k(_e, {
-							"aria-hidden": !this.state.show,
-							children: t ? n : r
-						})
-					})]
-				})
-			})
-		});
-	}
-};
-//#endregion
-//#region ../../lib-react/drag/dist/node_modules/.bun/clsx@2.1.1/node_modules/clsx/dist/clsx.js
-function B(e) {
-	var t, n, r = "";
-	if (typeof e == "string" || typeof e == "number") r += e;
-	else if (typeof e == "object") if (Array.isArray(e)) {
-		var i = e.length;
-		for (t = 0; t < i; t++) e[t] && (n = B(e[t])) && (r && (r += " "), r += n);
-	} else for (n in e) e[n] && (r && (r += " "), r += n);
-	return r;
-}
-function V() {
-	for (var e, t, n = 0, r = "", i = arguments.length; n < i; n++) (e = arguments[n]) && (t = B(e)) && (r && (r += " "), r += t);
-	return r;
-}
-//#endregion
-//#region ../../lib-react/drag/dist/placeholder.js
-var be = y("div")(({ theme: e }) => ({
-	"&.placeholder": {
-		WebkitTouchCallout: "none",
-		WebkitUserSelect: "none",
-		KhtmlUserSelect: "none",
-		MozUserSelect: "none",
-		MsUserSelect: "none",
-		userSelect: "none",
-		width: "100%",
-		height: "100%",
-		background: v.white(),
-		transition: "background-color 200ms linear, border-color 200ms linear",
-		boxSizing: "border-box",
-		display: "grid",
-		gridRowGap: e.spacing(1),
-		gridColumnGap: e.spacing(1),
-		padding: e.spacing(1),
-		border: `2px dashed ${v.black()}`
-	},
-	"&.disabled": {
-		boxShadow: "none",
-		background: e.palette.background.paper
-	},
-	"&.over": {
-		border: `1px solid ${T[500]}`,
-		backgroundColor: `${T[300]}`
-	},
-	"&.board": {
-		padding: e.spacing(1),
-		display: "flex",
-		flexWrap: "wrap",
-		alignItems: "center",
-		minHeight: "100px",
-		justifyContent: "center",
-		overflow: "hidden",
-		touchAction: "none",
-		backgroundColor: v.backgroundDark()
-	},
-	"&.categorizeBoard": {
-		padding: e.spacing(.5),
-		display: "flex",
-		flexWrap: "wrap",
-		alignItems: "center",
-		minHeight: "100px",
-		justifyContent: "center",
-		overflow: "hidden",
-		touchAction: "none",
-		backgroundColor: v.backgroundDark()
-	},
-	"&.verticalPool": {
-		display: "flex",
-		flexFlow: "column wrap"
-	}
-})), H = (e) => {
-	let { children: t, className: n, isOver: r, type: i, grid: a, disabled: o, choiceBoard: s, isCategorize: c, isVerticalPool: l, minHeight: u, extraStyles: d } = e, f = V("placeholder", o && "disabled", r && "over", i, n), p = {};
-	if (a && a.columns && (p.gridTemplateColumns = `repeat(${a.columns}, 1fr)`), a && a.rows) {
-		let e = a.rowsRepeatValue || "1fr";
-		p.gridTemplateRows = `repeat(${a.rows}, ${e})`;
-	}
-	i === "choice" && (p.border = `1px solid ${v.borderLight()}`, p.background = v.backgroundDark());
-	let m = c ? "categorizeBoard" : "board";
-	return /* @__PURE__ */ k(be, {
-		style: {
-			...p,
-			minHeight: u,
-			...d
-		},
-		className: V(s ? m : f, l && "verticalPool"),
-		children: t
-	});
-};
-H.propTypes = {
-	choiceBoard: M.default.bool,
-	grid: M.default.shape({
-		columns: M.default.number,
-		rows: M.default.number,
-		rowsRepeatValue: M.default.string
-	}),
-	children: M.default.oneOfType([M.default.arrayOf(M.default.node), M.default.node]).isRequired,
-	className: M.default.string,
-	isOver: M.default.bool,
-	index: M.default.number,
-	type: M.default.string,
-	disabled: M.default.bool,
-	isCategorize: M.default.bool,
-	isVerticalPool: M.default.bool,
-	minHeight: M.default.number
-};
-//#endregion
-//#region src/delivery/tile.tsx
-var xe = (0, j.default)("pie-elements:placement-ordering:tile"), Se = y("div")(({ theme: e }) => ({
-	width: "100%",
-	fontSize: e.typography.fontSize + 4,
-	textAlign: "center",
-	color: `rgba(${e.palette.common.black}, 0.6)`
-})), U = ({ type: e, index: t, isOver: n, disabled: r }) => /* @__PURE__ */ k(H, {
-	type: e,
-	isOver: n,
-	disabled: r,
-	children: e === "target" && t !== void 0 && /* @__PURE__ */ k(Se, { children: t })
-});
-U.propTypes = {
-	type: M.default.string,
-	index: M.default.number,
-	isOver: M.default.bool,
-	disabled: M.default.bool
-};
-var Ce = y("div")(({ theme: e, isDragging: t, isOver: n, disabled: r, outcome: i, label: a, type: o }) => ({
-	cursor: r ? "not-allowed" : "grab",
-	width: "100%",
-	height: "100%",
-	padding: "10px",
-	boxSizing: "border-box",
-	overflow: "hidden",
-	border: o === "choice" || o === "target" ? `1px solid ${e.palette.grey[400]}` : "1px solid transparent",
-	backgroundColor: o === "choice" || o === "target" ? v.background() : "transparent",
-	transition: o === "choice" || o === "target" ? "background-color 150ms ease, border-color 150ms ease, opacity 150ms ease" : "none",
-	pointerEvents: "none",
-	userSelect: "none",
-	...(o === "choice" || o === "target") && { "&:hover": {
-		backgroundColor: r ? v.background() : v.secondary(),
-		borderColor: r ? e.palette.grey[400] : e.palette.primary.main,
-		transform: r ? "none" : "scale(1.02)"
-	} },
-	...(o === "choice" || o === "target") && n && !r && {
-		opacity: .4,
-		backgroundColor: v.primaryLight(),
-		borderColor: e.palette.primary.main,
-		borderStyle: "dashed",
-		transform: "scale(1.05)"
-	},
-	...(o === "choice" || o === "target") && t && !r && {
-		opacity: .6,
-		backgroundColor: v.secondaryLight(),
-		transform: "scale(1.05) rotate(2deg)",
-		boxShadow: "0 8px 16px rgba(0,0,0,0.2)",
-		cursor: "grabbing"
-	},
-	...(o === "choice" || o === "target") && r && {
-		cursor: "not-allowed",
-		"&:hover": {
-			backgroundColor: v.background(),
-			transform: "none"
-		}
-	},
-	...(o === "choice" || o === "target") && i === "incorrect" && { border: `1px solid ${v.incorrect()}` },
-	...(o === "choice" || o === "target") && i === "correct" && { border: `1px solid ${v.correct()}` },
-	...!a && {
-		border: "none",
-		"&:hover": { backgroundColor: "unset" }
-	}
-})), we = (e) => {
-	let { type: t, isDragging: n, empty: r, isOver: i, label: a, disabled: o, outcome: s, guideIndex: c } = e;
-	return r ? /* @__PURE__ */ k(U, {
-		type: t,
-		index: c,
-		isOver: i,
-		disabled: o
-	}) : /* @__PURE__ */ k(Ce, {
-		type: t,
-		isDragging: n,
-		isOver: i,
-		disabled: o,
-		outcome: s,
-		label: a,
-		dangerouslySetInnerHTML: { __html: a }
-	});
-}, W = (e) => {
-	let { label: t, type: n, id: r, empty: i, disabled: a, outcome: o, index: s, guideIndex: c, instanceId: l, draggable: u, tileIndex: d } = e, f = `tile-${n}-${r ?? "empty"}-${d}-${l}`, p = `drop-${n}-${r ?? "empty"}-${d}-${l}`, { attributes: m, listeners: _, setNodeRef: v, transform: y, isDragging: b } = h({
-		id: f,
-		data: {
-			id: r,
-			type: n,
-			instanceId: l,
-			value: t,
-			index: s
-		},
-		disabled: !u || a
-	}), { setNodeRef: x, isOver: S } = g({
-		id: p,
-		data: {
-			id: r,
-			type: n,
-			instanceId: l,
-			value: t,
-			index: s
-		},
-		disabled: b
-	}), C = D.useRef(null);
-	return D.useEffect(() => {
-		let e = C.current, t = (e) => {
-			e.preventDefault();
-		};
-		return e && e.addEventListener("touchstart", t, { passive: !1 }), () => {
-			e && e.removeEventListener("touchstart", t);
-		};
-	}, []), xe("[render], props: ", e), /* @__PURE__ */ k("div", {
-		ref: (e) => {
-			C.current = e, v(e), x(e);
-		},
-		style: {
-			transform: y ? `translate3d(${y.x}px, ${y.y}px, 0)` : void 0,
-			boxSizing: "border-box",
-			overflow: "visible",
-			padding: 0,
-			margin: 0,
-			textAlign: "center",
-			pointerEvents: "auto",
-			cursor: a ? "not-allowed" : b ? "grabbing" : "grab",
-			zIndex: b ? 1e3 : "auto",
-			willChange: b ? "transform" : "auto"
-		},
-		...u && !a ? {
-			..._,
-			...m
-		} : {},
-		children: /* @__PURE__ */ k(we, {
-			label: t,
-			id: r,
-			empty: i,
-			index: s,
-			guideIndex: c,
-			isOver: S,
-			isDragging: b,
-			disabled: a,
-			outcome: o,
-			type: n
-		})
-	});
-};
-W.propTypes = {
-	id: M.default.any,
-	label: M.default.string,
-	isOver: M.default.bool,
-	type: M.default.string,
-	empty: M.default.bool,
-	disabled: M.default.bool,
-	outcome: M.default.string,
-	index: M.default.number,
-	guideIndex: M.default.number,
-	instanceId: M.default.any,
-	draggable: M.default.bool,
-	tileIndex: M.default.number
-};
-//#endregion
-//#region src/delivery/tiler.tsx
-var G = {
-	choiceLabel: M.default.string,
-	targetLabel: M.default.string,
-	disabled: M.default.bool,
-	tiles: M.default.array.isRequired,
-	tileSize: M.default.string,
-	addGuide: M.default.bool
-}, Te = {
-	tileSize: "1fr",
-	disabled: !1,
-	addGuide: !1
-}, Ee = (e) => {
-	let t = (t, n) => (t.instanceId = e.instanceId, t.disabled = e.disabled, t.guideIndex = e.addGuide ? t.index + 1 : void 0, t.tileIndex = n, e.includeTargets || t.type === "choice" ? /* @__PURE__ */ O(W, {
-		...t,
-		key: n
-	}) : /* @__PURE__ */ O(W, {
-		...t,
-		label: "",
-		key: n
-	}));
-	return t.propTypes = { ...G }, t;
-}, De = y("div")(({ theme: e, includeTargets: t }) => ({
-	display: "grid",
-	paddingBottom: e.spacing(2),
-	...t && { gridGap: "10px" }
-})), Oe = y("div")({ textAlign: "center" }), ke = y("div")({
-	textAlign: "center",
-	gridRow: "3/4"
-}), Ae = y("div")(({ includeTargets: e }) => ({
-	gridAutoFlow: "column",
-	display: "grid",
-	...e && { gridGap: "10px" }
-})), je = y("div")({
-	gridColumn: "1/2",
-	textAlign: "center"
-}), Me = y("div")({
-	gridColumn: "2/3",
-	textAlign: "center"
-}), Ne = class extends D.Component {
-	static propTypes = { ...G };
-	static defaultProps = { ...Te };
-	render() {
-		let { includeTargets: e, choiceLabelEnabled: t, choiceLabel: n, targetLabel: r, tiles: i, tileSize: a } = this.props, o = e ? `auto ${a} auto ${a}` : `auto ${a} auto`, s = e ? i.length / 2 : i.length, c = {
-			gridTemplateColumns: e ? `repeat(${s}, ${a})` : `auto repeat(${Math.floor(s / 2) - 1}, ${a} 10px) ${a} auto`,
-			gridTemplateRows: o
-		}, l = { gridColumn: `1/${s + 1}` };
-		return /* @__PURE__ */ A(De, {
-			includeTargets: e,
-			style: c,
-			children: [
-				/* @__PURE__ */ k(Oe, {
-					style: l,
-					dangerouslySetInnerHTML: { __html: t ? n : "" }
-				}),
-				e && /* @__PURE__ */ k(ke, {
-					style: l,
-					dangerouslySetInnerHTML: { __html: r }
-				}),
-				i.map(Ee(this.props))
-			]
-		});
-	}
-}, Pe = class extends D.Component {
-	static propTypes = { ...G };
-	static defaultProps = { ...Te };
-	render() {
-		let { includeTargets: e, choiceLabelEnabled: t, choiceLabel: n, targetLabel: r, tiles: i, tileSize: a } = this.props, o = e ? 2 : 1, s = e ? i.length / 2 : i.length;
-		return /* @__PURE__ */ A(Ae, {
-			includeTargets: e,
-			style: {
-				gridTemplateColumns: `repeat(${o}, ${a})`,
-				gridTemplateRows: e ? `auto repeat(${s}, ${a})` : `auto auto repeat(${Math.floor(s / 2) - 1}, ${a} 10px) ${a} auto`
-			},
-			children: [
-				/* @__PURE__ */ k(je, { dangerouslySetInnerHTML: { __html: t ? n : "" } }),
-				e && /* @__PURE__ */ k(Me, { dangerouslySetInnerHTML: { __html: r } }),
-				i.map(Ee(this.props))
-			]
-		});
-	}
-}, K = (0, j.default)("pie-elements:placement-ordering:ordering"), Fe = (e, t, n) => {
-	let r = e.find((e, n) => n === t), i = e.filter((e, n) => n !== t);
-	return [
-		...i.slice(0, n),
-		r,
-		...i.slice(n)
-	];
-}, Ie = (e, n, r) => {
-	if (K("[swap]", e, n, r), !e || e.length <= 1 || n === void 0 || r === void 0) throw Error(`swap requires a non-empty array, fromIndex, toIndex: ${e}, ${n} ${r}`);
-	let i = t(e), a = e[r];
-	return i[r] = i[n], i[n] = a, i;
-};
-function Le(e, n) {
-	let r = t(e.response);
-	if (r[n.index] === n.id) r[n.index] = void 0;
-	else throw Error(`Tried to remove from index: ${n.index}, but the id doesn't match: array: ${r}, target: ${n.id}`);
-	return r;
-}
-function Re(e, n, r) {
-	let { response: i, opts: a } = e, o = t(i);
-	if (a.includeTargets) return n.type === "choice" && r.type === "target" ? (o[r.index] = n.id, o) : n.type === "target" && r.type === "choice" ? (o[n.index] = void 0, o) : n.type === "target" && r.type === "target" ? Ie(i, n.index, r.index) : (K("do nothing to the response"), i);
-	{
-		let t = e.response.findIndex((e) => e !== void 0 && e === n.id), i = e.response.findIndex((e) => e !== void 0 && e === r.id);
-		return K("fromIndex: ", t, "toIndex:", i), Fe(e.response, t, i);
-	}
-}
-function q(e, t, n, r) {
-	if (r.includeTargets) {
-		let i = [];
-		for (let r = 0; r < t.length; r++) {
-			let a = t[r], o = e.find((e) => a != null && e.id === a), s = n[r], c = Object.assign({
-				type: "target",
-				index: r,
-				empty: o === void 0
-			}, o, s, { draggable: o !== void 0 });
-			i.push(c);
-		}
-		return e.map((e) => t.indexOf(e.id) !== -1 && !r.allowSameChoiceInTargets ? {
-			type: "choice",
-			empty: !0,
-			droppable: !0,
-			draggable: !1
-		} : Object.assign({}, e, {
-			type: "choice",
-			droppable: !1,
-			draggable: !0
-		})).concat(i);
-	} else return t.reduce((t, r, i) => {
-		let a = Object.assign({
-			type: "empty",
-			draggable: !1,
-			droppable: !0
-		}, e.find((e) => e.id === r), n[i]), o = Object.assign({
-			type: "choice",
-			draggable: !0,
-			droppable: !0
-		}, e.find((e) => e.id === r), n[i]);
-		return i === 0 && t.push(a), t.push(o, a), t;
-	}, []);
-}
-function ze(e, t, r, i) {
-	return i = n({ includeTargets: !0 }, i), r ||= [], t = !t || a(t) ? i.includeTargets ? Array(e.length) : c(e, (e) => e.id) : t, {
-		choices: e,
-		response: t,
-		opts: i,
-		outcomes: r,
-		tiles: q(e, t, r, i)
-	};
-}
-function Be(e, t) {
-	switch (e.type) {
-		case "move": {
-			let { from: n, to: r } = e, i = Re(t, n, r), a = q(t.choices, i, t.outcomes, t.opts);
-			return Object.assign({}, t, {
-				response: i,
-				tiles: a
-			});
-		}
-		case "remove": {
-			let { target: n } = e, r = Le(t, n), i = q(t.choices, r, t.outcomes, t.opts);
-			return Object.assign({}, t, {
-				response: r,
-				tiles: i
-			});
-		}
-	}
-	return t;
-}
-//#endregion
-//#region src/delivery/utils.ts
-var Ve = (e, t) => {
-	if (!Array.isArray(e) || !Array.isArray(t) || e.length !== t.length) return !1;
-	let n = (e) => e.map((e) => JSON.stringify(e)).sort(), r = n(e), i = n(t), a = r.every((e, t) => e === i[t]), o = e.every((e, n) => JSON.stringify(e) === JSON.stringify(t[n]));
-	return a && !o;
-};
-//#endregion
-//#region src/delivery/placement-ordering.tsx
-function J(e) {
-	return typeof e == "function" || typeof e == "object" && !!e && typeof e.$$typeof == "symbol";
-}
-function Y(e, t) {
-	return !e || J(e) ? e : J(e.default) ? e.default : t && J(e[t]) ? e[t] : t && J(e[t]?.default) ? e[t].default : e;
-}
-var He = Y(w, "UiLayout") || Y(Q.UiLayout, "UiLayout"), X = Y(ee, "PreviewPrompt") || Y(Q.PreviewPrompt, "PreviewPrompt"), Ue = Y(S, "Feedback") || Y(Q.Feedback, "Feedback"), We = Y(f, "Collapsible") || Y(Q.Collapsible, "Collapsible"), Ge = b, Z = Ge.default, Q = Z && typeof Z == "object" ? Z : Ge, { translator: Ke } = E, qe = (0, j.default)("pie-elements:placement-ordering"), Je = y("div")({
-	color: v.text(),
-	backgroundColor: v.background(),
-	display: "flex",
-	flexDirection: "column",
-	alignItems: "center",
-	boxSizing: "border-box"
-}), Ye = y("div")(({ theme: e }) => ({ paddingBottom: e.spacing(1) })), Xe = y("div")(({ theme: e }) => ({ paddingBottom: e.spacing(2) })), Ze = y(ye)(({ theme: e }) => ({ paddingBottom: e.spacing(1) })), $ = y(We)(({ theme: e }) => ({
-	marginBottom: e.spacing(2),
-	alignSelf: "flex-start"
-})), Qe = (e) => {
-	let { tiler: t, ordering: n, onDropChoice: r, onRemoveChoice: i, ...a } = e;
-	return /* @__PURE__ */ k(t, {
-		...a,
-		tiles: n.tiles,
-		onDropChoice: (e, t) => r(e, t, n),
-		onRemoveChoice: (e) => i(e, n)
-	});
-};
-Qe.propTypes = {
-	tiler: M.default.func,
-	ordering: M.default.any,
-	onDropChoice: M.default.func,
-	onRemoveChoice: M.default.func
-};
-var $e = class extends D.Component {
-	static propTypes = {
-		onSessionChange: M.default.func.isRequired,
-		model: M.default.object.isRequired,
-		session: M.default.oneOfType([M.default.array.isRequired, M.default.object.isRequired])
-	};
-	constructor(e) {
-		super(e), this.instanceId = r();
-		let { value: t, needsReset: n } = this.validateSession(e);
-		this.state = { showingCorrect: !1 };
-		let { model: i } = e || {}, { env: a } = i || {}, { mode: o } = a || {};
-		n && o === "gather" && this.props.onSessionChange({
-			...e.session,
-			value: t
-		});
-	}
-	toggleCorrect = (e) => this.setState({ showingCorrect: e });
-	componentDidUpdate() {
-		d(ie.findDOMNode(this));
-	}
-	validateSession = ({ model: e, session: t }, n = !1) => {
-		let { config: r, choices: i } = e || {}, { includeTargets: a } = r || {}, s = i.map((e) => e.id), { value: c } = t || {}, u;
-		if (a) c && c.length !== s.length && (u = !0, c = c.length < s.length ? c.concat(Array(s.length - c.length)) : c.filter((e) => s.includes(e)));
-		else {
-			if (!c || !c.length || n) c = s;
-			else {
-				let e = l(s, c), t = l(c, s);
-				(e.length || t.length) && (c = s);
-			}
-			u = !o(t.value, c);
-		}
-		return u && console.warn("This session is not valid anymore. It will be reset."), {
-			value: c,
-			needsReset: u
-		};
-	};
-	UNSAFE_componentWillReceiveProps(e) {
-		let { model: t = {} } = e || {}, { model: n = {} } = this.props || {}, { correctResponse: r, config: i, choices: a = [], env: o } = t, { includeTargets: s } = i || {}, c = {}, l = n.language && n.language !== t.language, u = n.note && n.note === Ke.t("common:commonCorrectAnswerWithAlternates", { lng: n.language });
-		l && u && (n.note = Ke.t("common:commonCorrectAnswerWithAlternates", { lng: t.language })), r || (c.showingCorrect = !1);
-		let d = Ve(a, n.choices), { value: f, needsReset: p } = this.validateSession(e, d), m = {
-			...e.session,
-			value: f
-		}, h = n.config?.includeTargets !== s;
-		s && h && (p = !0, delete m.value), this.setState(c, () => {
-			let { mode: e } = o || {};
-			p && e === "gather" && this.props.onSessionChange(m);
-		});
-	}
-	onDropChoice = (e, t, n) => {
-		let { onSessionChange: r, session: i } = this.props, a = n.tiles.find((e) => e.id === t.id && e.type === t.type && e.index === t.index), o = e;
-		qe("[onDropChoice] ", a, o);
-		let s = Be({
-			type: "move",
-			from: a,
-			to: o
-		}, n);
-		r(Object.assign({}, i, { value: s.response }));
-	};
-	onRemoveChoice = (e, t) => {
-		let { onSessionChange: n, session: r } = this.props;
-		qe("[onRemoveChoice]", e);
-		let i = Be({
-			type: "remove",
-			target: e
-		}, t);
-		n(Object.assign({}, r, { value: i.response }));
-	};
-	createOrdering = () => {
-		let { model: e, session: t } = this.props, { showingCorrect: n } = this.state, { includeTargets: r } = e.config || {
-			orientation: "vertical",
-			includeTargets: !0
-		};
-		return n ? ze(e.choices, e.correctResponse, e.correctResponse.map((e) => ({
-			id: e,
-			outcome: "correct"
-		})), {
-			includeTargets: r,
-			allowSameChoiceInTargets: e.config.allowSameChoiceInTargets
-		}) : ze(e.choices, t.value, e.outcomes, {
-			includeTargets: r,
-			allowSameChoiceInTargets: e.config.allowSameChoiceInTargets
-		});
-	};
-	onDragEnd = (e) => {
-		let { over: t, active: n } = e, r = this.createOrdering();
-		if (t && n) {
-			let e = n.data.current, i = t.data.current;
-			if (e && i && i.type === "target") {
-				this.onDropChoice(i, e, r);
-				return;
-			}
-			e && i && this.onDropChoice(i, e, r);
-		} else if (!t && n) {
-			let e = n.data.current;
-			e && e.type === "target" && this.onRemoveChoice(e, r);
-		}
-	};
-	render() {
-		let { model: e } = this.props, { correctResponse: t, correctness: n, extraCSSRules: r, prompt: i, rationale: a, feedback: o, config: s, note: c, showNote: l, env: u, disabled: d, teacherInstructions: f, language: m } = e, h = t && t.length > 0, { showingCorrect: g } = this.state, _ = s || {
-			orientation: "vertical",
-			includeTargets: !0
-		}, { orientation: y, includeTargets: b } = _, S = y === "vertical", ee = this.createOrdering(), { mode: w, role: T } = u || {}, E = S ? Pe : Ne, D = (g || w === "view" && T === "instructor") && l && c, O = a && (p(a) || x(a)), ne = f && (p(f) || x(f)), re = {
-			color: v.text(),
-			backgroundColor: v.background(),
-			display: "flex",
-			flexDirection: "column",
-			alignItems: "center",
-			boxSizing: "border-box"
-		};
-		return /* @__PURE__ */ k(C, {
-			onDragStart: () => {},
-			onDragEnd: this.onDragEnd,
-			collisionDetection: te,
-			children: /* @__PURE__ */ k(Je, { children: /* @__PURE__ */ A(He, {
-				extraCSSRules: r,
-				style: re,
-				children: [
-					ne && /* @__PURE__ */ k($, {
-						labels: {
-							hidden: "Show Teacher Instructions",
-							visible: "Hide Teacher Instructions"
-						},
-						className: "collapsible",
-						children: /* @__PURE__ */ k(X, { prompt: f })
-					}),
-					/* @__PURE__ */ k(Ye, { children: /* @__PURE__ */ k(X, { prompt: i }) }),
-					/* @__PURE__ */ k(Ze, {
-						show: h,
-						toggled: g,
-						onToggle: this.toggleCorrect,
-						language: m
-					}),
-					/* @__PURE__ */ k(Qe, {
-						instanceId: this.instanceId,
-						choiceLabel: _.choiceLabel,
-						targetLabel: _.targetLabel,
-						ordering: ee,
-						tiler: E,
-						disabled: d,
-						addGuide: _.showOrdering,
-						tileSize: _.tileSize,
-						includeTargets: b,
-						choiceLabelEnabled: e.config && e.config.choiceLabelEnabled
-					}),
-					D && /* @__PURE__ */ k(Xe, { dangerouslySetInnerHTML: { __html: c } }),
-					O && /* @__PURE__ */ k($, {
-						labels: {
-							hidden: "Show Rationale",
-							visible: "Hide Rationale"
-						},
-						className: "collapsible",
-						children: /* @__PURE__ */ k(X, { prompt: a })
-					}),
-					!g && /* @__PURE__ */ k(Ue, {
-						correctness: n,
-						feedback: o
-					})
-				]
-			}) })
-		});
-	}
-}, et = class extends D.Component {
-	static propTypes = {
-		model: M.default.object.isRequired,
-		session: M.default.oneOfType([M.default.array.isRequired, M.default.object.isRequired]),
-		onSessionChange: M.default.func.isRequired
-	};
-	render() {
-		let { model: e, session: t, onSessionChange: n } = this.props;
-		return /* @__PURE__ */ k($e, {
-			model: e,
-			session: t,
-			onSessionChange: n
-		});
-	}
-}, tt = (0, j.default)("pie-elements:placement-ordering"), nt = ({ model: t, session: n }) => {
-	let { config: r } = t, i = (n && e(n.value) || []).length === t.choices.length;
-	return r.includeTargets || i;
-}, rt = class extends HTMLElement {
-	constructor() {
-		super(), this._root = null, this._mathObserver = null, this._mathRenderPending = !1;
-	}
-	_scheduleMathRender = () => {
-		this._mathRenderPending || (this._mathRenderPending = !0, requestAnimationFrame(() => {
-			this._mathObserver && this._mathObserver.disconnect(), d(this), this._mathRenderPending = !1, setTimeout(() => {
-				this._mathObserver && this._mathObserver.observe(this, {
-					childList: !0,
-					subtree: !0
-				});
-			}, 50);
-		}));
-	};
-	_initMathObserver() {
-		this._mathObserver || (this._mathObserver = new MutationObserver(this._scheduleMathRender), this._mathObserver.observe(this, {
-			childList: !0,
-			subtree: !0
-		}));
-	}
-	_disconnectMathObserver() {
-		this._mathObserver &&= (this._mathObserver.disconnect(), null);
-	}
-	isComplete = (t) => t && e(t).length === this._model.completeLength;
-	sessionChange = (e) => {
-		this._session.value = e.value, this.render(), this.dispatchEvent(new ae(this.tagName.toLowerCase(), this._session && this.isComplete(this._session.value)));
-	};
-	set model(e) {
-		this._model = e, this.render(), this.dispatchEvent(new CustomEvent("model-set", {
-			bubbles: !0,
-			detail: { complete: !1 }
-		}));
-	}
-	set session(e) {
-		this._session = e, this.render();
-	}
-	get session() {
-		return this._session;
-	}
-	render() {
-		if (this._model && this._session) {
-			tt("[render] session: ", this._session.value), tt("[render] model: ", this._model), this._initMathObserver();
-			let e = D.createElement(et, {
-				model: this._model,
-				session: this._session,
-				onSessionChange: this.sessionChange
-			});
-			this._root ||= re(this), this._root.render(e);
-		}
-	}
-	connectedCallback() {
-		this._initMathObserver();
-	}
-	disconnectedCallback() {
-		this._disconnectMathObserver(), this._root && this._root.unmount();
-	}
-};
-//#endregion
-export { rt as default, nt as isValidSession };
-
-//# sourceMappingURL=index.js.map