@quartzds/core 1.0.0-beta.12 → 1.0.0-beta.121

package/components/qds-progress-bar.js.map

@@ -0,0 +1 @@
+{"file":"qds-progress-bar.js","mappings":";;;;;;;AAAA,MAAM,cAAc,GAAG,g4BAAg4B;;ACAv5B;AACA;AACA;;;;;;;;;;;;;;;;;;MA2Ba,WAAW,iBAAAA,kBAAA,CAAA,MAAA,WAAA,SAAAC,CAAA,CAAA;AANxB,IAAA,WAAA,CAAA,YAAA,EAAA;;;;;;;;AAOE;;AAEG;AACqB,QAAA,IAAI,CAAA,IAAA,GAAU,UAAU;AAEhD;;;;;;;;AAQG;AACqB,QAAA,IAAM,CAAA,MAAA,GAC5B,EAAgC;AAWlC;;;;;;;AAOG;AACqB,QAAA,IAAQ,CAAA,QAAA,GAAW,EAAE;AAiB5B,QAAA,IAAK,CAAA,KAAA,GAAG,IAAI;AAE7B,QAAA,qBAAA,CAAA,GAAA,CAAA,IAAA,EAAY,CAAC,CAAA;AAEb,QAAA,uBAAA,CAAA,GAAA,CAAA,IAAA,EAAc,CAAC,CAAA;QAEf,qBAAY,CAAA,GAAA,CAAA,IAAA,EAAA,EAAE,CAAA;AA+Ef;IAhEW,UAAU,GAAA;QAClB,MAAM,GAAG,GACP,OAAO,IAAI,CAAC,GAAG,KAAK,QAAQ,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,IAAI,CAAC,GAAG;AACvE,QAAA,sBAAA,CAAA,IAAI,EAAa,qBAAA,EAAA,GAAG,KAAK,SAAS,IAAI,MAAM,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,GAAG,GAAG,CAAC,GAAG,CAAC,GAAG,GAAG,EAAA,GAAA,CAAA;AAE5E,QAAA,IAAI,CAAC,SAAS,CAAC,YAAY,GAAG,sBAAA,CAAA,IAAI,EAAU,qBAAA,EAAA,GAAA,CAAA,CAAC,QAAQ,EAAE;AAEvD,QAAA,sBAAA,CAAA,IAAI,EAAA,sBAAA,EAAA,GAAA,EAAA,4BAAA,CAAiB,CAArB,IAAA,CAAA,IAAI,CAAmB;;IAIf,YAAY,GAAA;AACpB,QAAA,MAAM,KAAK,GACT,OAAO,IAAI,CAAC,KAAK,KAAK;cAClB,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,KAAK;AAC9B,cAAE,IAAI,CAAC,KAAK;AAChB,QAAA,sBAAA,CAAA,IAAI,EACF,uBAAA,EAAA,KAAK,KAAK,SAAS,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,EAAA,GAAA,CAAA;QAErE,IAAI,CAAC,SAAS,CAAC,YAAY;;YAEzB,IAAI,CAAC,KAAK,KAAK,SAAS,GAAG,IAAI,GAAG,sBAAA,CAAA,IAAI,+BAAY,CAAC,QAAQ,EAAE;AAE/D,QAAA,sBAAA,CAAA,IAAI,EAAA,sBAAA,EAAA,GAAA,EAAA,4BAAA,CAAiB,CAArB,IAAA,CAAA,IAAI,CAAmB;;IAGlB,iBAAiB,GAAA;AACtB,QAAA,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,aAAa;QACnC,sBAAA,CAAA,IAAI,EAAc,sBAAA,EAAA,GAAA,EAAA,yBAAA,CAAA,CAAA,IAAA,CAAlB,IAAI,EAAe,QAAQ,EAAE,MAAM,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC;AACzD,QAAA,sBAAA,CAAA,IAAI,EAAA,sBAAA,EAAA,GAAA,EAAA,yBAAA,CAAc,CAAlB,IAAA,CAAA,IAAI,EAAe,UAAU,EAAE,MAAM,sBAAA,CAAA,IAAI,EAAA,qBAAA,EAAA,GAAA,CAAU,CAAC;QAEpD,IAAI,CAAC,UAAU,EAAE;QACjB,IAAI,CAAC,YAAY,EAAE;;IAGd,MAAM,GAAA;AACX,QAAA,QACE,CAAiB,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,aAAA,EAAA,MAAM,EAAC,KAAK,EAAC,WAAW,EAAA,WAAA,EAAY,sBAAA,CAAA,IAAI,EAAc,sBAAA,EAAA,GAAA,EAAA,6BAAA,CAAA,EAAA,EACrE,CAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAE;AACL,gBAAA,SAAS,EAAE,IAAI;gBACf,mBAAmB,EAAE,sBAAA,CAAA,IAAI,EAAU,qBAAA,EAAA,GAAA,CAAA,KAAK,EAAE;aAC3C,EAAA,WAAA,EACU,uBAAA,IAAI,EAAA,sBAAA,EAAA,GAAA,EAAA,6BAAA,CAAc,EAC7B,KAAK,EAAE,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,EAC5B,CAAA,CACE;;;;;;;;;;;;;;;;;;;;;AA1DR,IAAA,QAAQ,IAAI,CAAC,IAAI;AACf,QAAA,KAAK,OAAO;QACZ,KAAK,OAAO,EAAE;YACZ,OAAO,IAAI,CAAC,IAAI;;QAElB,SAAS;AACP,YAAA,OAAO,UAAU;;;AAGvB,CAAC,EAAA,4BAAA,GAAA,SAAA,4BAAA,GAAA;AAsDC,IAAA,IAAI,IAAI,CAAC,KAAK,KAAK,SAAS,EAAE;QAC5B,sBAAA,CAAA,IAAI,EAAA,qBAAA,EAAa,EAAE,MAAA;AACnB,QAAA,IAAI,CAAC,KAAK,GAAG,KAAK;QAClB;;IAGF,sBAAA,CAAA,IAAI,EAAa,qBAAA,EAAA,sBAAA,CAAA,IAAI,EAAA,uBAAA,EAAA,GAAA,CAAY,GAAG,sBAAA,CAAA,IAAI,EAAU,qBAAA,EAAA,GAAA,CAAA,EAAA,GAAA,CAAA;IAClD,IAAI,CAAC,KAAK,GAAG,CAAA,EAAG,IAAI,CAAC,GAAG,CAAC,sBAAA,CAAA,IAAI,6BAAU,GAAG,GAAG,EAAE,GAAG,CAAC,CAAA,CAAA,CAAG;AACxD,CAAC,EAAA,yBAAA,GAAA,SAAA,yBAAA,CAEa,CAAc,EAAE,GAAkB,EAAA;AAC9C,IAAA,MAAM,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAE,CAAC;AAChE,CAAC;;;;;;;;;;;;;;;;;;;;","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/components/progress-bar/progress-bar.css?tag=qds-progress-bar&encapsulation=shadow","src/components/progress-bar/progress-bar.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2024 Schneider Electric\n *\n * SPDX-License-Identifier: Apache-2.0\n */\n\n@import url('../shared.css');\n\n:host {\n  display: block;\n  width: 100%;\n}\n\n.qds-track,\n.qds-bar {\n  overflow: hidden;\n}\n\n.qds-track {\n  background-color: var(--qds-theme-control-slider-track-background);\n  border-radius: var(--qds-signature-line-progress-cap-radius);\n}\n\n.qds-bar {\n  background-color: var(--qds-theme-signature-line-progress-determinate);\n  border-radius: var(--qds-signature-line-progress-cap-radius);\n  transition: width 0.6s cubic-bezier(0.83, 0, 0.17, 1);\n}\n\n@media (prefers-reduced-motion) {\n  .qds-bar {\n    transition: none;\n  }\n}\n\n.qds-indeterminate {\n  animation: indeterminate 2s linear infinite;\n  background-color: transparent;\n  background-image: var(--qds-theme-signature-line-progress-indeterminate);\n}\n\n@keyframes indeterminate {\n  from {\n    transform: translateX(-100%);\n  }\n\n  to {\n    transform: translateX(200%);\n  }\n}\n\n[data-size='small'] {\n  height: var(--qds-signature-line-progress-small-height);\n}\n\n[data-size='standard'] {\n  height: var(--qds-signature-line-progress-standard-height);\n}\n\n[data-size='large'] {\n  height: var(--qds-signature-line-progress-large-height);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  h,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core'\n\nimport type { Size } from '../shared'\n\n/**\n * The `<qds-progress-bar>` element displays an indicator showing the\n * completion progress of a task.\n *\n * @see https://quartz.se.com/build/components/progress-bar\n */\n@Component({\n  tag: 'qds-progress-bar',\n  formAssociated: true,\n  shadow: true,\n  styleUrl: 'progress-bar.css',\n})\nexport class ProgressBar implements ComponentInterface {\n  /**\n   * The progress bar's size.\n   */\n  @Prop() public readonly size?: Size = 'standard'\n\n  /**\n   * Returns a list of the [`<label>`][] elements associated with the\n   * `qds-progress-bar` element.\n   *\n   * [`<label>`]: https://developer.mozilla.org/docs/Web/HTML/Element/label\n   *\n   * @readonly\n   * @webnative\n   */\n  @Prop() public readonly labels: ElementInternals['labels'] =\n    {} as ElementInternals['labels']\n\n  /**\n   * Specifies how much work the task indicated by the progress bar requires.\n   * `max` must have a value greater than 0 and be a valid floating point\n   * number.\n   *\n   * @webnative\n   */\n  @Prop() public readonly max?: number | string\n\n  /**\n   * Returns the result of dividing the current value (`value`) by the maximum\n   * value (`max`); if the progress bar is an indeterminate progress bar, it\n   * returns `-1`.\n   *\n   * @readonly\n   * @webnative\n   */\n  @Prop() public readonly position: number = -1\n\n  /**\n   * Specifies how much of the task has been completed. It must be a valid\n   * floating point number between `0` and `max`, or between `0` and `1` if\n   * `max` is omitted. If this attribute is not specified, the progress bar is\n   * indeterminate; this indicates that an activity is ongoing with no\n   * indication of how long it is expected to take.\n   *\n   * @webnative\n   */\n  @Prop() public readonly value?: number | string\n\n  @Element() private readonly host!: HTMLElement\n\n  @AttachInternals() private readonly internals!: ElementInternals\n\n  @State() private width = '0%'\n\n  #localMax = 1\n\n  #localValue = 0\n\n  #position = -1\n\n  get #computedSize(): Size {\n    switch (this.size) {\n      case 'small':\n      case 'large': {\n        return this.size\n      }\n      default: {\n        return 'standard'\n      }\n    }\n  }\n\n  @Watch('max')\n  protected maxChanged(): void {\n    const max =\n      typeof this.max === 'string' ? Number.parseFloat(this.max) : this.max\n    this.#localMax = max === undefined || Number.isNaN(max) || max < 0 ? 1 : max\n\n    this.internals.ariaValueMax = this.#localMax.toString()\n\n    this.#positionChanged()\n  }\n\n  @Watch('value')\n  protected valueChanged(): void {\n    const value =\n      typeof this.value === 'string'\n        ? Number.parseFloat(this.value)\n        : this.value\n    this.#localValue =\n      value === undefined || Number.isNaN(value) || value < 0 ? 0 : value\n\n    this.internals.ariaValueNow =\n      // eslint-disable-next-line unicorn/no-null\n      this.value === undefined ? null : this.#localValue.toString()\n\n    this.#positionChanged()\n  }\n\n  public componentWillLoad(): void {\n    this.internals.role = 'progressbar'\n    this.#defineGetter('labels', () => this.internals.labels)\n    this.#defineGetter('position', () => this.#position)\n\n    this.maxChanged()\n    this.valueChanged()\n  }\n\n  public render() {\n    return (\n      <div aria-hidden=\"true\" class=\"qds-track\" data-size={this.#computedSize}>\n        <div\n          class={{\n            'qds-bar': true,\n            'qds-indeterminate': this.#position === -1,\n          }}\n          data-size={this.#computedSize}\n          style={{ width: this.width }}\n        />\n      </div>\n    )\n  }\n\n  #positionChanged(): void {\n    if (this.value === undefined) {\n      this.#position = -1\n      this.width = '50%'\n      return\n    }\n\n    this.#position = this.#localValue / this.#localMax\n    this.width = `${Math.min(this.#position * 100, 100)}%`\n  }\n\n  #defineGetter(p: PropertyKey, get: () => unknown): void {\n    Object.defineProperty(this.host, p, { enumerable: true, get })\n  }\n}\n"],"version":3}

