@aceshooting/lyra-ui 29.0.2 → 29.1.0

package/dist/components/data/flow-canvas/flow-canvas.class.js

@@ -1,15 +1,32 @@
-import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property,state}from"lit/decorators.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{fitTransform}from"../../../internal/fit-transform.js";import{nextId,srOnly}from"../../../internal/a11y.js";import{AnnouncementSinkController,Announcer}from"../../../internal/announcer.js";import{isRtl}from"../../../internal/rtl.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{observeReducedMotion}from"../../../internal/motion-observer.js";import{layeredLayout}from"../../../internal/layered-layout.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{finiteNumber,finiteRange}from"../../../internal/numbers.js";import{isActionableElement}from"../../../internal/focus-navigation.js";import{isNativeTopLayerElement}from"../../../internal/fixed-containing-block.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{resolveCssTokenLength}from"../../../internal/css-token-length.js";import{devWarnOnce}from"../../../internal/dev-mode-attribute-warning.js";import{tag}from"../../../internal/prefix.js";import{DEFAULT_FLOW_INPUTS,DEFAULT_FLOW_OUTPUTS,snapshotFlowDecorations,snapshotFlowEdges,snapshotFlowNodes,MAX_FLOW_COLLECTION_ENTRIES}from"./flow-model.js";import{FLOW_PALETTE_MIME_TYPE}from"./flow-types.js";import{styles}from"./flow-canvas.styles.js";import{LYRA_DEFAULT_flowCanvasLabel,LYRA_DEFAULT_flowCanvasLayoutLimit,LYRA_DEFAULT_flowCanvasSummary,LYRA_DEFAULT_flowConnectCancelled,LYRA_DEFAULT_flowConnectCommitted,LYRA_DEFAULT_flowConnectStarted,LYRA_DEFAULT_flowConnectTarget,LYRA_DEFAULT_flowEdge,LYRA_DEFAULT_flowEdgeList,LYRA_DEFAULT_flowEdgeWithLabel,LYRA_DEFAULT_flowNode,LYRA_DEFAULT_flowNodeDeselected,LYRA_DEFAULT_flowNodeMoved,LYRA_DEFAULT_flowNodeSelected,LYRA_DEFAULT_flowSelectionCleared}from"../../../internal/default-strings/data.generated.js";import{LYRA_DEFAULT_flowItemAnnouncement,LYRA_DEFAULT_noData}from"../../../internal/default-strings/shared.generated.js";export*from"./flow-types.js";const FLOW_EDGE_TONES=["neutral","brand","success","warning","danger"],CONNECT_OFFSET_MIN=24,CONNECT_OFFSET_MAX=120,ZOOM_MULTIPLIER=1.2,DEFAULT_FIT_PADDING=24,KEYBOARD_PAN_STEP=32,UNMATCHED_AUTHORED_CARD_WARNING="lyra-flow-canvas-unmatched-authored-card";function toggledSelection(list,id){return list.includes(id)?list.filter(x=>x!==id):[...list,id]}const nodeMaps=new WeakMap;function nodeById(nodes,id){let map=nodeMaps.get(nodes);return map||nodeMaps.set(nodes,map=new Map(nodes.map(node=>[node.id,node]))),map.get(id)}function nodeTypePart(type){if(!type)return null;const normalized=type.trim().toLowerCase().replace(/[^a-z0-9_-]+/g,"-").replace(/^-+|-+$/g,"");return normalized?`node-type-${/^\d/.test(normalized)?`type-${normalized}`:normalized}`:null}class LyraFlowCanvas extends LyraElement{constructor(){super(...arguments),this._nodes=Object.freeze([]),this._edges=Object.freeze([]),this._orientation="horizontal",this.nodesDraggable=!1,this.connectable=!1,this.droppable=!1,this.readonly=!1,this._selectedNodeIds=Object.freeze([]),this._requestedSelectedNodeIds=Object.freeze([]),this._selectedEdgeIds=Object.freeze([]),this._requestedSelectedEdgeIds=Object.freeze([]),this.minZoom=.25,this.maxZoom=2,this.grid=8,this.layerGap=64,this.nodeGap=24,this._decorations=null,this.accessibleLabel=null,this.arrowMarkerIds={neutral:nextId("flow-canvas-arrow-neutral"),brand:nextId("flow-canvas-arrow-brand"),success:nextId("flow-canvas-arrow-success"),warning:nextId("flow-canvas-arrow-warning"),danger:nextId("flow-canvas-arrow-danger")},this.liveRegionId=nextId("flow-canvas-live"),this.announcements=new AnnouncementSinkController(this,{eager:["polite"]}),this.announcer=new Announcer({onFlush:text=>{this.mirrorAnnouncement(text),this.announcements.announcePolite(text)}}),this.activeItemIndex=0,this.connecting=!1,this.layoutTruncated=!1,this.hasConnectedLayoutBaseline=!1,this.layoutLimitAnnouncementPending=!1,this.keyboardConnectSourceId=null,this.keyboardConnectTargetIndex=0,this.autoPositions=new Map,this.measuredSizes=new Map,this.observedNodeEls=new Set,this.authoredCardObserverGeneration=0,this.authoredCardSyncQueued=!1,this.authoredCardSlotLeases=new Map,this.layoutRaf=null,this.panX=0,this.panY=0,this.zoomLevel=1,this.viewportChangeRaf=null,this.hasFitOnce=!1,this.wheelMeasure=null,this.wheelMeasureRaf=null,this.nodeIncidentEdges=new Map,this.connectInvalidNodeId=null,this.companionCallbacks=new Set,this.companionRaf=null,this.onWheel=e=>{if(this.readonly||!this.viewportEl||this.isFromTopLayerSurface(e,this.viewportEl))return;e.preventDefault(),this.wheelMeasure||(this.wheelMeasure={rect:this.viewportEl.getBoundingClientRect(),rtl:isRtl(this)},this.wheelMeasureRaf=this.requestOwnerAnimationFrame(()=>{this.wheelMeasure=null,this.wheelMeasureRaf=null}));const{rect,rtl}=this.wheelMeasure,localX=this.localWorldX(e.clientX,rect,rtl),localY=e.clientY-rect.top,factor=e.deltaY<0?ZOOM_MULTIPLIER:1/ZOOM_MULTIPLIER;this.zoomAtPoint(localX,localY,this.zoomLevel*factor)},this.onBackgroundPointerDown=e=>{this.readonly||this.isFromTopLayerSurface(e,this.viewportEl)||(this.panDrag={pointerId:e.pointerId,startClientX:e.clientX,startClientY:e.clientY,startPanX:this.panX,startPanY:this.panY,rtlFlip:this.orientation==="horizontal"&&isRtl(this)?-1:1},e.target.setPointerCapture?.(e.pointerId),this.viewportEl?.setAttribute("data-panning",""),this.connectedWindow?.addEventListener("pointermove",this.onBackgroundPointerMove),this.connectedWindow?.addEventListener("pointerup",this.onBackgroundPointerUp),this.connectedWindow?.addEventListener("pointercancel",this.onBackgroundPointerUp),this.connectedWindow?.addEventListener("lostpointercapture",this.onBackgroundPointerUp))},this.onBackgroundPointerMove=e=>{const drag=this.panDrag;if(!(!drag||e.pointerId!==drag.pointerId)){if(this.readonly){this.endBackgroundPan(!0);return}this.panX=drag.startPanX+(e.clientX-drag.startClientX)*drag.rtlFlip,this.panY=drag.startPanY+(e.clientY-drag.startClientY),this.applyWorldTransform(),this.scheduleViewportChange()}},this.onBackgroundPointerUp=e=>{!this.panDrag||e.pointerId!==this.panDrag.pointerId||this.endBackgroundPan(this.readonly||e.type!=="pointerup")},this.onViewportKeyDown=e=>{if(!(e.target!==this.viewportEl||this.readonly))if(e.key==="+"||e.key==="=")e.preventDefault(),this.zoomIn();else if(e.key==="-"||e.key==="_")e.preventDefault(),this.zoomOut();else if(e.key==="0")e.preventDefault(),this.resetZoom();else if(e.key==="ArrowRight"){e.preventDefault();const rtlFlip=this.orientation==="horizontal"&&isRtl(this)?-1:1;this.panBy(-KEYBOARD_PAN_STEP*rtlFlip,0)}else if(e.key==="ArrowLeft"){e.preventDefault();const rtlFlip=this.orientation==="horizontal"&&isRtl(this)?-1:1;this.panBy(KEYBOARD_PAN_STEP*rtlFlip,0)}else e.key==="ArrowDown"?(e.preventDefault(),this.panBy(0,-KEYBOARD_PAN_STEP)):e.key==="ArrowUp"&&(e.preventDefault(),this.panBy(0,KEYBOARD_PAN_STEP))},this.onViewportDragOver=e=>{!this.droppable||this.readonly||e.dataTransfer?.types.includes(FLOW_PALETTE_MIME_TYPE)&&(e.preventDefault(),e.dataTransfer.dropEffect="copy",this.viewportEl?.setAttribute("data-drop-active",""))},this.onViewportDragLeave=()=>{this.viewportEl?.removeAttribute("data-drop-active")},this.onViewportDrop=e=>{if(this.viewportEl?.removeAttribute("data-drop-active"),!this.droppable||this.readonly)return;const raw=e.dataTransfer?.getData(FLOW_PALETTE_MIME_TYPE);if(!raw)return;e.preventDefault();const maxPayloadBytes=4096;if(raw.length>maxPayloadBytes)return;const TextEncoderCtor=this.ownerDocument.defaultView?.TextEncoder??globalThis.TextEncoder;if(TextEncoderCtor&&new TextEncoderCtor().encode(raw).byteLength>maxPayloadBytes)return;let payload;try{payload=JSON.parse(raw)}catch{return}if(typeof payload!="object"||payload===null||Array.isArray(payload)||Object.getPrototypeOf(payload)!==Object.prototype&&Object.getPrototypeOf(payload)!==null)return;const rawType=payload.type;if(typeof rawType!="string")return;const type=rawType.trim();if(!type||type.length>128)return;const contentPoint=this.toContentPoint(e.clientX,e.clientY);this.emit("lr-node-add",Object.freeze({type,position:Object.freeze({x:this.snap(contentPoint.x),y:this.snap(contentPoint.y)})}))},this.onNodePointerMove=e=>{const drag=this.nodeDrag;if(!drag||e.pointerId!==drag.pointerId)return;if(this.readonly||!this.nodesDraggable){this.endNodeDrag(!1);return}const dx=(e.clientX-drag.startClientX)*drag.rtlFlip/this.zoomLevel,dy=(e.clientY-drag.startClientY)/this.zoomLevel,x=this.snap(drag.startX+dx),y=this.snap(drag.startY+dy);drag.wrapper.style.transform=`translate(${x}px, ${y}px)`,this.updateIncidentEdges(drag.nodeId,x,y),drag.currentX=x,drag.currentY=y},this.onNodePointerUp=e=>{const drag=this.nodeDrag;!drag||e.pointerId!==drag.pointerId||this.endNodeDrag(!this.readonly&&e.type==="pointerup")},this.onWorldPointerDown=e=>{if(!this.connectable||this.readonly||this.connectState||this.isFromTopLayerSurface(e,this.viewportEl))return;const path=e.composedPath(),handleEl=path.find(el=>isHtmlElement(el)&&el.dataset.handleKind==="output");if(!handleEl)return;const nodeId=this.nodeIdFromComposedPath(path),handleId=handleEl.dataset.handleId;!nodeId||!handleId||(e.stopPropagation(),this.startConnectGesture(nodeId,handleId,e.clientX,e.clientY))},this.onConnectPointerMove=e=>{if(!this.connectState)return;if(this.readonly||!this.connectable){this.onConnectPointerCancel();return}const targetPt=this.connectContentPoint(e.clientX,e.clientY);this.connectionLineEl?.setAttribute("d",this.edgePathD(this.connectState.startPt,targetPt));const hoveredId=this.nodeIdFromComposedPath(e.composedPath()),invalid=hoveredId!=null&&this.isInvalidConnectTarget(hoveredId);this.connectInvalidNodeId&&this.connectInvalidNodeId!==(invalid?hoveredId:null)&&this.renderedNodeById(this.connectInvalidNodeId)?.removeAttribute("data-connect-invalid"),this.connectInvalidNodeId=invalid?hoveredId:null,invalid&&this.renderedNodeById(hoveredId)?.setAttribute("data-connect-invalid","")},this.onConnectPointerUp=e=>{if(!this.connectState)return;if(this.readonly||!this.connectable){this.onConnectPointerCancel();return}const state2=this.connectState,path=e.composedPath(),targetNodeId=this.nodeIdFromComposedPath(path);if(this.endConnectGesture(),!targetNodeId||this.isInvalidConnectTargetFor(state2,targetNodeId)){this.announcer.announce(this.localize("flowConnectCancelled"));return}const targetHandle=path.find(el=>isHtmlElement(el)&&el.dataset.handleKind==="input")?.dataset.handleId??"in";this.emit("lr-connect",Object.freeze({source:state2.sourceId,target:targetNodeId,sourceHandle:state2.sourceHandle,targetHandle}));const sourceNode=this.nodes.find(node=>node.id===state2.sourceId),targetNode=this.nodes.find(node=>node.id===targetNodeId);this.announcer.announce(this.localize("flowConnectCommitted",void 0,{source:sourceNode?this.nodeAccessibleText(sourceNode):state2.sourceId,target:targetNode?this.nodeAccessibleText(targetNode):targetNodeId}))},this.onConnectPointerCancel=()=>{this.connectState&&(this.endConnectGesture(),this.announcer.announce(this.localize("flowConnectCancelled")))}}static{this.defaultStrings={...super.defaultStrings,flowCanvasLabel:LYRA_DEFAULT_flowCanvasLabel,flowCanvasLayoutLimit:LYRA_DEFAULT_flowCanvasLayoutLimit,flowCanvasSummary:LYRA_DEFAULT_flowCanvasSummary,flowConnectCancelled:LYRA_DEFAULT_flowConnectCancelled,flowConnectCommitted:LYRA_DEFAULT_flowConnectCommitted,flowConnectStarted:LYRA_DEFAULT_flowConnectStarted,flowConnectTarget:LYRA_DEFAULT_flowConnectTarget,flowEdge:LYRA_DEFAULT_flowEdge,flowEdgeList:LYRA_DEFAULT_flowEdgeList,flowEdgeWithLabel:LYRA_DEFAULT_flowEdgeWithLabel,flowItemAnnouncement:LYRA_DEFAULT_flowItemAnnouncement,flowNode:LYRA_DEFAULT_flowNode,flowNodeDeselected:LYRA_DEFAULT_flowNodeDeselected,flowNodeMoved:LYRA_DEFAULT_flowNodeMoved,flowNodeSelected:LYRA_DEFAULT_flowNodeSelected,flowSelectionCleared:LYRA_DEFAULT_flowSelectionCleared,noData:LYRA_DEFAULT_noData}}static{this.styles=[LyraElement.styles,styles,srOnly]}get nodes(){return this._nodes}set nodes(value){if(value===this.nodesSource||value===this._nodes)return;const previous=this._nodes;this.nodesSource=value,this._nodes=snapshotFlowNodes(value),this.rovingCache=void 0,this.requestUpdate("nodes",previous)}get edges(){return this._edges}set edges(value){if(value===this.edgesSource||value===this._edges)return;const previous=this._edges;this.edgesSource=value,this._edges=snapshotFlowEdges(value),this.rovingCache=void 0,this.requestUpdate("edges",previous)}get orientation(){return this._orientation}set orientation(value){const previous=this._orientation,next=value==="vertical"?"vertical":"horizontal";this._orientation=next,this.rovingCache=void 0,(next!==previous||value!==next)&&this.requestUpdate("orientation",previous)}get selectedNodeIds(){return this._selectedNodeIds}set selectedNodeIds(value){if(value===this.selectedNodeIdsSource||value===this._selectedNodeIds)return;const previous=this._selectedNodeIds;this.selectedNodeIdsSource=value,this._requestedSelectedNodeIds=this.sanitizeSelectionCandidates(value),this._selectedNodeIds=this.snapshotSelectedIds(this._requestedSelectedNodeIds,new Set(this.nodes.map(node=>node.id))),this.requestUpdate("selectedNodeIds",previous)}get selectedEdgeIds(){return this._selectedEdgeIds}set selectedEdgeIds(value){if(value===this.selectedEdgeIdsSource||value===this._selectedEdgeIds)return;const previous=this._selectedEdgeIds;this.selectedEdgeIdsSource=value,this._requestedSelectedEdgeIds=this.sanitizeSelectionCandidates(value),this._selectedEdgeIds=this.snapshotSelectedIds(this._requestedSelectedEdgeIds,new Set(this.edges.map(edge=>edge.id))),this.requestUpdate("selectedEdgeIds",previous)}sanitizeSelectionCandidates(value){if(!Array.isArray(value))return Object.freeze([]);const selected=[],seen=new Set;for(const candidate of value.slice(0,MAX_FLOW_COLLECTION_ENTRIES))typeof candidate!="string"||candidate.trim().length===0||seen.has(candidate)||(seen.add(candidate),selected.push(candidate));return Object.freeze(selected)}snapshotSelectedIds(value,validIds){const selected=value.filter(candidate=>validIds.has(candidate));return selected.length===value.length?value:Object.freeze(selected)}get decorations(){return this._decorations}set decorations(value){if(value===this.decorationsSource||value===this._decorations)return;const previous=this._decorations;this.decorationsSource=value,this._decorations=value==null?null:snapshotFlowDecorations(value),this.requestUpdate("decorations",previous)}get safeMinZoom(){return finiteRange(this.minZoom,.25,.001,1e3)}get safeMaxZoom(){return finiteRange(this.maxZoom,2,.001,1e3)}get effectiveZoomBounds(){return{min:Math.min(this.safeMinZoom,this.safeMaxZoom),max:Math.max(this.safeMinZoom,this.safeMaxZoom)}}get safeGrid(){return finiteRange(this.grid,8,0)}get safeLayerGap(){return finiteRange(this.layerGap,64,0)}get safeNodeGap(){return finiteRange(this.nodeGap,24,0)}connectedCallback(){super.connectedCallback(),this.stopMotionWatch=observeReducedMotion(this,()=>this.requestUpdate());const ownerWindow=this.ownerDocument.defaultView;this.connectedWindow=ownerWindow??void 0,ownerWindow&&this.announcer.setTimerHost(ownerWindow);const ResizeObserverCtor=ownerWindow?.ResizeObserver;this.resizeObserver=ResizeObserverCtor?new ResizeObserverCtor(entries=>this.onNodesResized(entries)):void 0,this.bindAuthoredCardObserver(),this.syncAuthoredCards(),this.pushCardPropsAll(),this.scheduleCompanionNotify(),this.hasUpdated&&(this.observeNodeWrappers(),this.nodes.length>0&&this.scheduleLayoutPass())}disconnectedCallback(){super.disconnectedCallback(),this.stopMotionWatch?.(),this.stopMotionWatch=void 0,this.resetAuthoredCardObserver(),this.restoreAuthoredCardSlots(),this.hasConnectedLayoutBaseline=!1,this.layoutLimitAnnouncementPending=!1,this.announcer.cancel(),this.mirrorAnnouncement(""),this.resizeObserver?.disconnect(),this.resizeObserver=void 0,this.observedNodeEls.clear(),this.layoutRaf!=null&&(this.cancelOwnerAnimationFrame(this.layoutRaf),this.layoutRaf=null),this.companionRaf!=null&&(this.cancelOwnerAnimationFrame(this.companionRaf),this.companionRaf=null),this.viewportChangeRaf!=null&&(this.cancelOwnerAnimationFrame(this.viewportChangeRaf),this.viewportChangeRaf=null),this.wheelMeasureRaf!=null&&(this.cancelOwnerAnimationFrame(this.wheelMeasureRaf),this.wheelMeasureRaf=null,this.wheelMeasure=null),this.panDrag=void 0,this.connectedWindow?.removeEventListener("pointermove",this.onBackgroundPointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onBackgroundPointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onBackgroundPointerUp),this.connectedWindow?.removeEventListener("lostpointercapture",this.onBackgroundPointerUp),this.nodeDrag=void 0,this.dragEdgeRefs=void 0,this.connectedWindow?.removeEventListener("pointermove",this.onNodePointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onNodePointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onNodePointerUp),this.connectedWindow?.removeEventListener("lostpointercapture",this.onNodePointerUp),this.connectState=void 0,this.connecting=!1,this.connectInvalidNodeId=null,this.keyboardConnectSourceId=null,this.keyboardConnectTargetIndex=0,this.connectedWindow?.removeEventListener("pointermove",this.onConnectPointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onConnectPointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onConnectPointerCancel),this.connectedWindow?.removeEventListener("lostpointercapture",this.onConnectPointerCancel),this.connectedWindow=void 0}adoptedCallback(){super.adoptedCallback(),this.announcements.adopted(),this.resetAuthoredCardObserver(),this.restoreAuthoredCardSlots(),this.hasConnectedLayoutBaseline=!1,this.layoutLimitAnnouncementPending=!1;const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.announcer.setTimerHost(ownerWindow),this.isConnected&&(this.bindAuthoredCardObserver(),this.scheduleAuthoredCardReconciliation(),this.nodes.length>0&&this.scheduleLayoutPass())}requestOwnerAnimationFrame(callback){const owner=this.ownerDocument.defaultView;return owner?{owner,handle:owner.requestAnimationFrame(callback)}:null}cancelOwnerAnimationFrame(frame){frame.owner.cancelAnimationFrame(frame.handle)}mirrorAnnouncement(text){this.renderRoot?.querySelector('[part="live-region"]')?.replaceChildren(text)}resetAuthoredCardObserver(){this.authoredCardObserverGeneration+=1,this.authoredCardObserver?.disconnect(),this.authoredCardObserver=void 0,this.authoredCardObserverDocument=void 0,this.authoredCardSyncQueued=!1}bindAuthoredCardObserver(){const ownerDocument=this.ownerDocument;if(!this.isConnected||this.authoredCardObserver&&this.authoredCardObserverDocument===ownerDocument)return;this.resetAuthoredCardObserver();const MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.authoredCardObserverGeneration,observer=new MutationObserverCtor(records=>{if(this.authoredCardObserver!==observer||this.authoredCardObserverDocument!==ownerDocument||this.authoredCardObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument)return;records.some(record=>record.type==="childList"?record.target===this:record.type==="attributes"&&record.attributeName==="node-id"&&record.target.parentNode===this)&&this.scheduleAuthoredCardReconciliation()});observer.observe(this,{childList:!0,attributes:!0,attributeFilter:["node-id"],subtree:!0}),this.authoredCardObserver=observer,this.authoredCardObserverDocument=ownerDocument}scheduleAuthoredCardReconciliation(){const generation=this.authoredCardObserverGeneration,ownerDocument=this.authoredCardObserverDocument??this.ownerDocument;!this.isConnected||this.authoredCardSyncQueued||(this.authoredCardSyncQueued=!0,queueMicrotask(()=>{this.authoredCardObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.authoredCardSyncQueued=!1,this.syncAuthoredCards(),this.pushCardPropsAll())}))}observeNodeWrappers(){for(const el of Array.from(this.renderRoot.querySelectorAll('[part="node"]')))this.observedNodeEls.has(el)||(this.observedNodeEls.add(el),this.resizeObserver?.observe(el))}willUpdate(changed){if(super.willUpdate(changed),this.rovingCache=void 0,this.companionStructure=void 0,changed.has("nodes")){this.cancelModelBoundGestures(),this.pruneNodeCaches(),this.syncAuthoredCards();const nodeIds=new Set(this.nodes.map(node=>node.id));this._selectedNodeIds=this.snapshotSelectedIds(this._requestedSelectedNodeIds,nodeIds)}if(changed.has("edges")){this.cancelModelBoundGestures();const edgeIds=new Set(this.edges.map(edge=>edge.id));this._selectedEdgeIds=this.snapshotSelectedIds(this._requestedSelectedEdgeIds,edgeIds)}if((changed.has("readonly")&&this.readonly||changed.has("orientation"))&&this.cancelActiveGestures(),changed.has("nodesDraggable")&&!this.nodesDraggable&&this.endNodeDrag(!1),changed.has("connectable")&&!this.connectable&&(this.onConnectPointerCancel(),this.keyboardConnectSourceId=null,this.keyboardConnectTargetIndex=0),changed.has("droppable")&&!this.droppable&&this.viewportEl?.removeAttribute("data-drop-active"),changed.has("grid")&&this.endNodeDrag(!1),changed.has("nodes")||changed.has("edges")||changed.has("orientation")||changed.has("layerGap")||changed.has("nodeGap"))for(const node of this.nodes)node.position||this.autoPositions.delete(node.id);(changed.has("nodes")||changed.has("selectedNodeIds")||changed.has("decorations")||changed.has("orientation"))&&this.pushCardPropsAll(changed)}pruneNodeCaches(){const nodeIds=new Set(this.nodes.map(node=>node.id));for(const id of this.autoPositions.keys())nodeIds.has(id)||this.autoPositions.delete(id);for(const id of this.measuredSizes.keys())nodeIds.has(id)||this.measuredSizes.delete(id);for(const element of this.observedNodeEls){const id=element.dataset.nodeId;id&&nodeIds.has(id)||(this.resizeObserver?.unobserve(element),this.observedNodeEls.delete(element))}}updated(changed){super.updated(changed),changed.has("edges")&&this.rebuildIncidentEdgesIndex(),changed.has("layoutTruncated")&&this.layoutLimitAnnouncementPending&&(this.layoutLimitAnnouncementPending=!1,this.isConnected&&this.layoutTruncated&&this.announcer.announce(this.localize("flowCanvasLayoutLimit"))),this.observeNodeWrappers(),(changed.has("nodes")||changed.has("edges")||changed.has("orientation")||changed.has("layerGap")||changed.has("nodeGap"))&&this.scheduleLayoutPass(),(changed.has("nodes")||changed.has("edges")||changed.has("decorations")||changed.has("minZoom")||changed.has("maxZoom")||changed.has("readonly")||changed.has("orientation")||changed.has("layerGap")||changed.has("nodeGap"))&&this.scheduleCompanionNotify();const viewportEl=this.renderRoot.querySelector('[part="viewport"]');viewportEl&&viewportEl!==this.viewportEl&&(this.viewportEl=viewportEl,this.worldEl=this.renderRoot.querySelector(".world"),viewportEl.addEventListener("wheel",this.onWheel,{passive:!1}),viewportEl.addEventListener("keydown",this.onViewportKeyDown),viewportEl.addEventListener("dragover",this.onViewportDragOver),viewportEl.addEventListener("dragleave",this.onViewportDragLeave),viewportEl.addEventListener("drop",this.onViewportDrop),this.applyWorldTransform())}syncAuthoredCards(){const ids=new Set(this.nodes.map(node=>node.id)),adopted=new Set;for(const child of Array.from(this.children)){const nodeId=child.getAttribute("node-id");if(nodeId&&ids.has(nodeId)){this.leaseAuthoredCardSlot(child,nodeId),adopted.add(child);continue}this.releaseAuthoredCardSlot(child),nodeId&&devWarnOnce(UNMATCHED_AUTHORED_CARD_WARNING,"<lr-flow-canvas> has a direct child with a node-id that matches no node; it will not render.")}for(const child of[...this.authoredCardSlotLeases.keys()])adopted.has(child)||this.releaseAuthoredCardSlot(child)}leaseAuthoredCardSlot(child,nodeId){let lease=this.authoredCardSlotLeases.get(child);if(!lease){const slot2=child.getAttribute("slot");lease={authoredSlot:slot2,appliedSlot:slot2,authorOwnsSlot:!1},this.authoredCardSlotLeases.set(child,lease)}if(lease.authorOwnsSlot||child.getAttribute("slot")!==lease.appliedSlot){lease.authorOwnsSlot=!0;return}const slot=`node-${nodeId}`;child.getAttribute("slot")!==slot&&child.setAttribute("slot",slot),lease.appliedSlot=child.getAttribute("slot")}releaseAuthoredCardSlot(child){const lease=this.authoredCardSlotLeases.get(child);lease&&(!lease.authorOwnsSlot&&child.getAttribute("slot")===lease.appliedSlot&&(lease.authoredSlot===null?child.removeAttribute("slot"):child.setAttribute("slot",lease.authoredSlot)),this.authoredCardSlotLeases.delete(child))}restoreAuthoredCardSlots(){for(const child of[...this.authoredCardSlotLeases.keys()])this.releaseAuthoredCardSlot(child)}pushCardPropsAll(changed){const nodesChanged=changed?.has("nodes")??!0,selectionChanged=nodesChanged||changed?.has("selectedNodeIds")===!0,decorationsChanged=nodesChanged||changed?.has("decorations")===!0,orientationChanged=nodesChanged||changed?.has("orientation")===!0,cardsByNodeId=new Map;for(const child of Array.from(this.children)){const nodeId=child.getAttribute("node-id");nodeId&&this.authoredCardSlotLeases.has(child)&&cardsByNodeId.set(nodeId,child)}const selectedNodeIds=selectionChanged?new Set(this.selectedNodeIds):null;for(const node of this.nodes){const card=cardsByNodeId.get(node.id);if(card&&(nodesChanged&&(this.setCardProperty(card,"inputs",node.inputs??DEFAULT_FLOW_INPUTS),this.setCardProperty(card,"outputs",node.outputs??DEFAULT_FLOW_OUTPUTS),this.setCardProperty(card,"flowType",node.type??"")),orientationChanged&&this.setCardProperty(card,"orientation",this.orientation),selectedNodeIds&&this.setCardProperty(card,"selected",selectedNodeIds.has(node.id)),decorationsChanged)){const decoration=this.decorations?.[node.id];this.setCardProperty(card,"status",decoration?.status??null),this.setCardProperty(card,"progress",decoration?.progress??null),this.setCardProperty(card,"statusDetail",decoration?.detail??""),this.setCardProperty(card,"durationMs",decoration?.durationMs??null)}}}setCardProperty(card,property2,value){try{card[property2]=value}catch{}}nodePosition(node){const position=node.position??this.autoPositions.get(node.id)??{x:0,y:0};return{x:finiteNumber(position.x,0),y:finiteNumber(position.y,0)}}nodeSize(id){const measured=this.measuredSizes.get(id);if(measured)return measured;const ownerWindow=this.ownerDocument?.defaultView,host=this.renderedNodeById(id)??this,computed=ownerWindow?.getComputedStyle(host),customWidth=resolveCssTokenLength(computed?.getPropertyValue("--lr-flow-canvas-node-fallback-inline-size").trim(),{host}),customHeight=resolveCssTokenLength(computed?.getPropertyValue("--lr-flow-canvas-node-fallback-block-size").trim(),{host}),width=customWidth??(resolveCssTokenLength(computed?.getPropertyValue("--lr-size-10rem").trim()||"10rem",{host})??0)+(resolveCssTokenLength(computed?.getPropertyValue("--lr-size-1rem").trim()||"1rem",{host})??0),height=customHeight??resolveCssTokenLength(computed?.getPropertyValue("--lr-size-4rem").trim()||"4rem",{host})??0;return{width,height}}resolvedNode(node){const pos=this.nodePosition(node),size=this.nodeSize(node.id);return{node,x:pos.x,y:pos.y,width:size.width,height:size.height}}handleOffset(count,index,span){return count<=1?span/2:span*(index+.5)/count}handlePoint(resolved,kind,handleId){const handles=kind==="input"?resolved.node.inputs??DEFAULT_FLOW_INPUTS:resolved.node.outputs??DEFAULT_FLOW_OUTPUTS,index=handles.findIndex(h=>h.id===handleId),horizontal=this.orientation==="horizontal",edgeSpan=horizontal?resolved.height:resolved.width,offset=index>=0?this.handleOffset(handles.length,index,edgeSpan):edgeSpan/2;if(horizontal)return{x:kind==="input"?resolved.x:resolved.x+resolved.width,y:resolved.y+offset};const y=kind==="input"?resolved.y:resolved.y+resolved.height;return{x:resolved.x+offset,y}}edgePathD(sourcePt,targetPt){const dx=targetPt.x-sourcePt.x,dy=targetPt.y-sourcePt.y,distance=Math.hypot(dx,dy),offset=Math.min(CONNECT_OFFSET_MAX,Math.max(CONNECT_OFFSET_MIN,distance/2)),horizontal=this.orientation==="horizontal",c1x=sourcePt.x+(horizontal?offset:0),c1y=sourcePt.y+(horizontal?0:offset),c2x=targetPt.x-(horizontal?offset:0),c2y=targetPt.y-(horizontal?0:offset);return`M ${sourcePt.x} ${sourcePt.y} C ${c1x} ${c1y}, ${c2x} ${c2y}, ${targetPt.x} ${targetPt.y}`}nodeAccessibleText(node){if(node.accessibleLabel)return node.accessibleLabel;const label=typeof node.data?.label=="string"?node.data.label:node.id;return this.localize("flowNode",void 0,{label})}edgeAccessibleText(edge){const sourceNode=nodeById(this.nodes,edge.source),targetNode=nodeById(this.nodes,edge.target),source=sourceNode?this.nodeAccessibleText(sourceNode):edge.source,target=targetNode?this.nodeAccessibleText(targetNode):edge.target;return edge.label?this.localize("flowEdgeWithLabel",void 0,{label:edge.label,source,target}):this.localize("flowEdge",void 0,{source,target})}onNodesResized(entries){let changedAny=!1;for(const entry of entries){const id=entry.target.dataset.nodeId;if(!id)continue;const box=entry.borderBoxSize?.[0],width=box?box.inlineSize:entry.contentRect.width,height=box?box.blockSize:entry.contentRect.height,prev=this.measuredSizes.get(id);(!prev||prev.width!==width||prev.height!==height)&&(this.measuredSizes.set(id,{width,height}),changedAny=!0)}changedAny&&(this.scheduleLayoutPass(),this.scheduleCompanionNotify())}measureNodeWrappers(){for(const wrapper of Array.from(this.renderRoot.querySelectorAll('[part="node"]'))){const id=wrapper.dataset.nodeId;if(!id)continue;const rect=wrapper.getBoundingClientRect(),width=wrapper.offsetWidth||rect.width/Math.max(this.zoomLevel,Number.EPSILON),height=wrapper.offsetHeight||rect.height/Math.max(this.zoomLevel,Number.EPSILON);Number.isFinite(width)&&Number.isFinite(height)&&width>0&&height>0&&this.measuredSizes.set(id,{width,height})}}scheduleLayoutPass(){!this.isConnected||this.layoutRaf!=null||(this.layoutRaf=this.requestOwnerAnimationFrame(()=>{this.layoutRaf=null,this.isConnected&&(this.measureNodeWrappers(),this.runAutoLayoutIfNeeded(),this.requestUpdate(),this.hasFitOnce||(this.hasFitOnce=this.applyFit()))}))}setLayoutTruncated(truncated){const previous=this.layoutTruncated;if(this.layoutTruncated=truncated,truncated||(this.layoutLimitAnnouncementPending=!1),!(!this.isConnected||this.nodes.length===0)){if(!this.hasConnectedLayoutBaseline){this.hasConnectedLayoutBaseline=!0;return}!previous&&truncated&&(this.layoutLimitAnnouncementPending=!0)}}runAutoLayoutIfNeeded(){const unpositioned=this.nodes.filter(n=>!n.position);if(unpositioned.length===0){this.setLayoutTruncated(!1);return}const swap=this.orientation==="horizontal",graphNodes=this.nodes.map(n=>{const size=this.nodeSize(n.id);return{id:n.id,width:swap?size.height:size.width,height:swap?size.width:size.height}}),nodeIds=new Set(this.nodes.map(n=>n.id)),graphEdges=this.edges.filter(e=>nodeIds.has(e.source)&&nodeIds.has(e.target)).map(e=>({source:e.source,target:e.target})),fixedPositions=new Map;for(const n of this.nodes){if(!n.position||n.position.x<0||n.position.y<0)continue;const size=this.nodeSize(n.id),center={x:n.position.x+size.width/2,y:n.position.y+size.height/2};!Number.isSafeInteger(Math.trunc(center.x))||!Number.isSafeInteger(Math.trunc(center.y))||fixedPositions.set(n.id,swap?{x:center.y,y:center.x}:center)}const result=layeredLayout({nodes:graphNodes,edges:graphEdges,options:{gapX:this.safeNodeGap,gapY:this.safeLayerGap,fixedPositions}}),positions={};for(const n of unpositioned){const raw=result.positions.get(n.id);if(!raw)continue;const center=swap?{x:raw.y,y:raw.x}:{x:raw.x,y:raw.y},size=this.nodeSize(n.id),resolved={x:center.x-size.width/2,y:center.y-size.height/2};this.autoPositions.set(n.id,resolved),positions[n.id]=Object.freeze(resolved)}this.rovingCache=void 0,this.setLayoutTruncated(result.truncated),Object.keys(positions).length>0&&this.emit("lr-layout-change",Object.freeze({positions:Object.freeze(positions),truncated:result.truncated}))}get viewport(){return Object.freeze({x:this.panX,y:this.panY,zoom:this.zoomLevel})}set viewport(_value){}setViewport(next){this.readonly||(this.panX=finiteNumber(next.x,this.panX),this.panY=finiteNumber(next.y,this.panY),this.zoomLevel=this.clampZoom(next.zoom),this.applyWorldTransform(),this.emit("lr-viewport-change",Object.freeze({x:this.panX,y:this.panY,zoom:this.zoomLevel})))}zoomIn(){this.readonly||this.zoomAtCenter(this.zoomLevel*ZOOM_MULTIPLIER)}zoomOut(){this.readonly||this.zoomAtCenter(this.zoomLevel/ZOOM_MULTIPLIER)}resetZoom(){this.readonly||this.setViewport({x:this.panX,y:this.panY,zoom:1})}fit(options){this.readonly||this.applyFit(options?.padding)}applyFit(requestedPadding=DEFAULT_FIT_PADDING){const rect=this.viewportEl?.getBoundingClientRect();if(this.nodes.length===0||!rect?.width||!rect.height)return!1;const padding=finiteRange(requestedPadding,DEFAULT_FIT_PADDING,0);let minX=1/0,minY=1/0,maxX=-1/0,maxY=-1/0;for(const node of this.nodes){const resolved=this.resolvedNode(node);minX=Math.min(minX,resolved.x),minY=Math.min(minY,resolved.y),maxX=Math.max(maxX,resolved.x+resolved.width),maxY=Math.max(maxY,resolved.y+resolved.height)}const viewW=rect.width,viewH=rect.height,transform=fitTransform({minX,minY,maxX,maxY},{width:viewW,height:viewH},padding,this.effectiveZoomBounds,{minimumAvailableSize:0,invalidZoomFallback:1,centerWithMinimumExtent:!0});return this.panX=transform.x,this.panY=transform.y,this.zoomLevel=transform.zoom,this.applyWorldTransform(),this.scheduleViewportChange(),!0}focusNode(id,options){if(this.readonly)return;const node=this.nodes.find(n=>n.id===id);if(!node)return;const resolved=this.resolvedNode(node),rect=this.viewportEl?.getBoundingClientRect(),viewW=rect?.width??0,viewH=rect?.height??0,zoom=options?.zoom!=null?this.clampZoom(options.zoom):this.zoomLevel;this.panX=viewW/2-(resolved.x+resolved.width/2)*zoom,this.panY=viewH/2-(resolved.y+resolved.height/2)*zoom,this.zoomLevel=zoom,this.applyWorldTransform(),this.scheduleViewportChange(),this.focusActiveItem(this.spatialItemIndex("node",id))}toContentPoint(clientX,clientY){const rect=this.viewportEl?.getBoundingClientRect();if(!rect)return{x:0,y:0};const localX=this.localWorldX(clientX,rect),localY=clientY-rect.top;return{x:(localX-this.panX)/this.zoomLevel,y:(localY-this.panY)/this.zoomLevel}}registerCompanion(cb){return this.companionCallbacks.add(cb),this.scheduleCompanionNotify(),()=>{this.companionCallbacks.delete(cb)}}scheduleCompanionNotify(structural=!0){if(structural&&(this.companionStructure=void 0),!this.isConnected||this.companionRaf!=null||this.companionCallbacks.size===0)return;const request=this.requestOwnerAnimationFrame(()=>{if(this.companionRaf===request&&(this.companionRaf=null,!(!this.isConnected||this.ownerDocument.defaultView!==request?.owner)))for(const cb of this.companionCallbacks)cb(this.buildSnapshot())});this.companionRaf=request}buildSnapshot(){const rect=this.viewportEl?.getBoundingClientRect(),bounds=this.effectiveZoomBounds;return this.companionStructure??={nodes:Object.freeze(this.nodes.map(n=>{const resolved=this.resolvedNode(n);return Object.freeze({id:n.id,x:resolved.x,y:resolved.y,width:resolved.width,height:resolved.height,status:this.decorations?.[n.id]?.status})})),edges:Object.freeze(this.edges.map(e=>Object.freeze({id:e.id,source:e.source,target:e.target,status:this.decorations?.[e.id]?.status})))},Object.freeze({...this.companionStructure,viewport:Object.freeze({x:this.panX,y:this.panY,zoom:this.zoomLevel,width:rect?.width??0,height:rect?.height??0,minZoom:bounds.min,maxZoom:bounds.max}),locked:this.readonly,orientation:this.orientation,layerGap:this.safeLayerGap,nodeGap:this.safeNodeGap})}clampZoom(z){const{min,max}=this.effectiveZoomBounds;return finiteRange(z,1,min,max)}applyWorldTransform(){this.worldEl&&(this.worldEl.style.transform=`translate(${this.panX}px, ${this.panY}px) scale(${this.zoomLevel})`),this.scheduleCompanionNotify(!1)}scheduleViewportChange(){this.viewportChangeRaf==null&&(this.viewportChangeRaf=this.requestOwnerAnimationFrame(()=>{this.viewportChangeRaf=null,this.emit("lr-viewport-change",Object.freeze({x:this.panX,y:this.panY,zoom:this.zoomLevel}))}))}zoomAtCenter(nextZoom){const rect=this.viewportEl?.getBoundingClientRect();this.zoomAtPoint(rect?rect.width/2:0,rect?rect.height/2:0,nextZoom)}zoomAtPoint(localX,localY,nextZoom){const clamped=this.clampZoom(nextZoom);if(clamped===this.zoomLevel)return;const contentX=(localX-this.panX)/this.zoomLevel,contentY=(localY-this.panY)/this.zoomLevel;this.panX=localX-contentX*clamped,this.panY=localY-contentY*clamped,this.zoomLevel=clamped,this.applyWorldTransform(),this.scheduleViewportChange()}localWorldX(clientX,rect,rtl=isRtl(this)){const local=clientX-rect.left;return this.orientation==="horizontal"&&rtl?rect.width-local:local}isFromTopLayerSurface(e,boundary){for(const entry of e.composedPath()){if(entry===boundary)return!1;if(entry instanceof Element&&(entry.hasAttribute("data-lr-top-layer")||isNativeTopLayerElement(entry)))return!0}return!1}endBackgroundPan(rollback){const drag=this.panDrag;drag&&(this.panDrag=void 0,this.viewportEl?.removeAttribute("data-panning"),this.connectedWindow?.removeEventListener("pointermove",this.onBackgroundPointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onBackgroundPointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onBackgroundPointerUp),this.connectedWindow?.removeEventListener("lostpointercapture",this.onBackgroundPointerUp),rollback&&(this.panX!==drag.startPanX||this.panY!==drag.startPanY)&&(this.panX=drag.startPanX,this.panY=drag.startPanY,this.applyWorldTransform(),this.scheduleViewportChange()))}panBy(dx,dy){this.panX+=dx,this.panY+=dy,this.applyWorldTransform(),this.scheduleViewportChange()}focusableEdges(){const nodeIds=new Set(this.nodes.map(n=>n.id));return this.edges.filter(e=>nodeIds.has(e.source)&&nodeIds.has(e.target))}rovingItems(){if(this.rovingCache)return this.rovingCache;const horizontal=this.orientation==="horizontal",keyed=this.nodes.map(node=>{const{x,y}=this.nodePosition(node);return{node,main:horizontal?x:y,cross:horizontal?y:x}});return keyed.sort((a,b)=>a.main-b.main||a.cross-b.cross),this.rovingCache=[...keyed.map(({node})=>({kind:"node",id:node.id,disabled:node.disabled===!0})),...this.focusableEdges().map(e=>({kind:"edge",id:e.id}))]}itemCount(){return this.rovingItems().length}isRovingItemDisabled(item){return item.disabled===!0}normalizedItemIndex(index=this.activeItemIndex){const items=this.rovingItems(),count=items.length;if(!count)return-1;const clamped=Math.min(Math.max(index,0),count-1);if(!this.isRovingItemDisabled(items[clamped]))return clamped;for(let forward=clamped+1;forward<count;forward+=1)if(!this.isRovingItemDisabled(items[forward]))return forward;for(let backward=clamped-1;backward>=0;backward-=1)if(!this.isRovingItemDisabled(items[backward]))return backward;return-1}nextEnabledItemIndex(from,direction){const items=this.rovingItems(),count=items.length;if(!count)return-1;let index=Math.min(Math.max(from+direction,0),count-1);for(let steps=0;steps<count;steps+=1){if(!this.isRovingItemDisabled(items[index]))return index;if(index+=direction,index<0||index>=count)break}return from>=0&&from<count&&!this.isRovingItemDisabled(items[from])?from:-1}firstEnabledItemIndex(){return this.rovingItems().findIndex(item=>!this.isRovingItemDisabled(item))}lastEnabledItemIndex(){const items=this.rovingItems();for(let index=items.length-1;index>=0;index-=1)if(!this.isRovingItemDisabled(items[index]))return index;return-1}itemAccessibleText(item){if(item.kind==="node"){const node=this.nodes.find(n=>n.id===item.id);return node?this.nodeAccessibleText(node):""}const edge=this.edges.find(e=>e.id===item.id);return edge?this.edgeAccessibleText(edge):""}spatialItemIndex(kind,id){return this.rovingItems().findIndex(it=>it.kind===kind&&it.id===id)}announceItem(index){const item=this.rovingItems()[index];item&&this.announcer.announce(this.localize("flowItemAnnouncement",void 0,{item:this.itemAccessibleText(item),index:this.formatNumber(index+1),total:this.formatNumber(this.itemCount())}))}formatNumber(value){return getNumberFormat(this.effectiveLocale).format(value)}onItemFocus(index){this.normalizedItemIndex(index)<0||(this.activeItemIndex=index,this.announceItem(index))}renderedElementByDataId(attribute,id){const renderRoot=this.renderRoot;if(!renderRoot)return null;const ownerCss=this.ownerDocument?.defaultView?.CSS,escape=ownerCss?.escape;if(typeof escape=="function")try{const match=renderRoot.querySelector(`[${attribute}="${escape.call(ownerCss,id)}"]`);if(match)return match}catch{}return[...renderRoot.querySelectorAll(`[${attribute}]`)].find(candidate=>candidate.getAttribute(attribute)===id)??null}renderedNodeById(id){return this.renderedElementByDataId("data-node-id",id)}renderedEdgeById(id){return this.renderedElementByDataId("data-edge-id",id)}focusActiveItem(index=this.activeItemIndex){const normalized=this.normalizedItemIndex(index);if(normalized<0)return;this.activeItemIndex=normalized,this.announceItem(normalized);const item=this.rovingItems()[normalized];item&&this.updateComplete.then(()=>{(item.kind==="node"?this.renderedNodeById(item.id)?.querySelector('[part="node-control"]'):this.renderedEdgeById(item.id)?.querySelector('[part="edge"]'))?.focus()})}applySelection(kind,id,additive){kind==="node"?(this.selectedNodeIds=additive?toggledSelection(this.selectedNodeIds,id):[id],additive||(this.selectedEdgeIds=[])):(this.selectedEdgeIds=additive?toggledSelection(this.selectedEdgeIds,id):[id],additive||(this.selectedNodeIds=[])),this.emit("lr-selection-change",Object.freeze({selectedNodeIds:Object.freeze([...this.selectedNodeIds]),selectedEdgeIds:Object.freeze([...this.selectedEdgeIds])}));const selected=kind==="node"?this.selectedNodeIds.includes(id):this.selectedEdgeIds.includes(id),label=this.itemAccessibleText({kind,id});this.announcer.announce(this.localize(selected?"flowNodeSelected":"flowNodeDeselected",void 0,{label}))}clearSelection(){this.selectedNodeIds.length===0&&this.selectedEdgeIds.length===0||(this.selectedNodeIds=[],this.selectedEdgeIds=[],this.emit("lr-selection-change",Object.freeze({selectedNodeIds:Object.freeze([]),selectedEdgeIds:Object.freeze([])})),this.announcer.announce(this.localize("flowSelectionCleared")))}deleteSelection(){!this.nodesDraggable&&!this.connectable&&!this.droppable||this.selectedNodeIds.length===0&&this.selectedEdgeIds.length===0||this.emit("lr-selection-delete",Object.freeze({nodeIds:Object.freeze([...this.selectedNodeIds]),edgeIds:Object.freeze([...this.selectedEdgeIds])}))}onNodeActivate(node,additive){node.disabled||(this.emit("lr-node-activate",Object.freeze({nodeId:node.id})),this.applySelection("node",node.id,additive))}startedOnAction(event,boundary){for(const entry of event.composedPath()){if(entry===boundary)return!1;if(entry.nodeType===1&&isActionableElement(entry))return!0}return!1}onNodeClick(event,node){if(this.startedOnAction(event,event.currentTarget)){event.stopPropagation();return}this.onNodeActivate(node,event.ctrlKey||event.metaKey)}onEdgeActivate(edge,additive){this.emit("lr-edge-activate",Object.freeze({edgeId:edge.id,sourceNodeId:edge.source,targetNodeId:edge.target,source:edge.source,target:edge.target})),this.applySelection("edge",edge.id,additive)}onItemKeyDown(e,index,activate){const arrowKeys=["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"];if(this.nodesDraggable&&!this.readonly&&(e.ctrlKey||e.metaKey)&&arrowKeys.includes(e.key)){const item=this.rovingItems()[index];if(item?.kind==="node"){e.preventDefault(),this.nudgeNode(item.id,e.key);return}}if(this.keyboardConnectSourceId){if(e.key==="Escape"){e.preventDefault(),this.cancelKeyboardConnect();return}if(e.key==="Enter"){e.preventDefault(),this.commitKeyboardConnect();return}const rtlForConnect=isRtl(this),forwardConnectKey=rtlForConnect?"ArrowLeft":"ArrowRight",backwardConnectKey=rtlForConnect?"ArrowRight":"ArrowLeft";if(e.key===forwardConnectKey||e.key==="ArrowDown"){e.preventDefault(),this.cycleKeyboardConnectTarget(1);return}if(e.key===backwardConnectKey||e.key==="ArrowUp"){e.preventDefault(),this.cycleKeyboardConnectTarget(-1);return}return}if(this.connectable&&!this.readonly&&e.key==="c"&&e.target===e.currentTarget){const item=this.rovingItems()[index];if(item?.kind==="node"){e.preventDefault(),this.startKeyboardConnect(item.id);return}}if(e.key==="Enter"||e.key===" "){e.preventDefault(),this.setActiveItemQuiet(index),activate(e.ctrlKey||e.metaKey);return}if(e.key==="Escape"){e.preventDefault(),e.target!==e.currentTarget?e.currentTarget.focus():this.clearSelection();return}if((e.key==="Delete"||e.key==="Backspace")&&e.target===e.currentTarget){e.preventDefault(),this.deleteSelection();return}if(!this.itemCount())return;const rtl=isRtl(this),forwardKey=rtl?"ArrowLeft":"ArrowRight",backwardKey=rtl?"ArrowRight":"ArrowLeft";let next;if(e.key===forwardKey||e.key==="ArrowDown")next=this.nextEnabledItemIndex(index,1);else if(e.key===backwardKey||e.key==="ArrowUp")next=this.nextEnabledItemIndex(index,-1);else if(e.key==="Home")next=this.firstEnabledItemIndex();else if(e.key==="End")next=this.lastEnabledItemIndex();else return;e.preventDefault(),next>=0&&this.focusActiveItem(next)}setActiveItemQuiet(index){const normalized=this.normalizedItemIndex(index);normalized>=0&&(this.activeItemIndex=normalized)}itemIndexMaps(){const items=this.rovingItems(),nodeIndex=new Map,edgeIndex=new Map;return items.forEach((item,i)=>{item.kind==="node"?nodeIndex.set(item.id,i):edgeIndex.set(item.id,i-nodeIndex.size)}),{nodeIndex,edgeIndex}}snap(value){const grid=this.safeGrid;return grid>0?Math.round(value/grid)*grid:value}rebuildIncidentEdgesIndex(){const map=new Map;for(const edge of this.edges)(map.get(edge.source)??map.set(edge.source,[]).get(edge.source)).push(edge.id),edge.target!==edge.source&&(map.get(edge.target)??map.set(edge.target,[]).get(edge.target)).push(edge.id);this.nodeIncidentEdges=map}buildDragEdgeRefs(nodeId){const refs=[];for(const edgeId of this.nodeIncidentEdges.get(nodeId)??[]){const edge=this.edges.find(e=>e.id===edgeId),sourceNode=edge&&this.nodes.find(n=>n.id===edge.source),targetNode=edge&&this.nodes.find(n=>n.id===edge.target);if(!edge||!sourceNode||!targetNode)continue;const group=this.renderedEdgeById(edgeId);refs.push({edge,sourceNode,targetNode,pathEl:group?.querySelector('[part="edge"]')??null,labelEl:group?.querySelector('[part="edge-label"]')??null})}return refs}updateIncidentEdges(nodeId,x,y){for(const{edge,sourceNode,targetNode,pathEl,labelEl}of this.dragEdgeRefs??[]){const sourceResolved=edge.source===nodeId?{...this.resolvedNode(sourceNode),x,y}:this.resolvedNode(sourceNode),targetResolved=edge.target===nodeId?{...this.resolvedNode(targetNode),x,y}:this.resolvedNode(targetNode),sourcePt=this.handlePoint(sourceResolved,"output",edge.sourceHandle??"out"),targetPt=this.handlePoint(targetResolved,"input",edge.targetHandle??"in");if(pathEl?.setAttribute("d",this.edgePathD(sourcePt,targetPt)),labelEl){const midX=(sourcePt.x+targetPt.x)/2;labelEl.setAttribute("x",String(midX)),labelEl.setAttribute("y",String((sourcePt.y+targetPt.y)/2)),this.orientation==="horizontal"&&isRtl(this)?labelEl.setAttribute("transform",`translate(${2*midX} 0) scale(-1 1)`):labelEl.removeAttribute("transform")}}}onNodePointerDown(e,node){if(!this.nodesDraggable||this.readonly||node.disabled)return;const wrapper=e.currentTarget;if(this.isFromTopLayerSurface(e,wrapper)||this.startedOnAction(e,wrapper))return;e.stopPropagation();const start=this.nodePosition(node);this.nodeDrag={pointerId:e.pointerId,nodeId:node.id,startClientX:e.clientX,startClientY:e.clientY,startX:start.x,startY:start.y,wrapper,rtlFlip:this.orientation==="horizontal"&&isRtl(this)?-1:1},this.dragEdgeRefs=this.buildDragEdgeRefs(node.id),wrapper.setPointerCapture?.(e.pointerId),this.connectedWindow?.addEventListener("pointermove",this.onNodePointerMove),this.connectedWindow?.addEventListener("pointerup",this.onNodePointerUp),this.connectedWindow?.addEventListener("pointercancel",this.onNodePointerUp),this.connectedWindow?.addEventListener("lostpointercapture",this.onNodePointerUp)}endNodeDrag(commit){const drag=this.nodeDrag;if(!drag)return;this.nodeDrag=void 0,this.connectedWindow?.removeEventListener("pointermove",this.onNodePointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onNodePointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onNodePointerUp),this.connectedWindow?.removeEventListener("lostpointercapture",this.onNodePointerUp);const previous={x:drag.startX,y:drag.startY},position={x:drag.currentX??drag.startX,y:drag.currentY??drag.startY};commit&&this.nodesDraggable&&this.nodes.some(node=>node.id===drag.nodeId)&&(position.x!==previous.x||position.y!==previous.y)&&this.emit("lr-node-move",Object.freeze({nodeId:drag.nodeId,position:Object.freeze(position),previous:Object.freeze(previous)}));const resetNode=this.nodes.find(n=>n.id===drag.nodeId),resetPos=resetNode?this.nodePosition(resetNode):previous;drag.wrapper.style.transform=`translate(${resetPos.x}px, ${resetPos.y}px)`,this.updateIncidentEdges(drag.nodeId,resetPos.x,resetPos.y),this.dragEdgeRefs=void 0,this.requestUpdate()}nudgeNode(nodeId,key){const node=this.nodes.find(n=>n.id===nodeId);if(!node)return;const current=this.nodePosition(node),step=this.safeGrid>0?this.safeGrid:1,rtlFlip=this.orientation==="horizontal"&&isRtl(this)?-1:1;let dx=0,dy=0;key==="ArrowRight"?dx=step*rtlFlip:key==="ArrowLeft"?dx=-step*rtlFlip:key==="ArrowDown"?dy=step:key==="ArrowUp"&&(dy=-step);const position={x:current.x+dx,y:current.y+dy};this.emit("lr-node-move",Object.freeze({nodeId,position:Object.freeze(position),previous:Object.freeze(current)})),this.announcer.announce(this.localize("flowNodeMoved",void 0,{label:this.nodeAccessibleText(node),x:this.formatNumber(position.x),y:this.formatNumber(position.y)})),this.requestUpdate()}nodeIdFromComposedPath(path){for(const el of path)if(isHtmlElement(el)&&el.getAttribute("part")==="node"&&el.dataset.nodeId)return el.dataset.nodeId;return null}isInvalidConnectTarget(hoveredId){return this.connectState?hoveredId===this.connectState.sourceId||this.nodes.find(n=>n.id===hoveredId)?.disabled?!0:this.edges.some(e=>e.source===this.connectState.sourceId&&e.target===hoveredId):!1}startConnectGesture(nodeId,handleId,clientX,clientY){const sourceNode=this.nodes.find(n=>n.id===nodeId);if(!sourceNode||sourceNode.disabled)return;const startPt=this.handlePoint(this.resolvedNode(sourceNode),"output",handleId);this.connectState={sourceId:nodeId,sourceHandle:handleId,startPt,rect:this.viewportEl?.getBoundingClientRect()??null,rtl:isRtl(this)},this.connecting=!0,this.announcer.announce(this.localize("flowConnectStarted",void 0,{label:this.nodeAccessibleText(sourceNode)})),this.updateComplete.then(()=>{this.connectionLineEl=this.renderRoot.querySelector('[part="connection-line"]')??void 0,this.connectionLineEl?.setAttribute("d",this.edgePathD(startPt,this.connectContentPoint(clientX,clientY)))}),this.connectedWindow?.addEventListener("pointermove",this.onConnectPointerMove),this.connectedWindow?.addEventListener("pointerup",this.onConnectPointerUp),this.connectedWindow?.addEventListener("pointercancel",this.onConnectPointerCancel),this.connectedWindow?.addEventListener("lostpointercapture",this.onConnectPointerCancel)}connectContentPoint(clientX,clientY){const state2=this.connectState;if(!state2?.rect)return{x:0,y:0};const localX=this.localWorldX(clientX,state2.rect,state2.rtl),localY=clientY-state2.rect.top;return{x:(localX-this.panX)/this.zoomLevel,y:(localY-this.panY)/this.zoomLevel}}isInvalidConnectTargetFor(state2,hoveredId){return hoveredId===state2.sourceId||this.nodes.find(n=>n.id===hoveredId)?.disabled?!0:this.edges.some(e=>e.source===state2.sourceId&&e.target===hoveredId)}endConnectGesture(){this.connectInvalidNodeId&&(this.renderedNodeById(this.connectInvalidNodeId)?.removeAttribute("data-connect-invalid"),this.connectInvalidNodeId=null),this.connectState=void 0,this.connecting=!1,this.connectedWindow?.removeEventListener("pointermove",this.onConnectPointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onConnectPointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onConnectPointerCancel),this.connectedWindow?.removeEventListener("lostpointercapture",this.onConnectPointerCancel)}cancelActiveGestures(){this.endBackgroundPan(!0),this.cancelModelBoundGestures(),this.viewportEl?.removeAttribute("data-drop-active")}cancelModelBoundGestures(){this.endNodeDrag(!1),this.onConnectPointerCancel(),this.keyboardConnectSourceId=null,this.keyboardConnectTargetIndex=0}eligibleConnectTargets(sourceId){const linked=new Set(this.edges.filter(e=>e.source===sourceId).map(e=>e.target));return this.nodes.filter(n=>n.id!==sourceId&&!n.disabled&&!linked.has(n.id))}startKeyboardConnect(sourceId){const sourceNode=this.nodes.find(n=>n.id===sourceId);!sourceNode||sourceNode.disabled||this.eligibleConnectTargets(sourceId).length===0||(this.keyboardConnectSourceId=sourceId,this.keyboardConnectTargetIndex=0,sourceNode&&this.announceKeyboardConnectTarget())}cycleKeyboardConnectTarget(direction){if(!this.keyboardConnectSourceId)return;const targets=this.eligibleConnectTargets(this.keyboardConnectSourceId);targets.length!==0&&(this.keyboardConnectTargetIndex=(this.keyboardConnectTargetIndex+direction+targets.length)%targets.length,this.announceKeyboardConnectTarget())}announceKeyboardConnectTarget(){const sourceId=this.keyboardConnectSourceId;if(!sourceId)return;const source=this.nodes.find(node=>node.id===sourceId),targets=this.eligibleConnectTargets(sourceId),target=targets[this.keyboardConnectTargetIndex];!source||!target||this.announcer.announce(this.localize("flowConnectTarget",void 0,{source:this.nodeAccessibleText(source),target:this.nodeAccessibleText(target),index:this.formatNumber(this.keyboardConnectTargetIndex+1),total:this.formatNumber(targets.length)}))}commitKeyboardConnect(){const sourceId=this.keyboardConnectSourceId;if(!sourceId)return;const target=this.eligibleConnectTargets(sourceId)[this.keyboardConnectTargetIndex];if(this.keyboardConnectSourceId=null,!target)return;const sourceOutputs=nodeById(this.nodes,sourceId)?.outputs??DEFAULT_FLOW_OUTPUTS,targetInputs=target.inputs??DEFAULT_FLOW_INPUTS;if(!this.connectable||this.readonly)return;this.emit("lr-connect",Object.freeze({source:sourceId,target:target.id,sourceHandle:sourceOutputs[0]?.id??"out",targetHandle:targetInputs[0]?.id??"in"}));const source=this.nodes.find(node=>node.id===sourceId);this.announcer.announce(this.localize("flowConnectCommitted",void 0,{source:source?this.nodeAccessibleText(source):sourceId,target:this.nodeAccessibleText(target)}))}cancelKeyboardConnect(){this.keyboardConnectSourceId&&(this.keyboardConnectSourceId=null,this.announcer.announce(this.localize("flowConnectCancelled")))}statusTone(status){return status==="running"?"brand":status==="success"?"success":status==="error"?"danger":status==="denied"?"warning":"neutral"}edgeTone(edge){const decoration=this.decorations?.[edge.id];return decoration?this.statusTone(decoration.status):edge.tone??"neutral"}edgeIsRunning(edge){return this.decorations?.[edge.id]?.status==="running"}renderEdges(resolvedById,nodeIndex,edgeIndex,activeIndex){const selectedEdges=new Set(this.selectedEdgeIds),items=[],reducedMotion=!this.ownerDocument?.defaultView||prefersReducedMotion(this),counterMirrorLabels=this.orientation==="horizontal"&&!!this.ownerDocument?.defaultView&&isRtl(this);for(const edge of this.edges){const sourceResolved=resolvedById.get(edge.source);if(!sourceResolved)continue;const targetResolved=resolvedById.get(edge.target),sourcePt=this.handlePoint(sourceResolved,"output",edge.sourceHandle??"out");if(!targetResolved){const stubPt={x:sourcePt.x+14,y:sourcePt.y+14};items.push(svg`<line
+import{__decorate}from"tslib";import{SourcePageController}from"../../../internal/source-page-controller.js";import{SourceRequestController,sourceCount,sourceRevision}from"../../../internal/source-request-controller.js";import{GraphSceneController,SceneReader}from"../../../internal/graph-scene-controller.js";import{flowSceneDomain}from"../../../internal/flow-scene-envelope.js";import{flowSourceRows,flowSourceSummary,flowSourceOverview,sameFlowBounds}from"./flow-source.js";import{html,nothing,svg}from"lit";import{property,state}from"lit/decorators.js";import{guard}from"lit/directives/guard.js";import{ref}from"lit/directives/ref.js";import{repeat}from"lit/directives/repeat.js";import{LyraElement}from"../../../internal/lyra-element.js";import{fitTransform}from"../../../internal/fit-transform.js";import{nextId,srOnly}from"../../../internal/a11y.js";import{AnnouncementSinkController,Announcer}from"../../../internal/announcer.js";import{isRtl}from"../../../internal/rtl.js";import{prefersReducedMotion}from"../../../internal/motion.js";import{observeReducedMotion}from"../../../internal/motion-observer.js";import{layeredLayout}from"../../../internal/layered-layout.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{finiteNumber,finiteRange,finiteInteger}from"../../../internal/numbers.js";import{isActionableElement}from"../../../internal/focus-navigation.js";import{isNativeTopLayerElement}from"../../../internal/fixed-containing-block.js";import{isHtmlElement}from"../../../internal/dom-guards.js";import{resolveCssTokenLength}from"../../../internal/css-token-length.js";import{devWarnOnce}from"../../../internal/dev-mode-attribute-warning.js";import{tag}from"../../../internal/prefix.js";import{DEFAULT_FLOW_INPUTS,DEFAULT_FLOW_OUTPUTS,snapshotFlowDecorations,snapshotFlowEdges,snapshotFlowNodes,MAX_FLOW_COLLECTION_ENTRIES}from"./flow-model.js";import{FLOW_PALETTE_MIME_TYPE}from"./flow-types.js";import{styles}from"./flow-canvas.styles.js";import{FlowViewportIndex}from"./flow-viewport-index.js";import{composedParentElement,deepActiveElementIn}from"../../../internal/active-element.js";import{LYRA_DEFAULT_flowCanvasInputLimit,LYRA_DEFAULT_flowCanvasLabel,LYRA_DEFAULT_flowCanvasLayoutLimit,LYRA_DEFAULT_flowCanvasSummary,LYRA_DEFAULT_flowConnectCancelled,LYRA_DEFAULT_flowConnectCommitted,LYRA_DEFAULT_flowConnectStarted,LYRA_DEFAULT_flowConnectTarget,LYRA_DEFAULT_flowEdge,LYRA_DEFAULT_flowEdgeList,LYRA_DEFAULT_flowEdgeWithLabel,LYRA_DEFAULT_flowNode,LYRA_DEFAULT_flowNodeDeselected,LYRA_DEFAULT_flowNodeMoved,LYRA_DEFAULT_flowNodeSelected,LYRA_DEFAULT_flowSelectionCleared,LYRA_DEFAULT_paginationPage}from"../../../internal/default-strings/data.generated.js";import{LYRA_DEFAULT_flowItemAnnouncement,LYRA_DEFAULT_graphSourceAllRecords,LYRA_DEFAULT_graphSourceBothDirections,LYRA_DEFAULT_graphSourceCoverageAggregate,LYRA_DEFAULT_graphSourceCoverageComplete,LYRA_DEFAULT_graphSourceCoverageNeighborhood,LYRA_DEFAULT_graphSourceDirection,LYRA_DEFAULT_graphSourceEdges,LYRA_DEFAULT_graphSourceIncidentEdges,LYRA_DEFAULT_graphSourceNodes,LYRA_DEFAULT_graphSourceRecordMissing,LYRA_DEFAULT_graphSourceRecords,LYRA_DEFAULT_graphSourceRecordsError,LYRA_DEFAULT_graphSourceSceneError,LYRA_DEFAULT_graphSourceTotals,LYRA_DEFAULT_loading,LYRA_DEFAULT_neighborDirectionIn,LYRA_DEFAULT_neighborDirectionOut,LYRA_DEFAULT_next,LYRA_DEFAULT_noData,LYRA_DEFAULT_previous,LYRA_DEFAULT_retry,LYRA_DEFAULT_search}from"../../../internal/default-strings/shared.generated.js";export*from"./flow-types.js";const EMPTY_FLOW_QUERY=Object.freeze({kind:"nodes",search:"",centerKey:null,direction:"both",nodeTypes:Object.freeze([])}),EMPTY_FLOW_NODES=Object.freeze([]),EMPTY_FLOW_EDGES=Object.freeze([]),FLOW_EDGE_TONES=["neutral","brand","success","warning","danger"],CONNECT_OFFSET_MIN=24,CONNECT_OFFSET_MAX=120,ZOOM_MULTIPLIER=1.2,DEFAULT_FIT_PADDING=24,KEYBOARD_PAN_STEP=32,UNMATCHED_AUTHORED_CARD_WARNING="lyra-flow-canvas-unmatched-authored-card";function toggledSelection(list,id){return list.includes(id)?list.filter(x=>x!==id):[...list,id]}const nodeMaps=new WeakMap;function nodeById(nodes,id){let map=nodeMaps.get(nodes);return map||nodeMaps.set(nodes,map=new Map(nodes.map(node=>[node.id,node]))),map.get(id)}function nodeTypePart(type){if(!type)return null;const normalized=type.trim().toLowerCase().replace(/[^a-z0-9_-]+/g,"-").replace(/^-+|-+$/g,"");return normalized?`node-type-${/^\d/.test(normalized)?`type-${normalized}`:normalized}`:null}class LyraFlowCanvas extends LyraElement{constructor(){super(...arguments),this.sourceEpoch=0,this.sourceIntent=0,this.sourceSyncing=!1,this.sourcePagePromise=Promise.resolve(!1),this.sourceSceneInputs="",this.sourceQuery=EMPTY_FLOW_QUERY,this.sourceSceneFailure=!1,this.sourceMissing=!1,this.sourceNodes=EMPTY_FLOW_NODES,this.sourceEdges=EMPTY_FLOW_EDGES,this.sourceOverview=null,this.sourceOverviewEpoch=-1,this.sourceOverviewRunning=!1,this.sourceState=0,this.sourceOverviewRequests=new SourceRequestController(this,{channels:["overview"]}),this.sourcePages=new SourcePageController(this,{normalizeRecord:record=>record,normalizeSummary:raw=>flowSourceSummary(raw,new SceneReader(()=>!0)),validateMetadata:(result,query)=>{const total=result.summary[query.kind];if(result.total>total||!query.search&&query.centerKey===null&&result.total!==total||result.rows.some(row=>row.value.kind!==(query.kind==="nodes"?"node":"edge")))throw new TypeError("Invalid flow record total");const scene=this.sourceAcceptedScene;if(scene&&(scene.total.nodes!==result.summary.nodes||scene.total.edges!==result.summary.edges))throw new TypeError("Inconsistent flow totals")},onChange:()=>{if(!this.sourceMode)return;const state2=this.sourcePages.state;state2.result&&!state2.pending&&!state2.error&&(this._sourcePage=state2.page,this.sourcePageInputs=[this.sourceQuery,state2.page,state2.pageSize]),this.sourceState++}}),this.sourceScene=new GraphSceneController(this,{domain:flowSceneDomain,onChange:()=>{if(!this.sourceMode)return;const scene=this.sourceScene.state.scene;if(this.sourceScene.state.error&&(this.sourceNodes=EMPTY_FLOW_NODES,this.sourceEdges=EMPTY_FLOW_EDGES,this.rovingCache=void 0,this.renderResolved=void 0,this.companionStructure=void 0,this.pruneNodeCaches(),this.scheduleCompanionNotify()),scene&&scene!==this.sourceAcceptedScene){const previousScene=this.sourceAcceptedScene,summary=this.sourcePages.state.result?.summary;this.sourceSceneFailure=!scene.worldBounds||!!(this.sourceWorld&&!sameFlowBounds(this.sourceWorld,scene.worldBounds))||!!(summary&&(summary.nodes!==scene.total.nodes||summary.edges!==scene.total.edges))||!!(previousScene&&(previousScene.total.nodes!==scene.total.nodes||previousScene.total.edges!==scene.total.edges)),this.sourceNodes=this.sourceSceneFailure?EMPTY_FLOW_NODES:Object.freeze(scene.nodes.map(node=>node.value)),this.sourceEdges=this.sourceSceneFailure?EMPTY_FLOW_EDGES:Object.freeze(scene.edges.map(edge=>edge.value)),this.sourceSceneFailure||(this.sourceAcceptedScene=scene,this.sourceWorld??=scene.worldBounds),this.rovingCache=void 0,this.renderResolved=void 0,this.companionStructure=void 0,this.pruneNodeCaches(),this.scheduleCompanionNotify()}this.sourceState++}}),this._sourcePage=0,this._sourcePageSize=100,this._nodes=Object.freeze([]),this.nodesInputTruncated=!1,this.edgesInputTruncated=!1,this._edges=Object.freeze([]),this._orientation="horizontal",this.nodesDraggable=!1,this.connectable=!1,this.droppable=!1,this.readonly=!1,this._selectedNodeIds=Object.freeze([]),this._requestedSelectedNodeIds=Object.freeze([]),this._selectedEdgeIds=Object.freeze([]),this._requestedSelectedEdgeIds=Object.freeze([]),this.minZoom=.25,this.maxZoom=2,this.grid=8,this.layerGap=64,this.nodeGap=24,this._decorations=null,this.accessibleLabel=null,this.arrowMarkerIds={neutral:nextId("flow-canvas-arrow-neutral"),brand:nextId("flow-canvas-arrow-brand"),success:nextId("flow-canvas-arrow-success"),warning:nextId("flow-canvas-arrow-warning"),danger:nextId("flow-canvas-arrow-danger")},this.liveRegionId=nextId("flow-canvas-live"),this.announcements=new AnnouncementSinkController(this,{eager:["polite"]}),this.announcer=new Announcer({onFlush:text=>{this.mirrorAnnouncement(text),this.announcements.announcePolite(text)}}),this.activeItemIndex=0,this.viewportRevision=0,this.explicitRefresh=!1,this.renderEpoch=0,this.visibleViewport=-1,this.geometryRtl=!1,this.hasUnpositionedNodes=!1,this.nodeModelOrder=new Map,this.edgeModelOrder=new Map,this.baseVisibleNodes=[],this.baseVisibleEdges=[],this.renderedNodes=[],this.renderedEdges=[],this.connecting=!1,this.layoutTruncated=!1,this.hasConnectedLayoutBaseline=!1,this.layoutLimitAnnouncementPending=!1,this.keyboardConnectSourceId=null,this.keyboardConnectTargetIndex=0,this.autoPositions=new Map,this.measuredSizes=new Map,this.nodeWrappers=new Map,this.edgeWrappers=new Map,this.fallbackSizes=new Map,this.fallbackPassDepth=0,this.nodesById=new Map,this.edgesById=new Map,this.outgoingTargets=new Map,this.fallbackEdges=[],this.observedNodeEls=new Set,this.authoredCardObserverGeneration=0,this.authoredCardSyncQueued=!1,this.authoredCardSlotLeases=new Map,this.layoutRaf=null,this.geometryRaf=null,this.panX=0,this.panY=0,this.zoomLevel=1,this.viewportChangeRaf=null,this.hasFitOnce=!1,this.wheelMeasure=null,this.wheelMeasureRaf=null,this.nodeIncidentEdges=new Map,this.connectInvalidNodeId=null,this.companionCallbacks=new Set,this.companionRaf=null,this.onWheel=e=>{if(this.readonly||!this.viewportEl||this.isFromTopLayerSurface(e,this.viewportEl))return;e.preventDefault(),this.wheelMeasure||(this.wheelMeasure={rect:this.viewportEl.getBoundingClientRect(),rtl:isRtl(this)},this.wheelMeasureRaf=this.requestOwnerAnimationFrame(()=>{this.wheelMeasure=null,this.wheelMeasureRaf=null}));const{rect,rtl}=this.wheelMeasure,localX=this.localWorldX(e.clientX,rect,rtl),localY=e.clientY-rect.top,factor=e.deltaY<0?ZOOM_MULTIPLIER:1/ZOOM_MULTIPLIER;this.zoomAtPoint(localX,localY,this.zoomLevel*factor)},this.onBackgroundPointerDown=e=>{this.readonly||this.isFromTopLayerSurface(e,this.viewportEl)||(this.panDrag={pointerId:e.pointerId,startClientX:e.clientX,startClientY:e.clientY,startPanX:this.panX,startPanY:this.panY,rtlFlip:this.orientation==="horizontal"&&isRtl(this)?-1:1},e.target.setPointerCapture?.(e.pointerId),this.viewportEl?.setAttribute("data-panning",""),this.connectedWindow?.addEventListener("pointermove",this.onBackgroundPointerMove),this.connectedWindow?.addEventListener("pointerup",this.onBackgroundPointerUp),this.connectedWindow?.addEventListener("pointercancel",this.onBackgroundPointerUp),this.connectedWindow?.addEventListener("lostpointercapture",this.onBackgroundPointerUp))},this.onBackgroundPointerMove=e=>{const drag=this.panDrag;if(!(!drag||e.pointerId!==drag.pointerId)){if(this.readonly){this.endBackgroundPan(!0);return}this.panX=drag.startPanX+(e.clientX-drag.startClientX)*drag.rtlFlip,this.panY=drag.startPanY+(e.clientY-drag.startClientY),this.applyWorldTransform(),this.scheduleViewportChange()}},this.onBackgroundPointerUp=e=>{!this.panDrag||e.pointerId!==this.panDrag.pointerId||this.endBackgroundPan(this.readonly||e.type!=="pointerup")},this.onViewportKeyDown=e=>{if(!(e.target!==this.viewportEl||this.readonly))if(e.key==="+"||e.key==="=")e.preventDefault(),this.zoomIn();else if(e.key==="-"||e.key==="_")e.preventDefault(),this.zoomOut();else if(e.key==="0")e.preventDefault(),this.resetZoom();else if(e.key==="ArrowRight"){e.preventDefault();const rtlFlip=this.orientation==="horizontal"&&isRtl(this)?-1:1;this.panBy(-KEYBOARD_PAN_STEP*rtlFlip,0)}else if(e.key==="ArrowLeft"){e.preventDefault();const rtlFlip=this.orientation==="horizontal"&&isRtl(this)?-1:1;this.panBy(KEYBOARD_PAN_STEP*rtlFlip,0)}else e.key==="ArrowDown"?(e.preventDefault(),this.panBy(0,-KEYBOARD_PAN_STEP)):e.key==="ArrowUp"&&(e.preventDefault(),this.panBy(0,KEYBOARD_PAN_STEP))},this.onViewportDragOver=e=>{this.sourceMode||!this.droppable||this.readonly||e.dataTransfer?.types.includes(FLOW_PALETTE_MIME_TYPE)&&(e.preventDefault(),e.dataTransfer.dropEffect="copy",this.viewportEl?.setAttribute("data-drop-active",""))},this.onViewportDragLeave=()=>{this.viewportEl?.removeAttribute("data-drop-active")},this.onViewportDrop=e=>{if(this.viewportEl?.removeAttribute("data-drop-active"),this.sourceMode||!this.droppable||this.readonly)return;const raw=e.dataTransfer?.getData(FLOW_PALETTE_MIME_TYPE);if(!raw)return;e.preventDefault();const maxPayloadBytes=4096;if(raw.length>maxPayloadBytes)return;const TextEncoderCtor=this.ownerDocument.defaultView?.TextEncoder??globalThis.TextEncoder;if(TextEncoderCtor&&new TextEncoderCtor().encode(raw).byteLength>maxPayloadBytes)return;let payload;try{payload=JSON.parse(raw)}catch{return}if(typeof payload!="object"||payload===null||Array.isArray(payload)||Object.getPrototypeOf(payload)!==Object.prototype&&Object.getPrototypeOf(payload)!==null)return;const rawType=payload.type;if(typeof rawType!="string")return;const type=rawType.trim();if(!type||type.length>128)return;const contentPoint=this.toContentPoint(e.clientX,e.clientY);this.emit("lr-node-add",Object.freeze({type,position:Object.freeze({x:this.snap(contentPoint.x),y:this.snap(contentPoint.y)})}))},this.onNodePointerMove=e=>{const drag=this.nodeDrag;if(!drag||e.pointerId!==drag.pointerId)return;if(this.sourceMode||this.readonly||!this.nodesDraggable){this.endNodeDrag(!1);return}const dx=(e.clientX-drag.startClientX)*drag.rtlFlip/this.zoomLevel,dy=(e.clientY-drag.startClientY)/this.zoomLevel,x=this.snap(drag.startX+dx),y=this.snap(drag.startY+dy);drag.wrapper.style.transform=`translate(${x}px, ${y}px)`,this.updateIncidentEdges(drag.nodeId,x,y),drag.currentX=x,drag.currentY=y},this.onNodePointerUp=e=>{const drag=this.nodeDrag;!drag||e.pointerId!==drag.pointerId||this.endNodeDrag(!this.sourceMode&&!this.readonly&&e.type==="pointerup")},this.onWorldPointerDown=e=>{if(this.sourceMode||!this.connectable||this.readonly||this.connectState||this.isFromTopLayerSurface(e,this.viewportEl))return;const path=e.composedPath(),handleEl=path.find(el=>isHtmlElement(el)&&el.dataset.handleKind==="output");if(!handleEl)return;const nodeId=this.nodeIdFromComposedPath(path),handleId=handleEl.dataset.handleId;!nodeId||!handleId||(e.stopPropagation(),this.startConnectGesture(nodeId,handleId,e.clientX,e.clientY))},this.onConnectPointerMove=e=>{if(!this.connectState)return;if(this.sourceMode||this.readonly||!this.connectable){this.onConnectPointerCancel();return}const targetPt=this.connectContentPoint(e.clientX,e.clientY);this.connectionLineEl?.setAttribute("d",this.edgePathD(this.connectState.startPt,targetPt));const hoveredId=this.nodeIdFromComposedPath(e.composedPath()),invalid=hoveredId!=null&&this.isInvalidConnectTarget(hoveredId);this.connectInvalidNodeId&&this.connectInvalidNodeId!==(invalid?hoveredId:null)&&this.renderedNodeById(this.connectInvalidNodeId)?.removeAttribute("data-connect-invalid"),this.connectInvalidNodeId=invalid?hoveredId:null,invalid&&this.renderedNodeById(hoveredId)?.setAttribute("data-connect-invalid","")},this.onConnectPointerUp=e=>{if(!this.connectState)return;if(this.sourceMode||this.readonly||!this.connectable){this.onConnectPointerCancel();return}const state2=this.connectState,path=e.composedPath(),targetNodeId=this.nodeIdFromComposedPath(path);if(this.endConnectGesture(),!targetNodeId||this.isInvalidConnectTargetFor(state2,targetNodeId)){this.announcer.announce(this.localize("flowConnectCancelled"));return}const targetHandle=path.find(el=>isHtmlElement(el)&&el.dataset.handleKind==="input")?.dataset.handleId??"in";this.emit("lr-connect",Object.freeze({source:state2.sourceId,target:targetNodeId,sourceHandle:state2.sourceHandle,targetHandle}));const sourceNode=this.modelNodes.find(node=>node.id===state2.sourceId),targetNode=this.modelNodes.find(node=>node.id===targetNodeId);this.announcer.announce(this.localize("flowConnectCommitted",void 0,{source:sourceNode?this.nodeAccessibleText(sourceNode):state2.sourceId,target:targetNode?this.nodeAccessibleText(targetNode):targetNodeId}))},this.onConnectPointerCancel=()=>{this.connectState&&(this.endConnectGesture(),this.announcer.announce(this.localize("flowConnectCancelled")))}}static{this.defaultStrings={...super.defaultStrings,flowCanvasInputLimit:LYRA_DEFAULT_flowCanvasInputLimit,flowCanvasLabel:LYRA_DEFAULT_flowCanvasLabel,flowCanvasLayoutLimit:LYRA_DEFAULT_flowCanvasLayoutLimit,flowCanvasSummary:LYRA_DEFAULT_flowCanvasSummary,flowConnectCancelled:LYRA_DEFAULT_flowConnectCancelled,flowConnectCommitted:LYRA_DEFAULT_flowConnectCommitted,flowConnectStarted:LYRA_DEFAULT_flowConnectStarted,flowConnectTarget:LYRA_DEFAULT_flowConnectTarget,flowEdge:LYRA_DEFAULT_flowEdge,flowEdgeList:LYRA_DEFAULT_flowEdgeList,flowEdgeWithLabel:LYRA_DEFAULT_flowEdgeWithLabel,flowItemAnnouncement:LYRA_DEFAULT_flowItemAnnouncement,flowNode:LYRA_DEFAULT_flowNode,flowNodeDeselected:LYRA_DEFAULT_flowNodeDeselected,flowNodeMoved:LYRA_DEFAULT_flowNodeMoved,flowNodeSelected:LYRA_DEFAULT_flowNodeSelected,flowSelectionCleared:LYRA_DEFAULT_flowSelectionCleared,graphSourceAllRecords:LYRA_DEFAULT_graphSourceAllRecords,graphSourceBothDirections:LYRA_DEFAULT_graphSourceBothDirections,graphSourceCoverageAggregate:LYRA_DEFAULT_graphSourceCoverageAggregate,graphSourceCoverageComplete:LYRA_DEFAULT_graphSourceCoverageComplete,graphSourceCoverageNeighborhood:LYRA_DEFAULT_graphSourceCoverageNeighborhood,graphSourceDirection:LYRA_DEFAULT_graphSourceDirection,graphSourceEdges:LYRA_DEFAULT_graphSourceEdges,graphSourceIncidentEdges:LYRA_DEFAULT_graphSourceIncidentEdges,graphSourceNodes:LYRA_DEFAULT_graphSourceNodes,graphSourceRecordMissing:LYRA_DEFAULT_graphSourceRecordMissing,graphSourceRecords:LYRA_DEFAULT_graphSourceRecords,graphSourceRecordsError:LYRA_DEFAULT_graphSourceRecordsError,graphSourceSceneError:LYRA_DEFAULT_graphSourceSceneError,graphSourceTotals:LYRA_DEFAULT_graphSourceTotals,loading:LYRA_DEFAULT_loading,neighborDirectionIn:LYRA_DEFAULT_neighborDirectionIn,neighborDirectionOut:LYRA_DEFAULT_neighborDirectionOut,next:LYRA_DEFAULT_next,noData:LYRA_DEFAULT_noData,paginationPage:LYRA_DEFAULT_paginationPage,previous:LYRA_DEFAULT_previous,retry:LYRA_DEFAULT_retry,search:LYRA_DEFAULT_search}}static{this.styles=[LyraElement.styles,styles,srOnly]}get graphSource(){return this._graphSource}set graphSource(value){const old=this._graphSource;this._graphSource=value,this.resetFlowSource(),this.requestUpdate("graphSource",old)}get sourcePage(){return this._sourcePage}set sourcePage(value){const old=this._sourcePage;this._sourcePage=value,this.sourceSyncing||this.sourceIntent++,this.syncFlowSource(),this.requestUpdate("sourcePage",old)}get sourcePageSize(){return this._sourcePageSize}set sourcePageSize(value){const old=this._sourcePageSize;this._sourcePageSize=value,this._sourcePage=0,this.sourceIntent++,this.syncFlowSource(),this.requestUpdate("sourcePageSize",old)}get sourceTotal(){return this.graphSource===void 0||this.sourceError?null:this.sourcePages.state.result?.total??null}get modelNodes(){return this.graphSource===void 0?this._nodes:this.sourceNodes}get modelEdges(){return this.graphSource===void 0?this._edges:this.sourceEdges}get sourceMode(){return this.graphSource!==void 0}resetFlowSource(){this.sourceEpoch++,this.sourceIntent++,this.sourceInputs=void 0,this.sourcePageInputs=void 0,this.sourceSceneInputs="",this.sourceQuery=EMPTY_FLOW_QUERY,this._sourcePage=0,this.sourceError=void 0,this.sourceMissing=!1,this.sourceSceneFailure=!1,this.sourceNodes=EMPTY_FLOW_NODES,this.sourceEdges=EMPTY_FLOW_EDGES,this.sourceAcceptedScene=void 0,this.sourceWorld=void 0,this.sourceOverview=null,this.sourceOverviewEpoch=-1,this.sourceOverviewQueued=void 0,this.sourcePages?.bind(void 0),this.sourceScene?.bind(void 0),this.sourceOverviewRequests?.setSource(void 0,void 0),this.cancelModelBoundGestures(),this.autoPositions.clear(),this.measuredSizes.clear(),this.renderResolved=void 0,this.rovingCache=void 0,this.companionStructure=void 0,this._selectedNodeIds=this.sourceMode?this._requestedSelectedNodeIds:this.snapshotSelectedIds(this._requestedSelectedNodeIds,new Set(this._nodes.map(node=>node.id))),this._selectedEdgeIds=this.sourceMode?this._requestedSelectedEdgeIds:this.snapshotSelectedIds(this._requestedSelectedEdgeIds,new Set(this._edges.map(edge=>edge.id))),this.sourceState++}sourceAuthority(){const source=this.graphSource,epoch=this.sourceEpoch,owner=this.ownerDocument,owned=()=>this.isConnected&&this.graphSource===source&&this.sourceEpoch===epoch&&this.ownerDocument===owner;if(!source)return owned;let revision;try{revision=source.revision}catch{return()=>!1}return owned()?()=>{if(!owned())return!1;try{const currentRevision=source.revision;return owned()&&currentRevision===revision}catch{return!1}}:()=>!1}syncFlowSource(){if(!this.isConnected||!this.sourceMode||this.sourceSyncing||this.sourceError||!this.sourcePages)return;this.sourceSyncing=!0;const source=this.graphSource,epoch=this.sourceEpoch,owner=this.ownerDocument,owned=()=>this.graphSource===source&&this.sourceEpoch===epoch&&this.isConnected&&this.ownerDocument===owner;try{const revision=sourceRevision(source.revision);if(!owned())return;const records=source.records;if(!owned())return;if(sourceRevision(records.revision)!==revision)throw new TypeError("Invalid flow records revision");if(!owned())return;const inputs=[source,records,revision,epoch,this.effectiveLocale];if(!this.sourceInputs||inputs.some((value,index)=>value!==this.sourceInputs[index])){const current=()=>{if(!owned())return!1;const nextRevision=source.revision;if(!owned()||nextRevision!==revision)return!1;const nextRecords=source.records;if(!owned()||nextRecords!==records)return!1;const recordRevision=records.revision;return owned()&&recordRevision===revision},checked=signal=>()=>!signal.aborted&&current(),wrapped={revision,query:async request=>{const reader=new SceneReader(checked(request.signal));reader.check();const query=records.query;reader.check();const raw=await Reflect.apply(query,records,[request]);if(reader.check(),reader.field(raw,"groups")!==void 0||reader.field(raw,"tags")!==void 0)throw new TypeError("Unexpected flow metadata");return{rows:flowSourceRows(reader.field(raw,"rows"),request.pageSize,reader),total:sourceCount(reader.field(raw,"total")),summary:flowSourceSummary(reader.field(raw,"summary"),reader)}},lookup:async(keys,context)=>{if(keys.length>32)throw new RangeError("Flow lookup limit");const reader=new SceneReader(checked(context.signal));reader.check();const lookup=records.lookup;reader.check();const raw=await Reflect.apply(lookup,records,[keys,context]);return reader.check(),flowSourceRows(raw,keys.length,reader)},locate:async(key,query,context)=>{const reader=new SceneReader(checked(context.signal));reader.check();const locate=records.locate;reader.check();const index=await Reflect.apply(locate,records,[key,query,context]);return reader.check(),index}};if(this.sourceError=void 0,this.sourceSceneFailure=!1,this.sourcePages.bind({source:wrapped,revision,epoch,locale:this.effectiveLocale}),!owned())return;if(!this.sourceScene.bind({source,epoch,locale:this.effectiveLocale})||!owned())throw new TypeError("Invalid flow scene source");if(this.sourceOverviewRequests.setSource(source,revision),!owned())return;this.sourceInputs=inputs,this.sourcePageInputs=void 0,this.sourceSceneInputs=""}const size=finiteInteger(this.sourcePageSize,100,1,500),page=finiteInteger(this.sourcePage,0,0,Math.floor(Number.MAX_SAFE_INTEGER/size)),pageInputs=[this.sourceQuery,page,size];(!this.sourcePageInputs||pageInputs.some((value,index)=>value!==this.sourcePageInputs[index]))&&(this.sourcePageInputs=pageInputs,this.sourceMissing=!1,this.sourcePagePromise=this.sourcePages.request(this.sourceQuery,page,size))}catch(error){owned()&&(this.sourceError=error,this.sourcePages.bind(void 0),this.sourceScene.bind(void 0),this.sourceInputs=void 0)}finally{this.sourceSyncing=!1}}sourceViewportBounds(){const rect=this.viewportEl?.getBoundingClientRect()??this.getBoundingClientRect(),clamp=value=>Math.max(-1e6,Math.min(1e6,value)),x=clamp(-this.panX/this.zoomLevel),y=clamp(-this.panY/this.zoomLevel);return Object.freeze({x,y,width:Math.max(0,clamp((rect.width-this.panX)/this.zoomLevel)-x),height:Math.max(0,clamp((rect.height-this.panY)/this.zoomLevel)-y)})}requestSourceScene(extraKey){if(!this.sourceMode||!this.sourceInputs||this.sourceError)return Promise.resolve(!1);const keys=new Set;extraKey&&keys.add(extraKey);for(const[prefix,ids]of[["node",this.selectedNodeIds],["edge",this.selectedEdgeIds]])for(const id of ids){if(keys.size>=32)break;id.length+5<=65536&&keys.add(`${prefix}:${id}`)}const bounds=this.sourceViewportBounds(),includeKeys=Object.freeze([...keys]),signature=JSON.stringify([this.sourceEpoch,bounds,includeKeys]);return!extraKey&&signature===this.sourceSceneInputs?Promise.resolve(!this.sourceScene.state.error):(this.sourceSceneInputs=signature,this.sourceScene.request({mode:"viewport",centerKey:null,bounds,includeKeys}))}requestSourceOverview(){const source=this.graphSource,scene=this.sourceAcceptedScene,world=this.sourceWorld;if(!source||!scene||!world||this.sourceSceneFailure||this.sourceOverviewEpoch===this.sourceEpoch)return;this.sourceOverviewEpoch=this.sourceEpoch;const lease=this.sourceOverviewRequests.begin("overview",this.effectiveLocale),authority=this.sourceAuthority();if(!lease)return;const current=()=>lease.isCurrent()&&authority()&&this.sourceWorld===world&&!this.sourceSceneFailure;this.sourceOverviewQueued=async()=>{try{if(!current())return;const overview=source.overview;if(!current()||!overview)return;const raw=await Reflect.apply(overview,source,[{...lease.context,limit:1024}]);if(!current())return;const result=flowSourceOverview(raw,world,scene.total.nodes,current);current()&&(this.sourceOverview=result,this.sourceState++,this.scheduleCompanionNotify(!1))}catch{current()&&(this.sourceOverview=null,this.sourceState++,this.scheduleCompanionNotify(!1))}},this.pumpSourceOverview()}pumpSourceOverview(){if(this.sourceOverviewRunning||!this.sourceOverviewQueued)return;const run=this.sourceOverviewQueued;this.sourceOverviewQueued=void 0,this.sourceOverviewRunning=!0,run().finally(()=>{this.sourceOverviewRunning=!1,this.pumpSourceOverview()})}setSourceQuery(query){this.sourceIntent++,this.sourceQuery=Object.freeze(query),this._sourcePage=0,this.sourcePageInputs=void 0,this.syncFlowSource(),this.sourceState++}async revealSourceKey(key){if(!this.sourceMode||typeof key!="string"||key.length>65536||!/^(node|edge):.+/s.test(key))return!1;this.setSourceQuery({...EMPTY_FLOW_QUERY,kind:key.startsWith("node:")?"nodes":"edges"});const authority=this.sourceAuthority(),intent=this.sourceIntent,current=()=>authority()&&intent===this.sourceIntent;if(await this.sourcePagePromise,!current())return!1;const index=await this.sourcePages.locate(key);if(!current())return!1;if(index===null)return this.sourceMissing=!0,this.sourceState++,!1;if(this._sourcePage=Math.floor(index/finiteInteger(this.sourcePageSize,100,1,500)),this.syncFlowSource(),await this.sourcePagePromise,!current()||(this.sourceState++,await this.updateComplete,!current()))return!1;const target=[...this.renderRoot.querySelectorAll("[data-source-key]")].find(row=>row.dataset.sourceKey===key);return!target||(target.scrollIntoView({block:"nearest"}),!current())?!1:(target.focus(),current())}async focusSourceRecord(index){const query=this.sourceQuery,authority=this.sourceAuthority(),size=finiteInteger(this.sourcePageSize,100,1,500);this.sourcePage=Math.floor(index/size);const intent=this.sourceIntent,current=()=>authority()&&this.sourceIntent===intent&&this.sourceQuery===query;if(await this.sourcePagePromise,!current()||(await this.updateComplete,!current()))return;const key=this.sourcePages.state.result?.rows[index%size]?.key,target=[...this.renderRoot.querySelectorAll("[data-source-key]")].find(button=>button.dataset.sourceKey===key);!target||target.disabled||(target.scrollIntoView({block:"nearest"}),current()&&target.focus())}renderSourceNavigator(){const state2=this.sourcePages.state,query=this.sourceQuery,authority=this.sourceAuthority(),error=this.sourceError,current=()=>authority()&&this.sourcePages.state===state2&&this.sourceQuery===query&&this.sourceError===error,size=finiteInteger(this.sourcePageSize,100,1,500),page=finiteInteger(this.sourcePage,0,0),total=this.sourceTotal,changePage=next=>{current()&&(this.sourcePage=next)};return html`<section part="source-navigator" aria-label=${this.localize("graphSourceRecords")} aria-busy=${String(state2.pending)}>
+      <div part="source-controls"><label>${this.localize("graphSourceRecords")}<select data-source-kind .value=${query.kind} @change=${event=>{current()&&this.setSourceQuery({...EMPTY_FLOW_QUERY,kind:event.target.value==="edges"?"edges":"nodes"})}}>
+        <option value="nodes">${this.localize("graphSourceNodes")}</option><option value="edges">${this.localize("graphSourceEdges")}</option></select></label>
+        <label>${this.localize("search")}<input data-source-search type="search" maxlength="65536" .value=${query.search} @input=${event=>{current()&&this.setSourceQuery({...query,search:event.target.value})}}></label>
+        ${query.centerKey?html`<button type="button" @click=${()=>{current()&&this.setSourceQuery({...EMPTY_FLOW_QUERY,kind:query.kind})}}>${this.localize("graphSourceAllRecords")}</button>
+          <label>${this.localize("graphSourceDirection")}<select .value=${query.direction} @change=${event=>{current()&&this.setSourceQuery({...query,direction:event.target.value})}}><option value="both">${this.localize("graphSourceBothDirections")}</option><option value="in">${this.localize("neighborDirectionIn")}</option><option value="out">${this.localize("neighborDirectionOut")}</option></select></label>`:nothing}
+      </div>
+      <p part="source-status">${state2.pending?this.localize("loading"):state2.error||error?this.localize("graphSourceRecordsError"):this.sourceMissing?this.localize("graphSourceRecordMissing"):total===0?this.localize("noData"):this.localize("graphSourceTotals",void 0,{nodes:this.formatNumber(state2.result?.summary.nodes??0),edges:this.formatNumber(state2.result?.summary.edges??0)})}
+        ${(state2.error||error)&&!state2.pending?html`<button type="button" @click=${()=>{current()&&(state2.error||error)&&this.requestUpdate()}}>${this.localize("retry")}</button>`:nothing}</p>
+      ${this.sourceScene.state.scene&&!this.sourceSceneFailure?html`<p part="source-coverage">${this.localize(this.sourceScene.state.scene.coverage==="complete"?"graphSourceCoverageComplete":this.sourceScene.state.scene.coverage==="aggregate"?"graphSourceCoverageAggregate":"graphSourceCoverageNeighborhood",void 0,{shownNodes:this.formatNumber(this.sourceNodes.length),shownEdges:this.formatNumber(this.sourceEdges.length),nodes:this.formatNumber(this.sourceScene.state.scene.total.nodes),edges:this.formatNumber(this.sourceScene.state.scene.total.edges)})}</p>`:nothing}
+      <div part="source-records">${state2.result?.rows.map(row=>{const value=row.value,rowCurrent=()=>current()&&!state2.pending&&!state2.error&&state2.result?.rows.includes(row);return html`<div part="source-record"><button type="button" data-source-key=${row.key} ?disabled=${value.kind==="node"&&value.value.disabled}
+          @keydown=${event=>{if(!rowCurrent()||total===null||total===0)return;const index=page*size+state2.result.rows.indexOf(row),next=event.key==="Home"?0:event.key==="End"?total-1:event.key==="ArrowDown"?Math.min(total-1,index+1):event.key==="ArrowUp"?Math.max(0,index-1):null;next!==null&&(event.preventDefault(),this.focusSourceRecord(next))}}
+          @click=${event=>{rowCurrent()&&(value.kind==="node"?this.onNodeActivate(value.value,event.ctrlKey||event.metaKey):this.onEdgeActivate(value.value,event.ctrlKey||event.metaKey))}}>${value.kind==="node"?this.nodeAccessibleText(value.value):this.edgeAccessibleText(value.value)}</button>
+          ${value.kind==="node"?html`<button type="button" @click=${()=>{rowCurrent()&&this.setSourceQuery({...EMPTY_FLOW_QUERY,kind:"edges",centerKey:row.key})}}>${this.localize("graphSourceIncidentEdges",void 0,{label:this.nodeAccessibleText(value.value)})}</button>`:html`<button type="button" @click=${()=>{rowCurrent()&&this.revealSourceKey(`node:${value.value.source}`)}}>${value.value.source}</button><button type="button" @click=${()=>{rowCurrent()&&this.revealSourceKey(`node:${value.value.target}`)}}>${value.value.target}</button>`}</div>`})}</div>
+      <div part="source-controls"><button type="button" ?disabled=${state2.pending||page===0} @click=${()=>changePage(page-1)}>${this.localize("previous")}</button>
+        <label>${this.localize("paginationPage")}<input data-source-page type="number" min="1" .value=${String(page+1)} @change=${event=>changePage(finiteInteger(Number(event.target.value)-1,0,0))}></label>
+        <button type="button" ?disabled=${state2.pending||total===null||(page+1)*size>=total} @click=${()=>changePage(page+1)}>${this.localize("next")}</button></div>
+    </section>`}get nodes(){return this._nodes}set nodes(value){if(value===this.nodesSource||value===this._nodes)return;const previous=this._nodes;this.nodesSource=value,this.nodesInputTruncated=!1,this._nodes=snapshotFlowNodes(value,()=>{this.nodesInputTruncated=!0}),this.rovingCache=void 0,this.requestUpdate("nodes",previous)}get edges(){return this._edges}set edges(value){if(value===this.edgesSource||value===this._edges)return;const previous=this._edges;this.edgesSource=value,this.edgesInputTruncated=!1,this._edges=snapshotFlowEdges(value,()=>{this.edgesInputTruncated=!0}),this.rovingCache=void 0,this.requestUpdate("edges",previous)}get orientation(){return this._orientation}set orientation(value){const previous=this._orientation,next=value==="vertical"?"vertical":"horizontal";this._orientation=next,this.rovingCache=void 0,(next!==previous||value!==next)&&this.requestUpdate("orientation",previous)}get selectedNodeIds(){return this._selectedNodeIds}set selectedNodeIds(value){if(value===this.selectedNodeIdsSource||value===this._selectedNodeIds)return;const previous=this._selectedNodeIds;this.selectedNodeIdsSource=value,this._requestedSelectedNodeIds=this.sanitizeSelectionCandidates(value),this._selectedNodeIds=this.sourceMode?this._requestedSelectedNodeIds:this.snapshotSelectedIds(this._requestedSelectedNodeIds,new Set(this.modelNodes.map(node=>node.id))),this.requestUpdate("selectedNodeIds",previous)}get selectedEdgeIds(){return this._selectedEdgeIds}set selectedEdgeIds(value){if(value===this.selectedEdgeIdsSource||value===this._selectedEdgeIds)return;const previous=this._selectedEdgeIds;this.selectedEdgeIdsSource=value,this._requestedSelectedEdgeIds=this.sanitizeSelectionCandidates(value),this._selectedEdgeIds=this.sourceMode?this._requestedSelectedEdgeIds:this.snapshotSelectedIds(this._requestedSelectedEdgeIds,new Set(this.modelEdges.map(edge=>edge.id))),this.requestUpdate("selectedEdgeIds",previous)}sanitizeSelectionCandidates(value){if(!Array.isArray(value))return Object.freeze([]);const selected=[],seen=new Set;for(const candidate of value.slice(0,MAX_FLOW_COLLECTION_ENTRIES))typeof candidate!="string"||candidate.trim().length===0||seen.has(candidate)||(seen.add(candidate),selected.push(candidate));return Object.freeze(selected)}snapshotSelectedIds(value,validIds){const selected=value.filter(candidate=>validIds.has(candidate));return selected.length===value.length?value:Object.freeze(selected)}get decorations(){return this._decorations}set decorations(value){if(value===this.decorationsSource||value===this._decorations)return;const previous=this._decorations;this.decorationsSource=value,this._decorations=value==null?null:snapshotFlowDecorations(value),this.requestUpdate("decorations",previous)}get safeMinZoom(){return finiteRange(this.minZoom,.25,.001,1e3)}get safeMaxZoom(){return finiteRange(this.maxZoom,2,.001,1e3)}get effectiveZoomBounds(){return{min:Math.min(this.safeMinZoom,this.safeMaxZoom),max:Math.max(this.safeMinZoom,this.safeMaxZoom)}}get safeGrid(){return finiteRange(this.grid,8,0)}get safeLayerGap(){return finiteRange(this.layerGap,64,0)}get safeNodeGap(){return finiteRange(this.nodeGap,24,0)}requestUpdate(...args){args[0]===void 0&&(this.explicitRefresh=!0,this._graphSource!==void 0&&this.resetFlowSource()),super.requestUpdate(...args)}withFallbackSizes(read){this.fallbackPassDepth++;try{return read()}finally{--this.fallbackPassDepth===0&&this.fallbackSizes.clear()}}ensureModelIndexes(){const changed=this.indexedNodes!==this.modelNodes||this.indexedEdges!==this.modelEdges;if(this.indexedNodes!==this.modelNodes){this.indexedNodes=this.modelNodes,this.nodesById.clear(),this.nodeModelOrder.clear(),this.modelNodes.forEach((node,index)=>this.nodeModelOrder.set(node.id,index)),this.hasUnpositionedNodes=this.modelNodes.some(node=>!node.position);for(const node of this.modelNodes)this.nodesById.has(node.id)||this.nodesById.set(node.id,node)}if(this.indexedEdges!==this.modelEdges){this.indexedEdges=this.modelEdges,this.edgesById.clear(),this.outgoingTargets.clear(),this.edgeModelOrder.clear(),this.modelEdges.forEach((edge,index)=>this.edgeModelOrder.set(edge.id,index)),this.rebuildIncidentEdgesIndex();for(const edge of this.modelEdges){this.edgesById.has(edge.id)||this.edgesById.set(edge.id,edge);let targets=this.outgoingTargets.get(edge.source);targets||this.outgoingTargets.set(edge.source,targets=new Set),targets.add(edge.target)}}changed&&(this.fallbackEdges=this.modelEdges.filter(edge=>!this.nodesById.has(edge.source)||!this.nodesById.has(edge.target)))}bindNodeWrapper(id,element){const previous=this.nodeWrappers.get(id);previous&&previous!==element&&(this.resizeObserver?.unobserve(previous),this.observedNodeEls.delete(previous),this.nodeWrappers.delete(id),this.fallbackSizes.delete(previous)),element&&(this.nodeWrappers.set(id,element),this.observedNodeEls.has(element)||(this.resizeObserver?.observe(element),this.observedNodeEls.add(element)))}connectedCallback(){super.connectedCallback(),this.stopMotionWatch=observeReducedMotion(this,()=>this.sourceMode?this.requestUpdate("motion",!1):this.requestUpdate());const ownerWindow=this.ownerDocument.defaultView;this.connectedWindow=ownerWindow??void 0,ownerWindow&&this.announcer.setTimerHost(ownerWindow);const ResizeObserverCtor=ownerWindow?.ResizeObserver;this.resizeObserver=ResizeObserverCtor?new ResizeObserverCtor(entries=>this.onNodesResized(entries)):void 0,this.bindAuthoredCardObserver(),this.syncAuthoredCards(),this.pushCardPropsAll(),this.scheduleCompanionNotify(),this.hasUpdated&&(this.observeNodeWrappers(),this.viewportEl&&this.resizeObserver?.observe(this.viewportEl),this.modelNodes.length>0&&this.scheduleLayoutPass())}disconnectedCallback(){this.sourceMode&&this.resetFlowSource(),super.disconnectedCallback(),this.stopMotionWatch?.(),this.stopMotionWatch=void 0,this.resetAuthoredCardObserver(),this.restoreAuthoredCardSlots(),this.hasConnectedLayoutBaseline=!1,this.layoutLimitAnnouncementPending=!1,this.announcer.cancel(),this.mirrorAnnouncement(""),this.resizeObserver?.disconnect(),this.resizeObserver=void 0,this.observedNodeEls.clear(),this.geometryRaf!=null&&(this.cancelOwnerAnimationFrame(this.geometryRaf),this.geometryRaf=null),this.layoutRaf!=null&&(this.cancelOwnerAnimationFrame(this.layoutRaf),this.layoutRaf=null),this.companionRaf!=null&&(this.cancelOwnerAnimationFrame(this.companionRaf),this.companionRaf=null),this.viewportChangeRaf!=null&&(this.cancelOwnerAnimationFrame(this.viewportChangeRaf),this.viewportChangeRaf=null),this.wheelMeasureRaf!=null&&(this.cancelOwnerAnimationFrame(this.wheelMeasureRaf),this.wheelMeasureRaf=null,this.wheelMeasure=null),this.panDrag=void 0,this.connectedWindow?.removeEventListener("pointermove",this.onBackgroundPointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onBackgroundPointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onBackgroundPointerUp),this.connectedWindow?.removeEventListener("lostpointercapture",this.onBackgroundPointerUp),this.nodeDrag=void 0,this.dragEdgeRefs=void 0,this.connectedWindow?.removeEventListener("pointermove",this.onNodePointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onNodePointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onNodePointerUp),this.connectedWindow?.removeEventListener("lostpointercapture",this.onNodePointerUp),this.connectState=void 0,this.connecting=!1,this.connectInvalidNodeId=null,this.keyboardConnectSourceId=null,this.keyboardConnectTargetIndex=0,this.connectedWindow?.removeEventListener("pointermove",this.onConnectPointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onConnectPointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onConnectPointerCancel),this.connectedWindow?.removeEventListener("lostpointercapture",this.onConnectPointerCancel),this.connectedWindow=void 0}adoptedCallback(){super.adoptedCallback(),this.sourceMode&&this.resetFlowSource(),this.announcements.adopted(),this.resetAuthoredCardObserver(),this.restoreAuthoredCardSlots(),this.hasConnectedLayoutBaseline=!1,this.layoutLimitAnnouncementPending=!1;const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.announcer.setTimerHost(ownerWindow),this.isConnected&&(this.bindAuthoredCardObserver(),this.scheduleAuthoredCardReconciliation(),this.modelNodes.length>0&&this.scheduleLayoutPass())}requestOwnerAnimationFrame(callback){const owner=this.ownerDocument.defaultView;return owner?{owner,handle:owner.requestAnimationFrame(callback)}:null}cancelOwnerAnimationFrame(frame){frame.owner.cancelAnimationFrame(frame.handle)}mirrorAnnouncement(text){this.renderRoot?.querySelector('[part="live-region"]')?.replaceChildren(text)}resetAuthoredCardObserver(){this.authoredCardObserverGeneration+=1,this.authoredCardObserver?.disconnect(),this.authoredCardObserver=void 0,this.authoredCardObserverDocument=void 0,this.authoredCardSyncQueued=!1}bindAuthoredCardObserver(){const ownerDocument=this.ownerDocument;if(!this.isConnected||this.authoredCardObserver&&this.authoredCardObserverDocument===ownerDocument)return;this.resetAuthoredCardObserver();const MutationObserverCtor=ownerDocument.defaultView?.MutationObserver;if(!MutationObserverCtor)return;const generation=this.authoredCardObserverGeneration,observer=new MutationObserverCtor(records=>{if(this.authoredCardObserver!==observer||this.authoredCardObserverDocument!==ownerDocument||this.authoredCardObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument)return;records.some(record=>record.type==="childList"?record.target===this:record.type==="attributes"&&record.attributeName==="node-id"&&record.target.parentNode===this)&&this.scheduleAuthoredCardReconciliation()});observer.observe(this,{childList:!0,attributes:!0,attributeFilter:["node-id"],subtree:!0}),this.authoredCardObserver=observer,this.authoredCardObserverDocument=ownerDocument}scheduleAuthoredCardReconciliation(){const generation=this.authoredCardObserverGeneration,ownerDocument=this.authoredCardObserverDocument??this.ownerDocument;!this.isConnected||this.authoredCardSyncQueued||(this.authoredCardSyncQueued=!0,queueMicrotask(()=>{this.authoredCardObserverGeneration!==generation||!this.isConnected||this.ownerDocument!==ownerDocument||(this.authoredCardSyncQueued=!1,this.syncAuthoredCards(),this.pushCardPropsAll())}))}observeNodeWrappers(){for(const el of this.nodeWrappers.values())this.observedNodeEls.has(el)||(this.observedNodeEls.add(el),this.resizeObserver?.observe(el))}willUpdate(changed){super.willUpdate(changed),this.syncFlowSource(),this.hasUpdated&&(changed.has("nodes")&&this.nodesInputTruncated||changed.has("edges")&&this.edgesInputTruncated)&&this.announcements.announcePolite(this.localize("flowCanvasInputLimit")),this.ensureModelIndexes();const transient=!this.explicitRefresh&&[...changed.keys()].every(key=>["activeItemIndex","viewportRevision","connecting","keyboardConnectSourceId","keyboardConnectTargetIndex"].includes(String(key)));if(!this.explicitRefresh&&[...changed.keys()].every(key=>["activeItemIndex","viewportRevision","connecting","keyboardConnectSourceId","keyboardConnectTargetIndex","selectedNodeIds","selectedEdgeIds","decorations","minZoom","maxZoom","readonly"].includes(String(key)))||(this.fallbackSizes.clear(),this.renderResolved=void 0,this.rovingCache=void 0),transient||(this.companionStructure=void 0),!this.explicitRefresh&&[...changed.keys()].every(key=>["activeItemIndex","viewportRevision","connecting","keyboardConnectSourceId","keyboardConnectTargetIndex","selectedNodeIds","selectedEdgeIds","decorations"].includes(String(key)))||this.renderEpoch++,this.explicitRefresh=!1,changed.has("nodes")||changed.has("graphSource")||changed.has("sourceState")){this.cancelModelBoundGestures(),this.pruneNodeCaches(),this.syncAuthoredCards();const nodeIds=new Set(this.modelNodes.map(node=>node.id));this._selectedNodeIds=this.sourceMode?this._requestedSelectedNodeIds:this.snapshotSelectedIds(this._requestedSelectedNodeIds,nodeIds)}if(changed.has("edges")){this.cancelModelBoundGestures();const edgeIds=new Set(this.modelEdges.map(edge=>edge.id));this._selectedEdgeIds=this.sourceMode?this._requestedSelectedEdgeIds:this.snapshotSelectedIds(this._requestedSelectedEdgeIds,edgeIds)}if((changed.has("readonly")&&this.readonly||changed.has("orientation"))&&this.cancelActiveGestures(),changed.has("nodesDraggable")&&!this.nodesDraggable&&this.endNodeDrag(!1),changed.has("connectable")&&!this.connectable&&(this.onConnectPointerCancel(),this.keyboardConnectSourceId=null,this.keyboardConnectTargetIndex=0),changed.has("droppable")&&!this.droppable&&this.viewportEl?.removeAttribute("data-drop-active"),changed.has("grid")&&this.endNodeDrag(!1),changed.has("nodes")||changed.has("edges")||changed.has("orientation")||changed.has("layerGap")||changed.has("nodeGap"))for(const node of this.modelNodes)node.position||this.autoPositions.delete(node.id);(changed.has("nodes")||changed.has("selectedNodeIds")||changed.has("decorations")||changed.has("orientation"))&&this.pushCardPropsAll(changed)}pruneNodeCaches(){const nodeIds=new Set(this.modelNodes.map(node=>node.id));for(const id of this.autoPositions.keys())nodeIds.has(id)||this.autoPositions.delete(id);for(const id of this.measuredSizes.keys())nodeIds.has(id)||this.measuredSizes.delete(id);for(const element of this.observedNodeEls){const id=element.dataset.nodeId;id&&nodeIds.has(id)||(this.resizeObserver?.unobserve(element),this.observedNodeEls.delete(element))}}updated(changed){super.updated(changed);const item=this.rovingItems()[this.normalizedItemIndex()],next=item?.kind==="node"?this.nodeWrappers.get(item.id)?.querySelector('[part="node-control"]'):item?this.edgeWrappers.get(item.id)?.querySelector('[part="edge"]'):void 0;this.activeControl!==next&&this.activeControl?.setAttribute("tabindex","-1"),next?.setAttribute("tabindex","0"),this.activeControl=next??void 0,changed.has("layoutTruncated")&&this.layoutLimitAnnouncementPending&&(this.layoutLimitAnnouncementPending=!1,this.isConnected&&this.layoutTruncated&&this.announcer.announce(this.localize("flowCanvasLayoutLimit"))),this.observeNodeWrappers(),(changed.has("nodes")||changed.has("edges")||changed.has("orientation")||changed.has("layerGap")||changed.has("nodeGap"))&&this.scheduleLayoutPass(),(changed.has("nodes")||changed.has("edges")||changed.has("decorations")||changed.has("minZoom")||changed.has("maxZoom")||changed.has("readonly")||changed.has("orientation")||changed.has("layerGap")||changed.has("nodeGap"))&&this.scheduleCompanionNotify();const viewportEl=this.renderRoot.querySelector('[part="viewport"]');viewportEl&&viewportEl!==this.viewportEl&&(this.viewportEl=viewportEl,this.resizeObserver?.observe(viewportEl),this.worldEl=this.renderRoot.querySelector(".world"),viewportEl.addEventListener("wheel",this.onWheel,{passive:!1}),viewportEl.addEventListener("keydown",this.onViewportKeyDown),viewportEl.addEventListener("dragover",this.onViewportDragOver),viewportEl.addEventListener("dragleave",this.onViewportDragLeave),viewportEl.addEventListener("drop",this.onViewportDrop),this.applyWorldTransform(!1),this.scheduleGeometryRefresh()),this.sourceMode&&(this.requestSourceScene(),this.requestSourceOverview())}syncAuthoredCards(){const ids=new Set(this.modelNodes.map(node=>node.id)),adopted=new Set;for(const child of Array.from(this.children)){const nodeId=child.getAttribute("node-id");if(nodeId&&ids.has(nodeId)){this.leaseAuthoredCardSlot(child,nodeId),adopted.add(child);continue}this.releaseAuthoredCardSlot(child),nodeId&&devWarnOnce(UNMATCHED_AUTHORED_CARD_WARNING,"<lr-flow-canvas> has a direct child with a node-id that matches no node; it will not render.")}for(const child of[...this.authoredCardSlotLeases.keys()])adopted.has(child)||this.releaseAuthoredCardSlot(child)}leaseAuthoredCardSlot(child,nodeId){let lease=this.authoredCardSlotLeases.get(child);if(!lease){const slot2=child.getAttribute("slot");lease={authoredSlot:slot2,appliedSlot:slot2,authorOwnsSlot:!1},this.authoredCardSlotLeases.set(child,lease)}if(lease.authorOwnsSlot||child.getAttribute("slot")!==lease.appliedSlot){lease.authorOwnsSlot=!0;return}const slot=`node-${nodeId}`;child.getAttribute("slot")!==slot&&child.setAttribute("slot",slot),lease.appliedSlot=child.getAttribute("slot")}releaseAuthoredCardSlot(child){const lease=this.authoredCardSlotLeases.get(child);lease&&(!lease.authorOwnsSlot&&child.getAttribute("slot")===lease.appliedSlot&&(lease.authoredSlot===null?child.removeAttribute("slot"):child.setAttribute("slot",lease.authoredSlot)),this.authoredCardSlotLeases.delete(child))}restoreAuthoredCardSlots(){for(const child of[...this.authoredCardSlotLeases.keys()])this.releaseAuthoredCardSlot(child)}pushCardPropsAll(changed){const nodesChanged=changed?.has("nodes")??!0,selectionChanged=nodesChanged||changed?.has("selectedNodeIds")===!0,decorationsChanged=nodesChanged||changed?.has("decorations")===!0,orientationChanged=nodesChanged||changed?.has("orientation")===!0,cardsByNodeId=new Map;for(const child of Array.from(this.children)){const nodeId=child.getAttribute("node-id");nodeId&&this.authoredCardSlotLeases.has(child)&&cardsByNodeId.set(nodeId,child)}const selectedNodeIds=selectionChanged?new Set(this.selectedNodeIds):null;for(const node of this.modelNodes){const card=cardsByNodeId.get(node.id);if(card&&(nodesChanged&&(this.setCardProperty(card,"inputs",node.inputs??DEFAULT_FLOW_INPUTS),this.setCardProperty(card,"outputs",node.outputs??DEFAULT_FLOW_OUTPUTS),this.setCardProperty(card,"flowType",node.type??"")),orientationChanged&&this.setCardProperty(card,"orientation",this.orientation),selectedNodeIds&&this.setCardProperty(card,"selected",selectedNodeIds.has(node.id)),decorationsChanged)){const decoration=this.decorations?.[node.id];this.setCardProperty(card,"status",decoration?.status??null),this.setCardProperty(card,"progress",decoration?.progress??null),this.setCardProperty(card,"statusDetail",decoration?.detail??""),this.setCardProperty(card,"durationMs",decoration?.durationMs??null)}}}setCardProperty(card,property2,value){try{card[property2]=value}catch{}}nodePosition(node){const position=node.position??this.autoPositions.get(node.id)??{x:0,y:0};return{x:finiteNumber(position.x,0),y:finiteNumber(position.y,0)}}nodeSize(id){const measured=this.measuredSizes.get(id);if(measured)return measured;const ownerWindow=this.ownerDocument?.defaultView,host=this.renderedNodeById(id)??this,cached=this.fallbackPassDepth?this.fallbackSizes.get(host):void 0;if(cached)return cached;const computed=ownerWindow?.getComputedStyle(host),customWidth=resolveCssTokenLength(computed?.getPropertyValue("--lr-flow-canvas-node-fallback-inline-size").trim(),{host}),customHeight=resolveCssTokenLength(computed?.getPropertyValue("--lr-flow-canvas-node-fallback-block-size").trim(),{host}),width=customWidth??(resolveCssTokenLength(computed?.getPropertyValue("--lr-size-10rem").trim()||"10rem",{host})??0)+(resolveCssTokenLength(computed?.getPropertyValue("--lr-size-1rem").trim()||"1rem",{host})??0),height=customHeight??resolveCssTokenLength(computed?.getPropertyValue("--lr-size-4rem").trim()||"4rem",{host})??0,size={width,height};return this.fallbackPassDepth&&this.fallbackSizes.set(host,size),size}resolvedNode(node){const pos=this.nodePosition(node),size=this.nodeSize(node.id);return{node,x:pos.x,y:pos.y,width:size.width,height:size.height}}handleOffset(count,index,span){return count<=1?span/2:span*(index+.5)/count}handlePoint(resolved,kind,handleId){const handles=kind==="input"?resolved.node.inputs??DEFAULT_FLOW_INPUTS:resolved.node.outputs??DEFAULT_FLOW_OUTPUTS,index=handles.findIndex(h=>h.id===handleId),horizontal=this.orientation==="horizontal",edgeSpan=horizontal?resolved.height:resolved.width,offset=index>=0?this.handleOffset(handles.length,index,edgeSpan):edgeSpan/2;if(horizontal)return{x:kind==="input"?resolved.x:resolved.x+resolved.width,y:resolved.y+offset};const y=kind==="input"?resolved.y:resolved.y+resolved.height;return{x:resolved.x+offset,y}}edgePathD(sourcePt,targetPt){const dx=targetPt.x-sourcePt.x,dy=targetPt.y-sourcePt.y,distance=Math.hypot(dx,dy),offset=Math.min(CONNECT_OFFSET_MAX,Math.max(CONNECT_OFFSET_MIN,distance/2)),horizontal=this.orientation==="horizontal",c1x=sourcePt.x+(horizontal?offset:0),c1y=sourcePt.y+(horizontal?0:offset),c2x=targetPt.x-(horizontal?offset:0),c2y=targetPt.y-(horizontal?0:offset);return`M ${sourcePt.x} ${sourcePt.y} C ${c1x} ${c1y}, ${c2x} ${c2y}, ${targetPt.x} ${targetPt.y}`}nodeAccessibleText(node){if(node.accessibleLabel)return node.accessibleLabel;const label=typeof node.data?.label=="string"?node.data.label:node.id;return this.localize("flowNode",void 0,{label})}edgeAccessibleText(edge){this.ensureModelIndexes();const sourceNode=this.nodesById.get(edge.source),targetNode=this.nodesById.get(edge.target),source=sourceNode?this.nodeAccessibleText(sourceNode):edge.source,target=targetNode?this.nodeAccessibleText(targetNode):edge.target;return edge.label?this.localize("flowEdgeWithLabel",void 0,{label:edge.label,source,target}):this.localize("flowEdge",void 0,{source,target})}onNodesResized(entries){const changedIds=[];!this.sourceMode&&!this.hasFitOnce&&this.viewportEl?.clientWidth&&this.viewportEl.clientHeight&&this.scheduleLayoutPass();for(const entry of entries){if(entry.target===this.viewportEl){this.sourceMode&&this.requestSourceScene(),this.scheduleGeometryRefresh(),this.scheduleCompanionNotify(!1);continue}if(entry.target.checkVisibility?.({contentVisibilityAuto:!0})===!1)continue;const id=entry.target.dataset.nodeId;if(!id)continue;const box=entry.borderBoxSize?.[0],width=box?box.inlineSize:entry.contentRect.width,height=box?box.blockSize:entry.contentRect.height,prev=this.measuredSizes.get(id);(!prev||prev.width!==width||prev.height!==height)&&(this.measuredSizes.set(id,{width,height}),entry.target.style.containIntrinsicSize=`auto ${width}px auto ${height}px`,changedIds.push(id))}if(changedIds.length>0){if(!this.hasUnpositionedNodes&&this.renderResolved&&this.nodeViewportIndex&&this.edgeViewportIndex){const edges=new Set;for(const id of changedIds){const node=this.nodesById.get(id);if(!node)continue;const resolved=this.resolvedNode(node);this.renderResolved.set(id,resolved),this.nodeViewportIndex.update(node,this.nodeViewportBounds(resolved));for(const edge of this.nodeIncidentEdges.get(id)??[])edges.add(edge)}for(const id of edges){const edge=this.edgesById.get(id),bounds=edge&&this.edgeViewportBounds(edge,this.renderResolved);edge&&bounds&&this.edgeViewportIndex.update(edge,bounds)}this.scheduleGeometryRefresh()}else this.scheduleLayoutPass();this.scheduleCompanionNotify()}}scheduleGeometryRefresh(){!this.isConnected||this.geometryRaf!=null||(this.geometryRaf=this.requestOwnerAnimationFrame(()=>{this.geometryRaf=null,this.isConnected&&this.viewportRevision++}))}measureNodeWrappers(){const wrappers=[...this.nodeWrappers.values()],visibility=wrappers.map(wrapper=>wrapper.style.contentVisibility);for(const wrapper of wrappers)wrapper.style.contentVisibility="visible";try{for(const wrapper of wrappers){const id=wrapper.dataset.nodeId;if(!id)continue;const rect=wrapper.getBoundingClientRect(),width=wrapper.offsetWidth||rect.width/Math.max(this.zoomLevel,Number.EPSILON),height=wrapper.offsetHeight||rect.height/Math.max(this.zoomLevel,Number.EPSILON);Number.isFinite(width)&&Number.isFinite(height)&&width>0&&height>0&&(this.measuredSizes.set(id,{width,height}),wrapper.style.containIntrinsicSize=`auto ${width}px auto ${height}px`)}}finally{wrappers.forEach((wrapper,index)=>{wrapper.style.contentVisibility=visibility[index]})}}scheduleLayoutPass(){if(this.sourceMode){this.scheduleGeometryRefresh();return}!this.isConnected||this.layoutRaf!=null||(this.layoutRaf=this.requestOwnerAnimationFrame(()=>{this.layoutRaf=null,this.isConnected&&(this.measureNodeWrappers(),this.runAutoLayoutIfNeeded(),this.requestUpdate(),this.hasFitOnce||(this.hasFitOnce=this.applyFit()))}))}setLayoutTruncated(truncated){const previous=this.layoutTruncated;if(this.layoutTruncated=truncated,truncated||(this.layoutLimitAnnouncementPending=!1),!(!this.isConnected||this.modelNodes.length===0)){if(!this.hasConnectedLayoutBaseline){this.hasConnectedLayoutBaseline=!0;return}!previous&&truncated&&(this.layoutLimitAnnouncementPending=!0)}}runAutoLayoutIfNeeded(){return this.withFallbackSizes(()=>{if(this.sourceMode)return;this.fallbackSizes.clear();const unpositioned=this.modelNodes.filter(n=>!n.position);if(unpositioned.length===0){this.setLayoutTruncated(!1);return}const swap=this.orientation==="horizontal",graphNodes=this.modelNodes.map(n=>{const size=this.nodeSize(n.id);return{id:n.id,width:swap?size.height:size.width,height:swap?size.width:size.height}}),nodeIds=new Set(this.modelNodes.map(n=>n.id)),graphEdges=this.modelEdges.filter(e=>nodeIds.has(e.source)&&nodeIds.has(e.target)).map(e=>({source:e.source,target:e.target})),fixedPositions=new Map;for(const n of this.modelNodes){if(!n.position||n.position.x<0||n.position.y<0)continue;const size=this.nodeSize(n.id),center={x:n.position.x+size.width/2,y:n.position.y+size.height/2};!Number.isSafeInteger(Math.trunc(center.x))||!Number.isSafeInteger(Math.trunc(center.y))||fixedPositions.set(n.id,swap?{x:center.y,y:center.x}:center)}const result=layeredLayout({nodes:graphNodes,edges:graphEdges,options:{gapX:this.safeNodeGap,gapY:this.safeLayerGap,fixedPositions}}),positions={};for(const n of unpositioned){const raw=result.positions.get(n.id);if(!raw)continue;const center=swap?{x:raw.y,y:raw.x}:{x:raw.x,y:raw.y},size=this.nodeSize(n.id),resolved={x:center.x-size.width/2,y:center.y-size.height/2};this.autoPositions.set(n.id,resolved),positions[n.id]=Object.freeze(resolved)}this.rovingCache=void 0,this.setLayoutTruncated(result.truncated),Object.keys(positions).length>0&&this.emit("lr-layout-change",Object.freeze({positions:Object.freeze(positions),truncated:result.truncated}))})}get viewport(){return Object.freeze({x:this.panX,y:this.panY,zoom:this.zoomLevel})}set viewport(_value){}setViewport(next){this.readonly||(this.panX=finiteNumber(next.x,this.panX),this.panY=finiteNumber(next.y,this.panY),this.zoomLevel=this.clampZoom(next.zoom),this.applyWorldTransform(),this.emit("lr-viewport-change",Object.freeze({x:this.panX,y:this.panY,zoom:this.zoomLevel})))}zoomIn(){this.readonly||this.zoomAtCenter(this.zoomLevel*ZOOM_MULTIPLIER)}zoomOut(){this.readonly||this.zoomAtCenter(this.zoomLevel/ZOOM_MULTIPLIER)}resetZoom(){this.readonly||this.setViewport({x:this.panX,y:this.panY,zoom:1})}fit(options){this.readonly||this.applyFit(options?.padding)}applyFit(requestedPadding=DEFAULT_FIT_PADDING){return this.withFallbackSizes(()=>{this.fallbackSizes.clear();const rect=this.viewportEl?.getBoundingClientRect();if(!this.sourceMode&&this.modelNodes.length===0||!rect?.width||!rect.height||this.sourceMode&&!this.sourceWorld)return!1;const padding=finiteRange(requestedPadding,DEFAULT_FIT_PADDING,0);let minX=1/0,minY=1/0,maxX=-1/0,maxY=-1/0;for(const node of this.modelNodes){const resolved=this.resolvedNode(node);minX=Math.min(minX,resolved.x),minY=Math.min(minY,resolved.y),maxX=Math.max(maxX,resolved.x+resolved.width),maxY=Math.max(maxY,resolved.y+resolved.height)}this.sourceMode&&this.sourceWorld&&(minX=this.sourceWorld.x,minY=this.sourceWorld.y,maxX=minX+this.sourceWorld.width,maxY=minY+this.sourceWorld.height);const viewW=rect.width,viewH=rect.height,transform=fitTransform({minX,minY,maxX,maxY},{width:viewW,height:viewH},padding,this.effectiveZoomBounds,{minimumAvailableSize:0,invalidZoomFallback:1,centerWithMinimumExtent:!0});return this.panX=transform.x,this.panY=transform.y,this.zoomLevel=transform.zoom,this.applyWorldTransform(),this.scheduleViewportChange(),!0})}focusNode(id,options){if(this.readonly)return;const node=this.modelNodes.find(n=>n.id===id);if(!node)return;const resolved=this.resolvedNode(node),rect=this.viewportEl?.getBoundingClientRect(),viewW=rect?.width??0,viewH=rect?.height??0,zoom=options?.zoom!=null?this.clampZoom(options.zoom):this.zoomLevel;this.panX=viewW/2-(resolved.x+resolved.width/2)*zoom,this.panY=viewH/2-(resolved.y+resolved.height/2)*zoom,this.zoomLevel=zoom,this.applyWorldTransform(),this.scheduleViewportChange(),this.focusActiveItem(this.spatialItemIndex("node",id))}toContentPoint(clientX,clientY){const rect=this.viewportEl?.getBoundingClientRect();if(!rect)return{x:0,y:0};const localX=this.localWorldX(clientX,rect),localY=clientY-rect.top;return{x:(localX-this.panX)/this.zoomLevel,y:(localY-this.panY)/this.zoomLevel}}registerCompanion(cb){return this.companionCallbacks.add(cb),this.scheduleCompanionNotify(),()=>{this.companionCallbacks.delete(cb)}}scheduleCompanionNotify(structural=!0){if(structural&&(this.companionStructure=void 0),!this.isConnected||this.companionRaf!=null||this.companionCallbacks.size===0)return;const request=this.requestOwnerAnimationFrame(()=>{if(this.companionRaf===request&&(this.companionRaf=null,!(!this.isConnected||this.ownerDocument.defaultView!==request?.owner)))for(const cb of this.companionCallbacks)cb(this.buildSnapshot())});this.companionRaf=request}buildSnapshot(){return this.withFallbackSizes(()=>{this.fallbackSizes.clear();const rect=this.viewportEl?.getBoundingClientRect(),bounds=this.effectiveZoomBounds;return this.companionStructure??={nodes:Object.freeze(this.modelNodes.map(n=>{const resolved=this.renderResolved?.get(n.id)??this.resolvedNode(n);return Object.freeze({id:n.id,x:resolved.x,y:resolved.y,width:resolved.width,height:resolved.height,status:this.decorations?.[n.id]?.status})})),edges:Object.freeze(this.modelEdges.map(e=>Object.freeze({id:e.id,source:e.source,target:e.target,status:this.decorations?.[e.id]?.status})))},Object.freeze({...this.companionStructure,...this.sourceMode&&this.sourceWorld&&this.sourceAcceptedScene?{source:Object.freeze({coverage:this.sourceAcceptedScene.coverage,total:this.sourceAcceptedScene.total,worldBounds:this.sourceWorld,overview:this.sourceOverview})}:{},viewport:Object.freeze({x:this.panX,y:this.panY,zoom:this.zoomLevel,width:rect?.width??0,height:rect?.height??0,minZoom:bounds.min,maxZoom:bounds.max}),locked:this.readonly,orientation:this.orientation,layerGap:this.safeLayerGap,nodeGap:this.safeNodeGap})})}clampZoom(z){const{min,max}=this.effectiveZoomBounds;return finiteRange(z,1,min,max)}applyWorldTransform(invalidateViewport=!0){this.worldEl&&(this.worldEl.style.transform=`translate(${this.panX}px, ${this.panY}px) scale(${this.zoomLevel})`),this.scheduleCompanionNotify(!1),invalidateViewport&&this.viewportRevision++}scheduleViewportChange(){this.sourceMode&&this.requestSourceScene(),this.viewportChangeRaf==null&&(this.viewportChangeRaf=this.requestOwnerAnimationFrame(()=>{this.viewportChangeRaf=null,this.emit("lr-viewport-change",Object.freeze({x:this.panX,y:this.panY,zoom:this.zoomLevel}))}))}zoomAtCenter(nextZoom){const rect=this.viewportEl?.getBoundingClientRect();this.zoomAtPoint(rect?rect.width/2:0,rect?rect.height/2:0,nextZoom)}zoomAtPoint(localX,localY,nextZoom){const clamped=this.clampZoom(nextZoom);if(clamped===this.zoomLevel)return;const contentX=(localX-this.panX)/this.zoomLevel,contentY=(localY-this.panY)/this.zoomLevel;this.panX=localX-contentX*clamped,this.panY=localY-contentY*clamped,this.zoomLevel=clamped,this.applyWorldTransform(),this.scheduleViewportChange()}localWorldX(clientX,rect,rtl=isRtl(this)){const local=clientX-rect.left;return this.orientation==="horizontal"&&rtl?rect.width-local:local}isFromTopLayerSurface(e,boundary){for(const entry of e.composedPath()){if(entry===boundary)return!1;if(entry instanceof Element&&(entry.hasAttribute("data-lr-top-layer")||isNativeTopLayerElement(entry)))return!0}return!1}endBackgroundPan(rollback){const drag=this.panDrag;drag&&(this.panDrag=void 0,this.viewportEl?.removeAttribute("data-panning"),this.connectedWindow?.removeEventListener("pointermove",this.onBackgroundPointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onBackgroundPointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onBackgroundPointerUp),this.connectedWindow?.removeEventListener("lostpointercapture",this.onBackgroundPointerUp),rollback&&(this.panX!==drag.startPanX||this.panY!==drag.startPanY)&&(this.panX=drag.startPanX,this.panY=drag.startPanY,this.applyWorldTransform(),this.scheduleViewportChange()))}panBy(dx,dy){this.panX+=dx,this.panY+=dy,this.applyWorldTransform(),this.scheduleViewportChange()}focusableEdges(){const nodeIds=new Set(this.modelNodes.map(n=>n.id));return this.modelEdges.filter(e=>nodeIds.has(e.source)&&nodeIds.has(e.target))}rovingItems(){if(this.rovingCache)return this.rovingCache;const horizontal=this.orientation==="horizontal",keyed=this.modelNodes.map(node=>{const{x,y}=this.nodePosition(node);return{node,main:horizontal?x:y,cross:horizontal?y:x}});return keyed.sort((a,b)=>a.main-b.main||a.cross-b.cross),this.rovingCache=[...keyed.map(({node})=>({kind:"node",id:node.id,disabled:node.disabled===!0})),...this.focusableEdges().map(e=>({kind:"edge",id:e.id}))]}itemCount(){return this.rovingItems().length}isRovingItemDisabled(item){return item.disabled===!0}normalizedItemIndex(index=this.activeItemIndex){const items=this.rovingItems(),count=items.length;if(!count)return-1;const clamped=Math.min(Math.max(index,0),count-1);if(!this.isRovingItemDisabled(items[clamped]))return clamped;for(let forward=clamped+1;forward<count;forward+=1)if(!this.isRovingItemDisabled(items[forward]))return forward;for(let backward=clamped-1;backward>=0;backward-=1)if(!this.isRovingItemDisabled(items[backward]))return backward;return-1}nextEnabledItemIndex(from,direction){const items=this.rovingItems(),count=items.length;if(!count)return-1;let index=Math.min(Math.max(from+direction,0),count-1);for(let steps=0;steps<count;steps+=1){if(!this.isRovingItemDisabled(items[index]))return index;if(index+=direction,index<0||index>=count)break}return from>=0&&from<count&&!this.isRovingItemDisabled(items[from])?from:-1}firstEnabledItemIndex(){return this.rovingItems().findIndex(item=>!this.isRovingItemDisabled(item))}lastEnabledItemIndex(){const items=this.rovingItems();for(let index=items.length-1;index>=0;index-=1)if(!this.isRovingItemDisabled(items[index]))return index;return-1}itemAccessibleText(item){if(this.ensureModelIndexes(),item.kind==="node"){const node=this.nodesById.get(item.id);return node?this.nodeAccessibleText(node):""}const edge=this.edgesById.get(item.id);return edge?this.edgeAccessibleText(edge):""}spatialItemIndex(kind,id){return this.rovingItems().findIndex(it=>it.kind===kind&&it.id===id)}announceItem(index){const item=this.rovingItems()[index];item&&this.announcer.announce(this.localize("flowItemAnnouncement",void 0,{item:this.itemAccessibleText(item),index:this.formatNumber(index+1),total:this.formatNumber(this.itemCount())}))}formatNumber(value){return getNumberFormat(this.effectiveLocale).format(value)}onItemFocus(index){this.normalizedItemIndex(index)<0||(this.activeItemIndex=index,this.announceItem(index))}renderedElementByDataId(attribute,id){return(attribute==="data-node-id"?this.nodeWrappers.get(id):this.edgeWrappers.get(id))??null}renderedNodeById(id){return this.renderedElementByDataId("data-node-id",id)}renderedEdgeById(id){return this.renderedElementByDataId("data-edge-id",id)}focusActiveItem(index=this.activeItemIndex){const normalized=this.normalizedItemIndex(index);if(normalized<0)return;this.activeItemIndex=normalized,this.announceItem(normalized);const item=this.rovingItems()[normalized];item&&(this.revealItem(item),this.updateComplete.then(()=>{(item.kind==="node"?this.renderedNodeById(item.id)?.querySelector('[part="node-control"]'):this.renderedEdgeById(item.id)?.querySelector('[part="edge"]'))?.focus()}))}revealItem(item){const node=item.kind==="node"?this.nodesById.get(item.id):void 0,edge=item.kind==="edge"?this.edgesById.get(item.id):void 0,source=node??(edge?this.nodesById.get(edge.source):void 0);if(!source||!this.viewportEl)return;const box=this.resolvedNode(source),target=edge&&this.nodesById.get(edge.target),targetBox=target?this.resolvedNode(target):box;let x=(box.x+box.width/2+targetBox.x+targetBox.width/2)/2;node&&this.geometryRtl&&(x=this.viewportEl.clientWidth+box.x-box.width/2);const y=(box.y+box.height/2+targetBox.y+targetBox.height/2)/2,width=this.viewportEl.clientWidth,height=this.viewportEl.clientHeight;(x*this.zoomLevel+this.panX<0||x*this.zoomLevel+this.panX>width||y*this.zoomLevel+this.panY<0||y*this.zoomLevel+this.panY>height)&&(this.panX=width/2-x*this.zoomLevel,this.panY=height/2-y*this.zoomLevel,this.applyWorldTransform(),this.scheduleViewportChange())}applySelection(kind,id,additive){const current=this.sourceAuthority();if(!current()||(kind==="node"?(this.selectedNodeIds=additive?toggledSelection(this.selectedNodeIds,id):[id],additive||(this.selectedEdgeIds=[])):(this.selectedEdgeIds=additive?toggledSelection(this.selectedEdgeIds,id):[id],additive||(this.selectedNodeIds=[])),this.emit("lr-selection-change",Object.freeze({selectedNodeIds:Object.freeze([...this.selectedNodeIds]),selectedEdgeIds:Object.freeze([...this.selectedEdgeIds])})),!current()))return;const selected=kind==="node"?this.selectedNodeIds.includes(id):this.selectedEdgeIds.includes(id),label=this.itemAccessibleText({kind,id});this.announcer.announce(this.localize(selected?"flowNodeSelected":"flowNodeDeselected",void 0,{label}))}clearSelection(){this.selectedNodeIds.length===0&&this.selectedEdgeIds.length===0||(this.selectedNodeIds=[],this.selectedEdgeIds=[],this.emit("lr-selection-change",Object.freeze({selectedNodeIds:Object.freeze([]),selectedEdgeIds:Object.freeze([])})),this.announcer.announce(this.localize("flowSelectionCleared")))}deleteSelection(){this.sourceMode||!this.nodesDraggable&&!this.connectable&&!this.droppable||this.selectedNodeIds.length===0&&this.selectedEdgeIds.length===0||this.emit("lr-selection-delete",Object.freeze({nodeIds:Object.freeze([...this.selectedNodeIds]),edgeIds:Object.freeze([...this.selectedEdgeIds])}))}onNodeActivate(node,additive){if(node.disabled)return;const current=this.sourceAuthority();current()&&(this.emit("lr-node-activate",Object.freeze({nodeId:node.id})),current()&&this.applySelection("node",node.id,additive))}startedOnAction(event,boundary){for(const entry of event.composedPath()){if(entry===boundary)return!1;if(entry.nodeType===1&&isActionableElement(entry))return!0}return!1}onNodeClick(event,node){if(this.startedOnAction(event,event.currentTarget)){event.stopPropagation();return}this.onNodeActivate(node,event.ctrlKey||event.metaKey)}onEdgeActivate(edge,additive){const current=this.sourceAuthority();current()&&(this.emit("lr-edge-activate",Object.freeze({edgeId:edge.id,sourceNodeId:edge.source,targetNodeId:edge.target,source:edge.source,target:edge.target})),current()&&this.applySelection("edge",edge.id,additive))}onItemKeyDown(e,index,activate){const arrowKeys=["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"];if(!this.sourceMode&&this.nodesDraggable&&!this.readonly&&(e.ctrlKey||e.metaKey)&&arrowKeys.includes(e.key)){const item=this.rovingItems()[index];if(item?.kind==="node"){e.preventDefault(),this.nudgeNode(item.id,e.key);return}}if(this.keyboardConnectSourceId){if(e.key==="Escape"){e.preventDefault(),this.cancelKeyboardConnect();return}if(e.key==="Enter"){e.preventDefault(),this.commitKeyboardConnect();return}const rtlForConnect=isRtl(this),forwardConnectKey=rtlForConnect?"ArrowLeft":"ArrowRight",backwardConnectKey=rtlForConnect?"ArrowRight":"ArrowLeft";if(e.key===forwardConnectKey||e.key==="ArrowDown"){e.preventDefault(),this.cycleKeyboardConnectTarget(1);return}if(e.key===backwardConnectKey||e.key==="ArrowUp"){e.preventDefault(),this.cycleKeyboardConnectTarget(-1);return}return}if(!this.sourceMode&&this.connectable&&!this.readonly&&e.key==="c"&&e.target===e.currentTarget){const item=this.rovingItems()[index];if(item?.kind==="node"){e.preventDefault(),this.startKeyboardConnect(item.id);return}}if(e.key==="Enter"||e.key===" "){e.preventDefault(),this.setActiveItemQuiet(index),activate(e.ctrlKey||e.metaKey);return}if(e.key==="Escape"){e.preventDefault(),e.target!==e.currentTarget?e.currentTarget.focus():this.clearSelection();return}if((e.key==="Delete"||e.key==="Backspace")&&e.target===e.currentTarget){e.preventDefault(),this.deleteSelection();return}if(!this.itemCount())return;const rtl=isRtl(this),forwardKey=rtl?"ArrowLeft":"ArrowRight",backwardKey=rtl?"ArrowRight":"ArrowLeft";let next;if(e.key===forwardKey||e.key==="ArrowDown")next=this.nextEnabledItemIndex(index,1);else if(e.key===backwardKey||e.key==="ArrowUp")next=this.nextEnabledItemIndex(index,-1);else if(e.key==="Home")next=this.firstEnabledItemIndex();else if(e.key==="End")next=this.lastEnabledItemIndex();else return;e.preventDefault(),next>=0&&this.focusActiveItem(next)}setActiveItemQuiet(index){const normalized=this.normalizedItemIndex(index);normalized>=0&&(this.activeItemIndex=normalized)}itemIndexMaps(){const items=this.rovingItems();if(this.indexItems===items&&this.indexes)return this.indexes;this.indexItems=items;const nodeIndex=new Map,edgeIndex=new Map;return items.forEach((item,i)=>{item.kind==="node"?nodeIndex.set(item.id,i):edgeIndex.set(item.id,i-nodeIndex.size)}),this.indexes={nodeIndex,edgeIndex}}snap(value){const grid=this.safeGrid;return grid>0?Math.round(value/grid)*grid:value}rebuildIncidentEdgesIndex(){const map=new Map;for(const edge of this.modelEdges)(map.get(edge.source)??map.set(edge.source,[]).get(edge.source)).push(edge.id),edge.target!==edge.source&&(map.get(edge.target)??map.set(edge.target,[]).get(edge.target)).push(edge.id);this.nodeIncidentEdges=map}buildDragEdgeRefs(nodeId){const refs=[];this.ensureModelIndexes();for(const edgeId of this.nodeIncidentEdges.get(nodeId)??[]){const edge=this.edgesById.get(edgeId),sourceNode=edge&&this.nodesById.get(edge.source),targetNode=edge&&this.nodesById.get(edge.target);if(!edge||!sourceNode||!targetNode)continue;const group=this.renderedEdgeById(edgeId);refs.push({edge,sourceNode,targetNode,pathEl:group?.querySelector('[part="edge"]')??null,labelEl:group?.querySelector('[part="edge-label"]')??null})}return refs}updateIncidentEdges(nodeId,x,y,rtlFlip=this.nodeDrag?.rtlFlip??1){for(const{edge,sourceNode,targetNode,pathEl,labelEl}of this.dragEdgeRefs??[]){const sourceResolved=edge.source===nodeId?{...this.resolvedNode(sourceNode),x,y}:this.resolvedNode(sourceNode),targetResolved=edge.target===nodeId?{...this.resolvedNode(targetNode),x,y}:this.resolvedNode(targetNode),sourcePt=this.handlePoint(sourceResolved,"output",edge.sourceHandle??"out"),targetPt=this.handlePoint(targetResolved,"input",edge.targetHandle??"in");if(pathEl?.setAttribute("d",this.edgePathD(sourcePt,targetPt)),labelEl){const midX=(sourcePt.x+targetPt.x)/2;labelEl.setAttribute("x",String(midX)),labelEl.setAttribute("y",String((sourcePt.y+targetPt.y)/2)),this.orientation==="horizontal"&&rtlFlip<0?labelEl.setAttribute("transform",`translate(${2*midX} 0) scale(-1 1)`):labelEl.removeAttribute("transform")}}}onNodePointerDown(e,node){if(this.sourceMode||!this.nodesDraggable||this.readonly||node.disabled)return;const wrapper=e.currentTarget;if(this.isFromTopLayerSurface(e,wrapper)||this.startedOnAction(e,wrapper))return;e.stopPropagation();const start=this.nodePosition(node);this.nodeDrag={pointerId:e.pointerId,nodeId:node.id,startClientX:e.clientX,startClientY:e.clientY,startX:start.x,startY:start.y,wrapper,rtlFlip:this.orientation==="horizontal"&&isRtl(this)?-1:1},this.dragEdgeRefs=this.buildDragEdgeRefs(node.id),wrapper.setPointerCapture?.(e.pointerId),this.connectedWindow?.addEventListener("pointermove",this.onNodePointerMove),this.connectedWindow?.addEventListener("pointerup",this.onNodePointerUp),this.connectedWindow?.addEventListener("pointercancel",this.onNodePointerUp),this.connectedWindow?.addEventListener("lostpointercapture",this.onNodePointerUp)}endNodeDrag(commit){const drag=this.nodeDrag;if(!drag)return;this.nodeDrag=void 0,this.connectedWindow?.removeEventListener("pointermove",this.onNodePointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onNodePointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onNodePointerUp),this.connectedWindow?.removeEventListener("lostpointercapture",this.onNodePointerUp);const previous={x:drag.startX,y:drag.startY},position={x:drag.currentX??drag.startX,y:drag.currentY??drag.startY};commit&&!this.sourceMode&&this.nodesDraggable&&this.modelNodes.some(node=>node.id===drag.nodeId)&&(position.x!==previous.x||position.y!==previous.y)&&this.emit("lr-node-move",Object.freeze({nodeId:drag.nodeId,position:Object.freeze(position),previous:Object.freeze(previous)}));const resetNode=this.modelNodes.find(n=>n.id===drag.nodeId),resetPos=resetNode?this.nodePosition(resetNode):previous;drag.wrapper.style.transform=`translate(${resetPos.x}px, ${resetPos.y}px)`,this.updateIncidentEdges(drag.nodeId,resetPos.x,resetPos.y,drag.rtlFlip),this.dragEdgeRefs=void 0,this.sourceMode?this.requestUpdate("gesture",!1):this.requestUpdate()}nudgeNode(nodeId,key){if(this.sourceMode)return;const node=this.modelNodes.find(n=>n.id===nodeId);if(!node)return;const current=this.nodePosition(node),step=this.safeGrid>0?this.safeGrid:1,rtlFlip=this.orientation==="horizontal"&&isRtl(this)?-1:1;let dx=0,dy=0;key==="ArrowRight"?dx=step*rtlFlip:key==="ArrowLeft"?dx=-step*rtlFlip:key==="ArrowDown"?dy=step:key==="ArrowUp"&&(dy=-step);const position={x:current.x+dx,y:current.y+dy};this.emit("lr-node-move",Object.freeze({nodeId,position:Object.freeze(position),previous:Object.freeze(current)})),this.announcer.announce(this.localize("flowNodeMoved",void 0,{label:this.nodeAccessibleText(node),x:this.formatNumber(position.x),y:this.formatNumber(position.y)})),this.requestUpdate()}nodeIdFromComposedPath(path){for(const el of path)if(isHtmlElement(el)&&el.getAttribute("part")==="node"&&el.dataset.nodeId)return el.dataset.nodeId;return null}isInvalidConnectTarget(hoveredId){return this.connectState?this.isInvalidConnectTargetFor(this.connectState,hoveredId):!1}startConnectGesture(nodeId,handleId,clientX,clientY){if(this.sourceMode)return;const sourceNode=this.modelNodes.find(n=>n.id===nodeId);if(!sourceNode||sourceNode.disabled)return;const startPt=this.handlePoint(this.resolvedNode(sourceNode),"output",handleId);this.connectState={sourceId:nodeId,sourceHandle:handleId,startPt,rect:this.viewportEl?.getBoundingClientRect()??null,rtl:isRtl(this)},this.connecting=!0,this.announcer.announce(this.localize("flowConnectStarted",void 0,{label:this.nodeAccessibleText(sourceNode)})),this.updateComplete.then(()=>{this.connectionLineEl=this.renderRoot.querySelector('[part="connection-line"]')??void 0,this.connectionLineEl?.setAttribute("d",this.edgePathD(startPt,this.connectContentPoint(clientX,clientY)))}),this.connectedWindow?.addEventListener("pointermove",this.onConnectPointerMove),this.connectedWindow?.addEventListener("pointerup",this.onConnectPointerUp),this.connectedWindow?.addEventListener("pointercancel",this.onConnectPointerCancel),this.connectedWindow?.addEventListener("lostpointercapture",this.onConnectPointerCancel)}connectContentPoint(clientX,clientY){const state2=this.connectState;if(!state2?.rect)return{x:0,y:0};const localX=this.localWorldX(clientX,state2.rect,state2.rtl),localY=clientY-state2.rect.top;return{x:(localX-this.panX)/this.zoomLevel,y:(localY-this.panY)/this.zoomLevel}}isInvalidConnectTargetFor(state2,hoveredId){return this.ensureModelIndexes(),hoveredId===state2.sourceId||this.nodesById.get(hoveredId)?.disabled===!0||this.outgoingTargets.get(state2.sourceId)?.has(hoveredId)===!0}endConnectGesture(){this.connectInvalidNodeId&&(this.renderedNodeById(this.connectInvalidNodeId)?.removeAttribute("data-connect-invalid"),this.connectInvalidNodeId=null),this.connectState=void 0,this.connecting=!1,this.connectedWindow?.removeEventListener("pointermove",this.onConnectPointerMove),this.connectedWindow?.removeEventListener("pointerup",this.onConnectPointerUp),this.connectedWindow?.removeEventListener("pointercancel",this.onConnectPointerCancel),this.connectedWindow?.removeEventListener("lostpointercapture",this.onConnectPointerCancel)}cancelActiveGestures(){this.endBackgroundPan(!0),this.cancelModelBoundGestures(),this.viewportEl?.removeAttribute("data-drop-active")}cancelModelBoundGestures(){this.endNodeDrag(!1),this.onConnectPointerCancel(),this.keyboardConnectSourceId=null,this.keyboardConnectTargetIndex=0}eligibleConnectTargets(sourceId){if(this.ensureModelIndexes(),this.connectTargets?.source===sourceId&&this.connectTargets.nodes===this.modelNodes&&this.connectTargets.edges===this.modelEdges)return this.connectTargets.targets;const linked=this.outgoingTargets.get(sourceId),targets=this.modelNodes.filter(node=>node.id!==sourceId&&!node.disabled&&!linked?.has(node.id));return this.connectTargets={source:sourceId,nodes:this.modelNodes,edges:this.modelEdges,targets},targets}startKeyboardConnect(sourceId){if(this.sourceMode)return;const sourceNode=this.modelNodes.find(n=>n.id===sourceId);!sourceNode||sourceNode.disabled||this.eligibleConnectTargets(sourceId).length===0||(this.keyboardConnectSourceId=sourceId,this.keyboardConnectTargetIndex=0,sourceNode&&this.announceKeyboardConnectTarget())}cycleKeyboardConnectTarget(direction){if(!this.keyboardConnectSourceId)return;const targets=this.eligibleConnectTargets(this.keyboardConnectSourceId);targets.length!==0&&(this.keyboardConnectTargetIndex=(this.keyboardConnectTargetIndex+direction+targets.length)%targets.length,this.announceKeyboardConnectTarget())}announceKeyboardConnectTarget(){const sourceId=this.keyboardConnectSourceId;if(!sourceId)return;const source=this.modelNodes.find(node=>node.id===sourceId),targets=this.eligibleConnectTargets(sourceId),target=targets[this.keyboardConnectTargetIndex];!source||!target||this.announcer.announce(this.localize("flowConnectTarget",void 0,{source:this.nodeAccessibleText(source),target:this.nodeAccessibleText(target),index:this.formatNumber(this.keyboardConnectTargetIndex+1),total:this.formatNumber(targets.length)}))}commitKeyboardConnect(){if(this.sourceMode)return;const sourceId=this.keyboardConnectSourceId;if(!sourceId)return;const target=this.eligibleConnectTargets(sourceId)[this.keyboardConnectTargetIndex];if(this.keyboardConnectSourceId=null,!target)return;const sourceOutputs=nodeById(this.modelNodes,sourceId)?.outputs??DEFAULT_FLOW_OUTPUTS,targetInputs=target.inputs??DEFAULT_FLOW_INPUTS;if(this.sourceMode||!this.connectable||this.readonly)return;this.emit("lr-connect",Object.freeze({source:sourceId,target:target.id,sourceHandle:sourceOutputs[0]?.id??"out",targetHandle:targetInputs[0]?.id??"in"}));const source=this.modelNodes.find(node=>node.id===sourceId);this.announcer.announce(this.localize("flowConnectCommitted",void 0,{source:source?this.nodeAccessibleText(source):sourceId,target:this.nodeAccessibleText(target)}))}cancelKeyboardConnect(){this.keyboardConnectSourceId&&(this.keyboardConnectSourceId=null,this.announcer.announce(this.localize("flowConnectCancelled")))}statusTone(status){return status==="running"?"brand":status==="success"?"success":status==="error"?"danger":status==="denied"?"warning":"neutral"}edgeTone(edge){const decoration=this.decorations?.[edge.id];return decoration?this.statusTone(decoration.status):edge.tone??"neutral"}edgeIsRunning(edge){return this.decorations?.[edge.id]?.status==="running"}renderEdges(resolvedById,nodeIndex,edgeIndex,activeIndex){const authority=this.sourceAuthority(),edges=this.modelEdges,current=()=>authority()&&this.modelEdges===edges,selectedEdges=new Set(this.selectedEdgeIds),reducedMotion=!this.ownerDocument?.defaultView||prefersReducedMotion(this),counterMirrorLabels=this.orientation==="horizontal"&&!!this.ownerDocument?.defaultView&&isRtl(this);return svg`${repeat(this.renderedEdges,edge=>edge.id,edge=>guard([edge,resolvedById.get(edge.source),resolvedById.get(edge.target),nodeIndex,edgeIndex,selectedEdges.has(edge.id),this.decorations?.[edge.id],reducedMotion,counterMirrorLabels,this.renderEpoch],()=>{const sourceResolved=resolvedById.get(edge.source);if(!sourceResolved)return nothing;const targetResolved=resolvedById.get(edge.target),sourcePt=this.handlePoint(sourceResolved,"output",edge.sourceHandle??"out");if(!targetResolved){const stubPt={x:sourcePt.x+14,y:sourcePt.y+14};return svg`<line
           part="stub"
           aria-hidden="true"
           x1=${sourcePt.x} y1=${sourcePt.y}
           x2=${stubPt.x} y2=${stubPt.y}
-        ></line>`);continue}const targetPt=this.handlePoint(targetResolved,"input",edge.targetHandle??"in"),midX=(sourcePt.x+targetPt.x)/2,midY=(sourcePt.y+targetPt.y)/2,index=nodeIndex.size+(edgeIndex.get(edge.id)??0),active=activeIndex===index,selected=selectedEdges.has(edge.id),path=this.edgePathD(sourcePt,targetPt),tone=this.edgeTone(edge);items.push(svg`<g data-edge-id=${edge.id}>
+        ></line>`}const targetPt=this.handlePoint(targetResolved,"input",edge.targetHandle??"in"),midX=(sourcePt.x+targetPt.x)/2,midY=(sourcePt.y+targetPt.y)/2,index=nodeIndex.size+(edgeIndex.get(edge.id)??0),active=activeIndex===index,selected=selectedEdges.has(edge.id),path=this.edgePathD(sourcePt,targetPt),tone=this.edgeTone(edge);return svg`<g data-edge-id=${edge.id} ${ref(element=>{element?this.edgeWrappers.set(edge.id,element):this.edgeWrappers.delete(edge.id)})}>
         <path
           part="edge-hit-area"
           aria-hidden="true"
           tabindex="-1"
           d=${path}
-          @click=${e=>this.onEdgeActivate(edge,e.ctrlKey||e.metaKey)}
+          @click=${e=>{current()&&this.onEdgeActivate(edge,e.ctrlKey||e.metaKey)}}
         ></path>
         <path
           part="edge"
@@ -22,9 +39,9 @@ import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property,
           data-tone=${tone}
           data-running=${this.edgeIsRunning(edge)&&!reducedMotion?"":nothing}
           data-running-static=${this.edgeIsRunning(edge)&&reducedMotion?"":nothing}
-          @click=${e=>this.onEdgeActivate(edge,e.ctrlKey||e.metaKey)}
-          @focus=${()=>this.onItemFocus(index)}
-          @keydown=${e=>this.onItemKeyDown(e,index,additive=>this.onEdgeActivate(edge,additive))}
+          @click=${e=>{current()&&this.onEdgeActivate(edge,e.ctrlKey||e.metaKey)}}
+          @focus=${()=>{current()&&this.onItemFocus(index)}}
+          @keydown=${e=>current()&&this.onItemKeyDown(e,index,additive=>{current()&&this.onEdgeActivate(edge,additive)})}
         ></path>
         ${edge.label?svg`<text
               part="edge-label"
@@ -33,9 +50,10 @@ import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property,
               transform=${counterMirrorLabels?`translate(${2*midX} 0) scale(-1 1)`:nothing}
               paint-order="stroke"
             >${edge.label}</text>`:""}
-      </g>`)}return svg`${items}`}renderNodes(resolvedById,nodeIndex,activeIndex){const selectedNodes=new Set(this.selectedNodeIds),connectTargetId=this.keyboardConnectSourceId?this.eligibleConnectTargets(this.keyboardConnectSourceId)[this.keyboardConnectTargetIndex]?.id:void 0,ownerRegistry=this.ownerDocument?.defaultView?.customElements,canRenderFlowNode=!ownerRegistry||!!ownerRegistry.get(tag("flow-node"));return html`${repeat(this.nodes,node=>node.id,node=>{const resolved=resolvedById.get(node.id),index=nodeIndex.get(node.id)??0,active=activeIndex===index,selected=selectedNodes.has(node.id),heading=typeof node.data?.label=="string"?node.data.label:node.id,description=typeof node.data?.description=="string"?node.data.description:"",decoration=this.decorations?.[node.id],typePart=nodeTypePart(node.type);return html`<div
+      </g>`}))}`}renderNodes(resolvedById,nodeIndex,activeIndex){const authority=this.sourceAuthority(),nodes=this.modelNodes,current=()=>authority()&&this.modelNodes===nodes,selectedNodes=new Set(this.selectedNodeIds),connectTargetId=this.renderedConnectTargetId,ownerRegistry=this.ownerDocument?.defaultView?.customElements,canRenderFlowNode=!ownerRegistry||!!ownerRegistry.get(tag("flow-node"));return html`${repeat(this.renderedNodes,node=>node.id,node=>{const resolved=resolvedById.get(node.id),index=nodeIndex.get(node.id)??0,active=activeIndex===index,selected=selectedNodes.has(node.id),heading=typeof node.data?.label=="string"?node.data.label:node.id,description=typeof node.data?.description=="string"?node.data.description:"",decoration=this.decorations?.[node.id],typePart=nodeTypePart(node.type);return guard([node,resolved,index,selected,decoration,this.orientation,connectTargetId===node.id,this.renderEpoch],()=>html`<div
           part="node"
           data-node-id=${node.id}
+          ${ref(element=>this.bindNodeWrapper(node.id,element))}
           data-type=${node.type??nothing}
           data-connect-target=${node.id===connectTargetId?"":nothing}
           data-selected=${selected?"":nothing}
@@ -43,8 +61,8 @@ import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property,
           aria-label=${this.nodeAccessibleText(node)}
           aria-disabled=${node.disabled?"true":nothing}
           style="transform:translate(${resolved.x}px,${resolved.y}px)"
-          @click=${e=>this.onNodeClick(e,node)}
-          @pointerdown=${e=>this.onNodePointerDown(e,node)}
+          @click=${e=>{current()&&this.onNodeClick(e,node)}}
+          @pointerdown=${e=>{current()&&this.onNodePointerDown(e,node)}}
         >
           <button
             part="node-control"
@@ -54,9 +72,9 @@ import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property,
             tabindex=${active?"0":"-1"}
             aria-label=${this.nodeAccessibleText(node)}
             aria-pressed=${selected?"true":"false"}
-            @click=${e=>{e.stopPropagation(),this.onNodeActivate(node,e.ctrlKey||e.metaKey)}}
-            @focus=${()=>this.onItemFocus(index)}
-            @keydown=${e=>this.onItemKeyDown(e,index,additive=>this.onNodeActivate(node,additive))}
+            @click=${e=>{e.stopPropagation(),current()&&this.onNodeActivate(node,e.ctrlKey||e.metaKey)}}
+            @focus=${()=>{current()&&this.onItemFocus(index)}}
+            @keydown=${e=>current()&&this.onItemKeyDown(e,index,additive=>{current()&&this.onNodeActivate(node,additive)})}
           ></button>
           <slot name=${`node-${node.id}`}>
             ${canRenderFlowNode?html`<lr-flow-node
@@ -100,13 +118,13 @@ import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property,
                   </div>
                 </div>`}
           </slot>
-        </div>`})}`}render(){const isEmpty=this.nodes.length===0,{nodeIndex,edgeIndex}=this.itemIndexMaps(),activeIndex=this.normalizedItemIndex(),resolvedById=new Map(this.nodes.map(n=>[n.id,this.resolvedNode(n)])),nodeIds=new Set(this.nodes.map(node=>node.id)),fallbackEdges=this.edges.filter(edge=>!nodeIds.has(edge.source)||!nodeIds.has(edge.target));return html`<div part="base" role="region" aria-label=${this.accessibleLabel??this.localize("flowCanvasLabel")}>
+        </div>`)})}`}nodeViewportBounds(box){return{left:this.geometryRtl?box.x-box.width:box.x,top:box.y,right:this.geometryRtl?box.x:box.x+box.width,bottom:box.y+box.height}}edgeViewportBounds(edge,resolved){const source=resolved.get(edge.source),target=resolved.get(edge.target);if(!source)return;const end=target??source;return{left:Math.min(source.x,end.x)-CONNECT_OFFSET_MAX,top:Math.min(source.y,end.y)-CONNECT_OFFSET_MAX,right:Math.max(source.x+source.width,end.x+end.width)+CONNECT_OFFSET_MAX,bottom:Math.max(source.y+source.height,end.y+end.height)+CONNECT_OFFSET_MAX}}focusedNodeId(){for(let element=deepActiveElementIn(this.ownerDocument);element&&element!==this;element=composedParentElement(element)){const id=element.getAttribute("data-node-id");if(id&&this.nodeWrappers.get(id)===element)return id;if(element.parentNode===this)return element.getAttribute("node-id")??void 0}}selectRenderedGeometry(resolved){if(this.renderedConnectTargetId=this.keyboardConnectSourceId?this.eligibleConnectTargets(this.keyboardConnectSourceId)[this.keyboardConnectTargetIndex]?.id:void 0,this.visibleGeometry!==resolved&&(this.visibleGeometry=resolved,this.visibleViewport=-1,this.geometryRtl=this.effectiveDirection==="rtl",this.nodeViewportIndex=new FlowViewportIndex(this.modelNodes.map(node=>({value:node,bounds:this.nodeViewportBounds(resolved.get(node.id))}))),this.edgeViewportIndex=new FlowViewportIndex(this.modelEdges.flatMap(edge=>{const bounds=this.edgeViewportBounds(edge,resolved);return bounds?[{value:edge,bounds}]:[]}))),this.visibleViewport!==this.viewportRevision){this.visibleViewport=this.viewportRevision;const width=this.viewportEl?.clientWidth||this.clientWidth,height=this.viewportEl?.clientHeight||this.clientHeight,left=-this.panX/this.zoomLevel,top=-this.panY/this.zoomLevel,bounds={left,top,right:left+width/this.zoomLevel,bottom:top+height/this.zoomLevel};this.baseVisibleNodes=width&&height?this.nodeViewportIndex.query(this.geometryRtl?{...bounds,left:bounds.left-width,right:bounds.right-width}:bounds):[...this.modelNodes],this.baseVisibleEdges=width&&height?this.edgeViewportIndex.query(bounds):[...this.modelEdges]}const nodeIds=new Set(this.baseVisibleNodes.map(node=>node.id)),edgeIds=new Set(this.baseVisibleEdges.map(edge=>edge.id)),reserved=new Set(this.selectedNodeIds),focused=this.focusedNodeId();focused&&reserved.add(focused);const item=this.rovingItems()[this.normalizedItemIndex()];item?.kind==="node"&&reserved.add(item.id),item?.kind==="edge"&&edgeIds.add(item.id);for(const id of this.selectedEdgeIds)edgeIds.add(id);for(const id of[...this.selectedEdgeIds,...item?.kind==="edge"?[item.id]:[]]){const edge=this.edgesById.get(id);edge&&(reserved.add(edge.source),reserved.add(edge.target))}this.nodeDrag&&reserved.add(this.nodeDrag.nodeId),this.connectState&&reserved.add(this.connectState.sourceId),this.keyboardConnectSourceId&&(reserved.add(this.keyboardConnectSourceId),this.renderedConnectTargetId&&reserved.add(this.renderedConnectTargetId));for(const id of reserved){nodeIds.add(id);for(const edge of this.nodeIncidentEdges.get(id)??[])edgeIds.add(edge)}this.renderedNodes=[...nodeIds].flatMap(id=>this.nodesById.get(id)??[]).sort((a,b)=>this.nodeModelOrder.get(a.id)-this.nodeModelOrder.get(b.id)),this.renderedEdges=[...edgeIds].flatMap(id=>this.edgesById.get(id)??[]).sort((a,b)=>this.edgeModelOrder.get(a.id)-this.edgeModelOrder.get(b.id))}render(){return this.withFallbackSizes(()=>{const isEmpty=this.modelNodes.length===0,{nodeIndex,edgeIndex}=this.itemIndexMaps(),activeIndex=this.normalizedItemIndex(),resolvedById=this.renderResolved??=new Map(this.modelNodes.map(n=>[n.id,this.resolvedNode(n)]));this.selectRenderedGeometry(resolvedById);const fallbackEdges=this.fallbackEdges,state2=this.sourceScene.state,current=this.sourceAuthority();return html`<div part="base" class=${this.sourceMode?"source-mode":""} role="region" aria-label=${this.accessibleLabel??this.localize("flowCanvasLabel")}>
       <div
         part="viewport"
         ?data-empty=${isEmpty}
         role="group"
         tabindex="0"
-        aria-label=${this.accessibleLabel??this.localize("flowCanvasSummary",void 0,{nodeCount:this.formatNumber(this.nodes.length),edgeCount:this.formatNumber(this.edges.length)})}
+        aria-label=${this.accessibleLabel??this.localize("flowCanvasSummary",void 0,{nodeCount:this.formatNumber(this.modelNodes.length),edgeCount:this.formatNumber(this.modelEdges.length)})}
         @pointerdown=${isEmpty?this.onBackgroundPointerDown:void 0}
       >
         <div class="world" @pointerdown=${this.onWorldPointerDown}>
@@ -137,15 +155,18 @@ import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property,
           </svg>
           ${isEmpty?nothing:this.renderNodes(resolvedById,nodeIndex,activeIndex)}
         </div>
-        ${isEmpty?html`<lr-empty part="empty" heading=${this.localize("noData")}></lr-empty>`:nothing}
+        ${isEmpty&&!this.sourceMode?html`<lr-empty part="empty" heading=${this.localize("noData")}></lr-empty>`:nothing}
       </div>
-      ${this.layoutTruncated?html`<div part="layout-limit">
-            ${this.localize("flowCanvasLayoutLimit")}
+      ${this.sourceMode?this.renderSourceNavigator():nothing}
+      ${this.sourceMode&&(state2.pending||state2.error||this.sourceError||this.sourceSceneFailure)?html`<div part="source-status" class="source-scene-status">${this.localize(state2.pending?"loading":"graphSourceSceneError")}${state2.pending?nothing:html`<button type="button" @click=${()=>{current()&&this.sourceScene.state===state2&&(state2.error||this.sourceError||this.sourceSceneFailure)&&this.requestUpdate()}}>${this.localize("retry")}</button>`}</div>`:nothing}
+      ${!this.sourceMode&&(this.nodesInputTruncated||this.edgesInputTruncated||this.layoutTruncated)?html`<div class="limits">
+            ${this.nodesInputTruncated||this.edgesInputTruncated?html`<div part="input-limit" role="note">${this.localize("flowCanvasInputLimit")}</div>`:nothing}
+            ${this.layoutTruncated?html`<div part="layout-limit">${this.localize("flowCanvasLayoutLimit")}</div>`:nothing}
           </div>`:nothing}
       ${isEmpty?nothing:html`
             <div part="live-region" class="sr-only" aria-hidden="true" id=${this.liveRegionId}></div>
             ${fallbackEdges.length>0?html`<ul part="edge-list" class="sr-only" aria-label=${this.localize("flowEdgeList")}>
-                  ${fallbackEdges.map(edge=>html`<li>${this.edgeAccessibleText(edge)}</li>`)}
+                  ${guard([fallbackEdges,this.renderEpoch],()=>fallbackEdges.map(edge=>html`<li>${this.edgeAccessibleText(edge)}</li>`))}
                 </ul>`:nothing}
           `}
       <div part="overlay-rail" data-edge="top">
@@ -156,4 +177,4 @@ import{__decorate}from"tslib";import{html,nothing,svg}from"lit";import{property,
         <div class="overlay-group" data-align="start"><slot name="bottom-start"></slot></div>
         <div class="overlay-group" data-align="end"><slot name="bottom-end"></slot></div>
       </div>
-    </div>`}}__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"nodes",null),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"edges",null),__decorate([property({reflect:!0})],LyraFlowCanvas.prototype,"orientation",null),__decorate([property({type:Boolean,attribute:"nodes-draggable"})],LyraFlowCanvas.prototype,"nodesDraggable",void 0),__decorate([property({type:Boolean})],LyraFlowCanvas.prototype,"connectable",void 0),__decorate([property({type:Boolean})],LyraFlowCanvas.prototype,"droppable",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraFlowCanvas.prototype,"readonly",void 0),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"selectedNodeIds",null),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"selectedEdgeIds",null),__decorate([property({type:Number,attribute:"min-zoom"})],LyraFlowCanvas.prototype,"minZoom",void 0),__decorate([property({type:Number,attribute:"max-zoom"})],LyraFlowCanvas.prototype,"maxZoom",void 0),__decorate([property({type:Number})],LyraFlowCanvas.prototype,"grid",void 0),__decorate([property({type:Number,attribute:"layer-gap"})],LyraFlowCanvas.prototype,"layerGap",void 0),__decorate([property({type:Number,attribute:"node-gap"})],LyraFlowCanvas.prototype,"nodeGap",void 0),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"decorations",null),__decorate([property({attribute:"aria-label"})],LyraFlowCanvas.prototype,"accessibleLabel",void 0),__decorate([state()],LyraFlowCanvas.prototype,"activeItemIndex",void 0),__decorate([state()],LyraFlowCanvas.prototype,"connecting",void 0),__decorate([state()],LyraFlowCanvas.prototype,"layoutTruncated",void 0),__decorate([state()],LyraFlowCanvas.prototype,"keyboardConnectSourceId",void 0),__decorate([state()],LyraFlowCanvas.prototype,"keyboardConnectTargetIndex",void 0);export{LyraFlowCanvas};
+    </div>`})}}__decorate([state()],LyraFlowCanvas.prototype,"sourceState",void 0),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"graphSource",null),__decorate([property({type:Number,attribute:"source-page"})],LyraFlowCanvas.prototype,"sourcePage",null),__decorate([property({type:Number,attribute:"source-page-size"})],LyraFlowCanvas.prototype,"sourcePageSize",null),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"nodes",null),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"edges",null),__decorate([property({reflect:!0})],LyraFlowCanvas.prototype,"orientation",null),__decorate([property({type:Boolean,attribute:"nodes-draggable"})],LyraFlowCanvas.prototype,"nodesDraggable",void 0),__decorate([property({type:Boolean})],LyraFlowCanvas.prototype,"connectable",void 0),__decorate([property({type:Boolean})],LyraFlowCanvas.prototype,"droppable",void 0),__decorate([property({type:Boolean,reflect:!0})],LyraFlowCanvas.prototype,"readonly",void 0),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"selectedNodeIds",null),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"selectedEdgeIds",null),__decorate([property({type:Number,attribute:"min-zoom"})],LyraFlowCanvas.prototype,"minZoom",void 0),__decorate([property({type:Number,attribute:"max-zoom"})],LyraFlowCanvas.prototype,"maxZoom",void 0),__decorate([property({type:Number})],LyraFlowCanvas.prototype,"grid",void 0),__decorate([property({type:Number,attribute:"layer-gap"})],LyraFlowCanvas.prototype,"layerGap",void 0),__decorate([property({type:Number,attribute:"node-gap"})],LyraFlowCanvas.prototype,"nodeGap",void 0),__decorate([property({attribute:!1})],LyraFlowCanvas.prototype,"decorations",null),__decorate([property({attribute:"aria-label"})],LyraFlowCanvas.prototype,"accessibleLabel",void 0),__decorate([state()],LyraFlowCanvas.prototype,"activeItemIndex",void 0),__decorate([state()],LyraFlowCanvas.prototype,"viewportRevision",void 0),__decorate([state()],LyraFlowCanvas.prototype,"connecting",void 0),__decorate([state()],LyraFlowCanvas.prototype,"layoutTruncated",void 0),__decorate([state()],LyraFlowCanvas.prototype,"keyboardConnectSourceId",void 0),__decorate([state()],LyraFlowCanvas.prototype,"keyboardConnectTargetIndex",void 0);export{LyraFlowCanvas};

package/dist/components/data/flow-canvas/flow-canvas.styles.js

@@ -1 +1 @@
-import{iconHitTarget,focusRing}from"../../../internal/interactive-control.styles.js";import{css}from"lit";const styles=css` :host { display: block; position: relative; inline-size: 100%; block-size: var(--lr-canvas-reserved-height, var(--lr-size-24rem)); min-inline-size: 0; min-block-size: 0; overflow: hidden; } [part='base'] { position: relative; inline-size: 100%; block-size: 100%; } [part='viewport'] { position: relative; inline-size: 100%; block-size: 100%; overflow: hidden; outline: none; touch-action: none; cursor: grab; } [part='viewport']:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: calc(-1 * var(--lr-focus-ring-width)); } [part='background'], [part='edges'] { position: absolute; inset: 0; } [part='edges'] { inline-size: 100%; block-size: 100%; overflow: visible; pointer-events: none; } [part='empty'] { inline-size: 100%; block-size: 100%; pointer-events: none; } [part='overlay-rail'] { position: absolute; inset-inline: var(--lr-space-s); z-index: var(--lr-layer-content); display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--lr-space-s); pointer-events: none; } [part='overlay-rail'][data-edge='top'] { inset-block-start: var(--lr-space-s); } [part='overlay-rail'][data-edge='bottom'] { inset-block-end: var(--lr-space-s); } .overlay-group { display: flex; flex-wrap: wrap; max-inline-size: 100%; gap: var(--lr-space-s); pointer-events: auto; } .overlay-group[data-align='end'] { margin-inline-start: auto; } [part='node'] { position: absolute; inset-block-start: 0; inset-inline-start: 0; will-change: transform; --_lr-positioning-strategy-default: fixed; --lr-flow-node-selected-outline-color: transparent; min-inline-size: var(--lr-size-1-5rem); min-block-size: var(--lr-size-1-5rem); } [part='node-control'] { ${iconHitTarget} } .portable-node-card { display: flex; align-items: stretch; gap: var(--lr-space-xs); min-inline-size: calc(var(--lr-size-10rem) + var(--lr-size-1rem)); padding: var(--lr-space-s); border: var(--lr-border-width-thin) solid var(--lr-color-border); border-radius: var(--lr-radius); background: var(--lr-color-surface); box-shadow: var(--lr-shadow-s); } .portable-node-content { display: flex; flex: 1 1 auto; min-inline-size: 0; flex-direction: column; overflow-wrap: anywhere; } .portable-handles { display: flex; flex-direction: column; justify-content: space-around; } .portable-handles > span { inline-size: var(--lr-size-0-5rem); block-size: var(--lr-size-0-5rem); border-radius: var(--lr-radius-pill); background: var(--lr-color-border-strong); } [part='node']:focus-within { z-index: var(--lr-layer-content); } [part='edge'] { fill: none; stroke: var(--_lr-flow-edge-color, var(--lr-flow-canvas-edge-neutral-color, var(--lr-color-border))); stroke-width: 1.5; pointer-events: stroke; cursor: pointer; } [part='edge-hit-area'] { fill: none; stroke: transparent; stroke-width: var(--lr-icon-button-size); pointer-events: stroke; cursor: pointer; } [data-tone='brand'] { --_lr-flow-edge-color: var(--lr-flow-canvas-edge-brand-color, var(--lr-color-brand)); } [data-tone='success'] { --_lr-flow-edge-color: var(--lr-flow-canvas-edge-success-color, var(--lr-color-success)); } [data-tone='warning'] { --_lr-flow-edge-color: var(--lr-flow-canvas-edge-warning-color, var(--lr-color-warning)); } [data-tone='danger'] { --_lr-flow-edge-color: var(--lr-flow-canvas-edge-danger-color, var(--lr-color-danger)); } [part='arrowhead'] { fill: var(--_lr-flow-edge-color, var(--lr-flow-canvas-edge-neutral-color, var(--lr-color-border))); } [part='stub'] { stroke: var(--lr-color-border); stroke-width: 1.5; stroke-dasharray: 3 3; opacity: 0.6; } [part='edge-label'] { fill: var(--lr-color-text); font: var(--lr-font-size-xs) / 1 var(--lr-font); text-anchor: middle; stroke: var(--lr-color-surface); stroke-width: var(--lr-size-3px); } [part='layout-limit'] { position: absolute; inset-inline: var(--lr-space-s); inset-block-end: var(--lr-space-s); z-index: var(--lr-layer-content); max-inline-size: calc(100% - 2 * var(--lr-space-s)); padding: var(--lr-space-2xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid var(--lr-color-warning); border-radius: var(--lr-radius); background: var(--lr-color-surface); color: var(--lr-color-text); font-size: var(--lr-font-size-xs); overflow-wrap: anywhere; } .world { position: absolute; inset-block-start: 0; inset-inline-start: 0; inline-size: 100%; block-size: 100%; transform-origin: 0 0; will-change: transform; } [part='background'] { position: absolute; inset-block-start: -200%; inset-inline-start: -200%; inline-size: 500%; block-size: 500%; background-image: radial-gradient(circle, var(--lr-color-border-subtle) var(--lr-size-1px), transparent var(--lr-size-1px)); background-size: var(--lr-flow-canvas-grid-size, var(--_lr-flow-canvas-grid-size, var(--lr-size-0-5rem))) var(--lr-flow-canvas-grid-size, var(--_lr-flow-canvas-grid-size, var(--lr-size-0-5rem))); cursor: grab; } [part='viewport'][data-panning] [part='background'] { cursor: grabbing; } [part='viewport'][data-empty] .world { pointer-events: none; } :host([readonly]) [part='background'] { cursor: default; } :host([orientation='horizontal']:dir(rtl)) [part='viewport'] { transform: scaleX(-1); } :host([orientation='horizontal']:dir(rtl)) [part='node'] ::slotted(*), :host([orientation='horizontal']:dir(rtl)) [part='node'] [data-flow-canvas-default-card] { transform: scaleX(-1); } [part='node'][data-selected] { outline: var(--lr-size-2px) solid var(--lr-flow-canvas-node-selected-outline-color, var(--lr-color-brand)); outline-offset: var(--lr-size-2px); border-radius: var(--lr-radius); } [part='node']:where(:not([aria-disabled='true'])):hover { outline: var(--lr-size-1px) solid var(--lr-flow-canvas-node-hover-outline-color, var(--lr-color-border-strong)); outline-offset: var(--lr-size-2px); } [part='node']:where(:not([aria-disabled='true'])):active { outline: var(--lr-size-2px) solid var(--lr-flow-canvas-node-hover-outline-color, var(--lr-color-border-strong)); outline-offset: var(--lr-size-2px); } [part='node'][aria-disabled='true'] { cursor: default; opacity: var(--lr-flow-canvas-node-disabled-opacity, var(--lr-opacity-disabled)); } [part='edge'][aria-pressed='true'] { stroke-width: 2.5; } [part='edge']:hover, [part='edge-hit-area']:hover + [part='edge'] { stroke-width: 2.5; } [part='edge']:active, [part='edge-hit-area']:active + [part='edge'] { stroke-width: 3.5; } [part='node']:has([part='node-control']:focus-visible), [part='edge']:focus-visible { ${focusRing} } [part='connection-line'] { fill: none; stroke: var(--lr-flow-canvas-connection-line-color, var(--lr-color-brand)); stroke-width: 1.5; stroke-dasharray: 4 4; pointer-events: none; } [part='node'][data-connect-invalid] { outline: var(--lr-size-2px) solid var(--lr-flow-canvas-node-connect-invalid-outline-color, var(--lr-color-danger)); outline-offset: var(--lr-size-2px); } [part='node'][data-connect-target] { outline: var(--lr-size-2px) dashed var(--lr-flow-canvas-node-connect-target-outline-color, var(--lr-color-brand)); outline-offset: var(--lr-size-2px); } [part='viewport'][data-drop-active] { outline: var(--lr-size-2px) dashed var(--lr-flow-canvas-drop-active-outline-color, var(--lr-color-brand)); outline-offset: calc(-1 * var(--lr-size-2px)); } [part='viewport'][data-drop-active]:focus-visible { box-shadow: inset 0 0 0 var(--lr-focus-ring-width) var(--lr-focus-ring-color); } [part='edge'][data-running] { stroke-dasharray: 6 4; animation: var(--_lr-motion-animation, lr-flow-canvas-march var(--lr-flow-canvas-march-duration, var(--lr-duration-ambient)) linear infinite); } [part='edge'][data-running-static] { stroke-dasharray: 6 4; } @media (prefers-reduced-motion: reduce) { [part='edge'][data-running] { animation: none; } } @keyframes lr-flow-canvas-march { to { stroke-dashoffset: -20; } } `;export{styles};
+import{iconHitTarget,focusRing}from"../../../internal/interactive-control.styles.js";import{css}from"lit";const styles=css` :host { display: block; position: relative; inline-size: 100%; block-size: var(--lr-canvas-reserved-height, var(--lr-size-24rem)); min-inline-size: 0; min-block-size: 0; overflow: hidden; } [part='base'] { position: relative; inline-size: 100%; block-size: 100%; } [part='base'].source-mode { display: grid; grid-template-rows: minmax(0, 1fr) minmax(0, 40%); } [part='source-navigator'] { overflow: auto; min-block-size: 0; min-inline-size: 0; padding: var(--lr-space-xs); border-block-start: var(--lr-border-width-thin) solid var(--lr-color-border); } [part='source-controls'], [part='source-record'] { display: flex; flex-wrap: wrap; gap: var(--lr-space-xs); align-items: center; } [part='source-records'] { display: flex; flex-direction: column; gap: var(--lr-space-xs); } [part='source-navigator'] :where(button, input, select), [part='source-status'] button { font: inherit; color: inherit; background: var(--lr-color-surface); min-block-size: var(--lr-icon-button-size); min-inline-size: var(--lr-icon-button-size); border: var(--lr-border-width-thin) solid var(--lr-color-border); border-radius: var(--lr-radius); max-inline-size: 100%; } [part='source-navigator'] button, [part='source-status'] button { cursor: pointer; overflow-wrap: anywhere; transition: var(--lr-transition-interactive); } [part='source-navigator'] button:where(:hover), [part='source-status'] button:where(:hover) { background: var(--lr-color-neutral-fill-quiet); } [part='source-navigator'] button:where(:active), [part='source-status'] button:where(:active) { background: color-mix(in oklab, var(--lr-color-neutral-fill-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active)); } [part='source-navigator'] :where(button, input, select):where(:focus-visible), [part='source-status'] button:where(:focus-visible) { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: var(--lr-focus-ring-offset); } .source-scene-status { position: absolute; inset-block-start: 0; inset-inline-start: 0; background: var(--lr-color-surface); } [part='source-status'] { padding: var(--lr-space-xs); overflow-wrap: anywhere; } [part='viewport'] { position: relative; inline-size: 100%; block-size: 100%; overflow: hidden; outline: none; touch-action: none; cursor: grab; } [part='viewport']:focus-visible { outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color); outline-offset: calc(-1 * var(--lr-focus-ring-width)); } [part='background'], [part='edges'] { position: absolute; inset: 0; } [part='edges'] { inline-size: 100%; block-size: 100%; overflow: visible; pointer-events: none; } [part='empty'] { inline-size: 100%; block-size: 100%; pointer-events: none; } [part='overlay-rail'] { position: absolute; inset-inline: var(--lr-space-s); z-index: var(--lr-layer-content); display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--lr-space-s); pointer-events: none; } [part='overlay-rail'][data-edge='top'] { inset-block-start: var(--lr-space-s); } [part='overlay-rail'][data-edge='bottom'] { inset-block-end: var(--lr-space-s); } .overlay-group { display: flex; flex-wrap: wrap; max-inline-size: 100%; gap: var(--lr-space-s); pointer-events: auto; } .overlay-group[data-align='end'] { margin-inline-start: auto; } [part='node'] { content-visibility: auto; contain-intrinsic-size: auto var(--lr-flow-canvas-node-fallback-inline-size, calc(var(--lr-size-10rem) + var(--lr-size-1rem))) auto var(--lr-flow-canvas-node-fallback-block-size, var(--lr-size-4rem)); position: absolute; inset-block-start: 0; inset-inline-start: 0; will-change: transform; --_lr-positioning-strategy-default: fixed; --lr-flow-node-selected-outline-color: transparent; min-inline-size: var(--lr-size-1-5rem); min-block-size: var(--lr-size-1-5rem); } [part='node-control'] { ${iconHitTarget} } .portable-node-card { display: flex; align-items: stretch; gap: var(--lr-space-xs); min-inline-size: calc(var(--lr-size-10rem) + var(--lr-size-1rem)); padding: var(--lr-space-s); border: var(--lr-border-width-thin) solid var(--lr-color-border); border-radius: var(--lr-radius); background: var(--lr-color-surface); box-shadow: var(--lr-shadow-s); } .portable-node-content { display: flex; flex: 1 1 auto; min-inline-size: 0; flex-direction: column; overflow-wrap: anywhere; } .portable-handles { display: flex; flex-direction: column; justify-content: space-around; } .portable-handles > span { inline-size: var(--lr-size-0-5rem); block-size: var(--lr-size-0-5rem); border-radius: var(--lr-radius-pill); background: var(--lr-color-border-strong); } [part='node']:focus-within { z-index: var(--lr-layer-content); } [part='edge'] { fill: none; stroke: var(--_lr-flow-edge-color, var(--lr-flow-canvas-edge-neutral-color, var(--lr-color-border))); stroke-width: 1.5; pointer-events: stroke; cursor: pointer; } [part='edge-hit-area'] { fill: none; stroke: transparent; stroke-width: var(--lr-icon-button-size); pointer-events: stroke; cursor: pointer; } [data-tone='brand'] { --_lr-flow-edge-color: var(--lr-flow-canvas-edge-brand-color, var(--lr-color-brand)); } [data-tone='success'] { --_lr-flow-edge-color: var(--lr-flow-canvas-edge-success-color, var(--lr-color-success)); } [data-tone='warning'] { --_lr-flow-edge-color: var(--lr-flow-canvas-edge-warning-color, var(--lr-color-warning)); } [data-tone='danger'] { --_lr-flow-edge-color: var(--lr-flow-canvas-edge-danger-color, var(--lr-color-danger)); } [part='arrowhead'] { fill: var(--_lr-flow-edge-color, var(--lr-flow-canvas-edge-neutral-color, var(--lr-color-border))); } [part='stub'] { stroke: var(--lr-color-border); stroke-width: 1.5; stroke-dasharray: 3 3; opacity: 0.6; } [part='edge-label'] { fill: var(--lr-color-text); font: var(--lr-font-size-xs) / 1 var(--lr-font); text-anchor: middle; stroke: var(--lr-color-surface); stroke-width: var(--lr-size-3px); } .limits { display: grid; gap: var(--lr-space-2xs); position: absolute; inset-inline: var(--lr-space-s); inset-block-end: var(--lr-space-s); z-index: var(--lr-layer-content); max-inline-size: calc(100% - 2 * var(--lr-space-s)); } [part='input-limit'], [part='layout-limit'] { padding: var(--lr-space-2xs) var(--lr-space-s); border: var(--lr-border-width-thin) solid var(--lr-color-warning); border-radius: var(--lr-radius); background: var(--lr-color-surface); color: var(--lr-color-text); font-size: var(--lr-font-size-xs); overflow-wrap: anywhere; } .world { position: absolute; inset-block-start: 0; inset-inline-start: 0; inline-size: 100%; block-size: 100%; transform-origin: 0 0; will-change: transform; } [part='background'] { position: absolute; inset-block-start: -200%; inset-inline-start: -200%; inline-size: 500%; block-size: 500%; background-image: radial-gradient(circle, var(--lr-color-border-subtle) var(--lr-size-1px), transparent var(--lr-size-1px)); background-size: var(--lr-flow-canvas-grid-size, var(--_lr-flow-canvas-grid-size, var(--lr-size-0-5rem))) var(--lr-flow-canvas-grid-size, var(--_lr-flow-canvas-grid-size, var(--lr-size-0-5rem))); cursor: grab; } [part='viewport'][data-panning] [part='background'] { cursor: grabbing; } [part='viewport'][data-empty] .world { pointer-events: none; } :host([readonly]) [part='background'] { cursor: default; } :host([orientation='horizontal']:dir(rtl)) [part='viewport'] { transform: scaleX(-1); } :host([orientation='horizontal']:dir(rtl)) [part='node'] ::slotted(*), :host([orientation='horizontal']:dir(rtl)) [part='node'] [data-flow-canvas-default-card] { transform: scaleX(-1); } [part='node'][data-selected] { outline: var(--lr-size-2px) solid var(--lr-flow-canvas-node-selected-outline-color, var(--lr-color-brand)); outline-offset: var(--lr-size-2px); border-radius: var(--lr-radius); } [part='node']:where(:not([aria-disabled='true'])):hover { outline: var(--lr-size-1px) solid var(--lr-flow-canvas-node-hover-outline-color, var(--lr-color-border-strong)); outline-offset: var(--lr-size-2px); } [part='node']:where(:not([aria-disabled='true'])):active { outline: var(--lr-size-2px) solid var(--lr-flow-canvas-node-hover-outline-color, var(--lr-color-border-strong)); outline-offset: var(--lr-size-2px); } [part='node'][aria-disabled='true'] { cursor: default; opacity: var(--lr-flow-canvas-node-disabled-opacity, var(--lr-opacity-disabled)); } [part='edge'][aria-pressed='true'] { stroke-width: 2.5; } [part='edge']:hover, [part='edge-hit-area']:hover + [part='edge'] { stroke-width: 2.5; } [part='edge']:active, [part='edge-hit-area']:active + [part='edge'] { stroke-width: 3.5; } [part='node']:has([part='node-control']:focus-visible), [part='edge']:focus-visible { ${focusRing} } [part='connection-line'] { fill: none; stroke: var(--lr-flow-canvas-connection-line-color, var(--lr-color-brand)); stroke-width: 1.5; stroke-dasharray: 4 4; pointer-events: none; } [part='node'][data-connect-invalid] { outline: var(--lr-size-2px) solid var(--lr-flow-canvas-node-connect-invalid-outline-color, var(--lr-color-danger)); outline-offset: var(--lr-size-2px); } [part='node'][data-connect-target] { outline: var(--lr-size-2px) dashed var(--lr-flow-canvas-node-connect-target-outline-color, var(--lr-color-brand)); outline-offset: var(--lr-size-2px); } [part='viewport'][data-drop-active] { outline: var(--lr-size-2px) dashed var(--lr-flow-canvas-drop-active-outline-color, var(--lr-color-brand)); outline-offset: calc(-1 * var(--lr-size-2px)); } [part='viewport'][data-drop-active]:focus-visible { box-shadow: inset 0 0 0 var(--lr-focus-ring-width) var(--lr-focus-ring-color); } [part='edge'][data-running] { stroke-dasharray: 6 4; animation: var(--_lr-motion-animation, lr-flow-canvas-march var(--lr-flow-canvas-march-duration, var(--lr-duration-ambient)) linear infinite); } [part='edge'][data-running-static] { stroke-dasharray: 6 4; } @media (prefers-reduced-motion: reduce) { [part='edge'][data-running] { animation: none; } } @keyframes lr-flow-canvas-march { to { stroke-dashoffset: -20; } } `;export{styles};

package/dist/components/data/flow-canvas/flow-model.js

@@ -1 +1 @@
-import{isPlainRecord}from"../../../internal/object-guards.js";const FLOW_STATUSES=new Set(["pending","running","success","error","denied"]),FLOW_VARIANTS=new Set(["neutral","brand","success","warning","danger"]),MAX_FLOW_COLLECTION_ENTRIES=1e4,DEFAULT_FLOW_INPUTS=Object.freeze([Object.freeze({id:"in"})]),DEFAULT_FLOW_OUTPUTS=Object.freeze([Object.freeze({id:"out"})]),MAX_FLOW_COLLECTION_NODES=5e4,MAX_FLOW_COLLECTION_DEPTH=16;function snapshotFlowPosition(value){if(!isPlainRecord(value))return;const x=value.x,y=value.y;if(!(typeof x!="number"||typeof y!="number"||!Number.isFinite(x)||!Number.isFinite(y)))return Object.freeze({x,y})}function snapshotFlowData(value){const root={},seen=new WeakMap,work=[{source:value,target:root,depth:0}],owned=[root];seen.set(value,root);let remaining=MAX_FLOW_COLLECTION_NODES;for(;work.length>0&&remaining>0;){const{source,target,depth}=work.pop();let descriptors;try{descriptors=Object.getOwnPropertyDescriptors(source)}catch{continue}let retainedEntries=0;for(const[key,descriptor]of Object.entries(descriptors)){if(!descriptor.enumerable||!("value"in descriptor))continue;if(retainedEntries>=MAX_FLOW_COLLECTION_ENTRIES||remaining<=0)break;retainedEntries+=1,remaining-=1;const item=descriptor.value;if(Array.isArray(item)||isPlainRecord(item)){if(depth>=MAX_FLOW_COLLECTION_DEPTH)continue;let clone=seen.get(item);clone||(clone=Array.isArray(item)?[]:{},seen.set(item,clone),owned.push(clone),work.push({source:item,target:clone,depth:depth+1})),target[key]=clone}else target[key]=item}}for(let index=owned.length-1;index>=0;index--)Object.freeze(owned[index]);return root}function normalizeFlowStatus(value){return typeof value=="string"&&FLOW_STATUSES.has(value)?value:null}function normalizeFlowVariant(value){return typeof value=="string"&&FLOW_VARIANTS.has(value)?value:void 0}function snapshotFlowHandles(value){if(!Array.isArray(value))return;const result=[],seen=new Set;for(const handle of value.slice(0,MAX_FLOW_COLLECTION_ENTRIES))try{const id=handle?.id;if(typeof id!="string"||id.trim()===""||seen.has(id))continue;const label=handle?.label;result.push(Object.freeze({id,...typeof label=="string"?{label}:{}})),seen.add(id)}catch{}return Object.freeze(result)}function snapshotFlowNodes(value){if(!Array.isArray(value))return Object.freeze([]);const nodes=[],seen=new Set;for(const node of value.slice(0,MAX_FLOW_COLLECTION_ENTRIES))try{const id=node?.id;if(typeof id!="string"||id.trim().length===0||seen.has(id))continue;const data=isPlainRecord(node?.data)?snapshotFlowData(node.data):void 0,position=snapshotFlowPosition(node?.position),inputs=snapshotFlowHandles(node?.inputs),outputs=snapshotFlowHandles(node?.outputs),snapshot=Object.freeze({id,...typeof node?.type=="string"?{type:node.type}:{},...position?{position}:{},...data?{data}:{},...typeof node?.accessibleLabel=="string"?{accessibleLabel:node.accessibleLabel}:{},...inputs?{inputs}:{},...outputs?{outputs}:{},...typeof node?.disabled=="boolean"?{disabled:node.disabled}:{}});seen.add(id),nodes.push(snapshot)}catch{}return Object.freeze(nodes)}function snapshotFlowEdges(value){if(!Array.isArray(value))return Object.freeze([]);const edges=[],seen=new Set;for(const edge of value.slice(0,MAX_FLOW_COLLECTION_ENTRIES))try{const id=edge?.id;if(typeof id!="string"||id.trim().length===0||seen.has(id))continue;const tone=normalizeFlowVariant(edge?.tone),snapshot=Object.freeze({id,source:typeof edge?.source=="string"?edge.source:"",target:typeof edge?.target=="string"?edge.target:"",...typeof edge?.sourceHandle=="string"?{sourceHandle:edge.sourceHandle}:{},...typeof edge?.targetHandle=="string"?{targetHandle:edge.targetHandle}:{},...typeof edge?.label=="string"?{label:edge.label}:{},...tone?{tone}:{}});seen.add(id),edges.push(snapshot)}catch{}return Object.freeze(edges)}function snapshotFlowDecorations(value){if(!isPlainRecord(value))return Object.freeze({});const entries=[];let keys;try{keys=Object.keys(value).slice(0,MAX_FLOW_COLLECTION_ENTRIES)}catch{return Object.freeze({})}for(const id of keys){let descriptor;try{descriptor=Object.getOwnPropertyDescriptor(value,id)}catch{continue}if(!descriptor||!("value"in descriptor))continue;const candidate=descriptor.value;try{if(!isPlainRecord(candidate))continue;const status=normalizeFlowStatus(candidate.status);if(!status)continue;const progress=candidate.progress,durationMs=candidate.durationMs,detail=candidate.detail;entries.push([id,Object.freeze({status,...typeof progress=="number"?{progress}:{},...typeof durationMs=="number"?{durationMs}:{},...typeof detail=="string"?{detail}:{}})])}catch{}}return Object.freeze(Object.fromEntries(entries))}export{DEFAULT_FLOW_INPUTS,DEFAULT_FLOW_OUTPUTS,MAX_FLOW_COLLECTION_ENTRIES,normalizeFlowStatus,normalizeFlowVariant,snapshotFlowDecorations,snapshotFlowEdges,snapshotFlowHandles,snapshotFlowNodes};
+import{isPlainRecord}from"../../../internal/object-guards.js";const FLOW_STATUSES=new Set(["pending","running","success","error","denied"]),FLOW_VARIANTS=new Set(["neutral","brand","success","warning","danger"]),MAX_FLOW_COLLECTION_ENTRIES=1e4,DEFAULT_FLOW_INPUTS=Object.freeze([Object.freeze({id:"in"})]),DEFAULT_FLOW_OUTPUTS=Object.freeze([Object.freeze({id:"out"})]),MAX_FLOW_COLLECTION_NODES=5e4,MAX_FLOW_COLLECTION_DEPTH=16;function snapshotFlowPosition(value){if(!isPlainRecord(value))return;const x=value.x,y=value.y;if(!(typeof x!="number"||typeof y!="number"||!Number.isFinite(x)||!Number.isFinite(y)))return Object.freeze({x,y})}function snapshotFlowData(value,budget){const previous=budget.seen.get(value);if(previous)return previous;const root={},work=[{source:value,target:root,depth:0}],owned=[root];budget.seen.set(value,root);const truncate=()=>{budget.truncated||(budget.truncated=!0,budget.onTruncate?.())};try{for(;work.length>0&&!(budget.remaining<=0&&budget.truncated);){const{source,target,depth}=work.pop();let keys,sourceIsArray;try{keys=Reflect.ownKeys(source),sourceIsArray=Array.isArray(source)}catch{continue}let inspected=0;for(const key of keys){if(sourceIsArray&&key==="length")continue;if(inspected>=MAX_FLOW_COLLECTION_ENTRIES||budget.remaining<=0){truncate();break}if(inspected++,budget.remaining--,typeof key!="string")continue;let descriptor;try{descriptor=Object.getOwnPropertyDescriptor(source,key)}catch{continue}if(!descriptor?.enumerable||!("value"in descriptor))continue;const item=descriptor.value;let clone=item,itemIsArray,structured;try{itemIsArray=Array.isArray(item),structured=itemIsArray||isPlainRecord(item)}catch{continue}if(structured){const sourceItem=item;if(clone=budget.seen.get(sourceItem),!clone){if(depth>=MAX_FLOW_COLLECTION_DEPTH){truncate();continue}const child=itemIsArray?[]:{};clone=child,budget.seen.set(sourceItem,child),owned.push(child),work.push({source:sourceItem,target:child,depth:depth+1})}}Object.defineProperty(target,key,{value:clone,enumerable:!0,configurable:!0,writable:!0})}}}finally{for(let index=owned.length-1;index>=0;index--)Object.freeze(owned[index])}return root}function normalizeFlowStatus(value){return typeof value=="string"&&FLOW_STATUSES.has(value)?value:null}function normalizeFlowVariant(value){return typeof value=="string"&&FLOW_VARIANTS.has(value)?value:void 0}function snapshotFlowHandles(value){if(!Array.isArray(value))return;const result=[],seen=new Set;for(const handle of value.slice(0,MAX_FLOW_COLLECTION_ENTRIES))try{const id=handle?.id;if(typeof id!="string"||id.trim()===""||seen.has(id))continue;const label=handle?.label;result.push(Object.freeze({id,...typeof label=="string"?{label}:{}})),seen.add(id)}catch{}return Object.freeze(result)}function snapshotFlowNodes(value,onTruncate){if(!Array.isArray(value))return Object.freeze([]);value.length>MAX_FLOW_COLLECTION_ENTRIES&&onTruncate?.();const budget={remaining:MAX_FLOW_COLLECTION_NODES,truncated:!1,seen:new WeakMap,onTruncate},nodes=[],seen=new Set;for(const node of value.slice(0,MAX_FLOW_COLLECTION_ENTRIES))try{const id=node?.id;if(typeof id!="string"||id.trim().length===0||seen.has(id))continue;const data=isPlainRecord(node?.data)?snapshotFlowData(node.data,budget):void 0,position=snapshotFlowPosition(node?.position),inputs=snapshotFlowHandles(node?.inputs),outputs=snapshotFlowHandles(node?.outputs),snapshot=Object.freeze({id,...typeof node?.type=="string"?{type:node.type}:{},...position?{position}:{},...data?{data}:{},...typeof node?.accessibleLabel=="string"?{accessibleLabel:node.accessibleLabel}:{},...inputs?{inputs}:{},...outputs?{outputs}:{},...typeof node?.disabled=="boolean"?{disabled:node.disabled}:{}});seen.add(id),nodes.push(snapshot)}catch{}return Object.freeze(nodes)}function snapshotFlowEdges(value,onTruncate){if(!Array.isArray(value))return Object.freeze([]);value.length>MAX_FLOW_COLLECTION_ENTRIES&&onTruncate?.();const edges=[],seen=new Set;for(const edge of value.slice(0,MAX_FLOW_COLLECTION_ENTRIES))try{const id=edge?.id;if(typeof id!="string"||id.trim().length===0||seen.has(id))continue;const tone=normalizeFlowVariant(edge?.tone),snapshot=Object.freeze({id,source:typeof edge?.source=="string"?edge.source:"",target:typeof edge?.target=="string"?edge.target:"",...typeof edge?.sourceHandle=="string"?{sourceHandle:edge.sourceHandle}:{},...typeof edge?.targetHandle=="string"?{targetHandle:edge.targetHandle}:{},...typeof edge?.label=="string"?{label:edge.label}:{},...tone?{tone}:{}});seen.add(id),edges.push(snapshot)}catch{}return Object.freeze(edges)}function snapshotFlowDecorations(value){if(!isPlainRecord(value))return Object.freeze({});const entries=[];let keys;try{keys=Reflect.ownKeys(value).slice(0,MAX_FLOW_COLLECTION_ENTRIES)}catch{return Object.freeze({})}for(const id of keys){if(typeof id!="string")continue;let descriptor;try{descriptor=Object.getOwnPropertyDescriptor(value,id)}catch{continue}if(!descriptor?.enumerable||!("value"in descriptor))continue;const candidate=descriptor.value;try{if(!isPlainRecord(candidate))continue;const status=normalizeFlowStatus(candidate.status);if(!status)continue;const progress=candidate.progress,durationMs=candidate.durationMs,detail=candidate.detail;entries.push([id,Object.freeze({status,...typeof progress=="number"?{progress}:{},...typeof durationMs=="number"?{durationMs}:{},...typeof detail=="string"?{detail}:{}})])}catch{}}return Object.freeze(Object.fromEntries(entries))}export{DEFAULT_FLOW_INPUTS,DEFAULT_FLOW_OUTPUTS,MAX_FLOW_COLLECTION_ENTRIES,normalizeFlowStatus,normalizeFlowVariant,snapshotFlowDecorations,snapshotFlowEdges,snapshotFlowHandles,snapshotFlowNodes};

package/dist/components/data/flow-canvas/flow-source.js

@@ -0,0 +1 @@
+import{SceneReader}from"../../../internal/graph-scene-controller.js";import{sourceCount}from"../../../internal/source-request-controller.js";function flowSourceSummary(raw,reader){return Object.freeze({nodes:sourceCount(reader.field(raw,"nodes")),edges:sourceCount(reader.field(raw,"edges"))})}function flowSourceRows(raw,limit,reader){const rows=reader.array(raw,limit);return Object.freeze(Array.from({length:rows.length},(_,index)=>{const rawRow=rows.at(index),key=reader.key(reader.field(rawRow,"key")),order=sourceCount(reader.field(rawRow,"order")),rawValue=reader.field(rawRow,"value"),kind=reader.field(rawValue,"kind"),value=reader.field(rawValue,"value"),id=reader.text(reader.field(value,"id"),!0);if(!id.trim()||key!==`${kind}:${id}`)throw new TypeError("Invalid flow record identity");if(kind==="node"){const data=reader.field(value,"data"),label=data===void 0?void 0:reader.field(data,"label"),disabled=reader.flag(value,"disabled"),node=Object.freeze({id,...reader.texts(value,["accessibleLabel","type"]),...label===void 0?{}:{data:Object.freeze({label:reader.text(label)})},...disabled===void 0?{}:{disabled}});return Object.freeze({key,order,value:Object.freeze({kind,value:node})})}if(kind!=="edge")throw new TypeError("Invalid flow record kind");const source=reader.text(reader.field(value,"source"),!0),target=reader.text(reader.field(value,"target"),!0);if(!source.trim()||!target.trim())throw new TypeError("Invalid flow endpoint");return Object.freeze({key,order,value:Object.freeze({kind,value:Object.freeze({id,source,target,...reader.texts(value,["label"])})})})}))}function sameFlowBounds(left,right){return left.x===right.x&&left.y===right.y&&left.width===right.width&&left.height===right.height}function flowSourceOverview(raw,world,population,current){const reader=new SceneReader(current),bounds=reader.bounds(reader.field(raw,"bounds"));if(!bounds||!sameFlowBounds(bounds,world))throw new TypeError("Invalid flow overview extent");const entries=reader.array(reader.field(raw,"bins"),1024);let total=0;const bins=Array.from({length:entries.length},(_,index)=>{const entry=entries.at(index),area=reader.bounds(reader.field(entry,"bounds")),count=sourceCount(reader.field(entry,"count"));if(total+=count,!Number.isSafeInteger(total)||!area||area.x<bounds.x||area.y<bounds.y||area.x+area.width>bounds.x+bounds.width||area.y+area.height>bounds.y+bounds.height||bounds.width>0&&area.width===0||bounds.height>0&&area.height===0)throw new RangeError("Invalid flow overview bin");return Object.freeze({bounds:area,count})});if(total!==population)throw new TypeError("Invalid flow overview population");for(let i=0;i<bins.length;i++)for(let j=0;j<i;j++){const a=bins[i].bounds,b=bins[j].bounds;if((bounds.width===0||a.x<b.x+b.width&&b.x<a.x+a.width)&&(bounds.height===0||a.y<b.y+b.height&&b.y<a.y+a.height))throw new TypeError("Overlapping flow overview bins")}return reader.check(),Object.freeze({bounds,bins:Object.freeze(bins)})}export{flowSourceOverview,flowSourceRows,flowSourceSummary,sameFlowBounds};