// src/index.ts
import {
  ConnectionLineType as ConnectionLineType3,
  ConnectionMode as ConnectionMode3,
  MarkerType as MarkerType2,
  PanOnScrollMode as PanOnScrollMode3,
  Position as Position10,
  ResizeControlVariant as ResizeControlVariant3,
  SelectionMode as SelectionMode3
} from "@xyflow/system";

// src/additional-components/Background/Background.tsx
import cc2 from "classcat";
import { mergeProps, Show } from "solid-js";

// src/hooks/useStore.ts
import { errorMessages } from "@xyflow/system";
import { batch, useContext } from "solid-js";

// src/contexts/StoreContext.ts
import { createContext } from "solid-js";
var StoreContext = createContext(null);
var Provider = StoreContext.Provider;
var StoreContext_default = StoreContext;

// src/hooks/useStore.ts
var zustandErrorMessage = errorMessages["error001"]();
function useStore(selector26) {
  const store = useContext(StoreContext_default);
  if (store === null) {
    throw new Error(zustandErrorMessage);
  }
  return selector26(store);
}
function useStoreApi() {
  const store = useContext(StoreContext_default);
  if (store === null) {
    throw new Error(zustandErrorMessage);
  }
  return {
    ...store,
    batch: (fn) => {
      batch(() => {
        fn(store);
      });
    }
  };
}

// src/styles/utils.ts
var containerStyle = {
  position: "absolute",
  width: "100%",
  height: "100%",
  top: 0,
  left: 0
};

// src/utils/hooks.ts
var useRef = (initialValue) => {
  return new RefObject(initialValue);
};
var RefObject = class {
  constructor(_current) {
    this._current = _current;
  }
  get current() {
    return this._current;
  }
  set current(value) {
    this._current = value;
  }
};

// src/additional-components/Background/Patterns.tsx
import cc from "classcat";
function LinePattern(p) {
  return <path
    stroke-width={p.lineWidth}
    d={`M${p.dimensions[0] / 2} 0 V${p.dimensions[1]} M0 ${p.dimensions[1] / 2} H${p.dimensions[0]}`}
    class={cc(["solid-flow__background-pattern", p.variant, p.className])}
  />;
}
function DotPattern(p) {
  return <circle
    cx={p.radius}
    cy={p.radius}
    r={p.radius}
    class={cc(["solid-flow__background-pattern", "dots", p.className])}
  />;
}

// src/additional-components/Background/types.ts
var BackgroundVariant = /* @__PURE__ */ ((BackgroundVariant2) => {
  BackgroundVariant2["Lines"] = "lines";
  BackgroundVariant2["Dots"] = "dots";
  BackgroundVariant2["Cross"] = "cross";
  return BackgroundVariant2;
})(BackgroundVariant || {});

// src/additional-components/Background/Background.tsx
var defaultSize = {
  ["dots" /* Dots */]: 1,
  ["lines" /* Lines */]: 1,
  ["cross" /* Cross */]: 6
};
var selector = (s) => ({
  transform: s.transform,
  patternId: `pattern-${s.rfId.get()}`
});
function BackgroundComponent(_p) {
  const p = mergeProps(
    {
      variant: "dots" /* Dots */,
      gap: 20,
      lineWidth: 1,
      offset: 0
    },
    _p
  );
  const ref = useRef(null);
  const storeData = useStore(selector);
  const patternSize = () => p.size || defaultSize[p.variant];
  const isDots = () => p.variant === "dots" /* Dots */;
  const isCross = () => p.variant === "cross" /* Cross */;
  const gapXY = () => {
    if (Array.isArray(p.gap)) {
      return p.gap;
    } else {
      return [p.gap, p.gap];
    }
  };
  const scaledGap = () => [
    gapXY()[0] * storeData.transform.get()[2] || 1,
    gapXY()[1] * storeData.transform.get()[2] || 1
  ];
  const scaledSize = () => patternSize() * storeData.transform.get()[2];
  const offsetXY = () => {
    if (Array.isArray(p.offset)) {
      return p.offset;
    } else {
      return [p.offset, p.offset];
    }
  };
  const patternDimensions = () => isCross() ? [scaledSize(), scaledSize()] : scaledGap();
  const scaledOffset = () => [
    offsetXY()[0] * storeData.transform.get()[2] || 1 + patternDimensions()[0] / 2,
    offsetXY()[1] * storeData.transform.get()[2] || 1 + patternDimensions()[1] / 2
  ];
  const _patternId = () => `${storeData.patternId}${p.id ? p.id : ""}`;
  const style2 = () => {
    return {
      ...p.style,
      ...containerStyle,
      "--xy-background-color-props": p.bgColor,
      "--xy-background-pattern-color-props": p.color
    };
  };
  return <svg
    class={cc2(["solid-flow__background", p.className])}
    style={style2()}
    ref={(el) => ref.current = el}
    data-testid="rf__background"
  >
			<pattern
    id={_patternId()}
    x={storeData.transform.get()[0] % scaledGap()[0]}
    y={storeData.transform.get()[1] % scaledGap()[1]}
    width={scaledGap()[0]}
    height={scaledGap()[1]}
    patternUnits="userSpaceOnUse"
    patternTransform={`translate(-${scaledOffset()[0]},-${scaledOffset()[1]})`}
  >
				<Show
    when={isDots()}
    fallback={<LinePattern
      dimensions={patternDimensions()}
      lineWidth={p.lineWidth}
      variant={p.variant}
      className={p.patternClassName}
    />}
  >
					<DotPattern
    radius={scaledSize() / 2}
    className={p.patternClassName}
  />
				</Show>
			</pattern>
			<rect
    x="0"
    y="0"
    width="100%"
    height="100%"
    fill={`url(#${_patternId()})`}
  />
		</svg>;
}
BackgroundComponent.displayName = "Background";
var Background = BackgroundComponent;

// src/additional-components/Controls/ControlButton.tsx
import cc3 from "classcat";
import { splitProps } from "solid-js";
function ControlButton(p) {
  const [_, rest] = splitProps(p, ["children", "class"]);
  return <button
    type="button"
    class={cc3(["solid-flow__controls-button", p.class])}
    {...rest}
  >
			{p.children}
		</button>;
}

// src/additional-components/Controls/Controls.tsx
import cc5 from "classcat";
import { mergeProps as mergeProps3, Show as Show2 } from "solid-js";

// src/components/Panel/index.tsx
import cc4 from "classcat";
import { mergeProps as mergeProps2 } from "solid-js";
var selector2 = (s) => () => s.userSelectionActive.get() ? "none" : "all";
function Panel(_p) {
  const p = mergeProps2({ position: "top-left" }, _p);
  const pointerEvents = useStore(selector2);
  const positionClasses = () => `${p.position}`.split("-");
  const style2 = () => {
    if (typeof p.style === "object") {
      return {
        ...p.style,
        "pointer-events": pointerEvents()
      };
    } else {
      return { "pointer-events": pointerEvents() };
    }
  };
  return <div
    {...p}
    class={cc4(["solid-flow__panel", p.class, ...positionClasses()])}
    style={style2()}
  >
			{p.children}
		</div>;
}

// src/hooks/useSolidFlow.ts
import {
  evaluateAbsolutePosition,
  getElementsToRemove,
  getNodesBounds,
  getOverlappingArea,
  isRectObject,
  nodeToRect,
  withResolvers
} from "@xyflow/system";
import { createMemo as createMemo2 } from "solid-js";

// src/components/BatchProvider/index.tsx
import { createContext as createContext2, useContext as useContext2 } from "solid-js";

// src/utils/changes.ts
function applyChanges(changes, elements) {
  const updatedElements = [];
  const changesMap = /* @__PURE__ */ new Map();
  const addItemChanges = [];
  for (const change of changes) {
    if (change.type === "add") {
      addItemChanges.push(change);
    } else if (change.type === "remove" || change.type === "replace") {
      changesMap.set(change.id, [change]);
    } else {
      const elementChanges = changesMap.get(change.id);
      if (elementChanges) {
        elementChanges.push(change);
      } else {
        changesMap.set(change.id, [change]);
      }
    }
  }
  for (const element of elements) {
    const changes2 = changesMap.get(element.id);
    if (!changes2) {
      updatedElements.push(element);
      continue;
    }
    if (changes2[0].type === "remove") {
      continue;
    }
    if (changes2[0].type === "replace") {
      updatedElements.push({ ...changes2[0].item });
      continue;
    }
    const updatedElement = { ...element };
    for (const change of changes2) {
      applyChange(change, updatedElement);
    }
    updatedElements.push(updatedElement);
  }
  if (addItemChanges.length) {
    addItemChanges.forEach((change) => {
      if (change.index !== void 0) {
        updatedElements.splice(change.index, 0, { ...change.item });
      } else {
        updatedElements.push({ ...change.item });
      }
    });
  }
  return updatedElements;
}
function applyChange(change, element) {
  switch (change.type) {
    case "select": {
      element.selected = change.selected;
      break;
    }
    case "position": {
      if (typeof change.position !== "undefined") {
        element.position = change.position;
      }
      if (typeof change.dragging !== "undefined") {
        element.dragging = change.dragging;
      }
      break;
    }
    case "dimensions": {
      if (typeof change.dimensions !== "undefined") {
        element.measured ??= {};
        element.measured.width = change.dimensions.width;
        element.measured.height = change.dimensions.height;
        if (change.setAttributes) {
          if (change.setAttributes === true || change.setAttributes === "width") {
            element.width = change.dimensions.width;
          }
          if (change.setAttributes === true || change.setAttributes === "height") {
            element.height = change.dimensions.height;
          }
        }
      }
      if (typeof change.resizing === "boolean") {
        element.resizing = change.resizing;
      }
      break;
    }
  }
}
function applyNodeChanges(changes, nodes) {
  return applyChanges(changes, nodes);
}
function applyEdgeChanges(changes, edges) {
  return applyChanges(changes, edges);
}
function createSelectionChange(id, selected2) {
  return {
    id,
    type: "select",
    selected: selected2
  };
}
function getSelectionChanges(items, selectedIds = /* @__PURE__ */ new Set(), mutateItem = false) {
  const changes = [];
  for (const [id, item] of items) {
    const willBeSelected = selectedIds.has(id);
    if (!(item.selected === void 0 && !willBeSelected) && item.selected !== willBeSelected) {
      if (mutateItem) {
        item.selected = willBeSelected;
      }
      changes.push(createSelectionChange(item.id, willBeSelected));
    }
  }
  return changes;
}
function getElementsDiffChanges({
  items = [],
  lookup
}) {
  const changes = [];
  const itemsLookup = new Map(
    items.map((item) => [item.id, item])
  );
  for (const [index, item] of items.entries()) {
    const lookupItem = lookup.get(item.id);
    const storeItem = lookupItem?.internals?.userNode ?? lookupItem;
    if (storeItem !== void 0 && storeItem !== item) {
      changes.push({ id: item.id, item, type: "replace" });
    }
    if (storeItem === void 0) {
      changes.push({ item, type: "add", index });
    }
  }
  for (const [id] of lookup) {
    const nextNode = itemsLookup.get(id);
    if (nextNode === void 0) {
      changes.push({ id, type: "remove" });
    }
  }
  return changes;
}
function elementToRemoveChange(item) {
  return {
    id: item.id,
    type: "remove"
  };
}

// src/utils/general.ts
import { isEdgeBase, isNodeBase } from "@xyflow/system";
var isNode = (element) => isNodeBase(element);
var isEdge = (element) => isEdgeBase(element);

// src/components/BatchProvider/useQueue.ts
import { createSignal as createSignal2 } from "solid-js";

// src/hooks/useIsomorphicLayoutEffect.ts
import { createEffect } from "solid-js";
var useIsomorphicLayoutEffect = typeof window !== "undefined" ? createEffect : createEffect;

// src/store/initialState.ts
import { ReactiveMap } from "@solid-primitives/map";
import {
  adoptUserNodes,
  ConnectionMode,
  devWarn,
  getInternalNodesBounds,
  getViewportForBounds,
  infiniteExtent,
  initialConnection,
  updateConnectionLookup
} from "@xyflow/system";
import { createSignal } from "solid-js";
import { createStore } from "solid-js/store";
var getInitialState = ({
  nodes,
  edges,
  defaultNodes,
  defaultEdges,
  width,
  height,
  fitView,
  fitViewOptions,
  minZoom = 0.5,
  maxZoom = 2,
  nodeOrigin,
  nodeExtent
} = {}) => {
  const nodeLookup = /* @__PURE__ */ new Map();
  const parentLookup = /* @__PURE__ */ new Map();
  const connectionLookup = /* @__PURE__ */ new Map();
  const edgeLookup = /* @__PURE__ */ new Map();
  const storeEdges = defaultEdges ?? edges ?? [];
  const storeNodes = defaultNodes ?? nodes ?? [];
  const storeNodeOrigin = nodeOrigin ?? [0, 0];
  const storeNodeExtent = nodeExtent ?? infiniteExtent;
  updateConnectionLookup(connectionLookup, edgeLookup, storeEdges);
  const nodesInitialized = adoptUserNodes(
    storeNodes,
    nodeLookup,
    parentLookup,
    {
      nodeOrigin: storeNodeOrigin,
      nodeExtent: storeNodeExtent,
      elevateNodesOnSelect: false
    }
  );
  let transform = [0, 0, 1];
  if (fitView && width && height) {
    const bounds = getInternalNodesBounds(nodeLookup, {
      filter: (node) => !!((node.width || node.initialWidth) && (node.height || node.initialHeight))
    });
    const { x, y, zoom } = getViewportForBounds(
      bounds,
      width,
      height,
      minZoom,
      maxZoom,
      fitViewOptions?.padding ?? 0.1
    );
    transform = [x, y, zoom];
  }
  return {
    rfId: new Writable("1"),
    width: new Writable(width ?? 0),
    height: new Writable(height ?? 0),
    transform: new Writable(transform),
    nodes: new Writable(storeNodes),
    nodesInitialized: new Writable(nodesInitialized),
    nodeLookup: new ReactiveMap(),
    parentLookup: new ReactiveMap(),
    edges: new Writable(storeEdges),
    edgeLookup: new ReactiveMap(),
    connectionLookup: new ReactiveMap(),
    onNodesChange: wNullable(),
    onEdgesChange: wNullable(),
    hasDefaultNodes: new Writable(defaultNodes !== void 0),
    hasDefaultEdges: new Writable(defaultEdges !== void 0),
    panZoom: new Writable(null),
    minZoom: new Writable(minZoom),
    maxZoom: new Writable(maxZoom),
    translateExtent: new Writable(infiniteExtent),
    nodeExtent: new Writable(storeNodeExtent),
    nodesSelectionActive: new Writable(false),
    userSelectionActive: new Writable(false),
    userSelectionRect: new Writable(null),
    connection: new ReactiveStore(
      { ...initialConnection },
      "connection"
    ),
    connectionMode: new Writable(ConnectionMode.Strict),
    domNode: new Writable(null),
    paneDragging: new Writable(false, "paneDragging"),
    noPanClassName: new Writable("nopan"),
    nodeOrigin: new Writable(storeNodeOrigin),
    nodeDragThreshold: new Writable(1),
    snapGrid: new Writable([15, 15]),
    snapToGrid: new Writable(false),
    nodesDraggable: new Writable(true),
    nodesConnectable: new Writable(true),
    nodesFocusable: new Writable(true),
    edgesFocusable: new Writable(true),
    edgesReconnectable: new Writable(true),
    elementsSelectable: new Writable(true),
    elevateNodesOnSelect: new Writable(true),
    elevateEdgesOnSelect: new Writable(false),
    selectNodesOnDrag: new Writable(true),
    multiSelectionActive: new Writable(false),
    connectionClickStartHandle: wNullable(),
    connectOnClick: w(true),
    ariaLiveMessage: w(""),
    autoPanOnConnect: w(true),
    autoPanOnNodeDrag: w(true),
    autoPanSpeed: w(15),
    connectionRadius: w(20),
    onError: w(devWarn),
    isValidConnection: void 0,
    onSelectionChangeHandlers: w([]),
    onConnect: wEmpty(),
    onDelete: wEmpty(),
    onEdgesDelete: wEmpty(),
    onNodesDelete: wEmpty(),
    onBeforeDelete: wEmpty(),
    onViewportChange: wEmpty(),
    onViewportChangeEnd: wEmpty(),
    onViewportChangeStart: wEmpty(),
    onMoveStart: wEmpty(),
    onMove: wEmpty(),
    onMoveEnd: wEmpty(),
    lib: new Writable("solid"),
    debug: new Writable(false),
    // New properties for React compatibility
    fitViewQueued: new Writable(fitView ?? false),
    fitViewOptions: new Writable(fitViewOptions),
    fitViewResolver: wNullable()
  };
};
var initialState_default = getInitialState;
var w = (x) => new Writable(x);
var wEmpty = () => new Writable(void 0);
var wNullable = () => new Writable(null);
var Writable = class {
  constructor(initial, debugName) {
    this.debugName = debugName;
    this.s = createSignal(initial, {
      name: debugName
    });
  }
  s;
  get = () => {
    const value = this.s[0]();
    return value;
  };
  set = (v) => {
    this.s[1](() => {
      return v;
    });
  };
  setFromPrev = (fn) => {
    this.s[1]((prev) => {
      const newValue = fn(prev);
      return newValue;
    });
  };
};
var ReactiveStore = class {
  constructor(initial, debugName) {
    this.debugName = debugName;
    this.store = createStore(initial);
  }
  store;
  get = () => {
    const value = this.store[0];
    return value;
  };
  setter = () => {
    return this.store[1];
  };
};

// src/components/BatchProvider/useQueue.ts
function useQueue(runQueue) {
  const [shouldFlush, setShouldFlush] = createSignal2(false);
  const queue = createQueue(() => setShouldFlush(true));
  useIsomorphicLayoutEffect(() => {
    if (!shouldFlush()) {
      queue.reset();
      return;
    }
    const queueItems = queue.get();
    if (queueItems.length) {
      runQueue(queueItems);
      queue.reset();
    }
    setShouldFlush(false);
  });
  return queue;
}
function createQueue(cb) {
  const queue = new Writable([]);
  return {
    get: () => queue.get(),
    reset: () => {
      queue.set([]);
    },
    push: (item) => {
      queue.setFromPrev((prev) => [...prev, item]);
      cb();
    }
  };
}

// src/components/BatchProvider/index.tsx
var BatchContext = createContext2(null);
function BatchProvider(p) {
  const store = useStoreApi();
  const nodeQueueHandler = (queueItems) => {
    const {
      nodes,
      setNodes,
      hasDefaultNodes,
      onNodesChange: getOnNodesChange,
      nodeLookup
      // edgeLookup,
    } = store;
    let next = nodes.get();
    for (const payload of queueItems) {
      next = typeof payload === "function" ? payload(next) : payload;
    }
    const onNodesChange = getOnNodesChange.get();
    if (hasDefaultNodes.get()) {
      setNodes(next);
    } else if (onNodesChange) {
      onNodesChange(
        getElementsDiffChanges({
          items: next,
          lookup: nodeLookup
        })
      );
    }
  };
  const nodeQueue = useQueue(nodeQueueHandler);
  const edgeQueueHandler = (queueItems) => {
    const {
      edges,
      setEdges,
      hasDefaultEdges,
      onEdgesChange: getOnEdgesChange,
      edgeLookup
    } = store;
    let next = edges.get();
    for (const payload of queueItems) {
      next = typeof payload === "function" ? payload(next) : payload;
    }
    const onEdgesChange = getOnEdgesChange.get();
    if (hasDefaultEdges.get()) {
      setEdges(next);
    } else if (onEdgesChange) {
      onEdgesChange(
        getElementsDiffChanges({
          items: next,
          lookup: edgeLookup
        })
      );
    }
  };
  const edgeQueue = useQueue(edgeQueueHandler);
  const value = { nodeQueue, edgeQueue };
  return <BatchContext.Provider value={value}>{p.children}</BatchContext.Provider>;
}
function useBatchContext() {
  const batchContext = useContext2(BatchContext);
  if (!batchContext) {
    throw new Error("useBatchContext must be used within a BatchProvider");
  }
  return batchContext;
}

// src/hooks/useViewportHelper.ts
import {
  getViewportForBounds as getViewportForBounds2,
  pointToRendererPoint,
  rendererPointToPoint
} from "@xyflow/system";
import { createMemo } from "solid-js";
var useViewportHelper = () => {
  const store = useStoreApi();
  return createMemo(() => {
    const getState = () => ({
      panZoom: store.panZoom.get(),
      transform: store.transform.get(),
      width: store.width.get(),
      height: store.height.get(),
      minZoom: store.minZoom.get(),
      maxZoom: store.maxZoom.get(),
      nodeOrigin: store.nodeOrigin.get(),
      nodeLookup: store.nodeLookup,
      snapGrid: store.snapGrid.get(),
      snapToGrid: store.snapToGrid.get(),
      domNode: store.domNode.get()
    });
    return {
      zoomIn: (options) => {
        const { panZoom } = getState();
        return panZoom ? panZoom.scaleBy(1.2, { duration: options?.duration }) : Promise.resolve(false);
      },
      zoomOut: (options) => {
        const { panZoom } = getState();
        return panZoom ? panZoom.scaleBy(1 / 1.2, { duration: options?.duration }) : Promise.resolve(false);
      },
      zoomTo: (zoomLevel, options) => {
        const { panZoom } = getState();
        return panZoom ? panZoom.scaleTo(zoomLevel, { duration: options?.duration }) : Promise.resolve(false);
      },
      getZoom: () => getState().transform[2],
      setViewport: async (viewport, options) => {
        const {
          transform: [tX, tY, tZoom],
          panZoom
        } = getState();
        if (!panZoom) {
          return Promise.resolve(false);
        }
        await panZoom.setViewport(
          {
            x: viewport.x ?? tX,
            y: viewport.y ?? tY,
            zoom: viewport.zoom ?? tZoom
          },
          options
        );
        return Promise.resolve(true);
      },
      getViewport: () => {
        const [x, y, zoom] = getState().transform;
        return { x, y, zoom };
      },
      setCenter: async (x, y, options) => {
        const { width, height, maxZoom, panZoom } = getState();
        const nextZoom = typeof options?.zoom !== "undefined" ? options.zoom : maxZoom;
        const centerX = width / 2 - x * nextZoom;
        const centerY = height / 2 - y * nextZoom;
        if (!panZoom) {
          return Promise.resolve(false);
        }
        await panZoom.setViewport(
          {
            x: centerX,
            y: centerY,
            zoom: nextZoom
          },
          {
            duration: options?.duration,
            ease: options?.ease,
            interpolate: options?.interpolate
          }
        );
        return Promise.resolve(true);
      },
      fitBounds: async (bounds, options) => {
        const { width, height, minZoom, maxZoom, panZoom } = getState();
        const viewport = getViewportForBounds2(
          bounds,
          width,
          height,
          minZoom,
          maxZoom,
          options?.padding ?? 0.1
        );
        if (!panZoom) {
          return Promise.resolve(false);
        }
        await panZoom.setViewport(viewport, {
          duration: options?.duration,
          ease: options?.ease,
          interpolate: options?.interpolate
        });
        return Promise.resolve(true);
      },
      screenToFlowPosition: (clientPosition, options = {}) => {
        const { transform, snapGrid, snapToGrid, domNode } = getState();
        if (!domNode) {
          return clientPosition;
        }
        const { x: domX, y: domY } = domNode.getBoundingClientRect();
        const correctedPosition = {
          x: clientPosition.x - domX,
          y: clientPosition.y - domY
        };
        const _snapGrid = options.snapGrid ?? snapGrid;
        const _snapToGrid = options.snapToGrid ?? snapToGrid;
        return pointToRendererPoint(
          correctedPosition,
          transform,
          _snapToGrid,
          _snapGrid
        );
      },
      flowToScreenPosition: (flowPosition) => {
        const { transform, domNode } = getState();
        if (!domNode) {
          return flowPosition;
        }
        const { x: domX, y: domY } = domNode.getBoundingClientRect();
        const rendererPosition = rendererPointToPoint(flowPosition, transform);
        return {
          x: rendererPosition.x + domX,
          y: rendererPosition.y + domY
        };
      }
    };
  })();
};
var useViewportHelper_default = useViewportHelper;

