Repository navigation
v0.16.0
Cirth v0.16.0
Cirth 0.16.0 makes the framework easier to compose with an existing design
system and with third-party content. It adds an explicit cascade boundary, a
subtree opt-out, portable design-token exports and two native-first UI
patterns, and fixes three visible regressions: shadows, overflow
containment, and presets inside a scoped build.
Breaking changes
Every stylesheet now emits its rules inside the single cascade layer cirth.
Unlayered application CSS therefore wins over Cirth regardless of specificity
or load order. This makes overrides simpler, but it also means CSS that used to
load before Cirth and lose may now win; in scoped builds, unlayered host-page
rules also win inside .cirth. Importing a Cirth file with
@import … layer(cirth) nests its own layer as cirth.cirth, and this release
does not define sublayers. Review the Upgrading guide before adopting this
version.
New APIs
- Add
.no-cirthto an element to suppress Cirth's component declarations on
that element and its descendants. This is a cascade opt-out, not full CSS
isolation: the global reset, theme, inherited values, layout, accessibility,
reduced-motion and print rules still apply. Selectors outside the subtree can
also continue to react to it through relationships such as:has()or
sibling selectors. - Class-based builds gain
fieldset.segmented, a joined radio-group treatment
that preserves native selection, keyboard behaviour, submission, focus and
forced-colors support. - Class-based builds gain
table.controls, which lets form controls sit
directly in table cells without the usual doubled padding and stacking
margin. - Source builds accept
npm run build -- --prefix "--acme-"to replace the
--cirth-custom-property namespace. The prefix must start with--and end
with-; the published package, its default prefix and the.cirthscoping
class are unchanged. - The package exports W3C Design Tokens JSON for both colour schemes through
@cirthcss/cirth/tokens/lightand@cirthcss/cirth/tokens/dark. Direct
relationships are preserved as aliases, derived colours include their
resolved value and unsupported CSS values are listed rather than discarded.
Fixes
- Dropdown and popover shadows render again: each shadow layer now resolves its
own scheme-aware colour instead of placing complete shadow lists in
light-dark(). .overflow-autonow contains absolutely positioned helpers such as
.sr-only, preventing hidden table headers from widening narrow pages.- Preset tokens now apply inside the
.cirthwrapper of scoped builds.
What's Changed
- docs: simplify README and use current brand mark by @ricpastori in #136
- Integrate open changes for 0.16.0 by @ricpastori in #138
- feat(build): allow the custom property prefix to be set at build time by @ricpastori in #130
- feat(tokens): export the token surface as W3C Design Tokens by @ricpastori in #131
- feat(forms): fieldset.segmented, an accessible segmented radio group by @ricpastori in #132
- feat(table): table.controls for form controls in cells by @ricpastori in #133
- fix: restore the shared shadow and contain .overflow-auto by @ricpastori in #134
- feat(css)!: ship every stylesheet in one cascade layer by @ricpastori in #135
- feat(css): add .no-cirth component exclusion boundary by @ricpastori in #137
- Ship precompressed Brotli stylesheets by @ricpastori in #140
- Release 0.16.0 by @ricpastori in #139
Full Changelog: v0.15.0...v0.16.0