uinix-js / uinix-theme Goto Github PK

uinix-theme is currently implemented using the delightful fela library.

uinix-theme does not expose fela APIs directly and intends to only support a closed set of CSS features.

Currently, fela is not a pure ESM module, and the implementation of uinix-theme using fela has clunky integration points (example).

It is likely expensive to research and abstract out of fela, but this issue tracks yet another opportunity for simplification of uinix-theme and formalizing the implementation of uinix-* packages as a closed ecosystem of well defined programs. This work would likely be implemented in a new package called uinix-css that uinix-theme consumes.

Context

Currently, the theme renderer is left for consumers to implement. One such implementation is done in uinix-ui: https://github.com/uinix-js/uinix-ui/blob/1381d444b6481db4168891b3edff047855de4853/lib/renderer/create-renderer.js

Advantages

• It will be more convenient to simply support uinix-ui's theme renderer in uinix-theme. Consumers may prefer to implement their own renderers optionally, but this should simplify using just uinix-theme for theme-related features.
• Makes uinix-theme more useful (since it is currently just a trivial set of utils and theme spec).
• Improves code maintainence of theme rendering related utils (e.g. plugins).
• Simplifies uinix-ui to deal purely with integration of a collection primitive components against a UI system (mapping theme with styles).

Tasks

• Implement createThemeRenderer which returns a theme renderer.
  • Implement renderer.render.
  • Implement renderer.renderStaticStyles.
  • Implement renderer.renderStyle.
  • Implement combineStyles util (merges and combines fela styles).
• Update tests
• Update types
• Update readme (Intro/Gist, Use, API, Infrastructure).

Ensure types are exported (without identifiers) in the main index.js.

renderer.renderStaticStyles does not honor fela plugins (see robinweser/fela#876).

This means that various authorable style features in renderer.renderStyles may not be made available in renderer.renderStaticStyles (e.g. pseudo/nested selectors, theme/responsive plugin).

Planned V3 Updates

Breaking

Removed

• createTheme will be removed

Changed

• renderer.render is renamed to renderer.load
• renderer.clear is renamed to renderer.unload
• renderer.renderStaticStyles is renamed to renderer.renderGlobalStyles

Inconsequential

• Improved types (using csstypes)
• Improve docs/tests