// src/hooks/useSolidFlow.ts
var selector3 = (s) => () => !!s.panZoom.get();
function useSolidFlow() {
  const viewportHelper = useViewportHelper_default();
  const store = useStoreApi();
  const batchContext = useBatchContext();
  const viewportInitialized = useStore(selector3);
  const generalHelper = createMemo2(() => {
    const getInternalNode = (id) => store.nodeLookup.get(id);
    const setNodes = (payload) => {
      batchContext.nodeQueue.push(payload);
    };
    const setEdges = (payload) => {
      batchContext.edgeQueue.push(payload);
    };
    const getNodeRect = (node) => {
      const { nodeLookup, nodeOrigin } = store;
      const nodeToUse = isNode(node) ? node : nodeLookup.get(node.id);
      const position = nodeToUse.parentId ? evaluateAbsolutePosition(
        nodeToUse.position,
        nodeToUse.measured,
        nodeToUse.parentId,
        nodeLookup,
        nodeOrigin.get()
      ) : nodeToUse.position;
      const nodeWithPosition = {
        ...nodeToUse,
        position,
        width: nodeToUse.measured?.width ?? nodeToUse.width,
        height: nodeToUse.measured?.height ?? nodeToUse.height
      };
      return nodeToRect(nodeWithPosition);
    };
    const updateNode = (id, nodeUpdate, options = { replace: false }) => {
      setNodes(
        (prevNodes) => prevNodes.map((node) => {
          if (node.id === id) {
            const nextNode = typeof nodeUpdate === "function" ? nodeUpdate(node) : nodeUpdate;
            return options.replace && isNode(nextNode) ? nextNode : { ...node, ...nextNode };
          }
          return node;
        })
      );
    };
    const updateEdge = (id, edgeUpdate, options = { replace: false }) => {
      setEdges(
        (prevEdges) => prevEdges.map((edge) => {
          if (edge.id === id) {
            const nextEdge = typeof edgeUpdate === "function" ? edgeUpdate(edge) : edgeUpdate;
            return options.replace && isEdge(nextEdge) ? nextEdge : { ...edge, ...nextEdge };
          }
          return edge;
        })
      );
    };
    return {
      getNodes: () => store.nodes.get().map((n) => ({ ...n })),
      getNode: (id) => getInternalNode(id)?.internals.userNode,
      getInternalNode,
      getEdges: () => {
        const { edges } = store;
        return edges.get().map((e) => ({ ...e }));
      },
      getEdge: (id) => store.edgeLookup.get(id),
      setNodes,
      setEdges,
      addNodes: (payload) => {
        const newNodes = Array.isArray(payload) ? payload : [payload];
        batchContext.nodeQueue.push((nodes) => [...nodes, ...newNodes]);
      },
      addEdges: (payload) => {
        const newEdges = Array.isArray(payload) ? payload : [payload];
        batchContext.edgeQueue.push((edges) => [...edges, ...newEdges]);
      },
      toObject: () => {
        const { nodes, edges, transform } = store;
        const [x, y, zoom] = transform.get();
        return {
          nodes: nodes.get().map((n) => ({ ...n })),
          edges: edges.get().map((e) => ({ ...e })),
          viewport: {
            x,
            y,
            zoom
          }
        };
      },
      deleteElements: async ({
        nodes: nodesToRemove = [],
        edges: edgesToRemove = []
      }) => {
        const {
          nodes,
          edges,
          onNodesDelete,
          onEdgesDelete,
          triggerNodeChanges,
          triggerEdgeChanges,
          onDelete,
          onBeforeDelete
        } = store;
        const { nodes: matchingNodes, edges: matchingEdges } = await getElementsToRemove({
          nodesToRemove,
          edgesToRemove,
          nodes: nodes.get(),
          edges: edges.get(),
          onBeforeDelete: onBeforeDelete.get()
        });
        const hasMatchingEdges = matchingEdges.length > 0;
        const hasMatchingNodes = matchingNodes.length > 0;
        if (hasMatchingEdges) {
          const edgeChanges = matchingEdges.map(
            elementToRemoveChange
          );
          onEdgesDelete.get()?.(matchingEdges);
          triggerEdgeChanges(edgeChanges);
        }
        if (hasMatchingNodes) {
          const nodeChanges = matchingNodes.map(
            elementToRemoveChange
          );
          onNodesDelete.get()?.(matchingNodes);
          triggerNodeChanges(nodeChanges);
        }
        if (hasMatchingNodes || hasMatchingEdges) {
          onDelete.get()?.({ nodes: matchingNodes, edges: matchingEdges });
        }
        return { deletedNodes: matchingNodes, deletedEdges: matchingEdges };
      },
      getIntersectingNodes: (nodeOrRect, partially = true, nodes) => {
        const isRect = isRectObject(nodeOrRect);
        const nodeRect = isRect ? nodeOrRect : getNodeRect(nodeOrRect);
        const hasNodesOption = nodes !== void 0;
        if (!nodeRect) {
          return [];
        }
        return (nodes || store.nodes.get()).filter((n) => {
          const internalNode = store.nodeLookup.get(n.id);
          if (internalNode && !isRect && (n.id === nodeOrRect.id || !internalNode.internals.positionAbsolute)) {
            return false;
          }
          const currNodeRect = nodeToRect(hasNodesOption ? n : internalNode);
          const overlappingArea = getOverlappingArea(currNodeRect, nodeRect);
          const partiallyVisible = partially && overlappingArea > 0;
          return partiallyVisible || overlappingArea >= nodeRect.width * nodeRect.height;
        });
      },
      isNodeIntersecting: (nodeOrRect, area, partially = true) => {
        const isRect = isRectObject(nodeOrRect);
        const nodeRect = isRect ? nodeOrRect : getNodeRect(nodeOrRect);
        if (!nodeRect) {
          return false;
        }
        const overlappingArea = getOverlappingArea(nodeRect, area);
        const partiallyVisible = partially && overlappingArea > 0;
        return partiallyVisible || overlappingArea >= nodeRect.width * nodeRect.height;
      },
      updateNode,
      updateNodeData: (id, dataUpdate, options = { replace: false }) => {
        updateNode(
          id,
          (node) => {
            const nextData = typeof dataUpdate === "function" ? dataUpdate(node) : dataUpdate;
            return options.replace ? { ...node, data: nextData } : { ...node, data: { ...node.data, ...nextData } };
          },
          options
        );
      },
      updateEdge,
      updateEdgeData: (id, dataUpdate, options = { replace: false }) => {
        updateEdge(
          id,
          (edge) => {
            const nextData = typeof dataUpdate === "function" ? dataUpdate(edge) : dataUpdate;
            return options.replace ? { ...edge, data: nextData } : { ...edge, data: { ...edge.data, ...nextData } };
          },
          options
        );
      },
      getNodesBounds: (nodes) => {
        const { nodeLookup, nodeOrigin } = store;
        return getNodesBounds(nodes, {
          nodeLookup,
          nodeOrigin: nodeOrigin.get()
        });
      },
      getHandleConnections: ({ type, id, nodeId }) => Array.from(
        store.connectionLookup.get(`${nodeId}-${type}${id ? `-${id}` : ""}`)?.values() ?? []
      ),
      getNodeConnections: ({ type, handleId, nodeId }) => Array.from(
        store.connectionLookup.get(
          `${nodeId}${type ? handleId ? `-${type}-${handleId}` : `-${type}` : ""}`
        )?.values() ?? []
      ),
      fitView: async (options) => {
        const fitViewResolver = store.fitViewResolver.get() ?? withResolvers();
        store.fitViewQueued.set(true);
        store.fitViewOptions.set(options);
        store.fitViewResolver.set(fitViewResolver);
        batchContext.nodeQueue.push((nodes) => [...nodes]);
        return fitViewResolver.promise;
      }
    };
  });
  return createMemo2(() => ({
    ...generalHelper(),
    ...viewportHelper,
    viewportInitialized
  }))();
}

// src/additional-components/Controls/Icons/FitView.tsx
function FitViewIcon() {
  return <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 30">
			<path d="M3.692 4.63c0-.53.4-.938.939-.938h5.215V0H4.708C2.13 0 0 2.054 0 4.63v5.216h3.692V4.631zM27.354 0h-5.2v3.692h5.17c.53 0 .984.4.984.939v5.215H32V4.631A4.624 4.624 0 0027.354 0zm.954 24.83c0 .532-.4.94-.939.94h-5.215v3.768h5.215c2.577 0 4.631-2.13 4.631-4.707v-5.139h-3.692v5.139zm-23.677.94c-.531 0-.939-.4-.939-.94v-5.138H0v5.139c0 2.577 2.13 4.707 4.708 4.707h5.138V25.77H4.631z" />
		</svg>;
}

// src/additional-components/Controls/Icons/Lock.tsx
function LockIcon() {
  return <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 32">
			<path d="M21.333 10.667H19.81V7.619C19.81 3.429 16.38 0 12.19 0 8 0 4.571 3.429 4.571 7.619v3.048H3.048A3.056 3.056 0 000 13.714v15.238A3.056 3.056 0 003.048 32h18.285a3.056 3.056 0 003.048-3.048V13.714a3.056 3.056 0 00-3.048-3.047zM12.19 24.533a3.056 3.056 0 01-3.047-3.047 3.056 3.056 0 013.047-3.048 3.056 3.056 0 013.048 3.048 3.056 3.056 0 01-3.048 3.047zm4.724-13.866H7.467V7.619c0-2.59 2.133-4.724 4.723-4.724 2.591 0 4.724 2.133 4.724 4.724v3.048z" />
		</svg>;
}

// src/additional-components/Controls/Icons/Minus.tsx
function MinusIcon() {
  return <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 5">
			<path d="M0 0h32v4.2H0z" />
		</svg>;
}

// src/additional-components/Controls/Icons/Plus.tsx
function PlusIcon() {
  return <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
			<path d="M32 18.133H18.133V32h-4.266V18.133H0v-4.266h13.867V0h4.266v13.867H32z" />
		</svg>;
}

// src/additional-components/Controls/Icons/Unlock.tsx
function UnlockIcon() {
  return <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 25 32">
			<path d="M21.333 10.667H19.81V7.619C19.81 3.429 16.38 0 12.19 0c-4.114 1.828-1.37 2.133.305 2.438 1.676.305 4.42 2.59 4.42 5.181v3.048H3.047A3.056 3.056 0 000 13.714v15.238A3.056 3.056 0 003.048 32h18.285a3.056 3.056 0 003.048-3.048V13.714a3.056 3.056 0 00-3.048-3.047zM12.19 24.533a3.056 3.056 0 01-3.047-3.047 3.056 3.056 0 013.047-3.048 3.056 3.056 0 013.048 3.048 3.056 3.056 0 01-3.048 3.047z" />
		</svg>;
}

// src/additional-components/Controls/Controls.tsx
var selector4 = (s) => ({
  isInteractive: () => s.nodesDraggable.get() || s.nodesConnectable.get() || s.elementsSelectable.get(),
  minZoomReached: () => s.transform.get()[2] <= s.minZoom.get(),
  maxZoomReached: () => s.transform.get()[2] >= s.maxZoom.get()
});
function ControlsComponent(_p) {
  const p = mergeProps3(
    {
      showZoom: true,
      showFitView: true,
      showInteractive: true,
      position: "bottom-left",
      orientation: "vertical",
      "aria-label": "React Flow controls"
    },
    _p
  );
  const store = useStoreApi();
  const storeData = useStore(selector4);
  const { zoomIn, zoomOut, fitView } = useSolidFlow();
  const onZoomInHandler = () => {
    zoomIn();
    p.onZoomIn?.();
  };
  const onZoomOutHandler = () => {
    zoomOut();
    p.onZoomOut?.();
  };
  const onFitViewHandler = () => {
    fitView(p.fitViewOptions);
    p.onFitView?.();
  };
  const onToggleInteractivity = () => {
    store.batch((store2) => {
      store2.nodesDraggable.set(!storeData.isInteractive());
      store2.nodesConnectable.set(!storeData.isInteractive());
      store2.elementsSelectable.set(!storeData.isInteractive());
    });
    p.onInteractiveChange?.(!storeData.isInteractive());
  };
  const orientationClass = () => p.orientation === "horizontal" ? "horizontal" : "vertical";
  return <Panel
    class={cc5(["solid-flow__controls", orientationClass, p.className])}
    position={p.position}
    style={p.style}
    data-testid="rf__controls"
    aria-label={p["aria-label"]}
  >
			<Show2 when={p.showZoom}>
				<ControlButton
    onClick={onZoomInHandler}
    class="solid-flow__controls-zoomin"
    title="zoom in"
    aria-label="zoom in"
    disabled={storeData.maxZoomReached()}
  >
					<PlusIcon />
				</ControlButton>
				<ControlButton
    onClick={onZoomOutHandler}
    class="solid-flow__controls-zoomout"
    title="zoom out"
    aria-label="zoom out"
    disabled={storeData.minZoomReached()}
  >
					<MinusIcon />
				</ControlButton>
			</Show2>
			<Show2 when={p.showFitView}>
				<ControlButton
    class="solid-flow__controls-fitview"
    onClick={onFitViewHandler}
    title="fit view"
    aria-label="fit view"
  >
					<FitViewIcon />
				</ControlButton>
			</Show2>
			<Show2 when={p.showInteractive}>
				<ControlButton
    class="solid-flow__controls-interactive"
    onClick={onToggleInteractivity}
    title="toggle interactivity"
    aria-label="toggle interactivity"
  >
					{storeData.isInteractive() ? <UnlockIcon /> : <LockIcon />}
				</ControlButton>
			</Show2>
			{p.children}
		</Panel>;
}
ControlsComponent.displayName = "Controls";
var Controls = ControlsComponent;

// src/additional-components/MiniMap/MiniMap.tsx
import {
  getBoundsOfRects,
  getInternalNodesBounds as getInternalNodesBounds2,
  XYMinimap
} from "@xyflow/system";
import cc7 from "classcat";
import { createEffect as createEffect2, mergeProps as mergeProps5, onCleanup, Show as Show4 } from "solid-js";

// src/additional-components/MiniMap/MiniMapNodes.tsx
import { getNodeDimensions, nodeHasDimensions } from "@xyflow/system";
import { For, mergeProps as mergeProps4, Show as Show3 } from "solid-js";
import { Dynamic } from "solid-js/web";

// src/additional-components/MiniMap/MiniMapNode.tsx
import cc6 from "classcat";
function MiniMapNodeComponent({
  id,
  x,
  y,
  width,
  height,
  style: style2,
  color,
  strokeColor,
  strokeWidth,
  className,
  borderRadius,
  shapeRendering,
  selected: selected2,
  onClick
}) {
  const { background, "background-color": backgroundColor } = style2 || {};
  const fill = color || background || backgroundColor;
  return <rect
    class={cc6(["solid-flow__minimap-node", { selected: selected2 }, className])}
    x={x}
    y={y}
    rx={borderRadius}
    ry={borderRadius}
    width={width}
    height={height}
    style={{
      fill,
      stroke: strokeColor,
      "stroke-width": strokeWidth
    }}
    shape-rendering={shapeRendering}
    onClick={onClick ? (event) => onClick(event, id) : void 0}
  />;
}
var MiniMapNode = MiniMapNodeComponent;

// src/additional-components/MiniMap/MiniMapNodes.tsx
var selectorNodeIds = (s) => () => s.nodes.get().map((node) => node.id);
var getAttrFunction = (func) => func instanceof Function ? func : () => func;
function MiniMapNodes(_p) {
  const p = mergeProps4(
    {
      nodeClassName: "",
      nodeBorderRadius: 5,
      nodeComponent: MiniMapNode
    },
    _p
  );
  const nodeIds = useStore(selectorNodeIds);
  const nodeColorFunc = getAttrFunction(p.nodeColor);
  const nodeStrokeColorFunc = getAttrFunction(p.nodeStrokeColor);
  const nodeClassNameFunc = getAttrFunction(p.nodeClassName);
  const shapeRendering = typeof window === "undefined" || !!window.chrome ? "crispEdges" : "geometricPrecision";
  return <For each={nodeIds()}>
			{(nodeId) => <NodeComponentWrapper
    id={nodeId}
    nodeColorFunc={nodeColorFunc}
    nodeStrokeColorFunc={nodeStrokeColorFunc}
    nodeClassNameFunc={nodeClassNameFunc}
    nodeBorderRadius={p.nodeBorderRadius}
    nodeStrokeWidth={p.nodeStrokeWidth}
    NodeComponent={p.nodeComponent}
    onClick={p.onClick}
    shapeRendering={shapeRendering}
  />}
		</For>;
}
function NodeComponentWrapperInner(p) {
  const storeData = useStore((s) => {
    const internalNode = s.nodeLookup.get(p.id);
    if (!internalNode) {
      return {
        node: () => null,
        x: () => 0,
        y: () => 0,
        width: () => 0,
        height: () => 0
      };
    }
    const userNode = internalNode.internals.userNode;
    const positionAbsolute = internalNode.internals.positionAbsolute;
    const dimensions = getNodeDimensions(userNode);
    return {
      node: () => userNode,
      x: () => positionAbsolute.x,
      y: () => positionAbsolute.y,
      width: () => dimensions.width,
      height: () => dimensions.height
    };
  });
  return <Show3
    when={storeData.node() && !storeData.node().hidden && nodeHasDimensions(storeData.node()) ? storeData.node() : false}
  >
			{(validNode) => <Dynamic
    component={p.NodeComponent}
    x={storeData.x()}
    y={storeData.y()}
    width={storeData.width()}
    height={storeData.height()}
    style={validNode().style}
    selected={!!validNode().selected}
    className={p.nodeClassNameFunc(validNode())}
    color={p.nodeColorFunc(validNode())}
    borderRadius={p.nodeBorderRadius}
    strokeColor={p.nodeStrokeColorFunc(validNode())}
    strokeWidth={p.nodeStrokeWidth}
    shapeRendering={p.shapeRendering}
    onClick={p.onClick}
    id={validNode().id}
  />}
		</Show3>;
}
var NodeComponentWrapper = NodeComponentWrapperInner;
var MiniMapNodes_default = MiniMapNodes;

// src/additional-components/MiniMap/MiniMap.tsx
var defaultWidth = 200;
var defaultHeight = 150;
var filterHidden = (node) => !node.hidden;
var selector5 = (s) => {
  const viewBB = () => ({
    x: -s.transform.get()[0] / s.transform.get()[2],
    y: -s.transform.get()[1] / s.transform.get()[2],
    width: s.width.get() / s.transform.get()[2],
    height: s.height.get() / s.transform.get()[2]
  });
  return {
    viewBB,
    boundingRect: () => s.nodeLookup.size > 0 ? getBoundsOfRects(
      getInternalNodesBounds2(s.nodeLookup, { filter: filterHidden }),
      viewBB()
    ) : viewBB(),
    rfId: () => s.rfId.get(),
    panZoom: () => s.panZoom.get(),
    translateExtent: () => s.translateExtent.get(),
    flowWidth: () => s.width.get(),
    flowHeight: () => s.height.get()
  };
};
var ARIA_LABEL_KEY = "solid-flow__minimap-desc";
function MiniMapComponent(_p) {
  const p = mergeProps5(
    {
      nodeClassName: "",
      nodeBorderRadius: 5,
      position: "bottom-right",
      pannable: false,
      zoomable: false,
      ariaLabel: "React Flow mini map",
      zoomStep: 10,
      offsetScale: 5
    },
    _p
  );
  const store = useStoreApi();
  let svg;
  const storeData = useStore(selector5);
  const elementWidth = () => p.style?.width ?? defaultWidth;
  const elementHeight = () => p.style?.height ?? defaultHeight;
  const scaledWidth = () => storeData.boundingRect().width / elementWidth();
  const scaledHeight = () => storeData.boundingRect().height / elementHeight();
  const viewScale = () => Math.max(scaledWidth(), scaledHeight());
  const viewWidth = () => viewScale() * elementWidth();
  const viewHeight = () => viewScale() * elementHeight();
  const offset = () => p.offsetScale * viewScale();
  const x = () => storeData.boundingRect().x - (viewWidth() - storeData.boundingRect().width) / 2 - offset();
  const y = () => storeData.boundingRect().y - (viewHeight() - storeData.boundingRect().height) / 2 - offset();
  const width = () => viewWidth() + offset() * 2;
  const height = () => viewHeight() + offset() * 2;
  const labelledBy = () => `${ARIA_LABEL_KEY}-${storeData.rfId()}`;
  let viewScaleRef = 0;
  let minimapInstance;
  createEffect2(() => {
    viewScaleRef = viewScale();
  });
  createEffect2(() => {
    const pZoom = storeData.panZoom();
    if (svg && pZoom) {
      minimapInstance = XYMinimap({
        domNode: svg,
        panZoom: pZoom,
        getTransform: () => store.transform.get(),
        getViewScale: () => viewScaleRef
      });
      onCleanup(() => {
        minimapInstance?.destroy();
      });
    }
  });
  createEffect2(() => {
    minimapInstance?.update({
      translateExtent: storeData.translateExtent(),
      width: storeData.flowWidth(),
      height: storeData.flowHeight(),
      inversePan: p.inversePan,
      pannable: p.pannable,
      zoomStep: p.zoomStep,
      zoomable: p.zoomable
    });
  });
  const onSvgClick = p.onClick ? (event) => {
    const [x2, y2] = minimapInstance?.pointer(event) || [0, 0];
    p.onClick(event, { x: x2, y: y2 });
  } : void 0;
  const onSvgNodeClick = p.onNodeClick ? (event, nodeId) => {
    const node = store.nodeLookup.get(nodeId).internals.userNode;
    p.onNodeClick(event, node);
  } : void 0;
  return <Panel
    position={p.position}
    style={{
      ...p.style,
      "--xy-minimap-background-color-props": typeof p.bgColor === "string" ? p.bgColor : void 0,
      "--xy-minimap-mask-background-color-props": typeof p.maskColor === "string" ? p.maskColor : void 0,
      "--xy-minimap-mask-stroke-color-props": typeof p.maskStrokeColor === "string" ? p.maskStrokeColor : void 0,
      "--xy-minimap-mask-stroke-width-props": typeof p.maskStrokeWidth === "number" ? p.maskStrokeWidth * viewScale() : void 0,
      "--xy-minimap-node-background-color-props": typeof p.nodeColor === "string" ? p.nodeColor : void 0,
      "--xy-minimap-node-stroke-color-props": typeof p.nodeStrokeColor === "string" ? p.nodeStrokeColor : void 0,
      "--xy-minimap-node-stroke-width-props": typeof p.nodeStrokeWidth === "number" ? p.nodeStrokeWidth : void 0
    }}
    class={cc7(["solid-flow__minimap", p.class])}
    data-testid="rf__minimap"
  >
			<svg
    width={elementWidth()}
    height={elementHeight()}
    viewBox={`${x()} ${y()} ${width()} ${height()}`}
    class="solid-flow__minimap-svg"
    role="img"
    aria-labelledby={labelledBy()}
    ref={svg}
    onClick={onSvgClick}
  >
				<Show4 when={p.ariaLabel}>
					<title id={labelledBy()}>{p.ariaLabel}</title>
				</Show4>
				<MiniMapNodes_default
    onClick={onSvgNodeClick}
    nodeColor={p.nodeColor}
    nodeStrokeColor={p.nodeStrokeColor}
    nodeBorderRadius={p.nodeBorderRadius}
    nodeClassName={p.nodeClassName}
    nodeStrokeWidth={p.nodeStrokeWidth}
    nodeComponent={p.nodeComponent}
  />
				<path
    class="solid-flow__minimap-mask"
    d={`M${x() - offset()},${y() - offset()}h${width() + offset() * 2}v${height() + offset() * 2}h${-width() - offset() * 2}z
        M${storeData.viewBB().x},${storeData.viewBB().y}h${storeData.viewBB().width}v${storeData.viewBB().height}h${-storeData.viewBB().width}z`}
    fill-rule="evenodd"
    pointer-events="none"
  />
			</svg>
		</Panel>;
}
MiniMapComponent.displayName = "MiniMap";
var MiniMap = MiniMapComponent;

// src/additional-components/NodeResizer/NodeResizeControl.tsx
import {
  evaluateAbsolutePosition as evaluateAbsolutePosition2,
  handleExpandParent,
  ResizeControlVariant,
  XYResizer
} from "@xyflow/system";
import cc8 from "classcat";
import { createEffect as createEffect3, mergeProps as mergeProps6, onCleanup as onCleanup2 } from "solid-js";

// src/contexts/NodeIdContext.ts
import { createContext as createContext3, useContext as useContext3 } from "solid-js";
var NodeIdContext = createContext3(null);
var Provider2 = NodeIdContext.Provider;
var useNodeId = () => {
  const nodeId = useContext3(NodeIdContext);
  if (!nodeId) {
    throw new Error("NodeIdContext is not provided");
  }
  return nodeId;
};

