@pie-element/venn-classification 0.1.1-next.7 → 0.1.1-next.8

package/dist/author/index.d.ts

@@ -2,15 +2,17 @@ declare const SvelteElementClass: any;
 declare class VennClassificationAuthor extends SvelteElementClass {
     private _model;
     private _onChange;
+    onModelChange: (update: any) => void;
+    /**
+     * The component reports each edit through its `onModelChange` prop, assigned
+     * here through the accessor Svelte generates for it. The host keeps the
+     * edited model, renders from it, and announces it as `model.updated`, which
+     * bubbles to the listener an authoring player registers at its root.
+     */
+    constructor();
     set model(m: any);
     get model(): any;
     set onChange(fn: (model: any) => void);
     get onChange(): (model: any) => void;
-    /**
-     * The component reports each edit here. The host keeps the edited model,
-     * renders from it, and announces it as `model.updated`, which bubbles to
-     * the listener an authoring player registers at its root.
-     */
-    onModelChange: (update: any) => void;
 }
 export default VennClassificationAuthor;

package/dist/author/index.js

@@ -1,10 +1,10 @@
 //#region ../../shared/configure-events/dist/index.js
-var _e$1;
-var _e2$1;
+var _e;
+var _e2;
 var _e3;
 var _e4;
 var _e5;
