Fixed node dragging and selecting text on input
This commit is contained in:
parent
fae76a4a5e
commit
7b1b028364
4 changed files with 15 additions and 23 deletions
|
|
@ -152,7 +152,7 @@ export default function ParameterComponent({
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
ref={ref}
|
ref={ref}
|
||||||
className="mt-1 flex w-full flex-wrap items-center justify-between bg-muted px-5 py-2"
|
className="nopan nodrag mt-1 flex w-full flex-wrap items-center justify-between bg-muted px-5 py-2"
|
||||||
>
|
>
|
||||||
<>
|
<>
|
||||||
<div
|
<div
|
||||||
|
|
|
||||||
|
|
@ -20,14 +20,6 @@ type UseUndoRedoOptions = {
|
||||||
enableShortcuts: boolean;
|
enableShortcuts: boolean;
|
||||||
};
|
};
|
||||||
|
|
||||||
type UseUndoRedo = (options?: UseUndoRedoOptions) => {
|
|
||||||
undo: () => void;
|
|
||||||
redo: () => void;
|
|
||||||
takeSnapshot: () => void;
|
|
||||||
canUndo: boolean;
|
|
||||||
canRedo: boolean;
|
|
||||||
};
|
|
||||||
|
|
||||||
type HistoryItem = {
|
type HistoryItem = {
|
||||||
nodes: Node[];
|
nodes: Node[];
|
||||||
edges: Edge[];
|
edges: Edge[];
|
||||||
|
|
|
||||||
|
|
@ -97,25 +97,24 @@ function BaseModal({
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
|
|
||||||
const { setDisableCopyPaste } = useContext(TabsContext);
|
const { disableCopyPaste, setDisableCopyPaste } = useContext(TabsContext);
|
||||||
const [openInner, setOpenInner] = useState(open ?? false);
|
const [keepDisabling, setKeepDisabling] = useState(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
setOpenInner(open);
|
if (keepDisabling) {
|
||||||
}, [open]);
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
setOpen(openInner);
|
|
||||||
if (openInner) {
|
|
||||||
setDisableCopyPaste(true);
|
setDisableCopyPaste(true);
|
||||||
} else {
|
|
||||||
setDisableCopyPaste(false);
|
|
||||||
}
|
}
|
||||||
}, [openInner]);
|
}, [disableCopyPaste]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (!open) {
|
||||||
|
setKeepDisabling(false);
|
||||||
|
}
|
||||||
|
}, [open]);
|
||||||
|
|
||||||
//UPDATE COLORS AND STYLE CLASSSES
|
//UPDATE COLORS AND STYLE CLASSSES
|
||||||
return (
|
return (
|
||||||
<Dialog open={openInner} onOpenChange={setOpenInner}>
|
<Dialog modal={true} open={open} onOpenChange={setOpen}>
|
||||||
<DialogTrigger className="w-full" hidden={triggerChild ? false : true}>
|
<DialogTrigger className="w-full" hidden={triggerChild ? false : true}>
|
||||||
{triggerChild}
|
{triggerChild}
|
||||||
</DialogTrigger>
|
</DialogTrigger>
|
||||||
|
|
|
||||||
|
|
@ -379,12 +379,15 @@ export default function Page({ flow }: { flow: FlowType }) {
|
||||||
}}
|
}}
|
||||||
edges={edges}
|
edges={edges}
|
||||||
onPaneClick={() => {
|
onPaneClick={() => {
|
||||||
|
console.log("enableCopyPastePaneClick");
|
||||||
setDisableCopyPaste(false);
|
setDisableCopyPaste(false);
|
||||||
}}
|
}}
|
||||||
onPaneMouseLeave={() => {
|
onPaneMouseLeave={() => {
|
||||||
|
console.log("enableCopyPastePaneLeave");
|
||||||
setDisableCopyPaste(true);
|
setDisableCopyPaste(true);
|
||||||
}}
|
}}
|
||||||
onPaneMouseEnter={() => {
|
onPaneMouseEnter={() => {
|
||||||
|
console.log("enableCopyPastePaneEnter");
|
||||||
setDisableCopyPaste(false);
|
setDisableCopyPaste(false);
|
||||||
}}
|
}}
|
||||||
onNodesChange={onNodesChangeMod}
|
onNodesChange={onNodesChangeMod}
|
||||||
|
|
@ -407,8 +410,6 @@ export default function Page({ flow }: { flow: FlowType }) {
|
||||||
onDrop={onDrop}
|
onDrop={onDrop}
|
||||||
onNodesDelete={onDelete}
|
onNodesDelete={onDelete}
|
||||||
onSelectionChange={onSelectionChange}
|
onSelectionChange={onSelectionChange}
|
||||||
nodesDraggable={!disableCopyPaste}
|
|
||||||
panOnDrag={!disableCopyPaste}
|
|
||||||
zoomOnDoubleClick={!disableCopyPaste}
|
zoomOnDoubleClick={!disableCopyPaste}
|
||||||
className="theme-attribution"
|
className="theme-attribution"
|
||||||
minZoom={0.01}
|
minZoom={0.01}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue