Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: react renderer #3

Merged
merged 16 commits into from
Mar 7, 2024
Merged

feat: react renderer #3

merged 16 commits into from
Mar 7, 2024

Conversation

hyoban
Copy link
Contributor

@hyoban hyoban commented Mar 5, 2024

I added a React wrapper, most code is just like the Vue version and looks like it works.

package.json Outdated Show resolved Hide resolved
package.json Show resolved Hide resolved
src/react/ShikiMagicMove.tsx Outdated Show resolved Hide resolved
@hyoban hyoban marked this pull request as draft March 6, 2024 04:09
@hyoban hyoban marked this pull request as ready for review March 6, 2024 04:26
@hyoban hyoban requested a review from antfu March 6, 2024 04:26
src/core.ts Outdated Show resolved Hide resolved
@antfu
Copy link
Member

antfu commented Mar 6, 2024

I have merged the two playgrounds into one. This could help the long-term maintainability as well as easily compare between different renderers.

Tho with my limited understanding of React, the approach is quite hacky. And we also run into the problem that react renders twice.

Copy link
Member

@antfu antfu left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I couldn't fix it - count on someone to help

@hyoban
Copy link
Contributor Author

hyoban commented Mar 7, 2024

@antfu This problem should have been fixed. The reason is that React requires that the component function must be "pure", so the component will be mounted twice in the dev environment, resulting in multiple commits, overwriting the previous results, and making us unable to see the animation. So I need to compare whether related properties have changed.

Thank you very much for your work merging the playground and refactoring my code.

@hyoban hyoban changed the title feat: react wrapper feat: react renderer Mar 7, 2024
@antfu antfu merged commit 1ebf1b0 into shikijs:main Mar 7, 2024
8 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants