@aceshooting/lyra-ui 2.0.0 → 2.2.0

package/dist/components/model-select/model-select.styles.js

@@ -4,22 +4,36 @@ export const styles = css `
     position: relative;
     display: inline-block;
     inline-size: 100%;
-    max-inline-size: 24rem;
+    max-inline-size: var(--lyra-size-24rem);
   }
-  :host([disabled]) {
+  :host(:disabled) {
     cursor: not-allowed;
   }
 
+  [part='form-control-label'] {
+    display: block;
+    margin-block-end: var(--lyra-space-xs);
+    font-size: var(--lyra-font-size-md-sm);
+    font-weight: var(--lyra-font-weight-semibold);
+  }
+  /* :empty never matches here -- the part always renders a literal label
+     element regardless of label content -- so real emptiness is tracked via
+     the label property length and reflected through the hidden attribute
+     instead (same fix as lyra-select's own form-control-label). */
+  [part='form-control-label'][hidden] {
+    display: none;
+  }
+
   [part='trigger'],
   [part='combobox'] {
     display: flex;
     align-items: center;
     gap: var(--lyra-space-xs);
     inline-size: 100%;
-    min-block-size: 2.5rem;
+    min-block-size: var(--lyra-size-2-5rem);
     box-sizing: border-box;
     padding: var(--lyra-space-xs) var(--lyra-space-s);
-    border: 1px solid var(--lyra-color-border);
+    border: var(--lyra-border-width-thin) solid var(--lyra-color-border);
     border-radius: var(--lyra-radius);
     background: var(--lyra-color-surface);
     color: inherit;
@@ -40,8 +54,8 @@ export const styles = css `
   :host([open]) [part='trigger'] {
     border-color: var(--lyra-color-brand);
   }
