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

[docs][examples] Update plain text and rich text examples #6187

Merged
merged 1 commit into from
Jun 5, 2024

Conversation

MaxPlav
Copy link
Contributor

@MaxPlav MaxPlav commented May 28, 2024

  1. Created the plain text example project react-plain-text.
  2. Fixed an import error in the rich text example.
  3. Update the examples links in the documentation to point StackBlitz instead of CodeSandbox.

Description

Closes #5989

Test plan

Rich text example:

rich-text.mov

Plain text example:

plain-text.mov

Copy link

vercel bot commented May 28, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
lexical ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 4, 2024 11:27pm
lexical-playground ✅ Ready (Inspect) Visit Preview 💬 Add feedback Jun 4, 2024 11:27pm

Copy link

github-actions bot commented May 28, 2024

size-limit report 📦

Path Size
lexical - cjs 28.33 KB (0%)
lexical - esm 28.14 KB (0%)
@lexical/rich-text - cjs 36.77 KB (0%)
@lexical/rich-text - esm 28.1 KB (0%)
@lexical/plain-text - cjs 35.35 KB (0%)
@lexical/plain-text - esm 25.33 KB (0%)
@lexical/react - cjs 38.51 KB (0%)
@lexical/react - esm 29.12 KB (0%)

@MaxPlav MaxPlav force-pushed the feature/move-examples-5989 branch from 5abccd2 to c1d3d64 Compare May 28, 2024 22:19
@facebook-github-bot facebook-github-bot added the CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. label May 28, 2024
@MaxPlav MaxPlav marked this pull request as ready for review May 28, 2024 22:28
@StyleT StyleT added the contribution-week Issues that are good to be picked up for the contribution week label May 28, 2024
Copy link
Contributor

@StyleT StyleT left a comment

Choose a reason for hiding this comment

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

LGTM overall! Awesome work

Copy link
Contributor

Choose a reason for hiding this comment

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

IMO, we need to keep react-rich as simple as possible... I can kinda justify having AutoLinkPlugin and FloatingLinkEditorPlugin, but why do we need all the other things here?

Idea behind react-rich example is to serve as a good starting point for anyone who aims to create it's own Lexical baked editor. So people would add (not remove) features.

return (
<LexicalComposer initialConfig={editorConfig}>
<div className="editor-container">
<ToolbarPlugin />
Copy link
Contributor

Choose a reason for hiding this comment

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

I am really wondering if we need toolbar here... Shouldn't it have same features as vanilla-js?

The more complex examples are - the harder is to support them

Copy link
Contributor Author

Choose a reason for hiding this comment

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

hi, the idea is to bring to the rich example all plugins and features from the CodeSandbox example https://codesandbox.io/p/sandbox/vigilant-kate-5tncvy?file=%2Fsrc%2Findex.js%3A11%2C16 as mentioned in #5989.
Alternatively, we can create a separate rich text example with a wider range of features, wdyt?

Copy link
Contributor

Choose a reason for hiding this comment

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

I think each feature in the example shall serve an educational purpose. So it should be there for a reason.

And the fact that it was there in the old codesandbox isn’t a good enough reason to me :)

So unless we know why those features are needed there (ex: it’s an implementation example for particular documentation article) - I would remove them.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I think each feature in the example shall serve an educational purpose. So it should be there for a reason.

And the fact that it was there in the old codesandbox isn’t a good enough reason to me :)

So unless we know why those features are needed there (ex: it’s an implementation example for particular documentation article) - I would remove them.

hi, thanks for the explanation! I've just removed extra plugins from both examples to keep the examples as simple as possible, and updated the screenshot videos.

@StyleT StyleT added the extended-tests Run extended e2e tests on a PR label May 31, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CLA Signed This label is managed by the Facebook bot. Authors need to sign the CLA before a PR can be reviewed. contribution-week Issues that are good to be picked up for the contribution week extended-tests Run extended e2e tests on a PR
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Feature: bring all examples into the monorepo
4 participants