Panda CSSを(多分世界でも)最速でプロダクションWebアプリに採用した。
現状の所感として
「悪くない。むしろ良い」
である。
Next.jsでもVue.jsでも`<div style="background-color: blue;"></div>`みたいな書き方をしていたのでPanda CSSのCSS-in-JSと相性が良い。
良いポイントして
<div :class="css()">で直接css書けること
型安全なCSS Moduleって感じで書ける。良い。
recipeが書ける。
変数で可変したい時がある。例えば、success / warning / alertでボタンの色を変えたいなど。そんな時にRecipeが使えるので良い
formなどを用意する場合、title, content, buttonなど複数のスタイルを設定する。その場合にSlot Recipeが使える
デメリットは「開発中のためArk UIとVueの相性が異常に悪い」こと。
Panda CSS + Ark UIを使いたいがドキュメントは一ミリも意味をなさない。GitHub見てimportしてもきちんと動作しない、などのことが多い。
じゃあ、Chakra UI Vueを使えば？となるがVue3版のWIPは一生解けない。
多分Chakra [email protected]がリリースされ、Chakra UI for Reactのv3移行が完了した後でしょう。
---
何はともあれPanda CSSは非常に使い勝手が良い。なお、Kuma UIも良い。
独占市場になった瞬間、衰退が始まる。そのため、2ライブラリでずっと切磋琢磨してほしいお気持ちです。
---
Panda CSSはいいぞ。そして、私はChakra UI (Panda CSS)のコントリビューターになりましたとさ。