package/components/qds-radio.d.ts

@@ -2,8 +2,8 @@ import type { Components, JSX } from "../dist/types/components";
 
 interface QdsRadio extends Components.QdsRadio, HTMLElement {}
 export const QdsRadio: {
-  prototype: QdsRadio;
-  new (): QdsRadio;
+    prototype: QdsRadio;
+    new (): QdsRadio;
 };
 /**
  * Used to define this component and all nested components recursively.

package/components/qds-radio.js

@@ -1,109 +1,14 @@
 /*!
- * SPDX-FileCopyrightText: © 2023 Schneider Electric
+ * SPDX-FileCopyrightText: © 2026 Schneider Electric
  * 
- * SPDX-License-Identifier: LGPL-2.1-only
+ * SPDX-License-Identifier: Apache-2.0
  */
-import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
-import { p as pickFocusEventAttributes, a as invariant, i as inheritAriaAttributes, b as inheritAttributes } from './helpers.js';
-import { d as defineCustomElement$3 } from './icon.js';
-import { d as defineCustomElement$2 } from './label.js';
-
-const radioCss = ".sc-qds-radio-h{box-sizing:border-box}[hidden].sc-qds-radio-h{display:none !important}.sc-qds-radio-h *.sc-qds-radio,.sc-qds-radio-h *.sc-qds-radio::before,.sc-qds-radio-h *.sc-qds-radio::after{box-sizing:inherit}.sc-qds-radio-h{display:inline-block;line-height:0}.icon.sc-qds-radio{display:none;color:var(--qds-theme-signature-color-contrast);inset-inline-start:0;pointer-events:none;position:absolute}.label.sc-qds-radio{cursor:pointer;display:inline-flex;position:relative}.radio.sc-qds-radio{align-items:center;-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border-radius:var(--qds-control-rounded-border-radius);border:var(--qds-control-border-width) solid var(--qds-theme-control-border);cursor:pointer;display:flex;flex-shrink:0;justify-content:center;margin:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}.radio.sc-qds-radio:focus-visible{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.radio.sc-qds-radio::before{border-radius:var(--qds-control-rounded-border-radius);content:'';height:10px;position:absolute;width:10px}.radio.sc-qds-radio:hover::before{box-shadow:inset 1em 1em var(--qds-theme-signature-color-hover)}.radio.sc-qds-radio:active::before{box-shadow:inset 1em 1em var(--qds-theme-signature-color-pressed)}.radio.sc-qds-radio:checked{background-color:var(--qds-theme-signature-color-default);border-color:transparent}.radio.sc-qds-radio:checked~.icon.sc-qds-radio{display:inline-block}.radio.sc-qds-radio:checked:hover{background-color:var(--qds-theme-signature-color-hover)}.radio.sc-qds-radio:checked:active{background-color:var(--qds-theme-signature-color-pressed)}[aria-disabled='true'].sc-qds-radio{opacity:var(--qds-theme-disabled);pointer-events:none}.icon[data-size='small'].sc-qds-radio,.radio[data-size='small'].sc-qds-radio{width:var(--qds-control-small-icon-size);height:var(--qds-control-small-icon-size)}.inline[data-size='small'].sc-qds-radio{margin-block:var(--qds-control-small-padding-auto-height)}.label[data-size='small'].sc-qds-radio{gap:var(--qds-control-small-gap-siblings-related)}.icon[data-size='standard'].sc-qds-radio,.radio[data-size='standard'].sc-qds-radio{width:var(--qds-control-standard-icon-size);height:var(--qds-control-standard-icon-size)}.inline[data-size='standard'].sc-qds-radio{margin-block:var(--qds-control-standard-padding-auto-height)}.label[data-size='standard'].sc-qds-radio{gap:var(--qds-control-standard-gap-siblings-related)}.icon[data-size='large'].sc-qds-radio,.radio[data-size='large'].sc-qds-radio{width:var(--qds-control-large-icon-size);height:var(--qds-control-large-icon-size)}.inline[data-size='large'].sc-qds-radio{margin-block:var(--qds-control-large-padding-auto-height)}.label[data-size='large'].sc-qds-radio{gap:var(--qds-control-large-gap-siblings-related)}";
-
-const Radio = /*@__PURE__*/ proxyCustomElement(class Radio extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.blurEmitter = createEvent(this, "qdsBlur", 2);
-    this.changeEmitter = createEvent(this, "qdsChange", 6);
-    this.focusEmitter = createEvent(this, "qdsFocus", 2);
-    this.inheritedAttributes = {};
-    this.ref = (input) => {
-      this.input = input;
-    };
-    this.onBlur = (event) => {
-      this.blurEmitter.emit(pickFocusEventAttributes(event));
-    };
-    this.onChange = () => {
-      this.changeEmitter.emit();
-    };
-    this.onFocus = (event) => {
-      this.focusEmitter.emit(pickFocusEventAttributes(event));
-    };
-    this.inline = false;
-    this.size = 'standard';
-    this.text = undefined;
-    this.checked = undefined;
-    this.disabled = undefined;
-    this.form = undefined;
-    this.name = undefined;
-    this.required = undefined;
-    this.value = undefined;
-  }
-  get computedDisabled() {
-    return this.disabled ?? false;
-  }
-  get hasText() {
-    return this.text !== undefined && this.text !== '';
-  }
-  onClick() {
-    invariant(this.input);
-    this.checked = this.input.checked;
-  }
-  componentWillLoad() {
-    this.inheritedAttributes = {
-      ...inheritAriaAttributes(this.element),
-      ...inheritAttributes(this.element, ['tabindex']),
-    };
-  }
-  render() {
-    return (
-    // eslint-disable-next-line jsx-a11y/label-has-associated-control
-    h("label", { "aria-disabled": this.computedDisabled ? 'true' : 'false', class: {
-        inline: this.inline,
-        label: true,
-      }, "data-size": this.size }, h("input", { checked: this.checked, class: "radio", "data-size": this.size, disabled: this.disabled, form: this.form, name: this.name, onBlur: this.onBlur, onChange: this.onChange, onFocus: this.onFocus, ref: this.ref, required: this.required, type: "radio", value: this.value ?? undefined, ...this.inheritedAttributes }), h("qds-icon", { "aria-hidden": "true", class: "icon", "data-size": this.size, library: "core", name: "checked" }), this.hasText && h("qds-label", { size: this.size, text: this.text })));
-  }
-  get element() { return this; }
-  static get style() { return radioCss; }
-}, [2, "qds-radio", {
-    "inline": [4],
-    "size": [513],
-    "text": [1537],
-    "checked": [1540],
-    "disabled": [1540],
-    "form": [1],
-    "name": [1],
-    "required": [4],
-    "value": [1032]
-  }, [[0, "click", "onClick"]]]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["qds-radio", "qds-icon", "qds-label"];
-  components.forEach(tagName => { switch (tagName) {
-    case "qds-radio":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, Radio);
-      }
-      break;
-    case "qds-icon":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$3();
-      }
-      break;
-    case "qds-label":
-      if (!customElements.get(tagName)) {
-        defineCustomElement$2();
-      }
-      break;
-  } });
-}
+import { R as Radio, d as defineCustomElement$1 } from './p-D9pW936J.js';
 
 const QdsRadio = Radio;
 const defineCustomElement = defineCustomElement$1;
 
 export { QdsRadio, defineCustomElement };
