fix: toolbar items work for table editors

mdx-editor · Jul 6, 2023 · 62e33ca · 62e33ca
1 parent 82a52a0
commit 62e33ca
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/src/ui/NodeDecorators/TableEditor.tsx b/src/ui/NodeDecorators/TableEditor.tsx
@@ -317,7 +317,7 @@ const CellEditor: React.FC<CellProps> = ({ activeCellTuple, parentEditor, lexica
       BLUR_COMMAND,
       (payload) => {
         const relatedTarget = payload.relatedTarget as HTMLElement | null
-        if (relatedTarget?.dataset['editorDialog'] !== undefined) {
+        if (relatedTarget?.dataset['editorDialog'] !== undefined || relatedTarget?.dataset['toolbarItem'] !== undefined) {
           return false
         }
         saveAndDispose(null)

diff --git a/src/ui/ToolbarPlugin/toolbarComponents.tsx b/src/ui/ToolbarPlugin/toolbarComponents.tsx
@@ -33,7 +33,12 @@ export { InstantTooltip } from './InstantTooltip'
 export const ToggleItem = React.forwardRef<HTMLButtonElement, RadixToolbar.ToolbarToggleItemProps & { title: string }>(
   ({ title, children, className: passedClassName, ...props }, forwardedRef) => {
     return (
-      <RadixToolbar.ToggleItem className={classNames(passedClassName, styles.toolbarToggleItem)} {...props} ref={forwardedRef}>
+      <RadixToolbar.ToggleItem
+        data-toolbar-item={true}
+        className={classNames(passedClassName, styles.toolbarToggleItem)}
+        {...props}
+        ref={forwardedRef}
+      >
         <InstantTooltip title={title}>{children}</InstantTooltip>
       </RadixToolbar.ToggleItem>
     )
@@ -43,7 +48,7 @@ export const ToggleItem = React.forwardRef<HTMLButtonElement, RadixToolbar.Toolb
 export const ToolbarButton = React.forwardRef<HTMLButtonElement, RadixToolbar.ToolbarButtonProps & { title: string }>(
   ({ title, children, ...props }, forwardedRef) => {
     return (
-      <RadixToolbar.Button className={styles.toolbarButton} {...props} ref={forwardedRef}>
+      <RadixToolbar.Button data-toolbar-item={true} className={styles.toolbarButton} {...props} ref={forwardedRef}>
         <InstantTooltip title={title}>{children}</InstantTooltip>
       </RadixToolbar.Button>
     )