@aceshooting/lyra-ui 3.8.0 → 4.0.0

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

@@ -43,23 +43,23 @@ export const styles = css `
   ::slotted([slot='bottom-start']),
   ::slotted([slot='bottom-end']) {
     position: absolute;
-    z-index: var(--lyra-layer-content);
+    z-index: var(--lr-layer-content);
   }
   ::slotted([slot='top-start']) {
-    inset-block-start: var(--lyra-space-s);
-    inset-inline-start: var(--lyra-space-s);
+    inset-block-start: var(--lr-space-s);
+    inset-inline-start: var(--lr-space-s);
   }
   ::slotted([slot='top-end']) {
-    inset-block-start: var(--lyra-space-s);
-    inset-inline-end: var(--lyra-space-s);
+    inset-block-start: var(--lr-space-s);
+    inset-inline-end: var(--lr-space-s);
   }
   ::slotted([slot='bottom-start']) {
-    inset-block-end: var(--lyra-space-s);
-    inset-inline-start: var(--lyra-space-s);
+    inset-block-end: var(--lr-space-s);
+    inset-inline-start: var(--lr-space-s);
   }
   ::slotted([slot='bottom-end']) {
-    inset-block-end: var(--lyra-space-s);
-    inset-inline-end: var(--lyra-space-s);
+    inset-block-end: var(--lr-space-s);
+    inset-inline-end: var(--lr-space-s);
   }
   [part='node'] {
     position: absolute;
@@ -69,38 +69,38 @@ export const styles = css `
   }
   [part='edge'] {
     fill: none;
-    stroke: var(--lyra-color-border);
+    stroke: var(--lr-color-border);
     stroke-width: 1.5;
     pointer-events: stroke;
     cursor: pointer;
   }
   [part='edge'][data-tone='accent'] {
-    stroke: var(--lyra-color-brand);
+    stroke: var(--lr-color-brand);
   }
   [part='edge'][data-tone='success'] {
-    stroke: var(--lyra-color-success);
+    stroke: var(--lr-color-success);
   }
   [part='edge'][data-tone='warning'] {
-    stroke: var(--lyra-color-warning);
+    stroke: var(--lr-color-warning);
   }
   [part='edge'][data-tone='danger'] {
-    stroke: var(--lyra-color-danger);
+    stroke: var(--lr-color-danger);
   }
   [part='arrowhead'] {
-    fill: var(--lyra-color-border);
+    fill: var(--lr-color-border);
   }
   [part='stub'] {
-    stroke: var(--lyra-color-border);
+    stroke: var(--lr-color-border);
     stroke-width: 1.5;
     stroke-dasharray: 3 3;
     opacity: 0.6;
   }
   [part='edge-label'] {
-    fill: var(--lyra-color-text);
-    font: var(--lyra-font-size-xs) / 1 var(--lyra-font);
+    fill: var(--lr-color-text);
+    font: var(--lr-font-size-xs) / 1 var(--lr-font);
     text-anchor: middle;
-    stroke: var(--lyra-color-surface);
-    stroke-width: var(--lyra-size-3px);
+    stroke: var(--lr-color-surface);
+    stroke-width: var(--lr-size-3px);
   }
   .world {
     position: absolute;
@@ -115,8 +115,8 @@ export const styles = css `
     inset-inline-start: -200%;
     inline-size: 500%;
     block-size: 500%;
-    background-image: radial-gradient(circle, var(--lyra-color-border) var(--lyra-size-1px), transparent var(--lyra-size-1px));
-    background-size: var(--lyra-flow-canvas-grid-size, var(--lyra-size-0-5rem)) var(--lyra-flow-canvas-grid-size, var(--lyra-size-0-5rem));
+    background-image: radial-gradient(circle, var(--lr-color-border) var(--lr-size-1px), transparent var(--lr-size-1px));
+    background-size: var(--lr-flow-canvas-grid-size, var(--lr-size-0-5rem)) var(--lr-flow-canvas-grid-size, var(--lr-size-0-5rem));
     cursor: grab;
   }
   [part='viewport'][data-panning] [part='background'] {
@@ -133,39 +133,39 @@ export const styles = css `
   }
   [part='node']:focus-visible,
   [part='edge']:focus-visible {
-    outline: var(--lyra-focus-ring-width) solid var(--lyra-focus-ring-color);
-    outline-offset: var(--lyra-focus-ring-offset);
+    outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);
+    outline-offset: var(--lr-focus-ring-offset);
   }
   [part='node'][aria-current='true'] {
-    outline: var(--lyra-size-2px) solid var(--lyra-color-brand);
-    outline-offset: var(--lyra-size-2px);
-    border-radius: var(--lyra-radius);
+    outline: var(--lr-size-2px) solid var(--lr-color-brand);
+    outline-offset: var(--lr-size-2px);
+    border-radius: var(--lr-radius);
   }
   [part='edge'][aria-pressed='true'] {
     stroke-width: 2.5;
   }
   [part='connection-line'] {
     fill: none;
-    stroke: var(--lyra-color-brand);
+    stroke: var(--lr-color-brand);
     stroke-width: 1.5;
     stroke-dasharray: 4 4;
     pointer-events: none;
   }
   [part='node'][data-connect-invalid] {
-    outline: var(--lyra-size-2px) solid var(--lyra-color-danger);
-    outline-offset: var(--lyra-size-2px);
+    outline: var(--lr-size-2px) solid var(--lr-color-danger);
+    outline-offset: var(--lr-size-2px);
   }
   [part='node'][data-connect-target] {
-    outline: var(--lyra-size-2px) dashed var(--lyra-color-brand);
-    outline-offset: var(--lyra-size-2px);
+    outline: var(--lr-size-2px) dashed var(--lr-color-brand);
+    outline-offset: var(--lr-size-2px);
   }
   [part='viewport'][data-drop-active] {
-    outline: var(--lyra-size-2px) dashed var(--lyra-color-brand);
-    outline-offset: calc(-1 * var(--lyra-size-2px));
+    outline: var(--lr-size-2px) dashed var(--lr-color-brand);
+    outline-offset: calc(-1 * var(--lr-size-2px));
   }
   [part='edge'][data-running] {
     stroke-dasharray: 6 4;
-    animation: lyra-flow-canvas-march var(--lyra-flow-canvas-march-duration, var(--lyra-transition-ambient)) linear infinite;
+    animation: lr-flow-canvas-march var(--lr-flow-canvas-march-duration, var(--lr-transition-ambient)) linear infinite;
   }
   [part='edge'][data-running-static] {
     stroke-dasharray: 6 4;
@@ -177,7 +177,7 @@ export const styles = css `
       animation: none;
     }
   }
-  @keyframes lyra-flow-canvas-march {
+  @keyframes lr-flow-canvas-march {
     to {
       stroke-dashoffset: -20;
     }

package/dist/components/flow-controls/flow-controls.class.d.ts

@@ -1,11 +1,11 @@
 import { type TemplateResult, type PropertyValues } from 'lit';
 import { LyraElement } from '../../internal/lyra-element.js';
 /**
- * `<lyra-flow-controls>` — the canvas's button cluster: zoom in/out, fit, and interaction lock, so
+ * `<lr-flow-controls>` — the canvas's button cluster: zoom in/out, fit, and interaction lock, so
  * every flow surface ships the same affordances without hosts rebuilding them. Manipulates only
  * view state, never `nodes`/`edges` — no editing commands live here.
  *
- * @customElement lyra-flow-controls
+ * @customElement lr-flow-controls
  * @slot - Extra host buttons appended to the cluster, styled by the same group.
  * @csspart base - The `role="group"` wrapper.
  * @csspart zoom-in - Zoom-in button.
@@ -24,7 +24,7 @@ export declare class LyraFlowControls extends LyraElement {
     private unsubscribe?;
     private lockObserver?;
     /** Watches the root for DOM changes while no canvas has resolved yet, so a `for` target or
-     *  ancestor `lyra-flow-canvas` that mounts after this element does still gets picked up instead
+     *  ancestor `lr-flow-canvas` that mounts after this element does still gets picked up instead
      *  of leaving every button permanently disabled. Disconnected once a canvas resolves. */
     private canvasWatcher?;
     connectedCallback(): void;
@@ -38,7 +38,7 @@ export declare class LyraFlowControls extends LyraElement {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        'lyra-flow-controls': LyraFlowControls;
+        'lr-flow-controls': LyraFlowControls;
     }
 }
 //# sourceMappingURL=flow-controls.class.d.ts.map

package/dist/components/flow-controls/flow-controls.class.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flow-controls.class.d.ts","sourceRoot":"","sources":["../../../src/components/flow-controls/flow-controls.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAA8C,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE3G,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAyD7D;;;;;;;;;;;;GAYG;AACH,qBAAa,gBAAiB,SAAQ,WAAW;IAC/C,MAAM,CAAC,MAAM,iCAAgC;IAEjC,GAAG,SAAM;IACQ,WAAW,EAAE,UAAU,GAAG,YAAY,CAAc;IAC5B,QAAQ,UAAS;IAE7D,OAAO,CAAC,QAAQ,CAAsC;IACtD,OAAO,CAAC,MAAM,CAAS;IAChC,OAAO,CAAC,QAAQ,CAAC,CAAiB;IAClC,OAAO,CAAC,WAAW,CAAC,CAAa;IACjC,OAAO,CAAC,YAAY,CAAC,CAAmB;IACxC;;6FAEyF;IACzF,OAAO,CAAC,aAAa,CAAC,CAAmB;IAEzC,iBAAiB,IAAI,IAAI,CAGxB;IAED,oBAAoB,IAAI,IAAI,CAS3B;IAOD,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAalD;IAED,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,gBAAgB;IAmBxB,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,UAAU,CAGhB;IAEF,MAAM,IAAI,cAAc,CA2CvB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,gBAAgB,CAAC;KACxC;CACF"}
+{"version":3,"file":"flow-controls.class.d.ts","sourceRoot":"","sources":["../../../src/components/flow-controls/flow-controls.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAA8C,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE3G,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAyD7D;;;;;;;;;;;;GAYG;AACH,qBAAa,gBAAiB,SAAQ,WAAW;IAC/C,MAAM,CAAC,MAAM,iCAAgC;IAEjC,GAAG,SAAM;IACQ,WAAW,EAAE,UAAU,GAAG,YAAY,CAAc;IAC5B,QAAQ,UAAS;IAE7D,OAAO,CAAC,QAAQ,CAAsC;IACtD,OAAO,CAAC,MAAM,CAAS;IAChC,OAAO,CAAC,QAAQ,CAAC,CAAiB;IAClC,OAAO,CAAC,WAAW,CAAC,CAAa;IACjC,OAAO,CAAC,YAAY,CAAC,CAAmB;IACxC;;6FAEyF;IACzF,OAAO,CAAC,aAAa,CAAC,CAAmB;IAEzC,iBAAiB,IAAI,IAAI,CAGxB;IAED,oBAAoB,IAAI,IAAI,CAS3B;IAOD,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAalD;IAED,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,gBAAgB;IAmBxB,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,UAAU,CAGhB;IAEF,MAAM,IAAI,cAAc,CA2CvB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,kBAAkB,EAAE,gBAAgB,CAAC;KACtC;CACF"}

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

@@ -45,11 +45,11 @@ const fitGlyph = () => glyphSvg(svg `
 const 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>`);
 const 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>`);
 /**
- * `<lyra-flow-controls>` — the canvas's button cluster: zoom in/out, fit, and interaction lock, so
+ * `<lr-flow-controls>` — the canvas's button cluster: zoom in/out, fit, and interaction lock, so
  * every flow surface ships the same affordances without hosts rebuilding them. Manipulates only
  * view state, never `nodes`/`edges` — no editing commands live here.
  *
- * @customElement lyra-flow-controls
+ * @customElement lr-flow-controls
  * @slot - Extra host buttons appended to the cluster, styled by the same group.
  * @csspart base - The `role="group"` wrapper.
  * @csspart zoom-in - Zoom-in button.

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

@@ -6,19 +6,19 @@ export const styles = css `
   [part='base'] {
     display: flex;
     flex-direction: row;
-    gap: var(--lyra-space-2xs);
-    padding: var(--lyra-space-2xs);
-    border: var(--lyra-border-width-thin) solid var(--lyra-color-border);
-    border-radius: var(--lyra-radius);
-    background: var(--lyra-color-surface);
-    box-shadow: var(--lyra-shadow);
+    gap: var(--lr-space-2xs);
+    padding: var(--lr-space-2xs);
+    border: var(--lr-border-width-thin) solid var(--lr-color-border);
+    border-radius: var(--lr-radius);
+    background: var(--lr-color-surface);
+    box-shadow: var(--lr-shadow);
   }
   :host([orientation='vertical']) [part='base'] {
     flex-direction: column;
   }
   /* Enumerated by part (rather than the previous bare "[part='base'] button"
      tag selector) so each control resolves to the shared minimum tappable
-     size (--lyra-icon-button-size) directly off its own [part='...'] --
+     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'],
@@ -28,28 +28,28 @@ export const styles = css `
     display: inline-flex;
     align-items: center;
     justify-content: center;
-    min-inline-size: var(--lyra-icon-button-size);
-    min-block-size: var(--lyra-icon-button-size);
+    min-inline-size: var(--lr-icon-button-size);
+    min-block-size: var(--lr-icon-button-size);
     padding: 0;
     border: none;
-    border-radius: var(--lyra-radius);
+    border-radius: var(--lr-radius);
     background: transparent;
-    color: var(--lyra-color-text);
+    color: var(--lr-color-text);
     cursor: pointer;
   }
   [part='base'] button:hover:not(:disabled) {
-    background: var(--lyra-color-surface-hover, var(--lyra-color-border));
+    background: var(--lr-color-surface-hover, var(--lr-color-border));
   }
   [part='base'] button:disabled {
     opacity: 0.4;
     cursor: not-allowed;
   }
   [part='base'] button:focus-visible {
-    outline: var(--lyra-focus-ring-width) solid var(--lyra-focus-ring-color);
-    outline-offset: var(--lyra-focus-ring-offset);
+    outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);
+    outline-offset: var(--lr-focus-ring-offset);
   }
   [part='lock'][aria-pressed='true'] {
-    color: var(--lyra-color-brand);
+    color: var(--lr-color-brand);
   }
 `;
 //# sourceMappingURL=flow-controls.styles.js.map

package/dist/components/flow-minimap/flow-minimap.class.d.ts

@@ -1,23 +1,23 @@
 import { type TemplateResult, type PropertyValues } from 'lit';
 import { LyraElement } from '../../internal/lyra-element.js';
 /**
- * `<lyra-flow-minimap>` — a corner overview map of a `lyra-flow-canvas`: scaled node rectangles plus
+ * `<lr-flow-minimap>` — a corner overview map of a `lr-flow-canvas`: scaled node rectangles plus
  * a draggable viewport rectangle, for orientation and fast navigation on canvases larger than the
  * screen. Draws no edges (nodes only, matching the React Flow/n8n minimap convention) and never
  * reads `nodes` itself — geometry always comes from the canvas's `registerCompanion()` snapshots, so
  * the two can never disagree.
  *
- * @customElement lyra-flow-minimap
+ * @customElement lr-flow-minimap
  * @csspart base - The root wrapper.
  * @csspart map - The scaled SVG.
  * @csspart node - One rect per node.
  * @csspart viewport - The draggable, focusable view rectangle.
- * @cssprop [--lyra-flow-minimap-inline-size=12rem] - Map inline size.
- * @cssprop [--lyra-flow-minimap-block-size=8rem] - Map block size.
+ * @cssprop [--lr-flow-minimap-inline-size=12rem] - Map inline size.
+ * @cssprop [--lr-flow-minimap-block-size=8rem] - Map block size.
  */
 export declare class LyraFlowMinimap extends LyraElement {
     static styles: import("lit").CSSResultGroup[];
-    /** Id of the target `lyra-flow-canvas`. When empty, the nearest ancestor is used (the
+    /** Id of the target `lr-flow-canvas`. When empty, the nearest ancestor is used (the
      *  slotted-into-a-corner-slot case, the primary wiring). */
     for: string;
     /** Accessible name for the map region; falls back to a host `aria-label`, then `flowMinimapLabel`. */
@@ -33,7 +33,7 @@ export declare class LyraFlowMinimap extends LyraElement {
      *  to `false`) the next time `onMapClick` runs, so a genuine click on the map still centers it. */
     private justDraggedViewport;
     /** Watches the root for DOM changes while no canvas has resolved yet, so a `for` target or
-     *  ancestor `lyra-flow-canvas` that mounts after this element does still gets picked up instead
+     *  ancestor `lr-flow-canvas` that mounts after this element does still gets picked up instead
      *  of leaving this element permanently blank. Disconnected once a canvas resolves. */
     private canvasWatcher?;
     connectedCallback(): void;
@@ -56,7 +56,7 @@ export declare class LyraFlowMinimap extends LyraElement {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        'lyra-flow-minimap': LyraFlowMinimap;
+        'lr-flow-minimap': LyraFlowMinimap;
     }
 }
 //# sourceMappingURL=flow-minimap.class.d.ts.map

