• @qwik.dev/core@2.0.0-alpha.7

🐞🩹 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 inside package.json (by @GrandSchtroumpf in #7289)

📃 update turso integration keywords, add contributor (by @A2-NieR in #7215)

✨ tailwindcss v4 integration (by @sreeisalso in #7274)

🐞🩹 remove usage of computedStyleMap (by @Varixo in #7252)

📃 remove shop (by @gioboa in #7221)

🐞🩹 error in the middleware occurs 404 (by @JerryWu1234 in #6951)

🐞🩹 changed turso createClient import to work with file urls, updated docs note with info & link to the corresponding section in the turso docs (by @A2-NieR in #7211)

📃 add Qwik blog + articles (by @gioboa in #7214)

🐞🩹 input's value is string when passing number (by @JerryWu1234 in #7249)

🐞🩹 MDX content now accepts a prop of type components that lets you use your own custom components (by @double-thinker in #7277)

To add custom components to your MDX content, you can now do this:

// routes/example/index.tsx
import Content from './markdown.mdx';
import MyComponent from '../../components/my-component/my-component';
import { component$ } from '@builder.io/qwik';

export default component$(() => <Content components={{ MyComponent }} />);

You can also use props in JS expressions. See https://mdxjs.com/docs/using-mdx/#props

🐞🩹 mdx not rendering (by @shairez in #7168)

📃 added a "Qwik for Mobile" guide to build iOS and Android Qwik apps (by @srapport in #7205)

🐞🩹 some qrls weren't fetched correctly on page load (by @shairez in #7286)