Tag browse tree: hide tag properties

Hello,

I’m using Tag browse tree component in realtime mode and I would like to hide tags properties ( items with “Tree Node” symbol example: OpcItemPath, Quality, Tooltip, …).
I tried to use “filterTag” extension Function but it was unsuccessful…
Is it possible to hide tag properties or disable the tag handles on the tag browse tree component?

Thanks,

4 Likes

same problem here. looking for the answers.

1 Like

Any updates on this?

If you check in your browser's Developer Tools you'll see that each of the properties is class="terminal-node". It may be possible to, at least, hide those nodes (display : none) but the :arrow_forward: symbol will still show up on the tag name.

One of the CSS gurus may offer a solution.

Adding these styles to the Advanced Stylesheet will give you what you want

/* Hide the tag meta data by targeting the terminal-node class */
#ia_tagBrowser.terminal-node {
	display: none !important;
}

/* Hide the arrow for tag nodes (elements that are not folders) */
.parent-node:not(:has(svg[data-icon="material/folder"])) .ia_treeComponent__expandIcon {
    visibility: hidden; /* Use visibility to keep spacing */
}

/* Ensure the arrow is visible for folder nodes */
.parent-node:has(svg[data-icon="material/folder"]), 
.parent-node:has(svg[data-icon="material/folder_open"]) {
    visibility: visible !important;
}

/* Ensure the arrow remains visible when the folder is expanded */
.ia_treeComponent__node--expanded .ia_treeComponent__expandIcon {
    visibility: visible !important;
}

/* Maintain the expand/collapse arrow for expanded folders */
.ia_treeComponent__expandIcon[data-icon="material/arrow_drop_down"] {
    visibility: visible !important;
}

/* Ensure the hierarchy lines and spacing are maintained */
.ia_treeComponent__alignmentGuide {
    display: block !important;
}