@mp70/react-networks 0.5.0-alpha.0 → 0.5.0-rc.1

package/README.md

@@ -12,7 +12,7 @@ A React library for creating interactive network diagrams with support for rack
 - **Device Placement**: Drag and drop devices with automatic U position snapping
 - **Fiber Networks**: Visual representation of fiber connections and patch panels
 - **Power Distribution**: Vertical PDU support with power connections
-- **View Switching**: Front/rear view switching for devices and racks
+- **Face Switching**: Front/rear face switching for devices and racks
 - **Device Images**: Front/rear device images supported (PNG, SVG, JPEG, etc.) via `frontImageUrl` / `rearImageUrl` (`https://`, `blob:`, `data:image/*`, or relative URLs)
 - **Rack Alignment**: Align rack bottoms to the same horizontal plane
 - **Inventory Integration**: Built-in helpers to import/export generic inventory/CMDB data
@@ -85,6 +85,15 @@ export default App;
 
 ## Documentation
 
+### Data Model
+
+`@mp70/react-networks` supports two control layers:
+
+- `document` / `initialDocument` / `onDocumentChange` use `DiagramDocument`, the canonical persisted/editor schema. Prefer this for saved diagrams, import/export, and external integrations.
+- `nodes` / `edges` remain the lower-level React Flow-shaped control surface when you want direct control of rendered nodes and edges.
+
+For device-style nodes, prefer the flat `ports: DevicePort[]` input. Use `portGroups` and `rearPortGroups` only when you need explicit grouped front/rear layout control.
+
 ### Documentation Resources
 
 - Main Project README: `../../README.md` - Project overview and quick start
