@aceshooting/lyra-ui 3.7.0 → 3.9.0

package/dist/components/svg-viewer/svg-viewer.class.js

@@ -11,18 +11,29 @@ import { LyraElement } from '../../internal/lyra-element.js';
 import { safeFetchUrl } from '../../internal/safe-url.js';
 import { isAbortError, isResourceLimitError, LyraUserFacingError, readResponseText } from '../../internal/resource-loader.js';
 import { srOnly } from '../../internal/a11y.js';
+import { prefersReducedMotion } from '../../internal/motion.js';
 import { loadSvgSanitizer } from './dompurify-loader.js';
 import { styles } from './svg-viewer.styles.js';
+import '../zoomable-frame/zoomable-frame.js';
 /**
  * Fetches and safely renders an inline SVG document.
  *
  * @customElement lyra-svg-viewer
  * @event lyra-render-error - Fired when fetching or sanitizing the document fails.
+ * @event lyra-highlight-activate - A region highlight was activated. `detail: { id }`.
  * @csspart base - The root container.
  * @csspart body - The wrapper around the fetched-state content.
  * @csspart svg - The sanitized SVG document, once loaded.
  * @csspart spinner - The loading region.
  * @csspart error - The error region.
+ * @csspart frame-viewport - Forwarded from the internal `<lyra-zoomable-frame>` when `zoomable`.
+ * @csspart frame-content - Forwarded from the internal `<lyra-zoomable-frame>` when `zoomable`.
+ * @csspart frame-controls - Forwarded from the internal `<lyra-zoomable-frame>` when `zoomable`.
+ * @csspart frame-zoom-in - Forwarded from the internal `<lyra-zoomable-frame>` when `zoomable`.
+ * @csspart frame-zoom-out - Forwarded from the internal `<lyra-zoomable-frame>` when `zoomable`.
+ * @csspart frame-reset - Forwarded from the internal `<lyra-zoomable-frame>` when `zoomable`.
+ * @csspart highlight-layer - The wrapper around every rendered region highlight.
+ * @csspart region-highlight - One region highlight (`data-tone`, `data-active`).
  * @cssprop [--lyra-svg-viewer-max-height=none] - Maximum block size of the scrollable body before it scrolls internally. Also settable via the `max-height` property.
  */
 export class LyraSvgViewer extends LyraElement {
@@ -34,6 +45,14 @@ export class LyraSvgViewer extends LyraElement {
         this.name = '';
         /** CSS length that caps the scrollable body. */
         this.maxHeight = '';
+        /** Wraps the rendered content in an internal `<lyra-zoomable-frame>`. `false` (the default)
+         *  preserves today's exact DOM -- an inline thumbnail (e.g. in a chat stream) must not
+         *  unexpectedly grow a focusable zoom-chrome viewport; an inspection surface opts in. */
+        this.zoomable = false;
+        /** Display-only region highlights (see the class doc's Boundaries note -- no creation UI here). */
+        this.highlights = [];
+        this.activeHighlightId = null;
+        this.anchorKinds = ['region'];
         this.fetchState = { kind: 'idle' };
         this.generation = 0;
     }
@@ -79,7 +98,7 @@ export class LyraSvgViewer extends LyraElement {
     renderBody() {
         switch (this.fetchState.kind) {
             case 'loaded':
-                return html `<div part="svg" role="img" aria-label=${this.name || this.localize('svgViewerLabel')}>${unsafeSVG(this.fetchState.markup)}</div>`;
+                return this.renderZoomableWrapper(html `<div part="svg" role="img" aria-label=${this.name || this.localize('svgViewerLabel')}>${unsafeSVG(this.fetchState.markup)}</div>`);
             case 'loading':
                 return html `<div part="spinner" role="status"><span class="sr-only">${this.localize('loadingDocument')}</span></div>`;
             case 'error':
@@ -89,6 +108,65 @@ export class LyraSvgViewer extends LyraElement {
                 return html `<p class="empty-note">${this.localize('documentPreviewEmpty', undefined, { type: this.localize('documentPreviewTypeImage') })}</p>`;
         }
     }
+    /** Wraps `content` in the internal `<lyra-zoomable-frame>` when `zoomable`; otherwise renders it
+     *  (plus the highlight layer, which needs the same relatively-positioned sibling context either
+     *  way) unwrapped, preserving pre-`zoomable` DOM exactly. */
+    renderZoomableWrapper(content) {
+        const inner = html `<div class="zoom-content">${content}${this.renderHighlightLayer()}</div>`;
+        if (!this.zoomable)
+            return inner;
+        return html `<lyra-zoomable-frame
+      exportparts="viewport:frame-viewport, content:frame-content, controls:frame-controls, zoom-in:frame-zoom-in, zoom-out:frame-zoom-out, reset:frame-reset"
+    >${inner}</lyra-zoomable-frame>`;
+    }
+    renderHighlightLayer() {
+        const regionHighlights = this.highlights.filter((h) => h.anchor.kind === 'region');
+        if (!regionHighlights.length)
+            return nothing;
+        // Region rects are physical percent-of-render coordinates and the rendered SVG never
+        // mirrors, so position with physical left/top -- logical inset-inline-start would flip the
+        // overlay under RTL while the render underneath stays put.
+        return html `<div part="highlight-layer">
+      ${regionHighlights.map((h) => html `<div
+          part="region-highlight"
+          data-id=${h.id}
+          data-tone=${h.tone ?? 'accent'}
+          ?data-active=${h.id === this.activeHighlightId}
+          style="left:${h.anchor.rect.x}%;top:${h.anchor.rect.y}%;width:${h.anchor.rect.width}%;height:${h.anchor.rect.height}%"
+          tabindex="0"
+          role="button"
+          aria-label=${h.label || this.localize('viewerHighlightLabel')}
+          @click=${() => this.emit('lyra-highlight-activate', { id: h.id })}
+          @keydown=${(e) => {
+            if (e.key === 'Enter' || e.key === ' ') {
+                e.preventDefault();
+                this.emit('lyra-highlight-activate', { id: h.id });
+            }
+        }}
+        ></div>`)}
+    </div>`;
+    }
+    /** Scrolls a `region` highlight into view (by id, or a `LyraAnchor` directly -- matched back to
+     *  its owning `LyraHighlight` by reference so `scrollToAnchor(highlight.anchor)` also resolves to
+     *  the right box). Returns whether a matching, currently-rendered region was found -- there's no
+     *  retry loop here (unlike the full `DocumentAnchorTarget` mixin) because this viewer's content
+     *  is either already loaded or isn't; a caller invoking this before `src` has resolved simply
+     *  gets `false`. */
+    async scrollToAnchor(target) {
+        const highlight = typeof target === 'string'
+            ? this.highlights.find((h) => h.id === target)
+            : this.highlights.find((h) => h.anchor === target);
+        const anchor = highlight ? highlight.anchor : typeof target === 'string' ? undefined : target;
+        if (!anchor || anchor.kind !== 'region' || this.fetchState.kind !== 'loaded')
+            return false;
+        await this.updateComplete;
+        const region = highlight
+            ? this.renderRoot.querySelector(`[part="region-highlight"][data-id="${CSS.escape(highlight.id)}"]`)
+            : this.renderRoot.querySelector('[part="region-highlight"]');
+        const behavior = prefersReducedMotion() ? 'auto' : 'smooth';
+        region?.scrollIntoView({ behavior, block: 'center', inline: 'center' });
+        return true;
+    }
     render() {
         return html `<div part="base" style=${this.maxHeight ? `--lyra-svg-viewer-max-height:${this.maxHeight}` : nothing}>
       <div part="body">${this.renderBody()}</div>
@@ -104,6 +182,15 @@ __decorate([
 __decorate([
     property({ attribute: 'max-height' })
 ], LyraSvgViewer.prototype, "maxHeight", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LyraSvgViewer.prototype, "zoomable", void 0);
+__decorate([
+    property({ attribute: false })
+], LyraSvgViewer.prototype, "highlights", void 0);
+__decorate([
+    property({ attribute: 'active-highlight-id' })
+], LyraSvgViewer.prototype, "activeHighlightId", void 0);
 __decorate([
     state()
 ], LyraSvgViewer.prototype, "fetchState", void 0);

package/dist/components/svg-viewer/svg-viewer.class.js.map

@@ -1 +1 @@
-{"version":3,"file":"svg-viewer.class.js","sourceRoot":"","sources":["../../../src/components/svg-viewer/svg-viewer.class.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"svg-viewer.class.js","sourceRoot":"","sources":["../../../src/components/svg-viewer/svg-viewer.class.ts"],"names":[],"mappings":"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"}

package/dist/components/svg-viewer/svg-viewer.js

@@ -11,5 +11,6 @@ registerDocumentRenderer('image/svg+xml', {
         element.name = file.name;
         return element;
     },
+    capabilities: { anchors: ['region'], search: false, textSelect: false },
 });
 //# sourceMappingURL=svg-viewer.js.map

package/dist/components/svg-viewer/svg-viewer.js.map

@@ -1 +1 @@
-{"version":3,"file":"svg-viewer.js","sourceRoot":"","sources":["../../../src/components/svg-viewer/svg-viewer.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EAAE,wBAAwB,EAAqB,MAAM,gCAAgC,CAAC;AAE7F,aAAa,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC;AAE3C,wBAAwB,CAAC,eAAe,EAAE;IACxC,OAAO,EAAE,CAAC,IAAkB,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC;IACzE,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE;QACf,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;QAC1D,OAAO,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC;QACvB,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QACzB,OAAO,OAAO,CAAC;IACjB,CAAC;CACF,CAAC,CAAC"}
+{"version":3,"file":"svg-viewer.js","sourceRoot":"","sources":["../../../src/components/svg-viewer/svg-viewer.ts"],"names":[],"mappings":"AAAA,cAAc,uBAAuB,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AACzD,OAAO,EAAE,wBAAwB,EAAqB,MAAM,gCAAgC,CAAC;AAE7F,aAAa,CAAC,YAAY,EAAE,aAAa,CAAC,CAAC;AAE3C,wBAAwB,CAAC,eAAe,EAAE;IACxC,OAAO,EAAE,CAAC,IAAkB,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC;IACzE,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE;QACf,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,iBAAiB,CAAC,CAAC;QAC1D,OAAO,CAAC,GAAG,GAAG,IAAI,CAAC,GAAG,CAAC;QACvB,OAAO,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC;QACzB,OAAO,OAAO,CAAC;IACjB,CAAC;IACD,YAAY,EAAE,EAAE,OAAO,EAAE,CAAC,QAAQ,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE;CACxE,CAAC,CAAC"}

package/dist/components/svg-viewer/svg-viewer.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"svg-viewer.styles.d.ts","sourceRoot":"","sources":["../../../src/components/svg-viewer/svg-viewer.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAqDlB,CAAC"}
+{"version":3,"file":"svg-viewer.styles.d.ts","sourceRoot":"","sources":["../../../src/components/svg-viewer/svg-viewer.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAuElB,CAAC"}

package/dist/components/svg-viewer/svg-viewer.styles.js

@@ -52,5 +52,23 @@ export const styles = css `
     display: flex;
     justify-content: center;
   }
+  .zoom-content {
+    position: relative;
+  }
+  [part='highlight-layer'] {
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+  }
+  [part='region-highlight'] {
+    position: absolute;
+    pointer-events: auto;
+    border: var(--lyra-border-width-thick) solid var(--lyra-color-brand);
+    border-radius: var(--lyra-radius-xs);
+    cursor: pointer;
+  }
+  [part='region-highlight'][data-active] {
+    border-color: var(--lyra-color-warning, var(--lyra-color-brand));
+  }
 `;
 //# sourceMappingURL=svg-viewer.styles.js.map

package/dist/components/svg-viewer/svg-viewer.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"svg-viewer.styles.js","sourceRoot":"","sources":["../../../src/components/svg-viewer/svg-viewer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqDxB,CAAC"}
+{"version":3,"file":"svg-viewer.styles.js","sourceRoot":"","sources":["../../../src/components/svg-viewer/svg-viewer.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuExB,CAAC"}

package/dist/components/swatch-picker/swatch-picker.class.d.ts

@@ -7,6 +7,10 @@ export interface SwatchOption {
     color: string;
     /** The swatch's accessible name; also used as its native `title` tooltip. */
     label: string;
+    /** Optional custom shape rendered in place of the plain filled circle -- e.g. a gem or other
+     *  brand-specific glyph. A `currentColor`-based SVG (fill or stroke) picks up `color` automatically
+     *  via the swatch's `color` CSS property, matching `<lyra-segmented>`'s `SegmentedItem.icon` field. */
+    icon?: unknown;
 }
 export interface LyraSwatchPickerEventMap {
     'lyra-change': CustomEvent<{
@@ -25,10 +29,22 @@ export interface LyraSwatchPickerEventMap {
  * @event lyra-change - Fired when the selected value changes via click or keyboard.
  *   `detail: { value }`.
  * @csspart base - The `role="radiogroup"` root.
- * @csspart swatch - A single `role="radio"` color swatch; the selected one is
- *   `[part='swatch'][aria-checked='true']`.
+ * @csspart swatch - A single `role="radio"` color swatch's interactive hit target; sized to the
+ *   shared minimum tappable size (`--lyra-icon-button-size`), independent of the smaller visible
+ *   fill/icon rendered inside it. The selected one is `[part='swatch'][aria-checked='true']`.
+ * @csspart swatch-fill - The compact filled circle rendered when the option has no custom `icon`.
+ * @csspart swatch-icon - Optional custom shape supplied by the option's `icon` field; when present it
+ *   replaces `swatch-fill` and the swatch renders unfilled/unbordered behind it.
  * @cssprop [--lyra-swatch-picker-selected-color=var(--lyra-color-brand)] - Ring color drawn around
  *   the selected swatch, themeable independently of the focus ring and every other ring color.
+ * @cssprop [--lyra-swatch-picker-selected-blur=0px] - Blur radius of that same ring. 0 by default
+ *   (a crisp ring); set a real length (e.g. 0.4rem) for a soft glow instead.
+ * @cssprop [--lyra-swatch-picker-shine-duration=0s] - Duration of a rhythmic brighten-and-settle
+ *   "shine" on the selected swatch. `0s` (the default) is a no-op -- today's static look for every
+ *   existing consumer. Set a real duration (e.g. 1.6s) for a pulsing shine; disabled outright under
+ *   `prefers-reduced-motion: reduce`. Independent of `--lyra-swatch-picker-selected-blur` (a separate
+ *   `filter: brightness()` animation, not `box-shadow`), so the two compose freely, and works
+ *   identically for a plain color circle and an icon swatch alike.
  */
 export declare class LyraSwatchPicker extends LyraElement<LyraSwatchPickerEventMap> {
     static styles: import("lit").CSSResultGroup[];

package/dist/components/swatch-picker/swatch-picker.class.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"swatch-picker.class.d.ts","sourceRoot":"","sources":["../../../src/components/swatch-picker/swatch-picker.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIzD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAI7D,MAAM,WAAW,YAAY;IAC3B,mFAAmF;IACnF,KAAK,EAAE,MAAM,CAAC;IACd,6EAA6E;IAC7E,KAAK,EAAE,MAAM,CAAC;IACd,6EAA6E;IAC7E,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,wBAAwB;IACvC,aAAa,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAC/C;AAED;;;;;;;;;;;;;;;;GAgBG;AACH,qBAAa,gBAAiB,SAAQ,WAAW,CAAC,wBAAwB,CAAC;IACzE,MAAM,CAAC,MAAM,iCAAgC;IAE7C,uDAAuD;IACvB,OAAO,EAAE,YAAY,EAAE,CAAM;IAE7D,mFAAmF;IACvE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAExC;;;;8CAI0C;IAC9B,KAAK,SAAM;IAEvB,OAAO,CAAC,MAAM;IAMd,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,SAAS,CA6Bf;IAEF,MAAM,IAAI,cAAc,CA2BvB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,gBAAgB,CAAC;KACxC;CACF"}
+{"version":3,"file":"swatch-picker.class.d.ts","sourceRoot":"","sources":["../../../src/components/swatch-picker/swatch-picker.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAIzD,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAI7D,MAAM,WAAW,YAAY;IAC3B,mFAAmF;IACnF,KAAK,EAAE,MAAM,CAAC;IACd,6EAA6E;IAC7E,KAAK,EAAE,MAAM,CAAC;IACd,6EAA6E;IAC7E,KAAK,EAAE,MAAM,CAAC;IACd;;2GAEuG;IACvG,IAAI,CAAC,EAAE,OAAO,CAAC;CAChB;AAED,MAAM,WAAW,wBAAwB;IACvC,aAAa,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;CAC/C;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BG;AACH,qBAAa,gBAAiB,SAAQ,WAAW,CAAC,wBAAwB,CAAC;IACzE,MAAM,CAAC,MAAM,iCAAgC;IAE7C,uDAAuD;IACvB,OAAO,EAAE,YAAY,EAAE,CAAM;IAE7D,mFAAmF;IACvE,KAAK,EAAE,MAAM,GAAG,IAAI,CAAQ;IAExC;;;;8CAI0C;IAC9B,KAAK,SAAM;IAEvB,OAAO,CAAC,MAAM;IAMd,OAAO,CAAC,WAAW;IAOnB,OAAO,CAAC,SAAS,CA6Bf;IAEF,MAAM,IAAI,cAAc,CA+BvB;CACF;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,oBAAoB,EAAE,gBAAgB,CAAC;KACxC;CACF"}

package/dist/components/swatch-picker/swatch-picker.class.js

@@ -23,10 +23,22 @@ import { styles } from './swatch-picker.styles.js';
  * @event lyra-change - Fired when the selected value changes via click or keyboard.
  *   `detail: { value }`.
  * @csspart base - The `role="radiogroup"` root.
- * @csspart swatch - A single `role="radio"` color swatch; the selected one is
- *   `[part='swatch'][aria-checked='true']`.
+ * @csspart swatch - A single `role="radio"` color swatch's interactive hit target; sized to the
+ *   shared minimum tappable size (`--lyra-icon-button-size`), independent of the smaller visible
+ *   fill/icon rendered inside it. The selected one is `[part='swatch'][aria-checked='true']`.
+ * @csspart swatch-fill - The compact filled circle rendered when the option has no custom `icon`.
+ * @csspart swatch-icon - Optional custom shape supplied by the option's `icon` field; when present it
+ *   replaces `swatch-fill` and the swatch renders unfilled/unbordered behind it.
  * @cssprop [--lyra-swatch-picker-selected-color=var(--lyra-color-brand)] - Ring color drawn around
  *   the selected swatch, themeable independently of the focus ring and every other ring color.
+ * @cssprop [--lyra-swatch-picker-selected-blur=0px] - Blur radius of that same ring. 0 by default
+ *   (a crisp ring); set a real length (e.g. 0.4rem) for a soft glow instead.
+ * @cssprop [--lyra-swatch-picker-shine-duration=0s] - Duration of a rhythmic brighten-and-settle
+ *   "shine" on the selected swatch. `0s` (the default) is a no-op -- today's static look for every
+ *   existing consumer. Set a real duration (e.g. 1.6s) for a pulsing shine; disabled outright under
+ *   `prefers-reduced-motion: reduce`. Independent of `--lyra-swatch-picker-selected-blur` (a separate
+ *   `filter: brightness()` animation, not `box-shadow`), so the two compose freely, and works
+ *   identically for a plain color circle and an icon swatch alike.
  */
 export class LyraSwatchPicker extends LyraElement {
     constructor() {
@@ -103,7 +115,9 @@ export class LyraSwatchPicker extends LyraElement {
             tabindex=${index === tabbableIndex ? '0' : '-1'}
             style=${styleMap({ '--lyra-swatch-color': option.color })}
             @click=${() => this.select(option)}
-          ></button>`)}
+          >${option.icon
+            ? html `<span part="swatch-icon" aria-hidden="true">${option.icon}</span>`
+            : html `<span part="swatch-fill" aria-hidden="true"></span>`}</button>`)}
       </div>
     `;
     }