// src/additional-components/NodeResizer/NodeResizeControl.tsx
function ResizeControl(_p) {
  const p = mergeProps6(
    {
      variant: ResizeControlVariant.Handle,
      style: {},
      minWidth: 10,
      minHeight: 10,
      maxWidth: Number.MAX_VALUE,
      maxHeight: Number.MAX_VALUE,
      keepAspectRatio: false
    },
    _p
  );
  const contextNodeId = useNodeId();
  const id = () => typeof p.nodeId === "string" ? p.nodeId : contextNodeId();
  const store = useStoreApi();
  const resizeControlRef = useRef(null);
  const defaultPosition = () => p.variant === ResizeControlVariant.Line ? "right" : "bottom-right";
  const controlPosition = () => p.position ?? defaultPosition();
  const resizer = useRef(null);
  createEffect3(() => {
    const nodeId = id();
    if (!resizeControlRef.current || !nodeId) {
      return;
    }
    if (!resizer.current) {
      resizer.current = XYResizer({
        domNode: resizeControlRef.current,
        nodeId,
        getStoreItems: () => {
          return {
            nodeLookup: store.nodeLookup,
            transform: store.transform.get(),
            snapGrid: store.snapGrid.get(),
            snapToGrid: store.snapToGrid.get(),
            nodeOrigin: store.nodeOrigin.get(),
            paneDomNode: store.domNode.get()
          };
        },
        onChange: (change, childChanges) => {
          const changes = [];
          const nextPosition = { x: change.x, y: change.y };
          const node = store.nodeLookup.get(nodeId);
          if (node && node.expandParent && node.parentId) {
            const origin = node.origin ?? store.nodeOrigin.get();
            const width = change.width ?? node.measured.width ?? 0;
            const height = change.height ?? node.measured.height ?? 0;
            const child = {
              id: node.id,
              parentId: node.parentId,
              rect: {
                width,
                height,
                ...evaluateAbsolutePosition2(
                  {
                    x: change.x ?? node.position.x,
                    y: change.y ?? node.position.y
                  },
                  { width, height },
                  node.parentId,
                  store.nodeLookup,
                  origin
                )
              }
            };
            const parentExpandChanges = handleExpandParent(
              [child],
              store.nodeLookup,
              store.parentLookup,
              store.nodeOrigin.get()
            );
            changes.push(...parentExpandChanges);
            nextPosition.x = change.x ? Math.max(origin[0] * width, change.x) : void 0;
            nextPosition.y = change.y ? Math.max(origin[1] * height, change.y) : void 0;
          }
          if (nextPosition.x !== void 0 && nextPosition.y !== void 0) {
            const positionChange = {
              id: nodeId,
              type: "position",
              position: { ...nextPosition }
            };
            changes.push(positionChange);
          }
          if (change.width !== void 0 && change.height !== void 0) {
            const setAttributes = !p.resizeDirection ? true : p.resizeDirection === "horizontal" ? "width" : "height";
            const dimensionChange = {
              id: nodeId,
              type: "dimensions",
              resizing: true,
              setAttributes,
              dimensions: {
                width: change.width,
                height: change.height
              }
            };
            changes.push(dimensionChange);
          }
          for (const childChange of childChanges) {
            const positionChange = {
              ...childChange,
              type: "position"
            };
            changes.push(positionChange);
          }
          store.triggerNodeChanges(changes);
        },
        onEnd: ({ width, height }) => {
          const dimensionChange = {
            id: nodeId,
            type: "dimensions",
            resizing: false,
            dimensions: {
              width,
              height
            }
          };
          store.triggerNodeChanges([dimensionChange]);
        }
      });
    }
    resizer.current.update({
      controlPosition: controlPosition(),
      boundaries: {
        minWidth: p.minWidth,
        minHeight: p.minHeight,
        maxWidth: p.maxWidth,
        maxHeight: p.maxHeight
      },
      keepAspectRatio: p.keepAspectRatio,
      resizeDirection: p.resizeDirection,
      onResizeStart: p.onResizeStart,
      onResize: p.onResize,
      onResizeEnd: p.onResizeEnd,
      shouldResize: p.shouldResize
    });
    onCleanup2(() => {
      resizer.current?.destroy();
    });
  });
  const positionClassNames = () => controlPosition().split("-");
  const colorStyleProp = () => p.variant === ResizeControlVariant.Line ? "borderColor" : "backgroundColor";
  const controlStyle = () => p.color ? { ...p.style, [colorStyleProp()]: p.color } : p.style;
  return <div
    class={cc8([
      "solid-flow__resize-control",
      "nodrag",
      ...positionClassNames(),
      p.variant,
      p.className
    ])}
    ref={(el) => resizeControlRef.current = el}
    style={controlStyle()}
  >
			{p.children}
		</div>;
}
var NodeResizeControl = ResizeControl;

// src/additional-components/NodeResizer/NodeResizer.tsx
import {
  ResizeControlVariant as ResizeControlVariant2,
  XY_RESIZER_HANDLE_POSITIONS,
  XY_RESIZER_LINE_POSITIONS
} from "@xyflow/system";
import { For as For2, mergeProps as mergeProps7, Show as Show5 } from "solid-js";
function NodeResizer(_p) {
  const p = mergeProps7(
    {
      isVisible: true,
      minWidth: 10,
      minHeight: 10,
      maxWidth: Number.MAX_VALUE,
      maxHeight: Number.MAX_VALUE,
      keepAspectRatio: false
    },
    _p
  );
  return <Show5 when={p.isVisible}>
			<For2 each={XY_RESIZER_LINE_POSITIONS}>
				{(position) => <NodeResizeControl
    className={p.lineClassName}
    style={p.lineStyle}
    nodeId={p.nodeId}
    position={position}
    variant={ResizeControlVariant2.Line}
    color={p.color}
    minWidth={p.minWidth}
    minHeight={p.minHeight}
    maxWidth={p.maxWidth}
    maxHeight={p.maxHeight}
    onResizeStart={p.onResizeStart}
    keepAspectRatio={p.keepAspectRatio}
    shouldResize={p.shouldResize}
    onResize={p.onResize}
    onResizeEnd={p.onResizeEnd}
  />}
			</For2>
			<For2 each={XY_RESIZER_HANDLE_POSITIONS}>
				{(position) => <NodeResizeControl
    className={p.handleClassName}
    style={p.handleStyle}
    nodeId={p.nodeId}
    position={position}
    color={p.color}
    minWidth={p.minWidth}
    minHeight={p.minHeight}
    maxWidth={p.maxWidth}
    maxHeight={p.maxHeight}
    onResizeStart={p.onResizeStart}
    keepAspectRatio={p.keepAspectRatio}
    shouldResize={p.shouldResize}
    onResize={p.onResize}
    onResizeEnd={p.onResizeEnd}
  />}
			</For2>
		</Show5>;
}

// src/additional-components/NodeToolbar/NodeToolbar.tsx
import {
  getNodesBounds as getNodesBounds2,
  getNodeToolbarTransform,
  Position
} from "@xyflow/system";
import cc9 from "classcat";
import { mergeProps as mergeProps8, Show as Show7, splitProps as splitProps2 } from "solid-js";

// src/additional-components/NodeToolbar/NodeToolbarPortal.tsx
import { Show as Show6 } from "solid-js";
import { Portal } from "solid-js/web";
var selector6 = (state) => () => state.domNode.get()?.querySelector(".solid-flow__renderer");
function NodeToolbarPortal(p) {
  const wrapperRef = useStore(selector6);
  return <Show6 when={wrapperRef()}>
			{(el) => {
    return <Portal mount={el()}>{p.children}</Portal>;
  }}
		</Show6>;
}

// src/additional-components/NodeToolbar/NodeToolbar.tsx
var storeSelector = (state) => ({
  viewport: () => ({
    x: state.transform.get()[0],
    y: state.transform.get()[1],
    zoom: state.transform.get()[2]
  }),
  nodeOrigin: state.nodeOrigin.get(),
  selectedNodesCount: state.nodes.get().filter((node) => node.selected).length
});
function NodeToolbar(_p) {
  const p = mergeProps8(
    { position: Position.Top, offset: 10, align: "center" },
    _p
  );
  const [_, rest] = splitProps2(p, [
    "nodeId",
    "children",
    "class",
    "style",
    "isVisible",
    "position",
    "offset",
    "align"
  ]);
  const getContextNodeId = useNodeId();
  const nodesSelector2 = (state) => () => {
    const nodeIds = Array.isArray(p.nodeId) ? p.nodeId : [p.nodeId || getContextNodeId() || ""];
    return nodeIds.reduce((acc, id) => {
      const node = state.nodeLookup.get(id);
      if (node) {
        acc.push(node);
      }
      return acc;
    }, []);
  };
  const nodes = useStore(nodesSelector2);
  const storeData = useStore(storeSelector);
  const isActive = () => typeof p.isVisible === "boolean" ? p.isVisible : nodes.length === 1 && nodes()[0].selected && storeData.selectedNodesCount === 1;
  const nodeRect = () => getNodesBounds2(nodes(), { nodeOrigin: storeData.nodeOrigin });
  const zIndex = () => Math.max(...nodes().map((node) => node.internals.z + 1));
  const wrapperStyle2 = () => ({
    position: "absolute",
    transform: getNodeToolbarTransform(
      nodeRect(),
      storeData.viewport(),
      p.position,
      p.offset,
      p.align
    ),
    "z-index": zIndex(),
    ...typeof p.style === "object" ? p.style : {}
  });
  return <Show7 when={isActive() && nodes().length > 0}>
			<NodeToolbarPortal>
				<div
    style={wrapperStyle2()}
    class={cc9(["solid-flow__node-toolbar", p.class])}
    {...rest}
    data-id={nodes().reduce((acc, node) => `${acc}${node.id} `, "").trim()}
  >
					{p.children}
				</div>
			</NodeToolbarPortal>
		</Show7>;
}

// src/components/EdgeLabelRenderer/index.tsx
import { Show as Show8 } from "solid-js";
import { Portal as Portal2 } from "solid-js/web";
var selector7 = (s) => () => s.domNode.get()?.querySelector(".solid-flow__edgelabel-renderer");
function EdgeLabelRenderer(p) {
  const edgeLabelRenderer = useStore(selector7);
  return <Show8 when={edgeLabelRenderer()}>
			{(el) => {
    return <Portal2 mount={el()}>{p.children}</Portal2>;
  }}
		</Show8>;
}

// src/components/Edges/BaseEdge.tsx
import { isNumeric } from "@xyflow/system";
import cc11 from "classcat";
import { mergeProps as mergeProps10, Show as Show10, splitProps as splitProps4 } from "solid-js";

// src/components/Edges/EdgeText.tsx
import cc10 from "classcat";
import {
  createEffect as createEffect4,
  createSignal as createSignal3,
  mergeProps as mergeProps9,
  Show as Show9,
  splitProps as splitProps3
} from "solid-js";
function EdgeTextComponent(_p) {
  const p = mergeProps9(
    {
      labelShowBg: true,
      labelBgPadding: [2, 4],
      labelBgBorderRadius: 2
    },
    _p
  );
  const [edgeTextBbox, setEdgeTextBbox] = createSignal3({
    x: 1,
    y: 0,
    width: 0,
    height: 0
  });
  const edgeTextClasses = () => cc10(["solid-flow__edge-textwrapper", p.class]);
  let edgeTextRef;
  createEffect4(() => {
    if (edgeTextRef) {
      const textBbox = edgeTextRef.getBBox();
      setEdgeTextBbox({
        x: textBbox.x,
        y: textBbox.y,
        width: textBbox.width,
        height: textBbox.height
      });
    }
  });
  const [extractedProps, rest] = splitProps3(p, [
    "x",
    "y",
    "label",
    "labelStyle",
    "labelShowBg",
    "labelBgStyle",
    "labelBgPadding",
    "labelBgBorderRadius",
    "children",
    "class"
  ]);
  if (!extractedProps.label) {
    return null;
  }
  return <g
    transform={`translate(${extractedProps.x - edgeTextBbox().width / 2} ${extractedProps.y - edgeTextBbox().height / 2})`}
    class={edgeTextClasses()}
    visibility={edgeTextBbox().width ? "visible" : "hidden"}
    {...rest}
  >
			<Show9 when={extractedProps.labelShowBg}>
				<rect
    width={edgeTextBbox().width + 2 * extractedProps.labelBgPadding[0]}
    x={-extractedProps.labelBgPadding[0]}
    y={-extractedProps.labelBgPadding[1]}
    height={edgeTextBbox().height + 2 * extractedProps.labelBgPadding[1]}
    class="solid-flow__edge-textbg"
    style={extractedProps.labelBgStyle}
    rx={extractedProps.labelBgBorderRadius}
    ry={extractedProps.labelBgBorderRadius}
  />
			</Show9>
			<text
    class="solid-flow__edge-text"
    y={edgeTextBbox().height / 2}
    dy="0.3em"
    ref={edgeTextRef}
    style={extractedProps.labelStyle}
  >
				{extractedProps.label}
			</text>
			{extractedProps.children}
		</g>;
}
EdgeTextComponent.displayName = "EdgeText";
var EdgeText = EdgeTextComponent;

// src/components/Edges/BaseEdge.tsx
function BaseEdge(_p) {
  const p = mergeProps10(
    {
      interactionWidth: 20
    },
    _p
  );
  const [extractedProps, pathProps] = splitProps4(p, [
    "path",
    "labelX",
    "labelY",
    "label",
    "labelStyle",
    "labelShowBg",
    "labelBgStyle",
    "labelBgPadding",
    "labelBgBorderRadius",
    "interactionWidth",
    "class"
  ]);
  return <>
			<path
    {...pathProps}
    d={extractedProps.path}
    fill="none"
    class={cc11(["solid-flow__edge-path", extractedProps.class])}
  />
			<Show10 when={extractedProps.interactionWidth}>
				<path
    d={extractedProps.path}
    fill="none"
    stroke-opacity={0}
    stroke-width={extractedProps.interactionWidth}
    class="solid-flow__edge-interaction"
  />
			</Show10>
			<Show10
    when={extractedProps.label && isNumeric(extractedProps.labelX) && isNumeric(extractedProps.labelY)}
  >
				<EdgeText
    x={extractedProps.labelX}
    y={extractedProps.labelY}
    label={extractedProps.label}
    labelStyle={extractedProps.labelStyle}
    labelShowBg={extractedProps.labelShowBg}
    labelBgStyle={extractedProps.labelBgStyle}
    labelBgPadding={extractedProps.labelBgPadding}
    labelBgBorderRadius={extractedProps.labelBgBorderRadius}
  />
			</Show10>
		</>;
}

// src/components/Edges/BezierEdge.tsx
import { getBezierPath, Position as Position2 } from "@xyflow/system";
import { createMemo as createMemo3, mergeProps as mergeProps11 } from "solid-js";
function createBezierEdge(params) {
  return (_p) => {
    const p = mergeProps11(
      {
        sourcePosition: Position2.Bottom,
        targetPosition: Position2.Top
      },
      _p
    );
    const pathData = createMemo3(
      () => getBezierPath({
        sourceX: p.sourceX,
        sourceY: p.sourceY,
        sourcePosition: p.sourcePosition,
        targetX: p.targetX,
        targetY: p.targetY,
        targetPosition: p.targetPosition,
        curvature: p.pathOptions?.curvature
      })
    );
    return <BaseEdge
      id={params.isInternal ? void 0 : p.id}
      path={pathData()[0]}
      labelX={pathData()[1]}
      labelY={pathData()[2]}
      label={p.label}
      labelStyle={p.labelStyle}
      labelShowBg={p.labelShowBg}
      labelBgStyle={p.labelBgStyle}
      labelBgPadding={p.labelBgPadding}
      labelBgBorderRadius={p.labelBgBorderRadius}
      style={p.style}
      markerEnd={p.markerEnd}
      markerStart={p.markerStart}
      interactionWidth={p.interactionWidth}
    />;
  };
}
var BezierEdge = createBezierEdge({ isInternal: false });
var BezierEdgeInternal = createBezierEdge({ isInternal: true });

// src/components/Edges/SimpleBezierEdge.tsx
import { getBezierEdgeCenter, Position as Position3 } from "@xyflow/system";
import { createMemo as createMemo4, mergeProps as mergeProps12 } from "solid-js";
function getControl({
  pos,
  x1,
  y1,
  x2,
  y2
}) {
  if (pos === Position3.Left || pos === Position3.Right) {
    return [0.5 * (x1 + x2), y1];
  }
  return [x1, 0.5 * (y1 + y2)];
}
function getSimpleBezierPath({
  sourceX,
  sourceY,
  sourcePosition = Position3.Bottom,
  targetX,
  targetY,
  targetPosition = Position3.Top
}) {
  const [sourceControlX, sourceControlY] = getControl({
    pos: sourcePosition,
    x1: sourceX,
    y1: sourceY,
    x2: targetX,
    y2: targetY
  });
  const [targetControlX, targetControlY] = getControl({
    pos: targetPosition,
    x1: targetX,
    y1: targetY,
    x2: sourceX,
    y2: sourceY
  });
  const [labelX, labelY, offsetX, offsetY] = getBezierEdgeCenter({
    sourceX,
    sourceY,
    targetX,
    targetY,
    sourceControlX,
    sourceControlY,
    targetControlX,
    targetControlY
  });
  return [
    `M${sourceX},${sourceY} C${sourceControlX},${sourceControlY} ${targetControlX},${targetControlY} ${targetX},${targetY}`,
    labelX,
    labelY,
    offsetX,
    offsetY
  ];
}
function createSimpleBezierEdge(params) {
  return (_p) => {
    const p = mergeProps12(
      {
        sourcePosition: Position3.Bottom,
        targetPosition: Position3.Top
      },
      _p
    );
    const pathData = createMemo4(
      () => getSimpleBezierPath({
        sourceX: p.sourceX,
        sourceY: p.sourceY,
        sourcePosition: p.sourcePosition,
        targetX: p.targetX,
        targetY: p.targetY,
        targetPosition: p.targetPosition
      })
    );
    return <BaseEdge
      id={params.isInternal ? void 0 : p.id}
      path={pathData()[0]}
      labelX={pathData()[1]}
      labelY={pathData()[2]}
      label={p.label}
      labelStyle={p.labelStyle}
      labelShowBg={p.labelShowBg}
      labelBgStyle={p.labelBgStyle}
      labelBgPadding={p.labelBgPadding}
      labelBgBorderRadius={p.labelBgBorderRadius}
      style={p.style}
      markerEnd={p.markerEnd}
      markerStart={p.markerStart}
      interactionWidth={p.interactionWidth}
    />;
  };
}
var SimpleBezierEdge = createSimpleBezierEdge({ isInternal: false });
var SimpleBezierEdgeInternal = createSimpleBezierEdge({ isInternal: true });

// src/components/Edges/SmoothStepEdge.tsx
import { getSmoothStepPath, Position as Position4 } from "@xyflow/system";
import { createMemo as createMemo5, mergeProps as mergeProps13 } from "solid-js";
function createSmoothStepEdge(params) {
  return (_p) => {
    const p = mergeProps13(
      {
        sourcePosition: Position4.Bottom,
        targetPosition: Position4.Top
      },
      _p
    );
    const pathData = createMemo5(
      () => getSmoothStepPath({
        sourceX: p.sourceX,
        sourceY: p.sourceY,
        sourcePosition: p.sourcePosition,
        targetX: p.targetX,
        targetY: p.targetY,
        targetPosition: p.targetPosition,
        borderRadius: p.pathOptions?.borderRadius,
        offset: p.pathOptions?.offset
      })
    );
    return <BaseEdge
      id={params.isInternal ? void 0 : p.id}
      path={pathData()[0]}
      labelX={pathData()[1]}
      labelY={pathData()[2]}
      label={p.label}
      labelStyle={p.labelStyle}
      labelShowBg={p.labelShowBg}
      labelBgStyle={p.labelBgStyle}
      labelBgPadding={p.labelBgPadding}
      labelBgBorderRadius={p.labelBgBorderRadius}
      style={p.style}
      markerEnd={p.markerEnd}
      markerStart={p.markerStart}
      interactionWidth={p.interactionWidth}
    />;
  };
}
var SmoothStepEdge = createSmoothStepEdge({ isInternal: false });
var SmoothStepEdgeInternal = createSmoothStepEdge({ isInternal: true });

// src/components/Edges/StepEdge.tsx
import { createMemo as createMemo6 } from "solid-js";
function createStepEdge(params) {
  return (p) => {
    const pathOptions = createMemo6(() => ({
      borderRadius: 0,
      offset: p.pathOptions?.offset
    }));
    return <SmoothStepEdge
      {...p}
      id={params.isInternal ? void 0 : p.id}
      pathOptions={pathOptions()}
    />;
  };
}
var StepEdge = createStepEdge({ isInternal: false });
var StepEdgeInternal = createStepEdge({ isInternal: true });

// src/components/Edges/StraightEdge.tsx
import { getStraightPath } from "@xyflow/system";
import { createMemo as createMemo7 } from "solid-js";
function createStraightEdge(params) {
  return (p) => {
    const pathData = createMemo7(
      () => getStraightPath({
        sourceX: p.sourceX,
        sourceY: p.sourceY,
        targetX: p.targetX,
        targetY: p.targetY
      })
    );
    return <BaseEdge
      id={params.isInternal ? void 0 : p.id}
      path={pathData()[0]}
      labelX={pathData()[1]}
      labelY={pathData()[2]}
      label={p.label}
      labelStyle={p.labelStyle}
      labelShowBg={p.labelShowBg}
      labelBgStyle={p.labelBgStyle}
      labelBgPadding={p.labelBgPadding}
      labelBgBorderRadius={p.labelBgBorderRadius}
      style={p.style}
      markerEnd={p.markerEnd}
      markerStart={p.markerStart}
      interactionWidth={p.interactionWidth}
    />;
  };
}
var StraightEdge = createStraightEdge({ isInternal: false });
var StraightEdgeInternal = createStraightEdge({ isInternal: true });

// src/components/Handle/index.tsx
import {
  addEdge,
  ConnectionMode as ConnectionMode2,
  errorMessages as errorMessages2,
  getHostForElement,
  isMouseEvent,
  Position as Position5,
  XYHandle
} from "@xyflow/system";
import cc12 from "classcat";
import { createEffect as createEffect5, mergeProps as mergeProps14, splitProps as splitProps5 } from "solid-js";
var selector8 = (s) => ({
  connectOnClick: () => s.connectOnClick.get(),
  noPanClassName: () => s.noPanClassName.get(),
  rfId: () => s.rfId.get()
});
var connectingSelector = (nodeId, handleId, type) => (state) => {
  const {
    connectionClickStartHandle: clickHandle,
    connectionMode,
    connection
  } = state;
  const { fromHandle, toHandle, isValid } = connection.get();
  const connectingTo = () => toHandle?.nodeId === nodeId() && toHandle?.id === handleId() && toHandle?.type === type();
  return {
    connectingFrom: () => fromHandle?.nodeId === nodeId() && fromHandle?.id === handleId() && fromHandle?.type === type(),
    connectingTo,
    clickConnecting: () => clickHandle.get()?.nodeId === nodeId() && clickHandle.get()?.id === handleId() && clickHandle.get()?.type === type(),
    isPossibleEndHandle: () => connectionMode.get() === ConnectionMode2.Strict ? fromHandle?.type !== type() : nodeId() !== fromHandle?.nodeId || handleId() !== fromHandle?.id,
    connectionInProcess: () => !!fromHandle,
    clickConnectionInProcess: () => !!clickHandle.get(),
    valid: () => connectingTo() && isValid
  };
};
function HandleComponent(_p) {
  const p = mergeProps14(
    {
      type: "source",
      position: Position5.Top,
      isValidConnection: void 0,
      isConnectable: true,
      isConnectableStart: true,
      isConnectableEnd: true
    },
    _p
  );
  const [_, rest] = splitProps5(_p, [
    "type",
    "position",
    "isValidConnection",
    "isConnectable",
    "isConnectableStart",
    "isConnectableEnd",
    "id",
    "onConnect",
    "children",
    "class",
    "onMouseDown",
    "onTouchStart"
  ]);
  const handleId = () => p.id || null;
  const isTarget = () => p.type === "target";
  const store = useStoreApi();
  const nodeId = useNodeId();
  const storeData = useStore(selector8);
  const connectingData = useStore(
    connectingSelector(nodeId, handleId, () => p.type)
  );
  createEffect5(() => {
    if (!nodeId()) {
      store.onError.get()?.("010", errorMessages2["error010"]());
    }
  });
  const onConnectExtended = (params) => {
    const {
      defaultEdgeOptions,
      onConnect: onConnectAction,
      hasDefaultEdges
    } = store;
    const edgeParams = {
      ...defaultEdgeOptions,
      ...params
    };
    if (hasDefaultEdges.get()) {
      const { edges, setEdges } = store;
      setEdges(addEdge(edgeParams, edges.get()));
    }
    onConnectAction.get()?.(edgeParams);
    p.onConnect?.(edgeParams);
  };
  const onPointerDown = (event) => {
    const currentNodeId = nodeId();
    if (!currentNodeId) {
      return;
    }
    const isMouseTriggered = isMouseEvent(event);
    if (p.isConnectableStart && (isMouseTriggered && event.button === 0 || !isMouseTriggered)) {
      const currentStore = store;
      XYHandle.onPointerDown(event, {
        autoPanOnConnect: currentStore.autoPanOnConnect.get(),
        connectionMode: currentStore.connectionMode.get(),
        connectionRadius: currentStore.connectionRadius.get(),
        domNode: currentStore.domNode.get(),
        nodeLookup: currentStore.nodeLookup,
        lib: currentStore.lib.get(),
        isTarget: isTarget(),
        handleId: handleId(),
        nodeId: currentNodeId,
        flowId: currentStore.rfId.get(),
        panBy: currentStore.panBy,
        cancelConnection: currentStore.cancelConnection,
        onConnectStart: currentStore.onConnectStart,
        onConnectEnd: currentStore.onConnectEnd,
        updateConnection: currentStore.updateConnection,
        onConnect: onConnectExtended,
        isValidConnection: p.isValidConnection || currentStore.isValidConnection,
        getTransform: () => store.transform.get(),
        getFromHandle: () => store.connection.get().fromHandle,
        autoPanSpeed: currentStore.autoPanSpeed.get()
      });
    }
    if (isMouseTriggered && p.onMouseDown) {
      p.onMouseDown(event);
    } else if (!isMouseTriggered && p.onTouchStart) {
      p.onTouchStart(event);
    }
  };
  const onClick = (event) => {
    const currentNodeId = nodeId();
    const {
      onClickConnectStart,
      onClickConnectEnd,
      connectionClickStartHandle: getConnectionClickStartHandle,
      connectionMode,
      isValidConnection: isValidConnectionStore,
      lib,
      rfId: flowId,
      nodeLookup,
      connection: connectionState
    } = store;
    const connectionClickStartHandle = getConnectionClickStartHandle.get();
    if (!currentNodeId || !connectionClickStartHandle && !p.isConnectableStart) {
      return;
    }
    if (!connectionClickStartHandle) {
      onClickConnectStart?.(event, {
        nodeId: currentNodeId,
        handleId: handleId(),
        handleType: p.type
      });
      store.connectionClickStartHandle.set({
        nodeId: currentNodeId,
        type: p.type,
        id: handleId()
      });
      return;
    }
    const doc = getHostForElement(event.target);
    const { connection, isValid } = XYHandle.isValid(event, {
      handle: {
        nodeId: currentNodeId,
        id: handleId(),
        type: p.type
      },
      connectionMode: connectionMode.get(),
      fromNodeId: connectionClickStartHandle.nodeId,
      fromHandleId: connectionClickStartHandle.id || null,
      fromType: connectionClickStartHandle.type,
      isValidConnection: p.isValidConnection || isValidConnectionStore,
      flowId: flowId.get(),
      doc,
      lib: lib.get(),
      nodeLookup
    });
    if (isValid && connection) {
      onConnectExtended(connection);
    }
    const connectionClone = structuredClone(connectionState.get());
    delete connectionClone.inProgress;
    connectionClone.toPosition = connectionClone.toHandle ? connectionClone.toHandle.position : null;
    onClickConnectEnd?.(event, connectionClone);
    store.connectionClickStartHandle.set(null);
  };
  return <div
    data-handleid={handleId()}
    data-nodeid={nodeId()}
    data-handlepos={p.position}
    data-id={`${storeData.rfId()}-${nodeId()}-${handleId()}-${p.type}`}
    class={cc12([
      "solid-flow__handle",
      `solid-flow__handle-${p.position}`,
      "nodrag",
      storeData.noPanClassName(),
      p.class,
      {
        source: !isTarget(),
        target: isTarget(),
        connectable: p.isConnectable,
        connectablestart: p.isConnectableStart,
        connectableend: p.isConnectableEnd,
        clickconnecting: connectingData.clickConnecting(),
        connectingfrom: connectingData.connectingFrom(),
        connectingto: connectingData.connectingTo(),
        valid: connectingData.valid(),
        /*
         * shows where you can start a connection from
         * and where you can end it while connecting
         */
        connectionindicator: p.isConnectable && (!connectingData.connectionInProcess() || connectingData.isPossibleEndHandle()) && (connectingData.connectionInProcess() || connectingData.clickConnectionInProcess() ? p.isConnectableEnd : p.isConnectableStart)
      }
    ])}
    onMouseDown={onPointerDown}
    onTouchStart={onPointerDown}
    onClick={storeData.connectOnClick() ? onClick : void 0}
    ref={p.ref}
    {...rest}
  >
			{p.children}
		</div>;
}
var Handle = HandleComponent;

