@aceshooting/lyra-ui 9.1.0 → 10.0.1

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

@@ -73,6 +73,8 @@ import{css}from"lit";const styles=css`
     inset-block-start: 0;
     inset-inline-start: 0;
     will-change: transform;
+    min-inline-size: var(--lr-size-1-5rem);
+    min-block-size: var(--lr-size-1-5rem);
   }
   [part='node-control'] {
     min-inline-size: var(--lr-icon-button-size);
@@ -207,10 +209,6 @@ import{css}from"lit";const styles=css`
   :host([orientation='horizontal']:dir(rtl)) [part='node'] ::slotted(*) {
     transform: scaleX(-1);
   }
-  /* MUST stay before :hover/:active below: all three resolve to the same specificity (0,2,0),
-     so whichever is declared last always wins regardless of which states are actually active on
-     the element. Declaring the static selected ring first lets the pointer-feedback rules below
-     still read on top of it when a selected node is hovered or press-dragged. */
   [part='node'][data-selected] {
     outline: var(--lr-size-2px) solid
       var(--lr-flow-canvas-node-selected-outline-color, var(--lr-color-brand));
@@ -222,23 +220,20 @@ import{css}from"lit";const styles=css`
       var(--lr-flow-canvas-node-hover-outline-color, var(--lr-color-border-strong));
     outline-offset: var(--lr-size-2px);
   }
-  /* A node is pressed for two different gestures -- a click that selects it and a pointerdown that
-     starts a drag -- and both need to read immediately. The pointer-feedback colour is shared with
-     the hover rule above (one knob for "the pointer is on this node"); only the weight steps up, so
-     the pressed ring is unmistakably heavier than the hovered one without introducing a second
-     colour that would then have to stay in sync with it. */
   [part='node']: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='edge']:hover {
+  [part='edge'][aria-pressed='true'] {
+    stroke-width: 2.5;
+  }
+  [part='edge']:hover,
+  [part='edge-hit-area']:hover + [part='edge'] {
     stroke-width: 2.5;
   }
-  /* Stroke weight is the only channel an edge has: its stroke colour is the tone the consumer
-     assigned it (see the [data-tone] rules above), so tinting it on press would read as a tone
-     change rather than as feedback. 3.5 also clears the 2.5 an already-selected edge carries. */
-  [part='edge']:active {
+  [part='edge']:active,
+  [part='edge-hit-area']:active + [part='edge'] {
     stroke-width: 3.5;
   }
   [part='node']:has([part='node-control']:focus-visible),
@@ -246,9 +241,6 @@ import{css}from"lit";const styles=css`
     outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);
     outline-offset: var(--lr-focus-ring-offset);
   }