-  :host([disabled]) [part='trigger'],
-  :host([disabled]) [part='combobox'] {
+  :host(:disabled) [part='trigger'],
+  :host(:disabled) [part='combobox'] {
     opacity: var(--lyra-opacity-disabled);
     cursor: not-allowed;
   }
@@ -50,11 +64,11 @@ export const styles = css `
     flex: 0 0 auto;
     padding-inline-end: var(--lyra-space-xs);
     margin-inline-end: var(--lyra-space-xs);
-    border-inline-end: 1px solid var(--lyra-color-border);
-    font-size: 0.6875rem;
-    font-weight: 700;
+    border-inline-end: var(--lyra-border-width-thin) solid var(--lyra-color-border);
+    font-size: var(--lyra-size-0-6875rem);
+    font-weight: var(--lyra-font-weight-bold);
     text-transform: uppercase;
-    letter-spacing: 0.04em;
+    letter-spacing: var(--lyra-size-0-04em);
     color: var(--lyra-color-text-quiet);
     white-space: nowrap;
   }
@@ -86,9 +100,9 @@ export const styles = css `
     align-items: center;
     justify-content: center;
     color: var(--lyra-color-text-quiet);
-    min-inline-size: min(var(--lyra-icon-button-size), 1.75rem);
-    min-block-size: min(var(--lyra-icon-button-size), 1.75rem);
-    line-height: 1;
+    min-inline-size: min(var(--lyra-icon-button-size), var(--lyra-size-1-75rem));
+    min-block-size: min(var(--lyra-icon-button-size), var(--lyra-size-1-75rem));
+    line-height: var(--lyra-line-height-none);
   }
   [part='expand-icon'] svg {
     transform: rotate(90deg);
@@ -96,16 +110,16 @@ export const styles = css `
 
   [part='listbox'] {
     position: fixed;
-    z-index: 900;
+    z-index: var(--lyra-layer-dropdown);
     box-sizing: border-box;
-    max-block-size: 18rem;
+    max-block-size: var(--lyra-size-18rem);
     overflow-y: auto;
     inline-size: max-content;
-    min-inline-size: 12rem;
-    max-inline-size: min(92vw, 28rem);
+    min-inline-size: var(--lyra-size-12rem);
+    max-inline-size: min(92vw, var(--lyra-size-28rem));
     padding: var(--lyra-space-xs);
     background: var(--lyra-color-surface);
-    border: 1px solid var(--lyra-color-border);
+    border: var(--lyra-border-width-thin) solid var(--lyra-color-border);
     border-radius: var(--lyra-radius);
     box-shadow: var(--lyra-shadow);
     /* Closed state: invisible + slightly raised. visibility (not
@@ -113,7 +127,7 @@ export const styles = css `
        and a11y exposure stay off since this part is already position:fixed. */
     visibility: hidden;
     opacity: 0;
-    transform: translateY(-0.25rem);
+    transform: translateY(var(--lyra-size-neg-0-25rem));
     transition:
       opacity var(--lyra-transition-fast),
       transform var(--lyra-transition-fast),
@@ -137,7 +151,7 @@ export const styles = css `
     inline-size: 100%;
     box-sizing: border-box;
     padding: var(--lyra-space-xs) var(--lyra-space-s);
-    border: 1px solid transparent;
+    border: var(--lyra-border-width-thin) solid transparent;
     border-radius: var(--lyra-radius);
     background: none;
     color: inherit;
@@ -152,7 +166,7 @@ export const styles = css `
   [part='option'][aria-selected='true'] {
     border-color: var(--lyra-color-brand);
     color: var(--lyra-color-brand);
-    font-weight: 600;
+    font-weight: var(--lyra-font-weight-semibold);
   }
   [part='option-label'] {
     flex: 1 1 auto;
@@ -174,9 +188,9 @@ export const styles = css `
   }
   [part='option-badge'] {
     flex: 0 0 auto;
-    font-size: 0.6875rem;
+    font-size: var(--lyra-size-0-6875rem);
     font-style: normal;
-    font-weight: 400;
+    font-weight: var(--lyra-font-weight-normal);
     color: var(--lyra-color-text-quiet);
     white-space: nowrap;
   }
@@ -184,6 +198,7 @@ export const styles = css `
   .empty {
     padding: var(--lyra-space-m);
     color: var(--lyra-color-text-quiet);
-    font-size: 0.875rem;
+    font-size: var(--lyra-font-size-md-sm);
   }
 `;
+//# sourceMappingURL=model-select.styles.js.map

package/dist/components/model-select/model-select.styles.js.map

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

package/dist/components/model-settings-panel/model-settings-panel.class.d.ts

@@ -0,0 +1,94 @@
+import { type PropertyValues, type TemplateResult } from 'lit';
+import { LyraElement } from '../../internal/lyra-element.js';
+import type { LyraModelCatalog } from '../model-select/model-select.class.js';
+import '../model-select/model-select.class.js';
+import '../slider/slider.class.js';
+export type ModelSettingsPanelLayout = 'vertical' | 'compact';
+/** The full current settings shape, re-emitted on every `lyra-change`
+ *  regardless of which child control actually triggered it. */
+export interface ModelSettingsChangeDetail {
+    modelValue: string;
+    inCatalog: boolean;
+    temperature: number;
+}
+/**
+ * `<lyra-model-settings-panel>` — a fixed composition of `<lyra-model-select>`
+ * and `<lyra-slider>` into one agent-configuration card: pick a provider's
+ * model, then tune its sampling temperature. Not a generic layout shell (no
+ * slots) — it exists so a consumer doesn't have to re-wire the same two
+ * child `lyra-change` events into one combined settings object by hand every
+ * time this pairing comes up.
+ *
+ * Every prop here is a plain pass-through to (or mirror of) the matching
+ * child control's own prop of the same/similar name; see the child
+ * components themselves for the exact semantics of `catalog`/`allowCustom`
+ * and `temperatureMin`/`temperatureMax`/`temperatureStep`.
+ *
+ * The panel's own `temperature` readout mirrors the slider's *live* value —
+ * updated on every `lyra-input` (drag/key-repeat), not just the committed
+ * `lyra-change` — and is re-clamped into `[temperatureMin, temperatureMax]`
+ * (snapped to `temperatureStep`) whenever those three properties change, so
+ * it can never drift from what the nested `lyra-slider` itself shows.
+ *
+ * @customElement lyra-model-settings-panel
+ * @event lyra-change - Either child control changed. `detail: { modelValue: string; inCatalog: boolean; temperature: number }` — always the full current settings, not just whatever changed.
+ * @csspart base - The outermost wrapping container.
+ * @csspart model-row - The row wrapping the internal `lyra-model-select`.
+ * @csspart temperature-row - The row wrapping the temperature label/slider/value.
+ * @csspart temperature-label - The visible "Temperature" caption.
+ * @csspart temperature-value - The visible current temperature readout.
+ */
+export declare class LyraModelSettingsPanel extends LyraElement {
+    static styles: import("lit").CSSResultGroup[];
+    /** Informational provider badge, passed straight through to the internal `lyra-model-select`. */
+    provider: string;
+    /** The model list, passed straight through to the internal `lyra-model-select`. */
+    catalog?: LyraModelCatalog;
+    /** The current model id. */
+    modelValue: string;
+    /** Let the model control accept a value outside `catalog`; passed straight through. */
+    allowCustom: boolean;
+    /** The current sampling temperature. */
+    temperature: number;
+    temperatureMin: number;
+    temperatureMax: number;
+    temperatureStep: number;
+    /** `vertical` stacks full-width rows with visible labels; `compact` runs
+     *  the same two rows side by side with a smaller temperature caption, for
+     *  toolbars/sidebars where the vertical layout's height doesn't fit. */
+    layout: ModelSettingsPanelLayout;
+    /** Disables the panel as a unit by forwarding to both the internal
+     *  `lyra-model-select` and `lyra-slider` — a wrapping `<fieldset disabled>`
+     *  alone would not reach either, since a form-associated control's own
+     *  `disabled` IDL property/attribute is never mutated by fieldset cascading. */
+    disabled: boolean;
+    /** Whether `modelValue` is present in `catalog` — recomputed fresh from
+     *  scratch (like `lyra-model-select`'s own `effectiveEntries`) rather than
+     *  cached from the last child event, so it's still correct when
+     *  `modelValue` was assigned directly instead of via the child's own
+     *  `lyra-change`. */
+    private get inCatalog();
+    /** Clamps `raw` into `[temperatureMin, temperatureMax]`, snapped to
+     *  `temperatureStep`'s grid anchored at the low end -- exactly mirroring
+     *  `lyra-slider`'s own private `clampValue`/`domain` math -- so the
+     *  mirrored `temperature` readout can never disagree with what the nested
+     *  slider itself would clamp the same raw number to. */
+    private clampTemperature;
+    private emitChange;
+    private onModelChange;
+    private onTemperatureChange;
+    /** Mirrors the slider's *live* (uncommitted) value into the panel's own
+     *  `temperature` readout -- display only, no `emitChange()` -- mirroring
+     *  native `input` (continuous) vs. `change` (committed) semantics so the
+     *  readout tracks an in-progress drag/key-repeat instead of only updating
+     *  once the interaction commits. */
+    private onTemperatureInput;
+    protected willUpdate(changed: PropertyValues<this>): void;
+    render(): TemplateResult;
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'lyra-model-settings-panel': LyraModelSettingsPanel;
+    }
+}
+//# sourceMappingURL=model-settings-panel.class.d.ts.map

package/dist/components/model-settings-panel/model-settings-panel.class.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"model-settings-panel.class.d.ts","sourceRoot":"","sources":["../../../src/components/model-settings-panel/model-settings-panel.class.ts"],"names":[],"mappings":"AAAA,OAAO,EAAQ,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAErE,OAAO,EAAE,WAAW,EAAE,MAAM,gCAAgC,CAAC;AAG7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,uCAAuC,CAAC;AAC9E,OAAO,uCAAuC,CAAC;AAC/C,OAAO,2BAA2B,CAAC;AAEnC,MAAM,MAAM,wBAAwB,GAAG,UAAU,GAAG,SAAS,CAAC;AAE9D;+DAC+D;AAC/D,MAAM,WAAW,yBAAyB;IACxC,UAAU,EAAE,MAAM,CAAC;IACnB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;CACrB;AAoBD;;;;;;;;;;;;;;;;;;;;;;;;;;GA0BG;AACH,qBAAa,sBAAuB,SAAQ,WAAW;IACrD,MAAM,CAAC,MAAM,iCAAgC;IAE7C,iGAAiG;IACrF,QAAQ,SAAM;IAC1B,mFAAmF;IACnD,OAAO,CAAC,EAAE,gBAAgB,CAAC;IAC3D,4BAA4B;IACY,UAAU,SAAM;IACxD,uFAAuF;IAC/B,WAAW,UAAS;IAC5E,wCAAwC;IACZ,WAAW,SAAuB;IACJ,cAAc,SAA2B;IACzC,cAAc,SAA2B;IACxC,eAAe,SAA4B;IACtG;;4EAEwE;IAC3C,MAAM,EAAE,wBAAwB,CAAc;IAC3E;;;oFAGgF;IACpC,QAAQ,UAAS;IAE7D;;;;yBAIqB;IACrB,OAAO,KAAK,SAAS,GAIpB;IAED;;;;4DAIwD;IACxD,OAAO,CAAC,gBAAgB;IAkBxB,OAAO,CAAC,UAAU;IAQlB,OAAO,CAAC,aAAa,CAGnB;IAEF,OAAO,CAAC,mBAAmB,CAGzB;IAEF;;;;wCAIoC;IACpC,OAAO,CAAC,kBAAkB,CAExB;IAEF,SAAS,CAAC,UAAU,CAAC,OAAO,EAAE,cAAc,CAAC,IAAI,CAAC,GAAG,IAAI,CAKxD;IAED,MAAM,IAAI,cAAc,CA+BvB;CACF;AAGD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,2BAA2B,EAAE,sBAAsB,CAAC;KACrD;CACF"}

package/dist/components/model-settings-panel/model-settings-panel.class.js

@@ -0,0 +1,208 @@
+var __decorate = (this && this.__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--) if (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 } from 'lit/decorators.js';
+import { LyraElement } from '../../internal/lyra-element.js';
+import { finiteNumber, finiteRange } from '../../internal/numbers.js';
+import { styles } from './model-settings-panel.styles.js';
+import '../model-select/model-select.class.js';
+import '../slider/slider.class.js';
+const DEFAULT_TEMPERATURE_MIN = 0;
+const DEFAULT_TEMPERATURE_MAX = 2;
+const DEFAULT_TEMPERATURE_STEP = 0.1;
+// Midpoint of the default [0, 2] range -- a reasonable provider-agnostic
+// starting point. Reassign `temperature` yourself if your provider's own
+// default differs (OpenAI and Anthropic both default to 1, which this matches).
+const DEFAULT_TEMPERATURE = 1;
+/** Number of decimal digits in `n`'s shortest string representation, e.g.
+ *  `0.1` -> 1, `5` -> 0. Mirrors lyra-slider's identical helper so the
+ *  panel's own re-clamping of `temperature` lands on the exact same
+ *  step-grid values the nested slider itself would compute. */
+function decimalPlaces(n) {
+    const str = n.toString();
+    const dot = str.indexOf('.');
+    return dot === -1 ? 0 : str.length - dot - 1;
+}
+/**
+ * `<lyra-model-settings-panel>` — a fixed composition of `<lyra-model-select>`
+ * and `<lyra-slider>` into one agent-configuration card: pick a provider's
+ * model, then tune its sampling temperature. Not a generic layout shell (no
+ * slots) — it exists so a consumer doesn't have to re-wire the same two
+ * child `lyra-change` events into one combined settings object by hand every
+ * time this pairing comes up.
+ *
+ * Every prop here is a plain pass-through to (or mirror of) the matching
+ * child control's own prop of the same/similar name; see the child
+ * components themselves for the exact semantics of `catalog`/`allowCustom`
+ * and `temperatureMin`/`temperatureMax`/`temperatureStep`.
+ *
+ * The panel's own `temperature` readout mirrors the slider's *live* value —
+ * updated on every `lyra-input` (drag/key-repeat), not just the committed
+ * `lyra-change` — and is re-clamped into `[temperatureMin, temperatureMax]`
+ * (snapped to `temperatureStep`) whenever those three properties change, so
+ * it can never drift from what the nested `lyra-slider` itself shows.
+ *
+ * @customElement lyra-model-settings-panel
+ * @event lyra-change - Either child control changed. `detail: { modelValue: string; inCatalog: boolean; temperature: number }` — always the full current settings, not just whatever changed.
+ * @csspart base - The outermost wrapping container.
+ * @csspart model-row - The row wrapping the internal `lyra-model-select`.
+ * @csspart temperature-row - The row wrapping the temperature label/slider/value.
+ * @csspart temperature-label - The visible "Temperature" caption.
+ * @csspart temperature-value - The visible current temperature readout.
+ */
+export class LyraModelSettingsPanel extends LyraElement {
+    constructor() {
+        super(...arguments);
+        /** Informational provider badge, passed straight through to the internal `lyra-model-select`. */
+        this.provider = '';
+        /** The current model id. */
+        this.modelValue = '';
+        /** Let the model control accept a value outside `catalog`; passed straight through. */
+        this.allowCustom = false;
+        /** The current sampling temperature. */
+        this.temperature = DEFAULT_TEMPERATURE;
+        this.temperatureMin = DEFAULT_TEMPERATURE_MIN;
+        this.temperatureMax = DEFAULT_TEMPERATURE_MAX;
+        this.temperatureStep = DEFAULT_TEMPERATURE_STEP;
+        /** `vertical` stacks full-width rows with visible labels; `compact` runs
+         *  the same two rows side by side with a smaller temperature caption, for
+         *  toolbars/sidebars where the vertical layout's height doesn't fit. */
+        this.layout = 'vertical';
+        /** Disables the panel as a unit by forwarding to both the internal
+         *  `lyra-model-select` and `lyra-slider` — a wrapping `<fieldset disabled>`
+         *  alone would not reach either, since a form-associated control's own
+         *  `disabled` IDL property/attribute is never mutated by fieldset cascading. */
+        this.disabled = false;
+        this.onModelChange = (e) => {
+            this.modelValue = e.detail.value;
+            this.emitChange();
+        };
+        this.onTemperatureChange = (e) => {
+            this.temperature = e.detail.value;
+            this.emitChange();
+        };
+        /** Mirrors the slider's *live* (uncommitted) value into the panel's own
+         *  `temperature` readout -- display only, no `emitChange()` -- mirroring
+         *  native `input` (continuous) vs. `change` (committed) semantics so the
+         *  readout tracks an in-progress drag/key-repeat instead of only updating
+         *  once the interaction commits. */
+        this.onTemperatureInput = (e) => {
+            this.temperature = e.detail.value;
+        };
+    }
+    static { this.styles = [LyraElement.styles, styles]; }
+    /** Whether `modelValue` is present in `catalog` — recomputed fresh from
+     *  scratch (like `lyra-model-select`'s own `effectiveEntries`) rather than
+     *  cached from the last child event, so it's still correct when
+     *  `modelValue` was assigned directly instead of via the child's own
+     *  `lyra-change`. */
+    get inCatalog() {
+        const catalog = this.catalog;
+        if (!catalog || catalog.length === 0)
+            return false;
+        return catalog.some((entry) => (typeof entry === 'string' ? entry === this.modelValue : entry.id === this.modelValue));
+    }
+    /** Clamps `raw` into `[temperatureMin, temperatureMax]`, snapped to
+     *  `temperatureStep`'s grid anchored at the low end -- exactly mirroring
+     *  `lyra-slider`'s own private `clampValue`/`domain` math -- so the
+     *  mirrored `temperature` readout can never disagree with what the nested
+     *  slider itself would clamp the same raw number to. */
+    clampTemperature(raw) {
+        const rawMin = this.temperatureMin;
+        const rawMax = this.temperatureMax;
+        const min = finiteNumber(rawMin, DEFAULT_TEMPERATURE_MIN);
+        const max = finiteNumber(rawMax, DEFAULT_TEMPERATURE_MAX);
+        const lo = Math.min(min, max);
+        const hi = Math.max(min, max);
+        const step = finiteRange(this.temperatureStep, 0, 0);
+        const hasStep = step > 0;
+        let stepped = finiteNumber(raw, lo);
+        if (hasStep) {
+            const stepsFromLo = Math.round((raw - lo) / step);
+            const factor = 10 ** decimalPlaces(step);
+            stepped = Math.round((lo + stepsFromLo * step) * factor) / factor;
+        }
+        return Math.min(hi, Math.max(lo, stepped));
+    }
+    emitChange() {
+        this.emit('lyra-change', {
+            modelValue: this.modelValue,
+            inCatalog: this.inCatalog,
+            temperature: this.temperature,
+        });
+    }
+    willUpdate(changed) {
+        if (changed.has('temperatureMin') || changed.has('temperatureMax') || changed.has('temperatureStep')) {
+            const clamped = this.clampTemperature(this.temperature);
+            if (clamped !== this.temperature)
+                this.temperature = clamped;
+        }
+    }
+    render() {
+        return html `
+      <div part="base">
+        <div part="model-row">
+          <lyra-model-select
+            .provider=${this.provider}
+            .catalog=${this.catalog}
+            .value=${this.modelValue}
+            .allowCustom=${this.allowCustom}
+            .disabled=${this.disabled}
+            placeholder="Select a model…"
+            @lyra-change=${this.onModelChange}
+          ></lyra-model-select>
+        </div>
+        <div part="temperature-row">
+          <span part="temperature-label">Temperature</span>
+          <lyra-slider
+            .label=${'Temperature'}
+            .min=${this.temperatureMin}
+            .max=${this.temperatureMax}
+            .step=${this.temperatureStep}
+            .valueAsNumber=${this.temperature}
+            .showValue=${false}
+            .disabled=${this.disabled}
+            @lyra-input=${this.onTemperatureInput}
+            @lyra-change=${this.onTemperatureChange}
+          ></lyra-slider>
+          <span part="temperature-value" aria-hidden="true">${this.temperature}</span>
+        </div>
+      </div>
+    `;
+    }
+}
+__decorate([
+    property()
+], LyraModelSettingsPanel.prototype, "provider", void 0);
+__decorate([
+    property({ attribute: false })
+], LyraModelSettingsPanel.prototype, "catalog", void 0);
+__decorate([
+    property({ attribute: 'model-value' })
+], LyraModelSettingsPanel.prototype, "modelValue", void 0);
+__decorate([
+    property({ type: Boolean, attribute: 'allow-custom' })
+], LyraModelSettingsPanel.prototype, "allowCustom", void 0);
+__decorate([
+    property({ type: Number })
+], LyraModelSettingsPanel.prototype, "temperature", void 0);
+__decorate([
+    property({ type: Number, attribute: 'temperature-min' })
+], LyraModelSettingsPanel.prototype, "temperatureMin", void 0);
+__decorate([
+    property({ type: Number, attribute: 'temperature-max' })
+], LyraModelSettingsPanel.prototype, "temperatureMax", void 0);
+__decorate([
+    property({ type: Number, attribute: 'temperature-step' })
+], LyraModelSettingsPanel.prototype, "temperatureStep", void 0);
+__decorate([
+    property({ reflect: true })
+], LyraModelSettingsPanel.prototype, "layout", void 0);
+__decorate([
+    property({ type: Boolean, reflect: true })
+], LyraModelSettingsPanel.prototype, "disabled", void 0);
+//# sourceMappingURL=model-settings-panel.class.js.map

package/dist/components/model-settings-panel/model-settings-panel.class.js.map

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

package/dist/components/model-settings-panel/model-settings-panel.d.ts

@@ -1,69 +1,4 @@
-import { type TemplateResult } from 'lit';
-import { LyraElement } from '../../internal/lyra-element.js';
-import type { LyraModelCatalog } from '../model-select/model-select.js';
-import '../model-select/model-select.js';
-import '../slider/slider.js';
-export type ModelSettingsPanelLayout = 'vertical' | 'compact';
-/** The full current settings shape, re-emitted on every `lyra-change`
- *  regardless of which child control actually triggered it. */
-export interface ModelSettingsChangeDetail {
-    modelValue: string;
-    inCatalog: boolean;
-    temperature: number;
-}
-/**
- * `<lyra-model-settings-panel>` — a fixed composition of `<lyra-model-select>`
- * and `<lyra-slider>` into one agent-configuration card: pick a provider's
- * model, then tune its sampling temperature. Not a generic layout shell (no
- * slots) — it exists so a consumer doesn't have to re-wire the same two
- * child `lyra-change` events into one combined settings object by hand every
- * time this pairing comes up.
- *
- * Every prop here is a plain pass-through to (or mirror of) the matching
- * child control's own prop of the same/similar name; see the child
- * components themselves for the exact semantics of `catalog`/`allowCustom`
- * and `temperatureMin`/`temperatureMax`/`temperatureStep`.
- *
- * @customElement lyra-model-settings-panel
- * @event lyra-change - Either child control changed. `detail: { modelValue: string; inCatalog: boolean; temperature: number }` — always the full current settings, not just whatever changed.
- * @csspart base - The outermost wrapping container.
- * @csspart model-row - The row wrapping the internal `lyra-model-select`.
- * @csspart temperature-row - The row wrapping the temperature label/slider/value.
- * @csspart temperature-label - The visible "Temperature" caption.
- * @csspart temperature-value - The visible current temperature readout.
- */
-export declare class LyraModelSettingsPanel extends LyraElement {
-    static styles: import("lit").CSSResultGroup[];
-    /** Informational provider badge, passed straight through to the internal `lyra-model-select`. */
-    provider: string;
-    /** The model list, passed straight through to the internal `lyra-model-select`. */
-    catalog?: LyraModelCatalog;
-    /** The current model id. */
-    modelValue: string;
-    /** Let the model control accept a value outside `catalog`; passed straight through. */
-    allowCustom: boolean;
-    /** The current sampling temperature. */
-    temperature: number;
-    temperatureMin: number;
-    temperatureMax: number;
-    temperatureStep: number;
-    /** `vertical` stacks full-width rows with visible labels; `compact` runs
-     *  the same two rows side by side with a smaller temperature caption, for
-     *  toolbars/sidebars where the vertical layout's height doesn't fit. */
-    layout: ModelSettingsPanelLayout;
-    /** Whether `modelValue` is present in `catalog` — recomputed fresh from
-     *  scratch (like `lyra-model-select`'s own `effectiveEntries`) rather than
-     *  cached from the last child event, so it's still correct when
-     *  `modelValue` was assigned directly instead of via the child's own
-     *  `lyra-change`. */
-    private get inCatalog();
-    private emitChange;
-    private onModelChange;
-    private onTemperatureChange;
-    render(): TemplateResult;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'lyra-model-settings-panel': LyraModelSettingsPanel;
-    }
-}
+export * from './model-settings-panel.class.js';
+import "../model-select/model-select.js";
+import "../slider/slider.js";
+//# sourceMappingURL=model-settings-panel.d.ts.map

package/dist/components/model-settings-panel/model-settings-panel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"model-settings-panel.d.ts","sourceRoot":"","sources":["../../../src/components/model-settings-panel/model-settings-panel.ts"],"names":[],"mappings":"AAAA,cAAc,iCAAiC,CAAC;AAGhD,OAAO,iCAAiC,CAAC;AACzC,OAAO,qBAAqB,CAAC"}