// src/components/SolidFlowProvider/index.tsx
import { createSignal as createSignal4 } from "solid-js";

// src/store/index.ts
import {
  adoptUserNodes as adoptUserNodes2,
  fitViewport,
  handleExpandParent as handleExpandParent2,
  initialConnection as initialConnection2,
  panBy as panBySystem,
  updateAbsolutePositions,
  updateConnectionLookup as updateConnectionLookup2,
  updateNodeInternals as updateNodeInternalsSystem
} from "@xyflow/system";
import { batch as batch2 } from "solid-js";
var createStore2 = ({
  nodes,
  edges,
  defaultNodes,
  defaultEdges,
  width,
  height,
  fitView: shouldFitView,
  fitViewOptions,
  minZoom,
  maxZoom,
  nodeOrigin,
  nodeExtent
}) => {
  const store = initialState_default({
    nodes,
    edges,
    width,
    height,
    fitView: shouldFitView,
    fitViewOptions,
    minZoom,
    maxZoom,
    nodeOrigin,
    nodeExtent,
    defaultNodes,
    defaultEdges
  });
  async function resolveFitView() {
    const {
      nodeLookup,
      panZoom,
      fitViewOptions: fitViewOptions2,
      fitViewResolver,
      width: width2,
      height: height2,
      minZoom: minZoom2,
      maxZoom: maxZoom2
    } = store;
    const panZoomInstance = panZoom.get();
    if (!panZoomInstance) {
      return;
    }
    await fitViewport(
      {
        nodes: nodeLookup,
        width: width2.get(),
        height: height2.get(),
        panZoom: panZoomInstance,
        minZoom: minZoom2.get(),
        maxZoom: maxZoom2.get()
      },
      fitViewOptions2.get()
    );
    fitViewResolver.get()?.resolve(true);
    fitViewResolver.set(null);
  }
  const setNodes = (newNodes) => {
    const {
      nodeLookup,
      parentLookup,
      nodeOrigin: nodeOrigin2,
      elevateNodesOnSelect,
      nodes: nodes2,
      nodeExtent: nodeExtent2,
      fitViewQueued
    } = store;
    const nodesInitialized = adoptUserNodes2(
      newNodes,
      nodeLookup,
      parentLookup,
      {
        nodeOrigin: nodeOrigin2.get(),
        nodeExtent: nodeExtent2.get(),
        elevateNodesOnSelect: elevateNodesOnSelect.get(),
        checkEquality: true
      }
    );
    if (fitViewQueued.get() && nodesInitialized) {
      resolveFitView();
      nodes2.set(newNodes);
      store.nodesInitialized.set(nodesInitialized);
      fitViewQueued.set(false);
      store.fitViewOptions.set(void 0);
    } else {
      nodes2.set(newNodes);
      store.nodesInitialized.set(nodesInitialized);
    }
  };
  const setEdges = (edges2) => {
    return batch2(() => {
      const { connectionLookup, edgeLookup, edges: storeEdges } = store;
      updateConnectionLookup2(connectionLookup, edgeLookup, edges2);
      storeEdges.set(edges2);
    });
  };
  const setDefaultNodesAndEdges = (nodes2, edges2) => {
    return batch2(() => {
      if (nodes2) {
        setNodes(nodes2);
        store.hasDefaultNodes.set(true);
      }
      if (edges2) {
        setEdges(edges2);
        store.hasDefaultEdges.set(true);
      }
    });
  };
  const updateNodeInternals = (updates, params) => {
    return batch2(() => {
      const {
        nodeLookup,
        parentLookup,
        domNode,
        nodeOrigin: nodeOrigin2,
        nodeExtent: nodeExtent2,
        debug,
        fitViewQueued
      } = store;
      const { changes, updatedInternals } = updateNodeInternalsSystem(
        updates,
        nodeLookup,
        parentLookup,
        domNode.get(),
        nodeOrigin2.get(),
        nodeExtent2.get()
      );
      if (!updatedInternals) {
        return;
      }
      updateAbsolutePositions(nodeLookup, parentLookup, {
        nodeOrigin: nodeOrigin2.get(),
        nodeExtent: nodeExtent2.get()
      });
      if (params?.triggerFitView || fitViewQueued.get()) {
        resolveFitView();
        fitViewQueued.set(false);
        store.fitViewOptions.set(void 0);
      } else {
        store.width.setFromPrev((w2) => w2);
      }
      if (changes?.length > 0) {
        if (debug.get()) {
        }
        triggerNodeChanges(changes);
      }
    });
  };
  const updateNodePositions = (nodeDragItems, dragging = false) => {
    return batch2(() => {
      const parentExpandChildren = [];
      const changes = [];
      const { nodeLookup } = store;
      for (const [id, dragItem] of nodeDragItems) {
        const node = nodeLookup.get(id);
        const expandParent = !!(node?.expandParent && node?.parentId && dragItem?.position);
        const change = {
          id,
          type: "position",
          position: expandParent ? {
            x: Math.max(0, dragItem.position.x),
            y: Math.max(0, dragItem.position.y)
          } : dragItem.position,
          dragging
        };
        if (expandParent && node.parentId) {
          parentExpandChildren.push({
            id,
            parentId: node.parentId,
            rect: {
              ...dragItem.internals.positionAbsolute,
              width: dragItem.measured.width ?? 0,
              height: dragItem.measured.height ?? 0
            }
          });
        }
        changes.push(change);
      }
      if (parentExpandChildren.length > 0) {
        const { parentLookup, nodeOrigin: nodeOrigin2 } = store;
        const parentExpandChanges = handleExpandParent2(
          parentExpandChildren,
          nodeLookup,
          parentLookup,
          nodeOrigin2.get()
        );
        changes.push(...parentExpandChanges);
      }
      triggerNodeChanges(changes);
    });
  };
  const triggerNodeChanges = (changes) => {
    return batch2(() => {
      const { onNodesChange, nodes: nodes2, hasDefaultNodes, debug } = store;
      if (changes?.length) {
        if (hasDefaultNodes.get()) {
          const updatedNodes = applyNodeChanges(changes, nodes2.get());
          setNodes(updatedNodes);
        }
        if (debug.get()) {
        }
        onNodesChange.get()?.(changes);
      }
    });
  };
  const triggerEdgeChanges = (changes) => {
    return batch2(() => {
      const { onEdgesChange, edges: edges2, hasDefaultEdges, debug } = store;
      if (changes?.length) {
        if (hasDefaultEdges.get()) {
          const updatedEdges = applyEdgeChanges(changes, edges2.get());
          setEdges(updatedEdges);
        }
        if (debug.get()) {
        }
        onEdgesChange.get()?.(changes);
      }
    });
  };
  const addSelectedNodes = (selectedNodeIds) => {
    return batch2(() => {
      const { multiSelectionActive, edgeLookup, nodeLookup } = store;
      if (multiSelectionActive.get()) {
        const nodeChanges = selectedNodeIds.map(
          (nodeId) => createSelectionChange(nodeId, true)
        );
        triggerNodeChanges(nodeChanges);
        return;
      }
      triggerNodeChanges(
        getSelectionChanges(nodeLookup, /* @__PURE__ */ new Set([...selectedNodeIds]), true)
      );
      triggerEdgeChanges(getSelectionChanges(edgeLookup));
    });
  };
  const addSelectedEdges = (selectedEdgeIds) => {
    batch2(() => {
      const { multiSelectionActive, edgeLookup, nodeLookup } = store;
      if (multiSelectionActive.get()) {
        const changedEdges = selectedEdgeIds.map(
          (edgeId) => createSelectionChange(edgeId, true)
        );
        triggerEdgeChanges(changedEdges);
        return;
      }
      triggerEdgeChanges(
        getSelectionChanges(edgeLookup, /* @__PURE__ */ new Set([...selectedEdgeIds]))
      );
      triggerNodeChanges(getSelectionChanges(nodeLookup, /* @__PURE__ */ new Set(), true));
    });
  };
  const unselectNodesAndEdges = ({
    nodes: nodes2,
    edges: edges2
  } = {}) => {
    batch2(() => {
      const { edges: storeEdges, nodes: storeNodes, nodeLookup } = store;
      const nodesToUnselect = nodes2 ? nodes2 : storeNodes.get();
      const edgesToUnselect = edges2 ? edges2 : storeEdges.get();
      const nodeChanges = nodesToUnselect.map((n) => {
        const internalNode = nodeLookup.get(n.id);
        if (internalNode) {
          internalNode.selected = false;
        }
        return createSelectionChange(n.id, false);
      });
      const edgeChanges = edgesToUnselect.map(
        (edge) => createSelectionChange(edge.id, false)
      );
      triggerNodeChanges(nodeChanges);
      triggerEdgeChanges(edgeChanges);
    });
  };
  const setMinZoom = (minZoom2) => {
    batch2(() => {
      const { panZoom, maxZoom: maxZoom2, minZoom: storeMinZoom } = store;
      panZoom.get()?.setScaleExtent([minZoom2, maxZoom2.get()]);
      storeMinZoom.set(minZoom2);
    });
  };
  const setMaxZoom = (maxZoom2) => {
    batch2(() => {
      const { panZoom, minZoom: minZoom2, maxZoom: storeMaxZoom } = store;
      panZoom.get()?.setScaleExtent([minZoom2.get(), maxZoom2]);
      storeMaxZoom.set(maxZoom2);
    });
  };
  const setTranslateExtent = (translateExtent) => {
    batch2(() => {
      const { panZoom } = store;
      panZoom.get()?.setTranslateExtent(translateExtent);
      store.translateExtent.set(translateExtent);
    });
  };
  const setPaneClickDistance = (clickDistance) => {
    store.panZoom.get()?.setClickDistance(clickDistance);
  };
  const resetSelectedElements = () => {
    batch2(() => {
      const { edges: edges2, nodes: nodes2, elementsSelectable } = store;
      if (!elementsSelectable.get()) {
        return;
      }
      const nodeChanges = nodes2.get().reduce(
        (res, node) => node.selected ? [...res, createSelectionChange(node.id, false)] : res,
        []
      );
      const edgeChanges = edges2.get().reduce(
        (res, edge) => edge.selected ? [...res, createSelectionChange(edge.id, false)] : res,
        []
      );
      triggerNodeChanges(nodeChanges);
      triggerEdgeChanges(edgeChanges);
    });
  };
  const setNodeExtent = (nextNodeExtent) => {
    batch2(() => {
      const {
        nodes: nodes2,
        nodeLookup,
        parentLookup,
        nodeOrigin: nodeOrigin2,
        elevateNodesOnSelect,
        nodeExtent: nodeExtent2
      } = store;
      if (nextNodeExtent[0][0] === nodeExtent2.get()[0][0] && nextNodeExtent[0][1] === nodeExtent2.get()[0][1] && nextNodeExtent[1][0] === nodeExtent2.get()[1][0] && nextNodeExtent[1][1] === nodeExtent2.get()[1][1]) {
        return;
      }
      adoptUserNodes2(nodes2.get(), nodeLookup, parentLookup, {
        nodeOrigin: nodeOrigin2.get(),
        nodeExtent: nextNodeExtent,
        elevateNodesOnSelect: elevateNodesOnSelect.get(),
        checkEquality: false
      });
      nodeExtent2.set(nextNodeExtent);
    });
  };
  const panBy = (delta) => {
    return batch2(() => {
      const { transform, width: width2, height: height2, panZoom, translateExtent } = store;
      return panBySystem({
        delta,
        panZoom: panZoom.get(),
        transform: transform.get(),
        translateExtent: translateExtent.get(),
        width: width2.get(),
        height: height2.get()
      });
    });
  };
  const fitView = (options) => {
    return batch2(() => {
      const {
        width: width2,
        height: height2,
        minZoom: minZoom2,
        maxZoom: maxZoom2,
        /* nodes, */
        nodeLookup
      } = store;
      const panZoom = store.panZoom.get();
      if (!panZoom) {
        return Promise.resolve(false);
      }
      return fitViewport(
        {
          nodes: nodeLookup,
          width: width2.get(),
          height: height2.get(),
          panZoom,
          minZoom: minZoom2.get(),
          maxZoom: maxZoom2.get()
        },
        options
      );
    });
  };
  const cancelConnection = () => {
    store.connection.setter()({ ...initialConnection2 });
  };
  const updateConnection = (connection) => {
    store.connection.setter()(connection);
  };
  const reset = () => {
    batch2(() => {
    });
  };
  return {
    ...store,
    setNodes,
    setEdges,
    setDefaultNodesAndEdges,
    updateNodeInternals,
    updateNodePositions,
    triggerNodeChanges,
    triggerEdgeChanges,
    addSelectedNodes,
    addSelectedEdges,
    unselectNodesAndEdges,
    setMinZoom,
    setMaxZoom,
    setTranslateExtent,
    setPaneClickDistance,
    resetSelectedElements,
    setNodeExtent,
    panBy,
    fitView,
    cancelConnection,
    updateConnection,
    reset
  };
};

// src/components/SolidFlowProvider/index.tsx
function SolidFlowProvider(p) {
  const [store] = createSignal4(
    createStore2({
      nodes: p.initialNodes,
      edges: p.initialEdges,
      defaultNodes: p.defaultNodes,
      defaultEdges: p.defaultEdges,
      width: p.initialWidth,
      height: p.initialHeight,
      fitView: p.fitView,
      minZoom: p.initialMinZoom,
      maxZoom: p.initialMaxZoom,
      fitViewOptions: p.initialFitViewOptions,
      nodeOrigin: p.nodeOrigin,
      nodeExtent: p.nodeExtent
    })
  );
  return <Provider value={store()}>
			<BatchProvider>{p.children}</BatchProvider>
		</Provider>;
}

// src/components/ViewportPortal/index.tsx
import { Show as Show11 } from "solid-js";
import { Portal as Portal3 } from "solid-js/web";
var selector9 = (s) => () => s.domNode.get()?.querySelector(".solid-flow__viewport-portal");
function ViewportPortal(p) {
  const viewPortalDiv = useStore(selector9);
  return <Show11 when={viewPortalDiv()}>
			{(el) => {
    return <Portal3 mount={el()}>{p.children}</Portal3>;
  }}
		</Show11>;
}

// src/container/SolidFlow/index.tsx
import {
  ConnectionLineType as ConnectionLineType2,
  infiniteExtent as infiniteExtent3,
  isMacOs,
  PanOnScrollMode as PanOnScrollMode2,
  SelectionMode as SelectionMode2
} from "@xyflow/system";
import cc19 from "classcat";
import { mergeProps as mergeProps25, splitProps as splitProps6 } from "solid-js";

// src/components/A11yDescriptions/index.tsx
import { Show as Show12 } from "solid-js";
var style = { display: "none" };
var ariaLiveStyle = {
  position: "absolute",
  width: "1px",
  height: "1px",
  margin: "-1px",
  border: 0,
  padding: 0,
  overflow: "hidden",
  clip: "rect(0px, 0px, 0px, 0px)",
  "clip-path": "inset(100%)"
};
var ARIA_NODE_DESC_KEY = "solid-flow__node-desc";
var ARIA_EDGE_DESC_KEY = "solid-flow__edge-desc";
var ARIA_LIVE_MESSAGE = "solid-flow__aria-live";
var selector10 = (s) => s.ariaLiveMessage;
function AriaLiveMessage(p) {
  const ariaLiveMessage = useStore(selector10);
  return <div
    id={`${ARIA_LIVE_MESSAGE}-${p.rfId}`}
    aria-live="assertive"
    aria-atomic="true"
    style={ariaLiveStyle}
  >
			{ariaLiveMessage.get()}
		</div>;
}
function A11yDescriptions(p) {
  return <>
			<div id={`${ARIA_NODE_DESC_KEY}-${p.rfId}`} style={style}>
				Press enter or space to select a node.
				{!p.disableKeyboardA11y && "You can then use the arrow keys to move the node around."}{" "}
				Press delete to remove it and escape to cancel.{" "}
			</div>
			<div id={`${ARIA_EDGE_DESC_KEY}-${p.rfId}`} style={style}>
				Press enter or space to select an edge. You can then press delete to
				remove it or escape to cancel.
			</div>
			<Show12 when={!p.disableKeyboardA11y}>
				<AriaLiveMessage rfId={p.rfId} />
			</Show12>
		</>;
}

// src/components/Attribution/index.tsx
import { mergeProps as mergeProps15, Show as Show13 } from "solid-js";
function Attribution(_p) {
  const p = mergeProps15(
    {
      position: "bottom-right"
    },
    _p
  );
  const shouldHide = () => !!p.proOptions?.hideAttribution;
  return <Show13 when={!shouldHide()}>
			<Panel
    position={p.position}
    class="solid-flow__attribution"
    data-message="Please only hide this attribution when you are subscribed to React Flow Pro: https://pro.reactflow.dev"
  >
				<a
    href="https://reactflow.dev"
    target="_blank"
    rel="noopener noreferrer"
    aria-label="React Flow attribution"
  >
					React Flow
				</a>
			</Panel>
		</Show13>;
}

// src/components/SelectionListener/index.tsx
import { createEffect as createEffect6, Show as Show14 } from "solid-js";
var selector11 = (s) => {
  const selectedNodes = [];
  const selectedEdges = [];
  for (const [, node] of s.nodeLookup) {
    if (node.selected) {
      selectedNodes.push(node.internals.userNode);
    }
  }
  for (const [, edge] of s.edgeLookup) {
    if (edge.selected) {
      selectedEdges.push(edge);
    }
  }
  return { selectedNodes, selectedEdges };
};
function SelectionListenerInner({ onSelectionChange }) {
  const store = useStoreApi();
  const storeData = useStore(selector11);
  createEffect6(() => {
    const params = {
      nodes: storeData.selectedNodes,
      edges: storeData.selectedEdges
    };
    onSelectionChange?.(params);
    store.onSelectionChangeHandlers.get().forEach((fn) => fn(params));
  });
  return null;
}
var changeSelector = (s) => !!s.onSelectionChangeHandlers;
function SelectionListener(p) {
  const storeHasSelectionChangeHandlers = useStore(changeSelector);
  return <Show14 when={storeHasSelectionChangeHandlers && p.onSelectionChange}>
			{(onSelectionChange) => {
    return <SelectionListenerInner onSelectionChange={onSelectionChange} />;
  }}
		</Show14>;
}

// src/components/StoreUpdater/index.tsx
import { infiniteExtent as infiniteExtent2 } from "@xyflow/system";
import { createEffect as createEffect7, onCleanup as onCleanup3, onMount } from "solid-js";

// src/container/SolidFlow/init-values.ts
var defaultNodeOrigin = [0, 0];
var defaultViewport = { x: 0, y: 0, zoom: 1 };

// src/components/StoreUpdater/index.tsx
var solidFlowFieldsToTrack = [
  "nodes",
  "edges",
  "defaultNodes",
  "defaultEdges",
  "onConnect",
  "onConnectStart",
  "onConnectEnd",
  "onClickConnectStart",
  "onClickConnectEnd",
  "nodesDraggable",
  "nodesConnectable",
  "nodesFocusable",
  "edgesFocusable",
  "edgesReconnectable",
  "elevateNodesOnSelect",
  "elevateEdgesOnSelect",
  "minZoom",
  "maxZoom",
  "nodeExtent",
  "onNodesChange",
  "onEdgesChange",
  "elementsSelectable",
  "connectionMode",
  "snapGrid",
  "snapToGrid",
  "translateExtent",
  "connectOnClick",
  "defaultEdgeOptions",
  "fitView",
  "fitViewOptions",
  "onNodesDelete",
  "onEdgesDelete",
  "onDelete",
  "onNodeDrag",
  "onNodeDragStart",
  "onNodeDragStop",
  "onSelectionDrag",
  "onSelectionDragStart",
  "onSelectionDragStop",
  "onMoveStart",
  "onMove",
  "onMoveEnd",
  "noPanClassName",
  "nodeOrigin",
  "autoPanOnConnect",
  "autoPanOnNodeDrag",
  "onError",
  "connectionRadius",
  "isValidConnection",
  "selectNodesOnDrag",
  "nodeDragThreshold",
  "onBeforeDelete",
  "debug",
  "autoPanSpeed",
  "paneClickDistance"
];
var fieldsToTrack = [...solidFlowFieldsToTrack, "rfId"];
var selector12 = (s) => ({
  setNodes: s.setNodes,
  setEdges: s.setEdges,
  setMinZoom: s.setMinZoom,
  setMaxZoom: s.setMaxZoom,
  setTranslateExtent: s.setTranslateExtent,
  setNodeExtent: s.setNodeExtent,
  reset: s.reset,
  setDefaultNodesAndEdges: s.setDefaultNodesAndEdges,
  setPaneClickDistance: s.setPaneClickDistance
});
var initPrevValues = {
  /*
   * these are values that are also passed directly to other components
   * than the StoreUpdater. We can reduce the number of setStore calls
   * by setting the same values here as prev fields.
   */
  translateExtent: infiniteExtent2,
  nodeOrigin: defaultNodeOrigin,
  minZoom: 0.5,
  maxZoom: 2,
  elementsSelectable: true,
  noPanClassName: "nopan",
  rfId: "1",
  paneClickDistance: 0
};
function StoreUpdater(props) {
  const store = useStoreApi();
  const storeData = useStore(selector12);
  const previousFields = useRef(initPrevValues);
  onMount(() => {
    storeData.setDefaultNodesAndEdges(props.defaultNodes, props.defaultEdges);
  });
  onCleanup3(() => {
    previousFields.current = initPrevValues;
    storeData.reset();
  });
  createEffect7(() => {
    for (const fieldName of fieldsToTrack) {
      const fieldValue = props[fieldName];
      const previousFieldValue = previousFields.current[fieldName];
      if (fieldValue === previousFieldValue) continue;
      if (typeof props[fieldName] === "undefined") continue;
      if (fieldName === "nodes") storeData.setNodes(fieldValue);
      else if (fieldName === "edges") storeData.setEdges(fieldValue);
      else if (fieldName === "minZoom")
        storeData.setMinZoom(fieldValue);
      else if (fieldName === "maxZoom")
        storeData.setMaxZoom(fieldValue);
      else if (fieldName === "translateExtent")
        storeData.setTranslateExtent(fieldValue);
      else if (fieldName === "nodeExtent")
        storeData.setNodeExtent(fieldValue);
      else if (fieldName === "paneClickDistance")
        storeData.setPaneClickDistance(fieldValue);
      else if (fieldName === "fitView")
        store.fitViewQueued.set(fieldValue);
      else if (fieldName === "fitViewOptions")
        store.fitViewOptions.set(fieldValue);
      else {
        if (fieldName === "defaultNodes") {
          continue;
        }
        if (fieldName === "defaultEdges") {
          continue;
        }
        const maybeWritable = store[fieldName];
        if (maybeWritable instanceof Writable) {
          const w2 = maybeWritable;
          w2.set(fieldValue);
        } else {
        }
      }
    }
    previousFields.current = { ...props };
  });
  return null;
}