package/dist/components/flow-minimap/flow-minimap.class.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flow-minimap.class.d.ts","sourceRoot":"","sources":["../../../src/components/flow-minimap/flow-minimap.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,cAAc,EAA0B,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE3G,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAgB7D;;;;;;;;;;;;;;GAcG;AACH,qBAAa,eAAgB,SAAQ,WAAW;IAC9C,MAAM,CAAC,MAAM,iCAAgC;IAE7C;gEAC4D;IAChD,GAAG,SAAM;IACrB,sGAAsG;IAC1F,KAAK,SAAM;IAEd,OAAO,CAAC,QAAQ,CAAsC;IAC/D,OAAO,CAAC,QAAQ,CAAC,CAAiB;IAClC,OAAO,CAAC,WAAW,CAAC,CAAa;IACjC,OAAO,CAAC,SAAS,CAAC,CAA2H;IAC7I;;;;uGAImG;IACnG,OAAO,CAAC,mBAAmB,CAAS;IACpC;;0FAEsF;IACtF,OAAO,CAAC,aAAa,CAAC,CAAmB;IAEzC,iBAAiB,IAAI,IAAI,CAGxB;IAED,oBAAoB,IAAI,IAAI,CAc3B;IAOD,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAUlD;IAED,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,gBAAgB;IAcxB,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,aAAa;IAgBrB,OAAO,CAAC,mBAAmB;IAM3B,OAAO,CAAC,oBAAoB;IAU5B,OAAO,CAAC,UAAU,CAShB;IAEF,OAAO,CAAC,UAAU,CAKhB;IAEF,OAAO,CAAC,qBAAqB,CAY3B;IAEF,OAAO,CAAC,qBAAqB,CAe3B;IAEF,OAAO,CAAC,mBAAmB,CAOzB;IAEF,OAAO,CAAC,iBAAiB,CAmCvB;IAEF,OAAO,CAAC,WAAW;IAMnB,MAAM,IAAI,cAAc,CAmCvB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,mBAAmB,EAAE,eAAe,CAAC;KACtC;CACF"}
+{"version":3,"file":"flow-minimap.class.d.ts","sourceRoot":"","sources":["../../../src/components/flow-minimap/flow-minimap.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,cAAc,EAA0B,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE3G,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAgB7D;;;;;;;;;;;;;;GAcG;AACH,qBAAa,eAAgB,SAAQ,WAAW;IAC9C,MAAM,CAAC,MAAM,iCAAgC;IAE7C;gEAC4D;IAChD,GAAG,SAAM;IACrB,sGAAsG;IAC1F,KAAK,SAAM;IAEd,OAAO,CAAC,QAAQ,CAAsC;IAC/D,OAAO,CAAC,QAAQ,CAAC,CAAiB;IAClC,OAAO,CAAC,WAAW,CAAC,CAAa;IACjC,OAAO,CAAC,SAAS,CAAC,CAA2H;IAC7I;;;;uGAImG;IACnG,OAAO,CAAC,mBAAmB,CAAS;IACpC;;0FAEsF;IACtF,OAAO,CAAC,aAAa,CAAC,CAAmB;IAEzC,iBAAiB,IAAI,IAAI,CAGxB;IAED,oBAAoB,IAAI,IAAI,CAc3B;IAOD,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAUlD;IAED,OAAO,CAAC,aAAa;IAUrB,OAAO,CAAC,gBAAgB;IAcxB,OAAO,CAAC,cAAc;IAOtB,OAAO,CAAC,aAAa;IAgBrB,OAAO,CAAC,mBAAmB;IAM3B,OAAO,CAAC,oBAAoB;IAU5B,OAAO,CAAC,UAAU,CAShB;IAEF,OAAO,CAAC,UAAU,CAKhB;IAEF,OAAO,CAAC,qBAAqB,CAY3B;IAEF,OAAO,CAAC,qBAAqB,CAe3B;IAEF,OAAO,CAAC,mBAAmB,CAOzB;IAEF,OAAO,CAAC,iBAAiB,CAmCvB;IAEF,OAAO,CAAC,WAAW;IAMnB,MAAM,IAAI,cAAc,CAmCvB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,iBAAiB,EAAE,eAAe,CAAC;KACpC;CACF"}

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

@@ -10,24 +10,24 @@ import { LyraElement } from '../../internal/lyra-element.js';
 import { tag } from '../../internal/prefix.js';
 import { styles } from './flow-minimap.styles.js';
 /**
- * `<lyra-flow-minimap>` — a corner overview map of a `lyra-flow-canvas`: scaled node rectangles plus
+ * `<lr-flow-minimap>` — a corner overview map of a `lr-flow-canvas`: scaled node rectangles plus
  * a draggable viewport rectangle, for orientation and fast navigation on canvases larger than the
  * screen. Draws no edges (nodes only, matching the React Flow/n8n minimap convention) and never
  * reads `nodes` itself — geometry always comes from the canvas's `registerCompanion()` snapshots, so
  * the two can never disagree.
  *
- * @customElement lyra-flow-minimap
+ * @customElement lr-flow-minimap
  * @csspart base - The root wrapper.
  * @csspart map - The scaled SVG.
  * @csspart node - One rect per node.
  * @csspart viewport - The draggable, focusable view rectangle.
- * @cssprop [--lyra-flow-minimap-inline-size=12rem] - Map inline size.
- * @cssprop [--lyra-flow-minimap-block-size=8rem] - Map block size.
+ * @cssprop [--lr-flow-minimap-inline-size=12rem] - Map inline size.
+ * @cssprop [--lr-flow-minimap-block-size=8rem] - Map block size.
  */
 export class LyraFlowMinimap extends LyraElement {
     constructor() {
         super(...arguments);
-        /** Id of the target `lyra-flow-canvas`. When empty, the nearest ancestor is used (the
+        /** Id of the target `lr-flow-canvas`. When empty, the nearest ancestor is used (the
          *  slotted-into-a-corner-slot case, the primary wiring). */
         this.for = '';
         /** Accessible name for the map region; falls back to a host `aria-label`, then `flowMinimapLabel`. */

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

@@ -2,15 +2,15 @@ import { css } from 'lit';
 export const styles = css `
   :host {
     display: block;
-    inline-size: var(--lyra-flow-minimap-inline-size, var(--lyra-size-12rem));
-    block-size: var(--lyra-flow-minimap-block-size, var(--lyra-size-8rem));
+    inline-size: var(--lr-flow-minimap-inline-size, var(--lr-size-12rem));
+    block-size: var(--lr-flow-minimap-block-size, var(--lr-size-8rem));
   }
   [part='base'] {
     inline-size: 100%;
     block-size: 100%;
-    border: var(--lyra-border-width-thin) solid var(--lyra-color-border);
-    border-radius: var(--lyra-radius);
-    background: var(--lyra-color-surface);
+    border: var(--lr-border-width-thin) solid var(--lr-color-border);
+    border-radius: var(--lr-radius);
+    background: var(--lr-color-surface);
     overflow: hidden;
   }
   [part='map'] {
@@ -20,29 +20,29 @@ export const styles = css `
     cursor: pointer;
   }
   [part='node'] {
-    fill: var(--lyra-color-border-strong);
+    fill: var(--lr-color-border-strong);
   }
   [part='node'][data-status='running'] {
-    fill: var(--lyra-color-brand);
+    fill: var(--lr-color-brand);
   }
   [part='node'][data-status='success'] {
-    fill: var(--lyra-color-success);
+    fill: var(--lr-color-success);
   }
   [part='node'][data-status='error'] {
-    fill: var(--lyra-color-danger);
+    fill: var(--lr-color-danger);
   }
   [part='node'][data-status='denied'] {
-    fill: var(--lyra-color-warning);
+    fill: var(--lr-color-warning);
   }
   [part='viewport'] {
-    fill: color-mix(in srgb, var(--lyra-color-brand) 15%, transparent);
-    stroke: var(--lyra-color-brand);
+    fill: color-mix(in srgb, var(--lr-color-brand) 15%, transparent);
+    stroke: var(--lr-color-brand);
     stroke-width: 2;
     cursor: grab;
   }
   [part='viewport']:focus-visible {
-    outline: var(--lyra-focus-ring-width) solid var(--lyra-focus-ring-color);
-    outline-offset: var(--lyra-focus-ring-offset);
+    outline: var(--lr-focus-ring-width) solid var(--lr-focus-ring-color);
+    outline-offset: var(--lr-focus-ring-offset);
   }
 `;
 //# sourceMappingURL=flow-minimap.styles.js.map

package/dist/components/flow-node/flow-node.class.d.ts

@@ -2,13 +2,13 @@ import { type TemplateResult, type PropertyValues } from 'lit';
 import { LyraElement } from '../../internal/lyra-element.js';
 import type { FlowHandle, FlowRunStatus } from '../flow-canvas/flow-canvas.class.js';
 /**
- * `<lyra-flow-node>` — the card a workflow node renders as: header/body/toolbar chrome,
+ * `<lr-flow-node>` — the card a workflow node renders as: header/body/toolbar chrome,
  * tool-lifecycle status tones, and the named connection-handle elements edges anchor to. Used as
- * `lyra-flow-canvas`'s default card and as a slotted override; also renders standalone (palette
+ * `lr-flow-canvas`'s default card and as a slotted override; also renders standalone (palette
  * previews, docs). Purely presentational — activation, selection, movement, and connection are all
- * `lyra-flow-canvas` events; this component owns none of that.
+ * `lr-flow-canvas` events; this component owns none of that.
  *
- * @customElement lyra-flow-node
+ * @customElement lr-flow-node
  * @slot - Body content.
  * @slot icon - Leading header glyph.
  * @slot header - Replaces the built-in heading row entirely.
@@ -24,7 +24,7 @@ import type { FlowHandle, FlowRunStatus } from '../flow-canvas/flow-canvas.class
  * @csspart handle - Every handle dot (input or output).
  * @csspart handle-input - An input handle dot (also carries the shared `handle` part).
  * @csspart handle-output - An output handle dot (also carries the shared `handle` part).
- * @cssprop [--lyra-flow-node-min-inline-size=11rem] - Minimum card inline size.
+ * @cssprop [--lr-flow-node-min-inline-size=11rem] - Minimum card inline size.
  */
 export declare class LyraFlowNode extends LyraElement {
     static styles: import("lit").CSSResultGroup[];
@@ -64,7 +64,7 @@ export declare class LyraFlowNode extends LyraElement {
 }
 declare global {
     interface HTMLElementTagNameMap {
-        'lyra-flow-node': LyraFlowNode;
+        'lr-flow-node': LyraFlowNode;
     }
 }
 //# sourceMappingURL=flow-node.class.d.ts.map

package/dist/components/flow-node/flow-node.class.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"flow-node.class.d.ts","sourceRoot":"","sources":["../../../src/components/flow-node/flow-node.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9E,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AAQrF;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,qBAAa,YAAa,SAAQ,WAAW;IAC3C,MAAM,CAAC,MAAM,iCAAgC;IAET,MAAM,SAAM;IACpC,OAAO,SAAM;IACI,MAAM,EAAE,aAAa,GAAG,IAAI,CAAQ;IACrC,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAQ;IACjB,YAAY,SAAM;IACN,UAAU,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC3C,QAAQ,UAAS;IAC7B,MAAM,EAAE,UAAU,EAAE,CAAkB;IACtC,OAAO,EAAE,UAAU,EAAE,CAAmB;IACxE;qFACiF;IACpD,WAAW,EAAE,YAAY,GAAG,UAAU,CAAgB;IAE1E,OAAO,CAAC,aAAa,CAAS;IAEvC,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAKlD;IAED,OAAO,CAAC,kBAAkB,CAExB;IAEF;;;;;6EAKyE;IACzE,OAAO,KAAK,YAAY,GAEvB;IAED;;;2FAGuF;IACvF,OAAO,KAAK,cAAc,GAEzB;IAED,OAAO,CAAC,WAAW;IAiBnB,OAAO,CAAC,cAAc;IAYtB,MAAM,IAAI,cAAc,CAyBvB;IAED,OAAO,CAAC,iBAAiB;IAQzB,OAAO,CAAC,UAAU;IAOlB,OAAO,KAAK,UAAU,GAErB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,gBAAgB,EAAE,YAAY,CAAC;KAChC;CACF"}
+{"version":3,"file":"flow-node.class.d.ts","sourceRoot":"","sources":["../../../src/components/flow-node/flow-node.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAE9E,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,qCAAqC,CAAC;AAQrF;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,qBAAa,YAAa,SAAQ,WAAW;IAC3C,MAAM,CAAC,MAAM,iCAAgC;IAET,MAAM,SAAM;IACpC,OAAO,SAAM;IACI,MAAM,EAAE,aAAa,GAAG,IAAI,CAAQ;IACrC,QAAQ,EAAE,MAAM,GAAG,IAAI,CAAQ;IACjB,YAAY,SAAM;IACN,UAAU,EAAE,MAAM,GAAG,IAAI,CAAQ;IAC3C,QAAQ,UAAS;IAC7B,MAAM,EAAE,UAAU,EAAE,CAAkB;IACtC,OAAO,EAAE,UAAU,EAAE,CAAmB;IACxE;qFACiF;IACpD,WAAW,EAAE,YAAY,GAAG,UAAU,CAAgB;IAE1E,OAAO,CAAC,aAAa,CAAS;IAEvC,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,GAAG,IAAI,CAKlD;IAED,OAAO,CAAC,kBAAkB,CAExB;IAEF;;;;;6EAKyE;IACzE,OAAO,KAAK,YAAY,GAEvB;IAED;;;2FAGuF;IACvF,OAAO,KAAK,cAAc,GAEzB;IAED,OAAO,CAAC,WAAW;IAiBnB,OAAO,CAAC,cAAc;IAYtB,MAAM,IAAI,cAAc,CAyBvB;IAED,OAAO,CAAC,iBAAiB;IAQzB,OAAO,CAAC,UAAU;IAOlB,OAAO,KAAK,UAAU,GAErB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,YAAY,CAAC;KAC9B;CACF"}

package/dist/components/flow-node/flow-node.class.js

@@ -13,13 +13,13 @@ import { styles } from './flow-node.styles.js';
 const DEFAULT_INPUTS = [{ id: 'in' }];
 const DEFAULT_OUTPUTS = [{ id: 'out' }];
 /**
- * `<lyra-flow-node>` — the card a workflow node renders as: header/body/toolbar chrome,
+ * `<lr-flow-node>` — the card a workflow node renders as: header/body/toolbar chrome,
  * tool-lifecycle status tones, and the named connection-handle elements edges anchor to. Used as
- * `lyra-flow-canvas`'s default card and as a slotted override; also renders standalone (palette
+ * `lr-flow-canvas`'s default card and as a slotted override; also renders standalone (palette
  * previews, docs). Purely presentational — activation, selection, movement, and connection are all
- * `lyra-flow-canvas` events; this component owns none of that.
+ * `lr-flow-canvas` events; this component owns none of that.
  *
- * @customElement lyra-flow-node
+ * @customElement lr-flow-node
  * @slot - Body content.
  * @slot icon - Leading header glyph.
  * @slot header - Replaces the built-in heading row entirely.
@@ -35,7 +35,7 @@ const DEFAULT_OUTPUTS = [{ id: 'out' }];
  * @csspart handle - Every handle dot (input or output).
  * @csspart handle-input - An input handle dot (also carries the shared `handle` part).
  * @csspart handle-output - An output handle dot (also carries the shared `handle` part).
- * @cssprop [--lyra-flow-node-min-inline-size=11rem] - Minimum card inline size.
+ * @cssprop [--lr-flow-node-min-inline-size=11rem] - Minimum card inline size.
  */
 export class LyraFlowNode extends LyraElement {
     constructor() {

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

@@ -8,7 +8,7 @@ export const styles = css `
     display: flex;
     flex-direction: row;
     align-items: stretch;
-    gap: var(--lyra-space-xs);
+    gap: var(--lr-space-xs);
   }
   :host([orientation='vertical']) [part='base'] {
     flex-direction: column;
@@ -18,82 +18,82 @@ export const styles = css `
     flex-direction: column;
     justify-content: space-around;
     align-items: center;
-    inline-size: var(--lyra-space-l);
+    inline-size: var(--lr-space-l);
     flex: 0 0 auto;
   }
   :host([orientation='vertical']) .handles {
     flex-direction: row;
     inline-size: auto;
-    block-size: var(--lyra-space-l);
+    block-size: var(--lr-space-l);
   }
   .handle {
-    inline-size: var(--lyra-size-0-5rem);
-    block-size: var(--lyra-size-0-5rem);
-    border-radius: var(--lyra-radius-pill);
-    background: var(--lyra-color-border-strong);
+    inline-size: var(--lr-size-0-5rem);
+    block-size: var(--lr-size-0-5rem);
+    border-radius: var(--lr-radius-pill);
+    background: var(--lr-color-border-strong);
     flex: 0 0 auto;
   }
   .card {
     flex: 1 1 auto;
-    min-inline-size: var(--lyra-flow-node-min-inline-size, calc(var(--lyra-size-10rem) + var(--lyra-size-1rem)));
+    min-inline-size: var(--lr-flow-node-min-inline-size, calc(var(--lr-size-10rem) + var(--lr-size-1rem)));
     display: flex;
     flex-direction: column;
-    gap: var(--lyra-space-2xs);
-    padding: var(--lyra-space-s);
-    border: var(--lyra-border-width-thin) solid var(--lyra-color-border);
-    border-radius: var(--lyra-radius);
-    background: var(--lyra-color-surface);
-    box-shadow: var(--lyra-shadow);
+    gap: var(--lr-space-2xs);
+    padding: var(--lr-space-s);
+    border: var(--lr-border-width-thin) solid var(--lr-color-border);
+    border-radius: var(--lr-radius);
+    background: var(--lr-color-surface);
+    box-shadow: var(--lr-shadow);
     min-inline-size: 0;
   }
   :host([selected]) .card {
-    border-color: var(--lyra-color-brand);
+    border-color: var(--lr-color-brand);
   }
   [part='header'] {
     display: flex;
     align-items: center;
-    gap: var(--lyra-space-xs);
+    gap: var(--lr-space-xs);
     min-inline-size: 0;
   }
   [part='heading'] {
-    font-weight: var(--lyra-font-weight-medium);
+    font-weight: var(--lr-font-weight-medium);
     overflow-wrap: anywhere;
   }
   [part='status'] {
     display: flex;
     align-items: center;
-    gap: var(--lyra-space-2xs);
-    font-size: var(--lyra-font-size-xs);
-    color: var(--lyra-color-text-muted);
+    gap: var(--lr-space-2xs);
+    font-size: var(--lr-font-size-xs);
+    color: var(--lr-color-text-muted);
   }
   .status-dot {
-    inline-size: var(--lyra-size-0-5rem);
-    block-size: var(--lyra-size-0-5rem);
-    border-radius: var(--lyra-radius-pill);
-    background: var(--lyra-color-border-strong);
+    inline-size: var(--lr-size-0-5rem);
+    block-size: var(--lr-size-0-5rem);
+    border-radius: var(--lr-radius-pill);
+    background: var(--lr-color-border-strong);
     flex: 0 0 auto;
   }
-  [part='status'][data-status='running'] .status-dot { background: var(--lyra-color-brand); }
-  [part='status'][data-status='success'] .status-dot { background: var(--lyra-color-success); }
-  [part='status'][data-status='error'] .status-dot { background: var(--lyra-color-danger); }
-  [part='status'][data-status='denied'] .status-dot { background: var(--lyra-color-warning); }
+  [part='status'][data-status='running'] .status-dot { background: var(--lr-color-brand); }
+  [part='status'][data-status='success'] .status-dot { background: var(--lr-color-success); }
+  [part='status'][data-status='error'] .status-dot { background: var(--lr-color-danger); }
+  [part='status'][data-status='denied'] .status-dot { background: var(--lr-color-warning); }
   [part='progress'] {
     inline-size: 100%;
-    block-size: var(--lyra-size-2px);
-    background: var(--lyra-color-border);
-    border-radius: var(--lyra-radius-pill);
+    block-size: var(--lr-size-2px);
+    background: var(--lr-color-border);
+    border-radius: var(--lr-radius-pill);
     overflow: hidden;
   }
   .progress-fill {
     block-size: 100%;
-    background: var(--lyra-color-brand);
+    background: var(--lr-color-brand);
   }
   [part='body']:empty {
     display: none;
   }
   [part='toolbar'] {
     display: flex;
-    gap: var(--lyra-space-2xs);
+    gap: var(--lr-space-2xs);
     justify-content: flex-end;
     opacity: 0;
   }
@@ -105,11 +105,11 @@ export const styles = css `
     opacity: 1;
   }
   .card[data-pulse] {
-    animation: lyra-flow-node-pulse var(--lyra-transition-ambient) ease-in-out infinite;
+    animation: lr-flow-node-pulse var(--lr-transition-ambient) ease-in-out infinite;
   }
   :host([status='running']) .card {
-    border-color: var(--lyra-color-brand);
-    box-shadow: 0 0 0 var(--lyra-size-2px) var(--lyra-color-brand-quiet);
+    border-color: var(--lr-color-brand);
+    box-shadow: 0 0 0 var(--lr-size-2px) 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. */
@@ -118,9 +118,9 @@ export const styles = css `
       animation: none;
     }
   }
-  @keyframes lyra-flow-node-pulse {
+  @keyframes lr-flow-node-pulse {
     50% {
-      box-shadow: 0 0 0 var(--lyra-size-4px) var(--lyra-color-brand-quiet);
+      box-shadow: 0 0 0 var(--lr-size-4px) var(--lr-color-brand-quiet);
     }
   }
 `;