chore: lint files

Signed-off-by: braks <78412429+bcakmakoglu@users.noreply.github.com>
This commit is contained in:
braks
2023-04-11 20:28:02 +02:00
committed by Braks
parent ab18bbc7d8
commit 5560949ed1
23 changed files with 247 additions and 80 deletions
@@ -10,14 +10,22 @@ interface Props extends HTMLAttributes {
} }
function shiftX(x: number, shift: number, position: Position): number { function shiftX(x: number, shift: number, position: Position): number {
if (position === Position.Left) return x - shift if (position === Position.Left) {
if (position === Position.Right) return x + shift return x - shift
}
if (position === Position.Right) {
return x + shift
}
return x return x
} }
function shiftY(y: number, shift: number, position: Position): number { function shiftY(y: number, shift: number, position: Position): number {
if (position === Position.Top) return y - shift if (position === Position.Top) {
if (position === Position.Bottom) return y + shift return y - shift
}
if (position === Position.Bottom) {
return y + shift
}
return y return y
} }
@@ -25,7 +25,9 @@ onMounted(getBox)
watch([() => x, () => y, $$(el), () => label], getBox) watch([() => x, () => y, $$(el), () => label], getBox)
function getBox() { function getBox() {
if (!el) return if (!el) {
return
}
const nextBox = el.getBBox() const nextBox = el.getBBox()
@@ -71,7 +71,9 @@ const EdgeWrapper = defineComponent({
}) })
return () => { return () => {
if (!sourceNode || !targetNode || !edge) return null if (!sourceNode || !targetNode || !edge) {
return null
}
let sourceNodeHandles let sourceNodeHandles
if (connectionMode.value === ConnectionMode.Strict) { if (connectionMode.value === ConnectionMode.Strict) {
@@ -238,7 +240,9 @@ const EdgeWrapper = defineComponent({
} }
function handleEdgeUpdater(event: MouseEvent, isSourceHandle: boolean) { function handleEdgeUpdater(event: MouseEvent, isSourceHandle: boolean) {
if (event.button !== 0) return if (event.button !== 0) {
return
}
updating = true updating = true
@@ -85,11 +85,15 @@ until(() => node.initialized)
.then(() => { .then(() => {
const existingBounds = node.handleBounds[type.value]?.find((b) => b.id === handleId.value) const existingBounds = node.handleBounds[type.value]?.find((b) => b.id === handleId.value)
if (!vueFlowRef.value || existingBounds) return if (!vueFlowRef.value || existingBounds) {
return
}
const viewportNode = vueFlowRef.value.querySelector('.vue-flow__transformationpane') const viewportNode = vueFlowRef.value.querySelector('.vue-flow__transformationpane')
if (!nodeEl || !handle.value || !viewportNode || !handleId.value) return if (!nodeEl || !handle.value || !viewportNode || !handleId.value) {
return
}
const nodeBounds = nodeEl.value.getBoundingClientRect() const nodeBounds = nodeEl.value.getBoundingClientRect()
@@ -81,9 +81,13 @@ const NodeWrapper = defineComponent({
const width = node.width instanceof Function ? node.width(node) : node.width const width = node.width instanceof Function ? node.width(node) : node.width
const height = node.height instanceof Function ? node.height(node) : node.height const height = node.height instanceof Function ? node.height(node) : node.height
if (width) styles.width = typeof width === 'string' ? width : `${width}px` if (width) {
styles.width = typeof width === 'string' ? width : `${width}px`
}
if (height) styles.height = typeof height === 'string' ? height : `${height}px` if (height) {
styles.height = typeof height === 'string' ? height : `${height}px`
}
return styles return styles
}) })
@@ -248,7 +252,9 @@ const NodeWrapper = defineComponent({
} }
function updateInternals() { function updateInternals() {
if (nodeElement.value) updateNodeDimensions([{ id: props.id, nodeElement: nodeElement.value, forceUpdate: true }]) if (nodeElement.value) {
updateNodeDimensions([{ id: props.id, nodeElement: nodeElement.value, forceUpdate: true }])
}
} }
function onMouseEnter(event: MouseEvent) { function onMouseEnter(event: MouseEvent) {
@@ -294,7 +300,9 @@ const NodeWrapper = defineComponent({
} }
function onKeyDown(event: KeyboardEvent) { function onKeyDown(event: KeyboardEvent) {
if (isInputDOMNode(event)) return if (isInputDOMNode(event)) {
return
}
if (elementSelectionKeys.includes(event.key) && props.selectable) { if (elementSelectionKeys.includes(event.key) && props.selectable) {
const unselect = event.key === 'Escape' const unselect = event.key === 'Escape'
@@ -38,7 +38,9 @@ function onContextMenu(event: MouseEvent) {
} }
function onKeyDown(event: KeyboardEvent) { function onKeyDown(event: KeyboardEvent) {
if (disableKeyboardA11y) return if (disableKeyboardA11y) {
return
}
if (arrowKeyDiffs[event.key]) { if (arrowKeyDiffs[event.key]) {
updatePositions( updatePositions(
+6 -2
View File
@@ -98,7 +98,9 @@ function useDrag(params: UseDragParams) {
return n return n
}) })
if (!hasChange) return if (!hasChange) {
return
}
updateNodePositions(dragItems, true, true) updateNodePositions(dragItems, true, true)
@@ -116,7 +118,9 @@ function useDrag(params: UseDragParams) {
} }
const autoPan = (): void => { const autoPan = (): void => {
if (!containerBounds) return if (!containerBounds) {
return
}
const [xMovement, yMovement] = calcAutoPan(mousePosition, containerBounds) const [xMovement, yMovement] = calcAutoPan(mousePosition, containerBounds)
+6 -2
View File
@@ -77,7 +77,9 @@ export default (keyFilter: MaybeRef<KeyFilter | null>, onChange?: (keyPressed: b
(e) => { (e) => {
modifierPressed = wasModifierPressed(e) modifierPressed = wasModifierPressed(e)
if (!modifierPressed && isInputDOMNode(e)) return if (!modifierPressed && isInputDOMNode(e)) {
return
}
e.preventDefault() e.preventDefault()
@@ -90,7 +92,9 @@ export default (keyFilter: MaybeRef<KeyFilter | null>, onChange?: (keyPressed: b
unrefKeyFilter, unrefKeyFilter,
(e) => { (e) => {
if (isPressed) { if (isPressed) {
if (!modifierPressed && isInputDOMNode(e)) return if (!modifierPressed && isInputDOMNode(e)) {
return
}
modifierPressed = false modifierPressed = false
+3 -1
View File
@@ -83,7 +83,9 @@ export default (state: State, getters: ComputedGetters) => {
duration: 0, duration: 0,
}, },
) => { ) => {
if (!nodes.length) return if (!nodes.length) {
return
}
const nodesToFit: GraphNode[] = (options.includeHiddenNodes ? nodes : getNodes).filter((node) => { const nodesToFit: GraphNode[] = (options.includeHiddenNodes ? nodes : getNodes).filter((node) => {
const initialized = node.initialized && node.dimensions.width && node.dimensions.height const initialized = node.initialized && node.dimensions.width && node.dimensions.height
+5 -2
View File
@@ -1,6 +1,9 @@
type UseWindow = Window & typeof globalThis & { chrome?: any } type UseWindow = Window & typeof globalThis & { chrome?: any }
export default (): UseWindow => { export default (): UseWindow => {
if (typeof window !== 'undefined') return window as UseWindow if (typeof window !== 'undefined') {
else return { chrome: false } as UseWindow return window as UseWindow
} else {
return { chrome: false } as UseWindow
}
} }
@@ -37,7 +37,9 @@ export default (vueFlowId?: string): ViewportFunctions => {
duration: 0, duration: 0,
}, },
) => { ) => {
if (!nodes.length) return if (!nodes.length) {
return
}
const nodesToFit: GraphNode[] = (options.includeHiddenNodes ? nodes : getNodes).filter((node) => { const nodesToFit: GraphNode[] = (options.includeHiddenNodes ? nodes : getNodes).filter((node) => {
const initialized = node.initialized && node.dimensions.width && node.dimensions.height const initialized = node.initialized && node.dimensions.width && node.dimensions.height
@@ -25,7 +25,9 @@ const {
const sourceNode = controlledComputed( const sourceNode = controlledComputed(
() => connectionStartHandle?.nodeId, () => connectionStartHandle?.nodeId,
() => { () => {
if (connectionStartHandle?.nodeId) return findNode(connectionStartHandle.nodeId) if (connectionStartHandle?.nodeId) {
return findNode(connectionStartHandle.nodeId)
}
return false return false
}, },
@@ -74,7 +76,9 @@ function getType(type?: string, template?: GraphEdge['template']) {
} }
} }
} }
if (edgeType && typeof edgeType !== 'string') return edgeType if (edgeType && typeof edgeType !== 'string') {
return edgeType
}
const slot = slots?.[`edge-${name}`] const slot = slots?.[`edge-${name}`]
if (!slot) { if (!slot) {
@@ -12,8 +12,11 @@ const markers = computed(() => {
if (marker) { if (marker) {
const markerId = getMarkerId(marker, vueFlowId) const markerId = getMarkerId(marker, vueFlowId)
if (!ids.includes(markerId)) { if (!ids.includes(markerId)) {
if (typeof marker === 'object') markers.push({ ...marker, id: markerId, color: marker.color || defaultColor }) if (typeof marker === 'object') {
else markers.push({ id: markerId, color: defaultColor, type: marker as MarkerType }) markers.push({ ...marker, id: markerId, color: marker.color || defaultColor })
} else {
markers.push({ id: markerId, color: defaultColor, type: marker as MarkerType })
}
ids.push(markerId) ids.push(markerId)
} }
} }
@@ -70,7 +70,9 @@ function getType(type?: string, template?: GraphNode['template']) {
} }
} }
} }
if (typeof nodeType !== 'string') return nodeType if (typeof nodeType !== 'string') {
return nodeType
}
const slot = slots?.[`node-${name}`] const slot = slots?.[`node-${name}`]
if (!slot) { if (!slot) {
+36 -12
View File
@@ -42,7 +42,9 @@ const containerBounds = ref<DOMRect>()
const hasActiveSelection = computed(() => elementsSelectable.value && (isSelecting || userSelectionActive.value)) const hasActiveSelection = computed(() => elementsSelectable.value && (isSelecting || userSelectionActive.value))
useKeyPress(deleteKeyCode, (keyPressed) => { useKeyPress(deleteKeyCode, (keyPressed) => {
if (!keyPressed) return if (!keyPressed) {
return
}
const nodesToRemove = getNodes.value.reduce<GraphNode[]>((res, node) => { const nodesToRemove = getNodes.value.reduce<GraphNode[]>((res, node) => {
if (!node.selected && node.parentNode && res.find((n) => n.id === node.parentNode)) { if (!node.selected && node.parentNode && res.find((n) => n.id === node.parentNode)) {
@@ -82,7 +84,9 @@ function resetUserSelection() {
} }
function onClick(event: MouseEvent) { function onClick(event: MouseEvent) {
if (event.target !== container.value || hasActiveSelection.value) return if (event.target !== container.value || hasActiveSelection.value) {
return
}
emits.paneClick(event) emits.paneClick(event)
@@ -92,7 +96,9 @@ function onClick(event: MouseEvent) {
} }
function onContextMenu(event: MouseEvent) { function onContextMenu(event: MouseEvent) {
if (event.target !== container.value) return if (event.target !== container.value) {
return
}
if (Array.isArray(panOnDrag.value) && panOnDrag.value?.includes(2)) { if (Array.isArray(panOnDrag.value) && panOnDrag.value?.includes(2)) {
event.preventDefault() event.preventDefault()
@@ -103,7 +109,9 @@ function onContextMenu(event: MouseEvent) {
} }
function onWheel(event: WheelEvent) { function onWheel(event: WheelEvent) {
if (event.target !== container.value) return if (event.target !== container.value) {
return
}
emits.paneScroll(event) emits.paneScroll(event)
} }
@@ -141,11 +149,19 @@ function onMouseDown(event: MouseEvent) {
} }
function onMouseMove(event: MouseEvent) { function onMouseMove(event: MouseEvent) {
if (!isSelecting || !containerBounds.value || !userSelectionRect.value) return if (!isSelecting || !containerBounds.value || !userSelectionRect.value) {
if (!hasActiveSelection.value) return emits.paneMouseMove(event) return
}
if (!hasActiveSelection.value) {
return emits.paneMouseMove(event)
}
if (!userSelectionActive.value) userSelectionActive.value = true if (!userSelectionActive.value) {
if (nodesSelectionActive.value) nodesSelectionActive.value = false userSelectionActive.value = true
}
if (nodesSelectionActive.value) {
nodesSelectionActive.value = false
}
const mousePos = getMousePosition(event, containerBounds.value) const mousePos = getMousePosition(event, containerBounds.value)
const startX = userSelectionRect.value.startX ?? 0 const startX = userSelectionRect.value.startX ?? 0
@@ -177,9 +193,13 @@ function onMouseMove(event: MouseEvent) {
} }
function onMouseUp(event: MouseEvent) { function onMouseUp(event: MouseEvent) {
if (!hasActiveSelection.value) return if (!hasActiveSelection.value) {
return
}
if (event.button !== 0) return if (event.button !== 0) {
return
}
// We only want to trigger click functions when in selection mode if // We only want to trigger click functions when in selection mode if
// the user did not move the mouse. // the user did not move the mouse.
@@ -195,7 +215,9 @@ function onMouseUp(event: MouseEvent) {
} }
function onMouseLeave(event: MouseEvent) { function onMouseLeave(event: MouseEvent) {
if (!hasActiveSelection.value) return emits.paneMouseLeave(event) if (!hasActiveSelection.value) {
return emits.paneMouseLeave(event)
}
if (userSelectionActive.value) { if (userSelectionActive.value) {
nodesSelectionActive.value = prevSelectedNodesCount.value > 0 nodesSelectionActive.value = prevSelectedNodesCount.value > 0
@@ -206,7 +228,9 @@ function onMouseLeave(event: MouseEvent) {
} }
function onMouseEnter(event: MouseEvent) { function onMouseEnter(event: MouseEvent) {
if (hasActiveSelection.value) return if (hasActiveSelection.value) {
return
}
emits.paneMouseEnter(event) emits.paneMouseEnter(event)
} }
@@ -118,7 +118,9 @@ onMounted(() => {
}) })
d3Zoom.on('start', (event: D3ZoomEvent<HTMLDivElement, any>) => { d3Zoom.on('start', (event: D3ZoomEvent<HTMLDivElement, any>) => {
if (!event.sourceEvent) return null if (!event.sourceEvent) {
return null
}
// we need to remember it here, because it's always 0 in the "zoom" event // we need to remember it here, because it's always 0 in the "zoom" event
mouseButton = event.sourceEvent.button mouseButton = event.sourceEvent.button
@@ -138,7 +140,9 @@ onMounted(() => {
}) })
d3Zoom.on('end', (event: D3ZoomEvent<HTMLDivElement, any>) => { d3Zoom.on('end', (event: D3ZoomEvent<HTMLDivElement, any>) => {
if (!event.sourceEvent) return null if (!event.sourceEvent) {
return null
}
isZoomingOrPanning = false isZoomingOrPanning = false
@@ -223,27 +227,43 @@ onMounted(() => {
} }
// if all interactions are disabled, we prevent all zoom events // if all interactions are disabled, we prevent all zoom events
if (!panOnDrag && !zoomScroll && !panOnScroll && !zoomOnDoubleClick && !zoomOnPinch) return false if (!panOnDrag && !zoomScroll && !panOnScroll && !zoomOnDoubleClick && !zoomOnPinch) {
return false
}
// during a selection we prevent all other interactions // during a selection we prevent all other interactions
if (userSelectionActive) return false if (userSelectionActive) {
return false
}
// if zoom on double click is disabled, we prevent the double click event // if zoom on double click is disabled, we prevent the double click event
if (!zoomOnDoubleClick && event.type === 'dblclick') return false if (!zoomOnDoubleClick && event.type === 'dblclick') {
return false
}
// if the target element is inside an element with the nowheel class, we prevent zooming // if the target element is inside an element with the nowheel class, we prevent zooming
if (isWrappedWithClass(event, noWheelClassName) && event.type === 'wheel') return false if (isWrappedWithClass(event, noWheelClassName) && event.type === 'wheel') {
return false
}
// if the target element is inside an element with the nopan class, we prevent panning // if the target element is inside an element with the nopan class, we prevent panning
if (isWrappedWithClass(event, noPanClassName) && event.type !== 'wheel') return false if (isWrappedWithClass(event, noPanClassName) && event.type !== 'wheel') {
return false
}
if (!zoomOnPinch && event.ctrlKey && event.type === 'wheel') return false if (!zoomOnPinch && event.ctrlKey && event.type === 'wheel') {
return false
}
// when there is no scroll handling enabled, we prevent all wheel events // when there is no scroll handling enabled, we prevent all wheel events
if (!zoomScroll && !panOnScroll && !pinchZoom && event.type === 'wheel') return false if (!zoomScroll && !panOnScroll && !pinchZoom && event.type === 'wheel') {
return false
}
// if the pane is not movable, we prevent dragging it with mousestart or touchstart // if the pane is not movable, we prevent dragging it with mousestart or touchstart
if (!panOnDrag && (event.type === 'mousedown' || event.type === 'touchstart')) return false if (!panOnDrag && (event.type === 'mousedown' || event.type === 'touchstart')) {
return false
}
// if the pane is only movable using allowed clicks // if the pane is only movable using allowed clicks
if ( if (
@@ -283,7 +303,9 @@ function eventToFlowTransform(eventTransform: ZoomTransform): ViewportTransform
} }
function setDimensions() { function setDimensions() {
if (!viewportEl.value) return if (!viewportEl.value) {
return
}
const { width, height } = getDimensions(viewportEl.value) const { width, height } = getDimensions(viewportEl.value)
+26 -9
View File
@@ -25,8 +25,11 @@ function handleParentExpand(updateItem: GraphNode, parent: GraphNode) {
if (extendWidth > 0 || extendHeight > 0 || updateItem.position.x < 0 || updateItem.position.y < 0) { if (extendWidth > 0 || extendHeight > 0 || updateItem.position.x < 0 || updateItem.position.y < 0) {
let parentStyles: Styles = {} let parentStyles: Styles = {}
if (isFunction(parent.style)) parentStyles = { ...parent.style(parent) } if (isFunction(parent.style)) {
else if (parent.style) parentStyles = { ...parent.style } parentStyles = { ...parent.style(parent) }
} else if (parent.style) {
parentStyles = { ...parent.style }
}
parentStyles.width = parentStyles.width ?? `${parent.dimensions.width}px` parentStyles.width = parentStyles.width ?? `${parent.dimensions.width}px`
parentStyles.height = parentStyles.height ?? `${parent.dimensions.height}px` parentStyles.height = parentStyles.height ?? `${parent.dimensions.height}px`
@@ -114,11 +117,15 @@ export function applyChanges<
if (change.type === 'add') { if (change.type === 'add') {
const index = elements.findIndex((el) => el.id === change.item.id) const index = elements.findIndex((el) => el.id === change.item.id)
if (index === -1) elements.push(<T>change.item) if (index === -1) {
elements.push(<T>change.item)
}
} else if (change.type === 'remove') { } else if (change.type === 'remove') {
const index = elements.findIndex((el) => el.id === change.id) const index = elements.findIndex((el) => el.id === change.id)
if (index !== -1) elements.splice(index, 1) if (index !== -1) {
elements.splice(index, 1)
}
} }
}) })
@@ -134,9 +141,13 @@ export function applyChanges<
break break
case 'position': case 'position':
if (isGraphNode(element)) { if (isGraphNode(element)) {
if (typeof currentChange.position !== 'undefined') element.position = currentChange.position if (typeof currentChange.position !== 'undefined') {
element.position = currentChange.position
}
if (typeof currentChange.dragging !== 'undefined') element.dragging = currentChange.dragging if (typeof currentChange.dragging !== 'undefined') {
element.dragging = currentChange.dragging
}
if (element.expandParent && element.parentNode) { if (element.expandParent && element.parentNode) {
const parent = elements[elementIds.indexOf(element.parentNode)] const parent = elements[elementIds.indexOf(element.parentNode)]
@@ -149,7 +160,9 @@ export function applyChanges<
break break
case 'dimensions': case 'dimensions':
if (isGraphNode(element)) { if (isGraphNode(element)) {
if (typeof currentChange.dimensions !== 'undefined') element.dimensions = currentChange.dimensions if (typeof currentChange.dimensions !== 'undefined') {
element.dimensions = currentChange.dimensions
}
if (typeof currentChange.updateStyle !== 'undefined') { if (typeof currentChange.updateStyle !== 'undefined') {
element.style = { element.style = {
@@ -159,7 +172,9 @@ export function applyChanges<
} }
} }
if (typeof currentChange.resizing !== 'undefined') element.resizing = currentChange.resizing if (typeof currentChange.resizing !== 'undefined') {
element.resizing = currentChange.resizing
}
if (element.expandParent && element.parentNode) { if (element.expandParent && element.parentNode) {
const parent = elements[elementIds.indexOf(element.parentNode)] const parent = elements[elementIds.indexOf(element.parentNode)]
@@ -175,7 +190,9 @@ export function applyChanges<
} }
} }
if (!element.initialized) element.initialized = true if (!element.initialized) {
element.initialized = true
}
} }
break break
} }
+5 -2
View File
@@ -5,8 +5,11 @@ export function hasSelector(target: Element, selector: string, node: Element): b
let current = target let current = target
do { do {
if (current && current.matches(selector)) return true if (current && current.matches(selector)) {
else if (current === node) return false return true
} else if (current === node) {
return false
}
current = current.parentElement as Element current = current.parentElement as Element
} while (current) } while (current)
+3 -1
View File
@@ -141,7 +141,9 @@ export function groupEdgesByZLevel(edges: GraphEdge[], findNode: Actions['findNo
const source = findNode(edge.source) const source = findNode(edge.source)
const target = findNode(edge.target) const target = findNode(edge.target)
if (!source || !target) return tree if (!source || !target) {
return tree
}
if (elevateEdgesOnSelect) { if (elevateEdgesOnSelect) {
z = hasZIndex ? edge.zIndex! : Math.max(source.computedPosition.z || 0, target.computedPosition.z || 0) z = hasZIndex ? edge.zIndex! : Math.max(source.computedPosition.z || 0, target.computedPosition.z || 0)
+41 -9
View File
@@ -58,8 +58,11 @@ export function getHostForElement(element: HTMLElement): Document {
const doc = element.getRootNode() as Document const doc = element.getRootNode() as Document
const window = useWindow() const window = useWindow()
if ('elementFromPoint' in doc) return doc if ('elementFromPoint' in doc) {
else return window.document return doc
} else {
return window.document
}
} }
export function isEdge<Data = ElementData>(element: MaybeElement): element is Edge<Data> { export function isEdge<Data = ElementData>(element: MaybeElement): element is Edge<Data> {
@@ -147,7 +150,9 @@ function getConnectedElements<T extends Elements = FlowElements>(
elements: T, elements: T,
dir: 'source' | 'target', dir: 'source' | 'target',
): T extends FlowElements ? GraphNode[] : Node[] { ): T extends FlowElements ? GraphNode[] : Node[] {
if (!isNode(node)) return [] if (!isNode(node)) {
return []
}
const origin = dir === 'source' ? 'target' : 'source' const origin = dir === 'source' ? 'target' : 'source'
const ids = elements.filter((e) => isEdge(e) && e[origin] === node.id).map((e) => isEdge(e) && e[dir]) const ids = elements.filter((e) => isEdge(e) && e[origin] === node.id).map((e) => isEdge(e) && e[dir])
return elements.filter((e) => ids.includes(e.id)) as T extends FlowElements ? GraphNode[] : Node[] return elements.filter((e) => ids.includes(e.id)) as T extends FlowElements ? GraphNode[] : Node[]
@@ -200,7 +205,9 @@ export function addEdge(edgeParams: Edge | Connection, elements: Elements, defau
edge = parseEdge(edge, defaults) edge = parseEdge(edge, defaults)
if (connectionExists(edge, elements)) return elements if (connectionExists(edge, elements)) {
return elements
}
elements.push(edge) elements.push(edge)
@@ -363,6 +370,21 @@ export function getConnectedEdges(nodes: (Node | GraphNode | { id: string })[],
return edges.filter((edge) => nodeIds.includes(edge.source) || nodeIds.includes(edge.target)) return edges.filter((edge) => nodeIds.includes(edge.source) || nodeIds.includes(edge.target))
} }
export function getConnectedNodes(nodes: (Node | GraphNode | { id: string })[], edges: GraphEdge[]) {
const nodeIds = nodes.map((node) => node.id)
const connectedNodeIds = edges.reduce((acc, edge) => {
if (nodeIds.includes(edge.source)) {
acc.add(edge.target)
}
if (nodeIds.includes(edge.target)) {
acc.add(edge.source)
}
return acc
}, new Set<string>())
return nodes.filter((node) => connectedNodeIds.has(node.id))
}
export function getTransformForBounds( export function getTransformForBounds(
bounds: Rect, bounds: Rect,
width: number, width: number,
@@ -396,20 +418,30 @@ export function getXYZPos(parentPos: XYZPosition, computedPosition: XYZPosition)
} }
export function isParentSelected(node: GraphNode, findNode: Actions['findNode']): boolean { export function isParentSelected(node: GraphNode, findNode: Actions['findNode']): boolean {
if (!node.parentNode) return false if (!node.parentNode) {
return false
}
const parent = findNode(node.parentNode) const parent = findNode(node.parentNode)
if (!parent) return false if (!parent) {
return false
}
if (parent.selected) return true if (parent.selected) {
return true
}
return isParentSelected(parent, findNode) return isParentSelected(parent, findNode)
} }
export function getMarkerId(marker: EdgeMarkerType | undefined, vueFlowId?: string) { export function getMarkerId(marker: EdgeMarkerType | undefined, vueFlowId?: string) {
if (typeof marker === 'undefined') return '' if (typeof marker === 'undefined') {
return ''
}
if (typeof marker === 'string') return marker if (typeof marker === 'string') {
return marker
}
const idPrefix = vueFlowId ? `${vueFlowId}__` : '' const idPrefix = vueFlowId ? `${vueFlowId}__` : ''
+6 -2
View File
@@ -26,7 +26,9 @@ export function addEdgeToStore(edgeParams: Edge | Connection, edges: Edge[], onE
edge = parseEdge(edge) edge = parseEdge(edge)
if (connectionExists(edge, edges)) return false if (connectionExists(edge, edges)) {
return false
}
return edge return edge
} }
@@ -102,7 +104,9 @@ export function createGraphNodes(
node.isParent = true node.isParent = true
} }
if (parentNode) parentNode.isParent = true if (parentNode) {
parentNode.isParent = true
}
} }
}) })
+15 -6
View File
@@ -26,8 +26,11 @@ export function useWatch(
store.setElements(elements) store.setElements(elements)
// only trigger store watcher immediately if we actually set any elements to the store // only trigger store watcher immediately if we actually set any elements to the store
if (!pauseStore && !immediateStore && elements.length) immediateStore = true if (!pauseStore && !immediateStore && elements.length) {
else pauseStore?.resume() immediateStore = true
} else {
pauseStore?.resume()
}
} }
}) })
@@ -69,8 +72,11 @@ export function useWatch(
store.setNodes(nodes) store.setNodes(nodes)
// only trigger store watcher immediately if we actually set any elements to the store // only trigger store watcher immediately if we actually set any elements to the store
if (!pauseStore && !immediateStore && nodes.length) immediateStore = true if (!pauseStore && !immediateStore && nodes.length) {
else pauseStore?.resume() immediateStore = true
} else {
pauseStore?.resume()
}
} }
}) })
@@ -112,8 +118,11 @@ export function useWatch(
store.setEdges(edges) store.setEdges(edges)
// only trigger store watcher immediately if we actually set any elements to the store // only trigger store watcher immediately if we actually set any elements to the store
if (!pauseStore && !immediateStore && edges.length) immediateStore = true if (!pauseStore && !immediateStore && edges.length) {
else pauseStore?.resume() immediateStore = true
} else {
pauseStore?.resume()
}
} }
}) })
+3 -1
View File
@@ -89,7 +89,9 @@ const viewBox = computed(() => {
}) })
const d = computed(() => { const d = computed(() => {
if (!viewBox.value.x || !viewBox.value.y) return '' if (!viewBox.value.x || !viewBox.value.y) {
return ''
}
return ` return `
M${viewBox.value.x - viewBox.value.offset},${viewBox.value.y - viewBox.value.offset} M${viewBox.value.x - viewBox.value.offset},${viewBox.value.y - viewBox.value.offset}