+//# sourceMappingURL=qds-radio.js.map
 
 //# sourceMappingURL=qds-radio.js.map

package/components/qds-radio.js.map

@@ -1 +1 @@
-{"file":"qds-radio.js","mappings":";;;;;;;;;;AAAA,MAAM,QAAQ,GAAG,q0FAAq0F;;MCiCz0F,KAAK;;;;;;;IAoGR,wBAAmB,GAAe,EAAE,CAAA;IAkE3B,QAAG,GAAG,CAAC,KAAwB;MAC9C,IAAI,CAAC,KAAK,GAAG,KAAK,CAAA;KACnB,CAAA;IAEgB,WAAM,GAAG,CAAC,KAAiB;MAC1C,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,CAAA;KACvD,CAAA;IAEgB,aAAQ,GAAG;MAC1B,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,CAAA;KAC1B,CAAA;IAEgB,YAAO,GAAG,CAAC,KAAiB;MAC3C,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,wBAAwB,CAAC,KAAK,CAAC,CAAC,CAAA;KACxD,CAAA;kBA7KyC,KAAK;gBAKY,UAAU;;;;;;;;;EA4FrE,IAAY,gBAAgB;IAC1B,OAAO,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAA;GAC9B;EAED,IAAY,OAAO;IACjB,OAAO,IAAI,CAAC,IAAI,KAAK,SAAS,IAAI,IAAI,CAAC,IAAI,KAAK,EAAE,CAAA;GACnD;EAGS,OAAO;IACf,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAA;IAErB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAA;GAClC;EAEM,iBAAiB;IACtB,IAAI,CAAC,mBAAmB,GAAG;MACzB,GAAG,qBAAqB,CAAC,IAAI,CAAC,OAAO,CAAC;MACtC,GAAG,iBAAiB,CAAC,IAAI,CAAC,OAAO,EAAE,CAAC,UAAU,CAAC,CAAC;KACjD,CAAA;GACF;EAEM,MAAM;IACX;;IAEE,8BACiB,IAAI,CAAC,gBAAgB,GAAG,MAAM,GAAG,OAAO,EACvD,KAAK,EAAE;QACL,MAAM,EAAE,IAAI,CAAC,MAAM;QACnB,KAAK,EAAE,IAAI;OACZ,eACU,IAAI,CAAC,IAAI,IAEpB,aACE,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,KAAK,EAAC,OAAO,eACF,IAAI,CAAC,IAAI,EACpB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,GAAG,EAAE,IAAI,CAAC,GAAG,EACb,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,OAAO,EACZ,KAAK,EAAE,IAAI,CAAC,KAAK,IAAI,SAAS,KAE1B,IAAI,CAAC,mBAAmB,GAC5B,EACF,+BACc,MAAM,EAClB,KAAK,EAAC,MAAM,eACD,IAAI,CAAC,IAAI,EACpB,OAAO,EAAC,MAAM,EACd,IAAI,EAAC,SAAS,GACd,EACD,IAAI,CAAC,OAAO,IAAI,iBAAW,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,CAC1D,EACT;GACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/radio/radio.css?tag=qds-radio&encapsulation=scoped","src/components/radio/radio.tsx"],"sourcesContent":["/*\n * SPDX-FileCopyrightText: © 2023 Schneider Electric\n *\n * SPDX-License-Identifier: LGPL-2.1-only\n */\n\n@import url('../shared.css');\n\n:host {\n  display: inline-block;\n  line-height: 0;\n}\n\n.icon {\n  display: none;\n  color: var(--qds-theme-signature-color-contrast);\n  inset-inline-start: 0;\n  pointer-events: none;\n  position: absolute;\n}\n\n.label {\n  cursor: pointer;\n  display: inline-flex;\n  position: relative;\n}\n\n.radio {\n  align-items: center;\n  appearance: none;\n  background-color: var(--qds-theme-control-input-background);\n  border-radius: var(--qds-control-rounded-border-radius);\n  border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n  cursor: pointer;\n  display: flex;\n  flex-shrink: 0;\n  justify-content: center;\n  margin: 0;\n  print-color-adjust: exact;\n\n  &:focus-visible {\n    outline: var(--qds-theme-focus-border) solid var(--qds-focus-border-width);\n    outline-offset: var(--qds-focus-border-offset);\n  }\n\n  &::before {\n    border-radius: var(--qds-control-rounded-border-radius);\n    content: '';\n    height: 10px;\n    position: absolute;\n    width: 10px;\n  }\n\n  &:hover::before {\n    box-shadow: inset 1em 1em var(--qds-theme-signature-color-hover);\n  }\n\n  &:active::before {\n    box-shadow: inset 1em 1em var(--qds-theme-signature-color-pressed);\n  }\n\n  &:checked {\n    background-color: var(--qds-theme-signature-color-default);\n    border-color: transparent;\n\n    & ~ .icon {\n      display: inline-block;\n    }\n\n    &:hover {\n      background-color: var(--qds-theme-signature-color-hover);\n    }\n\n    &:active {\n      background-color: var(--qds-theme-signature-color-pressed);\n    }\n  }\n}\n\n[aria-disabled='true'] {\n  opacity: var(--qds-theme-disabled);\n  pointer-events: none;\n}\n\n[data-size='small'] {\n  &:is(.icon, .radio) {\n    width: var(--qds-control-small-icon-size);\n    height: var(--qds-control-small-icon-size);\n  }\n\n  &.inline {\n    margin-block: var(--qds-control-small-padding-auto-height);\n  }\n\n  &.label {\n    gap: var(--qds-control-small-gap-siblings-related);\n  }\n}\n\n[data-size='standard'] {\n  &:is(.icon, .radio) {\n    width: var(--qds-control-standard-icon-size);\n    height: var(--qds-control-standard-icon-size);\n  }\n\n  &.inline {\n    margin-block: var(--qds-control-standard-padding-auto-height);\n  }\n\n  &.label {\n    gap: var(--qds-control-standard-gap-siblings-related);\n  }\n}\n\n[data-size='large'] {\n  &:is(.icon, .radio) {\n    width: var(--qds-control-large-icon-size);\n    height: var(--qds-control-large-icon-size);\n  }\n\n  &.inline {\n    margin-block: var(--qds-control-large-padding-auto-height);\n  }\n\n  &.label {\n    gap: var(--qds-control-large-gap-siblings-related);\n  }\n}\n","// SPDX-FileCopyrightText: © 2023 Schneider Electric\n//\n// SPDX-License-Identifier: LGPL-2.1-only\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport { Component, Element, Event, h, Listen, Prop } from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport {\n  inheritAriaAttributes,\n  inheritAttributes,\n  invariant,\n  pickFocusEventAttributes,\n} from '../../helpers'\nimport type { Value } from '../controls'\n\nexport type RadioSize = 'large' | 'small' | 'standard'\n\n/**\n * `<qds-radio>` elements are rendered as circles that are filled when\n * selected. They are generally used in **radio groups** — collections of radio\n * buttons describing a set of related options.\n *\n * Only one radio button in a given radio group can be selected at the same\n * time.\n *\n * @see https://quartz.se.com/build/components/radio\n */\n@Component({\n  tag: 'qds-radio',\n  scoped: true,\n  styleUrl: 'radio.css',\n})\nexport class Radio implements ComponentInterface {\n  /**\n   * Adds vertical margin to the radio for alignment.\n   *\n   * This is useful when creating inline layouts so that the first lines have\n   * the correct vertical centering.\n   */\n  @Prop() public readonly inline: boolean = false\n\n  /**\n   * The radio button's size.\n   */\n  @Prop({ reflect: true }) public readonly size: RadioSize = 'standard'\n\n  /**\n   * The radio button's text.\n   */\n  @Prop({ mutable: true, reflect: true }) public readonly text?: string\n\n  /**\n   * Sets the radio button's state.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true, reflect: true }) public checked?: boolean\n\n  /**\n   * Prevents the radio button from being interacted with: it cannot be pressed\n   * or focused.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true, reflect: true }) public disabled?: boolean\n\n  /**\n   * The [`<form>`](https://developer.mozilla.org/docs/Web/HTML/Element/form)\n   * element to associate the radio button with (its form owner).\n   *\n   * The value of this property must be the id of a `<form>` in the same\n   * document. If this property is not set, the `<qds-radio>` is associated\n   * with its ancestor `<form>` element, if any.\n   *\n   * This property lets you associate `<qds-radio>` elements to `<form>`s\n   * anywhere in the document, not just inside a `<form>`. It can also override\n   * an ancestor `<form>` element.\n   *\n   * @webnative\n   */\n  @Prop() public readonly form?: string\n\n  /**\n   * Specify the radio group this radio button belongs to.\n   *\n   * Once a radio group is established, selecting any radio button in that\n   * group automatically deselects any currently-selected radio button in the\n   * same group.\n   *\n   * @webnative\n   */\n  @Prop() public readonly name?: string\n\n  /**\n   * Specify the group the radio button belongs to as required.\n   *\n   * If any radio button in a same-named group of radio buttons has the\n   * `required` attribute, a radio button in that group must be checked,\n   * although it doesn't have to be the one with the attribute applied.\n   *\n   * @webnative\n   */\n  @Prop() public readonly required?: boolean\n\n  /**\n   * The value of the radio button, submitted as a name/value pair with form\n   * data.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public value?: Value\n\n  /**\n   * Emitted when the radio button loses focus.\n   */\n  @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n  private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when the radio button is checked by the user.\n   */\n  @Event({ eventName: 'qdsChange', cancelable: false })\n  private readonly changeEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when the radio button gains focus.\n   */\n  @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n  private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  @Element() private readonly element!: HTMLQdsRadioElement\n\n  private inheritedAttributes: Attributes = {}\n\n  private input?: HTMLInputElement\n\n  private get computedDisabled(): boolean {\n    return this.disabled ?? false\n  }\n\n  private get hasText(): boolean {\n    return this.text !== undefined && this.text !== ''\n  }\n\n  @Listen('click')\n  protected onClick(): void {\n    invariant(this.input)\n\n    this.checked = this.input.checked\n  }\n\n  public componentWillLoad(): void {\n    this.inheritedAttributes = {\n      ...inheritAriaAttributes(this.element),\n      ...inheritAttributes(this.element, ['tabindex']),\n    }\n  }\n\n  public render() {\n    return (\n      // eslint-disable-next-line jsx-a11y/label-has-associated-control\n      <label\n        aria-disabled={this.computedDisabled ? 'true' : 'false'}\n        class={{\n          inline: this.inline,\n          label: true,\n        }}\n        data-size={this.size}\n      >\n        <input\n          checked={this.checked}\n          class=\"radio\"\n          data-size={this.size}\n          disabled={this.disabled}\n          form={this.form}\n          name={this.name}\n          onBlur={this.onBlur}\n          onChange={this.onChange}\n          onFocus={this.onFocus}\n          ref={this.ref}\n          required={this.required}\n          type=\"radio\"\n          value={this.value ?? undefined}\n          // eslint-disable-next-line react/jsx-props-no-spreading\n          {...this.inheritedAttributes}\n        />\n        <qds-icon\n          aria-hidden=\"true\"\n          class=\"icon\"\n          data-size={this.size}\n          library=\"core\"\n          name=\"checked\"\n        />\n        {this.hasText && <qds-label size={this.size} text={this.text} />}\n      </label>\n    )\n  }\n\n  private readonly ref = (input?: HTMLInputElement): void => {\n    this.input = input\n  }\n\n  private readonly onBlur = (event: FocusEvent): void => {\n    this.blurEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  private readonly onChange = (): void => {\n    this.changeEmitter.emit()\n  }\n\n  private readonly onFocus = (event: FocusEvent): void => {\n    this.focusEmitter.emit(pickFocusEventAttributes(event))\n  }\n}\n"],"version":3}
+{"file":"qds-radio.js","mappings":";;;;;;;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/components/qds-select.d.ts

@@ -0,0 +1,11 @@
+import type { Components, JSX } from "../dist/types/components";
+
+interface QdsSelect extends Components.QdsSelect, HTMLElement {}
+export const QdsSelect: {
+    prototype: QdsSelect;
+    new (): QdsSelect;
+};
+/**
+ * Used to define this component and all nested components recursively.
+ */
+export const defineCustomElement: () => void;

package/components/qds-select.js

@@ -0,0 +1,381 @@
+/*!
+ * SPDX-FileCopyrightText: © 2026 Schneider Electric
+ * 
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-D2489VzR.js';
+import { i as invariant, p as pickFocusEventAttributes, e as pickInputEventAttributes, c as inheritAriaAttributes } from './p-CURs27Ur.js';
+import { V as VALID_STATE, C as CUSTOM_ERROR_FLAGS, N as NO_ERROR_FLAGS } from './p-CZRW1LV_.js';
+import { d as defineCustomElement$2 } from './p-DtxwXYGb.js';
+
+const selectCss = ":host([hidden]){display:none!important}:host{display:inline-block}slot{display:none}.qds-container{box-sizing:border-box;display:grid;grid-template-areas:\"j\"}.qds-container,.qds-select{width:inherit}.qds-icon,.qds-select{color:var(--qds-theme-form-input-text-placeholder);grid-area:j}.qds-icon{place-self:center end;pointer-events:none}.qds-select{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-form-input-background-default);border-color:var(--qds-theme-form-input-border-default);border-radius:var(\n      --qds-control-border-radius-top-left,var(--qds-form-input-border-radius)\n    ) var(\n      --qds-control-border-radius-top-right,var(--qds-form-input-border-radius)\n    ) var(\n      --qds-control-border-radius-bottom-right,var(--qds-form-input-border-radius)\n    ) var(\n      --qds-control-border-radius-bottom-left,var(--qds-form-input-border-radius)\n    );border-style:solid;border-width:var(--qds-form-input-border-width-default) var(\n      --qds-control-border-width-inline-end,var(--qds-form-input-border-width-default)\n    ) var(\n      --qds-control-border-width-block-end,var(--qds-form-input-border-width-default)\n    ) var(--qds-form-input-border-width-default);margin:0;outline:0;padding-block:0;text-overflow:ellipsis}.qds-select:enabled:hover{background-color:var(--qds-theme-form-input-background-hover);border-color:var(--qds-theme-form-input-border-hover)}.qds-select:enabled:active{background-color:var(--qds-theme-form-input-background-active);color:var(--qds-theme-form-input-text-active)}.qds-select:not(:focus):user-invalid{border-color:var(--qds-theme-feedback-result-failure)}.qds-select[data-status]{border-width:var(--qds-form-input-border-width-status) var(\n        --qds-control-border-width-inline-end,var(--qds-form-input-border-width-status)\n      ) var(\n        --qds-control-border-width-block-end,var(--qds-form-input-border-width-status)\n      ) var(--qds-form-input-border-width-status)}.qds-select[data-status=success]{border-color:var(--qds-theme-form-input-border-success)}.qds-select[data-status=warning]{border-color:var(--qds-theme-form-input-border-warning)}.qds-select :not(:focus):user-invalid,.qds-select[data-status=error]{border-color:var(--qds-theme-form-input-border-error)}.qds-select:disabled,.qds-select:disabled+.qds-icon{opacity:var(--qds-theme-disabled)}:is(::slotted(optgroup),::slotted(optgroup:not(:disabled)>option),::slotted(option)):disabled{opacity:var(--qds-theme-disabled)}::slotted(optgroup){font:var(--qds-accessory-section-title)}::slotted(optgroup>option),::slotted(option){font:var(--qds-list-item-label-main)}.qds-select[data-size=small]{font:var(--qds-form-small-text);padding-inline:var(--qds-form-input-small-padding-start) var(--qds-form-input-small-padding-end)}.qds-select[data-size=small]:not([multiple]){min-height:var(--qds-form-input-small-height);padding-inline-end:calc(var(--qds-control-small-icon-size) + var(--qds-form-input-small-gap-internal) + var(--qds-form-input-small-padding-end))}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);margin-inline-end:calc(var(--qds-form-input-small-padding-end) + var(--qds-form-input-border-width-default));width:var(--qds-control-small-icon-size)}.qds-select[data-size=standard]{font:var(--qds-form-standard-text);padding-inline:var(--qds-form-input-standard-padding-start) var(--qds-form-input-standard-padding-end)}.qds-select[data-size=standard]:not([multiple]){min-height:var(--qds-form-input-standard-height);padding-inline-end:calc(var(--qds-control-standard-icon-size) + var(--qds-form-input-standard-gap-internal) + var(--qds-form-input-standard-padding-end))}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);margin-inline-end:calc(var(--qds-form-input-standard-padding-end) + var(--qds-form-input-border-width-default));width:var(--qds-control-standard-icon-size)}.qds-select[data-size=large]{font:var(--qds-form-large-text);padding-inline:var(--qds-form-input-large-padding-start) var(--qds-form-input-large-padding-end)}.qds-select[data-size=large]:not([multiple]){min-height:var(--qds-form-input-large-height);padding-inline-end:calc(var(--qds-control-large-icon-size) + var(--qds-form-input-large-gap-internal) + var(--qds-form-input-large-padding-end))}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);margin-inline-end:calc(var(--qds-form-input-large-padding-end) + var(--qds-form-input-border-width-default));width:var(--qds-control-large-icon-size)}.qds-focus-ring{border-radius:max(1px,var(\n        --qds-control-border-radius-top-left,var(--qds-form-input-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-top-right,var(--qds-form-input-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-right,var(--qds-form-input-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-left,var(--qds-form-input-border-radius)\n      ));box-shadow:0 0 0 var(--qds-focus-heavy-border-width) var(--qds-theme-focus-border);grid-area:j;height:calc(100% + var(--qds-form-input-border-width-default) - var(\n        --qds-control-border-width-block-end,\n        var(--qds-form-input-border-width-default)\n      ));isolation:isolate;outline:var(--qds-theme-focus-border-contrast) solid var(--qds-focus-light-border-width);outline-offset:0;pointer-events:none;visibility:hidden;width:calc(100% + var(--qds-form-input-border-width-default) - var(\n        --qds-control-border-width-inline-end,\n        var(--qds-form-input-border-width-default)\n      ))}.qds-select:focus-visible~.qds-focus-ring{visibility:visible}";
+
+// SPDX-FileCopyrightText: © 2024 Schneider Electric
+//
+// SPDX-License-Identifier: Apache-2.0
+var __classPrivateFieldGet = (undefined && undefined.__classPrivateFieldGet) || function (receiver, state, kind, f) {
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a getter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot read private member from an object whose class did not declare it");
+    return kind === "m" ? f : kind === "a" ? f.call(receiver) : f ? f.value : state.get(receiver);
+};
+var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) || function (receiver, state, value, kind, f) {
+    if (kind === "m")
+        throw new TypeError("Private method is not writable");
+    if (kind === "a" && !f)
+        throw new TypeError("Private accessor was defined without a setter");
+    if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver))
+        throw new TypeError("Cannot write private member to an object whose class did not declare it");
+    return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
+};
+var _Select_instances, _Select_inheritedAttributes, _Select_select, _Select_computedDisabled_get, _Select_computedOptions_get, _Select_computedStatus_get, _Select_computedSize_get, _Select_computedType_get, _Select_computedValue_get, _Select_computedSelectedOptions_get, _Select_ref, _Select_onBlur, _Select_onChange, _Select_onFocus, _Select_onInput, _Select_onSlotchange, _Select_defineGetter;
+const throwError = () => {
+    invariant(false);
+};
+const EMPTY_OPTIONS_COLLECTION = {
+    length: 0,
+    selectedIndex: -1,
+    add: throwError,
+    remove: throwError,
+    item: throwError,
+    namedItem: throwError,
+    [Symbol.iterator]: throwError,
+};
+const Select = /*@__PURE__*/ proxyCustomElement(class Select extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.__attachShadow();
+        this.blurEmitter = createEvent(this, "qdsBlur", 2);
+        this.changeEmitter = createEvent(this, "qdsChange", 6);
+        this.focusEmitter = createEvent(this, "qdsFocus", 2);
+        this.inputEmitter = createEvent(this, "qdsInput", 6);
+        this.internals = this.attachInternals();
+        _Select_instances.add(this);
+        /**
+         * The select's size.
+         *
+         * > ***NOTE:*** The native [`size` HTML attribute] is not supported. CSS
+         * `height` should be used instead if this functionality is needed.
+         *
+         * [`size` HTML attribute]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size
+         */
+        this.size = 'standard';
+        /**
+         * The [`<form>`][] element to associate the select with (its form owner).
+         *
+         * The value of this attribute must be the id of a `<form>` in the same
+         * document. If this attribute is not set, the `<qds-select>` is associated
+         * with its ancestor `<form>` element, if any.
+         *
+         * This attribute lets you associate `<qds-select>` elements to `<form>`s
+         * anywhere in the document, not just inside a `<form>`. It can also override
+         * an ancestor `<form>` element.
+         *
+         * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form
+         *
+         * @readonly
+         * @webnative
+         */
+        // eslint-disable-next-line unicorn/no-null
+        this.form = null;
+        /**
+         * Returns the number of elements in the [`<option>`s collection][].
+         *
+         * [`<option>`s collection]: https://developer.mozilla.org/docs/Web/API/HTMLOptionsCollection
+         *
+         * @readonly
+         * @webnative
+         */
+        this.length = 0;
+        /**
+         * An [`HTMLOptionsCollection`][] of the [`<option>`][] elements contained by
+         * the `<qds-select>` element.
+         *
+         * [`HTMLOptionsCollection`]: https://developer.mozilla.org/docs/Web/API/HTMLOptionsCollection
+         * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option
+         *
+         * @readonly
+         * @webnative
+         */
+        this.options = EMPTY_OPTIONS_COLLECTION;
+        /**
+         * The index of the first or last selected [`<option>`][] element, depending
+         * on the value of `multiple`. The value `-1` indicates that no element is
+         * selected.
+         *
+         * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option
+         *
+         * @webnative
+         */
+        this.selectedIndex = -1;
+        /**
+         * Collection of the [`<option>`][] elements contained within the
+         * `<qds-select>` element that are currently selected.
+         *
+         * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option
+         *
+         * @readonly
+         * @webnative
+         */
+        this.selectedOptions = EMPTY_OPTIONS_COLLECTION;
+        /**
+         * Returns `select-multiple` if the `multiple` attribute is true;
+         * `select-one` otherwise.
+         *
+         * @readonly
+         * @webnative
+         */
+        this.type = 'select-one';
+        /**
+         * The error message that would be shown to the user if the `<qds-select>`
+         * was to be checked for validity.
+         *
+         * @readonly
+         * @webnative
+         */
+        this.validationMessage = '';
+        /**
+         * The [`ValidityState`][] object for this `<qds-select>`.
+         *
+         * [`ValidityState`]: https://developer.mozilla.org/docs/Web/API/ValidityState
+         *
+         * @readonly
+         * @webnative
+         */
+        this.validity = VALID_STATE;
+        /**
+         * The `value` property of the first selected [`<option>`][] element, or the
+         * empty string if no options are selected.
+         *
+         * [`<option>`]: https://developer.mozilla.org/docs/Web/HTML/Element/option
+         *
+         * @webnative
+         */
+        this.value = '';
+        /**
+         * True if `<qds-select>` will be validated when the form is submitted;
+         * false otherwise.
+         *
+         * @readonly
+         * @webnative
+         */
+        this.willValidate = false;
+        _Select_inheritedAttributes.set(this, {});
+        _Select_select.set(this, void 0);
+        this.checkValidity = () => this.internals.checkValidity();
+        this.reportValidity = () => this.internals.reportValidity();
+        this.setCustomValidity = (error) => {
+            invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+            __classPrivateFieldGet(this, _Select_select, "f").setCustomValidity(error);
+            if (error)
+                this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, __classPrivateFieldGet(this, _Select_select, "f"));
+            else
+                this.internals.setValidity(NO_ERROR_FLAGS);
+        };
+        this.addItem = (element, before) => {
+            invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+            __classPrivateFieldGet(this, _Select_select, "f").add(element, before);
+        };
+        this.removeItem = (index) => {
+            invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+            __classPrivateFieldGet(this, _Select_select, "f").remove(index);
+        };
+        this.item = (index) => {
+            invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+            return __classPrivateFieldGet(this, _Select_select, "f").item(index);
+        };
+        this.namedItem = (name) => {
+            invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+            return __classPrivateFieldGet(this, _Select_select, "f").namedItem(name);
+        };
+        _Select_ref.set(this, (select) => {
+            __classPrivateFieldSet(this, _Select_select, select, "f");
+        });
+        _Select_onBlur.set(this, (event) => {
+            this.blurEmitter.emit(pickFocusEventAttributes(event));
+        });
+        _Select_onChange.set(this, () => {
+            this.changeEmitter.emit();
+        });
+        _Select_onFocus.set(this, (event) => {
+            this.focusEmitter.emit(pickFocusEventAttributes(event));
+        });
+        _Select_onInput.set(this, (event) => {
+            invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+            this.value = __classPrivateFieldGet(this, _Select_select, "f").value;
+            this.inputEmitter.emit(pickInputEventAttributes(event));
+        });
+        _Select_onSlotchange.set(this, (event) => {
+            invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+            const { currentTarget } = event;
+            invariant(currentTarget instanceof HTMLSlotElement);
+            __classPrivateFieldGet(this, _Select_select, "f").replaceChildren(...currentTarget.assignedNodes().map((node) => node.cloneNode(true)));
+        });
+    }
+    onClick(event) {
+        if (__classPrivateFieldGet(this, _Select_instances, "a", _Select_computedDisabled_get))
+            event.stopImmediatePropagation();
+    }
+    disabledChanged() {
+        if (__classPrivateFieldGet(this, _Select_instances, "a", _Select_computedDisabled_get))
+            // eslint-disable-next-line unicorn/no-null
+            this.internals.setFormValue(null);
+        else
+            this.internals.setFormValue(__classPrivateFieldGet(this, _Select_instances, "a", _Select_computedValue_get));
+    }
+    selectedIndexChanged() {
+        invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+        __classPrivateFieldGet(this, _Select_select, "f").selectedIndex = this.selectedIndex;
+    }
+    tabindexChanged(newValue) {
+        const parsedValue = Number.parseInt(newValue, 10);
+        this.tabIndex =
+            parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue;
+    }
+    validationChanged() {
+        invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+        __classPrivateFieldGet(this, _Select_select, "f").value = __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedValue_get);
+        __classPrivateFieldGet(this, _Select_select, "f").required = this.required ?? false;
+        const { valid } = __classPrivateFieldGet(this, _Select_select, "f").validity;
+        if (valid)
+            this.internals.setValidity(NO_ERROR_FLAGS, undefined, __classPrivateFieldGet(this, _Select_select, "f"));
+        else
+            this.internals.setValidity(__classPrivateFieldGet(this, _Select_select, "f").validity, __classPrivateFieldGet(this, _Select_select, "f").validationMessage, __classPrivateFieldGet(this, _Select_select, "f"));
+    }
+    statusChanged() {
+        this.internals.ariaInvalid = (__classPrivateFieldGet(this, _Select_instances, "a", _Select_computedStatus_get) === 'error').toString();
+    }
+    componentWillLoad() {
+        __classPrivateFieldGet(this, _Select_instances, "m", _Select_defineGetter).call(this, 'form', () => this.internals.form);
+        __classPrivateFieldGet(this, _Select_instances, "m", _Select_defineGetter).call(this, 'willValidate', () => this.internals.willValidate);
+        __classPrivateFieldGet(this, _Select_instances, "m", _Select_defineGetter).call(this, 'validity', () => this.internals.validity);
+        __classPrivateFieldGet(this, _Select_instances, "m", _Select_defineGetter).call(this, 'validationMessage', () => this.internals.validationMessage);
+        __classPrivateFieldGet(this, _Select_instances, "m", _Select_defineGetter).call(this, 'type', () => __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedType_get));
+        __classPrivateFieldGet(this, _Select_instances, "m", _Select_defineGetter).call(this, 'options', () => __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedOptions_get));
+        __classPrivateFieldGet(this, _Select_instances, "m", _Select_defineGetter).call(this, 'length', () => __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedOptions_get).length);
+        __classPrivateFieldGet(this, _Select_instances, "m", _Select_defineGetter).call(this, 'selectedOptions', () => __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedSelectedOptions_get));
+        __classPrivateFieldSet(this, _Select_inheritedAttributes, inheritAriaAttributes(this.host), "f");
+        this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
+        this.statusChanged();
+    }
+    componentDidLoad() {
+        invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+        this.validationChanged();
+        this.selectedIndex = __classPrivateFieldGet(this, _Select_select, "f").selectedIndex;
+    }
+    render() {
+        return (h("div", { key: '4e54c80117271921cdf5eeaa8498f91467b514f5', class: {
+                'qds-container': true,
+                'qds-multiple': this.multiple ?? false,
+            }, "data-size": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedSize_get) }, h("select", { key: '239e13dcdd0dec5f835005d80417b546cb41b181', autoComplete: this.autoComplete,
+            // eslint-disable-next-line jsx-a11y/no-autofocus
+            autoFocus: this.host.autofocus, class: "qds-select", "data-size": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedSize_get), "data-status": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedStatus_get), disabled: __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedDisabled_get), multiple: this.multiple, name: this.name, onBlur: __classPrivateFieldGet(this, _Select_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Select_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Select_onFocus, "f"), onInput: __classPrivateFieldGet(this, _Select_onInput, "f"), ref: __classPrivateFieldGet(this, _Select_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedDisabled_get) ? undefined : this.tabIndex, ...__classPrivateFieldGet(this, _Select_inheritedAttributes, "f") }), this.multiple !== true && (h("qds-icon", { key: '4d3e255a814e9d5ba41e125d33f918d24f446438', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Select_instances, "a", _Select_computedSize_get), library: "core", name: "dropdown" })), h("slot", { key: '1bbdca184b14af7b56ca0f0b484455e310ada1b9', onSlotchange: __classPrivateFieldGet(this, _Select_onSlotchange, "f") }), h("div", { key: 'e79fbfb62d6b4420a009180df83e911b575b321f', class: "qds-focus-ring" })));
+    }
+    static get delegatesFocus() { return true; }
+    static get formAssociated() { return true; }
+    get host() { return this; }
+    static get watchers() { return {
+        "disabled": ["disabledChanged"],
+        "selectedIndex": ["selectedIndexChanged"],
+        "tabindex": ["tabindexChanged"],
+        "required": ["validationChanged"],
+        "value": ["validationChanged"],
+        "status": ["statusChanged"]
+    }; }
+    static get style() { return selectCss; }
+}, [337, "qds-select", {
+        "status": [1],
+        "size": [1],
+        "autoComplete": [1, "autocomplete"],
+        "disabled": [4],
+        "form": [1],
+        "length": [2],
+        "multiple": [4],
+        "name": [1],
+        "options": [16],
+        "required": [4],
+        "selectedIndex": [1026, "selected-index"],
+        "selectedOptions": [16, "selected-options"],
+        "type": [1],
+        "validationMessage": [1, "validation-message"],
+        "validity": [16],
+        "value": [1025],
+        "willValidate": [4, "will-validate"],
+        "tabIndex": [32]
+    }, [[0, "click", "onClick"]], {
+        "disabled": ["disabledChanged"],
+        "selectedIndex": ["selectedIndexChanged"],
+        "tabindex": ["tabindexChanged"],
+        "required": ["validationChanged"],
+        "value": ["validationChanged"],
+        "status": ["statusChanged"]
+    }]);
+_Select_inheritedAttributes = new WeakMap(), _Select_select = new WeakMap(), _Select_ref = new WeakMap(), _Select_onBlur = new WeakMap(), _Select_onChange = new WeakMap(), _Select_onFocus = new WeakMap(), _Select_onInput = new WeakMap(), _Select_onSlotchange = new WeakMap(), _Select_instances = new WeakSet(), _Select_computedDisabled_get = function _Select_computedDisabled_get() {
+    return ((this.host.matches(':disabled') || (this.disabled ?? false)) &&
+        this.host.getAttribute('disabled') !== 'false');
+}, _Select_computedOptions_get = function _Select_computedOptions_get() {
+    invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+    return __classPrivateFieldGet(this, _Select_select, "f").options;
+}, _Select_computedStatus_get = function _Select_computedStatus_get() {
+    switch (this.status) {
+        case 'error':
+        case 'success':
+        case 'warning': {
+            return this.status;
+        }
+        default: {
+            return undefined;
+        }
+    }
+}, _Select_computedSize_get = function _Select_computedSize_get() {
+    switch (this.size) {
+        case 'standard':
+        case 'small':
+        case 'large': {
+            return this.size;
+        }
+        default: {
+            return 'standard';
+        }
+    }
+}, _Select_computedType_get = function _Select_computedType_get() {
+    invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+    return __classPrivateFieldGet(this, _Select_select, "f").type;
+}, _Select_computedValue_get = function _Select_computedValue_get() {
+    return this.value ?? '';
+}, _Select_computedSelectedOptions_get = function _Select_computedSelectedOptions_get() {
+    invariant(__classPrivateFieldGet(this, _Select_select, "f"));
+    return __classPrivateFieldGet(this, _Select_select, "f").selectedOptions;
+}, _Select_defineGetter = function _Select_defineGetter(p, get) {
+    Object.defineProperty(this.host, p, { enumerable: true, get });
+};
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["qds-select", "qds-icon"];
+    components.forEach(tagName => { switch (tagName) {
+        case "qds-select":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Select);
+            }
+            break;
+        case "qds-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+    } });
+}
+
+const QdsSelect = Select;
+const defineCustomElement = defineCustomElement$1;
+
+export { QdsSelect, defineCustomElement };
+//# sourceMappingURL=qds-select.js.map
+
+//# sourceMappingURL=qds-select.js.map