alighasami/xyflow
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

cleaned up some things

Browse Source
This commit is contained in:
peterkogo
2024-01-08 16:41:00 +01:00
parent 4a1d5be831
commit ec98b724b1
7 changed files with 83 additions and 99 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/react/src/additional-components/NodeResizer/NodeResizer.tsx
+8 -8
View File
@@ -1,6 +1,6 @@
import ResizeControl from './ResizeControl';
import { NodeResizerProps } from './types';
import { XY_RESIZER_HANDLE_CONTROLS, XY_RESIZER_LINE_CONTROLS, ResizeControlVariant } from '@xyflow/system';
import { ResizerControlVariant, XY_RESIZER_HANDLE_POSITIONS, XY_RESIZER_LINE_POSITIONS } from '@xyflow/system';
export default function NodeResizer({
nodeId,
@@ -26,14 +26,14 @@ export default function NodeResizer({
return (
<>
{XY_RESIZER_LINE_CONTROLS.map((c) => (
{XY_RESIZER_LINE_POSITIONS.map((position) => (
<ResizeControl
key={c}
key={position}
className={lineClassName}
style={lineStyle}
nodeId={nodeId}
position={c}
variant={ResizeControlVariant.Line}
position={position}
variant={ResizerControlVariant.Line}
color={color}
minWidth={minWidth}
minHeight={minHeight}
@@ -46,13 +46,13 @@ export default function NodeResizer({
onResizeEnd={onResizeEnd}
/>
))}
{XY_RESIZER_HANDLE_CONTROLS.map((c) => (
{XY_RESIZER_HANDLE_POSITIONS.map((position) => (
<ResizeControl
key={c}
key={position}
className={handleClassName}
style={handleStyle}
nodeId={nodeId}
position={c}
position={position}
color={color}
minWidth={minWidth}
minHeight={minHeight}
packages/react/src/additional-components/NodeResizer/ResizeControl.tsx
+5 -5
View File
@@ -1,7 +1,7 @@
import { useRef, useEffect, memo } from 'react';
import cc from 'classcat';
import { XYResizerInstance, XYResizer, XYResizeChange } from '@xyflow/system';
import { ResizeControlVariant } from '@xyflow/system';
import { ResizerControlVariant } from '@xyflow/system';
import { useStoreApi } from '../../hooks/useStore';
import { useNodeId } from '../../contexts/NodeIdContext';
import type { NodeChange, NodeDimensionChange, NodePositionChange } from '../../types';
@@ -10,7 +10,7 @@ import { type ResizeControlProps, type ResizeControlLineProps } from './types';
function ResizeControl({
nodeId,
position,
variant = ResizeControlVariant.Handle,
variant = ResizerControlVariant.Handle,
className,
style = {},
children,
@@ -29,7 +29,7 @@ function ResizeControl({
const id = typeof nodeId === 'string' ? nodeId : contextNodeId;
const store = useStoreApi();
const resizeControlRef = useRef<HTMLDivElement>(null);
const defaultPosition = variant === ResizeControlVariant.Line ? 'right' : 'bottom-right';
const defaultPosition = variant === ResizerControlVariant.Line ? 'right' : 'bottom-right';
const controlPosition = position ?? defaultPosition;
const resizer = useRef<XYResizerInstance | null>(null);
@@ -129,7 +129,7 @@ function ResizeControl({
]);
const positionClassNames = controlPosition.split('-');
const colorStyleProp = variant === ResizeControlVariant.Line ? 'borderColor' : 'backgroundColor';
const colorStyleProp = variant === ResizerControlVariant.Line ? 'borderColor' : 'backgroundColor';
const controlStyle = color ? { ...style, [colorStyleProp]: color } : style;
return (
@@ -144,7 +144,7 @@ function ResizeControl({
}
export function ResizeControlLine(props: ResizeControlLineProps) {
return <ResizeControl {...props} variant={ResizeControlVariant.Line} />;
return <ResizeControl {...props} variant={ResizerControlVariant.Line} />;
}
export default memo(ResizeControl);