camox 0.63.0 → 0.66.0

package/dist/features/studio/components/Squareling.js

@@ -14,6 +14,8 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 * while it works; the SEO manager is a tall block with the small shape's soft corner, in amber,
 * scanning down while it works.
 *
+* A patroller off duty where the editor is sleeps, eyes closed, breathing slowly.
+*
 * One face flows into the next: its eyes glide to where the next face holds them, opening or
 * narrowing, and a looping motion settles before the next one starts (`useFaceChange`).
 */
@@ -67,7 +69,8 @@ function Squareling(props) {
 					status: props.status
 				}) : /* @__PURE__ */ jsx(PatrollerEyes, {
 					eyes: look.eyes,
-					working: props.status === "working"
+					working: props.status === "working",
+					asleep: props.status === "asleep"
 				})
 			})
 		});
@@ -183,6 +186,24 @@ const LOOKS = {
 			x: [44, 63],
 			y: 28
 		}
+	},
+	linkChecker: {
+		body: "M32 14H68Q86 14 86 32V68Q86 86 68 86H32Q14 86 14 68V32Q14 14 32 14Z",
+		middle: 50,
+		fill: "fill-sky-500",
+		eyes: {
+			x: [40, 59],
+			y: 32
+		}
+	},
+	proofreader: {
+		body: "M20 10H64L88 34V82Q88 90 80 90H20Q12 90 12 82V18Q12 10 20 10Z",
+		middle: 50,
+		fill: "fill-rose-500",
+		eyes: {
+			x: [34, 53],
+			y: 38
+		}
 	}
 };
 const EYE_WIDTH = 11;
@@ -192,60 +213,68 @@ const OPEN = 17;
 const NARROWED = 6;
 /** How far down a narrowed eye's middle sits, from the open one's. */
 const NARROWED_SHIFT = 2.5;
