[ui5-bar]: content can't be hidden easily anymore

[SchroederSteffen]

Bug Description

So far, we toggled the visibility of some content like ui5-button in a ui5-bar using the hidden attribute.
This was working fine until v2.16.0 because of #12454.

Affected Component

ui5-bar

Expected Behaviour

Elements should be hidden when setting the hidden attribute.

Isolated Example

https://ui5.github.io/webcomponents/play/#eNq9Uj1PwzAU_Cuul7aorieWNFSoBYkNhi5IWZz4tXVJ7Mh2oFGV_86zG0pAIDGhZPC7u_d19okqLeE43_uqpMmJalEBTYbgjBZGe9Ae4XTEGKlL0e6sabRkW1NKwtgy0-no7nG9eX66JyEJgfClexASzwT_1Pm2hBBcJdr4SSJhqzTIKTkhJpULZROijYYFAl3Ij7UivzW2AMkKUxrLhDw0zn_RkpR_1P_3dinv18RjbmRLInWT0VwUL71RsVJCXoWdMOZEvbpQ68BMF-S7YgNH33MZDXv85D0D3fsfBI26ZrmwRIJTO40DPOBcYPv0yDbeG9xTSQl6eY5S_slEIe_r_Nb03BAdLqyqPfFtHZatjGxKyChxtgihUHp-cNgbrYrC8Eh48CdOS7vZWePdcfDuLtDw1amqNtaTjM75YBTX1AGOTfBaetH4Fqfnb5AXBgGNBRzH2_Z8FRdE9fgvYmGjknbdO1dAFxU

Steps to Reproduce

No response

Log Output, Stack Trace or Screenshots

No response

Priority

None

UI5 Web Components Version

2.16.0

Browser

Chrome

Operating System

No response

Additional Context

No response

Organization

No response

Declaration

• I’m not disclosing any internal or sensitive information.

[ilhan007]

Hello @UI5/ui5-team-ctr-bal, this is a regression in ui5-bar introduced by #12454 - the hidden attribute no longer works on slotted content.

---

🤖 This comment was generated and posted by Claude AI (Claude Code CLI)

[ilhan007]

Analysis: The regression is caused by PR #12454 which added display: inline-block to ::slotted(*). This overrides the browser's native hidden attribute behavior (display: none).

Option A - Exclude hidden elements from the rule:

::slotted(*:not([hidden])) {
    margin: 0 0.25rem;
    display: inline-block;
    /* ... rest of styles */
}

Option B - Add explicit rule for hidden:

::slotted([hidden]) {
    display: none;
}

Both are valid CSS. Option A is more defensive (doesn't override native behavior in the first place).

---

🤖 This comment was generated and posted by Claude AI (Claude Code CLI)

[github-actions]

This issue has been closed. To reopen, just leave a comment!