package/dist/components/swatch-picker/swatch-picker.class.js.map

@@ -1 +1 @@
-{"version":3,"file":"swatch-picker.class.js","sourceRoot":"","sources":["../../../src/components/swatch-picker/swatch-picker.class.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"swatch-picker.class.js","sourceRoot":"","sources":["../../../src/components/swatch-picker/swatch-picker.class.ts"],"names":[],"mappings":"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"}

package/dist/components/swatch-picker/swatch-picker.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"swatch-picker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/swatch-picker/swatch-picker.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAoDlB,CAAC"}
+{"version":3,"file":"swatch-picker.styles.d.ts","sourceRoot":"","sources":["../../../src/components/swatch-picker/swatch-picker.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,MAAM,yBAgIlB,CAAC"}

package/dist/components/swatch-picker/swatch-picker.styles.js

@@ -12,6 +12,24 @@ export const styles = css `
        selection indicator independently of the :focus-visible outline and every
        other ring color in the library, while defaulting to the brand color. */
     --lyra-swatch-picker-selected-color: var(--lyra-color-brand);
+    /* Blur radius of that same ring -- 0 by default (a crisp ring, today's look for every
+       existing consumer). A host that wants a soft glow instead sets this to a real length
+       (e.g. 0.4rem) rather than reaching for ::part(swatch)[aria-checked] from outside, which
+       isn't reliably selectable: the CSS Shadow Parts spec only allows a fixed set of
+       pseudo-classes after ::part(), not arbitrary attribute selectors, so that combinator can
+       silently fail to match depending on the engine. */
+    --lyra-swatch-picker-selected-blur: 0;
+    /* Pulsing "shine" duration for the selected swatch -- 0s (the default) is a no-op (today's
+       static look for every existing consumer, and unaffected by this token at all: a 0-duration
+       animation resolves to its end state instantly and imperceptibly). A host sets a real
+       duration (e.g. 1.6s) to make the selected swatch rhythmically brighten and settle back. A
+       separate filter: brightness() animation (not box-shadow, which
+       --lyra-swatch-picker-selected-blur above already owns) so the two compose freely without
+       fighting over the same CSS property, and so this reads identically for a plain color circle
+       and an icon swatch alike -- filter applies to the whole element including a slotted icon,
+       with no icon-specific branching needed (unlike the box-shadow/drop-shadow split below, which
+       needs one precisely because box-shadow doesn't reach into a transparent box's own content). */
+    --lyra-swatch-picker-shine-duration: 0s;
   }
   [part='base'] {
     display: inline-flex;
@@ -21,35 +39,93 @@ export const styles = css `
   }
   [part='swatch'] {
     box-sizing: border-box;
+    /* The interactive hit target meets the shared minimum tappable size (same
+       --lyra-icon-button-size floor as lyra-code-block's/lyra-json-viewer's [part='toggle']), while
+       the *visible* fill stays a compact --lyra-size-1-5rem circle -- rendered on the separate
+       [part='swatch-fill']/[part='swatch-icon'] child below and centered via flex, not by resizing
+       this button itself. A swatch's own fill/icon is what previously doubled as the clickable box;
+       splitting them keeps the dense picker grid's visual density unchanged while still growing the
+       real click/tap area. */
+    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);
+    padding: 0;
+    border: none;
+    border-radius: 50%;
+    background: none;
+    /* Exposes the option's color to a slotted icon (part='swatch-icon') via currentColor -- inert
+       when no icon is present, since [part='swatch-fill'] paints its own background-color instead. */
+    color: var(--lyra-swatch-color);
+    cursor: pointer;
+  }
+  [part='swatch-fill'] {
+    box-sizing: border-box;
+    display: block;
     inline-size: var(--lyra-size-1-5rem);
     block-size: var(--lyra-size-1-5rem);
-    padding: 0;
     border: var(--lyra-border-width-thin) solid var(--lyra-color-border);
     border-radius: 50%;
     /* Per-swatch fill from the option's color, set inline by swatch-picker.class.ts.
        Read through a var() (rather than an inline background-color declaration) so a
-       consumer's ::part(swatch) background rule can still win when overriding it. */
+       consumer's ::part(swatch-fill) background rule can still win when overriding it. */
     background-color: var(--lyra-swatch-color);
-    cursor: pointer;
     transition: transform var(--lyra-transition-fast);
   }
