@api-client/ui 0.5.26 → 0.5.28

package/build/src/md/progress/internals/UiProgress.js

@@ -13,18 +13,13 @@ let UiProgress = (() => {
     let _secondaryProgress_decorators;
     let _secondaryProgress_initializers = [];
     let _secondaryProgress_extraInitializers = [];
-    let _indeterminate_decorators;
-    let _indeterminate_initializers = [];
-    let _indeterminate_extraInitializers = [];
     return class UiProgress extends _classSuper {
         static {
             const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
             _set_disabled_decorators = [property({ reflect: true, type: Boolean })];
             _secondaryProgress_decorators = [property({ type: Number, converter: floatConverter })];
-            _indeterminate_decorators = [property({ reflect: true, type: Boolean })];
             __esDecorate(this, null, _set_disabled_decorators, { kind: "setter", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, null, _instanceExtraInitializers);
             __esDecorate(this, null, _secondaryProgress_decorators, { kind: "accessor", name: "secondaryProgress", static: false, private: false, access: { has: obj => "secondaryProgress" in obj, get: obj => obj.secondaryProgress, set: (obj, value) => { obj.secondaryProgress = value; } }, metadata: _metadata }, _secondaryProgress_initializers, _secondaryProgress_extraInitializers);
-            __esDecorate(this, null, _indeterminate_decorators, { kind: "accessor", name: "indeterminate", static: false, private: false, access: { has: obj => "indeterminate" in obj, get: obj => obj.indeterminate, set: (obj, value) => { obj.indeterminate = value; } }, metadata: _metadata }, _indeterminate_initializers, _indeterminate_extraInitializers);
             if (_metadata) Object.defineProperty(this, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
         }
         secondaryRatioInternal = __runInitializers(this, _instanceExtraInitializers);
@@ -47,47 +42,18 @@ let UiProgress = (() => {
          */
         get secondaryProgress() { return this.#secondaryProgress_accessor_storage; }
         set secondaryProgress(value) { this.#secondaryProgress_accessor_storage = value; }
-        #indeterminate_accessor_storage = (__runInitializers(this, _secondaryProgress_extraInitializers), __runInitializers(this, _indeterminate_initializers, void 0));
-        /**
-         * Use an indeterminate progress indicator.
-         * @attr
-         */
-        get indeterminate() { return this.#indeterminate_accessor_storage; }
-        set indeterminate(value) { this.#indeterminate_accessor_storage = value; }
         /**
          * @returns The ratio of the secondary progress.
          */
         get secondaryRatio() {
             return this.secondaryRatioInternal || 0;
         }
-        connectedCallback() {
-            super.connectedCallback();
-            if (!this.hasAttribute('role')) {
-                this.setAttribute('role', 'progressbar');
-            }
-        }
         willUpdate(cp) {
             super.willUpdate(cp);
-            if (cp.has('secondaryProgress') || cp.has('indeterminate')) {
+            if (cp.has('secondaryProgress')) {
                 this.rangeChanged();
             }
         }
-        updated(cp) {
-            if (cp.has('min')) {
-                this.setAttribute('aria-valuemin', String(this.min));
-            }
-            if (cp.has('max')) {
-                this.setAttribute('aria-valuemax', String(this.max));
-            }
-            if (cp.has('indeterminate') || cp.has('value')) {
-                if (this.indeterminate) {
-                    this.removeAttribute('aria-valuenow');
-                }
-                else {
-                    this.setAttribute('aria-valuenow', String(this.value));
-                }
-            }
-        }
         rangeChanged() {
             super.rangeChanged();
             const { secondaryProgress: sp } = this;
@@ -126,7 +92,7 @@ let UiProgress = (() => {
         }
         constructor() {
             super(...arguments);
-            __runInitializers(this, _indeterminate_extraInitializers);
+            __runInitializers(this, _secondaryProgress_extraInitializers);
         }
     };
 })();

package/build/src/md/progress/internals/UiProgress.js.map

@@ -1 +1 @@
-{"version":3,"file":"UiProgress.js","sourceRoot":"","sources":["../../../../../src/md/progress/internals/UiProgress.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues, TemplateResult } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js'\nimport { UiRange } from './Range.js'\nimport { isDisabled, setDisabled } from '../../../lib/disabled.js'\nimport { floatConverter } from '../../../lib/AttributeConverters.js'\n\nexport default class UiProgress extends UiRange {\n  protected secondaryRatioInternal?: number\n\n  get disabled(): boolean {\n    return isDisabled(this)\n  }\n\n  /**\n   * When set, the button is a disabled state.\n   * @attribute\n   */\n  @property({ reflect: true, type: Boolean })\n  set disabled(value: boolean) {\n    const old = isDisabled(this)\n    setDisabled(this, value)\n    this.requestUpdate('disabled', old)\n  }\n\n  /**\n   * The number that represents the current secondary progress.\n   * @attr\n   */\n  @property({ type: Number, converter: floatConverter }) accessor secondaryProgress: number | undefined\n\n  /**\n   * Use an indeterminate progress indicator.\n   * @attr\n   */\n  @property({ reflect: true, type: Boolean }) accessor indeterminate: boolean | undefined\n\n  /**\n   * @returns The ratio of the secondary progress.\n   */\n  get secondaryRatio(): number {\n    return this.secondaryRatioInternal || 0\n  }\n\n  override connectedCallback(): void {\n    super.connectedCallback()\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'progressbar')\n    }\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    super.willUpdate(cp)\n    if (cp.has('secondaryProgress') || cp.has('indeterminate')) {\n      this.rangeChanged()\n    }\n  }\n\n  protected override updated(cp: PropertyValues<this>): void {\n    if (cp.has('min')) {\n      this.setAttribute('aria-valuemin', String(this.min))\n    }\n    if (cp.has('max')) {\n      this.setAttribute('aria-valuemax', String(this.max))\n    }\n    if (cp.has('indeterminate') || cp.has('value')) {\n      if (this.indeterminate) {\n        this.removeAttribute('aria-valuenow')\n      } else {\n        this.setAttribute('aria-valuenow', String(this.value))\n      }\n    }\n  }\n\n  protected override rangeChanged(): void {\n    super.rangeChanged()\n    const { secondaryProgress: sp } = this\n    if (typeof sp === 'number') {\n      const secondary = this.clampValue(sp)\n      this.secondaryRatioInternal = this.computeRatio(secondary) * 100\n    } else {\n      this.secondaryRatioInternal = undefined\n    }\n  }\n\n  override render(): TemplateResult {\n    const { secondaryRatio = 0, indeterminate = false, ratio = 0, disabled = false } = this\n    const primaryClasses = {\n      primary: true,\n      indeterminate: !disabled && indeterminate,\n      linear: !indeterminate,\n    }\n    const primaryStyle: StyleInfo = {}\n    if (!indeterminate) {\n      primaryStyle.transform = `scaleX(${ratio / 100})`\n    }\n    const secondaryStyle = {\n      transform: `scaleX(${secondaryRatio / 100})`,\n    }\n    const containerClasses: ClassInfo = {\n      container: true,\n      disabled,\n    }\n    return html`\n      <div class=\"${classMap(containerClasses)}\">\n        <div class=\"secondary\" ?hidden=\"${secondaryRatio === 0}\" style=\"${styleMap(secondaryStyle)}\"></div>\n        <div class=\"${classMap(primaryClasses)}\" style=\"${styleMap(primaryStyle)}\"></div>\n      </div>\n    `\n  }\n}\n"]}
+{"version":3,"file":"UiProgress.js","sourceRoot":"","sources":["../../../../../src/md/progress/internals/UiProgress.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues, TemplateResult } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { ClassInfo, classMap } from 'lit/directives/class-map.js'\nimport { StyleInfo, styleMap } from 'lit/directives/style-map.js'\nimport { UiRange } from './Range.js'\nimport { isDisabled, setDisabled } from '../../../lib/disabled.js'\nimport { floatConverter } from '../../../lib/AttributeConverters.js'\n\nexport default class UiProgress extends UiRange {\n  protected secondaryRatioInternal?: number\n\n  get disabled(): boolean {\n    return isDisabled(this)\n  }\n\n  /**\n   * When set, the button is a disabled state.\n   * @attribute\n   */\n  @property({ reflect: true, type: Boolean })\n  set disabled(value: boolean) {\n    const old = isDisabled(this)\n    setDisabled(this, value)\n    this.requestUpdate('disabled', old)\n  }\n\n  /**\n   * The number that represents the current secondary progress.\n   * @attr\n   */\n  @property({ type: Number, converter: floatConverter }) accessor secondaryProgress: number | undefined\n\n  /**\n   * @returns The ratio of the secondary progress.\n   */\n  get secondaryRatio(): number {\n    return this.secondaryRatioInternal || 0\n  }\n\n  protected override willUpdate(cp: PropertyValues<this>): void {\n    super.willUpdate(cp)\n    if (cp.has('secondaryProgress')) {\n      this.rangeChanged()\n    }\n  }\n\n  protected override rangeChanged(): void {\n    super.rangeChanged()\n    const { secondaryProgress: sp } = this\n    if (typeof sp === 'number') {\n      const secondary = this.clampValue(sp)\n      this.secondaryRatioInternal = this.computeRatio(secondary) * 100\n    } else {\n      this.secondaryRatioInternal = undefined\n    }\n  }\n\n  override render(): TemplateResult {\n    const { secondaryRatio = 0, indeterminate = false, ratio = 0, disabled = false } = this\n    const primaryClasses = {\n      primary: true,\n      indeterminate: !disabled && indeterminate,\n      linear: !indeterminate,\n    }\n    const primaryStyle: StyleInfo = {}\n    if (!indeterminate) {\n      primaryStyle.transform = `scaleX(${ratio / 100})`\n    }\n    const secondaryStyle = {\n      transform: `scaleX(${secondaryRatio / 100})`,\n    }\n    const containerClasses: ClassInfo = {\n      container: true,\n      disabled,\n    }\n    return html`\n      <div class=\"${classMap(containerClasses)}\">\n        <div class=\"secondary\" ?hidden=\"${secondaryRatio === 0}\" style=\"${styleMap(secondaryStyle)}\"></div>\n        <div class=\"${classMap(primaryClasses)}\" style=\"${styleMap(primaryStyle)}\"></div>\n      </div>\n    `\n  }\n}\n"]}

package/build/src/md/progress/ui-circular-progress.d.ts

@@ -0,0 +1,11 @@
+import type { CSSResultOrNative } from 'lit';
+import Element from './internals/CircularProgress.js';
+export declare class UiCircularProgressElement extends Element {
+    static styles: CSSResultOrNative[];
+}
+declare global {
+    interface HTMLElementTagNameMap {
+        'ui-circular-progress': UiCircularProgressElement;
+    }
+}
+//# sourceMappingURL=ui-circular-progress.d.ts.map

package/build/src/md/progress/ui-circular-progress.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-circular-progress.d.ts","sourceRoot":"","sources":["../../../../src/md/progress/ui-circular-progress.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,KAAK,CAAA;AAE5C,OAAO,OAAO,MAAM,iCAAiC,CAAA;AAGrD,qBACa,yBAA0B,SAAQ,OAAO;IACpD,OAAgB,MAAM,EAAE,iBAAiB,EAAE,CAAW;CACvD;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,sBAAsB,EAAE,yBAAyB,CAAA;KAClD;CACF"}

package/build/src/md/progress/ui-circular-progress.js

@@ -0,0 +1,27 @@
+import { __esDecorate, __runInitializers } from "tslib";
+import { customElement } from 'lit/decorators.js';
+import Element from './internals/CircularProgress.js';
+import styles from './internals/CircularProgress.styles.js';
+let UiCircularProgressElement = (() => {
+    let _classDecorators = [customElement('ui-circular-progress')];
+    let _classDescriptor;
+    let _classExtraInitializers = [];
+    let _classThis;
+    let _classSuper = Element;
+    var UiCircularProgressElement = class extends _classSuper {
+        static { _classThis = this; }
+        static {
+            const _metadata = typeof Symbol === "function" && Symbol.metadata ? Object.create(_classSuper[Symbol.metadata] ?? null) : void 0;
+            __esDecorate(null, _classDescriptor = { value: _classThis }, _classDecorators, { kind: "class", name: _classThis.name, metadata: _metadata }, null, _classExtraInitializers);
+            UiCircularProgressElement = _classThis = _classDescriptor.value;
+            if (_metadata) Object.defineProperty(_classThis, Symbol.metadata, { enumerable: true, configurable: true, writable: true, value: _metadata });
+        }
+        static styles = [styles];
+        static {
+            __runInitializers(_classThis, _classExtraInitializers);
+        }
+    };
+    return UiCircularProgressElement = _classThis;
+})();
+export { UiCircularProgressElement };
+//# sourceMappingURL=ui-circular-progress.js.map

package/build/src/md/progress/ui-circular-progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-circular-progress.js","sourceRoot":"","sources":["../../../../src/md/progress/ui-circular-progress.ts"],"names":[],"mappings":";AACA,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAA;AACjD,OAAO,OAAO,MAAM,iCAAiC,CAAA;AACrD,OAAO,MAAM,MAAM,wCAAwC,CAAA;IAG9C,yBAAyB;4BADrC,aAAa,CAAC,sBAAsB,CAAC;;;;sBACS,OAAO;yCAAf,SAAQ,WAAO;;;;YAAtD,6KAEC;;;;QADC,MAAM,CAAU,MAAM,GAAwB,CAAC,MAAM,CAAC,CAAA;;YAD3C,uDAAyB;;;;;SAAzB,yBAAyB","sourcesContent":["import type { CSSResultOrNative } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport Element from './internals/CircularProgress.js'\nimport styles from './internals/CircularProgress.styles.js'\n\n@customElement('ui-circular-progress')\nexport class UiCircularProgressElement extends Element {\n  static override styles: CSSResultOrNative[] = [styles]\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'ui-circular-progress': UiCircularProgressElement\n  }\n}\n"]}

package/build/src/md/select/internals/Option.js

@@ -171,7 +171,7 @@ let UiOption = (() => {
                     item: this,
                     value: this.value,
                 },
-                bubbles: true,
+                bubbles: false,
                 composed: true,
             }));
         }
@@ -200,7 +200,7 @@ let UiOption = (() => {
             return html `
       <div class="end">
         ${this.selected ? html `<ui-icon icon="check" class="selection-icon"></ui-icon>` : ''}
-        <slot name="end" @slotchange=${this.handleSlotChange}></slot>
+        <slot name="end" @slotchange=${this.handleEndSlotChange}></slot>
         <slot name="end-text" class="trailing-supporting-text"></slot>
       </div>
     `;

package/build/src/md/select/internals/Option.js.map

@@ -1 +1 @@
-{"version":3,"file":"Option.js","sourceRoot":"","sources":["../../../../../src/md/select/internals/Option.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues, TemplateResult } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport UiListItem from '../../list/internals/ListItem.js'\nimport { nanoid } from 'nanoid'\n\n/**\n * Material Design 3 Select Option component.\n *\n * The `ui-option` component represents a selectable item within a `ui-select` dropdown.\n * It extends `UiListItem` to provide consistent styling and behavior with other list components.\n *\n * @slot - The option content (label, icon, etc.)\n * @slot start - Content to display at the start of the option (icon, avatar, etc.)\n * @slot end - Content to display at the end of the option\n * @slot supporting-text - Supporting text below the main content\n * @fires select - Dispatched when the option is selected. Contains `{ item: UiOption, value: string }` in detail\n *\n * @example\n * Basic option\n * ```html\n * <ui-option value=\"apple\">Apple</ui-option>\n * ```\n *\n * @example\n * Option with supporting text\n * ```html\n * <ui-option value=\"john\" lines=\"two\">\n *   John Doe\n *   <span slot=\"supporting-text\">john@example.com</span>\n * </ui-option>\n * ```\n */\nexport default class UiOption extends UiListItem {\n  /**\n   * The value associated with this option. Used to identify the option when selected.\n   * This value is what gets set on the parent select element when this option is chosen.\n   *\n   * @example\n   * ```html\n   * <ui-option value=\"apple\">Apple</ui-option>\n   * <ui-option value=\"banana\">Banana</ui-option>\n   * ```\n   */\n  @property({ type: String, reflect: true }) accessor value: string | undefined\n\n  /**\n   * Whether this option is currently selected. This is typically managed automatically\n   * by the parent select component, but can be set manually for styling purposes.\n   *\n   * @default false\n   * @example\n   * ```html\n   * <ui-option value=\"apple\" selected>Apple</ui-option>\n   * ```\n   */\n  @property({ type: Boolean, reflect: true }) accessor selected = false\n\n  /**\n   * Returns the text representation of this option for display purposes.\n   * This method extracts and combines text content from all child nodes,\n   * including special handling for ui-icon elements.\n   *\n   * @readonly\n   * @returns {string} The rendered text value of the option\n   * @example\n   * ```javascript\n   * const option = document.querySelector('ui-option');\n   * console.log('Option text:', option.renderValue);\n   * ```\n   */\n  get renderValue(): string {\n    const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])')\n    if (!slot) return this.value || ''\n    const nodes = slot.assignedNodes({ flatten: true })\n    const content: string[] = []\n    for (const node of nodes) {\n      if (node.nodeType === Node.TEXT_NODE) {\n        content.push(node.textContent || '')\n      } else if (node.nodeType === Node.ELEMENT_NODE) {\n        const element = node as HTMLElement\n        if (element.tagName.toLowerCase() === 'ui-icon') {\n          content.push(element.getAttribute('icon') || '')\n        } else {\n          content.push(element.textContent || '')\n        }\n      }\n    }\n    return content.join(' ').trim() || this.value || ''\n  }\n\n  /**\n   * Initializes the option when it's connected to the DOM. Sets up ARIA attributes\n   * and generates a unique ID if one isn't provided.\n   *\n   * @protected\n   */\n  override connectedCallback(): void {\n    super.connectedCallback()\n    this.setAttribute('role', 'option')\n    if (!this.id) {\n      this.id = `option-${nanoid(6)}`\n    }\n  }\n\n  /**\n   * Handles property updates and triggers appropriate side effects.\n   * Currently monitors the `selected` property to update selection state.\n   *\n   * @param {PropertyValues<this>} changedProperties - Map of changed properties\n   * @protected\n   */\n  protected override updated(changedProperties: PropertyValues<this>): void {\n    super.updated(changedProperties)\n\n    if (changedProperties.has('selected')) {\n      this.updateSelectionState()\n    }\n  }\n\n  /**\n   * Updates the visual and accessibility state when selection changes.\n   * Adds/removes CSS classes and ARIA attributes based on selection state.\n   *\n   * @protected\n   * @example\n   * ```javascript\n   * // This is called automatically when the selected property changes\n   * option.selected = true; // Will trigger updateSelectionState()\n   * ```\n   */\n  protected updateSelectionState(): void {\n    if (this.selected) {\n      this.classList.add('selected')\n      this.setAttribute('aria-selected', 'true')\n    } else {\n      this.classList.remove('selected')\n      this.setAttribute('aria-selected', 'false')\n    }\n  }\n\n  /**\n   * Handles click events on the option. Prevents default behavior and dispatches\n   * a custom 'select' event that the parent select component can listen to.\n   *\n   * @param {MouseEvent} e - The click event\n   * @protected\n   * @fires select - Custom event with option details in event.detail\n   * @example\n   * ```javascript\n   * // Listen for option selection\n   * option.addEventListener('select', (e) => {\n   *   console.log('Selected option:', e.detail.item);\n   *   console.log('Selected value:', e.detail.value);\n   * });\n   * ```\n   */\n  override handleClick(e: MouseEvent): void {\n    e.preventDefault()\n    if (this.disabled) {\n      e.stopPropagation()\n      return\n    }\n\n    // Let the parent handle the selection\n    this.dispatchEvent(\n      new CustomEvent('select', {\n        detail: {\n          item: this,\n          value: this.value,\n        },\n        bubbles: true,\n        composed: true,\n      })\n    )\n  }\n\n  /**\n   * Renders the option's template. Creates the main structure with focus ring,\n   * ripple effect, and content areas.\n   *\n   * @returns {TemplateResult} The rendered template\n   * @protected\n   */\n  protected override render(): TemplateResult {\n    const surfaceClasses = classMap({\n      surface: true,\n      selected: this.selected,\n    })\n\n    return html`\n      ${this.renderFocusRing()} ${this.renderRipple()}\n      <div class=\"${surfaceClasses}\">${this.renderStart()} ${this.renderBody()} ${this.renderEnd()}</div>\n    `\n  }\n\n  /**\n   * Renders the end section of the option, including the selection check icon\n   * when the option is selected.\n   */\n  protected override renderEnd(): TemplateResult {\n    return html`\n      <div class=\"end\">\n        ${this.selected ? html`<ui-icon icon=\"check\" class=\"selection-icon\"></ui-icon>` : ''}\n        <slot name=\"end\" @slotchange=${this.handleSlotChange}></slot>\n        <slot name=\"end-text\" class=\"trailing-supporting-text\"></slot>\n      </div>\n    `\n  }\n}\n"]}
+{"version":3,"file":"Option.js","sourceRoot":"","sources":["../../../../../src/md/select/internals/Option.ts"],"names":[],"mappings":"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","sourcesContent":["import { html, PropertyValues, TemplateResult } from 'lit'\nimport { property } from 'lit/decorators.js'\nimport { classMap } from 'lit/directives/class-map.js'\nimport UiListItem from '../../list/internals/ListItem.js'\nimport { nanoid } from 'nanoid'\n\n/**\n * Material Design 3 Select Option component.\n *\n * The `ui-option` component represents a selectable item within a `ui-select` dropdown.\n * It extends `UiListItem` to provide consistent styling and behavior with other list components.\n *\n * @slot - The option content (label, icon, etc.)\n * @slot start - Content to display at the start of the option (icon, avatar, etc.)\n * @slot end - Content to display at the end of the option\n * @slot supporting-text - Supporting text below the main content\n * @fires select - Dispatched when the option is selected. Contains `{ item: UiOption, value: string }` in detail\n *\n * @example\n * Basic option\n * ```html\n * <ui-option value=\"apple\">Apple</ui-option>\n * ```\n *\n * @example\n * Option with supporting text\n * ```html\n * <ui-option value=\"john\" lines=\"two\">\n *   John Doe\n *   <span slot=\"supporting-text\">john@example.com</span>\n * </ui-option>\n * ```\n */\nexport default class UiOption extends UiListItem {\n  /**\n   * The value associated with this option. Used to identify the option when selected.\n   * This value is what gets set on the parent select element when this option is chosen.\n   *\n   * @example\n   * ```html\n   * <ui-option value=\"apple\">Apple</ui-option>\n   * <ui-option value=\"banana\">Banana</ui-option>\n   * ```\n   */\n  @property({ type: String, reflect: true }) accessor value: string | undefined\n\n  /**\n   * Whether this option is currently selected. This is typically managed automatically\n   * by the parent select component, but can be set manually for styling purposes.\n   *\n   * @default false\n   * @example\n   * ```html\n   * <ui-option value=\"apple\" selected>Apple</ui-option>\n   * ```\n   */\n  @property({ type: Boolean, reflect: true }) accessor selected = false\n\n  /**\n   * Returns the text representation of this option for display purposes.\n   * This method extracts and combines text content from all child nodes,\n   * including special handling for ui-icon elements.\n   *\n   * @readonly\n   * @returns {string} The rendered text value of the option\n   * @example\n   * ```javascript\n   * const option = document.querySelector('ui-option');\n   * console.log('Option text:', option.renderValue);\n   * ```\n   */\n  get renderValue(): string {\n    const slot = this.shadowRoot?.querySelector<HTMLSlotElement>('slot:not([name])')\n    if (!slot) return this.value || ''\n    const nodes = slot.assignedNodes({ flatten: true })\n    const content: string[] = []\n    for (const node of nodes) {\n      if (node.nodeType === Node.TEXT_NODE) {\n        content.push(node.textContent || '')\n      } else if (node.nodeType === Node.ELEMENT_NODE) {\n        const element = node as HTMLElement\n        if (element.tagName.toLowerCase() === 'ui-icon') {\n          content.push(element.getAttribute('icon') || '')\n        } else {\n          content.push(element.textContent || '')\n        }\n      }\n    }\n    return content.join(' ').trim() || this.value || ''\n  }\n\n  /**\n   * Initializes the option when it's connected to the DOM. Sets up ARIA attributes\n   * and generates a unique ID if one isn't provided.\n   *\n   * @protected\n   */\n  override connectedCallback(): void {\n    super.connectedCallback()\n    this.setAttribute('role', 'option')\n    if (!this.id) {\n      this.id = `option-${nanoid(6)}`\n    }\n  }\n\n  /**\n   * Handles property updates and triggers appropriate side effects.\n   * Currently monitors the `selected` property to update selection state.\n   *\n   * @param {PropertyValues<this>} changedProperties - Map of changed properties\n   * @protected\n   */\n  protected override updated(changedProperties: PropertyValues<this>): void {\n    super.updated(changedProperties)\n\n    if (changedProperties.has('selected')) {\n      this.updateSelectionState()\n    }\n  }\n\n  /**\n   * Updates the visual and accessibility state when selection changes.\n   * Adds/removes CSS classes and ARIA attributes based on selection state.\n   *\n   * @protected\n   * @example\n   * ```javascript\n   * // This is called automatically when the selected property changes\n   * option.selected = true; // Will trigger updateSelectionState()\n   * ```\n   */\n  protected updateSelectionState(): void {\n    if (this.selected) {\n      this.classList.add('selected')\n      this.setAttribute('aria-selected', 'true')\n    } else {\n      this.classList.remove('selected')\n      this.setAttribute('aria-selected', 'false')\n    }\n  }\n\n  /**\n   * Handles click events on the option. Prevents default behavior and dispatches\n   * a custom 'select' event that the parent select component can listen to.\n   *\n   * @param {MouseEvent} e - The click event\n   * @protected\n   * @fires select - Custom event with option details in event.detail\n   * @example\n   * ```javascript\n   * // Listen for option selection\n   * option.addEventListener('select', (e) => {\n   *   console.log('Selected option:', e.detail.item);\n   *   console.log('Selected value:', e.detail.value);\n   * });\n   * ```\n   */\n  override handleClick(e: MouseEvent): void {\n    e.preventDefault()\n    if (this.disabled) {\n      e.stopPropagation()\n      return\n    }\n\n    // Let the parent handle the selection\n    this.dispatchEvent(\n      new CustomEvent('select', {\n        detail: {\n          item: this,\n          value: this.value,\n        },\n        bubbles: false,\n        composed: true,\n      })\n    )\n  }\n\n  /**\n   * Renders the option's template. Creates the main structure with focus ring,\n   * ripple effect, and content areas.\n   *\n   * @returns {TemplateResult} The rendered template\n   * @protected\n   */\n  protected override render(): TemplateResult {\n    const surfaceClasses = classMap({\n      surface: true,\n      selected: this.selected,\n    })\n\n    return html`\n      ${this.renderFocusRing()} ${this.renderRipple()}\n      <div class=\"${surfaceClasses}\">${this.renderStart()} ${this.renderBody()} ${this.renderEnd()}</div>\n    `\n  }\n\n  /**\n   * Renders the end section of the option, including the selection check icon\n   * when the option is selected.\n   */\n  protected override renderEnd(): TemplateResult {\n    return html`\n      <div class=\"end\">\n        ${this.selected ? html`<ui-icon icon=\"check\" class=\"selection-icon\"></ui-icon>` : ''}\n        <slot name=\"end\" @slotchange=${this.handleEndSlotChange}></slot>\n        <slot name=\"end-text\" class=\"trailing-supporting-text\"></slot>\n      </div>\n    `\n  }\n}\n"]}

package/build/src/md/select/internals/Option.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Option.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/select/internals/Option.styles.ts"],"names":[],"mappings":";AAEA,wBAwIC"}
+{"version":3,"file":"Option.styles.d.ts","sourceRoot":"","sources":["../../../../../src/md/select/internals/Option.styles.ts"],"names":[],"mappings":";AAEA,wBASC"}

package/build/src/md/select/internals/Option.styles.js

@@ -1,139 +1,12 @@
 import { css } from 'lit';
 export default css `
-  :host {
-    display: block;
-    height: 56px;
-    outline: none;
-    cursor: default;
-    position: relative;
-
-    --md-focus-ring-shape-end-end: 0px;
-    --md-focus-ring-shape-end-start: 0px;
-    --md-focus-ring-shape-start-end: 0px;
-    --md-focus-ring-shape-start-start: 0px;
-
-    color: var(--md-sys-color-on-surface);
-  }
-
-  :host([disabled]) {
-    cursor: not-allowed;
-  }
-
-  :host([hidden]) {
-    display: none;
-  }
-
-  .surface {
-    height: inherit;
-    box-sizing: border-box;
-
-    display: flex;
-    align-items: center;
-    overflow: hidden;
-
-    padding: 8px 16px 8px 16px;
-    gap: 12px;
-  }
-
   .surface.selected {
     background-color: var(--md-sys-color-secondary-container);
     color: var(--md-sys-color-on-secondary-container);
   }
 
-  .ripple {
-    z-index: 3;
-  }
-
-  .headline {
-    font-family: var(--md-sys-typescale-body-large-font);
-    font-weight: var(--md-sys-typescale-body-large-weight);
-    font-size: var(--md-sys-typescale-body-large-size);
-    letter-spacing: var(--md-sys-typescale-body-large-tracking);
-    line-height: var(--md-sys-typescale-body-large-height);
-
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-
-    display: flex;
-    align-items: center;
-  }
-
-  .supporting-text {
-    color: var(--md-sys-color-on-surface-variant);
-
-    font-family: var(--md-sys-typescale-body-medium-font);
-    font-weight: var(--md-sys-typescale-body-medium-weight);
-    font-size: var(--md-sys-typescale-body-medium-size);
-    letter-spacing: var(--md-sys-typescale-body-medium-tracking);
-    line-height: var(--md-sys-typescale-body-medium-height);
-
-    overflow: hidden;
-  }
-
-  .supporting-text ::slotted(*),
-  slot[name='end-text']::slotted(*) {
-    margin: 0;
-    padding: 0;
-    overflow: hidden;
-  }
-
-  slot[name='end-text']::slotted(*) {
-    margin-right: 8px;
-    margin-left: 16px;
-  }
-
-  :host slot[name='end']::slotted(*) {
-    color: var(--md-sys-color-on-surface-variant);
-    fill: var(--md-sys-color-on-surface-variant);
-    margin-left: 16px;
-  }
-
-  :host slot[name='start']::slotted(*) {
-    display: block;
-    margin-right: 16px;
-  }
-
-  :host([image='icon']) slot[name='start']::slotted(*) {
-    width: 24px;
-    height: 24px;
-  }
-
-  :host([image='avatar']) slot[name='start']::slotted(*) {
-    width: 40px;
-    height: 40px;
-  }
-
-  :host([image='image']) slot[name='start']::slotted(*) {
-    width: 56px;
-    height: 56px;
-  }
-
-  :host([image='video']) slot[name='start']::slotted(*) {
-    width: 114px;
-    height: 64px;
-  }
-
-  .body {
-    flex: 1;
-    overflow: hidden;
-    display: flex;
-    flex-direction: column;
-  }
-
-  .end {
-    display: flex;
-    align-items: center;
-    gap: 8px;
-  }
-
   .selection-icon {
     color: var(--md-sys-color-on-surface);
   }
-
-  :host(.highlight) .surface {
-    background-color: var(--md-sys-color-tertiary-container);
-    color: var(--md-sys-color-on-tertiary-container);
-  }
 `;
 //# sourceMappingURL=Option.styles.js.map

package/build/src/md/select/internals/Option.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Option.styles.js","sourceRoot":"","sources":["../../../../../src/md/select/internals/Option.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwIjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  :host {\n    display: block;\n    height: 56px;\n    outline: none;\n    cursor: default;\n    position: relative;\n\n    --md-focus-ring-shape-end-end: 0px;\n    --md-focus-ring-shape-end-start: 0px;\n    --md-focus-ring-shape-start-end: 0px;\n    --md-focus-ring-shape-start-start: 0px;\n\n    color: var(--md-sys-color-on-surface);\n  }\n\n  :host([disabled]) {\n    cursor: not-allowed;\n  }\n\n  :host([hidden]) {\n    display: none;\n  }\n\n  .surface {\n    height: inherit;\n    box-sizing: border-box;\n\n    display: flex;\n    align-items: center;\n    overflow: hidden;\n\n    padding: 8px 16px 8px 16px;\n    gap: 12px;\n  }\n\n  .surface.selected {\n    background-color: var(--md-sys-color-secondary-container);\n    color: var(--md-sys-color-on-secondary-container);\n  }\n\n  .ripple {\n    z-index: 3;\n  }\n\n  .headline {\n    font-family: var(--md-sys-typescale-body-large-font);\n    font-weight: var(--md-sys-typescale-body-large-weight);\n    font-size: var(--md-sys-typescale-body-large-size);\n    letter-spacing: var(--md-sys-typescale-body-large-tracking);\n    line-height: var(--md-sys-typescale-body-large-height);\n\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n\n    display: flex;\n    align-items: center;\n  }\n\n  .supporting-text {\n    color: var(--md-sys-color-on-surface-variant);\n\n    font-family: var(--md-sys-typescale-body-medium-font);\n    font-weight: var(--md-sys-typescale-body-medium-weight);\n    font-size: var(--md-sys-typescale-body-medium-size);\n    letter-spacing: var(--md-sys-typescale-body-medium-tracking);\n    line-height: var(--md-sys-typescale-body-medium-height);\n\n    overflow: hidden;\n  }\n\n  .supporting-text ::slotted(*),\n  slot[name='end-text']::slotted(*) {\n    margin: 0;\n    padding: 0;\n    overflow: hidden;\n  }\n\n  slot[name='end-text']::slotted(*) {\n    margin-right: 8px;\n    margin-left: 16px;\n  }\n\n  :host slot[name='end']::slotted(*) {\n    color: var(--md-sys-color-on-surface-variant);\n    fill: var(--md-sys-color-on-surface-variant);\n    margin-left: 16px;\n  }\n\n  :host slot[name='start']::slotted(*) {\n    display: block;\n    margin-right: 16px;\n  }\n\n  :host([image='icon']) slot[name='start']::slotted(*) {\n    width: 24px;\n    height: 24px;\n  }\n\n  :host([image='avatar']) slot[name='start']::slotted(*) {\n    width: 40px;\n    height: 40px;\n  }\n\n  :host([image='image']) slot[name='start']::slotted(*) {\n    width: 56px;\n    height: 56px;\n  }\n\n  :host([image='video']) slot[name='start']::slotted(*) {\n    width: 114px;\n    height: 64px;\n  }\n\n  .body {\n    flex: 1;\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n  }\n\n  .end {\n    display: flex;\n    align-items: center;\n    gap: 8px;\n  }\n\n  .selection-icon {\n    color: var(--md-sys-color-on-surface);\n  }\n\n  :host(.highlight) .surface {\n    background-color: var(--md-sys-color-tertiary-container);\n    color: var(--md-sys-color-on-tertiary-container);\n  }\n`\n"]}
+{"version":3,"file":"Option.styles.js","sourceRoot":"","sources":["../../../../../src/md/select/internals/Option.styles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,eAAe,GAAG,CAAA;;;;;;;;;CASjB,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport default css`\n  .surface.selected {\n    background-color: var(--md-sys-color-secondary-container);\n    color: var(--md-sys-color-on-secondary-container);\n  }\n\n  .selection-icon {\n    color: var(--md-sys-color-on-surface);\n  }\n`\n"]}

package/build/src/md/select/internals/Select.d.ts

@@ -24,6 +24,7 @@ export default class UiSelect extends LitElement {
      * The currently selected value. Corresponds to the `value` attribute of the selected `ui-option`.
      * When set programmatically, it will update the selected option if a matching option exists.
      *
+     * @attribute
      * @example
      * ```html
      * <ui-select value="apple">
@@ -38,6 +39,7 @@ export default class UiSelect extends LitElement {
      * The name attribute for form submission. This value will be used as the key
      * when the form is submitted.
      *
+     * @attribute
      * @example
      * ```html
      * <ui-select name="country" value="us">
@@ -50,6 +52,7 @@ export default class UiSelect extends LitElement {
      * The label text displayed in the select field. Provides accessible labeling
      * and is shown as the floating label in the outlined text field.
      *
+     * @attribute
      * @example
      * ```html
      * <ui-select label="Select a country">
@@ -62,7 +65,7 @@ export default class UiSelect extends LitElement {
      * Whether the select is required for form validation. When true, the select
      * must have a value selected for the form to be valid.
      *
-     * @default false
+     * @attribute
      * @example
      * ```html
      * <ui-select required label="Required field">
@@ -75,6 +78,7 @@ export default class UiSelect extends LitElement {
      * Whether the select is in an invalid state. This is typically set automatically
      * during validation, but can be set manually to indicate validation errors.
      *
+     * @attribute
      * @example
      * ```html
      * <ui-select invalid invalidText="Please select a valid option">
@@ -87,6 +91,7 @@ export default class UiSelect extends LitElement {
      * The error message to display when the select is invalid. This text is shown
      * below the select field when `invalid` is true.
      *
+     * @attribute
      * @example
      * ```html
      * <ui-select invalid invalidText="This field is required">
@@ -95,11 +100,16 @@ export default class UiSelect extends LitElement {
      * ```
      */
     accessor invalidText: string | undefined;
+    /**
+     * @attribute
+     */
+    accessor supportingText: string | undefined;
     /**
      * Whether the select is disabled. When disabled, the select cannot be interacted
      * with and will not receive focus or respond to user input.
      *
      * @default false
+     * @attribute
      * @example
      * ```html
      * <ui-select disabled label="Disabled select">

package/build/src/md/select/internals/Select.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../../src/md/select/internals/Select.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../../src/md/select/internals/Select.ts"],"names":[],"mappings":"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"}

package/build/src/md/select/internals/Select.js

@@ -26,6 +26,9 @@ let UiSelect = (() => {
     let _invalidText_decorators;
     let _invalidText_initializers = [];
     let _invalidText_extraInitializers = [];
+    let _supportingText_decorators;
+    let _supportingText_initializers = [];
+    let _supportingText_extraInitializers = [];
     let _disabled_decorators;
     let _disabled_initializers = [];
     let _disabled_extraInitializers = [];
@@ -50,6 +53,7 @@ let UiSelect = (() => {
             _required_decorators = [property({ type: Boolean })];
             _invalid_decorators = [property({ type: Boolean })];
             _invalidText_decorators = [property({ type: String })];
+            _supportingText_decorators = [property({ type: String })];
             _disabled_decorators = [property({ type: Boolean, reflect: true })];
             _open_decorators = [property({ type: Boolean, reflect: true })];
             _selectedOption_decorators = [state()];
@@ -61,6 +65,7 @@ let UiSelect = (() => {
             __esDecorate(this, null, _required_decorators, { kind: "accessor", name: "required", static: false, private: false, access: { has: obj => "required" in obj, get: obj => obj.required, set: (obj, value) => { obj.required = value; } }, metadata: _metadata }, _required_initializers, _required_extraInitializers);
             __esDecorate(this, null, _invalid_decorators, { kind: "accessor", name: "invalid", static: false, private: false, access: { has: obj => "invalid" in obj, get: obj => obj.invalid, set: (obj, value) => { obj.invalid = value; } }, metadata: _metadata }, _invalid_initializers, _invalid_extraInitializers);
             __esDecorate(this, null, _invalidText_decorators, { kind: "accessor", name: "invalidText", static: false, private: false, access: { has: obj => "invalidText" in obj, get: obj => obj.invalidText, set: (obj, value) => { obj.invalidText = value; } }, metadata: _metadata }, _invalidText_initializers, _invalidText_extraInitializers);
+            __esDecorate(this, null, _supportingText_decorators, { kind: "accessor", name: "supportingText", static: false, private: false, access: { has: obj => "supportingText" in obj, get: obj => obj.supportingText, set: (obj, value) => { obj.supportingText = value; } }, metadata: _metadata }, _supportingText_initializers, _supportingText_extraInitializers);
             __esDecorate(this, null, _disabled_decorators, { kind: "accessor", name: "disabled", static: false, private: false, access: { has: obj => "disabled" in obj, get: obj => obj.disabled, set: (obj, value) => { obj.disabled = value; } }, metadata: _metadata }, _disabled_initializers, _disabled_extraInitializers);
             __esDecorate(this, null, _open_decorators, { kind: "accessor", name: "open", static: false, private: false, access: { has: obj => "open" in obj, get: obj => obj.open, set: (obj, value) => { obj.open = value; } }, metadata: _metadata }, _open_initializers, _open_extraInitializers);
             __esDecorate(this, null, _selectedOption_decorators, { kind: "accessor", name: "selectedOption", static: false, private: false, access: { has: obj => "selectedOption" in obj, get: obj => obj.selectedOption, set: (obj, value) => { obj.selectedOption = value; } }, metadata: _metadata }, _selectedOption_initializers, _selectedOption_extraInitializers);
@@ -79,6 +84,7 @@ let UiSelect = (() => {
          * The currently selected value. Corresponds to the `value` attribute of the selected `ui-option`.
          * When set programmatically, it will update the selected option if a matching option exists.
          *
+         * @attribute
          * @example
          * ```html
          * <ui-select value="apple">
@@ -102,6 +108,7 @@ let UiSelect = (() => {
          * The name attribute for form submission. This value will be used as the key
          * when the form is submitted.
          *
+         * @attribute
          * @example
          * ```html
          * <ui-select name="country" value="us">
@@ -116,6 +123,7 @@ let UiSelect = (() => {
          * The label text displayed in the select field. Provides accessible labeling
          * and is shown as the floating label in the outlined text field.
          *
+         * @attribute
          * @example
          * ```html
          * <ui-select label="Select a country">
@@ -130,6 +138,7 @@ let UiSelect = (() => {
          * Whether the select is in an invalid state. This is typically set automatically
          * during validation, but can be set manually to indicate validation errors.
          *
+         * @attribute
          * @example
          * ```html
          * <ui-select invalid invalidText="Please select a valid option">
@@ -142,7 +151,7 @@ let UiSelect = (() => {
          * Whether the select is required for form validation. When true, the select
          * must have a value selected for the form to be valid.
          *
-         * @default false
+         * @attribute
          * @example
          * ```html
          * <ui-select required label="Required field">
@@ -157,6 +166,7 @@ let UiSelect = (() => {
          * Whether the select is in an invalid state. This is typically set automatically
          * during validation, but can be set manually to indicate validation errors.
          *
+         * @attribute
          * @example
          * ```html
          * <ui-select invalid invalidText="Please select a valid option">
@@ -171,6 +181,7 @@ let UiSelect = (() => {
          * The error message to display when the select is invalid. This text is shown
          * below the select field when `invalid` is true.
          *
+         * @attribute
          * @example
          * ```html
          * <ui-select invalid invalidText="This field is required">
@@ -180,7 +191,13 @@ let UiSelect = (() => {
          */
         get invalidText() { return this.#invalidText_accessor_storage; }
         set invalidText(value) { this.#invalidText_accessor_storage = value; }
-        #disabled_accessor_storage = (__runInitializers(this, _invalidText_extraInitializers), __runInitializers(this, _disabled_initializers, false
+        #supportingText_accessor_storage = (__runInitializers(this, _invalidText_extraInitializers), __runInitializers(this, _supportingText_initializers, void 0));
+        /**
+         * @attribute
+         */
+        get supportingText() { return this.#supportingText_accessor_storage; }
+        set supportingText(value) { this.#supportingText_accessor_storage = value; }
+        #disabled_accessor_storage = (__runInitializers(this, _supportingText_extraInitializers), __runInitializers(this, _disabled_initializers, false
         /**
          * Whether the dropdown menu is currently open. This property reflects the
          * current state of the dropdown and can be set programmatically to open/close it.
@@ -201,6 +218,7 @@ let UiSelect = (() => {
          * with and will not receive focus or respond to user input.
          *
          * @default false
+         * @attribute
          * @example
          * ```html
          * <ui-select disabled label="Disabled select">
@@ -571,6 +589,7 @@ let UiSelect = (() => {
       aria-hidden="true"
       .invalid=${this.invalid}
       .invalidText=${this.invalidText || ''}
+      .supportingText=${this.supportingText || ''}
       class="input"
     >
       <ui-icon slot="suffix">arrow_drop_down</ui-icon>