+const CLOSED = 2;
+/** How far down a closed eye's middle sits, from the open one's: near its lower lid. */
+const CLOSED_SHIFT = 5;
 /**
-* One eye, its left edge at `x` and its top at `y`: open, or narrowed on the work, lower down.
-* It narrows by scaling, which `studio.css` eases. Only an eye that blinks carries the class
-* `studio.css` blinks.
+* One eye, its left edge at `x` and its top at `y`: open, narrowed on the work, or closed, each
+* lower down. It narrows and closes by scaling, which `studio.css` eases. Only an eye that blinks
+* carries the class `studio.css` blinks.
 */
 function Eye(t0) {
-	const $ = c(9);
-	const { x, y, narrowed, blinks } = t0;
-	const t1 = blinks && "squareling-blinks";
-	let t2;
-	if ($[0] !== t1) {
-		t2 = cn("squareling-eye", t1);
-		$[0] = t1;
-		$[1] = t2;
-	} else t2 = $[1];
+	const $ = c(7);
+	const { x, y, narrowed, closed: t1, blinks } = t0;
+	const openness = (t1 === void 0 ? false : t1) ? "closed" : narrowed ? "narrowed" : "open";
+	const t2 = blinks && "squareling-blinks";
 	let t3;
-	if ($[2] !== narrowed) {
-		t3 = narrowed ? {
-			scale: `1 ${NARROWED / OPEN}`,
-			translate: `0 ${NARROWED_SHIFT}px`
-		} : {
-			scale: "1",
-			translate: "0"
-		};
-		$[2] = narrowed;
-		$[3] = t3;
-	} else t3 = $[3];
-	let t4;
-	if ($[4] !== t2 || $[5] !== t3 || $[6] !== x || $[7] !== y) {
-		t4 = /* @__PURE__ */ jsx("rect", {
-			className: t2,
+	if ($[0] !== t2) {
+		t3 = cn("squareling-eye", t2);
+		$[0] = t2;
+		$[1] = t3;
+	} else t3 = $[1];
+	const t4 = EYE_STYLES[openness];
+	let t5;
+	if ($[2] !== t3 || $[3] !== t4 || $[4] !== x || $[5] !== y) {
+		t5 = /* @__PURE__ */ jsx("rect", {
+			className: t3,
 			x,
 			y,
 			width: EYE_WIDTH,
 			height: OPEN,
-			style: t3
+			style: t4
 		});
-		$[4] = t2;
-		$[5] = t3;
-		$[6] = x;
-		$[7] = y;
-		$[8] = t4;
-	} else t4 = $[8];
-	return t4;
+		$[2] = t3;
+		$[3] = t4;
+		$[4] = x;
+		$[5] = y;
+		$[6] = t5;
+	} else t5 = $[6];
+	return t5;
 }
+const EYE_STYLES = {
+	open: {
+		scale: "1",
+		translate: "0"
+	},
+	narrowed: {
+		scale: `1 ${NARROWED / OPEN}`,
+		translate: `0 ${NARROWED_SHIFT}px`
+	},
+	closed: {
+		scale: `1 ${CLOSED / OPEN}`,
+		translate: `0 ${CLOSED_SHIFT}px`
+	}
+};
 /**
 * The agent's eyes: both narrowed on the work while making changes, the right one while fixing,
-* open otherwise, blinking unless it looks around.
+* open otherwise, blinking unless it looks around, makes changes, or checks the design, its eyes
+* fixed on it.
 */
 function AgentEyes(t0) {
 	const $ = c(13);
 	const { eyes, status } = t0;
 	const [left, right] = eyes.x;
-	const blinks = status !== "exploring" && status !== "changing";
+	const blinks = status !== "exploring" && status !== "changing" && status !== "checking";
 	const t1 = status === "changing";
 	let t2;
 	if ($[0] !== blinks || $[1] !== eyes.y || $[2] !== left || $[3] !== t1) {
@@ -285,13 +314,17 @@ function AgentEyes(t0) {
 	} else t5 = $[12];
 	return t5;
 }
-/** A patroller's eyes: open while idle, narrowed on the work while working. */
-function PatrollerEyes({ eyes, working }) {
+/**
+* A patroller's eyes: open while idle, narrowed on the work while working, closed while asleep,
+* when they don't blink.
+*/
+function PatrollerEyes({ eyes, working, asleep }) {
 	return eyes.x.map((x) => /* @__PURE__ */ jsx(Eye, {
 		x,
 		y: eyes.y,
 		narrowed: working,
-		blinks: true
+		closed: asleep,
+		blinks: !asleep
 	}, x));
 }
 

package/dist/features/studio/components/ThreadComposer.js

@@ -1,5 +1,5 @@
 import { c } from "react/compiler-runtime";
-import { useState } from "react";
+import { useEffect, useLayoutEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ArrowUp, Square, SquareDashedMousePointer, X } from "lucide-react";
 import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupTextarea } from "@camox/ui/input-group";
@@ -8,47 +8,117 @@ import { InputGroup, InputGroupAddon, InputGroupButton, InputGroupTextarea } fro
 /**
 * Where an editor writes to the agent: Enter sends, Shift+Enter adds a line. While a run is
 * going, sending steers it, and a Stop button sits beside Send. Over the message, what the
-* editor has selected, which their messages carry to the agent until they clear it.
+* editor has selected, which their messages carry to the agent until they clear it. A message
+* filled in from elsewhere in the studio replaces what the editor wrote, for them to send. Given a
+* `carry`, the composer of the next thread goes on from this one, as when the studio enters the
+* draft the editor's request was handed off to: with what they were writing, focused if it was.
 */
 function ThreadComposer(t0) {
-	const $ = c(36);
-	const { onSend, onStop, selection, onClearSelection, running: t1, disabled: t2 } = t0;
+	const $ = c(48);
+	const { onSend, onStop, selection, onClearSelection, running: t1, disabled: t2, filled, carry } = t0;
 	const running = t1 === void 0 ? false : t1;
 	const disabled = t2 === void 0 ? false : t2;
-	const [text, setText] = useState("");
 	let t3;
-	if ($[0] !== text) {
-		t3 = text.trim();
-		$[0] = text;
+	if ($[0] !== carry) {
+		t3 = () => carry?.held()?.text ?? "";
+		$[0] = carry;
 		$[1] = t3;
 	} else t3 = $[1];
-	const message = t3;
-	const canSend = !disabled && message !== "" && onSend !== void 0;
+	const [text, setText] = useState(t3);
+	const [filledId, setFilledId] = useState();
+	if (filled && filled.id !== filledId) {
+		setFilledId(filled.id);
+		setText(filled.text);
+	}
+	const box = useRef(null);
 	let t4;
-	if ($[2] !== canSend || $[3] !== message || $[4] !== onSend) {
+	let t5;
+	if ($[2] !== carry || $[3] !== text) {
 		t4 = () => {
+			carry?.hold({
+				text,
+				focused: carry.held()?.focused ?? false
+			});
+		};
+		t5 = [carry, text];
+		$[2] = carry;
+		$[3] = text;
+		$[4] = t4;
+		$[5] = t5;
+	} else {
+		t4 = $[4];
+		t5 = $[5];
+	}
+	useEffect(t4, t5);
+	let t6;
+	let t7;
+	if ($[6] !== carry) {
+		t6 = () => {
+			const element = box.current;
+			if (!carry || !element) return;
+			if (carry.held()?.focused) element.focus();
+			return () => carry.hold({
+				text: element.value,
+				focused: element.ownerDocument.activeElement === element
+			});
+		};
+		t7 = [carry];
+		$[6] = carry;
+		$[7] = t6;
+		$[8] = t7;
+	} else {
+		t6 = $[7];
+		t7 = $[8];
+	}
+	useLayoutEffect(t6, t7);
+	let t8;
+	let t9;
+	if ($[9] !== filledId) {
+		t8 = () => {
+			if (filledId !== void 0) box.current?.focus();
+		};
+		t9 = [filledId];
+		$[9] = filledId;
+		$[10] = t8;
+		$[11] = t9;
+	} else {
+		t8 = $[10];
+		t9 = $[11];
+	}
+	useEffect(t8, t9);
+	let t10;
+	if ($[12] !== text) {
+		t10 = text.trim();
+		$[12] = text;
+		$[13] = t10;
+	} else t10 = $[13];
+	const message = t10;
+	const canSend = !disabled && message !== "" && onSend !== void 0;
+	let t11;
+	if ($[14] !== canSend || $[15] !== message || $[16] !== onSend) {
+		t11 = () => {
 			if (!canSend) return;
 			onSend(message);
 			setText("");
 		};
-		$[2] = canSend;
-		$[3] = message;
-		$[4] = onSend;
-		$[5] = t4;
-	} else t4 = $[5];
-	const submit = t4;
-	let t5;
-	if ($[6] !== submit) {
-		t5 = (event) => {
+		$[14] = canSend;
+		$[15] = message;
+		$[16] = onSend;
+		$[17] = t11;
+	} else t11 = $[17];
+	const submit = t11;
+	let t12;
+	if ($[18] !== submit) {
+		t12 = (event) => {
 			event.preventDefault();
 			submit();
 		};
-		$[6] = submit;
-		$[7] = t5;
-	} else t5 = $[7];
-	let t6;
-	if ($[8] !== onClearSelection || $[9] !== selection) {
-		t6 = selection && /* @__PURE__ */ jsx(InputGroupAddon, {
+		$[18] = submit;
+		$[19] = t12;
+	} else t12 = $[19];
+	let t13;
+	if ($[20] !== onClearSelection || $[21] !== selection) {
+		t13 = selection && /* @__PURE__ */ jsx(InputGroupAddon, {
 			align: "block-start",
 			className: "border-input border-b",
 			children: /* @__PURE__ */ jsx(SelectionChip, {
@@ -56,44 +126,45 @@ function ThreadComposer(t0) {
 				onClear: onClearSelection
 			})
 		});
-		$[8] = onClearSelection;
-		$[9] = selection;
-		$[10] = t6;
-	} else t6 = $[10];
-	let t7;
-	if ($[11] === Symbol.for("react.memo_cache_sentinel")) {
-		t7 = (event_0) => setText(event_0.target.value);
-		$[11] = t7;
-	} else t7 = $[11];
-	let t8;
-	if ($[12] !== submit) {
-		t8 = (event_1) => {
+		$[20] = onClearSelection;
+		$[21] = selection;
+		$[22] = t13;
+	} else t13 = $[22];
+	let t14;
+	if ($[23] === Symbol.for("react.memo_cache_sentinel")) {
+		t14 = (event_0) => setText(event_0.target.value);
+		$[23] = t14;
+	} else t14 = $[23];
+	let t15;
+	if ($[24] !== submit) {
+		t15 = (event_1) => {
 			if (event_1.key !== "Enter" || event_1.shiftKey || event_1.nativeEvent.isComposing) return;
 			event_1.preventDefault();
 			submit();
 		};
-		$[12] = submit;
-		$[13] = t8;
-	} else t8 = $[13];
-	let t9;
-	if ($[14] !== disabled || $[15] !== t8 || $[16] !== text) {
-		t9 = /* @__PURE__ */ jsx(InputGroupTextarea, {
+		$[24] = submit;
+		$[25] = t15;
+	} else t15 = $[25];
+	let t16;
+	if ($[26] !== disabled || $[27] !== t15 || $[28] !== text) {
+		t16 = /* @__PURE__ */ jsx(InputGroupTextarea, {
+			ref: box,
 			"aria-label": "Message",
 			placeholder: "Message Camox…",
 			value: text,
 			disabled,
-			onChange: t7,
-			onKeyDown: t8,
+			onChange: t14,
+			onKeyDown: t15,
 			className: "max-h-48 min-h-14"
 		});
-		$[14] = disabled;
-		$[15] = t8;
-		$[16] = text;
-		$[17] = t9;
-	} else t9 = $[17];
-	let t10;
-	if ($[18] !== disabled || $[19] !== onStop || $[20] !== running) {
-		t10 = running && onStop && /* @__PURE__ */ jsxs(InputGroupButton, {
+		$[26] = disabled;
+		$[27] = t15;
+		$[28] = text;
+		$[29] = t16;
+	} else t16 = $[29];
+	let t17;
+	if ($[30] !== disabled || $[31] !== onStop || $[32] !== running) {
+		t17 = running && onStop && /* @__PURE__ */ jsxs(InputGroupButton, {
 			type: "button",
 			variant: "outline",
 			size: "icon-sm",
@@ -104,73 +175,87 @@ function ThreadComposer(t0) {
 				children: "Stop"
 			})]
 		});
-		$[18] = disabled;
-		$[19] = onStop;
-		$[20] = running;
-		$[21] = t10;
-	} else t10 = $[21];
-	const t11 = !canSend;
-	let t12;
-	let t13;
-	if ($[22] === Symbol.for("react.memo_cache_sentinel")) {
-		t12 = /* @__PURE__ */ jsx(ArrowUp, {});
-		t13 = /* @__PURE__ */ jsx("span", {
+		$[30] = disabled;
+		$[31] = onStop;
+		$[32] = running;
+		$[33] = t17;
+	} else t17 = $[33];
+	const t18 = !canSend;
+	let t19;
+	let t20;
+	if ($[34] === Symbol.for("react.memo_cache_sentinel")) {
+		t19 = /* @__PURE__ */ jsx(ArrowUp, {});
+		t20 = /* @__PURE__ */ jsx("span", {
 			className: "sr-only",
 			children: "Send"
 		});
-		$[22] = t12;
-		$[23] = t13;
+		$[34] = t19;
+		$[35] = t20;
 	} else {
-		t12 = $[22];
-		t13 = $[23];
+		t19 = $[34];
+		t20 = $[35];
 	}
-	let t14;
-	if ($[24] !== t11) {
-		t14 = /* @__PURE__ */ jsxs(InputGroupButton, {
+	let t21;
+	if ($[36] !== t18) {
+		t21 = /* @__PURE__ */ jsxs(InputGroupButton, {
 			type: "submit",
 			variant: "default",
 			size: "icon-sm",
-			disabled: t11,
-			children: [t12, t13]
+			disabled: t18,
+			children: [t19, t20]
 		});
-		$[24] = t11;
-		$[25] = t14;
-	} else t14 = $[25];
-	let t15;
-	if ($[26] !== t10 || $[27] !== t14) {
-		t15 = /* @__PURE__ */ jsxs(InputGroupAddon, {
+		$[36] = t18;
+		$[37] = t21;
+	} else t21 = $[37];
+	let t22;
+	if ($[38] !== t17 || $[39] !== t21) {
+		t22 = /* @__PURE__ */ jsxs(InputGroupAddon, {
 			align: "block-end",
 			className: "justify-end",
-			children: [t10, t14]
+			children: [t17, t21]
 		});
-		$[26] = t10;
-		$[27] = t14;
-		$[28] = t15;
-	} else t15 = $[28];
-	let t16;
-	if ($[29] !== t15 || $[30] !== t6 || $[31] !== t9) {
-		t16 = /* @__PURE__ */ jsxs(InputGroup, { children: [
-			t6,
-			t9,
-			t15
+		$[38] = t17;
+		$[39] = t21;
+		$[40] = t22;
+	} else t22 = $[40];
+	let t23;
+	if ($[41] !== t13 || $[42] !== t16 || $[43] !== t22) {
+		t23 = /* @__PURE__ */ jsxs(InputGroup, { children: [
+			t13,
+			t16,
+			t22
 		] });
-		$[29] = t15;
-		$[30] = t6;
-		$[31] = t9;
-		$[32] = t16;
-	} else t16 = $[32];
-	let t17;
-	if ($[33] !== t16 || $[34] !== t5) {
-		t17 = /* @__PURE__ */ jsx("form", {
+		$[41] = t13;
+		$[42] = t16;
+		$[43] = t22;
+		$[44] = t23;
+	} else t23 = $[44];
+	let t24;
+	if ($[45] !== t12 || $[46] !== t23) {
+		t24 = /* @__PURE__ */ jsx("form", {
 			className: "p-2",
-			onSubmit: t5,
-			children: t16
+			onSubmit: t12,
+			children: t23
 		});
-		$[33] = t16;
-		$[34] = t5;
-		$[35] = t17;
-	} else t17 = $[35];
-	return t17;
+		$[45] = t12;
+		$[46] = t23;
+		$[47] = t24;
+	} else t24 = $[47];
+	return t24;
+}
+/** A carrier that lasts as long as the component that keeps it. */
+function useComposerCarrier() {
+	const [carrier] = useState(_temp);
+	return carrier;
+}
+function _temp() {
+	let held = null;
+	return {
+		held: () => held,
+		hold: (carry) => {
+			held = carry;
+		}
+	};
 }
 /** The selection the editor's messages carry, by its name. */
 function SelectionChip(t0) {
@@ -224,4 +309,4 @@ function SelectionChip(t0) {
 }
 
 //#endregion
-export { ThreadComposer };
+export { ThreadComposer, useComposerCarrier };