chore(figma-controls): rename props
This commit is contained in:
@@ -15,7 +15,7 @@ import { SelectionMode } from '../../types';
|
|||||||
import type { XYPosition, ReactFlowState, NodeChange, EdgeChange } from '../../types';
|
import type { XYPosition, ReactFlowState, NodeChange, EdgeChange } from '../../types';
|
||||||
|
|
||||||
type UserSelectionProps = {
|
type UserSelectionProps = {
|
||||||
isSelectionMode: boolean;
|
isSelecting: boolean;
|
||||||
selectionMode?: SelectionMode;
|
selectionMode?: SelectionMode;
|
||||||
panOnDrag?: boolean | 'RightClick';
|
panOnDrag?: boolean | 'RightClick';
|
||||||
onSelectionStart?: (e: ReactMouseEvent) => void;
|
onSelectionStart?: (e: ReactMouseEvent) => void;
|
||||||
@@ -56,7 +56,7 @@ const selector = (s: ReactFlowState) => ({
|
|||||||
|
|
||||||
const UserSelection = memo(
|
const UserSelection = memo(
|
||||||
({
|
({
|
||||||
isSelectionMode,
|
isSelecting,
|
||||||
selectionMode = SelectionMode.Contained,
|
selectionMode = SelectionMode.Contained,
|
||||||
panOnDrag,
|
panOnDrag,
|
||||||
onSelectionStart,
|
onSelectionStart,
|
||||||
@@ -102,13 +102,7 @@ const UserSelection = memo(
|
|||||||
|
|
||||||
const onMouseDown = (event: ReactMouseEvent): void => {
|
const onMouseDown = (event: ReactMouseEvent): void => {
|
||||||
const { resetSelectedElements, domNode } = store.getState();
|
const { resetSelectedElements, domNode } = store.getState();
|
||||||
if (
|
if (!elementsSelectable || !isSelecting || event.button !== 0 || event.target !== container.current || !domNode) {
|
||||||
!elementsSelectable ||
|
|
||||||
!isSelectionMode ||
|
|
||||||
event.button !== 0 ||
|
|
||||||
event.target !== container.current ||
|
|
||||||
!domNode
|
|
||||||
) {
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -134,7 +128,7 @@ const UserSelection = memo(
|
|||||||
const onMouseMove = (event: ReactMouseEvent): void => {
|
const onMouseMove = (event: ReactMouseEvent): void => {
|
||||||
const { userSelectionRect, nodeInternals, edges, transform, onNodesChange, onEdgesChange, nodeOrigin, getNodes } =
|
const { userSelectionRect, nodeInternals, edges, transform, onNodesChange, onEdgesChange, nodeOrigin, getNodes } =
|
||||||
store.getState();
|
store.getState();
|
||||||
if (!isSelectionMode || !containerBounds.current || !userSelectionRect) {
|
if (!isSelecting || !containerBounds.current || !userSelectionRect) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -208,14 +202,14 @@ const UserSelection = memo(
|
|||||||
resetUserSelection();
|
resetUserSelection();
|
||||||
};
|
};
|
||||||
|
|
||||||
const hasActiveSelection = elementsSelectable && (isSelectionMode || userSelectionActive);
|
const hasActiveSelection = elementsSelectable && (isSelecting || userSelectionActive);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div
|
<div
|
||||||
className={cc([
|
className={cc([
|
||||||
'react-flow__pane',
|
'react-flow__pane',
|
||||||
'react-flow__container',
|
'react-flow__container',
|
||||||
{ dragging: paneDragging, selection: isSelectionMode },
|
{ dragging: paneDragging, selection: isSelecting },
|
||||||
])}
|
])}
|
||||||
onClick={hasActiveSelection ? undefined : wrapHandler(onClick, container)}
|
onClick={hasActiveSelection ? undefined : wrapHandler(onClick, container)}
|
||||||
onContextMenu={wrapHandler(onContextMenu, container)}
|
onContextMenu={wrapHandler(onContextMenu, container)}
|
||||||
|
|||||||
@@ -69,8 +69,7 @@ const FlowRenderer = ({
|
|||||||
}: FlowRendererProps) => {
|
}: FlowRendererProps) => {
|
||||||
const nodesSelectionActive = useStore(selector);
|
const nodesSelectionActive = useStore(selector);
|
||||||
const selectionKeyPressed = useKeyPress(selectionKeyCode);
|
const selectionKeyPressed = useKeyPress(selectionKeyCode);
|
||||||
|
const isSelecting = selectionKeyPressed || (selectionOnDrag && panOnDrag !== true);
|
||||||
const isSelectionMode = selectionKeyPressed || (selectionOnDrag && panOnDrag !== true);
|
|
||||||
|
|
||||||
useGlobalKeyHandler({ deleteKeyCode, multiSelectionKeyCode });
|
useGlobalKeyHandler({ deleteKeyCode, multiSelectionKeyCode });
|
||||||
|
|
||||||
@@ -107,7 +106,7 @@ const FlowRenderer = ({
|
|||||||
onPaneContextMenu={onPaneContextMenu}
|
onPaneContextMenu={onPaneContextMenu}
|
||||||
onPaneScroll={onPaneScroll}
|
onPaneScroll={onPaneScroll}
|
||||||
panOnDrag={panOnDrag}
|
panOnDrag={panOnDrag}
|
||||||
isSelectionMode={!!isSelectionMode}
|
isSelecting={!!isSelecting}
|
||||||
selectionMode={selectionMode}
|
selectionMode={selectionMode}
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
|
|||||||
Reference in New Issue
Block a user