@yuneta/gobj-ui 7.23.161 → 7.23.162

package/dist/gobj-ui.es.js

@@ -1,5 +1,5 @@
 import * as gobj_js from "@yuneta/gobj-js";
-import { SDATA, SDATA_END, clean_name, createElement2, createOneHtml, create_template_record, data_type_t, debounce, delete_from_list, duplicate_objects, empty_json, empty_string, escapeHtml, event_flag_t, flat_diff, gclass_create, gclass_find_by_name, gclass_flag_t, getPositionRelativeToBody, gobj_bottom_gobj, gobj_change_state, gobj_command, gobj_create, gobj_create_pure_child, gobj_create_service, gobj_current_state, gobj_destroy, gobj_find_child, gobj_find_service, gobj_full_name, gobj_gclass_name, gobj_is_destroying, gobj_is_playing, gobj_is_pure_child, gobj_is_running, gobj_is_service, gobj_is_volatil, gobj_match_children, gobj_name, gobj_parent, gobj_post_event, gobj_publish_event, gobj_read_attr, gobj_read_bool_attr, gobj_read_integer_attr, gobj_read_pointer_attr, gobj_read_str_attr, gobj_save_persistent_attrs, gobj_send_event, gobj_set_trace_machine_format, gobj_short_name, gobj_start, gobj_start_tree, gobj_stop, gobj_stop_children, gobj_subscribe_event, gobj_unsubscribe_event, gobj_write_attr, gobj_write_bool_attr, gobj_write_integer_attr, gobj_write_str_attr, gobj_yuno, gobj_yuno_name, is_array, is_boolean, is_date, is_gobj, is_null, is_number, is_object, is_string, json2flat, json_deep_copy, json_object_size, json_object_update, json_object_update_missing, json_size, kw_clone_by_keys, kw_flag_t, kw_get_dict, kw_get_dict_value, kw_get_int, kw_get_local_storage_value, kw_get_str, kw_has_key, kw_set_dict_value, kw_set_local_storage_value, kwid_find_one_record, kwid_get_ids, kwid_new_dict, log_error, log_warning, msg_iev_get_stack, parseBoolean, parseSVG, refresh_language, safeSrc, sdata_flag_t, set_console_log_enabled, set_log_callback, sprintf, str_in_list, template_get_field_desc, trace_msg, treedb_decoder_fkey, treedb_encoder_fkey, treedb_get_field_desc, treedb_hook_data_size } from "@yuneta/gobj-js";
+import { SDATA, SDATA_END, clean_name, createElement2, createOneHtml, create_template_record, data_type_t, debounce, delete_from_list, duplicate_objects, empty_json, empty_string, escapeHtml, event_flag_t, flat_diff, gclass_create, gclass_find_by_name, gclass_flag_t, getPositionRelativeToBody, gobj_bottom_gobj, gobj_change_state, gobj_command, gobj_create, gobj_create_pure_child, gobj_create_service, gobj_current_state, gobj_destroy, gobj_find_child, gobj_find_service, gobj_full_name, gobj_gclass_name, gobj_is_destroying, gobj_is_playing, gobj_is_pure_child, gobj_is_running, gobj_is_service, gobj_is_volatil, gobj_match_children, gobj_name, gobj_parent, gobj_post_event, gobj_publish_event, gobj_read_attr, gobj_read_bool_attr, gobj_read_integer_attr, gobj_read_pointer_attr, gobj_read_str_attr, gobj_save_persistent_attrs, gobj_send_event, gobj_set_trace_machine_format, gobj_short_name, gobj_start, gobj_start_tree, gobj_stop, gobj_stop_children, gobj_subscribe_event, gobj_unsubscribe_event, gobj_write_attr, gobj_write_bool_attr, gobj_write_integer_attr, gobj_write_str_attr, gobj_yuno, gobj_yuno_name, is_array, is_boolean, is_date, is_gobj, is_null, is_number, is_object, is_string, json2flat, json_deep_copy, json_object_size, json_object_update, json_object_update_missing, json_size, kw_clone_by_keys, kw_flag_t, kw_get_dict, kw_get_dict_value, kw_get_int, kw_get_local_storage_value, kw_get_str, kw_has_key, kw_set_dict_value, kw_set_local_storage_value, kwid_find_one_record, kwid_new_dict, log_error, log_warning, msg_iev_get_stack, parseBoolean, parseSVG, refresh_language, safeSrc, sdata_flag_t, set_console_log_enabled, set_log_callback, sprintf, str_in_list, template_get_field_desc, trace_msg, treedb_decoder_fkey, treedb_encoder_fkey, treedb_get_field_desc, treedb_hook_data_size } from "@yuneta/gobj-js";
 import i18next, { t } from "i18next";
 import TomSelect from "tom-select";
 import { createJSONEditor } from "vanilla-jsoneditor";
