fix: hide side-nav label element when it is empty (#10194)

jouni · web-flow · commit 89bdb78afae3 · 2025-09-23T13:55:27.000+03:00
diff --git a/packages/side-nav/src/styles/vaadin-side-nav-base-styles.js b/packages/side-nav/src/styles/vaadin-side-nav-base-styles.js
@@ -57,4 +57,8 @@ export const sideNavSlotStyles = css`
   )::part(children) {
     --_level: var(--_level-2, 0);
   }
+
+  vaadin-side-nav:not(:has([slot='label']))::part(label) {
+    display: none;
+  }
 `;
diff --git a/packages/side-nav/test/accessibility.test.js b/packages/side-nav/test/accessibility.test.js
@@ -92,6 +92,7 @@ describe('accessibility', () => {
         <div>
           <input />
           <vaadin-side-nav collapsible>
+            <span slot="label">Label</span>
             <vaadin-side-nav-item path="/foo">Foo</vaadin-side-nav-item>
             <vaadin-side-nav-item path="/bar">Bar</vaadin-side-nav-item>
           </vaadin-side-nav>