-  [part='edge'][aria-pressed='true'] {
-    stroke-width: 2.5;
-  }
   [part='connection-line'] {
     fill: none;
     stroke: var(--lr-color-brand);
@@ -268,6 +260,9 @@ import{css}from"lit";const styles=css`
     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: lr-flow-canvas-march var(--lr-flow-canvas-march-duration, var(--lr-duration-ambient)) linear infinite;
@@ -275,8 +270,6 @@ import{css}from"lit";const styles=css`
   [part='edge'][data-running-static] {
     stroke-dasharray: 6 4;
   }
-  /* The JS gate only evaluates the preference at render time; this CSS branch also covers a
-     preference change while an already-rendered edge is still marching. */
   @media (prefers-reduced-motion: reduce) {
     [part='edge'][data-running] {
       animation: none;

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

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing,svg}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{FlowCanvasCompanionController}from"../flow-canvas/flow-companion-controller.js";import{styles}from"./flow-controls.styles.js";import{LYRA_DEFAULT_flowControlsLabel,LYRA_DEFAULT_flowLockCanvas,LYRA_DEFAULT_zoomIn,LYRA_DEFAULT_zoomOut,LYRA_DEFAULT_zoomToFit}from"../../../internal/default-strings.generated.js";function isFlowCanvasLike(element){const candidate=element;return typeof candidate.registerCompanion=="function"&&typeof candidate.zoomIn=="function"&&typeof candidate.zoomOut=="function"&&typeof candidate.fit=="function"&&typeof candidate.locked=="boolean"}const GLYPH_VIEW_BOX="0 0 24 24",GLYPH_STROKE_WIDTH="1.75";function glyphSvg(inner){return svg`<svg
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing,svg}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel}from"../../../internal/a11y.js";import{FlowCanvasCompanionController}from"../flow-canvas/flow-companion-controller.js";import{styles}from"./flow-controls.styles.js";import{LYRA_DEFAULT_flowControlsLabel,LYRA_DEFAULT_flowLockCanvas,LYRA_DEFAULT_zoomIn,LYRA_DEFAULT_zoomOut,LYRA_DEFAULT_zoomToFit}from"../../../internal/default-strings.generated.js";function isFlowCanvasLike(element){const candidate=element;return typeof candidate.registerCompanion=="function"&&typeof candidate.zoomIn=="function"&&typeof candidate.zoomOut=="function"&&typeof candidate.fit=="function"&&typeof candidate.locked=="boolean"}const GLYPH_VIEW_BOX="0 0 24 24",GLYPH_STROKE_WIDTH="1.75";function glyphSvg(inner){return svg`<svg
     width="1em"
     height="1em"
     viewBox=${GLYPH_VIEW_BOX}
@@ -17,7 +17,7 @@ var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3
   `),lockClosedGlyph=()=>glyphSvg(svg`<rect x="4" y="11" width="16" height="9" rx="2"></rect><path d="M8 11V7a4 4 0 0 1 8 0v4"></path>`),lockOpenGlyph=()=>glyphSvg(svg`<rect x="4" y="11" width="16" height="9" rx="2"></rect><path d="M8 11V7a4 4 0 0 1 7.4-2"></path>`);class LyraFlowControls extends LyraElement{constructor(){super(...arguments),this.for="",this._orientation="vertical",this.hideLock=!1,this.frame="card",this.snapshot=null,this.locked=!1,this.companionController=new FlowCanvasCompanionController(this,isFlowCanvasLike,next=>this.attachCanvas(next)),this.toggleLock=()=>{if(!this.canvasEl)return;const locked=!this.canvasEl.locked;this.canvasEl.locked=locked,this.locked=locked}}static{this.defaultStrings={...super.defaultStrings,flowControlsLabel:LYRA_DEFAULT_flowControlsLabel,flowLockCanvas:LYRA_DEFAULT_flowLockCanvas,zoomIn:LYRA_DEFAULT_zoomIn,zoomOut:LYRA_DEFAULT_zoomOut,zoomToFit:LYRA_DEFAULT_zoomToFit}}static{this.styles=[LyraElement.styles,styles]}get orientation(){return this._orientation}set orientation(value){const previous=this._orientation,next=value==="horizontal"?"horizontal":"vertical";this._orientation=next,(next!==previous||value!==next)&&this.requestUpdate("orientation",previous)}connectedCallback(){super.connectedCallback(),this.companionController.connect()}disconnectedCallback(){super.disconnectedCallback(),this.companionController.disconnect()}adoptedCallback(){super.adoptedCallback(),this.companionController.adopt()}willUpdate(changed){super.willUpdate(changed),this.hasUpdated&&changed.has("for")&&this.companionController.targetIdChanged()}attachCanvas(canvas){this.unsubscribe?.(),this.unsubscribe=void 0,this.snapshot=null,this.locked=!1,this.canvasEl=canvas??void 0,canvas&&(this.locked=canvas.locked,this.unsubscribe=canvas.registerCompanion(snapshot=>{!this.isConnected||this.canvasEl!==canvas||(this.snapshot=snapshot,this.locked=snapshot.locked)}))}render(){const disabled=!this.canvasEl,viewport=this.snapshot?.viewport,atMin=viewport?viewport.zoom<=viewport.minZoom:!1,atMax=viewport?viewport.zoom>=viewport.maxZoom:!1;return html`<div
       part="base"
       role="group"
-      aria-label=${this.getAttribute("aria-label")||this.localize("flowControlsLabel")}
+      aria-label=${hostAriaLabel(this)??this.localize("flowControlsLabel")}
     >
       <button
         part="zoom-in"

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

@@ -16,26 +16,12 @@ import{css}from"lit";const styles=css`
     border: var(--lr-border-width-thin) solid var(--lr-color-border);
     border-radius: var(--lr-radius);
     background: var(--lr-color-surface);
-    /* Overlay step: this cluster's job is to float over a flow canvas as a toolbar, which is why the
-       plain escape below strips the whole surface treatment when it is embedded in real chrome. */
     box-shadow: var(--lr-shadow-m);
   }
   :host([orientation='vertical']) [part='base'] {
     flex-direction: column;
     flex-wrap: nowrap;
   }
-  /* Chrome-less escape, mirroring the shared LyraFrame vocabulary's frame="plain" (and lr-callout's [inline]): the
-     cluster is often placed directly inside a host toolbar or panel that already draws its own
-     border/background, where this floating-surface chrome doubles the frame. The box-shadow goes
-     with the rest of the box decoration, exactly as lr-flow-run-status's plain does -- a lift
-     shadow with no surface under it reads as a stray smudge. Only the decoration goes: the flex
-     layout, the gap, every button's --lr-icon-button-size hit-area floor, and their hover/focus
-     affordances all stay.
-
-     MUST stay after :host([orientation='vertical']) [part='base']: both are :host([x])
-     [part='base'], i.e. equal specificity, so source order alone decides. Only flex-direction vs.
-     box decoration is set today, so nothing collides -- keeping this last preserves plain as the
-     stronger statement ("no chrome at all") if either rule grows. */
   :host([frame='plain']) [part='base'] {
     padding: 0;
     border: 0;
@@ -43,11 +29,6 @@ import{css}from"lit";const styles=css`
     background: transparent;
     box-shadow: none;
   }
-  /* Enumerated by part (rather than the previous bare "[part='base'] button"
-     tag selector) so each control resolves to the shared minimum tappable
-     size (--lr-icon-button-size) directly off its own [part='...'] --
-     the floating toolbar already has the room, this doesn't change the
-     rendered box, just how it's declared. */
   [part='zoom-in'],
   [part='zoom-out'],
   [part='fit'],
@@ -64,18 +45,9 @@ import{css}from"lit";const styles=css`
     color: var(--lr-color-text);
     cursor: pointer;
   }
-  /* :where() zeroes the wrapped selectors' specificity contribution, leaving only :hover itself
-     -- (0,1,0) total, functionally identical selection to \`[part='base'] button:hover:not(:disabled)\`
-     ((0,3,1)) but now losing (on the pseudo-element tiebreak) to a consumer's own
-     \`::part(zoom-in):hover\` override ((0,1,1)) without that consumer needing !important. Mirrors
-     lr-attachment-trigger's identical fix for the same over-specific shape. */
   :where([part='base'] button):hover:where(:not(:disabled)) {
     background: var(--lr-color-surface-hover, var(--lr-color-border));
   }
-  /* Same shape as the hover rule, so it inherits the same (0,1,0) specificity and a consumer's
-     ::part(zoom-in):active override still wins. The fill is the hovered one carried further toward
-     --lr-color-mix-partner (the text colour), which moves in whichever direction the surface needs
-     rather than always lightening. */
   :where([part='base'] button):active:where(:not(:disabled)) {
     background: color-mix(
       in oklab,
@@ -94,14 +66,6 @@ import{css}from"lit";const styles=css`
   [part='lock'][aria-pressed='true'] {
     color: var(--lr-flow-controls-lock-active-color, var(--lr-color-brand));
   }
-  /* The default slot's own contract: a consumer's button joins the cluster and is "styled by the
-     same group". None of the rules above can deliver that -- every one of them is either a
-     [part='...'] selector (a light-DOM button carries no part attribute) or a descendant selector
-     inside a shadow stylesheet, and per CSS Scoping neither form ever matches slotted content
-     wherever it visually renders. ::slotted() is the only selector that crosses that boundary, and
-     it takes a COMPOUND argument, so each state goes inside the parentheses rather than after
-     them. It matches only the slotted element itself, never its descendants, which is exactly the
-     scope wanted here: the button's box, not the consumer's own icon markup inside it. */
   ::slotted(button) {
     display: inline-flex;
     align-items: center;
@@ -119,6 +83,9 @@ import{css}from"lit";const styles=css`
     overflow-wrap: anywhere;
     cursor: pointer;
   }
+  ::slotted([hidden]:not([hidden='until-found' i])) {
+    display: none;
+  }
   ::slotted(button:hover:not(:disabled)) {
     background: var(--lr-color-surface-hover, var(--lr-color-border));
   }

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

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,svg,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{nextId,srOnly}from"../../../internal/a11y.js";import{resolveCssLength}from"../../../internal/css-length.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{FlowCanvasCompanionController}from"../flow-canvas/flow-companion-controller.js";import{styles}from"./flow-minimap.styles.js";import{LYRA_DEFAULT_flowMinimapInstructions,LYRA_DEFAULT_flowMinimapLabel,LYRA_DEFAULT_flowMinimapViewport,LYRA_DEFAULT_flowMinimapViewportChanged}from"../../../internal/default-strings.generated.js";function isFlowCanvasLike(element){const candidate=element;return typeof candidate.registerCompanion=="function"&&typeof candidate.setViewport=="function"&&typeof candidate.zoomIn=="function"&&typeof candidate.zoomOut=="function"&&typeof candidate.fit=="function"&&typeof candidate.locked=="boolean"}const DEFAULT_VIEWPORT_MIN_SIZE_PX=40;class LyraFlowMinimap extends LyraElement{constructor(){super(...arguments),this.for="",this.label="",this.snapshot=null,this.liveText="",this.justDraggedViewport=!1,this.announceNextSnapshot=!1,this.viewportMinSizePx=DEFAULT_VIEWPORT_MIN_SIZE_PX,this.baseBorderPx=0,this.instructionsId=nextId("flow-minimap-instructions"),this.companionController=new FlowCanvasCompanionController(this,isFlowCanvasLike,next=>this.attachCanvas(next)),this.onMapClick=e=>{if(this.justDraggedViewport){this.justDraggedViewport=!1;return}if(!this.canvasEl||!this.snapshot||this.canvasEl.locked)return;const point=this.clientToContentPoint(e.currentTarget,e.clientX,e.clientY),{zoom,width,height}=this.snapshot.viewport;this.announceNextSnapshot=!0,this.canvasEl.setViewport({x:width/2-point.x*zoom,y:height/2-point.y*zoom,zoom})},this.onMapWheel=e=>{!this.canvasEl||this.canvasEl.locked||(e.preventDefault(),this.announceNextSnapshot=!0,e.deltaY<0?this.canvasEl.zoomIn():this.canvasEl.zoomOut())},this.onViewportPointerDown=e=>{const dragEventWindow=this.ownerDocument.defaultView;!this.canvasEl||!this.snapshot||!dragEventWindow||this.canvasEl.locked||(e.stopPropagation(),this.detachViewportDragListeners(),this.justDraggedViewport=!1,this.dragState={pointerId:e.pointerId,startClientX:e.clientX,startClientY:e.clientY,startViewport:{...this.snapshot.viewport},moved:!1},e.target.setPointerCapture?.(e.pointerId),this.dragEventWindow=dragEventWindow,dragEventWindow.addEventListener("pointermove",this.onViewportPointerMove),dragEventWindow.addEventListener("pointerup",this.onViewportPointerUp),dragEventWindow.addEventListener("pointercancel",this.onViewportPointerUp),dragEventWindow.addEventListener("lostpointercapture",this.onViewportPointerUp))},this.onViewportPointerMove=e=>{const drag=this.dragState;if(!drag||e.pointerId!==drag.pointerId)return;if(!this.canvasEl||this.canvasEl.locked){this.cancelViewportDrag();return}const ctm=this.renderRoot.querySelector('[part="map"]')?.getScreenCTM();if(!ctm)return;const scale=ctm.a||1,dxContent=(e.clientX-drag.startClientX)/scale,dyContent=(e.clientY-drag.startClientY)/scale;dxContent===0&&dyContent===0||(drag.moved=!0,drag.latestViewport={x:drag.startViewport.x-dxContent*drag.startViewport.zoom,y:drag.startViewport.y-dyContent*drag.startViewport.zoom,zoom:drag.startViewport.zoom},this.canvasEl.setViewport(drag.latestViewport))},this.onViewportPointerUp=e=>{const drag=this.dragState;!drag||e.pointerId!==drag.pointerId||(this.justDraggedViewport=e.type==="pointerup"&&drag.moved,this.justDraggedViewport&&drag.latestViewport&&!this.canvasEl?.locked&&this.announceViewport(drag.latestViewport),this.dragState=void 0,this.detachViewportDragListeners())},this.onViewportKeyDown=e=>{if(!this.canvasEl||!this.snapshot||this.canvasEl.locked)return;if(e.key==="+"||e.key==="="){e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.zoomIn();return}if(e.key==="-"||e.key==="_"){e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.zoomOut();return}if(e.key==="Enter"||e.key==="Home"){e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.fit();return}const{x,y,zoom,width,height}=this.snapshot.viewport,stepX=width*.1,stepY=height*.1;e.key==="ArrowRight"?(e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.setViewport({x:x-stepX,y,zoom})):e.key==="ArrowLeft"?(e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.setViewport({x:x+stepX,y,zoom})):e.key==="ArrowDown"?(e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.setViewport({x,y:y-stepY,zoom})):e.key==="ArrowUp"&&(e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.setViewport({x,y:y+stepY,zoom}))}}static{this.defaultStrings={...super.defaultStrings,flowMinimapInstructions:LYRA_DEFAULT_flowMinimapInstructions,flowMinimapLabel:LYRA_DEFAULT_flowMinimapLabel,flowMinimapViewport:LYRA_DEFAULT_flowMinimapViewport,flowMinimapViewportChanged:LYRA_DEFAULT_flowMinimapViewportChanged}}static{this.styles=[LyraElement.styles,styles,srOnly]}connectedCallback(){super.connectedCallback(),this.syncAnnouncementSink(),this.companionController.connect()}refreshViewportMetrics(){const view=this.ownerDocument?.defaultView;if(!view||!this.isConnected)return;const computed=view.getComputedStyle(this),minSize=resolveCssLength(computed.getPropertyValue("--lr-flow-minimap-viewport-min-size").trim()||computed.getPropertyValue("--lr-icon-button-size").trim(),{host:this});this.viewportMinSizePx=minSize!==void 0&&Number.isFinite(minSize)&&minSize>=0?minSize:DEFAULT_VIEWPORT_MIN_SIZE_PX;const border=resolveCssLength(computed.getPropertyValue("--lr-border-width-thin").trim(),{host:this});this.baseBorderPx=border!==void 0&&Number.isFinite(border)&&border>=0?border:0}disconnectedCallback(){super.disconnectedCallback(),this.releaseAnnouncementSink(),this.announceNextSnapshot=!1,this.liveText="",this.companionController.disconnect()}adoptedCallback(){super.adoptedCallback(),this.syncAnnouncementSink(),this.companionController.adopt()}releaseAnnouncementSink(){this.announcementSink?.release(),this.announcementSink=void 0}syncAnnouncementSink(){if(!this.isConnected){this.releaseAnnouncementSink();return}this.announcementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseAnnouncementSink(),this.announcementSink=acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}))}announceViewport(viewport){const number=getNumberFormat(this.effectiveLocale,{maximumFractionDigits:0}),percent=getNumberFormat(this.effectiveLocale,{style:"percent",maximumFractionDigits:1}),text=this.localize("flowMinimapViewportChanged",void 0,{x:number.format(viewport.x),y:number.format(viewport.y),zoom:percent.format(viewport.zoom)});this.liveText=text,this.announcementSink?.announce(text)}willUpdate(changed){super.willUpdate(changed),this.refreshViewportMetrics(),this.hasUpdated&&changed.has("for")&&this.companionController.targetIdChanged()}attachCanvas(canvas){this.cancelViewportDrag(),this.unsubscribe?.(),this.unsubscribe=void 0,this.snapshot=null,this.canvasEl=canvas??void 0,canvas&&(this.unsubscribe=canvas.registerCompanion(snapshot=>{!this.isConnected||this.canvasEl!==canvas||(this.snapshot=snapshot,snapshot.locked&&this.cancelViewportDrag(),this.announceNextSnapshot&&(this.announceNextSnapshot=!1,this.announceViewport(snapshot.viewport)))}))}cancelViewportDrag(){this.dragState=void 0,this.justDraggedViewport=!1,this.announceNextSnapshot=!1,this.detachViewportDragListeners()}contentBounds(){const nodes=this.snapshot?.nodes??[];if(nodes.length===0)return{minX:0,minY:0,maxX:1,maxY:1};let minX=1/0,minY=1/0,maxX=-1/0,maxY=-1/0;for(const n of nodes)minX=Math.min(minX,n.x),minY=Math.min(minY,n.y),maxX=Math.max(maxX,n.x+n.width),maxY=Math.max(maxY,n.y+n.height);return{minX,minY,maxX,maxY}}mapSizePx(){const inset=2*this.baseBorderPx;return{width:Math.max(0,this.clientWidth-inset),height:Math.max(0,this.clientHeight-inset)}}viewportRectContent(viewBoxWidth,viewBoxHeight,minimumPhysicalSize=this.viewportMinSizePx){const vp=this.snapshot?.viewport;if(!vp||vp.zoom===0)return{x:0,y:0,width:0,height:0};const x=-vp.x/vp.zoom,y=-vp.y/vp.zoom,width=vp.width/vp.zoom,height=vp.height/vp.zoom,map=this.mapSizePx(),scale=map.width>0&&map.height>0&&viewBoxWidth>0&&viewBoxHeight>0?Math.min(map.width/viewBoxWidth,map.height/viewBoxHeight):0,floor=scale>0?minimumPhysicalSize/scale:0;if(!Number.isFinite(floor)||floor<=0)return{x,y,width,height};const flooredWidth=Math.max(width,floor),flooredHeight=Math.max(height,floor);return{x:x-(flooredWidth-width)/2,y:y-(flooredHeight-height)/2,width:flooredWidth,height:flooredHeight}}clientToContentPoint(svgEl,clientX,clientY){const ctm=svgEl.getScreenCTM();if(!ctm)return{x:0,y:0};const pt=svgEl.createSVGPoint();pt.x=clientX,pt.y=clientY;const transformed=pt.matrixTransform(ctm.inverse());return{x:transformed.x,y:transformed.y}}detachViewportDragListeners(){const dragEventWindow=this.dragEventWindow;dragEventWindow&&(dragEventWindow.removeEventListener("pointermove",this.onViewportPointerMove),dragEventWindow.removeEventListener("pointerup",this.onViewportPointerUp),dragEventWindow.removeEventListener("pointercancel",this.onViewportPointerUp),dragEventWindow.removeEventListener("lostpointercapture",this.onViewportPointerUp),this.dragEventWindow=void 0)}renderNodes(){return svg`${(this.snapshot?.nodes??[]).map(n=>svg`<rect part="node" data-status=${n.status??nothing} x=${n.x} y=${n.y} width=${n.width} height=${n.height} rx="2"></rect>`)}`}render(){const label=this.getAttribute("aria-label")||this.label||this.localize("flowMinimapLabel");if(!this.canvasEl||!this.snapshot)return html`<div part="base" aria-hidden="true"></div>`;const bounds=this.contentBounds(),padding=20,vbX=bounds.minX-padding,vbY=bounds.minY-padding,vbW=Math.max(1,bounds.maxX-bounds.minX+padding*2),vbH=Math.max(1,bounds.maxY-bounds.minY+padding*2),viewportRect=this.viewportRectContent(vbW,vbH,0),viewportHitRect=this.viewportRectContent(vbW,vbH),locked=this.snapshot.locked||this.canvasEl.locked;return html`<div
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,svg,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel,nextId,srOnly}from"../../../internal/a11y.js";import{resolveCssLength}from"../../../internal/css-length.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{acquireAnnouncementSink}from"../../../internal/announcer.js";import{FlowCanvasCompanionController}from"../flow-canvas/flow-companion-controller.js";import{styles}from"./flow-minimap.styles.js";import{LYRA_DEFAULT_flowMinimapInstructions,LYRA_DEFAULT_flowMinimapLabel,LYRA_DEFAULT_flowMinimapViewport,LYRA_DEFAULT_flowMinimapViewportChanged}from"../../../internal/default-strings.generated.js";function isFlowCanvasLike(element){const candidate=element;return typeof candidate.registerCompanion=="function"&&typeof candidate.setViewport=="function"&&typeof candidate.zoomIn=="function"&&typeof candidate.zoomOut=="function"&&typeof candidate.fit=="function"&&typeof candidate.locked=="boolean"}const DEFAULT_VIEWPORT_MIN_SIZE_PX=40;class LyraFlowMinimap extends LyraElement{constructor(){super(...arguments),this.for="",this.label="",this.snapshot=null,this.liveText="",this.justDraggedViewport=!1,this.announceNextSnapshot=!1,this.viewportMinSizePx=DEFAULT_VIEWPORT_MIN_SIZE_PX,this.baseBorderPx=0,this.instructionsId=nextId("flow-minimap-instructions"),this.companionController=new FlowCanvasCompanionController(this,isFlowCanvasLike,next=>this.attachCanvas(next)),this.onMapClick=e=>{if(this.justDraggedViewport){this.justDraggedViewport=!1;return}if(!this.canvasEl||!this.snapshot||this.canvasEl.locked)return;const point=this.clientToContentPoint(e.currentTarget,e.clientX,e.clientY),{zoom,width,height}=this.snapshot.viewport;this.announceNextSnapshot=!0,this.canvasEl.setViewport({x:width/2-point.x*zoom,y:height/2-point.y*zoom,zoom})},this.onMapWheel=e=>{!this.canvasEl||this.canvasEl.locked||(e.preventDefault(),this.announceNextSnapshot=!0,e.deltaY<0?this.canvasEl.zoomIn():this.canvasEl.zoomOut())},this.onViewportPointerDown=e=>{const dragEventWindow=this.ownerDocument.defaultView;!this.canvasEl||!this.snapshot||!dragEventWindow||this.canvasEl.locked||(e.stopPropagation(),this.detachViewportDragListeners(),this.justDraggedViewport=!1,this.dragState={pointerId:e.pointerId,startClientX:e.clientX,startClientY:e.clientY,startViewport:{...this.snapshot.viewport},moved:!1},e.target.setPointerCapture?.(e.pointerId),this.dragEventWindow=dragEventWindow,dragEventWindow.addEventListener("pointermove",this.onViewportPointerMove),dragEventWindow.addEventListener("pointerup",this.onViewportPointerUp),dragEventWindow.addEventListener("pointercancel",this.onViewportPointerUp),dragEventWindow.addEventListener("lostpointercapture",this.onViewportPointerUp))},this.onViewportPointerMove=e=>{const drag=this.dragState;if(!drag||e.pointerId!==drag.pointerId)return;if(!this.canvasEl||this.canvasEl.locked){this.cancelViewportDrag();return}const ctm=this.renderRoot.querySelector('[part="map"]')?.getScreenCTM();if(!ctm)return;const scale=ctm.a||1,dxContent=(e.clientX-drag.startClientX)/scale,dyContent=(e.clientY-drag.startClientY)/scale;dxContent===0&&dyContent===0||(drag.moved=!0,drag.latestViewport={x:drag.startViewport.x-dxContent*drag.startViewport.zoom,y:drag.startViewport.y-dyContent*drag.startViewport.zoom,zoom:drag.startViewport.zoom},this.canvasEl.setViewport(drag.latestViewport))},this.onViewportPointerUp=e=>{const drag=this.dragState;!drag||e.pointerId!==drag.pointerId||(this.justDraggedViewport=e.type==="pointerup"&&drag.moved,this.justDraggedViewport&&drag.latestViewport&&!this.canvasEl?.locked&&this.announceViewport(drag.latestViewport),this.dragState=void 0,this.detachViewportDragListeners())},this.onViewportKeyDown=e=>{if(!this.canvasEl||!this.snapshot||this.canvasEl.locked)return;if(e.key==="+"||e.key==="="){e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.zoomIn();return}if(e.key==="-"||e.key==="_"){e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.zoomOut();return}if(e.key==="Enter"||e.key==="Home"){e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.fit();return}const{x,y,zoom,width,height}=this.snapshot.viewport,stepX=width*.1,stepY=height*.1;e.key==="ArrowRight"?(e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.setViewport({x:x-stepX,y,zoom})):e.key==="ArrowLeft"?(e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.setViewport({x:x+stepX,y,zoom})):e.key==="ArrowDown"?(e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.setViewport({x,y:y-stepY,zoom})):e.key==="ArrowUp"&&(e.preventDefault(),this.announceNextSnapshot=!0,this.canvasEl.setViewport({x,y:y+stepY,zoom}))}}static{this.defaultStrings={...super.defaultStrings,flowMinimapInstructions:LYRA_DEFAULT_flowMinimapInstructions,flowMinimapLabel:LYRA_DEFAULT_flowMinimapLabel,flowMinimapViewport:LYRA_DEFAULT_flowMinimapViewport,flowMinimapViewportChanged:LYRA_DEFAULT_flowMinimapViewportChanged}}static{this.styles=[LyraElement.styles,styles,srOnly]}connectedCallback(){super.connectedCallback(),this.syncAnnouncementSink(),this.companionController.connect()}refreshViewportMetrics(){const view=this.ownerDocument?.defaultView;if(!view||!this.isConnected)return;const computed=view.getComputedStyle(this),minSize=resolveCssLength(computed.getPropertyValue("--lr-flow-minimap-viewport-min-size").trim()||computed.getPropertyValue("--lr-icon-button-size").trim(),{host:this});this.viewportMinSizePx=minSize!==void 0&&Number.isFinite(minSize)&&minSize>=0?minSize:DEFAULT_VIEWPORT_MIN_SIZE_PX;const border=resolveCssLength(computed.getPropertyValue("--lr-border-width-thin").trim(),{host:this});this.baseBorderPx=border!==void 0&&Number.isFinite(border)&&border>=0?border:0}disconnectedCallback(){super.disconnectedCallback(),this.releaseAnnouncementSink(),this.announceNextSnapshot=!1,this.liveText="",this.companionController.disconnect()}adoptedCallback(){super.adoptedCallback(),this.syncAnnouncementSink(),this.companionController.adopt()}releaseAnnouncementSink(){this.announcementSink?.release(),this.announcementSink=void 0}syncAnnouncementSink(){if(!this.isConnected){this.releaseAnnouncementSink();return}this.announcementSink?.element.ownerDocument!==this.ownerDocument&&(this.releaseAnnouncementSink(),this.announcementSink=acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}))}announceViewport(viewport){const number=getNumberFormat(this.effectiveLocale,{maximumFractionDigits:0}),percent=getNumberFormat(this.effectiveLocale,{style:"percent",maximumFractionDigits:1}),text=this.localize("flowMinimapViewportChanged",void 0,{x:number.format(viewport.x),y:number.format(viewport.y),zoom:percent.format(viewport.zoom)});this.liveText=text,this.announcementSink?.announce(text)}willUpdate(changed){super.willUpdate(changed),this.refreshViewportMetrics(),this.hasUpdated&&changed.has("for")&&this.companionController.targetIdChanged()}attachCanvas(canvas){this.cancelViewportDrag(),this.unsubscribe?.(),this.unsubscribe=void 0,this.snapshot=null,this.canvasEl=canvas??void 0,canvas&&(this.unsubscribe=canvas.registerCompanion(snapshot=>{!this.isConnected||this.canvasEl!==canvas||(this.snapshot=snapshot,snapshot.locked&&this.cancelViewportDrag(),this.announceNextSnapshot&&(this.announceNextSnapshot=!1,this.announceViewport(snapshot.viewport)))}))}cancelViewportDrag(){this.dragState=void 0,this.justDraggedViewport=!1,this.announceNextSnapshot=!1,this.detachViewportDragListeners()}contentBounds(){const nodes=this.snapshot?.nodes??[];if(nodes.length===0)return{minX:0,minY:0,maxX:1,maxY:1};let minX=1/0,minY=1/0,maxX=-1/0,maxY=-1/0;for(const n of nodes)minX=Math.min(minX,n.x),minY=Math.min(minY,n.y),maxX=Math.max(maxX,n.x+n.width),maxY=Math.max(maxY,n.y+n.height);return{minX,minY,maxX,maxY}}mapSizePx(){const inset=2*this.baseBorderPx;return{width:Math.max(0,this.clientWidth-inset),height:Math.max(0,this.clientHeight-inset)}}viewportRectContent(viewBoxWidth,viewBoxHeight,minimumPhysicalSize=this.viewportMinSizePx){const vp=this.snapshot?.viewport;if(!vp||vp.zoom===0)return{x:0,y:0,width:0,height:0};const x=-vp.x/vp.zoom,y=-vp.y/vp.zoom,width=vp.width/vp.zoom,height=vp.height/vp.zoom,map=this.mapSizePx(),scale=map.width>0&&map.height>0&&viewBoxWidth>0&&viewBoxHeight>0?Math.min(map.width/viewBoxWidth,map.height/viewBoxHeight):0,floor=scale>0?minimumPhysicalSize/scale:0;if(!Number.isFinite(floor)||floor<=0)return{x,y,width,height};const flooredWidth=Math.max(width,floor),flooredHeight=Math.max(height,floor);return{x:x-(flooredWidth-width)/2,y:y-(flooredHeight-height)/2,width:flooredWidth,height:flooredHeight}}clientToContentPoint(svgEl,clientX,clientY){const ctm=svgEl.getScreenCTM();if(!ctm)return{x:0,y:0};const pt=svgEl.createSVGPoint();pt.x=clientX,pt.y=clientY;const transformed=pt.matrixTransform(ctm.inverse());return{x:transformed.x,y:transformed.y}}detachViewportDragListeners(){const dragEventWindow=this.dragEventWindow;dragEventWindow&&(dragEventWindow.removeEventListener("pointermove",this.onViewportPointerMove),dragEventWindow.removeEventListener("pointerup",this.onViewportPointerUp),dragEventWindow.removeEventListener("pointercancel",this.onViewportPointerUp),dragEventWindow.removeEventListener("lostpointercapture",this.onViewportPointerUp),this.dragEventWindow=void 0)}renderNodes(){return svg`${(this.snapshot?.nodes??[]).map(n=>svg`<rect part="node" data-status=${n.status??nothing} x=${n.x} y=${n.y} width=${n.width} height=${n.height} rx="2"></rect>`)}`}render(){const label=hostAriaLabel(this)??(this.label||this.localize("flowMinimapLabel"));if(!this.canvasEl||!this.snapshot)return html`<div part="base" aria-hidden="true"></div>`;const bounds=this.contentBounds(),padding=20,vbX=bounds.minX-padding,vbY=bounds.minY-padding,vbW=Math.max(1,bounds.maxX-bounds.minX+padding*2),vbH=Math.max(1,bounds.maxY-bounds.minY+padding*2),viewportRect=this.viewportRectContent(vbW,vbH,0),viewportHitRect=this.viewportRectContent(vbW,vbH),locked=this.snapshot.locked||this.canvasEl.locked;return html`<div
       part="base"
       role="region"
       aria-label=${label}

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

@@ -18,15 +18,9 @@ import{css}from"lit";const styles=css`
     block-size: 100%;
     cursor: pointer;
   }
-  /* Mouse-hover cue matching the cursor: pointer affordance above -- mirrors the reveal-button/
-     copy-button/sources-summary brand-quiet hover tint used across the library for a clickable
-     surface with no dedicated icon of its own. */
   [part='map']:hover {
     background: var(--lr-color-brand-quiet);
   }
-  /* Clicking the map recenters the canvas viewport, and that jump is the only confirmation the user
-     gets -- the pressed fill is what says the click landed on the map rather than on the viewport
-     rect drawn over it. */
   [part='map']:active {
     background: color-mix(in oklab, var(--lr-color-brand-quiet), var(--lr-color-mix-partner) var(--lr-color-mix-active));
   }
@@ -71,9 +65,6 @@ import{css}from"lit";const styles=css`
     fill: color-mix(in srgb, var(--lr-color-brand) 25%, transparent);
     stroke-width: 3;
   }
-  /* The rect is a grab handle, so its pressed state is also its dragging state -- it stays applied
-     for the whole gesture. Both channels step past the hovered values, and the cursor flips to
-     grabbing, matching the [data-panning] treatment lr-flow-canvas gives its own background. */
   [data-viewport-control]:has([part='viewport-hit-area']:active) [part='viewport'] {
     fill: color-mix(in srgb, var(--lr-color-brand) 40%, transparent);
     stroke-width: 4;

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

@@ -37,10 +37,6 @@ import{css}from"lit";const styles=css`
   }
   .card {
     flex: 1 1 auto;
-    /* The single source of the card's minimum width -- a second min-inline-size declaration later
-       in this same rule would win outright and make --lr-flow-node-min-inline-size dead, which is
-       exactly what a stray "min-inline-size: 0" here used to do. The host caps itself at
-       max-inline-size: 100%, so a narrow allocation still wraps rather than overflowing. */
     min-inline-size: var(--lr-flow-node-min-inline-size, calc(var(--lr-size-10rem) + var(--lr-size-1rem)));
     display: flex;
     flex-direction: column;
@@ -49,21 +45,8 @@ import{css}from"lit";const styles=css`
     border: var(--lr-border-width-thin) solid var(--lr-color-border);
     border-radius: var(--lr-radius);
     background: var(--lr-color-surface);
-    /* Resting chrome: a node card sits on the canvas, so it takes a card step -- s rather than xs
-       because it has to separate from a patterned/gridded canvas background, not a flat panel. */
     box-shadow: var(--lr-shadow-s);
   }
-  /* Density escape -- same convention as lr-source-card's compact. The tuned values sit behind
-     inline var() fallbacks (rather than a :host declaration, which every instance re-declares and
-     so shadows any ancestor value) so a canvas or palette can retune every card at once from the
-     outside; the fallbacks are the pre-existing values scaled down one step, so an unset card
-     renders unchanged.
-
-     Deliberately placed BEFORE the :host([selected]) and :host([status='running']) rules below:
-     all three are :host([x]) .card, i.e. equal specificity, so source order alone decides. They
-     carry the state treatments (border-color, the run-state ring) while this one carries only
-     density (padding/gap), so nothing collides today -- keeping the state rules last means a
-     future border/shadow tweak here still can't silently win over selection or run state. */
   :host([compact]) .card {
     padding: var(--lr-flow-node-compact-padding, var(--lr-space-xs));
     gap: var(--lr-flow-node-compact-gap, var(--lr-space-2xs));
@@ -129,10 +112,6 @@ import{css}from"lit";const styles=css`
     justify-content: flex-end;
     opacity: 0;
   }
-  /* no-pressed-state: the toolbar is not a target -- it is the container the consumer slots the
-     node's own action buttons into, and hovering/focusing the CARD is what reveals it. Pressing it
-     means pressing one of those buttons, which carries its own pressed state; a pressed treatment
-     on the container would fire for every one of them and say nothing about which. */
   :host(:hover) [part='toolbar'],
   :host(:focus-within) [part='toolbar'] {
     opacity: 1;
@@ -144,8 +123,6 @@ import{css}from"lit";const styles=css`
     border-color: var(--lr-flow-node-running-border, var(--lr-color-brand));
     box-shadow: 0 0 0 var(--lr-size-2px) var(--lr-flow-node-running-glow, var(--lr-color-brand-quiet));
   }
-  /* The JS gate only evaluates the preference at render time; this CSS branch also covers a
-     preference change while an already-rendered card is still pulsing. */
   @media (prefers-reduced-motion: reduce) {
     .card[data-pulse] {
       animation: none;

package/dist/components/data/flow-run-status/flow-run-status.class.js

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{srOnly}from"../../../internal/a11y.js";import{Announcer,acquireAnnouncementSink}from"../../../internal/announcer.js";import{getListFormat,getNumberFormat}from"../../../internal/intl-cache.js";import{snapshotFlowDecorations}from"../flow-canvas/flow-model.js";import{FlowCanvasCompanionController}from"../flow-canvas/flow-companion-controller.js";import{styles}from"./flow-run-status.styles.js";import{LYRA_DEFAULT_flowRunStatusCount,LYRA_DEFAULT_flowRunStatusLabel,LYRA_DEFAULT_flowRunStepStatus,LYRA_DEFAULT_flowRunSummary,LYRA_DEFAULT_statusDenied,LYRA_DEFAULT_statusError,LYRA_DEFAULT_statusPending,LYRA_DEFAULT_statusRunning,LYRA_DEFAULT_statusSuccess}from"../../../internal/default-strings.generated.js";const ALL_STATUSES=["pending","running","success","error","denied"],DONE_STATUSES=new Set(["success","error","denied"]);function isFlowCanvasLike(element){const candidate=element;return"decorations"in candidate&&Array.isArray(candidate.nodes)}class LyraFlowRunStatus extends LyraElement{constructor(){super(...arguments),this.for="",this._decorations=Object.freeze({}),this.hideSummary=!1,this.label="",this.frame="card",this.liveText="",this.announcer=new Announcer({onFlush:text=>{this.sink?.announce(text),this.liveText=text}}),this.companionController=new FlowCanvasCompanionController(this,isFlowCanvasLike,next=>this.attachCanvas(next)),this.lastWrittenDecorations=null}static{this.defaultStrings={...super.defaultStrings,flowRunStatusCount:LYRA_DEFAULT_flowRunStatusCount,flowRunStatusLabel:LYRA_DEFAULT_flowRunStatusLabel,flowRunStepStatus:LYRA_DEFAULT_flowRunStepStatus,flowRunSummary:LYRA_DEFAULT_flowRunSummary,statusDenied:LYRA_DEFAULT_statusDenied,statusError:LYRA_DEFAULT_statusError,statusPending:LYRA_DEFAULT_statusPending,statusRunning:LYRA_DEFAULT_statusRunning,statusSuccess:LYRA_DEFAULT_statusSuccess}}static{this.styles=[LyraElement.styles,styles,srOnly]}get decorations(){return this._decorations}set decorations(value){const previous=this._decorations;this._decorations=snapshotFlowDecorations(value),this.requestUpdate("decorations",previous)}connectedCallback(){super.connectedCallback();const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.announcer.setTimerHost(ownerWindow),this.syncSink(),this.companionController.connect()}disconnectedCallback(){super.disconnectedCallback(),this.companionController.disconnect(),this.announcer.cancel(),this.sink?.release(),this.sink=void 0}adoptedCallback(){super.adoptedCallback();const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.announcer.setTimerHost(ownerWindow),this.syncSink(),this.companionController.adopt()}syncSink(){this.sink?.element.ownerDocument!==this.ownerDocument&&(this.sink?.release(),this.sink=this.isConnected?acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}):void 0)}willUpdate(changed){super.willUpdate(changed),this.hasUpdated&&changed.has("for")&&this.companionController.targetIdChanged(),changed.has("decorations")&&this.announceTransitions(changed.get("decorations"))}updated(changed){super.updated(changed),changed.has("decorations")&&this.applyDecorations()}attachCanvas(next){this.canvasEl&&this.canvasEl.decorations===this.lastWrittenDecorations&&(this.canvasEl.decorations=null),this.canvasEl=next??void 0,this.lastWrittenDecorations=null,this.applyDecorations()}applyDecorations(){if(!this.canvasEl)return;const current=this.canvasEl.decorations;this.lastWrittenDecorations!==null&&current!==null&&current!==this.lastWrittenDecorations&&console.warn("<lr-flow-run-status> is overwriting <lr-flow-canvas>.decorations set by something else; mixing this element with direct decorations writes is unsupported."),this.canvasEl.decorations=this.decorations,this.lastWrittenDecorations=this.canvasEl.decorations}statusLabel(status){return status==="pending"?this.localize("statusPending"):status==="running"?this.localize("statusRunning"):status==="success"?this.localize("statusSuccess"):status==="error"?this.localize("statusError"):this.localize("statusDenied")}announceTransitions(previous){if(!previous)return;const messages=[];for(const[id,decoration]of Object.entries(this.decorations)){if(previous[id]?.status===decoration.status)continue;const node=this.canvasEl?.nodes.find(n=>n.id===id),label=typeof node?.data?.label=="string"?node.data.label:id;messages.push(this.localize("flowRunStepStatus",void 0,{label,status:this.statusLabel(decoration.status)}))}messages.length>0&&this.announcer.announce(getListFormat(this.effectiveLocale,{type:"conjunction",style:"long"}).format(messages),{force:!0})}summary(){const counts={pending:0,running:0,success:0,error:0,denied:0};let total=0,done=0;for(const decoration of Object.values(this.decorations))total++,counts[decoration.status]++,DONE_STATUSES.has(decoration.status)&&done++;return{done,total,counts}}render(){const label=this.label||this.localize("flowRunStatusLabel"),ariaLabel=this.getAttribute("aria-label")||label,{done,total,counts}=this.summary(),number=getNumberFormat(this.effectiveLocale);return html`<div part="base" role="group" aria-label=${ariaLabel}>
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{hostAriaLabel,srOnly}from"../../../internal/a11y.js";import{Announcer,acquireAnnouncementSink}from"../../../internal/announcer.js";import{getListFormat,getNumberFormat}from"../../../internal/intl-cache.js";import{snapshotFlowDecorations}from"../flow-canvas/flow-model.js";import{FlowCanvasCompanionController}from"../flow-canvas/flow-companion-controller.js";import{styles}from"./flow-run-status.styles.js";import{LYRA_DEFAULT_flowRunStatusCount,LYRA_DEFAULT_flowRunStatusLabel,LYRA_DEFAULT_flowRunStepStatus,LYRA_DEFAULT_flowRunSummary,LYRA_DEFAULT_statusDenied,LYRA_DEFAULT_statusError,LYRA_DEFAULT_statusPending,LYRA_DEFAULT_statusRunning,LYRA_DEFAULT_statusSuccess}from"../../../internal/default-strings.generated.js";const ALL_STATUSES=["pending","running","success","error","denied"],DONE_STATUSES=new Set(["success","error","denied"]);function isFlowCanvasLike(element){const candidate=element;return"decorations"in candidate&&Array.isArray(candidate.nodes)}class LyraFlowRunStatus extends LyraElement{constructor(){super(...arguments),this.for="",this._decorations=Object.freeze({}),this.hideSummary=!1,this.label="",this.frame="card",this.liveText="",this.announcer=new Announcer({onFlush:text=>{this.sink?.announce(text),this.liveText=text}}),this.companionController=new FlowCanvasCompanionController(this,isFlowCanvasLike,next=>this.attachCanvas(next)),this.lastWrittenDecorations=null}static{this.defaultStrings={...super.defaultStrings,flowRunStatusCount:LYRA_DEFAULT_flowRunStatusCount,flowRunStatusLabel:LYRA_DEFAULT_flowRunStatusLabel,flowRunStepStatus:LYRA_DEFAULT_flowRunStepStatus,flowRunSummary:LYRA_DEFAULT_flowRunSummary,statusDenied:LYRA_DEFAULT_statusDenied,statusError:LYRA_DEFAULT_statusError,statusPending:LYRA_DEFAULT_statusPending,statusRunning:LYRA_DEFAULT_statusRunning,statusSuccess:LYRA_DEFAULT_statusSuccess}}static{this.styles=[LyraElement.styles,styles,srOnly]}get decorations(){return this._decorations}set decorations(value){const previous=this._decorations;this._decorations=snapshotFlowDecorations(value),this.requestUpdate("decorations",previous)}connectedCallback(){super.connectedCallback();const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.announcer.setTimerHost(ownerWindow),this.syncSink(),this.companionController.connect()}disconnectedCallback(){super.disconnectedCallback(),this.companionController.disconnect(),this.announcer.cancel(),this.sink?.release(),this.sink=void 0}adoptedCallback(){super.adoptedCallback();const ownerWindow=this.ownerDocument.defaultView;ownerWindow&&this.announcer.setTimerHost(ownerWindow),this.syncSink(),this.companionController.adopt()}syncSink(){this.sink?.element.ownerDocument!==this.ownerDocument&&(this.sink?.release(),this.sink=this.isConnected?acquireAnnouncementSink("polite",{document:this.ownerDocument,source:this}):void 0)}willUpdate(changed){super.willUpdate(changed),this.hasUpdated&&changed.has("for")&&this.companionController.targetIdChanged(),changed.has("decorations")&&this.announceTransitions(changed.get("decorations"))}updated(changed){super.updated(changed),changed.has("decorations")&&this.applyDecorations()}attachCanvas(next){this.canvasEl&&this.canvasEl.decorations===this.lastWrittenDecorations&&(this.canvasEl.decorations=null),this.canvasEl=next??void 0,this.lastWrittenDecorations=null,this.applyDecorations()}applyDecorations(){if(!this.canvasEl)return;const current=this.canvasEl.decorations;this.lastWrittenDecorations!==null&&current!==null&&current!==this.lastWrittenDecorations&&console.warn("<lr-flow-run-status> is overwriting <lr-flow-canvas>.decorations set by something else; mixing this element with direct decorations writes is unsupported."),this.canvasEl.decorations=this.decorations,this.lastWrittenDecorations=this.canvasEl.decorations}statusLabel(status){return status==="pending"?this.localize("statusPending"):status==="running"?this.localize("statusRunning"):status==="success"?this.localize("statusSuccess"):status==="error"?this.localize("statusError"):this.localize("statusDenied")}announceTransitions(previous){if(!previous)return;const messages=[];for(const[id,decoration]of Object.entries(this.decorations)){if(previous[id]?.status===decoration.status)continue;const node=this.canvasEl?.nodes.find(n=>n.id===id),label=typeof node?.data?.label=="string"?node.data.label:id;messages.push(this.localize("flowRunStepStatus",void 0,{label,status:this.statusLabel(decoration.status)}))}messages.length>0&&this.announcer.announce(getListFormat(this.effectiveLocale,{type:"conjunction",style:"long"}).format(messages),{force:!0})}summary(){const counts={pending:0,running:0,success:0,error:0,denied:0};let total=0,done=0;for(const decoration of Object.values(this.decorations))total++,counts[decoration.status]++,DONE_STATUSES.has(decoration.status)&&done++;return{done,total,counts}}render(){const label=this.label||this.localize("flowRunStatusLabel"),ariaLabel=hostAriaLabel(this)??label,{done,total,counts}=this.summary(),number=getNumberFormat(this.effectiveLocale);return html`<div part="base" role="group" aria-label=${ariaLabel}>
       ${this.hideSummary?"":html`
             <div part="summary">${this.localize("flowRunSummary",void 0,{done:number.format(done),total:number.format(total)})}</div>
             ${ALL_STATUSES.filter(s=>counts[s]>0).map(s=>html`<span part="count" data-status=${s}><span class="tone-dot"></span>${this.localize("flowRunStatusCount",void 0,{status:this.statusLabel(s),count:number.format(counts[s])})}</span>`)}

package/dist/components/data/flow-run-status/flow-run-status.styles.js

@@ -14,18 +14,11 @@ import{css}from"lit";const styles=css`
     border: var(--lr-border-width-thin) solid var(--lr-color-border);
     border-radius: var(--lr-radius);
     background: var(--lr-color-surface);
-    /* Resting chrome, despite the element's name: this is an in-flow status strip (the host is a
-       plain display:block box with no positioning of its own, and it is usually dropped into a
-       toolbar next to the canvas), not a layer floating above the page. */
     box-shadow: var(--lr-shadow-s);
     font-size: var(--lr-font-size-xs);
     min-inline-size: 0;
     max-inline-size: 100%;
   }
-  /* Chrome-less escape, mirroring the shared LyraFrame vocabulary's frame="plain" (and lr-callout's [inline]): the
-     summary strip is often placed directly inside a host toolbar that already draws its own
-     border/background, where this floating-surface chrome doubles the frame. Only the box
-     decoration goes -- the flex layout, gap and the per-status count dots stay. */
   :host([frame='plain']) [part='base'] {
     padding: 0;
     border: 0;

package/dist/components/data/graph-query-builder/graph-query-builder.class.d.ts

@@ -305,13 +305,6 @@ export declare class LyraGraphQueryBuilder extends LyraElement<LyraGraphQueryBui
     private removalFocusGeneration;
     constructor();
     disconnectedCallback(): void;
-    /** `attachInternals()` throws in any environment without a real `ElementInternals`
-     *  implementation (e.g. a downstream consumer's happy-dom test suite) -- merely constructing
-     *  (or importing) this component must not hard-crash there. Falls back to an inert stand-in:
-     *  form participation and validity reporting are unavailable in that environment (there is no
-     *  polyfillable substitute), but rendering and every non-form-associated feature keep working. */
-    private safeAttachInternals;
-    private inertInternals;
     get form(): HTMLFormElement | null;
     set form(owner: FormOwnerValue);
     getForm(): HTMLFormElement | null;

package/dist/components/data/graph-query-builder/graph-query-builder.class.js

@@ -1,4 +1,4 @@
-var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{closeIcon}from"../../../internal/icons.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{syncValidityStates}from"../../../internal/custom-states.js";import{finiteInteger}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{nextId}from"../../../internal/a11y.js";import{deepActiveElementIn}from"../../../internal/active-element.js";import{styles}from"./graph-query-builder.styles.js";import{getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{installInvalidEventAlias}from"../../../internal/invalid-event-alias.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_graphQueryBuilderLabel,LYRA_DEFAULT_graphQueryDeleteWithContext,LYRA_DEFAULT_graphQueryDirectionLabel,LYRA_DEFAULT_graphQueryEndLabel,LYRA_DEFAULT_graphQueryHopRangeInvalid,LYRA_DEFAULT_graphQueryLoadWithContext,LYRA_DEFAULT_graphQueryMaxHopsLabel,LYRA_DEFAULT_graphQueryMinHopsLabel,LYRA_DEFAULT_graphQueryNodeTypeLabel,LYRA_DEFAULT_graphQueryRelationshipTypeLabel,LYRA_DEFAULT_graphQueryRun,LYRA_DEFAULT_graphQuerySaveButton,LYRA_DEFAULT_graphQuerySaveNameLabel,LYRA_DEFAULT_graphQuerySavedQueriesLabel,LYRA_DEFAULT_graphQueryStartLabel,LYRA_DEFAULT_neighborDirectionBoth,LYRA_DEFAULT_neighborDirectionIn,LYRA_DEFAULT_neighborDirectionOut,LYRA_DEFAULT_noData,LYRA_DEFAULT_select}from"../../../internal/default-strings.generated.js";const MAX_TYPES=500,MAX_SAVED_QUERIES=200,MAX_TEXT=256,EMPTY_STRINGS=Object.freeze([]),EMPTY_VALUE=Object.freeze({startId:"",endId:"",relationshipTypes:EMPTY_STRINGS,nodeTypes:EMPTY_STRINGS,direction:"both",minHops:1,maxHops:1}),EMPTY_OPTIONS=Object.freeze([]),EMPTY_SAVED=Object.freeze([]);function ownValue(record,key){try{const descriptor=Object.getOwnPropertyDescriptor(record,key);return descriptor&&"value"in descriptor?descriptor.value:void 0}catch{return}}function boundedString(value){return typeof value=="string"?value.slice(0,MAX_TEXT):""}function stringArray(value){return Array.isArray(value)?Object.freeze([...new Set(value.slice(0,MAX_TYPES).filter(entry=>typeof entry=="string").map(entry=>boundedString(entry)).filter(Boolean))]):EMPTY_STRINGS}function normalizeGraphQuery(value){const record=value!==null&&typeof value=="object"&&!Array.isArray(value)?value:EMPTY_VALUE,direction=ownValue(record,"direction");return Object.freeze({startId:boundedString(ownValue(record,"startId")),endId:boundedString(ownValue(record,"endId")),relationshipTypes:stringArray(ownValue(record,"relationshipTypes")),nodeTypes:stringArray(ownValue(record,"nodeTypes")),direction:direction==="out"||direction==="in"||direction==="both"?direction:"both",minHops:finiteInteger(typeof ownValue(record,"minHops")=="number"?ownValue(record,"minHops"):EMPTY_VALUE.minHops,EMPTY_VALUE.minHops,1,20),maxHops:finiteInteger(typeof ownValue(record,"maxHops")=="number"?ownValue(record,"maxHops"):EMPTY_VALUE.maxHops,EMPTY_VALUE.maxHops,1,20)})}function normalizeTypeOptions(value){if(!Array.isArray(value))return EMPTY_OPTIONS;const values=new Set,result=[];for(const candidate of value.slice(0,MAX_TYPES)){if(candidate===null||typeof candidate!="object"||Array.isArray(candidate))continue;const optionValue=boundedString(ownValue(candidate,"value"));if(optionValue.trim().length===0||values.has(optionValue))continue;values.add(optionValue);const label=boundedString(ownValue(candidate,"label"));result.push(Object.freeze({value:optionValue,...label?{label}:{}}))}return Object.freeze(result)}function normalizeSavedQueries(value){if(!Array.isArray(value))return EMPTY_SAVED;const ids=new Set,result=[];for(const candidate of value.slice(0,MAX_SAVED_QUERIES)){if(candidate===null||typeof candidate!="object"||Array.isArray(candidate))continue;const id=boundedString(ownValue(candidate,"id"));id.trim().length===0||ids.has(id)||(ids.add(id),result.push(Object.freeze({id,name:boundedString(ownValue(candidate,"name")),query:normalizeGraphQuery(ownValue(candidate,"query"))})))}return Object.freeze(result)}class LyraGraphQueryBuilder extends LyraElement{static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,graphQueryBuilderLabel:LYRA_DEFAULT_graphQueryBuilderLabel,graphQueryDeleteWithContext:LYRA_DEFAULT_graphQueryDeleteWithContext,graphQueryDirectionLabel:LYRA_DEFAULT_graphQueryDirectionLabel,graphQueryEndLabel:LYRA_DEFAULT_graphQueryEndLabel,graphQueryHopRangeInvalid:LYRA_DEFAULT_graphQueryHopRangeInvalid,graphQueryLoadWithContext:LYRA_DEFAULT_graphQueryLoadWithContext,graphQueryMaxHopsLabel:LYRA_DEFAULT_graphQueryMaxHopsLabel,graphQueryMinHopsLabel:LYRA_DEFAULT_graphQueryMinHopsLabel,graphQueryNodeTypeLabel:LYRA_DEFAULT_graphQueryNodeTypeLabel,graphQueryRelationshipTypeLabel:LYRA_DEFAULT_graphQueryRelationshipTypeLabel,graphQueryRun:LYRA_DEFAULT_graphQueryRun,graphQuerySaveButton:LYRA_DEFAULT_graphQuerySaveButton,graphQuerySaveNameLabel:LYRA_DEFAULT_graphQuerySaveNameLabel,graphQuerySavedQueriesLabel:LYRA_DEFAULT_graphQuerySavedQueriesLabel,graphQueryStartLabel:LYRA_DEFAULT_graphQueryStartLabel,neighborDirectionBoth:LYRA_DEFAULT_neighborDirectionBoth,neighborDirectionIn:LYRA_DEFAULT_neighborDirectionIn,neighborDirectionOut:LYRA_DEFAULT_neighborDirectionOut,noData:LYRA_DEFAULT_noData,select:LYRA_DEFAULT_select}}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,styles]}static{this.immutableEventDetails=Object.freeze(["lr-input","lr-before-query-run","lr-query-run","lr-before-query-save","lr-query-save","lr-before-query-load","lr-query-load"])}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},name:{reflect:!0,noAccessor:!0},value:{attribute:!1,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0}}}get relationshipTypeOptions(){return this._relationshipTypeOptions}set relationshipTypeOptions(value){const previous=this._relationshipTypeOptions;this._relationshipTypeOptions=normalizeTypeOptions(value),this.requestUpdate("relationshipTypeOptions",previous)}get nodeTypeOptions(){return this._nodeTypeOptions}set nodeTypeOptions(value){const previous=this._nodeTypeOptions;this._nodeTypeOptions=normalizeTypeOptions(value),this.requestUpdate("nodeTypeOptions",previous)}get savedQueries(){return this._savedQueries}set savedQueries(value){const previous=this._savedQueries;this._savedQueries=normalizeSavedQueries(value),this.requestUpdate("savedQueries",previous)}constructor(){super(),this._relationshipTypeOptions=EMPTY_OPTIONS,this._nodeTypeOptions=EMPTY_OPTIONS,this._savedQueries=EMPTY_SAVED,this.hopLimit=6,this.label="",this.hint="",this.errorText="",this._errors={},this.touchedFields=new Set,this.saveName="",this.hasHintSlot=!1,this.hasErrorSlot=!1,this.labelId=nextId("graph-query-builder-label"),this.hintId=nextId("graph-query-builder-hint"),this.errorId=nextId("graph-query-builder-error"),this._fieldsetDisabled=!1,this._name="",this._value=EMPTY_VALUE,this.defaultValue=normalizeGraphQuery(EMPTY_VALUE),this.defaultValueCaptured=!1,this._disabled=!1,this.hasInteracted=!1,this.removalFocusGeneration=0,this.onChromeSlotChange=event=>{const slot=event.currentTarget,hasContent=slot.assignedNodes({flatten:!0}).some(node=>node.nodeType===Node.TEXT_NODE?!!node.textContent?.trim():!0);slot.name==="hint"?this.hasHintSlot=hasContent:slot.name==="error"&&(this.hasErrorSlot=hasContent)},this.internals=this.safeAttachInternals(),this.validityController=new AnchoredValidityController(this,this.internals,()=>this[VALIDITY_ANCHOR]()),installCustomErrorProperty(this,()=>this.validityController.customValidityMessage),installInvalidEventAlias(this,init=>this.emit("lr-invalid",null,init)),this.syncFormState()}disconnectedCallback(){this.removalFocusGeneration++,this.pendingRemovalFocus=void 0,super.disconnectedCallback()}safeAttachInternals(){if(typeof globalThis.ElementInternals>"u")return this.inertInternals();try{return this.attachInternals()}catch{return this.inertInternals()}}inertInternals(){return{form:null,labels:[],validity:{},validationMessage:"",willValidate:!1,setFormValue:()=>{},setValidity:()=>{},checkValidity:()=>!0,reportValidity:()=>!0,states:new Set}}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}getForm(){return getFormOwner(this.internals)}get labels(){return this.internals.labels}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}get value(){return this._value}set value(next){const old=this._value;this._value=normalizeGraphQuery(next),this.syncFormState(),this.requestUpdate("value",old)}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",this._name?this.setAttribute("name",this._name):this.removeAttribute("name"),this.requestUpdate("name",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled;this._disabled=!!next,this.toggleAttribute("disabled",this._disabled),this.validityController&&this.syncFormState(),this.requestUpdate("disabled",old)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}get errors(){return this.publicValidityErrors()}publicValidityErrors(){const errors={...this._errors};return this.willValidate&&this.validity.customError&&(errors.base=this.validationMessage),Object.freeze(errors)}publishValiditySnapshot(){if(!this.isConnected)return;const valid=!this.willValidate||this.validity.valid,errors=valid?Object.freeze({}):this.publicValidityErrors(),key=JSON.stringify({valid,errors});key!==this.lastValidityKey&&(this.lastValidityKey=key,this.emit("lr-validity-change",Object.freeze({valid,errors})))}[VALIDITY_ANCHOR](){const firstInvalidPart=Object.keys(this._errors)[0];if(!(!firstInvalidPart||!this.renderRoot))return this.renderRoot.querySelector(`[part="${firstInvalidPart}"]`)??void 0}computeValidation(){const errors={},flags={};return this._value.startId.trim()||(errors["start-input"]=this.localize("fieldRequired"),flags.valueMissing=!0),this._value.minHops>this._value.maxHops&&(errors["max-hops"]=this.localize("graphQueryHopRangeInvalid"),flags.rangeUnderflow=!0),{errors,flags}}syncFormState(){const{errors,flags}=this.computeValidation();this._errors=errors;let formValue=null;try{formValue=JSON.stringify(this._value)}catch{formValue=null}if(this.internals.setFormValue(formValue,formValue),this.barredFromValidation||Object.keys(flags).length===0)this.validityController.setValidity({});else{const message=Object.values(errors)[0]??"";this.validityController.setValidity(flags,message)}this.syncValidityCustomStates(),this.publishValiditySnapshot()}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}syncValidityCustomStates(){syncValidityStates(this.internals,{required:!0,hasInteracted:this.hasInteracted,barred:this.barredFromValidation})}checkValidity(){return this.syncFormState(),this.internals.checkValidity()}reportValidity(){return this.hasInteracted=!0,this.syncFormState(),Object.keys(this._errors).length>0&&(this.touchedFields=new Set([...this.touchedFields,...Object.keys(this._errors)])),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncValidityCustomStates(),this.publishValiditySnapshot()}formResetCallback(){this.hasInteracted=!1,this.captureDefaultValue(),this.value=this.defaultValue,this.touchedFields=new Set,this.saveName=""}captureDefaultValue(){this.defaultValueCaptured||(this.defaultValue=normalizeGraphQuery(this._value),this.defaultValueCaptured=!0)}formStateRestoreCallback(state2,_mode){let restored=EMPTY_VALUE;if(typeof state2=="string")try{const parsed=JSON.parse(state2);parsed!==null&&typeof parsed=="object"&&!Array.isArray(parsed)&&(restored=normalizeGraphQuery(parsed))}catch{}this.value=restored}formDisabledCallback(disabled){this._fieldsetDisabled=disabled,this.syncFormState(),this.requestUpdate()}get liveDisabled(){return this.effectiveDisabled||this.matches(":disabled")}focusFirstControl(options){if(!this.renderRoot||this.liveDisabled)return;(this.renderRoot.querySelector('[part="start-input"]')||this.renderRoot.querySelector('[part="end-input"]')||this.renderRoot.querySelector('[part="min-hops"]')||this.renderRoot.querySelector('[part="max-hops"]')||this.renderRoot.querySelector('[part="direction"]')||this.renderRoot.querySelector('[part="save-name-input"]'))?.focus(options)}focus(options){this.focusFirstControl(options)}blur(){const active=deepActiveElementIn(this.shadowRoot);active&&typeof active.blur=="function"&&active.blur()}click(){this.focusFirstControl()}setValue(next){this.effectiveDisabled||(this.hasInteracted=!0,this.value=next,this.emit("lr-input",Object.freeze({value:this._value})))}addRelationshipType(type){!type||this._value.relationshipTypes.includes(type)||this.setValue({...this._value,relationshipTypes:[...this._value.relationshipTypes,type]})}removeRelationshipType(type){this.captureChipRemovalFocus("relationship",type,this._value.relationshipTypes),this.setValue({...this._value,relationshipTypes:this._value.relationshipTypes.filter(t=>t!==type)})}addNodeType(type){!type||this._value.nodeTypes.includes(type)||this.setValue({...this._value,nodeTypes:[...this._value.nodeTypes,type]})}removeNodeType(type){this.captureChipRemovalFocus("node-type",type,this._value.nodeTypes),this.setValue({...this._value,nodeTypes:this._value.nodeTypes.filter(t=>t!==type)})}captureChipRemovalFocus(group,value,selected){const active=this.shadowRoot?.activeElement,expectedPart=group==="relationship"?"relationship-chips":"node-type-chips";if(active?.localName!=="lr-chip"||active.getAttribute("value")!==value||active.closest("lr-chip-group")?.getAttribute("part")!==expectedPart)return;const index=selected.indexOf(value),survivors=selected.filter(candidate=>candidate!==value),targetValue=survivors[Math.min(Math.max(index,0),survivors.length-1)];this.pendingRemovalFocus={kind:"chip",group,targetValue},this.removalFocusGeneration++}markTouched(part){this.hasInteracted=!0,this.syncValidityCustomStates(),!this.touchedFields.has(part)&&(this.touchedFields=new Set(this.touchedFields).add(part))}runQuery(){if(this.effectiveDisabled||!this.reportValidity())return;const detail=()=>Object.freeze({query:normalizeGraphQuery(this._value)});this.emit("lr-before-query-run",detail(),{cancelable:!0}).defaultPrevented||this.emit("lr-query-run",detail())}saveQuery(){if(this.effectiveDisabled)return;const name=this.saveName.trim();if(!name)return;const detail=()=>Object.freeze({name,query:normalizeGraphQuery(this._value)});this.emit("lr-before-query-save",detail(),{cancelable:!0}).defaultPrevented||(this.saveName="",this.emit("lr-query-save",detail()))}loadQuery(item){if(this.effectiveDisabled)return;const detail=()=>Object.freeze({queryId:item.id,query:normalizeGraphQuery(item.query)});this.emit("lr-before-query-load",detail(),{cancelable:!0}).defaultPrevented||(this.setValue({...EMPTY_VALUE,...item.query}),this.emit("lr-query-load",detail()))}deleteQuery(item){if(this.effectiveDisabled)return;const detail=()=>Object.freeze({queryId:item.id});this.emit("lr-before-query-delete",detail(),{cancelable:!0}).defaultPrevented||this.emit("lr-query-delete",detail())}willUpdate(changed){if(super.willUpdate(changed),this.hasUpdated||this.captureDefaultValue(),!changed.has("savedQueries"))return;const active=this.shadowRoot?.activeElement;if(active?.getAttribute("part")!=="saved-delete-button")return;const focusedId=active.closest("[data-query-id]")?.dataset.queryId;if(!focusedId||this.savedQueries.some(item=>item.id===focusedId))return;const index=(changed.get("savedQueries")??[]).findIndex(item=>item.id===focusedId),target=this.savedQueries[Math.min(Math.max(index,0),this.savedQueries.length-1)];this.pendingRemovalFocus={kind:"saved",targetId:target?.id},this.removalFocusGeneration++}updated(changed){super.updated(changed),this.publishValiditySnapshot();const pending=this.pendingRemovalFocus;if(!pending)return;this.pendingRemovalFocus=void 0;const generation=this.removalFocusGeneration;this.scheduleAfterUpdate(()=>{if(!(generation!==this.removalFocusGeneration||!this.isConnected)){if(pending.kind==="chip"){if(pending.targetValue){const part=pending.group==="relationship"?"relationship-chips":"node-type-chips",chip=[...this.shadowRoot?.querySelectorAll(`[part="${part}"] lr-chip`)??[]].find(candidate=>candidate.getAttribute("value")===pending.targetValue);if(chip){chip.focus();return}}const pickerPart=pending.group==="relationship"?"relationship-picker":"node-type-picker";this.shadowRoot?.querySelector(`[part="${pickerPart}"]`)?.focus();return}if(pending.targetId){const action=[...this.shadowRoot?.querySelectorAll("[data-query-id]")??[]].find(candidate=>candidate.dataset.queryId===pending.targetId)?.querySelector('[part="saved-delete-button"]');if(action){action.focus();return}}this.shadowRoot?.querySelector('[part="save-name-input"]')?.focus()}},"graph-query-removal-focus")}hopOptions(){const limit=finiteInteger(this.hopLimit,6,1,20),options=new Set(Array.from({length:limit},(_,i)=>i+1));return options.add(this._value.minHops),options.add(this._value.maxHops),[...options].sort((a,b)=>a-b)}labelForType(options,value){return options.find(o=>o.value===value)?.label??value}renderTypeFilter(kind,options,selected,add,remove,disabled){const pickerPart=kind==="relationship"?"relationship-picker":"node-type-picker",chipsPart=kind==="relationship"?"relationship-chips":"node-type-chips",pickerLabel=kind==="relationship"?this.localize("graphQueryRelationshipTypeLabel"):this.localize("graphQueryNodeTypeLabel"),available=options.filter(o=>!selected.includes(o.value));return html`
+var __decorate=function(decorators,target,key,desc){var c=arguments.length,r=c<3?target:desc===null?desc=Object.getOwnPropertyDescriptor(target,key):desc,d;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")r=Reflect.decorate(decorators,target,key,desc);else for(var i=decorators.length-1;i>=0;i--)(d=decorators[i])&&(r=(c<3?d(r):c>3?d(target,key,r):d(target,key))||r);return c>3&&r&&Object.defineProperty(target,key,r),r};import{html,nothing}from"lit";import{property,state}from"lit/decorators.js";import{LyraElement}from"../../../internal/lyra-element.js";import{closeIcon}from"../../../internal/icons.js";import{AnchoredValidityController,VALIDITY_ANCHOR}from"../../../internal/anchored-validity.js";import{syncValidityStates}from"../../../internal/custom-states.js";import{finiteInteger}from"../../../internal/numbers.js";import{getNumberFormat}from"../../../internal/intl-cache.js";import{nextId}from"../../../internal/a11y.js";import{deepActiveElementIn}from"../../../internal/active-element.js";import{styles}from"./graph-query-builder.styles.js";import{attachInternalsSafely}from"../../../internal/element-internals.js";import{getFormOwner,installCustomErrorProperty,isBarredFromValidation,setFormOwner}from"../../../internal/form-associated.js";import{installInvalidEventAlias}from"../../../internal/invalid-event-alias.js";import{LYRA_DEFAULT_fieldRequired,LYRA_DEFAULT_graphQueryBuilderLabel,LYRA_DEFAULT_graphQueryDeleteWithContext,LYRA_DEFAULT_graphQueryDirectionLabel,LYRA_DEFAULT_graphQueryEndLabel,LYRA_DEFAULT_graphQueryHopRangeInvalid,LYRA_DEFAULT_graphQueryLoadWithContext,LYRA_DEFAULT_graphQueryMaxHopsLabel,LYRA_DEFAULT_graphQueryMinHopsLabel,LYRA_DEFAULT_graphQueryNodeTypeLabel,LYRA_DEFAULT_graphQueryRelationshipTypeLabel,LYRA_DEFAULT_graphQueryRun,LYRA_DEFAULT_graphQuerySaveButton,LYRA_DEFAULT_graphQuerySaveNameLabel,LYRA_DEFAULT_graphQuerySavedQueriesLabel,LYRA_DEFAULT_graphQueryStartLabel,LYRA_DEFAULT_neighborDirectionBoth,LYRA_DEFAULT_neighborDirectionIn,LYRA_DEFAULT_neighborDirectionOut,LYRA_DEFAULT_noData,LYRA_DEFAULT_select}from"../../../internal/default-strings.generated.js";const MAX_TYPES=500,MAX_SAVED_QUERIES=200,MAX_TEXT=256,EMPTY_STRINGS=Object.freeze([]),EMPTY_VALUE=Object.freeze({startId:"",endId:"",relationshipTypes:EMPTY_STRINGS,nodeTypes:EMPTY_STRINGS,direction:"both",minHops:1,maxHops:1}),EMPTY_OPTIONS=Object.freeze([]),EMPTY_SAVED=Object.freeze([]);function ownValue(record,key){try{const descriptor=Object.getOwnPropertyDescriptor(record,key);return descriptor&&"value"in descriptor?descriptor.value:void 0}catch{return}}function boundedString(value){return typeof value=="string"?value.slice(0,MAX_TEXT):""}function stringArray(value){return Array.isArray(value)?Object.freeze([...new Set(value.slice(0,MAX_TYPES).filter(entry=>typeof entry=="string").map(entry=>boundedString(entry)).filter(Boolean))]):EMPTY_STRINGS}function normalizeGraphQuery(value){const record=value!==null&&typeof value=="object"&&!Array.isArray(value)?value:EMPTY_VALUE,direction=ownValue(record,"direction");return Object.freeze({startId:boundedString(ownValue(record,"startId")),endId:boundedString(ownValue(record,"endId")),relationshipTypes:stringArray(ownValue(record,"relationshipTypes")),nodeTypes:stringArray(ownValue(record,"nodeTypes")),direction:direction==="out"||direction==="in"||direction==="both"?direction:"both",minHops:finiteInteger(typeof ownValue(record,"minHops")=="number"?ownValue(record,"minHops"):EMPTY_VALUE.minHops,EMPTY_VALUE.minHops,1,20),maxHops:finiteInteger(typeof ownValue(record,"maxHops")=="number"?ownValue(record,"maxHops"):EMPTY_VALUE.maxHops,EMPTY_VALUE.maxHops,1,20)})}function normalizeTypeOptions(value){if(!Array.isArray(value))return EMPTY_OPTIONS;const values=new Set,result=[];for(const candidate of value.slice(0,MAX_TYPES)){if(candidate===null||typeof candidate!="object"||Array.isArray(candidate))continue;const optionValue=boundedString(ownValue(candidate,"value"));if(optionValue.trim().length===0||values.has(optionValue))continue;values.add(optionValue);const label=boundedString(ownValue(candidate,"label"));result.push(Object.freeze({value:optionValue,...label?{label}:{}}))}return Object.freeze(result)}function normalizeSavedQueries(value){if(!Array.isArray(value))return EMPTY_SAVED;const ids=new Set,result=[];for(const candidate of value.slice(0,MAX_SAVED_QUERIES)){if(candidate===null||typeof candidate!="object"||Array.isArray(candidate))continue;const id=boundedString(ownValue(candidate,"id"));id.trim().length===0||ids.has(id)||(ids.add(id),result.push(Object.freeze({id,name:boundedString(ownValue(candidate,"name")),query:normalizeGraphQuery(ownValue(candidate,"query"))})))}return Object.freeze(result)}class LyraGraphQueryBuilder extends LyraElement{static{this.defaultStrings={...super.defaultStrings,fieldRequired:LYRA_DEFAULT_fieldRequired,graphQueryBuilderLabel:LYRA_DEFAULT_graphQueryBuilderLabel,graphQueryDeleteWithContext:LYRA_DEFAULT_graphQueryDeleteWithContext,graphQueryDirectionLabel:LYRA_DEFAULT_graphQueryDirectionLabel,graphQueryEndLabel:LYRA_DEFAULT_graphQueryEndLabel,graphQueryHopRangeInvalid:LYRA_DEFAULT_graphQueryHopRangeInvalid,graphQueryLoadWithContext:LYRA_DEFAULT_graphQueryLoadWithContext,graphQueryMaxHopsLabel:LYRA_DEFAULT_graphQueryMaxHopsLabel,graphQueryMinHopsLabel:LYRA_DEFAULT_graphQueryMinHopsLabel,graphQueryNodeTypeLabel:LYRA_DEFAULT_graphQueryNodeTypeLabel,graphQueryRelationshipTypeLabel:LYRA_DEFAULT_graphQueryRelationshipTypeLabel,graphQueryRun:LYRA_DEFAULT_graphQueryRun,graphQuerySaveButton:LYRA_DEFAULT_graphQuerySaveButton,graphQuerySaveNameLabel:LYRA_DEFAULT_graphQuerySaveNameLabel,graphQuerySavedQueriesLabel:LYRA_DEFAULT_graphQuerySavedQueriesLabel,graphQueryStartLabel:LYRA_DEFAULT_graphQueryStartLabel,neighborDirectionBoth:LYRA_DEFAULT_neighborDirectionBoth,neighborDirectionIn:LYRA_DEFAULT_neighborDirectionIn,neighborDirectionOut:LYRA_DEFAULT_neighborDirectionOut,noData:LYRA_DEFAULT_noData,select:LYRA_DEFAULT_select}}static{this.formAssociated=!0}static{this.styles=[LyraElement.styles,styles]}static{this.immutableEventDetails=Object.freeze(["lr-input","lr-before-query-run","lr-query-run","lr-before-query-save","lr-query-save","lr-before-query-load","lr-query-load"])}static{this.properties={customError:{attribute:"custom-error",reflect:!0,noAccessor:!0},name:{reflect:!0,noAccessor:!0},value:{attribute:!1,noAccessor:!0},disabled:{type:Boolean,reflect:!0,noAccessor:!0}}}get relationshipTypeOptions(){return this._relationshipTypeOptions}set relationshipTypeOptions(value){const previous=this._relationshipTypeOptions;this._relationshipTypeOptions=normalizeTypeOptions(value),this.requestUpdate("relationshipTypeOptions",previous)}get nodeTypeOptions(){return this._nodeTypeOptions}set nodeTypeOptions(value){const previous=this._nodeTypeOptions;this._nodeTypeOptions=normalizeTypeOptions(value),this.requestUpdate("nodeTypeOptions",previous)}get savedQueries(){return this._savedQueries}set savedQueries(value){const previous=this._savedQueries;this._savedQueries=normalizeSavedQueries(value),this.requestUpdate("savedQueries",previous)}constructor(){super(),this._relationshipTypeOptions=EMPTY_OPTIONS,this._nodeTypeOptions=EMPTY_OPTIONS,this._savedQueries=EMPTY_SAVED,this.hopLimit=6,this.label="",this.hint="",this.errorText="",this._errors={},this.touchedFields=new Set,this.saveName="",this.hasHintSlot=!1,this.hasErrorSlot=!1,this.labelId=nextId("graph-query-builder-label"),this.hintId=nextId("graph-query-builder-hint"),this.errorId=nextId("graph-query-builder-error"),this._fieldsetDisabled=!1,this._name="",this._value=EMPTY_VALUE,this.defaultValue=normalizeGraphQuery(EMPTY_VALUE),this.defaultValueCaptured=!1,this._disabled=!1,this.hasInteracted=!1,this.removalFocusGeneration=0,this.onChromeSlotChange=event=>{const slot=event.currentTarget,hasContent=slot.assignedNodes({flatten:!0}).some(node=>node.nodeType===Node.TEXT_NODE?!!node.textContent?.trim():!0);slot.name==="hint"?this.hasHintSlot=hasContent:slot.name==="error"&&(this.hasErrorSlot=hasContent)},this.internals=attachInternalsSafely(this),this.validityController=new AnchoredValidityController(this,this.internals,()=>this[VALIDITY_ANCHOR]()),installCustomErrorProperty(this,()=>this.validityController.customValidityMessage),installInvalidEventAlias(this,init=>this.emit("lr-invalid",null,init)),this.syncFormState()}disconnectedCallback(){this.removalFocusGeneration++,this.pendingRemovalFocus=void 0,super.disconnectedCallback()}get form(){return getFormOwner(this.internals)}set form(owner){setFormOwner(this,owner)}getForm(){return getFormOwner(this.internals)}get labels(){return this.internals.labels}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}get willValidate(){return this.internals.willValidate}get value(){return this._value}set value(next){const old=this._value;this._value=normalizeGraphQuery(next),this.syncFormState(),this.requestUpdate("value",old)}get name(){return this._name}set name(next){const old=this._name;this._name=next??"",this._name?this.setAttribute("name",this._name):this.removeAttribute("name"),this.requestUpdate("name",old)}get disabled(){return this._disabled}set disabled(next){const old=this._disabled;this._disabled=!!next,this.toggleAttribute("disabled",this._disabled),this.validityController&&this.syncFormState(),this.requestUpdate("disabled",old)}get effectiveDisabled(){return this.disabled||this._fieldsetDisabled}get errors(){return this.publicValidityErrors()}publicValidityErrors(){const errors={...this._errors};return this.willValidate&&this.validity.customError&&(errors.base=this.validationMessage),Object.freeze(errors)}publishValiditySnapshot(){if(!this.isConnected)return;const valid=!this.willValidate||this.validity.valid,errors=valid?Object.freeze({}):this.publicValidityErrors(),key=JSON.stringify({valid,errors});key!==this.lastValidityKey&&(this.lastValidityKey=key,this.emit("lr-validity-change",Object.freeze({valid,errors})))}[VALIDITY_ANCHOR](){const firstInvalidPart=Object.keys(this._errors)[0];if(!(!firstInvalidPart||!this.renderRoot))return this.renderRoot.querySelector(`[part="${firstInvalidPart}"]`)??void 0}computeValidation(){const errors={},flags={};return this._value.startId.trim()||(errors["start-input"]=this.localize("fieldRequired"),flags.valueMissing=!0),this._value.minHops>this._value.maxHops&&(errors["max-hops"]=this.localize("graphQueryHopRangeInvalid"),flags.rangeUnderflow=!0),{errors,flags}}syncFormState(){const{errors,flags}=this.computeValidation();this._errors=errors;let formValue=null;try{formValue=JSON.stringify(this._value)}catch{formValue=null}if(this.internals.setFormValue(formValue,formValue),this.barredFromValidation||Object.keys(flags).length===0)this.validityController.setValidity({});else{const message=Object.values(errors)[0]??"";this.validityController.setValidity(flags,message)}this.syncValidityCustomStates(),this.publishValiditySnapshot()}get barredFromValidation(){return isBarredFromValidation(this,this.internals)}syncValidityCustomStates(){syncValidityStates(this.internals,{required:!0,hasInteracted:this.hasInteracted,barred:this.barredFromValidation})}checkValidity(){return this.syncFormState(),this.internals.checkValidity()}reportValidity(){return this.hasInteracted=!0,this.syncFormState(),Object.keys(this._errors).length>0&&(this.touchedFields=new Set([...this.touchedFields,...Object.keys(this._errors)])),this.internals.reportValidity()}setCustomValidity(message){this.validityController.setCustomValidity(message??""),this.syncValidityCustomStates(),this.publishValiditySnapshot()}formResetCallback(){this.hasInteracted=!1,this.captureDefaultValue(),this.value=this.defaultValue,this.touchedFields=new Set,this.saveName=""}captureDefaultValue(){this.defaultValueCaptured||(this.defaultValue=normalizeGraphQuery(this._value),this.defaultValueCaptured=!0)}formStateRestoreCallback(state2,_mode){let restored=EMPTY_VALUE;if(typeof state2=="string")try{const parsed=JSON.parse(state2);parsed!==null&&typeof parsed=="object"&&!Array.isArray(parsed)&&(restored=normalizeGraphQuery(parsed))}catch{}this.value=restored}formDisabledCallback(disabled){this._fieldsetDisabled=disabled,this.syncFormState(),this.requestUpdate()}get liveDisabled(){return this.effectiveDisabled||this.matches(":disabled")}focusFirstControl(options){if(!this.renderRoot||this.liveDisabled)return;(this.renderRoot.querySelector('[part="start-input"]')||this.renderRoot.querySelector('[part="end-input"]')||this.renderRoot.querySelector('[part="min-hops"]')||this.renderRoot.querySelector('[part="max-hops"]')||this.renderRoot.querySelector('[part="direction"]')||this.renderRoot.querySelector('[part="save-name-input"]'))?.focus(options)}focus(options){this.focusFirstControl(options)}blur(){const active=deepActiveElementIn(this.shadowRoot);active&&typeof active.blur=="function"&&active.blur()}click(){this.focusFirstControl()}setValue(next){this.effectiveDisabled||(this.hasInteracted=!0,this.value=next,this.emit("lr-input",Object.freeze({value:this._value})))}addRelationshipType(type){!type||this._value.relationshipTypes.includes(type)||this.setValue({...this._value,relationshipTypes:[...this._value.relationshipTypes,type]})}removeRelationshipType(type){this.captureChipRemovalFocus("relationship",type,this._value.relationshipTypes),this.setValue({...this._value,relationshipTypes:this._value.relationshipTypes.filter(t=>t!==type)})}addNodeType(type){!type||this._value.nodeTypes.includes(type)||this.setValue({...this._value,nodeTypes:[...this._value.nodeTypes,type]})}removeNodeType(type){this.captureChipRemovalFocus("node-type",type,this._value.nodeTypes),this.setValue({...this._value,nodeTypes:this._value.nodeTypes.filter(t=>t!==type)})}captureChipRemovalFocus(group,value,selected){const active=this.shadowRoot?.activeElement,expectedPart=group==="relationship"?"relationship-chips":"node-type-chips";if(active?.localName!=="lr-chip"||active.getAttribute("value")!==value||active.closest("lr-chip-group")?.getAttribute("part")!==expectedPart)return;const index=selected.indexOf(value),survivors=selected.filter(candidate=>candidate!==value),targetValue=survivors[Math.min(Math.max(index,0),survivors.length-1)];this.pendingRemovalFocus={kind:"chip",group,targetValue},this.removalFocusGeneration++}markTouched(part){this.hasInteracted=!0,this.syncValidityCustomStates(),!this.touchedFields.has(part)&&(this.touchedFields=new Set(this.touchedFields).add(part))}runQuery(){if(this.effectiveDisabled||!this.reportValidity())return;const detail=()=>Object.freeze({query:normalizeGraphQuery(this._value)});this.emit("lr-before-query-run",detail(),{cancelable:!0}).defaultPrevented||this.emit("lr-query-run",detail())}saveQuery(){if(this.effectiveDisabled)return;const name=this.saveName.trim();if(!name)return;const detail=()=>Object.freeze({name,query:normalizeGraphQuery(this._value)});this.emit("lr-before-query-save",detail(),{cancelable:!0}).defaultPrevented||(this.saveName="",this.emit("lr-query-save",detail()))}loadQuery(item){if(this.effectiveDisabled)return;const detail=()=>Object.freeze({queryId:item.id,query:normalizeGraphQuery(item.query)});this.emit("lr-before-query-load",detail(),{cancelable:!0}).defaultPrevented||(this.setValue({...EMPTY_VALUE,...item.query}),this.emit("lr-query-load",detail()))}deleteQuery(item){if(this.effectiveDisabled)return;const detail=()=>Object.freeze({queryId:item.id});this.emit("lr-before-query-delete",detail(),{cancelable:!0}).defaultPrevented||this.emit("lr-query-delete",detail())}willUpdate(changed){if(super.willUpdate(changed),this.hasUpdated||this.captureDefaultValue(),!changed.has("savedQueries"))return;const active=this.shadowRoot?.activeElement;if(active?.getAttribute("part")!=="saved-delete-button")return;const focusedId=active.closest("[data-query-id]")?.dataset.queryId;if(!focusedId||this.savedQueries.some(item=>item.id===focusedId))return;const index=(changed.get("savedQueries")??[]).findIndex(item=>item.id===focusedId),target=this.savedQueries[Math.min(Math.max(index,0),this.savedQueries.length-1)];this.pendingRemovalFocus={kind:"saved",targetId:target?.id},this.removalFocusGeneration++}updated(changed){super.updated(changed),this.publishValiditySnapshot();const pending=this.pendingRemovalFocus;if(!pending)return;this.pendingRemovalFocus=void 0;const generation=this.removalFocusGeneration;this.scheduleAfterUpdate(()=>{if(!(generation!==this.removalFocusGeneration||!this.isConnected)){if(pending.kind==="chip"){if(pending.targetValue){const part=pending.group==="relationship"?"relationship-chips":"node-type-chips",chip=[...this.shadowRoot?.querySelectorAll(`[part="${part}"] lr-chip`)??[]].find(candidate=>candidate.getAttribute("value")===pending.targetValue);if(chip){chip.focus();return}}const pickerPart=pending.group==="relationship"?"relationship-picker":"node-type-picker";this.shadowRoot?.querySelector(`[part="${pickerPart}"]`)?.focus();return}if(pending.targetId){const action=[...this.shadowRoot?.querySelectorAll("[data-query-id]")??[]].find(candidate=>candidate.dataset.queryId===pending.targetId)?.querySelector('[part="saved-delete-button"]');if(action){action.focus();return}}this.shadowRoot?.querySelector('[part="save-name-input"]')?.focus()}},"graph-query-removal-focus")}hopOptions(){const limit=finiteInteger(this.hopLimit,6,1,20),options=new Set(Array.from({length:limit},(_,i)=>i+1));return options.add(this._value.minHops),options.add(this._value.maxHops),[...options].sort((a,b)=>a-b)}labelForType(options,value){return options.find(o=>o.value===value)?.label??value}renderTypeFilter(kind,options,selected,add,remove,disabled){const pickerPart=kind==="relationship"?"relationship-picker":"node-type-picker",chipsPart=kind==="relationship"?"relationship-chips":"node-type-chips",pickerLabel=kind==="relationship"?this.localize("graphQueryRelationshipTypeLabel"):this.localize("graphQueryNodeTypeLabel"),available=options.filter(o=>!selected.includes(o.value));return html`
       <div part="filter-group" data-kind=${kind}>
         <lr-select
           part=${pickerPart}

package/dist/components/data/graph-query-builder/graph-query-builder.styles.js

@@ -87,10 +87,6 @@ import{css}from"lit";const styles=css`
     border-color: var(--lr-graph-query-builder-save-border-color, var(--lr-color-border));
     color: var(--lr-graph-query-builder-save-color, var(--lr-color-text));
   }
-  /* Mixing the resting fill toward --lr-color-mix-partner (which follows the text colour) rather
-     than multiplying every channel with filter: brightness(): a filter lightens a dark brand and
-     darkens a light one only by accident, does nothing at all to a pure white or pure black one,
-     and -- because it applies to the whole subtree -- shifted this button's label with it. */
   [part='run-button']:hover {
     background: var(
       --lr-graph-query-builder-run-hover-bg,
@@ -188,9 +184,6 @@ import{css}from"lit";const styles=css`
   [part='saved-load-button']:hover {
     text-decoration: underline;
   }
-  /* The row this button fills has the surface fill, so that -- not the button's own transparent
-     background -- is the base the pressed tint mixes from; an underline alone cannot get "more
-     underlined", and loading a saved query replaces the whole form, which is worth acknowledging. */
   [part='saved-load-button']:active {
     background: var(
       --lr-graph-query-builder-saved-load-active-bg,
@@ -221,9 +214,6 @@ import{css}from"lit";const styles=css`
   [part='saved-delete-button']:hover {
     color: var(--lr-graph-query-builder-saved-delete-hover-color, var(--lr-color-danger));
   }
-  /* Pressed adds the quiet danger fill behind the already-red glyph rather than only deepening the
-     glyph itself: a colour step on an icon this small is easy to miss, and this is the destructive
-     control in the row. */
   [part='saved-delete-button']:active {
     color: var(
       --lr-graph-query-builder-saved-delete-active-color,

package/dist/components/data/heatmap/heatmap-scale.d.ts

@@ -32,3 +32,23 @@ export declare function sqrtStep(count: number, max: number, steps: number): num
  * scale case (the `'sqrt'` scale already has its own discrete `sqrtStep()`).
  */
 export declare function linearBucket(value: number, lo: number, hi: number, steps: number): number;
+/**
+ * Normalizes `value` to `[0, 1]` around an anchored `midpoint` rather than the plain `lo`-`hi`
+ * span, so a diverging ramp's neutral color lands exactly on `midpoint` instead of wherever the
+ * data's own midpoint happens to fall.
+ *
+ * The two halves are scaled independently: `lo`->0, `midpoint`->0.5, `hi`->1. That deliberately
+ * does NOT preserve a single units-per-pixel ratio across the whole range — with data running
+ * -4.93 to +28.8 around a zero midpoint, an equal color distance means "equally far from
+ * neutral in its own direction", which is the entire point of a diverging ramp. A caller wanting
+ * a symmetric ramp passes a symmetric `domain` (e.g. `[-28.8, 28.8]`).
+ *
+ * Falls back to `finiteRatio`'s plain normalization when `midpoint` sits outside `[lo, hi]` or
+ * any input is non-finite, so a mis-set midpoint degrades to today's behavior rather than
+ * producing a a division by zero.
+ */
+export declare function midpointRatio(value: number, lo: number, hi: number, midpoint: number): number;
+/** `linearAlpha`'s midpoint-anchored twin, keeping the same 0.1-1.0 floor. */
+export declare function midpointAlpha(value: number, lo: number, hi: number, midpoint: number): number;
+/** `linearBucket`'s midpoint-anchored twin. */
+export declare function midpointBucket(value: number, lo: number, hi: number, midpoint: number, steps: number): number;

package/dist/components/data/heatmap/heatmap-scale.js

@@ -1 +1 @@
-import{finiteRatio}from"../../../internal/numbers.js";function linearAlpha(value,lo,hi){return .1+.9*finiteRatio(value,lo,hi)}function minMax(values){if(values.length===0)return null;let lo=values[0],hi=values[0];for(let i=1;i<values.length;i++){const v=values[i];v<lo&&(lo=v),v>hi&&(hi=v)}return[lo,hi]}function sqrtStep(count,max,steps){if(count<0)return-1;if(max<=0)return 0;const ratio=Math.sqrt(count)/Math.sqrt(max);return Math.min(steps-1,Math.floor(ratio*steps))}function linearBucket(value,lo,hi,steps){const t=finiteRatio(value,lo,hi);return Math.min(steps-1,Math.floor(t*steps))}export{linearAlpha,linearBucket,minMax,sqrtStep};
+import{finiteRatio}from"../../../internal/numbers.js";function linearAlpha(value,lo,hi){return .1+.9*finiteRatio(value,lo,hi)}function minMax(values){if(values.length===0)return null;let lo=values[0],hi=values[0];for(let i=1;i<values.length;i++){const v=values[i];v<lo&&(lo=v),v>hi&&(hi=v)}return[lo,hi]}function sqrtStep(count,max,steps){if(count<0)return-1;if(max<=0)return 0;const ratio=Math.sqrt(count)/Math.sqrt(max);return Math.min(steps-1,Math.floor(ratio*steps))}function linearBucket(value,lo,hi,steps){const t=finiteRatio(value,lo,hi);return Math.min(steps-1,Math.floor(t*steps))}function midpointRatio(value,lo,hi,midpoint){return!Number.isFinite(value)||!Number.isFinite(midpoint)?finiteRatio(value,lo,hi):!Number.isFinite(lo)||!Number.isFinite(hi)?finiteRatio(value,lo,hi):!(midpoint>lo)||!(midpoint<hi)?finiteRatio(value,lo,hi):value<=lo?0:value>=hi?1:value<=midpoint?.5*((value-lo)/(midpoint-lo)):.5+.5*((value-midpoint)/(hi-midpoint))}function midpointAlpha(value,lo,hi,midpoint){return .1+.9*midpointRatio(value,lo,hi,midpoint)}function midpointBucket(value,lo,hi,midpoint,steps){const t=midpointRatio(value,lo,hi,midpoint);return Math.min(steps-1,Math.floor(t*steps))}export{linearAlpha,linearBucket,midpointAlpha,midpointBucket,midpointRatio,minMax,sqrtStep};