3.0.0
April 9, 2021
stylefy.impl.dom
, which handles DOM manipulation when using styles in components, has been (mostly) removed and replaced with external modules. This change frees stylefy from depending on Reagent, which makes it possible to support many UI libraries / frameworks. At the beginning, three different modules are available:stylefy/reagent
, which is essentiallystylefy.impl.dom
that was shipped in previous versions.stylefy/rum
, which is functionally the same module asstylefy/reagent
, but for Rum.stylefy/generic-dom
is a general-purpose solution that does not depend on any specific UI library / framework. It makes only synchronous DOM updates, so the wide support comes with the cost of performance.
- Namespaced keywords are replaced with unnamespaced when caching CSS. This makes different module implementations easier to work with, and it also reduces the size of the cache by approximately 7%. Unsupported cache versions are cleared automatically, so no actions are required from the users of the library.
- This also means that after upgrading stylefy to version 3.0.0, you should not downgrade it, or the cache is going to get corrupted! (if you absolutely must downgrade, turn caching off)
- Style hashing now checks Garden units recursively. This makes sure that if Garden units are used deeply inside a style map, they are converted to CSS before hashing, so that the hash values are the same on both frontend and backend. This can cause changes in some autogenerated class names.
- A warning message about namespace conflict between
stylefy/class
andclojure.core/class
is now ignored.
Migration guide from previous versions (frontend only):
Assuming you are using Reagent, update stylefy version and add stylefy/reagent
as a new dependency. Your dependencies should look something like this:
[stylefy "3.0.0"]
[stylefy/reagent "3.0.0"]
Require stylefy.reagent
and initialise it together with stylefy (along with any other options you pass to stylefy/init
):
(:require [stylefy.reagent :as stylefy-reagent])
(stylefy/init {:dom (stylefy-reagent/init)})
That's it!