@quartzds/core 1.0.0-beta.9 → 1.0.0-beta.90

package/components/p-3c48ff53.js

@@ -0,0 +1,103 @@
+/*!
+ * SPDX-FileCopyrightText: © 2025 Schneider Electric
+ * 
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import { p as proxyCustomElement, H, h } from './p-2806fee1.js';
+
+const badgeCounterCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-badge-counter{align-items:center;background-color:var(--qds-theme-feedback-message-neutral);border-radius:var(--qds-control-toggle-indicator-rounded-border-radius);color:var(--qds-theme-feedback-message-neutral-contrast);display:flex;font:var(--qds-badge-standard-text);height:var(--qds-badge-counter-standard-height);justify-content:center;margin:0;padding-inline:var(--qds-badge-standard-padding-horizontal);text-align:center}.qds-stroke-ring{border:var(--qds-badge-border-width) solid var(--qds-theme-feedback-message-neutral-contrast)}.qds-sr-only{clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}[data-importance=emphasized]{background-color:var(--qds-theme-signature-color-contrast);color:var(--qds-theme-signature-color-default)}.qds-stroke-ring[data-importance=emphasized]{border-color:var(--qds-theme-signature-color-default)}[data-importance=subdued]{background-color:var(--qds-theme-feedback-message-informational);color:var(--qds-theme-feedback-message-informational-contrast)}.qds-stroke-ring[data-importance=subdued]{border-color:var(--qds-theme-feedback-message-informational-contrast)}[data-importance=destructive]{background-color:var(--qds-theme-feedback-message-critical-contrast);color:var(--qds-theme-feedback-message-critical)}.qds-stroke-ring[data-importance=destructive]{border-color:var(--qds-theme-feedback-message-critical)}[data-importance=subdued-destructive]{background-color:var(--qds-theme-feedback-message-critical);color:var(--qds-theme-feedback-message-critical-contrast)}.qds-stroke-ring[data-importance=subdued-destructive]{border-color:var(--qds-theme-feedback-message-critical-contrast)}[data-size=small]{font:var(--qds-badge-small-text);height:var(--qds-badge-counter-small-height);padding-inline:var(--qds-badge-small-padding-horizontal)}[data-size=large]{font:var(--qds-badge-large-text);height:var(--qds-badge-counter-large-height);padding-inline:var(--qds-badge-large-padding-horizontal)}[data-size=hero]{font:var(--qds-badge-hero-text);height:var(--qds-badge-counter-hero-height);padding-inline:var(--qds-badge-hero-padding-horizontal)}";
+const QdsBadgeCounterStyle0 = badgeCounterCss;
+
+// 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 _BadgeCounter_instances, _BadgeCounter_computedValue_get, _BadgeCounter_computedImportance_get, _BadgeCounter_computedSize_get;
+const BadgeCounter = /*@__PURE__*/ proxyCustomElement(class BadgeCounter extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        _BadgeCounter_instances.add(this);
+        /**
+         * The badge counter's importance.
+         */
+        this.importance = 'standard';
+        /**
+         * The badge counter's size.
+         */
+        this.size = 'standard';
+        /**
+         * Shows a stroke ring around the component for better visibility
+         */
+        this.strokeRing = false;
+    }
+    render() {
+        return (h("span", { key: 'c10f61ebe0ba000dad466c46e9565a5422cf8207', class: {
+                'qds-badge-counter': true,
+                'qds-stroke-ring': this.strokeRing,
+            }, "data-importance": __classPrivateFieldGet(this, _BadgeCounter_instances, "a", _BadgeCounter_computedImportance_get), "data-size": __classPrivateFieldGet(this, _BadgeCounter_instances, "a", _BadgeCounter_computedSize_get) }, __classPrivateFieldGet(this, _BadgeCounter_instances, "a", _BadgeCounter_computedValue_get), h("span", { key: '62cf8cdf190ef3bb4b36fce245871d81cd2b7aab', class: "qds-sr-only" }, this.description)));
+    }
+    static get style() { return QdsBadgeCounterStyle0; }
+}, [1, "qds-badge-counter", {
+        "description": [1],
+        "importance": [1],
+        "size": [1],
+        "strokeRing": [4, "stroke-ring"],
+        "value": [8]
+    }]);
+_BadgeCounter_instances = new WeakSet(), _BadgeCounter_computedValue_get = function _BadgeCounter_computedValue_get() {
+    const value = typeof this.value === 'string'
+        ? Number.parseInt(this.value, 10)
+        : // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+            (this.value ?? Number.NaN);
+    if (Number.isNaN(value) || value < 0)
+        return '';
+    return value < 100 ? value.toString() : '99+';
+}, _BadgeCounter_computedImportance_get = function _BadgeCounter_computedImportance_get() {
+    switch (this.importance) {
+        case 'subdued':
+        case 'destructive':
+        case 'subdued-destructive':
+        case 'emphasized': {
+            return this.importance;
+        }
+        default: {
+            return 'standard';
+        }
+    }
+}, _BadgeCounter_computedSize_get = function _BadgeCounter_computedSize_get() {
+    switch (this.size) {
+        case 'hero':
+        case 'large':
+        case 'small': {
+            return this.size;
+        }
+        default: {
+            return 'standard';
+        }
+    }
+};
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["qds-badge-counter"];
+    components.forEach(tagName => { switch (tagName) {
+        case "qds-badge-counter":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, BadgeCounter);
+            }
+            break;
+    } });
+}
+
+export { BadgeCounter as B, defineCustomElement as d };
+
+//# sourceMappingURL=p-3c48ff53.js.map

package/components/p-3c48ff53.js.map