// src/hooks/useColorModeClass.ts
import { createEffect as createEffect8, createSignal as createSignal5 } from "solid-js";
function getMediaQuery() {
  if (typeof window === "undefined" || !window.matchMedia) {
    return null;
  }
  return window.matchMedia("(prefers-color-scheme: dark)");
}
function useColorModeClass(colorMode) {
  const initialColorMode = () => {
    const mode = colorMode();
    if (mode === "system") {
      return null;
    } else {
      return mode;
    }
  };
  const [colorModeClass, setColorModeClass] = createSignal5(initialColorMode());
  createEffect8(() => {
    const mode = colorMode();
    if (mode !== "system") {
      setColorModeClass(mode);
      return;
    }
    const mediaQuery = getMediaQuery();
    const updateColorModeClass = () => setColorModeClass(mediaQuery?.matches ? "dark" : "light");
    updateColorModeClass();
    mediaQuery?.addEventListener("change", updateColorModeClass);
    return () => {
      mediaQuery?.removeEventListener("change", updateColorModeClass);
    };
  });
  return () => {
    const colorModeClassValue = colorModeClass();
    return colorModeClassValue !== null ? colorModeClassValue : getMediaQuery()?.matches ? "dark" : "light";
  };
}

// src/components/ConnectionLine/index.tsx
import {
  ConnectionLineType,
  getBezierPath as getBezierPath2,
  getConnectionStatus,
  getSmoothStepPath as getSmoothStepPath2,
  getStraightPath as getStraightPath2
} from "@xyflow/system";
import cc13 from "classcat";
import { mergeProps as mergeProps16, Show as Show15 } from "solid-js";

// src/hooks/useConnection.ts
import { pointToRendererPoint as pointToRendererPoint2 } from "@xyflow/system";
function storeSelector2(s) {
  return () => {
    const connection = s.connection.get();
    const result = connection.inProgress ? {
      ...connection,
      to: pointToRendererPoint2(connection.to, s.transform.get())
    } : { ...connection };
    return result;
  };
}
function useConnection() {
  return useStore(storeSelector2);
}

// src/components/ConnectionLine/index.tsx
var selector13 = (s) => ({
  nodesConnectable: () => s.nodesConnectable.get(),
  isValid: () => s.connection.get().isValid,
  inProgress: () => s.connection.get().inProgress,
  width: s.width,
  height: s.height
});
function ConnectionLineWrapper(p) {
  const storeData = useStore(selector13);
  const renderConnection = () => !!(storeData.width.get() && storeData.nodesConnectable() && storeData.inProgress());
  return <Show15 when={renderConnection()}>
			<svg
    style={p.containerStyle}
    width={storeData.width.get()}
    height={storeData.height.get()}
    class="solid-flow__connectionline solid-flow__container"
  >
				<g
    class={cc13([
      "solid-flow__connection",
      getConnectionStatus(storeData.isValid())
    ])}
  >
					<ConnectionLine
    style={p.style}
    type={p.type}
    CustomComponent={p.component}
    isValid={storeData.isValid()}
  />
				</g>
			</svg>
		</Show15>;
}
var ConnectionLine = (_p) => {
  const p = mergeProps16({ type: ConnectionLineType.Bezier }, _p);
  const connection = useConnection();
  const inProgress = () => connection().inProgress;
  const from = () => connection().from;
  const fromNode = () => connection().fromNode;
  const fromHandle = () => connection().fromHandle;
  const fromPosition = () => connection().fromPosition;
  const to = () => connection().to;
  const toNode = () => connection().toNode;
  const toHandle = () => connection().toHandle;
  const toPosition = () => connection().toPosition;
  return <Show15 when={inProgress()}>
			<Show15 when={p.CustomComponent} keyed fallback={<DefaultComponent />}>
				{(Comp) => {
    return <Comp
      connectionLineType={p.type}
      connectionLineStyle={p.style}
      fromNode={fromNode()}
      fromHandle={fromHandle()}
      fromX={from().x}
      fromY={from().y}
      toX={to().x}
      toY={to().y}
      fromPosition={fromPosition()}
      toPosition={toPosition()}
      connectionStatus={getConnectionStatus(p.isValid)}
      toNode={toNode()}
      toHandle={toHandle()}
    />;
  }}
			</Show15>
		</Show15>;
  function DefaultComponent() {
    if (!inProgress()) return null;
    const makePath = () => {
      let path = "";
      const pathParams = {
        sourceX: from().x,
        sourceY: from().y,
        sourcePosition: fromPosition(),
        targetX: to().x,
        targetY: to().y,
        targetPosition: toPosition()
      };
      switch (p.type) {
        case ConnectionLineType.Bezier:
          [path] = getBezierPath2(pathParams);
          break;
        case ConnectionLineType.SimpleBezier:
          [path] = getSimpleBezierPath(pathParams);
          break;
        case ConnectionLineType.Step:
          [path] = getSmoothStepPath2({
            ...pathParams,
            borderRadius: 0
          });
          break;
        case ConnectionLineType.SmoothStep:
          [path] = getSmoothStepPath2(pathParams);
          break;
        default:
          [path] = getStraightPath2(pathParams);
      }
      return path;
    };
    return <path
      d={makePath()}
      fill="none"
      class="solid-flow__connection-path"
      style={p.style}
    />;
  }
};
ConnectionLine.displayName = "ConnectionLine";

// src/hooks/useOnInitHandler.ts
import { createEffect as createEffect9 } from "solid-js";
function useOnInitHandler(onInit) {
  const rfInstance = useSolidFlow();
  const isInitialized = useRef(false);
  createEffect9(() => {
    const onInitFunc = onInit();
    if (!isInitialized.current && rfInstance.viewportInitialized() && onInitFunc) {
      setTimeout(() => onInitFunc(rfInstance), 1);
      isInitialized.current = true;
    }
  });
}

// src/hooks/useViewportSync.ts
import { createEffect as createEffect10 } from "solid-js";
var selector14 = (state) => () => state.panZoom.get()?.syncViewport;
function useViewportSync(getViewport) {
  const syncViewport = useStore(selector14);
  const store = useStoreApi();
  createEffect10(() => {
    const viewport = getViewport?.();
    if (viewport) {
      syncViewport()?.(viewport);
      store.transform.set([viewport.x, viewport.y, viewport.zoom]);
    }
  });
  return null;
}

// src/container/EdgeRenderer/index.tsx
import { For as For4 } from "solid-js";

// src/components/EdgeWrapper/index.tsx
import {
  elementSelectionKeys,
  errorMessages as errorMessages3,
  getEdgePosition,
  getElevatedEdgeZIndex,
  getMarkerId
} from "@xyflow/system";
import cc15 from "classcat";
import { createMemo as createMemo8, createSignal as createSignal6, Show as Show16 } from "solid-js";
import { Dynamic as Dynamic2 } from "solid-js/web";

// src/components/EdgeWrapper/EdgeUpdateAnchors.tsx
import {
  XYHandle as XYHandle2
} from "@xyflow/system";
import { Match, Switch } from "solid-js";

// src/components/Edges/EdgeAnchor.tsx
import { Position as Position6 } from "@xyflow/system";
import cc14 from "classcat";
import { mergeProps as mergeProps17 } from "solid-js";
var shiftX = (x, shift, position) => {
  if (position === Position6.Left) return x - shift;
  if (position === Position6.Right) return x + shift;
  return x;
};
var shiftY = (y, shift, position) => {
  if (position === Position6.Top) return y - shift;
  if (position === Position6.Bottom) return y + shift;
  return y;
};
var EdgeUpdaterClassName = "solid-flow__edgeupdater";
function EdgeAnchor(_p) {
  const p = mergeProps17(
    {
      radius: 10
    },
    _p
  );
  return <circle
    onMouseDown={p.onMouseDown}
    onMouseEnter={p.onMouseEnter}
    onMouseOut={p.onMouseOut}
    class={cc14([EdgeUpdaterClassName, `${EdgeUpdaterClassName}-${p.type}`])}
    cx={shiftX(p.centerX, p.radius, p.position)}
    cy={shiftY(p.centerY, p.radius, p.position)}
    r={p.radius}
    stroke="transparent"
    fill="transparent"
  />;
}

// src/components/EdgeWrapper/EdgeUpdateAnchors.tsx
function EdgeUpdateAnchors({
  isReconnectable,
  reconnectRadius,
  edge,
  sourceX,
  sourceY,
  targetX,
  targetY,
  sourcePosition,
  targetPosition,
  onReconnect,
  onReconnectStart,
  onReconnectEnd,
  setReconnecting,
  setUpdateHover
}) {
  const store = useStoreApi();
  const handleEdgeUpdater = (event, oppositeHandle) => {
    if (event.button !== 0) {
      return;
    }
    const isTarget = oppositeHandle.type === "target";
    setReconnecting(true);
    onReconnectStart?.(event, edge, oppositeHandle.type);
    const _onReconnectEnd = (evt, connectionState) => {
      setReconnecting(false);
      onReconnectEnd?.(evt, edge, oppositeHandle.type, connectionState);
    };
    const onConnectEdge = (connection) => onReconnect?.(edge, connection);
    XYHandle2.onPointerDown(event, {
      autoPanOnConnect: store.autoPanOnConnect.get(),
      connectionMode: store.connectionMode.get(),
      connectionRadius: store.connectionRadius.get(),
      domNode: store.domNode.get(),
      handleId: oppositeHandle.id,
      nodeId: oppositeHandle.nodeId,
      nodeLookup: store.nodeLookup,
      isTarget,
      edgeUpdaterType: oppositeHandle.type,
      lib: store.lib.get(),
      flowId: store.rfId.get(),
      cancelConnection: store.cancelConnection,
      panBy: store.panBy,
      isValidConnection: store.isValidConnection,
      onConnect: onConnectEdge,
      onConnectStart: store.onConnectStart,
      onConnectEnd: store.onConnectEnd,
      onReconnectEnd: _onReconnectEnd,
      updateConnection: store.updateConnection,
      getTransform: () => store.transform.get(),
      getFromHandle: () => store.connection.get().fromHandle
    });
  };
  const onReconnectSourceMouseDown = (event) => handleEdgeUpdater(event, {
    nodeId: edge.target,
    id: edge.targetHandle ?? null,
    type: "target"
  });
  const onReconnectTargetMouseDown = (event) => handleEdgeUpdater(event, {
    nodeId: edge.source,
    id: edge.sourceHandle ?? null,
    type: "source"
  });
  const onReconnectMouseEnter = () => setUpdateHover(true);
  const onReconnectMouseOut = () => setUpdateHover(false);
  return <Switch>
			<Match when={isReconnectable === true || isReconnectable === "source"}>
				<EdgeAnchor
    position={sourcePosition}
    centerX={sourceX}
    centerY={sourceY}
    radius={reconnectRadius}
    onMouseDown={onReconnectSourceMouseDown}
    onMouseEnter={onReconnectMouseEnter}
    onMouseOut={onReconnectMouseOut}
    type="source"
  />
			</Match>

			<Match when={isReconnectable === true || isReconnectable === "target"}>
				<EdgeAnchor
    position={targetPosition}
    centerX={targetX}
    centerY={targetY}
    radius={reconnectRadius}
    onMouseDown={onReconnectTargetMouseDown}
    onMouseEnter={onReconnectMouseEnter}
    onMouseOut={onReconnectMouseOut}
    type="target"
  />
			</Match>
		</Switch>;
}

// src/components/EdgeWrapper/utils.ts
var builtinEdgeTypes = {
  default: BezierEdgeInternal,
  straight: StraightEdgeInternal,
  step: StepEdgeInternal,
  smoothstep: SmoothStepEdgeInternal,
  simplebezier: SimpleBezierEdgeInternal
};
var nullPosition = {
  sourceX: null,
  sourceY: null,
  targetX: null,
  targetY: null,
  sourcePosition: null,
  targetPosition: null
};

// src/components/EdgeWrapper/index.tsx
function EdgeWrapper(p) {
  const storeEdge = useStore((s) => () => {
    const edge2 = s.edgeLookup.get(p.id);
    if (!edge2) {
      throw new Error(`Edge with id ${p.id} not found`);
    }
    return edge2;
  });
  const defaultEdgeOptions = useStore((s) => s.defaultEdgeOptions);
  const edge = () => defaultEdgeOptions ? { ...defaultEdgeOptions, ...storeEdge() } : storeEdge();
  const initialEdgeType = () => edge().type || "default";
  const InitialEdgeComp = () => p.edgeTypes?.[initialEdgeType()] || builtinEdgeTypes[initialEdgeType()];
  const EdgeComponent = () => {
    const comp = InitialEdgeComp();
    if (comp === void 0) {
      p.onError?.("011", errorMessages3["error011"](initialEdgeType()));
      return builtinEdgeTypes["default"];
    } else {
      return comp;
    }
  };
  const edgeType = () => {
    if (InitialEdgeComp() === void 0) {
      return "default";
    } else {
      return initialEdgeType();
    }
  };
  const isFocusable = () => !!(edge().focusable || p.edgesFocusable && typeof edge().focusable === "undefined");
  const isReconnectable = () => typeof p.onReconnect !== "undefined" && (edge().reconnectable || p.edgesReconnectable && typeof edge().reconnectable === "undefined");
  const isSelectable = () => !!(edge().selectable || p.elementsSelectable && typeof edge().selectable === "undefined");
  const edgeRef = useRef(null);
  const [updateHover, setUpdateHover] = createSignal6(false);
  const [reconnecting, setReconnecting] = createSignal6(false);
  const store = useStoreApi();
  const slice = createMemo8(
    useStore(
      (store2) => () => {
        const sourceNode = store2.nodeLookup.get(edge().source);
        const targetNode = store2.nodeLookup.get(edge().target);
        if (!sourceNode || !targetNode) {
          return {
            zIndex: edge().zIndex,
            ...nullPosition
          };
        }
        const edgePosition = getEdgePosition({
          id: p.id,
          sourceNode,
          targetNode,
          sourceHandle: edge().sourceHandle || null,
          targetHandle: edge().targetHandle || null,
          connectionMode: store2.connectionMode.get(),
          onError: p.onError
        });
        const zIndex2 = getElevatedEdgeZIndex({
          selected: edge().selected,
          zIndex: edge().zIndex,
          sourceNode,
          targetNode,
          elevateOnSelect: store2.elevateEdgesOnSelect.get()
        });
        return {
          zIndex: zIndex2,
          ...edgePosition || nullPosition
        };
      }
      // [edge.source, edge.target, edge.sourceHandle, edge.targetHandle, edge.selected, edge.zIndex]
    )
  );
  const zIndex = () => slice().zIndex;
  const sourceX = () => slice().sourceX;
  const sourceY = () => slice().sourceY;
  const targetX = () => slice().targetX;
  const targetY = () => slice().targetY;
  const sourcePosition = () => slice().sourcePosition;
  const targetPosition = () => slice().targetPosition;
  const markerStartUrl = () => edge().markerStart ? `url('#${getMarkerId(edge().markerStart, p.rfId)}')` : void 0;
  const markerEndUrl = () => edge().markerEnd ? `url('#${getMarkerId(edge().markerEnd, p.rfId)}')` : void 0;
  const shouldShow = () => {
    if (edge().hidden || sourceX() === null || sourceY() === null || targetX() === null || targetY() === null) {
      return false;
    } else {
      return true;
    }
  };
  const onEdgeClick = (event) => {
    const { addSelectedEdges, unselectNodesAndEdges, multiSelectionActive } = store;
    if (isSelectable()) {
      store.nodesSelectionActive.set(false);
      if (edge().selected && multiSelectionActive.get()) {
        unselectNodesAndEdges({ nodes: [], edges: [edge()] });
        edgeRef.current?.blur();
      } else {
        addSelectedEdges([p.id]);
      }
    }
    if (p.onClick) {
      p.onClick(event, edge());
    }
  };
  const onEdgeDoubleClick = (event) => {
    if (p.onDoubleClick) {
      p.onDoubleClick(event, { ...edge() });
    }
  };
  const onEdgeContextMenu = (event) => {
    if (p.onContextMenu) {
      p.onContextMenu(event, { ...edge() });
    }
  };
  const onEdgeMouseEnter = (event) => {
    if (p.onMouseEnter) {
      p.onMouseEnter(event, { ...edge() });
    }
  };
  const onEdgeMouseMove = (event) => {
    if (p.onMouseMove) {
      p.onMouseMove(event, { ...edge() });
    }
  };
  const onEdgeMouseLeave = (event) => {
    if (p.onMouseLeave) {
      p.onMouseLeave(event, { ...edge() });
    }
  };
  const onKeyDown = (event) => {
    if (!isFocusable()) {
      return;
    }
    if (!p.disableKeyboardA11y && elementSelectionKeys.includes(event.key) && isSelectable()) {
      const { unselectNodesAndEdges, addSelectedEdges } = store;
      const unselect = event.key === "Escape";
      if (unselect) {
        edgeRef.current?.blur();
        unselectNodesAndEdges({ edges: [edge()] });
      } else {
        addSelectedEdges([p.id]);
      }
    }
  };
  const pathOptions = () => {
    const e = edge();
    return "pathOptions" in e ? e.pathOptions : void 0;
  };
  return <Show16 when={shouldShow()}>
			<svg style={{ "z-index": zIndex() }}>
				<g
    class={cc15([
      "solid-flow__edge",
      `solid-flow__edge-${edgeType()}`,
      edge().className,
      p.noPanClassName,
      {
        selected: edge().selected,
        animated: edge().animated,
        inactive: !isSelectable() && !p.onClick,
        updating: updateHover,
        selectable: isSelectable()
      }
    ])}
    onClick={onEdgeClick}
    onDblClick={onEdgeDoubleClick}
    onContextMenu={onEdgeContextMenu}
    onMouseEnter={onEdgeMouseEnter}
    onMouseMove={onEdgeMouseMove}
    onMouseLeave={onEdgeMouseLeave}
    onKeyDown={onKeyDown}
    tabIndex={isFocusable() ? 0 : void 0}
    role={isFocusable() ? "button" : "img"}
    data-id={p.id}
    data-testid={`rf__edge-${p.id}`}
    aria-label={edge().ariaLabel === null ? void 0 : edge().ariaLabel || `Edge from ${edge().source} to ${edge().target}`}
    aria-describedby={isFocusable() ? `${ARIA_EDGE_DESC_KEY}-${p.rfId}` : void 0}
    ref={(node) => edgeRef.current = node}
  >
					<Show16 when={!reconnecting()}>
						<Dynamic2
    component={EdgeComponent()}
    id={p.id}
    source={edge().source}
    target={edge().target}
    type={edge().type}
    selected={edge().selected}
    animated={edge().animated}
    selectable={isSelectable()}
    deletable={edge().deletable ?? true}
    label={edge().label}
    labelStyle={edge().labelStyle}
    labelShowBg={edge().labelShowBg}
    labelBgStyle={edge().labelBgStyle}
    labelBgPadding={edge().labelBgPadding}
    labelBgBorderRadius={edge().labelBgBorderRadius}
    sourceX={sourceX()}
    sourceY={sourceY()}
    targetX={targetX()}
    targetY={targetY()}
    sourcePosition={sourcePosition()}
    targetPosition={targetPosition()}
    data={edge().data}
    style={edge().style}
    sourceHandleId={edge().sourceHandle}
    targetHandleId={edge().targetHandle}
    markerStart={markerStartUrl()}
    markerEnd={markerEndUrl()}
    pathOptions={pathOptions()}
    interactionWidth={edge().interactionWidth}
  />
					</Show16>
					{
    /* )} */
  }
					<Show16 when={isReconnectable()}>
						<EdgeUpdateAnchors
    edge={edge()}
    isReconnectable={isReconnectable()}
    reconnectRadius={p.reconnectRadius}
    onReconnect={p.onReconnect}
    onReconnectStart={p.onReconnectStart}
    onReconnectEnd={p.onReconnectEnd}
    sourceX={sourceX()}
    sourceY={sourceY()}
    targetX={targetX()}
    targetY={targetY()}
    sourcePosition={sourcePosition()}
    targetPosition={targetPosition()}
    setUpdateHover={setUpdateHover}
    setReconnecting={setReconnecting}
  />
						{
    /* )} */
  }
					</Show16>
				</g>
			</svg>
		</Show16>;
}

// src/hooks/useVisibleEdgeIds.ts
import { isEdgeVisible } from "@xyflow/system";
function useVisibleEdgeIds(onlyRenderVisible) {
  const edgeIds = useStore((s) => () => {
    if (!onlyRenderVisible()) {
      return s.edges.get().map((edge) => edge.id);
    }
    const visibleEdgeIds = [];
    if (s.width && s.height) {
      for (const edge of s.edges.get()) {
        const sourceNode = s.nodeLookup.get(edge.source);
        const targetNode = s.nodeLookup.get(edge.target);
        if (sourceNode && targetNode && isEdgeVisible({
          sourceNode,
          targetNode,
          width: s.width.get(),
          height: s.height.get(),
          transform: s.transform.get()
        })) {
          visibleEdgeIds.push(edge.id);
        }
      }
    }
    return visibleEdgeIds;
  });
  return edgeIds;
}

// src/container/EdgeRenderer/MarkerDefinitions.tsx
import { createMarkerIds } from "@xyflow/system";
import { For as For3, mergeProps as mergeProps19, Show as Show17 } from "solid-js";
import { Dynamic as Dynamic3 } from "solid-js/web";

// src/container/EdgeRenderer/MarkerSymbols.tsx
import { errorMessages as errorMessages4, MarkerType } from "@xyflow/system";
import { mergeProps as mergeProps18 } from "solid-js";
var ArrowSymbol = (_p) => {
  const p = mergeProps18({ color: "none", strokeWidth: 1 }, _p);
  return <polyline
    style={{
      stroke: p.color,
      "stroke-width": p.strokeWidth ? p.strokeWidth + "px" : void 0
    }}
    stroke-linecap="round"
    stroke-linejoin="round"
    fill="none"
    points="-5,-4 0,0 -5,4"
  />;
};
var ArrowClosedSymbol = (_p) => {
  const p = mergeProps18({ color: "none", strokeWidth: 1 }, _p);
  return <polyline
    style={{
      stroke: p.color,
      fill: p.color,
      "stroke-width": p.strokeWidth ? p.strokeWidth + "px" : void 0
    }}
    stroke-linecap="round"
    stroke-linejoin="round"
    points="-5,-4 0,0 -5,4 -5,-4"
  />;
};
var MarkerSymbols = {
  [MarkerType.Arrow]: ArrowSymbol,
  [MarkerType.ArrowClosed]: ArrowClosedSymbol
};
function useMarkerSymbol(type) {
  const store = useStoreApi();
  const symbol = () => {
    const symbolExists = Object.hasOwn(MarkerSymbols, type());
    if (!symbolExists) {
      store.onError.get()?.("009", errorMessages4["error009"](type()));
      return null;
    }
    return MarkerSymbols[type()];
  };
  return symbol;
}

// src/container/EdgeRenderer/MarkerDefinitions.tsx
var Marker = (_p) => {
  const p = mergeProps19(
    {
      width: 12.5,
      height: 12.5,
      markerUnits: "strokeWidth",
      orient: "auto-start-reverse"
    },
    _p
  );
  const SymbolComp = useMarkerSymbol(() => p.type);
  return <Show17 when={SymbolComp()}>
			{(symbol) => {
    return <marker
      class="solid-flow__arrowhead"
      id={p.id}
      markerWidth={`${p.width}`}
      markerHeight={`${p.height}`}
      viewBox="-10 -10 20 20"
      markerUnits={p.markerUnits}
      orient={p.orient}
      refX="0"
      refY="0"
    >
						<Dynamic3
      component={symbol()}
      color={p.color}
      strokeWidth={p.strokeWidth}
    />
					</marker>;
  }}
		</Show17>;
};
var MarkerDefinitions = (p) => {
  const edges = useStore((s) => s.edges);
  const defaultEdgeOptions = useStore((s) => () => s.defaultEdgeOptions);
  const markers = () => {
    return createMarkerIds(edges.get(), {
      id: p.rfId,
      defaultColor: p.defaultColor,
      defaultMarkerStart: defaultEdgeOptions()?.markerStart,
      defaultMarkerEnd: defaultEdgeOptions()?.markerEnd
    });
  };
  return <Show17 when={markers().length > 0}>
			<svg class="solid-flow__marker">
				<defs>
					<For3 each={markers()}>
						{(marker) => {
    return <Marker
      id={marker.id}
      type={marker.type}
      color={marker.color}
      width={marker.width}
      height={marker.height}
      markerUnits={marker.markerUnits}
      strokeWidth={marker.strokeWidth}
      orient={marker.orient}
    />;
  }}
					</For3>
				</defs>
			</svg>
		</Show17>;
};
MarkerDefinitions.displayName = "MarkerDefinitions";
var MarkerDefinitions_default = MarkerDefinitions;