-var e$3 = (_e$1 = class e extends CustomEvent {
+var e$3 = (_e = class e extends CustomEvent {
 	constructor(t, n = !1) {
 		super(e.TYPE, {
 			bubbles: !0,
@@ -14,8 +14,8 @@ var e$3 = (_e$1 = class e extends CustomEvent {
 			}
 		}), this.update = t, this.reset = n;
 	}
-}, _e$1.TYPE = "model.updated", _e$1);
-_e2$1 = class e extends CustomEvent {
+}, _e.TYPE = "model.updated", _e);
+_e2 = class e extends CustomEvent {
 	constructor(t, n) {
 		super(e.TYPE, {
 			bubbles: !0,
@@ -25,7 +25,7 @@ _e2$1 = class e extends CustomEvent {
 			}
 		}), this.src = t, this.done = n;
 	}
-}, _e2$1.TYPE = "delete.image";
+}, _e2.TYPE = "delete.image";
 _e3 = class e extends CustomEvent {
 	constructor(t) {
 		super(e.TYPE, {
@@ -5528,84 +5528,6 @@ function create_custom_element(Component, props_definition, slots, exports, shad
 	return Class;
 }
 //#endregion
-//#region ../../shared/player-events/dist/index.js
-var _e;
-var _e2;
-_e = class e extends CustomEvent {
-	constructor(t, n, r) {
-		super(e.TYPE, {
-			bubbles: !0,
-			composed: !0,
-			detail: {
-				complete: n,
-				component: t,
-				hasModel: r
-			}
-		}), this.component = t, this.complete = n;
-	}
-}, _e.TYPE = "model-set";
-var c$2 = (_e2 = class e extends CustomEvent {
-	constructor(t, n) {
-		super(e.TYPE, {
-			bubbles: !0,
-			composed: !0,
-			detail: {
-				complete: n,
-				component: t
-			}
-		}), this.component = t, this.complete = n;
-	}
-}, _e2.TYPE = "session-changed", _e2);
-//#endregion
-//#region ../../lib-svelte/delivery-events/dist/index2.js
-var t$3 = (e) => {
-	let t = e;
-	return t ? typeof t.onSessionChange == "function" || typeof t.onAudioStarted == "function" || typeof t.onAudioEnded == "function" : !1;
-};
-function n$1(e) {
-	if (e.parentElement) return e.parentElement;
-	let t = e.getRootNode();
-	return t instanceof ShadowRoot ? t.host : null;
-}
-function r$2(e, r = {}) {
-	let i = r.hostPredicate ?? t$3, a = e;
-	for (; a;) {
-		if (i(a)) return a;
-		a = n$1(a);
-	}
-	return null;
-}
-function i$1(e) {
-	return !!e && typeof e == "object" && !Array.isArray(e);
-}
-function a$1(e, t) {
-	if (e === t) return e;
-	if (!i$1(e) || !i$1(t) || Object.isFrozen(e) || !Object.isExtensible(e)) return t;
-	try {
-		for (let n of Object.keys(e)) n in t || delete e[n];
-		Object.assign(e, t);
-	} catch {
-		return t;
-	}
-	return e;
-}
-var o$1 = {};
-var s$1 = /* @__PURE__ */ new WeakSet();
-function c$1(e) {
-	let t = e ?? o$1;
-	if (s$1.has(t)) return;
-	s$1.add(t);
-	let n = e ? `above <${e.tagName.toLowerCase()}>` : "for an update with no source element";
-	console.warn(`[session-bridge] no delivery host ${n}; the session change was not forwarded to the player`);
-}
-function l({ sourceEl: t, complete: n, session: i }) {
-	let o = r$2(t);
-	if (!o) return c$1(t), null;
-	if (typeof o.onSessionChange == "function") return o.onSessionChange(i), o;
-	let s = a$1(o.session, i);
-	return s !== o.session && (o.session = s), o.dispatchEvent(new c$2(o.tagName.toLowerCase(), n)), o;
-}
-//#endregion
 //#region ../../../node_modules/.bun/@tiptap+core@3.31.3+ef29727eaaf819d3/node_modules/@tiptap/core/dist/rolldown-runtime-D7D4PA-g.js
 var __defProp = Object.defineProperty;
 var __exportAll = (all, no_symbols) => {
@@ -32062,8 +31984,15 @@ function EditableHtml$1($$anchor, $$props) {
 	let markup = prop($$props, "markup", 3, ""), placeholder = prop($$props, "placeholder", 3, "Enter text here..."), showToolbar = prop($$props, "showToolbar", 3, true), disabled = prop($$props, "disabled", 3, false);
 	let editorElement;
 	let editor = /* @__PURE__ */ state(null);
-	let isFocused = /* @__PURE__ */ state(false);
+	let hasFocus = /* @__PURE__ */ state(false);
 	let showAlignMenu = /* @__PURE__ */ state(false);
+	function editorAttributes() {
+		return {
+			role: "textbox",
+			"aria-multiline": "true",
+			...$$props.ariaLabel ? { "aria-label": $$props.ariaLabel } : {}
+		};
+	}
 	let editorState = /* @__PURE__ */ state(proxy({
 		isBold: false,
 		canBold: false,
@@ -32155,6 +32084,7 @@ function EditableHtml$1($$anchor, $$props) {
 			content: markup() || "",
 			editable: !disabled(),
 			autofocus: false,
+			editorProps: { attributes: editorAttributes() },
 			onUpdate: ({ editor }) => {
 				const html = editor.getHTML();
 				if ($$props.onChange) $$props.onChange(html);
@@ -32164,12 +32094,7 @@ function EditableHtml$1($$anchor, $$props) {
 				updateEditorState();
 			},
 			onFocus: () => {
-				set(isFocused, true);
 				updateEditorState();
-			},
-			onBlur: () => {
-				set(isFocused, false);
-				set(showAlignMenu, false);
 			}
 		}), true);
 		updateEditorState();
@@ -32184,6 +32109,19 @@ function EditableHtml$1($$anchor, $$props) {
 		const editable = !disabled();
 		if (get$1(editor) && get$1(editor).isEditable !== editable) get$1(editor).setEditable(editable, false);
 	});
+	user_effect(() => {
+		const attributes = editorAttributes();
+		if (get$1(editor) && get$1(editor).view.dom.getAttribute("aria-label") !== (attributes["aria-label"] ?? null)) get$1(editor).setOptions({ editorProps: { attributes } });
+	});
+	function handleFocusIn() {
+		set(hasFocus, true);
+	}
+	function handleFocusOut(e) {
+		if (!e.currentTarget.contains(e.relatedTarget)) {
+			set(hasFocus, false);
+			set(showAlignMenu, false);
+		}
+	}
 	function toggleBold() {
 		get$1(editor)?.chain().focus().toggleBold().run();
 	}
@@ -32488,7 +32426,10 @@ function EditableHtml$1($$anchor, $$props) {
 		reset$1(button_24);
 		reset$1(div_5);
 		reset$1(div_4);
-		template_effect(() => classes_1 = set_class(div_4, 1, "toolbar", null, classes_1, { focused: get$1(isFocused) }));
+		template_effect(() => {
+			classes_1 = set_class(div_4, 1, "toolbar", null, classes_1, { focused: get$1(hasFocus) });
+			div_4.inert = !get$1(hasFocus);
+		});
 		delegated("mousedown", div_4, handleMouseDown);
 		delegated("click", button_24, handleDoneClick);
 		append($$anchor, div_4);
@@ -32498,10 +32439,17 @@ function EditableHtml$1($$anchor, $$props) {
 	});
 	reset$1(div);
 	template_effect(() => classes = set_class(div_1, 1, "editor-holder", null, classes, { disabled: disabled() }));
+	delegated("focusin", div, handleFocusIn);
+	delegated("focusout", div, handleFocusOut);
 	append($$anchor, div);
 	pop();
 }
-delegate(["mousedown", "click"]);
+delegate([
+	"focusin",
+	"focusout",
+	"mousedown",
+	"click"
+]);
 //#endregion
 //#region ../../lib-svelte/editable-html-tiptap-svelte/dist/index.js
 var EditableHtml = EditableHtml$1;
@@ -32584,8 +32532,7 @@ var e$2 = {
 			listenSilentAlt: "Repeat instructions",
 			listenPlayingAlt: "Instructions are playing",
 			printAudio: "Audio:",
-			printTranscript: "Transcript:",
-			printKey: "(key)"
+			printTranscript: "Transcript:"
 		},
 		multipleChoice: {
 			minSelections: "Select at least {{minSelections}}.",
@@ -32728,8 +32675,7 @@ var e$1 = {
 			listenSilentAlt: "Escuchar. Repetir las instrucciones.",
 			listenPlayingAlt: "Escuchar. Estas son las instrucciones.",
 			printAudio: "Audio:",
-			printTranscript: "Transcripción:",
-			printKey: "(clave)"
+			printTranscript: "Transcripción:"
 		},
 		multipleChoice: {
 			minSelections: "Seleccione al menos {{minSelections}}.",
@@ -36221,11 +36167,7 @@ function VennClassification($$anchor, $$props) {
 			tileId,
 			placement
 		});
-		l({
-			sourceEl: containerEl,
-			session: next,
-			complete: next.completed === true
-		});
+		$$props.onSessionChange?.(next);
 	}
 	function findTile(id) {
 		if (!id) return null;
@@ -36855,7 +36797,8 @@ function VennClassification($$anchor, $$props) {
 delegate(["focusout", "click"]);
 create_custom_element(VennClassification, {
 	model: { type: "Object" },
-	session: { type: "Object" }
+	session: { type: "Object" },
+	onSessionChange: {}
 }, [], []);
 //#endregion
 //#region src/author/Author.svelte
@@ -36880,12 +36823,10 @@ var $$css = {
 function Author($$anchor, $$props) {
 	push($$props, true);
 	append_styles$1($$anchor, $$css);
-	let model = prop($$props, "model", 15), onChange = prop($$props, "onChange", 7);
-	const isAuthorHost = (node) => typeof node?.onModelChange === "function";
+	let model = prop($$props, "model", 15), onChange = prop($$props, "onChange", 7), onModelChange = prop($$props, "onModelChange", 7);
 	/** The wrapper owns the model and announces the edit; `onChange` serves a component mounted without one. */
 	function emit(next) {
-		const host = r$2(get$1(authorShellEl), { hostPredicate: isAuthorHost });
-		if (host) host.onModelChange(next);
+		if (onModelChange()) onModelChange()(next);
 		else {
 			model(next);
 			onChange()?.(next);
@@ -37103,6 +37044,13 @@ function Author($$anchor, $$props) {
 		set onChange($$value) {
 			onChange($$value);
 			flushSync();
+		},
+		get onModelChange() {
+			return onModelChange();
+		},
+		set onModelChange($$value) {
+			onModelChange($$value);
+			flushSync();
 		}
 	};
 	var div = root_11();
@@ -37115,7 +37063,7 @@ function Author($$anchor, $$props) {
 	remove_input_defaults(input);
 	next(2);
 	reset$1(label_1);
-	var node_1 = sibling(label_1, 2);
+	var node = sibling(label_1, 2);
 	var consequent = ($$anchor) => {
 		{
 			let $0 = /* @__PURE__ */ user_derived(() => get$1(m).prompt || "");
@@ -37124,11 +37072,12 @@ function Author($$anchor, $$props) {
 					return get$1($0);
 				},
 				onChange: onPromptChange,
-				placeholder: "Enter a prompt for the Venn classification question..."
+				placeholder: "Enter a prompt for the Venn classification question...",
+				ariaLabel: "Prompt"
 			});
 		}
 	};
-	if_block(node_1, ($$render) => {
+	if_block(node, ($$render) => {
 		if (get$1(m).promptEnabled !== false) $$render(consequent);
 	});
 	reset$1(div_3);
@@ -37151,14 +37100,14 @@ function Author($$anchor, $$props) {
 	var div_7 = child(div_6);
 	var button = sibling(child(div_7), 2);
 	reset$1(div_7);
-	var node_2 = sibling(div_7, 2);
+	var node_1 = sibling(div_7, 2);
 	var consequent_1 = ($$anchor) => {
 		append($$anchor, root_1());
 	};
-	if_block(node_2, ($$render) => {
+	if_block(node_1, ($$render) => {
 		if (get$1(m).tiles.length === 0) $$render(consequent_1);
 	});
-	var ul = sibling(node_2, 2);
+	var ul = sibling(node_1, 2);
 	each(ul, 21, () => get$1(m).tiles, index, ($$anchor, tile, idx) => {
 		var li = root_3();
 		var div_9 = child(li);
@@ -37179,14 +37128,14 @@ function Author($$anchor, $$props) {
 		var input_5 = sibling(child(label_6), 2);
 		remove_input_defaults(input_5);
 		reset$1(label_6);
-		var node_3 = sibling(label_6, 2);
+		var node_2 = sibling(label_6, 2);
 		var consequent_2 = ($$anchor) => {
 			var div_11 = root_2();
 			delegated("click", only_child(div_11), () => clearTileImage(idx));
 			append($$anchor, div_11);
 		};
 		var d = /* @__PURE__ */ user_derived(() => (get$1(tile).imageUrl ?? "").trim());
-		if_block(node_3, ($$render) => {
+		if_block(node_2, ($$render) => {
 			if (get$1(d)) $$render(consequent_2);
 		});
 		reset$1(div_10);
@@ -37276,7 +37225,7 @@ function Author($$anchor, $$props) {
 	var text_3 = sibling(child(div_19));
 	reset$1(div_19);
 	reset$1(div_16);
-	var node_6 = sibling(div_16, 2);
+	var node_5 = sibling(div_16, 2);
 	var consequent_3 = ($$anchor) => {
 		var div_20 = root_5();
 		VennClassification(child(div_20), {
@@ -37296,29 +37245,29 @@ function Author($$anchor, $$props) {
 	var alternate = ($$anchor) => {
 		append($$anchor, root_7());
 	};
-	if_block(node_6, ($$render) => {
+	if_block(node_5, ($$render) => {
 		if (get$1(m).tiles.length > 0 && get$1(m).circles?.length === 2) $$render(consequent_3);
 		else if (get$1(m).tiles.length === 0) $$render(consequent_4, 1);
 		else $$render(alternate, -1);
 	});
-	var node_8 = sibling(node_6, 2);
+	var node_7 = sibling(node_5, 2);
 	var consequent_6 = ($$anchor) => {
 		var fragment_1 = root_10();
 		var ol = sibling(first_child(fragment_1), 2);
 		each(ol, 21, () => get$1(m).tiles, index, ($$anchor, tile) => {
 			var li_1 = root_9();
 			var span_2 = child(li_1);
-			var node_9 = child(span_2);
+			var node_8 = child(span_2);
 			var consequent_5 = ($$anchor) => {
 				var img = root_8();
 				template_effect(() => set_attribute(img, "src", get$1(tile).imageUrl));
 				append($$anchor, img);
 			};
 			var d_1 = /* @__PURE__ */ user_derived(() => (get$1(tile).imageUrl ?? "").trim());
-			if_block(node_9, ($$render) => {
+			if_block(node_8, ($$render) => {
 				if (get$1(d_1)) $$render(consequent_5);
 			});
-			var text_4 = sibling(node_9);
+			var text_4 = sibling(node_8);
 			reset$1(span_2);
 			var text_5 = only_child(sibling(span_2, 4), true);
 			reset$1(li_1);
@@ -37331,7 +37280,7 @@ function Author($$anchor, $$props) {
 		reset$1(ol);
 		append($$anchor, fragment_1);
 	};
-	if_block(node_8, ($$render) => {
+	if_block(node_7, ($$render) => {
 		if (get$1(m).tiles.length > 0) $$render(consequent_6);
 	});
 	reset$1(div_15);
@@ -37368,31 +37317,29 @@ delegate([
 ]);
 create_custom_element(Author, {
 	model: { type: "Object" },
+	onModelChange: {},
 	onChange: {}
 }, [], []);
 //#endregion
 //#region src/author/index.ts
 var SvelteElementClass = Author.element;
 var VennClassificationAuthor = class extends SvelteElementClass {
-	constructor(..._args) {
-		super(..._args);
+	/**
+	* The component reports each edit through its `onModelChange` prop, assigned
+	* here through the accessor Svelte generates for it. The host keeps the
+	* edited model, renders from it, and announces it as `model.updated`, which
+	* bubbles to the listener an authoring player registers at its root.
+	*/
+	constructor() {
+		super();
 		_defineProperty(this, "_model", null);
 		_defineProperty(this, "_onChange", null);
-		_defineProperty(
-			this,
-			/**
-			* The component reports each edit here. The host keeps the edited model,
-			* renders from it, and announces it as `model.updated`, which bubbles to
-			* the listener an authoring player registers at its root.
-			*/
-			"onModelChange",
-			(update) => {
-				this._model = update;
-				super.model = update;
-				this._onChange?.(update);
-				this.dispatchEvent(new e$3(update, false));
-			}
-		);
+		this.onModelChange = (update) => {
+			this._model = update;
+			super.model = update;
+			this._onChange?.(update);
+			this.dispatchEvent(new e$3(update, false));
+		};
 	}
 	set model(m) {
 		this._model = m;