@railtownai/railtracks-visualizer 0.0.39 → 0.0.41

package/dist/esm/index.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import React__default, { memo, useMemo, useState, useCallback, forwardRef, createContext, useContext, useRef, useLayoutEffect, useEffect, createElement } from 'react';
-import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { jsx as jsx$1, jsxs, Fragment } from 'react/jsx-runtime';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default from 'react-dom';
 import CountUp from 'react-countup';
@@ -3183,7 +3183,8 @@ const initialConnection = {
     to: null,
     toHandle: null,
     toPosition: null,
-    toNode: null
+    toNode: null,
+    pointer: null
 };
 /**
  * If you set the `connectionLineType` prop on your [`<ReactFlow />`](/api-reference/react-flow#connection-connectionLineType)
@@ -5550,7 +5551,8 @@ function onPointerDown(event, { connectionMode, connectionRadius, handleId, node
         to: position,
         toHandle: null,
         toPosition: oppositePosition[fromHandle.position],
-        toNode: null
+        toNode: null,
+        pointer: position
     };
     function startConnection() {
         connectionStarted = true;
@@ -5614,14 +5616,9 @@ function onPointerDown(event, { connectionMode, connectionRadius, handleId, node
             }, transform) : position,
             toHandle: result.toHandle,
             toPosition: isValid && result.toHandle ? result.toHandle.position : oppositePosition[fromHandle.position],
-            toNode: result.toHandle ? nodeLookup.get(result.toHandle.nodeId) : null
+            toNode: result.toHandle ? nodeLookup.get(result.toHandle.nodeId) : null,
+            pointer: position
         };
-        /*
-         * we don't want to trigger an update when the connection
-         * is snapped to the same handle as before
-         */ if (isValid && closestHandle && previousConnection.toHandle && newConnection.toHandle && previousConnection.toHandle.type === newConnection.toHandle.type && previousConnection.toHandle.nodeId === newConnection.toHandle.nodeId && previousConnection.toHandle.id === newConnection.toHandle.id && previousConnection.to.x === newConnection.to.x && previousConnection.to.y === newConnection.to.y) {
-            return;
-        }
         updateConnection(newConnection);
         previousConnection = newConnection;
     }
