v0.16.0

The stylesheet now comes in parts. An app can load the core and the components it draws with its first paint, and the rest later. ropav/styles is unchanged.

Added

• ropav/styles/core, ropav/styles/<name> and ropav/styles/components split the stylesheet so an app loads only what it draws.
  • The core is the layer order, reset, base styles, registrations, keyframes, default theme, tokens and utilities, about 4 KB gzipped.
  • Each component entry carries its own rules and those of what it draws itself, so modal brings the close button.
  • components is every component's rules and nothing else. It is safe to load after the first paint, and an app's own @layer theme tokens keep winning. ropav/styles stays about 40 KB, of which 36 KB is component rules.
• @ropav/styles offers core.css and components.css, the two halves its entry is now made of.

Fixed

• A Link styled with buttonVariants() takes the button's size, shape and colour whichever component file loads first. Before, the button only won because its file came later.
• The search field's clear button keeps its size in any import order. Before, it tied with the close button's own size rule.
• The installation guide's list for importing a few components now includes the layer order and the utilities the components render. It no longer claims ropav/styles lets a bundler drop unused components.

npm i ropav@0.16.0

Full changelog: v0.15.1...v0.16.0