@yuneta/gobj-ui 7.26.34 → 7.26.36

package/dist/gobj-ui.cjs.js

@@ -545,14 +545,26 @@ function text_list_item_formatter(label) {
 *      ALWAYS RENDERED, hidden when empty, so the runtime setters have a
 *      node to write into and never rebuild the control that holds it.
 *
-*      role="status" and NOT aria-hidden, deliberately.  The control
-*      carries an explicit aria-label, and an explicit label REPLACES
-*      the element's content for a screen reader -- so a badge inside
-*      it would be silent.  As its own live region it is both read and
-*      announced when the count changes, which is the whole point of a
-*      badge that means "something needs you".  For the same reason a
-*      write that changes nothing touches no DOM: rewriting the same
-*      number would have it announced again on every tick.
+*      PART OF THE CONTROL'S NAME (name_control_with_badge()).  The
+*      control carries an explicit aria-label, and an explicit label
+*      REPLACES the element's content for a screen reader -- so a badge
+*      inside it is silent, and inside a <button> (the toolbar, an
+*      accordion head) its children are not even in the tree.  The
+*      control is labelled by ITSELF (its aria-label, which
+*      refresh_language() re-translates) and by the badge: the name is
+*      "Alarms 3" while there is a count, "Alarms" while there is none,
+*      with nothing composed in javascript that a language switch would
+*      leave behind.
+*
+*      NOT a live region any more.  Up to 7.26.34 the badge was its own
+*      role="status", and that said "3" with no word of what has three;
+*      hidden while empty, it was not in the tree when the first count
+*      arrived, so 0 -> 1 was most likely never said; and inside a
+*      <button> it was not there at all.  The change is said by the
+*      shell, in one live region of its own that is always there, with
+*      the name of the item: "Alarms, 3" (yui_shell_set_nav_item_badge,
+*      yui_shell_set_toolbar_item_badge).  A write that changes nothing
+*      still touches no DOM.
 *
 *      A TONE, optional: one of BADGE_TONES, drawn as Bulma's
 *      `is-<tone>` on the badge.  It says HOW BAD the count is -- the
@@ -578,6 +590,7 @@ var BADGE_TONES = Object.freeze([
 	"primary",
 	"link"
 ]);
+var __badge_seq__ = 0;
 /************************************************************
 *  The text a badge shows for `value`, "" when it shows none.
 ************************************************************/
@@ -611,10 +624,7 @@ function badge_tone(tone, who) {
 function badge_node(value, tone, classes, who) {
 	let text = badge_text(value);
 	let known = badge_tone(tone, who);
-	let attrs = {
-		class: known ? `${classes} is-${known}` : classes,
-		role: "status"
-	};
+	let attrs = { class: known ? `${classes} is-${known}` : classes };
 	if (!text) attrs.hidden = "hidden";
 	return [
 		"span",
@@ -623,6 +633,31 @@ function badge_node(value, tone, classes, who) {
 	];
 }
 /************************************************************
+*  Make the count part of the NAME of the control that carries
+*  the badge: its `aria-labelledby` points at the control itself
+*  and at the badge.
+*
+*  The control keeps its `aria-label` and its
+*  data-i18n-aria-label: a self-reference reads the aria-label,
+*  so the name is the translated label followed by the badge's
+*  text -- "Alarms 3" -- or the label alone while the badge is
+*  empty. A painted count is in the name at once, and a language
+*  switch re-translates the label as it always did.
+*
+*  Both are createElement2() descriptions, before anything is
+*  built: `control_attrs` (the attrs of the <a> or <button>, which
+*  must carry its aria-label) gets an `id` when it has none, and
+*  the `aria-labelledby`; `badge` (what badge_node() answered)
+*  gets its `id`.
+************************************************************/
+function name_control_with_badge(control_attrs, badge) {
+	let seq = ++__badge_seq__;
+	if (!control_attrs.id) control_attrs.id = `yui-badged-${seq}`;
+	let badge_attrs = badge[1];
+	badge_attrs.id = `yui-badge-${seq}`;
+	control_attrs["aria-labelledby"] = `${control_attrs.id} ${badge_attrs.id}`;
+}
+/************************************************************
 *  Write a badge that is already in the DOM, as badge_node()
 *  draws it.  `tone` is one badge_tone() answered: the setter
 *  checks it once for all the badges it paints.
@@ -1019,6 +1054,8 @@ function secondary_nav_renders(item, layout) {
 *
 *      Parses a JSON config to build:
 *          - Layers (z-stacked): base, overlay, popup, modal, notification, loading
+*            (the overlay holds the WINDOW layer, where the windows live,
+*            under the drawer: yui_shell_window_layer())
 *          - Zones (inside base layer): top, top-sub, left, center, right,
 *            bottom-sub, bottom
 *          - Menus (primary + submenus) rendered via C_YUI_NAV — one nav
@@ -1046,6 +1083,8 @@ function secondary_nav_renders(item, layout) {
 ***************************************************************/
 var GCLASS_NAME$22 = "C_YUI_SHELL";
 var __last_shell__ = null;
+var __shell_watchers__ = [];
+var __window_z__ = 10;
 var ZONE_IDS = [
 	"top",
 	"top-sub",
@@ -1080,10 +1119,12 @@ var attrs_table$22 = [
 var PRIVATE_DATA$22 = {
 	zones: {},
 	layers: {},
+	window_layer: null,
 	stages: {},
 	navs: [],
 	item_index: {},
 	nav_badges: {},
+	badge_status: null,
 	dynamic_items: {},
 	section_pos: {},
 	route_mru: [],
@@ -1124,6 +1165,7 @@ function mt_create$22(gobj) {
 	if (subscriber) (0, _yuneta_gobj_js.gobj_subscribe_event)(gobj, null, {}, subscriber);
 	__last_shell__ = gobj;
 	build_ui$19(gobj);
+	tell_shell_watchers(gobj);
 }
 /***************************************************************
 *          Framework Method: Start
@@ -1307,10 +1349,11 @@ function mt_stop$20(gobj) {
 ***************************************************************/
 function mt_destroy$22(gobj) {
 	close_toolbar_dropdown(gobj);
+	if (__last_shell__ === gobj) __last_shell__ = null;
 	let $container = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "$container");
 	if ($container && $container.parentNode) $container.parentNode.removeChild($container);
+	tell_shell_watchers(gobj);
 	(0, _yuneta_gobj_js.gobj_write_attr)(gobj, "$container", null);
-	if (__last_shell__ === gobj) __last_shell__ = null;
 }
 /***************************
 *      Local Methods
@@ -1433,6 +1476,17 @@ function build_ui$19(gobj) {
 		$container.appendChild($layer);
 		priv.layers[id] = $layer;
 	}
+	let $windows = (0, _yuneta_gobj_js.createElement2)(["div", { class: "SHELL_WINDOW_LAYER yui-window-layer" }]);
+	priv.layers.overlay.appendChild($windows);
+	priv.window_layer = $windows;
+	let $status = (0, _yuneta_gobj_js.createElement2)(["div", {
+		class: "SHELL_BADGE_STATUS is-sr-only",
+		role: "status",
+		"aria-live": "polite",
+		"aria-atomic": "true"
+	}]);
+	$container.appendChild($status);
+	priv.badge_status = $status;
 	let $base = priv.layers.base;
 	$base.classList.add("yui-base-grid");
 	let zones_cfg = shell_cfg.zones || {};
@@ -2026,14 +2080,18 @@ function toolbar_link_attrs(it) {
 ************************************************************/
 function build_toolbar_action_item(gobj, it) {
 	let children = [];
-	if (!(0, _yuneta_gobj_js.empty_string)(it.icon)) children.push([
-		"span",
-		{ class: "icon yui-toolbar-icon" },
-		[["i", {
-			class: it.icon,
-			"aria-hidden": "true"
-		}], badge_node(it.badge, it.badge_tone, "TOOLBAR_ITEM_BADGE yui-badge yui-toolbar-badge", `C_YUI_SHELL: toolbar item '${it.id || "?"}'`)]
-	]);
+	let badge = null;
+	if (!(0, _yuneta_gobj_js.empty_string)(it.icon)) {
+		badge = badge_node(it.badge, it.badge_tone, "TOOLBAR_ITEM_BADGE yui-badge yui-toolbar-badge", `C_YUI_SHELL: toolbar item '${it.id || "?"}'`);
+		children.push([
+			"span",
+			{ class: "icon yui-toolbar-icon" },
+			[["i", {
+				class: it.icon,
+				"aria-hidden": "true"
+			}], badge]
+		]);
+	}
 	if (!(0, _yuneta_gobj_js.empty_string)(it.name)) children.push([
 		"span",
 		{
@@ -2060,6 +2118,7 @@ function build_toolbar_action_item(gobj, it) {
 		btn_attrs.title = tip;
 		btn_attrs["data-i18n-title"] = tip;
 	}
+	if (badge && !(0, _yuneta_gobj_js.empty_string)(aria_key)) name_control_with_badge(btn_attrs, badge);
 	let link = toolbar_link_attrs(it);
 	if (link) {
 		delete btn_attrs.type;
@@ -2844,23 +2903,32 @@ function update_secondary_nav_visibility(gobj, entry) {
 	}
 }
 /************************************************************
-*  Does a menu of this shell declare an item `item_id`: an item
-*  of a menu of app_config.json, of one of their submenus, or
-*  one given to yui_shell_set_submenu() since.
+*  The item `item_id` a menu of this shell declares, null when
+*  none does: an item of a menu of app_config.json, of one of
+*  their submenus, or one given to yui_shell_set_submenu() since
+*  -- which comes first, because it replaced what the submenu
+*  declared and is what the navs draw.
 ************************************************************/
-function nav_item_declared(gobj, item_id) {
+function nav_item_of(gobj, item_id) {
 	let priv = gobj.priv;
 	let config = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "config") || {};
 	let menus = (0, _yuneta_gobj_js.is_object)(config.menu) ? config.menu : {};
-	let holds = (items) => (0, _yuneta_gobj_js.is_array)(items) && items.some((it) => it && it.id === item_id);
+	let find = (items) => (0, _yuneta_gobj_js.is_array)(items) && items.find((it) => it && it.id === item_id) || null;
+	for (let parent_item_id in priv.dynamic_items) {
+		let it = find(priv.dynamic_items[parent_item_id]);
+		if (it) return it;
+	}
 	for (let menu_id in menus) {
 		let items = menus[menu_id] && menus[menu_id].items;
 		if (!(0, _yuneta_gobj_js.is_array)(items)) continue;
-		if (holds(items)) return true;
-		for (let it of items) if (it && it.submenu && holds(it.submenu.items)) return true;
+		let it = find(items);
+		if (it) return it;
+		for (let parent of items) {
+			let sub = parent && parent.submenu && find(parent.submenu.items);
+			if (sub) return sub;
+		}
 	}
-	for (let parent_item_id in priv.dynamic_items) if (holds(priv.dynamic_items[parent_item_id])) return true;
-	return false;
+	return null;
 }
 /************************************************************
 *  Every C_YUI_NAV of this shell: the navs of its menus, and the
@@ -2878,6 +2946,61 @@ function shell_navs(gobj) {
 	}
 	return navs;
 }
+/************************************************************
+*  Say a badge that changed, with the name of what it counts:
+*  "Alarms, 3", in the shell's live region (build_ui()).
+*
+*  The badge itself is no live region (yui_badge.js): its number
+*  alone said nothing, hidden while empty it missed the first
+*  count, and inside a <button> it was not there at all. The
+*  setters call this only when the text a reader would see
+*  changes and is not empty: a count going away is not news, and
+*  the same count again is not either.
+*
+*  `name_key` is the key of the control's name; the phrase is a
+*  key of its own, so a language orders and punctuates it its
+*  way. Said once: a live region needs no re-translation.
+************************************************************/
+function announce_badge(gobj, name_key, text) {
+	let priv = gobj.priv;
+	let $status = priv.badge_status;
+	if (!$status) {
+		(0, _yuneta_gobj_js.log_error)(`C_YUI_SHELL: no live region to say badge '${name_key}': ${text}`);
+		return;
+	}
+	let message;
+	if (typeof priv.translator === "function") {
+		const tr = priv.translator;
+		message = tr("{{name}}, {{n}}", {
+			name: tr(name_key),
+			n: text
+		});
+	} else message = `${name_key}, ${text}`;
+	$status.textContent = message;
+}
+/************************************************************
+*  A shell was built (mt_create) or is being destroyed
+*  (mt_destroy): tell every gobj that keeps DOM in a shell's
+*  layers without being its child (yui_shell_watch_changes()).
+*  Each one decides in its own action what it means for it --
+*  the trace shows EV_SHELL_CHANGED arriving, from a `!!` shell
+*  when it is the one going.
+*
+*  An event, not a call into the window's module: the shell does
+*  not import its watchers, and the move is work, so it crosses
+*  their FSM.  A watcher that is being destroyed is one whose
+*  mt_destroy did not unwatch: it is dropped, and said.
+************************************************************/
+function tell_shell_watchers(gobj) {
+	for (let watcher of __shell_watchers__.slice()) {
+		if ((0, _yuneta_gobj_js.gobj_is_destroying)(watcher)) {
+			(0, _yuneta_gobj_js.log_error)(`C_YUI_SHELL: a destroyed gobj still watches the shell (${(0, _yuneta_gobj_js.gobj_short_name)(watcher)}): it must call yui_shell_unwatch_changes() in its mt_destroy`);
+			yui_shell_unwatch_changes(watcher);
+			continue;
+		}
+		(0, _yuneta_gobj_js.gobj_send_event)(watcher, "EV_SHELL_CHANGED", {}, gobj);
+	}
+}
 /***************************
 *      Actions
 ***************************/
@@ -3147,6 +3270,81 @@ function yui_shell_of(gobj) {
 	return __last_shell__;
 }
 /************************************************************
+*  The DOM where a C_YUI_WINDOW lives when its host names no
+*  `$parent`: the WINDOW layer, a stacking context of its own
+*  inside the overlay layer -- above the content, below the
+*  drawer, the toolbar's dropdowns, the dialogs and the toasts,
+*  whatever z-index a window takes there. Null with no shell (the
+*  window then lives in document.body).
+************************************************************/
+function yui_shell_window_layer(shell_gobj) {
+	if (!shell_gobj || !shell_gobj.priv) return null;
+	let priv = shell_gobj.priv;
+	return priv.window_layer || priv.layers && priv.layers.overlay || null;
+}
+/************************************************************
+*  Put a window on top of the others: the next number of ONE
+*  counter, the same for a window of the dock and for a floating
+*  one.
+*
+*  Up to 7.26.34 there were two orders: the dock raised its windows
+*  to a counter of its own (11, 12, ...), and a window without a
+*  dock sat at 3 and was raised by being moved to the end of its
+*  parent -- so a window opened LATER without a dock (a treedb's
+*  raw json) opened UNDER any docked one, and no click could bring
+*  it up. They share the window layer, and this one number orders
+*  them all. It grows for ever, and it can: nothing else lives in
+*  the window layer's stacking context.
+*
+*  A number, not a move in the DOM: moving an element takes its
+*  focus, its scroll positions and the pointer press that started
+*  on it.
+************************************************************/
+function yui_shell_raise_window($el) {
+	if (!$el || !$el.style) {
+		(0, _yuneta_gobj_js.log_error)("C_YUI_SHELL: yui_shell_raise_window() needs an element");
+		return;
+	}
+	__window_z__ += 1;
+	$el.style.zIndex = String(__window_z__);
+}
+/************************************************************
+*  Ask to be told (EV_SHELL_CHANGED, an INPUT event the gclass of
+*  `gobj` must take in its FSM) when a shell is built or
+*  destroyed.
+*
+*  For a gobj that keeps DOM in a shell's layers without being
+*  its child -- a window parented to the app, the dock. A shell's
+*  children are destroyed with it; such a gobj is not, and its
+*  place goes with the shell: a logout destroys the shell, the
+*  login builds another. Told, it takes its place again in the
+*  action.
+*
+*  Idempotent. Pair it with yui_shell_unwatch_changes() in
+*  mt_destroy, or the next shell sends the event to a destroyed
+*  gobj.
+*
+*      function mt_create(gobj) {
+*          ...
+*          yui_shell_watch_changes(gobj);
+*      }
+*      function mt_destroy(gobj) {
+*          yui_shell_unwatch_changes(gobj);
+*          ...
+*      }
+************************************************************/
+function yui_shell_watch_changes(gobj) {
+	if (!(0, _yuneta_gobj_js.is_gobj)(gobj)) {
+		(0, _yuneta_gobj_js.log_error)("C_YUI_SHELL: yui_shell_watch_changes() needs a gobj");
+		return;
+	}
+	if (__shell_watchers__.indexOf(gobj) < 0) __shell_watchers__.push(gobj);
+}
+function yui_shell_unwatch_changes(gobj) {
+	let idx = __shell_watchers__.indexOf(gobj);
+	if (idx >= 0) __shell_watchers__.splice(idx, 1);
+}
+/************************************************************
 *  Programmatic navigation.
 *
 *  Default — PUSH: the user MOVED somewhere new, so change the URL via
@@ -3402,7 +3600,13 @@ function yui_shell_set_toolbar_item_badge(shell_gobj, item_id, value, tone) {
 	if (!$container) return;
 	let $badge = $container.querySelector(`[data-toolbar-item-id="${item_id}"] .yui-toolbar-badge`);
 	if (!$badge) return;
+	let before = $badge.hasAttribute("hidden") ? "" : $badge.textContent;
 	paint_badge($badge, value, tone);
+	let now = badge_text(value);
+	if (now && now !== before) {
+		let $item = $badge.closest("[data-toolbar-item-id]");
+		announce_badge(shell_gobj, $item && $item.getAttribute("data-i18n-aria-label") || item_id, now);
+	}
 }
 /************************************************************
 *  Set (or clear) the badge of a MENU item — the twin of
@@ -3436,8 +3640,11 @@ function yui_shell_set_nav_item_badge(shell_gobj, item_id, value, tone) {
 	tone = badge_tone(tone, `C_YUI_SHELL: yui_shell_set_nav_item_badge('${item_id}')`);
 	if (!shell_gobj || !(0, _yuneta_gobj_js.is_gobj)(shell_gobj) || (0, _yuneta_gobj_js.gobj_is_destroying)(shell_gobj) || (0, _yuneta_gobj_js.empty_string)(item_id)) return;
 	let priv = shell_gobj.priv;
-	if (!priv || !nav_item_declared(shell_gobj, item_id)) return;
+	let item = priv ? nav_item_of(shell_gobj, item_id) : null;
+	if (!item) return;
 	let badge = value === void 0 ? null : value;
+	let was = priv.nav_badges[item_id];
+	let before = badge_text(was ? was.badge : item.badge);
 	priv.nav_badges[item_id] = {
 		badge,
 		badge_tone: tone
@@ -3447,6 +3654,8 @@ function yui_shell_set_nav_item_badge(shell_gobj, item_id, value, tone) {
 		badge,
 		badge_tone: tone
 	}, shell_gobj);
+	let now = badge_text(badge);
+	if (now && now !== before) announce_badge(shell_gobj, item.name || item_id, now);
 }
 /************************************************************
 *  Programmatic close of any open toolbar dropdown.  Useful for
@@ -4050,7 +4259,7 @@ var MOBILE_MAX = 768;
 ***************************************************************/
 var attrs_table$21 = [
 	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_POINTER, "subscriber", 0, null, "Subscriber of output events"),
-	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_POINTER, "$parent", 0, null, "$container will be appended to $parent if not null, else to the overlay layer of the shell (document.body when there is none)"),
+	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_POINTER, "$parent", 0, null, "$container will be appended to $parent if not null, else to the window layer of the shell (document.body while there is none), following the shell when it is destroyed or another is built"),
 	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_INTEGER, "x", 0, "300", "X position"),
 	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_INTEGER, "y", 0, "100", "Y position"),
 	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_INTEGER, "width", 0, "700", "Width of the window"),
@@ -4086,7 +4295,11 @@ var attrs_table$21 = [
 	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_POINTER, "win_resize_handler", 0, null, "Internal: native window 'resize' listener"),
 	(0, _yuneta_gobj_js.SDATA_END)()
 ];
-var PRIVATE_DATA$21 = { prevSize: 0 };
+var PRIVATE_DATA$21 = {
+	prevSize: 0,
+	placed_by_shell: false,
+	back_shell: null
+};
 var __gclass__$21 = null;
 /******************************
 *      Framework Methods
@@ -4101,6 +4314,7 @@ function mt_create$21(gobj) {
 	(0, _yuneta_gobj_js.gobj_write_attr)(gobj, "window_id", window_id);
 	let manager = resolve_manager(gobj);
 	build_ui$18(gobj);
+	yui_shell_watch_changes(gobj);
 	if (manager) {
 		let $c = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "$container");
 		if ($c) $c.addEventListener("pointerdown", function() {
@@ -4116,7 +4330,16 @@ function mt_create$21(gobj) {
 			title_prefix: (0, _yuneta_gobj_js.gobj_read_str_attr)(gobj, "title_prefix") || "",
 			icon: (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "icon") || ""
 		}, gobj);
-	} else if ((0, _yuneta_gobj_js.gobj_read_bool_attr)(gobj, "back_dismissable")) register_back_overlay(gobj);
+	} else {
+		let $c = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "$container");
+		if ($c) {
+			yui_shell_raise_window($c);
+			$c.addEventListener("pointerdown", function() {
+				if (!(0, _yuneta_gobj_js.gobj_is_destroying)(gobj)) (0, _yuneta_gobj_js.gobj_send_event)(gobj, "EV_SHOW", {}, gobj);
+			}, true);
+		}
+		if ((0, _yuneta_gobj_js.gobj_read_bool_attr)(gobj, "back_dismissable")) register_back_overlay(gobj);
+	}
 	let on_win_resize = function() {
 		handleResize(gobj);
 	};
@@ -4127,13 +4350,15 @@ function mt_create$21(gobj) {
 *          Framework Method: Destroy
 ***************************************************************/
 function mt_destroy$21(gobj) {
+	let priv = gobj.priv;
+	yui_shell_unwatch_changes(gobj);
 	let manager = (0, _yuneta_gobj_js.gobj_read_pointer_attr)(gobj, "manager");
 	if (manager) (0, _yuneta_gobj_js.gobj_send_event)(manager, "EV_UNREGISTER_WINDOW", { window: (0, _yuneta_gobj_js.gobj_full_name)(gobj) }, gobj);
 	let back_overlay = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "back_overlay");
 	if (back_overlay) {
-		let shell = yui_shell_of(gobj);
-		if (shell) yui_shell_overlay_dismissed(shell, back_overlay);
+		if (priv.back_shell) yui_shell_overlay_dismissed(priv.back_shell, back_overlay);
 		(0, _yuneta_gobj_js.gobj_write_attr)(gobj, "back_overlay", null);
+		priv.back_shell = null;
 	}
 	let on_win_resize = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "win_resize_handler");
 	if (on_win_resize) {
@@ -4545,7 +4770,8 @@ function build_ui$18(gobj) {
 	}
 	(0, _yuneta_gobj_js.refresh_language)($container, i18next.t);
 	let $parent = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "$parent");
-	if (!$parent) $parent = default_parent(gobj);
+	gobj.priv.placed_by_shell = !$parent;
+	if (!$parent) $parent = window_place(gobj);
 	$parent.appendChild($container);
 	if ((0, _yuneta_gobj_js.gobj_read_bool_attr)(gobj, "openMaximized")) max$2(gobj);
 	else if (!mobile) {
@@ -4587,11 +4813,13 @@ function register_back_overlay(gobj) {
 	};
 	let overlay = yui_shell_register_overlay(shell, function() {
 		(0, _yuneta_gobj_js.gobj_write_attr)(gobj, "back_overlay", null);
+		gobj.priv.back_shell = null;
 		const closing = close_window(gobj);
 		if (closing.state === "vetoed") rearm();
 		else if (closing.state === "asking") closing.answer.then(rearm);
 	}, { keep_on_navigate: (0, _yuneta_gobj_js.gobj_read_bool_attr)(gobj, "keep_on_navigate") });
 	(0, _yuneta_gobj_js.gobj_write_attr)(gobj, "back_overlay", overlay);
+	gobj.priv.back_shell = overlay ? shell : null;
 }
 /************************************************************
 *  Ask to close the window. Answers what happened:
@@ -4633,7 +4861,8 @@ function close_window(gobj) {
 }
 /************************************************************
 *  Where a window lives when its host names no `$parent`: the
-*  OVERLAY layer of the shell -- above the content, below the
+*  WINDOW layer of its shell (yui_shell_window_layer()), inside
+*  the overlay layer -- above the content, below the drawer, the
 *  toolbar's dropdowns, the dialogs and the toasts.
 *
 *  It used to be document.body, and that put every window above
@@ -4646,14 +4875,17 @@ function close_window(gobj) {
 *  toolbar, any dialog opened with a window on screen, the same.
 *
 *  Inside the layer the dock's z-index still orders the windows
-*  among themselves. No shell (a page with windows and no shell):
-*  the body, as before.
+*  among themselves, and no number it gives them reaches the
+*  drawer (7.26.31 put them in the overlay layer itself, beside
+*  it). No shell (a page with windows and no shell, or the time
+*  between a logout and the next login): the body.
+*
+*  The place is the shell's, and a window parented to the app
+*  outlives it: ac_shell_changed() moves it when a shell goes or
+*  comes.
 ************************************************************/
-function default_parent(gobj) {
-	let shell = yui_shell_of(gobj);
-	let layers = shell && shell.priv && shell.priv.layers;
-	if (layers && layers.overlay) return layers.overlay;
-	return document.body;
+function window_place(gobj) {
+	return yui_shell_window_layer(yui_shell_of(gobj)) || document.body;
 }
 /************************************************************
 *
@@ -4925,8 +5157,7 @@ function ac_show$15(gobj, event, kw, src) {
 		return -1;
 	}
 	$container.style.removeProperty("display");
-	let $parent = $container.parentNode;
-	if ($parent && $parent.lastChild !== $container) $parent.appendChild($container);
+	yui_shell_raise_window($container);
 	return 0;
 }
 /************************************************************
@@ -4943,6 +5174,49 @@ function ac_close(gobj, event, kw, src) {
 	close_window(gobj);
 	return 0;
 }
+/************************************************************
+*   EV_SHELL_CHANGED -- a shell was built, or is being destroyed
+*   (`src`, then destroying): the place this window lives in may
+*   have gone with it, or be in the new one
+*   (yui_shell_watch_changes()).
+*
+*   - A window whose host named no `$parent` takes the window place
+*     again: the window layer of the shell that governs it NOW,
+*     document.body while there is none. So the developer window
+*     outlives a logout in the body, and the login's shell takes it
+*     in -- above its content, under its dialogs. From 7.26.31 to
+*     7.26.34 it stayed in the destroyed shell's layer: alive,
+*     detached, invisible.
+*   - A window its host placed stays where it was put, unless that
+*     element was inside the shell being destroyed: then no place
+*     is left, and it takes the window place from now on.
+*   - Its Back entry, when the shell being destroyed held it, went
+*     with that shell's history and is forgotten. The next shell
+*     does not get one: a history entry pushed while a shell is
+*     still being built would sit under its first route. Back no
+*     longer closes such a window; its ✕ does, as before 7.26.31.
+************************************************************/
+function ac_shell_changed$1(gobj, event, kw, src) {
+	let priv = gobj.priv;
+	let going = (0, _yuneta_gobj_js.gobj_is_destroying)(src);
+	if (going && priv.back_shell === src) {
+		(0, _yuneta_gobj_js.gobj_write_attr)(gobj, "back_overlay", null);
+		priv.back_shell = null;
+	}
+	let $container = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "$container");
+	if (!$container) {
+		(0, _yuneta_gobj_js.log_error)(`${(0, _yuneta_gobj_js.gobj_short_name)(gobj)}: EV_SHELL_CHANGED without a container`);
+		return -1;
+	}
+	if (!priv.placed_by_shell) {
+		let $shell = going ? (0, _yuneta_gobj_js.gobj_read_attr)(src, "$container") : null;
+		if (!$shell || !$shell.contains($container)) return 0;
+		priv.placed_by_shell = true;
+	}
+	let $place = window_place(gobj);
+	if ($container.parentNode !== $place) $place.appendChild($container);
+	return 0;
+}
 /***************************
 *          FSM
 ***************************/
@@ -4978,6 +5252,11 @@ function create_gclass$21(gclass_name) {
 			"EV_CLOSE_WINDOW",
 			ac_close,
 			null
+		],
+		[
+			"EV_SHELL_CHANGED",
+			ac_shell_changed$1,
+			null
 		]
 	]]];
 	const event_types = [
@@ -4987,7 +5266,8 @@ function create_gclass$21(gclass_name) {
 		["EV_REFRESH", 0],
 		["EV_SHOW", 0],
 		["EV_HIDE", 0],
-		["EV_CLOSE_WINDOW", 0]
+		["EV_CLOSE_WINDOW", 0],
+		["EV_SHELL_CHANGED", 0]
 	];
 	__gclass__$21 = (0, _yuneta_gobj_js.gclass_create)(gclass_name, event_types, states, gmt$21, 0, attrs_table$21, PRIVATE_DATA$21, 0, 0, 0, 0);
 	if (!__gclass__$21) return -1;
@@ -5038,6 +5318,7 @@ function register_c_yui_window() {
 var GCLASS_NAME$20 = "C_YUI_WINDOW_MANAGER";
 var DOCK_Z = 1e6;
 var WC_X = "<svg viewBox=\"0 0 16 16\" aria-hidden=\"true\"><path d=\"M4.5 4.5 L11.5 11.5 M11.5 4.5 L4.5 11.5\" stroke=\"currentColor\" stroke-width=\"1.5\" stroke-linecap=\"round\"/></svg>";
+var __chip_seq__ = 0;
 /***************************************************************
 *              Data
 ***************************************************************/
@@ -5047,15 +5328,15 @@ var attrs_table$20 = [
 	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_STRING, "dock_corner", 0, "bottom-left", "Floating placement: top-left | top-right | bottom-left | bottom-right"),
 	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_STRING, "inline_selector", 0, "", "CSS selector of the container the dock mounts into when inline (e.g. a shell zone)"),
 	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_STRING, "responsive_query", 0, "(max-width: 768px)", "Media query that selects inline placement when dock_mode is 'responsive'"),
