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.

Sign up for GitHub

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

Jump to bottom

feat(richtext-lexical): make decoratorNodes and blocks selectable. Centralize selection and deletion logic #10735

Merged
merged 7 commits into from
Jan 22, 2025
Merged

feat(richtext-lexical): make decoratorNodes and blocks selectable. Centralize selection and deletion logic #10735

merged 7 commits into from
Jan 22, 2025

Conversation

GermanJablo
Copy link
Contributor

@GermanJablo GermanJablo commented Jan 22, 2025 •
edited
Loading

  • Blocks can now be selected (only inline blocks were possible before).
  • Any DecoratorNode that users create will have the necessary logic out of the box so that they are selected with a click and deleted with backspace/delete.
  • By having the code for selecting and deleting centralized, a lot of repetitive code was eliminated
  • More performant code due to the use of event delegation. There is only one listener, previously there was one for each decoratorNode.
  • Heuristics to exclude scenarios where you don't want to select the node: if it is inside the DecoratorNode, but is also inside a button, input, textarea, contentEditable, .react-select, .code-editor or .no-select-decorator. That last one was added as a means of opt-out.
  • Fix Pasting in block results in pasting the content twice in Firefox #10634

Note: arrow navigation will be introduced in a later PR.

Screen.Recording.2025-01-22.at.6.26.56.PM.mov

AlessioGr
AlessioGr reviewed Jan 22, 2025
View reviewed changes
packages/richtext-lexical/src/features/horizontalRule/client/nodes/HorizontalRuleNode.tsx
override decorate(): React.ReactElement {
return <HorizontalRuleComponent nodeKey={this.__key} />
override decorate() {
return null
Copy link
Member

Choose a reason for hiding this comment

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

Why remove this?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

HorizontalRuleComponent doesn't do anything anymore. It used to be responsible for node selection and deletion, but that is now done in DecoratorPlugin.

@GermanJablo GermanJablo enabled auto-merge (squash) January 22, 2025 22:19
@GermanJablo GermanJablo merged commit 4aaef5e into main Jan 22, 2025
67 checks passed
@GermanJablo GermanJablo deleted the issue-10634-temp branch January 22, 2025 22:28
@github-actions GitHub Actions
Copy link
Contributor

🚀 This is included in version v3.19.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@AlessioGr AlessioGr AlessioGr approved these changes

Assignees
No one assigned
Labels
created-by: Payload team
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Pasting in block results in pasting the content twice in Firefox
2 participants
@GermanJablo @AlessioGr