@pie-element/placement-ordering 14.1.2-next.0 → 14.1.2-next.10

package/dist/controller/index.js

@@ -1,44 +1,39 @@
-import e from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isArray.js";
-import t from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/every.js";
-import n from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/map.js";
-import r from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isEmpty.js";
-import i from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isEqual.js";
-import a from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/reduce.js";
-import { flattenCorrect as o, getAllCorrectResponses as s, score as c } from "./scoring.js";
-import l from "./defaults.js";
+import { flattenCorrect as e, getAllCorrectResponses as t, score as n } from "./scoring.js";
+import r from "./defaults.js";
+import { every as i, isArray as a, isEmpty as o, isEqual as s, map as c, reduce as l } from "@pie-element/shared-lodash";
 import u from "debug";
 import d from "@pie-lib/translator";
 import { getFeedbackForCorrectness as f } from "@pie-element/shared-feedback";
 import { partialScoring as p } from "@pie-element/shared-controller-utils";
 //#region src/controller/index.ts
-var m = u("@pie-element:placement-ordering:controller"), { translator: h } = d, g = () => /* @__PURE__ */ Error("Question is missing required array: correctResponse"), _ = (e, t, n) => {
-	let r = [], a = t?.value || [];
+var m = u("@pie-element:placement-ordering:controller"), { translator: h } = d, g = () => /* @__PURE__ */ Error("Question is missing required array: correctResponse"), _ = (e, r, i) => {
+	let a = [], o = r?.value || [];
 	e?.correctResponse;
-	let o = e?.placementArea === !0;
-	if (!a.length) return o ? r.push("Student did not place any tiles in the target area.") : r.push("Student did not reorder any tiles."), r.push("Final score: 0."), r;
-	let l = s(e), u = {
+	let c = e?.placementArea === !0;
+	if (!o.length) return c ? a.push("Student did not place any tiles in the target area.") : a.push("Student did not reorder any tiles."), a.push("Final score: 0."), a;
+	let l = t(e), u = {
 		score: 0,
 		response: []
 	};
 	l.forEach((e) => {
 		let t = 0;
-		a.forEach((n, r) => {
+		o.forEach((n, r) => {
 			e[r] === n && t++;
 		}), t > u.score && (u = {
 			score: t,
 			response: e
 		});
 	});
-	let d = u.score, f = a.length - d;
-	d > 0 && r.push(`${d} tile(s) placed in the correct order.`), f > 0 && r.push(`${f} tile(s) placed in an incorrect order.`), l.some((e) => i(e, a));
-	let m = p.enabled(e, n || {});
-	m ? (r.push("Score calculated using partial scoring."), r.push("Each tile placed in the correct position contributes to the score.")) : (r.push("Score calculated using all-or-nothing scoring."), o ? r.push("Student must place all tiles in the correct positions within the target area to receive full credit.") : r.push("Student must arrange all tiles in the correct order to receive full credit."));
-	let h = c(e, t), g = m ? h : +(h === 1);
-	return r.push(`Final score: ${g}.`), r;
+	let d = u.score, f = o.length - d;
+	d > 0 && a.push(`${d} tile(s) placed in the correct order.`), f > 0 && a.push(`${f} tile(s) placed in an incorrect order.`), l.some((e) => s(e, o));
+	let m = p.enabled(e, i || {});
+	m ? (a.push("Score calculated using partial scoring."), a.push("Each tile placed in the correct position contributes to the score.")) : (a.push("Score calculated using all-or-nothing scoring."), c ? a.push("Student must place all tiles in the correct positions within the target area to receive full credit.") : a.push("Student must arrange all tiles in the correct order to receive full credit."));
+	let h = n(e, r), g = m ? h : +(h === 1);
+	return a.push(`Final score: ${g}.`), a;
 };
-function v(e, t, n) {
+function v(e, t, r) {
 	return new Promise((i, a) => {
-		if (!t || r(t)) {
+		if (!t || o(t)) {
 			i({
 				score: 0,
 				empty: !0,
@@ -46,12 +41,12 @@ function v(e, t, n) {
 			});
 			return;
 		}
-		if (!e || !e.correctResponse || r(e.correctResponse)) a(g());
+		if (!e || !e.correctResponse || o(e.correctResponse)) a(g());
 		else try {
-			let r = c(e, t);
+			let a = n(e, t);
 			i({
-				score: p.enabled(e, n || {}) ? r : +(r === 1),
-				logTrace: _(e, t, n)
+				score: p.enabled(e, r || {}) ? a : +(a === 1),
+				logTrace: _(e, t, r)
 			});
 		} catch (e) {
 			a(e);
@@ -61,13 +56,13 @@ function v(e, t, n) {
 function y(e = {}) {
 	return new Promise((t) => {
 		t({
-			...l,
+			...r,
 			...e
 		});
 	});
 }
 var b = (e) => ({
-	...l,
+	...r,
 	rationaleEnabled: !0,
 	feedbackEnabled: !1,
 	promptEnabled: !0,
@@ -75,9 +70,9 @@ var b = (e) => ({
 	studentInstructionsEnabled: !0,
 	...e
 });
-async function x(r, l, u) {
+async function x(r, o, u) {
 	let d = b(r), g = {};
-	if (r.alternateResponses && t(r.alternateResponses, e) && (m("Deprecated structure of alternateResponses is in use"), console.error("Deprecated structure of alternateResponses is in use")), g.env = u, g.extraCSSRules = d.extraCSSRules, g.outcomes = [], g.completeLength = (d.correctResponse || []).length, g.choices = (d.choices || []).filter((e) => e.label), g.note = d.note, g.showNote = d.alternateResponses && d.alternateResponses.length > 0, g.language = d.language, m("[model] removing tileSize for the moment."), g.prompt = d.promptEnabled ? d.prompt : null, g.config = {
+	if (r.alternateResponses && i(r.alternateResponses, a) && (m("Deprecated structure of alternateResponses is in use"), console.error("Deprecated structure of alternateResponses is in use")), g.env = u, g.extraCSSRules = d.extraCSSRules, g.outcomes = [], g.completeLength = (d.correctResponse || []).length, g.choices = (d.choices || []).filter((e) => e.label), g.note = d.note, g.showNote = d.alternateResponses && d.alternateResponses.length > 0, g.language = d.language, m("[model] removing tileSize for the moment."), g.prompt = d.promptEnabled ? d.prompt : null, g.config = {
 		orientation: d.orientation || "vertical",
 		includeTargets: d.placementArea,
 		choiceLabelEnabled: d.choiceLabelEnabled,
@@ -86,43 +81,43 @@ async function x(r, l, u) {
 		showOrdering: d.numberedGuides,
 		allowSameChoiceInTargets: !d.removeTilesAfterPlacing
 	}, g.disabled = u.mode !== "gather", g.note ||= h.t("common:commonCorrectAnswerWithAlternates", { lng: d.language }), u.role === "instructor" && (u.mode === "view" || u.mode === "evaluate") ? (g.rationale = d.rationaleEnabled ? d.rationale : null, g.teacherInstructions = d.teacherInstructionsEnabled ? d.teacherInstructions : null) : (g.rationale = null, g.teacherInstructions = null), u.mode === "evaluate") {
-		let e = l && l.value || [], t = s(d), m = t.reduce((t, n) => {
-			let r = a(e, (e, t, r) => e + (Array.isArray(n) && n[r] === t ? 1 : 0), 0);
-			return r > t.score ? {
-				arr: n,
-				score: r
-			} : t;
+		let i = o && o.value || [], a = t(d), m = a.reduce((e, t) => {
+			let n = l(i, (e, n, r) => e + (Array.isArray(t) && t[r] === n ? 1 : 0), 0);
+			return n > e.score ? {
+				arr: t,
+				score: n
+			} : e;
 		}, {
 			arr: [],
 			score: 0
 		});
-		g.outcomes = n(e, (e, t) => ({
+		g.outcomes = c(i, (e, t) => ({
 			id: e,
 			outcome: m.arr[t] === e ? "correct" : "incorrect"
 		}));
-		let h = t.some((t) => i(t, e)), _ = c(r, l), v = _ === 1, y = !v && p.enabled(d, u || {}) && _ !== 0;
-		return g.correctness = v ? "correct" : y ? "partial" : "incorrect", h || (g.correctResponse = o(d)), d.feedback || (d.feedbackEnabled = !1), g.feedback = d.feedbackEnabled ? await f(g.correctness, d.feedback) : void 0, g;
+		let h = a.some((e) => s(e, i)), _ = n(r, o), v = _ === 1, y = !v && p.enabled(d, u || {}) && _ !== 0;
+		return g.correctness = v ? "correct" : y ? "partial" : "incorrect", h || (g.correctResponse = e(d)), d.feedback || (d.feedbackEnabled = !1), g.feedback = d.feedbackEnabled ? await f(g.correctness, d.feedback) : void 0, g;
 	} else return g;
 }
-var S = (e, t) => new Promise((n) => {
-	t.mode !== "evaluate" && t.role === "instructor" ? n({
+var S = (t, n) => new Promise((r) => {
+	n.mode !== "evaluate" && n.role === "instructor" ? r({
 		id: "1",
-		value: o(e)
-	}) : n(null);
+		value: e(t)
+	}) : r(null);
 }), C = (e) => (e || "").replace(/(<(?!img|iframe|source)([^>]+)>)/gi, ""), w = (e = {}, t = {}) => {
-	let { choices: n, correctResponse: a } = e, o = {};
+	let { choices: n, correctResponse: r } = e, i = {};
 	[
 		"teacherInstructions",
 		"prompt",
 		"rationale"
 	].forEach((n) => {
-		t[n]?.required && !C(e[n]) && (o[n] = "This field is required.");
+		t[n]?.required && !C(e[n]) && (i[n] = "This field is required.");
 	});
-	let s = [...n || []].reverse(), c = {};
-	return s.forEach((e, t) => {
+	let a = [...n || []].reverse(), c = {};
+	return a.forEach((e, t) => {
 		let { id: n, label: r } = e;
-		C(r) ? s.slice(t + 1).some((e) => e.label === r) && (c[n] = "Content should be unique.") : c[n] = "Content should not be empty.";
-	}), i((n || []).map((e) => e.id), (a || []).map((e) => e.id || e)) && (o.orderError = "The correct ordering should not be identical to the initial ordering."), r(c) || (o.choicesErrors = c), o;
+		C(r) ? a.slice(t + 1).some((e) => e.label === r) && (c[n] = "Content should be unique.") : c[n] = "Content should not be empty.";
+	}), s((n || []).map((e) => e.id), (r || []).map((e) => e.id || e)) && (i.orderError = "The correct ordering should not be identical to the initial ordering."), o(c) || (i.choicesErrors = c), i;
 };
 //#endregion
 export { S as createCorrectResponseSession, y as createDefaultModel, _ as getLogTrace, x as model, b as normalize, v as outcome, g as questionError, w as validate };

package/dist/controller/scoring.js

@@ -1,6 +1,4 @@
-import e from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/differenceWith.js";
-import t from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isEqual.js";
-import n from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/uniq.js";
+import { differenceWith as e, isEqual as t, uniq as n } from "@pie-element/shared-lodash";
 import r from "debug";
 import { combination as i } from "js-combinatorics";
 //#region src/controller/scoring.ts
@@ -29,4 +27,4 @@ var a = r("pie-elements:placement-ordering:controller"), o = (e) => /* @__PURE__
 	}), a;
 };
 //#endregion
-export { c as flattenCorrect, l as getAllCorrectResponses, u as score };
+export { c as flattenCorrect, l as getAllCorrectResponses, o as illegalArgumentError, s as pairwiseCombinationScore, u as score };

package/dist/delivery/index.js

@@ -1,14 +1,14 @@
-import e from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/compact.js";
-import t from "./main.js";
-import n from "react";
-import { createRoot as r } from "react-dom/client";
+import e from "./main.js";
+import t from "react";
+import { createRoot as n } from "react-dom/client";
+import { compact as r } from "@pie-element/shared-lodash";
 import i from "debug";
 import { renderMath as a } from "@pie-element/shared-math-rendering-mathjax";
 import { SessionChangedEvent as o } from "@pie-element/shared-player-events";
 //#region src/delivery/index.ts
-var s = i("pie-elements:placement-ordering"), c = ({ model: t, session: n }) => {
-	let { config: r } = t, i = (n && e(n.value) || []).length === t.choices.length;
-	return r.includeTargets || i;
+var s = i("pie-elements:placement-ordering"), c = ({ model: e, session: t }) => {
+	let { config: n } = e, i = (t && r(t.value) || []).length === e.choices.length;
+	return n.includeTargets || i;
 }, l = class extends HTMLElement {
 	constructor() {
 		super(), this._root = null, this._mathObserver = null, this._mathRenderPending = !1;
@@ -32,7 +32,7 @@ var s = i("pie-elements:placement-ordering"), c = ({ model: t, session: n }) =>
 	_disconnectMathObserver() {
 		this._mathObserver &&= (this._mathObserver.disconnect(), null);
 	}
-	isComplete = (t) => t && e(t).length === this._model.completeLength;
+	isComplete = (e) => e && r(e).length === this._model.completeLength;
 	sessionChange = (e) => {
 		this._session.value = e.value, this.render(), this.dispatchEvent(new o(this.tagName.toLowerCase(), this._session && this.isComplete(this._session.value)));
 	};
@@ -51,19 +51,19 @@ var s = i("pie-elements:placement-ordering"), c = ({ model: t, session: n }) =>
 	render() {
 		if (this._model && this._session) {
 			s("[render] session: ", this._session.value), s("[render] model: ", this._model), this._initMathObserver();
-			let e = n.createElement(t, {
+			let r = t.createElement(e, {
 				model: this._model,
 				session: this._session,
 				onSessionChange: this.sessionChange
 			});
-			this._root ||= r(this), this._root.render(e);
+			this._root ||= n(this), this._root.render(r);
 		}
 	}
 	connectedCallback() {
-		this._initMathObserver();
+		this._initMathObserver(), this.render();
 	}
 	disconnectedCallback() {
-		this._disconnectMathObserver(), this._root && this._root.unmount();
+		this._disconnectMathObserver(), this._root &&= (this._root.unmount(), null);
 	}
 };
 //#endregion

package/dist/delivery/keyboard-coordinates.d.ts

@@ -0,0 +1,47 @@
+/**
+ * @synced-from pie-elements/packages/placement-ordering/src/keyboard-coordinates.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.
+ */
+/**
+ * Custom keyboard coordinate getter for placement-ordering's Tab-based placement mode
+ * (enabled only when the item is configured with `placementArea` / `includeTargets`).
+ *
+ * Tab/Shift+Tab cycle the dragged choice through the target column's response areas
+ * in on-screen order (first target, then the rest in sequence), followed by exactly
+ * one source-column stop as a fixed last step before the cycle wraps back to the first
+ * target — so picking up a choice always starts the cycle at the first target,
+ * regardless of where that choice's own source-column slot happens to sit on screen.
+ *
+ * Arrow keys are delegated to dnd-kit's own `defaultKeyboardCoordinateGetter` so the
+ * pre-existing free-form arrow-key dragging behavior is left completely unchanged.
+ *
+ * Whichever slot a drag started from — a target the choice was already placed in, or
+ * (see below) the choice's own pool slot — stays reachable by Tab as a no-op "drop it
+ * back where it came from": tile.tsx disables a droppable for the whole duration of
+ * its own drag (a self-collision guard for pointer drags), which would otherwise make
+ * that exact slot unreachable; that guard is bypassed here specifically for the one
+ * droppable matching the active drag's own id. A target slot picked up this way stays
+ * in its normal position in the target sequence (it's just another target); nothing
+ * special is needed there beyond the bypass itself.
+ *
+ * The choices column isn't a place a student can choose to relocate an answer within —
+ * there's exactly one meaningful "source" stop for whichever choice is currently being
+ * dragged: its own fixed slot, whether that's the vacated gap left behind (if the
+ * choice is already placed in a target — landing back on it returns the choice to the
+ * pool, undoing the placement) or the very tile being dragged (if the choice is still
+ * sitting there, unplaced — landing back on it is a no-op that effectively cancels the
+ * pick-up; the same disabled-droppable bypass applies here too). Every *other*
+ * choice-column tile — filled or an empty gap — is excluded from the cycle:
+ * `ordering.ts`'s `updateResponse` has no `choice -> choice` case, so they'd be no-op
+ * drop targets anyway. Matching is by id (the vacated gap carries its original choice's
+ * id specifically so this comparison works), not by type alone.
+ */
+export declare const closestDroppableKeyboardCoordinates: (event: any, { active, context, currentCoordinates }: {
+    active: any;
+    context: any;
+    currentCoordinates: any;
+}) => any;

package/dist/delivery/keyboard-coordinates.js

@@ -0,0 +1,51 @@
+import { KeyboardCode as e, defaultKeyboardCoordinateGetter as t } from "@dnd-kit/core";
+//#region src/delivery/keyboard-coordinates.ts
+var n = (n, { active: i, context: a, currentCoordinates: o }) => {
+	let { code: s } = n, c = s === "Tab", l = s === e.Down || s === e.Up || s === e.Left || s === e.Right;
+	if (!c && !l) return;
+	if (l) return t(n, {
+		context: a,
+		currentCoordinates: o
+	});
+	n.preventDefault();
+	let { droppableRects: u, droppableContainers: d, collisionRect: f, draggableNodes: p, active: m } = a;
+	if (!u || u.size === 0) return o;
+	let h = {
+		x: (f?.width || 0) / 2,
+		y: (f?.height || 0) / 2
+	}, g = {
+		x: o.x + h.x,
+		y: o.y + h.y
+	}, _ = p?.get(i)?.data?.current?.id, v = m?.rect?.current?.initial, y = typeof i == "string" ? i.replace(/^tile-/, "drop-") : void 0, b = [], x;
+	for (let [e, t] of d) {
+		let n = t?.data?.current, r = e === y;
+		if (t?.disabled && !r) continue;
+		let i = n?.type === "choice" && n?.id === _;
+		if (n?.type === "choice" && !i) continue;
+		let a = (r ? v : null) || u.get(e);
+		if (!a) continue;
+		let o = {
+			x: a.left + a.width / 2,
+			y: a.top + a.height / 2
+		}, s = {
+			id: e,
+			dropPosition: {
+				x: a.left,
+				y: a.top + a.height / 2 - h.y
+			},
+			center: o
+		};
+		i ? x = s : b.push(s);
+	}
+	if (b.length === 0 && !x) return o;
+	let S = n.shiftKey;
+	b.sort((e, t) => Math.abs(e.center.y - t.center.y) > 10 ? e.center.y - t.center.y : e.center.x - t.center.x), x && b.push(x);
+	let C = 0, w = Infinity;
+	for (let e = 0; e < b.length; e++) {
+		let t = r(g, b[e].center);
+		t < w && (w = t, C = e);
+	}
+	return b[S ? (C - 1 + b.length) % b.length : (C + 1) % b.length].dropPosition;
+}, r = (e, t) => Math.sqrt((e.x - t.x) ** 2 + (e.y - t.y) ** 2);
+//#endregion
+export { n as closestDroppableKeyboardCoordinates };

package/dist/delivery/main.js

@@ -1,4 +1,4 @@
-import e from "./placement-ordering.js";
+import { PlacementOrdering as e } from "./placement-ordering.js";
 import t from "react";
 import n from "prop-types";
 import { jsx as r } from "react/jsx-runtime";

package/dist/delivery/ordering.js

@@ -1,7 +1,4 @@
-import e from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/assign.js";
-import t from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/cloneDeep.js";
-import n from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/map.js";
-import r from "../node_modules/.bun/lodash-es@4.18.1/node_modules/lodash-es/isEmpty.js";
+import { assign as e, cloneDeep as t, isEmpty as n, map as r } from "@pie-element/shared-lodash";
 import i from "debug";
 //#region src/delivery/ordering.ts
 var a = i("pie-elements:placement-ordering:ordering"), o = (e, t, n) => {
@@ -43,6 +40,7 @@ function u(e, t, n, r) {
 		}
 		return e.map((e) => t.indexOf(e.id) !== -1 && !r.allowSameChoiceInTargets ? {
 			type: "choice",
+			id: e.id,
 			empty: !0,
 			droppable: !0,
 			draggable: !1
@@ -65,7 +63,7 @@ function u(e, t, n, r) {
 	}, []);
 }
 function d(t, i, a, o) {
-	return o = e({ includeTargets: !0 }, o), a ||= [], i = !i || r(i) ? o.includeTargets ? Array(t.length) : n(t, (e) => e.id) : i, {
+	return o = e({ includeTargets: !0 }, o), a ||= [], i = !i || n(i) ? o.includeTargets ? Array(t.length) : r(t, (e) => e.id) : i, {
 		choices: t,
 		response: i,
 		opts: o,
@@ -93,4 +91,4 @@ function f(e, t) {
 	return t;
 }
 //#endregion
-export { d as buildState, f as reducer };
+export { d as buildState, o as push, f as reducer, s as swap };

package/dist/delivery/placement-ordering.d.ts

@@ -23,6 +23,17 @@ export declare class PlacementOrdering extends React.Component {
     onRemoveChoice: any;
     createOrdering: any;
     onDragEnd: any;
+    onDragStart: any;
+    onDragCancel: any;
+    isSameChoice: (a: any, b: any) => boolean;
+    selectChoice: any;
+    toggleChoiceSelection: any;
+    cancelSelection: any;
+    endAnyLiveKeyboardDrag: any;
+    placeSelectedChoice: any;
+    isClickSoonAfterDragEnd: () => boolean;
+    onChoiceClick: any;
+    onPlacementClick: any;
     render(): React.JSX.Element;
 }
 export default PlacementOrdering;