@@ -24678,6 +24678,36 @@ function ac_request_page(gobj, event, kw, src) {
 	return 0;
 }
 /********************************************
+*  Event from formtable: open the records a hook of one row links --
+*  the CHILD topic's table, filtered to the rows whose fkey names that
+*  row. A hook is the question "which records hang from this one", and
+*  the child's table is where that answer can be read: it pages, it
+*  searches, it opens a record and it exports -- which a list of ids in
+*  a popup could not do past a few dozen of them.
+*  {
+*      topic_name:     the child topic
+*      fkey:           its fkey column that points back
+*      parent_topic:   the topic of the row the hook is on
+*      parent_id:      that row's id
+*      hook:           the hook column
+*  }
+********************************************/
+function ac_open_linked(gobj, event, kw, src) {
+	let child = get_gobj_formtable(gobj, kw.topic_name);
+	if (!child) {
+		log_error(`${gobj_short_name(gobj)}: cannot open '${kw.topic_name}', linked from '${kw.parent_topic}^${kw.parent_id}': that topic is not in this view`);
+		return -1;
+	}
+	select_topic_by_id(gobj, gobj_name(child));
+	gobj_send_event(child, "EV_FILTER_BY_PARENT", {
+		fkey: kw.fkey,
+		parent_topic: kw.parent_topic,
+		parent_id: kw.parent_id,
+		hook: kw.hook
+	}, gobj);
+	return 0;
+}
+/********************************************
 *  Event from formtable: the bytes of one asset a `file` column names,
 *  for the form's preview or the table's file popup.
 *
@@ -24910,6 +24940,11 @@ function create_gclass$6(gclass_name) {
 			ac_request_asset,
 			null
 		],
+		[
+			"EV_OPEN_LINKED",
+			ac_open_linked,
+			null
+		],
 		[
 			"EV_DELETE_RECORD",
 			ac_delete_record,
@@ -24991,6 +25026,7 @@ function create_gclass$6(gclass_name) {
 		["EV_UPDATE_FIELD", 0],
 		["EV_REQUEST_PAGE", 0],
 		["EV_REQUEST_ASSET", 0],
+		["EV_OPEN_LINKED", 0],
 		["EV_DELETE_RECORD", 0],
 		["EV_RECORD_WRITTEN", event_flag_t.EVF_OUTPUT_EVENT | event_flag_t.EVF_NO_WARN_SUBS],
 		["EV_REFRESH_TOPIC", 0],
@@ -25655,6 +25691,7 @@ function plan_treedb_writes(flags) {
 *  How many things a hook/fkey value holds.
 ***************************************************************/
 function ref_count(value) {
+	if (Array.isArray(value) && value.length === 1 && value[0] && typeof value[0] === "object" && typeof value[0].size === "number") return value[0].size;
 	if (Array.isArray(value)) return value.length;
 	if (value && typeof value === "object") return Object.keys(value).length;
 	if (typeof value === "string" && value.length > 0) return 1;
@@ -25801,7 +25838,11 @@ var PRIVATE_DATA$5 = {
 	cell_file_modal: null,
 	cell_file_win: null,
 	_pending_assets: null,
-	_asset_seq: 0
+	_asset_seq: 0,
+	parent_filter: null,
+	search_term: "",
+	$parent_filter: null,
+	hook_choice_modal: null
 };
 var __gclass__$5 = null;
 function is_mobile$1() {
@@ -25935,6 +25976,7 @@ function mt_stop$5(gobj) {
 	close_schema_dialog(gobj);
 	close_cell_json_dialog(gobj);
 	close_cell_file_dialog(gobj);
+	close_hook_choice(gobj);
 	drop_pending_assets(gobj);
 	table__destroy(gobj);
 }
@@ -25946,6 +25988,7 @@ function mt_destroy$5(gobj) {
 	close_schema_dialog(gobj);
 	close_cell_json_dialog(gobj);
 	close_cell_file_dialog(gobj);
+	close_hook_choice(gobj);
 	drop_pending_assets(gobj);
 	destroy_ui$2(gobj);
 }
@@ -26305,6 +26348,50 @@ function build_ui$5(gobj) {
 		bar.$el.style.flex = "none";
 		$container.insertBefore(bar.$el, $container.querySelector(`#${table_id}`));
 	}
+	let $parent_filter = createElement2([
+		"div",
+		{
+			class: "TREEDB_PARENT_FILTER is-hidden",
+			style: "flex:none;"
+		},
+		[
+			[
+				"span",
+				{
+					class: "PARENT_FILTER_LABEL",
+					i18n: "filtered by"
+				},
+				"filtered by"
+			],
+			[
+				"span",
+				{ class: "PARENT_FILTER_TOPIC" },
+				""
+			],
+			[
+				"strong",
+				{ class: "PARENT_FILTER_ID" },
+				""
+			],
+			[
+				"button",
+				{
+					class: "delete PARENT_FILTER_CLEAR",
+					type: "button",
+					title: t("clear filter"),
+					"data-i18n-title": "clear filter",
+					"aria-label": t("clear filter"),
+					"data-i18n-aria-label": "clear filter"
+				},
+				[],
+				{ click: () => {
+					gobj_send_event(gobj, "EV_CLEAR_PARENT_FILTER", {}, gobj);
+				} }
+			]
+		]
+	]);
+	gobj.priv.$parent_filter = $parent_filter;
+	$container.insertBefore($parent_filter, $container.querySelector(`#${table_id}`));
 	let $toolbar_slot = $container.querySelector(".toolbar_tabulator_table");
 	if ($table_toolbar instanceof Element) $toolbar_slot.appendChild($table_toolbar);
 	else $toolbar_slot.appendChild(createElement2(["div", {}]));
@@ -26797,6 +26884,7 @@ function create_tabulator(gobj) {
 		yui_tabulator_name_filters(tabulator, t);
 		yui_tabulator_name_row_selects(tabulator, t);
 		tabulator._ready = true;
+		apply_row_filters(gobj);
 		update_rowcount();
 		yui_table_filter_clear(tabulator);
 		if (tabulator._pendingData !== void 0) {
@@ -27004,15 +27092,18 @@ function transform__treedb_value_2_table_value(gobj, col, value, row, field) {
 			break;
 		case "hook":
 			let items = treedb_hook_data_size(value);
-			if (items > 0) value = [
-				"<a class=\"hook_cell\" ",
-				`data-row_id="${row.id}" `,
-				`data-col_id="${col.id}" > `,
-				"<span style=\"\" class=\"icon yi-eye\"></span>",
-				`<span>[&nbsp;<u>${items}</u>&nbsp;]</span>`,
-				"</a>"
-			].join("");
-			else value = "";
+			if (items > 0) {
+				let hook_title = String(t("show linked records")).replace(/&/g, "&amp;").replace(/"/g, "&quot;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+				value = [
+					"<a class=\"hook_cell\" ",
+					`title="${hook_title}" aria-label="${hook_title}" `,
+					`data-row_id="${row.id}" `,
+					`data-col_id="${col.id}" > `,
+					"<span style=\"\" class=\"icon yi-eye\"></span>",
+					`<span>[&nbsp;<u>${items}</u>&nbsp;]</span>`,
+					"</a>"
+				].join("");
+			} else value = "";
 			break;
 		case "file":
 		case "fkey":
@@ -27647,6 +27738,153 @@ function close_cell_file_dialog(gobj) {
 	teardown_cell_file(gobj);
 }
 /************************************************************
+*  Ask the host to open the rows of `topic_name` whose `fkey`
+*  names this row -- what a hook of this row links.
+************************************************************/
+function publish_open_linked(gobj, topic_name, fkey, parent_id, hook) {
+	gobj_publish_event(gobj, "EV_OPEN_LINKED", {
+		topic_name,
+		fkey,
+		parent_topic: gobj_read_str_attr(gobj, "topic_name"),
+		parent_id,
+		hook
+	});
+}
+/************************************************************
+*  "Which child topic?" -- for a hook whose children live in
+*  more than one. The standardized dialog, so Escape, Back and
+*  a click outside close it like every other one.
+************************************************************/
+function open_hook_choice_dialog(gobj, targets, parent_id, hook) {
+	close_hook_choice(gobj);
+	let priv = gobj.priv;
+	let shell = yui_shell_of(gobj);
+	if (!shell) {
+		log_error(`${gobj_short_name(gobj)}: no shell, cannot ask which topic to open`);
+		return;
+	}
+	priv.hook_choice_modal = yui_shell_show_modal(shell, createElement2([
+		"div",
+		{ class: "TREEDB_HOOK_CHOICE" },
+		targets.map((tg) => {
+			return [
+				"button",
+				{
+					class: "button HOOK_CHOICE_TOPIC",
+					type: "button",
+					title: t(tg.topic_name),
+					"data-i18n-title": tg.topic_name,
+					"aria-label": t(tg.topic_name),
+					"data-i18n-aria-label": tg.topic_name
+				},
+				[[
+					"span",
+					{ i18n: tg.topic_name },
+					tg.topic_name
+				]],
+				{ click: () => {
+					gobj_send_event(gobj, "EV_CHOOSE_LINKED", {
+						topic_name: tg.topic_name,
+						fkey: tg.fkey,
+						parent_id,
+						hook
+					}, gobj);
+				} }
+			];
+		})
+	]), {
+		dialog: true,
+		logical_class: "TREEDB_HOOK_CHOICE_SHEET",
+		title: "choose a topic",
+		t,
+		on_close: function() {
+			priv.hook_choice_modal = null;
+		}
+	});
+}
+/************************************************************
+*  Close "which child topic?" if it is open.
+************************************************************/
+function close_hook_choice(gobj) {
+	let priv = gobj.priv;
+	if (priv.hook_choice_modal) {
+		let modal = priv.hook_choice_modal;
+		priv.hook_choice_modal = null;
+		modal.close();
+	}
+}
+/************************************************************
+*  Does this row's `pf.fkey` name the parent record? The fkey
+*  arrives as one ref, a list of them or a dict keyed by ref,
+*  each in any of the shapes treedb_decoder_fkey() reads. The
+*  topic and the hook are compared when the ref carries them:
+*  one row can hang from the same parent through two hooks.
+************************************************************/
+function row_links_to(gobj, data, pf) {
+	let col = get_schema_col(gobj, pf.fkey);
+	let v = data ? data[pf.fkey] : null;
+	if (!col || v === null || v === void 0 || v === "") return false;
+	let refs;
+	if (is_array(v)) refs = v;
+	else if (is_object(v) && v.id === void 0) refs = Object.keys(v);
+	else refs = [v];
+	for (let ref of refs) {
+		if (ref === null || ref === void 0 || ref === "") continue;
+		let fk = treedb_decoder_fkey(col, ref);
+		if (!fk || String(fk.id) !== pf.parent_id) continue;
+		if (fk.topic_name && pf.parent_topic && fk.topic_name !== pf.parent_topic) continue;
+		if (fk.hook_name && pf.hook && fk.hook_name !== pf.hook) continue;
+		return true;
+	}
+	return false;
+}
+/************************************************************
+*  The ONE programmatic filter of the table: the parent filter
+*  AND the search term. Kept as state and applied here, because
+*  Tabulator's setFilter() replaces every programmatic filter.
+*  Before `tableBuilt` the state waits; tableBuilt applies it.
+************************************************************/
+function apply_row_filters(gobj) {
+	let priv = gobj.priv;
+	let tabulator = gobj_read_attr(gobj, "tabulator");
+	if (!tabulator) {
+		log_error(`${gobj_short_name(gobj)}: no table to filter`);
+		return;
+	}
+	if (!tabulator._ready) return;
+	let term = priv.search_term || "";
+	let pf = priv.parent_filter;
+	if (!term && !pf) {
+		tabulator.clearFilter();
+		return;
+	}
+	tabulator.setFilter(function(data) {
+		if (pf && !row_links_to(gobj, data, pf)) return false;
+		return !term || row_matches(data, term);
+	});
+}
+/************************************************************
+*  Show or hide the chip that says the parent filter is on.
+************************************************************/
+function render_parent_filter(gobj) {
+	let priv = gobj.priv;
+	let $chip = priv.$parent_filter;
+	if (!$chip) {
+		log_error(`${gobj_short_name(gobj)}: no parent-filter chip to paint`);
+		return;
+	}
+	let pf = priv.parent_filter;
+	if (!pf) {
+		$chip.classList.add("is-hidden");
+		return;
+	}
+	let $topic = $chip.querySelector(".PARENT_FILTER_TOPIC");
+	$topic.setAttribute("data-i18n", pf.parent_topic);
+	$topic.textContent = t(pf.parent_topic);
+	$chip.querySelector(".PARENT_FILTER_ID").textContent = pf.parent_id;
+	$chip.classList.remove("is-hidden");
+}
+/************************************************************
 *  True if the topic's pkey col carries the "rowid" flag.
 ************************************************************/
 function pkey_is_rowid(gobj) {
@@ -27903,74 +28141,6 @@ function build_fkey_ref(gobj, col, value) {
 	}
 	return refs;
 }
-/***************************************************************************
-*  TODO con límite máximo o máximo height o con scroll
-*      en un gobj propio para gestionar los datos en "page"s
-*      que los hook no vengan rellenos si son muchos y que se puedan gestionar
-*      con un gobj
-***************************************************************************/
-function show_dropdown_popup_menu(gobj, x, y, items, callback) {
-	let $element = createElement2([
-		"div",
-		{ class: "dropdown popup" },
-		[[
-			"div",
-			{
-				class: "dropdown-menu",
-				role: "menu",
-				style: "min-width:4rem; border: 2px solid var(--bulma-border); padding: 0px;"
-			},
-			[[
-				"div",
-				{
-					class: "dropdown-content",
-					style: "padding: 0;"
-				},
-				[]
-			]]
-		]],
-		{ "click": (evt) => {
-			evt.stopPropagation();
-			destroyModal();
-			if (callback) callback(evt);
-		} }
-	]);
-	const destroyModal = () => {
-		$element.classList.remove("is-active");
-		$element.parentNode.removeChild($element);
-	};
-	let $dropdown_content = $element.querySelector(".dropdown-content");
-	let ids = kwid_get_ids(gobj, items);
-	for (let id of ids) {
-		let $item = createElement2([
-			"a",
-			{
-				class: "dropdown-item flex-horizontal-section",
-				"data-value": `${id}`,
-				style: "margin:0px;"
-			},
-			[[
-				"span",
-				{ i18n: `${id}` },
-				`${id}`
-			]],
-			{ "click": (evt) => {
-				evt.stopPropagation();
-				destroyModal();
-				if (callback) callback(evt, this.dataset.value);
-			} }
-		]);
-		$dropdown_content.appendChild($item);
-	}
-	refresh_language($element, t);
-	popup_mount_layer(gobj).appendChild($element);
-	$element.style.position = "absolute";
-	$element.style.top = y + "px";
-	$element.style.left = x + "px";
-	$element.classList.add("is-active");
-	let $with_focus = $element.querySelector(".with-focus");
-	if ($with_focus) $with_focus.focus();
-}
 /***************************************************************
 *  A read-only topic refuses the write EVENTS too, not only their
 *  buttons. The buttons are gone, but an event can still arrive: a
@@ -28410,12 +28580,69 @@ function ac_change_locale(gobj, event, kw, src) {
 *  };
 ************************************************************/
 function ac_show_hook_data$1(gobj, event, kw, src) {
-	let webix = gobj_command(gobj_parent(gobj), "get_topic_data", kw, gobj);
-	let row = kwid_find_one_record(gobj, webix.data, kw.row_id, null);
-	if (row) {
-		let cell = row[kw.col_id];
-		show_dropdown_popup_menu(gobj, kw.click_x, kw.click_y, cell);
+	let col = get_schema_col(gobj, kw.col_id);
+	let hook = col && is_object(col.hook) ? col.hook : null;
+	if (!hook || kw.row_id === void 0 || kw.row_id === null) {
+		log_error(`${gobj_short_name(gobj)}: hook '${kw.col_id}' names no child topic to open`);
+		return -1;
+	}
+	let targets = Object.keys(hook).map((topic) => {
+		return {
+			topic_name: topic,
+			fkey: hook[topic]
+		};
+	});
+	if (targets.length === 1) {
+		publish_open_linked(gobj, targets[0].topic_name, targets[0].fkey, String(kw.row_id), kw.col_id);
+		return 0;
+	}
+	open_hook_choice_dialog(gobj, targets, String(kw.row_id), kw.col_id);
+	return 0;
+}
+/************************************************************
+*  A hook with several child topics: pick one.
+*  {topic_name, fkey, parent_id, hook}
+************************************************************/
+function ac_choose_linked(gobj, event, kw, src) {
+	close_hook_choice(gobj);
+	publish_open_linked(gobj, kw.topic_name, kw.fkey, kw.parent_id, kw.hook);
+	return 0;
+}
+/************************************************************
+*  Show only the rows linked to one record of another topic.
+*  Sent by the host when a hook of that record was clicked.
+*  {fkey, parent_topic, parent_id, hook}
+*
+*  Over the rows the table HOLDS: with `with_remote_paging` that
+*  is one page, which is one of the reasons that flag stays off.
+************************************************************/
+function ac_filter_by_parent(gobj, event, kw, src) {
+	let priv = gobj.priv;
+	if (!kw || !kw.fkey || kw.parent_id === void 0 || kw.parent_id === null) {
+		log_error(`${gobj_short_name(gobj)}: a parent filter with no fkey or no parent`);
+		return -1;
+	}
+	if (!get_schema_col(gobj, kw.fkey)) {
+		log_error(`${gobj_short_name(gobj)}: parent filter on '${kw.fkey}', which is not a column of '${gobj_read_str_attr(gobj, "topic_name")}'`);
+		return -1;
 	}
+	priv.parent_filter = {
+		fkey: kw.fkey,
+		parent_topic: kw.parent_topic || "",
+		parent_id: String(kw.parent_id),
+		hook: kw.hook || ""
+	};
+	render_parent_filter(gobj);
+	apply_row_filters(gobj);
+	return 0;
+}
+/************************************************************
+*  The ✕ of the parent filter: back to the whole topic.
+************************************************************/
+function ac_clear_parent_filter(gobj, event, kw, src) {
+	gobj.priv.parent_filter = null;
+	render_parent_filter(gobj);
+	apply_row_filters(gobj);
 	return 0;
 }
 /************************************************************
@@ -28726,19 +28953,12 @@ function ac_page_timeout(gobj, event, kw, src) {
 *  cleared search box does not silently undo them.
 ************************************************************/
 function ac_search(gobj, event, kw, src) {
-	let tabulator = gobj_read_attr(gobj, "tabulator");
-	if (!tabulator) {
+	if (!gobj_read_attr(gobj, "tabulator")) {
 		log_error(`${gobj_short_name(gobj)}: no table to search`);
 		return -1;
 	}
-	let term = (kw && kw.text || "").toLowerCase();
-	if (!term) {
-		tabulator.clearFilter();
-		return 0;
-	}
-	tabulator.setFilter(function(data) {
-		return row_matches(data, term);
-	});
+	gobj.priv.search_term = (kw && kw.text || "").toLowerCase();
+	apply_row_filters(gobj);
 	return 0;
 }
 /************************************************************
@@ -28986,6 +29206,21 @@ function create_gclass$5(gclass_name) {
 			ac_show_hook_data$1,
 			null
 		],
+		[
+			"EV_CHOOSE_LINKED",
+			ac_choose_linked,
+			null
+		],
+		[
+			"EV_FILTER_BY_PARENT",
+			ac_filter_by_parent,
+			null
+		],
+		[
+			"EV_CLEAR_PARENT_FILTER",
+			ac_clear_parent_filter,
+			null
+		],
 		[
 			"EV_SHOW_CELL_JSON",
 			ac_show_cell_json,
@@ -29104,7 +29339,11 @@ function create_gclass$5(gclass_name) {
 		["EV_CLEAR_SELECTION", 0],
 		["EV_SELECT_ROWS", event_flag_t.EVF_OUTPUT_EVENT],
 		["EV_UNSELECT_ROWS", event_flag_t.EVF_OUTPUT_EVENT],
-		["EV_SHOW_HOOK_DATA", event_flag_t.EVF_OUTPUT_EVENT],
+		["EV_SHOW_HOOK_DATA", 0],
+		["EV_CHOOSE_LINKED", 0],
+		["EV_FILTER_BY_PARENT", 0],
+		["EV_CLEAR_PARENT_FILTER", 0],
+		["EV_OPEN_LINKED", event_flag_t.EVF_OUTPUT_EVENT],
 		["EV_SHOW_CELL_JSON", 0],
 		["EV_SHOW_CELL_FILE", 0],
 		["EV_ASSET_LOADED", 0],

package/package.json

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

package/src/c_yui_treedb_topic_with_form.css

@@ -208,3 +208,33 @@
     font-family: monospace;
     overflow-wrap: anywhere;
 }
+
+/*
+ *  The table is showing only the rows linked to one record, because a
+ *  hook was clicked (EV_FILTER_BY_PARENT). Said above the table, with
+ *  the way out beside it: a filter nobody can see is a table that looks
+ *  like it lost rows.
+ */
+.TREEDB_PARENT_FILTER {
+    display: flex;
+    align-items: center;
+    gap: 0.4rem;
+    flex-wrap: wrap;
+    padding: 0.35rem 0.75rem;
+    border-bottom: 1px solid var(--bulma-border, #dbdbdb);
+    background: var(--bulma-scheme-main-bis, transparent);
+}
+.TREEDB_PARENT_FILTER .PARENT_FILTER_ID {
+    font-family: monospace;
+    overflow-wrap: anywhere;
+}
+
+/*
+ *  A hook whose children live in more than one topic: which one to open.
+ */
+.TREEDB_HOOK_CHOICE {
+    display: flex;
+    flex-direction: column;
+    gap: 0.5rem;
+    padding: 0.75rem;
+}