-	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_POINTER, "$parent", 0, null, "Where the floating dock mounts (default document.body)"),
+	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_POINTER, "$parent", 0, null, "Where the floating dock mounts (default: the popup layer of the shell, document.body while there is none)"),
 	(0, _yuneta_gobj_js.SDATA)(_yuneta_gobj_js.data_type_t.DTP_POINTER, "$container", 0, null, "Internal: the dock element"),
 	(0, _yuneta_gobj_js.SDATA_END)()
 ];
 var PRIVATE_DATA$20 = {
 	windows: null,
-	z: 0,
 	mql: null,
-	mql_handler: null
+	mql_handler: null,
+	lang_shell: null
 };
 var __gclass__$20 = null;
 /******************************
@@ -5067,7 +5348,6 @@ var __gclass__$20 = null;
 function mt_create$20(gobj) {
 	let priv = gobj.priv;
 	priv.windows = [];
-	priv.z = 10;
 	if (((0, _yuneta_gobj_js.gobj_read_attr)(gobj, "dock_mode") || "floating") === "responsive") {
 		let q = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "responsive_query") || "(max-width: 768px)";
 		priv.mql = window.matchMedia(q);
@@ -5077,6 +5357,8 @@ function mt_create$20(gobj) {
 		priv.mql.addEventListener("change", priv.mql_handler);
 	}
 	build_dock(gobj);
+	yui_shell_watch_changes(gobj);
+	follow_language(gobj);
 	const subscriber = (0, _yuneta_gobj_js.gobj_read_pointer_attr)(gobj, "subscriber");
 	if (subscriber) (0, _yuneta_gobj_js.gobj_subscribe_event)(gobj, null, {}, subscriber);
 }
@@ -5085,6 +5367,11 @@ function mt_create$20(gobj) {
 ***************************************************************/
 function mt_destroy$20(gobj) {
 	let priv = gobj.priv;
+	yui_shell_unwatch_changes(gobj);
+	if (priv.lang_shell) {
+		if (!(0, _yuneta_gobj_js.gobj_is_destroying)(priv.lang_shell)) (0, _yuneta_gobj_js.gobj_unsubscribe_event)(priv.lang_shell, "EV_LANGUAGE_CHANGED", {}, gobj);
+		priv.lang_shell = null;
+	}
 	if (priv.mql && priv.mql_handler) {
 		priv.mql.removeEventListener("change", priv.mql_handler);
 		priv.mql = null;
@@ -5096,6 +5383,37 @@ function mt_destroy$20(gobj) {
 *      Local Methods
 ***************************/
 /************************************************************
+*  Hear the language of the shell that holds the dock -- the
+*  dock outlives a shell, so it follows them: the dying one's
+*  subscription goes with it, the next one is heard. The
+*  toggle of a chip whose window's title has a DATA half has a
+*  composed title, which no key carries: it is written again in
+*  the new language (ac_language_changed).
+************************************************************/
+function follow_language(gobj) {
+	let priv = gobj.priv;
+	let shell = yui_shell_of(gobj);
+	if (shell && (0, _yuneta_gobj_js.gobj_is_destroying)(shell)) shell = null;
+	if (shell === priv.lang_shell) return;
+	if (priv.lang_shell && !(0, _yuneta_gobj_js.gobj_is_destroying)(priv.lang_shell)) (0, _yuneta_gobj_js.gobj_unsubscribe_event)(priv.lang_shell, "EV_LANGUAGE_CHANGED", {}, gobj);
+	priv.lang_shell = null;
+	if (shell) {
+		(0, _yuneta_gobj_js.gobj_subscribe_event)(shell, "EV_LANGUAGE_CHANGED", {}, gobj);
+		priv.lang_shell = shell;
+	}
+}
+/************************************************************
+*  The toggle's title and aria-label, in the current language:
+*  the same join as C_YUI_WINDOW's composed_title(), DATA half
+*  first. The title the window registered with when it gave no
+*  halves (a legacy caller).
+************************************************************/
+function chip_title(entry) {
+	let kind = entry.title_key ? (0, i18next.t)(entry.title_key) : "";
+	if (entry.title_prefix && kind) return `${entry.title_prefix} · ${kind}`;
+	return entry.title_prefix || kind || entry.title;
+}
+/************************************************************
 *   Inject the dock stylesheet once (theme-aware).
 ************************************************************/
 function ensure_dock_style() {
@@ -5134,10 +5452,18 @@ function ensure_dock_style() {
 }
 .yui-dock-chip {
     display: inline-flex; align-items: center; gap: 7px; font: inherit; font-size: 12px;
-    padding: 4px 5px 4px 11px; border: 1px solid var(--bulma-border); border-radius: 7px;
-    background: var(--bulma-scheme-main); color: var(--bulma-text); cursor: pointer; white-space: nowrap;
+    padding: 0 5px 0 0; border: 1px solid var(--bulma-border); border-radius: 7px;
+    background: var(--bulma-scheme-main); color: var(--bulma-text); white-space: nowrap;
 }
 .yui-dock-chip:hover { border-color: var(--bulma-text-weak); }
+/*  The chip is the look; its toggle a button that adds none, and
+ *  takes the pill's padding, so the whole label is what a press lands
+ *  on and the chip reads as one pill with its ✕ at the end.  */
+.yui-dock-chip-toggle {
+    display: inline-flex; align-items: center; gap: 7px;
+    padding: 4px 0 4px 11px; margin: 0; border: 0; border-radius: 7px 0 0 7px;
+    background: transparent; font: inherit; color: inherit; cursor: pointer; white-space: nowrap;
+}
 /*  The BORDER says active, not the text: blue ink on a blue tint is
  *  the same hue on itself -- 4.49:1 on the light chip, under the 4.5
  *  its 12px label needs. The label takes the text colour (11:1).  */
@@ -5227,10 +5553,33 @@ function apply_placement(gobj) {
 		"bottom-left",
 		"bottom-right"
 	]) $dock.classList.toggle(`yui-dock--${c}`, !inline && c === corner);
-	let target = inline ? $inline : (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "$parent") || document.body;
+	let target = inline ? $inline : (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "$parent") || dock_place(gobj);
 	if ($dock.parentNode !== target) target.appendChild($dock);
 }
 /************************************************************
+*   Where the FLOATING dock lives when the app names no
+*   `$parent`: the popup layer of the shell, at the top of it.
+*
+*   It was document.body at z-index 1000000, and that put it
+*   above the WHOLE shell -- `.yui-shell` is a stacking context
+*   of its own, so its dialogs (modal layer, 99) and toasts (120)
+*   counted only inside it: the dock stayed clickable over a
+*   dialog's backdrop (a window could be closed from its chip
+*   while its own "all changes will be lost" question was open),
+*   and it covered a toast where they met.
+*
+*   The popup layer, not the window layer: the dock has to stay
+*   above EVERY window, and windows live in two layers -- the
+*   window layer (no `$parent`) and the popup layer, where the
+*   site map and the JSON windows of the treedb views put theirs.
+*   Above both; below the dialogs, the toasts and the loading
+*   cover. No shell (before the first, between a logout and the
+*   next login): the body.
+************************************************************/
+function dock_place(gobj) {
+	return yui_shell_popup_layer(yui_shell_of(gobj)) || document.body;
+}
+/************************************************************
 *   Destroy the dock element.
 ************************************************************/
 function destroy_dock(gobj) {
@@ -5307,7 +5656,6 @@ function set_active(gobj, entry) {
 *   Bring a window to front and mark it active/visible.
 ************************************************************/
 function focus_entry(gobj, entry) {
-	let priv = gobj.priv;
 	let $win = (0, _yuneta_gobj_js.gobj_read_attr)(entry.gobj, "$container");
 	if ($win) {
 		if (entry.minimized) {
@@ -5315,8 +5663,7 @@ function focus_entry(gobj, entry) {
 			entry.minimized = false;
 			if (entry.$chip) entry.$chip.classList.remove("is-min");
 		}
-		priv.z += 1;
-		$win.style.zIndex = priv.z;
+		yui_shell_raise_window($win);
 	}
 	set_active(gobj, entry);
 }
@@ -5383,57 +5730,60 @@ function ac_register_window(gobj, event, kw, src) {
 		{ class: "yui-dock-label-kind" },
 		text_node(title)
 	]);
+	let chip_seq = ++__chip_seq__;
+	let label_ids = label_items.map(function(item, i) {
+		item[1].id = `yui-dock-chip-${chip_seq}-${i}`;
+		return item[1].id;
+	});
 	let entry = {
 		gobj: win,
 		$chip: null,
-		minimized: false
+		minimized: false,
+		title,
+		title_key,
+		title_prefix: prefix
 	};
+	let window_name = (0, _yuneta_gobj_js.gobj_full_name)(win);
 	let $chip = (0, _yuneta_gobj_js.createElement2)([
 		"div",
-		Object.assign({
-			class: "yui-dock-chip",
-			role: "button",
-			tabindex: "0",
-			title
-		}, !prefix && title_key ? { "data-i18n-title": title_key } : {}),
-		[
-			chip_lead(kw.icon),
-			[
+		{ class: "DOCK_CHIP yui-dock-chip" },
+		[[
+			"button",
+			Object.assign({
+				class: "DOCK_CHIP_TOGGLE yui-dock-chip-toggle",
+				type: "button",
+				title,
+				"aria-label": title,
+				"aria-labelledby": label_ids.join(" ")
+			}, !prefix && title_key ? {
+				"data-i18n-title": title_key,
+				"data-i18n-aria-label": title_key
+			} : {}),
+			[chip_lead(kw.icon), [
 				"span",
 				{ class: "yui-dock-label" },
 				label_items
-			],
-			[
-				"button",
-				{
-					class: "yui-dock-close",
-					type: "button",
-					title: (0, i18next.t)("close"),
-					"data-i18n-title": "close",
-					"aria-label": (0, i18next.t)("close"),
-					"data-i18n-aria-label": "close"
-				},
-				(0, _yuneta_gobj_js.html_markup)(WC_X),
-				{ click: (evt) => {
-					evt.stopPropagation();
-					(0, _yuneta_gobj_js.gobj_send_event)(entry.gobj, "EV_CLOSE_WINDOW", {}, gobj);
-				} }
-			]
-		],
-		{
-			click: (evt) => {
+			]],
+			{ click: (evt) => {
 				evt.stopPropagation();
-				on_chip_click(gobj, entry);
+				(0, _yuneta_gobj_js.gobj_send_event)(gobj, "EV_TOGGLE_WINDOW", { window: window_name }, gobj);
+			} }
+		], [
+			"button",
+			{
+				class: "DOCK_CHIP_CLOSE yui-dock-close",
+				type: "button",
+				title: (0, i18next.t)("close"),
+				"data-i18n-title": "close",
+				"aria-label": (0, i18next.t)("close"),
+				"data-i18n-aria-label": "close"
 			},
-			keydown: (evt) => {
-				if (evt.target !== evt.currentTarget) return;
-				if (evt.key === "Enter" || evt.key === " ") {
-					if (evt.key === " ") evt.preventDefault();
-					evt.stopPropagation();
-					on_chip_click(gobj, entry);
-				}
-			}
-		}
+			(0, _yuneta_gobj_js.html_markup)(WC_X),
+			{ click: (evt) => {
+				evt.stopPropagation();
+				(0, _yuneta_gobj_js.gobj_send_event)(entry.gobj, "EV_CLOSE_WINDOW", {}, gobj);
+			} }
+		]]
 	]);
 	entry.$chip = $chip;
 	priv.windows.push(entry);
@@ -5477,6 +5827,67 @@ function ac_focus_window(gobj, event, kw, src) {
 	if (entry) focus_entry(gobj, entry);
 	return 0;
 }
+/************************************************************
+*   EV_TOGGLE_WINDOW { window } -- the toggle of a chip of THIS
+*   dock was pressed: bring a minimized or covered window to the
+*   front, send the one in front to the dock. Only the dock's own
+*   chip sends it (src is the dock): the events a window sends
+*   about itself come from the window, and this one from the chip
+*   that names it.
+************************************************************/
+function ac_toggle_window(gobj, event, kw, src) {
+	let priv = gobj.priv;
+	if (src !== gobj) {
+		(0, _yuneta_gobj_js.log_error)(`${(0, _yuneta_gobj_js.gobj_short_name)(gobj)}: ${event} comes from the dock's own chip, not from ${(0, _yuneta_gobj_js.is_gobj)(src) ? (0, _yuneta_gobj_js.gobj_full_name)(src) : String(src)}`);
+		return -1;
+	}
+	let name = kw && kw.window;
+	let entry = priv.windows.find((e) => (0, _yuneta_gobj_js.gobj_full_name)(e.gobj) === name);
+	if (!entry) {
+		(0, _yuneta_gobj_js.log_error)(`${(0, _yuneta_gobj_js.gobj_short_name)(gobj)}: ${event}: no window '${name}' in the dock`);
+		return -1;
+	}
+	on_chip_click(gobj, entry);
+	return 0;
+}
+/************************************************************
+*   EV_SHELL_CHANGED -- a shell was built, or is being destroyed
+*   (yui_shell_watch_changes()). The dock's place -- the shell's
+*   popup layer, or its zone when inline -- may have gone with
+*   it, or be in the new one: place it again. Up to 7.26.34 an
+*   inline dock stayed in the destroyed shell's zone after a
+*   logout, detached, until a window registered. Its language
+*   is the new shell's too.
+************************************************************/
+function ac_shell_changed(gobj, event, kw, src) {
+	apply_placement(gobj);
+	follow_language(gobj);
+	return 0;
+}
+/************************************************************
+*   EV_LANGUAGE_CHANGED -- from the shell that holds the dock.
+*   A chip's label re-translates by its key (refresh_language()
+*   reaches its kind half); the toggle's title and aria-label
+*   of a window with a DATA half are COMPOSED, so no key carries
+*   them: written again here. Up to 7.26.35 they stayed in the
+*   language the window was opened in (a reader took the
+*   aria-labelledby, which changed; the tooltip did not).
+************************************************************/
+function ac_language_changed$11(gobj, event, kw, src) {
+	let priv = gobj.priv;
+	for (let entry of priv.windows) {
+		if (!entry.title_prefix || !entry.$chip) continue;
+		let $toggle = entry.$chip.querySelector(".DOCK_CHIP_TOGGLE");
+		if (!$toggle) {
+			(0, _yuneta_gobj_js.log_error)(`${(0, _yuneta_gobj_js.gobj_short_name)(gobj)}: a chip without its toggle`);
+			continue;
+		}
+		let title = chip_title(entry);
+		$toggle.setAttribute("title", title);
+		$toggle.setAttribute("aria-label", title);
+	}
+	return 0;
+}
 /***************************
 *          FSM
 ***************************/
@@ -5496,7 +5907,10 @@ function create_gclass$20(gclass_name) {
 		["EV_REGISTER_WINDOW", 0],
 		["EV_UNREGISTER_WINDOW", 0],
 		["EV_MINIMIZE_WINDOW", 0],
-		["EV_FOCUS_WINDOW", 0]
+		["EV_FOCUS_WINDOW", 0],
+		["EV_TOGGLE_WINDOW", 0],
+		["EV_SHELL_CHANGED", 0],
+		["EV_LANGUAGE_CHANGED", 0]
 	], [["ST_IDLE", [
 		[
 			"EV_REGISTER_WINDOW",
@@ -5517,6 +5931,21 @@ function create_gclass$20(gclass_name) {
 			"EV_FOCUS_WINDOW",
 			ac_focus_window,
 			null
+		],
+		[
+			"EV_TOGGLE_WINDOW",
+			ac_toggle_window,
+			null
+		],
+		[
+			"EV_SHELL_CHANGED",
+			ac_shell_changed,
+			null
+		],
+		[
+			"EV_LANGUAGE_CHANGED",
+			ac_language_changed$11,
+			null
 		]
 	]]], gmt$20, 0, attrs_table$20, PRIVATE_DATA$20, 0, 0, 0, 0);
 	if (!__gclass__$20) return -1;
@@ -6796,6 +7225,41 @@ function yui_tabulator_name_row_selects(table, t) {
 		}
 	} catch (e) {}
 }
+/***************************************************************
+*  Name the EDITOR of an editable column: the box Tabulator draws
+*  in a cell while it is edited (input, number, textarea, list,
+*  tickCross, date...).
+*
+*  Tabulator gives it nothing -- no label, no aria-label, no title
+*  -- so a reader lands in an anonymous edit box. Its name is the
+*  column's: a cell is edited under its column's title. Asked at
+*  the MOMENT of editing: Tabulator takes `editorParams` as a
+*  function of the cell, and every built-in editor writes the
+*  `elementAttributes` it answers onto the element it draws. So
+*  the name is in the language of that moment, with nothing to
+*  re-apply after a language change or a rebuild of the columns
+*  -- the twin of the header filters above, which have to be
+*  renamed after every render.
+*
+*  `name_of(cell)` answers the column's title, TRANSLATED (the
+*  view's own label: a cascade, a schema header); "" names
+*  nothing. What `editorParams` the column had is kept, its own
+*  `elementAttributes` too; a name it set itself wins.
+***************************************************************/
+function yui_tabulator_name_editor(column_def, name_of) {
+	if (!column_def || !column_def.editor || typeof name_of !== "function") return;
+	let base = column_def.editorParams;
+	column_def.editorParams = function(cell) {
+		let params = typeof base === "function" ? base(cell) : base || {};
+		let name = name_of(cell);
+		if (!name) return params;
+		let attrs = Object.assign({
+			"aria-label": name,
+			title: name
+		}, params.elementAttributes || {});
+		return Object.assign({}, params, { elementAttributes: attrs });
+	};
+}
 function yui_tabulator_relocalize(table, t) {
 	if (!table) return;
 	try {
@@ -7316,6 +7780,7 @@ function yui_file_control(gobj, { name, value, readonly, accept, on_pick }) {
 		{
 			type: "button",
 			class: "FILE_PICK button is-small",
+			title: (0, i18next.t)("choose a file"),
 			"data-i18n-title": "choose a file",
 			"aria-label": (0, i18next.t)("choose a file"),
 			"data-i18n-aria-label": "choose a file"
@@ -7334,6 +7799,7 @@ function yui_file_control(gobj, { name, value, readonly, accept, on_pick }) {
 		{
 			type: "button",
 			class: "FILE_CLEAR button is-small",
+			title: (0, i18next.t)("remove the file"),
 			"data-i18n-title": "remove the file",
 			"aria-label": (0, i18next.t)("remove the file"),
 			"data-i18n-aria-label": "remove the file"
@@ -8682,6 +9148,293 @@ function json_editor_value(content) {
 	return JSON.stringify(content.json);
 }
 //#endregion
+//#region src/form_json_editor_names.js
+/***********************************************************************
+*          form_json_editor_names.js
+*
+*      The NAMES of the buttons vanilla-jsoneditor draws in its menu
+*      (a json field of C_YUI_FORM): in the app's language, and with an
+*      aria-label.
+*
+*      The editor draws them itself, in English, with a `title` and
+*      nothing else: "Format JSON: add proper indentation and new lines
+*      (Ctrl+I)", "Undo (Ctrl+Z)", and three mode buttons whose text is
+*      "text", "tree" and "table" (REV-CLOUD V23.5.6). Two hooks reach
+*      them, and both are needed:
+*
+*        - json_editor_menu_items(), the editor's `onRenderMenu`: the
+*          items it is about to draw, with each title translated (its
+*          shortcut kept) and the mode buttons' text too. Svelte draws
+*          from these, so a button born in a re-render is born named.
+*        - name_json_editor_menu(), after the render, from the form's
+*          FSM: the aria-label of each button, with its key, so
+*          refresh_language() re-translates it, and the state of the
+*          mode buttons (aria-pressed). A menu item has no field for
+*          either.
+*
+*      A button is known by the CLASS the editor gives it (`jse-format`,
+*      `jse-undo`...), never by its English title: a class is what the
+*      editor's own stylesheet relies on. A button not listed here keeps
+*      the editor's words.
+*
+*      Its CONTEXT MENU (`onRenderContextMenu`,
+*      json_editor_context_menu_items()) has no class on its items, so
+*      an item is known by what it IS and where it IS: the icon the
+*      editor draws it with (a FontAwesome name: `paste`, `scissors`),
+*      the column of the menu it stands in, its place in a dropdown
+*      (the main button, the first or the second of its list), the
+*      mode of the editor (tree or table) -- never by its words. Its
+*      text and title go back translated; after the render the same
+*      pass names its buttons, and the arrow of each dropdown, which
+*      the editor draws with no name at all.
+*
+*      Not reached, because the editor gives them no hook: its search
+*      box, its repair messages, the tip at the foot of the context
+*      menu, and its modals (sort, transform). They stay in its
+*      English.
+*
+*          Copyright (c) 2026, ArtGins.
+*          All Rights Reserved.
+***********************************************************************/
+/***************************************************************
+*              Constants
+***************************************************************/
+var JSON_EDITOR_BUTTON_KEYS = {
+	"jse-expand-all": "expand all",
+	"jse-collapse-all": "collapse all",
+	"jse-search": "search",
+	"jse-copy": "copy",
+	"jse-undo": "undo",
+	"jse-redo": "redo",
+	"jse-cancel": "cancel",
+	"jse-format": "format json",
+	"jse-compact": "compact json",
+	"jse-sort": "sort",
+	"jse-transform": "transform",
+	"jse-contextmenu": "open context menu"
+};
+var JSON_EDITOR_MODE_NAME_KEYS = {
+	text: "text view",
+	tree: "tree view",
+	table: "table view"
+};
+var JSON_EDITOR_MODE_TEXT_KEYS = {
+	text: "text mode",
+	tree: "tree mode",
+	table: "table mode"
+};
+var MODE_CLASS = "yui-jse-mode-";
+var SHORTCUT = /\((?:Ctrl|Cmd|⌘)[^()]*\)\s*$/;
+var CONTEXT_BUTTON_KEYS = {
+	"pen": "edit key",
+	"paste": "paste",
+	"clone": "duplicate",
+	"crop-simple": "extract",
+	"arrow-down-short-wide": "sort",
+	"filter": "transform",
+	"trash-can": "remove",
+	"square-caret-up": "insert before",
+	"square-caret-down": "insert after"
+};
+var CONTEXT_ROW_BUTTON_KEYS = {
+	"pen": "edit row",
+	"clone": "duplicate row",
+	"trash-can": "remove row"
+};
+var CONTEXT_DROPDOWN_MAIN_KEYS = {
+	"pen": "edit value",
+	"scissors": "cut",
+	"copy": "copy"
+};
+var CONTEXT_DROPDOWN_FIRST_KEYS = {
+	"pen": "edit value",
+	"scissors": "cut formatted",
+	"copy": "copy formatted"
+};
+var CONTEXT_DROPDOWN_SECOND_KEYS = {
+	"pen": "enforce string",
+	"scissors": "cut compacted",
+	"copy": "copy compacted"
+};
+var CONTEXT_TARGET_KEYS = {
+	"0": "structure",
+	"1": "object",
+	"2": "array",
+	"3": "value"
+};
+var TARGET_ICONS = ["arrow-right-arrow-left", "plus"];
+var CONTEXT_LABEL_KEYS = {
+	convert: "convert to",
+	insert: "insert",
+	cell: "table cell",
+	row: "table row"
+};
+/***************************
+*      Local Methods
+***************************/
+function has_key(table, name) {
+	return Object.prototype.hasOwnProperty.call(table, name);
+}
+function button_class(classes) {
+	return (Array.isArray(classes) ? classes : String(classes || "").split(/\s+/)).find((c) => has_key(JSON_EDITOR_BUTTON_KEYS, c)) || "";
+}
+function mode_of_item(item) {
+	if (String(item.className || "").split(/\s+/).indexOf("jse-group-button") < 0) return "";
+	return has_key(JSON_EDITOR_MODE_NAME_KEYS, item.text) ? item.text : "";
+}
+function icon_of(item) {
+	return item && item.icon && typeof item.icon.iconName === "string" ? item.icon.iconName : "";
+}
+function named_item(item, name) {
+	let m = SHORTCUT.exec(String(item.title || ""));
+	return Object.assign({}, item, {
+		text: name,
+		title: m ? `${name} ${m[0].trim()}` : name
+	});
+}
+function context_dropdown(item) {
+	let icon = icon_of(item.main);
+	if (!has_key(CONTEXT_DROPDOWN_MAIN_KEYS, icon)) return item;
+	let list = Array.isArray(item.items) ? item.items : [];
+	return Object.assign({}, item, {
+		main: named_item(item.main, (0, i18next.t)(CONTEXT_DROPDOWN_MAIN_KEYS[icon])),
+		items: list.map(function(it, i) {
+			if (!it || it.type !== "button") return it;
+			if (i === 0) return named_item(it, (0, i18next.t)(CONTEXT_DROPDOWN_FIRST_KEYS[icon]));
+			if (i === 1) return named_item(it, (0, i18next.t)(CONTEXT_DROPDOWN_SECOND_KEYS[icon]));
+			return it;
+		})
+	});
+}
+function context_button(item, row_column) {
+	let icon = icon_of(item);
+	if (row_column && has_key(CONTEXT_ROW_BUTTON_KEYS, icon)) return named_item(item, (0, i18next.t)(CONTEXT_ROW_BUTTON_KEYS[icon]));
+	if (has_key(CONTEXT_BUTTON_KEYS, icon)) return named_item(item, (0, i18next.t)(CONTEXT_BUTTON_KEYS[icon]));
+	return item;
+}
+function context_column(item, table, index) {
+	let list = Array.isArray(item.items) ? item.items : [];
+	let buttons = list.filter((it) => it && it.type === "button");
+	let targets = !table && buttons.length > 0 && buttons.every((it) => TARGET_ICONS.indexOf(icon_of(it)) >= 0);
+	let row_column = table && index === 1;
+	let label_kind = "";
+	if (table) label_kind = index === 0 ? "cell" : index === 1 ? "row" : "";
+	else if (targets) label_kind = icon_of(buttons[0]) === "plus" ? "insert" : "convert";
+	let target = 0;
+	let insert_row = 0;
+	return Object.assign({}, item, { items: list.map(function(it) {
+		if (!it || typeof it !== "object") return it;
+		if (it.type === "label") return label_kind ? Object.assign({}, it, { text: (0, i18next.t)(CONTEXT_LABEL_KEYS[label_kind]) }) : it;
+		if (it.type === "dropdown-button") return context_dropdown(it);
+		if (it.type !== "button") return it;
+		if (targets) return named_item(it, (0, i18next.t)(CONTEXT_TARGET_KEYS[String(target++)]));
+		if (row_column && icon_of(it) === "plus") return named_item(it, (0, i18next.t)(insert_row++ === 0 ? CONTEXT_BUTTON_KEYS["square-caret-up"] : CONTEXT_BUTTON_KEYS["square-caret-down"]));
+		return context_button(it, row_column);
+	}) });
+}
+function context_item(item, table) {
+	if (!item || typeof item !== "object") return item;
+	if (item.type === "row") {
+		let column = 0;
+		let list = Array.isArray(item.items) ? item.items : [];
+		return Object.assign({}, item, { items: list.map(function(it) {
+			if (it && it.type === "column") return context_column(it, table, column++);
+			return context_item(it, table);
+		}) });
+	}
+	if (item.type === "dropdown-button") return context_dropdown(item);
+	if (item.type === "button") return context_button(item, false);
+	return item;
+}
+function mode_of_button($b) {
+	for (let c of $b.classList) if (c.indexOf(MODE_CLASS) === 0) {
+		let mode = c.slice(13);
+		if (has_key(JSON_EDITOR_MODE_NAME_KEYS, mode)) return mode;
+	}
+	return "";
+}
+/***************************
+*      Public
+***************************/
+/************************************************************
+*  The editor's `onRenderMenu`: the items it is about to draw,
+*  translated. A title keeps the editor's shortcut after the
+*  translated name ("Deshacer (Ctrl+Z)"); a mode button gets its
+*  mode's name as title and its short text translated, and a class
+*  that says its mode. Anything else is returned as it came.
+*
+*  Pure: what it answers is data for the editor to draw.
+************************************************************/
+function json_editor_menu_items(items) {
+	if (!Array.isArray(items)) return items;
+	return items.map(function(item) {
+		if (!item || item.type !== "button") return item;
+		let mode = mode_of_item(item);
+		if (mode) return Object.assign({}, item, {
+			className: `${item.className} ${MODE_CLASS}${mode}`,
+			title: (0, i18next.t)(JSON_EDITOR_MODE_NAME_KEYS[mode]),
+			text: (0, i18next.t)(JSON_EDITOR_MODE_TEXT_KEYS[mode])
+		});
+		let cls = button_class(item.className);
+		if (!cls) return item;
+		let m = SHORTCUT.exec(String(item.title || ""));
+		let name = (0, i18next.t)(JSON_EDITOR_BUTTON_KEYS[cls]);
+		return Object.assign({}, item, { title: m ? `${name} ${m[0].trim()}` : name });
+	});
+}
+/************************************************************
+*  The editor's `onRenderContextMenu`: the items it is about to
+*  draw, translated -- each known by its icon and its place, never
+*  by its words (context_item()). Anything the module does not
+*  know comes back as it came: a newer editor that moves an item
+*  leaves it in English, it does not mislabel it.
+*
+*  Pure: what it answers is data for the editor to draw.
+************************************************************/
+function json_editor_context_menu_items(items, context) {
+	if (!Array.isArray(items)) return items;
+	let table = !!(context && context.mode === "table");
+	return items.map((item) => context_item(item, table));
+}
+/************************************************************
+*  Name the buttons of a rendered editor's menu: an aria-label
+*  with its key (data-i18n-aria-label, so a language change
+*  reaches it), and aria-pressed on the mode buttons -- the
+*  selected one is the mode on screen (`jse-selected`). Run
+*  after every render of the menu: a re-render may draw new
+*  buttons, which carry none of it.
+************************************************************/
+function name_json_editor_menu($editor) {
+	if (!$editor || typeof $editor.querySelectorAll !== "function") return 0;
+	let named = 0;
+	for (let $b of $editor.querySelectorAll(".jse-menu button")) {
+		let mode = mode_of_button($b);
+		const key = mode ? JSON_EDITOR_MODE_NAME_KEYS[mode] : JSON_EDITOR_BUTTON_KEYS[button_class([...$b.classList])];
+		if (!key) continue;
+		$b.setAttribute("aria-label", (0, i18next.t)(key));
+		$b.setAttribute("data-i18n-aria-label", key);
+		if (mode) $b.setAttribute("aria-pressed", $b.classList.contains("jse-selected") ? "true" : "false");
+		named++;
+	}
+	const MORE = "more options";
+	for (let $b of $editor.querySelectorAll("div.jse-contextmenu button")) {
+		if ($b.getAttribute("data-type") === "jse-open-dropdown") {
+			$b.setAttribute("title", (0, i18next.t)(MORE));
+			$b.setAttribute("data-i18n-title", MORE);
+			$b.setAttribute("aria-label", (0, i18next.t)(MORE));
+			$b.setAttribute("data-i18n-aria-label", MORE);
+			named++;
+			continue;
+		}
+		let text = ($b.textContent || "").trim();
+		if (text) {
+			$b.setAttribute("aria-label", text);
+			named++;
+		}
+	}
+	return named;
+}
+//#endregion
 //#region src/c_yui_form.js
 /***********************************************************************
 *          c_yui_form.js
@@ -8731,7 +9484,9 @@ var attrs_table$17 = [
 var PRIVATE_DATA$17 = {
 	rearm_timer: null,
 	tables: null,
-	table_seq: 0
+	table_seq: 0,
+	json_names_posted: false,
+	lang_shell: null
 };
 var __gclass__$17 = null;
 /***************************
@@ -8762,13 +9517,23 @@ function mt_destroy$17(gobj) {
 *      Framework Method start
 ************************************************************/
 function mt_start$17(gobj) {
+	let priv = gobj.priv;
+	let shell = yui_shell_of(gobj);
+	if (shell) {
+		(0, _yuneta_gobj_js.gobj_subscribe_event)(shell, "EV_LANGUAGE_CHANGED", {}, gobj);
+		priv.lang_shell = shell;
+	}
 	let record = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "record");
 	if (record) (0, _yuneta_gobj_js.gobj_send_event)(gobj, "EV_LOAD_RECORD", record, gobj);
 }
 /************************************************************
 *      Framework Method stop
 ************************************************************/
-function mt_stop$17(gobj) {}
+function mt_stop$17(gobj) {
+	let priv = gobj.priv;
+	if (priv.lang_shell && !(0, _yuneta_gobj_js.gobj_is_destroying)(priv.lang_shell)) (0, _yuneta_gobj_js.gobj_unsubscribe_event)(priv.lang_shell, "EV_LANGUAGE_CHANGED", {}, gobj);
+	priv.lang_shell = null;
+}
 /***************************
 *      Local Methods
 ***************************/
@@ -9224,6 +9989,80 @@ function name_form_control$1($field, conf) {
 		$clear.setAttribute("data-i18n-aria-label", CLEAR_KEY);
 	}
 }
+/************************************************************
+*  The ✕ of ONE selected option of a Tom Select: its
+*  remove_button plugin calls this for every option it draws.
+*
+*  The plugin's own was a div titled "Remove" in English -- never
+*  translated, no aria-label -- with tabindex -1, and the form
+*  turns Backspace deletion off (no_backspace_delete): a keyboard
+*  could not take one option out at all. Named here through t()
+*  with its key (so a language change reaches it), and pressed by
+*  Enter or Space as the clear button is: the key clicks it, which
+*  runs the plugin's own handler.
+************************************************************/
+function remove_option_button() {
+	const KEY = "remove this option";
+	let $b = (0, _yuneta_gobj_js.createElement2)([
+		"div",
+		{
+			class: "remove",
+			role: "button",
+			tabindex: "0",
+			title: (0, i18next.t)(KEY),
+			"data-i18n-title": KEY,
+			"aria-label": (0, i18next.t)(KEY),
+			"data-i18n-aria-label": KEY
+		},
+		"×"
+	]);
+	$b.addEventListener("keydown", function(evt) {
+		if (evt.key === "Enter" || evt.key === " ") {
+			evt.preventDefault();
+			evt.stopPropagation();
+			$b.click();
+		}
+	});
+	return $b;
+}
+/************************************************************
+*  The `onRenderMenu` of a json editor of this form.
+*
+*  The editor calls it with the items it is about to draw: they go
+*  back translated (json_editor_menu_items(), data for the editor
+*  to draw). What no item can carry -- an aria-label, the state of
+*  the mode buttons -- is written on the drawn buttons, after the
+*  render, by the form's FSM (EV_NAME_JSON_EDITORS): the callback
+*  only posts the event, once until it is handled. Posted, not
+*  sent: when it runs the editor has not drawn the menu yet.
+*
+*  A new function each call: handing an editor a new one is what
+*  makes it draw its menu again (ac_language_changed).
+************************************************************/
+function json_editor_render_menu(gobj) {
+	return function(items) {
+		ask_json_editor_names(gobj);
+		return json_editor_menu_items(items);
+	};
+}
+/************************************************************
+*  The `onRenderContextMenu` of a json editor of this form: the
+*  same, for the menu it opens on a right click or Ctrl+Q. It is
+*  built each time it opens, in the language of that moment.
+************************************************************/
+function json_editor_render_context_menu(gobj) {
+	return function(items, context) {
+		ask_json_editor_names(gobj);
+		return json_editor_context_menu_items(items, context);
+	};
+}
+function ask_json_editor_names(gobj) {
+	let priv = gobj.priv;
+	if (!priv.json_names_posted && !(0, _yuneta_gobj_js.gobj_is_destroying)(gobj)) {
+		priv.json_names_posted = true;
+		(0, _yuneta_gobj_js.gobj_post_event)(gobj, "EV_NAME_JSON_EDITORS", {}, gobj);
+	}
+}
 function build_form(gobj) {
 	let form_id = (0, _yuneta_gobj_js.gobj_read_str_attr)(gobj, "form_id");
 	let $form = (0, _yuneta_gobj_js.createElement2)(["form", {
@@ -9255,7 +10094,7 @@ function build_html_form(gobj, $form, prefix, template) {
 		let label_keys = topic_name ? [topic_name + "." + field_desc.name, field_desc.name] : [field_desc.name];
 		const NO_I18N = "\0";
 		html_field_conf.label = (0, i18next.t)(label_keys, { defaultValue: field_desc.header });
-		html_field_conf.label_i18n = (0, i18next.t)(field_desc.name, { defaultValue: NO_I18N }) !== NO_I18N ? field_desc.name : null;
+		html_field_conf.label_i18n = label_keys.find((k) => (0, i18next.t)(k, { defaultValue: NO_I18N }) !== NO_I18N) || null;
 		html_field_conf.placeholder = field_desc.placeholder ? (0, i18next.t)(field_desc.placeholder) : "";
 		let placeholders = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "placeholders");
 		if (placeholders[key]) html_field_conf.placeholder = placeholders[key];
@@ -9961,7 +10800,7 @@ function create_form_field(gobj, $form, prefix, field_desc, { tag, inputType, na
 					"clear_button": { "title": (0, i18next.t)("remove all selected options") },
 					"no_active_items": {},
 					"no_backspace_delete": {},
-					"remove_button": {}
+					"remove_button": { html: remove_option_button }
 				}
 			});
 			$extend.tom_select.on("change", function() {
@@ -10030,7 +10869,9 @@ function create_form_field(gobj, $form, prefix, field_desc, { tag, inputType, na
 					},
 					timestampTag: function({ field, value, path }) {
 						return is_time_field(field);
-					}
+					},
+					onRenderMenu: json_editor_render_menu(gobj),
+					onRenderContextMenu: json_editor_render_context_menu(gobj)
 				}
 			});
 			break;
@@ -10562,6 +11403,9 @@ function template2columns(gobj, columns, template, sub_elements) {
 		}
 		if (column) {
 			if (readonly) delete column.editor;
+			yui_tabulator_name_editor(column, function() {
+				return (0, i18next.t)(field_desc.header || field_desc.name);
+			});
 			columns.push(column);
 		}
 	});
@@ -11322,6 +12166,39 @@ function ac_hide$11(gobj, event, kw, src) {
 function ac_timeout(gobj, event, kw, src) {
 	return 0;
 }
+/************************************************************
+*  EV_NAME_JSON_EDITORS {} -- a menu of a json editor of this
+*  form was drawn, its menu or its context menu (posted by
+*  ask_json_editor_names): name its buttons. Every editor of the
+*  form: naming is idempotent, and a kw is plain json, which an
+*  editor is not.
+************************************************************/
+function ac_name_json_editors(gobj, event, kw, src) {
+	let priv = gobj.priv;
+	priv.json_names_posted = false;
+	let $container = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "$container");
+	if (!$container) {
+		(0, _yuneta_gobj_js.log_error)(`${(0, _yuneta_gobj_js.gobj_short_name)(gobj)}: ${event} without a container`);
+		return -1;
+	}
+	for (let $editor of $container.querySelectorAll(".jsoneditor")) name_json_editor_menu($editor);
+	return 0;
+}
+/************************************************************
+*  EV_LANGUAGE_CHANGED {} -- from the shell. A json editor draws
+*  its menu once: its titles and the text of its mode buttons stay
+*  in the old language until it draws it again, so each is told to
+*  (a new onRenderMenu), and the render names it again.
+************************************************************/
+function ac_language_changed$10(gobj, event, kw, src) {
+	let $container = (0, _yuneta_gobj_js.gobj_read_attr)(gobj, "$container");
+	if (!$container) return 0;
+	for (let $editor of $container.querySelectorAll(".jsoneditor")) {
+		let editor = $editor.jsoneditor;
+		if (editor && typeof editor.updateProps === "function") editor.updateProps({ onRenderMenu: json_editor_render_menu(gobj) });
+	}
+	return 0;
+}
 /***************************
 *          FSM
 ***************************/
@@ -11471,6 +12348,16 @@ function create_gclass$17(gclass_name) {
 			"EV_TIMEOUT",
 			ac_timeout,
 			null
+		],
+		[
+			"EV_NAME_JSON_EDITORS",
+			ac_name_json_editors,
+			null
+		],
+		[
+			"EV_LANGUAGE_CHANGED",
+			ac_language_changed$10,
+			null
 		]
 	]]];
 	const event_types = [
@@ -11489,7 +12376,9 @@ function create_gclass$17(gclass_name) {
 		["EV_REFRESH", 0],
 		["EV_SHOW", 0],
 		["EV_HIDE", 0],
-		["EV_TIMEOUT", 0]
+		["EV_TIMEOUT", 0],
+		["EV_NAME_JSON_EDITORS", 0],
+		["EV_LANGUAGE_CHANGED", 0]
 	];
 	__gclass__$17 = (0, _yuneta_gobj_js.gclass_create)(gclass_name, event_types, states, gmt$17, 0, attrs_table$17, PRIVATE_DATA$17, 0, 0, 0, 0);
 	if (!__gclass__$17) return -1;
@@ -11509,7 +12398,7 @@ function register_c_yui_form() {
 *
 *          Utilities for maplibre
 *
-*          Copyright (c) 2025, ArtGins.
+*          Copyright (c) 2025-2026, ArtGins.
 *          All Rights Reserved.
 ***********************************************************************/
 var EditControl = class {
@@ -11705,9 +12594,14 @@ function label_ctrl($root, selector, text) {
 		$el.setAttribute("aria-label", text);
 	}
 }
+function relabel_written($root, selector, was, now) {
+	if (!$root || !now) return;
+	for (const $el of $root.querySelectorAll(selector)) if ($el.getAttribute("aria-label") === was) $el.setAttribute("aria-label", now);
+}
 function yui_maplibre_relocalize(map, t) {
 	if (!map || typeof map.getContainer !== "function") return;
 	const strings = yui_maplibre_locale(t);
+	const was = Object.assign({}, map._locale);
 	try {
 		map._locale = Object.assign({}, map._locale, strings);
 	} catch (e) {}
@@ -11719,6 +12613,8 @@ function yui_maplibre_relocalize(map, t) {
 	label_ctrl($c, ".maplibregl-ctrl-attrib-button", strings["AttributionControl.ToggleAttribution"]);
 	label_ctrl($c, ".maplibregl-ctrl-fullscreen", strings["FullscreenControl.Enter"]);
 	label_ctrl($c, ".maplibregl-popup-close-button", strings["Popup.Close"]);
+	relabel_written($c, ".maplibregl-canvas", was["Map.Title"], strings["Map.Title"]);
+	relabel_written($c, ".maplibregl-marker", was["Marker.Title"], strings["Marker.Title"]);
 	const mac = typeof navigator !== "undefined" && (navigator.userAgent || "").includes("Mac");
 	const $desktop = $c.querySelector(".maplibregl-desktop-message");
 	if ($desktop) $desktop.textContent = mac ? strings["CooperativeGesturesHandler.MacHelpText"] : strings["CooperativeGesturesHandler.WindowsHelpText"];
@@ -14467,6 +15363,8 @@ function make_toolbar$5(gobj) {
 			type: "text",
 			placeholder: (0, i18next.t)("search"),
 			"data-i18n-placeholder": "search",
+			title: (0, i18next.t)("search"),
+			"data-i18n-title": "search",
 			"aria-label": (0, i18next.t)("search"),
 			"data-i18n-aria-label": "search"
 		},
@@ -16007,6 +16905,8 @@ function make_toolbar$4(gobj) {
 			type: "text",
 			placeholder: (0, i18next.t)("search"),
 			"data-i18n-placeholder": "search",
+			title: (0, i18next.t)("search"),
+			"data-i18n-title": "search",
 			"aria-label": (0, i18next.t)("search"),
 			"data-i18n-aria-label": "search"
 		},
@@ -19280,6 +20180,8 @@ function make_toolbar$2(gobj) {
 			type: "text",
 			placeholder: (0, i18next.t)("search"),
 			"data-i18n-placeholder": "search",
+			title: (0, i18next.t)("search"),
+			"data-i18n-title": "search",
 			"aria-label": (0, i18next.t)("search"),
 			"data-i18n-aria-label": "search"
 		},
@@ -21100,7 +22002,7 @@ function open_gclass_view(host, gclass_name, opts) {
 		(0, _yuneta_gobj_js.gobj_start)(jv);
 		return handle;
 	}
-	let $win_parent = window_layer_of(host, shell);
+	let $win_parent = window_layer_of(host);
 	handle.win = (0, _yuneta_gobj_js.gobj_create_service)(`gclass-win-${(0, _yuneta_gobj_js.clean_name)((0, _yuneta_gobj_js.gobj_name)(host))}`, "C_YUI_WINDOW", {
 		$parent: $win_parent,
 		subscriber: null,
@@ -21168,14 +22070,19 @@ function close_gclass_view(handle) {
 *  window on `body` and mounted in the shell's popup layer
 *  lands BEHIND its opener whatever number it is given, and
 *  the button reads as one that did nothing.
+*
+*  Opened from no window: null -- the window layer of the
+*  shell, where every window lives (the legacy '#top-layer'
+*  when a page has one). It was the shell's popup layer: above
+*  the drawer, in the way of the toolbar's dropdowns.
 ************************************************************/
-function window_layer_of(host, shell) {
+function window_layer_of(host) {
 	let $c = (0, _yuneta_gobj_js.gobj_read_pointer_attr)(host, "$container");
 	if ($c && typeof $c.closest === "function") {
 		let $win = $c.closest(".C_YUI_WINDOW");
 		if ($win && $win.parentNode) return $win.parentNode;
 	}
-	return typeof document !== "undefined" && document.getElementById("top-layer") || shell && yui_shell_popup_layer(shell) || null;
+	return typeof document !== "undefined" && document.getElementById("top-layer") || null;
 }
 /************************************************************
 *  A window is not a sheet: below this width there is no room
@@ -21844,6 +22751,8 @@ function make_find_items(gobj) {
 			type: "text",
 			placeholder: (0, i18next.t)("search"),
 			"data-i18n-placeholder": "search",
+			title: (0, i18next.t)("search"),
+			"data-i18n-title": "search",
 			"aria-label": (0, i18next.t)("search"),
 			"data-i18n-aria-label": "search"
 		},
@@ -23629,7 +24538,7 @@ function card_descriptor(it, show_label, badge_of) {
 		"aria-label": label || it.id
 	};
 	if (label) a_attrs["data-i18n-aria-label"] = label;
-	let tip = it.tooltip || it.aria_label;
+	let tip = it.tooltip || it.aria_label || label;
 	if (tip) {
 		a_attrs.title = tip;
 		a_attrs["data-i18n-title"] = tip;
@@ -23638,6 +24547,7 @@ function card_descriptor(it, show_label, badge_of) {
 		a_attrs["aria-disabled"] = "true";
 		a_attrs["tabindex"] = "-1";
 	}
+	if (badge) name_control_with_badge(a_attrs, badge);
 	return [
 		"a",
 		a_attrs,
@@ -24040,6 +24950,7 @@ function render_tabs(gobj, items) {
 			a_attrs.title = tip;
 			a_attrs["data-i18n-title"] = tip;
 		}
+		name_control_with_badge(a_attrs, badge_el);
 		let li_class = (0, _yuneta_gobj_js.empty_string)(it.class) ? "" : String(it.class);
 		lis.push([
 			"li",
@@ -24119,11 +25030,14 @@ function render_breadcrumb(gobj, items) {
 			href: it.route ? "#" + it.route : "#",
 			"data-item-id": it.id,
 			"data-route": it.route || "",
-			"data-disabled": it.disabled ? "1" : "0"
+			"data-disabled": it.disabled ? "1" : "0",
+			"aria-label": it.name || it.id
 		};
-		if (it.name) {
-			a_attrs["aria-label"] = it.name;
-			a_attrs["data-i18n-aria-label"] = it.name;
+		if (it.name) a_attrs["data-i18n-aria-label"] = it.name;
+		let tip = it.tooltip || it.aria_label || it.name;
+		if (tip) {
+			a_attrs.title = tip;
+			a_attrs["data-i18n-title"] = tip;
 		}
 		lis.push([
 			"li",
@@ -24256,17 +25170,19 @@ function render_accordion(gobj, items) {
 			"aria-expanded": "false",
 			"aria-controls": body_id
 		};
+		let head_badge = item_badge_node(gobj, it, false);
 		if (!(0, _yuneta_gobj_js.empty_string)(head_text)) {
 			head_attrs.i18n = head_text;
 			head_attrs.title = head_text;
 			head_attrs["data-i18n-title"] = head_text;
 			head_attrs["aria-label"] = head_text;
 			head_attrs["data-i18n-aria-label"] = head_text;
+			name_control_with_badge(head_attrs, head_badge);
 		}
 		let $hdr = (0, _yuneta_gobj_js.createElement2)([
 			"button",
 			head_attrs,
-			[text_node(head_text), item_badge_node(gobj, it, false)]
+			[text_node(head_text), head_badge]
 		]);
 		$container.appendChild($hdr);
 		let $ul = (0, _yuneta_gobj_js.createElement2)(["ul", {
@@ -24355,6 +25271,7 @@ function item_li(gobj, it, opts) {
 		a_attrs["aria-disabled"] = "true";
 		a_attrs["tabindex"] = "-1";
 	}
+	name_control_with_badge(a_attrs, badge_el);
 	return [
 		"li",
 		{},
@@ -24401,6 +25318,7 @@ function item_iconbar(gobj, it, opts) {
 		a_attrs.title = tip;
 		a_attrs["data-i18n-title"] = tip;
 	}
+	name_control_with_badge(a_attrs, badge_el);
 	return [
 		"div",
 		{ class: "level-item" },
@@ -24658,7 +25576,10 @@ function render_node(node) {
 	if (node.icon && /^yi-[a-z0-9-]+$/.test(node.icon)) row.push([
 		"span",
 		{ class: "icon ROUTEMAP_ICON" },
-		[["i", { class: node.icon }]]
+		[["i", {
+			class: node.icon,
+			"aria-hidden": "true"
+		}]]
 	]);
 	row.push([
 		"span",
@@ -24707,16 +25628,23 @@ function render_node(node) {
 	]);
 	let row_class = (node.current ? " ROUTEMAP_CURRENT" : "") + (node.ref ? " ROUTEMAP_IS_REF" : "");
 	let $row;
-	if (node.route) $row = (0, _yuneta_gobj_js.createElement2)([
-		"a",
-		{
+	if (node.route) {
+		let a_attrs = {
 			class: "ROUTEMAP_LINK ROUTEMAP_ROW" + row_class,
 			href: "#" + node.route,
 			title: node.route
-		},
-		row
-	]);
-	else $row = (0, _yuneta_gobj_js.createElement2)([
+		};
+		if (node.label) {
+			a_attrs["aria-label"] = node.label;
+			a_attrs["data-i18n-aria-label"] = node.label;
+		}
+		if (node.current) a_attrs["aria-current"] = "page";
+		$row = (0, _yuneta_gobj_js.createElement2)([
+			"a",
+			a_attrs,
+			row
+		]);
+	} else $row = (0, _yuneta_gobj_js.createElement2)([
 		"span",
 		{ class: "ROUTEMAP_ROW ROUTEMAP_STRUCT" + row_class },
 		row
@@ -25000,7 +25928,7 @@ function yui_shell_show_route_map(shell, opts) {
 	if ((0, _yuneta_gobj_js.gclass_find_by_name)("C_YUI_WINDOW")) {
 		let win_ref = { gobj: null };
 		let $body = build_body(shell, t);
-		let $parent = yui_shell_popup_layer(shell) || typeof document !== "undefined" && document.getElementById("top-layer") || null;
+		let $parent = typeof document !== "undefined" && document.getElementById("top-layer") || null;
 		let win = (0, _yuneta_gobj_js.gobj_create_service)(WIN_NAME$2, "C_YUI_WINDOW", {
 			$parent,
 			subscriber: null,
@@ -26074,7 +27002,13 @@ function add_tab(gobj, gobj2, id, text, icon) {
 	let $item = (0, _yuneta_gobj_js.createElement2)([
 		"li",
 		{ class: "" },
-		[["a", { href: id }]]
+		[["a", {
+			href: id,
+			title: (0, i18next.t)(text),
+			"data-i18n-title": text,
+			"aria-label": (0, i18next.t)(text),
+			"data-i18n-aria-label": text
+		}]]
 	]);
 	$tabs.appendChild($item);
 	$item.gobj = gobj2;
@@ -26082,7 +27016,10 @@ function add_tab(gobj, gobj2, id, text, icon) {
 	if (icon) $a.appendChild((0, _yuneta_gobj_js.createElement2)([
 		"span",
 		{ class: "icon is-small is-hidden-mobile" },
-		["i", { class: `${icon}` }]
+		["i", {
+			class: `${icon}`,
+			"aria-hidden": "true"
+		}]
 	]));
 	$a.appendChild((0, _yuneta_gobj_js.createElement2)([
 		"span",
@@ -26271,7 +27208,9 @@ function add_topic_card(gobj, id, text, icon, desc) {
 				class: "yui-nav-item yui-nav-card TREEDB_TOPIC_CARD",
 				href: "#",
 				"data-topic-href": id,
-				"aria-label": text,
+				title: (0, i18next.t)(text),
+				"data-i18n-title": text,
+				"aria-label": (0, i18next.t)(text),
 				"data-i18n-aria-label": text
 			},
 			[[
@@ -27115,7 +28054,7 @@ function open_json_viewer$1(gobj, opts) {
 			}
 		});
 	} else {
-		let $win_parent = shell && yui_shell_popup_layer(shell) || typeof document !== "undefined" && document.getElementById("top-layer") || null;
+		let $win_parent = typeof document !== "undefined" && document.getElementById("top-layer") || null;
 		priv.json_win = (0, _yuneta_gobj_js.gobj_create_service)(`treedb-topics-jsonwin-${(0, _yuneta_gobj_js.clean_name)((0, _yuneta_gobj_js.gobj_name)(gobj))}`, "C_YUI_WINDOW", {
 			$parent: $win_parent,
 			subscriber: null,
@@ -27242,7 +28181,9 @@ function request_print_tranger$1(gobj, path) {
 	}, gobj);
 	if (ret) {
 		(0, _yuneta_gobj_js.log_error)(ret);
-		answer_print_tranger_refused$1(gobj, path, { error: refusal_text$1(ret) || "print-tranger failed" });
+		const refusal = refusal_text$1(ret);
+		if (refusal) answer_print_tranger_refused$1(gobj, path, { error: refusal });
+		else answer_print_tranger_refused$1(gobj, path, { i18n: "print-tranger failed" });
 		return;
 	}
 	if (path) priv.drills_in_flight.add(path);
@@ -27310,9 +28251,13 @@ function ac_mt_command_answer$2(gobj, event, kw, src) {
 			}
 		} else gobj.priv.drills_in_flight.clear();
 		if (result < 0) {
-			if (path) (0, _yuneta_gobj_js.gobj_send_event)(jv, "EV_SUBTREE_ERROR", {
+			if (path && comment) (0, _yuneta_gobj_js.gobj_send_event)(jv, "EV_SUBTREE_ERROR", {
+				path,
+				error: comment
+			}, gobj);
+			else if (path) (0, _yuneta_gobj_js.gobj_send_event)(jv, "EV_SUBTREE_ERROR", {
 				path,
-				error: comment || "print-tranger failed"
+				i18n: "print-tranger failed"
 			}, gobj);
 			else yui_shell_show_error(yui_shell_of(gobj), comment || "print-tranger failed", { t: i18next.t });
 			return 0;
@@ -29097,7 +30042,7 @@ function present_json_popup(gobj, $box, opts) {
 		win: null
 	};
 	let win = (0, _yuneta_gobj_js.gobj_create_service)(opts.name, "C_YUI_WINDOW", {
-		$parent: popup_mount_layer(gobj),
+		$parent: popup_mount_layer(),
 		subscriber: null,
 		modal: false,
 		showMax: true,
@@ -29151,10 +30096,17 @@ function retire_popup_window(win) {
 		(0, _yuneta_gobj_js.log_warning)(`${GCLASS_NAME$5}: json window already gone: ${e}`);
 	}
 }
-function popup_mount_layer(gobj) {
-	let $layer = yui_shell_popup_layer(yui_shell_of(gobj));
-	if ($layer) return $layer;
-	return document.getElementById("popup-layer") || document.body;
+/************************************************************
+*  Where a json window of this view lives: null, the WINDOW
+*  layer of the shell, where every window lives -- below the
+*  shell's dialogs, so a confirm asked over it paints above it
+*  (the legacy C_YUI_MAIN '#popup-layer' when a page has one).
+*  It was the shell's popup layer: above the drawer, in the way
+*  of the toolbar's dropdowns, and in an order of its own no
+*  other window could rise above.
+************************************************************/
+function popup_mount_layer() {
+	return document.getElementById("popup-layer") || null;
 }
 /******************************
 *      Framework Methods
@@ -29769,7 +30721,10 @@ function col_title_formatter(gobj, col) {
 		let text = col_label(col, topic_name);
 		let attrs = {};
 		const NO_I18N = "\0";
-		if ((0, i18next.t)(col.id, { defaultValue: NO_I18N }) !== NO_I18N) attrs.i18n = col.id;
+		let key = null;
+		if (topic_name && (0, i18next.t)(topic_name + "." + col.id, { defaultValue: NO_I18N }) !== NO_I18N) key = topic_name + "." + col.id;
+		else if ((0, i18next.t)(col.id, { defaultValue: NO_I18N }) !== NO_I18N) key = col.id;
+		if (key) attrs.i18n = key;
 		return (0, _yuneta_gobj_js.createElement2)([
 			"span",
 			attrs,
@@ -29863,6 +30818,9 @@ function create_tabulator(gobj) {
 		colDef.editable = function() {
 			return (0, _yuneta_gobj_js.gobj_read_bool_attr)(gobj, "editable") && !(0, _yuneta_gobj_js.gobj_read_bool_attr)(gobj, "readonly");
 		};
+		yui_tabulator_name_editor(colDef, function() {
+			return col_label(col, (0, _yuneta_gobj_js.gobj_read_str_attr)(gobj, "topic_name"));
+		});
 	}
 	const FILTERABLE = [
 		"string",
@@ -71221,7 +72179,7 @@ function open_json_viewer(gobj) {
 		});
 		(0, _yuneta_gobj_js.gobj_start)(jv);
 	} else {
-		let $win_parent = shell && yui_shell_popup_layer(shell) || typeof document !== "undefined" && document.getElementById("top-layer") || null;
+		let $win_parent = typeof document !== "undefined" && document.getElementById("top-layer") || null;
 		priv.json_win = (0, _yuneta_gobj_js.gobj_create_service)(`treedb-jsonwin-${(0, _yuneta_gobj_js.clean_name)((0, _yuneta_gobj_js.gobj_name)(gobj))}`, "C_YUI_WINDOW", {
 			$parent: $win_parent,
 			subscriber: null,
@@ -71335,7 +72293,9 @@ function request_print_tranger(gobj, path) {
 	}, gobj);
 	if (ret) {
 		(0, _yuneta_gobj_js.log_error)(ret);
-		answer_print_tranger_refused(gobj, path, { error: refusal_text(ret) || "print-tranger failed" });
+		const refusal = refusal_text(ret);
+		if (refusal) answer_print_tranger_refused(gobj, path, { error: refusal });
+		else answer_print_tranger_refused(gobj, path, { i18n: "print-tranger failed" });
 		return;
 	}
 	if (path) priv.drills_in_flight.add(path);
@@ -71740,9 +72700,13 @@ function ac_mt_command_answer$1(gobj, event, kw, src) {
 			}
 		} else priv.drills_in_flight.clear();
 		if (result < 0) {
-			if (path) (0, _yuneta_gobj_js.gobj_send_event)(jv, "EV_SUBTREE_ERROR", {
+			if (path && comment) (0, _yuneta_gobj_js.gobj_send_event)(jv, "EV_SUBTREE_ERROR", {
+				path,
+				error: comment
+			}, gobj);
+			else if (path) (0, _yuneta_gobj_js.gobj_send_event)(jv, "EV_SUBTREE_ERROR", {
 				path,
-				error: comment || "print-tranger failed"
+				i18n: "print-tranger failed"
 			}, gobj);
 			else yui_shell_show_error(yui_shell_of(gobj), comment || "print-tranger failed", { t: i18next.t });
 			return 0;
@@ -83334,7 +84298,8 @@ function apply_dev_traces() {
 *  Shell-agnostic: the legacy C_YUI_MAIN shell has a
 *  '#top-layer' stacking element; the new C_YUI_SHELL does not.
 *  We pass that element when present, otherwise null — C_YUI_WINDOW
-*  falls back to document.body by contract.
+*  then takes the window layer of the shell (document.body while
+*  there is none), and follows the shell across a logout.
 ************************************************************/
 function setup_dev(self, show) {
 	if (show) {
@@ -83424,7 +84389,8 @@ var WIN_NAME$1 = "Frontend-View-Window";
 *  Shell-agnostic: the legacy C_YUI_MAIN shell has a
 *  '#top-layer' stacking element; the new C_YUI_SHELL does not.
 *  We pass that element when present, otherwise null — C_YUI_WINDOW
-*  falls back to document.body by contract.
+*  then takes the window layer of the shell (document.body while
+*  there is none), and follows the shell across a logout.
 *
 *  Returns the window gobj, or null.
 ************************************************************/