@@ -0,0 +1 @@
+{"file":"p-3c48ff53.js","mappings":";;;;;;;AAAA,MAAM,eAAe,GAAG,4qEAA4qE,CAAC;AACrsE,8BAAe,eAAe;;ACD9B;AACA;AACA;;;;;;;;;MAwBa,YAAY;IALzB;;;;;;;;QAmB0B,eAAU,GAA4B,UAAU,CAAA;;;;QAKhD,SAAI,GAAsB,UAAU,CAAA;;;;QAKpC,eAAU,GAAY,KAAK,CAAA;KA4DpD;IAfQ,MAAM;QACX,QACE,6DACE,KAAK,EAAE;gBACL,mBAAmB,EAAE,IAAI;gBACzB,iBAAiB,EAAE,IAAI,CAAC,UAAU;aACnC,qBACgB,uBAAA,IAAI,qEAAoB,eAC9B,uBAAA,IAAI,+DAAc,IAE5B,uBAAA,IAAI,gEAAe,EACpB,6DAAM,KAAK,EAAC,aAAa,IAAE,IAAI,CAAC,WAAW,CAAQ,CAC9C,EACR;KACF;;;;;;;;;;IAnDC,MAAM,KAAK,GACT,OAAO,IAAI,CAAC,KAAK,KAAK,QAAQ;UAC1B,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,EAAE,EAAE,CAAC;;aAE9B,IAAI,CAAC,KAAK,IAAI,MAAM,CAAC,GAAG,CAAC,CAAA;IAChC,IAAI,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,KAAK,GAAG,CAAC;QAAE,OAAO,EAAE,CAAA;IAE/C,OAAO,KAAK,GAAG,GAAG,GAAG,KAAK,CAAC,QAAQ,EAAE,GAAG,KAAK,CAAA;AAC/C,CAAC;IAGC,QAAQ,IAAI,CAAC,UAAU;QACrB,KAAK,SAAS,CAAC;QACf,KAAK,aAAa,CAAC;QACnB,KAAK,qBAAqB,CAAC;QAC3B,KAAK,YAAY,EAAE;YACjB,OAAO,IAAI,CAAC,UAAU,CAAA;SACvB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;IAGC,QAAQ,IAAI,CAAC,IAAI;QACf,KAAK,MAAM,CAAC;QACZ,KAAK,OAAO,CAAC;QACb,KAAK,OAAO,EAAE;YACZ,OAAO,IAAI,CAAC,IAAI,CAAA;SACjB;QACD,SAAS;YACP,OAAO,UAAU,CAAA;SAClB;KACF;AACH,CAAC;;;;;;;;;;;;;;;;;","names":[],"sources":["src/components/badge-counter/badge-counter.css?tag=qds-badge-counter&encapsulation=shadow","src/components/badge-counter/badge-counter.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: inline-block;\n}\n\n.qds-badge-counter {\n  align-items: center;\n  background-color: var(--qds-theme-feedback-message-neutral);\n  border-radius: var(--qds-control-toggle-indicator-rounded-border-radius);\n  color: var(--qds-theme-feedback-message-neutral-contrast);\n  display: flex;\n  font: var(--qds-badge-standard-text);\n  height: var(--qds-badge-counter-standard-height);\n  justify-content: center;\n  margin: 0;\n  padding-inline: var(--qds-badge-standard-padding-horizontal);\n  text-align: center;\n}\n\n.qds-stroke-ring {\n  border: var(--qds-badge-border-width) solid\n    var(--qds-theme-feedback-message-neutral-contrast);\n}\n\n.qds-sr-only {\n  clip: rect(0 0 0 0);\n  height: 1px;\n  width: 1px;\n  margin: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n}\n\n[data-importance='emphasized'] {\n  background-color: var(--qds-theme-signature-color-contrast);\n  color: var(--qds-theme-signature-color-default);\n\n  &.qds-stroke-ring {\n    border-color: var(--qds-theme-signature-color-default);\n  }\n}\n\n[data-importance='subdued'] {\n  background-color: var(--qds-theme-feedback-message-informational);\n  color: var(--qds-theme-feedback-message-informational-contrast);\n\n  &.qds-stroke-ring {\n    border-color: var(--qds-theme-feedback-message-informational-contrast);\n  }\n}\n\n[data-importance='destructive'] {\n  background-color: var(--qds-theme-feedback-message-critical-contrast);\n  color: var(--qds-theme-feedback-message-critical);\n\n  &.qds-stroke-ring {\n    border-color: var(--qds-theme-feedback-message-critical);\n  }\n}\n\n[data-importance='subdued-destructive'] {\n  color: var(--qds-theme-feedback-message-critical-contrast);\n  background-color: var(--qds-theme-feedback-message-critical);\n\n  &.qds-stroke-ring {\n    border-color: var(--qds-theme-feedback-message-critical-contrast);\n  }\n}\n\n[data-size='small'] {\n  font: var(--qds-badge-small-text);\n  height: var(--qds-badge-counter-small-height);\n  padding-inline: var(--qds-badge-small-padding-horizontal);\n}\n\n[data-size='large'] {\n  font: var(--qds-badge-large-text);\n  height: var(--qds-badge-counter-large-height);\n  padding-inline: var(--qds-badge-large-padding-horizontal);\n}\n\n[data-size='hero'] {\n  font: var(--qds-badge-hero-text);\n  height: var(--qds-badge-counter-hero-height);\n  padding-inline: var(--qds-badge-hero-padding-horizontal);\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface } from '@stencil/core'\nimport { Component, h, Prop } from '@stencil/core'\n\nimport type { Importance, Size } from '../shared'\n\nexport type BadgeCounterImportance =\n  | Importance\n  | 'destructive'\n  | 'subdued-destructive'\nexport type BadgeCounterSize = Size | 'hero'\n\n/**\n * The `<qds-badge-counter>` element is a small, rounded UI element used to\n * display numerical values or counts. It is designed to draw the user's eye to\n * important or dynamic content by providing a visual cue that a countable\n * event or item has occurred or is waiting to be addressed.\n */\n@Component({\n  tag: 'qds-badge-counter',\n  shadow: true,\n  styleUrl: 'badge-counter.css',\n})\nexport class BadgeCounter implements ComponentInterface {\n  /**\n   * Adds accessible text to the qds-badge-counter that will be used by screen\n   * readers.\n   *\n   * @example\n   * <qds-badge-counter value={2} description=\"new notifications\"></qds-badge-counter>\n   * // This qds-badge-counter will be read by screen readers as \"two new notifications\"\n   */\n  @Prop() public readonly description?: string\n\n  /**\n   * The badge counter's importance.\n   */\n  @Prop() public readonly importance?: BadgeCounterImportance = 'standard'\n\n  /**\n   * The badge counter's size.\n   */\n  @Prop() public readonly size?: BadgeCounterSize = 'standard'\n\n  /**\n   * Shows a stroke ring around the component for better visibility\n   */\n  @Prop() public readonly strokeRing: boolean = false\n\n  /**\n   * The badge-counter's value.\n   */\n  @Prop() public readonly value!: number | string\n\n  get #computedValue(): string {\n    const value =\n      typeof this.value === 'string'\n        ? Number.parseInt(this.value, 10)\n        : // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n          (this.value ?? Number.NaN)\n    if (Number.isNaN(value) || value < 0) return ''\n\n    return value < 100 ? value.toString() : '99+'\n  }\n\n  get #computedImportance(): BadgeCounterImportance {\n    switch (this.importance) {\n      case 'subdued':\n      case 'destructive':\n      case 'subdued-destructive':\n      case 'emphasized': {\n        return this.importance\n      }\n      default: {\n        return 'standard'\n      }\n    }\n  }\n\n  get #computedSize(): BadgeCounterSize {\n    switch (this.size) {\n      case 'hero':\n      case 'large':\n      case 'small': {\n        return this.size\n      }\n      default: {\n        return 'standard'\n      }\n    }\n  }\n\n  public render() {\n    return (\n      <span\n        class={{\n          'qds-badge-counter': true,\n          'qds-stroke-ring': this.strokeRing,\n        }}\n        data-importance={this.#computedImportance}\n        data-size={this.#computedSize}\n      >\n        {this.#computedValue}\n        <span class=\"qds-sr-only\">{this.description}</span>\n      </span>\n    )\n  }\n}\n"],"version":3}

