fix: More context menu fixes
This commit is contained in:
@ -26,20 +26,29 @@ const MenuItem = ({
|
|||||||
hide,
|
hide,
|
||||||
...rest
|
...rest
|
||||||
}: Props) => {
|
}: Props) => {
|
||||||
// We bind to mousedown instead of onClick here as otherwise menu items do not
|
const handleClick = React.useCallback(
|
||||||
// work in Firefox which triggers the hideOnClickOutside handler first via
|
|
||||||
// mousedown.
|
|
||||||
const handleMouseDown = React.useCallback(
|
|
||||||
(ev) => {
|
(ev) => {
|
||||||
if (onClick) {
|
if (onClick) {
|
||||||
ev.preventDefault();
|
ev.preventDefault();
|
||||||
ev.stopPropagation();
|
ev.stopPropagation();
|
||||||
onClick(ev);
|
onClick(ev);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (hide) {
|
||||||
|
hide();
|
||||||
|
}
|
||||||
},
|
},
|
||||||
[onClick]
|
[onClick, hide]
|
||||||
);
|
);
|
||||||
|
|
||||||
|
// Preventing default mousedown otherwise menu items do not work in Firefox,
|
||||||
|
// which triggers the hideOnClickOutside handler first via mousedown – hiding
|
||||||
|
// and un-rendering the menu contents.
|
||||||
|
const handleMouseDown = React.useCallback((ev) => {
|
||||||
|
ev.preventDefault();
|
||||||
|
ev.stopPropagation();
|
||||||
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<BaseMenuItem
|
<BaseMenuItem
|
||||||
onClick={disabled ? undefined : onClick}
|
onClick={disabled ? undefined : onClick}
|
||||||
@ -52,8 +61,8 @@ const MenuItem = ({
|
|||||||
{...props}
|
{...props}
|
||||||
$toggleable={selected !== undefined}
|
$toggleable={selected !== undefined}
|
||||||
as={onClick ? "button" : as}
|
as={onClick ? "button" : as}
|
||||||
|
onClick={handleClick}
|
||||||
onMouseDown={handleMouseDown}
|
onMouseDown={handleMouseDown}
|
||||||
onClick={hide}
|
|
||||||
>
|
>
|
||||||
{selected !== undefined && (
|
{selected !== undefined && (
|
||||||
<>
|
<>
|
||||||
|
@ -33,7 +33,7 @@ type Props = {|
|
|||||||
@observer
|
@observer
|
||||||
class DocumentEditor extends React.Component<Props> {
|
class DocumentEditor extends React.Component<Props> {
|
||||||
@observable activeLinkEvent: ?MouseEvent;
|
@observable activeLinkEvent: ?MouseEvent;
|
||||||
@observable ref = React.createRef<HTMLDivElement | HTMLInputElement>();
|
ref = React.createRef<HTMLDivElement | HTMLInputElement>();
|
||||||
|
|
||||||
focusAtStart = () => {
|
focusAtStart = () => {
|
||||||
if (this.props.innerRef.current) {
|
if (this.props.innerRef.current) {
|
||||||
@ -110,8 +110,6 @@ class DocumentEditor extends React.Component<Props> {
|
|||||||
const normalizedTitle =
|
const normalizedTitle =
|
||||||
!title && readOnly ? document.titleWithDefault : title;
|
!title && readOnly ? document.titleWithDefault : title;
|
||||||
|
|
||||||
console.log(this.ref.current);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Flex auto column>
|
<Flex auto column>
|
||||||
{readOnly ? (
|
{readOnly ? (
|
||||||
|
Reference in New Issue
Block a user