@yuneta/gobj-ui 7.23.49 → 7.23.50

package/README.md

@@ -1780,6 +1780,51 @@ this facility: it is `formatter: "rowSelection"` with no `titleFormatter` and
 `selectableRows: 1`, and the header checkbox, the count and the bar all mean
 nothing there.
 
+### Clearing a header filter — `yui_table_filter_clear.js`
+
+A column filter is set by typing and undone by deleting what you typed, letter
+by letter, and nothing in the header says it can be dropped at all. With
+several columns filtered, getting back to the whole table is an exercise in
+remembering which ones you touched. One call, on a table that is already built:
+
+```js
+import {yui_table_filter_clear} from "@yuneta/gobj-ui/src/yui_table_filter_clear.js";
+
+table.on("tableBuilt", () => {
+    yui_table_filter_clear(table);
+});
+```
+
+The app must define the i18n key **`"clear"`**. Three decisions are baked in:
+
+- **The ✕ is visible whenever the filter has content, focus or not** — the
+  opposite of the ✕ in a form (`yui_inputs.js`), which shows only on the field
+  being edited so a form full of filled fields does not light up an ✕ on every
+  one. Here the filter is already set, the focus is elsewhere, and the whole
+  point is to see it and drop it; hidden behind focus it would take two clicks.
+- **It clears through `setHeaderFilterValue()`**, not by synthesising a
+  keystroke on the input — what a header filter listens to depends on that
+  column's filter editor.
+- **It decorates the header by walking it**, because a table's columns are
+  often built from data (a treedb schema) and the header rebuilds itself when
+  they change. The walk is idempotent and gated by a single `querySelector`, so
+  repeating it on every render costs nothing.
+
+### Searching a row that is not flat — `yui_row_search.js`
+
+`row_matches(row, term)` is what the treedb topic table's search box uses, and
+it exists because **a treedb row is not flat**: with `list_dict` an fkey
+arrives as a list of objects — `[{id, topic_name, hook_name}]` — and
+`String(val)` of that is `"[object Object]"`. A search written the obvious way
+therefore never finds the place a node is linked to, while the cell plainly
+renders that id: what you see and what is searched are not the same thing.
+
+It walks into lists and objects, and reads only the **`id`** of an fkey:
+`topic_name` and `hook_name` are the same two words on every row, so matching
+them turns any such term into a wildcard over the whole topic. Keys starting
+with `_` are never searched, at any level — scaffolding (`_operation`) and
+metadata (`__md_treedb__`).
+
 ## Conventions
 
 ### i18n: a string must be able to CHANGE language, not just be translated once

package/dist/gobj-ui.cjs.js

@@ -23841,12 +23841,26 @@ function create_tabulator(gobj) {
 				single_page = max === false || max <= 1;
 			} else {
 				let size = tabulator.getPageSize();
-				single_page = !size || n <= size;
+				single_page = size === true || !size || n <= size;
 			}
 		} catch (e) {
 			single_page = true;
 		}
+		let total_rows;
+		if (paged) total_rows = total;
+		else try {
+			total_rows = tabulator.getDataCount();
+		} catch (e) {
+			total_rows = n;
+		}
+		let min_size = 0;
+		let sizes = tabulator.options ? tabulator.options.paginationSizeSelector : null;
+		if (Array.isArray(sizes)) sizes.forEach(function(size) {
+			if (typeof size === "number" && (!min_size || size < min_size)) min_size = size;
+		});
+		let no_paginator = single_page && (!min_size || typeof total_rows !== "number" || total_rows <= min_size);
 		tabulator.element.classList.toggle("yui-single-page", single_page);