@@ -135,7 +144,10 @@ export default App;
 - [`updateSpliceHolderPosition`](#updatespliceholderposition) - Update splice holder position in schema
 
 **Data Integration:**
-- [`inventoryToNetworkDiagram`](#inventorytonetworkdiagram) - Convert inventory/CMDB data to diagram
+- [`inventoryToDiagramDocument`](#inventorytodiagramdocument) - Convert inventory/CMDB data to the canonical document model
+- [`inventoryToNetworkDiagram`](#inventorytonetworkdiagram) - Convert inventory/CMDB data to lower-level graph data
+- `netboxToDiagramDocument` - Convert NetBox data to the canonical document model
+- `netboxToNetworkDiagram` - Convert NetBox data to lower-level graph data
 - [`generateLayout`](#generatelayout) - Generate layout from inventory
 
 **Dimension Calculations:**
@@ -157,24 +169,34 @@ export default App;
 
 ### NetworkDiagram Props
 
+For new code, prefer the document-model props. The graph props and React Flow escape hatches remain available for advanced integrations and compatibility with older code.
+
 | Prop | Type | Default | Description |
 |------|------|---------|-------------|
-| `nodes` | `NetworkNode[]` | `[]` | Controlled nodes array |
-| `edges` | `NetworkEdge[]` | `[]` | Controlled edges array |
-| `onNodesChange` | `(nodes: NetworkNode[]) => void` | - | Callback when nodes change (controlled) |
-| `onEdgesChange` | `(edges: NetworkEdge[]) => void` | - | Callback when edges change (controlled) |
-| `initialNodes` | `NetworkNode[]` | - | Initial nodes (uncontrolled) |
-| `initialEdges` | `NetworkEdge[]` | - | Initial edges (uncontrolled) |
-| `store` | `NetworkDiagramStoreApi` | - | Headless store injection |
+| `document` | `DiagramDocument` | - | Controlled canonical diagram document. Takes precedence over `nodes` / `edges`. |
+| `initialDocument` | `DiagramDocument` | - | Initial canonical document for uncontrolled document mode. |
+| `onDocumentChange` | `(document: DiagramDocument) => void` | - | Callback when the canonical document changes. |
 | `alignRacksToBottom` | `boolean` | `false` | Align rack bottoms to baseline |
 | `onNodeClick` | `(node: NetworkNode \| null) => void` | - | Node click / selection handler |
 | `onEdgeClick` | `(edge: NetworkEdge) => void` | - | Edge click handler |
-| `onViewChange` | `(nodeId: string, view: 'front' \| 'rear') => void` | - | Device view change handler |
+| `onFaceChange` | `(nodeId: string, face: 'front' \| 'rear') => void` | - | Device face change handler |
 | `onRackFaceChange` | `(rackId: string, face: 'front' \| 'rear') => void` | - | Rack face change handler |
+| `className` | `string` | - | CSS class name |
+| `style` | `React.CSSProperties` | - | Inline styles |
+| `readOnly` | `boolean` | `false` | Force lock diagram (no drag/connect/delete/reconnect/pan/zoom) |
+| `interaction` | `NetworkDiagramInteractionOptions` | - | Fine-grained interaction controls for editing, pan, zoom, minimap, and controls |
+| `actionPanel` | `NetworkDiagramActionPanelOptions` | - | Configure action panel (enabled, showRearToggle, showDeRack) |
+| `nodes` | `NetworkNode[]` | `[]` | Advanced: controlled lower-level graph nodes |
+| `edges` | `NetworkEdge[]` | `[]` | Advanced: controlled lower-level graph edges |
+| `onNodesChange` | `(nodes: NetworkNode[]) => void` | - | Advanced: callback when lower-level nodes change |
+| `onEdgesChange` | `(edges: NetworkEdge[]) => void` | - | Advanced: callback when lower-level edges change |
+| `initialNodes` | `NetworkNode[]` | - | Advanced: initial lower-level nodes |
+| `initialEdges` | `NetworkEdge[]` | - | Advanced: initial lower-level edges |
+| `store` | `NetworkDiagramStoreApi` | - | Advanced: headless store injection |
 | `nodeTypes` | `NodeTypes` | - | Custom React Flow node types |
 | `edgeTypes` | `EdgeTypes` | - | Custom React Flow edge types |
 | `onConnect` | `(connection: Connection) => void` | - | Connection handler override |
-| `onEdgeUpdate` | - | - | Edge update (reconnect) override |
+| `onEdgeUpdate` | `(oldEdge: ReactFlowEdge, newConnection: Connection) => void` | - | Edge update (reconnect) override |
 | `isValidConnection` | `(connection: Connection) => boolean` | - | Connection validation override |
 | `connectionMode` | `ConnectionMode` | - | React Flow connection mode |
 | `reAssignable` | `boolean` | `true` | Allow devices to move between racks / ungroup on drag |
@@ -184,16 +206,7 @@ export default App;
 | `showDownloadButton` | `boolean` | - | Show export image button |
 | `downloadButtonPosition` | `'top-right' \| 'top-left' \| 'bottom-right' \| 'bottom-left'` | - | Download button position |
 | `useSmoothstepEdgesForTubes` | `boolean` | `false` | Use smoothstep edges for tube connections |
-| `className` | `string` | - | CSS class name |
-| `style` | `React.CSSProperties` | - | Inline styles |
 | `debug` | `boolean` | `false` | Enable debug mode |
-| `readOnly` | `boolean` | `false` | Force lock diagram (no drag/connect/delete/reconnect/pan/zoom) |
-| `interaction` | `NetworkDiagramInteractionOptions` | - | Fine-grained interaction (nodesDraggable, nodesConnectable, panOnDrag, etc.) |
-| `actionPanel` | `NetworkDiagramActionPanelOptions` | - | Configure action panel (enabled, showRearToggle, showDeRack) |
-| `connectOnClick` | `boolean` | `true` | Enable click-to-connect on handles |
-| `panOnDrag` | `boolean` | - | Override pan on drag |
-| `panOnScroll` | `boolean` | - | Override pan on scroll |
-| `zoomOnScroll` | `boolean` | - | Override zoom on scroll |
 | `fitViewOptions` | `FitViewOptions` | - | React Flow fitView options |
 
 ### NetworkNode Types

package/dist/index.css

@@ -142,6 +142,22 @@
   background-image: var(--fiber-bg-image, none) !important;
 }
 
+.react-flow__handle.rn-port-hitbox {
+  overflow: visible;
+}
+
+.react-flow__handle.connectionindicator.rn-port-hitbox::before {
+  content: '';
+  position: absolute;
+  top: calc(-1 * var(--rn-hit-expand-top, 0px));
+  right: calc(-1 * var(--rn-hit-expand-right, 0px));
+  bottom: calc(-1 * var(--rn-hit-expand-bottom, 0px));
+  left: calc(-1 * var(--rn-hit-expand-left, 0px));
+  border-radius: 4px;
+  background: transparent;
+  pointer-events: auto;
+}
+
 
 .react-flow__handle-right.tube-fiber-handle {
   right: auto !important;
@@ -393,6 +409,22 @@
   text-align: center;
 }
 
+.device-node__image-layer {
+  inset: 0;
+  overflow: hidden;
+  pointer-events: none;
+  position: absolute;
+  z-index: 0;
+}
+
+.device-node__image {
+  display: block;
+  height: 100%;
+  pointer-events: none;
+  user-select: none;
+  width: 100%;
+}
+
 .device-node__content--image-badge {
   overflow: visible;
   text-align: left;
@@ -446,6 +478,8 @@
 
 .device-node__split-face {
   background-color: #1f2937;
+  overflow: hidden;
+  position: relative;
 }
 
 .device-node__split-face--front {

package/dist/index.css.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/styles/index.css"],"sourcesContent":["/* Library styles for react-networks */\n\n/* Edge zIndex styles for dynamic prominence */\n.edge-prominent {\n  z-index: 1000 !important;\n  opacity: 1 !important;\n}\n\n.edge-dimmed {\n  z-index: 500 !important;\n  opacity: 0.3 !important;\n}\n\n/* Dynamic zIndex classes */\n.edge-z-1000 {\n  z-index: 1000 !important;\n}\n\n.edge-z-500 {\n  z-index: 500 !important;\n}\n\n/* React Flow theming */\n.react-flow-dark {\n  --react-flow-background: #1a1a1a;\n  --react-flow-text: #ffffff;\n  --react-flow-border: #404040;\n  --react-flow-controls-bg: #2d2d2d;\n  --react-flow-controls-border: #404040;\n  --react-flow-minimap-bg: #2d2d2d;\n  --react-flow-minimap-border: #404040;\n}\n\n.react-flow-light {\n  --react-flow-background: #f5f5f5;\n  --react-flow-text: #1a1a1a;\n  --react-flow-border: #e9ecef;\n  --react-flow-controls-bg: #f8f9fa;\n  --react-flow-controls-border: #e9ecef;\n  --react-flow-minimap-bg: #f8f9fa;\n  --react-flow-minimap-border: #e9ecef;\n}\n\n/* Apply ReactFlow theming */\n.react-flow-dark .react-flow__background {\n  background-color: var(--react-flow-background);\n}\n\n.react-flow-light .react-flow__background {\n  background-color: var(--react-flow-background);\n}\n\n/* Ensure canvas background is always off-white in light mode */\n.react-flow-light .react-flow__viewport {\n  background-color: #f5f5f5 !important;\n}\n\n.react-flow-light .react-flow {\n  background-color: #f5f5f5;\n}\n\n.react-flow-dark .react-flow__controls {\n  background-color: var(--react-flow-controls-bg);\n  border-color: var(--react-flow-controls-border);\n}\n\n.react-flow-light .react-flow__controls {\n  background-color: var(--react-flow-controls-bg);\n  border-color: var(--react-flow-controls-border);\n}\n\n.react-flow-dark .react-flow__minimap {\n  background-color: var(--react-flow-minimap-bg);\n  border-color: var(--react-flow-minimap-border);\n}\n\n.react-flow-light .react-flow__minimap {\n  background-color: var(--react-flow-minimap-bg);\n  border-color: var(--react-flow-minimap-border);\n}\n\n.react-flow-dark .react-flow__controls-button {\n  background-color: var(--react-flow-controls-bg);\n  color: var(--react-flow-text);\n  border-color: var(--react-flow-controls-border);\n}\n\n.react-flow-light .react-flow__controls-button {\n  background-color: var(--react-flow-controls-bg);\n  color: var(--react-flow-text);\n  border-color: var(--react-flow-controls-border);\n}\n\n.react-flow-dark .react-flow__controls-button:hover {\n  background-color: #4b5563;\n}\n\n.react-flow-light .react-flow__controls-button:hover {\n  background-color: #e9ecef;\n}\n\n/* Mobile-friendly control buttons - larger touch targets */\n@media (max-width: 768px) {\n  .react-flow__controls-button {\n    width: 44px !important;\n    height: 44px !important;\n    min-width: 44px !important;\n    min-height: 44px !important;\n  }\n}\n\n/* Override React Flow default handle styles for tube fiber handles */\n/* Use CSS variables set by inline styles to override React Flow defaults */\n.react-flow__handle.tube-fiber-handle {\n  border: none !important;\n  transform: none !important;\n  background-clip: padding-box !important;\n  opacity: 1 !important;\n  /* Ensure no default React Flow styles interfere */\n  box-shadow: none !important;\n  /* Don't set background here - let inline styles or specific rules handle it */\n}\n\n/* Tube fiber handles - use fiber color */\n.react-flow__handle.tube-fiber-handle {\n  background: var(--fiber-bg-image, var(--fiber-bg)) !important;\n  background-color: var(--fiber-bg) !important;\n}\n\n/* Fibre flow map handles */\n.react-flow__handle.fibre-flow-handle {\n  border: none !important;\n  transform: none !important;\n  background-clip: padding-box !important;\n  opacity: 1 !important;\n  box-shadow: none !important;\n}\n\n.react-flow__handle.fibre-flow-handle {\n  background: var(--fiber-bg-image, var(--fiber-bg)) !important;\n  background-color: var(--fiber-bg) !important;\n  background-image: var(--fiber-bg-image, none) !important;\n}\n\n\n.react-flow__handle-right.tube-fiber-handle {\n  right: auto !important;\n}\n\n/* More specific selector to ensure override - target all possible React Flow handle states */\n/* Only apply to non-ribbon handles */\n.react-flow__node .react-flow__handle.tube-fiber-handle:not(.ribbon-bundle-handle),\n.react-flow__node .react-flow__handle.tube-fiber-handle:not(.ribbon-bundle-handle)[data-handlepos],\n.react-flow__handle.tube-fiber-handle:not(.ribbon-bundle-handle)[data-handlepos],\n.react-flow__handle.tube-fiber-handle:not(.ribbon-bundle-handle)[data-fiber-idx] {\n  background: var(--fiber-bg-image, var(--fiber-bg)) !important;\n  background-color: var(--fiber-bg) !important;\n  background-image: var(--fiber-bg-image, none) !important;\n}\n\n/* Ribbon bundle handles - simple solid color (removed gradient complexity) */\n\n/* Connection animation - pulse effect when edge is first created */\n@keyframes edgeConnectPulse {\n  0% {\n    opacity: 0;\n    stroke-width: 1;\n  }\n  50% {\n    opacity: 1;\n    stroke-width: 4;\n  }\n  100% {\n    opacity: 1;\n    stroke-width: 2;\n  }\n}\n\n.react-flow__edge.edge-connecting path,\n.react-flow__edge.edge-connecting .react-flow__edge-path {\n  animation: edgeConnectPulse 1s ease-out;\n}\n\n/* Highlighted edge pulse + dash motion (trace paths) */\n@keyframes rnEdgeHighlightPulse {\n  0%,\n  100% {\n    opacity: 0.85;\n    stroke-width: var(--rn-edge-highlight-from, 2px);\n  }\n  50% {\n    opacity: 1;\n    stroke-width: var(--rn-edge-highlight-to, 6px);\n  }\n}\n\n@keyframes rnEdgeHighlightDash {\n  0% {\n    stroke-dashoffset: 0;\n  }\n  100% {\n    stroke-dashoffset: -48;\n  }\n}\n\n.rn-edge-highlight {\n  animation: rnEdgeHighlightPulse 2.4s ease-in-out infinite,\n    rnEdgeHighlightDash 1.8s linear infinite;\n  opacity: 0.9;\n  stroke-linecap: round;\n}\n\n/* Splice glow animation - fade in when both handles are connected */\n@keyframes spliceGlowFadeIn {\n  0% {\n    opacity: 0;\n    transform: translateX(-50%) scaleY(0.3);\n  }\n  100% {\n    opacity: 1;\n    transform: translateX(-50%) scaleY(1);\n  }\n}\n\n.splice-glow {\n  animation: spliceGlowFadeIn 0.5s ease-out;\n  transform-origin: center;\n}\n\n/* Splice text animation - fade in when both handles are connected */\n@keyframes spliceTextFadeIn {\n  0% {\n    opacity: 0;\n    transform: scale(0.8);\n  }\n  100% {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n\n/* Splice text overlay - blur and opacity for text readability */\n.splice-text-overlay {\n  backdrop-filter: blur(2px);\n  -webkit-backdrop-filter: blur(2px);\n}\n\n/* Dark mode overlay */\n.react-flow-dark .splice-text-overlay {\n  background: rgba(0, 0, 0, 0.6);\n}\n\n/* Light mode overlay */\n.react-flow-light .splice-text-overlay {\n  background: rgba(255, 255, 255, 0.7);\n}\n\n/* Splice text label - theme-aware colors */\n.splice-text-label {\n  color: #fff;\n  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8), 0 0 2px rgba(0, 0, 0, 0.6);\n}\n\n.splice-text-label.animate-in {\n  animation: spliceTextFadeIn 0.5s ease-out;\n  transform-origin: center;\n}\n\n/* Light mode text */\n.react-flow-light .splice-text-label {\n  color: #1a1a1a;\n  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9), 0 0 4px rgba(255, 255, 255, 0.7);\n}\n\n/* Remove all borders from splice nodes */\n.react-flow__node[data-type=\"splice\"],\n.react-flow__node[data-type=\"splice\"] > div {\n  border: none !important;\n  outline: none !important;\n}\n\n.splice-node {\n  background: transparent !important;\n  border: none !important;\n  outline: none !important;\n}\n\n/* Only remove box-shadow when not selected */\n.react-flow__node[data-type=\"splice\"]:not(.selected) > div,\n.splice-node:not(.selected) {\n  box-shadow: none !important;\n}\n\n/* React Networks Attribution */\n.react-networks-attribution {\n  padding: 0;\n  margin: 0;\n  z-index: 1000;\n}\n\n.react-networks-attribution-link {\n  font-size: 7px;\n  color: #9ca3af;\n  text-decoration: none;\n  font-family: ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace;\n  transition: color 0.2s ease;\n  padding: 1px 4px;\n  border-radius: 2px;\n  display: inline-block;\n  background: rgba(0, 0, 0, 0.3);\n  backdrop-filter: blur(4px);\n}\n\n.react-networks-attribution-link:hover {\n  color: #e5e7eb;\n  background: rgba(0, 0, 0, 0.4);\n}\n\n/* Light mode attribution */\n.react-flow-light .react-networks-attribution-link {\n  color: #6b7280;\n  background: rgba(255, 255, 255, 0.6);\n}\n\n.react-flow-light .react-networks-attribution-link:hover {\n  color: #1a1a1a;\n  background: rgba(255, 255, 255, 0.8);\n}\n\n/* Coupler node styles */\n.coupler-node {\n  transition: box-shadow 0.2s ease;\n}\n\n.coupler-node.selected {\n  box-shadow: 0 0 0 2px #3b82f6 !important;\n}\n\n/* Patch panel node styles */\n.patch-panel-node {\n  transition: box-shadow 0.2s ease, border-color 0.2s ease;\n}\n\n.patch-panel-node.selected {\n  box-shadow: 0 0 0 2px #3b82f6 !important;\n  border-color: #3b82f6 !important;\n}\n\n/* Closure node styles */\n.closure-node {\n  transition: box-shadow 0.2s ease, border-color 0.2s ease;\n}\n\n.closure-node.selected {\n  box-shadow: 0 0 0 2px #3b82f6 !important;\n  border-color: #3b82f6 !important;\n}\n\n/* Device node styles */\n.device-node {\n  background-color: #1f2937;\n  background-image: var(--rn-device-bg-image, none);\n  background-position: var(--rn-device-bg-position, center);\n  background-repeat: var(--rn-device-bg-repeat, no-repeat);\n  background-size: var(--rn-device-bg-size, cover);\n  border: 1px solid var(--rn-device-border-color, #10b981);\n  border-radius: 2px;\n  box-shadow: var(--rn-device-box-shadow, 0 1px 2px rgba(0, 0, 0, 0.1));\n  box-sizing: border-box;\n  color: white;\n  cursor: grab;\n  display: flex;\n  flex-direction: column;\n  font-family: monospace;\n  font-size: 8px;\n  height: var(--rn-device-height, 20px);\n  justify-content: center;\n  left: var(--rn-device-left, auto);\n  margin: 0;\n  padding: 0;\n  position: relative;\n  transform: translateY(var(--rn-device-translate-y, 0px));\n  width: var(--rn-device-width, 100%);\n}\n\n.device-node__content {\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  justify-content: center;\n  overflow: hidden;\n  padding: 2px;\n  text-align: center;\n}\n\n.device-node__content--image-badge {\n  overflow: visible;\n  text-align: left;\n}\n\n.device-node__label {\n  font-size: 7px;\n  font-weight: bold;\n  line-height: 1.1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.device-node__label--badge {\n  background: rgba(15, 23, 42, 0.88);\n  border: 1px solid rgba(148, 163, 184, 0.45);\n  border-radius: 2px;\n  display: inline-flex;\n  max-width: 100%;\n  padding: 1px 4px;\n}\n\n.device-node__manufacturer {\n  color: #9ca3af;\n  font-size: 6px;\n  line-height: 1;\n}\n\n.device-node__u-indicator {\n  background: #374151;\n  border-radius: 1px;\n  bottom: 1px;\n  color: #9ca3af;\n  font-size: 6px;\n  line-height: 1;\n  padding: 1px 2px;\n  position: absolute;\n  right: 1px;\n}\n\n.device-node__status-indicator {\n  background: var(--rn-device-status-color, #6b7280);\n  border-radius: 50%;\n  bottom: 1px;\n  height: 4px;\n  left: 1px;\n  position: absolute;\n  width: 4px;\n}\n\n.device-node__split-face {\n  background-color: #1f2937;\n}\n\n.device-node__split-face--front {\n  border-left: 1px dashed rgba(156, 163, 175, 0.35);\n}\n\n.device-node__split-face--rear {\n  border-right: 1px dashed rgba(156, 163, 175, 0.35);\n}\n\n.device-node__face-bridge {\n  position: relative;\n}\n\n.device-node__face-bridge-line {\n  background: linear-gradient(180deg, transparent 0%, rgba(156, 163, 175, 0.8) 20%, rgba(156, 163, 175, 0.8) 80%, transparent 100%);\n  left: 50%;\n  position: absolute;\n  top: 1px;\n  transform: translateX(-50%);\n  width: 1px;\n  height: calc(100% - 2px);\n}\n\n.device-node__face-bridge-label {\n  background: rgba(17, 24, 39, 0.82);\n  border: 1px solid rgba(156, 163, 175, 0.4);\n  border-radius: 999px;\n  color: #d1d5db;\n  font-size: 6px;\n  font-weight: 700;\n  left: 50%;\n  letter-spacing: 0.04em;\n  max-width: 120px;\n  overflow: hidden;\n  padding: 1px 6px;\n  position: absolute;\n  text-overflow: ellipsis;\n  top: 50%;\n  transform: translate(-50%, -50%) rotate(-90deg);\n  white-space: nowrap;\n}\n\n/* Light mode adjustments */\n.react-flow-light .coupler-node {\n  background: #f9fafb;\n  color: #1f2937;\n  border-color: #d1d5db;\n}\n\n.react-flow-light .patch-panel-node {\n  background: transparent !important;\n  color: #1f2937;\n  border-color: #d1d5db;\n}\n\n.react-flow-light .closure-node {\n  background: transparent !important;\n  color: #1f2937;\n  border-color: #d1d5db;\n}\n\n/* Triangle node styles */\n.react-flow__node[data-type=\"fibre-split\"],\n.react-flow__node.react-flow__node-fibre-split {\n  background: transparent !important;\n  border: none !important;\n  padding: 0 !important;\n}\n\n.react-flow__node[data-type=\"fibre-split\"] > div,\n.react-flow__node.react-flow__node-fibre-split > div {\n  background: transparent !important;\n  border: none !important;\n  padding: 0 !important;\n  box-shadow: none !important;\n  overflow: visible !important;\n}\n\n.react-flow__node[data-type=\"fibre-split\"] svg,\n.react-flow__node.react-flow__node-fibre-split svg {\n  display: block !important;\n  visibility: visible !important;\n  opacity: 1 !important;\n}\n\n.triangle-node {\n  position: relative !important;\n  display: flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n  background: transparent !important;\n  border: none !important;\n  padding: 0 !important;\n  margin: 0 !important;\n  box-shadow: none !important;\n  overflow: visible !important;\n  box-sizing: border-box !important;\n}\n\n\n.triangle-node-text {\n  text-align: center;\n  position: relative;\n  z-index: 2;\n  width: 46px;\n  height: 46px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0;\n  color: #000000;\n  font-weight: bold;\n  font-size: 12px;\n}\n\n/* Cable node rotation */\n.cable-node-rotated {\n  transform-origin: center center !important;\n}\n\n/* Ensure Fibre Flow edges render with full saturation and aren't affected by node overlays */\n.react-flow__edge[data-type=\"fibre-flow\"] path,\n.react-flow__edge[data-type=\"fibre-flow\"] .react-flow__edge-path {\n  opacity: 1 !important;\n  stroke-opacity: 1 !important;\n  mix-blend-mode: normal !important;\n  filter: none !important;\n}\n\n.react-flow__edge[data-type=\"fibre-flow-link\"] path,\n.react-flow__edge[data-type=\"fibre-flow-link\"] .react-flow__edge-path {\n  opacity: 1 !important;\n  stroke-opacity: 1 !important;\n  mix-blend-mode: normal !important;\n  filter: none !important;\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../src/styles/index.css"],"sourcesContent":["/* Library styles for react-networks */\n\n/* Edge zIndex styles for dynamic prominence */\n.edge-prominent {\n  z-index: 1000 !important;\n  opacity: 1 !important;\n}\n\n.edge-dimmed {\n  z-index: 500 !important;\n  opacity: 0.3 !important;\n}\n\n/* Dynamic zIndex classes */\n.edge-z-1000 {\n  z-index: 1000 !important;\n}\n\n.edge-z-500 {\n  z-index: 500 !important;\n}\n\n/* React Flow theming */\n.react-flow-dark {\n  --react-flow-background: #1a1a1a;\n  --react-flow-text: #ffffff;\n  --react-flow-border: #404040;\n  --react-flow-controls-bg: #2d2d2d;\n  --react-flow-controls-border: #404040;\n  --react-flow-minimap-bg: #2d2d2d;\n  --react-flow-minimap-border: #404040;\n}\n\n.react-flow-light {\n  --react-flow-background: #f5f5f5;\n  --react-flow-text: #1a1a1a;\n  --react-flow-border: #e9ecef;\n  --react-flow-controls-bg: #f8f9fa;\n  --react-flow-controls-border: #e9ecef;\n  --react-flow-minimap-bg: #f8f9fa;\n  --react-flow-minimap-border: #e9ecef;\n}\n\n/* Apply ReactFlow theming */\n.react-flow-dark .react-flow__background {\n  background-color: var(--react-flow-background);\n}\n\n.react-flow-light .react-flow__background {\n  background-color: var(--react-flow-background);\n}\n\n/* Ensure canvas background is always off-white in light mode */\n.react-flow-light .react-flow__viewport {\n  background-color: #f5f5f5 !important;\n}\n\n.react-flow-light .react-flow {\n  background-color: #f5f5f5;\n}\n\n.react-flow-dark .react-flow__controls {\n  background-color: var(--react-flow-controls-bg);\n  border-color: var(--react-flow-controls-border);\n}\n\n.react-flow-light .react-flow__controls {\n  background-color: var(--react-flow-controls-bg);\n  border-color: var(--react-flow-controls-border);\n}\n\n.react-flow-dark .react-flow__minimap {\n  background-color: var(--react-flow-minimap-bg);\n  border-color: var(--react-flow-minimap-border);\n}\n\n.react-flow-light .react-flow__minimap {\n  background-color: var(--react-flow-minimap-bg);\n  border-color: var(--react-flow-minimap-border);\n}\n\n.react-flow-dark .react-flow__controls-button {\n  background-color: var(--react-flow-controls-bg);\n  color: var(--react-flow-text);\n  border-color: var(--react-flow-controls-border);\n}\n\n.react-flow-light .react-flow__controls-button {\n  background-color: var(--react-flow-controls-bg);\n  color: var(--react-flow-text);\n  border-color: var(--react-flow-controls-border);\n}\n\n.react-flow-dark .react-flow__controls-button:hover {\n  background-color: #4b5563;\n}\n\n.react-flow-light .react-flow__controls-button:hover {\n  background-color: #e9ecef;\n}\n\n/* Mobile-friendly control buttons - larger touch targets */\n@media (max-width: 768px) {\n  .react-flow__controls-button {\n    width: 44px !important;\n    height: 44px !important;\n    min-width: 44px !important;\n    min-height: 44px !important;\n  }\n}\n\n/* Override React Flow default handle styles for tube fiber handles */\n/* Use CSS variables set by inline styles to override React Flow defaults */\n.react-flow__handle.tube-fiber-handle {\n  border: none !important;\n  transform: none !important;\n  background-clip: padding-box !important;\n  opacity: 1 !important;\n  /* Ensure no default React Flow styles interfere */\n  box-shadow: none !important;\n  /* Don't set background here - let inline styles or specific rules handle it */\n}\n\n/* Tube fiber handles - use fiber color */\n.react-flow__handle.tube-fiber-handle {\n  background: var(--fiber-bg-image, var(--fiber-bg)) !important;\n  background-color: var(--fiber-bg) !important;\n}\n\n/* Fibre flow map handles */\n.react-flow__handle.fibre-flow-handle {\n  border: none !important;\n  transform: none !important;\n  background-clip: padding-box !important;\n  opacity: 1 !important;\n  box-shadow: none !important;\n}\n\n.react-flow__handle.fibre-flow-handle {\n  background: var(--fiber-bg-image, var(--fiber-bg)) !important;\n  background-color: var(--fiber-bg) !important;\n  background-image: var(--fiber-bg-image, none) !important;\n}\n\n.react-flow__handle.rn-port-hitbox {\n  overflow: visible;\n}\n\n.react-flow__handle.connectionindicator.rn-port-hitbox::before {\n  content: '';\n  position: absolute;\n  top: calc(-1 * var(--rn-hit-expand-top, 0px));\n  right: calc(-1 * var(--rn-hit-expand-right, 0px));\n  bottom: calc(-1 * var(--rn-hit-expand-bottom, 0px));\n  left: calc(-1 * var(--rn-hit-expand-left, 0px));\n  border-radius: 4px;\n  background: transparent;\n  pointer-events: auto;\n}\n\n\n.react-flow__handle-right.tube-fiber-handle {\n  right: auto !important;\n}\n\n/* More specific selector to ensure override - target all possible React Flow handle states */\n/* Only apply to non-ribbon handles */\n.react-flow__node .react-flow__handle.tube-fiber-handle:not(.ribbon-bundle-handle),\n.react-flow__node .react-flow__handle.tube-fiber-handle:not(.ribbon-bundle-handle)[data-handlepos],\n.react-flow__handle.tube-fiber-handle:not(.ribbon-bundle-handle)[data-handlepos],\n.react-flow__handle.tube-fiber-handle:not(.ribbon-bundle-handle)[data-fiber-idx] {\n  background: var(--fiber-bg-image, var(--fiber-bg)) !important;\n  background-color: var(--fiber-bg) !important;\n  background-image: var(--fiber-bg-image, none) !important;\n}\n\n/* Ribbon bundle handles - simple solid color (removed gradient complexity) */\n\n/* Connection animation - pulse effect when edge is first created */\n@keyframes edgeConnectPulse {\n  0% {\n    opacity: 0;\n    stroke-width: 1;\n  }\n  50% {\n    opacity: 1;\n    stroke-width: 4;\n  }\n  100% {\n    opacity: 1;\n    stroke-width: 2;\n  }\n}\n\n.react-flow__edge.edge-connecting path,\n.react-flow__edge.edge-connecting .react-flow__edge-path {\n  animation: edgeConnectPulse 1s ease-out;\n}\n\n/* Highlighted edge pulse + dash motion (trace paths) */\n@keyframes rnEdgeHighlightPulse {\n  0%,\n  100% {\n    opacity: 0.85;\n    stroke-width: var(--rn-edge-highlight-from, 2px);\n  }\n  50% {\n    opacity: 1;\n    stroke-width: var(--rn-edge-highlight-to, 6px);\n  }\n}\n\n@keyframes rnEdgeHighlightDash {\n  0% {\n    stroke-dashoffset: 0;\n  }\n  100% {\n    stroke-dashoffset: -48;\n  }\n}\n\n.rn-edge-highlight {\n  animation: rnEdgeHighlightPulse 2.4s ease-in-out infinite,\n    rnEdgeHighlightDash 1.8s linear infinite;\n  opacity: 0.9;\n  stroke-linecap: round;\n}\n\n/* Splice glow animation - fade in when both handles are connected */\n@keyframes spliceGlowFadeIn {\n  0% {\n    opacity: 0;\n    transform: translateX(-50%) scaleY(0.3);\n  }\n  100% {\n    opacity: 1;\n    transform: translateX(-50%) scaleY(1);\n  }\n}\n\n.splice-glow {\n  animation: spliceGlowFadeIn 0.5s ease-out;\n  transform-origin: center;\n}\n\n/* Splice text animation - fade in when both handles are connected */\n@keyframes spliceTextFadeIn {\n  0% {\n    opacity: 0;\n    transform: scale(0.8);\n  }\n  100% {\n    opacity: 1;\n    transform: scale(1);\n  }\n}\n\n/* Splice text overlay - blur and opacity for text readability */\n.splice-text-overlay {\n  backdrop-filter: blur(2px);\n  -webkit-backdrop-filter: blur(2px);\n}\n\n/* Dark mode overlay */\n.react-flow-dark .splice-text-overlay {\n  background: rgba(0, 0, 0, 0.6);\n}\n\n/* Light mode overlay */\n.react-flow-light .splice-text-overlay {\n  background: rgba(255, 255, 255, 0.7);\n}\n\n/* Splice text label - theme-aware colors */\n.splice-text-label {\n  color: #fff;\n  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8), 0 0 2px rgba(0, 0, 0, 0.6);\n}\n\n.splice-text-label.animate-in {\n  animation: spliceTextFadeIn 0.5s ease-out;\n  transform-origin: center;\n}\n\n/* Light mode text */\n.react-flow-light .splice-text-label {\n  color: #1a1a1a;\n  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.9), 0 0 4px rgba(255, 255, 255, 0.7);\n}\n\n/* Remove all borders from splice nodes */\n.react-flow__node[data-type=\"splice\"],\n.react-flow__node[data-type=\"splice\"] > div {\n  border: none !important;\n  outline: none !important;\n}\n\n.splice-node {\n  background: transparent !important;\n  border: none !important;\n  outline: none !important;\n}\n\n/* Only remove box-shadow when not selected */\n.react-flow__node[data-type=\"splice\"]:not(.selected) > div,\n.splice-node:not(.selected) {\n  box-shadow: none !important;\n}\n\n/* React Networks Attribution */\n.react-networks-attribution {\n  padding: 0;\n  margin: 0;\n  z-index: 1000;\n}\n\n.react-networks-attribution-link {\n  font-size: 7px;\n  color: #9ca3af;\n  text-decoration: none;\n  font-family: ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace;\n  transition: color 0.2s ease;\n  padding: 1px 4px;\n  border-radius: 2px;\n  display: inline-block;\n  background: rgba(0, 0, 0, 0.3);\n  backdrop-filter: blur(4px);\n}\n\n.react-networks-attribution-link:hover {\n  color: #e5e7eb;\n  background: rgba(0, 0, 0, 0.4);\n}\n\n/* Light mode attribution */\n.react-flow-light .react-networks-attribution-link {\n  color: #6b7280;\n  background: rgba(255, 255, 255, 0.6);\n}\n\n.react-flow-light .react-networks-attribution-link:hover {\n  color: #1a1a1a;\n  background: rgba(255, 255, 255, 0.8);\n}\n\n/* Coupler node styles */\n.coupler-node {\n  transition: box-shadow 0.2s ease;\n}\n\n.coupler-node.selected {\n  box-shadow: 0 0 0 2px #3b82f6 !important;\n}\n\n/* Patch panel node styles */\n.patch-panel-node {\n  transition: box-shadow 0.2s ease, border-color 0.2s ease;\n}\n\n.patch-panel-node.selected {\n  box-shadow: 0 0 0 2px #3b82f6 !important;\n  border-color: #3b82f6 !important;\n}\n\n/* Closure node styles */\n.closure-node {\n  transition: box-shadow 0.2s ease, border-color 0.2s ease;\n}\n\n.closure-node.selected {\n  box-shadow: 0 0 0 2px #3b82f6 !important;\n  border-color: #3b82f6 !important;\n}\n\n/* Device node styles */\n.device-node {\n  background-color: #1f2937;\n  background-image: var(--rn-device-bg-image, none);\n  background-position: var(--rn-device-bg-position, center);\n  background-repeat: var(--rn-device-bg-repeat, no-repeat);\n  background-size: var(--rn-device-bg-size, cover);\n  border: 1px solid var(--rn-device-border-color, #10b981);\n  border-radius: 2px;\n  box-shadow: var(--rn-device-box-shadow, 0 1px 2px rgba(0, 0, 0, 0.1));\n  box-sizing: border-box;\n  color: white;\n  cursor: grab;\n  display: flex;\n  flex-direction: column;\n  font-family: monospace;\n  font-size: 8px;\n  height: var(--rn-device-height, 20px);\n  justify-content: center;\n  left: var(--rn-device-left, auto);\n  margin: 0;\n  padding: 0;\n  position: relative;\n  transform: translateY(var(--rn-device-translate-y, 0px));\n  width: var(--rn-device-width, 100%);\n}\n\n.device-node__content {\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n  justify-content: center;\n  overflow: hidden;\n  padding: 2px;\n  text-align: center;\n}\n\n.device-node__image-layer {\n  inset: 0;\n  overflow: hidden;\n  pointer-events: none;\n  position: absolute;\n  z-index: 0;\n}\n\n.device-node__image {\n  display: block;\n  height: 100%;\n  pointer-events: none;\n  user-select: none;\n  width: 100%;\n}\n\n.device-node__content--image-badge {\n  overflow: visible;\n  text-align: left;\n}\n\n.device-node__label {\n  font-size: 7px;\n  font-weight: bold;\n  line-height: 1.1;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n.device-node__label--badge {\n  background: rgba(15, 23, 42, 0.88);\n  border: 1px solid rgba(148, 163, 184, 0.45);\n  border-radius: 2px;\n  display: inline-flex;\n  max-width: 100%;\n  padding: 1px 4px;\n}\n\n.device-node__manufacturer {\n  color: #9ca3af;\n  font-size: 6px;\n  line-height: 1;\n}\n\n.device-node__u-indicator {\n  background: #374151;\n  border-radius: 1px;\n  bottom: 1px;\n  color: #9ca3af;\n  font-size: 6px;\n  line-height: 1;\n  padding: 1px 2px;\n  position: absolute;\n  right: 1px;\n}\n\n.device-node__status-indicator {\n  background: var(--rn-device-status-color, #6b7280);\n  border-radius: 50%;\n  bottom: 1px;\n  height: 4px;\n  left: 1px;\n  position: absolute;\n  width: 4px;\n}\n\n.device-node__split-face {\n  background-color: #1f2937;\n  overflow: hidden;\n  position: relative;\n}\n\n.device-node__split-face--front {\n  border-left: 1px dashed rgba(156, 163, 175, 0.35);\n}\n\n.device-node__split-face--rear {\n  border-right: 1px dashed rgba(156, 163, 175, 0.35);\n}\n\n.device-node__face-bridge {\n  position: relative;\n}\n\n.device-node__face-bridge-line {\n  background: linear-gradient(180deg, transparent 0%, rgba(156, 163, 175, 0.8) 20%, rgba(156, 163, 175, 0.8) 80%, transparent 100%);\n  left: 50%;\n  position: absolute;\n  top: 1px;\n  transform: translateX(-50%);\n  width: 1px;\n  height: calc(100% - 2px);\n}\n\n.device-node__face-bridge-label {\n  background: rgba(17, 24, 39, 0.82);\n  border: 1px solid rgba(156, 163, 175, 0.4);\n  border-radius: 999px;\n  color: #d1d5db;\n  font-size: 6px;\n  font-weight: 700;\n  left: 50%;\n  letter-spacing: 0.04em;\n  max-width: 120px;\n  overflow: hidden;\n  padding: 1px 6px;\n  position: absolute;\n  text-overflow: ellipsis;\n  top: 50%;\n  transform: translate(-50%, -50%) rotate(-90deg);\n  white-space: nowrap;\n}\n\n/* Light mode adjustments */\n.react-flow-light .coupler-node {\n  background: #f9fafb;\n  color: #1f2937;\n  border-color: #d1d5db;\n}\n\n.react-flow-light .patch-panel-node {\n  background: transparent !important;\n  color: #1f2937;\n  border-color: #d1d5db;\n}\n\n.react-flow-light .closure-node {\n  background: transparent !important;\n  color: #1f2937;\n  border-color: #d1d5db;\n}\n\n/* Triangle node styles */\n.react-flow__node[data-type=\"fibre-split\"],\n.react-flow__node.react-flow__node-fibre-split {\n  background: transparent !important;\n  border: none !important;\n  padding: 0 !important;\n}\n\n.react-flow__node[data-type=\"fibre-split\"] > div,\n.react-flow__node.react-flow__node-fibre-split > div {\n  background: transparent !important;\n  border: none !important;\n  padding: 0 !important;\n  box-shadow: none !important;\n  overflow: visible !important;\n}\n\n.react-flow__node[data-type=\"fibre-split\"] svg,\n.react-flow__node.react-flow__node-fibre-split svg {\n  display: block !important;\n  visibility: visible !important;\n  opacity: 1 !important;\n}\n\n.triangle-node {\n  position: relative !important;\n  display: flex !important;\n  align-items: center !important;\n  justify-content: center !important;\n  background: transparent !important;\n  border: none !important;\n  padding: 0 !important;\n  margin: 0 !important;\n  box-shadow: none !important;\n  overflow: visible !important;\n  box-sizing: border-box !important;\n}\n\n\n.triangle-node-text {\n  text-align: center;\n  position: relative;\n  z-index: 2;\n  width: 46px;\n  height: 46px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  margin: 0;\n  color: #000000;\n  font-weight: bold;\n  font-size: 12px;\n}\n\n/* Cable node rotation */\n.cable-node-rotated {\n  transform-origin: center center !important;\n}\n\n/* Ensure Fibre Flow edges render with full saturation and aren't affected by node overlays */\n.react-flow__edge[data-type=\"fibre-flow\"] path,\n.react-flow__edge[data-type=\"fibre-flow\"] .react-flow__edge-path {\n  opacity: 1 !important;\n  stroke-opacity: 1 !important;\n  mix-blend-mode: normal !important;\n  filter: none !important;\n}\n\n.react-flow__edge[data-type=\"fibre-flow-link\"] path,\n.react-flow__edge[data-type=\"fibre-flow-link\"] .react-flow__edge-path {\n  opacity: 1 !important;\n  stroke-opacity: 1 !important;\n  mix-blend-mode: normal !important;\n  filter: none !important;\n}\n"],"mappings":"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","names":[]}