-  [part='swatch']:hover {
+  [part='swatch-icon'] {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    inline-size: var(--lyra-size-1-5rem);
+    block-size: var(--lyra-size-1-5rem);
+    transition: transform var(--lyra-transition-fast);
+  }
+  [part='swatch']:hover [part='swatch-fill'],
+  [part='swatch']:hover [part='swatch-icon'] {
     transform: scale(1.2);
   }
   [part='swatch']:focus-visible {
     outline: var(--lyra-focus-ring-width) solid var(--lyra-focus-ring-color);
     outline-offset: var(--lyra-focus-ring-offset);
   }
-  [part='swatch'][aria-checked='true'] {
+  [part='swatch'][aria-checked='true'] [part='swatch-fill'] {
     transform: scale(1.2);
-    box-shadow: 0 0 0 var(--lyra-border-width-thick) var(--lyra-swatch-picker-selected-color);
+    box-shadow: 0 0 var(--lyra-swatch-picker-selected-blur) var(--lyra-border-width-thick) var(--lyra-swatch-picker-selected-color);
+    animation: lyra-swatch-picker-shine var(--lyra-swatch-picker-shine-duration) ease-in-out infinite;
+  }
+  @keyframes lyra-swatch-picker-shine {
+    0%,
+    100% {
+      filter: brightness(1);
+    }
+    50% {
+      filter: brightness(1.4);
+    }
+  }
+  /* An icon option renders its own shape instead of the plain filled circle, so the box-shadow ring
+     above (drawn around [part='swatch-fill']'s true shape) doesn't apply to it at all -- render()
+     only ever mounts one of [part='swatch-fill']/[part='swatch-icon'] per swatch (see
+     swatch-picker.class.ts), so this selector and the one above never both match the same swatch.
+     Swap to a drop-shadow on the icon itself, which follows its real rendered shape. */
+  [part='swatch'][aria-checked='true'] [part='swatch-icon'] {
+    transform: scale(1.2);
+    filter: drop-shadow(0 0 var(--lyra-swatch-picker-selected-blur) var(--lyra-swatch-picker-selected-color));
   }
   /* The scale is redundant selection feedback (the ring already conveys it), so keep the
-     transform but drop its easing under reduced-motion -- the swatch snaps rather than glides. */
+     transform but drop its easing under reduced-motion -- the swatch snaps rather than glides.
+     The shine animation stops outright (a steady brightness, not a pulsing one) rather than
+     merely losing its own easing, matching prefers-reduced-motion's intent for anything that
+     loops -- a host that opted into --lyra-swatch-picker-shine-duration still gets a selected
+     swatch, just without the rhythmic brightening. */
   @media (prefers-reduced-motion: reduce) {
-    [part='swatch'] {
+    [part='swatch-fill'],
+    [part='swatch-icon'] {
       transition: none;
     }
+    [part='swatch'][aria-checked='true'] [part='swatch-fill'] {
+      animation: none;
+    }
   }
 `;
 //# sourceMappingURL=swatch-picker.styles.js.map

package/dist/components/swatch-picker/swatch-picker.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"swatch-picker.styles.js","sourceRoot":"","sources":["../../../src/components/swatch-picker/swatch-picker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDxB,CAAC"}
+{"version":3,"file":"swatch-picker.styles.js","sourceRoot":"","sources":["../../../src/components/swatch-picker/swatch-picker.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAC;AAE1B,MAAM,CAAC,MAAM,MAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgIxB,CAAC"}

package/dist/components/table/table.class.d.ts

@@ -18,6 +18,9 @@ export interface TableColumn<T> {
     /** CSS length for this column's minimum width (e.g. '80px'). Has no effect unless at least one
      *  column in the table also defines `width` (see `width`'s own doc). */
     minWidth?: string;
+    /** Enables pointer-driven resizing from this column's header. The table keeps the live width
+     *  internally and emits `lyra-column-resize` on every drag step. */
+    resizable?: boolean;
     sortable?: boolean;
     align?: 'start' | 'end';
     /** Responsive priority — `undefined` (the default) means "always visible".
@@ -39,6 +42,12 @@ export interface TableColumn<T> {
      *  background that a `cell()`-returned inner element can't paint into the cell's own padding.
      *  Omit for no per-cell style override (the default; unchanged output). */
     cellStyle?(row: T): Record<string, string> | undefined;
+    /** Numeric accessor backing the heat-tint background. A column that omits this is excluded from
+     *  tinting (e.g. a label column) — its presence on any column is the opt-in signal for heat-tint
+     *  mode as a whole, mirroring how `expandedContent` alone signals expand-mode (no separate
+     *  boolean). Returns `null`/`undefined` for a cell with no value: excluded from both the domain
+     *  computation and the tint (reads as "no data", not "zero"). */
+    heatValue?(row: T): number | null | undefined;
     /** Enables double-click inline editing for this cell. The table emits the
      *  proposed value and never mutates `row`; apply the change in the consumer
      *  and pass the updated `rows` back in. */
@@ -84,6 +93,10 @@ export interface LyraTableEventMap<T = unknown> {
         key: string;
         value: string | number;
     }>;
+    'lyra-column-resize': CustomEvent<{
+        key: string;
+        width: number;
+    }>;
 }
 /**
  * `<lyra-table>` — a presentational, sort/select-aware data table.
@@ -156,6 +169,15 @@ export interface LyraTableEventMap<T = unknown> {
  * `groupBy` inserts non-focusable group header rows before each group; use
  * `groupLabel` when the raw group key needs custom content.
  *
+ * `columns[].heatValue` opts a column into heat-tint mode: its numeric return value is normalized
+ * against a shared scale spanning every `heatValue`-defining column across every currently-rendered
+ * row (auto-derived, or overridden via `heatTintScale`) and painted as a `color-mix()` background via
+ * the retheme-able `--lyra-table-heat-tint-lo`/`-hi` custom properties (matching `lyra-heatmap`'s own
+ * ramp-token convention). `rowTotal`/`grandTotal` add a trailing column mirroring `expandedContent`'s
+ * leading one: `rowTotal(row)` renders per-row, `grandTotal(rows)` renders at its intersection with
+ * the footer row (only when a column also defines `footer`) — both share `footer`'s own
+ * "consumer computes/renders" contract rather than assuming addition.
+ *
  * @customElement lyra-table
  * @event lyra-sort - A sortable header was activated. `detail: { key }`.
  * @event lyra-row-click - A row was activated. `detail: { row }`.
@@ -174,6 +196,8 @@ export interface LyraTableEventMap<T = unknown> {
  * @event lyra-filter-change - The filter field changed. `detail: { text }`.
  * @event lyra-page-change - A pagination control requested a page. `detail: { page }`.
  * @event lyra-cell-edit - An inline editor committed a value. `detail: { row, key, value }`.
+ * @event lyra-column-resize - A resizable column changed width during a pointer drag. `detail:
+ *   { key, width }`, where `width` is in CSS pixels.
  * @event focus - Re-dispatched from the internal filter/cell-editor native inputs' own `focus` —
  *   bubbling and composed (unlike the native event, which is neither).
  * @event blur - Re-dispatched from the internal filter/cell-editor native inputs' own `blur`, for
@@ -182,8 +206,12 @@ export interface LyraTableEventMap<T = unknown> {
  * @csspart table - The `<table role="grid">` element.
  * @csspart head - The `<thead>` element.
  * @csspart header-cell - Each `<th>` header cell.
+ * @csspart resize-handle - The pointer resize handle in a `resizable` column header.
  * @csspart row - Each body `<tr>`.
  * @csspart cell - Each body `<td>`.
+ * @csspart row-total-cell - Each body row's trailing `<td>` holding `rowTotal(row)`, rendered only
+ *   when `rowTotal` is set. The corresponding footer-row cell (holding `grandTotal`) is a
+ *   `footer-cell` instead, matching every other footer cell.
  * @csspart foot - The `<tfoot>`, only rendered when at least one column defines `footer`.
  * @csspart footer-row - The single footer row.
  * @csspart footer-cell - A single footer cell.
@@ -206,6 +234,9 @@ export interface LyraTableEventMap<T = unknown> {
  * @csspart filter-label - The `<label>` wrapping the filter input.
  * @csspart loading - The loading-state wrapper.
  * @csspart pagination - The optional pagination component.
+ * @cssprop [--lyra-table-resize-min-width=var(--lyra-size-3rem)] - Default minimum width for a
+ *   resizable column without an explicit pixel `minWidth`.
+ * @cssprop [--lyra-table-resize-handle-opacity=0.12] - Hover/focus opacity of the resize handle.
  */
 export declare class LyraTable<T = unknown> extends LyraElement<LyraTableEventMap<T>> {
     static styles: import("lit").CSSResultGroup[];
@@ -270,6 +301,23 @@ export declare class LyraTable<T = unknown> extends LyraElement<LyraTableEventMa
      *  response to `lyra-row-expand-toggle`, mirroring how `sortKey`/
      *  `selectedKey` already work. */
     expandedKeys: Set<string | number>;
+    /** Overrides the auto-derived heat-tint domain (min/max of every `heatValue` result across every
+     *  currently-rendered row — post-sort, pre-pagination, the same rows `footer(rows)` already sees).
+     *  Unset computes the domain automatically from the data, spanning every `heatValue`-defining
+     *  column together (a single shared scale across the whole grid, not one scale per column). */
+    heatTintScale?: {
+        min?: number;
+        max?: number;
+    };
+    /** Renders a trailing `<td>` on every body row holding this row's total. Same
+     *  "consumer computes/renders, table only positions" contract as the existing per-column
+     *  `footer(rows)` — does not assume addition, so a non-sum aggregate works identically. Omit for
+     *  no trailing column at all (unchanged output). */
+    rowTotal?: (row: T) => unknown;
+    /** Renders the bottom-right cell (row-total column × footer row). Only rendered when both
+     *  `rowTotal` is set **and** at least one column defines `footer` — otherwise there is no footer
+     *  row for it to occupy, and this renders nothing. */
+    grandTotal?: (rows: T[]) => unknown;
     hasMore: boolean;
     moreLabel: string;
     emptyHeading: string;
@@ -306,6 +354,8 @@ export declare class LyraTable<T = unknown> extends LyraElement<LyraTableEventMa
      *  `selectedKey` (if it matches a row) or the first row. */
     private activeRowKey;
     private editingCell;
+    private resizedColumnWidths;
+    private resizeState?;
     private rowsByKey;
     private columnsByKey;
     /** Watches `[part='base']`'s own inline-size — the `@container` query
@@ -323,6 +373,12 @@ export declare class LyraTable<T = unknown> extends LyraElement<LyraTableEventMa
      *  whenever this no longer matches the live element. */
     private observedBase?;
     private readonly observedHeaders;
+    private parsePixelLength;
+    private minimumResizeWidth;
+    private renderedColumnWidth;
+    private onResizePointerDown;
+    private onResizePointerMove;
+    private onResizePointerEnd;
     connectedCallback(): void;
     disconnectedCallback(): void;
     private observeBase;
@@ -337,16 +393,33 @@ export declare class LyraTable<T = unknown> extends LyraElement<LyraTableEventMa
     private recomputeColumnsHidden;
     private rehomeFocusedColumn;
     private keyOf;
-    /** Memoized for the duration of a single update cycle — `willUpdate()` invalidates the cache, but
-     *  this method itself is read (directly or transitively, via `matchingTotalItems`/`pageCount`/
-     *  `appliedPage`/`renderedEntries()`) around a dozen times across one `willUpdate()` + `render()`
-     *  pass. Recomputing from scratch each time re-runs the `JSON.stringify()`-per-row default filter
-     *  that many times over; memoizing collapses that to a single pass per update. */
+    /** Memoized across update cycles and re-validated against the exact inputs the computation
+     *  reads — `rows` and `filter` by identity, the trimmed filter text, and (only when there is
+     *  text to case-fold at all) the effective locale. This method is read (directly or
+     *  transitively, via `matchingTotalItems`/`pageCount`/`appliedPage`/`renderedEntries()`) around
+     *  a dozen times across one `willUpdate()` + `render()` pass, and an *unrelated* reactive
+     *  update (a roving-tabindex move, an inline-editor open, ...) shouldn't re-run the
+     *  `JSON.stringify()`-per-row default filter over the full `rows` array even once — comparing
+     *  the recorded inputs instead of dropping the cache on every update keeps both cases to a
+     *  single filtering pass. The locale is compared as its resolved string, so a change that
+     *  arrives without a matching reactive-property key (an ancestor `lang` edit picked up on the
+     *  next update, `setLyraLocale()`'s keyless `requestUpdate()`) still recomputes. */
     private cachedMatchingEntries;
+    private matchingEntriesInputs;
     private matchingEntries;
+    /** Read-time-safe view of `pageSize` -- non-negative, finite, truncated to a whole item count.
+     *  Mirrors `<lyra-pagination>`'s own identically-named getter (this component composes that
+     *  primitive for the actual pagination UI in `render()`, but slices `rows` itself for client-mode
+     *  pagination, so it needs the same safe count independently). */
     private get normalizedPageSize();
+    /** `totalItems: -1` (the default) is a sentinel meaning "derive from filtered rows" -- normalize
+     *  first so a non-finite/garbage `totalItems` degrades to that same derived-count fallback
+     *  instead of propagating NaN, while a genuine non-negative value is still honored verbatim. */
     private get matchingTotalItems();
     private get pageCount();
+    /** Read-time-safe view of the controlled `page` property, clamped to `[1, pageCount]` -- mirrors
+     *  `<lyra-pagination>`'s own `currentPage` getter and, like `<lyra-av-player>`'s `currentTime`
+     *  setter, clamps against a dynamic, just-computed upper bound rather than a fixed one. */
     private get appliedPage();
     private renderedEntries;
     private onFilterInput;
@@ -365,6 +438,13 @@ export declare class LyraTable<T = unknown> extends LyraElement<LyraTableEventMa
      *  this can't be computed in CSS alone; it requires measuring the actual
      *  laid-out `offsetWidth` of each earlier sticky column's header cell. */
     private stickyOffsets;
+    /** `[lo, hi]` of every `heatValue` result across every matching row (post-sort, pre-pagination) and
+     *  every `heatValue`-defining column, or `null` when heat-tint mode is off or there's no usable
+     *  domain (no numeric values and no override). `heatTintScale` overrides either or both bounds. */
+    private computeHeatDomain;
+    /** This cell's tint share as a CSS percentage string (e.g. `"42.00%"`), or `null` when the column
+     *  has no `heatValue`, the domain is unavailable, or this row's value is missing/non-finite. */
+    private heatShare;
     private applyStickyOffsets;
     /** Applies stickyOffsets()'s measured per-column offsets as an inline
      *  `--lyra-table-sticky-offset` custom property on every header cell and