Skip to content

Release v4.11.0

Choose a tag to compare

@github-actions github-actions released this 22 Sep 06:58
8882578

Summary

@cratis/components published exactly one stylesheet. An application that mounts two dialogs and a data table downloaded PivotViewer, TimeMachine, Canvas and Chat as well — about 32 KiB gzip of CSS for surfaces it never renders. Every JavaScript subpath now also publishes its own stylesheet at <subpath>/styles, beside one shared @cratis/components/styles/base, so an application pays for what it imports. @cratis/components/styles is unchanged and remains the recommended default; nothing has to migrate.

Added

  • Per-area CSS entry points for every JavaScript subpath — @cratis/components/Dialogs/styles, @cratis/components/PivotViewer/styles, @cratis/components/DataTables/styles and the rest — so an application downloads only the CSS for the surfaces it mounts (#301)
  • @cratis/components/styles/base, the shared internal utilities and cascade-layer order that every per-area entry point needs, imported once and never duplicated per surface (#301)
  • Documentation/Styling/per-area-stylesheets.md documentation covering when to prefer them over the aggregate, the full list of entry points and what each one covers (#301)
  • Per-area CSS budgets in the published-archive gate: each entry point has its own reviewed gzip ceiling, and a new area cannot ship without a measured number (#301)

Changed

  • Each <subpath>/styles is self-contained for that subpath — @cratis/components/PivotViewer/styles includes Filter's rules because PivotViewer renders a FilterPanel, and @cratis/components/DataPage/styles includes the vendored Allotment split-view rules — so there is never a second stylesheet to remember (#301)
  • Import order between per-area stylesheets does not matter: only styles/base establishes cascade-layer precedence, every area sheet just reopens cratis-components, and the cascade contract is identical whichever entry points are used (#301)
  • Getting-started and styling documentation now present the per-area path alongside the aggregate, and Documentation/ui-foundation.md records the split instead of the criteria for a future one (#301)

Indicative gzip transfer against roughly 32 KiB for the aggregate: about 2 KiB for the shared base, 6.4 KiB for Dialogs, 6.1 KiB for DataTables, 6.7 KiB for PivotViewer, 4.3 KiB for TimeMachine, 2.7 KiB for Filter.

No component's CSS content changed — this is packaging only, and every existing export, part name and token keeps working unchanged.