// src/container/EdgeRenderer/index.tsx
var selector15 = (s) => ({
  edgesFocusable: () => s.edgesFocusable.get(),
  edgesReconnectable: () => s.edgesReconnectable.get(),
  elementsSelectable: () => s.elementsSelectable.get(),
  connectionMode: () => s.connectionMode.get(),
  onError: () => s.onError.get()
});
function EdgeRendererComponent(p) {
  const storeData = useStore(selector15);
  const edgeIds = useVisibleEdgeIds(() => p.onlyRenderVisibleElements);
  return <div class="solid-flow__edges">
			<MarkerDefinitions_default defaultColor={p.defaultMarkerColor} rfId={p.rfId} />

			<For4 each={edgeIds()}>
				{(id) => {
    return <EdgeWrapper
      id={id}
      edgesFocusable={storeData.edgesFocusable()}
      edgesReconnectable={storeData.edgesReconnectable()}
      elementsSelectable={storeData.elementsSelectable()}
      noPanClassName={p.noPanClassName}
      onReconnect={p.onReconnect}
      onContextMenu={p.onEdgeContextMenu}
      onMouseEnter={p.onEdgeMouseEnter}
      onMouseMove={p.onEdgeMouseMove}
      onMouseLeave={p.onEdgeMouseLeave}
      onClick={p.onEdgeClick}
      reconnectRadius={p.reconnectRadius}
      onDoubleClick={p.onEdgeDoubleClick}
      onReconnectStart={p.onReconnectStart}
      onReconnectEnd={p.onReconnectEnd}
      rfId={p.rfId}
      onError={storeData.onError()}
      edgeTypes={p.edgeTypes}
      disableKeyboardA11y={p.disableKeyboardA11y}
    />;
  }}
			</For4>
		</div>;
}
EdgeRendererComponent.displayName = "EdgeRenderer";
var EdgeRenderer = EdgeRendererComponent;

// src/container/FlowRenderer/index.tsx
import { Show as Show20 } from "solid-js";

// src/components/NodesSelection/index.tsx
import { getInternalNodesBounds as getInternalNodesBounds3, isNumeric as isNumeric2 } from "@xyflow/system";
import cc16 from "classcat";
import { Show as Show18 } from "solid-js";

// src/hooks/useMoveSelectedNodes.ts
import {
  calculateNodePosition,
  snapPosition
} from "@xyflow/system";
var selectedAndDraggable = (nodesDraggable) => (n) => n.selected && (n.draggable || nodesDraggable && typeof n.draggable === "undefined");
function useMoveSelectedNodes() {
  const store = useStoreApi();
  const moveSelectedNodes = (params) => {
    const {
      nodeExtent,
      snapToGrid,
      snapGrid,
      nodesDraggable,
      onError,
      updateNodePositions,
      nodeLookup,
      nodeOrigin
    } = store;
    const nodeUpdates = /* @__PURE__ */ new Map();
    const isSelected = selectedAndDraggable(nodesDraggable.get());
    const xVelo = snapToGrid ? snapGrid.get()[0] : 5;
    const yVelo = snapToGrid ? snapGrid.get()[1] : 5;
    const xDiff = params.direction.x * xVelo * params.factor;
    const yDiff = params.direction.y * yVelo * params.factor;
    for (const [, node] of nodeLookup) {
      if (!isSelected(node)) {
        continue;
      }
      let nextPosition = {
        x: node.internals.positionAbsolute.x + xDiff,
        y: node.internals.positionAbsolute.y + yDiff
      };
      if (snapToGrid) {
        nextPosition = snapPosition(nextPosition, snapGrid.get());
      }
      const { position, positionAbsolute } = calculateNodePosition({
        nodeId: node.id,
        nextPosition,
        nodeLookup,
        nodeExtent: nodeExtent.get(),
        nodeOrigin: nodeOrigin.get(),
        onError: onError.get()
      });
      node.position = position;
      node.internals.positionAbsolute = positionAbsolute;
      nodeUpdates.set(node.id, node);
    }
    updateNodePositions(nodeUpdates);
  };
  return moveSelectedNodes;
}

// src/components/Nodes/DefaultNode.tsx
import { Position as Position7 } from "@xyflow/system";
import { mergeProps as mergeProps20 } from "solid-js";
function DefaultNode(_p) {
  const p = mergeProps20(
    {
      targetPosition: Position7.Top,
      sourcePosition: Position7.Bottom
    },
    _p
  );
  return <>
			<Handle
    type="target"
    position={p.targetPosition}
    isConnectable={p.isConnectable}
  />
			{p.data?.label}
			<Handle
    type="source"
    position={p.sourcePosition}
    isConnectable={p.isConnectable}
  />
		</>;
}

// src/components/Nodes/GroupNode.tsx
function GroupNode() {
  return null;
}

// src/components/Nodes/InputNode.tsx
import { Position as Position8 } from "@xyflow/system";
import { mergeProps as mergeProps21 } from "solid-js";
function InputNode(_p) {
  const p = mergeProps21({ sourcePosition: Position8.Bottom }, _p);
  return <>
			{p.data?.label}
			<Handle
    type="source"
    position={p.sourcePosition}
    isConnectable={p.isConnectable}
  />
		</>;
}

// src/components/Nodes/OutputNode.tsx
import { Position as Position9 } from "@xyflow/system";
import { mergeProps as mergeProps22 } from "solid-js";
function OutputNode(_p) {
  const p = mergeProps22({ targetPosition: Position9.Top }, _p);
  return <>
			<Handle
    type="target"
    position={p.targetPosition}
    isConnectable={p.isConnectable}
  />
			{p.data?.label}
		</>;
}

// src/components/NodeWrapper/utils.tsx
var arrowKeyDiffs = {
  ArrowUp: { x: 0, y: -1 },
  ArrowDown: { x: 0, y: 1 },
  ArrowLeft: { x: -1, y: 0 },
  ArrowRight: { x: 1, y: 0 }
};
var builtinNodeTypes = {
  input: InputNode,
  default: DefaultNode,
  output: OutputNode,
  group: GroupNode
};
function getNodeInlineStyleDimensions(node) {
  if (node.internals.handleBounds === void 0) {
    const numberWidth = node.width ?? node.initialWidth;
    const width2 = numberWidth ? `${numberWidth}px` : node.style?.width;
    const numberHeight = node.height ?? node.initialHeight;
    const height2 = numberHeight ? `${numberHeight}px` : node.style?.height;
    return {
      width: width2,
      height: height2
    };
  }
  const width = node.width ?? node.style?.width;
  const height = node.height ?? node.style?.height;
  return {
    width: typeof width === "number" ? `${width}px` : width,
    height: typeof height === "number" ? `${height}px` : height
  };
}

// src/components/NodesSelection/index.tsx
var selector16 = (s) => {
  const { width, height, x, y } = getInternalNodesBounds3(s.nodeLookup, {
    filter: (node) => !!node.selected
  });
  return {
    width: () => isNumeric2(width) ? width : null,
    height: () => isNumeric2(height) ? height : null,
    userSelectionActive: () => s.userSelectionActive.get(),
    transformString: () => `translate(${s.transform.get()[0]}px,${s.transform.get()[1]}px) scale(${s.transform.get()[2]}) translate(${x}px,${y}px)`
  };
};
function NodesSelection(p) {
  const store = useStoreApi();
  const storeData = useStore(selector16);
  const moveSelectedNodes = useMoveSelectedNodes();
  let nodeRef = null;
  const shouldShow = () => {
    return !(storeData.userSelectionActive() || !storeData.width() || !storeData.height());
  };
  const onContextMenu = (e) => {
    if (p.onSelectionContextMenu) {
      const selectedNodes = store.nodes.get().filter((n) => n.selected);
      p.onSelectionContextMenu(e, selectedNodes);
    }
  };
  const onKeyDown = (event) => {
    if (Object.hasOwn(arrowKeyDiffs, event.key)) {
      event.preventDefault();
      moveSelectedNodes({
        direction: arrowKeyDiffs[event.key],
        factor: event.shiftKey ? 4 : 1
      });
    }
  };
  return <Show18 when={shouldShow()}>
			<div
    class={cc16([
      "solid-flow__nodesselection",
      "solid-flow__container",
      p.noPanClassName
    ])}
    style={{
      transform: storeData.transformString()
    }}
  >
				<div
    ref={(node) => {
      nodeRef = node;
    }}
    class="solid-flow__nodesselection-rect"
    onContextMenu={onContextMenu}
    tabIndex={p.disableKeyboardA11y ? void 0 : -1}
    onKeyDown={p.disableKeyboardA11y ? void 0 : onKeyDown}
    style={{
      width: `${storeData.width()}px`,
      height: `${storeData.height()}px`
    }}
  />
			</div>
		</Show18>;
}

// src/hooks/useGlobalKeyHandler.ts
import { createEffect as createEffect12, untrack } from "solid-js";

// src/hooks/useKeyPress.ts
import { isInputDOMNode } from "@xyflow/system";
import { createEffect as createEffect11, createSignal as createSignal7, onCleanup as onCleanup4 } from "solid-js";
var defaultDoc = typeof document !== "undefined" ? document : null;
function useKeyPress(keyCode = null, options = () => ({
  target: defaultDoc,
  actInsideInputWithModifier: true
})) {
  const [keyPressed, setKeyPressed] = createSignal7(false);
  const modifierPressed = useRef(false);
  const pressedKeys = useRef(/* @__PURE__ */ new Set([]));
  const keyStuff = () => {
    const keyCodeValue = keyCode?.() ?? null;
    if (keyCodeValue !== null) {
      const keyCodeArr = Array.isArray(keyCodeValue) ? keyCodeValue : [keyCodeValue];
      const keys = keyCodeArr.filter((kc) => typeof kc === "string").map((kc) => kc.split("+"));
      const keysFlat = keys.reduce(
        (res, item) => res.concat(...item),
        []
      );
      return [keys, keysFlat];
    }
    return [[], []];
  };
  createEffect11(() => {
    const keyCodes = () => keyStuff()[0];
    const keysToWatch = () => keyStuff()[1];
    const target = options()?.target || defaultDoc;
    const keyCodeValue = keyCode?.() ?? null;
    if (keyCodeValue !== null) {
      const downHandler = (event) => {
        modifierPressed.current = event.ctrlKey || event.metaKey || event.shiftKey;
        const preventAction = (!modifierPressed.current || modifierPressed.current && !options().actInsideInputWithModifier) && isInputDOMNode(event);
        if (preventAction) {
          return false;
        }
        const keyOrCode = useKeyOrCode(event.code, keysToWatch());
        pressedKeys.current.add(event[keyOrCode]);
        if (isMatchingKey(keyCodes(), pressedKeys.current, false)) {
          event.preventDefault();
          setKeyPressed(true);
        }
      };
      const upHandler = (event) => {
        const preventAction = (!modifierPressed.current || modifierPressed.current && !options().actInsideInputWithModifier) && isInputDOMNode(event);
        if (preventAction) {
          return false;
        }
        const keyOrCode = useKeyOrCode(event.code, keysToWatch());
        if (isMatchingKey(keyCodes(), pressedKeys.current, true)) {
          setKeyPressed(false);
          pressedKeys.current.clear();
        } else {
          pressedKeys.current.delete(event[keyOrCode]);
        }
        if (event.key === "Meta") {
          pressedKeys.current.clear();
        }
        modifierPressed.current = false;
      };
      const resetHandler = () => {
        pressedKeys.current.clear();
        setKeyPressed(false);
      };
      target?.addEventListener(
        "keydown",
        downHandler
      );
      target?.addEventListener(
        "keyup",
        upHandler
      );
      window.addEventListener("blur", resetHandler);
      window.addEventListener("contextmenu", resetHandler);
      onCleanup4(() => {
        target?.removeEventListener(
          "keydown",
          downHandler
        );
        target?.removeEventListener(
          "keyup",
          upHandler
        );
        window.removeEventListener("blur", resetHandler);
        window.removeEventListener("contextmenu", resetHandler);
      });
    }
  });
  return keyPressed;
}
function isMatchingKey(keyCodes, pressedKeys, isUp) {
  return keyCodes.filter((keys) => isUp || keys.length === pressedKeys.size).some((keys) => keys.every((k) => pressedKeys.has(k)));
}
function useKeyOrCode(eventCode, keysToWatch) {
  return keysToWatch.includes(eventCode) ? "code" : "key";
}

// src/hooks/useGlobalKeyHandler.ts
var selected = (item) => item.selected;
var deleteKeyOptions = {
  actInsideInputWithModifier: false
};
function useGlobalKeyHandler(config) {
  const store = useStoreApi();
  const { deleteElements } = useSolidFlow();
  const deleteKeyPressed = useKeyPress(
    () => config.deleteKeyCode(),
    () => deleteKeyOptions
  );
  const multiSelectionKeyPressed = useKeyPress(config.multiSelectionKeyCode);
  createEffect12(() => {
    if (deleteKeyPressed()) {
      untrack(() => {
        const { edges, nodes } = store;
        deleteElements({
          nodes: nodes.get().filter(selected),
          edges: edges.get().filter(selected)
        });
        store.nodesSelectionActive.set(false);
      });
    }
  });
  createEffect12(() => {
    store.multiSelectionActive.set(multiSelectionKeyPressed());
  });
}

// src/container/Pane/index.tsx
import {
  areSetsEqual,
  getEventPosition,
  getNodesInside,
  SelectionMode
} from "@xyflow/system";
import cc17 from "classcat";
import { mergeProps as mergeProps23 } from "solid-js";

// src/components/UserSelection/index.tsx
import { Show as Show19 } from "solid-js";
var selector17 = (s) => ({
  userSelectionActive: () => s.userSelectionActive.get(),
  userSelectionRect: () => s.userSelectionRect.get()
});
function UserSelection() {
  const storeData = useStore(selector17);
  return <Show19
    when={storeData.userSelectionActive() && storeData.userSelectionRect()}
  >
			<div
    class="solid-flow__selection solid-flow__container"
    style={{
      transform: `translate(${storeData.userSelectionRect().x}px, ${storeData.userSelectionRect().y}px)`,
      width: `${storeData.userSelectionRect().width}px`,
      height: `${storeData.userSelectionRect().height}px`
    }}
  />
		</Show19>;
}

// src/container/Pane/index.tsx
var wrapHandler = (handler, containerRef) => {
  return (event) => {
    if (event.target !== containerRef.current) {
      return;
    }
    handler?.(event);
  };
};
var selector18 = (s) => ({
  userSelectionActive: () => s.userSelectionActive.get(),
  elementsSelectable: () => s.elementsSelectable.get(),
  connectionInProgress: () => s.connection.get().inProgress,
  dragging: () => s.paneDragging.get()
});
function Pane(_p) {
  const p = mergeProps23(
    {
      selectionMode: SelectionMode.Full
    },
    _p
  );
  const store = useStoreApi();
  const storeData = useStore(selector18);
  const hasActiveSelection = () => storeData.elementsSelectable() && (p.isSelecting || storeData.userSelectionActive());
  const container = useRef(null);
  const containerBounds = useRef(null);
  const selectedNodeIds = useRef(/* @__PURE__ */ new Set());
  const selectedEdgeIds = useRef(/* @__PURE__ */ new Set());
  const selectionInProgress = useRef(false);
  const selectionStarted = useRef(false);
  const onClick = (event) => {
    if (selectionInProgress.current || storeData.connectionInProgress()) {
      selectionInProgress.current = false;
      return;
    }
    p.onPaneClick?.(event);
    store.resetSelectedElements();
    store.nodesSelectionActive.set(false);
  };
  const onContextMenu = (event) => {
    if (Array.isArray(p.panOnDrag) && p.panOnDrag?.includes(2)) {
      event.preventDefault();
      return;
    }
    p.onPaneContextMenu?.(event);
  };
  const onWheel = p.onPaneScroll ? (event) => p.onPaneScroll(event) : void 0;
  const onPointerDown = (event) => {
    const domNodeRect = store.domNode.get()?.getBoundingClientRect();
    if (!domNodeRect) {
      return;
    }
    containerBounds.current = domNodeRect;
    if (!storeData.elementsSelectable() || !p.isSelecting || event.button !== 0 || event.target !== container.current || !containerBounds.current) {
      return;
    }
    event.target?.setPointerCapture?.(
      event.pointerId
    );
    selectionStarted.current = true;
    selectionInProgress.current = false;
    const { x, y } = getEventPosition(event, containerBounds.current);
    store.resetSelectedElements();
    store.userSelectionRect.set({
      width: 0,
      height: 0,
      startX: x,
      startY: y,
      x,
      y
    });
    p.onSelectionStart?.(event);
  };
  const onPointerMove = (event) => {
    if (!containerBounds.current || !store.userSelectionRect.get()) {
      return;
    }
    selectionInProgress.current = true;
    const { x: mouseX, y: mouseY } = getEventPosition(
      event,
      containerBounds.current
    );
    const userSelectionRect = store.userSelectionRect.get();
    const { startX, startY } = userSelectionRect;
    const nextUserSelectRect = {
      startX,
      startY,
      x: mouseX < startX ? mouseX : startX,
      y: mouseY < startY ? mouseY : startY,
      width: Math.abs(mouseX - startX),
      height: Math.abs(mouseY - startY)
    };
    const prevSelectedNodeIds = selectedNodeIds.current;
    const prevSelectedEdgeIds = selectedEdgeIds.current;
    selectedNodeIds.current = new Set(
      getNodesInside(
        store.nodeLookup,
        nextUserSelectRect,
        store.transform.get(),
        p.selectionMode === SelectionMode.Partial,
        true
      ).map((node) => node.id)
    );
    selectedEdgeIds.current = /* @__PURE__ */ new Set();
    const edgesSelectable = store.defaultEdgeOptions?.selectable ?? true;
    for (const nodeId of selectedNodeIds.current) {
      const connections = store.connectionLookup.get(nodeId);
      if (!connections) continue;
      for (const { edgeId } of connections.values()) {
        const edge = store.edgeLookup.get(edgeId);
        if (edge && (edge.selectable ?? edgesSelectable)) {
          selectedEdgeIds.current.add(edgeId);
        }
      }
    }
    if (!areSetsEqual(prevSelectedNodeIds, selectedNodeIds.current)) {
      const changes = getSelectionChanges(
        store.nodeLookup,
        selectedNodeIds.current,
        true
      );
      store.triggerNodeChanges(changes);
    }
    if (!areSetsEqual(prevSelectedEdgeIds, selectedEdgeIds.current)) {
      const changes = getSelectionChanges(
        store.edgeLookup,
        selectedEdgeIds.current
      );
      store.triggerEdgeChanges(changes);
    }
    store.userSelectionRect.set(nextUserSelectRect);
    store.userSelectionActive.set(true);
    store.nodesSelectionActive.set(false);
  };
  const onPointerUp = (event) => {
    if (event.button !== 0 || !selectionStarted.current) {
      return;
    }
    event.target?.releasePointerCapture?.(
      event.pointerId
    );
    const userSelectionRect = store.userSelectionRect.get();
    if (!storeData.userSelectionActive() && userSelectionRect && event.target === container.current) {
      onClick(event);
    }
    store.userSelectionActive.set(false);
    store.userSelectionRect.set(null);
    store.nodesSelectionActive.set(selectedNodeIds.current.size > 0);
    p.onSelectionEnd?.(event);
    if (p.selectionKeyPressed || p.selectionOnDrag) {
      selectionInProgress.current = false;
    }
    selectionStarted.current = false;
  };
  const draggable = () => p.panOnDrag === true || Array.isArray(p.panOnDrag) && p.panOnDrag.includes(0);
  const wrapWheelHandler = (handler, containerRef) => {
    if (!handler) return void 0;
    return (event) => {
      if (event.target !== containerRef.current) {
        return;
      }
      handler(event);
    };
  };
  return <div
    class={cc17([
      "solid-flow__pane",
      {
        draggable: draggable(),
        dragging: storeData.dragging(),
        selection: p.isSelecting
      }
    ])}
    onClick={hasActiveSelection() ? void 0 : wrapHandler(onClick, container)}
    onContextMenu={wrapHandler(onContextMenu, container)}
    onWheel={wrapWheelHandler(onWheel, container)}
    onPointerEnter={hasActiveSelection() ? void 0 : p.onPaneMouseEnter}
    onPointerDown={hasActiveSelection() ? onPointerDown : p.onPaneMouseMove}
    onPointerMove={hasActiveSelection() ? onPointerMove : p.onPaneMouseMove}
    onPointerUp={hasActiveSelection() ? onPointerUp : void 0}
    onPointerLeave={p.onPaneMouseLeave}
    ref={(el) => container.current = el}
    style={containerStyle}
  >
			{p.children}
			<UserSelection />
		</div>;
}

// src/container/ZoomPane/index.tsx
import {
  PanOnScrollMode,
  XYPanZoom
} from "@xyflow/system";
import { createEffect as createEffect14, mergeProps as mergeProps24, onCleanup as onCleanup6 } from "solid-js";

// src/hooks/useResizeHandler.ts
import { errorMessages as errorMessages5, getDimensions } from "@xyflow/system";
import { createEffect as createEffect13, onCleanup as onCleanup5 } from "solid-js";
function useResizeHandler(getDomNode) {
  const store = useStoreApi();
  createEffect13(() => {
    const domNode = getDomNode();
    const updateDimensions = () => {
      if (!domNode) {
        return false;
      }
      const size = getDimensions(domNode);
      if (size.height === 0 || size.width === 0) {
        store.onError.get()?.("004", errorMessages5["error004"]());
      }
      store.batch((store2) => {
        store2.width.set(size.width || 500);
        store2.height.set(size.height || 500);
      });
    };
    if (domNode) {
      updateDimensions();
      window.addEventListener("resize", updateDimensions);
      const resizeObserver = new ResizeObserver(() => updateDimensions());
      resizeObserver.observe(domNode);
      onCleanup5(() => {
        window.removeEventListener("resize", updateDimensions);
        if (resizeObserver && domNode) {
          resizeObserver.unobserve(domNode);
        }
      });
    }
  });
}

// src/container/ZoomPane/index.tsx
var selector19 = (s) => ({
  userSelectionActive: () => s.userSelectionActive.get(),
  lib: () => s.lib.get()
});
function ZoomPane(_p) {
  const p = mergeProps24(
    {
      zoomOnScroll: true,
      zoomOnPinch: true,
      panOnScroll: false,
      panOnScrollSpeed: 0.5,
      panOnScrollMode: PanOnScrollMode.Free,
      zoomOnDoubleClick: true,
      panOnDrag: true,
      preventScrolling: true
    },
    _p
  );
  const store = useStoreApi();
  let zoomPane = null;
  const storeData = useStore(selector19);
  const zoomActivationKeyPressed = useKeyPress(
    () => p.zoomActivationKeyCode ?? null
  );
  let panZoom = null;
  useResizeHandler(() => zoomPane);
  const onTransformChange = (transform) => {
    p.onViewportChange?.({
      x: transform[0],
      y: transform[1],
      zoom: transform[2]
    });
    if (!p.isControlledViewport) {
      store.transform.set(transform);
    }
  };
  createEffect14(() => {
    if (zoomPane) {
      panZoom = XYPanZoom({
        domNode: zoomPane,
        minZoom: p.minZoom,
        maxZoom: p.maxZoom,
        translateExtent: p.translateExtent,
        viewport: p.defaultViewport,
        paneClickDistance: p.paneClickDistance ?? 0,
        onDraggingChange: (paneDragging) => store.paneDragging.set(paneDragging),
        onPanZoomStart: (event, vp) => {
          const { onViewportChangeStart, onMoveStart } = store;
          onMoveStart.get()?.(event, vp);
          onViewportChangeStart.get()?.(vp);
        },
        onPanZoom: (event, vp) => {
          const { onViewportChange, onMove } = store;
          onMove.get()?.(event, vp);
          onViewportChange.get()?.(vp);
        },
        onPanZoomEnd: (event, vp) => {
          const { onViewportChangeEnd, onMoveEnd } = store;
          onMoveEnd.get()?.(event, vp);
          onViewportChangeEnd.get()?.(vp);
        }
      });
      const { x, y, zoom } = panZoom.getViewport();
      store.batch((store2) => {
        store2.panZoom.set(panZoom);
        store2.transform.set([x, y, zoom]);
        store2.domNode.set(zoomPane?.closest(".solid-flow"));
      });
      onCleanup6(() => {
        panZoom?.destroy();
      });
    }
  });
  createEffect14(() => {
    panZoom?.update({
      onPaneContextMenu: p.onPaneContextMenu,
      zoomOnScroll: p.zoomOnScroll,
      zoomOnPinch: p.zoomOnPinch,
      panOnScroll: p.panOnScroll,
      panOnScrollSpeed: p.panOnScrollSpeed,
      panOnScrollMode: p.panOnScrollMode,
      zoomOnDoubleClick: p.zoomOnDoubleClick,
      panOnDrag: p.panOnDrag,
      zoomActivationKeyPressed: zoomActivationKeyPressed(),
      preventScrolling: p.preventScrolling,
      noPanClassName: p.noPanClassName,
      userSelectionActive: storeData.userSelectionActive(),
      noWheelClassName: p.noWheelClassName,
      lib: storeData.lib(),
      onTransformChange
    });
  });
  return <div
    class="solid-flow__renderer"
    ref={(el) => zoomPane = el}
    style={containerStyle}
  >
			{p.children}
		</div>;
}