package/components/p-688c90f6.js

@@ -0,0 +1,267 @@
+/*!
+ * SPDX-FileCopyrightText: © 2025 Schneider Electric
+ * 
+ * SPDX-License-Identifier: Apache-2.0
+ */
+import { p as proxyCustomElement, H, c as createEvent, h } from './p-2806fee1.js';
+import { p as pickFocusEventAttributes, i as inheritAriaAttributes } from './p-8abba29b.js';
+import { V as VALID_STATE, C as CUSTOM_ERROR_FLAGS, N as NO_ERROR_FLAGS } from './p-d107c90c.js';
+import { d as defineCustomElement$3 } from './p-ba880369.js';
+import { d as defineCustomElement$2 } from './p-a020ece3.js';
+import { d as defineCustomElement$1 } from './p-c80f112a.js';
+
+const checkboxCss = ":host([hidden]){display:none!important}:host{display:inline-block;line-height:0}.qds-box,.qds-checkbox,.qds-icon{grid-area:f;place-self:center}.qds-box,.qds-icon{display:none;pointer-events:none}.qds-box{border-radius:var(--qds-control-toggle-indicator-border-radius)}.qds-container{align-self:flex-start;display:grid;grid-template-areas:\"f\"}.qds-icon{color:var(--qds-theme-signature-color-contrast)}.qds-label{cursor:pointer;display:inline-flex}.qds-checkbox{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-border-radius);cursor:pointer;margin:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}.qds-checkbox:focus-visible{outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset)}.qds-checkbox:active~.qds-box,.qds-checkbox:hover~.qds-box{display:block}.qds-checkbox:hover~.qds-box{background-color:var(--qds-theme-signature-color-hover)}.qds-checkbox:active~.qds-box{background-color:var(--qds-theme-signature-color-pressed)}.qds-checkbox:checked~.qds-checked,.qds-checkbox:indeterminate~.qds-indeterminate{display:block}.qds-checkbox:checked,.qds-checkbox:indeterminate{background-color:var(--qds-theme-signature-color-default);border-color:#0000}.qds-checkbox:checked:hover,.qds-checkbox:indeterminate:hover{background-color:var(--qds-theme-signature-color-hover)}.qds-checkbox:checked:active,.qds-checkbox:indeterminate:active{background-color:var(--qds-theme-signature-color-pressed)}[aria-disabled=true]{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-checkbox[data-size=small]{height:var(--qds-control-toggle-box-small-size);width:var(--qds-control-toggle-box-small-size)}.qds-icon[data-size=small]{font-size:var(--qds-control-small-icon-size)}.qds-box[data-size=small]{height:var(--qds-control-toggle-indicator-small-size);width:var(--qds-control-toggle-indicator-small-size)}.qds-inline[data-size=small]{margin-block:var(--qds-control-small-padding-auto-height)}.qds-label[data-size=small]{gap:var(--qds-control-small-gap-siblings-related)}.qds-checkbox[data-size=standard]{height:var(--qds-control-toggle-box-standard-size);width:var(--qds-control-toggle-box-standard-size)}.qds-icon[data-size=standard]{font-size:var(--qds-control-standard-icon-size)}.qds-box[data-size=standard]{height:var(--qds-control-toggle-indicator-standard-size);width:var(--qds-control-toggle-indicator-standard-size)}.qds-inline[data-size=standard]{margin-block:var(--qds-control-standard-padding-auto-height)}.qds-label[data-size=standard]{gap:var(--qds-control-standard-gap-siblings-related)}.qds-checkbox[data-size=large]{height:var(--qds-control-toggle-box-large-size);width:var(--qds-control-toggle-box-large-size)}.qds-icon[data-size=large]{font-size:var(--qds-control-large-icon-size)}.qds-box[data-size=large]{height:var(--qds-control-toggle-indicator-large-size);width:var(--qds-control-toggle-indicator-large-size)}.qds-inline[data-size=large]{margin-block:var(--qds-control-large-padding-auto-height)}.qds-label[data-size=large]{gap:var(--qds-control-large-gap-siblings-related)}";
+const QdsCheckboxStyle0 = checkboxCss;
+
+// 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 _Checkbox_instances, _Checkbox_inheritedAttributes, _Checkbox_computedChecked_get, _Checkbox_computedDisabled_get, _Checkbox_computedIndeterminate_get, _Checkbox_computedSize_get, _Checkbox_computedValue_get, _Checkbox_hasText_get, _Checkbox_onBlur, _Checkbox_onFocus, _Checkbox_defineGetter;
+const Checkbox = /*@__PURE__*/ proxyCustomElement(class Checkbox extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.blurEmitter = createEvent(this, "qdsBlur", 2);
+        this.changeEmitter = createEvent(this, "qdsChange", 6);
+        this.focusEmitter = createEvent(this, "qdsFocus", 2);
+        this.internals = this.attachInternals();
+        _Checkbox_instances.add(this);
+        /**
+         * Adds vertical margin to the checkbox for alignment.
+         *
+         * This is useful when creating inline layouts so that the first lines have
+         * the correct vertical centering.
+         */
+        this.inline = false;
+        /**
+         * The checkbox's size.
+         */
+        this.size = 'standard';
+        /**
+         * The [`<form>`][] element to associate the checkbox 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-checkbox>` is associated
+         * with its ancestor `<form>` element, if any.
+         *
+         * This attribute lets you associate `<qds-checkbox>` 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;
+        /**
+         * The error message that would be shown to the user if the `<qds-checkbox>`
+         * was to be checked for validity.
+         *
+         * @readonly
+         * @webnative
+         */
+        this.validationMessage = '';
+        /**
+         * The [`ValidityState`][] object for this `<qds-checkbox>`.
+         *
+         * [`ValidityState`]: https://developer.mozilla.org/docs/Web/API/ValidityState
+         *
+         * @readonly
+         * @webnative
+         */
+        this.validity = VALID_STATE;
+        /**
+         * The value of the checkbox, submitted as a name/value pair with form data.
+         *
+         * @webnative
+         */
+        this.value = 'on';
+        /**
+         * True if `<qds-checkbox>` will be validated when the form is submitted;
+         * false otherwise.
+         *
+         * @readonly
+         * @webnative
+         */
+        this.willValidate = false;
+        _Checkbox_inheritedAttributes.set(this, {});
+        this.checkValidity = () => this.internals.checkValidity();
+        this.reportValidity = () => this.internals.reportValidity();
+        this.setCustomValidity = (error) => {
+            if (error)
+                this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.host);
+            else
+                this.internals.setValidity(NO_ERROR_FLAGS);
+        };
+        _Checkbox_onBlur.set(this, (event) => {
+            this.blurEmitter.emit(pickFocusEventAttributes(event));
+        });
+        _Checkbox_onFocus.set(this, (event) => {
+            this.focusEmitter.emit(pickFocusEventAttributes(event));
+        });
+    }
+    onClick(event) {
+        if (__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedDisabled_get)) {
+            event.stopImmediatePropagation();
+            return;
+        }
+        event.preventDefault();
+        this.checked = __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedIndeterminate_get) ? true : !__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedChecked_get);
+        this.changeEmitter.emit();
+        this.indeterminate = false;
+    }
+    checkedChanged() {
+        this.internals.setFormValue(__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedChecked_get) && !__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedDisabled_get)
+            ? __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedValue_get)
+            : // eslint-disable-next-line unicorn/no-null
+                null);
+    }
+    disabledChanged() {
+        if (__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedChecked_get) && !__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedDisabled_get))
+            this.internals.setFormValue(__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedValue_get));
+        // eslint-disable-next-line unicorn/no-null
+        else
+            this.internals.setFormValue(null);
+    }
+    tabindexChanged(newValue) {
+        const parsedValue = Number.parseInt(newValue, 10);
+        this.tabIndex =
+            parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue;
+    }
+    valueChanged() {
+        if (__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedChecked_get) && !__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedDisabled_get))
+            this.internals.setFormValue(__classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedValue_get));
+    }
+    componentWillLoad() {
+        this.valueChanged();
+        __classPrivateFieldGet(this, _Checkbox_instances, "m", _Checkbox_defineGetter).call(this, 'form', () => this.internals.form);
+        __classPrivateFieldGet(this, _Checkbox_instances, "m", _Checkbox_defineGetter).call(this, 'willValidate', () => this.internals.willValidate);
+        __classPrivateFieldGet(this, _Checkbox_instances, "m", _Checkbox_defineGetter).call(this, 'validity', () => this.internals.validity);
+        __classPrivateFieldGet(this, _Checkbox_instances, "m", _Checkbox_defineGetter).call(this, 'validationMessage', () => this.internals.validationMessage);
+        __classPrivateFieldSet(this, _Checkbox_inheritedAttributes, inheritAriaAttributes(this.host), "f");
+        this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
+    }
+    render() {
+        return (
+        // eslint-disable-next-line jsx-a11y/label-has-associated-control
+        h("label", { key: '15ceed36f1cab0a68c0a156ef3324943658bd6c0', "aria-disabled": __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedDisabled_get) ? 'true' : undefined, class: {
+                'qds-inline': this.inline,
+                'qds-label': true,
+            }, "data-size": __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedSize_get) }, h("div", { key: 'f08682656e01bba90296e992e60e10d2b6a5d6a9', class: "qds-container" }, h("input", { key: '505e5c9fa829f82c7d4cd3a6d9fd9ef32b7c2706',
+            // eslint-disable-next-line jsx-a11y/no-autofocus
+            autoFocus: this.host.autofocus, checked: __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedIndeterminate_get) ? false : this.checked, class: "qds-checkbox", "data-size": __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedSize_get), disabled: __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedDisabled_get), indeterminate: this.indeterminate, onBlur: __classPrivateFieldGet(this, _Checkbox_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Checkbox_onFocus, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedDisabled_get) ? undefined : this.tabIndex, type: "checkbox", ...__classPrivateFieldGet(this, _Checkbox_inheritedAttributes, "f") }), h("qds-icon", { key: 'f6b89a9aa715138e08867252d899da135a2be4d1', "aria-hidden": "true", class: {
+                'qds-icon': true,
+                'qds-checked': true,
+            }, "data-size": __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedSize_get), library: "core", name: "checked" }), h("div", { key: 'ea3bf1f7c463e0503072df69504b3d36400964c2', class: "qds-box", "data-size": __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedSize_get) }), h("qds-icon", { key: '4ec05ce461af2c4e1d17a2536aa392c6c99c5996', "aria-hidden": "true", class: {
+                'qds-icon': true,
+                'qds-indeterminate': true,
+            }, "data-size": __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_computedSize_get), library: "core", name: "indeterminate" })), __classPrivateFieldGet(this, _Checkbox_instances, "a", _Checkbox_hasText_get) && (h("qds-label", { key: 'b147b3d0e47395032217b52763adef01ed70e144', required: this.required, size: this.size, text: this.text }))));
+    }
+    static get delegatesFocus() { return true; }
+    static get formAssociated() { return true; }
+    get host() { return this; }
+    static get watchers() { return {
+        "checked": ["checkedChanged"],
+        "disabled": ["disabledChanged"],
+        "tabindex": ["tabindexChanged"],
+        "value": ["valueChanged"]
+    }; }
+    static get style() { return QdsCheckboxStyle0; }
+}, [81, "qds-checkbox", {
+        "inline": [4],
+        "size": [1],
+        "text": [1],
+        "checked": [1028],
+        "disabled": [4],
+        "form": [1],
+        "indeterminate": [1028],
+        "name": [1],
+        "required": [4],
+        "validationMessage": [1, "validation-message"],
+        "validity": [16],
+        "value": [8],
+        "willValidate": [4, "will-validate"],
+        "tabIndex": [32]
+    }, [[0, "click", "onClick"]], {
+        "checked": ["checkedChanged"],
+        "disabled": ["disabledChanged"],
+        "tabindex": ["tabindexChanged"],
+        "value": ["valueChanged"]
+    }]);
+_Checkbox_inheritedAttributes = new WeakMap(), _Checkbox_onBlur = new WeakMap(), _Checkbox_onFocus = new WeakMap(), _Checkbox_instances = new WeakSet(), _Checkbox_computedChecked_get = function _Checkbox_computedChecked_get() {
+    return this.checked ?? false;
+}, _Checkbox_computedDisabled_get = function _Checkbox_computedDisabled_get() {
+    return ((this.host.matches(':disabled') || (this.disabled ?? false)) &&
+        this.host.getAttribute('disabled') !== 'false');
+}, _Checkbox_computedIndeterminate_get = function _Checkbox_computedIndeterminate_get() {
+    return this.indeterminate ?? false;
+}, _Checkbox_computedSize_get = function _Checkbox_computedSize_get() {
+    switch (this.size) {
+        case 'standard':
+        case 'small':
+        case 'large': {
+            return this.size;
+        }
+        default: {
+            return 'standard';
+        }
+    }
+}, _Checkbox_computedValue_get = function _Checkbox_computedValue_get() {
+    // eslint-disable-next-line unicorn/no-null
+    return this.value == null ? null : this.value.toString();
+}, _Checkbox_hasText_get = function _Checkbox_hasText_get() {
+    return ((this.text !== undefined && this.text !== '') || this.required === true);
+}, _Checkbox_defineGetter = function _Checkbox_defineGetter(p, get) {
+    Object.defineProperty(this.host, p, { enumerable: true, get });
+};
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["qds-checkbox", "qds-icon", "qds-label", "qds-tooltip"];
+    components.forEach(tagName => { switch (tagName) {
+        case "qds-checkbox":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, Checkbox);
+            }
+            break;
+        case "qds-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "qds-label":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "qds-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+
+export { Checkbox as C, defineCustomElement as d };
+
+//# sourceMappingURL=p-688c90f6.js.map

package/components/p-688c90f6.js.map

@@ -0,0 +1 @@
+{"file":"p-688c90f6.js","mappings":"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","names":[],"sources":["src/components/checkbox/checkbox.css?tag=qds-checkbox&encapsulation=shadow","src/components/checkbox/checkbox.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: inline-block;\n  line-height: 0;\n}\n\n.qds-checkbox,\n.qds-box,\n.qds-icon {\n  grid-area: checkbox;\n  place-self: center;\n}\n\n.qds-icon,\n.qds-box {\n  display: none;\n  pointer-events: none;\n}\n\n.qds-box {\n  border-radius: var(--qds-control-toggle-indicator-border-radius);\n}\n\n.qds-container {\n  display: grid;\n  align-self: flex-start;\n  grid-template-areas: 'checkbox';\n}\n\n.qds-icon {\n  color: var(--qds-theme-signature-color-contrast);\n}\n\n.qds-label {\n  cursor: pointer;\n  display: inline-flex;\n}\n\n.qds-checkbox {\n  appearance: none;\n  background-color: var(--qds-theme-control-input-background);\n  border-radius: var(--qds-control-border-radius);\n  border: var(--qds-control-border-width) solid var(--qds-theme-control-border);\n  cursor: pointer;\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  &:hover ~ .qds-box,\n  &:active ~ .qds-box {\n    display: block;\n  }\n\n  &:hover ~ .qds-box {\n    background-color: var(--qds-theme-signature-color-hover);\n  }\n\n  &:active ~ .qds-box {\n    background-color: var(--qds-theme-signature-color-pressed);\n  }\n\n  &:checked ~ .qds-checked,\n  &:indeterminate ~ .qds-indeterminate {\n    display: block;\n  }\n\n  &:checked,\n  &:indeterminate {\n    background-color: var(--qds-theme-signature-color-default);\n    border-color: transparent;\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  &.qds-checkbox {\n    width: var(--qds-control-toggle-box-small-size);\n    height: var(--qds-control-toggle-box-small-size);\n  }\n\n  &.qds-icon {\n    font-size: var(--qds-control-small-icon-size);\n  }\n\n  &.qds-box {\n    width: var(--qds-control-toggle-indicator-small-size);\n    height: var(--qds-control-toggle-indicator-small-size);\n  }\n\n  &.qds-inline {\n    margin-block: var(--qds-control-small-padding-auto-height);\n  }\n\n  &.qds-label {\n    gap: var(--qds-control-small-gap-siblings-related);\n  }\n}\n\n[data-size='standard'] {\n  &.qds-checkbox {\n    width: var(--qds-control-toggle-box-standard-size);\n    height: var(--qds-control-toggle-box-standard-size);\n  }\n\n  &.qds-icon {\n    font-size: var(--qds-control-standard-icon-size);\n  }\n\n  &.qds-box {\n    width: var(--qds-control-toggle-indicator-standard-size);\n    height: var(--qds-control-toggle-indicator-standard-size);\n  }\n\n  &.qds-inline {\n    margin-block: var(--qds-control-standard-padding-auto-height);\n  }\n\n  &.qds-label {\n    gap: var(--qds-control-standard-gap-siblings-related);\n  }\n}\n\n[data-size='large'] {\n  &.qds-checkbox {\n    width: var(--qds-control-toggle-box-large-size);\n    height: var(--qds-control-toggle-box-large-size);\n  }\n\n  &.qds-icon {\n    font-size: var(--qds-control-large-icon-size);\n  }\n\n  &.qds-box {\n    width: var(--qds-control-toggle-indicator-large-size);\n    height: var(--qds-control-toggle-indicator-large-size);\n  }\n\n  &.qds-inline {\n    margin-block: var(--qds-control-large-padding-auto-height);\n  }\n\n  &.qds-label {\n    gap: var(--qds-control-large-gap-siblings-related);\n  }\n}\n","// SPDX-FileCopyrightText: © 2024 Schneider Electric\n//\n// SPDX-License-Identifier: Apache-2.0\n\nimport type { ComponentInterface, EventEmitter } from '@stencil/core'\nimport {\n  AttachInternals,\n  Component,\n  Element,\n  Event,\n  h,\n  Listen,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core'\n\nimport type { Attributes, QdsFocusEventDetail } from '../../helpers'\nimport { inheritAriaAttributes, pickFocusEventAttributes } from '../../helpers'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Size } from '../shared'\n\nexport type CheckboxValue = number | string | null\n\n/**\n * `<qds-checkbox>` elements are rendered as boxes that are checked (ticked)\n * when activated, like you might see in an official government paper form. A\n * checkbox allows you to select single values for submission in a form (or not).\n *\n * @see https://quartz.se.com/build/components/checkbox\n */\n@Component({\n  tag: 'qds-checkbox',\n  formAssociated: true,\n  shadow: { delegatesFocus: true },\n  styleUrl: 'checkbox.css',\n})\nexport class Checkbox implements ComponentInterface {\n  /**\n   * Adds vertical margin to the checkbox 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 checkbox's size.\n   */\n  @Prop() public readonly size?: Size = 'standard'\n\n  /**\n   * The checkbox's text.\n   */\n  @Prop() public readonly text?: string\n\n  /**\n   * Sets the checkbox's state.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public checked?: boolean\n\n  /**\n   * Prevents the checkbox from being interacted with: it cannot be pressed or\n   * focused.\n   *\n   * @webnative\n   */\n  @Prop() public readonly disabled?: boolean\n\n  /**\n   * The [`<form>`][] element to associate the checkbox with (its form owner).\n   *\n   * The value of this attribute must be the id of a `<form>` in the same\n   * document. If this attribute is not set, the `<qds-checkbox>` is associated\n   * with its ancestor `<form>` element, if any.\n   *\n   * This attribute lets you associate `<qds-checkbox>` 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   * [`<form>`]: https://developer.mozilla.org/docs/Web/HTML/Element/form\n   *\n   * @readonly\n   * @webnative\n   */\n  // eslint-disable-next-line unicorn/no-null\n  @Prop() public readonly form: ElementInternals['form'] | string = null\n\n  /**\n   * Sets the checkbox to an indeterminate state. This is usually applied to\n   * checkboxes that represent a \"select all/none\" behavior when associated\n   * checkboxes have a mix of checked and unchecked states.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public indeterminate?: boolean\n\n  /**\n   * The name of the checkbox, which is submitted with the form data.\n   *\n   * @webnative\n   */\n  @Prop() public readonly name?: string\n\n  /**\n   * A value must be specified for the checkbox before the owning form can be\n   * submitted.\n   *\n   * See\n   * [Client-side validation](https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation)\n   * and the\n   * [HTML attribute: `required`](https://developer.mozilla.org/docs/Web/HTML/Attributes/required)\n   * for more information.\n   *\n   * @webnative\n   */\n  @Prop() public readonly required?: boolean\n\n  /**\n   * The error message that would be shown to the user if the `<qds-checkbox>`\n   * was to be checked for validity.\n   *\n   * @readonly\n   * @webnative\n   */\n  @Prop()\n  public readonly validationMessage: ElementInternals['validationMessage'] = ''\n\n  /**\n   * The [`ValidityState`][] object for this `<qds-checkbox>`.\n   *\n   * [`ValidityState`]: https://developer.mozilla.org/docs/Web/API/ValidityState\n   *\n   * @readonly\n   * @webnative\n   */\n  @Prop() public readonly validity: ElementInternals['validity'] = VALID_STATE\n\n  /**\n   * The value of the checkbox, submitted as a name/value pair with form data.\n   *\n   * @webnative\n   */\n  @Prop() public readonly value?: CheckboxValue = 'on'\n\n  /**\n   * True if `<qds-checkbox>` will be validated when the form is submitted;\n   * false otherwise.\n   *\n   * @readonly\n   * @webnative\n   */\n  @Prop() public readonly willValidate: ElementInternals['willValidate'] = false\n\n  @AttachInternals() private readonly internals!: ElementInternals\n\n  /**\n   * Emitted when the checkbox loses focus.\n   */\n  @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n  private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when a change to the checkbox's state is committed by the user.\n   */\n  @Event({ eventName: 'qdsChange', cancelable: false })\n  private readonly changeEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when the checkbox gains focus.\n   */\n  @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n  private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  @Element() private readonly host!: HTMLElement\n\n  @State() private tabIndex?: number\n\n  #inheritedAttributes: Attributes = {}\n\n  get #computedChecked(): boolean {\n    return this.checked ?? false\n  }\n\n  get #computedDisabled(): boolean {\n    return (\n      (this.host.matches(':disabled') || (this.disabled ?? false)) &&\n      this.host.getAttribute('disabled') !== 'false'\n    )\n  }\n\n  get #computedIndeterminate(): boolean {\n    return this.indeterminate ?? false\n  }\n\n  get #computedSize(): Size {\n    switch (this.size) {\n      case 'standard':\n      case 'small':\n      case 'large': {\n        return this.size\n      }\n      default: {\n        return 'standard'\n      }\n    }\n  }\n\n  get #computedValue(): string | null {\n    // eslint-disable-next-line unicorn/no-null\n    return this.value == null ? null : this.value.toString()\n  }\n\n  get #hasText(): boolean {\n    return (\n      (this.text !== undefined && this.text !== '') || this.required === true\n    )\n  }\n\n  @Listen('click')\n  protected onClick(event: MouseEvent): void {\n    if (this.#computedDisabled) {\n      event.stopImmediatePropagation()\n      return\n    }\n\n    event.preventDefault()\n\n    this.checked = this.#computedIndeterminate ? true : !this.#computedChecked\n    this.changeEmitter.emit()\n    this.indeterminate = false\n  }\n\n  @Watch('checked')\n  protected checkedChanged(): void {\n    this.internals.setFormValue(\n      this.#computedChecked && !this.#computedDisabled\n        ? this.#computedValue\n        : // eslint-disable-next-line unicorn/no-null\n          null,\n    )\n  }\n\n  @Watch('disabled')\n  protected disabledChanged(): void {\n    if (this.#computedChecked && !this.#computedDisabled)\n      this.internals.setFormValue(this.#computedValue)\n    // eslint-disable-next-line unicorn/no-null\n    else this.internals.setFormValue(null)\n  }\n\n  @Watch('tabindex')\n  protected tabindexChanged(newValue: string): void {\n    const parsedValue = Number.parseInt(newValue, 10)\n    this.tabIndex =\n      parsedValue === 0 || Number.isNaN(parsedValue) ? undefined : parsedValue\n  }\n\n  @Watch('value')\n  protected valueChanged(): void {\n    if (this.#computedChecked && !this.#computedDisabled)\n      this.internals.setFormValue(this.#computedValue)\n  }\n\n  public componentWillLoad(): void {\n    this.valueChanged()\n\n    this.#defineGetter('form', () => this.internals.form)\n    this.#defineGetter('willValidate', () => this.internals.willValidate)\n    this.#defineGetter('validity', () => this.internals.validity)\n    this.#defineGetter(\n      'validationMessage',\n      () => this.internals.validationMessage,\n    )\n\n    this.#inheritedAttributes = inheritAriaAttributes(this.host)\n    this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\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' : undefined}\n        class={{\n          'qds-inline': this.inline,\n          'qds-label': true,\n        }}\n        data-size={this.#computedSize}\n      >\n        <div class=\"qds-container\">\n          <input\n            // eslint-disable-next-line jsx-a11y/no-autofocus\n            autoFocus={this.host.autofocus}\n            checked={this.#computedIndeterminate ? false : this.checked}\n            class=\"qds-checkbox\"\n            data-size={this.#computedSize}\n            disabled={this.#computedDisabled}\n            indeterminate={this.indeterminate}\n            onBlur={this.#onBlur}\n            onFocus={this.#onFocus}\n            required={this.required}\n            tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n            type=\"checkbox\"\n            // eslint-disable-next-line react/jsx-props-no-spreading\n            {...this.#inheritedAttributes}\n          />\n          <qds-icon\n            aria-hidden=\"true\"\n            class={{\n              'qds-icon': true,\n              'qds-checked': true,\n            }}\n            data-size={this.#computedSize}\n            library=\"core\"\n            name=\"checked\"\n          />\n          <div class=\"qds-box\" data-size={this.#computedSize} />\n          <qds-icon\n            aria-hidden=\"true\"\n            class={{\n              'qds-icon': true,\n              'qds-indeterminate': true,\n            }}\n            data-size={this.#computedSize}\n            library=\"core\"\n            name=\"indeterminate\"\n          />\n        </div>\n        {this.#hasText && (\n          <qds-label\n            required={this.required}\n            size={this.size}\n            text={this.text}\n          />\n        )}\n      </label>\n    )\n  }\n\n  public checkValidity: ElementInternals['checkValidity'] = () =>\n    this.internals.checkValidity()\n\n  public reportValidity: ElementInternals['reportValidity'] = () =>\n    this.internals.reportValidity()\n\n  public setCustomValidity: HTMLInputElement['setCustomValidity'] = (error) => {\n    if (error) this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.host)\n    else this.internals.setValidity(NO_ERROR_FLAGS)\n  }\n\n  readonly #onBlur = (event: FocusEvent): void => {\n    this.blurEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  readonly #onFocus = (event: FocusEvent): void => {\n    this.focusEmitter.emit(pickFocusEventAttributes(event))\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/p-8abba29b.js

@@ -0,0 +1,204 @@
+/*!
+ * SPDX-FileCopyrightText: © 2025 Schneider Electric
+ * 
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// SPDX-FileCopyrightText: © 2024 Schneider Electric
+//
+// SPDX-License-Identifier: Apache-2.0
+const inheritAttributes = (element, attributes = []) => {
+    const attributeObject = {};
+    for (const attribute of attributes) {
+        const value = element.getAttribute(attribute);
+        if (value !== null) {
+            attributeObject[attribute] = value;
+            element.removeAttribute(attribute);
+        }
+    }
+    return attributeObject;
+};
+const ariaAttributes = [
+    'aria-activedescendant',
+    'aria-atomic',
+    'aria-autocomplete',
+    'aria-braillelabel',
+    'aria-brailleroledescription',
+    'aria-busy',
+    'aria-checked',
+    'aria-colcount',
+    'aria-colindex',
+    'aria-colindextext',
+    'aria-colspan',
+    'aria-controls',
+    'aria-current',
+    'aria-describedby',
+    'aria-description',
+    'aria-details',
+    'aria-disabled',
+    'aria-errormessage',
+    'aria-expanded',
+    'aria-flowto',
+    'aria-haspopup',
+    'aria-hidden',
+    'aria-invalid',
+    'aria-keyshortcuts',
+    'aria-label',
+    'aria-labelledby',
+    'aria-level',
+    'aria-live',
+    'aria-multiline',
+    'aria-multiselectable',
+    'aria-orientation',
+    'aria-owns',
+    'aria-placeholder',
+    'aria-posinset',
+    'aria-pressed',
+    'aria-readonly',
+    'aria-relevant',
+    'aria-required',
+    'aria-roledescription',
+    'aria-rowcount',
+    'aria-rowindex',
+    'aria-rowindextext',
+    'aria-rowspan',
+    'aria-selected',
+    'aria-setsize',
+    'aria-sort',
+    'aria-valuemax',
+    'aria-valuemin',
+    'aria-valuenow',
+    'aria-valuetext',
+    'role',
+];
+/**
+ * Returns an array of aria attributes that should be copied from
+ * the shadow host element to a target within the light DOM.
+ *
+ * @param element The element that the attributes should be copied from.
+ */
+const inheritAriaAttributes = (element) => inheritAttributes(element, ariaAttributes);
+const prefix = 'Invariant failed';
+/**
+ * Throws an error if the value is falsy.
+ *
+ * @param value Value to test.
+ * @param message Optional message to display in development builds.
+ */
+function invariant(value, message) {
+    // eslint-disable-next-line @typescript-eslint/strict-boolean-expressions
+    if (value)
+        return;
+    throw new Error(prefix);
+}
+/**
+ * From an object pick a set of keys.
+ *
+ * @param object Object to pick from.
+ * @param keys They keys to pick.
+ * @returns New object with only the picked keys.
+ */
+const pick = (object, ...keys) => {
+    const returnValue = {};
+    for (const key of keys)
+        returnValue[key] = object[key];
+    return returnValue;
+};
+const pickFocusEventAttributes = (event) => pick(event, 'relatedTarget');
+const pickInputEventAttributes = (event) => pick(event, 'data', 'inputType', 'isComposing');
+const getConversionFactor = (element, unit) => {
+    switch (unit) {
+        case 'cm': {
+            return 96 / 2.54;
+        }
+        case 'em': {
+            return Number.parseFloat(globalThis.getComputedStyle(element.parentElement ?? document.documentElement).fontSize);
+        }
+        case 'in': {
+            return 96;
+        }
+        case 'mm': {
+            return 96 / 25.4;
+        }
+        case 'pc': {
+            return 16;
+        }
+        case 'pt': {
+            return 96 / 72;
+        }
+        case 'px': {
+            return 1;
+        }
+        case 'rem': {
+            return Number.parseFloat(globalThis.getComputedStyle(document.documentElement).fontSize);
+        }
+        default: {
+            return undefined;
+        }
+    }
+};
+const propertyToPx = (element, property) => {
+    const value = globalThis.getComputedStyle(element).getPropertyValue(property);
+    const number = Number.parseFloat(value);
+    if (Number.isNaN(number))
+        return undefined;
+    const unit = /\s*[\d+.-]*\s*(.*)/.exec(value)?.[1] ?? '';
+    const conversionFactor = getConversionFactor(element, unit) ?? 1;
+    return number * conversionFactor;
+};
+const ignorePromise = (promise) => {
+    promise.catch(() => {
+        invariant(false);
+    });
+};
+const isTouchDevice = () => 'ontouchstart' in globalThis ||
+    ('maxTouchPoints' in globalThis && globalThis.navigator.maxTouchPoints > 0);
+const roundByDPR = (value) => {
+    const dpr = devicePixelRatio || 1;
+    return Math.round(value * dpr) / dpr;
+};
+/**
+ * Checks if an element's content is overflowing.
+ *
+ * @param element The element to check.
+ * @returns `true` if overflowing, `false` otherwise.
+ */
+const isOverflowing = (element) => {
+    const { clientHeight, clientWidth, scrollHeight, scrollWidth } = element;
+    return scrollHeight > clientHeight + 1 || scrollWidth > clientWidth;
+};
+const determineLinkIcon = (href, target) => {
+    if (href === undefined)
+        return undefined;
+    let link;
+    try {
+        link = new URL(href, globalThis.location.href);
+    }
+    catch {
+        return undefined;
+    }
+    const isExternalLink = link.origin !== globalThis.location.origin;
+    const opensInNewTab = target === '_blank';
+    if (isExternalLink)
+        return opensInNewTab ? 'external-new-tab-link' : 'external-link';
+    return opensInNewTab ? 'new-tab-link' : undefined;
+};
+function attachInternals() {
+    // @ts-expect-error: This is very unsafe but it's not possible to do this in
+    //                   Stencil.js without creating a form-associated custom
+    //                   element.
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-return
+    return this.attachInternals();
+}
+const resolveTarget = (target) => {
+    const resolvedTarget = typeof target === 'function' ? target() : target;
+    if (typeof resolvedTarget !== 'string')
+        return resolvedTarget;
+    const element = document.querySelector(resolvedTarget);
+    if (element === null)
+        throw new Error('String must resolve to an Element.');
+    return element;
+};
+
+export { attachInternals as a, isOverflowing as b, invariant as c, propertyToPx as d, roundByDPR as e, ignorePromise as f, determineLinkIcon as g, pickInputEventAttributes as h, inheritAriaAttributes as i, isTouchDevice as j, pickFocusEventAttributes as p, resolveTarget as r };
+
+//# sourceMappingURL=p-8abba29b.js.map