refactor(edgesUpdatable): pass to store
This commit is contained in:
@@ -20,6 +20,7 @@ type StoreUpdaterProps = Pick<
|
|||||||
| 'nodesConnectable'
|
| 'nodesConnectable'
|
||||||
| 'nodesFocusable'
|
| 'nodesFocusable'
|
||||||
| 'edgesFocusable'
|
| 'edgesFocusable'
|
||||||
|
| 'edgesUpdatable'
|
||||||
| 'minZoom'
|
| 'minZoom'
|
||||||
| 'maxZoom'
|
| 'maxZoom'
|
||||||
| 'nodeExtent'
|
| 'nodeExtent'
|
||||||
@@ -98,6 +99,7 @@ const StoreUpdater = ({
|
|||||||
nodesConnectable,
|
nodesConnectable,
|
||||||
nodesFocusable,
|
nodesFocusable,
|
||||||
edgesFocusable,
|
edgesFocusable,
|
||||||
|
edgesUpdatable,
|
||||||
elevateNodesOnSelect,
|
elevateNodesOnSelect,
|
||||||
minZoom,
|
minZoom,
|
||||||
maxZoom,
|
maxZoom,
|
||||||
@@ -162,6 +164,7 @@ const StoreUpdater = ({
|
|||||||
useDirectStoreUpdater('nodesConnectable', nodesConnectable, store.setState);
|
useDirectStoreUpdater('nodesConnectable', nodesConnectable, store.setState);
|
||||||
useDirectStoreUpdater('nodesFocusable', nodesFocusable, store.setState);
|
useDirectStoreUpdater('nodesFocusable', nodesFocusable, store.setState);
|
||||||
useDirectStoreUpdater('edgesFocusable', edgesFocusable, store.setState);
|
useDirectStoreUpdater('edgesFocusable', edgesFocusable, store.setState);
|
||||||
|
useDirectStoreUpdater('edgesUpdatable', edgesUpdatable, store.setState);
|
||||||
useDirectStoreUpdater('elementsSelectable', elementsSelectable, store.setState);
|
useDirectStoreUpdater('elementsSelectable', elementsSelectable, store.setState);
|
||||||
useDirectStoreUpdater('elevateNodesOnSelect', elevateNodesOnSelect, store.setState);
|
useDirectStoreUpdater('elevateNodesOnSelect', elevateNodesOnSelect, store.setState);
|
||||||
useDirectStoreUpdater('snapToGrid', snapToGrid, store.setState);
|
useDirectStoreUpdater('snapToGrid', snapToGrid, store.setState);
|
||||||
|
|||||||
@@ -67,10 +67,8 @@ const EdgeRenderer = ({
|
|||||||
onEdgeUpdateEnd,
|
onEdgeUpdateEnd,
|
||||||
children,
|
children,
|
||||||
}: EdgeRendererProps) => {
|
}: EdgeRendererProps) => {
|
||||||
const { edgesFocusable, edgesUpdatable, elementsSelectable, width, height, connectionMode, nodeInternals, onError } = useStore(
|
const { edgesFocusable, edgesUpdatable, elementsSelectable, width, height, connectionMode, nodeInternals, onError } =
|
||||||
selector,
|
useStore(selector, shallow);
|
||||||
shallow
|
|
||||||
);
|
|
||||||
const edgeTree = useVisibleEdges(onlyRenderVisibleElements, nodeInternals, elevateEdgesOnSelect);
|
const edgeTree = useVisibleEdges(onlyRenderVisibleElements, nodeInternals, elevateEdgesOnSelect);
|
||||||
|
|
||||||
if (!width) {
|
if (!width) {
|
||||||
@@ -115,7 +113,9 @@ const EdgeRenderer = ({
|
|||||||
const sourcePosition = sourceHandle?.position || Position.Bottom;
|
const sourcePosition = sourceHandle?.position || Position.Bottom;
|
||||||
const targetPosition = targetHandle?.position || Position.Top;
|
const targetPosition = targetHandle?.position || Position.Top;
|
||||||
const isFocusable = !!(edge.focusable || (edgesFocusable && typeof edge.focusable === 'undefined'));
|
const isFocusable = !!(edge.focusable || (edgesFocusable && typeof edge.focusable === 'undefined'));
|
||||||
const isUpdatable = edge.updatable || typeof onEdgeUpdate !== 'undefined' || (edgesUpdatable && typeof edge.updatable === 'undefined');
|
const isUpdatable =
|
||||||
|
typeof onEdgeUpdate !== 'undefined' &&
|
||||||
|
(edge.updatable || (edgesUpdatable && typeof edge.updatable === 'undefined'));
|
||||||
|
|
||||||
if (!sourceHandle || !targetHandle) {
|
if (!sourceHandle || !targetHandle) {
|
||||||
onError?.('008', errorMessages['error008'](sourceHandle, edge));
|
onError?.('008', errorMessages['error008'](sourceHandle, edge));
|
||||||
|
|||||||
@@ -115,6 +115,7 @@ const ReactFlow = forwardRef<ReactFlowRefType, ReactFlowProps>(
|
|||||||
nodesFocusable,
|
nodesFocusable,
|
||||||
nodeOrigin = initNodeOrigin,
|
nodeOrigin = initNodeOrigin,
|
||||||
edgesFocusable,
|
edgesFocusable,
|
||||||
|
edgesUpdatable,
|
||||||
elementsSelectable,
|
elementsSelectable,
|
||||||
defaultViewport = initDefaultViewport,
|
defaultViewport = initDefaultViewport,
|
||||||
minZoom = 0.5,
|
minZoom = 0.5,
|
||||||
@@ -266,6 +267,7 @@ const ReactFlow = forwardRef<ReactFlowRefType, ReactFlowProps>(
|
|||||||
nodesConnectable={nodesConnectable}
|
nodesConnectable={nodesConnectable}
|
||||||
nodesFocusable={nodesFocusable}
|
nodesFocusable={nodesFocusable}
|
||||||
edgesFocusable={edgesFocusable}
|
edgesFocusable={edgesFocusable}
|
||||||
|
edgesUpdatable={edgesUpdatable}
|
||||||
elementsSelectable={elementsSelectable}
|
elementsSelectable={elementsSelectable}
|
||||||
elevateNodesOnSelect={elevateNodesOnSelect}
|
elevateNodesOnSelect={elevateNodesOnSelect}
|
||||||
minZoom={minZoom}
|
minZoom={minZoom}
|
||||||
|
|||||||
@@ -48,7 +48,7 @@ const initialState: ReactFlowStore = {
|
|||||||
nodesConnectable: true,
|
nodesConnectable: true,
|
||||||
nodesFocusable: true,
|
nodesFocusable: true,
|
||||||
edgesFocusable: true,
|
edgesFocusable: true,
|
||||||
edgesUpdatable: false,
|
edgesUpdatable: true,
|
||||||
elementsSelectable: true,
|
elementsSelectable: true,
|
||||||
elevateNodesOnSelect: true,
|
elevateNodesOnSelect: true,
|
||||||
fitViewOnInit: false,
|
fitViewOnInit: false,
|
||||||
|
|||||||
@@ -112,6 +112,7 @@ export type ReactFlowProps = HTMLAttributes<HTMLDivElement> & {
|
|||||||
nodesFocusable?: boolean;
|
nodesFocusable?: boolean;
|
||||||
nodeOrigin?: NodeOrigin;
|
nodeOrigin?: NodeOrigin;
|
||||||
edgesFocusable?: boolean;
|
edgesFocusable?: boolean;
|
||||||
|
edgesUpdatable?: boolean;
|
||||||
initNodeOrigin?: NodeOrigin;
|
initNodeOrigin?: NodeOrigin;
|
||||||
elementsSelectable?: boolean;
|
elementsSelectable?: boolean;
|
||||||
selectNodesOnDrag?: boolean;
|
selectNodesOnDrag?: boolean;
|
||||||
|
|||||||
@@ -39,7 +39,7 @@ type DefaultEdge<T = any> = {
|
|||||||
updatable?: EdgeUpdatable;
|
updatable?: EdgeUpdatable;
|
||||||
} & EdgeLabelOptions;
|
} & EdgeLabelOptions;
|
||||||
|
|
||||||
export type EdgeUpdatable = boolean | 'target' | 'source';
|
export type EdgeUpdatable = boolean | HandleType;
|
||||||
|
|
||||||
export type SmoothStepPathOptions = {
|
export type SmoothStepPathOptions = {
|
||||||
offset?: number;
|
offset?: number;
|
||||||
|
|||||||
Reference in New Issue
Block a user