// src/container/FlowRenderer/index.tsx
var win = typeof window !== "undefined" ? window : void 0;
var selector20 = (s) => ({
  nodesSelectionActive: () => s.nodesSelectionActive.get(),
  userSelectionActive: () => s.userSelectionActive.get()
});
function FlowRendererComponent(p) {
  const store = useStore(selector20);
  const selectionKeyPressed = useKeyPress(
    () => p.selectionKeyCode,
    () => ({ target: win })
  );
  const panActivationKeyPressed = useKeyPress(
    () => p.panActivationKeyCode,
    () => ({ target: win })
  );
  const panOnDrag = () => panActivationKeyPressed() || p.panOnDrag;
  const panOnScroll = () => panActivationKeyPressed() || p.panOnScroll;
  const _selectionOnDrag = () => p.selectionOnDrag && panOnDrag() !== true;
  const isSelecting = () => selectionKeyPressed() || store.userSelectionActive() || _selectionOnDrag();
  useGlobalKeyHandler({
    deleteKeyCode: () => p.deleteKeyCode,
    multiSelectionKeyCode: () => p.multiSelectionKeyCode
  });
  return <ZoomPane
    onPaneContextMenu={p.onPaneContextMenu}
    elementsSelectable={p.elementsSelectable}
    zoomOnScroll={p.zoomOnScroll}
    zoomOnPinch={p.zoomOnPinch}
    panOnScroll={panOnScroll()}
    panOnScrollSpeed={p.panOnScrollSpeed}
    panOnScrollMode={p.panOnScrollMode}
    zoomOnDoubleClick={p.zoomOnDoubleClick}
    panOnDrag={!selectionKeyPressed() && panOnDrag()}
    defaultViewport={p.defaultViewport}
    translateExtent={p.translateExtent}
    minZoom={p.minZoom}
    maxZoom={p.maxZoom}
    zoomActivationKeyCode={p.zoomActivationKeyCode}
    preventScrolling={p.preventScrolling}
    noWheelClassName={p.noWheelClassName}
    noPanClassName={p.noPanClassName}
    onViewportChange={p.onViewportChange}
    isControlledViewport={p.isControlledViewport}
    paneClickDistance={p.paneClickDistance}
  >
			<Pane
    onSelectionStart={p.onSelectionStart}
    onSelectionEnd={p.onSelectionEnd}
    onPaneClick={p.onPaneClick}
    onPaneMouseEnter={p.onPaneMouseEnter}
    onPaneMouseMove={p.onPaneMouseMove}
    onPaneMouseLeave={p.onPaneMouseLeave}
    onPaneContextMenu={p.onPaneContextMenu}
    onPaneScroll={p.onPaneScroll}
    panOnDrag={panOnDrag()}
    isSelecting={!!isSelecting()}
    selectionMode={p.selectionMode}
    selectionKeyPressed={selectionKeyPressed()}
    selectionOnDrag={_selectionOnDrag()}
  >
				{p.children}
				<Show20 when={store.nodesSelectionActive()}>
					<NodesSelection
    onSelectionContextMenu={p.onSelectionContextMenu}
    noPanClassName={p.noPanClassName}
    disableKeyboardA11y={p.disableKeyboardA11y}
  />
				</Show20>
			</Pane>
		</ZoomPane>;
}
var FlowRenderer = FlowRendererComponent;

// src/container/NodeRenderer/index.tsx
import { For as For5 } from "solid-js";

// src/components/NodeWrapper/index.tsx
import {
  elementSelectionKeys as elementSelectionKeys2,
  errorMessages as errorMessages7,
  getNodeDimensions as getNodeDimensions2,
  isInputDOMNode as isInputDOMNode2,
  nodeHasDimensions as nodeHasDimensions2
} from "@xyflow/system";
import cc18 from "classcat";
import { Dynamic as Dynamic4 } from "solid-js/web";

// src/hooks/useDrag.ts
import { XYDrag } from "@xyflow/system";
import { createEffect as createEffect15, createSignal as createSignal8, onCleanup as onCleanup7 } from "solid-js";

// src/components/Nodes/utils.ts
import { errorMessages as errorMessages6 } from "@xyflow/system";
function handleNodeClick({
  id,
  store,
  unselect = false,
  nodeRef
}) {
  const {
    addSelectedNodes,
    unselectNodesAndEdges,
    multiSelectionActive,
    nodeLookup,
    onError
  } = store;
  const node = nodeLookup.get(id);
  if (!node) {
    onError.get()?.("012", errorMessages6["error012"](id));
    return;
  }
  store.nodesSelectionActive.set(false);
  if (!node.selected) {
    addSelectedNodes([id]);
  } else if (unselect || node.selected && multiSelectionActive) {
    unselectNodesAndEdges({ nodes: [node], edges: [] });
    requestAnimationFrame(() => nodeRef?.blur());
  }
}

// src/hooks/useDrag.ts
function useDrag({
  nodeRef,
  disabled,
  noDragClassName,
  handleSelector,
  nodeId,
  isSelectable,
  nodeClickDistance
}) {
  const store = useStoreApi();
  const [dragging, setDragging] = createSignal8(false);
  const xyDrag = useRef(void 0);
  createEffect15(() => {
    const getState = () => ({
      nodes: store.nodes.get(),
      nodeLookup: store.nodeLookup,
      edges: store.edges.get(),
      nodeExtent: store.nodeExtent.get(),
      snapGrid: store.snapGrid.get(),
      snapToGrid: store.snapToGrid.get(),
      nodeOrigin: store.nodeOrigin.get(),
      multiSelectionActive: store.multiSelectionActive.get(),
      domNode: store.domNode.get(),
      transform: store.transform.get(),
      autoPanOnNodeDrag: store.autoPanOnNodeDrag.get(),
      nodesDraggable: store.nodesDraggable.get(),
      selectNodesOnDrag: store.selectNodesOnDrag.get(),
      nodeDragThreshold: store.nodeDragThreshold.get(),
      panBy: store.panBy,
      unselectNodesAndEdges: store.unselectNodesAndEdges,
      updateNodePositions: store.updateNodePositions,
      onError: store.onError.get(),
      onNodeDragStart: store.onNodeDragStart,
      onNodeDrag: store.onNodeDrag,
      onNodeDragStop: store.onNodeDragStop,
      onSelectionDragStart: store.onSelectionDragStart,
      onSelectionDrag: store.onSelectionDrag,
      onSelectionDragStop: store.onSelectionDragStop,
      autoPanSpeed: store.autoPanSpeed.get()
    });
    xyDrag.current = XYDrag({
      getStoreItems: getState,
      onNodeMouseDown: (id) => {
        handleNodeClick({
          id,
          store,
          nodeRef: nodeRef()
        });
      },
      onDragStart: () => {
        setDragging(true);
      },
      onDragStop: () => {
        setDragging(false);
      }
    });
  });
  createEffect15(() => {
    const domNode = nodeRef();
    const isDisabled = disabled?.() || false;
    if (isDisabled) {
      xyDrag.current?.destroy();
    } else if (domNode) {
      xyDrag.current?.update({
        noDragClassName: noDragClassName?.(),
        handleSelector: handleSelector?.(),
        domNode,
        isSelectable: isSelectable?.(),
        nodeId: nodeId?.(),
        nodeClickDistance: nodeClickDistance?.()
      });
      onCleanup7(() => {
        xyDrag.current?.destroy();
      });
    }
  });
  return dragging;
}

// src/components/NodeWrapper/useNodeObserver.ts
import { createEffect as createEffect16, onCleanup as onCleanup8 } from "solid-js";
function useNodeObserver({
  node: getNode,
  nodeType: getNodeType,
  hasDimensions,
  resizeObserver: getResizeObserver
}) {
  const store = useStoreApi();
  const nodeRef = useRef(null);
  const observedNode = useRef(null);
  const prevSourcePosition = useRef(getNode().sourcePosition);
  const prevTargetPosition = useRef(getNode().targetPosition);
  const prevType = useRef(getNodeType());
  const resizeObserver = getResizeObserver();
  const isInitialized = () => hasDimensions() && !!getNode().internals.handleBounds && !getNode().hidden;
  createEffect16(() => {
    if (nodeRef.current && (!isInitialized() || observedNode.current !== nodeRef.current)) {
      if (observedNode.current) {
        resizeObserver?.unobserve(observedNode.current);
      }
      resizeObserver?.observe(nodeRef.current);
      observedNode.current = nodeRef.current;
    }
  });
  onCleanup8(() => {
    if (observedNode.current) {
      resizeObserver?.unobserve(observedNode.current);
      observedNode.current = null;
    }
  });
  createEffect16(() => {
    const node = getNode();
    const nodeType = getNodeType();
    if (nodeRef.current) {
      const typeChanged = prevType.current !== nodeType;
      const sourcePosChanged = prevSourcePosition.current !== node.sourcePosition;
      const targetPosChanged = prevTargetPosition.current !== node.targetPosition;
      if (typeChanged || sourcePosChanged || targetPosChanged) {
        prevType.current = nodeType;
        prevSourcePosition.current = node.sourcePosition;
        prevTargetPosition.current = node.targetPosition;
        store.updateNodeInternals(
          /* @__PURE__ */ new Map([
            [
              node.id,
              { id: node.id, nodeElement: nodeRef.current, force: true }
            ]
          ])
        );
      }
    }
  });
  return nodeRef;
}

// src/components/NodeWrapper/index.tsx
function NodeWrapper(p) {
  const store = useStoreApi();
  const nodeData = useStore((s) => {
    const node = () => s.nodeLookup.get(p.id);
    const isParent = () => s.parentLookup.has(p.id);
    return {
      node,
      internals: () => node().internals,
      isParent
    };
  });
  const initialNodeType = () => nodeData.node()?.type || "default";
  const initialNodeComponent = () => p.nodeTypes?.[initialNodeType()] || builtinNodeTypes[initialNodeType()];
  const NodeComponent = () => {
    const comp = initialNodeComponent();
    if (comp === void 0) {
      p.onError?.("003", errorMessages7["error003"](initialNodeType()));
      return builtinNodeTypes["default"];
    }
    return comp;
  };
  const nodeType = () => {
    let nt = initialNodeType();
    if (initialNodeComponent() === void 0) {
      nt = "default";
    }
    return nt;
  };
  const isDraggable = () => !!(nodeData.node()?.draggable || p.nodesDraggable && typeof nodeData.node()?.draggable === "undefined");
  const isSelectable = () => !!(nodeData.node()?.selectable || p.elementsSelectable && typeof nodeData.node()?.selectable === "undefined");
  const isConnectable = () => !!(nodeData.node()?.connectable || p.nodesConnectable && typeof nodeData.node()?.connectable === "undefined");
  const isFocusable = () => !!(nodeData.node()?.focusable || p.nodesFocusable && typeof nodeData.node()?.focusable === "undefined");
  const hasDimensions = () => nodeHasDimensions2(nodeData.node());
  const nodeRef = useNodeObserver({
    node: nodeData.node,
    nodeType,
    hasDimensions,
    resizeObserver: () => p.resizeObserver
  });
  const dragging = useDrag({
    nodeRef: () => nodeRef.current ?? void 0,
    disabled: () => nodeData.node()?.hidden || !isDraggable(),
    noDragClassName: () => p.noDragClassName,
    handleSelector: () => nodeData.node()?.dragHandle,
    nodeId: () => p.id,
    isSelectable,
    nodeClickDistance: () => p.nodeClickDistance
  });
  const moveSelectedNodes = useMoveSelectedNodes();
  const nodeDimensions = () => getNodeDimensions2(nodeData.node());
  const inlineDimensions = () => getNodeInlineStyleDimensions(nodeData.node());
  const hasPointerEvents = () => isSelectable() || isDraggable() || p.onClick || p.onMouseEnter || p.onMouseMove || p.onMouseLeave;
  const onMouseEnterHandler = (e) => {
    if (p.onMouseEnter) {
      p.onMouseEnter(e, { ...nodeData.internals()?.userNode });
    }
  };
  const onMouseMoveHandler = (e) => {
    if (p.onMouseMove) {
      p.onMouseMove(e, { ...nodeData.internals()?.userNode });
    }
  };
  const onMouseLeaveHandler = (e) => {
    if (p.onMouseLeave) {
      p.onMouseLeave(e, { ...nodeData.internals()?.userNode });
    }
  };
  const onContextMenuHandler = (e) => {
    if (p.onContextMenu) {
      p.onContextMenu(e, { ...nodeData.internals()?.userNode });
    }
  };
  const onDoubleClickHandler = (e) => {
    if (p.onDoubleClick) {
      p.onDoubleClick(e, { ...nodeData.internals()?.userNode });
    }
  };
  const onSelectNodeHandler = (event) => {
    if (isSelectable() && (!store.selectNodesOnDrag.get() || !isDraggable() || store.nodeDragThreshold.get() > 0)) {
      handleNodeClick({
        id: p.id,
        store,
        nodeRef: nodeRef.current ?? void 0
      });
    }
    if (p.onClick) {
      p.onClick(event, { ...nodeData.internals()?.userNode });
    }
  };
  const onKeyDown = (event) => {
    if (isInputDOMNode2(event) || p.disableKeyboardA11y) {
      return;
    }
    if (elementSelectionKeys2.includes(event.key) && isSelectable()) {
      const unselect = event.key === "Escape";
      handleNodeClick({
        id: p.id,
        store,
        unselect,
        nodeRef: nodeRef.current ?? void 0
      });
    } else if (isDraggable() && nodeData.node()?.selected && Object.hasOwn(arrowKeyDiffs, event.key)) {
      event.preventDefault();
      const ariaLiveMessage = `Moved selected node ${event.key.replace("Arrow", "").toLowerCase()}. New position, x: ${~~nodeData.internals()?.positionAbsolute.x}, y: ${~~nodeData.internals()?.positionAbsolute.y}`;
      store.ariaLiveMessage.set(ariaLiveMessage);
      moveSelectedNodes({
        direction: arrowKeyDiffs[event.key],
        factor: event.shiftKey ? 4 : 1
      });
    }
  };
  return <div
    class={cc18([
      "solid-flow__node",
      `solid-flow__node-${nodeType()}`,
      {
        // this is overwritable by passing `nopan` as a class name
        [p.noPanClassName]: isDraggable()
      },
      nodeData.node()?.className,
      {
        selected: nodeData.node()?.selected,
        selectable: isSelectable(),
        parent: nodeData.isParent(),
        draggable: isDraggable(),
        dragging: dragging()
      }
    ])}
    ref={(node) => nodeRef.current = node}
    style={{
      "z-index": nodeData.internals()?.z,
      transform: `translate(${nodeData.internals()?.positionAbsolute.x}px,${nodeData.internals()?.positionAbsolute.y}px)`,
      "pointer-events": hasPointerEvents() ? "all" : "none",
      visibility: hasDimensions() ? "visible" : "hidden",
      display: nodeData.node()?.hidden ? "none" : "block",
      ...nodeData.node()?.style,
      ...inlineDimensions()
    }}
    data-id={p.id}
    data-testid={`rf__node-${p.id}`}
    onMouseEnter={onMouseEnterHandler}
    onMouseMove={onMouseMoveHandler}
    onMouseLeave={onMouseLeaveHandler}
    onContextMenu={onContextMenuHandler}
    onClick={onSelectNodeHandler}
    onDblClick={onDoubleClickHandler}
    onKeyDown={isFocusable() ? onKeyDown : void 0}
    tabIndex={isFocusable() ? 0 : void 0}
    role={isFocusable() ? "button" : void 0}
    aria-describedby={p.disableKeyboardA11y ? void 0 : `${ARIA_NODE_DESC_KEY}-${p.rfId}`}
    aria-label={nodeData.node()?.ariaLabel}
  >
			<Provider2 value={() => p.id}>
				<Dynamic4
    component={NodeComponent()}
    id={p.id}
    data={nodeData.node()?.data}
    type={nodeType()}
    positionAbsoluteX={nodeData.internals()?.positionAbsolute.x}
    positionAbsoluteY={nodeData.internals()?.positionAbsolute.y}
    selected={nodeData.node()?.selected ?? false}
    selectable={isSelectable()}
    draggable={isDraggable()}
    deletable={nodeData.node()?.deletable ?? true}
    isConnectable={isConnectable()}
    sourcePosition={nodeData.node()?.sourcePosition}
    targetPosition={nodeData.node()?.targetPosition}
    dragging={dragging()}
    dragHandle={nodeData.node()?.dragHandle}
    zIndex={nodeData.internals()?.z}
    parentId={nodeData.node()?.parentId}
    {...nodeDimensions()}
  />
			</Provider2>
		</div>;
}

// src/hooks/useVisibleNodeIds.ts
import { getNodesInside as getNodesInside2 } from "@xyflow/system";
var selector21 = (onlyRenderVisible) => (s) => {
  return () => onlyRenderVisible() ? getNodesInside2(
    s.nodeLookup,
    { x: 0, y: 0, width: s.width.get(), height: s.height.get() },
    s.transform.get(),
    true
  ).map((node) => node.id) : Array.from(s.nodeLookup.keys());
};
function useVisibleNodeIds(onlyRenderVisible) {
  const nodeIds = useStore(selector21(onlyRenderVisible));
  return nodeIds;
}

// src/container/NodeRenderer/useResizeObserver.ts
import { createSignal as createSignal9, onCleanup as onCleanup9 } from "solid-js";
var selector22 = (s) => s.updateNodeInternals;
function useResizeObserver() {
  const updateNodeInternals = useStore(selector22);
  const createInitial = () => {
    if (typeof ResizeObserver === "undefined") {
      return null;
    }
    return new ResizeObserver((entries) => {
      const updates = /* @__PURE__ */ new Map();
      entries.forEach((entry) => {
        const id = entry.target.getAttribute("data-id");
        updates.set(id, {
          id,
          nodeElement: entry.target,
          force: true
        });
      });
      if (updates.size > 0) {
        updateNodeInternals(updates);
      }
    });
  };
  const [resizeObserver] = createSignal9(createInitial());
  onCleanup9(() => {
    resizeObserver()?.disconnect();
  });
  return resizeObserver;
}

// src/container/NodeRenderer/index.tsx
var selector23 = (s) => ({
  nodesDraggable: () => s.nodesDraggable.get(),
  nodesConnectable: () => s.nodesConnectable.get(),
  nodesFocusable: () => s.nodesFocusable.get(),
  elementsSelectable: () => s.elementsSelectable.get(),
  onError: () => s.onError.get()
});
function NodeRendererComponent(props) {
  const storeData = useStore(selector23);
  const nodeIds = useVisibleNodeIds(() => props.onlyRenderVisibleElements);
  const resizeObserver = useResizeObserver();
  return <div class="solid-flow__nodes" style={containerStyle}>
			<For5 each={nodeIds()}>
				{(nodeId) => {
    return (
      /*
       * The split of responsibilities between NodeRenderer and
       * NodeComponentWrapper may appear weird. However, it's designed to
       * minimize the cost of updates when individual nodes change.
       *
       * For example, when you're dragging a single node, that node gets
       * updated multiple times per second. If `NodeRenderer` were to update
       * every time, it would have to re-run the `nodes.map()` loop every
       * time. This gets pricey with hundreds of nodes, especially if every
       * loop cycle does more than just rendering a JSX element!
       *
       * As a result of this choice, we took the following implementation
       * decisions:
       * - NodeRenderer subscribes *only* to node IDs – and therefore
       *   rerender *only* when visible nodes are added or removed.
       * - NodeRenderer performs all operations the result of which can be
       *   shared between nodes (such as creating the `ResizeObserver`
       *   instance, or subscribing to `selector`). This means extra prop
       *   drilling into `NodeComponentWrapper`, but it means we need to run
       *   these operations only once – instead of once per node.
       * - Any operations that you'd normally write inside `nodes.map` are
       *   moved into `NodeComponentWrapper`. This ensures they are
       *   memorized – so if `NodeRenderer` *has* to rerender, it only
       *   needs to regenerate the list of nodes, nothing else.
       */
      <NodeWrapper
        id={nodeId}
        nodeTypes={props.nodeTypes}
        nodeExtent={props.nodeExtent}
        onClick={props.onNodeClick}
        onMouseEnter={props.onNodeMouseEnter}
        onMouseMove={props.onNodeMouseMove}
        onMouseLeave={props.onNodeMouseLeave}
        onContextMenu={props.onNodeContextMenu}
        onDoubleClick={props.onNodeDoubleClick}
        noDragClassName={props.noDragClassName}
        noPanClassName={props.noPanClassName}
        rfId={props.rfId}
        disableKeyboardA11y={props.disableKeyboardA11y}
        resizeObserver={resizeObserver()}
        nodesDraggable={storeData.nodesDraggable()}
        nodesConnectable={storeData.nodesConnectable()}
        nodesFocusable={storeData.nodesFocusable()}
        elementsSelectable={storeData.elementsSelectable()}
        nodeClickDistance={props.nodeClickDistance}
        onError={storeData.onError()}
      />
    );
  }}
			</For5>
		</div>;
}
NodeRendererComponent.displayName = "NodeRenderer";
var NodeRenderer = NodeRendererComponent;

// src/container/Viewport/index.tsx
var selector24 = (s) => () => `translate(${s.transform.get()[0]}px,${s.transform.get()[1]}px) scale(${s.transform.get()[2]})`;
function Viewport(p) {
  const transform = useStore(selector24);
  return <div
    class="solid-flow__viewport xyflow__viewport solid-flow__container"
    style={{ transform: transform() }}
  >
			{p.children}
		</div>;
}

// src/container/GraphView/useNodeOrEdgeTypesWarning.ts
import { errorMessages as errorMessages8 } from "@xyflow/system";
import { createEffect as createEffect17 } from "solid-js";
var emptyTypes = {};
function useNodeOrEdgeTypesWarning(nodeOrEdgeTypes = () => emptyTypes) {
  const updateCount = useRef(0);
  const store = useStoreApi();
  createEffect17(() => {
    const _types = nodeOrEdgeTypes();
    if (true) {
      if (updateCount.current > 1) {
        store.onError.get()?.("002", errorMessages8["error002"]());
      }
      updateCount.current += 1;
    }
  });
}

// src/container/GraphView/useStylesLoadedWarning.ts
import { errorMessages as errorMessages9 } from "@xyflow/system";
import { createEffect as createEffect18 } from "solid-js";
function useStylesLoadedWarning() {
  const store = useStoreApi();
  let checked = false;
  createEffect18(() => {
    if (true) {
      if (!checked) {
        const pane = document.querySelector(".solid-flow__pane");
        if (pane && !(window.getComputedStyle(pane).zIndex === "1")) {
          store.onError.get()?.("013", errorMessages9["error013"]("solid"));
        }
        checked = true;
      }
    }
  });
}

