Patch Changes
-
🐞🩹 rendering attribute value from array of classes from spread props (by @Varixo in #7310)
-
🐞🩹 null or undefined as ref attribute value (by @Varixo in #7285)
-
🐞🩹 QRLs are now scheduled instead of directly executed by qwik-loader, so that they are executed in the right order. (by @wmertens in #7269)
-
🐞🩹 different component rendering with the same key (by @Varixo in #7292)
-
🐞🩹 export SVG type from qwik/core (by @JerryWu1234 in #7222)
-
🐞🩹 optimizer is now better at recognizing constProp (by @JerryWu1234 in #7316)
-
🐞🩹 create svg nested children with correct namespace (by @Varixo in #7323)
-
🐞🩹 the use hook didn't work when type is Slot. (by @JerryWu1234 in #7250)
-
🛠 replace the
_hW
export in segments with a shared export_task
in core. This opens up using QRLs from core. (by @wmertens in #7269) -
✨ emit "qrender" event after every render (by @Varixo in #7327)
-
🐞🩹 vNode serialization error on server$ (by @damianpumar in #7278)
-
🐞🩹 don't wrap and serialize functions that are attribute values (by @Varixo in #7284)
-
✨ updated scoped styles prefix to ⚡️ (by @sreeisalso in #7304)
Scoped styles prefix update
We've updated the
ComponentStylesPrefixContent
from the star symbol (⭐️) to the lightning bolt symbol (⚡️). This prefix is used internally to generate unique CSS class names for components, helping to prevent style collisions.Potential Compatibility Issue (Rare):
While this change is expected to be seamless for the vast majority of users, there's a very small possibility of a conflict if your application directly relies on the star symbol (⭐️) for CSS overriding. Specifically, if you're using CSS selectors that include the literal star character (⭐️) as part of a class name (e.g.,
.⭐️ComponentName { ... }
), your styles require need to be changed manually to work as expected after this update.How to check if you're affected
Search your codebase: Look for any instances where the star symbol (⭐️) is used as part of a CSS class name or selector.
How to fix it if you're affected
If you find that you are indeed relying on the star symbol (⭐️), you'll need to update your CSS selectors to use the new lightning bolt symbol (⚡️). For example, change
.⭐️ComponentName { ... }
to.⚡️ComponentName { ... }
./* Example of old, potentially problematic CSS */ .⭐️MyComponent { /* ... old styles ... */ } /* Example of updated, correct CSS */ .⚡️MyComponent { /* ... updated styles ... */ }
-
Expose missing types into
public.d.ts
and fix types uri for internal export insidepackage.json
(by @GrandSchtroumpf in #7289)