Skip to content

Commit 23d7072

Browse files
committed
refactor: remove unnecessary header-hidden and footer-hidden attributes
Empty flex containers with no padding or min-height naturally collapse to zero height, making the visibility management logic unnecessary.
1 parent 6c65a89 commit 23d7072

File tree

3 files changed

+6
-37
lines changed

3 files changed

+6
-37
lines changed

packages/grid/src/styles/vaadin-grid-base-styles.js

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -81,11 +81,6 @@ export const gridStyles = css`
8181
box-sizing: border-box;
8282
}
8383
84-
:host([header-hidden]) [part='header'],
85-
:host([footer-hidden]) [part='footer'] {
86-
display: none;
87-
}
88-
8984
#items {
9085
flex-grow: 1;
9186
flex-shrink: 0;

packages/grid/src/vaadin-grid.js

Lines changed: 0 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -277,32 +277,6 @@ class Grid extends GridMixin(ElementMixin(ThemableMixin(PolylitMixin(LumoInjecti
277277
return gridStyles;
278278
}
279279

280-
/** @protected */
281-
firstUpdated() {
282-
super.firstUpdated();
283-
284-
// Handle header slot visibility
285-
const headerSlot = this.shadowRoot.querySelector('slot[name="header"]');
286-
const footerSlot = this.shadowRoot.querySelector('slot[name="footer"]');
287-
288-
const updateSlotVisibility = () => {
289-
// Check header slot
290-
const hasHeaderContent = headerSlot.assignedNodes().length > 0;
291-
this.toggleAttribute('header-hidden', !hasHeaderContent);
292-
293-
// Check footer slot
294-
const hasFooterContent = footerSlot.assignedNodes().length > 0;
295-
this.toggleAttribute('footer-hidden', !hasFooterContent);
296-
};
297-
298-
// Initial check
299-
updateSlotVisibility();
300-
301-
// Listen for slot changes
302-
headerSlot.addEventListener('slotchange', updateSlotVisibility);
303-
footerSlot.addEventListener('slotchange', updateSlotVisibility);
304-
}
305-
306280
/** @protected */
307281
render() {
308282
return html`

packages/grid/test/grid-slots.test.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -52,10 +52,10 @@ describe('grid slots', () => {
5252
expect(headerRect.bottom).to.be.at.most(tableRect.top + 1);
5353
});
5454

55-
it('should hide empty header slot', () => {
55+
it('should have zero height when header slot is empty', () => {
5656
const headerPart = grid.shadowRoot.querySelector('[part="header"]');
57-
const computedStyle = window.getComputedStyle(headerPart);
58-
expect(computedStyle.display).to.equal('none');
57+
const rect = headerPart.getBoundingClientRect();
58+
expect(rect.height).to.equal(0);
5959
});
6060

6161
it('should show header slot with content', async () => {
@@ -127,10 +127,10 @@ describe('grid slots', () => {
127127
expect(footerRect.top).to.be.at.least(tableRect.bottom - 1);
128128
});
129129

130-
it('should hide empty footer slot', () => {
130+
it('should have zero height when footer slot is empty', () => {
131131
const footerPart = grid.shadowRoot.querySelector('[part="footer"]');
132-
const computedStyle = window.getComputedStyle(footerPart);
133-
expect(computedStyle.display).to.equal('none');
132+
const rect = footerPart.getBoundingClientRect();
133+
expect(rect.height).to.equal(0);
134134
});
135135

136136
it('should show footer slot with content', async () => {

0 commit comments

Comments
 (0)