// src/container/GraphView/index.tsx
function GraphViewComponent(p) {
  useNodeOrEdgeTypesWarning(() => p.nodeTypes);
  useNodeOrEdgeTypesWarning(() => p.edgeTypes);
  useStylesLoadedWarning();
  useOnInitHandler(() => p.onInit);
  useViewportSync(() => p.viewport);
  return <FlowRenderer
    onPaneClick={p.onPaneClick}
    onPaneMouseEnter={p.onPaneMouseEnter}
    onPaneMouseMove={p.onPaneMouseMove}
    onPaneMouseLeave={p.onPaneMouseLeave}
    onPaneContextMenu={p.onPaneContextMenu}
    onPaneScroll={p.onPaneScroll}
    paneClickDistance={p.paneClickDistance}
    deleteKeyCode={p.deleteKeyCode}
    selectionKeyCode={p.selectionKeyCode}
    selectionOnDrag={p.selectionOnDrag}
    selectionMode={p.selectionMode}
    onSelectionStart={p.onSelectionStart}
    onSelectionEnd={p.onSelectionEnd}
    multiSelectionKeyCode={p.multiSelectionKeyCode}
    panActivationKeyCode={p.panActivationKeyCode}
    zoomActivationKeyCode={p.zoomActivationKeyCode}
    elementsSelectable={p.elementsSelectable}
    zoomOnScroll={p.zoomOnScroll}
    zoomOnPinch={p.zoomOnPinch}
    zoomOnDoubleClick={p.zoomOnDoubleClick}
    panOnScroll={p.panOnScroll}
    panOnScrollSpeed={p.panOnScrollSpeed}
    panOnScrollMode={p.panOnScrollMode}
    panOnDrag={p.panOnDrag}
    defaultViewport={p.defaultViewport}
    translateExtent={p.translateExtent}
    minZoom={p.minZoom}
    maxZoom={p.maxZoom}
    onSelectionContextMenu={p.onSelectionContextMenu}
    preventScrolling={p.preventScrolling}
    noDragClassName={p.noDragClassName}
    noWheelClassName={p.noWheelClassName}
    noPanClassName={p.noPanClassName}
    disableKeyboardA11y={p.disableKeyboardA11y}
    onViewportChange={p.onViewportChange}
    isControlledViewport={!!p.viewport}
  >
			<Viewport>
				<EdgeRenderer
    edgeTypes={p.edgeTypes}
    onEdgeClick={p.onEdgeClick}
    onEdgeDoubleClick={p.onEdgeDoubleClick}
    onReconnect={p.onReconnect}
    onlyRenderVisibleElements={p.onlyRenderVisibleElements}
    onEdgeContextMenu={p.onEdgeContextMenu}
    onEdgeMouseEnter={p.onEdgeMouseEnter}
    onEdgeMouseMove={p.onEdgeMouseMove}
    onEdgeMouseLeave={p.onEdgeMouseLeave}
    onReconnectStart={p.onReconnectStart}
    onReconnectEnd={p.onReconnectEnd}
    reconnectRadius={p.reconnectRadius}
    defaultMarkerColor={p.defaultMarkerColor}
    noPanClassName={p.noPanClassName}
    disableKeyboardA11y={p.disableKeyboardA11y}
    rfId={p.rfId}
  />
				<ConnectionLineWrapper
    style={p.connectionLineStyle}
    type={p.connectionLineType}
    component={p.connectionLineComponent}
    containerStyle={p.connectionLineContainerStyle}
  />
				<div class="solid-flow__edgelabel-renderer" />
				<NodeRenderer
    nodeTypes={p.nodeTypes}
    onNodeClick={p.onNodeClick}
    onNodeDoubleClick={p.onNodeDoubleClick}
    onNodeMouseEnter={p.onNodeMouseEnter}
    onNodeMouseMove={p.onNodeMouseMove}
    onNodeMouseLeave={p.onNodeMouseLeave}
    onNodeContextMenu={p.onNodeContextMenu}
    nodeClickDistance={p.nodeClickDistance}
    onlyRenderVisibleElements={p.onlyRenderVisibleElements}
    noPanClassName={p.noPanClassName}
    noDragClassName={p.noDragClassName}
    disableKeyboardA11y={p.disableKeyboardA11y}
    nodeExtent={p.nodeExtent}
    rfId={p.rfId}
  />
				<div class="solid-flow__viewport-portal" />
			</Viewport>
		</FlowRenderer>;
}
GraphViewComponent.displayName = "GraphView";
var GraphView = GraphViewComponent;

// src/container/SolidFlow/Wrapper.tsx
import { Show as Show21, useContext as useContext4 } from "solid-js";
function Wrapper(p) {
  const isWrapped = useContext4(StoreContext_default);
  return <Show21
    when={!isWrapped}
    fallback={
      // TODO: not sure if this apples to solid?
      // we need to wrap it with a fragment because it's not allowed for children to be a ReactNode
      // https://github.com/DefinitelyTyped/DefinitelyTyped/issues/051
      <>{p.children}</>
    }
  >
			<SolidFlowProvider
    initialNodes={p.nodes}
    initialEdges={p.edges}
    defaultNodes={p.defaultNodes}
    defaultEdges={p.defaultEdges}
    initialWidth={p.width}
    initialHeight={p.height}
    fitView={p.fitView}
    initialFitViewOptions={p.fitViewOptions}
    initialMinZoom={p.minZoom}
    initialMaxZoom={p.maxZoom}
    nodeOrigin={p.nodeOrigin}
    nodeExtent={p.nodeExtent}
  >
				{p.children}
			</SolidFlowProvider>
		</Show21>;
}

// src/container/SolidFlow/index.tsx
var wrapperStyle = {
  width: "100%",
  height: "100%",
  overflow: "hidden",
  position: "relative",
  "z-index": 0
};
function SolidFlow(_p) {
  const p = mergeProps25(
    {
      colorMode: "light",
      debug: false,
      connectionLineType: ConnectionLineType2.Bezier,
      deleteKeyCode: "Backspace",
      selectionKeyCode: "Shift",
      selectionOnDrag: false,
      selectionMode: SelectionMode2.Full,
      panActivationKeyCode: "Space",
      multiSelectionKeyCode: isMacOs() ? "Meta" : "Control",
      zoomActivationKeyCode: isMacOs() ? "Meta" : "Control",
      onlyRenderVisibleElements: false,
      nodeOrigin: defaultNodeOrigin,
      elementsSelectable: true,
      defaultViewport,
      minZoom: 0.5,
      maxZoom: 2,
      translateExtent: infiniteExtent3,
      preventScrolling: true,
      defaultMarkerColor: "#b1b1b7",
      zoomOnScroll: true,
      zoomOnPinch: true,
      panOnScroll: false,
      panOnScrollSpeed: 0.5,
      panOnScrollMode: PanOnScrollMode2.Free,
      zoomOnDoubleClick: true,
      panOnDrag: true,
      paneClickDistance: 0,
      nodeClickDistance: 0,
      reconnectRadius: 10,
      noDragClassName: "nodrag",
      noWheelClassName: "nowheel",
      noPanClassName: "nopan",
      disableKeyboardA11y: false
    },
    _p
  );
  const [_extractedProps, rest] = splitProps6(p, [
    "nodes",
    "edges",
    "defaultNodes",
    "defaultEdges",
    "class",
    "className",
    "nodeTypes",
    "edgeTypes",
    "onNodeClick",
    "onEdgeClick",
    "onInit",
    "onMove",
    "onMoveStart",
    "onMoveEnd",
    "onConnect",
    "onConnectStart",
    "onConnectEnd",
    "onClickConnectStart",
    "onClickConnectEnd",
    "onNodeMouseEnter",
    "onNodeMouseMove",
    "onNodeMouseLeave",
    "onNodeContextMenu",
    "onNodeDoubleClick",
    "onNodeDragStart",
    "onNodeDrag",
    "onNodeDragStop",
    "onNodesDelete",
    "onEdgesDelete",
    "onDelete",
    "onSelectionChange",
    "onSelectionDragStart",
    "onSelectionDrag",
    "onSelectionDragStop",
    "onSelectionContextMenu",
    "onSelectionStart",
    "onSelectionEnd",
    "onBeforeDelete",
    "connectionMode",
    "connectionLineStyle",
    "connectionLineComponent",
    "connectionLineContainerStyle",
    "snapToGrid",
    "snapGrid",
    "onlyRenderVisibleElements",
    "selectNodesOnDrag",
    "nodesDraggable",
    "nodesConnectable",
    "nodesFocusable",
    "nodeExtent",
    "edgesFocusable",
    "edgesReconnectable",
    "onPaneClick",
    "onPaneMouseEnter",
    "onPaneMouseMove",
    "onPaneMouseLeave",
    "onPaneScroll",
    "onPaneContextMenu",
    "paneClickDistance",
    "nodeClickDistance",
    "children",
    "onReconnect",
    "onReconnectStart",
    "onReconnectEnd",
    "onEdgeContextMenu",
    "onEdgeDoubleClick",
    "onEdgeMouseEnter",
    "onEdgeMouseMove",
    "onEdgeMouseLeave",
    "reconnectRadius",
    "onNodesChange",
    "onEdgesChange",
    "noDragClassName",
    "noWheelClassName",
    "noPanClassName",
    "fitView",
    "fitViewOptions",
    "connectOnClick",
    "attributionPosition",
    "proOptions",
    "defaultEdgeOptions",
    "elevateNodesOnSelect",
    "elevateEdgesOnSelect",
    "disableKeyboardA11y",
    "autoPanOnConnect",
    "autoPanOnNodeDrag",
    "autoPanSpeed",
    "connectionRadius",
    "isValidConnection",
    "onError",
    "style",
    "id",
    "nodeDragThreshold",
    "viewport",
    "onViewportChange",
    "width",
    "height",
    "onScroll"
  ]);
  const rfId = () => p.id || "1";
  const colorModeClassName = useColorModeClass(() => p.colorMode);
  const wrapperOnScroll = (e) => {
    const target = e.currentTarget;
    target.scrollTo({ top: 0, left: 0, behavior: "instant" });
    if (typeof p.onScroll === "function") {
      p.onScroll(
        e
      );
    }
  };
  return <div
    data-testid="rf__wrapper"
    {...rest}
    onScroll={wrapperOnScroll}
    style={{
      ...typeof p.style === "object" ? p.style : null,
      ...wrapperStyle
    }}
    ref={p.ref}
    class={cc19(["solid-flow", p.class || p.className, colorModeClassName])}
    id={p.id}
  >
			<Wrapper
    nodes={p.nodes}
    edges={p.edges}
    width={p.width}
    height={p.height}
    fitView={p.fitView}
    fitViewOptions={p.fitViewOptions}
    minZoom={p.minZoom}
    maxZoom={p.maxZoom}
    nodeOrigin={p.nodeOrigin}
    nodeExtent={p.nodeExtent}
  >
				<GraphView
    onInit={p.onInit}
    onNodeClick={p.onNodeClick}
    onEdgeClick={p.onEdgeClick}
    onNodeMouseEnter={p.onNodeMouseEnter}
    onNodeMouseMove={p.onNodeMouseMove}
    onNodeMouseLeave={p.onNodeMouseLeave}
    onNodeContextMenu={p.onNodeContextMenu}
    onNodeDoubleClick={p.onNodeDoubleClick}
    nodeTypes={p.nodeTypes}
    edgeTypes={p.edgeTypes}
    connectionLineType={p.connectionLineType}
    connectionLineStyle={p.connectionLineStyle}
    connectionLineComponent={p.connectionLineComponent}
    connectionLineContainerStyle={p.connectionLineContainerStyle}
    selectionKeyCode={p.selectionKeyCode}
    selectionOnDrag={p.selectionOnDrag}
    selectionMode={p.selectionMode}
    deleteKeyCode={p.deleteKeyCode}
    multiSelectionKeyCode={p.multiSelectionKeyCode}
    panActivationKeyCode={p.panActivationKeyCode}
    zoomActivationKeyCode={p.zoomActivationKeyCode}
    onlyRenderVisibleElements={p.onlyRenderVisibleElements}
    defaultViewport={p.defaultViewport}
    translateExtent={p.translateExtent}
    minZoom={p.minZoom}
    maxZoom={p.maxZoom}
    preventScrolling={p.preventScrolling}
    zoomOnScroll={p.zoomOnScroll}
    zoomOnPinch={p.zoomOnPinch}
    zoomOnDoubleClick={p.zoomOnDoubleClick}
    panOnScroll={p.panOnScroll}
    panOnScrollSpeed={p.panOnScrollSpeed}
    panOnScrollMode={p.panOnScrollMode}
    panOnDrag={p.panOnDrag}
    onPaneClick={p.onPaneClick}
    onPaneMouseEnter={p.onPaneMouseEnter}
    onPaneMouseMove={p.onPaneMouseMove}
    onPaneMouseLeave={p.onPaneMouseLeave}
    onPaneScroll={p.onPaneScroll}
    onPaneContextMenu={p.onPaneContextMenu}
    paneClickDistance={p.paneClickDistance}
    nodeClickDistance={p.nodeClickDistance}
    onSelectionContextMenu={p.onSelectionContextMenu}
    onSelectionStart={p.onSelectionStart}
    onSelectionEnd={p.onSelectionEnd}
    onReconnect={p.onReconnect}
    onReconnectStart={p.onReconnectStart}
    onReconnectEnd={p.onReconnectEnd}
    onEdgeContextMenu={p.onEdgeContextMenu}
    onEdgeDoubleClick={p.onEdgeDoubleClick}
    onEdgeMouseEnter={p.onEdgeMouseEnter}
    onEdgeMouseMove={p.onEdgeMouseMove}
    onEdgeMouseLeave={p.onEdgeMouseLeave}
    reconnectRadius={p.reconnectRadius}
    defaultMarkerColor={p.defaultMarkerColor}
    noDragClassName={p.noDragClassName}
    noWheelClassName={p.noWheelClassName}
    noPanClassName={p.noPanClassName}
    rfId={rfId()}
    disableKeyboardA11y={p.disableKeyboardA11y}
    nodeExtent={p.nodeExtent}
    viewport={p.viewport}
    onViewportChange={p.onViewportChange}
  />
				<StoreUpdater
    nodes={p.nodes}
    edges={p.edges}
    defaultNodes={p.defaultNodes}
    defaultEdges={p.defaultEdges}
    onConnect={p.onConnect}
    onConnectStart={p.onConnectStart}
    onConnectEnd={p.onConnectEnd}
    onClickConnectStart={p.onClickConnectStart}
    onClickConnectEnd={p.onClickConnectEnd}
    nodesDraggable={p.nodesDraggable}
    nodesConnectable={p.nodesConnectable}
    nodesFocusable={p.nodesFocusable}
    edgesFocusable={p.edgesFocusable}
    edgesReconnectable={p.edgesReconnectable}
    elementsSelectable={p.elementsSelectable}
    elevateNodesOnSelect={p.elevateNodesOnSelect}
    elevateEdgesOnSelect={p.elevateEdgesOnSelect}
    minZoom={p.minZoom}
    maxZoom={p.maxZoom}
    nodeExtent={p.nodeExtent}
    onNodesChange={p.onNodesChange}
    onEdgesChange={p.onEdgesChange}
    snapToGrid={p.snapToGrid}
    snapGrid={p.snapGrid}
    connectionMode={p.connectionMode}
    translateExtent={p.translateExtent}
    connectOnClick={p.connectOnClick}
    defaultEdgeOptions={p.defaultEdgeOptions}
    fitView={p.fitView}
    fitViewOptions={p.fitViewOptions}
    onNodesDelete={p.onNodesDelete}
    onEdgesDelete={p.onEdgesDelete}
    onDelete={p.onDelete}
    onNodeDragStart={p.onNodeDragStart}
    onNodeDrag={p.onNodeDrag}
    onNodeDragStop={p.onNodeDragStop}
    onSelectionDrag={p.onSelectionDrag}
    onSelectionDragStart={p.onSelectionDragStart}
    onSelectionDragStop={p.onSelectionDragStop}
    onMove={p.onMove}
    onMoveStart={p.onMoveStart}
    onMoveEnd={p.onMoveEnd}
    noPanClassName={p.noPanClassName}
    nodeOrigin={p.nodeOrigin}
    rfId={rfId()}
    autoPanOnConnect={p.autoPanOnConnect}
    autoPanOnNodeDrag={p.autoPanOnNodeDrag}
    autoPanSpeed={p.autoPanSpeed}
    onError={p.onError}
    connectionRadius={p.connectionRadius}
    isValidConnection={p.isValidConnection}
    selectNodesOnDrag={p.selectNodesOnDrag}
    nodeDragThreshold={p.nodeDragThreshold}
    onBeforeDelete={p.onBeforeDelete}
    paneClickDistance={p.paneClickDistance}
    debug={p.debug}
  />
				<SelectionListener onSelectionChange={p.onSelectionChange} />
				{p.children}
				<Attribution
    proOptions={p.proOptions}
    position={p.attributionPosition}
  />
				<A11yDescriptions
    rfId={rfId()}
    disableKeyboardA11y={p.disableKeyboardA11y}
  />
			</Wrapper>
		</div>;
}
var SolidFlow_default = SolidFlow;

// src/hooks/useEdges.ts
var edgesSelector = (state) => state.edges;
function useEdges() {
  const edges = useStore(edgesSelector);
  return edges;
}

// src/hooks/useHandleConnections.ts
import { ReactiveMap as ReactiveMap2 } from "@solid-primitives/map";
import {
  handleConnectionChange
} from "@xyflow/system";
import { createEffect as createEffect19 } from "solid-js";
function useHandleConnections({
  type,
  id = null,
  nodeId,
  onConnect,
  onDisconnect
}) {
  const _nodeId = useNodeId();
  const currentNodeId = nodeId ?? _nodeId;
  if (true) {
  }
  const prevConnections = useRef(
    null
  );
  const connections = useStore(
    (state) => () => state.connectionLookup.get(`${currentNodeId}-${type}-${id}`)
  );
  createEffect19(() => {
    if (prevConnections.current && prevConnections.current() !== connections()) {
      const _connections = connections() ?? new ReactiveMap2();
      handleConnectionChange(
        prevConnections.current(),
        _connections,
        onDisconnect
      );
      handleConnectionChange(
        _connections,
        prevConnections.current(),
        onConnect
      );
    }
    prevConnections.current = () => connections() ?? new ReactiveMap2();
  });
  return () => Array.from(connections()?.values() ?? []);
}

// src/hooks/useInternalNode.ts
function useInternalNode(id) {
  const node = useStore(
    (s) => () => s.nodeLookup.get(id)
  );
  return node;
}

// src/hooks/useNodeConnections.ts
import { ReactiveMap as ReactiveMap3 } from "@solid-primitives/map";
import {
  errorMessages as errorMessages10,
  handleConnectionChange as handleConnectionChange2
} from "@xyflow/system";
import { createEffect as createEffect20, createMemo as createMemo9 } from "solid-js";
var error014 = errorMessages10["error014"]();
function useNodeConnections({
  id,
  handleType,
  handleId,
  onConnect,
  onDisconnect
} = {}) {
  const nodeId = useNodeId();
  const currentNodeId = id ?? nodeId();
  if (!currentNodeId) {
    throw new Error(error014);
  }
  const prevConnections = useRef(
    null
  );
  const connections = useStore(
    (state) => () => state.connectionLookup.get(
      `${currentNodeId}${handleType ? handleId ? `-${handleType}-${handleId}` : `-${handleType}` : ""}`
    )
  );
  createEffect20(() => {
    if (prevConnections.current && prevConnections.current() !== connections()) {
      const _connections = connections() ?? new ReactiveMap3();
      handleConnectionChange2(
        prevConnections.current(),
        _connections,
        onDisconnect
      );
      handleConnectionChange2(
        _connections,
        prevConnections.current(),
        onConnect
      );
    }
    prevConnections.current = () => connections() ?? new ReactiveMap3();
  });
  return createMemo9(() => Array.from(connections()?.values() ?? []));
}

// src/hooks/useNodes.ts
var nodesSelector = (state) => state.nodes;
function useNodes() {
  const nodes = useStore(nodesSelector);
  return nodes;
}

// src/hooks/useNodesData.ts
function useNodesData(nodeIds) {
  const nodesData = useStore((s) => {
    const data = [];
    const isArrayOfIds = Array.isArray(nodeIds);
    const _nodeIds = isArrayOfIds ? nodeIds : [nodeIds];
    for (const nodeId of _nodeIds) {
      const node = s.nodeLookup.get(nodeId);
      if (node) {
        data.push({
          id: node.id,
          type: node.type,
          data: node.data
        });
      }
    }
    return isArrayOfIds ? data : data[0] ?? null;
  });
  return nodesData;
}

// src/hooks/useNodesEdgesState.ts
import { createSignal as createSignal10 } from "solid-js";
function useNodesState(initialNodes) {
  const [nodes, setNodes] = createSignal10(initialNodes);
  const onNodesChange = (changes) => setNodes((nds) => applyNodeChanges(changes, nds));
  return [nodes, setNodes, onNodesChange];
}
function useEdgesState(initialEdges) {
  const [edges, setEdges] = createSignal10(initialEdges);
  const onEdgesChange = (changes) => setEdges((eds) => applyEdgeChanges(changes, eds));
  return [edges, setEdges, onEdgesChange];
}

// src/hooks/useNodesInitialized.ts
import { nodeHasDimensions as nodeHasDimensions3 } from "@xyflow/system";
var selector25 = (options) => (s) => {
  if (s.nodeLookup.size === 0) {
    return false;
  }
  for (const [, { hidden, internals }] of s.nodeLookup) {
    if (options.includeHiddenNodes || !hidden) {
      if (internals.handleBounds === void 0 || !nodeHasDimensions3(internals.userNode)) {
        return false;
      }
    }
  }
  return true;
};
var defaultOptions = {
  includeHiddenNodes: false
};
function useNodesInitialized(options = defaultOptions) {
  const initialized = useStore(selector25(options));
  return initialized;
}

// src/hooks/useOnSelectionChange.ts
import { createEffect as createEffect21, onCleanup as onCleanup10 } from "solid-js";
function useOnSelectionChange(p) {
  const store = useStoreApi();
  createEffect21(() => {
    const nextOnSelectionChangeHandlers = [
      ...store.onSelectionChangeHandlers.get(),
      p.onChange
    ];
    store.onSelectionChangeHandlers.set(nextOnSelectionChangeHandlers);
    onCleanup10(() => {
      const nextHandlers = store.onSelectionChangeHandlers.get().filter((fn) => fn !== p.onChange);
      store.onSelectionChangeHandlers.set(nextHandlers);
    });
  });
}

// src/hooks/useOnViewportChange.ts
import { createEffect as createEffect22 } from "solid-js";
function useOnViewportChange({
  onStart,
  onChange,
  onEnd
}) {
  const store = useStoreApi();
  createEffect22(() => {
    store.onViewportChangeStart.set(onStart);
  });
  createEffect22(() => {
    store.onViewportChange.set(onChange);
  });
  createEffect22(() => {
    store.onViewportChangeEnd.set(onEnd);
  });
}

// src/hooks/useUpdateNodeInternals.ts
function useUpdateNodeInternals() {
  const store = useStoreApi();
  return (id) => {
    const { updateNodeInternals } = store;
    const domNode = store.domNode.get();
    const updateIds = Array.isArray(id) ? id : [id];
    const updates = /* @__PURE__ */ new Map();
    updateIds.forEach((updateId) => {
      const nodeElement = domNode?.querySelector(
        `.solid-flow__node[data-id="${updateId}"]`
      );
      if (nodeElement) {
        updates.set(updateId, { id: updateId, nodeElement, force: true });
      }
    });
    requestAnimationFrame(() => updateNodeInternals(updates));
  };
}

// src/hooks/useViewport.ts
var viewportSelector = (state) => () => ({
  x: state.transform.get()[0],
  y: state.transform.get()[1],
  zoom: state.transform.get()[2]
});
function useViewport() {
  const viewport = useStore(viewportSelector);
  return viewport;
}

// src/index.ts
import {
  addEdge as addEdge2,
  getBezierEdgeCenter as getBezierEdgeCenter2,
  getBezierPath as getBezierPath3,
  getConnectedEdges,
  getEdgeCenter,
  getIncomers,
  getNodesBounds as getNodesBounds3,
  getOutgoers,
  getSmoothStepPath as getSmoothStepPath3,
  getStraightPath as getStraightPath3,
  getViewportForBounds as getViewportForBounds3,
  reconnectEdge
} from "@xyflow/system";
export {
  Background,
  BackgroundVariant,
  BaseEdge,
  BezierEdge,
  ConnectionLineType3 as ConnectionLineType,
  ConnectionMode3 as ConnectionMode,
  ControlButton,
  Controls,
  EdgeLabelRenderer,
  EdgeText,
  Handle,
  MarkerType2 as MarkerType,
  MiniMap,
  NodeResizeControl,
  NodeResizer,
  NodeToolbar,
  PanOnScrollMode3 as PanOnScrollMode,
  Panel,
  Position10 as Position,
  ResizeControlVariant3 as ResizeControlVariant,
  SelectionMode3 as SelectionMode,
  SimpleBezierEdge,
  SmoothStepEdge,
  SolidFlow_default as SolidFlow,
  SolidFlowProvider,
  StepEdge,
  StraightEdge,
  ViewportPortal,
  addEdge2 as addEdge,
  applyEdgeChanges,
  applyNodeChanges,
  getBezierEdgeCenter2 as getBezierEdgeCenter,
  getBezierPath3 as getBezierPath,
  getConnectedEdges,
  getEdgeCenter,
  getIncomers,
  getNodesBounds3 as getNodesBounds,
  getOutgoers,
  getSimpleBezierPath,
  getSmoothStepPath3 as getSmoothStepPath,
  getStraightPath3 as getStraightPath,
  getViewportForBounds3 as getViewportForBounds,
  isEdge,
  isNode,
  reconnectEdge,
  useConnection,
  useEdges,
  useEdgesState,
  useHandleConnections,
  useInternalNode,
  useKeyPress,
  useNodeConnections,
  useNodeId,
  useNodes,
  useNodesData,
  useNodesInitialized,
  useNodesState,
  useOnSelectionChange,
  useOnViewportChange,
  useSolidFlow,
  useStore,
  useStoreApi,
  useUpdateNodeInternals,
  useViewport
};