@yuneta/gobj-ui 7.23.63 → 7.23.65

package/dist/gobj-ui.cjs.js

@@ -268,7 +268,8 @@ var TOOLBAR_ACTION_TYPES = [
 	"navigate",
 	"drawer",
 	"event",
-	"dropdown"
+	"dropdown",
+	"link"
 ];
 /************************************************************
 *  Decide which renderer to use for a toolbar item.
@@ -337,6 +338,7 @@ function validate_action(action, owner_id) {
 	}
 	if (action.type === "navigate" && !_is_non_empty_string(action.route)) warnings.push(`toolbar item '${id}' (action.type:navigate) requires 'route'`);
 	if (action.type === "event" && !_is_non_empty_string(action.event)) warnings.push(`toolbar item '${id}' (action.type:event) requires 'event' name`);
+	if (action.type === "link" && !_is_non_empty_string(action.url)) warnings.push(`toolbar item '${id}' (action.type:link) requires 'url'`);
 	if (action.type === "dropdown") {
 		let nested = validate_dropdown_action(action, id);
 		for (let w of nested) warnings.push(w);
@@ -1684,6 +1686,20 @@ function safe_id(s) {
 *      drawer   { type:"drawer",   op:"toggle"|"open"|"close", menu_id? }
 *      event    { type:"event",    event, kw? }
 *      dropdown { type:"dropdown", items[] }    (toolbar-only)
+*      link     { type:"link",     url, target? }
+*
+*  `link` leaves the application, so on a toolbar item and on the brand
+*  it is rendered as a real <a href> rather than a <button>:
+*  middle-click, open-in-new-tab and the url in the status bar are what
+*  make a link recognisable as one, and a button that assigns
+*  location.href has none of them.  It is also why it does not become
+*  an FSM event -- there is no state of this application to transition;
+*  the page is being left.  A target of "_blank" gets
+*  rel="noopener noreferrer" for free.
+*
+*  INSIDE A DROPDOWN it stays a <button>, deliberately: those rows are
+*  role="menuitemradio" in a menu, and a link is not a choice among
+*  options.  There the dispatcher navigates.
 *
 *  Per-item `show_on` is honoured: each rendered item is wrapped with
 *  the same Bulma-helper logic as zones.
@@ -1770,6 +1786,26 @@ function badge_node(value) {
 	];
 }
 /************************************************************
+*  The attributes that turn a toolbar item into a real link, or
+*  null when this item is not one.  Answering null is what keeps
+*  every caller's default (a <button> that dispatches an action)
+*  exactly as it was.
+************************************************************/
+function toolbar_link_attrs(it) {
+	let action = it && it.action || {};
+	if (action.type !== "link") return null;
+	if ((0, _yuneta_gobj_js.empty_string)(action.url)) {
+		(0, _yuneta_gobj_js.log_warning)(`C_YUI_SHELL: toolbar item '${it.id || "?"}' has action.type "link" without a url`);
+		return null;
+	}
+	let attrs = { href: action.url };
+	if (!(0, _yuneta_gobj_js.empty_string)(action.target)) {
+		attrs.target = action.target;
+		if (action.target === "_blank") attrs.rel = "noopener noreferrer";
+	}
+	return attrs;
+}
+/************************************************************
 *  Renderer for the default ("action") item kind.
 ************************************************************/
 function build_toolbar_action_item(gobj, it) {
@@ -1808,12 +1844,17 @@ function build_toolbar_action_item(gobj, it) {
 		btn_attrs.title = tip;
 		btn_attrs["data-i18n-title"] = tip;
 	}
+	let link = toolbar_link_attrs(it);
+	if (link) {
+		delete btn_attrs.type;
+		Object.assign(btn_attrs, link);
+	}
 	let $item = (0, _yuneta_gobj_js.createElement2)([
-		"button",
+		link ? "a" : "button",
 		btn_attrs,
 		children
 	]);
-	$item.addEventListener("click", (ev) => {
+	if (!link) $item.addEventListener("click", (ev) => {
 		ev.preventDefault();
 		handle_toolbar_action(gobj, it, $item);
 	});
@@ -1845,7 +1886,11 @@ function build_toolbar_brand_item(gobj, it) {
 		attrs["aria-haspopup"] = "menu";
 		attrs["aria-expanded"] = "false";
 	}
-	if (action_type === "") tag = "div";
+	let link = toolbar_link_attrs(it);
+	if (link) {
+		tag = "a";
+		Object.assign(attrs, link);
+	} else if (action_type === "") tag = "div";
 	else attrs.type = "button";
 	let $item = (0, _yuneta_gobj_js.createElement2)([
 		tag,
@@ -1863,7 +1908,7 @@ function build_toolbar_brand_item(gobj, it) {
 			it.wordmark
 		]]
 	]);
-	if (action_type !== "") $item.addEventListener("click", (ev) => {
+	if (action_type !== "" && !link) $item.addEventListener("click", (ev) => {
 		ev.preventDefault();
 		handle_toolbar_action(gobj, it, $item);
 	});
@@ -2035,6 +2080,12 @@ function handle_toolbar_action(gobj, item, $trigger) {
 		case "dropdown":
 			toggle_toolbar_dropdown(gobj, item, action, $trigger);
 			break;
+		case "link":
+			if (!(0, _yuneta_gobj_js.empty_string)(action.url)) {
+				if (action.target === "_blank") window.open(action.url, "_blank", "noopener,noreferrer");
+				else window.location.assign(action.url);
+			} else (0, _yuneta_gobj_js.log_warning)(`C_YUI_SHELL: toolbar item '${item.id || "?"}' has action.type "link" without a url`);
+			break;
 		default: (0, _yuneta_gobj_js.log_warning)(`C_YUI_SHELL: toolbar item '${item.id || "?"}' has no/unknown action.type`);
 	}
 }
@@ -23812,6 +23863,8 @@ function popup_mount_layer(gobj) {
 *          Framework Method: Create
 ***************************************************************/
 function mt_create$5(gobj) {
+	gobj.priv.reading_files = 0;
+	gobj.priv.read_serial = 0;
 	let name = (0, _yuneta_gobj_js.clean_name)((0, _yuneta_gobj_js.gobj_name)(gobj));
 	(0, _yuneta_gobj_js.gobj_write_attr)(gobj, "table_id", "table" + name);
 	(0, _yuneta_gobj_js.gobj_write_attr)(gobj, "toolbar_id", "toolbar" + name);
@@ -25060,6 +25113,7 @@ function form_may_close(gobj) {
 ************************************************************/
 function teardown_form_child(gobj) {
 	let priv = gobj.priv;
+	priv.reading_files = 0;
 	if (priv.form) {
 		if ((0, _yuneta_gobj_js.gobj_is_running)(priv.form)) (0, _yuneta_gobj_js.gobj_stop)(priv.form);
 		(0, _yuneta_gobj_js.gobj_destroy)(priv.form);
@@ -25867,6 +25921,10 @@ function ac_paste_rows(gobj, event, kw, src) {
 function ac_form_save_record(gobj, event, kw, src) {
 	if (refuse_if_readonly$2(gobj, event)) return -1;
 	let mode = (0, _yuneta_gobj_js.gobj_read_str_attr)(src, "form_mode");
+	if (priv.reading_files) {
+		(0, _yuneta_gobj_js.log_warning)(`${(0, _yuneta_gobj_js.gobj_short_name)(gobj)}: save ignored, still reading the picked files`);
+		return -1;
+	}
 	let picked = {};
 	const answer = (0, _yuneta_gobj_js.gobj_command)(src, "get_picked_files", {}, gobj);
 	if (answer && answer.result >= 0 && answer.data) picked = answer.data;
@@ -25878,6 +25936,9 @@ function ac_form_save_record(gobj, event, kw, src) {
 		}, 0);
 		return 0;
 	}
+	const serial = ++priv.read_serial;
+	priv.reading_files = serial;
+	set_form_busy(gobj, true);
 	Promise.all(cols.map((col) => {
 		return yui_file_read(picked[col]).then((read) => {
 			return {
@@ -25891,16 +25952,54 @@ function ac_form_save_record(gobj, event, kw, src) {
 			picks[r.col] = r.read;
 		});
 		(0, _yuneta_gobj_js.gobj_send_event)(gobj, "EV_FILES_READ", {
+			serial,
 			mode,
 			record: kw,
 			picks
 		}, gobj);
 	}).catch((e) => {
-		(0, _yuneta_gobj_js.gobj_send_event)(gobj, "EV_FILES_FAILED", { reason: e && e.message ? e.message : String(e) }, gobj);
+		(0, _yuneta_gobj_js.gobj_send_event)(gobj, "EV_FILES_FAILED", {
+			serial,
+			reason: e && e.message ? e.message : String(e)
+		}, gobj);
 	});
 	return 0;
 }
 /************************************************************
+*  The form's toolbar while a read is in flight: every button
+*  disabled, the save button spinning. Bulma's `is-loading` is the
+*  spinner; `disabled` is what stops the second click.
+************************************************************/
+function set_form_busy(gobj, busy) {
+	let priv = gobj.priv;
+	if (!priv.form) return;
+	const $container = (0, _yuneta_gobj_js.gobj_read_attr)(priv.form, "$container");
+	if (!$container) return;
+	$container.querySelectorAll(".yui-toolbar-form button").forEach(($b) => {
+		if (busy) {
+			$b.dataset.was_disabled = $b.disabled ? "1" : "0";
+			$b.disabled = true;
+		} else if ($b.dataset.was_disabled !== void 0) {
+			$b.disabled = $b.dataset.was_disabled === "1";
+			delete $b.dataset.was_disabled;
+		}
+	});
+	const $save = $container.querySelector(".yui-toolbar-form .button-save");
+	if ($save) $save.classList.toggle("is-loading", !!busy);
+}
+/************************************************************
+*  Is this the read the view is waiting for? A read whose form was
+*  closed (teardown zeroes the serial) or replaced lands on nobody.
+************************************************************/
+function read_is_current(gobj, kw) {
+	let priv = gobj.priv;
+	if (!priv.form || !priv.reading_files || kw.serial !== priv.reading_files) {
+		(0, _yuneta_gobj_js.log_warning)(`${(0, _yuneta_gobj_js.gobj_short_name)(gobj)}: files read for a form that is gone, dropped`);
+		return false;
+	}
+	return true;
+}
+/************************************************************
 *  The one place a write of this view leaves for the app.
 ************************************************************/
 function publish_treedb_write(gobj, mode, record, jn_files) {
@@ -25915,6 +26014,8 @@ function publish_treedb_write(gobj, mode, record, jn_files) {
 *  {mode, record, picks} -- the bytes are here now
 ************************************************************/
 function ac_files_read(gobj, event, kw, src) {
+	if (!read_is_current(gobj, kw)) return -1;
+	gobj.priv.reading_files = 0;
 	const { record, __files__ } = yui_files_manifest(kw.picks, kw.record);
 	publish_treedb_write(gobj, kw.mode, record, __files__);
 	close_form_dialog(gobj);
@@ -25927,6 +26028,9 @@ function ac_files_read(gobj, event, kw, src) {
 *  throw away what the person typed for a failure that is not theirs.
 ************************************************************/
 function ac_files_failed(gobj, event, kw, src) {
+	if (!read_is_current(gobj, kw)) return -1;
+	gobj.priv.reading_files = 0;
+	set_form_busy(gobj, false);
 	(0, _yuneta_gobj_js.log_error)(`${(0, _yuneta_gobj_js.gobj_short_name)(gobj)}: cannot read the picked file: ${kw.reason}`);
 	yui_shell_confirm_ok(yui_shell_of(gobj), "cannot read the picked file", {
 		t: i18next.t,

package/dist/gobj-ui.es.js

@@ -263,7 +263,8 @@ var TOOLBAR_ACTION_TYPES = [
 	"navigate",
 	"drawer",
 	"event",
-	"dropdown"
+	"dropdown",
+	"link"
 ];
 /************************************************************
 *  Decide which renderer to use for a toolbar item.
@@ -332,6 +333,7 @@ function validate_action(action, owner_id) {
 	}
 	if (action.type === "navigate" && !_is_non_empty_string(action.route)) warnings.push(`toolbar item '${id}' (action.type:navigate) requires 'route'`);
 	if (action.type === "event" && !_is_non_empty_string(action.event)) warnings.push(`toolbar item '${id}' (action.type:event) requires 'event' name`);
+	if (action.type === "link" && !_is_non_empty_string(action.url)) warnings.push(`toolbar item '${id}' (action.type:link) requires 'url'`);
 	if (action.type === "dropdown") {
 		let nested = validate_dropdown_action(action, id);
 		for (let w of nested) warnings.push(w);
@@ -1679,6 +1681,20 @@ function safe_id(s) {
 *      drawer   { type:"drawer",   op:"toggle"|"open"|"close", menu_id? }
 *      event    { type:"event",    event, kw? }
 *      dropdown { type:"dropdown", items[] }    (toolbar-only)
+*      link     { type:"link",     url, target? }
+*
+*  `link` leaves the application, so on a toolbar item and on the brand
+*  it is rendered as a real <a href> rather than a <button>:
+*  middle-click, open-in-new-tab and the url in the status bar are what
+*  make a link recognisable as one, and a button that assigns
+*  location.href has none of them.  It is also why it does not become
+*  an FSM event -- there is no state of this application to transition;
+*  the page is being left.  A target of "_blank" gets
+*  rel="noopener noreferrer" for free.
+*
+*  INSIDE A DROPDOWN it stays a <button>, deliberately: those rows are
+*  role="menuitemradio" in a menu, and a link is not a choice among
+*  options.  There the dispatcher navigates.
 *
 *  Per-item `show_on` is honoured: each rendered item is wrapped with
 *  the same Bulma-helper logic as zones.
@@ -1765,6 +1781,26 @@ function badge_node(value) {
 	];
 }
 /************************************************************
+*  The attributes that turn a toolbar item into a real link, or
+*  null when this item is not one.  Answering null is what keeps
+*  every caller's default (a <button> that dispatches an action)
+*  exactly as it was.
+************************************************************/
+function toolbar_link_attrs(it) {
+	let action = it && it.action || {};
+	if (action.type !== "link") return null;
+	if (empty_string(action.url)) {
+		log_warning(`C_YUI_SHELL: toolbar item '${it.id || "?"}' has action.type "link" without a url`);
+		return null;
+	}
+	let attrs = { href: action.url };
+	if (!empty_string(action.target)) {
+		attrs.target = action.target;
+		if (action.target === "_blank") attrs.rel = "noopener noreferrer";
+	}
+	return attrs;
+}
+/************************************************************
 *  Renderer for the default ("action") item kind.
 ************************************************************/
 function build_toolbar_action_item(gobj, it) {
@@ -1803,12 +1839,17 @@ function build_toolbar_action_item(gobj, it) {
 		btn_attrs.title = tip;
 		btn_attrs["data-i18n-title"] = tip;
 	}
+	let link = toolbar_link_attrs(it);
+	if (link) {
+		delete btn_attrs.type;
+		Object.assign(btn_attrs, link);
+	}
 	let $item = createElement2([
-		"button",
+		link ? "a" : "button",
 		btn_attrs,
 		children
 	]);
-	$item.addEventListener("click", (ev) => {
+	if (!link) $item.addEventListener("click", (ev) => {
 		ev.preventDefault();
 		handle_toolbar_action(gobj, it, $item);
 	});
@@ -1840,7 +1881,11 @@ function build_toolbar_brand_item(gobj, it) {
 		attrs["aria-haspopup"] = "menu";
 		attrs["aria-expanded"] = "false";
 	}
-	if (action_type === "") tag = "div";
+	let link = toolbar_link_attrs(it);
+	if (link) {
+		tag = "a";
+		Object.assign(attrs, link);
+	} else if (action_type === "") tag = "div";
 	else attrs.type = "button";
 	let $item = createElement2([
 		tag,
@@ -1858,7 +1903,7 @@ function build_toolbar_brand_item(gobj, it) {
 			it.wordmark
 		]]
 	]);
-	if (action_type !== "") $item.addEventListener("click", (ev) => {
+	if (action_type !== "" && !link) $item.addEventListener("click", (ev) => {
 		ev.preventDefault();
 		handle_toolbar_action(gobj, it, $item);
 	});
@@ -2030,6 +2075,12 @@ function handle_toolbar_action(gobj, item, $trigger) {
 		case "dropdown":
 			toggle_toolbar_dropdown(gobj, item, action, $trigger);
 			break;
+		case "link":
+			if (!empty_string(action.url)) {
+				if (action.target === "_blank") window.open(action.url, "_blank", "noopener,noreferrer");
+				else window.location.assign(action.url);
+			} else log_warning(`C_YUI_SHELL: toolbar item '${item.id || "?"}' has action.type "link" without a url`);
+			break;
 		default: log_warning(`C_YUI_SHELL: toolbar item '${item.id || "?"}' has no/unknown action.type`);
 	}
 }
@@ -23807,6 +23858,8 @@ function popup_mount_layer(gobj) {
 *          Framework Method: Create
 ***************************************************************/
 function mt_create$5(gobj) {
+	gobj.priv.reading_files = 0;
+	gobj.priv.read_serial = 0;
 	let name = clean_name(gobj_name(gobj));
 	gobj_write_attr(gobj, "table_id", "table" + name);
 	gobj_write_attr(gobj, "toolbar_id", "toolbar" + name);
@@ -25055,6 +25108,7 @@ function form_may_close(gobj) {
 ************************************************************/
 function teardown_form_child(gobj) {
 	let priv = gobj.priv;
+	priv.reading_files = 0;
 	if (priv.form) {
 		if (gobj_is_running(priv.form)) gobj_stop(priv.form);
 		gobj_destroy(priv.form);
@@ -25862,6 +25916,10 @@ function ac_paste_rows(gobj, event, kw, src) {
 function ac_form_save_record(gobj, event, kw, src) {
 	if (refuse_if_readonly$2(gobj, event)) return -1;
 	let mode = gobj_read_str_attr(src, "form_mode");
+	if (priv.reading_files) {
+		log_warning(`${gobj_short_name(gobj)}: save ignored, still reading the picked files`);
+		return -1;
+	}
 	let picked = {};
 	const answer = gobj_command(src, "get_picked_files", {}, gobj);
 	if (answer && answer.result >= 0 && answer.data) picked = answer.data;
@@ -25873,6 +25931,9 @@ function ac_form_save_record(gobj, event, kw, src) {
 		}, 0);
 		return 0;
 	}
+	const serial = ++priv.read_serial;
+	priv.reading_files = serial;
+	set_form_busy(gobj, true);
 	Promise.all(cols.map((col) => {
 		return yui_file_read(picked[col]).then((read) => {
 			return {
@@ -25886,16 +25947,54 @@ function ac_form_save_record(gobj, event, kw, src) {
 			picks[r.col] = r.read;
 		});
 		gobj_send_event(gobj, "EV_FILES_READ", {
+			serial,
 			mode,
 			record: kw,
 			picks
 		}, gobj);
 	}).catch((e) => {
-		gobj_send_event(gobj, "EV_FILES_FAILED", { reason: e && e.message ? e.message : String(e) }, gobj);
+		gobj_send_event(gobj, "EV_FILES_FAILED", {
+			serial,
+			reason: e && e.message ? e.message : String(e)
+		}, gobj);
 	});
 	return 0;
 }
 /************************************************************
+*  The form's toolbar while a read is in flight: every button
+*  disabled, the save button spinning. Bulma's `is-loading` is the
+*  spinner; `disabled` is what stops the second click.
+************************************************************/
+function set_form_busy(gobj, busy) {
+	let priv = gobj.priv;
+	if (!priv.form) return;
+	const $container = gobj_read_attr(priv.form, "$container");
+	if (!$container) return;
+	$container.querySelectorAll(".yui-toolbar-form button").forEach(($b) => {
+		if (busy) {
+			$b.dataset.was_disabled = $b.disabled ? "1" : "0";
+			$b.disabled = true;
+		} else if ($b.dataset.was_disabled !== void 0) {
+			$b.disabled = $b.dataset.was_disabled === "1";
+			delete $b.dataset.was_disabled;
+		}
+	});
+	const $save = $container.querySelector(".yui-toolbar-form .button-save");
+	if ($save) $save.classList.toggle("is-loading", !!busy);
+}
+/************************************************************
+*  Is this the read the view is waiting for? A read whose form was
+*  closed (teardown zeroes the serial) or replaced lands on nobody.
+************************************************************/
+function read_is_current(gobj, kw) {
+	let priv = gobj.priv;
+	if (!priv.form || !priv.reading_files || kw.serial !== priv.reading_files) {
+		log_warning(`${gobj_short_name(gobj)}: files read for a form that is gone, dropped`);
+		return false;
+	}
+	return true;
+}
+/************************************************************
 *  The one place a write of this view leaves for the app.
 ************************************************************/
 function publish_treedb_write(gobj, mode, record, jn_files) {
@@ -25910,6 +26009,8 @@ function publish_treedb_write(gobj, mode, record, jn_files) {
 *  {mode, record, picks} -- the bytes are here now
 ************************************************************/
 function ac_files_read(gobj, event, kw, src) {
+	if (!read_is_current(gobj, kw)) return -1;
+	gobj.priv.reading_files = 0;
 	const { record, __files__ } = yui_files_manifest(kw.picks, kw.record);
 	publish_treedb_write(gobj, kw.mode, record, __files__);
 	close_form_dialog(gobj);
@@ -25922,6 +26023,9 @@ function ac_files_read(gobj, event, kw, src) {
 *  throw away what the person typed for a failure that is not theirs.
 ************************************************************/
 function ac_files_failed(gobj, event, kw, src) {
+	if (!read_is_current(gobj, kw)) return -1;
+	gobj.priv.reading_files = 0;
+	set_form_busy(gobj, false);
 	log_error(`${gobj_short_name(gobj)}: cannot read the picked file: ${kw.reason}`);
 	yui_shell_confirm_ok(yui_shell_of(gobj), "cannot read the picked file", {
 		t,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@yuneta/gobj-ui",
-  "version": "7.23.63",
+  "version": "7.23.65",
   "type": "module",
   "main": "dist/gobj-ui.cjs.js",
   "module": "dist/gobj-ui.es.js",

package/src/c_yui_shell.js

@@ -1586,6 +1586,20 @@ function safe_id(s)
  *      drawer   { type:"drawer",   op:"toggle"|"open"|"close", menu_id? }
  *      event    { type:"event",    event, kw? }
  *      dropdown { type:"dropdown", items[] }    (toolbar-only)
+ *      link     { type:"link",     url, target? }
+ *
+ *  `link` leaves the application, so on a toolbar item and on the brand
+ *  it is rendered as a real <a href> rather than a <button>:
+ *  middle-click, open-in-new-tab and the url in the status bar are what
+ *  make a link recognisable as one, and a button that assigns
+ *  location.href has none of them.  It is also why it does not become
+ *  an FSM event -- there is no state of this application to transition;
+ *  the page is being left.  A target of "_blank" gets
+ *  rel="noopener noreferrer" for free.
+ *
+ *  INSIDE A DROPDOWN it stays a <button>, deliberately: those rows are
+ *  role="menuitemradio" in a menu, and a link is not a choice among
+ *  options.  There the dispatcher navigates.
  *
  *  Per-item `show_on` is honoured: each rendered item is wrapped with
  *  the same Bulma-helper logic as zones.
@@ -1703,6 +1717,35 @@ function badge_node(value)
     return ["span", attrs, text];
 }
 
+/************************************************************
+ *  The attributes that turn a toolbar item into a real link, or
+ *  null when this item is not one.  Answering null is what keeps
+ *  every caller's default (a <button> that dispatches an action)
+ *  exactly as it was.
+ ************************************************************/
+function toolbar_link_attrs(it)
+{
+    let action = (it && it.action) || {};
+    if(action.type !== "link") {
+        return null;
+    }
+    if(empty_string(action.url)) {
+        log_warning(
+            `C_YUI_SHELL: toolbar item '${it.id||"?"}' has action.type "link" ` +
+            `without a url`
+        );
+        return null;
+    }
+    let attrs = {href: action.url};
+    if(!empty_string(action.target)) {
+        attrs.target = action.target;
+        if(action.target === "_blank") {
+            attrs.rel = "noopener noreferrer";
+        }
+    }
+    return attrs;
+}
+
 /************************************************************
  *  Renderer for the default ("action") item kind.
  ************************************************************/
@@ -1751,13 +1794,20 @@ function build_toolbar_action_item(gobj, it)
         btn_attrs.title = tip;
         btn_attrs["data-i18n-title"] = tip;
     }
+    let link = toolbar_link_attrs(it);
+    if(link) {
+        delete btn_attrs.type;      /*  meaningless, and invalid, on an <a>  */
+        Object.assign(btn_attrs, link);
+    }
     let $item = createElement2(
-        ["button", btn_attrs, children]
+        [link? "a": "button", btn_attrs, children]
     );
-    $item.addEventListener("click", ev => {
-        ev.preventDefault();
-        handle_toolbar_action(gobj, it, $item);
-    });
+    if(!link) {
+        $item.addEventListener("click", ev => {
+            ev.preventDefault();
+            handle_toolbar_action(gobj, it, $item);
+        });
+    }
     attach_context_action(gobj, $item, it);
     return $item;
 }
@@ -1793,7 +1843,11 @@ function build_toolbar_brand_item(gobj, it)
         attrs["aria-haspopup"] = "menu";
         attrs["aria-expanded"] = "false";
     }
-    if(action_type === "") {
+    let link = toolbar_link_attrs(it);
+    if(link) {
+        tag = "a";
+        Object.assign(attrs, link);
+    } else if(action_type === "") {
         /*  Passive brand: no action — render a div so it is not
          *  keyboard-focused and screen readers don't announce a
          *  pressable control. */
@@ -1807,7 +1861,7 @@ function build_toolbar_brand_item(gobj, it)
         ["span", {class: "yui-toolbar-brand-wordmark", i18n: it.wordmark},
             it.wordmark]
     ]]);
-    if(action_type !== "") {
+    if(action_type !== "" && !link) {
         $item.addEventListener("click", ev => {
             ev.preventDefault();
             handle_toolbar_action(gobj, it, $item);
@@ -2032,6 +2086,23 @@ function handle_toolbar_action(gobj, item, $trigger)
         case "dropdown":
             toggle_toolbar_dropdown(gobj, item, action, $trigger);
             break;
+        case "link":
+            /*  Reached only from the renderers that stay buttons (avatar,
+             *  and the entries inside a dropdown panel). The anchor
+             *  renderers never come through here. */
+            if(!empty_string(action.url)) {
+                if(action.target === "_blank") {
+                    window.open(action.url, "_blank", "noopener,noreferrer");
+                } else {
+                    window.location.assign(action.url);
+                }
+            } else {
+                log_warning(
+                    `C_YUI_SHELL: toolbar item '${item.id||"?"}' has action.type ` +
+                    `"link" without a url`
+                );
+            }
+            break;
         default:
             log_warning(
                 `C_YUI_SHELL: toolbar item '${item.id||"?"}' has no/unknown action.type`

package/src/c_yui_treedb_topic_with_form.js

@@ -394,6 +394,12 @@ function popup_mount_layer(gobj)
  ***************************************************************/
 function mt_create(gobj)
 {
+    /*  0 = not reading; otherwise the serial of the read in flight. A
+     *  serial and not a flag, so that a read whose form was closed and
+     *  reopened cannot land on the new form.  */
+    gobj.priv.reading_files = 0;
+    gobj.priv.read_serial = 0;
+
     let name = clean_name(gobj_name(gobj));
     gobj_write_attr(gobj, "table_id", "table" + name);
     gobj_write_attr(gobj, "toolbar_id", "toolbar" + name);
@@ -2219,6 +2225,7 @@ function form_may_close(gobj)
 function teardown_form_child(gobj)
 {
     let priv = gobj.priv;
+    priv.reading_files = 0;     // a read in flight lands on nobody
     if(priv.form) {
         if(gobj_is_running(priv.form)) {
             gobj_stop(priv.form);
@@ -3484,6 +3491,13 @@ function ac_form_save_record(gobj, event, kw, src)
      *  files never came with the record: the form KEPT them and this is
      *  where they are asked for. Nothing picked is the ordinary case.
      *------------------------------------------------------*/
+    if(priv.reading_files) {
+        /*  The toolbar is disabled while a read is in flight, so this is
+         *  a keyboard shortcut or a script: said, and not a second write.  */
+        log_warning(`${gobj_short_name(gobj)}: save ignored, still reading the picked files`);
+        return -1;
+    }
+
     let picked = {};
     const answer = gobj_command(src, "get_picked_files", {}, gobj);
     if(answer && answer.result >= 0 && answer.data) {
@@ -3508,8 +3522,16 @@ function ac_form_save_record(gobj, event, kw, src)
      *  notification: it enters the machine as an EVENT, never as a
      *  chain of callbacks that the trace cannot see. The dialog stays
      *  open until it lands, which is what tells the person that 40 MB
-     *  are still going up.
+     *  are still going up -- and stays open BUSY: its toolbar is
+     *  disabled and the save button spins, because a second Save
+     *  during the read was a second write, and a Cancel was a save
+     *  lost without a word. The serial travels with the read: a read
+     *  whose form was closed meanwhile lands on nobody (ac_files_read).
      *------------------------------------------------------*/
+    const serial = ++priv.read_serial;
+    priv.reading_files = serial;
+    set_form_busy(gobj, true);
+
     Promise.all(cols.map((col) => {
         return yui_file_read(picked[col]).then((read) => {
             return {col: col, read: read};
@@ -3520,17 +3542,61 @@ function ac_form_save_record(gobj, event, kw, src)
             picks[r.col] = r.read;
         });
         gobj_send_event(gobj, "EV_FILES_READ",
-            {mode: mode, record: kw, picks: picks}, gobj
+            {serial: serial, mode: mode, record: kw, picks: picks}, gobj
         );
     }).catch((e) => {
         gobj_send_event(gobj, "EV_FILES_FAILED",
-            {reason: (e && e.message)? e.message: String(e)}, gobj
+            {serial: serial, reason: (e && e.message)? e.message: String(e)}, gobj
         );
     });
 
     return 0;
 }
 
+/************************************************************
+ *  The form's toolbar while a read is in flight: every button
+ *  disabled, the save button spinning. Bulma's `is-loading` is the
+ *  spinner; `disabled` is what stops the second click.
+ ************************************************************/
+function set_form_busy(gobj, busy)
+{
+    let priv = gobj.priv;
+    if(!priv.form) {
+        return;
+    }
+    const $container = gobj_read_attr(priv.form, "$container");
+    if(!$container) {
+        return;
+    }
+    $container.querySelectorAll('.yui-toolbar-form button').forEach(($b) => {
+        if(busy) {
+            $b.dataset.was_disabled = $b.disabled? "1": "0";
+            $b.disabled = true;
+        } else if($b.dataset.was_disabled !== undefined) {
+            $b.disabled = ($b.dataset.was_disabled === "1");
+            delete $b.dataset.was_disabled;
+        }
+    });
+    const $save = $container.querySelector('.yui-toolbar-form .button-save');
+    if($save) {
+        $save.classList.toggle('is-loading', !!busy);
+    }
+}
+
+/************************************************************
+ *  Is this the read the view is waiting for? A read whose form was
+ *  closed (teardown zeroes the serial) or replaced lands on nobody.
+ ************************************************************/
+function read_is_current(gobj, kw)
+{
+    let priv = gobj.priv;
+    if(!priv.form || !priv.reading_files || kw.serial !== priv.reading_files) {
+        log_warning(`${gobj_short_name(gobj)}: files read for a form that is gone, dropped`);
+        return false;
+    }
+    return true;
+}
+
 /************************************************************
  *  The one place a write of this view leaves for the app.
  ************************************************************/
@@ -3557,6 +3623,10 @@ function publish_treedb_write(gobj, mode, record, jn_files)
  ************************************************************/
 function ac_files_read(gobj, event, kw, src)
 {
+    if(!read_is_current(gobj, kw)) {
+        return -1;      /*  Warning already logged  */
+    }
+    gobj.priv.reading_files = 0;
     const {record, __files__} = yui_files_manifest(kw.picks, kw.record);
     publish_treedb_write(gobj, kw.mode, record, __files__);
     close_form_dialog(gobj);
@@ -3571,6 +3641,11 @@ function ac_files_read(gobj, event, kw, src)
  ************************************************************/
 function ac_files_failed(gobj, event, kw, src)
 {
+    if(!read_is_current(gobj, kw)) {
+        return -1;      /*  Warning already logged  */
+    }
+    gobj.priv.reading_files = 0;
+    set_form_busy(gobj, false);
     log_error(`${gobj_short_name(gobj)}: cannot read the picked file: ${kw.reason}`);
     /*  An i18n KEY, not a sentence: the dialog renders it with `i18n`, so
      *  a sentence here would be a key nobody defined and would render as

package/src/shell_toolbar_helpers.js

@@ -19,14 +19,19 @@
  *                      triggers an action.type on click
  *
  *      Action types accepted on a toolbar item or on a dropdown sub-item:
- *          "navigate" | "drawer" | "event" | "dropdown"
+ *          "navigate" | "drawer" | "event" | "dropdown" | "link"
+ *
+ *      "link" is the one that leaves the application, and the one item
+ *      rendered as a real <a href> rather than a <button>.
  *
  *          Copyright (c) 2026, ArtGins.
  *          All Rights Reserved.
  ***********************************************************************/
 
 export const TOOLBAR_ITEM_KINDS = ["brand", "avatar", "connection", "action"];
-export const TOOLBAR_ACTION_TYPES = ["navigate", "drawer", "event", "dropdown"];
+export const TOOLBAR_ACTION_TYPES = [
+    "navigate", "drawer", "event", "dropdown", "link"
+];
 
 
 /************************************************************
@@ -141,6 +146,11 @@ export function validate_action(action, owner_id)
             `toolbar item '${id}' (action.type:event) requires 'event' name`
         );
     }
+    if(action.type === "link" && !_is_non_empty_string(action.url)) {
+        warnings.push(
+            `toolbar item '${id}' (action.type:link) requires 'url'`
+        );
+    }
     if(action.type === "dropdown") {
         let nested = validate_dropdown_action(action, id);
         for(let w of nested) {

package/src/shell_toolbar_helpers.test.js

@@ -203,7 +203,9 @@ test("dropdown: invalid sub-action surfaces underlying warning", () => {
  *============================================================*/
 test("kinds + action-type constants are exposed", () => {
     expect(TOOLBAR_ITEM_KINDS).toEqual(["brand", "avatar", "connection", "action"]);
-    expect(TOOLBAR_ACTION_TYPES).toEqual(["navigate", "drawer", "event", "dropdown"]);
+    expect(TOOLBAR_ACTION_TYPES).toEqual(
+        ["navigate", "drawer", "event", "dropdown", "link"]
+    );
 });
 
 
@@ -246,3 +248,55 @@ test("dropdown: non-boolean 'selected' warns", () => {
     expect(r.length).toBe(1);
     expect(r[0]).toContain("non-boolean");
 });
+
+
+/*============================================================
+ *      validate_action — link
+ *
+ *  The action that LEAVES the application. It is the only one
+ *  rendered as an <a href>, so the url is not an optional extra:
+ *  without it there is no link, only a dead control.
+ *============================================================*/
+test("validate link: ok with a url", () => {
+    let r = validate_toolbar_item({
+        id: "landing", icon: "yi-arrow-left", name: "yuneta.io",
+        action: { type: "link", url: "https://yuneta.io/" }
+    });
+    expect(r.ok).toBe(true);
+    expect(r.warnings).toEqual([]);
+});
+
+test("validate link: a target is optional", () => {
+    let r = validate_toolbar_item({
+        id: "docs",
+        action: { type: "link", url: "https://doc.yuneta.io/", target: "_blank" }
+    });
+    expect(r.ok).toBe(true);
+});
+
+test("validate link: missing url flags warning", () => {
+    let r = validate_toolbar_item({
+        id: "landing", action: { type: "link" }
+    });
+    expect(r.ok).toBe(false);
+    expect(r.warnings.join("\n")).toMatch(/requires 'url'/);
+});
+
+test("validate link: empty url counts as missing", () => {
+    let r = validate_toolbar_item({
+        id: "landing", action: { type: "link", url: "   " }
+    });
+    expect(r.ok).toBe(false);
+    expect(r.warnings.join("\n")).toMatch(/requires 'url'/);
+});
+
+test("validate link: accepted inside a dropdown too", () => {
+    let r = validate_dropdown_action({
+        type: "dropdown",
+        items: [
+            { id: "site", name: "yuneta.io",
+              action: { type: "link", url: "https://yuneta.io/" } },
+        ],
+    }, "help");
+    expect(r).toEqual([]);
+});