Fix tooltip weird behavior in editable titles (#1268)
This commit is contained in:
@@ -25,11 +25,11 @@ function EditableNodeTitle({
|
|||||||
}: Props) {
|
}: Props) {
|
||||||
const [editing, setEditing] = useState(false);
|
const [editing, setEditing] = useState(false);
|
||||||
|
|
||||||
return (
|
if (!editing) {
|
||||||
<TooltipProvider>
|
return (
|
||||||
<Tooltip>
|
<TooltipProvider>
|
||||||
<TooltipTrigger asChild>
|
<Tooltip>
|
||||||
{!editing ? (
|
<TooltipTrigger asChild>
|
||||||
<h1
|
<h1
|
||||||
className={cn("cursor-text", titleClassName)}
|
className={cn("cursor-text", titleClassName)}
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
@@ -38,41 +38,43 @@ function EditableNodeTitle({
|
|||||||
>
|
>
|
||||||
{value}
|
{value}
|
||||||
</h1>
|
</h1>
|
||||||
) : (
|
</TooltipTrigger>
|
||||||
<HorizontallyResizingInput
|
<TooltipContent>Click to edit</TooltipContent>
|
||||||
disabled={!editable}
|
</Tooltip>
|
||||||
size={1}
|
</TooltipProvider>
|
||||||
autoFocus
|
);
|
||||||
className={cn("nopan w-min border-0 p-0", inputClassName)}
|
}
|
||||||
onBlur={(event) => {
|
|
||||||
if (!editable) {
|
return (
|
||||||
event.currentTarget.value = value;
|
<HorizontallyResizingInput
|
||||||
return;
|
disabled={!editable}
|
||||||
}
|
size={1}
|
||||||
if (event.currentTarget.value !== value) {
|
autoFocus
|
||||||
onChange(event.target.value);
|
className={cn("nopan w-min border-0 p-0", inputClassName)}
|
||||||
}
|
onBlur={(event) => {
|
||||||
setEditing(false);
|
if (!editable) {
|
||||||
}}
|
event.currentTarget.value = value;
|
||||||
onKeyDown={(event) => {
|
return;
|
||||||
if (!editable) {
|
}
|
||||||
return;
|
if (event.currentTarget.value !== value) {
|
||||||
}
|
onChange(event.target.value);
|
||||||
if (event.key === "Enter") {
|
}
|
||||||
event.currentTarget.blur();
|
setEditing(false);
|
||||||
}
|
}}
|
||||||
if (event.key === "Escape") {
|
onKeyDown={(event) => {
|
||||||
event.currentTarget.value = value;
|
if (!editable) {
|
||||||
event.currentTarget.blur();
|
return;
|
||||||
}
|
}
|
||||||
}}
|
if (event.key === "Enter") {
|
||||||
defaultValue={value}
|
event.currentTarget.blur();
|
||||||
/>
|
}
|
||||||
)}
|
if (event.key === "Escape") {
|
||||||
</TooltipTrigger>
|
event.currentTarget.value = value;
|
||||||
<TooltipContent>Click to edit</TooltipContent>
|
event.currentTarget.blur();
|
||||||
</Tooltip>
|
}
|
||||||
</TooltipProvider>
|
}}
|
||||||
|
defaultValue={value}
|
||||||
|
/>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user