@xyflow/react 12.0.0-next.2 → 12.0.0-next.21

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2019-2023 webkid GmbH
+Copyright (c) 2019-2024 webkid GmbH
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/dist/base.css

@@ -1,6 +1,8 @@
 /* this will be exported as base.css and can be used for a basic styling */
 /* these are the necessary styles for React/Svelte Flow, they get used by base.css and style.css */
 .react-flow {
+  direction: ltr;
+
   --xy-edge-stroke-default: #b1b1b7;
   --xy-edge-stroke-width-default: 1;
   --xy-edge-stroke-selected-default: #555;
@@ -12,6 +14,8 @@
 
   --xy-minimap-background-color-default: #fff;
   --xy-minimap-mask-background-color-default: rgb(240, 240, 240, 0.6);
+  --xy-minimap-mask-stroke-color-default: transparent;
+  --xy-minimap-mask-stroke-width-default: 1;
   --xy-minimap-node-background-color-default: #e2e2e2;
   --xy-minimap-node-stroke-color-default: transparent;
   --xy-minimap-node-stroke-width-default: 2;
@@ -28,6 +32,7 @@
 
   --xy-selection-background-color-default: rgba(150, 150, 180, 0.1);
   --xy-selection-border-default: 1px dotted rgba(155, 155, 155, 0.8);
+  --xy-resize-background-color-default: #3367d9;
 }
 .react-flow.dark {
   --xy-edge-stroke-default: #3e3e3e;
@@ -41,6 +46,8 @@
 
   --xy-minimap-background-color-default: #141414;
   --xy-minimap-mask-background-color-default: rgb(60, 60, 60, 0.6);
+  --xy-minimap-mask-stroke-color-default: transparent;
+  --xy-minimap-mask-stroke-width-default: 1;
   --xy-minimap-node-background-color-default: #2b2b2b;
   --xy-minimap-node-stroke-color-default: transparent;
   --xy-minimap-node-stroke-width-default: 2;
@@ -65,14 +72,16 @@
 }
 .react-flow__pane {
   z-index: 1;
-  cursor: grab;
 }
 .react-flow__pane.selection {
     cursor: pointer;
   }
-.react-flow__pane.dragging {
-    cursor: grabbing;
+.react-flow__pane.draggable {
+    cursor: grab;
   }
+.react-flow__pane.draggable.dragging {
+      cursor: grabbing;
+    }
 .react-flow__viewport {
   transform-origin: 0 0;
   z-index: 2;
@@ -101,10 +110,17 @@
 .react-flow__edges {
   position: absolute;
 }
+.react-flow__edges svg {
+    overflow: visible;
+    position: absolute;
+    pointer-events: none;
+  }
 .react-flow__edge {
   pointer-events: visibleStroke;
-  cursor: pointer;
 }
+.react-flow__edge.selectable {
+    cursor: pointer;
+  }
 .react-flow__edge.animated path {
     stroke-dasharray: 5;
     animation: dashdraw 0.5s linear infinite;
@@ -122,8 +138,8 @@
     outline: none;
   }
 .react-flow__edge.selected .react-flow__edge-path,
-  .react-flow__edge:focus .react-flow__edge-path,
-  .react-flow__edge:focus-visible .react-flow__edge-path {
+  .react-flow__edge.selectable:focus .react-flow__edge-path,
+  .react-flow__edge.selectable:focus-visible .react-flow__edge-path {
     stroke: var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default));
   }
 .react-flow__edge-textwrapper {
@@ -142,7 +158,7 @@
     stroke-dasharray: 5;
     animation: dashdraw 0.5s linear infinite;
   }
-.react-flow__connectionline {
+svg.react-flow__connectionline {
   z-index: 1001;
   overflow: visible;
   position: absolute;
@@ -159,16 +175,18 @@
   pointer-events: all;
   transform-origin: 0 0;
   box-sizing: border-box;
-  cursor: grab;
+  cursor: default;
 }
-.react-flow__node.dragging {
-    cursor: grabbing;
+.react-flow__node.selectable {
+    cursor: pointer;
   }
-/* only used in Svelte Flow, should we remove it here? */
 .react-flow__node.draggable {
     cursor: grab;
     pointer-events: all;
   }
+.react-flow__node.draggable.dragging {
+      cursor: grabbing;
+    }
 .react-flow__nodesselection {
   z-index: 3;
   transform-origin: left top;
@@ -186,6 +204,9 @@
   min-height: 5px;
   background-color: var(--xy-handle-background-color, var(--xy-handle-background-color-default));
 }
+.react-flow__handle.connectingfrom {
+    pointer-events: all;
+  }
 .react-flow__handle.connectionindicator {
     pointer-events: all;
     cursor: crosshair;
@@ -268,15 +289,32 @@
   height: 100%;
   left: 0;
   top: 0;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
 }
 .react-flow__minimap {
-  background: var(--xy-minimap-background-color, var(--xy-minimap-background-color-default));
+  background: var(
+    --xy-minimap-background-color-props,
+    var(--xy-minimap-background-color, var(--xy-minimap-background-color-default))
+  );
 }
+.react-flow__minimap-svg {
+    display: block;
+  }
 .react-flow__minimap-mask {
     fill: var(
       --xy-minimap-mask-background-color-props,
       var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default))
     );
+    stroke: var(
+      --xy-minimap-mask-stroke-color-props,
+      var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default))
+    );
+    stroke-width: var(
+      --xy-minimap-mask-stroke-width-props,
+      var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default))
+    );
   }
 .react-flow__minimap-node {
     fill: var(
@@ -310,6 +348,13 @@
       var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default))
     );
   }
