npm - @yuneta/gobj-ui - Versions diffs - 7.23.52 → 7.23.53 - Mend

@yuneta/gobj-ui 7.23.52 → 7.23.53

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (7) hide show

package/dist/gobj-ui.cjs.js +219 -154
package/dist/gobj-ui.es.js +219 -154
package/package.json +2 -2
package/src/c_yui_form.js +4 -0
package/src/c_yui_treedb_topic_with_form.css +10 -0
package/src/c_yui_treedb_topic_with_form.js +55 -0
package/src/lib_icons.js +51 -0

package/dist/gobj-ui.cjs.js CHANGED Viewed

@@ -6811,6 +6811,7 @@ function build_form_field_conf(gobj, field_desc) {
 			field_conf.options = get_fkey_select_options(gobj, field_desc);
 			break;
 		case "image":
+		case "icon":
 		case "string":
 			field_conf.tag = "input";
 			field_conf.inputType = "text";
@@ -7728,6 +7729,7 @@ function template2columns(gobj, columns, template, sub_elements) {
 			case "hook": break;
 			case "fkey": break;
 			case "image":
+			case "icon":
 			case "string":
 				column.editor = "input";
 				column.editorParams = {
@@ -8166,6 +8168,7 @@ function treedb_value_2_form_value(gobj, field_desc, value) {
 		case "date":
 		case "color":
 		case "image":
+		case "icon":
 		case "tel":
 		case "template":
 		case "table":
@@ -8258,6 +8261,7 @@ function form_value_2_treedb_value(gobj, field_desc, value) {
 		case "date":
 		case "color":
 		case "image":
+		case "icon":
 		case "tel": break;
 		case "template":
 			if ((0, _yuneta_gobj_js.is_string)(value)) try {
@@ -22658,6 +22662,182 @@ function yui_table_filter_clear(table) {
 	});
 }
 //#endregion
+//#region src/lib_icons.js
+/*********************************************************
+*      lib_icons.js
+*
+*      Two icon systems are managed here:
+*
+*      1. FA-style CSS icons (yui_icons.css)
+*         Usage: <i class="yi-save"></i>
+*         Color: inherits currentColor from parent via CSS mask.
+*
+*      2. SVG symbol icons for G6 toolbar (and any other component
+*         that uses <use xlink:href="#id">).
+*         Symbols are injected once into the DOM.
+*         All symbol ids are prefixed with "g6-icon-" to avoid
+*         conflicts with other DOM elements.
+*         Icon paths come from:
+*           fontawesome-free-7.1.0-web/sprites/solid.svg
+*
+*         G6 toolbar items are managed via CSS class names (className
+*         field in getItems()) using YuiToolbar in c_g6_nodes_tree.js.
+*         This lets lib_graph.js state functions (set_submit_state,
+*         disableElements, …) work on toolbar icons exactly like on
+*         regular Bulma/FA buttons — no icon-specific helpers needed.
+*
+*      Copyright (c) 2025-2026, ArtGins.
+*      All Rights Reserved.
+*********************************************************/
+var CUSTOM_SVG_ICONS_ID = "g6-custom-svgicons";
+var ICONS = `<svg xmlns="http://www.w3.org/2000/svg">
+    <!-- magnifying-glass-plus -->
+    <symbol id="g6-icon-zoom-in" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376C296.3 401.1 253.9 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208zM208 112c-13.3 0-24 10.7-24 24l0 48-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l48 0 0 48c0 13.3 10.7 24 24 24s24-10.7 24-24l0-48 48 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-48 0 0-48c0-13.3-10.7-24-24-24z"/>
+    </symbol>
+    <!-- magnifying-glass-minus -->
+    <symbol id="g6-icon-zoom-out" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376C296.3 401.1 253.9 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208zM136 184c-13.3 0-24 10.7-24 24s10.7 24 24 24l144 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-144 0z"/>
+    </symbol>
+    <!-- house (reset zoom: back to original 100% view) -->
+    <symbol id="g6-icon-home" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M277.8 8.6c-12.3-11.4-31.3-11.4-43.5 0l-224 208c-9.6 9-12.8 22.9-8 35.1S18.8 272 32 272l16 0 0 176c0 35.3 28.7 64 64 64l288 0c35.3 0 64-28.7 64-64l0-176 16 0c13.2 0 25-8.1 29.8-20.3s1.6-26.2-8-35.1l-224-208zM240 320l32 0c26.5 0 48 21.5 48 48l0 96-128 0 0-96c0-26.5 21.5-48 48-48z"/>
+    </symbol>
+    <!-- expand (zoom to fit) -->
+    <symbol id="g6-icon-fit" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M32 32C14.3 32 0 46.3 0 64l0 96c0 17.7 14.3 32 32 32s32-14.3 32-32l0-64 64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 32zM64 352c0-17.7-14.3-32-32-32S0 334.3 0 352l0 96c0 17.7 14.3 32 32 32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0 0-64zM320 32c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0 0 64c0 17.7 14.3 32 32 32s32-14.3 32-32l0-96c0-17.7-14.3-32-32-32l-96 0zM448 352c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 64-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l96 0c17.7 0 32-14.3 32-32l0-96z"/>
+    </symbol>
+    <!-- fit to selection: the same corner brackets as the fit icon,
+         around a marked object. The two sit side by side in the
+         toolbar and have to read as a family, which a borrowed glyph
+         would not. (No backticks in here: the sprite lives inside a
+         template literal.) -->
+    <symbol id="g6-icon-fit-selection" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M32 32C14.3 32 0 46.3 0 64l0 96c0 17.7 14.3 32 32 32s32-14.3 32-32l0-64 64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 32zM64 352c0-17.7-14.3-32-32-32S0 334.3 0 352l0 96c0 17.7 14.3 32 32 32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0 0-64zM320 32c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0 0 64c0 17.7 14.3 32 32 32s32-14.3 32-32l0-96c0-17.7-14.3-32-32-32l-96 0zM448 352c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 64-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l96 0c17.7 0 32-14.3 32-32l0-96z"/>
+        <rect fill="currentColor" x="144" y="176" width="160" height="160" rx="24"/>
+    </symbol>
+    <!-- crosshairs (center) -->
+    <symbol id="g6-icon-center" viewBox="0 0 576 512">
+        <path fill="currentColor" d="M288-16c17.7 0 32 14.3 32 32l0 18.3c98.1 14 175.7 91.6 189.7 189.7l18.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-18.3 0c-14 98.1-91.6 175.7-189.7 189.7l0 18.3c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-18.3C157.9 463.7 80.3 386.1 66.3 288L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l18.3 0C80.3 125.9 157.9 48.3 256 34.3L256 16c0-17.7 14.3-32 32-32zM131.2 288c12.7 62.7 62.1 112.1 124.8 124.8l0-12.8c0-17.7 14.3-32 32-32s32 14.3 32 32l0 12.8c62.7-12.7 112.1-62.1 124.8-124.8L432 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l12.8 0C432.1 161.3 382.7 111.9 320 99.2l0 12.8c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-12.8C193.3 111.9 143.9 161.3 131.2 224l12.8 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-12.8 0zM288 208a48 48 0 1 1 0 96 48 48 0 1 1 0-96z"/>
+    </symbol>
+    <!-- up-right-and-down-left-from-center (enter fullscreen) -->
+    <symbol id="g6-icon-fullscreen" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M344 0L488 0c13.3 0 24 10.7 24 24l0 144c0 9.7-5.8 18.5-14.8 22.2s-19.3 1.7-26.2-5.2l-39-39-87 87c-9.4 9.4-24.6 9.4-33.9 0l-32-32c-9.4-9.4-9.4-24.6 0-33.9l87-87-39-39c-6.9-6.9-8.9-17.2-5.2-26.2S334.3 0 344 0zM168 512L24 512c-13.3 0-24-10.7-24-24L0 344c0-9.7 5.8-18.5 14.8-22.2S34.1 320.2 41 327l39 39 87-87c9.4-9.4 24.6-9.4 33.9 0l32 32c9.4 9.4 9.4 24.6 0 33.9l-87 87 39 39c6.9 6.9 8.9 17.2 5.2 26.2S177.7 512 168 512z"/>
+    </symbol>
+    <!-- down-left-and-up-right-to-center (exit fullscreen) -->
+    <symbol id="g6-icon-fullscreen-exit" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M439.5 7c9.4-9.4 24.6-9.4 33.9 0l32 32c9.4 9.4 9.4 24.6 0 33.9l-87 87 39 39c6.9 6.9 8.9 17.2 5.2 26.2S450.2 240 440.5 240l-144 0c-13.3 0-24-10.7-24-24l0-144c0-9.7 5.8-18.5 14.8-22.2s19.3-1.7 26.2 5.2l39 39 87-87zM72.5 272l144 0c13.3 0 24 10.7 24 24l0 144c0 9.7-5.8 18.5-14.8 22.2s-19.3 1.7-26.2-5.2l-39-39-87 87c-9.4 9.4-24.6 9.4-33.9 0l-32-32c-9.4-9.4-9.4-24.6 0-33.9l87-87-39-39c-6.9-6.9-8.9-17.2-5.2-26.2S62.8 272 72.5 272z"/>
+    </symbol>
+    <!-- arrow-rotate-left (undo) -->
+    <symbol id="g6-icon-undo" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M256 64c-56.8 0-107.9 24.7-143.1 64l47.1 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 192c-17.7 0-32-14.3-32-32L0 32C0 14.3 14.3 0 32 0S64 14.3 64 32l0 54.7C110.9 33.6 179.5 0 256 0 397.4 0 512 114.6 512 256S397.4 512 256 512c-87 0-163.9-43.4-210.1-109.7-10.1-14.5-6.6-34.4 7.9-44.6s34.4-6.6 44.6 7.9c34.8 49.8 92.4 82.3 157.6 82.3 106 0 192-86 192-192S362 64 256 64z"/>
+    </symbol>
+    <!-- arrow-rotate-right (redo) -->
+    <symbol id="g6-icon-redo" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M436.7 74.7L448 85.4 448 32c0-17.7 14.3-32 32-32s32 14.3 32 32l0 128c0 17.7-14.3 32-32 32l-128 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l47.9 0-7.6-7.2c-.2-.2-.4-.4-.6-.6-75-75-196.5-75-271.5 0s-75 196.5 0 271.5 196.5 75 271.5 0c8.2-8.2 15.5-16.9 21.9-26.1 10.1-14.5 30.1-18 44.6-7.9s18 30.1 7.9 44.6c-8.5 12.2-18.2 23.8-29.1 34.7-100 100-262.1 100-362 0S-25 175 75 75c99.9-99.9 261.7-100 361.7-.3z"/>
+    </symbol>
+    <!-- pen (edit node) -->
+    <symbol id="g6-icon-edit" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M352.9 21.2L308 66.1 445.9 204 490.8 159.1C504.4 145.6 512 127.2 512 108s-7.6-37.6-21.2-51.1L455.1 21.2C441.6 7.6 423.2 0 404 0s-37.6 7.6-51.1 21.2zM274.1 100L58.9 315.1c-10.7 10.7-18.5 24.1-22.6 38.7L.9 481.6c-2.3 8.3 0 17.3 6.2 23.4s15.1 8.5 23.4 6.2l127.8-35.5c14.6-4.1 27.9-11.8 38.7-22.6L412 237.9 274.1 100z"/>
+    </symbol>
+    <!-- trash-can (delete) -->
+    <symbol id="g6-icon-delete" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M136.7 5.9C141.1-7.2 153.3-16 167.1-16l113.9 0c13.8 0 26 8.8 30.4 21.9L320 32 416 32c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 96C14.3 96 0 81.7 0 64S14.3 32 32 32l96 0 8.7-26.1zM32 144l384 0 0 304c0 35.3-28.7 64-64 64L96 512c-35.3 0-64-28.7-64-64l0-304zm88 64c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24zm104 0c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24zm104 0c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24z"/>
+    </symbol>
+    <!-- link (link nodes) -->
+    <symbol id="g6-icon-link" viewBox="0 0 576 512">
+        <path fill="currentColor" d="M419.5 96c-16.6 0-32.7 4.5-46.8 12.7-15.8-16-34.2-29.4-54.5-39.5 28.2-24 64.1-37.2 101.3-37.2 86.4 0 156.5 70 156.5 156.5 0 41.5-16.5 81.3-45.8 110.6l-71.1 71.1c-29.3 29.3-69.1 45.8-110.6 45.8-86.4 0-156.5-70-156.5-156.5 0-1.5 0-3 .1-4.5 .5-17.7 15.2-31.6 32.9-31.1s31.6 15.2 31.1 32.9c0 .9 0 1.8 0 2.6 0 51.1 41.4 92.5 92.5 92.5 24.5 0 48-9.7 65.4-27.1l71.1-71.1c17.3-17.3 27.1-40.9 27.1-65.4 0-51.1-41.4-92.5-92.5-92.5zM275.2 173.3c-1.9-.8-3.8-1.9-5.5-3.1-12.6-6.5-27-10.2-42.1-10.2-24.5 0-48 9.7-65.4 27.1L91.1 258.2c-17.3 17.3-27.1 40.9-27.1 65.4 0 51.1 41.4 92.5 92.5 92.5 16.5 0 32.6-4.4 46.7-12.6 15.8 16 34.2 29.4 54.6 39.5-28.2 23.9-64 37.2-101.3 37.2-86.4 0-156.5-70-156.5-156.5 0-41.5 16.5-81.3 45.8-110.6l71.1-71.1c29.3-29.3 69.1-45.8 110.6-45.8 86.6 0 156.5 70.6 156.5 156.9 0 1.3 0 2.6 0 3.9-.4 17.7-15.1 31.6-32.8 31.2s-31.6-15.1-31.2-32.8c0-.8 0-1.5 0-2.3 0-33.7-18-63.3-44.8-79.6z"/>
+    </symbol>
+    <!-- link-slash (unlink) -->
+    <symbol id="g6-icon-unlink" viewBox="0 0 576 512">
+        <path fill="currentColor" d="M41-24.9c-9.4-9.4-24.6-9.4-33.9 0S-2.3-.3 7 9.1l528 528c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-122-122c4.2-3.4 8.3-7.1 12.1-10.9l71.1-71.1c29.3-29.3 45.8-69.1 45.8-110.6 0-86.4-70-156.5-156.5-156.5-37.3 0-73.1 13.3-101.3 37.2 20.3 10.1 38.7 23.5 54.5 39.5 14.1-8.3 30.2-12.7 46.8-12.7 51.1 0 92.5 41.4 92.5 92.5 0 24.5-9.7 48-27.1 65.4l-71.1 71.1c-3.9 3.9-8.1 7.4-12.6 10.5l-47.5-47.5c16.5-.9 29.7-14.4 30.2-31.1 0-1.3 0-2.6 0-3.9 0-86.3-69.9-156.9-156.5-156.9-19.2 0-37.9 3.5-55.5 10.2L41-24.9zM225.9 160c.6 0 1.1 0 1.7 0 15.1 0 29.5 3.7 42.1 10.2 1.8 1.2 3.6 2.3 5.5 3.1 26.8 16.3 44.8 45.9 44.8 79.6 0 .4 0 .8 0 1.2L225.9 160zM346.2 416L192 261.8c1.2 84.6 69.6 152.9 154.1 154.1zM139.7 209.5l-45.3-45.3-48.6 48.6c-29.3 29.3-45.8 69.1-45.8 110.6 0 86.4 70 156.5 156.5 156.5 37.2 0 73.1-13.3 101.3-37.2-20.3-10.1-38.8-23.5-54.6-39.5-14 8.2-30.1 12.6-46.7 12.6-51.1 0-92.5-41.4-92.5-92.5 0-24.5 9.7-48 27.1-65.4l48.6-48.6z"/>
+    </symbol>
+    <!-- play (run node) -->
+    <symbol id="g6-icon-run" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M91.2 36.9c-12.4-6.8-27.4-6.5-39.6 .7S32 57.9 32 72l0 368c0 14.1 7.5 27.2 19.6 34.4s27.2 7.5 39.6 .7l336-184c12.8-7 20.8-20.5 20.8-35.1s-8-28.1-20.8-35.1l-336-184z"/>
+    </symbol>
+    <!-- clone (copy size to other nodes/ports) -->
+    <symbol id="g6-icon-resize" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M288 448l-224 0 0-224 48 0 0-64-48 0c-35.3 0-64 28.7-64 64L0 448c0 35.3 28.7 64 64 64l224 0c35.3 0 64-28.7 64-64l0-48-64 0 0 48zm-64-96l224 0c35.3 0 64-28.7 64-64l0-224c0-35.3-28.7-64-64-64L224 0c-35.3 0-64 28.7-64 64l0 224c0 35.3 28.7 64 64 64z"/>
+    </symbol>
+    <!-- plus (create node). Deliberately NOT the FA7 solid plus:
+         its arms are ~14% of the width and read thin next to the
+         other solid glyphs. Bold geometric plus (~23% arm
+         thickness) with long arms (32..480) so it reads as a "+",
+         not a stubby Red-Cross square. -->
+    <symbol id="g6-icon-plus" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M316 32 L316 196 L480 196 L480 316 L316 316 L316 480 L196 480 L196 316 L32 316 L32 196 L196 196 L196 32 Z"/>
+    </symbol>
+    <!-- ellipsis-vertical (unfold the floating toolbar).
+         The strip it stands for is a vertical stack, and a vertical
+         ellipsis is what "there is more of this here" is drawn as
+         everywhere else. -->
+    <symbol id="g6-icon-toolbar-show" viewBox="0 0 128 512">
+        <path fill="currentColor" d="M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z"/>
+    </symbol>
+    <!-- xmark (fold the floating toolbar away).
+         Not a chevron: the two toolbars sit on OPPOSITE edges, so a
+         direction would point the wrong way on one of them. What the
+         button does is close an overlay, and that is an x. -->
+    <symbol id="g6-icon-toolbar-hide" viewBox="0 0 384 512">
+        <path fill="currentColor" d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/>
+    </symbol>
+    <!-- dashed marquee (selection mode).
+         The band ITSELF, because that is what the button turns on: a
+         drag on the canvas draws one and a tap picks a card. Not the
+         fit-to-selection glyph next to it in the other toolbar -- that
+         one is solid brackets around a solid object and means "put the
+         camera on what is picked", which is the opposite end of the
+         gesture. Dashes: 16 segments of 59 with gaps of 36 over a
+         perimeter of 1520, so they land on the corners. -->
+    <symbol id="g6-icon-select-mode" viewBox="0 0 512 512">
+        <rect x="46" y="86" width="420" height="340" fill="none"
+            stroke="currentColor" stroke-width="40"
+            stroke-dasharray="59 36"/>
+    </symbol>
+    <!-- location-crosshairs (anchor the camera on one element).
+         The SAME path as the DOM toolbars and their yi-location-crosshairs
+         mask: the two toolbars sit in one console, and a control that
+         does one thing has to be drawn one way. -->
+    <symbol id="g6-icon-anchor" viewBox="0 0 576 512">
+        <path fill="currentColor" d="M288-16c17.7 0 32 14.3 32 32l0 18.3c98.1 14 175.7 91.6 189.7 189.7l18.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-18.3 0c-14 98.1-91.6 175.7-189.7 189.7l0 18.3c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-18.3C157.9 463.7 80.3 386.1 66.3 288L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l18.3 0C80.3 125.9 157.9 48.3 256 34.3L256 16c0-17.7 14.3-32 32-32zM128 256a160 160 0 1 0 320 0 160 160 0 1 0 -320 0zm160-96a96 96 0 1 1 0 192 96 96 0 1 1 0-192z"/>
+    </symbol>
+    <!-- floppy-disk (save) -->
+    <symbol id="g6-icon-save" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-242.7c0-17-6.7-33.3-18.7-45.3L352 50.7C340 38.7 323.7 32 306.7 32L64 32zm32 96c0-17.7 14.3-32 32-32l160 0c17.7 0 32 14.3 32 32l0 64c0 17.7-14.3 32-32 32l-160 0c-17.7 0-32-14.3-32-32l0-64zM224 288a64 64 0 1 1 0 128 64 64 0 1 1 0-128z"/>
+    </symbol>
+</svg>`;
+function inject_svg_icons() {
+	if (document.getElementById(CUSTOM_SVG_ICONS_ID)) return;
+	const div = document.createElement("div");
+	div.id = CUSTOM_SVG_ICONS_ID;
+	div.style.display = "none";
+	div.innerHTML = ICONS;
+	document.body.appendChild(div);
+}
+var __icon_defined__ = {};
+function yui_icon_is_defined(name) {
+	if (!name || typeof name !== "string") return false;
+	if (__icon_defined__[name] !== void 0) return __icon_defined__[name];
+	let defined = false;
+	try {
+		const el = document.createElement("i");
+		el.className = name;
+		el.style.position = "absolute";
+		el.style.visibility = "hidden";
+		el.style.pointerEvents = "none";
+		document.body.appendChild(el);
+		const st = window.getComputedStyle(el, "::before");
+		const mask = st.maskImage || st.webkitMaskImage || "";
+		defined = !!mask && mask !== "none";
+		document.body.removeChild(el);
+	} catch (e) {
+		defined = false;
+	}
+	__icon_defined__[name] = defined;
+	return defined;
+}
+//#endregion
 //#region src/yui_row_search.js
 /***********************************************************************
 *          yui_row_search.js
@@ -23738,6 +23918,11 @@ function create_tabulator(gobj) {
 				hozAlign = "center";
 				colFormatter = "color";
 				break;
+			case "icon":
+				hozAlign = "center";
+				vertAlign = "middle";
+				colFormatter = icon_formatter;
+				break;
 			case "object":
 			case "dict":
 			case "template":
@@ -23961,6 +24146,39 @@ function table__destroy(gobj) {
 	}
 }
 /************************************************************
+*  Cell of a col flagged `icon`: the value is the NAME of an
+*  icon of the app's set ("yi-bolt"), so it is DRAWN.
+*
+*  Built as a DOM node and not as an HTML string: the value is
+*  raw record data and must never be parsed as markup -- and
+*  here it also becomes a CSS class, so it is filtered to the
+*  shape of a class name before it gets near one.
+*
+*  A name the set does not carry falls back to the TEXT of it.
+*  The catch-all rule `[class^="yi-"]::before` paints a
+*  currentColor box for any name, so drawing it anyway would
+*  render a solid square -- a glyph nobody recognises rather
+*  than a mistake somebody can fix.
+************************************************************/
+function icon_formatter(cell) {
+	let name = cell.getValue();
+	if (!(0, _yuneta_gobj_js.is_string)(name) || (0, _yuneta_gobj_js.empty_string)(name)) return "";
+	name = name.trim();
+	if (!/^[a-z0-9-]+$/.test(name) || !yui_icon_is_defined(name)) return (0, _yuneta_gobj_js.createElement2)([
+		"span",
+		{
+			class: "ICON_CELL_UNKNOWN is-size-7 has-text-grey",
+			title: name
+		},
+		name
+	]);
+	return (0, _yuneta_gobj_js.createElement2)(["span", {
+		class: `ICON_CELL ${name}`,
+		title: name,
+		"aria-label": name
+	}]);
+}
+/************************************************************
 *  Cell of a col holding a JSON document (dict/list/blob/
 *  template/coordinates/…): a one-line truncated preview,
 *  marked as a link because the click opens the whole value
@@ -24072,6 +24290,7 @@ function transform__treedb_value_2_table_value(gobj, col, value, row, field) {
 			}
 			break;
 		case "color": break;
+		case "icon": break;
 		case "image": break;
 		default: (0, _yuneta_gobj_js.log_error)(`transform__treedb_value_2_table_value() unhandled type '${field_desc.type}' (real_type='${field_desc.real_type}') for field '${field}', topic ${priv.topic_name}`);
 	}
@@ -52405,160 +52624,6 @@ Sector.PARSED_STYLE_LIST = new Set([].concat(_toConsumableArray(Path.PARSED_STYL
 	"endAngle"
 ]));
 //#endregion
-//#region src/lib_icons.js
-/*********************************************************
-*      lib_icons.js
-*
-*      Two icon systems are managed here:
-*
-*      1. FA-style CSS icons (yui_icons.css)
-*         Usage: <i class="yi-save"></i>
-*         Color: inherits currentColor from parent via CSS mask.
-*
-*      2. SVG symbol icons for G6 toolbar (and any other component
-*         that uses <use xlink:href="#id">).
-*         Symbols are injected once into the DOM.
-*         All symbol ids are prefixed with "g6-icon-" to avoid
-*         conflicts with other DOM elements.
-*         Icon paths come from:
-*           fontawesome-free-7.1.0-web/sprites/solid.svg
-*
-*         G6 toolbar items are managed via CSS class names (className
-*         field in getItems()) using YuiToolbar in c_g6_nodes_tree.js.
-*         This lets lib_graph.js state functions (set_submit_state,
-*         disableElements, …) work on toolbar icons exactly like on
-*         regular Bulma/FA buttons — no icon-specific helpers needed.
-*
-*      Copyright (c) 2025-2026, ArtGins.
-*      All Rights Reserved.
-*********************************************************/
-var CUSTOM_SVG_ICONS_ID = "g6-custom-svgicons";
-var ICONS = `<svg xmlns="http://www.w3.org/2000/svg">
-    <!-- magnifying-glass-plus -->
-    <symbol id="g6-icon-zoom-in" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376C296.3 401.1 253.9 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208zM208 112c-13.3 0-24 10.7-24 24l0 48-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l48 0 0 48c0 13.3 10.7 24 24 24s24-10.7 24-24l0-48 48 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-48 0 0-48c0-13.3-10.7-24-24-24z"/>
-    </symbol>
-    <!-- magnifying-glass-minus -->
-    <symbol id="g6-icon-zoom-out" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376C296.3 401.1 253.9 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208zM136 184c-13.3 0-24 10.7-24 24s10.7 24 24 24l144 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-144 0z"/>
-    </symbol>
-    <!-- house (reset zoom: back to original 100% view) -->
-    <symbol id="g6-icon-home" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M277.8 8.6c-12.3-11.4-31.3-11.4-43.5 0l-224 208c-9.6 9-12.8 22.9-8 35.1S18.8 272 32 272l16 0 0 176c0 35.3 28.7 64 64 64l288 0c35.3 0 64-28.7 64-64l0-176 16 0c13.2 0 25-8.1 29.8-20.3s1.6-26.2-8-35.1l-224-208zM240 320l32 0c26.5 0 48 21.5 48 48l0 96-128 0 0-96c0-26.5 21.5-48 48-48z"/>
-    </symbol>
-    <!-- expand (zoom to fit) -->
-    <symbol id="g6-icon-fit" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M32 32C14.3 32 0 46.3 0 64l0 96c0 17.7 14.3 32 32 32s32-14.3 32-32l0-64 64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 32zM64 352c0-17.7-14.3-32-32-32S0 334.3 0 352l0 96c0 17.7 14.3 32 32 32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0 0-64zM320 32c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0 0 64c0 17.7 14.3 32 32 32s32-14.3 32-32l0-96c0-17.7-14.3-32-32-32l-96 0zM448 352c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 64-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l96 0c17.7 0 32-14.3 32-32l0-96z"/>
-    </symbol>
-    <!-- fit to selection: the same corner brackets as the fit icon,
-         around a marked object. The two sit side by side in the
-         toolbar and have to read as a family, which a borrowed glyph
-         would not. (No backticks in here: the sprite lives inside a
-         template literal.) -->
-    <symbol id="g6-icon-fit-selection" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M32 32C14.3 32 0 46.3 0 64l0 96c0 17.7 14.3 32 32 32s32-14.3 32-32l0-64 64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 32zM64 352c0-17.7-14.3-32-32-32S0 334.3 0 352l0 96c0 17.7 14.3 32 32 32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0 0-64zM320 32c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0 0 64c0 17.7 14.3 32 32 32s32-14.3 32-32l0-96c0-17.7-14.3-32-32-32l-96 0zM448 352c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 64-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l96 0c17.7 0 32-14.3 32-32l0-96z"/>
-        <rect fill="currentColor" x="144" y="176" width="160" height="160" rx="24"/>
-    </symbol>
-    <!-- crosshairs (center) -->
-    <symbol id="g6-icon-center" viewBox="0 0 576 512">
-        <path fill="currentColor" d="M288-16c17.7 0 32 14.3 32 32l0 18.3c98.1 14 175.7 91.6 189.7 189.7l18.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-18.3 0c-14 98.1-91.6 175.7-189.7 189.7l0 18.3c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-18.3C157.9 463.7 80.3 386.1 66.3 288L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l18.3 0C80.3 125.9 157.9 48.3 256 34.3L256 16c0-17.7 14.3-32 32-32zM131.2 288c12.7 62.7 62.1 112.1 124.8 124.8l0-12.8c0-17.7 14.3-32 32-32s32 14.3 32 32l0 12.8c62.7-12.7 112.1-62.1 124.8-124.8L432 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l12.8 0C432.1 161.3 382.7 111.9 320 99.2l0 12.8c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-12.8C193.3 111.9 143.9 161.3 131.2 224l12.8 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-12.8 0zM288 208a48 48 0 1 1 0 96 48 48 0 1 1 0-96z"/>
-    </symbol>
-    <!-- up-right-and-down-left-from-center (enter fullscreen) -->
-    <symbol id="g6-icon-fullscreen" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M344 0L488 0c13.3 0 24 10.7 24 24l0 144c0 9.7-5.8 18.5-14.8 22.2s-19.3 1.7-26.2-5.2l-39-39-87 87c-9.4 9.4-24.6 9.4-33.9 0l-32-32c-9.4-9.4-9.4-24.6 0-33.9l87-87-39-39c-6.9-6.9-8.9-17.2-5.2-26.2S334.3 0 344 0zM168 512L24 512c-13.3 0-24-10.7-24-24L0 344c0-9.7 5.8-18.5 14.8-22.2S34.1 320.2 41 327l39 39 87-87c9.4-9.4 24.6-9.4 33.9 0l32 32c9.4 9.4 9.4 24.6 0 33.9l-87 87 39 39c6.9 6.9 8.9 17.2 5.2 26.2S177.7 512 168 512z"/>
-    </symbol>
-    <!-- down-left-and-up-right-to-center (exit fullscreen) -->
-    <symbol id="g6-icon-fullscreen-exit" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M439.5 7c9.4-9.4 24.6-9.4 33.9 0l32 32c9.4 9.4 9.4 24.6 0 33.9l-87 87 39 39c6.9 6.9 8.9 17.2 5.2 26.2S450.2 240 440.5 240l-144 0c-13.3 0-24-10.7-24-24l0-144c0-9.7 5.8-18.5 14.8-22.2s19.3-1.7 26.2 5.2l39 39 87-87zM72.5 272l144 0c13.3 0 24 10.7 24 24l0 144c0 9.7-5.8 18.5-14.8 22.2s-19.3 1.7-26.2-5.2l-39-39-87 87c-9.4 9.4-24.6 9.4-33.9 0l-32-32c-9.4-9.4-9.4-24.6 0-33.9l87-87-39-39c-6.9-6.9-8.9-17.2-5.2-26.2S62.8 272 72.5 272z"/>
-    </symbol>
-    <!-- arrow-rotate-left (undo) -->
-    <symbol id="g6-icon-undo" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M256 64c-56.8 0-107.9 24.7-143.1 64l47.1 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 192c-17.7 0-32-14.3-32-32L0 32C0 14.3 14.3 0 32 0S64 14.3 64 32l0 54.7C110.9 33.6 179.5 0 256 0 397.4 0 512 114.6 512 256S397.4 512 256 512c-87 0-163.9-43.4-210.1-109.7-10.1-14.5-6.6-34.4 7.9-44.6s34.4-6.6 44.6 7.9c34.8 49.8 92.4 82.3 157.6 82.3 106 0 192-86 192-192S362 64 256 64z"/>
-    </symbol>
-    <!-- arrow-rotate-right (redo) -->
-    <symbol id="g6-icon-redo" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M436.7 74.7L448 85.4 448 32c0-17.7 14.3-32 32-32s32 14.3 32 32l0 128c0 17.7-14.3 32-32 32l-128 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l47.9 0-7.6-7.2c-.2-.2-.4-.4-.6-.6-75-75-196.5-75-271.5 0s-75 196.5 0 271.5 196.5 75 271.5 0c8.2-8.2 15.5-16.9 21.9-26.1 10.1-14.5 30.1-18 44.6-7.9s18 30.1 7.9 44.6c-8.5 12.2-18.2 23.8-29.1 34.7-100 100-262.1 100-362 0S-25 175 75 75c99.9-99.9 261.7-100 361.7-.3z"/>
-    </symbol>
-    <!-- pen (edit node) -->
-    <symbol id="g6-icon-edit" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M352.9 21.2L308 66.1 445.9 204 490.8 159.1C504.4 145.6 512 127.2 512 108s-7.6-37.6-21.2-51.1L455.1 21.2C441.6 7.6 423.2 0 404 0s-37.6 7.6-51.1 21.2zM274.1 100L58.9 315.1c-10.7 10.7-18.5 24.1-22.6 38.7L.9 481.6c-2.3 8.3 0 17.3 6.2 23.4s15.1 8.5 23.4 6.2l127.8-35.5c14.6-4.1 27.9-11.8 38.7-22.6L412 237.9 274.1 100z"/>
-    </symbol>
-    <!-- trash-can (delete) -->
-    <symbol id="g6-icon-delete" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M136.7 5.9C141.1-7.2 153.3-16 167.1-16l113.9 0c13.8 0 26 8.8 30.4 21.9L320 32 416 32c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 96C14.3 96 0 81.7 0 64S14.3 32 32 32l96 0 8.7-26.1zM32 144l384 0 0 304c0 35.3-28.7 64-64 64L96 512c-35.3 0-64-28.7-64-64l0-304zm88 64c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24zm104 0c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24zm104 0c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24z"/>
-    </symbol>
-    <!-- link (link nodes) -->
-    <symbol id="g6-icon-link" viewBox="0 0 576 512">
-        <path fill="currentColor" d="M419.5 96c-16.6 0-32.7 4.5-46.8 12.7-15.8-16-34.2-29.4-54.5-39.5 28.2-24 64.1-37.2 101.3-37.2 86.4 0 156.5 70 156.5 156.5 0 41.5-16.5 81.3-45.8 110.6l-71.1 71.1c-29.3 29.3-69.1 45.8-110.6 45.8-86.4 0-156.5-70-156.5-156.5 0-1.5 0-3 .1-4.5 .5-17.7 15.2-31.6 32.9-31.1s31.6 15.2 31.1 32.9c0 .9 0 1.8 0 2.6 0 51.1 41.4 92.5 92.5 92.5 24.5 0 48-9.7 65.4-27.1l71.1-71.1c17.3-17.3 27.1-40.9 27.1-65.4 0-51.1-41.4-92.5-92.5-92.5zM275.2 173.3c-1.9-.8-3.8-1.9-5.5-3.1-12.6-6.5-27-10.2-42.1-10.2-24.5 0-48 9.7-65.4 27.1L91.1 258.2c-17.3 17.3-27.1 40.9-27.1 65.4 0 51.1 41.4 92.5 92.5 92.5 16.5 0 32.6-4.4 46.7-12.6 15.8 16 34.2 29.4 54.6 39.5-28.2 23.9-64 37.2-101.3 37.2-86.4 0-156.5-70-156.5-156.5 0-41.5 16.5-81.3 45.8-110.6l71.1-71.1c29.3-29.3 69.1-45.8 110.6-45.8 86.6 0 156.5 70.6 156.5 156.9 0 1.3 0 2.6 0 3.9-.4 17.7-15.1 31.6-32.8 31.2s-31.6-15.1-31.2-32.8c0-.8 0-1.5 0-2.3 0-33.7-18-63.3-44.8-79.6z"/>
-    </symbol>
-    <!-- link-slash (unlink) -->
-    <symbol id="g6-icon-unlink" viewBox="0 0 576 512">
-        <path fill="currentColor" d="M41-24.9c-9.4-9.4-24.6-9.4-33.9 0S-2.3-.3 7 9.1l528 528c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-122-122c4.2-3.4 8.3-7.1 12.1-10.9l71.1-71.1c29.3-29.3 45.8-69.1 45.8-110.6 0-86.4-70-156.5-156.5-156.5-37.3 0-73.1 13.3-101.3 37.2 20.3 10.1 38.7 23.5 54.5 39.5 14.1-8.3 30.2-12.7 46.8-12.7 51.1 0 92.5 41.4 92.5 92.5 0 24.5-9.7 48-27.1 65.4l-71.1 71.1c-3.9 3.9-8.1 7.4-12.6 10.5l-47.5-47.5c16.5-.9 29.7-14.4 30.2-31.1 0-1.3 0-2.6 0-3.9 0-86.3-69.9-156.9-156.5-156.9-19.2 0-37.9 3.5-55.5 10.2L41-24.9zM225.9 160c.6 0 1.1 0 1.7 0 15.1 0 29.5 3.7 42.1 10.2 1.8 1.2 3.6 2.3 5.5 3.1 26.8 16.3 44.8 45.9 44.8 79.6 0 .4 0 .8 0 1.2L225.9 160zM346.2 416L192 261.8c1.2 84.6 69.6 152.9 154.1 154.1zM139.7 209.5l-45.3-45.3-48.6 48.6c-29.3 29.3-45.8 69.1-45.8 110.6 0 86.4 70 156.5 156.5 156.5 37.2 0 73.1-13.3 101.3-37.2-20.3-10.1-38.8-23.5-54.6-39.5-14 8.2-30.1 12.6-46.7 12.6-51.1 0-92.5-41.4-92.5-92.5 0-24.5 9.7-48 27.1-65.4l48.6-48.6z"/>
-    </symbol>
-    <!-- play (run node) -->
-    <symbol id="g6-icon-run" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M91.2 36.9c-12.4-6.8-27.4-6.5-39.6 .7S32 57.9 32 72l0 368c0 14.1 7.5 27.2 19.6 34.4s27.2 7.5 39.6 .7l336-184c12.8-7 20.8-20.5 20.8-35.1s-8-28.1-20.8-35.1l-336-184z"/>
-    </symbol>
-    <!-- clone (copy size to other nodes/ports) -->
-    <symbol id="g6-icon-resize" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M288 448l-224 0 0-224 48 0 0-64-48 0c-35.3 0-64 28.7-64 64L0 448c0 35.3 28.7 64 64 64l224 0c35.3 0 64-28.7 64-64l0-48-64 0 0 48zm-64-96l224 0c35.3 0 64-28.7 64-64l0-224c0-35.3-28.7-64-64-64L224 0c-35.3 0-64 28.7-64 64l0 224c0 35.3 28.7 64 64 64z"/>
-    </symbol>
-    <!-- plus (create node). Deliberately NOT the FA7 solid plus:
-         its arms are ~14% of the width and read thin next to the
-         other solid glyphs. Bold geometric plus (~23% arm
-         thickness) with long arms (32..480) so it reads as a "+",
-         not a stubby Red-Cross square. -->
-    <symbol id="g6-icon-plus" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M316 32 L316 196 L480 196 L480 316 L316 316 L316 480 L196 480 L196 316 L32 316 L32 196 L196 196 L196 32 Z"/>
-    </symbol>
-    <!-- ellipsis-vertical (unfold the floating toolbar).
-         The strip it stands for is a vertical stack, and a vertical
-         ellipsis is what "there is more of this here" is drawn as
-         everywhere else. -->
-    <symbol id="g6-icon-toolbar-show" viewBox="0 0 128 512">
-        <path fill="currentColor" d="M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z"/>
-    </symbol>
-    <!-- xmark (fold the floating toolbar away).
-         Not a chevron: the two toolbars sit on OPPOSITE edges, so a
-         direction would point the wrong way on one of them. What the
-         button does is close an overlay, and that is an x. -->
-    <symbol id="g6-icon-toolbar-hide" viewBox="0 0 384 512">
-        <path fill="currentColor" d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/>
-    </symbol>
-    <!-- dashed marquee (selection mode).
-         The band ITSELF, because that is what the button turns on: a
-         drag on the canvas draws one and a tap picks a card. Not the
-         fit-to-selection glyph next to it in the other toolbar -- that
-         one is solid brackets around a solid object and means "put the
-         camera on what is picked", which is the opposite end of the
-         gesture. Dashes: 16 segments of 59 with gaps of 36 over a
-         perimeter of 1520, so they land on the corners. -->
-    <symbol id="g6-icon-select-mode" viewBox="0 0 512 512">
-        <rect x="46" y="86" width="420" height="340" fill="none"
-            stroke="currentColor" stroke-width="40"
-            stroke-dasharray="59 36"/>
-    </symbol>
-    <!-- location-crosshairs (anchor the camera on one element).
-         The SAME path as the DOM toolbars and their yi-location-crosshairs
-         mask: the two toolbars sit in one console, and a control that
-         does one thing has to be drawn one way. -->
-    <symbol id="g6-icon-anchor" viewBox="0 0 576 512">
-        <path fill="currentColor" d="M288-16c17.7 0 32 14.3 32 32l0 18.3c98.1 14 175.7 91.6 189.7 189.7l18.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-18.3 0c-14 98.1-91.6 175.7-189.7 189.7l0 18.3c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-18.3C157.9 463.7 80.3 386.1 66.3 288L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l18.3 0C80.3 125.9 157.9 48.3 256 34.3L256 16c0-17.7 14.3-32 32-32zM128 256a160 160 0 1 0 320 0 160 160 0 1 0 -320 0zm160-96a96 96 0 1 1 0 192 96 96 0 1 1 0-192z"/>
-    </symbol>
-    <!-- floppy-disk (save) -->
-    <symbol id="g6-icon-save" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-242.7c0-17-6.7-33.3-18.7-45.3L352 50.7C340 38.7 323.7 32 306.7 32L64 32zm32 96c0-17.7 14.3-32 32-32l160 0c17.7 0 32 14.3 32 32l0 64c0 17.7-14.3 32-32 32l-160 0c-17.7 0-32-14.3-32-32l0-64zM224 288a64 64 0 1 1 0 128 64 64 0 1 1 0-128z"/>
-    </symbol>
-</svg>`;
-function inject_svg_icons() {
-	if (document.getElementById(CUSTOM_SVG_ICONS_ID)) return;
-	const div = document.createElement("div");
-	div.id = CUSTOM_SVG_ICONS_ID;
-	div.style.display = "none";
-	div.innerHTML = ICONS;
-	document.body.appendChild(div);
-}
-//#endregion
 //#region src/g6_brush_select_owned.js
 /***********************************************************************
 *          g6_brush_select_owned.js

package/dist/gobj-ui.es.js CHANGED Viewed

@@ -6806,6 +6806,7 @@ function build_form_field_conf(gobj, field_desc) {
 			field_conf.options = get_fkey_select_options(gobj, field_desc);
 			break;
 		case "image":
+		case "icon":
 		case "string":
 			field_conf.tag = "input";
 			field_conf.inputType = "text";
@@ -7723,6 +7724,7 @@ function template2columns(gobj, columns, template, sub_elements) {
 			case "hook": break;
 			case "fkey": break;
 			case "image":
+			case "icon":
 			case "string":
 				column.editor = "input";
 				column.editorParams = {
@@ -8161,6 +8163,7 @@ function treedb_value_2_form_value(gobj, field_desc, value) {
 		case "date":
 		case "color":
 		case "image":
+		case "icon":
 		case "tel":
 		case "template":
 		case "table":
@@ -8253,6 +8256,7 @@ function form_value_2_treedb_value(gobj, field_desc, value) {
 		case "date":
 		case "color":
 		case "image":
+		case "icon":
 		case "tel": break;
 		case "template":
 			if (is_string(value)) try {
@@ -22653,6 +22657,182 @@ function yui_table_filter_clear(table) {
 	});
 }
 //#endregion
+//#region src/lib_icons.js
+/*********************************************************
+*      lib_icons.js
+*
+*      Two icon systems are managed here:
+*
+*      1. FA-style CSS icons (yui_icons.css)
+*         Usage: <i class="yi-save"></i>
+*         Color: inherits currentColor from parent via CSS mask.
+*
+*      2. SVG symbol icons for G6 toolbar (and any other component
+*         that uses <use xlink:href="#id">).
+*         Symbols are injected once into the DOM.
+*         All symbol ids are prefixed with "g6-icon-" to avoid
+*         conflicts with other DOM elements.
+*         Icon paths come from:
+*           fontawesome-free-7.1.0-web/sprites/solid.svg
+*
+*         G6 toolbar items are managed via CSS class names (className
+*         field in getItems()) using YuiToolbar in c_g6_nodes_tree.js.
+*         This lets lib_graph.js state functions (set_submit_state,
+*         disableElements, …) work on toolbar icons exactly like on
+*         regular Bulma/FA buttons — no icon-specific helpers needed.
+*
+*      Copyright (c) 2025-2026, ArtGins.
+*      All Rights Reserved.
+*********************************************************/
+var CUSTOM_SVG_ICONS_ID = "g6-custom-svgicons";
+var ICONS = `<svg xmlns="http://www.w3.org/2000/svg">
+    <!-- magnifying-glass-plus -->
+    <symbol id="g6-icon-zoom-in" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376C296.3 401.1 253.9 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208zM208 112c-13.3 0-24 10.7-24 24l0 48-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l48 0 0 48c0 13.3 10.7 24 24 24s24-10.7 24-24l0-48 48 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-48 0 0-48c0-13.3-10.7-24-24-24z"/>
+    </symbol>
+    <!-- magnifying-glass-minus -->
+    <symbol id="g6-icon-zoom-out" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376C296.3 401.1 253.9 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208zM136 184c-13.3 0-24 10.7-24 24s10.7 24 24 24l144 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-144 0z"/>
+    </symbol>
+    <!-- house (reset zoom: back to original 100% view) -->
+    <symbol id="g6-icon-home" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M277.8 8.6c-12.3-11.4-31.3-11.4-43.5 0l-224 208c-9.6 9-12.8 22.9-8 35.1S18.8 272 32 272l16 0 0 176c0 35.3 28.7 64 64 64l288 0c35.3 0 64-28.7 64-64l0-176 16 0c13.2 0 25-8.1 29.8-20.3s1.6-26.2-8-35.1l-224-208zM240 320l32 0c26.5 0 48 21.5 48 48l0 96-128 0 0-96c0-26.5 21.5-48 48-48z"/>
+    </symbol>
+    <!-- expand (zoom to fit) -->
+    <symbol id="g6-icon-fit" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M32 32C14.3 32 0 46.3 0 64l0 96c0 17.7 14.3 32 32 32s32-14.3 32-32l0-64 64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 32zM64 352c0-17.7-14.3-32-32-32S0 334.3 0 352l0 96c0 17.7 14.3 32 32 32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0 0-64zM320 32c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0 0 64c0 17.7 14.3 32 32 32s32-14.3 32-32l0-96c0-17.7-14.3-32-32-32l-96 0zM448 352c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 64-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l96 0c17.7 0 32-14.3 32-32l0-96z"/>
+    </symbol>
+    <!-- fit to selection: the same corner brackets as the fit icon,
+         around a marked object. The two sit side by side in the
+         toolbar and have to read as a family, which a borrowed glyph
+         would not. (No backticks in here: the sprite lives inside a
+         template literal.) -->
+    <symbol id="g6-icon-fit-selection" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M32 32C14.3 32 0 46.3 0 64l0 96c0 17.7 14.3 32 32 32s32-14.3 32-32l0-64 64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 32zM64 352c0-17.7-14.3-32-32-32S0 334.3 0 352l0 96c0 17.7 14.3 32 32 32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0 0-64zM320 32c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0 0 64c0 17.7 14.3 32 32 32s32-14.3 32-32l0-96c0-17.7-14.3-32-32-32l-96 0zM448 352c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 64-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l96 0c17.7 0 32-14.3 32-32l0-96z"/>
+        <rect fill="currentColor" x="144" y="176" width="160" height="160" rx="24"/>
+    </symbol>
+    <!-- crosshairs (center) -->
+    <symbol id="g6-icon-center" viewBox="0 0 576 512">
+        <path fill="currentColor" d="M288-16c17.7 0 32 14.3 32 32l0 18.3c98.1 14 175.7 91.6 189.7 189.7l18.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-18.3 0c-14 98.1-91.6 175.7-189.7 189.7l0 18.3c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-18.3C157.9 463.7 80.3 386.1 66.3 288L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l18.3 0C80.3 125.9 157.9 48.3 256 34.3L256 16c0-17.7 14.3-32 32-32zM131.2 288c12.7 62.7 62.1 112.1 124.8 124.8l0-12.8c0-17.7 14.3-32 32-32s32 14.3 32 32l0 12.8c62.7-12.7 112.1-62.1 124.8-124.8L432 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l12.8 0C432.1 161.3 382.7 111.9 320 99.2l0 12.8c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-12.8C193.3 111.9 143.9 161.3 131.2 224l12.8 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-12.8 0zM288 208a48 48 0 1 1 0 96 48 48 0 1 1 0-96z"/>
+    </symbol>
+    <!-- up-right-and-down-left-from-center (enter fullscreen) -->
+    <symbol id="g6-icon-fullscreen" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M344 0L488 0c13.3 0 24 10.7 24 24l0 144c0 9.7-5.8 18.5-14.8 22.2s-19.3 1.7-26.2-5.2l-39-39-87 87c-9.4 9.4-24.6 9.4-33.9 0l-32-32c-9.4-9.4-9.4-24.6 0-33.9l87-87-39-39c-6.9-6.9-8.9-17.2-5.2-26.2S334.3 0 344 0zM168 512L24 512c-13.3 0-24-10.7-24-24L0 344c0-9.7 5.8-18.5 14.8-22.2S34.1 320.2 41 327l39 39 87-87c9.4-9.4 24.6-9.4 33.9 0l32 32c9.4 9.4 9.4 24.6 0 33.9l-87 87 39 39c6.9 6.9 8.9 17.2 5.2 26.2S177.7 512 168 512z"/>
+    </symbol>
+    <!-- down-left-and-up-right-to-center (exit fullscreen) -->
+    <symbol id="g6-icon-fullscreen-exit" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M439.5 7c9.4-9.4 24.6-9.4 33.9 0l32 32c9.4 9.4 9.4 24.6 0 33.9l-87 87 39 39c6.9 6.9 8.9 17.2 5.2 26.2S450.2 240 440.5 240l-144 0c-13.3 0-24-10.7-24-24l0-144c0-9.7 5.8-18.5 14.8-22.2s19.3-1.7 26.2 5.2l39 39 87-87zM72.5 272l144 0c13.3 0 24 10.7 24 24l0 144c0 9.7-5.8 18.5-14.8 22.2s-19.3 1.7-26.2-5.2l-39-39-87 87c-9.4 9.4-24.6 9.4-33.9 0l-32-32c-9.4-9.4-9.4-24.6 0-33.9l87-87-39-39c-6.9-6.9-8.9-17.2-5.2-26.2S62.8 272 72.5 272z"/>
+    </symbol>
+    <!-- arrow-rotate-left (undo) -->
+    <symbol id="g6-icon-undo" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M256 64c-56.8 0-107.9 24.7-143.1 64l47.1 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 192c-17.7 0-32-14.3-32-32L0 32C0 14.3 14.3 0 32 0S64 14.3 64 32l0 54.7C110.9 33.6 179.5 0 256 0 397.4 0 512 114.6 512 256S397.4 512 256 512c-87 0-163.9-43.4-210.1-109.7-10.1-14.5-6.6-34.4 7.9-44.6s34.4-6.6 44.6 7.9c34.8 49.8 92.4 82.3 157.6 82.3 106 0 192-86 192-192S362 64 256 64z"/>
+    </symbol>
+    <!-- arrow-rotate-right (redo) -->
+    <symbol id="g6-icon-redo" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M436.7 74.7L448 85.4 448 32c0-17.7 14.3-32 32-32s32 14.3 32 32l0 128c0 17.7-14.3 32-32 32l-128 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l47.9 0-7.6-7.2c-.2-.2-.4-.4-.6-.6-75-75-196.5-75-271.5 0s-75 196.5 0 271.5 196.5 75 271.5 0c8.2-8.2 15.5-16.9 21.9-26.1 10.1-14.5 30.1-18 44.6-7.9s18 30.1 7.9 44.6c-8.5 12.2-18.2 23.8-29.1 34.7-100 100-262.1 100-362 0S-25 175 75 75c99.9-99.9 261.7-100 361.7-.3z"/>
+    </symbol>
+    <!-- pen (edit node) -->
+    <symbol id="g6-icon-edit" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M352.9 21.2L308 66.1 445.9 204 490.8 159.1C504.4 145.6 512 127.2 512 108s-7.6-37.6-21.2-51.1L455.1 21.2C441.6 7.6 423.2 0 404 0s-37.6 7.6-51.1 21.2zM274.1 100L58.9 315.1c-10.7 10.7-18.5 24.1-22.6 38.7L.9 481.6c-2.3 8.3 0 17.3 6.2 23.4s15.1 8.5 23.4 6.2l127.8-35.5c14.6-4.1 27.9-11.8 38.7-22.6L412 237.9 274.1 100z"/>
+    </symbol>
+    <!-- trash-can (delete) -->
+    <symbol id="g6-icon-delete" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M136.7 5.9C141.1-7.2 153.3-16 167.1-16l113.9 0c13.8 0 26 8.8 30.4 21.9L320 32 416 32c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 96C14.3 96 0 81.7 0 64S14.3 32 32 32l96 0 8.7-26.1zM32 144l384 0 0 304c0 35.3-28.7 64-64 64L96 512c-35.3 0-64-28.7-64-64l0-304zm88 64c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24zm104 0c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24zm104 0c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24z"/>
+    </symbol>
+    <!-- link (link nodes) -->
+    <symbol id="g6-icon-link" viewBox="0 0 576 512">
+        <path fill="currentColor" d="M419.5 96c-16.6 0-32.7 4.5-46.8 12.7-15.8-16-34.2-29.4-54.5-39.5 28.2-24 64.1-37.2 101.3-37.2 86.4 0 156.5 70 156.5 156.5 0 41.5-16.5 81.3-45.8 110.6l-71.1 71.1c-29.3 29.3-69.1 45.8-110.6 45.8-86.4 0-156.5-70-156.5-156.5 0-1.5 0-3 .1-4.5 .5-17.7 15.2-31.6 32.9-31.1s31.6 15.2 31.1 32.9c0 .9 0 1.8 0 2.6 0 51.1 41.4 92.5 92.5 92.5 24.5 0 48-9.7 65.4-27.1l71.1-71.1c17.3-17.3 27.1-40.9 27.1-65.4 0-51.1-41.4-92.5-92.5-92.5zM275.2 173.3c-1.9-.8-3.8-1.9-5.5-3.1-12.6-6.5-27-10.2-42.1-10.2-24.5 0-48 9.7-65.4 27.1L91.1 258.2c-17.3 17.3-27.1 40.9-27.1 65.4 0 51.1 41.4 92.5 92.5 92.5 16.5 0 32.6-4.4 46.7-12.6 15.8 16 34.2 29.4 54.6 39.5-28.2 23.9-64 37.2-101.3 37.2-86.4 0-156.5-70-156.5-156.5 0-41.5 16.5-81.3 45.8-110.6l71.1-71.1c29.3-29.3 69.1-45.8 110.6-45.8 86.6 0 156.5 70.6 156.5 156.9 0 1.3 0 2.6 0 3.9-.4 17.7-15.1 31.6-32.8 31.2s-31.6-15.1-31.2-32.8c0-.8 0-1.5 0-2.3 0-33.7-18-63.3-44.8-79.6z"/>
+    </symbol>
+    <!-- link-slash (unlink) -->
+    <symbol id="g6-icon-unlink" viewBox="0 0 576 512">
+        <path fill="currentColor" d="M41-24.9c-9.4-9.4-24.6-9.4-33.9 0S-2.3-.3 7 9.1l528 528c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-122-122c4.2-3.4 8.3-7.1 12.1-10.9l71.1-71.1c29.3-29.3 45.8-69.1 45.8-110.6 0-86.4-70-156.5-156.5-156.5-37.3 0-73.1 13.3-101.3 37.2 20.3 10.1 38.7 23.5 54.5 39.5 14.1-8.3 30.2-12.7 46.8-12.7 51.1 0 92.5 41.4 92.5 92.5 0 24.5-9.7 48-27.1 65.4l-71.1 71.1c-3.9 3.9-8.1 7.4-12.6 10.5l-47.5-47.5c16.5-.9 29.7-14.4 30.2-31.1 0-1.3 0-2.6 0-3.9 0-86.3-69.9-156.9-156.5-156.9-19.2 0-37.9 3.5-55.5 10.2L41-24.9zM225.9 160c.6 0 1.1 0 1.7 0 15.1 0 29.5 3.7 42.1 10.2 1.8 1.2 3.6 2.3 5.5 3.1 26.8 16.3 44.8 45.9 44.8 79.6 0 .4 0 .8 0 1.2L225.9 160zM346.2 416L192 261.8c1.2 84.6 69.6 152.9 154.1 154.1zM139.7 209.5l-45.3-45.3-48.6 48.6c-29.3 29.3-45.8 69.1-45.8 110.6 0 86.4 70 156.5 156.5 156.5 37.2 0 73.1-13.3 101.3-37.2-20.3-10.1-38.8-23.5-54.6-39.5-14 8.2-30.1 12.6-46.7 12.6-51.1 0-92.5-41.4-92.5-92.5 0-24.5 9.7-48 27.1-65.4l48.6-48.6z"/>
+    </symbol>
+    <!-- play (run node) -->
+    <symbol id="g6-icon-run" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M91.2 36.9c-12.4-6.8-27.4-6.5-39.6 .7S32 57.9 32 72l0 368c0 14.1 7.5 27.2 19.6 34.4s27.2 7.5 39.6 .7l336-184c12.8-7 20.8-20.5 20.8-35.1s-8-28.1-20.8-35.1l-336-184z"/>
+    </symbol>
+    <!-- clone (copy size to other nodes/ports) -->
+    <symbol id="g6-icon-resize" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M288 448l-224 0 0-224 48 0 0-64-48 0c-35.3 0-64 28.7-64 64L0 448c0 35.3 28.7 64 64 64l224 0c35.3 0 64-28.7 64-64l0-48-64 0 0 48zm-64-96l224 0c35.3 0 64-28.7 64-64l0-224c0-35.3-28.7-64-64-64L224 0c-35.3 0-64 28.7-64 64l0 224c0 35.3 28.7 64 64 64z"/>
+    </symbol>
+    <!-- plus (create node). Deliberately NOT the FA7 solid plus:
+         its arms are ~14% of the width and read thin next to the
+         other solid glyphs. Bold geometric plus (~23% arm
+         thickness) with long arms (32..480) so it reads as a "+",
+         not a stubby Red-Cross square. -->
+    <symbol id="g6-icon-plus" viewBox="0 0 512 512">
+        <path fill="currentColor" d="M316 32 L316 196 L480 196 L480 316 L316 316 L316 480 L196 480 L196 316 L32 316 L32 196 L196 196 L196 32 Z"/>
+    </symbol>
+    <!-- ellipsis-vertical (unfold the floating toolbar).
+         The strip it stands for is a vertical stack, and a vertical
+         ellipsis is what "there is more of this here" is drawn as
+         everywhere else. -->
+    <symbol id="g6-icon-toolbar-show" viewBox="0 0 128 512">
+        <path fill="currentColor" d="M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z"/>
+    </symbol>
+    <!-- xmark (fold the floating toolbar away).
+         Not a chevron: the two toolbars sit on OPPOSITE edges, so a
+         direction would point the wrong way on one of them. What the
+         button does is close an overlay, and that is an x. -->
+    <symbol id="g6-icon-toolbar-hide" viewBox="0 0 384 512">
+        <path fill="currentColor" d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/>
+    </symbol>
+    <!-- dashed marquee (selection mode).
+         The band ITSELF, because that is what the button turns on: a
+         drag on the canvas draws one and a tap picks a card. Not the
+         fit-to-selection glyph next to it in the other toolbar -- that
+         one is solid brackets around a solid object and means "put the
+         camera on what is picked", which is the opposite end of the
+         gesture. Dashes: 16 segments of 59 with gaps of 36 over a
+         perimeter of 1520, so they land on the corners. -->
+    <symbol id="g6-icon-select-mode" viewBox="0 0 512 512">
+        <rect x="46" y="86" width="420" height="340" fill="none"
+            stroke="currentColor" stroke-width="40"
+            stroke-dasharray="59 36"/>
+    </symbol>
+    <!-- location-crosshairs (anchor the camera on one element).
+         The SAME path as the DOM toolbars and their yi-location-crosshairs
+         mask: the two toolbars sit in one console, and a control that
+         does one thing has to be drawn one way. -->
+    <symbol id="g6-icon-anchor" viewBox="0 0 576 512">
+        <path fill="currentColor" d="M288-16c17.7 0 32 14.3 32 32l0 18.3c98.1 14 175.7 91.6 189.7 189.7l18.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-18.3 0c-14 98.1-91.6 175.7-189.7 189.7l0 18.3c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-18.3C157.9 463.7 80.3 386.1 66.3 288L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l18.3 0C80.3 125.9 157.9 48.3 256 34.3L256 16c0-17.7 14.3-32 32-32zM128 256a160 160 0 1 0 320 0 160 160 0 1 0 -320 0zm160-96a96 96 0 1 1 0 192 96 96 0 1 1 0-192z"/>
+    </symbol>
+    <!-- floppy-disk (save) -->
+    <symbol id="g6-icon-save" viewBox="0 0 448 512">
+        <path fill="currentColor" d="M64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-242.7c0-17-6.7-33.3-18.7-45.3L352 50.7C340 38.7 323.7 32 306.7 32L64 32zm32 96c0-17.7 14.3-32 32-32l160 0c17.7 0 32 14.3 32 32l0 64c0 17.7-14.3 32-32 32l-160 0c-17.7 0-32-14.3-32-32l0-64zM224 288a64 64 0 1 1 0 128 64 64 0 1 1 0-128z"/>
+    </symbol>
+</svg>`;
+function inject_svg_icons() {
+	if (document.getElementById(CUSTOM_SVG_ICONS_ID)) return;
+	const div = document.createElement("div");
+	div.id = CUSTOM_SVG_ICONS_ID;
+	div.style.display = "none";
+	div.innerHTML = ICONS;
+	document.body.appendChild(div);
+}
+var __icon_defined__ = {};
+function yui_icon_is_defined(name) {
+	if (!name || typeof name !== "string") return false;
+	if (__icon_defined__[name] !== void 0) return __icon_defined__[name];
+	let defined = false;
+	try {
+		const el = document.createElement("i");
+		el.className = name;
+		el.style.position = "absolute";
+		el.style.visibility = "hidden";
+		el.style.pointerEvents = "none";
+		document.body.appendChild(el);
+		const st = window.getComputedStyle(el, "::before");
+		const mask = st.maskImage || st.webkitMaskImage || "";
+		defined = !!mask && mask !== "none";
+		document.body.removeChild(el);
+	} catch (e) {
+		defined = false;
+	}
+	__icon_defined__[name] = defined;
+	return defined;
+}
+//#endregion
 //#region src/yui_row_search.js
 /***********************************************************************
 *          yui_row_search.js
@@ -23733,6 +23913,11 @@ function create_tabulator(gobj) {
 				hozAlign = "center";
 				colFormatter = "color";
 				break;
+			case "icon":
+				hozAlign = "center";
+				vertAlign = "middle";
+				colFormatter = icon_formatter;
+				break;
 			case "object":
 			case "dict":
 			case "template":
@@ -23956,6 +24141,39 @@ function table__destroy(gobj) {
 	}
 }
 /************************************************************
+*  Cell of a col flagged `icon`: the value is the NAME of an
+*  icon of the app's set ("yi-bolt"), so it is DRAWN.
+*
+*  Built as a DOM node and not as an HTML string: the value is
+*  raw record data and must never be parsed as markup -- and
+*  here it also becomes a CSS class, so it is filtered to the
+*  shape of a class name before it gets near one.
+*
+*  A name the set does not carry falls back to the TEXT of it.
+*  The catch-all rule `[class^="yi-"]::before` paints a
+*  currentColor box for any name, so drawing it anyway would
+*  render a solid square -- a glyph nobody recognises rather
+*  than a mistake somebody can fix.
+************************************************************/
+function icon_formatter(cell) {
+	let name = cell.getValue();
+	if (!is_string(name) || empty_string(name)) return "";
+	name = name.trim();
+	if (!/^[a-z0-9-]+$/.test(name) || !yui_icon_is_defined(name)) return createElement2([
+		"span",
+		{
+			class: "ICON_CELL_UNKNOWN is-size-7 has-text-grey",
+			title: name
+		},
+		name
+	]);
+	return createElement2(["span", {
+		class: `ICON_CELL ${name}`,
+		title: name,
+		"aria-label": name
+	}]);
+}
+/************************************************************
 *  Cell of a col holding a JSON document (dict/list/blob/
 *  template/coordinates/…): a one-line truncated preview,
 *  marked as a link because the click opens the whole value
@@ -24067,6 +24285,7 @@ function transform__treedb_value_2_table_value(gobj, col, value, row, field) {
 			}
 			break;
 		case "color": break;
+		case "icon": break;
 		case "image": break;
 		default: log_error(`transform__treedb_value_2_table_value() unhandled type '${field_desc.type}' (real_type='${field_desc.real_type}') for field '${field}', topic ${priv.topic_name}`);
 	}
@@ -52400,160 +52619,6 @@ Sector.PARSED_STYLE_LIST = new Set([].concat(_toConsumableArray(Path.PARSED_STYL
 	"endAngle"
 ]));
 //#endregion
-//#region src/lib_icons.js
-/*********************************************************
-*      lib_icons.js
-*
-*      Two icon systems are managed here:
-*
-*      1. FA-style CSS icons (yui_icons.css)
-*         Usage: <i class="yi-save"></i>
-*         Color: inherits currentColor from parent via CSS mask.
-*
-*      2. SVG symbol icons for G6 toolbar (and any other component
-*         that uses <use xlink:href="#id">).
-*         Symbols are injected once into the DOM.
-*         All symbol ids are prefixed with "g6-icon-" to avoid
-*         conflicts with other DOM elements.
-*         Icon paths come from:
-*           fontawesome-free-7.1.0-web/sprites/solid.svg
-*
-*         G6 toolbar items are managed via CSS class names (className
-*         field in getItems()) using YuiToolbar in c_g6_nodes_tree.js.
-*         This lets lib_graph.js state functions (set_submit_state,
-*         disableElements, …) work on toolbar icons exactly like on
-*         regular Bulma/FA buttons — no icon-specific helpers needed.
-*
-*      Copyright (c) 2025-2026, ArtGins.
-*      All Rights Reserved.
-*********************************************************/
-var CUSTOM_SVG_ICONS_ID = "g6-custom-svgicons";
-var ICONS = `<svg xmlns="http://www.w3.org/2000/svg">
-    <!-- magnifying-glass-plus -->
-    <symbol id="g6-icon-zoom-in" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376C296.3 401.1 253.9 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208zM208 112c-13.3 0-24 10.7-24 24l0 48-48 0c-13.3 0-24 10.7-24 24s10.7 24 24 24l48 0 0 48c0 13.3 10.7 24 24 24s24-10.7 24-24l0-48 48 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-48 0 0-48c0-13.3-10.7-24-24-24z"/>
-    </symbol>
-    <!-- magnifying-glass-minus -->
-    <symbol id="g6-icon-zoom-out" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376C296.3 401.1 253.9 416 208 416 93.1 416 0 322.9 0 208S93.1 0 208 0 416 93.1 416 208zM136 184c-13.3 0-24 10.7-24 24s10.7 24 24 24l144 0c13.3 0 24-10.7 24-24s-10.7-24-24-24l-144 0z"/>
-    </symbol>
-    <!-- house (reset zoom: back to original 100% view) -->
-    <symbol id="g6-icon-home" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M277.8 8.6c-12.3-11.4-31.3-11.4-43.5 0l-224 208c-9.6 9-12.8 22.9-8 35.1S18.8 272 32 272l16 0 0 176c0 35.3 28.7 64 64 64l288 0c35.3 0 64-28.7 64-64l0-176 16 0c13.2 0 25-8.1 29.8-20.3s1.6-26.2-8-35.1l-224-208zM240 320l32 0c26.5 0 48 21.5 48 48l0 96-128 0 0-96c0-26.5 21.5-48 48-48z"/>
-    </symbol>
-    <!-- expand (zoom to fit) -->
-    <symbol id="g6-icon-fit" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M32 32C14.3 32 0 46.3 0 64l0 96c0 17.7 14.3 32 32 32s32-14.3 32-32l0-64 64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 32zM64 352c0-17.7-14.3-32-32-32S0 334.3 0 352l0 96c0 17.7 14.3 32 32 32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0 0-64zM320 32c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0 0 64c0 17.7 14.3 32 32 32s32-14.3 32-32l0-96c0-17.7-14.3-32-32-32l-96 0zM448 352c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 64-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l96 0c17.7 0 32-14.3 32-32l0-96z"/>
-    </symbol>
-    <!-- fit to selection: the same corner brackets as the fit icon,
-         around a marked object. The two sit side by side in the
-         toolbar and have to read as a family, which a borrowed glyph
-         would not. (No backticks in here: the sprite lives inside a
-         template literal.) -->
-    <symbol id="g6-icon-fit-selection" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M32 32C14.3 32 0 46.3 0 64l0 96c0 17.7 14.3 32 32 32s32-14.3 32-32l0-64 64 0c17.7 0 32-14.3 32-32s-14.3-32-32-32L32 32zM64 352c0-17.7-14.3-32-32-32S0 334.3 0 352l0 96c0 17.7 14.3 32 32 32l96 0c17.7 0 32-14.3 32-32s-14.3-32-32-32l-64 0 0-64zM320 32c-17.7 0-32 14.3-32 32s14.3 32 32 32l64 0 0 64c0 17.7 14.3 32 32 32s32-14.3 32-32l0-96c0-17.7-14.3-32-32-32l-96 0zM448 352c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 64-64 0c-17.7 0-32 14.3-32 32s14.3 32 32 32l96 0c17.7 0 32-14.3 32-32l0-96z"/>
-        <rect fill="currentColor" x="144" y="176" width="160" height="160" rx="24"/>
-    </symbol>
-    <!-- crosshairs (center) -->
-    <symbol id="g6-icon-center" viewBox="0 0 576 512">
-        <path fill="currentColor" d="M288-16c17.7 0 32 14.3 32 32l0 18.3c98.1 14 175.7 91.6 189.7 189.7l18.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-18.3 0c-14 98.1-91.6 175.7-189.7 189.7l0 18.3c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-18.3C157.9 463.7 80.3 386.1 66.3 288L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l18.3 0C80.3 125.9 157.9 48.3 256 34.3L256 16c0-17.7 14.3-32 32-32zM131.2 288c12.7 62.7 62.1 112.1 124.8 124.8l0-12.8c0-17.7 14.3-32 32-32s32 14.3 32 32l0 12.8c62.7-12.7 112.1-62.1 124.8-124.8L432 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l12.8 0C432.1 161.3 382.7 111.9 320 99.2l0 12.8c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-12.8C193.3 111.9 143.9 161.3 131.2 224l12.8 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-12.8 0zM288 208a48 48 0 1 1 0 96 48 48 0 1 1 0-96z"/>
-    </symbol>
-    <!-- up-right-and-down-left-from-center (enter fullscreen) -->
-    <symbol id="g6-icon-fullscreen" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M344 0L488 0c13.3 0 24 10.7 24 24l0 144c0 9.7-5.8 18.5-14.8 22.2s-19.3 1.7-26.2-5.2l-39-39-87 87c-9.4 9.4-24.6 9.4-33.9 0l-32-32c-9.4-9.4-9.4-24.6 0-33.9l87-87-39-39c-6.9-6.9-8.9-17.2-5.2-26.2S334.3 0 344 0zM168 512L24 512c-13.3 0-24-10.7-24-24L0 344c0-9.7 5.8-18.5 14.8-22.2S34.1 320.2 41 327l39 39 87-87c9.4-9.4 24.6-9.4 33.9 0l32 32c9.4 9.4 9.4 24.6 0 33.9l-87 87 39 39c6.9 6.9 8.9 17.2 5.2 26.2S177.7 512 168 512z"/>
-    </symbol>
-    <!-- down-left-and-up-right-to-center (exit fullscreen) -->
-    <symbol id="g6-icon-fullscreen-exit" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M439.5 7c9.4-9.4 24.6-9.4 33.9 0l32 32c9.4 9.4 9.4 24.6 0 33.9l-87 87 39 39c6.9 6.9 8.9 17.2 5.2 26.2S450.2 240 440.5 240l-144 0c-13.3 0-24-10.7-24-24l0-144c0-9.7 5.8-18.5 14.8-22.2s19.3-1.7 26.2 5.2l39 39 87-87zM72.5 272l144 0c13.3 0 24 10.7 24 24l0 144c0 9.7-5.8 18.5-14.8 22.2s-19.3 1.7-26.2-5.2l-39-39-87 87c-9.4 9.4-24.6 9.4-33.9 0l-32-32c-9.4-9.4-9.4-24.6 0-33.9l87-87-39-39c-6.9-6.9-8.9-17.2-5.2-26.2S62.8 272 72.5 272z"/>
-    </symbol>
-    <!-- arrow-rotate-left (undo) -->
-    <symbol id="g6-icon-undo" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M256 64c-56.8 0-107.9 24.7-143.1 64l47.1 0c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 192c-17.7 0-32-14.3-32-32L0 32C0 14.3 14.3 0 32 0S64 14.3 64 32l0 54.7C110.9 33.6 179.5 0 256 0 397.4 0 512 114.6 512 256S397.4 512 256 512c-87 0-163.9-43.4-210.1-109.7-10.1-14.5-6.6-34.4 7.9-44.6s34.4-6.6 44.6 7.9c34.8 49.8 92.4 82.3 157.6 82.3 106 0 192-86 192-192S362 64 256 64z"/>
-    </symbol>
-    <!-- arrow-rotate-right (redo) -->
-    <symbol id="g6-icon-redo" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M436.7 74.7L448 85.4 448 32c0-17.7 14.3-32 32-32s32 14.3 32 32l0 128c0 17.7-14.3 32-32 32l-128 0c-17.7 0-32-14.3-32-32s14.3-32 32-32l47.9 0-7.6-7.2c-.2-.2-.4-.4-.6-.6-75-75-196.5-75-271.5 0s-75 196.5 0 271.5 196.5 75 271.5 0c8.2-8.2 15.5-16.9 21.9-26.1 10.1-14.5 30.1-18 44.6-7.9s18 30.1 7.9 44.6c-8.5 12.2-18.2 23.8-29.1 34.7-100 100-262.1 100-362 0S-25 175 75 75c99.9-99.9 261.7-100 361.7-.3z"/>
-    </symbol>
-    <!-- pen (edit node) -->
-    <symbol id="g6-icon-edit" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M352.9 21.2L308 66.1 445.9 204 490.8 159.1C504.4 145.6 512 127.2 512 108s-7.6-37.6-21.2-51.1L455.1 21.2C441.6 7.6 423.2 0 404 0s-37.6 7.6-51.1 21.2zM274.1 100L58.9 315.1c-10.7 10.7-18.5 24.1-22.6 38.7L.9 481.6c-2.3 8.3 0 17.3 6.2 23.4s15.1 8.5 23.4 6.2l127.8-35.5c14.6-4.1 27.9-11.8 38.7-22.6L412 237.9 274.1 100z"/>
-    </symbol>
-    <!-- trash-can (delete) -->
-    <symbol id="g6-icon-delete" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M136.7 5.9C141.1-7.2 153.3-16 167.1-16l113.9 0c13.8 0 26 8.8 30.4 21.9L320 32 416 32c17.7 0 32 14.3 32 32s-14.3 32-32 32L32 96C14.3 96 0 81.7 0 64S14.3 32 32 32l96 0 8.7-26.1zM32 144l384 0 0 304c0 35.3-28.7 64-64 64L96 512c-35.3 0-64-28.7-64-64l0-304zm88 64c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24zm104 0c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24zm104 0c-13.3 0-24 10.7-24 24l0 192c0 13.3 10.7 24 24 24s24-10.7 24-24l0-192c0-13.3-10.7-24-24-24z"/>
-    </symbol>
-    <!-- link (link nodes) -->
-    <symbol id="g6-icon-link" viewBox="0 0 576 512">
-        <path fill="currentColor" d="M419.5 96c-16.6 0-32.7 4.5-46.8 12.7-15.8-16-34.2-29.4-54.5-39.5 28.2-24 64.1-37.2 101.3-37.2 86.4 0 156.5 70 156.5 156.5 0 41.5-16.5 81.3-45.8 110.6l-71.1 71.1c-29.3 29.3-69.1 45.8-110.6 45.8-86.4 0-156.5-70-156.5-156.5 0-1.5 0-3 .1-4.5 .5-17.7 15.2-31.6 32.9-31.1s31.6 15.2 31.1 32.9c0 .9 0 1.8 0 2.6 0 51.1 41.4 92.5 92.5 92.5 24.5 0 48-9.7 65.4-27.1l71.1-71.1c17.3-17.3 27.1-40.9 27.1-65.4 0-51.1-41.4-92.5-92.5-92.5zM275.2 173.3c-1.9-.8-3.8-1.9-5.5-3.1-12.6-6.5-27-10.2-42.1-10.2-24.5 0-48 9.7-65.4 27.1L91.1 258.2c-17.3 17.3-27.1 40.9-27.1 65.4 0 51.1 41.4 92.5 92.5 92.5 16.5 0 32.6-4.4 46.7-12.6 15.8 16 34.2 29.4 54.6 39.5-28.2 23.9-64 37.2-101.3 37.2-86.4 0-156.5-70-156.5-156.5 0-41.5 16.5-81.3 45.8-110.6l71.1-71.1c29.3-29.3 69.1-45.8 110.6-45.8 86.6 0 156.5 70.6 156.5 156.9 0 1.3 0 2.6 0 3.9-.4 17.7-15.1 31.6-32.8 31.2s-31.6-15.1-31.2-32.8c0-.8 0-1.5 0-2.3 0-33.7-18-63.3-44.8-79.6z"/>
-    </symbol>
-    <!-- link-slash (unlink) -->
-    <symbol id="g6-icon-unlink" viewBox="0 0 576 512">
-        <path fill="currentColor" d="M41-24.9c-9.4-9.4-24.6-9.4-33.9 0S-2.3-.3 7 9.1l528 528c9.4 9.4 24.6 9.4 33.9 0s9.4-24.6 0-33.9l-122-122c4.2-3.4 8.3-7.1 12.1-10.9l71.1-71.1c29.3-29.3 45.8-69.1 45.8-110.6 0-86.4-70-156.5-156.5-156.5-37.3 0-73.1 13.3-101.3 37.2 20.3 10.1 38.7 23.5 54.5 39.5 14.1-8.3 30.2-12.7 46.8-12.7 51.1 0 92.5 41.4 92.5 92.5 0 24.5-9.7 48-27.1 65.4l-71.1 71.1c-3.9 3.9-8.1 7.4-12.6 10.5l-47.5-47.5c16.5-.9 29.7-14.4 30.2-31.1 0-1.3 0-2.6 0-3.9 0-86.3-69.9-156.9-156.5-156.9-19.2 0-37.9 3.5-55.5 10.2L41-24.9zM225.9 160c.6 0 1.1 0 1.7 0 15.1 0 29.5 3.7 42.1 10.2 1.8 1.2 3.6 2.3 5.5 3.1 26.8 16.3 44.8 45.9 44.8 79.6 0 .4 0 .8 0 1.2L225.9 160zM346.2 416L192 261.8c1.2 84.6 69.6 152.9 154.1 154.1zM139.7 209.5l-45.3-45.3-48.6 48.6c-29.3 29.3-45.8 69.1-45.8 110.6 0 86.4 70 156.5 156.5 156.5 37.2 0 73.1-13.3 101.3-37.2-20.3-10.1-38.8-23.5-54.6-39.5-14 8.2-30.1 12.6-46.7 12.6-51.1 0-92.5-41.4-92.5-92.5 0-24.5 9.7-48 27.1-65.4l48.6-48.6z"/>
-    </symbol>
-    <!-- play (run node) -->
-    <symbol id="g6-icon-run" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M91.2 36.9c-12.4-6.8-27.4-6.5-39.6 .7S32 57.9 32 72l0 368c0 14.1 7.5 27.2 19.6 34.4s27.2 7.5 39.6 .7l336-184c12.8-7 20.8-20.5 20.8-35.1s-8-28.1-20.8-35.1l-336-184z"/>
-    </symbol>
-    <!-- clone (copy size to other nodes/ports) -->
-    <symbol id="g6-icon-resize" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M288 448l-224 0 0-224 48 0 0-64-48 0c-35.3 0-64 28.7-64 64L0 448c0 35.3 28.7 64 64 64l224 0c35.3 0 64-28.7 64-64l0-48-64 0 0 48zm-64-96l224 0c35.3 0 64-28.7 64-64l0-224c0-35.3-28.7-64-64-64L224 0c-35.3 0-64 28.7-64 64l0 224c0 35.3 28.7 64 64 64z"/>
-    </symbol>
-    <!-- plus (create node). Deliberately NOT the FA7 solid plus:
-         its arms are ~14% of the width and read thin next to the
-         other solid glyphs. Bold geometric plus (~23% arm
-         thickness) with long arms (32..480) so it reads as a "+",
-         not a stubby Red-Cross square. -->
-    <symbol id="g6-icon-plus" viewBox="0 0 512 512">
-        <path fill="currentColor" d="M316 32 L316 196 L480 196 L480 316 L316 316 L316 480 L196 480 L196 316 L32 316 L32 196 L196 196 L196 32 Z"/>
-    </symbol>
-    <!-- ellipsis-vertical (unfold the floating toolbar).
-         The strip it stands for is a vertical stack, and a vertical
-         ellipsis is what "there is more of this here" is drawn as
-         everywhere else. -->
-    <symbol id="g6-icon-toolbar-show" viewBox="0 0 128 512">
-        <path fill="currentColor" d="M64 360a56 56 0 1 0 0 112 56 56 0 1 0 0-112zm0-160a56 56 0 1 0 0 112 56 56 0 1 0 0-112zM120 96A56 56 0 1 0 8 96a56 56 0 1 0 112 0z"/>
-    </symbol>
-    <!-- xmark (fold the floating toolbar away).
-         Not a chevron: the two toolbars sit on OPPOSITE edges, so a
-         direction would point the wrong way on one of them. What the
-         button does is close an overlay, and that is an x. -->
-    <symbol id="g6-icon-toolbar-hide" viewBox="0 0 384 512">
-        <path fill="currentColor" d="M342.6 150.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L192 210.7 86.6 105.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3L146.7 256 41.4 361.4c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L192 301.3 297.4 406.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L237.3 256 342.6 150.6z"/>
-    </symbol>
-    <!-- dashed marquee (selection mode).
-         The band ITSELF, because that is what the button turns on: a
-         drag on the canvas draws one and a tap picks a card. Not the
-         fit-to-selection glyph next to it in the other toolbar -- that
-         one is solid brackets around a solid object and means "put the
-         camera on what is picked", which is the opposite end of the
-         gesture. Dashes: 16 segments of 59 with gaps of 36 over a
-         perimeter of 1520, so they land on the corners. -->
-    <symbol id="g6-icon-select-mode" viewBox="0 0 512 512">
-        <rect x="46" y="86" width="420" height="340" fill="none"
-            stroke="currentColor" stroke-width="40"
-            stroke-dasharray="59 36"/>
-    </symbol>
-    <!-- location-crosshairs (anchor the camera on one element).
-         The SAME path as the DOM toolbars and their yi-location-crosshairs
-         mask: the two toolbars sit in one console, and a control that
-         does one thing has to be drawn one way. -->
-    <symbol id="g6-icon-anchor" viewBox="0 0 576 512">
-        <path fill="currentColor" d="M288-16c17.7 0 32 14.3 32 32l0 18.3c98.1 14 175.7 91.6 189.7 189.7l18.3 0c17.7 0 32 14.3 32 32s-14.3 32-32 32l-18.3 0c-14 98.1-91.6 175.7-189.7 189.7l0 18.3c0 17.7-14.3 32-32 32s-32-14.3-32-32l0-18.3C157.9 463.7 80.3 386.1 66.3 288L48 288c-17.7 0-32-14.3-32-32s14.3-32 32-32l18.3 0C80.3 125.9 157.9 48.3 256 34.3L256 16c0-17.7 14.3-32 32-32zM128 256a160 160 0 1 0 320 0 160 160 0 1 0 -320 0zm160-96a96 96 0 1 1 0 192 96 96 0 1 1 0-192z"/>
-    </symbol>
-    <!-- floppy-disk (save) -->
-    <symbol id="g6-icon-save" viewBox="0 0 448 512">
-        <path fill="currentColor" d="M64 32C28.7 32 0 60.7 0 96L0 416c0 35.3 28.7 64 64 64l320 0c35.3 0 64-28.7 64-64l0-242.7c0-17-6.7-33.3-18.7-45.3L352 50.7C340 38.7 323.7 32 306.7 32L64 32zm32 96c0-17.7 14.3-32 32-32l160 0c17.7 0 32 14.3 32 32l0 64c0 17.7-14.3 32-32 32l-160 0c-17.7 0-32-14.3-32-32l0-64zM224 288a64 64 0 1 1 0 128 64 64 0 1 1 0-128z"/>
-    </symbol>
-</svg>`;
-function inject_svg_icons() {
-	if (document.getElementById(CUSTOM_SVG_ICONS_ID)) return;
-	const div = document.createElement("div");
-	div.id = CUSTOM_SVG_ICONS_ID;
-	div.style.display = "none";
-	div.innerHTML = ICONS;
-	document.body.appendChild(div);
-}
-//#endregion
 //#region src/g6_brush_select_owned.js
 /***********************************************************************
 *          g6_brush_select_owned.js

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@yuneta/gobj-ui",
-  "version": "7.23.52",
+  "version": "7.23.53",
   "type": "module",
   "main": "dist/gobj-ui.cjs.js",
   "module": "dist/gobj-ui.es.js",
@@ -29,7 +29,7 @@
   "devDependencies": {
     "@rollup/plugin-terser": "^1.0.0",
     "@vitest/coverage-v8": "^4.1.10",
-    "@yuneta/gobj-js": "^7.16.1",
+    "@yuneta/gobj-js": "^7.16.3",
     "vite": "^8.2.1",
     "vitest": "^4.1.10"
   },

package/src/c_yui_form.js CHANGED Viewed

@@ -661,6 +661,7 @@ function build_form_field_conf(gobj, field_desc)
             break;
         case "image":
+        case "icon":
         case "string":
             field_conf.tag = 'input';
             field_conf.inputType = 'text';
@@ -1787,6 +1788,7 @@ function template2columns(gobj, columns, template, sub_elements)
                 break;
             case "image":
+            case "icon":
             case "string":
                 // field_conf.tag = 'input';
                 // field_conf.inputType = 'text';
@@ -2516,6 +2518,7 @@ function treedb_value_2_form_value(gobj, field_desc, value)
         case "date":
         case "color":
         case "image":
+        case "icon":
         case "tel":
         case "template":
         case "table":
@@ -2653,6 +2656,7 @@ function form_value_2_treedb_value(gobj, field_desc, value)
         case "date":
         case "color":
         case "image":
+        case "icon":
         case "tel":
             break;
         case "template":

package/src/c_yui_treedb_topic_with_form.css CHANGED Viewed

@@ -116,3 +116,13 @@
     background: transparent !important;
 }
+/*  Cell of a col flagged `icon`: the glyph is a CSS mask sized in `em`,
+ *  so it comes out at the row's font size -- smaller than the 18px the
+ *  `image` cells next to it get. A touch larger, and centred on the row
+ *  rather than on the text baseline.  */
+.ICON_CELL {
+    font-size: 1.25em;
+    line-height: 1;
+    vertical-align: middle;
+}

package/src/c_yui_treedb_topic_with_form.js CHANGED Viewed

@@ -86,6 +86,7 @@ import {
 } from "./yui_table_select.js";
 import {yui_table_filter_clear} from "./yui_table_filter_clear.js";
+import {yui_icon_is_defined} from "./lib_icons.js";
 import {row_matches} from "./yui_row_search.js";
 import {t} from "i18next";
@@ -1284,6 +1285,14 @@ function create_tabulator(gobj)
                 hozAlign = "center";
                 colFormatter = "color";
                 break;
+            case "icon":
+                /*  The NAME of an icon of the app's set, not a file --
+                 *  which is why `image` cannot stand in for it: it built
+                 *  an `<img src="yi-bolt">` and drew a broken image.  */
+                hozAlign = "center";
+                vertAlign = "middle";
+                colFormatter = icon_formatter;
+                break;
             case "object":
             case "dict":
             case "template":
@@ -1694,6 +1703,48 @@ function table__destroy(gobj)
     }
 }
+/************************************************************
+ *  Cell of a col flagged `icon`: the value is the NAME of an
+ *  icon of the app's set ("yi-bolt"), so it is DRAWN.
+ *
+ *  Built as a DOM node and not as an HTML string: the value is
+ *  raw record data and must never be parsed as markup -- and
+ *  here it also becomes a CSS class, so it is filtered to the
+ *  shape of a class name before it gets near one.
+ *
+ *  A name the set does not carry falls back to the TEXT of it.
+ *  The catch-all rule `[class^="yi-"]::before` paints a
+ *  currentColor box for any name, so drawing it anyway would
+ *  render a solid square -- a glyph nobody recognises rather
+ *  than a mistake somebody can fix.
+ ************************************************************/
+function icon_formatter(cell)
+{
+    let name = cell.getValue();
+    if(!is_string(name) || empty_string(name)) {
+        return "";
+    }
+    name = name.trim();
+    if(!/^[a-z0-9-]+$/.test(name) || !yui_icon_is_defined(name)) {
+        /*  The NAME, in plain grey, and no invented label around it: it
+         *  is a developer's problem (a schema naming a glyph the set
+         *  does not carry) and the name IS the whole diagnosis -- while
+         *  a sentence here would be one more i18n key for every app
+         *  that mounts this table.  */
+        return createElement2([
+            "span",
+            {class: "ICON_CELL_UNKNOWN is-size-7 has-text-grey", title: name},
+            name
+        ]);
+    }
+    return createElement2([
+        "span",
+        {class: `ICON_CELL ${name}`, title: name, "aria-label": name}
+    ]);
+}
 /************************************************************
  *  Cell of a col holding a JSON document (dict/list/blob/
  *  template/coordinates/…): a one-line truncated preview,
@@ -1852,6 +1903,10 @@ function transform__treedb_value_2_table_value(gobj, col, value, row, field)
             // Handled by Tabulator's built-in "color" formatter (see colDef above)
             break;
+        case "icon":
+            // Handled by icon_formatter() (see colDef above)
+            break;
         case "image":
             // Handled by Tabulator's built-in "image" formatter (see colDef above)
             break;

package/src/lib_icons.js CHANGED Viewed

@@ -168,3 +168,54 @@ export function inject_svg_icons()
     div.innerHTML = ICONS;
     document.body.appendChild(div);
 }
+/*
+ *  Is `yi-<name>` a real glyph of the loaded set?
+ *
+ *  It has to be ASKED, not looked up in a list: the set is a CSS file
+ *  (`yui_icons.css`) that an app may extend or replace, and a list here
+ *  would be a second copy of it, wrong the first time somebody adds a
+ *  mask rule. And the question matters because the catch-all rule
+ *  `[class^="yi-"]::before` paints a `currentColor` box for ANY name --
+ *  so an undefined icon does not fail, it renders as a solid black
+ *  square, which reads as a glyph nobody recognises rather than as a
+ *  mistake.
+ *
+ *  The probe is the real stylesheet: a detached element gets no styles,
+ *  so it is attached, hidden, measured and removed. Cached by name --
+ *  a table draws one icon per row and the answer cannot change without
+ *  a reload.
+ */
+const __icon_defined__ = {};
+export function yui_icon_is_defined(name)
+{
+    if(!name || typeof name !== "string") {
+        return false;
+    }
+    if(__icon_defined__[name] !== undefined) {
+        return __icon_defined__[name];
+    }
+    let defined = false;
+    try {
+        const el = document.createElement("i");
+        el.className = name;
+        el.style.position = "absolute";
+        el.style.visibility = "hidden";
+        el.style.pointerEvents = "none";
+        document.body.appendChild(el);
+        const st = window.getComputedStyle(el, "::before");
+        const mask = st.maskImage || st.webkitMaskImage || "";
+        defined = !!mask && mask !== "none";
+        document.body.removeChild(el);
+    } catch(e) {
+        /*  No DOM to ask (jsdom without the stylesheet, a test): answer
+         *  "not defined" so the caller falls back to showing the name,
+         *  which is the honest half of the pair.  */
+        defined = false;
+    }
+    __icon_defined__[name] = defined;
+    return defined;
+}