[STUDY] migrate from stitches

[gndz07]

Overview

Stitches is no longer actively maintained since June 2023. It is not a problem for the moment, but it might pose problems if we want to keep up with the ecosystem in the future (for example, if we wanted to use Next.js app folder, stitches wouldn't play so well with it).

We might want to consider to start migrating from stitches to another alternative.

Related discussion: stitchesjs/stitches#1149

Additional context

Possible alternatives:

• Panda
• cva
• Linaria

[gndz07]

Notes from discussion 06/03

• vanilla-extract is out of context of discussion for now
• Panda seems the easiest to migrate to - similar syntax, some shared functionalities
• cva only has variants as the plus point, on other points Pandas still preferable
• Linaria seems like it doesn't have the necessary functionalities that we'd need

Next steps

• dig deeper into Panda, identify any possible pain points to migrate
• rediscuss and define tasks to migrate

[gndz07]

StyleX could be another choice too. We are doing a PoC on it.

[gndz07]

Another interesting read: https://www.joshwcomeau.com/react/css-in-rsc/#the-world-of-zero-runtime-css-in-js-libraries-5

The fact that we still use stitches started to be problematic to develop new features and we needed to implement some workarounds at places. I would put this issue as a background task to not let it be abandoned, considering the importance.

[gndz07]

Notion document which contains initial analysis on different alternatives. Until this moment, I went deep mostly on 3 options: Panda, vanilla-extract, and Linaria. So far vanilla-extract is my top choice. Further details in the document.

[gndz07]

We decided to move forward with vanilla-extract. This PR contains working examples and the plans for the migration. We found a way to do the migration progressively, so we don't need to do everything all at once and avoid the needs to take a huge block of time to achieve this. I propose to continue doing the migration as a background task.

Umbrella issue for the implementation phase: https://github.com/traefik/hub-issues/issues/2385