Skip to content

v0.19.0

Choose a tag to compare

@github-actions github-actions released this 29 Aug 00:53
· 443 commits to main since this release
e71056a

A single bug fix, but a broad one: components now honour hidden. Read the
section below before upgrading — elements your app marked hidden and that stayed
on screen anyway will now disappear, which is the fix working rather than a
regression.

Hiding a component now hides it

element.hidden = true silently did nothing on almost every component in the
library. The HTML stylesheet's [hidden] { display: none } has the same
specificity as a component's own :host { display: block }, and the component's
sheet wins — so the element stayed on screen, with no error to explain it.

133 of the 142 elements that give :host a display were affected. All of them
now carry :host([hidden]) { display: none !important; }.

The !important is load-bearing rather than habit. Several components set
display again from a more specific host rule — :host([variant="line"]) on
box-skeleton, :host([orientation="vertical"]) on box-divider,
:host([inline]) on box-code-block — and those come later in the sheet, so
without it they take the display straight back. box-code-block already had the
plain rule and was broken exactly this way.

A test asserts the invariant over the sources, because this bug is invisible to
jsdom: it never applies :host rules at all, and reports display: none for a
hidden element whether or not the fix is present. Real behaviour was confirmed
across all 150 registered elements in Chromium.

The preview gallery was one of the things the bug had broken. It switches the
content explorer between list and table with explorerTable.hidden = mode !== "table", so the table never went away and the two presentations rendered
stacked. That is why the gallery's explorer-element baseline loses 319px in
this change: the old picture was showing a bug.