feat: using view transitions API on appearance toggle

[ayangweb]

Summary

support enableAppearanceAnimation to use view transitions API on appearance toggle

Related Issue

closes #1270

Checklist

• Tests updated (or not required).
• Documentation updated (or not required).

[CLAassistant]

All committers have signed the CLA.

[netlify]

✅ Deploy Preview for aquamarine-blini-95325f ready!

Name	Link
🔨 Latest commit	cbc22d8
🔍 Latest deploy log	https://app.netlify.com/sites/aquamarine-blini-95325f/deploys/66d6eae017bc7c000813553b
😎 Deploy Preview	https://deploy-preview-1272--aquamarine-blini-95325f.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.
Lighthouse	1 paths audited Performance: 95 (🟢 up 3 from production) Accessibility: 97 (no change from production) Best Practices: 92 (no change from production) SEO: 92 (no change from production) PWA: - View the detailed breakdown and full score reports

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[chenjiahan]

@SoonIter cc

[SoonIter]

this feature is conflicted with #101

two view-transition name is conflicted, 'flip' and 'root'

https://github.com/ayangweb/rspress/blob/5cfab69d674485933db69b09667576f416e96a58/packages/theme-default/src/layout/DocLayout/index.module.scss

when switching the dark mode, .rspress-doc with flip 's behavior is strange

QQ20240726-195058-HD.mp4

Currently, I tried to solve the conflict but it does not work...

also need some help

[ayangweb]

@SoonIter 我想排查一下原因，可惜在我执行 pnpm dev 的时候，它经常报错！

[Timeless0911]

@SoonIter 我想排查一下原因，可惜在我执行 pnpm dev 的时候，它经常报错！

你试着把 shared 包 和 这个包开两个终端 分别运行 dev

[SoonIter]

I solved it by some ugly codes

https://github.com/ayangweb/rspress/blob/cdc406d8532d13df53a7d851b4d1fec743061b4b/packages/theme-default/src/components/SwitchAppearance/index.tsx#L20

[Timeless0911]

Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you all sign our Contributor License Agreement before we can accept your contribution.2 out of 3 committers have signed the CLA.✅ SoonIter✅ Timeless0911❌ ayangwebYou have signed the CLA already but the status is still pending? Let us recheck it.

@ayangweb Hi, can you sign the CLA to let CI pass~

[ayangweb]

Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you all sign our Contributor License Agreement before we can accept your contribution.2 out of 3 committers have signed the CLA.✅ SoonIter✅ Timeless0911❌ ayangwebYou have signed the CLA already but the status is still pending? Let us recheck it.

@ayangweb Hi, can you sign the CLA to let CI pass~

Okay, I've signed it.