+		tabulator.element.classList.toggle("yui-no-paginator", no_paginator);
 	}
 	tabulator._ready = false;
 	tabulator.on("tableBuilt", function() {

package/dist/gobj-ui.es.js

@@ -23836,12 +23836,26 @@ function create_tabulator(gobj) {
 				single_page = max === false || max <= 1;
 			} else {
 				let size = tabulator.getPageSize();
-				single_page = !size || n <= size;
+				single_page = size === true || !size || n <= size;
 			}
 		} catch (e) {
 			single_page = true;
 		}
+		let total_rows;
+		if (paged) total_rows = total;
+		else try {
+			total_rows = tabulator.getDataCount();
+		} catch (e) {
+			total_rows = n;
+		}
+		let min_size = 0;
+		let sizes = tabulator.options ? tabulator.options.paginationSizeSelector : null;
+		if (Array.isArray(sizes)) sizes.forEach(function(size) {
+			if (typeof size === "number" && (!min_size || size < min_size)) min_size = size;
+		});
+		let no_paginator = single_page && (!min_size || typeof total_rows !== "number" || total_rows <= min_size);
 		tabulator.element.classList.toggle("yui-single-page", single_page);
+		tabulator.element.classList.toggle("yui-no-paginator", no_paginator);
 	}
 	tabulator._ready = false;
 	tabulator.on("tableBuilt", function() {

package/package.json

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

package/src/c_yui_treedb_topic_with_form.css

@@ -23,10 +23,20 @@
     line-height: 1.5;
 }
 
-/*  All rows fit in one page: the page-size selector and the
- *  First/Prev/1/Next/Last strip are pure noise (worst on mobile) —
- *  update_rowcount() toggles the class on every data change.  */
-.tabulator.yui-single-page .tabulator-footer .tabulator-paginator {
+/*  All rows fit in one page: the First/Prev/1/Next/Last strip is pure
+ *  noise (worst on mobile) — update_rowcount() toggles the class on every
+ *  data change. The page-size SELECTOR stays: it is what made the table
+ *  one page in the first place ("All" on a topic of 300 rows), so hiding
+ *  it together with the buttons left the reader no way back to 50.  */
+.tabulator.yui-single-page .tabulator-footer .tabulator-paginator .tabulator-page,
+.tabulator.yui-single-page .tabulator-footer .tabulator-paginator .tabulator-pages {
+    display: none;
+}
+
+/*  No choice in the selector would change anything either — the topic is
+ *  smaller than the smallest page size it offers — so the whole strip,
+ *  label and select included, is noise.  */
+.tabulator.yui-no-paginator .tabulator-footer .tabulator-paginator {
     display: none;
 }
 

package/src/c_yui_treedb_topic_with_form.js

@@ -1462,14 +1462,50 @@ function create_tabulator(gobj)
                 single_page = (max === false) || max <= 1;
             } else {
                 /*  Derived from the count and the page size rather than read
-                 *  from getPageMax(), which is stale in the filter path. */
+                 *  from getPageMax(), which is stale in the filter path.
+                 *  `true` is Tabulator's "All" and it is the SIZE itself, so
+                 *  it has to be read as a word: compared as a number it is 1,
+                 *  and a table showing every one of its 300 rows in a single
+                 *  page answered that it needed 300 pages.  */
                 let size = tabulator.getPageSize();
-                single_page = !size || n <= size;
+                single_page = (size === true) || !size || n <= size;
             }
         } catch(e) {
             single_page = true;
         }
+        /*  The page-size selector lives INSIDE the paginator, so hiding the
+         *  whole strip when everything fits took away the very control that
+         *  got the reader there: pick "All" on a topic of 300 rows and the
+         *  table becomes one page, the paginator goes, and 50 is
+         *  unreachable. The selector is noise only when no choice in it
+         *  would change anything -- when the topic is smaller than the
+         *  smallest size it offers. Measure that on the WHOLE topic, never
+         *  on the filtered count, or typing a filter that leaves 3 rows
+         *  takes the selector away too.  */
+        let total_rows;
+        if(paged) {
+            total_rows = total;
+        } else {
+            try {
+                total_rows = tabulator.getDataCount();
+            } catch(e) {
+                total_rows = n;
+            }
+        }
+        let min_size = 0;
+        let sizes = tabulator.options? tabulator.options.paginationSizeSelector : null;
+        if(Array.isArray(sizes)) {
+            sizes.forEach(function(size) {
+                if(typeof size === "number" && (!min_size || size < min_size)) {
+                    min_size = size;
+                }
+            });
+        }
+        let no_paginator = single_page &&
+            (!min_size || typeof total_rows !== "number" || total_rows <= min_size);
+
         tabulator.element.classList.toggle("yui-single-page", single_page);
+        tabulator.element.classList.toggle("yui-no-paginator", no_paginator);
     }
 
     tabulator._ready = false;