fix: Fixed issue where using table or image option in Super mobile toolbar would make uninteractive

This commit is contained in:
Aman Harwara
2023-09-20 20:52:01 +05:30
parent 0d15858b5f
commit ec61901aa5

View File

@@ -372,17 +372,17 @@ const MobileToolbarPlugin = () => {
}, [editor, updateEditorSelection]) }, [editor, updateEditorSelection])
const isFocusInEditorOrToolbar = isInEditor || isInToolbar || isInLinkEditor const isFocusInEditorOrToolbar = isInEditor || isInToolbar || isInLinkEditor
if (!isMobile || !isFocusInEditorOrToolbar) {
return null
}
return ( return (
<> <>
{modal} {modal}
<div className="bg-contrast" id="super-mobile-toolbar"> <div
className={classNames('bg-contrast', !isMobile || !isFocusInEditorOrToolbar ? 'hidden' : '')}
id="super-mobile-toolbar"
>
{isSelectionLink && ( {isSelectionLink && (
<div <div
className="border-t border-border px-2 focus:outline-none focus:shadow-none" className="border-t border-border px-2 focus:shadow-none focus:outline-none"
ref={linkEditorRef} ref={linkEditorRef}
tabIndex={FOCUSABLE_BUT_NOT_TABBABLE} tabIndex={FOCUSABLE_BUT_NOT_TABBABLE}
> >
@@ -406,7 +406,7 @@ const MobileToolbarPlugin = () => {
return ( return (
<StyledTooltip showOnMobile showOnHover label={item.name} key={item.name}> <StyledTooltip showOnMobile showOnHover label={item.name} key={item.name}>
<button <button
className="flex items-center justify-center rounded p-0.5 disabled:opacity-50 select-none hover:bg-default" className="flex select-none items-center justify-center rounded p-0.5 hover:bg-default disabled:opacity-50"
aria-label={item.name} aria-label={item.name}
onMouseDown={(event) => { onMouseDown={(event) => {
event.preventDefault() event.preventDefault()
@@ -420,7 +420,7 @@ const MobileToolbarPlugin = () => {
> >
<div <div
className={classNames( className={classNames(
'flex items-center justify-center p-2 rounded transition-colors duration-75', 'flex items-center justify-center rounded p-2 transition-colors duration-75',
item.active && 'bg-info text-info-contrast', item.active && 'bg-info text-info-contrast',
)} )}
> >