-
Notifications
You must be signed in to change notification settings - Fork 244
feat(components): add right click copy/cut/paste context menu COMPASS-9919 #7420
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
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
This PR adds right-click context menu functionality for cut/copy/paste operations in text elements. The implementation provides contextual menu items based on text selection state and element editability, using the modern Clipboard API with fallback to deprecated execCommand.
- Implements a new hook
useCopyPasteContextMenuthat detects text selection and element editability - Adds keyboard interaction preservation when context menu items are clicked
- Integrates copy/paste context menu into the main component provider system
Reviewed Changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/compass-context-menu/src/context-menu-provider.tsx | Extracts inline styles to a constant for consistency |
| packages/compass-components/src/hooks/use-copy-paste-context-menu.tsx | New hook implementing copy/paste context menu logic with clipboard operations |
| packages/compass-components/src/hooks/use-copy-paste-context-menu.spec.tsx | Comprehensive test suite for the copy/paste context menu functionality |
| packages/compass-components/src/components/context-menu.tsx | Adds mouse event handling to preserve focus when menu items are clicked |
| packages/compass-components/src/components/content-with-fallback.spec.tsx | Updates test expectations to account for new copy/paste context menu container |
| packages/compass-components/src/components/compass-components-provider.tsx | Integrates CopyPasteContextMenu component into the provider hierarchy |
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
packages/compass-components/src/hooks/use-copy-paste-context-menu.tsx
Outdated
Show resolved
Hide resolved
|
Assigned |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looking good, found nothing blocking a merge 👍
packages/compass-components/src/hooks/use-copy-paste-context-menu.tsx
Outdated
Show resolved
Hide resolved
packages/compass-components/src/hooks/use-copy-paste-context-menu.tsx
Outdated
Show resolved
Hide resolved
packages/compass-components/src/hooks/use-copy-paste-context-menu.tsx
Outdated
Show resolved
Hide resolved
packages/compass-components/src/hooks/use-copy-paste-context-menu.tsx
Outdated
Show resolved
Hide resolved
| editCapabilities.canCut | ||
| ? { | ||
| label: 'Cut', | ||
| onAction: onCut, | ||
| } | ||
| : undefined, | ||
| editCapabilities.canCopy | ||
| ? { | ||
| label: 'Copy', | ||
| onAction: onCopy, | ||
| } | ||
| : undefined, | ||
| editCapabilities.canPaste | ||
| ? { | ||
| label: 'Paste', | ||
| onAction: onPaste, | ||
| } | ||
| : undefined, |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I wonder if we'd want these actions to be disabled instead of missing entirely, when not supported?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I was going off of the browser like experience, when you don't have a selection, then you can't cut/copy. And when you right click something not past-able it doesn't show paste disabled. Feels a bit cleaner and readable.
COMPASS-9919
Adds a context menu for cut/copy/paste when right clicking in a scenario that allows the action. This does not work in modals.
cut.copy.paste.mp4