Skip to content

0.6.0 — CSS to native block styles

Choose a tag to compare

@noeltock noeltock released this 27 Jul 12:41
· 131 commits to main since this release

Until now the converter read only background-image and discarded every other CSS declaration in silence. A <div style="padding:64px;background:#f5f5f5"> produced a correct block tree with none of its design, and nothing said so.

Added

  • CSS maps onto blocks as native, editable styling — from inline style attributes and single-class <style> rules. Padding lands in the spacing control, colours in the colour picker. Inline outranks class rules; !important and shorthand resets are honoured as CSS defines them.
  • A styling ceiling: strict · relaxed · open. strict keeps only values that snap onto theme presets, relaxed (default) keeps exact values on the block, open also preserves CSS no block attribute can express by classing the block and emitting a stylesheet. Config or --styling.
  • --css-out / report.sidecarCss for what open produces. --styling open without a sink is an error — a level that quietly discarded the CSS it promised to keep would be worse than not offering it.
  • Every declaration is accounted for: mapped, consumed by the structural rules, or dropped — with the input line and the authoring selector, so warnings point upstream (max-width: 600px in .hero).
  • text-align, via style.typography.textAlign.
  • WordPress 7.1 minWidth, gated on the block opting in. text-shadow is recognised and refused: it is Global-Styles-only in 7.1, so a per-block value would render CSS the editor gives no control over — the warning points at theme.json.
  • Capability gating against the real target site. With a wesper --context manifest, styling is admitted only where the pinned block library and the site's own block registry agree, so degradation across WordPress versions is measured rather than hardcoded.

Fixed

  • Background images follow the CSS cascade, not first match. An image a later declaration replaced or removed no longer becomes cover media — the structural rules and the styling ledger now read a style attribute through the same parser.

Changed

  • @wordpress/block-editor is now a direct pinned dependency. It was already present transitively and governs the emitted markup, so it belongs in the pin rather than resolved by chance.

179 tests. Full notes in CHANGELOG.md.