+.react-flow__controls {
+  display: flex;
+  flex-direction: column;
+}
+.react-flow__controls.horizontal {
+    flex-direction: row;
+  }
 .react-flow__controls-button {
     display: flex;
     justify-content: center;
@@ -351,17 +396,95 @@
   background: var(--xy-selection-background-color, var(--xy-selection-background-color-default));
   border: var(--xy-selection-border, var(--xy-selection-border-default));
 }
-.react-flow {
-  --edge-label-background-color-default: #ffffff;
-  --edge-label-color-default: inherit;
+.react-flow__resize-control {
+  position: absolute;
 }
-.react-flow.dark {
-  --edge-label-background-color-default: #141414;
-  --edge-label-color-default: #f8f8f8;
+.react-flow__resize-control.left,
+.react-flow__resize-control.right {
+  cursor: ew-resize;
+}
+.react-flow__resize-control.top,
+.react-flow__resize-control.bottom {
+  cursor: ns-resize;
 }
-.react-flow__edge-textbg {
-  fill: var(--edge-label-background-color, var(--edge-label-background-color-default));
+.react-flow__resize-control.top.left,
+.react-flow__resize-control.bottom.right {
+  cursor: nwse-resize;
+}
+.react-flow__resize-control.bottom.left,
+.react-flow__resize-control.top.right {
+  cursor: nesw-resize;
+}
+/* handle styles */
+.react-flow__resize-control.handle {
+  width: 4px;
+  height: 4px;
+  border: 1px solid #fff;
+  border-radius: 1px;
+  background-color: var(--xy-resize-background-color, var(--xy-resize-background-color-default));
+  transform: translate(-50%, -50%);
+}
+.react-flow__resize-control.handle.left {
+  left: 0;
+  top: 50%;
+}
+.react-flow__resize-control.handle.right {
+  left: 100%;
+  top: 50%;
+}
+.react-flow__resize-control.handle.top {
+  left: 50%;
+  top: 0;
+}
+.react-flow__resize-control.handle.bottom {
+  left: 50%;
+  top: 100%;
+}
+.react-flow__resize-control.handle.top.left {
+  left: 0;
+}
+.react-flow__resize-control.handle.bottom.left {
+  left: 0;
+}
+.react-flow__resize-control.handle.top.right {
+  left: 100%;
+}
+.react-flow__resize-control.handle.bottom.right {
+  left: 100%;
+}
+/* line styles */
+.react-flow__resize-control.line {
+  border-color: var(--xy-resize-background-color, var(--xy-resize-background-color-default));
+  border-width: 0;
+  border-style: solid;
+}
+.react-flow__resize-control.line.left,
+.react-flow__resize-control.line.right {
+  width: 1px;
+  transform: translate(-50%, 0);
+  top: 0;
+  height: 100%;
+}
+.react-flow__resize-control.line.left {
+  left: 0;
+  border-left-width: 1px;
+}
+.react-flow__resize-control.line.right {
+  left: 100%;
+  border-right-width: 1px;
+}
+.react-flow__resize-control.line.top,
+.react-flow__resize-control.line.bottom {
+  height: 1px;
+  transform: translate(0, -50%);
+  left: 0;
+  width: 100%;
+}
+.react-flow__resize-control.line.top {
+  top: 0;
+  border-top-width: 1px;
 }
-.react-flow__edge-text {
-  fill: var(--edge-label-color, var(--edge-label-color-default));
+.react-flow__resize-control.line.bottom {
+  border-bottom-width: 1px;
+  top: 100%;
 }

package/dist/esm/additional-components/Background/Background.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="react" />
-import { BackgroundProps } from './types';
-declare function Background({ id, variant, gap, size, lineWidth, offset, color, bgColor, style, className, patternClassName, }: BackgroundProps): import("react/jsx-runtime").JSX.Element;
-declare namespace Background {
+import { type BackgroundProps } from './types';
+declare function BackgroundComponent({ id, variant, gap, size, lineWidth, offset, color, bgColor, style, className, patternClassName, }: BackgroundProps): import("react/jsx-runtime").JSX.Element;
+declare namespace BackgroundComponent {
     var displayName: string;
 }
-declare const _default: import("react").MemoExoticComponent<typeof Background>;
-export default _default;
+export declare const Background: import("react").MemoExoticComponent<typeof BackgroundComponent>;
+export {};
 //# sourceMappingURL=Background.d.ts.map

package/dist/esm/additional-components/Background/Background.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Background.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Background/Background.tsx"],"names":[],"mappings":";AAMA,OAAO,EAAE,eAAe,EAAqB,MAAM,SAAS,CAAC;AAY7D,iBAAS,UAAU,CAAC,EAClB,EAAE,EACF,OAAgC,EAEhC,GAAQ,EAER,IAAI,EACJ,SAAa,EACb,MAAU,EACV,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAS,EACT,gBAAgB,GACjB,EAAE,eAAe,2CAuDjB;kBArEQ,UAAU;;;;AAyEnB,wBAAgC"}
+{"version":3,"file":"Background.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Background/Background.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,KAAK,eAAe,EAAqB,MAAM,SAAS,CAAC;AAWlE,iBAAS,mBAAmB,CAAC,EAC3B,EAAE,EACF,OAAgC,EAEhC,GAAQ,EAER,IAAI,EACJ,SAAa,EACb,MAAU,EACV,KAAK,EACL,OAAO,EACP,KAAK,EACL,SAAS,EACT,gBAAgB,GACjB,EAAE,eAAe,2CAuDjB;kBArEQ,mBAAmB;;;AAyE5B,eAAO,MAAM,UAAU,iEAA4B,CAAC"}

package/dist/esm/additional-components/Background/Patterns.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Patterns.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Background/Patterns.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,KAAK,gBAAgB,GAAG;IACtB,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC7B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAQ1F;AAED,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,eAAe,2CAIhE"}
+{"version":3,"file":"Patterns.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Background/Patterns.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAE5C,KAAK,gBAAgB,GAAG;IACtB,UAAU,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAC7B,OAAO,EAAE,iBAAiB,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,WAAW,CAAC,EAAE,UAAU,EAAE,SAAS,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,gBAAgB,2CAQ1F;AAED,KAAK,eAAe,GAAG;IACrB,MAAM,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,wBAAgB,UAAU,CAAC,EAAE,MAAM,EAAE,SAAS,EAAE,EAAE,eAAe,2CAIhE"}

package/dist/esm/additional-components/Background/index.d.ts

@@ -1,3 +1,3 @@
-export { default as Background } from './Background';
-export * from './types';
+export { Background } from './Background';
+export { BackgroundVariant, type BackgroundProps } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/esm/additional-components/Background/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Background/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Background/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,OAAO,EAAE,iBAAiB,EAAE,KAAK,eAAe,EAAE,MAAM,SAAS,CAAC"}

package/dist/esm/additional-components/Background/types.d.ts

@@ -6,15 +6,28 @@ export declare enum BackgroundVariant {
 }
 export type BackgroundProps = {
     id?: string;
+    /** Color of the pattern */
     color?: string;
+    /** Color of the background */
     bgColor?: string;
+    /** Class applied to the container */
     className?: string;
+    /** Class applied to the pattern */
     patternClassName?: string;
+    /** Gap between repetitions of the pattern */
     gap?: number | [number, number];
+    /** Size of a single pattern element */
     size?: number;
+    /** Offset of the pattern */
     offset?: number;
+    /** Line width of the Line pattern */
     lineWidth?: number;
+    /** Variant of the pattern
+     * @example BackgroundVariant.Lines, BackgroundVariant.Dots, BackgroundVariant.Cross
+     * 'lines', 'dots', 'cross'
+     */
     variant?: BackgroundVariant;
+    /** Style applied to the container */
     style?: CSSProperties;
 };
 //# sourceMappingURL=types.d.ts.map

package/dist/esm/additional-components/Background/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Background/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,oBAAY,iBAAiB;IAC3B,KAAK,UAAU;IACf,IAAI,SAAS;IACb,KAAK,UAAU;CAChB;AAED,MAAM,MAAM,eAAe,GAAG;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Background/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAEtC,oBAAY,iBAAiB;IAC3B,KAAK,UAAU;IACf,IAAI,SAAS;IACb,KAAK,UAAU;CAChB;AAED,MAAM,MAAM,eAAe,GAAG;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,2BAA2B;IAC3B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,8BAA8B;IAC9B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mCAAmC;IACnC,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,6CAA6C;IAC7C,GAAG,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,uCAAuC;IACvC,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,4BAA4B;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,OAAO,CAAC,EAAE,iBAAiB,CAAC;IAC5B,qCAAqC;IACrC,KAAK,CAAC,EAAE,aAAa,CAAC;CACvB,CAAC"}

package/dist/esm/additional-components/Controls/ControlButton.d.ts

@@ -1,5 +1,3 @@
-import type { FC, PropsWithChildren } from 'react';
 import type { ControlButtonProps } from './types';
-declare const ControlButton: FC<PropsWithChildren<ControlButtonProps>>;
-export default ControlButton;
+export declare function ControlButton({ children, className, ...rest }: ControlButtonProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ControlButton.d.ts.map

package/dist/esm/additional-components/Controls/ControlButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ControlButton.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Controls/ControlButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAGnD,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,QAAA,MAAM,aAAa,EAAE,EAAE,CAAC,iBAAiB,CAAC,kBAAkB,CAAC,CAI5D,CAAC;AAIF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"ControlButton.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Controls/ControlButton.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC;AAElD,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,kBAAkB,2CAMjF"}

package/dist/esm/additional-components/Controls/Controls.d.ts

@@ -1,5 +1,9 @@
-import { type PropsWithChildren } from 'react';
+/// <reference types="react" />
 import type { ControlProps } from './types';
-declare const _default: import("react").NamedExoticComponent<PropsWithChildren<ControlProps>>;
-export default _default;
+declare function ControlsComponent({ style, showZoom, showFitView, showInteractive, fitViewOptions, onZoomIn, onZoomOut, onFitView, onInteractiveChange, className, children, position, orientation, 'aria-label': ariaLabel, }: ControlProps): import("react/jsx-runtime").JSX.Element;
+declare namespace ControlsComponent {
+    var displayName: string;
+}
+export declare const Controls: import("react").MemoExoticComponent<typeof ControlsComponent>;
+export {};
 //# sourceMappingURL=Controls.d.ts.map

package/dist/esm/additional-components/Controls/Controls.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Controls.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Controls/Controls.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAgB9D,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;;AA2G5C,wBAA8B"}
+{"version":3,"file":"Controls.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Controls/Controls.tsx"],"names":[],"mappings":";AAeA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAQ5C,iBAAS,iBAAiB,CAAC,EACzB,KAAK,EACL,QAAe,EACf,WAAkB,EAClB,eAAsB,EACtB,cAAc,EACd,QAAQ,EACR,SAAS,EACT,SAAS,EACT,mBAAmB,EACnB,SAAS,EACT,QAAQ,EACR,QAAwB,EACxB,WAAwB,EACxB,YAAY,EAAE,SAAiC,GAChD,EAAE,YAAY,2CAqFd;kBApGQ,iBAAiB;;;AAwG1B,eAAO,MAAM,QAAQ,+DAA0B,CAAC"}

package/dist/esm/additional-components/Controls/Icons/FitView.d.ts

@@ -1,3 +1,2 @@
-declare function FitViewIcon(): import("react/jsx-runtime").JSX.Element;
-export default FitViewIcon;
+export declare function FitViewIcon(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=FitView.d.ts.map

package/dist/esm/additional-components/Controls/Icons/FitView.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FitView.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/additional-components/Controls/Icons/FitView.tsx"],"names":[],"mappings":"AAAA,iBAAS,WAAW,4CAMnB;AAED,eAAe,WAAW,CAAC"}
+{"version":3,"file":"FitView.d.ts","sourceRoot":"","sources":["../../../../src/additional-components/Controls/Icons/FitView.tsx"],"names":[],"mappings":"AAAA,wBAAgB,WAAW,4CAM1B"}

package/dist/esm/additional-components/Controls/Icons/Lock.d.ts

@@ -1,3 +1,2 @@
-declare function LockIcon(): import("react/jsx-runtime").JSX.Element;
-export default LockIcon;
+export declare function LockIcon(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Lock.d.ts.map

package/dist/esm/additional-components/Controls/Icons/Lock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Lock.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/additional-components/Controls/Icons/Lock.tsx"],"names":[],"mappings":"AAAA,iBAAS,QAAQ,4CAMhB;AAED,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Lock.d.ts","sourceRoot":"","sources":["../../../../src/additional-components/Controls/Icons/Lock.tsx"],"names":[],"mappings":"AAAA,wBAAgB,QAAQ,4CAMvB"}

package/dist/esm/additional-components/Controls/Icons/Minus.d.ts

@@ -1,3 +1,2 @@
-declare function MinusIcon(): import("react/jsx-runtime").JSX.Element;
-export default MinusIcon;
+export declare function MinusIcon(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Minus.d.ts.map

package/dist/esm/additional-components/Controls/Icons/Minus.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Minus.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/additional-components/Controls/Icons/Minus.tsx"],"names":[],"mappings":"AAAA,iBAAS,SAAS,4CAMjB;AAED,eAAe,SAAS,CAAC"}
+{"version":3,"file":"Minus.d.ts","sourceRoot":"","sources":["../../../../src/additional-components/Controls/Icons/Minus.tsx"],"names":[],"mappings":"AAAA,wBAAgB,SAAS,4CAMxB"}

package/dist/esm/additional-components/Controls/Icons/Plus.d.ts

@@ -1,3 +1,2 @@
-declare function PlusIcon(): import("react/jsx-runtime").JSX.Element;
-export default PlusIcon;
+export declare function PlusIcon(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Plus.d.ts.map

package/dist/esm/additional-components/Controls/Icons/Plus.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Plus.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/additional-components/Controls/Icons/Plus.tsx"],"names":[],"mappings":"AAAA,iBAAS,QAAQ,4CAMhB;AAED,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"Plus.d.ts","sourceRoot":"","sources":["../../../../src/additional-components/Controls/Icons/Plus.tsx"],"names":[],"mappings":"AAAA,wBAAgB,QAAQ,4CAMvB"}

package/dist/esm/additional-components/Controls/Icons/Unlock.d.ts

@@ -1,3 +1,2 @@
-declare function UnlockIcon(): import("react/jsx-runtime").JSX.Element;
-export default UnlockIcon;
+export declare function UnlockIcon(): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=Unlock.d.ts.map

package/dist/esm/additional-components/Controls/Icons/Unlock.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Unlock.d.ts","sourceRoot":"","sources":["../../../../../../packages/react/src/additional-components/Controls/Icons/Unlock.tsx"],"names":[],"mappings":"AAAA,iBAAS,UAAU,4CAMlB;AAED,eAAe,UAAU,CAAC"}
+{"version":3,"file":"Unlock.d.ts","sourceRoot":"","sources":["../../../../src/additional-components/Controls/Icons/Unlock.tsx"],"names":[],"mappings":"AAAA,wBAAgB,UAAU,4CAMzB"}

package/dist/esm/additional-components/Controls/index.d.ts

@@ -1,4 +1,4 @@
-export { default as Controls } from './Controls';
-export { default as ControlButton } from './ControlButton';
-export * from './types';
+export { Controls } from './Controls';
+export { ControlButton } from './ControlButton';
+export type { ControlProps, ControlButtonProps } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/esm/additional-components/Controls/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Controls/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Controls/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,YAAY,EAAE,YAAY,EAAE,kBAAkB,EAAE,MAAM,SAAS,CAAC"}

package/dist/esm/additional-components/Controls/types.d.ts

@@ -1,16 +1,35 @@
-import type { ButtonHTMLAttributes, HTMLAttributes } from 'react';
+import type { ButtonHTMLAttributes, ReactNode } from 'react';
 import type { PanelPosition } from '@xyflow/system';
 import type { FitViewOptions } from '../../types';
-export type ControlProps = HTMLAttributes<HTMLDivElement> & {
+export type ControlProps = {
+    /** Show button for zoom in/out */
     showZoom?: boolean;
+    /** Show button for fit view */
     showFitView?: boolean;
+    /** Show button for toggling interactivity */
     showInteractive?: boolean;
+    /** Options being used when fit view button is clicked */
     fitViewOptions?: FitViewOptions;
+    /** Callback when zoom in button is clicked */
     onZoomIn?: () => void;
+    /** Callback when zoom out button is clicked */
     onZoomOut?: () => void;
+    /** Callback when fit view button is clicked */
     onFitView?: () => void;
+    /** Callback when interactivity is toggled */
     onInteractiveChange?: (interactiveStatus: boolean) => void;
+    /** Position of the controls on the pane
+     * @example PanelPosition.TopLeft, PanelPosition.TopRight,
+     * PanelPosition.BottomLeft, PanelPosition.BottomRight
+     */
     position?: PanelPosition;
+    children?: ReactNode;
+    /** Style applied to container */
+    style?: React.CSSProperties;
+    /** ClassName applied to container */
+    className?: string;
+    'aria-label'?: string;
+    orientation?: 'horizontal' | 'vertical';
 };
 export type ControlButtonProps = ButtonHTMLAttributes<HTMLButtonElement>;
 //# sourceMappingURL=types.d.ts.map

package/dist/esm/additional-components/Controls/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/Controls/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,cAAc,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAEpD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,MAAM,YAAY,GAAG,cAAc,CAAC,cAAc,CAAC,GAAG;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,mBAAmB,CAAC,EAAE,CAAC,iBAAiB,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3D,QAAQ,CAAC,EAAE,aAAa,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/additional-components/Controls/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAC7D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAEpD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAElD,MAAM,MAAM,YAAY,GAAG;IACzB,kCAAkC;IAClC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,+BAA+B;IAC/B,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,6CAA6C;IAC7C,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,yDAAyD;IACzD,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,MAAM,IAAI,CAAC;IACtB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,+CAA+C;IAC/C,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,6CAA6C;IAC7C,mBAAmB,CAAC,EAAE,CAAC,iBAAiB,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3D;;;OAGG;IACH,QAAQ,CAAC,EAAE,aAAa,CAAC;IACzB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,iCAAiC;IACjC,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,qCAAqC;IACrC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,WAAW,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;CACzC,CAAC;AAEF,MAAM,MAAM,kBAAkB,GAAG,oBAAoB,CAAC,iBAAiB,CAAC,CAAC"}

package/dist/esm/additional-components/MiniMap/MiniMap.d.ts

@@ -1,9 +1,9 @@
-/// <reference types="react" />
+import type { Node } from '../../types';
 import type { MiniMapProps } from './types';
-declare function MiniMap({ style, className, nodeStrokeColor, nodeColor, nodeClassName, nodeBorderRadius, nodeStrokeWidth, nodeComponent, maskColor, maskStrokeColor, maskStrokeWidth, position, onClick, onNodeClick, pannable, zoomable, ariaLabel, inversePan, zoomStep, offsetScale, }: MiniMapProps): import("react/jsx-runtime").JSX.Element;
-declare namespace MiniMap {
+declare function MiniMapComponent<NodeType extends Node = Node>({ style, className, nodeStrokeColor, nodeColor, nodeClassName, nodeBorderRadius, nodeStrokeWidth, nodeComponent, bgColor, maskColor, maskStrokeColor, maskStrokeWidth, position, onClick, onNodeClick, pannable, zoomable, ariaLabel, inversePan, zoomStep, offsetScale, }: MiniMapProps<NodeType>): import("react/jsx-runtime").JSX.Element;
+declare namespace MiniMapComponent {
     var displayName: string;
 }
-declare const _default: import("react").MemoExoticComponent<typeof MiniMap>;
-export default _default;
+export declare const MiniMap: typeof MiniMapComponent;
+export {};
 //# sourceMappingURL=MiniMap.d.ts.map

package/dist/esm/additional-components/MiniMap/MiniMap.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MiniMap.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/MiniMap/MiniMap.tsx"],"names":[],"mappings":";AAWA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AA4B5C,iBAAS,OAAO,CAAC,EACf,KAAK,EACL,SAAS,EACT,eAAe,EACf,SAAS,EACT,aAAkB,EAClB,gBAAoB,EACpB,eAAe,EAGf,aAAa,EACb,SAAS,EACT,eAAwB,EACxB,eAAmB,EACnB,QAAyB,EACzB,OAAO,EACP,WAAW,EACX,QAAgB,EAChB,QAAgB,EAChB,SAAiC,EACjC,UAAU,EACV,QAAa,EACb,WAAe,GAChB,EAAE,YAAY,2CA6Gd;kBApIQ,OAAO;;;;AAwIhB,wBAA6B"}
+{"version":3,"file":"MiniMap.d.ts","sourceRoot":"","sources":["../../../src/additional-components/MiniMap/MiniMap.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAkB,IAAI,EAAE,MAAM,aAAa,CAAC;AAGxD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AA8B5C,iBAAS,gBAAgB,CAAC,QAAQ,SAAS,IAAI,GAAG,IAAI,EAAE,EACtD,KAAK,EACL,SAAS,EACT,eAAe,EACf,SAAS,EACT,aAAkB,EAClB,gBAAoB,EACpB,eAAe,EAGf,aAAa,EACb,OAAO,EACP,SAAS,EACT,eAAe,EACf,eAAe,EACf,QAAyB,EACzB,OAAO,EACP,WAAW,EACX,QAAgB,EAChB,QAAgB,EAChB,SAAiC,EACjC,UAAU,EACV,QAAa,EACb,WAAe,GAChB,EAAE,YAAY,CAAC,QAAQ,CAAC,2CAgHxB;kBAxIQ,gBAAgB;;;AA4IzB,eAAO,MAAM,OAAO,yBAAoD,CAAC"}

package/dist/esm/additional-components/MiniMap/MiniMapNode.d.ts

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import type { MiniMapNodeProps } from './types';
-declare function MiniMapNode({ id, x, y, width, height, style, color, strokeColor, strokeWidth, className, borderRadius, shapeRendering, selected, onClick, }: MiniMapNodeProps): import("react/jsx-runtime").JSX.Element;
-declare const _default: import("react").MemoExoticComponent<typeof MiniMapNode>;
-export default _default;
+declare function MiniMapNodeComponent({ id, x, y, width, height, style, color, strokeColor, strokeWidth, className, borderRadius, shapeRendering, selected, onClick, }: MiniMapNodeProps): import("react/jsx-runtime").JSX.Element;
+export declare const MiniMapNode: import("react").MemoExoticComponent<typeof MiniMapNodeComponent>;
+export {};
 //# sourceMappingURL=MiniMapNode.d.ts.map

package/dist/esm/additional-components/MiniMap/MiniMapNode.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MiniMapNode.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/MiniMap/MiniMapNode.tsx"],"names":[],"mappings":";AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEhD,iBAAS,WAAW,CAAC,EACnB,EAAE,EACF,CAAC,EACD,CAAC,EACD,KAAK,EACL,MAAM,EACN,KAAK,EACL,KAAK,EACL,WAAW,EACX,WAAW,EACX,SAAS,EACT,YAAY,EACZ,cAAc,EACd,QAAQ,EACR,OAAO,GACR,EAAE,gBAAgB,2CAsBlB;;AAED,wBAAiC"}
+{"version":3,"file":"MiniMapNode.d.ts","sourceRoot":"","sources":["../../../src/additional-components/MiniMap/MiniMapNode.tsx"],"names":[],"mappings":";AAGA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEhD,iBAAS,oBAAoB,CAAC,EAC5B,EAAE,EACF,CAAC,EACD,CAAC,EACD,KAAK,EACL,MAAM,EACN,KAAK,EACL,KAAK,EACL,WAAW,EACX,WAAW,EACX,SAAS,EACT,YAAY,EACZ,cAAc,EACd,QAAQ,EACR,OAAO,GACR,EAAE,gBAAgB,2CAsBlB;AAED,eAAO,MAAM,WAAW,kEAA6B,CAAC"}

package/dist/esm/additional-components/MiniMap/MiniMapNodes.d.ts

@@ -1,6 +1,6 @@
-/// <reference types="react" />
+import type { Node } from '../../types';
 import type { MiniMapNodes as MiniMapNodesProps } from './types';
-declare function MiniMapNodes({ nodeStrokeColor, nodeColor, nodeClassName, nodeBorderRadius, nodeStrokeWidth, nodeComponent: NodeComponent, onClick, }: MiniMapNodesProps): import("react/jsx-runtime").JSX.Element;
-declare const _default: import("react").MemoExoticComponent<typeof MiniMapNodes>;
+declare function MiniMapNodes<NodeType extends Node>({ nodeStrokeColor, nodeColor, nodeClassName, nodeBorderRadius, nodeStrokeWidth, nodeComponent: NodeComponent, onClick, }: MiniMapNodesProps<NodeType>): import("react/jsx-runtime").JSX.Element;
+declare const _default: typeof MiniMapNodes;
 export default _default;
 //# sourceMappingURL=MiniMapNodes.d.ts.map

package/dist/esm/additional-components/MiniMap/MiniMapNodes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MiniMapNodes.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/MiniMap/MiniMapNodes.tsx"],"names":[],"mappings":";AASA,OAAO,KAAK,EAAE,YAAY,IAAI,iBAAiB,EAA6C,MAAM,SAAS,CAAC;AAQ5G,iBAAS,YAAY,CAAC,EACpB,eAAe,EACf,SAAS,EACT,aAAkB,EAClB,gBAAoB,EACpB,eAAe,EAGf,aAAa,EAAE,aAA2B,EAC1C,OAAO,GACR,EAAE,iBAAiB,2CAiCnB;;AA2DD,wBAAkC"}
+{"version":3,"file":"MiniMapNodes.d.ts","sourceRoot":"","sources":["../../../src/additional-components/MiniMap/MiniMapNodes.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAkB,IAAI,EAAgB,MAAM,aAAa,CAAC;AACtE,OAAO,KAAK,EAAE,YAAY,IAAI,iBAAiB,EAA6C,MAAM,SAAS,CAAC;AAS5G,iBAAS,YAAY,CAAC,QAAQ,SAAS,IAAI,EAAE,EAC3C,eAAe,EACf,SAAS,EACT,aAAkB,EAClB,gBAAoB,EACpB,eAAe,EAGf,aAAa,EAAE,aAA2B,EAC1C,OAAO,GACR,EAAE,iBAAiB,CAAC,QAAQ,CAAC,2CAiC7B;;AAgED,wBAAyD"}

package/dist/esm/additional-components/MiniMap/index.d.ts

@@ -1,3 +1,3 @@
-export { default as MiniMap } from './MiniMap';
+export { MiniMap } from './MiniMap';
 export * from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/esm/additional-components/MiniMap/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../packages/react/src/additional-components/MiniMap/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,OAAO,EAAE,MAAM,WAAW,CAAC;AAC/C,cAAc,SAAS,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/additional-components/MiniMap/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,WAAW,CAAC;AACpC,cAAc,SAAS,CAAC"}

package/dist/esm/additional-components/MiniMap/types.d.ts

@@ -3,23 +3,46 @@ import type { PanelPosition, XYPosition } from '@xyflow/system';
 import type { Node } from '../../types';
 export type GetMiniMapNodeAttribute<NodeType extends Node = Node> = (node: NodeType) => string;
 export type MiniMapProps<NodeType extends Node = Node> = Omit<HTMLAttributes<SVGSVGElement>, 'onClick'> & {
+    /** Color of nodes on minimap */
     nodeColor?: string | GetMiniMapNodeAttribute<NodeType>;
+    /** Stroke color of nodes on minimap */
     nodeStrokeColor?: string | GetMiniMapNodeAttribute<NodeType>;
+    /** ClassName applied to nodes on minimap */
     nodeClassName?: string | GetMiniMapNodeAttribute<NodeType>;
+    /** Border radius of nodes on minimap */
     nodeBorderRadius?: number;
+    /** Stroke width of nodes on minimap */
     nodeStrokeWidth?: number;
+    /** Component used to render nodes on minimap */
     nodeComponent?: ComponentType<MiniMapNodeProps>;
+    /** Background color of minimap */
+    bgColor?: string;
+    /** Color of mask representing viewport */
     maskColor?: string;
+    /** Stroke color of mask representing viewport */
     maskStrokeColor?: string;
+    /** Stroke width of mask representing viewport */
     maskStrokeWidth?: number;
+    /** Position of minimap on pane
+     * @example PanelPosition.TopLeft, PanelPosition.TopRight,
+     * PanelPosition.BottomLeft, PanelPosition.BottomRight
+     */
     position?: PanelPosition;
+    /** Callback caled when minimap is clicked*/
     onClick?: (event: MouseEvent, position: XYPosition) => void;
+    /** Callback called when node on minimap is clicked */
     onNodeClick?: (event: MouseEvent, node: NodeType) => void;
+    /** If true, viewport is pannable via mini map component */
     pannable?: boolean;
+    /** If true, viewport is zoomable via mini map component */
     zoomable?: boolean;
+    /** The aria-label attribute */
     ariaLabel?: string | null;
+    /** Invert direction when panning the minimap viewport */
     inversePan?: boolean;
+    /** Step size for zooming in/out on minimap */
     zoomStep?: number;
+    /** Offset the viewport on the minmap, acts like a padding */
     offsetScale?: number;
 };
 export type MiniMapNodes<NodeType extends Node = Node> = Pick<MiniMapProps<NodeType>, 'nodeColor' | 'nodeStrokeColor' | 'nodeClassName' | 'nodeBorderRadius' | 'nodeStrokeWidth' | 'nodeComponent'> & {