@@ -7112,7 +7109,7 @@ const ariaLiveSelector = (s)=>s.ariaLiveMessage;
 const ariaLabelConfigSelector = (s)=>s.ariaLabelConfig;
 function AriaLiveMessage({ rfId }) {
     const ariaLiveMessage = useStore(ariaLiveSelector);
-    return jsx("div", {
+    return jsx$1("div", {
         id: `${ARIA_LIVE_MESSAGE}-${rfId}`,
         "aria-live": "assertive",
         "aria-atomic": "true",
@@ -7124,17 +7121,17 @@ function A11yDescriptions({ rfId, disableKeyboardA11y }) {
     const ariaLabelConfig = useStore(ariaLabelConfigSelector);
     return jsxs(Fragment, {
         children: [
-            jsx("div", {
+            jsx$1("div", {
                 id: `${ARIA_NODE_DESC_KEY}-${rfId}`,
                 style: style,
                 children: disableKeyboardA11y ? ariaLabelConfig['node.a11yDescription.default'] : ariaLabelConfig['node.a11yDescription.keyboardDisabled']
             }),
-            jsx("div", {
+            jsx$1("div", {
                 id: `${ARIA_EDGE_DESC_KEY}-${rfId}`,
                 style: style,
                 children: ariaLabelConfig['edge.a11yDescription.default']
             }),
-            !disableKeyboardA11y && jsx(AriaLiveMessage, {
+            !disableKeyboardA11y && jsx$1(AriaLiveMessage, {
                 rfId: rfId
             })
         ]
@@ -7166,7 +7163,7 @@ function A11yDescriptions({ rfId, disableKeyboardA11y }) {
  *```
  */ const Panel = forwardRef(({ position = 'top-left', children, className, style, ...rest }, ref)=>{
     const positionClasses = `${position}`.split('-');
-    return jsx("div", {
+    return jsx$1("div", {
         className: cc([
             'react-flow__panel',
             className,
@@ -7183,11 +7180,11 @@ function Attribution({ proOptions, position = 'bottom-right' }) {
     if (proOptions?.hideAttribution) {
         return null;
     }
-    return jsx(Panel, {
+    return jsx$1(Panel, {
         position: position,
         className: "react-flow__attribution",
         "data-message": "Please only hide this attribution when you are subscribed to React Flow Pro: https://pro.reactflow.dev",
-        children: jsx("a", {
+        children: jsx$1("a", {
             href: "https://reactflow.dev",
             target: "_blank",
             rel: "noopener noreferrer",
@@ -7239,7 +7236,7 @@ const changeSelector = (s)=>!!s.onSelectionChangeHandlers;
 function SelectionListener({ onSelectionChange }) {
     const storeHasSelectionChangeHandlers = useStore(changeSelector);
     if (onSelectionChange || storeHasSelectionChangeHandlers) {
-        return jsx(SelectionListenerInner, {
+        return jsx$1(SelectionListenerInner, {
             onSelectionChange: onSelectionChange
         });
     }
@@ -8071,7 +8068,7 @@ const BatchContext = createContext(null);
             nodeQueue,
             edgeQueue
         }), []);
-    return jsx(BatchContext.Provider, {
+    return jsx$1(BatchContext.Provider, {
         value: value,
         children: children
     });
@@ -8537,7 +8534,7 @@ function ZoomPane({ onPaneContextMenu, zoomOnScroll = true, zoomOnPinch = true,
         selectionOnDrag,
         paneClickDistance
     ]);
-    return jsx("div", {
+    return jsx$1("div", {
         className: "react-flow__renderer",
         ref: zoomPane,
         style: containerStyle,
@@ -8554,7 +8551,7 @@ function UserSelection() {
     if (!isActive) {
         return null;
     }
-    return jsx("div", {
+    return jsx$1("div", {
         className: "react-flow__selection react-flow__container",
         style: {
             width: userSelectionRect.width,
@@ -8745,7 +8742,7 @@ function Pane({ isSelecting, selectionKeyPressed, selectionMode = SelectionMode.
         style: containerStyle,
         children: [
             children,
-            jsx(UserSelection, {})
+            jsx$1(UserSelection, {})
         ]
     });
 }
@@ -9039,7 +9036,7 @@ function HandleComponent({ type = 'source', position = Position.Top, isValidConn
             connectionClickStartHandle: null
         });
     };
-    return jsx("div", {
+    return jsx$1("div", {
         "data-handleid": handleId,
         "data-nodeid": nodeId,
         "data-handlepos": position,
@@ -9103,7 +9100,7 @@ function InputNode({ data, isConnectable, sourcePosition = Position.Bottom }) {
     return jsxs(Fragment, {
         children: [
             data?.label,
-            jsx(Handle$1, {
+            jsx$1(Handle$1, {
                 type: "source",
                 position: sourcePosition,
                 isConnectable: isConnectable
@@ -9114,13 +9111,13 @@ function InputNode({ data, isConnectable, sourcePosition = Position.Bottom }) {
 function DefaultNode({ data, isConnectable, targetPosition = Position.Top, sourcePosition = Position.Bottom }) {
     return jsxs(Fragment, {
         children: [
-            jsx(Handle$1, {
+            jsx$1(Handle$1, {
                 type: "target",
                 position: targetPosition,
                 isConnectable: isConnectable
             }),
             data?.label,
-            jsx(Handle$1, {
+            jsx$1(Handle$1, {
                 type: "source",
                 position: sourcePosition,
                 isConnectable: isConnectable
@@ -9134,7 +9131,7 @@ function GroupNode() {
 function OutputNode({ data, isConnectable, targetPosition = Position.Top }) {
     return jsxs(Fragment, {
         children: [
-            jsx(Handle$1, {
+            jsx$1(Handle$1, {
                 type: "target",
                 position: targetPosition,
                 isConnectable: isConnectable
@@ -9223,7 +9220,7 @@ function NodesSelection({ onSelectionContextMenu, noPanClassName, disableKeyboar
             });
         }
     };
-    return jsx("div", {
+    return jsx$1("div", {
         className: cc([
             'react-flow__nodesselection',
             'react-flow__container',
@@ -9232,7 +9229,7 @@ function NodesSelection({ onSelectionContextMenu, noPanClassName, disableKeyboar
         style: {
             transform: transformString
         },
-        children: jsx("div", {
+        children: jsx$1("div", {
             ref: nodeRef,
             className: "react-flow__nodesselection-rect",
             onContextMenu: onContextMenu,
@@ -9268,7 +9265,7 @@ function FlowRendererComponent({ children, onPaneClick, onPaneMouseEnter, onPane
         deleteKeyCode,
         multiSelectionKeyCode
     });
-    return jsx(ZoomPane, {
+    return jsx$1(ZoomPane, {
         onPaneContextMenu: onPaneContextMenu,
         elementsSelectable: elementsSelectable,
         zoomOnScroll: zoomOnScroll,
@@ -9307,7 +9304,7 @@ function FlowRendererComponent({ children, onPaneClick, onPaneMouseEnter, onPane
             selectionOnDrag: _selectionOnDrag,
             children: [
                 children,
-                nodesSelectionActive && jsx(NodesSelection, {
+                nodesSelectionActive && jsx$1(NodesSelection, {
                     onSelectionContextMenu: onSelectionContextMenu,
                     noPanClassName: noPanClassName,
                     disableKeyboardA11y: disableKeyboardA11y
@@ -9564,7 +9561,7 @@ function NodeWrapper({ id, onClick, onMouseEnter, onMouseMove, onMouseLeave, onC
             });
         }
     };
-    return jsx("div", {
+    return jsx$1("div", {
         className: cc([
             'react-flow__node',
             `react-flow__node-${nodeType}`,
@@ -9606,9 +9603,9 @@ function NodeWrapper({ id, onClick, onMouseEnter, onMouseMove, onMouseLeave, onC
         "aria-describedby": disableKeyboardA11y ? undefined : `${ARIA_NODE_DESC_KEY}-${rfId}`,
         "aria-label": node.ariaLabel,
         ...node.domAttributes,
-        children: jsx(Provider, {
+        children: jsx$1(Provider, {
             value: id,
-            children: jsx(NodeComponent, {
+            children: jsx$1(NodeComponent, {
                 id: id,
                 data: node.data,
                 type: nodeType,
@@ -9642,7 +9639,7 @@ function NodeRendererComponent(props) {
     const { nodesDraggable, nodesConnectable, nodesFocusable, elementsSelectable, onError } = useStore(selector$b, shallow$1);
     const nodeIds = useVisibleNodeIds(props.onlyRenderVisibleElements);
     const resizeObserver = useResizeObserver();
-    return jsx("div", {
+    return jsx$1("div", {
         className: "react-flow__nodes",
         style: containerStyle,
         children: nodeIds.map((nodeId)=>{
@@ -9670,7 +9667,7 @@ function NodeRendererComponent(props) {
              *   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.
-             */ jsx(NodeWrapper$1, {
+             */ jsx$1(NodeWrapper$1, {
                 id: nodeId,
                 nodeTypes: props.nodeTypes,
                 nodeExtent: props.nodeExtent,
@@ -9737,7 +9734,7 @@ const ArrowSymbol = ({ color = 'none', strokeWidth = 1 })=>{
             stroke: color
         }
     };
-    return jsx("polyline", {
+    return jsx$1("polyline", {
         className: "arrow",
         style: style,
         strokeLinecap: "round",
@@ -9754,7 +9751,7 @@ const ArrowClosedSymbol = ({ color = 'none', strokeWidth = 1 })=>{
             fill: color
         }
     };
-    return jsx("polyline", {
+    return jsx$1("polyline", {
         className: "arrowclosed",
         style: style,
         strokeLinecap: "round",
@@ -9785,7 +9782,7 @@ const Marker = ({ id, type, color, width = 12.5, height = 12.5, markerUnits = 's
     if (!Symbol) {
         return null;
     }
-    return jsx("marker", {
+    return jsx$1("marker", {
         className: "react-flow__arrowhead",
         id: id,
         markerWidth: `${width}`,
@@ -9795,7 +9792,7 @@ const Marker = ({ id, type, color, width = 12.5, height = 12.5, markerUnits = 's
         orient: orient,
         refX: "0",
         refY: "0",
-        children: jsx(Symbol, {
+        children: jsx$1(Symbol, {
             color: color,
             strokeWidth: strokeWidth
         })
@@ -9825,11 +9822,11 @@ const Marker = ({ id, type, color, width = 12.5, height = 12.5, markerUnits = 's
     if (!markers.length) {
         return null;
     }
-    return jsx("svg", {
+    return jsx$1("svg", {
         className: "react-flow__marker",
         "aria-hidden": "true",
-        children: jsx("defs", {
-            children: markers.map((marker)=>jsx(Marker, {
+        children: jsx$1("defs", {
+            children: markers.map((marker)=>jsx$1(Marker, {
                     id: marker.id,
                     type: marker.type,
                     color: marker.color,
@@ -9881,7 +9878,7 @@ function EdgeTextComponent({ x, y, label, labelStyle, labelShowBg = true, labelB
         visibility: edgeTextBbox.width ? 'visible' : 'hidden',
         ...rest,
         children: [
-            labelShowBg && jsx("rect", {
+            labelShowBg && jsx$1("rect", {
                 width: edgeTextBbox.width + 2 * labelBgPadding[0],
                 x: -labelBgPadding[0],
                 y: -labelBgPadding[1],
@@ -9891,7 +9888,7 @@ function EdgeTextComponent({ x, y, label, labelStyle, labelShowBg = true, labelB
                 rx: labelBgBorderRadius,
                 ry: labelBgBorderRadius
             }),
-            jsx("text", {
+            jsx$1("text", {
                 className: "react-flow__edge-text",
                 y: edgeTextBbox.height / 2,
                 dy: "0.3em",
@@ -9959,7 +9956,7 @@ EdgeTextComponent.displayName = 'EdgeText';
  */ function BaseEdge({ path, labelX, labelY, label, labelStyle, labelShowBg, labelBgStyle, labelBgPadding, labelBgBorderRadius, interactionWidth = 20, ...props }) {
     return jsxs(Fragment, {
         children: [
-            jsx("path", {
+            jsx$1("path", {
                 ...props,
                 d: path,
                 fill: "none",
@@ -9968,14 +9965,14 @@ EdgeTextComponent.displayName = 'EdgeText';
                     props.className
                 ])
             }),
-            interactionWidth ? jsx("path", {
+            interactionWidth ? jsx$1("path", {
                 d: path,
                 fill: "none",
                 strokeOpacity: 0,
                 strokeWidth: interactionWidth,
                 className: "react-flow__edge-interaction"
             }) : null,
-            label && isNumeric(labelX) && isNumeric(labelY) ? jsx(EdgeText, {
+            label && isNumeric(labelX) && isNumeric(labelY) ? jsx$1(EdgeText, {
                 x: labelX,
                 y: labelY,
                 label: label,
@@ -10057,7 +10054,7 @@ function createSimpleBezierEdge(params) {
             targetPosition
         });
         const _id = params.isInternal ? undefined : id;
-        return jsx(BaseEdge, {
+        return jsx$1(BaseEdge, {
             id: _id,
             path: path,
             labelX: labelX,
@@ -10098,7 +10095,7 @@ function createSmoothStepEdge(params) {
             stepPosition: pathOptions?.stepPosition
         });
         const _id = params.isInternal ? undefined : id;
-        return jsx(BaseEdge, {
+        return jsx$1(BaseEdge, {
             id: _id,
             path: path,
             labelX: labelX,
@@ -10152,7 +10149,7 @@ function createStepEdge(params) {
     // eslint-disable-next-line react/display-name
     return memo(({ id, ...props })=>{
         const _id = params.isInternal ? undefined : id;
-        return jsx(SmoothStepEdge, {
+        return jsx$1(SmoothStepEdge, {
             ...props,
             id: _id,
             pathOptions: useMemo(()=>({
@@ -10206,7 +10203,7 @@ function createStraightEdge(params) {
             targetY
         });
         const _id = params.isInternal ? undefined : id;
-        return jsx(BaseEdge, {
+        return jsx$1(BaseEdge, {
             id: _id,
             path: path,
             labelX: labelX,
@@ -10267,7 +10264,7 @@ function createBezierEdge(params) {
             curvature: pathOptions?.curvature
         });
         const _id = params.isInternal ? undefined : id;
-        return jsx(BaseEdge, {
+        return jsx$1(BaseEdge, {
             id: _id,
             path: path,
             labelX: labelX,
@@ -10346,7 +10343,7 @@ const EdgeUpdaterClassName = 'react-flow__edgeupdater';
 /**
  * @internal
  */ function EdgeAnchor({ position, centerX, centerY, radius = 10, onMouseDown, onMouseEnter, onMouseOut, type }) {
-    return jsx("circle", {
+    return jsx$1("circle", {
         onMouseDown: onMouseDown,
         onMouseEnter: onMouseEnter,
         onMouseOut: onMouseOut,
@@ -10420,7 +10417,7 @@ function EdgeUpdateAnchors({ isReconnectable, reconnectRadius, edge, sourceX, so
     const onReconnectMouseOut = ()=>setUpdateHover(false);
     return jsxs(Fragment, {
         children: [
-            (isReconnectable === true || isReconnectable === 'source') && jsx(EdgeAnchor, {
+            (isReconnectable === true || isReconnectable === 'source') && jsx$1(EdgeAnchor, {
                 position: sourcePosition,
                 centerX: sourceX,
                 centerY: sourceY,
@@ -10430,7 +10427,7 @@ function EdgeUpdateAnchors({ isReconnectable, reconnectRadius, edge, sourceX, so
                 onMouseOut: onReconnectMouseOut,
                 type: "source"
             }),
-            (isReconnectable === true || isReconnectable === 'target') && jsx(EdgeAnchor, {
+            (isReconnectable === true || isReconnectable === 'target') && jsx$1(EdgeAnchor, {
                 position: targetPosition,
                 centerX: targetX,
                 centerY: targetY,
@@ -10579,7 +10576,7 @@ function EdgeWrapper({ id, edgesFocusable, edgesReconnectable, elementsSelectabl
             }
         }
     };
-    return jsx("svg", {
+    return jsx$1("svg", {
         style: {
             zIndex
         },
@@ -10614,7 +10611,7 @@ function EdgeWrapper({ id, edgesFocusable, edgesReconnectable, elementsSelectabl
             ref: edgeRef,
             ...edge.domAttributes,
             children: [
-                !reconnecting && jsx(EdgeComponent, {
+                !reconnecting && jsx$1(EdgeComponent, {
                     id: id,
                     source: edge.source,
                     target: edge.target,
@@ -10644,7 +10641,7 @@ function EdgeWrapper({ id, edgesFocusable, edgesReconnectable, elementsSelectabl
                     pathOptions: 'pathOptions' in edge ? edge.pathOptions : undefined,
                     interactionWidth: edge.interactionWidth
                 }),
-                isReconnectable && jsx(EdgeUpdateAnchors, {
+                isReconnectable && jsx$1(EdgeUpdateAnchors, {
                     edge: edge,
                     isReconnectable: isReconnectable,
                     reconnectRadius: reconnectRadius,
@@ -10678,12 +10675,12 @@ function EdgeRendererComponent({ defaultMarkerColor, onlyRenderVisibleElements,
     return jsxs("div", {
         className: "react-flow__edges",
         children: [
-            jsx(MarkerDefinitions$1, {
+            jsx$1(MarkerDefinitions$1, {
                 defaultColor: defaultMarkerColor,
                 rfId: rfId
             }),
             edgeIds.map((id)=>{
-                return jsx(EdgeWrapper$1, {
+                return jsx$1(EdgeWrapper$1, {
                     id: id,
                     edgesFocusable: edgesFocusable,
                     edgesReconnectable: edgesReconnectable,
@@ -10713,7 +10710,7 @@ const EdgeRenderer = memo(EdgeRendererComponent);
 const selector$9 = (s)=>`translate(${s.transform[0]}px,${s.transform[1]}px) scale(${s.transform[2]})`;
 function Viewport$1({ children }) {
     const transform = useStore(selector$9);
-    return jsx("div", {
+    return jsx$1("div", {
         className: "react-flow__viewport xyflow__viewport react-flow__container",
         style: {
             transform
@@ -10820,17 +10817,17 @@ function ConnectionLineWrapper({ containerStyle, style, type, component }) {
     if (!renderConnection) {
         return null;
     }
-    return jsx("svg", {
+    return jsx$1("svg", {
         style: containerStyle,
         width: width,
         height: height,
         className: "react-flow__connectionline react-flow__container",
-        children: jsx("g", {
+        children: jsx$1("g", {
             className: cc([
                 'react-flow__connection',
                 getConnectionStatus(isValid)
             ]),
-            children: jsx(ConnectionLine, {
+            children: jsx$1(ConnectionLine, {
                 style: style,
                 type: type,
                 CustomComponent: component,
@@ -10840,12 +10837,12 @@ function ConnectionLineWrapper({ containerStyle, style, type, component }) {
     });
 }
 const ConnectionLine = ({ style, type = ConnectionLineType.Bezier, CustomComponent, isValid })=>{
-    const { inProgress, from, fromNode, fromHandle, fromPosition, to, toNode, toHandle, toPosition } = useConnection();
+    const { inProgress, from, fromNode, fromHandle, fromPosition, to, toNode, toHandle, toPosition, pointer } = useConnection();
     if (!inProgress) {
         return;
     }
     if (CustomComponent) {
-        return jsx(CustomComponent, {
+        return jsx$1(CustomComponent, {
             connectionLineType: type,
             connectionLineStyle: style,
             fromNode: fromNode,
@@ -10858,7 +10855,8 @@ const ConnectionLine = ({ style, type = ConnectionLineType.Bezier, CustomCompone
             toPosition: toPosition,
             connectionStatus: getConnectionStatus(isValid),
             toNode: toNode,
-            toHandle: toHandle
+            toHandle: toHandle,
+            pointer: pointer
         });
     }
     let path = '';
@@ -10889,7 +10887,7 @@ const ConnectionLine = ({ style, type = ConnectionLineType.Bezier, CustomCompone
         default:
             [path] = getStraightPath(pathParams);
     }
-    return jsx("path", {
+    return jsx$1("path", {
         d: path,
         fill: "none",
         className: "react-flow__connection-path",
@@ -10941,7 +10939,7 @@ function GraphViewComponent({ nodeTypes, edgeTypes, onInit, onNodeClick, onEdgeC
     useStylesLoadedWarning();
     useOnInitHandler(onInit);
     useViewportSync(viewport);
-    return jsx(FlowRenderer, {
+    return jsx$1(FlowRenderer, {
         onPaneClick: onPaneClick,
         onPaneMouseEnter: onPaneMouseEnter,
         onPaneMouseMove: onPaneMouseMove,
@@ -10980,7 +10978,7 @@ function GraphViewComponent({ nodeTypes, edgeTypes, onInit, onNodeClick, onEdgeC
         isControlledViewport: !!viewport,
         children: jsxs(Viewport$1, {
             children: [
-                jsx(EdgeRenderer, {
+                jsx$1(EdgeRenderer, {
                     edgeTypes: edgeTypes,
                     onEdgeClick: onEdgeClick,
                     onEdgeDoubleClick: onEdgeDoubleClick,
@@ -10998,16 +10996,16 @@ function GraphViewComponent({ nodeTypes, edgeTypes, onInit, onNodeClick, onEdgeC
                     disableKeyboardA11y: disableKeyboardA11y,
                     rfId: rfId
                 }),
-                jsx(ConnectionLineWrapper, {
+                jsx$1(ConnectionLineWrapper, {
                     style: connectionLineStyle,
                     type: connectionLineType,
                     component: connectionLineComponent,
                     containerStyle: connectionLineContainerStyle
                 }),
-                jsx("div", {
+                jsx$1("div", {
                     className: "react-flow__edgelabel-renderer"
                 }),
-                jsx(NodeRenderer, {
+                jsx$1(NodeRenderer, {
                     nodeTypes: nodeTypes,
                     onNodeClick: onNodeClick,
                     onNodeDoubleClick: onNodeDoubleClick,
@@ -11023,7 +11021,7 @@ function GraphViewComponent({ nodeTypes, edgeTypes, onInit, onNodeClick, onEdgeC
                     nodeExtent: nodeExtent,
                     rfId: rfId
                 }),
-                jsx("div", {
+                jsx$1("div", {
                     className: "react-flow__viewport-portal"
                 })
             ]
@@ -11510,9 +11508,9 @@ const createStore = ({ nodes, edges, defaultNodes, defaultEdges, width, height,
             nodeOrigin,
             nodeExtent
         }));
-    return jsx(Provider$1, {
+    return jsx$1(Provider$1, {
         value: store,
-        children: jsx(BatchProvider, {
+        children: jsx$1(BatchProvider, {
             children: children
         })
     });
@@ -11523,11 +11521,11 @@ function Wrapper({ children, nodes, edges, defaultNodes, defaultEdges, width, he
         /*
          * 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/18051
-         */ return jsx(Fragment, {
+         */ return jsx$1(Fragment, {
             children: children
         });
     }
-    return jsx(ReactFlowProvider, {
+    return jsx$1(ReactFlowProvider, {
         initialNodes: nodes,
         initialEdges: edges,
         defaultNodes: defaultNodes,
@@ -11550,7 +11548,7 @@ const wrapperStyle = {
     position: 'relative',
     zIndex: 0
 };
-function ReactFlow({ nodes, edges, defaultNodes, defaultEdges, 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, connectionLineType = ConnectionLineType.Bezier, connectionLineStyle, connectionLineComponent, connectionLineContainerStyle, deleteKeyCode = 'Backspace', selectionKeyCode = 'Shift', selectionOnDrag = false, selectionMode = SelectionMode.Full, panActivationKeyCode = 'Space', multiSelectionKeyCode = isMacOs() ? 'Meta' : 'Control', zoomActivationKeyCode = isMacOs() ? 'Meta' : 'Control', snapToGrid, snapGrid, onlyRenderVisibleElements = false, selectNodesOnDrag, nodesDraggable, autoPanOnNodeFocus, nodesConnectable, nodesFocusable, nodeOrigin = defaultNodeOrigin, edgesFocusable, edgesReconnectable, elementsSelectable = true, defaultViewport: defaultViewport$1 = defaultViewport, minZoom = 0.5, maxZoom = 2, translateExtent = infiniteExtent, preventScrolling = true, nodeExtent, defaultMarkerColor = '#b1b1b7', zoomOnScroll = true, zoomOnPinch = true, panOnScroll = false, panOnScrollSpeed = 0.5, panOnScrollMode = PanOnScrollMode.Free, zoomOnDoubleClick = true, panOnDrag = true, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneScroll, onPaneContextMenu, paneClickDistance = 0, nodeClickDistance = 0, children, onReconnect, onReconnectStart, onReconnectEnd, onEdgeContextMenu, onEdgeDoubleClick, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius = 10, onNodesChange, onEdgesChange, noDragClassName = 'nodrag', noWheelClassName = 'nowheel', noPanClassName = 'nopan', fitView, fitViewOptions, connectOnClick, attributionPosition, proOptions, defaultEdgeOptions, elevateNodesOnSelect, elevateEdgesOnSelect, disableKeyboardA11y = false, autoPanOnConnect, autoPanOnNodeDrag, autoPanSpeed, connectionRadius, isValidConnection, onError, style, id, nodeDragThreshold, connectionDragThreshold, viewport, onViewportChange, width, height, colorMode = 'light', debug, onScroll, ariaLabelConfig, ...rest }, ref) {
+function ReactFlow({ nodes, edges, defaultNodes, defaultEdges, 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, connectionLineType = ConnectionLineType.Bezier, connectionLineStyle, connectionLineComponent, connectionLineContainerStyle, deleteKeyCode = 'Backspace', selectionKeyCode = 'Shift', selectionOnDrag = false, selectionMode = SelectionMode.Full, panActivationKeyCode = 'Space', multiSelectionKeyCode = isMacOs() ? 'Meta' : 'Control', zoomActivationKeyCode = isMacOs() ? 'Meta' : 'Control', snapToGrid, snapGrid, onlyRenderVisibleElements = false, selectNodesOnDrag, nodesDraggable, autoPanOnNodeFocus, nodesConnectable, nodesFocusable, nodeOrigin = defaultNodeOrigin, edgesFocusable, edgesReconnectable, elementsSelectable = true, defaultViewport: defaultViewport$1 = defaultViewport, minZoom = 0.5, maxZoom = 2, translateExtent = infiniteExtent, preventScrolling = true, nodeExtent, defaultMarkerColor = '#b1b1b7', zoomOnScroll = true, zoomOnPinch = true, panOnScroll = false, panOnScrollSpeed = 0.5, panOnScrollMode = PanOnScrollMode.Free, zoomOnDoubleClick = true, panOnDrag = true, onPaneClick, onPaneMouseEnter, onPaneMouseMove, onPaneMouseLeave, onPaneScroll, onPaneContextMenu, paneClickDistance = 1, nodeClickDistance = 0, children, onReconnect, onReconnectStart, onReconnectEnd, onEdgeContextMenu, onEdgeDoubleClick, onEdgeMouseEnter, onEdgeMouseMove, onEdgeMouseLeave, reconnectRadius = 10, onNodesChange, onEdgesChange, noDragClassName = 'nodrag', noWheelClassName = 'nowheel', noPanClassName = 'nopan', fitView, fitViewOptions, connectOnClick, attributionPosition, proOptions, defaultEdgeOptions, elevateNodesOnSelect, elevateEdgesOnSelect, disableKeyboardA11y = false, autoPanOnConnect, autoPanOnNodeDrag, autoPanSpeed, connectionRadius, isValidConnection, onError, style, id, nodeDragThreshold, connectionDragThreshold, viewport, onViewportChange, width, height, colorMode = 'light', debug, onScroll, ariaLabelConfig, ...rest }, ref) {
     const rfId = id || '1';
     const colorModeClassName = useColorModeClass(colorMode);
     // Undo scroll events, preventing viewport from shifting when nodes outside of it are focused
@@ -11564,7 +11562,7 @@ function ReactFlow({ nodes, edges, defaultNodes, defaultEdges, className, nodeTy
     }, [
         onScroll
     ]);
-    return jsx("div", {
+    return jsx$1("div", {
         "data-testid": "rf__wrapper",
         ...rest,
         onScroll: wrapperOnScroll,
@@ -11592,7 +11590,7 @@ function ReactFlow({ nodes, edges, defaultNodes, defaultEdges, className, nodeTy
             nodeOrigin: nodeOrigin,
             nodeExtent: nodeExtent,
             children: [
-                jsx(GraphView, {
+                jsx$1(GraphView, {
                     onInit: onInit,
                     onNodeClick: onNodeClick,
                     onEdgeClick: onEdgeClick,
@@ -11657,7 +11655,7 @@ function ReactFlow({ nodes, edges, defaultNodes, defaultEdges, className, nodeTy
                     viewport: viewport,
                     onViewportChange: onViewportChange
                 }),
-                jsx(StoreUpdater, {
+                jsx$1(StoreUpdater, {
                     nodes: nodes,
                     edges: edges,
                     defaultNodes: defaultNodes,
@@ -11717,15 +11715,15 @@ function ReactFlow({ nodes, edges, defaultNodes, defaultEdges, className, nodeTy
                     debug: debug,
                     ariaLabelConfig: ariaLabelConfig
                 }),
-                jsx(SelectionListener, {
+                jsx$1(SelectionListener, {
                     onSelectionChange: onSelectionChange
                 }),
                 children,
-                jsx(Attribution, {
+                jsx$1(Attribution, {
                     proOptions: proOptions,
                     position: attributionPosition
                 }),
-                jsx(A11yDescriptions, {
+                jsx$1(A11yDescriptions, {
                     rfId: rfId,
                     disableKeyboardA11y: disableKeyboardA11y
                 })
@@ -11862,7 +11860,7 @@ function ReactFlow({ nodes, edges, defaultNodes, defaultEdges, className, nodeTy
     ];
 }
 function LinePattern({ dimensions, lineWidth, variant, className }) {
-    return jsx("path", {
+    return jsx$1("path", {
         strokeWidth: lineWidth,
         d: `M${dimensions[0] / 2} 0 V${dimensions[1]} M0 ${dimensions[1] / 2} H${dimensions[0]}`,
         className: cc([
@@ -11873,7 +11871,7 @@ function LinePattern({ dimensions, lineWidth, variant, className }) {
     });
 }
 function DotPattern({ radius, className }) {
-    return jsx("circle", {
+    return jsx$1("circle", {
         cx: radius,
         cy: radius,
         r: radius,
@@ -11948,7 +11946,7 @@ size, lineWidth = 1, offset = 0, color, bgColor, style, className, patternClassN
         ref: ref,
         "data-testid": "rf__background",
         children: [
-            jsx("pattern", {
+            jsx$1("pattern", {
                 id: _patternId,
                 x: transform[0] % scaledGap[0],
                 y: transform[1] % scaledGap[1],
@@ -11956,17 +11954,17 @@ size, lineWidth = 1, offset = 0, color, bgColor, style, className, patternClassN
                 height: scaledGap[1],
                 patternUnits: "userSpaceOnUse",
                 patternTransform: `translate(-${scaledOffset[0]},-${scaledOffset[1]})`,
-                children: isDots ? jsx(DotPattern, {
+                children: isDots ? jsx$1(DotPattern, {
                     radius: scaledSize / 2,
                     className: patternClassName
-                }) : jsx(LinePattern, {
+                }) : jsx$1(LinePattern, {
                     dimensions: patternDimensions,
                     lineWidth: lineWidth,
                     variant: variant,
                     className: patternClassName
                 })
             }),
-            jsx("rect", {
+            jsx$1("rect", {
                 x: "0",
                 y: "0",
                 width: "100%",
@@ -12031,46 +12029,46 @@ BackgroundComponent.displayName = 'Background';
  *
  */ const Background = memo(BackgroundComponent);
 function PlusIcon() {
-    return jsx("svg", {
+    return jsx$1("svg", {
         xmlns: "http://www.w3.org/2000/svg",
         viewBox: "0 0 32 32",
-        children: jsx("path", {
+        children: jsx$1("path", {
             d: "M32 18.133H18.133V32h-4.266V18.133H0v-4.266h13.867V0h4.266v13.867H32z"
         })
     });
 }
 function MinusIcon() {
-    return jsx("svg", {
+    return jsx$1("svg", {
         xmlns: "http://www.w3.org/2000/svg",
         viewBox: "0 0 32 5",
-        children: jsx("path", {
+        children: jsx$1("path", {
             d: "M0 0h32v4.2H0z"
         })
     });
 }
 function FitViewIcon() {
-    return jsx("svg", {
+    return jsx$1("svg", {
         xmlns: "http://www.w3.org/2000/svg",
         viewBox: "0 0 32 30",
-        children: jsx("path", {
+        children: jsx$1("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"
         })
     });
 }
 function LockIcon() {
-    return jsx("svg", {
+    return jsx$1("svg", {
         xmlns: "http://www.w3.org/2000/svg",
         viewBox: "0 0 25 32",
-        children: jsx("path", {
+        children: jsx$1("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"
         })
     });
 }
 function UnlockIcon() {
-    return jsx("svg", {
+    return jsx$1("svg", {
         xmlns: "http://www.w3.org/2000/svg",
         viewBox: "0 0 25 32",
-        children: jsx("path", {
+        children: jsx$1("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"
         })
     });
@@ -12098,7 +12096,7 @@ function UnlockIcon() {
  *}
  *```
  */ function ControlButton({ children, className, ...rest }) {
-    return jsx("button", {
+    return jsx$1("button", {
         type: "button",
         className: cc([
             'react-flow__controls-button',
@@ -12152,37 +12150,37 @@ function ControlsComponent({ style, showZoom = true, showFitView = true, showInt
         children: [
             showZoom && jsxs(Fragment, {
                 children: [
-                    jsx(ControlButton, {
+                    jsx$1(ControlButton, {
                         onClick: onZoomInHandler,
                         className: "react-flow__controls-zoomin",
                         title: ariaLabelConfig['controls.zoomIn.ariaLabel'],
                         "aria-label": ariaLabelConfig['controls.zoomIn.ariaLabel'],
                         disabled: maxZoomReached,
-                        children: jsx(PlusIcon, {})
+                        children: jsx$1(PlusIcon, {})
                     }),
-                    jsx(ControlButton, {
+                    jsx$1(ControlButton, {
                         onClick: onZoomOutHandler,
                         className: "react-flow__controls-zoomout",
                         title: ariaLabelConfig['controls.zoomOut.ariaLabel'],
                         "aria-label": ariaLabelConfig['controls.zoomOut.ariaLabel'],
                         disabled: minZoomReached,
-                        children: jsx(MinusIcon, {})
+                        children: jsx$1(MinusIcon, {})
                     })
                 ]
             }),
-            showFitView && jsx(ControlButton, {
+            showFitView && jsx$1(ControlButton, {
                 className: "react-flow__controls-fitview",
                 onClick: onFitViewHandler,
                 title: ariaLabelConfig['controls.fitView.ariaLabel'],
                 "aria-label": ariaLabelConfig['controls.fitView.ariaLabel'],
-                children: jsx(FitViewIcon, {})
+                children: jsx$1(FitViewIcon, {})
             }),
-            showInteractive && jsx(ControlButton, {
+            showInteractive && jsx$1(ControlButton, {
                 className: "react-flow__controls-interactive",
                 onClick: onToggleInteractivity,
                 title: ariaLabelConfig['controls.interactive.ariaLabel'],
                 "aria-label": ariaLabelConfig['controls.interactive.ariaLabel'],
-                children: isInteractive ? jsx(UnlockIcon, {}) : jsx(LockIcon, {})
+                children: isInteractive ? jsx$1(UnlockIcon, {}) : jsx$1(LockIcon, {})
             }),
             children
         ]
@@ -12213,7 +12211,7 @@ ControlsComponent.displayName = 'Controls';
 function MiniMapNodeComponent({ id, x, y, width, height, style, color, strokeColor, strokeWidth, className, borderRadius, shapeRendering, selected, onClick }) {
     const { background, backgroundColor } = style || {};
     const fill = color || background || backgroundColor;
-    return jsx("rect", {
+    return jsx$1("rect", {
         className: cc([
             'react-flow__minimap-node',
             {
@@ -12248,14 +12246,14 @@ function MiniMapNodes({ nodeStrokeColor, nodeColor, nodeClassName = '', nodeBord
     const nodeStrokeColorFunc = getAttrFunction(nodeStrokeColor);
     const nodeClassNameFunc = getAttrFunction(nodeClassName);
     const shapeRendering = typeof window === 'undefined' || !!window.chrome ? 'crispEdges' : 'geometricPrecision';
-    return jsx(Fragment, {
+    return jsx$1(Fragment, {
         children: nodeIds.map((nodeId)=>/*
          * The split of responsibilities between MiniMapNodes and
          * NodeComponentWrapper may appear weird. However, it’s designed to
          * minimize the cost of updates when individual nodes change.
          *
          * For more details, see a similar commit in `NodeRenderer/index.tsx`.
-         */ jsx(NodeComponentWrapper, {
+         */ jsx$1(NodeComponentWrapper, {
                 id: nodeId,
                 nodeColorFunc: nodeColorFunc,
                 nodeStrokeColorFunc: nodeStrokeColorFunc,
@@ -12285,7 +12283,7 @@ function NodeComponentWrapperInner({ id, nodeColorFunc, nodeStrokeColorFunc, nod
     if (!node || node.hidden || !nodeHasDimensions(node)) {
         return null;
     }
-    return jsx(NodeComponent, {
+    return jsx$1(NodeComponent, {
         x: x,
         y: y,
         width: width,
@@ -12400,7 +12398,7 @@ function MiniMapComponent({ style, className, nodeStrokeColor, nodeColor, nodeCl
         onNodeClick(event, node);
     }, []) : undefined;
     const _ariaLabel = ariaLabel ?? ariaLabelConfig['minimap.ariaLabel'];
-    return jsx(Panel, {
+    return jsx$1(Panel, {
         position: position,
         style: {
             ...style,
@@ -12427,11 +12425,11 @@ function MiniMapComponent({ style, className, nodeStrokeColor, nodeColor, nodeCl
             ref: svg,
             onClick: onSvgClick,
             children: [
-                _ariaLabel && jsx("title", {
+                _ariaLabel && jsx$1("title", {
                     id: labelledBy,
                     children: _ariaLabel
                 }),
-                jsx(MiniMapNodes$1, {
+                jsx$1(MiniMapNodes$1, {
                     onClick: onSvgNodeClick,
                     nodeColor: nodeColor,
                     nodeStrokeColor: nodeStrokeColor,
@@ -12440,7 +12438,7 @@ function MiniMapComponent({ style, className, nodeStrokeColor, nodeColor, nodeCl
                     nodeStrokeWidth: nodeStrokeWidth,
                     nodeComponent: nodeComponent
                 }),
-                jsx("path", {
+                jsx$1("path", {
                     className: "react-flow__minimap-mask",
                     d: `M${x - offset},${y - offset}h${width + offset * 2}v${height + offset * 2}h${-width - offset * 2}z
         M${viewBB.x},${viewBB.y}h${viewBB.width}v${viewBB.height}h${-viewBB.width}z`,
@@ -12625,7 +12623,7 @@ function ResizeControl({ nodeId, position, variant = ResizeControlVariant.Handle
         shouldResize
     ]);
     const positionClassNames = controlPosition.split('-');
-    return jsx("div", {
+    return jsx$1("div", {
         className: cc([
             'react-flow__resize-control',
             'nodrag',
@@ -12679,7 +12677,7 @@ var css_248z = "/* this gets exported as style.css and can be used for the defau
 styleInject(css_248z);
 
 /**
- * @license lucide-react v0.553.0 - ISC
+ * @license lucide-react v0.554.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
@@ -12701,7 +12699,7 @@ const hasA11yProp = (props)=>{
 };
 
 /**
- * @license lucide-react v0.553.0 - ISC
+ * @license lucide-react v0.554.0 - ISC
  *
  * This source code is licensed under the ISC license.
  * See the LICENSE file in the root directory of this source tree.
@@ -13942,6 +13940,372 @@ function _extends() {
     }, _extends.apply(null, arguments);
 }
 
+var reactIs = {exports: {}};
+
+var reactIs_production_min = {};
+
+var hasRequiredReactIs_production_min;
+function requireReactIs_production_min() {
+    if (hasRequiredReactIs_production_min) return reactIs_production_min;
+    hasRequiredReactIs_production_min = 1;
+    var b = "function" === typeof Symbol && Symbol.for, c = b ? Symbol.for("react.element") : 60103, d = b ? Symbol.for("react.portal") : 60106, e = b ? Symbol.for("react.fragment") : 60107, f = b ? Symbol.for("react.strict_mode") : 60108, g = b ? Symbol.for("react.profiler") : 60114, h = b ? Symbol.for("react.provider") : 60109, k = b ? Symbol.for("react.context") : 60110, l = b ? Symbol.for("react.async_mode") : 60111, m = b ? Symbol.for("react.concurrent_mode") : 60111, n = b ? Symbol.for("react.forward_ref") : 60112, p = b ? Symbol.for("react.suspense") : 60113, q = b ? Symbol.for("react.suspense_list") : 60120, r = b ? Symbol.for("react.memo") : 60115, t = b ? Symbol.for("react.lazy") : 60116, v = b ? Symbol.for("react.block") : 60121, w = b ? Symbol.for("react.fundamental") : 60117, x = b ? Symbol.for("react.responder") : 60118, y = b ? Symbol.for("react.scope") : 60119;
+    function z(a) {
+        if ("object" === typeof a && null !== a) {
+            var u = a.$$typeof;
+            switch(u){
+                case c:
+                    switch(a = a.type, a){
+                        case l:
+                        case m:
+                        case e:
+                        case g:
+                        case f:
+                        case p:
+                            return a;
+                        default:
+                            switch(a = a && a.$$typeof, a){
+                                case k:
+                                case n:
+                                case t:
+                                case r:
+                                case h:
+                                    return a;
+                                default:
+                                    return u;
+                            }
+                    }
+                case d:
+                    return u;
+            }
+        }
+    }
+    function A(a) {
+        return z(a) === m;
+    }
+    reactIs_production_min.AsyncMode = l;
+    reactIs_production_min.ConcurrentMode = m;
+    reactIs_production_min.ContextConsumer = k;
+    reactIs_production_min.ContextProvider = h;
+    reactIs_production_min.Element = c;
+    reactIs_production_min.ForwardRef = n;
+    reactIs_production_min.Fragment = e;
+    reactIs_production_min.Lazy = t;
+    reactIs_production_min.Memo = r;
+    reactIs_production_min.Portal = d;
+    reactIs_production_min.Profiler = g;
+    reactIs_production_min.StrictMode = f;
+    reactIs_production_min.Suspense = p;
+    reactIs_production_min.isAsyncMode = function(a) {
+        return A(a) || z(a) === l;
+    };
+    reactIs_production_min.isConcurrentMode = A;
+    reactIs_production_min.isContextConsumer = function(a) {
+        return z(a) === k;
+    };
+    reactIs_production_min.isContextProvider = function(a) {
+        return z(a) === h;
+    };
+    reactIs_production_min.isElement = function(a) {
+        return "object" === typeof a && null !== a && a.$$typeof === c;
+    };
+    reactIs_production_min.isForwardRef = function(a) {
+        return z(a) === n;
+    };
+    reactIs_production_min.isFragment = function(a) {
+        return z(a) === e;
+    };
+    reactIs_production_min.isLazy = function(a) {
+        return z(a) === t;
+    };
+    reactIs_production_min.isMemo = function(a) {
+        return z(a) === r;
+    };
+    reactIs_production_min.isPortal = function(a) {
+        return z(a) === d;
+    };
+    reactIs_production_min.isProfiler = function(a) {
+        return z(a) === g;
+    };
+    reactIs_production_min.isStrictMode = function(a) {
+        return z(a) === f;
+    };
+    reactIs_production_min.isSuspense = function(a) {
+        return z(a) === p;
+    };
+    reactIs_production_min.isValidElementType = function(a) {
+        return "string" === typeof a || "function" === typeof a || a === e || a === m || a === g || a === f || a === p || a === q || "object" === typeof a && null !== a && (a.$$typeof === t || a.$$typeof === r || a.$$typeof === h || a.$$typeof === k || a.$$typeof === n || a.$$typeof === w || a.$$typeof === x || a.$$typeof === y || a.$$typeof === v);
+    };
+    reactIs_production_min.typeOf = z;
+    return reactIs_production_min;
+}
+
+var reactIs_development = {};
+
+var hasRequiredReactIs_development;
+function requireReactIs_development() {
+    if (hasRequiredReactIs_development) return reactIs_development;
+    hasRequiredReactIs_development = 1;
+    if (process.env.NODE_ENV !== "production") {
+        (function() {
+            // The Symbol used to tag the ReactElement-like types. If there is no native Symbol
+            // nor polyfill, then a plain number is used for performance.
+            var hasSymbol = typeof Symbol === 'function' && Symbol.for;
+            var REACT_ELEMENT_TYPE = hasSymbol ? Symbol.for('react.element') : 0xeac7;
+            var REACT_PORTAL_TYPE = hasSymbol ? Symbol.for('react.portal') : 0xeaca;
+            var REACT_FRAGMENT_TYPE = hasSymbol ? Symbol.for('react.fragment') : 0xeacb;
+            var REACT_STRICT_MODE_TYPE = hasSymbol ? Symbol.for('react.strict_mode') : 0xeacc;
+            var REACT_PROFILER_TYPE = hasSymbol ? Symbol.for('react.profiler') : 0xead2;
+            var REACT_PROVIDER_TYPE = hasSymbol ? Symbol.for('react.provider') : 0xeacd;
+            var REACT_CONTEXT_TYPE = hasSymbol ? Symbol.for('react.context') : 0xeace; // TODO: We don't use AsyncMode or ConcurrentMode anymore. They were temporary
+            // (unstable) APIs that have been removed. Can we remove the symbols?
+            var REACT_ASYNC_MODE_TYPE = hasSymbol ? Symbol.for('react.async_mode') : 0xeacf;
+            var REACT_CONCURRENT_MODE_TYPE = hasSymbol ? Symbol.for('react.concurrent_mode') : 0xeacf;
+            var REACT_FORWARD_REF_TYPE = hasSymbol ? Symbol.for('react.forward_ref') : 0xead0;
+            var REACT_SUSPENSE_TYPE = hasSymbol ? Symbol.for('react.suspense') : 0xead1;
+            var REACT_SUSPENSE_LIST_TYPE = hasSymbol ? Symbol.for('react.suspense_list') : 0xead8;
+            var REACT_MEMO_TYPE = hasSymbol ? Symbol.for('react.memo') : 0xead3;
+            var REACT_LAZY_TYPE = hasSymbol ? Symbol.for('react.lazy') : 0xead4;
+            var REACT_BLOCK_TYPE = hasSymbol ? Symbol.for('react.block') : 0xead9;
+            var REACT_FUNDAMENTAL_TYPE = hasSymbol ? Symbol.for('react.fundamental') : 0xead5;
+            var REACT_RESPONDER_TYPE = hasSymbol ? Symbol.for('react.responder') : 0xead6;
+            var REACT_SCOPE_TYPE = hasSymbol ? Symbol.for('react.scope') : 0xead7;
+            function isValidElementType(type) {
+                return typeof type === 'string' || typeof type === 'function' || // Note: its typeof might be other than 'symbol' or 'number' if it's a polyfill.
+                type === REACT_FRAGMENT_TYPE || type === REACT_CONCURRENT_MODE_TYPE || type === REACT_PROFILER_TYPE || type === REACT_STRICT_MODE_TYPE || type === REACT_SUSPENSE_TYPE || type === REACT_SUSPENSE_LIST_TYPE || typeof type === 'object' && type !== null && (type.$$typeof === REACT_LAZY_TYPE || type.$$typeof === REACT_MEMO_TYPE || type.$$typeof === REACT_PROVIDER_TYPE || type.$$typeof === REACT_CONTEXT_TYPE || type.$$typeof === REACT_FORWARD_REF_TYPE || type.$$typeof === REACT_FUNDAMENTAL_TYPE || type.$$typeof === REACT_RESPONDER_TYPE || type.$$typeof === REACT_SCOPE_TYPE || type.$$typeof === REACT_BLOCK_TYPE);
+            }
+            function typeOf(object) {
+                if (typeof object === 'object' && object !== null) {
+                    var $$typeof = object.$$typeof;
+                    switch($$typeof){
+                        case REACT_ELEMENT_TYPE:
+                            var type = object.type;
+                            switch(type){
+                                case REACT_ASYNC_MODE_TYPE:
+                                case REACT_CONCURRENT_MODE_TYPE:
+                                case REACT_FRAGMENT_TYPE:
+                                case REACT_PROFILER_TYPE:
+                                case REACT_STRICT_MODE_TYPE:
+                                case REACT_SUSPENSE_TYPE:
+                                    return type;
+                                default:
+                                    var $$typeofType = type && type.$$typeof;
+                                    switch($$typeofType){
+                                        case REACT_CONTEXT_TYPE:
+                                        case REACT_FORWARD_REF_TYPE:
+                                        case REACT_LAZY_TYPE:
+                                        case REACT_MEMO_TYPE:
+                                        case REACT_PROVIDER_TYPE:
+                                            return $$typeofType;
+                                        default:
+                                            return $$typeof;
+                                    }
+                            }
+                        case REACT_PORTAL_TYPE:
+                            return $$typeof;
+                    }
+                }
+                return undefined;
+            } // AsyncMode is deprecated along with isAsyncMode
+            var AsyncMode = REACT_ASYNC_MODE_TYPE;
+            var ConcurrentMode = REACT_CONCURRENT_MODE_TYPE;
+            var ContextConsumer = REACT_CONTEXT_TYPE;
+            var ContextProvider = REACT_PROVIDER_TYPE;
+            var Element = REACT_ELEMENT_TYPE;
+            var ForwardRef = REACT_FORWARD_REF_TYPE;
+            var Fragment = REACT_FRAGMENT_TYPE;
+            var Lazy = REACT_LAZY_TYPE;
+            var Memo = REACT_MEMO_TYPE;
+            var Portal = REACT_PORTAL_TYPE;
+            var Profiler = REACT_PROFILER_TYPE;
+            var StrictMode = REACT_STRICT_MODE_TYPE;
+            var Suspense = REACT_SUSPENSE_TYPE;
+            var hasWarnedAboutDeprecatedIsAsyncMode = false; // AsyncMode should be deprecated
+            function isAsyncMode(object) {
+                {
+                    if (!hasWarnedAboutDeprecatedIsAsyncMode) {
+                        hasWarnedAboutDeprecatedIsAsyncMode = true; // Using console['warn'] to evade Babel and ESLint
+                        console['warn']('The ReactIs.isAsyncMode() alias has been deprecated, ' + 'and will be removed in React 17+. Update your code to use ' + 'ReactIs.isConcurrentMode() instead. It has the exact same API.');
+                    }
+                }
+                return isConcurrentMode(object) || typeOf(object) === REACT_ASYNC_MODE_TYPE;
+            }
+            function isConcurrentMode(object) {
+                return typeOf(object) === REACT_CONCURRENT_MODE_TYPE;
+            }
+            function isContextConsumer(object) {
+                return typeOf(object) === REACT_CONTEXT_TYPE;
+            }
+            function isContextProvider(object) {
+                return typeOf(object) === REACT_PROVIDER_TYPE;
+            }
+            function isElement(object) {
+                return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
+            }
+            function isForwardRef(object) {
+                return typeOf(object) === REACT_FORWARD_REF_TYPE;
+            }
+            function isFragment(object) {
+                return typeOf(object) === REACT_FRAGMENT_TYPE;
+            }
+            function isLazy(object) {
+                return typeOf(object) === REACT_LAZY_TYPE;
+            }
+            function isMemo(object) {
+                return typeOf(object) === REACT_MEMO_TYPE;
+            }
+            function isPortal(object) {
+                return typeOf(object) === REACT_PORTAL_TYPE;
+            }
+            function isProfiler(object) {
+                return typeOf(object) === REACT_PROFILER_TYPE;
+            }
+            function isStrictMode(object) {
+                return typeOf(object) === REACT_STRICT_MODE_TYPE;
+            }
+            function isSuspense(object) {
+                return typeOf(object) === REACT_SUSPENSE_TYPE;
+            }
+            reactIs_development.AsyncMode = AsyncMode;
+            reactIs_development.ConcurrentMode = ConcurrentMode;
+            reactIs_development.ContextConsumer = ContextConsumer;
+            reactIs_development.ContextProvider = ContextProvider;
+            reactIs_development.Element = Element;
+            reactIs_development.ForwardRef = ForwardRef;
+            reactIs_development.Fragment = Fragment;
+            reactIs_development.Lazy = Lazy;
+            reactIs_development.Memo = Memo;
+            reactIs_development.Portal = Portal;
+            reactIs_development.Profiler = Profiler;
+            reactIs_development.StrictMode = StrictMode;
+            reactIs_development.Suspense = Suspense;
+            reactIs_development.isAsyncMode = isAsyncMode;
+            reactIs_development.isConcurrentMode = isConcurrentMode;
+            reactIs_development.isContextConsumer = isContextConsumer;
+            reactIs_development.isContextProvider = isContextProvider;
+            reactIs_development.isElement = isElement;
+            reactIs_development.isForwardRef = isForwardRef;
+            reactIs_development.isFragment = isFragment;
+            reactIs_development.isLazy = isLazy;
+            reactIs_development.isMemo = isMemo;
+            reactIs_development.isPortal = isPortal;
+            reactIs_development.isProfiler = isProfiler;
+            reactIs_development.isStrictMode = isStrictMode;
+            reactIs_development.isSuspense = isSuspense;
+            reactIs_development.isValidElementType = isValidElementType;
+            reactIs_development.typeOf = typeOf;
+        })();
+    }
+    return reactIs_development;
+}
+
+var hasRequiredReactIs;
+function requireReactIs() {
+    if (hasRequiredReactIs) return reactIs.exports;
+    hasRequiredReactIs = 1;
+    if (process.env.NODE_ENV === 'production') {
+        reactIs.exports = requireReactIs_production_min();
+    } else {
+        reactIs.exports = requireReactIs_development();
+    }
+    return reactIs.exports;
+}
+
+var hoistNonReactStatics_cjs;
+var hasRequiredHoistNonReactStatics_cjs;
+function requireHoistNonReactStatics_cjs() {
+    if (hasRequiredHoistNonReactStatics_cjs) return hoistNonReactStatics_cjs;
+    hasRequiredHoistNonReactStatics_cjs = 1;
+    var reactIs = requireReactIs();
+    /**
+	 * Copyright 2015, Yahoo! Inc.
+	 * Copyrights licensed under the New BSD License. See the accompanying LICENSE file for terms.
+	 */ var REACT_STATICS = {
+        childContextTypes: true,
+        contextType: true,
+        contextTypes: true,
+        defaultProps: true,
+        displayName: true,
+        getDefaultProps: true,
+        getDerivedStateFromError: true,
+        getDerivedStateFromProps: true,
+        mixins: true,
+        propTypes: true,
+        type: true
+    };
+    var KNOWN_STATICS = {
+        name: true,
+        length: true,
+        prototype: true,
+        caller: true,
+        callee: true,
+        arguments: true,
+        arity: true
+    };
+    var FORWARD_REF_STATICS = {
+        '$$typeof': true,
+        render: true,
+        defaultProps: true,
+        displayName: true,
+        propTypes: true
+    };
+    var MEMO_STATICS = {
+        '$$typeof': true,
+        compare: true,
+        defaultProps: true,
+        displayName: true,
+        propTypes: true,
+        type: true
+    };
+    var TYPE_STATICS = {};
+    TYPE_STATICS[reactIs.ForwardRef] = FORWARD_REF_STATICS;
+    TYPE_STATICS[reactIs.Memo] = MEMO_STATICS;
+    function getStatics(component) {
+        // React v16.11 and below
+        if (reactIs.isMemo(component)) {
+            return MEMO_STATICS;
+        } // React v16.12 and above
+        return TYPE_STATICS[component['$$typeof']] || REACT_STATICS;
+    }
+    var defineProperty = Object.defineProperty;
+    var getOwnPropertyNames = Object.getOwnPropertyNames;
+    var getOwnPropertySymbols = Object.getOwnPropertySymbols;
+    var getOwnPropertyDescriptor = Object.getOwnPropertyDescriptor;
+    var getPrototypeOf = Object.getPrototypeOf;
+    var objectPrototype = Object.prototype;
+    function hoistNonReactStatics(targetComponent, sourceComponent, blacklist) {
+        if (typeof sourceComponent !== 'string') {
+            // don't hoist over string (html) components
+            if (objectPrototype) {
+                var inheritedComponent = getPrototypeOf(sourceComponent);
+                if (inheritedComponent && inheritedComponent !== objectPrototype) {
+                    hoistNonReactStatics(targetComponent, inheritedComponent, blacklist);
+                }
+            }
+            var keys = getOwnPropertyNames(sourceComponent);
+            if (getOwnPropertySymbols) {
+                keys = keys.concat(getOwnPropertySymbols(sourceComponent));
+            }
+            var targetStatics = getStatics(targetComponent);
+            var sourceStatics = getStatics(sourceComponent);
+            for(var i = 0; i < keys.length; ++i){
+                var key = keys[i];
+                if (!KNOWN_STATICS[key] && !(blacklist && blacklist[key]) && !(sourceStatics && sourceStatics[key]) && !(targetStatics && targetStatics[key])) {
+                    var descriptor = getOwnPropertyDescriptor(sourceComponent, key);
+                    try {
+                        // Avoid failures from read-only properties
+                        defineProperty(targetComponent, key, descriptor);
+                    } catch (e) {}
+                }
+            }
+        }
+        return targetComponent;
+    }
+    hoistNonReactStatics_cjs = hoistNonReactStatics;
+    return hoistNonReactStatics_cjs;
+}
+
+requireHoistNonReactStatics_cjs();
+
 var isBrowser = true;
 function getRegisteredStyles(registered, registeredStyles, classNames) {
     var rawClassName = '';
@@ -14244,6 +14608,7 @@ var syncFallback = function syncFallback(create) {
 };
 var useInsertionEffect$1 = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : false;
 var useInsertionEffectAlwaysWithSyncFallback = useInsertionEffect$1 || syncFallback;
+var useInsertionEffectWithLayoutFallback = useInsertionEffect$1 || React.useLayoutEffect;
 
 var EmotionCacheContext = /* #__PURE__ */ React.createContext(// because this module is primarily intended for the browser and node
 // but it's also required in react native and similar environments sometimes
@@ -14283,6 +14648,153 @@ var ThemeProvider$1 = function ThemeProvider(props) {
         value: theme
     }, props.children);
 };
+var hasOwn = {}.hasOwnProperty;
+var typePropName = '__EMOTION_TYPE_PLEASE_DO_NOT_USE__';
+var createEmotionProps = function createEmotionProps(type, props) {
+    var newProps = {};
+    for(var _key in props){
+        if (hasOwn.call(props, _key)) {
+            newProps[_key] = props[_key];
+        }
+    }
+    newProps[typePropName] = type; // Runtime labeling is an opt-in feature because:
+    return newProps;
+};
+var Insertion$1 = function Insertion(_ref) {
+    var cache = _ref.cache, serialized = _ref.serialized, isStringTag = _ref.isStringTag;
+    registerStyles(cache, serialized, isStringTag);
+    useInsertionEffectAlwaysWithSyncFallback(function() {
+        return insertStyles(cache, serialized, isStringTag);
+    });
+    return null;
+};
+var Emotion = /* #__PURE__ */ withEmotionCache(function(props, cache, ref) {
+    var cssProp = props.css; // so that using `css` from `emotion` and passing the result to the css prop works
+    // not passing the registered cache to serializeStyles because it would
+    // make certain babel optimisations not possible
+    if (typeof cssProp === 'string' && cache.registered[cssProp] !== undefined) {
+        cssProp = cache.registered[cssProp];
+    }
+    var WrappedComponent = props[typePropName];
+    var registeredStyles = [
+        cssProp
+    ];
+    var className = '';
+    if (typeof props.className === 'string') {
+        className = getRegisteredStyles(cache.registered, registeredStyles, props.className);
+    } else if (props.className != null) {
+        className = props.className + " ";
+    }
+    var serialized = serializeStyles(registeredStyles, undefined, React.useContext(ThemeContext$1));
+    className += cache.key + "-" + serialized.name;
+    var newProps = {};
+    for(var _key2 in props){
+        if (hasOwn.call(props, _key2) && _key2 !== 'css' && _key2 !== typePropName && true) {
+            newProps[_key2] = props[_key2];
+        }
+    }
+    newProps.className = className;
+    if (ref) {
+        newProps.ref = ref;
+    }
+    return /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement(Insertion$1, {
+        cache: cache,
+        serialized: serialized,
+        isStringTag: typeof WrappedComponent === 'string'
+    }), /*#__PURE__*/ React.createElement(WrappedComponent, newProps));
+});
+var Emotion$1 = Emotion;
+
+var jsx = function jsx(type, props) {
+    // eslint-disable-next-line prefer-rest-params
+    var args = arguments;
+    if (props == null || !hasOwn.call(props, 'css')) {
+        return React.createElement.apply(undefined, args);
+    }
+    var argsLength = args.length;
+    var createElementArgArray = new Array(argsLength);
+    createElementArgArray[0] = Emotion$1;
+    createElementArgArray[1] = createEmotionProps(type, props);
+    for(var i = 2; i < argsLength; i++){
+        createElementArgArray[i] = args[i];
+    }
+    return React.createElement.apply(null, createElementArgArray);
+};
+(function(_jsx) {
+    var JSX;
+    (function(_JSX) {})(JSX || (JSX = _jsx.JSX || (_jsx.JSX = {})));
+})(jsx || (jsx = {}));
+// initial render from browser, insertBefore context.sheet.tags[0] or if a style hasn't been inserted there yet, appendChild
+// initial client-side render from SSR, use place of hydrating tag
+var Global = /* #__PURE__ */ withEmotionCache(function(props, cache) {
+    var styles = props.styles;
+    var serialized = serializeStyles([
+        styles
+    ], undefined, React.useContext(ThemeContext$1));
+    // but it is based on a constant that will never change at runtime
+    // it's effectively like having two implementations and switching them out
+    // so it's not actually breaking anything
+    var sheetRef = React.useRef();
+    useInsertionEffectWithLayoutFallback(function() {
+        var key = cache.key + "-global"; // use case of https://github.com/emotion-js/emotion/issues/2675
+        var sheet = new cache.sheet.constructor({
+            key: key,
+            nonce: cache.sheet.nonce,
+            container: cache.sheet.container,
+            speedy: cache.sheet.isSpeedy
+        });
+        var rehydrating = false;
+        var node = document.querySelector("style[data-emotion=\"" + key + " " + serialized.name + "\"]");
+        if (cache.sheet.tags.length) {
+            sheet.before = cache.sheet.tags[0];
+        }
+        if (node !== null) {
+            rehydrating = true; // clear the hash so this node won't be recognizable as rehydratable by other <Global/>s
+            node.setAttribute('data-emotion', key);
+            sheet.hydrate([
+                node
+            ]);
+        }
+        sheetRef.current = [
+            sheet,
+            rehydrating
+        ];
+        return function() {
+            sheet.flush();
+        };
+    }, [
+        cache
+    ]);
+    useInsertionEffectWithLayoutFallback(function() {
+        var sheetRefCurrent = sheetRef.current;
+        var sheet = sheetRefCurrent[0], rehydrating = sheetRefCurrent[1];
+        if (rehydrating) {
+            sheetRefCurrent[1] = false;
+            return;
+        }
+        if (serialized.next !== undefined) {
+            // insert keyframes
+            insertStyles(cache, serialized.next, true);
+        }
+        if (sheet.tags.length) {
+            // if this doesn't exist then it will be null so the style element will be appended
+            var element = sheet.tags[sheet.tags.length - 1].nextElementSibling;
+            sheet.before = element;
+            sheet.flush();
+        }
+        cache.insert("", serialized, sheet, false);
+    }, [
+        cache,
+        serialized.name
+    ]);
+    return null;
+});
+function css() {
+    for(var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++){
+        args[_key] = arguments[_key];
+    }
+    return serializeStyles(args);
+}
 
 const lightTheme = {
     colors: {
@@ -14390,9 +14902,15 @@ const ThemeProvider = ({ children, theme: propTheme })=>{
             return propTheme;
         }
         // Only check localStorage if no theme prop is provided
-        const savedTheme = localStorage.getItem("theme");
-        if (savedTheme === "dark") {
-            return darkTheme;
+        // Handle cases where localStorage might not be available (e.g., test environments)
+        try {
+            const savedTheme = localStorage.getItem("theme");
+            if (savedTheme === "dark") {
+                return darkTheme;
+            }
+        } catch (e) {
+        // localStorage not available, fall back to light theme
+        // This can happen in test environments or when localStorage is disabled
         }
         return lightTheme;
     });
@@ -14411,11 +14929,15 @@ const ThemeProvider = ({ children, theme: propTheme })=>{
             return;
         }
         const handleStorageChange = ()=>{
-            const savedTheme = localStorage.getItem("theme");
-            if (savedTheme === "dark") {
-                setCurrentTheme(darkTheme);
-            } else {
-                setCurrentTheme(lightTheme);
+            try {
+                const savedTheme = localStorage.getItem("theme");
+                if (savedTheme === "dark") {
+                    setCurrentTheme(darkTheme);
+                } else {
+                    setCurrentTheme(lightTheme);
+                }
+            } catch (e) {
+            // localStorage not available, ignore storage changes
             }
         };
         // Listen for storage events (when localStorage changes in other tabs)
@@ -17021,15 +17543,24 @@ const NodeIcon$3 = styled.div`
 `;
 
 // Helper function to get node icon
-const getNodeIcon = (modelProvider)=>{
+const getNodeIcon = (modelProvider, size = 16)=>{
     if (modelProvider === "OpenAI") {
-        return /*#__PURE__*/ React__default.createElement(OpenAIIcon, null);
+        return /*#__PURE__*/ React__default.createElement(OpenAIIcon, {
+            width: size,
+            height: size
+        });
     }
     if (modelProvider === "Anthropic") {
-        return /*#__PURE__*/ React__default.createElement(AnthropicIcon, null);
+        return /*#__PURE__*/ React__default.createElement(AnthropicIcon, {
+            width: size,
+            height: size
+        });
     }
     if (modelProvider === "Google" || modelProvider === "Vertex_AI") {
-        return /*#__PURE__*/ React__default.createElement(GoogleIcon, null);
+        return /*#__PURE__*/ React__default.createElement(GoogleIcon, {
+            width: size,
+            height: size
+        });
     }
     return "🤖";
 };
@@ -17711,7 +18242,7 @@ function createContext2(rootComponentName, defaultContext) {
     const Provider = (props)=>{
         const { children, ...context } = props;
         const value = React.useMemo(()=>context, Object.values(context));
-        return /* @__PURE__ */ jsx(Context.Provider, {
+        return /* @__PURE__ */ jsx$1(Context.Provider, {
             value,
             children
         });
@@ -17741,7 +18272,7 @@ function createContextScope(scopeName, createContextScopeDeps = []) {
             const { scope, children, ...context } = props;
             const Context = scope?.[scopeName]?.[index] || BaseContext;
             const value = React.useMemo(()=>context, Object.values(context));
-            return /* @__PURE__ */ jsx(Context.Provider, {
+            return /* @__PURE__ */ jsx$1(Context.Provider, {
                 value,
                 children
             });
@@ -17852,7 +18383,7 @@ function useControllableState$1({ prop, defaultProp, onChange = ()=>{}, caller }
     }
     const setValue = React.useCallback((nextValue)=>{
         if (isControlled) {
-            const value2 = isFunction$1(nextValue) ? nextValue(prop) : nextValue;
+            const value2 = isFunction(nextValue) ? nextValue(prop) : nextValue;
             if (value2 !== prop) {
                 onChangeRef.current?.(value2);
             }
@@ -17894,7 +18425,7 @@ function useUncontrolledState$1({ defaultProp, onChange }) {
         onChangeRef
     ];
 }
-function isFunction$1(value) {
+function isFunction(value) {
     return typeof value === "function";
 }
 
@@ -17916,13 +18447,13 @@ function createSlot(ownerName) {
                     return child;
                 }
             });
-            return /* @__PURE__ */ jsx(SlotClone, {
+            return /* @__PURE__ */ jsx$1(SlotClone, {
                 ...slotProps,
                 ref: forwardedRef,
                 children: React.isValidElement(newElement) ? React.cloneElement(newElement, void 0, newChildren) : null
             });
         }
-        return /* @__PURE__ */ jsx(SlotClone, {
+        return /* @__PURE__ */ jsx$1(SlotClone, {
             ...slotProps,
             ref: forwardedRef,
             children
@@ -18029,7 +18560,7 @@ var Primitive = NODES.reduce((primitive, node)=>{
         if (typeof window !== "undefined") {
             window[Symbol.for("radix-ui")] = true;
         }
-        return /* @__PURE__ */ jsx(Comp, {
+        return /* @__PURE__ */ jsx$1(Comp, {
             ...primitiveProps,
             ref: forwardedRef
         });
@@ -18166,7 +18697,7 @@ var DismissableLayer = React.forwardRef((props, forwardedRef)=>{
         document.addEventListener(CONTEXT_UPDATE, handleUpdate);
         return ()=>document.removeEventListener(CONTEXT_UPDATE, handleUpdate);
     }, []);
-    return /* @__PURE__ */ jsx(Primitive.div, {
+    return /* @__PURE__ */ jsx$1(Primitive.div, {
         ...layerProps,
         ref: composedRefs,
         style: {
@@ -18195,7 +18726,7 @@ var DismissableLayerBranch = React.forwardRef((props, forwardedRef)=>{
     }, [
         context.branches
     ]);
-    return /* @__PURE__ */ jsx(Primitive.div, {
+    return /* @__PURE__ */ jsx$1(Primitive.div, {
         ...props,
         ref: composedRefs
     });
@@ -18432,7 +18963,7 @@ var FocusScope = React.forwardRef((props, forwardedRef)=>{
         trapped,
         focusScope.paused
     ]);
-    return /* @__PURE__ */ jsx(Primitive.div, {
+    return /* @__PURE__ */ jsx$1(Primitive.div, {
         tabIndex: -1,
         ...scopeProps,
         ref: composedRefs,
@@ -18536,7 +19067,7 @@ var Portal$3 = React.forwardRef((props, forwardedRef)=>{
     const [mounted, setMounted] = React.useState(false);
     useLayoutEffect2(()=>setMounted(true), []);
     const container = containerProp || mounted && globalThis?.document?.body;
-    return container ? ReactDOM__default.createPortal(/* @__PURE__ */ jsx(Primitive.div, {
+    return container ? ReactDOM__default.createPortal(/* @__PURE__ */ jsx$1(Primitive.div, {
         ...portalProps,
         ref: forwardedRef
     }), container) : null;
@@ -19690,7 +20221,7 @@ var Dialog = (props)=>{
         onChange: onOpenChange,
         caller: DIALOG_NAME
     });
-    return /* @__PURE__ */ jsx(DialogProvider, {
+    return /* @__PURE__ */ jsx$1(DialogProvider, {
         scope: __scopeDialog,
         triggerRef,
         contentRef,
@@ -19707,23 +20238,23 @@ var Dialog = (props)=>{
     });
 };
 Dialog.displayName = DIALOG_NAME;
-var TRIGGER_NAME$2 = "DialogTrigger";
+var TRIGGER_NAME$1 = "DialogTrigger";
 var DialogTrigger = React.forwardRef((props, forwardedRef)=>{
     const { __scopeDialog, ...triggerProps } = props;
-    const context = useDialogContext(TRIGGER_NAME$2, __scopeDialog);
+    const context = useDialogContext(TRIGGER_NAME$1, __scopeDialog);
     const composedTriggerRef = useComposedRefs$1(forwardedRef, context.triggerRef);
-    return /* @__PURE__ */ jsx(Primitive.button, {
+    return /* @__PURE__ */ jsx$1(Primitive.button, {
         type: "button",
         "aria-haspopup": "dialog",
         "aria-expanded": context.open,
         "aria-controls": context.contentId,
-        "data-state": getState$1(context.open),
+        "data-state": getState(context.open),
         ...triggerProps,
         ref: composedTriggerRef,
         onClick: composeEventHandlers(props.onClick, context.onOpenToggle)
     });
 });
-DialogTrigger.displayName = TRIGGER_NAME$2;
+DialogTrigger.displayName = TRIGGER_NAME$1;
 var PORTAL_NAME$1 = "DialogPortal";
 var [PortalProvider, usePortalContext] = createDialogContext(PORTAL_NAME$1, {
     forceMount: void 0
@@ -19731,12 +20262,12 @@ var [PortalProvider, usePortalContext] = createDialogContext(PORTAL_NAME$1, {
 var DialogPortal = (props)=>{
     const { __scopeDialog, forceMount, children, container } = props;
     const context = useDialogContext(PORTAL_NAME$1, __scopeDialog);
-    return /* @__PURE__ */ jsx(PortalProvider, {
+    return /* @__PURE__ */ jsx$1(PortalProvider, {
         scope: __scopeDialog,
         forceMount,
-        children: React.Children.map(children, (child)=>/* @__PURE__ */ jsx(Presence, {
+        children: React.Children.map(children, (child)=>/* @__PURE__ */ jsx$1(Presence, {
                 present: forceMount || context.open,
-                children: /* @__PURE__ */ jsx(Portal$3, {
+                children: /* @__PURE__ */ jsx$1(Portal$3, {
                     asChild: true,
                     container,
                     children: child
@@ -19750,9 +20281,9 @@ var DialogOverlay = React.forwardRef((props, forwardedRef)=>{
     const portalContext = usePortalContext(OVERLAY_NAME, props.__scopeDialog);
     const { forceMount = portalContext.forceMount, ...overlayProps } = props;
     const context = useDialogContext(OVERLAY_NAME, props.__scopeDialog);
-    return context.modal ? /* @__PURE__ */ jsx(Presence, {
+    return context.modal ? /* @__PURE__ */ jsx$1(Presence, {
         present: forceMount || context.open,
-        children: /* @__PURE__ */ jsx(DialogOverlayImpl, {
+        children: /* @__PURE__ */ jsx$1(DialogOverlayImpl, {
             ...overlayProps,
             ref: forwardedRef
         })
@@ -19765,14 +20296,14 @@ var DialogOverlayImpl = React.forwardRef((props, forwardedRef)=>{
     const context = useDialogContext(OVERLAY_NAME, __scopeDialog);
     return(// Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`
     // ie. when `Overlay` and `Content` are siblings
-    /* @__PURE__ */ jsx(ReactRemoveScroll, {
+    /* @__PURE__ */ jsx$1(ReactRemoveScroll, {
         as: Slot$1,
         allowPinchZoom: true,
         shards: [
             context.contentRef
         ],
-        children: /* @__PURE__ */ jsx(Primitive.div, {
-            "data-state": getState$1(context.open),
+        children: /* @__PURE__ */ jsx$1(Primitive.div, {
+            "data-state": getState(context.open),
             ...overlayProps,
             ref: forwardedRef,
             style: {
@@ -19787,12 +20318,12 @@ var DialogContent = React.forwardRef((props, forwardedRef)=>{
     const portalContext = usePortalContext(CONTENT_NAME$2, props.__scopeDialog);
     const { forceMount = portalContext.forceMount, ...contentProps } = props;
     const context = useDialogContext(CONTENT_NAME$2, props.__scopeDialog);
-    return /* @__PURE__ */ jsx(Presence, {
+    return /* @__PURE__ */ jsx$1(Presence, {
         present: forceMount || context.open,
-        children: context.modal ? /* @__PURE__ */ jsx(DialogContentModal, {
+        children: context.modal ? /* @__PURE__ */ jsx$1(DialogContentModal, {
             ...contentProps,
             ref: forwardedRef
-        }) : /* @__PURE__ */ jsx(DialogContentNonModal, {
+        }) : /* @__PURE__ */ jsx$1(DialogContentNonModal, {
             ...contentProps,
             ref: forwardedRef
         })
@@ -19807,7 +20338,7 @@ var DialogContentModal = React.forwardRef((props, forwardedRef)=>{
         const content = contentRef.current;
         if (content) return hideOthers(content);
     }, []);
-    return /* @__PURE__ */ jsx(DialogContentImpl, {
+    return /* @__PURE__ */ jsx$1(DialogContentImpl, {
         ...props,
         ref: composedRefs,
         trapFocus: context.open,
@@ -19829,7 +20360,7 @@ var DialogContentNonModal = React.forwardRef((props, forwardedRef)=>{
     const context = useDialogContext(CONTENT_NAME$2, props.__scopeDialog);
     const hasInteractedOutsideRef = React.useRef(false);
     const hasPointerDownOutsideRef = React.useRef(false);
-    return /* @__PURE__ */ jsx(DialogContentImpl, {
+    return /* @__PURE__ */ jsx$1(DialogContentImpl, {
         ...props,
         ref: forwardedRef,
         trapFocus: false,
@@ -19868,18 +20399,18 @@ var DialogContentImpl = React.forwardRef((props, forwardedRef)=>{
     useFocusGuards();
     return /* @__PURE__ */ jsxs(Fragment, {
         children: [
-            /* @__PURE__ */ jsx(FocusScope, {
+            /* @__PURE__ */ jsx$1(FocusScope, {
                 asChild: true,
                 loop: true,
                 trapped: trapFocus,
                 onMountAutoFocus: onOpenAutoFocus,
                 onUnmountAutoFocus: onCloseAutoFocus,
-                children: /* @__PURE__ */ jsx(DismissableLayer, {
+                children: /* @__PURE__ */ jsx$1(DismissableLayer, {
                     role: "dialog",
                     id: context.contentId,
                     "aria-describedby": context.descriptionId,
                     "aria-labelledby": context.titleId,
-                    "data-state": getState$1(context.open),
+                    "data-state": getState(context.open),
                     ...contentProps,
                     ref: composedRefs,
                     onDismiss: ()=>context.onOpenChange(false)
@@ -19887,10 +20418,10 @@ var DialogContentImpl = React.forwardRef((props, forwardedRef)=>{
             }),
             /* @__PURE__ */ jsxs(Fragment, {
                 children: [
-                    /* @__PURE__ */ jsx(TitleWarning, {
+                    /* @__PURE__ */ jsx$1(TitleWarning, {
                         titleId: context.titleId
                     }),
-                    /* @__PURE__ */ jsx(DescriptionWarning, {
+                    /* @__PURE__ */ jsx$1(DescriptionWarning, {
                         contentRef,
                         descriptionId: context.descriptionId
                     })
@@ -19903,7 +20434,7 @@ var TITLE_NAME = "DialogTitle";
 var DialogTitle = React.forwardRef((props, forwardedRef)=>{
     const { __scopeDialog, ...titleProps } = props;
     const context = useDialogContext(TITLE_NAME, __scopeDialog);
-    return /* @__PURE__ */ jsx(Primitive.h2, {
+    return /* @__PURE__ */ jsx$1(Primitive.h2, {
         id: context.titleId,
         ...titleProps,
         ref: forwardedRef
@@ -19914,7 +20445,7 @@ var DESCRIPTION_NAME = "DialogDescription";
 var DialogDescription = React.forwardRef((props, forwardedRef)=>{
     const { __scopeDialog, ...descriptionProps } = props;
     const context = useDialogContext(DESCRIPTION_NAME, __scopeDialog);
-    return /* @__PURE__ */ jsx(Primitive.p, {
+    return /* @__PURE__ */ jsx$1(Primitive.p, {
         id: context.descriptionId,
         ...descriptionProps,
         ref: forwardedRef
@@ -19925,7 +20456,7 @@ var CLOSE_NAME = "DialogClose";
 var DialogClose = React.forwardRef((props, forwardedRef)=>{
     const { __scopeDialog, ...closeProps } = props;
     const context = useDialogContext(CLOSE_NAME, __scopeDialog);
-    return /* @__PURE__ */ jsx(Primitive.button, {
+    return /* @__PURE__ */ jsx$1(Primitive.button, {
         type: "button",
         ...closeProps,
         ref: forwardedRef,
@@ -19933,7 +20464,7 @@ var DialogClose = React.forwardRef((props, forwardedRef)=>{
     });
 });
 DialogClose.displayName = CLOSE_NAME;
-function getState$1(open) {
+function getState(open) {
     return open ? "open" : "closed";
 }
 var TITLE_WARNING_NAME = "DialogTitleWarning";
@@ -20881,7 +21412,7 @@ function createCollection(name) {
         const { scope, children } = props;
         const ref = React__default.useRef(null);
         const itemMap = React__default.useRef(/* @__PURE__ */ new Map()).current;
-        return /* @__PURE__ */ jsx(CollectionProviderImpl, {
+        return /* @__PURE__ */ jsx$1(CollectionProviderImpl, {
             scope,
             itemMap,
             collectionRef: ref,
@@ -20895,7 +21426,7 @@ function createCollection(name) {
         const { scope, children } = props;
         const context = useCollectionContext(COLLECTION_SLOT_NAME, scope);
         const composedRefs = useComposedRefs$1(forwardedRef, context.collectionRef);
-        return /* @__PURE__ */ jsx(CollectionSlotImpl, {
+        return /* @__PURE__ */ jsx$1(CollectionSlotImpl, {
             ref: composedRefs,
             children
         });
@@ -20916,7 +21447,7 @@ function createCollection(name) {
             });
             return ()=>void context.itemMap.delete(ref);
         });
-        return /* @__PURE__ */ jsx(CollectionItemSlotImpl, {
+        return /* @__PURE__ */ jsx$1(CollectionItemSlotImpl, {
             ...{
                 [ITEM_DATA_ATTR]: ""
             },
@@ -23019,14 +23550,14 @@ function useLatestRef(value) {
 var NAME$1 = "Arrow";
 var Arrow$1 = React.forwardRef((props, forwardedRef)=>{
     const { children, width = 10, height = 5, ...arrowProps } = props;
-    return /* @__PURE__ */ jsx(Primitive.svg, {
+    return /* @__PURE__ */ jsx$1(Primitive.svg, {
         ...arrowProps,
         ref: forwardedRef,
         width,
         height,
         viewBox: "0 0 30 10",
         preserveAspectRatio: "none",
-        children: props.asChild ? children : /* @__PURE__ */ jsx("polygon", {
+        children: props.asChild ? children : /* @__PURE__ */ jsx$1("polygon", {
             points: "0,0 30,0 15,10"
         })
     });
@@ -23086,7 +23617,7 @@ var [PopperProvider, usePopperContext] = createPopperContext(POPPER_NAME);
 var Popper = (props)=>{
     const { __scopePopper, children } = props;
     const [anchor, setAnchor] = React.useState(null);
-    return /* @__PURE__ */ jsx(PopperProvider, {
+    return /* @__PURE__ */ jsx$1(PopperProvider, {
         scope: __scopePopper,
         anchor,
         onAnchorChange: setAnchor,
@@ -23108,7 +23639,7 @@ var PopperAnchor = React.forwardRef((props, forwardedRef)=>{
             context.onAnchorChange(anchorRef.current);
         }
     });
-    return virtualRef ? null : /* @__PURE__ */ jsx(Primitive.div, {
+    return virtualRef ? null : /* @__PURE__ */ jsx$1(Primitive.div, {
         ...anchorProps,
         ref: composedRefs
     });
@@ -23214,7 +23745,7 @@ var PopperContent = React.forwardRef((props, forwardedRef)=>{
     }, [
         content
     ]);
-    return /* @__PURE__ */ jsx("div", {
+    return /* @__PURE__ */ jsx$1("div", {
         ref: refs.setFloating,
         "data-radix-popper-content-wrapper": "",
         style: {
@@ -23236,14 +23767,14 @@ var PopperContent = React.forwardRef((props, forwardedRef)=>{
             }
         },
         dir: props.dir,
-        children: /* @__PURE__ */ jsx(PopperContentProvider, {
+        children: /* @__PURE__ */ jsx$1(PopperContentProvider, {
             scope: __scopePopper,
             placedSide,
             onArrowChange: setArrow,
             arrowX,
             arrowY,
             shouldHideArrow: cannotCenterArrow,
-            children: /* @__PURE__ */ jsx(Primitive.div, {
+            children: /* @__PURE__ */ jsx$1(Primitive.div, {
                 "data-side": placedSide,
                 "data-align": placedAlign,
                 ...contentProps,
@@ -23273,7 +23804,7 @@ var PopperArrow = React.forwardRef(function PopperArrow2(props, forwardedRef) {
     return(// we have to use an extra wrapper because `ResizeObserver` (used by `useSize`)
     // doesn't report size as we'd expect on SVG elements.
     // it reports their bounding box which is effectively the largest path inside the SVG.
-    /* @__PURE__ */ jsx("span", {
+    /* @__PURE__ */ jsx$1("span", {
         ref: contentContext.onArrowChange,
         style: {
             position: "absolute",
@@ -23294,7 +23825,7 @@ var PopperArrow = React.forwardRef(function PopperArrow2(props, forwardedRef) {
             }[contentContext.placedSide],
             visibility: contentContext.shouldHideArrow ? "hidden" : void 0
         },
-        children: /* @__PURE__ */ jsx(Root$1, {
+        children: /* @__PURE__ */ jsx$1(Root$1, {
             ...arrowProps,
             ref: forwardedRef,
             style: {
@@ -23394,7 +23925,7 @@ var VISUALLY_HIDDEN_STYLES = Object.freeze({
 });
 var NAME = "VisuallyHidden";
 var VisuallyHidden = React.forwardRef((props, forwardedRef)=>{
-    return /* @__PURE__ */ jsx(Primitive.span, {
+    return /* @__PURE__ */ jsx$1(Primitive.span, {
         ...props,
         ref: forwardedRef,
         style: {
@@ -23447,7 +23978,7 @@ var Select$1 = (props)=>{
     const isFormControl = trigger ? form || !!trigger.closest("form") : true;
     const [nativeOptionsSet, setNativeOptionsSet] = React.useState(/* @__PURE__ */ new Set());
     const nativeSelectKey = Array.from(nativeOptionsSet).map((option)=>option.props.value).join(";");
-    return /* @__PURE__ */ jsx(Root2$1, {
+    return /* @__PURE__ */ jsx$1(Root2$1, {
         ...popperScope,
         children: /* @__PURE__ */ jsxs(SelectProvider, {
             required,
@@ -23467,9 +23998,9 @@ var Select$1 = (props)=>{
             triggerPointerDownPosRef,
             disabled,
             children: [
-                /* @__PURE__ */ jsx(Collection.Provider, {
+                /* @__PURE__ */ jsx$1(Collection.Provider, {
                     scope: __scopeSelect,
-                    children: /* @__PURE__ */ jsx(SelectNativeOptionsProvider, {
+                    children: /* @__PURE__ */ jsx$1(SelectNativeOptionsProvider, {
                         scope: props.__scopeSelect,
                         onNativeOptionAdd: React.useCallback((option)=>{
                             setNativeOptionsSet((prev)=>new Set(prev).add(option));
@@ -23495,7 +24026,7 @@ var Select$1 = (props)=>{
                     disabled,
                     form,
                     children: [
-                        value === void 0 ? /* @__PURE__ */ jsx("option", {
+                        value === void 0 ? /* @__PURE__ */ jsx$1("option", {
                             value: ""
                         }) : null,
                         Array.from(nativeOptionsSet)
@@ -23506,11 +24037,11 @@ var Select$1 = (props)=>{
     });
 };
 Select$1.displayName = SELECT_NAME;
-var TRIGGER_NAME$1 = "SelectTrigger";
+var TRIGGER_NAME = "SelectTrigger";
 var SelectTrigger$1 = React.forwardRef((props, forwardedRef)=>{
     const { __scopeSelect, disabled = false, ...triggerProps } = props;
     const popperScope = usePopperScope(__scopeSelect);
-    const context = useSelectContext(TRIGGER_NAME$1, __scopeSelect);
+    const context = useSelectContext(TRIGGER_NAME, __scopeSelect);
     const isDisabled = context.disabled || disabled;
     const composedRefs = useComposedRefs$1(forwardedRef, context.onTriggerChange);
     const getItems = useCollection(__scopeSelect);
@@ -23535,10 +24066,10 @@ var SelectTrigger$1 = React.forwardRef((props, forwardedRef)=>{
             };
         }
     };
-    return /* @__PURE__ */ jsx(Anchor, {
+    return /* @__PURE__ */ jsx$1(Anchor, {
         asChild: true,
         ...popperScope,
-        children: /* @__PURE__ */ jsx(Primitive.button, {
+        children: /* @__PURE__ */ jsx$1(Primitive.button, {
             type: "button",
             role: "combobox",
             "aria-controls": context.contentId,
@@ -23582,7 +24113,7 @@ var SelectTrigger$1 = React.forwardRef((props, forwardedRef)=>{
         })
     });
 });
-SelectTrigger$1.displayName = TRIGGER_NAME$1;
+SelectTrigger$1.displayName = TRIGGER_NAME;
 var VALUE_NAME = "SelectValue";
 var SelectValue$1 = React.forwardRef((props, forwardedRef)=>{
     const { __scopeSelect, className, style, children, placeholder = "", ...valueProps } = props;
@@ -23596,13 +24127,13 @@ var SelectValue$1 = React.forwardRef((props, forwardedRef)=>{
         onValueNodeHasChildrenChange,
         hasChildren
     ]);
-    return /* @__PURE__ */ jsx(Primitive.span, {
+    return /* @__PURE__ */ jsx$1(Primitive.span, {
         ...valueProps,
         ref: composedRefs,
         style: {
             pointerEvents: "none"
         },
-        children: shouldShowPlaceholder(context.value) ? /* @__PURE__ */ jsx(Fragment, {
+        children: shouldShowPlaceholder(context.value) ? /* @__PURE__ */ jsx$1(Fragment, {
             children: placeholder
         }) : children
     });
@@ -23611,7 +24142,7 @@ SelectValue$1.displayName = VALUE_NAME;
 var ICON_NAME = "SelectIcon";
 var SelectIcon$1 = React.forwardRef((props, forwardedRef)=>{
     const { __scopeSelect, children, ...iconProps } = props;
-    return /* @__PURE__ */ jsx(Primitive.span, {
+    return /* @__PURE__ */ jsx$1(Primitive.span, {
         "aria-hidden": true,
         ...iconProps,
         ref: forwardedRef,
@@ -23621,7 +24152,7 @@ var SelectIcon$1 = React.forwardRef((props, forwardedRef)=>{
 SelectIcon$1.displayName = ICON_NAME;
 var PORTAL_NAME = "SelectPortal";
 var SelectPortal = (props)=>{
-    return /* @__PURE__ */ jsx(Portal$3, {
+    return /* @__PURE__ */ jsx$1(Portal$3, {
         asChild: true,
         ...props
     });
@@ -23636,17 +24167,17 @@ var SelectContent$1 = React.forwardRef((props, forwardedRef)=>{
     }, []);
     if (!context.open) {
         const frag = fragment;
-        return frag ? ReactDOM.createPortal(/* @__PURE__ */ jsx(SelectContentProvider, {
+        return frag ? ReactDOM.createPortal(/* @__PURE__ */ jsx$1(SelectContentProvider, {
             scope: props.__scopeSelect,
-            children: /* @__PURE__ */ jsx(Collection.Slot, {
+            children: /* @__PURE__ */ jsx$1(Collection.Slot, {
                 scope: props.__scopeSelect,
-                children: /* @__PURE__ */ jsx("div", {
+                children: /* @__PURE__ */ jsx$1("div", {
                     children: props.children
                 })
             })
         }), frag) : null;
     }
-    return /* @__PURE__ */ jsx(SelectContentImpl, {
+    return /* @__PURE__ */ jsx$1(SelectContentImpl, {
         ...props,
         ref: forwardedRef
     });
@@ -23807,7 +24338,7 @@ var SelectContentImpl = React.forwardRef((props, forwardedRef)=>{
         hideWhenDetached,
         avoidCollisions
     } : {};
-    return /* @__PURE__ */ jsx(SelectContentProvider, {
+    return /* @__PURE__ */ jsx$1(SelectContentProvider, {
         scope: __scopeSelect,
         content,
         viewport,
@@ -23821,10 +24352,10 @@ var SelectContentImpl = React.forwardRef((props, forwardedRef)=>{
         position,
         isPositioned,
         searchRef,
-        children: /* @__PURE__ */ jsx(ReactRemoveScroll, {
+        children: /* @__PURE__ */ jsx$1(ReactRemoveScroll, {
             as: Slot,
             allowPinchZoom: true,
-            children: /* @__PURE__ */ jsx(FocusScope, {
+            children: /* @__PURE__ */ jsx$1(FocusScope, {
                 asChild: true,
                 trapped: context.open,
                 onMountAutoFocus: (event)=>{
@@ -23836,14 +24367,14 @@ var SelectContentImpl = React.forwardRef((props, forwardedRef)=>{
                     });
                     event.preventDefault();
                 }),
-                children: /* @__PURE__ */ jsx(DismissableLayer, {
+                children: /* @__PURE__ */ jsx$1(DismissableLayer, {
                     asChild: true,
                     disableOutsidePointerEvents: true,
                     onEscapeKeyDown,
                     onPointerDownOutside,
                     onFocusOutside: (event)=>event.preventDefault(),
                     onDismiss: ()=>context.onOpenChange(false),
-                    children: /* @__PURE__ */ jsx(SelectPosition, {
+                    children: /* @__PURE__ */ jsx$1(SelectPosition, {
                         role: "listbox",
                         id: context.contentId,
                         "data-state": context.open ? "open" : "closed",
@@ -24022,12 +24553,12 @@ var SelectItemAlignedPosition = React.forwardRef((props, forwardedRef)=>{
         position,
         focusSelectedItem
     ]);
-    return /* @__PURE__ */ jsx(SelectViewportProvider, {
+    return /* @__PURE__ */ jsx$1(SelectViewportProvider, {
         scope: __scopeSelect,
         contentWrapper,
         shouldExpandOnScrollRef,
         onScrollButtonChange: handleScrollButtonChange,
-        children: /* @__PURE__ */ jsx("div", {
+        children: /* @__PURE__ */ jsx$1("div", {
             ref: setContentWrapper,
             style: {
                 display: "flex",
@@ -24035,7 +24566,7 @@ var SelectItemAlignedPosition = React.forwardRef((props, forwardedRef)=>{
                 position: "fixed",
                 zIndex: contentZIndex
             },
-            children: /* @__PURE__ */ jsx(Primitive.div, {
+            children: /* @__PURE__ */ jsx$1(Primitive.div, {
                 ...popperProps,
                 ref: composedRefs,
                 style: {
@@ -24055,7 +24586,7 @@ var POPPER_POSITION_NAME = "SelectPopperPosition";
 var SelectPopperPosition = React.forwardRef((props, forwardedRef)=>{
     const { __scopeSelect, align = "start", collisionPadding = CONTENT_MARGIN, ...popperProps } = props;
     const popperScope = usePopperScope(__scopeSelect);
-    return /* @__PURE__ */ jsx(Content$1, {
+    return /* @__PURE__ */ jsx$1(Content$1, {
         ...popperScope,
         ...popperProps,
         ref: forwardedRef,
@@ -24087,15 +24618,15 @@ var SelectViewport = React.forwardRef((props, forwardedRef)=>{
     const prevScrollTopRef = React.useRef(0);
     return /* @__PURE__ */ jsxs(Fragment, {
         children: [
-            /* @__PURE__ */ jsx("style", {
+            /* @__PURE__ */ jsx$1("style", {
                 dangerouslySetInnerHTML: {
                     __html: `[data-radix-select-viewport]{scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;}[data-radix-select-viewport]::-webkit-scrollbar{display:none}`
                 },
                 nonce
             }),
-            /* @__PURE__ */ jsx(Collection.Slot, {
+            /* @__PURE__ */ jsx$1(Collection.Slot, {
                 scope: __scopeSelect,
-                children: /* @__PURE__ */ jsx(Primitive.div, {
+                children: /* @__PURE__ */ jsx$1(Primitive.div, {
                     "data-radix-select-viewport": "",
                     role: "presentation",
                     ...viewportProps,
@@ -24148,10 +24679,10 @@ var [SelectGroupContextProvider, useSelectGroupContext] = createSelectContext(GR
 var SelectGroup = React.forwardRef((props, forwardedRef)=>{
     const { __scopeSelect, ...groupProps } = props;
     const groupId = useId();
-    return /* @__PURE__ */ jsx(SelectGroupContextProvider, {
+    return /* @__PURE__ */ jsx$1(SelectGroupContextProvider, {
         scope: __scopeSelect,
         id: groupId,
-        children: /* @__PURE__ */ jsx(Primitive.div, {
+        children: /* @__PURE__ */ jsx$1(Primitive.div, {
             role: "group",
             "aria-labelledby": groupId,
             ...groupProps,
@@ -24164,7 +24695,7 @@ var LABEL_NAME = "SelectLabel";
 var SelectLabel$1 = React.forwardRef((props, forwardedRef)=>{
     const { __scopeSelect, ...labelProps } = props;
     const groupContext = useSelectGroupContext(LABEL_NAME, __scopeSelect);
-    return /* @__PURE__ */ jsx(Primitive.div, {
+    return /* @__PURE__ */ jsx$1(Primitive.div, {
         id: groupContext.id,
         ...labelProps,
         ref: forwardedRef
@@ -24192,7 +24723,7 @@ var SelectItem$1 = React.forwardRef((props, forwardedRef)=>{
     if (value === "") {
         throw new Error("A <Select.Item /> must have a value prop that is not an empty string. This is because the Select value can be set to an empty string to clear the selection and show the placeholder.");
     }
-    return /* @__PURE__ */ jsx(SelectItemContextProvider, {
+    return /* @__PURE__ */ jsx$1(SelectItemContextProvider, {
         scope: __scopeSelect,
         value,
         disabled,
@@ -24201,12 +24732,12 @@ var SelectItem$1 = React.forwardRef((props, forwardedRef)=>{
         onItemTextChange: React.useCallback((node)=>{
             setTextValue((prevTextValue)=>prevTextValue || (node?.textContent ?? "").trim());
         }, []),
-        children: /* @__PURE__ */ jsx(Collection.ItemSlot, {
+        children: /* @__PURE__ */ jsx$1(Collection.ItemSlot, {
             scope: __scopeSelect,
             value,
             disabled,
             textValue,
-            children: /* @__PURE__ */ jsx(Primitive.div, {
+            children: /* @__PURE__ */ jsx$1(Primitive.div, {
                 role: "option",
                 "aria-labelledby": textId,
                 "data-highlighted": isFocused ? "" : void 0,
@@ -24264,7 +24795,7 @@ var SelectItemText = React.forwardRef((props, forwardedRef)=>{
     const [itemTextNode, setItemTextNode] = React.useState(null);
     const composedRefs = useComposedRefs$1(forwardedRef, (node)=>setItemTextNode(node), itemContext.onItemTextChange, (node)=>contentContext.itemTextRefCallback?.(node, itemContext.value, itemContext.disabled));
     const textContent = itemTextNode?.textContent;
-    const nativeOption = React.useMemo(()=>/* @__PURE__ */ jsx("option", {
+    const nativeOption = React.useMemo(()=>/* @__PURE__ */ jsx$1("option", {
             value: itemContext.value,
             disabled: itemContext.disabled,
             children: textContent
@@ -24284,7 +24815,7 @@ var SelectItemText = React.forwardRef((props, forwardedRef)=>{
     ]);
     return /* @__PURE__ */ jsxs(Fragment, {
         children: [
-            /* @__PURE__ */ jsx(Primitive.span, {
+            /* @__PURE__ */ jsx$1(Primitive.span, {
                 id: itemContext.textId,
                 ...itemTextProps,
                 ref: composedRefs
@@ -24298,7 +24829,7 @@ var ITEM_INDICATOR_NAME = "SelectItemIndicator";
 var SelectItemIndicator$1 = React.forwardRef((props, forwardedRef)=>{
     const { __scopeSelect, ...itemIndicatorProps } = props;
     const itemContext = useSelectItemContext(ITEM_INDICATOR_NAME, __scopeSelect);
-    return itemContext.isSelected ? /* @__PURE__ */ jsx(Primitive.span, {
+    return itemContext.isSelected ? /* @__PURE__ */ jsx$1(Primitive.span, {
         "aria-hidden": true,
         ...itemIndicatorProps,
         ref: forwardedRef
@@ -24326,7 +24857,7 @@ var SelectScrollUpButton$1 = React.forwardRef((props, forwardedRef)=>{
         contentContext.viewport,
         contentContext.isPositioned
     ]);
-    return canScrollUp ? /* @__PURE__ */ jsx(SelectScrollButtonImpl, {
+    return canScrollUp ? /* @__PURE__ */ jsx$1(SelectScrollButtonImpl, {
         ...props,
         ref: composedRefs,
         onAutoScroll: ()=>{
@@ -24360,7 +24891,7 @@ var SelectScrollDownButton$1 = React.forwardRef((props, forwardedRef)=>{
         contentContext.viewport,
         contentContext.isPositioned
     ]);
-    return canScrollDown ? /* @__PURE__ */ jsx(SelectScrollButtonImpl, {
+    return canScrollDown ? /* @__PURE__ */ jsx$1(SelectScrollButtonImpl, {
         ...props,
         ref: composedRefs,
         onAutoScroll: ()=>{
@@ -24396,7 +24927,7 @@ var SelectScrollButtonImpl = React.forwardRef((props, forwardedRef)=>{
     }, [
         getItems
     ]);
-    return /* @__PURE__ */ jsx(Primitive.div, {
+    return /* @__PURE__ */ jsx$1(Primitive.div, {
         "aria-hidden": true,
         ...scrollIndicatorProps,
         ref: forwardedRef,
@@ -24423,7 +24954,7 @@ var SelectScrollButtonImpl = React.forwardRef((props, forwardedRef)=>{
 var SEPARATOR_NAME = "SelectSeparator";
 var SelectSeparator$1 = React.forwardRef((props, forwardedRef)=>{
     const { __scopeSelect, ...separatorProps } = props;
-    return /* @__PURE__ */ jsx(Primitive.div, {
+    return /* @__PURE__ */ jsx$1(Primitive.div, {
         "aria-hidden": true,
         ...separatorProps,
         ref: forwardedRef
@@ -24436,14 +24967,14 @@ var SelectArrow = React.forwardRef((props, forwardedRef)=>{
     const popperScope = usePopperScope(__scopeSelect);
     const context = useSelectContext(ARROW_NAME, __scopeSelect);
     const contentContext = useSelectContentContext(ARROW_NAME, __scopeSelect);
-    return context.open && contentContext.position === "popper" ? /* @__PURE__ */ jsx(Arrow, {
+    return context.open && contentContext.position === "popper" ? /* @__PURE__ */ jsx$1(Arrow, {
         ...popperScope,
         ...arrowProps,
         ref: forwardedRef
     }) : null;
 });
 SelectArrow.displayName = ARROW_NAME;
-var BUBBLE_INPUT_NAME$1 = "SelectBubbleInput";
+var BUBBLE_INPUT_NAME = "SelectBubbleInput";
 var SelectBubbleInput = React.forwardRef(({ __scopeSelect, value, ...props }, forwardedRef)=>{
     const ref = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, ref);
@@ -24465,7 +24996,7 @@ var SelectBubbleInput = React.forwardRef(({ __scopeSelect, value, ...props }, fo
         prevValue,
         value
     ]);
-    return /* @__PURE__ */ jsx(Primitive.select, {
+    return /* @__PURE__ */ jsx$1(Primitive.select, {
         ...props,
         style: {
             ...VISUALLY_HIDDEN_STYLES,
@@ -24475,7 +25006,7 @@ var SelectBubbleInput = React.forwardRef(({ __scopeSelect, value, ...props }, fo
         defaultValue: value
     });
 });
-SelectBubbleInput.displayName = BUBBLE_INPUT_NAME$1;
+SelectBubbleInput.displayName = BUBBLE_INPUT_NAME;
 function shouldShowPlaceholder(value) {
     return value === "" || value === void 0;
 }
@@ -24935,240 +25466,6 @@ const FileSelector = ({ files, currentFile, onFileSelect, onRefresh, loading = f
     }, loading ? /*#__PURE__*/ React__default.createElement(LoadingIcon, null) : /*#__PURE__*/ React__default.createElement(RefreshIcon, null)));
 };
 
-var CHECKBOX_NAME = "Checkbox";
-var [createCheckboxContext] = createContextScope(CHECKBOX_NAME);
-var [CheckboxProviderImpl, useCheckboxContext] = createCheckboxContext(CHECKBOX_NAME);
-function CheckboxProvider(props) {
-    const { __scopeCheckbox, checked: checkedProp, children, defaultChecked, disabled, form, name, onCheckedChange, required, value = "on", // @ts-expect-error
-    internal_do_not_use_render } = props;
-    const [checked, setChecked] = useControllableState$1({
-        prop: checkedProp,
-        defaultProp: defaultChecked ?? false,
-        onChange: onCheckedChange,
-        caller: CHECKBOX_NAME
-    });
-    const [control, setControl] = React.useState(null);
-    const [bubbleInput, setBubbleInput] = React.useState(null);
-    const hasConsumerStoppedPropagationRef = React.useRef(false);
-    const isFormControl = control ? !!form || !!control.closest("form") : // We set this to true by default so that events bubble to forms without JS (SSR)
-    true;
-    const context = {
-        checked,
-        disabled,
-        setChecked,
-        control,
-        setControl,
-        name,
-        form,
-        value,
-        hasConsumerStoppedPropagationRef,
-        required,
-        defaultChecked: isIndeterminate(defaultChecked) ? false : defaultChecked,
-        isFormControl,
-        bubbleInput,
-        setBubbleInput
-    };
-    return /* @__PURE__ */ jsx(CheckboxProviderImpl, {
-        scope: __scopeCheckbox,
-        ...context,
-        children: isFunction(internal_do_not_use_render) ? internal_do_not_use_render(context) : children
-    });
-}
-var TRIGGER_NAME = "CheckboxTrigger";
-var CheckboxTrigger = React.forwardRef(({ __scopeCheckbox, onKeyDown, onClick, ...checkboxProps }, forwardedRef)=>{
-    const { control, value, disabled, checked, required, setControl, setChecked, hasConsumerStoppedPropagationRef, isFormControl, bubbleInput } = useCheckboxContext(TRIGGER_NAME, __scopeCheckbox);
-    const composedRefs = useComposedRefs$1(forwardedRef, setControl);
-    const initialCheckedStateRef = React.useRef(checked);
-    React.useEffect(()=>{
-        const form = control?.form;
-        if (form) {
-            const reset = ()=>setChecked(initialCheckedStateRef.current);
-            form.addEventListener("reset", reset);
-            return ()=>form.removeEventListener("reset", reset);
-        }
-    }, [
-        control,
-        setChecked
-    ]);
-    return /* @__PURE__ */ jsx(Primitive.button, {
-        type: "button",
-        role: "checkbox",
-        "aria-checked": isIndeterminate(checked) ? "mixed" : checked,
-        "aria-required": required,
-        "data-state": getState(checked),
-        "data-disabled": disabled ? "" : void 0,
-        disabled,
-        value,
-        ...checkboxProps,
-        ref: composedRefs,
-        onKeyDown: composeEventHandlers(onKeyDown, (event)=>{
-            if (event.key === "Enter") event.preventDefault();
-        }),
-        onClick: composeEventHandlers(onClick, (event)=>{
-            setChecked((prevChecked)=>isIndeterminate(prevChecked) ? true : !prevChecked);
-            if (bubbleInput && isFormControl) {
-                hasConsumerStoppedPropagationRef.current = event.isPropagationStopped();
-                if (!hasConsumerStoppedPropagationRef.current) event.stopPropagation();
-            }
-        })
-    });
-});
-CheckboxTrigger.displayName = TRIGGER_NAME;
-var Checkbox$1 = React.forwardRef((props, forwardedRef)=>{
-    const { __scopeCheckbox, name, checked, defaultChecked, required, disabled, value, onCheckedChange, form, ...checkboxProps } = props;
-    return /* @__PURE__ */ jsx(CheckboxProvider, {
-        __scopeCheckbox,
-        checked,
-        defaultChecked,
-        disabled,
-        required,
-        onCheckedChange,
-        name,
-        form,
-        value,
-        internal_do_not_use_render: ({ isFormControl })=>/* @__PURE__ */ jsxs(Fragment, {
-                children: [
-                    /* @__PURE__ */ jsx(CheckboxTrigger, {
-                        ...checkboxProps,
-                        ref: forwardedRef,
-                        __scopeCheckbox
-                    }),
-                    isFormControl && /* @__PURE__ */ jsx(CheckboxBubbleInput, {
-                        __scopeCheckbox
-                    })
-                ]
-            })
-    });
-});
-Checkbox$1.displayName = CHECKBOX_NAME;
-var INDICATOR_NAME = "CheckboxIndicator";
-var CheckboxIndicator$1 = React.forwardRef((props, forwardedRef)=>{
-    const { __scopeCheckbox, forceMount, ...indicatorProps } = props;
-    const context = useCheckboxContext(INDICATOR_NAME, __scopeCheckbox);
-    return /* @__PURE__ */ jsx(Presence, {
-        present: forceMount || isIndeterminate(context.checked) || context.checked === true,
-        children: /* @__PURE__ */ jsx(Primitive.span, {
-            "data-state": getState(context.checked),
-            "data-disabled": context.disabled ? "" : void 0,
-            ...indicatorProps,
-            ref: forwardedRef,
-            style: {
-                pointerEvents: "none",
-                ...props.style
-            }
-        })
-    });
-});
-CheckboxIndicator$1.displayName = INDICATOR_NAME;
-var BUBBLE_INPUT_NAME = "CheckboxBubbleInput";
-var CheckboxBubbleInput = React.forwardRef(({ __scopeCheckbox, ...props }, forwardedRef)=>{
-    const { control, hasConsumerStoppedPropagationRef, checked, defaultChecked, required, disabled, name, value, form, bubbleInput, setBubbleInput } = useCheckboxContext(BUBBLE_INPUT_NAME, __scopeCheckbox);
-    const composedRefs = useComposedRefs$1(forwardedRef, setBubbleInput);
-    const prevChecked = usePrevious(checked);
-    const controlSize = useSize(control);
-    React.useEffect(()=>{
-        const input = bubbleInput;
-        if (!input) return;
-        const inputProto = window.HTMLInputElement.prototype;
-        const descriptor = Object.getOwnPropertyDescriptor(inputProto, "checked");
-        const setChecked = descriptor.set;
-        const bubbles = !hasConsumerStoppedPropagationRef.current;
-        if (prevChecked !== checked && setChecked) {
-            const event = new Event("click", {
-                bubbles
-            });
-            input.indeterminate = isIndeterminate(checked);
-            setChecked.call(input, isIndeterminate(checked) ? false : checked);
-            input.dispatchEvent(event);
-        }
-    }, [
-        bubbleInput,
-        prevChecked,
-        checked,
-        hasConsumerStoppedPropagationRef
-    ]);
-    const defaultCheckedRef = React.useRef(isIndeterminate(checked) ? false : checked);
-    return /* @__PURE__ */ jsx(Primitive.input, {
-        type: "checkbox",
-        "aria-hidden": true,
-        defaultChecked: defaultChecked ?? defaultCheckedRef.current,
-        required,
-        disabled,
-        name,
-        value,
-        form,
-        ...props,
-        tabIndex: -1,
-        ref: composedRefs,
-        style: {
-            ...props.style,
-            ...controlSize,
-            position: "absolute",
-            pointerEvents: "none",
-            opacity: 0,
-            margin: 0,
-            // We transform because the input is absolutely positioned but we have
-            // rendered it **after** the button. This pulls it back to sit on top
-            // of the button.
-            transform: "translateX(-100%)"
-        }
-    });
-});
-CheckboxBubbleInput.displayName = BUBBLE_INPUT_NAME;
-function isFunction(value) {
-    return typeof value === "function";
-}
-function isIndeterminate(checked) {
-    return checked === "indeterminate";
-}
-function getState(checked) {
-    return isIndeterminate(checked) ? "indeterminate" : checked ? "checked" : "unchecked";
-}
-
-const CheckboxRoot = styled(Checkbox$1)`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  height: 1rem;
-  width: 1rem;
-  flex-shrink: 0;
-  border-radius: 0.125rem;
-  border: 1px solid #6366f1;
-  background-color: transparent;
-  outline: none;
-  transition: all 0.2s ease-in-out;
-
-  &:focus-visible {
-    outline: none;
-    box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
-  }
-
-  &:disabled {
-    cursor: not-allowed;
-    opacity: 0.5;
-  }
-
-  &[data-state="checked"] {
-    background-color: #6366f1;
-    color: white;
-  }
-`;
-const CheckboxIndicator = styled(CheckboxIndicator$1)`
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: currentColor;
-`;
-const CheckIcon = styled(Check)`
-  height: 1rem;
-  width: 1rem;
-`;
-const Checkbox = /*#__PURE__*/ React.forwardRef(({ className, ...props }, ref)=>/*#__PURE__*/ React.createElement(CheckboxRoot, {
-        ref: ref,
-        ...props
-    }, /*#__PURE__*/ React.createElement(CheckboxIndicator, null, /*#__PURE__*/ React.createElement(CheckIcon, null))));
-Checkbox.displayName = Checkbox$1.displayName;
-
 function __insertCSS(code) {
     if (typeof document == 'undefined') return;
     let head = document.head || document.getElementsByTagName('head')[0];
@@ -26791,7 +27088,7 @@ const DrawerOverlay = /*#__PURE__*/ React.forwardRef(({ className, ...props }, r
             bottom: 0,
             left: 0,
             zIndex: 50,
-            backgroundColor: "rgba(0, 0, 0, 0.8)"
+            backgroundColor: "rgba(0, 0, 0, 0.3)"
         },
         className: className,
         ...props
@@ -26850,7 +27147,183 @@ const DrawerDescription = /*#__PURE__*/ React.forwardRef(({ className, ...props
 DrawerDescription.displayName = Drawer$1.Description.displayName;
 
 const GlobalStyles = ()=>{
-    return null;
+    const systemFontStack = '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji"';
+    return /*#__PURE__*/ React__default.createElement(Global, {
+        styles: css`
+        * {
+          box-sizing: border-box;
+          border-color: #e5e7eb;
+          font-family: ${systemFontStack};
+        }
+
+        html,
+        body {
+          margin: 0;
+          padding: 0;
+          background-color: #ffffff;
+          color: #1f2937;
+          font-family: ${systemFontStack};
+          line-height: 1.5;
+          -webkit-font-smoothing: antialiased;
+          -moz-osx-font-smoothing: grayscale;
+          transition:
+            background-color 0.2s ease-in-out,
+            color 0.2s ease-in-out;
+        }
+
+        /* Dark theme styles */
+        html.dark,
+        html.dark body {
+          background-color: #0f172a;
+          color: #f1f5f9;
+        }
+
+        /* XYFlow overrides */
+        .react-flow__edge {
+          cursor: default !important;
+        }
+
+        .react-flow__edge-path {
+          cursor: default !important;
+        }
+
+        .react-flow__edge-label {
+          font-size: 10px;
+          background: white;
+          padding: 2px 4px;
+          border-radius: 4px;
+          border: 1px solid #e5e7eb;
+          max-width: 150px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+        }
+
+        /* Dark theme XYFlow overrides */
+        html.dark .react-flow__edge-label {
+          background: #1e293b;
+          border: 1px solid #475569;
+          color: #f1f5f9;
+        }
+
+        /* Radix UI Select styles */
+        [data-radix-select-trigger],
+        .shadcn-select {
+          display: flex;
+          height: 2.5rem;
+          width: 100%;
+          align-items: center;
+          justify-content: space-between;
+          border-radius: 0.375rem;
+          border: 1px solid #e5e7eb;
+          background-color: #ffffff;
+          padding: 0.5rem 0.75rem;
+          font-size: 0.875rem;
+          line-height: 1.25rem;
+          outline: none;
+          transition: all 0.2s ease-in-out;
+        }
+
+        /* Dark theme select styles */
+        html.dark [data-radix-select-trigger],
+        html.dark .shadcn-select {
+          border: 1px solid #475569;
+          background-color: #1e293b;
+          color: #f1f5f9;
+        }
+
+        [data-radix-select-trigger]:focus,
+        .shadcn-select:focus {
+          outline: none;
+          box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
+        }
+
+        [data-radix-select-trigger]:disabled,
+        .shadcn-select:disabled {
+          cursor: not-allowed;
+          opacity: 0.5;
+        }
+
+        /* File selector refresh button styles */
+        .file-selector-refresh-btn {
+          padding: 0.5rem;
+          border-radius: 0.375rem;
+          border: 1px solid #e5e7eb;
+          background-color: #ffffff;
+          transition: all 0.2s ease-in-out;
+        }
+
+        .file-selector-refresh-btn:hover {
+          background-color: #f3f4f6;
+          color: #374151;
+        }
+
+        .file-selector-refresh-btn:disabled {
+          opacity: 0.5;
+          cursor: not-allowed;
+        }
+
+        /* Dark theme file selector refresh button */
+        html.dark .file-selector-refresh-btn {
+          border: 1px solid #475569;
+          background-color: #1e293b;
+          color: #f1f5f9;
+        }
+
+        html.dark .file-selector-refresh-btn:hover {
+          background-color: #334155;
+          color: #f1f5f9;
+        }
+
+        /* CSS Variables for backward compatibility */
+        :root {
+          --background: #ffffff;
+          --foreground: #1f2937;
+          --card: #ffffff;
+          --card-foreground: #1f2937;
+          --popover: #ffffff;
+          --popover-foreground: #1f2937;
+          --primary: #6366f1;
+          --primary-foreground: #ffffff;
+          --secondary: #f3f4f6;
+          --secondary-foreground: #1f2937;
+          --muted: #f3f4f6;
+          --muted-foreground: #6b7280;
+          --accent: #f3f4f6;
+          --accent-foreground: #1f2937;
+          --destructive: #ef4444;
+          --destructive-foreground: #ffffff;
+          --border: #e5e7eb;
+          --input: #e5e7eb;
+          --ring: #6366f1;
+          --radius: 0.5rem;
+        }
+
+        /* Dark theme CSS variables */
+        html.dark {
+          --background: #0f172a;
+          --foreground: #f1f5f9;
+          --card: #1e293b;
+          --card-foreground: #f1f5f9;
+          --popover: #1e293b;
+          --popover-foreground: #f1f5f9;
+          --primary: #6366f1;
+          --primary-foreground: #ffffff;
+          --secondary: #334155;
+          --secondary-foreground: #f1f5f9;
+          --muted: #334155;
+          --muted-foreground: #94a3b8;
+          --accent: #334155;
+          --accent-foreground: #f1f5f9;
+          --destructive: #ef4444;
+          --destructive-foreground: #ffffff;
+          --border: #475569;
+          --input: #475569;
+          --ring: #6366f1;
+          --radius: 0.5rem;
+        }
+      `
+    });
 };
 
 /**
@@ -26989,4 +27462,4 @@ const GlobalStyles = ()=>{
         return getSafeColor(props.theme, path, fallback);
     };
 
-export { AgenticFlowVisualizer, AnthropicIcon, Badge, Checkbox, Drawer, Edge, FileSelector, GlobalStyles, GoogleIcon, JsonTreeViewer, Node$1 as Node, OpenAIIcon, SafeThemeProvider, Select, Sheet, ThemeProvider, Timeline, Visualizer, calculateAutoLayout, cn, conditionalStyle, createSafeTheme, darkTheme, defaultTheme, detectContentType, formatCurrency, formatLatency, formatToolCalls, getColor, getSafeColor, getSafeSpacing, getSafeThemeValue, getSpacing, lightTheme, safeStyled, safeThemeColor, safeThemeSpacing, safeThemeValue, toTitleCase, truncateText, useComponentTheme, useSafeTheme, useTheme, useThemeValue };
+export { AgenticFlowVisualizer, AnthropicIcon, Badge, Drawer, Edge, FileSelector, GlobalStyles, GoogleIcon, JsonTreeViewer, Node$1 as Node, OpenAIIcon, SafeThemeProvider, Select, Sheet, ThemeProvider, Timeline, Visualizer, calculateAutoLayout, cn, conditionalStyle, createSafeTheme, darkTheme, defaultTheme, detectContentType, formatCurrency, formatLatency, formatToolCalls, getColor, getSafeColor, getSafeSpacing, getSafeThemeValue, getSpacing, lightTheme, safeStyled, safeThemeColor, safeThemeSpacing, safeThemeValue, toTitleCase, truncateText, useComponentTheme, useSafeTheme, useTheme, useThemeValue };