@quartzds/core 1.0.0-beta.92 → 1.0.0-beta.94

package/dist/cjs/qds-input.cjs.entry.js

@@ -11,7 +11,7 @@ const index = require('./index-dbcccf98.js');
 const helpers = require('./helpers-10154521.js');
 const controls = require('./controls-ee3d2ec8.js');
 
-const inputCss = ":host([hidden]){display:none!important}:host{display:inline-block}@-moz-document url-prefix(){[type=date]~.qds-icon-container,[type=datetime-local]~.qds-icon-container,[type=month]~.qds-icon-container,[type=time]~.qds-icon-container,[type=week]~.qds-icon-container{display:none}}.qds-container,.qds-input{max-width:inherit;width:inherit}.qds-container{align-content:flex-start;align-items:center;box-sizing:border-box;display:grid;grid-template-areas:\"c\"}.qds-icon{--qds-theme-interactive-background-hover:none;--qds-theme-interactive-background-pressed:none;--qds-control-small-height:var(--qds-control-small-icon-size);flex-shrink:0}.qds-icon-container,.qds-input{grid-area:c}.qds-icon-container{align-items:center;display:flex;justify-content:center;justify-self:end;padding-inline-end:var(--qds-control-input-padding-horizontal)}.qds-icon-container.no-padding{padding-inline-end:0}.qds-focus-ring{border-radius:max(1px,var(\n        --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-top-right,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n      ));grid-area:c;height:calc(100% + var(--qds-control-border-width) - var(--qds-control-border-width-block-end, var(--qds-control-border-width)));isolation:isolate;outline:var(--qds-control-input-focus-border-width) solid var(--qds-theme-control-input-focus-border);pointer-events:none;visibility:hidden;width:calc(100% + var(--qds-control-border-width) - var(\n        --qds-control-border-width-inline-end,\n        var(--qds-control-border-width)\n      ))}[data-size=small]{font:var(--qds-control-small-text);height:var(--qds-control-small-height)}.qds-icon[data-size=small]{--qds-experimental-icon-click-target-size:var(--qds-control-small-height);height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}[data-size=small]~.qds-icon-container{gap:var(--qds-control-small-gap-internal);margin-inline-start:var(--qds-control-small-gap-internal)}.qds-password-padding[data-size=small],[data-size=small][type=date],[data-size=small][type=datetime-local],[data-size=small][type=email],[data-size=small][type=month],[data-size=small][type=tel],[data-size=small][type=time],[data-size=small][type=url],[data-size=small][type=week]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-small-height))}[data-size=small][type=file]::file-selector-button{font:var(--qds-control-small-text);height:var(--qds-control-small-height);margin-inline-end:var(--qds-control-small-gap-siblings-related);padding-inline:var(--qds-control-button-small-padding-horizontal)}[data-size=small][type=number]::-webkit-inner-spin-button,[data-size=small][type=number]::-webkit-outer-spin-button{margin-inline-start:var(--qds-control-small-gap-internal)}[data-size=small][type=search]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-small-height) + var(--qds-control-small-icon-size) + var(--qds-control-input-padding-horizontal) + var(--qds-control-small-gap-internal))}[data-size=standard]{font:var(--qds-control-standard-text);height:var(--qds-control-standard-height)}.qds-icon[data-size=standard]{--qds-experimental-icon-click-target-size:var(\n      --qds-control-standard-height\n    );height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}[data-size=standard]~.qds-icon-container{gap:var(--qds-control-standard-gap-internal);margin-inline-start:var(--qds-control-standard-gap-internal)}.qds-password-padding[data-size=standard],[data-size=standard][type=date],[data-size=standard][type=datetime-local],[data-size=standard][type=email],[data-size=standard][type=month],[data-size=standard][type=tel],[data-size=standard][type=time],[data-size=standard][type=url],[data-size=standard][type=week]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-standard-height))}[data-size=standard][type=file]::file-selector-button{font:var(--qds-control-standard-text);height:var(--qds-control-standard-height);margin-inline-end:var(--qds-control-standard-gap-siblings-related);padding-inline:var(--qds-control-button-standard-padding-horizontal)}[data-size=standard][type=number]::-webkit-inner-spin-button,[data-size=standard][type=number]::-webkit-outer-spin-button{margin-inline-start:var(--qds-control-standard-gap-internal)}[data-size=standard][type=search]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-small-height) + var(--qds-control-standard-icon-size) + var(--qds-control-input-padding-horizontal) + var(--qds-control-standard-gap-internal))}[data-size=large]{font:var(--qds-control-large-text);height:var(--qds-control-large-height)}.qds-icon[data-size=large]{--qds-experimental-icon-click-target-size:var(--qds-control-large-height);height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}[data-size=large]~.qds-icon-container{gap:var(--qds-control-large-gap-internal);margin-inline-start:var(--qds-control-large-gap-internal)}.qds-password-padding[data-size=large],[data-size=large][type=date],[data-size=large][type=datetime-local],[data-size=large][type=email],[data-size=large][type=month],[data-size=large][type=tel],[data-size=large][type=time],[data-size=large][type=url],[data-size=large][type=week]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-large-height))}[data-size=large][type=file]::file-selector-button{font:var(--qds-control-large-text);height:var(--qds-control-large-height);margin-inline-end:var(--qds-control-large-gap-siblings-related);padding-inline:var(--qds-control-button-large-padding-horizontal)}[data-size=large][type=number]::-webkit-inner-spin-button,[data-size=large][type=number]::-webkit-outer-spin-button{margin-inline-start:var(--qds-control-large-gap-internal)}[data-size=large][type=search]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-small-height) + var(--qds-control-large-icon-size) + var(--qds-control-input-padding-horizontal) + var(--qds-control-large-gap-internal))}.qds-input{-webkit-appearance:textfield;appearance:textfield;background-color:var(--qds-theme-control-input-background);border-color:var(--qds-theme-control-border);border-radius:var(\n      --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n    ) var(--qds-control-border-radius-top-right,var(--qds-control-border-radius)) var(\n      --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n    ) var(\n      --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n    );border-style:solid;border-width:var(--qds-control-border-width) var(--qds-control-border-width-inline-end,var(--qds-control-border-width)) var(--qds-control-border-width-block-end,var(--qds-control-border-width)) var(--qds-control-border-width);box-sizing:border-box;color:var(--qds-theme-control-text-standard);grid-area:c;padding-block:0;padding-inline:var(--qds-control-input-padding-horizontal)}.qds-input.qds-hide~.qds-icon-container{display:none}.qds-input:disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-input:focus-visible{outline:none}.qds-input:focus-visible~.qds-focus-ring{visibility:visible}.qds-input:placeholder-shown{color:var(--qds-theme-control-text-placeholder)}.qds-input:not(:focus):user-invalid{border-color:var(--qds-theme-feedback-result-failure)}.qds-input::-webkit-search-cancel-button,.qds-input:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week])::-webkit-calendar-picker-indicator{cursor:pointer;display:none}.qds-input[type=file]{padding-block:var(--qds-control-input-padding-horizontal)}.qds-input[type=file]::file-selector-button{background-color:initial;border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-border-radius);color:var(--qds-theme-control-text-standard)}.qds-input[type=file]::file-selector-button:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-input[type=file]::file-selector-button:active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-input[type=color],.qds-input[type=number]{padding-inline:var(--qds-control-input-padding-horizontal)}.qds-input[type=color]{-webkit-appearance:none;appearance:none;cursor:pointer;min-width:50px;padding-block:var(--qds-control-input-padding-horizontal)}.qds-input[type=color]::-webkit-color-swatch-wrapper{padding:0}.qds-input[type=color]::-webkit-color-swatch{border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-border-radius)}.qds-input[type=color]::-moz-color-swatch{border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-border-radius)}.qds-input[type=color]:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-input[type=color]:active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-input.qds-search-padding[data-size=large],.qds-input.qds-search-padding[data-size=small],.qds-input.qds-search-padding[data-size=standard]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-small-height) + var(--qds-control-input-padding-horizontal))}.qds-input[data-size=large][type=file],.qds-input[data-size=small][type=file],.qds-input[data-size=standard][type=file]{height:auto}.qds-input.qds-padding[data-size=large],.qds-input.qds-padding[data-size=small],.qds-input.qds-padding[data-size=standard]{padding-inline:var(--qds-control-input-padding-horizontal)}.qds-input[data-size=large],.qds-input[data-size=small],.qds-input[data-size=standard]{@-moz-document url-prefix(){&[type=date],&[type=datetime-local],&[type=month],&[type=time],&[type=week]{padding-inline-end:var(--qds-control-input-padding-horizontal)}}}.qds-input{@-moz-document url-prefix(){&[type=number]{appearance:none}}}";
+const inputCss = ":host([hidden]){display:none!important}:host{display:inline-block}@-moz-document url-prefix(){[type=date]~.qds-icon-container,[type=datetime-local]~.qds-icon-container,[type=month]~.qds-icon-container,[type=time]~.qds-icon-container,[type=week]~.qds-icon-container{display:none}}.qds-container,.qds-input{max-width:inherit;width:inherit}.qds-container{align-content:flex-start;align-items:center;box-sizing:border-box;display:grid;grid-template-areas:\"h\"}.qds-icon{--qds-theme-interactive-background-hover:none;--qds-theme-interactive-background-pressed:none;--qds-control-small-height:var(--qds-control-small-icon-size);flex-shrink:0}.qds-icon-container,.qds-input{grid-area:h}.qds-icon-container{align-items:center;display:flex;justify-content:center;justify-self:end;padding-inline-end:var(--qds-control-input-padding-horizontal)}.qds-icon-container.no-padding{padding-inline-end:0}.qds-focus-ring{border-radius:max(1px,var(\n        --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-top-right,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n      ));grid-area:h;height:calc(100% + var(--qds-control-border-width) - var(--qds-control-border-width-block-end, var(--qds-control-border-width)));isolation:isolate;outline:var(--qds-control-input-focus-border-width) solid var(--qds-theme-control-input-focus-border);pointer-events:none;visibility:hidden;width:calc(100% + var(--qds-control-border-width) - var(\n        --qds-control-border-width-inline-end,\n        var(--qds-control-border-width)\n      ))}[data-size=small]{font:var(--qds-control-small-text);height:var(--qds-control-small-height)}.qds-icon[data-size=small]{--qds-experimental-icon-click-target-size:var(--qds-control-small-height);height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}[data-size=small]~.qds-icon-container{gap:var(--qds-control-small-gap-internal);margin-inline-start:var(--qds-control-small-gap-internal)}.qds-password-padding[data-size=small],[data-size=small][type=date],[data-size=small][type=datetime-local],[data-size=small][type=email],[data-size=small][type=month],[data-size=small][type=tel],[data-size=small][type=time],[data-size=small][type=url],[data-size=small][type=week]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-small-height))}[data-size=small][type=file]::file-selector-button{font:var(--qds-control-small-text);height:var(--qds-control-small-height);margin-inline-end:var(--qds-control-small-gap-siblings-related);padding-inline:var(--qds-control-button-small-padding-horizontal)}[data-size=small][type=number]::-webkit-inner-spin-button,[data-size=small][type=number]::-webkit-outer-spin-button{margin-inline-start:var(--qds-control-small-gap-internal)}[data-size=small][type=search]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-small-height) + var(--qds-control-small-icon-size) + var(--qds-control-input-padding-horizontal) + var(--qds-control-small-gap-internal))}[data-size=standard]{font:var(--qds-control-standard-text);height:var(--qds-control-standard-height)}.qds-icon[data-size=standard]{--qds-experimental-icon-click-target-size:var(\n      --qds-control-standard-height\n    );height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}[data-size=standard]~.qds-icon-container{gap:var(--qds-control-standard-gap-internal);margin-inline-start:var(--qds-control-standard-gap-internal)}.qds-password-padding[data-size=standard],[data-size=standard][type=date],[data-size=standard][type=datetime-local],[data-size=standard][type=email],[data-size=standard][type=month],[data-size=standard][type=tel],[data-size=standard][type=time],[data-size=standard][type=url],[data-size=standard][type=week]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-standard-height))}[data-size=standard][type=file]::file-selector-button{font:var(--qds-control-standard-text);height:var(--qds-control-standard-height);margin-inline-end:var(--qds-control-standard-gap-siblings-related);padding-inline:var(--qds-control-button-standard-padding-horizontal)}[data-size=standard][type=number]::-webkit-inner-spin-button,[data-size=standard][type=number]::-webkit-outer-spin-button{margin-inline-start:var(--qds-control-standard-gap-internal)}[data-size=standard][type=search]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-small-height) + var(--qds-control-standard-icon-size) + var(--qds-control-input-padding-horizontal) + var(--qds-control-standard-gap-internal))}[data-size=large]{font:var(--qds-control-large-text);height:var(--qds-control-large-height)}.qds-icon[data-size=large]{--qds-experimental-icon-click-target-size:var(--qds-control-large-height);height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}[data-size=large]~.qds-icon-container{gap:var(--qds-control-large-gap-internal);margin-inline-start:var(--qds-control-large-gap-internal)}.qds-password-padding[data-size=large],[data-size=large][type=date],[data-size=large][type=datetime-local],[data-size=large][type=email],[data-size=large][type=month],[data-size=large][type=tel],[data-size=large][type=time],[data-size=large][type=url],[data-size=large][type=week]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-large-height))}[data-size=large][type=file]::file-selector-button{font:var(--qds-control-large-text);height:var(--qds-control-large-height);margin-inline-end:var(--qds-control-large-gap-siblings-related);padding-inline:var(--qds-control-button-large-padding-horizontal)}[data-size=large][type=number]::-webkit-inner-spin-button,[data-size=large][type=number]::-webkit-outer-spin-button{margin-inline-start:var(--qds-control-large-gap-internal)}[data-size=large][type=search]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-small-height) + var(--qds-control-large-icon-size) + var(--qds-control-input-padding-horizontal) + var(--qds-control-large-gap-internal))}.qds-input{-webkit-appearance:textfield;appearance:textfield;background-color:var(--qds-theme-control-input-background);border-color:var(--qds-theme-control-border);border-radius:var(\n      --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n    ) var(--qds-control-border-radius-top-right,var(--qds-control-border-radius)) var(\n      --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n    ) var(\n      --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n    );border-style:solid;border-width:var(--qds-control-border-width) var(--qds-control-border-width-inline-end,var(--qds-control-border-width)) var(--qds-control-border-width-block-end,var(--qds-control-border-width)) var(--qds-control-border-width);box-sizing:border-box;color:var(--qds-theme-control-text-standard);grid-area:h;padding-block:0;padding-inline:var(--qds-control-input-padding-horizontal)}.qds-input.qds-hide~.qds-icon-container{display:none}.qds-input:disabled{opacity:var(--qds-theme-disabled);pointer-events:none}.qds-input:focus-visible{outline:none}.qds-input:focus-visible~.qds-focus-ring{visibility:visible}.qds-input:placeholder-shown{color:var(--qds-theme-control-text-placeholder)}.qds-input:not(:focus):user-invalid{border-color:var(--qds-theme-feedback-result-failure)}.qds-input::-webkit-search-cancel-button,.qds-input:is([type=date],[type=datetime-local],[type=month],[type=time],[type=week])::-webkit-calendar-picker-indicator{cursor:pointer;display:none}.qds-input[type=file]{padding-block:var(--qds-control-input-padding-horizontal)}.qds-input[type=file]::file-selector-button{background-color:initial;border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-border-radius);color:var(--qds-theme-control-text-standard)}.qds-input[type=file]::file-selector-button:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-input[type=file]::file-selector-button:active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-input[type=color],.qds-input[type=number]{padding-inline:var(--qds-control-input-padding-horizontal)}.qds-input[type=color]{-webkit-appearance:none;appearance:none;cursor:pointer;min-width:50px;padding-block:var(--qds-control-input-padding-horizontal)}.qds-input[type=color]::-webkit-color-swatch-wrapper{padding:0}.qds-input[type=color]::-webkit-color-swatch{border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-border-radius)}.qds-input[type=color]::-moz-color-swatch{border:var(--qds-control-border-width) solid var(--qds-theme-control-border);border-radius:var(--qds-control-border-radius)}.qds-input[type=color]:hover{background-color:var(--qds-theme-interactive-background-hover)}.qds-input[type=color]:active{background-color:var(--qds-theme-interactive-background-pressed)}.qds-input.qds-search-padding[data-size=large],.qds-input.qds-search-padding[data-size=small],.qds-input.qds-search-padding[data-size=standard]{padding-inline:var(--qds-control-input-padding-horizontal) calc(var(--qds-control-small-height) + var(--qds-control-input-padding-horizontal))}.qds-input[data-size=large][type=file],.qds-input[data-size=small][type=file],.qds-input[data-size=standard][type=file]{height:auto}.qds-input.qds-padding[data-size=large],.qds-input.qds-padding[data-size=small],.qds-input.qds-padding[data-size=standard]{padding-inline:var(--qds-control-input-padding-horizontal)}.qds-input[data-size=large],.qds-input[data-size=small],.qds-input[data-size=standard]{@-moz-document url-prefix(){&[type=date],&[type=datetime-local],&[type=month],&[type=time],&[type=week]{padding-inline-end:var(--qds-control-input-padding-horizontal)}}}.qds-input{@-moz-document url-prefix(){&[type=number]{appearance:none}}}";
 const QdsInputStyle0 = inputCss;
 
 // SPDX-FileCopyrightText: © 2024 Schneider Electric
@@ -33,7 +33,7 @@ var __classPrivateFieldSet = (undefined && undefined.__classPrivateFieldSet) ||
         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 _Input_instances, _Input_inheritedAttributes, _Input_input, _Input_computedDisabled_get, _Input_computedIconName_get, _Input_computedSize_get, _Input_computedValue_get, _Input_hasIcon_get, _Input_hasInteractiveIcon_get, _Input_iconClickHandler_get, _Input_computedType_get, _Input_computedAriaLabel_get, _Input_togglePasswordVisibility, _Input_ref, _Input_getFiles, _Input_onBlur, _Input_onCancel, _Input_onChange, _Input_onClear, _Input_onFocus, _Input_onInput, _Input_defineGetter;
+var _Input_instances, _Input_inheritedAttributes, _Input_input, _Input_computedDisabled_get, _Input_computedIconName_get, _Input_computedSize_get, _Input_computedValue_get, _Input_hasIcon_get, _Input_hasInteractiveIcon_get, _Input_iconClickHandler_get, _Input_computedType_get, _Input_computedAriaLabel_get, _Input_togglePasswordVisibility, _Input_ref, _Input_getFiles, _Input_onBlur, _Input_onCancel, _Input_onChange, _Input_onClear, _Input_onFocus, _Input_onInput, _Input_defineGetter, _Input_clearValue;
 const Input = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
@@ -227,8 +227,7 @@ const Input = class {
             this.changeEmitter.emit();
         });
         _Input_onClear.set(this, () => {
-            helpers.invariant(__classPrivateFieldGet(this, _Input_input, "f"));
-            __classPrivateFieldGet(this, _Input_input, "f").value = '';
+            __classPrivateFieldGet(this, _Input_instances, "m", _Input_clearValue).call(this);
             __classPrivateFieldGet(this, _Input_onInput, "f").call(this, new InputEvent('input', { inputType: 'deleteContent' }));
         });
         _Input_onFocus.set(this, (event) => {
@@ -307,6 +306,10 @@ const Input = class {
     valueChanged() {
         if (!__classPrivateFieldGet(this, _Input_instances, "a", _Input_computedDisabled_get))
             this.internals.setFormValue(__classPrivateFieldGet(this, _Input_instances, "a", _Input_computedValue_get));
+        if ((__classPrivateFieldGet(this, _Input_instances, "a", _Input_computedValue_get) === null || __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedValue_get) === '') &&
+            this.type === 'file') {
+            __classPrivateFieldGet(this, _Input_instances, "m", _Input_clearValue).call(this);
+        }
     }
     componentWillLoad() {
         __classPrivateFieldGet(this, _Input_instances, "m", _Input_defineGetter).call(this, 'form', () => this.internals.form);
@@ -338,7 +341,7 @@ const Input = class {
         const shouldShowSearchIcon = isSearchType && this.noIcon === false;
         const shouldHideIcon = !isSearchType && this.noIcon === true;
         const shouldRemoveSearchPadding = isSearchType && this.noIcon === true;
-        return (index.h("div", { key: '5336ee36ce01859982ca1c5af230dcea3200d57e', class: "qds-container" }, index.h("input", { key: 'efc9f03bb3de1eb85e2b8abf42be5024918ae58e', accept: this.accept, autoCapitalize: this.host.autocapitalize, autoComplete: this.autoComplete,
+        return (index.h("div", { key: '2b322dc1cd0734390c38c4449eae71a66af14412', class: "qds-container" }, index.h("input", { key: '2e4b2c967b4ece694bb43e48fc225ec667c59f60', accept: this.accept, autoCapitalize: this.host.autocapitalize, autoComplete: this.autoComplete,
             // eslint-disable-next-line jsx-a11y/no-autofocus
             autoFocus: this.host.autofocus, capture: this.capture, class: {
                 'qds-search-padding': shouldRemoveSearchPadding,
@@ -347,13 +350,13 @@ const Input = class {
                 'qds-padding': shouldHideIcon,
                 'qds-password-padding': this.type === 'password' ||
                     (this.isPasswordVisible && this.type === 'text'),
-            }, "data-size": __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedSize_get), disabled: this.disabled, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, max: this.max, maxLength: this.maxLength, min: this.min, minLength: this.minLength, multiple: this.multiple, onBlur: __classPrivateFieldGet(this, _Input_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Input_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Input_onFocus, "f"), onInput: __classPrivateFieldGet(this, _Input_onInput, "f"), placeholder: this.placeholder, ref: __classPrivateFieldGet(this, _Input_ref, "f"), spellcheck: this.host.spellcheck, step: this.step, tabIndex: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedDisabled_get) ? undefined : this.tabIndex, type: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedType_get), ...__classPrivateFieldGet(this, _Input_inheritedAttributes, "f") }), index.h("div", { key: 'a6ef2b4ac99c8f749d250d64fb2926c49f1171e7', class: "qds-focus-ring" }), __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedIconName_get) && (index.h("div", { key: '35cc748463e4ecb3e570dbaee66fb79c6c9c16a1', class: {
+            }, "data-size": __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedSize_get), disabled: this.disabled, enterKeyHint: this.enterkeyhint, inputMode: this.inputmode, max: this.max, maxLength: this.maxLength, min: this.min, minLength: this.minLength, multiple: this.multiple, onBlur: __classPrivateFieldGet(this, _Input_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Input_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Input_onFocus, "f"), onInput: __classPrivateFieldGet(this, _Input_onInput, "f"), placeholder: this.placeholder, ref: __classPrivateFieldGet(this, _Input_ref, "f"), spellcheck: this.host.spellcheck, step: this.step, tabIndex: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedDisabled_get) ? undefined : this.tabIndex, type: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedType_get), ...__classPrivateFieldGet(this, _Input_inheritedAttributes, "f") }), index.h("div", { key: '76df6489d080978a3272ef04d57e0739f183052f', class: "qds-focus-ring" }), __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedIconName_get) && (index.h("div", { key: 'af02237afb4f9dd58f52acb6811ffda0177b47a1', class: {
                 'qds-icon-container': true,
                 'no-padding': shouldRemoveSearchPadding,
-            } }, shouldShowClearButton && (index.h("qds-button", { key: '44897869098ae7b6af2481cf70cae3a0c5f50483', class: {
+            } }, shouldShowClearButton && (index.h("qds-button", { key: 'cb7df2dfb2e1c7a3e4302f1b15108da1a7e1c51d', class: {
                 'qds-icon': true,
                 'qds-hide': !hasValue,
-            }, disabled: this.disabled, iconLibrary: "core", iconName: "clear", iconOnly: true, importance: "subdued", onClick: __classPrivateFieldGet(this, _Input_onClear, "f"), size: "small", text: "clear input" })), __classPrivateFieldGet(this, _Input_instances, "a", _Input_hasIcon_get) && (index.h("qds-icon", { key: 'd95ee02b5ffd10d2252781658ad48cb3770310e7', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedSize_get), library: "core", name: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedIconName_get) })), __classPrivateFieldGet(this, _Input_instances, "a", _Input_hasInteractiveIcon_get) && (index.h("qds-button", { key: '068999de69e003f3998e296f268ff730b5e38573', class: "qds-icon", disabled: this.disabled, iconLibrary: "core", iconName: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedIconName_get), iconOnly: true, importance: "subdued", onClick: __classPrivateFieldGet(this, _Input_instances, "a", _Input_iconClickHandler_get), size: "small", text: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedAriaLabel_get) })), shouldShowSearchIcon ? (index.h("qds-icon", { "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedSize_get), library: "core", name: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedIconName_get) })) : (index.h("div", null))))));
+            }, disabled: this.disabled, iconLibrary: "core", iconName: "clear", iconOnly: true, importance: "subdued", onClick: __classPrivateFieldGet(this, _Input_onClear, "f"), size: "small", text: "clear input" })), __classPrivateFieldGet(this, _Input_instances, "a", _Input_hasIcon_get) && (index.h("qds-icon", { key: '4673721c023cb9cad110963d2076122a77a9e18f', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedSize_get), library: "core", name: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedIconName_get) })), __classPrivateFieldGet(this, _Input_instances, "a", _Input_hasInteractiveIcon_get) && (index.h("qds-button", { key: 'e91546f1598a8e661fb02a3c11c311eef0d42e4f', class: "qds-icon", disabled: this.disabled, iconLibrary: "core", iconName: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedIconName_get), iconOnly: true, importance: "subdued", onClick: __classPrivateFieldGet(this, _Input_instances, "a", _Input_iconClickHandler_get), size: "small", text: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedAriaLabel_get) })), shouldShowSearchIcon ? (index.h("qds-icon", { "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedSize_get), library: "core", name: __classPrivateFieldGet(this, _Input_instances, "a", _Input_computedIconName_get) })) : (index.h("div", null))))));
     }
     static get delegatesFocus() { return true; }
     static get formAssociated() { return true; }
@@ -436,6 +439,9 @@ _Input_inheritedAttributes = new WeakMap(), _Input_input = new WeakMap(), _Input
         : (this.type ?? '');
 }, _Input_defineGetter = function _Input_defineGetter(p, get) {
     Object.defineProperty(this.host, p, { enumerable: true, get });
+}, _Input_clearValue = function _Input_clearValue() {
+    helpers.invariant(__classPrivateFieldGet(this, _Input_input, "f"));
+    __classPrivateFieldGet(this, _Input_input, "f").value = '';
 };
 Input.style = QdsInputStyle0;
 

package/dist/cjs/qds-input.cjs.entry.js.map

@@ -1 +1 @@
-{"file":"qds-input.entry.cjs.js","mappings":"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","names":["VALID_STATE","invariant","CUSTOM_ERROR_FLAGS","NO_ERROR_FLAGS","pickFocusEventAttributes","pickInputEventAttributes","inheritAriaAttributes","h"],"sources":["src/components/input/input.css?tag=qds-input&encapsulation=shadow","src/components/input/input.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@-moz-document url-prefix() {\n  [type='date'],\n  [type='datetime-local'],\n  [type='month'],\n  [type='time'],\n  [type='week'] {\n    ~ .qds-icon-container {\n      display: none;\n    }\n  }\n}\n\n.qds-container,\n.qds-input {\n  max-width: inherit;\n  width: inherit;\n}\n\n.qds-container {\n  align-content: flex-start;\n  align-items: center;\n  box-sizing: border-box;\n  display: grid;\n  grid-template-areas: 'input';\n}\n\n.qds-icon {\n  --qds-theme-interactive-background-hover: none;\n  --qds-theme-interactive-background-pressed: none;\n  --qds-control-small-height: var(--qds-control-small-icon-size);\n\n  flex-shrink: 0;\n}\n\n.qds-input,\n.qds-icon-container {\n  grid-area: input;\n}\n\n.qds-icon-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  justify-self: end;\n  padding-inline-end: var(--qds-control-input-padding-horizontal);\n\n  &.no-padding {\n    padding-inline-end: 0;\n  }\n}\n\n.qds-focus-ring {\n  border-radius: max(\n      1px,\n      var(\n        --qds-control-border-radius-top-left,\n        var(--qds-control-border-radius)\n      )\n    )\n    max(\n      1px,\n      var(\n        --qds-control-border-radius-top-right,\n        var(--qds-control-border-radius)\n      )\n    )\n    max(\n      1px,\n      var(\n        --qds-control-border-radius-bottom-right,\n        var(--qds-control-border-radius)\n      )\n    )\n    max(\n      1px,\n      var(\n        --qds-control-border-radius-bottom-left,\n        var(--qds-control-border-radius)\n      )\n    );\n  grid-area: input;\n  isolation: isolate;\n  outline: var(--qds-control-input-focus-border-width) solid\n    var(--qds-theme-control-input-focus-border);\n  pointer-events: none;\n  visibility: hidden;\n  width: calc(\n    100% + var(--qds-control-border-width) -\n      var(\n        --qds-control-border-width-inline-end,\n        var(--qds-control-border-width)\n      )\n  );\n  height: calc(\n    100% + var(--qds-control-border-width) -\n      var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n  );\n}\n\n[data-size='small'] {\n  font: var(--qds-control-small-text);\n  height: var(--qds-control-small-height);\n\n  &.qds-icon {\n    --qds-experimental-icon-click-target-size: var(--qds-control-small-height);\n\n    width: var(--qds-control-small-icon-size);\n    height: var(--qds-control-small-icon-size);\n  }\n\n  & ~ .qds-icon-container {\n    gap: var(--qds-control-small-gap-internal);\n    margin-inline-start: var(--qds-control-small-gap-internal);\n  }\n\n  &.qds-password-padding,\n  &[type='date'],\n  &[type='datetime-local'],\n  &[type='email'],\n  &[type='month'],\n  &[type='time'],\n  &[type='url'],\n  &[type='tel'],\n  &[type='week'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-small-height)\n      );\n  }\n\n  &[type='file']::file-selector-button {\n    font: var(--qds-control-small-text);\n    height: var(--qds-control-small-height);\n    margin-inline-end: var(--qds-control-small-gap-siblings-related);\n    padding-inline: var(--qds-control-button-small-padding-horizontal);\n  }\n\n  &[type='number']::-webkit-inner-spin-button,\n  &[type='number']::-webkit-outer-spin-button {\n    margin-inline-start: var(--qds-control-small-gap-internal);\n  }\n\n  &[type='search'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-small-height) + var(--qds-control-small-icon-size) +\n          var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-small-gap-internal)\n      );\n  }\n}\n\n[data-size='standard'] {\n  font: var(--qds-control-standard-text);\n  height: var(--qds-control-standard-height);\n\n  &.qds-icon {\n    --qds-experimental-icon-click-target-size: var(\n      --qds-control-standard-height\n    );\n\n    width: var(--qds-control-standard-icon-size);\n    height: var(--qds-control-standard-icon-size);\n  }\n\n  & ~ .qds-icon-container {\n    gap: var(--qds-control-standard-gap-internal);\n    margin-inline-start: var(--qds-control-standard-gap-internal);\n  }\n\n  &.qds-password-padding,\n  &[type='date'],\n  &[type='datetime-local'],\n  &[type='email'],\n  &[type='month'],\n  &[type='time'],\n  &[type='url'],\n  &[type='tel'],\n  &[type='week'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-standard-height)\n      );\n  }\n\n  &[type='file']::file-selector-button {\n    font: var(--qds-control-standard-text);\n    height: var(--qds-control-standard-height);\n    margin-inline-end: var(--qds-control-standard-gap-siblings-related);\n    padding-inline: var(--qds-control-button-standard-padding-horizontal);\n  }\n\n  &[type='number']::-webkit-inner-spin-button,\n  &[type='number']::-webkit-outer-spin-button {\n    margin-inline-start: var(--qds-control-standard-gap-internal);\n  }\n\n  &[type='search'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-small-height) + var(--qds-control-standard-icon-size) +\n          var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-standard-gap-internal)\n      );\n  }\n}\n\n[data-size='large'] {\n  font: var(--qds-control-large-text);\n  height: var(--qds-control-large-height);\n\n  &.qds-icon {\n    --qds-experimental-icon-click-target-size: var(--qds-control-large-height);\n\n    width: var(--qds-control-large-icon-size);\n    height: var(--qds-control-large-icon-size);\n  }\n\n  & ~ .qds-icon-container {\n    gap: var(--qds-control-large-gap-internal);\n    margin-inline-start: var(--qds-control-large-gap-internal);\n  }\n\n  &.qds-password-padding,\n  &[type='date'],\n  &[type='datetime-local'],\n  &[type='email'],\n  &[type='month'],\n  &[type='time'],\n  &[type='url'],\n  &[type='tel'],\n  &[type='week'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-large-height)\n      );\n  }\n\n  &[type='file']::file-selector-button {\n    font: var(--qds-control-large-text);\n    height: var(--qds-control-large-height);\n    margin-inline-end: var(--qds-control-large-gap-siblings-related);\n    padding-inline: var(--qds-control-button-large-padding-horizontal);\n  }\n\n  &[type='number'] {\n    &::-webkit-inner-spin-button,\n    &::-webkit-outer-spin-button {\n      margin-inline-start: var(--qds-control-large-gap-internal);\n    }\n  }\n\n  &[type='search'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-small-height) + var(--qds-control-large-icon-size) +\n          var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-large-gap-internal)\n      );\n  }\n}\n\n.qds-input {\n  appearance: textfield;\n  background-color: var(--qds-theme-control-input-background);\n  border-color: var(--qds-theme-control-border);\n  border-radius: var(\n      --qds-control-border-radius-top-left,\n      var(--qds-control-border-radius)\n    )\n    var(--qds-control-border-radius-top-right, var(--qds-control-border-radius))\n    var(\n      --qds-control-border-radius-bottom-right,\n      var(--qds-control-border-radius)\n    )\n    var(\n      --qds-control-border-radius-bottom-left,\n      var(--qds-control-border-radius)\n    );\n  border-style: solid;\n  border-width: var(--qds-control-border-width)\n    var(--qds-control-border-width-inline-end, var(--qds-control-border-width))\n    var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n    var(--qds-control-border-width);\n  box-sizing: border-box;\n  color: var(--qds-theme-control-text-standard);\n  grid-area: input;\n  padding-block: 0;\n  padding-inline: var(--qds-control-input-padding-horizontal);\n\n  &.qds-hide ~ .qds-icon-container {\n    display: none;\n  }\n\n  &:disabled {\n    opacity: var(--qds-theme-disabled);\n    pointer-events: none;\n  }\n\n  &:focus-visible {\n    outline: none;\n\n    ~ .qds-focus-ring {\n      visibility: visible;\n    }\n  }\n\n  &:placeholder-shown {\n    color: var(--qds-theme-control-text-placeholder);\n  }\n\n  &:not(:focus):user-invalid {\n    border-color: var(--qds-theme-feedback-result-failure);\n  }\n\n  &:is(\n      [type='date'],\n      [type='datetime-local'],\n      [type='month'],\n      [type='time'],\n      [type='week']\n    )::-webkit-calendar-picker-indicator,\n  &::-webkit-search-cancel-button {\n    cursor: pointer;\n    display: none;\n  }\n\n  &[type='file'] {\n    padding-block: var(--qds-control-input-padding-horizontal);\n\n    &::file-selector-button {\n      background-color: transparent;\n      border: var(--qds-control-border-width) solid\n        var(--qds-theme-control-border);\n      border-radius: var(--qds-control-border-radius);\n      color: var(--qds-theme-control-text-standard);\n\n      &:hover {\n        background-color: var(--qds-theme-interactive-background-hover);\n      }\n\n      &:active {\n        background-color: var(--qds-theme-interactive-background-pressed);\n      }\n    }\n  }\n\n  &[type='color'],\n  &[type='number'] {\n    padding-inline: var(--qds-control-input-padding-horizontal);\n  }\n\n  &[type='color'] {\n    appearance: none;\n    min-width: 50px;\n    padding-block: var(--qds-control-input-padding-horizontal);\n\n    &::-webkit-color-swatch-wrapper {\n      padding: 0;\n    }\n\n    &::-webkit-color-swatch {\n      border: var(--qds-control-border-width) solid\n        var(--qds-theme-control-border);\n      border-radius: var(--qds-control-border-radius);\n    }\n\n    &::-moz-color-swatch {\n      border: var(--qds-control-border-width) solid\n        var(--qds-theme-control-border);\n      border-radius: var(--qds-control-border-radius);\n    }\n\n    cursor: pointer;\n\n    &:hover {\n      background-color: var(--qds-theme-interactive-background-hover);\n    }\n\n    &:active {\n      background-color: var(--qds-theme-interactive-background-pressed);\n    }\n  }\n\n  &[data-size='small'],\n  &[data-size='standard'],\n  &[data-size='large'] {\n    &.qds-search-padding {\n      padding-inline: var(--qds-control-input-padding-horizontal)\n        calc(\n          var(--qds-control-small-height) +\n            var(--qds-control-input-padding-horizontal)\n        );\n    }\n\n    &[type='file'] {\n      height: initial;\n    }\n\n    &.qds-padding {\n      padding-inline: var(--qds-control-input-padding-horizontal);\n    }\n\n    @-moz-document url-prefix() {\n      &[type='date'],\n      &[type='datetime-local'],\n      &[type='month'],\n      &[type='week'],\n      &[type='time'] {\n        padding-inline-end: var(--qds-control-input-padding-horizontal);\n      }\n    }\n  }\n\n  @-moz-document url-prefix() {\n    &[type='number'] {\n      appearance: none;\n    }\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 {\n  Attributes,\n  QdsFocusEventDetail,\n  QdsInputEventDetail,\n} from '../../helpers'\nimport {\n  inheritAriaAttributes,\n  invariant,\n  pickFocusEventAttributes,\n  pickInputEventAttributes,\n} from '../../helpers'\nimport type { AutoComplete, EnterKeyHint, InputMode, Value } from '../controls'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Size } from '../shared'\n\nexport type Capture = '' | 'environment' | 'user'\n\nexport type InputType =\n  | 'color'\n  | 'date'\n  | 'datetime-local'\n  | 'email'\n  | 'file'\n  | 'month'\n  | 'number'\n  | 'password'\n  | 'search'\n  | 'tel'\n  | 'text'\n  | 'time'\n  | 'url'\n  | 'week'\n\n/**\n * The `<qds-input>` element is used to create interactive controls for\n * web-based forms in order to accept data from the user; a wide variety of\n * types of input data and control widgets are available, depending on the\n * device and\n * [user agent](https://developer.mozilla.org/docs/Glossary/User_agent).\n *\n * @see https://quartz.se.com/build/components/input\n */\n@Component({\n  tag: 'qds-input',\n  formAssociated: true,\n  shadow: { delegatesFocus: true },\n  styleUrl: 'input.css',\n})\nexport class Input implements ComponentInterface {\n  /**\n   * Hide the input type's icon.\n   *\n   * > **_NOTE:_** Due to browser limitations, the icon may not be hidden in\n   * all browsers.\n   */\n  @Prop() public readonly noIcon?: boolean = false\n\n  /**\n   * The input's size.\n   *\n   * > **_NOTE:_** The native [`size` HTML attribute][size] is not supported.\n   * CSS `width` should be used instead if this functionality is needed.\n   *\n   * [size]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size\n   */\n  @Prop() public readonly size?: Size = 'standard'\n\n  /**\n   * Defines the file types the `file` type input should accept. This is a\n   * comma-separated list of [unique file type specifiers][]. Because a given\n   * file type may be identified in more than one manner, it's useful to\n   * provide a thorough set of type specifiers when you files of a given format\n   * are needed.\n   *\n   * For instance, there are a number of ways Microsoft Word files can be\n   * identified, so a site that accepts Word files might use a `<qds-input>`\n   * like this:\n   *\n   * @example\n   * <qds-input\n   *   type=\"file\"\n   *   accept=\".doc,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n   * ></qds-input>\n   *\n   * [unique file type specifiers]: https://developer.mozilla.org/docs/Web/HTML/Element/input/file#unique_file_type_specifiers\n   *\n   * @webnative\n   */\n  @Prop() public readonly accept?: string\n\n  /**\n   * Provides a hint for a [user agent's][] autocomplete feature. See\n   * [the HTML `autocomplete` attribute][autocomplete] for a complete list of\n   * values and details on how to use `autoComplete`.\n   *\n   * [user agent's]: https://developer.mozilla.org/docs/Glossary/User_agent\n   * [autocomplete]: https://developer.mozilla.org/docs/Web/HTML/Attributes/autocomplete\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autocomplete' })\n  public readonly autoComplete?: AutoComplete\n\n  /**\n   * Specifies that a new file should be captured and which device should be\n   * used to capture that new media of the type defined by `accept`.\n   *\n   * Values include `user`, `environment`, and `''`:\n   *\n   * - `user`: The user-facing camera and/or microphone should be used.\n   * - `environment`: The outward-facing camera and/or microphone should be\n   * used.\n   * - `''`: The implementation-specific capture state.\n   *\n   * @webnative\n   */\n  @Prop() public readonly capture?: Capture\n\n  /**\n   * Prevents the input from being interacted with: it cannot be pressed or\n   * focused.\n   *\n   * @webnative\n   */\n  @Prop() public readonly disabled?: boolean\n\n  /**\n   * What action label (or icon) to present for the enter key on virtual\n   * keyboards. Possible values:\n   *\n   * - `\"done\"`: Typically meaning there is nothing more to input and the input\n   * method editor (IME) will be closed.\n   * - `\"enter\"`:\tTypically inserting a new line.\n   * - `\"go\"`: \tTypically meaning to take the user to the target of the text\n   * they typed.\n   * - `\"next\"`: \tTypically taking the user to the next field that will accept\n   * text.\n   * - `\"previous\"`: Typically taking the user to the previous field that will\n   * accept text.\n   * - `\"search\"`: Typically taking the user to the results of searching for\n   * the text they have typed.\n   * - `\"send\"`: Typically delivering the text to its target.\n   *\n   * @webnative\n   */\n  // FIXME: Can't use `attribute` option here to name this `enterKeyHint` instead.\n  @Prop() public readonly enterkeyhint?: EnterKeyHint\n\n  /**\n   * Returns a file list for a `file` type input.\n   *\n   * @readonly\n   * @webnative\n   */\n  // eslint-disable-next-line unicorn/no-null\n  @Prop() public readonly files: HTMLInputElement['files'] = null\n\n  /**\n   * The [`<form>`][] element to associate the input 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-input>` is associated\n   * with its ancestor `<form>` element, if any.\n   *\n   * This attribute lets you associate `<qds-input>` 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   * Provide a hint to browsers as to the type of virtual keyboard\n   * configuration to use when editing this element or its contents.\n   *\n   * @webnative\n   */\n  // FIXME: Can't use `attribute` option here to name this `inputMode` instead.\n  @Prop() public readonly inputmode?: InputMode\n\n  /**\n   * Returns a list of the [`<label>`][] elements associated with the\n   * `qds-input` 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   * Defines the greatest value in the range of permitted values. If the\n   * `value` entered into the input exceeds this, the input fails\n   * [constraint validation][]. Only valid for `date`, `datetime-local`,\n   * `month`, `time`, and `week` inputs.\n   *\n   * If this value isn't a valid number, then the input has no maximum value.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   *\n   * @webnative\n   */\n  @Prop() public readonly max?: number | string\n\n  /**\n   * The maximum number of characters (as UTF-16 code units) the user can enter\n   * into the input. This must be an non-negative integer value. If no\n   * `maxlength` is specified, or an invalid value is specified, the input has\n   * no maximum length. Only valid for `email`, `password`, `search`, `tel`,\n   * `text`, and `url` inputs.\n   *\n   * The input will fail [constraint validation][] if the length of the text\n   * entered into the field is greater than `maxlength` UTF-16 code units long.\n   * By default, browsers prevent users from entering more characters than\n   * allowed by the `maxlength` attribute. See [Client-side validation][] for\n   * more information.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'maxlength' }) public readonly maxLength?: number\n\n  /**\n   * Defines the most negative value in the range of permitted values. If the\n   * `value` entered into the input is less than this, the input fails\n   * [constraint validation][]. Only valid for `date`, `datetime-local`,\n   * `month`, `time`, and `week` inputs.\n   *\n   * This value must be less than or equal to the value of the `max` attribute.\n   * If this value isn't a valid number, then the input has no minimum value.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   *\n   * @webnative\n   */\n  @Prop() public readonly min?: number | string\n\n  /**\n   * The minimum number of characters (as UTF-16 code units) the user can enter\n   * into the input. This must be an non-negative integer value smaller than or\n   * equal to the value specified by `maxlength`. If no `minlength` is\n   * specified, or an invalid value is specified, the input has no minimum\n   * length. Only valid for `email`, `password`, `search`, `tel`, `text`, and\n   * `url` inputs.\n   *\n   * The input will fail [constraint validation][] if the length of the text\n   * entered into the field is fewer than `minlength` UTF-16 code units long,\n   * preventing form submission. See [Client-side validation][] for more\n   * information.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'minlength' }) public readonly minLength?: number\n\n  /**\n   * For `email` inputs, specifies if multiple comma-separated email addresses\n   * can be entered. For `file` inputs, specifies if the user is allowed to\n   * select more than one file.\n   *\n   * Only valid for `email` or `file` inputs.\n   *\n   * @webnative\n   */\n  @Prop() public readonly multiple?: boolean\n\n  /**\n   * The name of the input, which is submitted with the form data.\n   *\n   * @webnative\n   */\n  @Prop() public readonly name?: string\n\n  /**\n   * Defines a regular expression that the input's `value` must match in order\n   * for the value to pass [constraint validation][]. It must be a valid\n   * JavaScript regular expression, as used by the [`RegExp`][] type, and as\n   * documented in MDN's [guide on regular expressions][]; the `'u'` flag is\n   * specified when compiling the regular expression, so that the pattern is\n   * treated as a sequence of Unicode code points, instead of as ASCII. No\n   * forward slashes should be specified around the pattern text. Only valid\n   * for `email`, `password`, `search`, `tel`, `text`, and `url` inputs.\n   *\n   * If the `pattern` is invalid, no regular expression is applied and this\n   * property is ignored. If the pattern is valid and a non-empty value does\n   * not match the pattern, constraint validation will prevent form submission.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [`RegExp`]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/RegExp\n   * [guide on regular expressions]: https://developer.mozilla.org/docs/Web/JavaScript/Guide/Regular_Expressions\n   *\n   * @webnative\n   */\n  @Prop() public readonly pattern?: string\n\n  /**\n   * Text that appears in the input when it has no value set. Only valid for\n   * `email`, `number`, `password`, `search`, `tel`, `text`, and `url` inputs.\n   *\n   * @webnative\n   */\n  @Prop() public readonly placeholder?: string\n\n  /**\n   * A value must be specified for the input before the owning form can be\n   * submitted. Not valid for `color` inputs.\n   *\n   * See [Client-side validation][] and the\n   * [HTML attribute: `required`][required] for more information.\n   *\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   * [required]: https://developer.mozilla.org/docs/Web/HTML/Attributes/required\n   *\n   * @webnative\n   */\n  @Prop() public readonly required?: boolean\n\n  /**\n   * Get or set the selection direction of a text selection.\n   *\n   * > **_NOTE:_** This property has no effect when used as an attribute.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true })\n  // eslint-disable-next-line unicorn/no-null\n  public selectionDirection: HTMLInputElement['selectionDirection'] = null\n\n  /**\n   * Get or set the ending position or offset of a text selection.\n   *\n   * > **_NOTE:_** This property has no effect when used as an attribute.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true })\n  // eslint-disable-next-line unicorn/no-null\n  public selectionEnd: HTMLInputElement['selectionEnd'] = null\n\n  /**\n   * Get or set the starting position or offset of a text selection.\n   *\n   * > **_NOTE:_** This property has no effect when used as an attribute.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true })\n  // eslint-disable-next-line unicorn/no-null\n  public selectionStart: HTMLInputElement['selectionStart'] = null\n\n  /**\n   * Specifies the granularity that the `value` must adhere to. Only valid for\n   * `date`, `datetime-local`, `month`, `number`, `time`, and `week` inputs.\n   *\n   * The value must be a positive number—integer or float—or the special value\n   * `any`, which means no stepping is implied, and any value is allowed\n   * (barring other constraints, such as `min` and `max`).\n   *\n   * If `any` is not explicitly set, valid values for the `number` are the\n   * basis for stepping — the `min` value and increments of the step value, up\n   * to the `max` value, if specified.\n   *\n   * @webnative\n   */\n  @Prop() public readonly step?: number | 'any'\n\n  /**\n   * The type of input to render:\n   *\n   * - `\"date\"`: An input for entering a date (year, month, and day, with no\n   * time). Opens a date picker or numeric wheels for year, month, day when\n   * active in supporting browsers.\n   * - `\"datetime-local\"`: An input for entering a date and time, with no time\n   * zone. Opens a date picker or numeric wheels for date and time components\n   * when active in supporting browsers.\n   * - `\"email\"`: An input for editing an email address. Looks like a `\"text\"`\n   * input, but has validation parameters and relevant keyboard in supporting\n   * browsers and devices with dynamic keyboards.\n   * - `\"month\"`: An input for entering a month and year, with no time zone.\n   * - `\"number\"`: An input for entering a number. Displays a spinner and adds\n   * default validation when supported. Displays a numeric keypad in some\n   * devices with dynamic keypads.\n   * - `\"password\"`: A single-line text input whose value is obscured. Will\n   * alert user if site is not secure.\n   * - `\"search\"`: A single-line text input for entering search strings.\n   * Line-breaks are automatically removed from the input value. May include a\n   * delete icon in supporting browsers that can be used to clear the input.\n   * Displays a search icon instead of enter key on some devices with dynamic\n   * keypads.\n   * - `\"tel\"`: An input for entering a telephone number. Displays a telephone\n   * keypad in some devices with dynamic keypads.\n   * - `\"text\"`: A single-line text input. Line-breaks are automatically\n   * removed from the input value.\n   * - `\"time\"`: An input for entering a time value with no time zone.\n   * - `\"url\"`: An input for entering a URL. Looks like a `\"text\"` input, but\n   * has validation parameters and relevant keyboard in supporting browsers and\n   * devices with dynamic keyboards.\n   * - `\"week\"`: An input for entering a date consisting of a week-year number\n   * and a week number with no time zone.\n   *\n   * @webnative\n   */\n  @Prop() public readonly type?: InputType\n\n  /**\n   * The error message that would be shown to the user if the `<qds-input>`\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-input>`.\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 input.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public value?: Value\n\n  /**\n   * True if `<qds-input>` will be validated when the form is submitted; false\n   * 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 input loses focus.\n   */\n  @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n  private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when the user cancels the file picker via the <kbd>Esc</kbd> key\n   * or the cancel button and when the user re-selects the same files that were\n   * previously selected.\n   */\n  @Event({ eventName: 'qdsCancel', cancelable: false })\n  private readonly cancelEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when an alteration to the input's value is committed by the user.\n   */\n  @Event({ eventName: 'qdsChange', cancelable: false })\n  private readonly changeEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when the input gains focus.\n   */\n  @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n  private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when the input's value changes.\n   */\n  @Event({ eventName: 'qdsInput', cancelable: false })\n  private readonly inputEmitter!: EventEmitter<QdsInputEventDetail>\n\n  @Element() private readonly host!: HTMLElement\n\n  @State() private tabIndex?: number\n\n  @State() private isPasswordVisible = false\n\n  #inheritedAttributes: Attributes = {}\n\n  #input?: HTMLInputElement\n\n  get #computedDisabled(): boolean {\n    return this.host.matches(':disabled') || (this.disabled ?? false)\n  }\n\n  get #computedIconName():\n    | `input-${InputType}`\n    | `input-password-hide`\n    | `input-password-show`\n    | undefined {\n    if (this.type === 'password')\n      return this.isPasswordVisible\n        ? 'input-password-hide'\n        : 'input-password-show'\n\n    switch (this.type) {\n      case 'date':\n      case 'datetime-local':\n      case 'email':\n      case 'month':\n      case 'search':\n      case 'tel':\n      case 'time':\n      case 'url':\n      case 'week': {\n        return `input-${this.type}`\n      }\n      default: {\n        return undefined\n      }\n    }\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(): Parameters<ElementInternals['setFormValue']>[0] {\n    if (typeof this.value === 'number') return this.value.toString()\n    // eslint-disable-next-line unicorn/no-null\n    return this.value === undefined ? null : this.value\n  }\n\n  get #hasIcon(): boolean {\n    return (\n      typeof this.type === 'string' &&\n      ['email', 'tel', 'url'].includes(this.type)\n    )\n  }\n\n  get #hasInteractiveIcon(): boolean {\n    return (\n      typeof this.type === 'string' &&\n      ['month', 'time', 'date', 'datetime-local', 'week', 'password'].includes(\n        this.type,\n      )\n    )\n  }\n\n  get #iconClickHandler(): () => void {\n    return this.type === 'password'\n      ? this.#togglePasswordVisibility\n      : this.showPicker\n  }\n\n  get #computedType(): InputType {\n    return this.type === 'password' && this.isPasswordVisible\n      ? 'text'\n      : (this.type ?? 'text')\n  }\n\n  get #computedAriaLabel(): string {\n    return this.type === 'password'\n      ? this.isPasswordVisible\n        ? 'Hide password'\n        : 'Show password'\n      : (this.type ?? '')\n  }\n\n  @Listen('click')\n  protected onClick(event: MouseEvent): void {\n    if (this.#computedDisabled) event.stopImmediatePropagation()\n  }\n\n  @Listen('keydown')\n  protected onKeydown(event: KeyboardEvent): void {\n    if (this.#computedDisabled) {\n      event.stopImmediatePropagation()\n      return\n    }\n\n    if (event.key === 'Enter' && this.internals.form) {\n      this.internals.form.requestSubmit()\n      event.preventDefault()\n    }\n  }\n\n  @Watch('disabled')\n  protected disabledChanged(): void {\n    if (this.#computedDisabled)\n      // eslint-disable-next-line unicorn/no-null\n      this.internals.setFormValue(null)\n    else this.internals.setFormValue(this.#computedValue)\n  }\n\n  @Watch('selectionDirection')\n  protected selectionDirectionChanged(): void {\n    invariant(this.#input)\n\n    this.#input.selectionDirection = this.selectionDirection\n  }\n\n  @Watch('selectionEnd')\n  protected selectionEndChanged(): void {\n    invariant(this.#input)\n\n    this.#input.selectionEnd = this.selectionEnd\n  }\n\n  @Watch('selectionStart')\n  protected selectionStartChanged(): void {\n    invariant(this.#input)\n\n    this.#input.selectionStart = this.selectionStart\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('max')\n  @Watch('maxLength')\n  @Watch('min')\n  @Watch('minLength')\n  @Watch('pattern')\n  @Watch('required')\n  @Watch('step')\n  @Watch('type')\n  @Watch('value')\n  protected validationChanged(): void {\n    if (!this.#input) return\n\n    if (this.#input.max !== this.max && this.max !== undefined)\n      this.#input.max = this.max.toString()\n    if (this.maxLength !== undefined) this.#input.maxLength = this.maxLength\n    if (this.#input.min !== this.min && this.min !== undefined)\n      this.#input.min = this.min.toString()\n    if (this.minLength !== undefined) this.#input.minLength = this.minLength\n    if (this.pattern !== undefined) this.#input.pattern = this.pattern\n    this.#input.required = this.required ?? false\n    if (this.#input.step !== this.step && this.step !== undefined)\n      this.#input.step = this.step.toString()\n    this.#input.type = this.#computedType\n\n    // eslint-disable-next-line unicorn/no-null\n    if (this.type !== 'file' && this.value != null)\n      this.#input.value = this.value.toString()\n\n    const { valid } = this.#input.validity\n    if (valid)\n      this.internals.setValidity(NO_ERROR_FLAGS, undefined, this.#input)\n    else\n      this.internals.setValidity(\n        this.#input.validity,\n        this.#input.validationMessage,\n        this.#input,\n      )\n  }\n\n  @Watch('value')\n  protected valueChanged(): void {\n    if (!this.#computedDisabled)\n      this.internals.setFormValue(this.#computedValue)\n  }\n\n  public componentWillLoad(): void {\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    this.#defineGetter('files', this.#getFiles)\n    this.#defineGetter('labels', () => this.internals.labels)\n\n    this.#inheritedAttributes = inheritAriaAttributes(this.host)\n    this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n  }\n\n  public componentDidLoad(): void {\n    invariant(this.#input)\n\n    this.validationChanged()\n    this.valueChanged()\n    // FIXME: This event is supported by the native `<input>` element but not\n    // recognized by Stencil's type definitions, so it needs to be manually\n    // bound here.\n    this.#input.addEventListener('cancel', this.#onCancel)\n  }\n\n  public disconnectedCallback(): void {\n    if (this.#input) this.#input.removeEventListener('cancel', this.#onCancel)\n  }\n\n  public render() {\n    const hasValue =\n      this.value !== null && this.value !== undefined && this.value !== ''\n    const isSearchType = this.type === 'search'\n    const shouldShowClearButton = isSearchType && hasValue\n    const shouldShowSearchIcon = isSearchType && this.noIcon === false\n    const shouldHideIcon = !isSearchType && this.noIcon === true\n    const shouldRemoveSearchPadding = isSearchType && this.noIcon === true\n\n    return (\n      <div class=\"qds-container\">\n        <input\n          accept={this.accept}\n          autoCapitalize={this.host.autocapitalize}\n          autoComplete={this.autoComplete}\n          // eslint-disable-next-line jsx-a11y/no-autofocus\n          autoFocus={this.host.autofocus}\n          capture={this.capture}\n          class={{\n            'qds-search-padding': shouldRemoveSearchPadding,\n            'qds-input': true,\n            'qds-hide': shouldHideIcon,\n            'qds-padding': shouldHideIcon,\n            'qds-password-padding':\n              this.type === 'password' ||\n              (this.isPasswordVisible && this.type === 'text'),\n          }}\n          data-size={this.#computedSize}\n          disabled={this.disabled}\n          enterKeyHint={this.enterkeyhint}\n          inputMode={this.inputmode}\n          max={this.max}\n          maxLength={this.maxLength}\n          min={this.min}\n          minLength={this.minLength}\n          multiple={this.multiple}\n          onBlur={this.#onBlur}\n          onChange={this.#onChange}\n          onFocus={this.#onFocus}\n          onInput={this.#onInput}\n          placeholder={this.placeholder}\n          ref={this.#ref}\n          spellcheck={this.host.spellcheck}\n          step={this.step}\n          tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n          type={this.#computedType}\n          // eslint-disable-next-line react/jsx-props-no-spreading\n          {...this.#inheritedAttributes}\n        />\n        <div class=\"qds-focus-ring\" />\n        {this.#computedIconName && (\n          <div\n            class={{\n              'qds-icon-container': true,\n              'no-padding': shouldRemoveSearchPadding,\n            }}\n          >\n            {shouldShowClearButton && (\n              <qds-button\n                class={{\n                  'qds-icon': true,\n                  'qds-hide': !hasValue,\n                }}\n                disabled={this.disabled}\n                iconLibrary=\"core\"\n                iconName=\"clear\"\n                iconOnly\n                importance=\"subdued\"\n                onClick={this.#onClear}\n                size=\"small\"\n                text=\"clear input\"\n              />\n            )}\n            {this.#hasIcon && (\n              <qds-icon\n                aria-hidden=\"true\"\n                class=\"qds-icon\"\n                data-size={this.#computedSize}\n                library=\"core\"\n                name={this.#computedIconName}\n              />\n            )}\n            {this.#hasInteractiveIcon && (\n              <qds-button\n                class=\"qds-icon\"\n                disabled={this.disabled}\n                iconLibrary=\"core\"\n                iconName={this.#computedIconName}\n                iconOnly\n                importance=\"subdued\"\n                onClick={this.#iconClickHandler}\n                size=\"small\"\n                text={this.#computedAriaLabel}\n              />\n            )}\n            {shouldShowSearchIcon ? (\n              <qds-icon\n                aria-hidden=\"true\"\n                class=\"qds-icon\"\n                data-size={this.#computedSize}\n                library=\"core\"\n                name={this.#computedIconName}\n              />\n            ) : (\n              <div />\n            )}\n          </div>\n        )}\n      </div>\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    invariant(this.#input)\n\n    this.#input.setCustomValidity(error)\n    if (error)\n      this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.#input)\n    else this.internals.setValidity(NO_ERROR_FLAGS)\n  }\n\n  public select: HTMLInputElement['select'] = () => {\n    invariant(this.#input)\n\n    this.#input.select()\n  }\n\n  public getSelectionDirection: () => HTMLInputElement['selectionDirection'] =\n    () => {\n      invariant(this.#input)\n\n      return this.#input.selectionDirection\n    }\n\n  public getSelectionStart: () => HTMLInputElement['selectionStart'] = () => {\n    invariant(this.#input)\n\n    return this.#input.selectionStart\n  }\n\n  public getSelectionEnd: () => HTMLInputElement['selectionEnd'] = () => {\n    invariant(this.#input)\n\n    return this.#input.selectionEnd\n  }\n\n  public setRangeText = (\n    replacement: string,\n    start: number,\n    end: number,\n    selectionMode?: SelectionMode,\n  ): void => {\n    invariant(this.#input)\n\n    this.#input.setRangeText(replacement, start, end, selectionMode)\n\n    if (this.value !== this.#input.value) {\n      this.value = this.#input.value\n      this.inputEmitter.emit()\n      this.changeEmitter.emit()\n    }\n  }\n\n  public setSelectionRange: HTMLInputElement['setSelectionRange'] = (\n    start,\n    end,\n    direction,\n  ) => {\n    invariant(this.#input)\n\n    this.#input.setSelectionRange(start, end, direction)\n  }\n\n  public stepDown: HTMLInputElement['stepDown'] = (n) => {\n    invariant(this.#input)\n\n    this.#input.stepDown(n)\n  }\n\n  public stepUp: HTMLInputElement['stepUp'] = (n) => {\n    invariant(this.#input)\n\n    this.#input.stepUp(n)\n  }\n\n  public showPicker: HTMLInputElement['showPicker'] = () => {\n    invariant(this.#input)\n\n    this.#input.showPicker()\n  }\n\n  readonly #togglePasswordVisibility = (): void => {\n    invariant(this.#input)\n    this.isPasswordVisible = !this.isPasswordVisible\n\n    this.#input.type = this.#computedType\n  }\n\n  readonly #ref = (input?: HTMLInputElement): void => {\n    this.#input = input\n  }\n\n  readonly #getFiles: () => HTMLInputElement['files'] = () => {\n    invariant(this.#input)\n\n    return this.#input.files\n  }\n\n  readonly #onBlur = (event: FocusEvent): void => {\n    this.blurEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  readonly #onCancel = (): void => {\n    this.cancelEmitter.emit()\n  }\n\n  readonly #onChange = (): void => {\n    this.changeEmitter.emit()\n  }\n\n  readonly #onClear = (): void => {\n    invariant(this.#input)\n\n    this.#input.value = ''\n    this.#onInput(new InputEvent('input', { inputType: 'deleteContent' }))\n  }\n\n  readonly #onFocus = (event: FocusEvent): void => {\n    this.focusEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  readonly #onInput = (event: InputEvent): void => {\n    invariant(this.#input)\n\n    this.value = this.#input.value\n    this.inputEmitter.emit(pickInputEventAttributes(event))\n  }\n\n  #defineGetter(p: PropertyKey, get: () => unknown): void {\n    Object.defineProperty(this.host, p, { enumerable: true, get })\n  }\n}\n"],"version":3}
+{"file":"qds-input.entry.cjs.js","mappings":"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","names":["VALID_STATE","invariant","CUSTOM_ERROR_FLAGS","NO_ERROR_FLAGS","pickFocusEventAttributes","pickInputEventAttributes","inheritAriaAttributes","h"],"sources":["src/components/input/input.css?tag=qds-input&encapsulation=shadow","src/components/input/input.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@-moz-document url-prefix() {\n  [type='date'],\n  [type='datetime-local'],\n  [type='month'],\n  [type='time'],\n  [type='week'] {\n    ~ .qds-icon-container {\n      display: none;\n    }\n  }\n}\n\n.qds-container,\n.qds-input {\n  max-width: inherit;\n  width: inherit;\n}\n\n.qds-container {\n  align-content: flex-start;\n  align-items: center;\n  box-sizing: border-box;\n  display: grid;\n  grid-template-areas: 'input';\n}\n\n.qds-icon {\n  --qds-theme-interactive-background-hover: none;\n  --qds-theme-interactive-background-pressed: none;\n  --qds-control-small-height: var(--qds-control-small-icon-size);\n\n  flex-shrink: 0;\n}\n\n.qds-input,\n.qds-icon-container {\n  grid-area: input;\n}\n\n.qds-icon-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  justify-self: end;\n  padding-inline-end: var(--qds-control-input-padding-horizontal);\n\n  &.no-padding {\n    padding-inline-end: 0;\n  }\n}\n\n.qds-focus-ring {\n  border-radius: max(\n      1px,\n      var(\n        --qds-control-border-radius-top-left,\n        var(--qds-control-border-radius)\n      )\n    )\n    max(\n      1px,\n      var(\n        --qds-control-border-radius-top-right,\n        var(--qds-control-border-radius)\n      )\n    )\n    max(\n      1px,\n      var(\n        --qds-control-border-radius-bottom-right,\n        var(--qds-control-border-radius)\n      )\n    )\n    max(\n      1px,\n      var(\n        --qds-control-border-radius-bottom-left,\n        var(--qds-control-border-radius)\n      )\n    );\n  grid-area: input;\n  isolation: isolate;\n  outline: var(--qds-control-input-focus-border-width) solid\n    var(--qds-theme-control-input-focus-border);\n  pointer-events: none;\n  visibility: hidden;\n  width: calc(\n    100% + var(--qds-control-border-width) -\n      var(\n        --qds-control-border-width-inline-end,\n        var(--qds-control-border-width)\n      )\n  );\n  height: calc(\n    100% + var(--qds-control-border-width) -\n      var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n  );\n}\n\n[data-size='small'] {\n  font: var(--qds-control-small-text);\n  height: var(--qds-control-small-height);\n\n  &.qds-icon {\n    --qds-experimental-icon-click-target-size: var(--qds-control-small-height);\n\n    width: var(--qds-control-small-icon-size);\n    height: var(--qds-control-small-icon-size);\n  }\n\n  & ~ .qds-icon-container {\n    gap: var(--qds-control-small-gap-internal);\n    margin-inline-start: var(--qds-control-small-gap-internal);\n  }\n\n  &.qds-password-padding,\n  &[type='date'],\n  &[type='datetime-local'],\n  &[type='email'],\n  &[type='month'],\n  &[type='time'],\n  &[type='url'],\n  &[type='tel'],\n  &[type='week'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-small-height)\n      );\n  }\n\n  &[type='file']::file-selector-button {\n    font: var(--qds-control-small-text);\n    height: var(--qds-control-small-height);\n    margin-inline-end: var(--qds-control-small-gap-siblings-related);\n    padding-inline: var(--qds-control-button-small-padding-horizontal);\n  }\n\n  &[type='number']::-webkit-inner-spin-button,\n  &[type='number']::-webkit-outer-spin-button {\n    margin-inline-start: var(--qds-control-small-gap-internal);\n  }\n\n  &[type='search'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-small-height) + var(--qds-control-small-icon-size) +\n          var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-small-gap-internal)\n      );\n  }\n}\n\n[data-size='standard'] {\n  font: var(--qds-control-standard-text);\n  height: var(--qds-control-standard-height);\n\n  &.qds-icon {\n    --qds-experimental-icon-click-target-size: var(\n      --qds-control-standard-height\n    );\n\n    width: var(--qds-control-standard-icon-size);\n    height: var(--qds-control-standard-icon-size);\n  }\n\n  & ~ .qds-icon-container {\n    gap: var(--qds-control-standard-gap-internal);\n    margin-inline-start: var(--qds-control-standard-gap-internal);\n  }\n\n  &.qds-password-padding,\n  &[type='date'],\n  &[type='datetime-local'],\n  &[type='email'],\n  &[type='month'],\n  &[type='time'],\n  &[type='url'],\n  &[type='tel'],\n  &[type='week'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-standard-height)\n      );\n  }\n\n  &[type='file']::file-selector-button {\n    font: var(--qds-control-standard-text);\n    height: var(--qds-control-standard-height);\n    margin-inline-end: var(--qds-control-standard-gap-siblings-related);\n    padding-inline: var(--qds-control-button-standard-padding-horizontal);\n  }\n\n  &[type='number']::-webkit-inner-spin-button,\n  &[type='number']::-webkit-outer-spin-button {\n    margin-inline-start: var(--qds-control-standard-gap-internal);\n  }\n\n  &[type='search'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-small-height) + var(--qds-control-standard-icon-size) +\n          var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-standard-gap-internal)\n      );\n  }\n}\n\n[data-size='large'] {\n  font: var(--qds-control-large-text);\n  height: var(--qds-control-large-height);\n\n  &.qds-icon {\n    --qds-experimental-icon-click-target-size: var(--qds-control-large-height);\n\n    width: var(--qds-control-large-icon-size);\n    height: var(--qds-control-large-icon-size);\n  }\n\n  & ~ .qds-icon-container {\n    gap: var(--qds-control-large-gap-internal);\n    margin-inline-start: var(--qds-control-large-gap-internal);\n  }\n\n  &.qds-password-padding,\n  &[type='date'],\n  &[type='datetime-local'],\n  &[type='email'],\n  &[type='month'],\n  &[type='time'],\n  &[type='url'],\n  &[type='tel'],\n  &[type='week'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-large-height)\n      );\n  }\n\n  &[type='file']::file-selector-button {\n    font: var(--qds-control-large-text);\n    height: var(--qds-control-large-height);\n    margin-inline-end: var(--qds-control-large-gap-siblings-related);\n    padding-inline: var(--qds-control-button-large-padding-horizontal);\n  }\n\n  &[type='number'] {\n    &::-webkit-inner-spin-button,\n    &::-webkit-outer-spin-button {\n      margin-inline-start: var(--qds-control-large-gap-internal);\n    }\n  }\n\n  &[type='search'] {\n    padding-inline: var(--qds-control-input-padding-horizontal)\n      calc(\n        var(--qds-control-small-height) + var(--qds-control-large-icon-size) +\n          var(--qds-control-input-padding-horizontal) +\n          var(--qds-control-large-gap-internal)\n      );\n  }\n}\n\n.qds-input {\n  appearance: textfield;\n  background-color: var(--qds-theme-control-input-background);\n  border-color: var(--qds-theme-control-border);\n  border-radius: var(\n      --qds-control-border-radius-top-left,\n      var(--qds-control-border-radius)\n    )\n    var(--qds-control-border-radius-top-right, var(--qds-control-border-radius))\n    var(\n      --qds-control-border-radius-bottom-right,\n      var(--qds-control-border-radius)\n    )\n    var(\n      --qds-control-border-radius-bottom-left,\n      var(--qds-control-border-radius)\n    );\n  border-style: solid;\n  border-width: var(--qds-control-border-width)\n    var(--qds-control-border-width-inline-end, var(--qds-control-border-width))\n    var(--qds-control-border-width-block-end, var(--qds-control-border-width))\n    var(--qds-control-border-width);\n  box-sizing: border-box;\n  color: var(--qds-theme-control-text-standard);\n  grid-area: input;\n  padding-block: 0;\n  padding-inline: var(--qds-control-input-padding-horizontal);\n\n  &.qds-hide ~ .qds-icon-container {\n    display: none;\n  }\n\n  &:disabled {\n    opacity: var(--qds-theme-disabled);\n    pointer-events: none;\n  }\n\n  &:focus-visible {\n    outline: none;\n\n    ~ .qds-focus-ring {\n      visibility: visible;\n    }\n  }\n\n  &:placeholder-shown {\n    color: var(--qds-theme-control-text-placeholder);\n  }\n\n  &:not(:focus):user-invalid {\n    border-color: var(--qds-theme-feedback-result-failure);\n  }\n\n  &:is(\n      [type='date'],\n      [type='datetime-local'],\n      [type='month'],\n      [type='time'],\n      [type='week']\n    )::-webkit-calendar-picker-indicator,\n  &::-webkit-search-cancel-button {\n    cursor: pointer;\n    display: none;\n  }\n\n  &[type='file'] {\n    padding-block: var(--qds-control-input-padding-horizontal);\n\n    &::file-selector-button {\n      background-color: transparent;\n      border: var(--qds-control-border-width) solid\n        var(--qds-theme-control-border);\n      border-radius: var(--qds-control-border-radius);\n      color: var(--qds-theme-control-text-standard);\n\n      &:hover {\n        background-color: var(--qds-theme-interactive-background-hover);\n      }\n\n      &:active {\n        background-color: var(--qds-theme-interactive-background-pressed);\n      }\n    }\n  }\n\n  &[type='color'],\n  &[type='number'] {\n    padding-inline: var(--qds-control-input-padding-horizontal);\n  }\n\n  &[type='color'] {\n    appearance: none;\n    min-width: 50px;\n    padding-block: var(--qds-control-input-padding-horizontal);\n\n    &::-webkit-color-swatch-wrapper {\n      padding: 0;\n    }\n\n    &::-webkit-color-swatch {\n      border: var(--qds-control-border-width) solid\n        var(--qds-theme-control-border);\n      border-radius: var(--qds-control-border-radius);\n    }\n\n    &::-moz-color-swatch {\n      border: var(--qds-control-border-width) solid\n        var(--qds-theme-control-border);\n      border-radius: var(--qds-control-border-radius);\n    }\n\n    cursor: pointer;\n\n    &:hover {\n      background-color: var(--qds-theme-interactive-background-hover);\n    }\n\n    &:active {\n      background-color: var(--qds-theme-interactive-background-pressed);\n    }\n  }\n\n  &[data-size='small'],\n  &[data-size='standard'],\n  &[data-size='large'] {\n    &.qds-search-padding {\n      padding-inline: var(--qds-control-input-padding-horizontal)\n        calc(\n          var(--qds-control-small-height) +\n            var(--qds-control-input-padding-horizontal)\n        );\n    }\n\n    &[type='file'] {\n      height: initial;\n    }\n\n    &.qds-padding {\n      padding-inline: var(--qds-control-input-padding-horizontal);\n    }\n\n    @-moz-document url-prefix() {\n      &[type='date'],\n      &[type='datetime-local'],\n      &[type='month'],\n      &[type='week'],\n      &[type='time'] {\n        padding-inline-end: var(--qds-control-input-padding-horizontal);\n      }\n    }\n  }\n\n  @-moz-document url-prefix() {\n    &[type='number'] {\n      appearance: none;\n    }\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 {\n  Attributes,\n  QdsFocusEventDetail,\n  QdsInputEventDetail,\n} from '../../helpers'\nimport {\n  inheritAriaAttributes,\n  invariant,\n  pickFocusEventAttributes,\n  pickInputEventAttributes,\n} from '../../helpers'\nimport type { AutoComplete, EnterKeyHint, InputMode, Value } from '../controls'\nimport { CUSTOM_ERROR_FLAGS, NO_ERROR_FLAGS, VALID_STATE } from '../controls'\nimport type { Size } from '../shared'\n\nexport type Capture = '' | 'environment' | 'user'\n\nexport type InputType =\n  | 'color'\n  | 'date'\n  | 'datetime-local'\n  | 'email'\n  | 'file'\n  | 'month'\n  | 'number'\n  | 'password'\n  | 'search'\n  | 'tel'\n  | 'text'\n  | 'time'\n  | 'url'\n  | 'week'\n\n/**\n * The `<qds-input>` element is used to create interactive controls for\n * web-based forms in order to accept data from the user; a wide variety of\n * types of input data and control widgets are available, depending on the\n * device and\n * [user agent](https://developer.mozilla.org/docs/Glossary/User_agent).\n *\n * @see https://quartz.se.com/build/components/input\n */\n@Component({\n  tag: 'qds-input',\n  formAssociated: true,\n  shadow: { delegatesFocus: true },\n  styleUrl: 'input.css',\n})\nexport class Input implements ComponentInterface {\n  /**\n   * Hide the input type's icon.\n   *\n   * > **_NOTE:_** Due to browser limitations, the icon may not be hidden in\n   * all browsers.\n   */\n  @Prop() public readonly noIcon?: boolean = false\n\n  /**\n   * The input's size.\n   *\n   * > **_NOTE:_** The native [`size` HTML attribute][size] is not supported.\n   * CSS `width` should be used instead if this functionality is needed.\n   *\n   * [size]: https://developer.mozilla.org/docs/Web/HTML/Attributes/size\n   */\n  @Prop() public readonly size?: Size = 'standard'\n\n  /**\n   * Defines the file types the `file` type input should accept. This is a\n   * comma-separated list of [unique file type specifiers][]. Because a given\n   * file type may be identified in more than one manner, it's useful to\n   * provide a thorough set of type specifiers when you files of a given format\n   * are needed.\n   *\n   * For instance, there are a number of ways Microsoft Word files can be\n   * identified, so a site that accepts Word files might use a `<qds-input>`\n   * like this:\n   *\n   * @example\n   * <qds-input\n   *   type=\"file\"\n   *   accept=\".doc,.docx,.xml,application/msword,application/vnd.openxmlformats-officedocument.wordprocessingml.document\"\n   * ></qds-input>\n   *\n   * [unique file type specifiers]: https://developer.mozilla.org/docs/Web/HTML/Element/input/file#unique_file_type_specifiers\n   *\n   * @webnative\n   */\n  @Prop() public readonly accept?: string\n\n  /**\n   * Provides a hint for a [user agent's][] autocomplete feature. See\n   * [the HTML `autocomplete` attribute][autocomplete] for a complete list of\n   * values and details on how to use `autoComplete`.\n   *\n   * [user agent's]: https://developer.mozilla.org/docs/Glossary/User_agent\n   * [autocomplete]: https://developer.mozilla.org/docs/Web/HTML/Attributes/autocomplete\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'autocomplete' })\n  public readonly autoComplete?: AutoComplete\n\n  /**\n   * Specifies that a new file should be captured and which device should be\n   * used to capture that new media of the type defined by `accept`.\n   *\n   * Values include `user`, `environment`, and `''`:\n   *\n   * - `user`: The user-facing camera and/or microphone should be used.\n   * - `environment`: The outward-facing camera and/or microphone should be\n   * used.\n   * - `''`: The implementation-specific capture state.\n   *\n   * @webnative\n   */\n  @Prop() public readonly capture?: Capture\n\n  /**\n   * Prevents the input from being interacted with: it cannot be pressed or\n   * focused.\n   *\n   * @webnative\n   */\n  @Prop() public readonly disabled?: boolean\n\n  /**\n   * What action label (or icon) to present for the enter key on virtual\n   * keyboards. Possible values:\n   *\n   * - `\"done\"`: Typically meaning there is nothing more to input and the input\n   * method editor (IME) will be closed.\n   * - `\"enter\"`:\tTypically inserting a new line.\n   * - `\"go\"`: \tTypically meaning to take the user to the target of the text\n   * they typed.\n   * - `\"next\"`: \tTypically taking the user to the next field that will accept\n   * text.\n   * - `\"previous\"`: Typically taking the user to the previous field that will\n   * accept text.\n   * - `\"search\"`: Typically taking the user to the results of searching for\n   * the text they have typed.\n   * - `\"send\"`: Typically delivering the text to its target.\n   *\n   * @webnative\n   */\n  // FIXME: Can't use `attribute` option here to name this `enterKeyHint` instead.\n  @Prop() public readonly enterkeyhint?: EnterKeyHint\n\n  /**\n   * Returns a file list for a `file` type input.\n   *\n   * @readonly\n   * @webnative\n   */\n  // eslint-disable-next-line unicorn/no-null\n  @Prop() public readonly files: HTMLInputElement['files'] = null\n\n  /**\n   * The [`<form>`][] element to associate the input 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-input>` is associated\n   * with its ancestor `<form>` element, if any.\n   *\n   * This attribute lets you associate `<qds-input>` 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   * Provide a hint to browsers as to the type of virtual keyboard\n   * configuration to use when editing this element or its contents.\n   *\n   * @webnative\n   */\n  // FIXME: Can't use `attribute` option here to name this `inputMode` instead.\n  @Prop() public readonly inputmode?: InputMode\n\n  /**\n   * Returns a list of the [`<label>`][] elements associated with the\n   * `qds-input` 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   * Defines the greatest value in the range of permitted values. If the\n   * `value` entered into the input exceeds this, the input fails\n   * [constraint validation][]. Only valid for `date`, `datetime-local`,\n   * `month`, `time`, and `week` inputs.\n   *\n   * If this value isn't a valid number, then the input has no maximum value.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   *\n   * @webnative\n   */\n  @Prop() public readonly max?: number | string\n\n  /**\n   * The maximum number of characters (as UTF-16 code units) the user can enter\n   * into the input. This must be an non-negative integer value. If no\n   * `maxlength` is specified, or an invalid value is specified, the input has\n   * no maximum length. Only valid for `email`, `password`, `search`, `tel`,\n   * `text`, and `url` inputs.\n   *\n   * The input will fail [constraint validation][] if the length of the text\n   * entered into the field is greater than `maxlength` UTF-16 code units long.\n   * By default, browsers prevent users from entering more characters than\n   * allowed by the `maxlength` attribute. See [Client-side validation][] for\n   * more information.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'maxlength' }) public readonly maxLength?: number\n\n  /**\n   * Defines the most negative value in the range of permitted values. If the\n   * `value` entered into the input is less than this, the input fails\n   * [constraint validation][]. Only valid for `date`, `datetime-local`,\n   * `month`, `time`, and `week` inputs.\n   *\n   * This value must be less than or equal to the value of the `max` attribute.\n   * If this value isn't a valid number, then the input has no minimum value.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   *\n   * @webnative\n   */\n  @Prop() public readonly min?: number | string\n\n  /**\n   * The minimum number of characters (as UTF-16 code units) the user can enter\n   * into the input. This must be an non-negative integer value smaller than or\n   * equal to the value specified by `maxlength`. If no `minlength` is\n   * specified, or an invalid value is specified, the input has no minimum\n   * length. Only valid for `email`, `password`, `search`, `tel`, `text`, and\n   * `url` inputs.\n   *\n   * The input will fail [constraint validation][] if the length of the text\n   * entered into the field is fewer than `minlength` UTF-16 code units long,\n   * preventing form submission. See [Client-side validation][] for more\n   * information.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   *\n   * @webnative\n   */\n  @Prop({ attribute: 'minlength' }) public readonly minLength?: number\n\n  /**\n   * For `email` inputs, specifies if multiple comma-separated email addresses\n   * can be entered. For `file` inputs, specifies if the user is allowed to\n   * select more than one file.\n   *\n   * Only valid for `email` or `file` inputs.\n   *\n   * @webnative\n   */\n  @Prop() public readonly multiple?: boolean\n\n  /**\n   * The name of the input, which is submitted with the form data.\n   *\n   * @webnative\n   */\n  @Prop() public readonly name?: string\n\n  /**\n   * Defines a regular expression that the input's `value` must match in order\n   * for the value to pass [constraint validation][]. It must be a valid\n   * JavaScript regular expression, as used by the [`RegExp`][] type, and as\n   * documented in MDN's [guide on regular expressions][]; the `'u'` flag is\n   * specified when compiling the regular expression, so that the pattern is\n   * treated as a sequence of Unicode code points, instead of as ASCII. No\n   * forward slashes should be specified around the pattern text. Only valid\n   * for `email`, `password`, `search`, `tel`, `text`, and `url` inputs.\n   *\n   * If the `pattern` is invalid, no regular expression is applied and this\n   * property is ignored. If the pattern is valid and a non-empty value does\n   * not match the pattern, constraint validation will prevent form submission.\n   *\n   * [constraint validation]: https://developer.mozilla.org/docs/Web/Guide/HTML/Constraint_validation\n   * [`RegExp`]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/RegExp\n   * [guide on regular expressions]: https://developer.mozilla.org/docs/Web/JavaScript/Guide/Regular_Expressions\n   *\n   * @webnative\n   */\n  @Prop() public readonly pattern?: string\n\n  /**\n   * Text that appears in the input when it has no value set. Only valid for\n   * `email`, `number`, `password`, `search`, `tel`, `text`, and `url` inputs.\n   *\n   * @webnative\n   */\n  @Prop() public readonly placeholder?: string\n\n  /**\n   * A value must be specified for the input before the owning form can be\n   * submitted. Not valid for `color` inputs.\n   *\n   * See [Client-side validation][] and the\n   * [HTML attribute: `required`][required] for more information.\n   *\n   * [Client-side validation]: https://developer.mozilla.org/docs/Web/HTML/Element/input#client-side_validation\n   * [required]: https://developer.mozilla.org/docs/Web/HTML/Attributes/required\n   *\n   * @webnative\n   */\n  @Prop() public readonly required?: boolean\n\n  /**\n   * Get or set the selection direction of a text selection.\n   *\n   * > **_NOTE:_** This property has no effect when used as an attribute.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true })\n  // eslint-disable-next-line unicorn/no-null\n  public selectionDirection: HTMLInputElement['selectionDirection'] = null\n\n  /**\n   * Get or set the ending position or offset of a text selection.\n   *\n   * > **_NOTE:_** This property has no effect when used as an attribute.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true })\n  // eslint-disable-next-line unicorn/no-null\n  public selectionEnd: HTMLInputElement['selectionEnd'] = null\n\n  /**\n   * Get or set the starting position or offset of a text selection.\n   *\n   * > **_NOTE:_** This property has no effect when used as an attribute.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true })\n  // eslint-disable-next-line unicorn/no-null\n  public selectionStart: HTMLInputElement['selectionStart'] = null\n\n  /**\n   * Specifies the granularity that the `value` must adhere to. Only valid for\n   * `date`, `datetime-local`, `month`, `number`, `time`, and `week` inputs.\n   *\n   * The value must be a positive number—integer or float—or the special value\n   * `any`, which means no stepping is implied, and any value is allowed\n   * (barring other constraints, such as `min` and `max`).\n   *\n   * If `any` is not explicitly set, valid values for the `number` are the\n   * basis for stepping — the `min` value and increments of the step value, up\n   * to the `max` value, if specified.\n   *\n   * @webnative\n   */\n  @Prop() public readonly step?: number | 'any'\n\n  /**\n   * The type of input to render:\n   *\n   * - `\"date\"`: An input for entering a date (year, month, and day, with no\n   * time). Opens a date picker or numeric wheels for year, month, day when\n   * active in supporting browsers.\n   * - `\"datetime-local\"`: An input for entering a date and time, with no time\n   * zone. Opens a date picker or numeric wheels for date and time components\n   * when active in supporting browsers.\n   * - `\"email\"`: An input for editing an email address. Looks like a `\"text\"`\n   * input, but has validation parameters and relevant keyboard in supporting\n   * browsers and devices with dynamic keyboards.\n   * - `\"month\"`: An input for entering a month and year, with no time zone.\n   * - `\"number\"`: An input for entering a number. Displays a spinner and adds\n   * default validation when supported. Displays a numeric keypad in some\n   * devices with dynamic keypads.\n   * - `\"password\"`: A single-line text input whose value is obscured. Will\n   * alert user if site is not secure.\n   * - `\"search\"`: A single-line text input for entering search strings.\n   * Line-breaks are automatically removed from the input value. May include a\n   * delete icon in supporting browsers that can be used to clear the input.\n   * Displays a search icon instead of enter key on some devices with dynamic\n   * keypads.\n   * - `\"tel\"`: An input for entering a telephone number. Displays a telephone\n   * keypad in some devices with dynamic keypads.\n   * - `\"text\"`: A single-line text input. Line-breaks are automatically\n   * removed from the input value.\n   * - `\"time\"`: An input for entering a time value with no time zone.\n   * - `\"url\"`: An input for entering a URL. Looks like a `\"text\"` input, but\n   * has validation parameters and relevant keyboard in supporting browsers and\n   * devices with dynamic keyboards.\n   * - `\"week\"`: An input for entering a date consisting of a week-year number\n   * and a week number with no time zone.\n   *\n   * @webnative\n   */\n  @Prop() public readonly type?: InputType\n\n  /**\n   * The error message that would be shown to the user if the `<qds-input>`\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-input>`.\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 input.\n   *\n   * @webnative\n   */\n  @Prop({ mutable: true }) public value?: Value\n\n  /**\n   * True if `<qds-input>` will be validated when the form is submitted; false\n   * 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 input loses focus.\n   */\n  @Event({ eventName: 'qdsBlur', bubbles: false, cancelable: false })\n  private readonly blurEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when the user cancels the file picker via the <kbd>Esc</kbd> key\n   * or the cancel button and when the user re-selects the same files that were\n   * previously selected.\n   */\n  @Event({ eventName: 'qdsCancel', cancelable: false })\n  private readonly cancelEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when an alteration to the input's value is committed by the user.\n   */\n  @Event({ eventName: 'qdsChange', cancelable: false })\n  private readonly changeEmitter!: EventEmitter<void>\n\n  /**\n   * Emitted when the input gains focus.\n   */\n  @Event({ eventName: 'qdsFocus', bubbles: false, cancelable: false })\n  private readonly focusEmitter!: EventEmitter<QdsFocusEventDetail>\n\n  /**\n   * Emitted when the input's value changes.\n   */\n  @Event({ eventName: 'qdsInput', cancelable: false })\n  private readonly inputEmitter!: EventEmitter<QdsInputEventDetail>\n\n  @Element() private readonly host!: HTMLElement\n\n  @State() private tabIndex?: number\n\n  @State() private isPasswordVisible = false\n\n  #inheritedAttributes: Attributes = {}\n\n  #input?: HTMLInputElement\n\n  get #computedDisabled(): boolean {\n    return this.host.matches(':disabled') || (this.disabled ?? false)\n  }\n\n  get #computedIconName():\n    | `input-${InputType}`\n    | `input-password-hide`\n    | `input-password-show`\n    | undefined {\n    if (this.type === 'password')\n      return this.isPasswordVisible\n        ? 'input-password-hide'\n        : 'input-password-show'\n\n    switch (this.type) {\n      case 'date':\n      case 'datetime-local':\n      case 'email':\n      case 'month':\n      case 'search':\n      case 'tel':\n      case 'time':\n      case 'url':\n      case 'week': {\n        return `input-${this.type}`\n      }\n      default: {\n        return undefined\n      }\n    }\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(): Parameters<ElementInternals['setFormValue']>[0] {\n    if (typeof this.value === 'number') return this.value.toString()\n    // eslint-disable-next-line unicorn/no-null\n    return this.value === undefined ? null : this.value\n  }\n\n  get #hasIcon(): boolean {\n    return (\n      typeof this.type === 'string' &&\n      ['email', 'tel', 'url'].includes(this.type)\n    )\n  }\n\n  get #hasInteractiveIcon(): boolean {\n    return (\n      typeof this.type === 'string' &&\n      ['month', 'time', 'date', 'datetime-local', 'week', 'password'].includes(\n        this.type,\n      )\n    )\n  }\n\n  get #iconClickHandler(): () => void {\n    return this.type === 'password'\n      ? this.#togglePasswordVisibility\n      : this.showPicker\n  }\n\n  get #computedType(): InputType {\n    return this.type === 'password' && this.isPasswordVisible\n      ? 'text'\n      : (this.type ?? 'text')\n  }\n\n  get #computedAriaLabel(): string {\n    return this.type === 'password'\n      ? this.isPasswordVisible\n        ? 'Hide password'\n        : 'Show password'\n      : (this.type ?? '')\n  }\n\n  @Listen('click')\n  protected onClick(event: MouseEvent): void {\n    if (this.#computedDisabled) event.stopImmediatePropagation()\n  }\n\n  @Listen('keydown')\n  protected onKeydown(event: KeyboardEvent): void {\n    if (this.#computedDisabled) {\n      event.stopImmediatePropagation()\n      return\n    }\n\n    if (event.key === 'Enter' && this.internals.form) {\n      this.internals.form.requestSubmit()\n      event.preventDefault()\n    }\n  }\n\n  @Watch('disabled')\n  protected disabledChanged(): void {\n    if (this.#computedDisabled)\n      // eslint-disable-next-line unicorn/no-null\n      this.internals.setFormValue(null)\n    else this.internals.setFormValue(this.#computedValue)\n  }\n\n  @Watch('selectionDirection')\n  protected selectionDirectionChanged(): void {\n    invariant(this.#input)\n\n    this.#input.selectionDirection = this.selectionDirection\n  }\n\n  @Watch('selectionEnd')\n  protected selectionEndChanged(): void {\n    invariant(this.#input)\n\n    this.#input.selectionEnd = this.selectionEnd\n  }\n\n  @Watch('selectionStart')\n  protected selectionStartChanged(): void {\n    invariant(this.#input)\n\n    this.#input.selectionStart = this.selectionStart\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('max')\n  @Watch('maxLength')\n  @Watch('min')\n  @Watch('minLength')\n  @Watch('pattern')\n  @Watch('required')\n  @Watch('step')\n  @Watch('type')\n  @Watch('value')\n  protected validationChanged(): void {\n    if (!this.#input) return\n\n    if (this.#input.max !== this.max && this.max !== undefined)\n      this.#input.max = this.max.toString()\n    if (this.maxLength !== undefined) this.#input.maxLength = this.maxLength\n    if (this.#input.min !== this.min && this.min !== undefined)\n      this.#input.min = this.min.toString()\n    if (this.minLength !== undefined) this.#input.minLength = this.minLength\n    if (this.pattern !== undefined) this.#input.pattern = this.pattern\n    this.#input.required = this.required ?? false\n    if (this.#input.step !== this.step && this.step !== undefined)\n      this.#input.step = this.step.toString()\n    this.#input.type = this.#computedType\n\n    // eslint-disable-next-line unicorn/no-null\n    if (this.type !== 'file' && this.value != null)\n      this.#input.value = this.value.toString()\n\n    const { valid } = this.#input.validity\n    if (valid)\n      this.internals.setValidity(NO_ERROR_FLAGS, undefined, this.#input)\n    else\n      this.internals.setValidity(\n        this.#input.validity,\n        this.#input.validationMessage,\n        this.#input,\n      )\n  }\n\n  @Watch('value')\n  protected valueChanged(): void {\n    if (!this.#computedDisabled)\n      this.internals.setFormValue(this.#computedValue)\n\n    if (\n      (this.#computedValue === null || this.#computedValue === '') &&\n      this.type === 'file'\n    ) {\n      this.#clearValue()\n    }\n  }\n\n  public componentWillLoad(): void {\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    this.#defineGetter('files', this.#getFiles)\n    this.#defineGetter('labels', () => this.internals.labels)\n\n    this.#inheritedAttributes = inheritAriaAttributes(this.host)\n    this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0')\n  }\n\n  public componentDidLoad(): void {\n    invariant(this.#input)\n\n    this.validationChanged()\n    this.valueChanged()\n    // FIXME: This event is supported by the native `<input>` element but not\n    // recognized by Stencil's type definitions, so it needs to be manually\n    // bound here.\n    this.#input.addEventListener('cancel', this.#onCancel)\n  }\n\n  public disconnectedCallback(): void {\n    if (this.#input) this.#input.removeEventListener('cancel', this.#onCancel)\n  }\n\n  public render() {\n    const hasValue =\n      this.value !== null && this.value !== undefined && this.value !== ''\n    const isSearchType = this.type === 'search'\n    const shouldShowClearButton = isSearchType && hasValue\n    const shouldShowSearchIcon = isSearchType && this.noIcon === false\n    const shouldHideIcon = !isSearchType && this.noIcon === true\n    const shouldRemoveSearchPadding = isSearchType && this.noIcon === true\n\n    return (\n      <div class=\"qds-container\">\n        <input\n          accept={this.accept}\n          autoCapitalize={this.host.autocapitalize}\n          autoComplete={this.autoComplete}\n          // eslint-disable-next-line jsx-a11y/no-autofocus\n          autoFocus={this.host.autofocus}\n          capture={this.capture}\n          class={{\n            'qds-search-padding': shouldRemoveSearchPadding,\n            'qds-input': true,\n            'qds-hide': shouldHideIcon,\n            'qds-padding': shouldHideIcon,\n            'qds-password-padding':\n              this.type === 'password' ||\n              (this.isPasswordVisible && this.type === 'text'),\n          }}\n          data-size={this.#computedSize}\n          disabled={this.disabled}\n          enterKeyHint={this.enterkeyhint}\n          inputMode={this.inputmode}\n          max={this.max}\n          maxLength={this.maxLength}\n          min={this.min}\n          minLength={this.minLength}\n          multiple={this.multiple}\n          onBlur={this.#onBlur}\n          onChange={this.#onChange}\n          onFocus={this.#onFocus}\n          onInput={this.#onInput}\n          placeholder={this.placeholder}\n          ref={this.#ref}\n          spellcheck={this.host.spellcheck}\n          step={this.step}\n          tabIndex={this.#computedDisabled ? undefined : this.tabIndex}\n          type={this.#computedType}\n          // eslint-disable-next-line react/jsx-props-no-spreading\n          {...this.#inheritedAttributes}\n        />\n        <div class=\"qds-focus-ring\" />\n        {this.#computedIconName && (\n          <div\n            class={{\n              'qds-icon-container': true,\n              'no-padding': shouldRemoveSearchPadding,\n            }}\n          >\n            {shouldShowClearButton && (\n              <qds-button\n                class={{\n                  'qds-icon': true,\n                  'qds-hide': !hasValue,\n                }}\n                disabled={this.disabled}\n                iconLibrary=\"core\"\n                iconName=\"clear\"\n                iconOnly\n                importance=\"subdued\"\n                onClick={this.#onClear}\n                size=\"small\"\n                text=\"clear input\"\n              />\n            )}\n            {this.#hasIcon && (\n              <qds-icon\n                aria-hidden=\"true\"\n                class=\"qds-icon\"\n                data-size={this.#computedSize}\n                library=\"core\"\n                name={this.#computedIconName}\n              />\n            )}\n            {this.#hasInteractiveIcon && (\n              <qds-button\n                class=\"qds-icon\"\n                disabled={this.disabled}\n                iconLibrary=\"core\"\n                iconName={this.#computedIconName}\n                iconOnly\n                importance=\"subdued\"\n                onClick={this.#iconClickHandler}\n                size=\"small\"\n                text={this.#computedAriaLabel}\n              />\n            )}\n            {shouldShowSearchIcon ? (\n              <qds-icon\n                aria-hidden=\"true\"\n                class=\"qds-icon\"\n                data-size={this.#computedSize}\n                library=\"core\"\n                name={this.#computedIconName}\n              />\n            ) : (\n              <div />\n            )}\n          </div>\n        )}\n      </div>\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    invariant(this.#input)\n\n    this.#input.setCustomValidity(error)\n    if (error)\n      this.internals.setValidity(CUSTOM_ERROR_FLAGS, error, this.#input)\n    else this.internals.setValidity(NO_ERROR_FLAGS)\n  }\n\n  public select: HTMLInputElement['select'] = () => {\n    invariant(this.#input)\n\n    this.#input.select()\n  }\n\n  public getSelectionDirection: () => HTMLInputElement['selectionDirection'] =\n    () => {\n      invariant(this.#input)\n\n      return this.#input.selectionDirection\n    }\n\n  public getSelectionStart: () => HTMLInputElement['selectionStart'] = () => {\n    invariant(this.#input)\n\n    return this.#input.selectionStart\n  }\n\n  public getSelectionEnd: () => HTMLInputElement['selectionEnd'] = () => {\n    invariant(this.#input)\n\n    return this.#input.selectionEnd\n  }\n\n  public setRangeText = (\n    replacement: string,\n    start: number,\n    end: number,\n    selectionMode?: SelectionMode,\n  ): void => {\n    invariant(this.#input)\n\n    this.#input.setRangeText(replacement, start, end, selectionMode)\n\n    if (this.value !== this.#input.value) {\n      this.value = this.#input.value\n      this.inputEmitter.emit()\n      this.changeEmitter.emit()\n    }\n  }\n\n  public setSelectionRange: HTMLInputElement['setSelectionRange'] = (\n    start,\n    end,\n    direction,\n  ) => {\n    invariant(this.#input)\n\n    this.#input.setSelectionRange(start, end, direction)\n  }\n\n  public stepDown: HTMLInputElement['stepDown'] = (n) => {\n    invariant(this.#input)\n\n    this.#input.stepDown(n)\n  }\n\n  public stepUp: HTMLInputElement['stepUp'] = (n) => {\n    invariant(this.#input)\n\n    this.#input.stepUp(n)\n  }\n\n  public showPicker: HTMLInputElement['showPicker'] = () => {\n    invariant(this.#input)\n\n    this.#input.showPicker()\n  }\n\n  readonly #togglePasswordVisibility = (): void => {\n    invariant(this.#input)\n    this.isPasswordVisible = !this.isPasswordVisible\n\n    this.#input.type = this.#computedType\n  }\n\n  readonly #ref = (input?: HTMLInputElement): void => {\n    this.#input = input\n  }\n\n  readonly #getFiles: () => HTMLInputElement['files'] = () => {\n    invariant(this.#input)\n\n    return this.#input.files\n  }\n\n  readonly #onBlur = (event: FocusEvent): void => {\n    this.blurEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  readonly #onCancel = (): void => {\n    this.cancelEmitter.emit()\n  }\n\n  readonly #onChange = (): void => {\n    this.changeEmitter.emit()\n  }\n\n  readonly #onClear = (): void => {\n    this.#clearValue()\n    this.#onInput(new InputEvent('input', { inputType: 'deleteContent' }))\n  }\n\n  readonly #onFocus = (event: FocusEvent): void => {\n    this.focusEmitter.emit(pickFocusEventAttributes(event))\n  }\n\n  readonly #onInput = (event: InputEvent): void => {\n    invariant(this.#input)\n\n    this.value = this.#input.value\n    this.inputEmitter.emit(pickInputEventAttributes(event))\n  }\n\n  #defineGetter(p: PropertyKey, get: () => unknown): void {\n    Object.defineProperty(this.host, p, { enumerable: true, get })\n  }\n\n  #clearValue(): void {\n    invariant(this.#input)\n\n    this.#input.value = ''\n  }\n}\n"],"version":3}

package/dist/cjs/qds-label.cjs.entry.js

@@ -90,12 +90,12 @@ const Label = class {
             __classPrivateFieldGet(this, _Label_ro, "f").disconnect();
     }
     render() {
-        return (index.h("span", { key: 'bd56de0869e706f0b028e0fb03e0cc946cbbf1fd', class: {
+        return (index.h("span", { key: 'f5fb8edbdad01bf57ba88b2e65c240d9512d63ff', class: {
                 'qds-inline': this.inline,
                 'qds-label': true,
             }, "data-size": __classPrivateFieldGet(this, _Label_instances, "a", _Label_computedSize_get), ref: __classPrivateFieldGet(this, _Label_labelRef, "f"),
             // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
-            tabIndex: this.tooltip ? 0 : undefined }, this.required && index.h("span", { key: '9df743ea0b47028f9ae6951d88d2d353fd813a4b', class: "qds-required" }, "*"), index.h("span", { key: '680c6840424a63e6533230e249ec3b10ac5b0ab7', class: "qds-text", ref: __classPrivateFieldGet(this, _Label_spanRef, "f") }, this.text), this.tooltip && (index.h("qds-tooltip", { key: '6ec7e5624a50e5d9084580dcd40359fb88d9b8ff', "aria-hidden": "true", ref: __classPrivateFieldGet(this, _Label_tooltipRef, "f") }, this.text))));
+            tabIndex: this.tooltip ? 0 : undefined }, this.required && index.h("span", { key: '3dd4a66af8b2e1e8ce32d98427ffab9973e23387', class: "qds-required" }, "*"), index.h("span", { key: 'a5a06d788520604f85bb2868579f2b985eb82d79', class: "qds-text", ref: __classPrivateFieldGet(this, _Label_spanRef, "f") }, this.text), this.tooltip && (index.h("qds-tooltip", { key: '29e5a9dd29895c775dd77d31d47893e8c7e5cdf6', "aria-hidden": "true", ref: __classPrivateFieldGet(this, _Label_tooltipRef, "f") }, this.text))));
     }
     static get watchers() { return {
         "text": ["textChanged"]

package/dist/cjs/qds-loader.cjs.entry.js

@@ -9,7 +9,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-dbcccf98.js');
 
-const loaderCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-loader{border-radius:var(--qds-control-rounded-border-radius);box-sizing:border-box;color:var(--qds-theme-feedback-action-destructive-contrast)}[data-size=small]{height:var(--qds-control-small-icon-size);padding:var(--qds-signature-circle-progress-small-border-width);width:var(--qds-control-small-icon-size)}[data-size=standard]{height:var(--qds-control-standard-icon-size);padding:var(--qds-signature-circle-progress-standard-border-width);width:var(--qds-control-standard-icon-size)}[data-size=large]{height:var(--qds-control-large-icon-size);padding:var(--qds-signature-circle-progress-large-border-width);width:var(--qds-control-large-icon-size)}[data-size=jumbo]{height:var(--qds-control-jumbo-icon-size);padding:var(--qds-signature-circle-progress-jumbo-border-width);width:var(--qds-control-jumbo-icon-size)}[data-status=loading]{animation:b 1s linear infinite;background-image:var(--qds-theme-signature-circle-progress-indeterminate);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}@keyframes b{to{transform:rotate(1turn)}}[data-status=success]{background-color:var(--qds-theme-feedback-result-success)}[data-status=warning]{background-color:var(--qds-theme-feedback-result-partial-success)}[data-status=error]{background-color:var(--qds-theme-feedback-result-failure)}";
+const loaderCss = ":host([hidden]){display:none!important}:host{display:inline-block}.qds-loader{border-radius:var(--qds-control-rounded-border-radius);box-sizing:border-box;color:var(--qds-theme-feedback-action-destructive-contrast)}[data-size=small]{height:var(--qds-control-small-icon-size);padding:var(--qds-signature-circle-progress-small-border-width);width:var(--qds-control-small-icon-size)}[data-size=standard]{height:var(--qds-control-standard-icon-size);padding:var(--qds-signature-circle-progress-standard-border-width);width:var(--qds-control-standard-icon-size)}[data-size=large]{height:var(--qds-control-large-icon-size);padding:var(--qds-signature-circle-progress-large-border-width);width:var(--qds-control-large-icon-size)}[data-size=jumbo]{height:var(--qds-control-jumbo-icon-size);padding:var(--qds-signature-circle-progress-jumbo-border-width);width:var(--qds-control-jumbo-icon-size)}[data-status=loading]{animation:a 1s linear infinite;background-image:var(--qds-theme-signature-circle-progress-indeterminate);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}@keyframes a{to{transform:rotate(1turn)}}[data-status=success]{background-color:var(--qds-theme-feedback-result-success)}[data-status=warning]{background-color:var(--qds-theme-feedback-result-partial-success)}[data-status=error]{background-color:var(--qds-theme-feedback-result-failure)}";
 const QdsLoaderStyle0 = loaderCss;
 
 // SPDX-FileCopyrightText: © 2024 Schneider Electric

package/dist/cjs/qds-nav-list-item.cjs.entry.js

@@ -85,14 +85,14 @@ const NavListItem = class {
         this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
     }
     render() {
-        return (index.h(index.Host, { key: '861bd4dceb564cea7ef0deb6f3968a967f4a8ecd' }, index.h("li", { key: '85fb0ded3ffe45b3b492b5d46c07e9a72589fc81', class: {
+        return (index.h(index.Host, { key: '006cf68fe006a91e9fa9825b7ca6ac261a2b0e67' }, index.h("li", { key: '01c62416356d930647f8288093e02da43f930546', class: {
                 'qds-nav-list-item': true,
                 'qds-disabled': this.disabled,
                 'qds-selected': this.selected,
-            }, ref: __classPrivateFieldGet(this, _NavListItem_liRef, "f"), ...this.inheritedAttributes }, index.h("button", { key: '7c105a685c879cb014cc0cfd514bfdf1c5a86888', class: {
+            }, ref: __classPrivateFieldGet(this, _NavListItem_liRef, "f"), ...this.inheritedAttributes }, index.h("button", { key: '6c18869f8406acada5df0671a4659f3a98818263', class: {
                 'qds-button': true,
                 'qds-selected': this.selected,
-            }, "data-size": __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_computedSize_get), disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _NavListItem_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _NavListItem_onFocus, "f"), tabIndex: this.disabled ? undefined : this.tabIndex, type: "button" }, this.iconName !== undefined && this.iconName !== '' && (index.h("qds-icon", { key: '2c0a4554e721bb64bb59af6aeb3f4e6efa1362b7', "aria-hidden": "true", class: "qds-icon", library: this.iconLibrary, name: this.iconName })), !__classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && this.renderText())), __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && (index.h("qds-tooltip", { key: 'ec28ae83b18c2f6702e04331b09603085c77651b', placement: "right", ref: __classPrivateFieldGet(this, _NavListItem_tooltipRef, "f") }, this.renderText()))));
+            }, "data-size": __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_computedSize_get), disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _NavListItem_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _NavListItem_onFocus, "f"), tabIndex: this.disabled ? undefined : this.tabIndex, type: "button" }, this.iconName !== undefined && this.iconName !== '' && (index.h("qds-icon", { key: '8c170fe47e59694f5eae44b882af4c7d369210b0', "aria-hidden": "true", class: "qds-icon", library: this.iconLibrary, name: this.iconName })), !__classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && this.renderText())), __classPrivateFieldGet(this, _NavListItem_instances, "a", _NavListItem_shouldCollapse_get) && this.text && (index.h("qds-tooltip", { key: '5034361f0dd57130bc4db859e8275e1ace64a1fa', placement: "right", ref: __classPrivateFieldGet(this, _NavListItem_tooltipRef, "f") }, this.renderText()))));
     }
     renderText() {
         return (index.h("div", { class: "qds-texts" }, index.h("div", { class: "qds-text" }, this.text), this.subtext !== undefined && this.subtext !== '' && (index.h("div", { class: "qds-subtext" }, this.subtext))));

package/dist/cjs/qds-progress-bar.cjs.entry.js

@@ -9,7 +9,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-dbcccf98.js');
 
-const progressBarCss = ":host([hidden]){display:none!important}:host{display:block;width:100%}.qds-bar,.qds-track{overflow:hidden}.qds-track{background-color:var(--qds-theme-control-slider-track-inactive)}.qds-bar,.qds-track{border-radius:var(--qds-signature-line-progress-cap-radius)}.qds-bar{background-color:var(--qds-theme-signature-line-progress-determinate);transition:width .6s cubic-bezier(.83,0,.17,1)}@media (prefers-reduced-motion){.qds-bar{transition:none}}.qds-indeterminate{animation:a 2s linear infinite;background-color:initial;background-image:var(--qds-theme-signature-line-progress-indeterminate)}@keyframes a{0%{transform:translateX(-100%)}to{transform:translateX(200%)}}[data-size=small]{height:var(--qds-signature-line-progress-small-height)}[data-size=standard]{height:var(--qds-signature-line-progress-standard-height)}[data-size=large]{height:var(--qds-signature-line-progress-large-height)}";
+const progressBarCss = ":host([hidden]){display:none!important}:host{display:block;width:100%}.qds-bar,.qds-track{overflow:hidden}.qds-track{background-color:var(--qds-theme-control-slider-track-inactive)}.qds-bar,.qds-track{border-radius:var(--qds-signature-line-progress-cap-radius)}.qds-bar{background-color:var(--qds-theme-signature-line-progress-determinate);transition:width .6s cubic-bezier(.83,0,.17,1)}@media (prefers-reduced-motion){.qds-bar{transition:none}}.qds-indeterminate{animation:b 2s linear infinite;background-color:initial;background-image:var(--qds-theme-signature-line-progress-indeterminate)}@keyframes b{0%{transform:translateX(-100%)}to{transform:translateX(200%)}}[data-size=small]{height:var(--qds-signature-line-progress-small-height)}[data-size=standard]{height:var(--qds-signature-line-progress-standard-height)}[data-size=large]{height:var(--qds-signature-line-progress-large-height)}";
 const QdsProgressBarStyle0 = progressBarCss;
 
 // SPDX-FileCopyrightText: © 2024 Schneider Electric
@@ -95,7 +95,7 @@ const ProgressBar = class {
         this.valueChanged();
     }
     render() {
-        return (index.h("div", { key: '89fad7b1dd2348a3f4c8a2571fe916d342166acb', "aria-hidden": "true", class: "qds-track", "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get) }, index.h("div", { key: '84ffc7461e57cc90cb8889e16d5cbdf229f0b9f3', class: {
+        return (index.h("div", { key: '5edda217c0fd9ac55fcd7d10860297e1e304b0bb', "aria-hidden": "true", class: "qds-track", "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get) }, index.h("div", { key: 'b54b6ba5b51e36b77b6a44bf6540dde4e07d5a84', class: {
                 'qds-bar': true,
                 'qds-indeterminate': __classPrivateFieldGet(this, _ProgressBar_position, "f") === -1,
             }, "data-size": __classPrivateFieldGet(this, _ProgressBar_instances, "a", _ProgressBar_computedSize_get), style: { width: this.width } })));

package/dist/cjs/qds-radio.cjs.entry.js

@@ -86,10 +86,10 @@ const Radio = class {
     render() {
         return (
         // eslint-disable-next-line jsx-a11y/label-has-associated-control
-        index.h("label", { key: '667293f89507bd2e846c4ed1ed5e70076a93f0ed', "aria-disabled": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? 'true' : undefined, class: {
+        index.h("label", { key: 'e221718e159f0810344fc570487439ef90bba1f9', "aria-disabled": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? 'true' : undefined, class: {
                 'qds-inline': this.inline,
                 'qds-label': true,
-            }, "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }, index.h("div", { key: '956dccf841262856939cc29165642846f8f4ae01', class: "qds-container" }, index.h("input", { key: '8920f9888ad5b49e667e9517a5eaaad66434b82b', checked: this.checked, class: "qds-radio", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), disabled: this.disabled, form: this.form, name: this.name, onBlur: __classPrivateFieldGet(this, _Radio_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Radio_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Radio_onFocus, "f"), ref: __classPrivateFieldGet(this, _Radio_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? undefined : this.tabIndex, type: "radio", value: this.value ?? undefined, ...__classPrivateFieldGet(this, _Radio_inheritedAttributes, "f") }), index.h("div", { key: 'efb2a7e06ec89d59e744f3ecddc606b719570f70', class: "qds-box", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }), index.h("qds-icon", { key: '71851b402290456eeb9f467ff1efea93c4c0b1cd', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), library: "core", name: "checked" })), __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_hasText_get) && (index.h("qds-label", { key: '1b405bc19a6b884678a69b7adfff4a29cba2e6f0', class: "qds-label-inner", size: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), text: this.text }))));
+            }, "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }, index.h("div", { key: 'fccaba785502d623a6f4ec0c311968731efdf5c9', class: "qds-container" }, index.h("input", { key: '9b185e83a2bf4af1028a4ae806c09793f0f267a2', checked: this.checked, class: "qds-radio", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), disabled: this.disabled, form: this.form, name: this.name, onBlur: __classPrivateFieldGet(this, _Radio_onBlur, "f"), onChange: __classPrivateFieldGet(this, _Radio_onChange, "f"), onFocus: __classPrivateFieldGet(this, _Radio_onFocus, "f"), ref: __classPrivateFieldGet(this, _Radio_ref, "f"), required: this.required, tabIndex: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedDisabled_get) ? undefined : this.tabIndex, type: "radio", value: this.value ?? undefined, ...__classPrivateFieldGet(this, _Radio_inheritedAttributes, "f") }), index.h("div", { key: 'c6873e8eef83820aab661a0747830437cc844aee', class: "qds-box", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get) }), index.h("qds-icon", { key: 'f817986d01183e3e013ccb653cdf230a2f61a28a', "aria-hidden": "true", class: "qds-icon", "data-size": __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), library: "core", name: "checked" })), __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_hasText_get) && (index.h("qds-label", { key: '20b5d58a873db0640c7969254740dfa7045c9b42', class: "qds-label-inner", size: __classPrivateFieldGet(this, _Radio_instances, "a", _Radio_computedSize_get), text: this.text }))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/qds-select.cjs.entry.js

@@ -11,7 +11,7 @@ const index = require('./index-dbcccf98.js');
 const helpers = require('./helpers-10154521.js');
 const controls = require('./controls-ee3d2ec8.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:\"d\"}.qds-container,.qds-select{width:inherit}.qds-icon,.qds-select{color:var(--qds-theme-control-text-standard);grid-area:d}.qds-icon{margin-inline-end:calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-border-width));place-self:center end;pointer-events:none}.qds-select{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border-color:var(--qds-theme-control-border);border-radius:var(\n      --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n    ) var(--qds-control-border-radius-top-right,var(--qds-control-border-radius)) var(\n      --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n    ) var(\n      --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n    );border-style:solid;border-width:var(--qds-control-border-width) var(--qds-control-border-width-inline-end,var(--qds-control-border-width)) var(--qds-control-border-width-block-end,var(--qds-control-border-width)) var(--qds-control-border-width);margin:0;outline:0;padding-block:0;padding-inline:var(--qds-control-input-padding-horizontal);text-overflow:ellipsis}.qds-select:not(:focus):user-invalid{border-color:var(--qds-theme-feedback-result-failure)}.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-control-small-text)}.qds-select[data-size=small]:not([multiple]){height:var(--qds-control-small-height);padding-inline-end:calc(var(--qds-control-small-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-select[data-size=standard]{font:var(--qds-control-standard-text)}.qds-select[data-size=standard]:not([multiple]){height:var(--qds-control-standard-height);padding-inline-end:calc(var(--qds-control-standard-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-select[data-size=large]{font:var(--qds-control-large-text)}.qds-select[data-size=large]:not([multiple]){height:var(--qds-control-large-height);padding-inline-end:calc(var(--qds-control-large-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}.qds-focus-ring{border-radius:max(1px,var(\n        --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-top-right,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n      ));grid-area:d;height:calc(100% + var(--qds-control-border-width) - var(--qds-control-border-width-block-end, var(--qds-control-border-width)));isolation:isolate;outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset);pointer-events:none;visibility:hidden;width:calc(100% + var(--qds-control-border-width) - var(\n        --qds-control-border-width-inline-end,\n        var(--qds-control-border-width)\n      ))}.qds-select:focus-visible~.qds-focus-ring{visibility:visible}";
+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:\"f\"}.qds-container,.qds-select{width:inherit}.qds-icon,.qds-select{color:var(--qds-theme-control-text-standard);grid-area:f}.qds-icon{margin-inline-end:calc(var(--qds-control-input-padding-horizontal) + var(--qds-control-border-width));place-self:center end;pointer-events:none}.qds-select{-webkit-appearance:none;appearance:none;background-color:var(--qds-theme-control-input-background);border-color:var(--qds-theme-control-border);border-radius:var(\n      --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n    ) var(--qds-control-border-radius-top-right,var(--qds-control-border-radius)) var(\n      --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n    ) var(\n      --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n    );border-style:solid;border-width:var(--qds-control-border-width) var(--qds-control-border-width-inline-end,var(--qds-control-border-width)) var(--qds-control-border-width-block-end,var(--qds-control-border-width)) var(--qds-control-border-width);margin:0;outline:0;padding-block:0;padding-inline:var(--qds-control-input-padding-horizontal);text-overflow:ellipsis}.qds-select:not(:focus):user-invalid{border-color:var(--qds-theme-feedback-result-failure)}.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-control-small-text)}.qds-select[data-size=small]:not([multiple]){height:var(--qds-control-small-height);padding-inline-end:calc(var(--qds-control-small-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=small]{height:var(--qds-control-small-icon-size);width:var(--qds-control-small-icon-size)}.qds-select[data-size=standard]{font:var(--qds-control-standard-text)}.qds-select[data-size=standard]:not([multiple]){height:var(--qds-control-standard-height);padding-inline-end:calc(var(--qds-control-standard-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=standard]{height:var(--qds-control-standard-icon-size);width:var(--qds-control-standard-icon-size)}.qds-select[data-size=large]{font:var(--qds-control-large-text)}.qds-select[data-size=large]:not([multiple]){height:var(--qds-control-large-height);padding-inline-end:calc(var(--qds-control-large-icon-size) + var(--qds-text-icon-gap) + var(--qds-control-input-padding-horizontal))}.qds-icon[data-size=large]{height:var(--qds-control-large-icon-size);width:var(--qds-control-large-icon-size)}.qds-focus-ring{border-radius:max(1px,var(\n        --qds-control-border-radius-top-left,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-top-right,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-right,var(--qds-control-border-radius)\n      )) max(1px,var(\n        --qds-control-border-radius-bottom-left,var(--qds-control-border-radius)\n      ));grid-area:f;height:calc(100% + var(--qds-control-border-width) - var(--qds-control-border-width-block-end, var(--qds-control-border-width)));isolation:isolate;outline:var(--qds-theme-focus-border) solid var(--qds-focus-border-width);outline-offset:var(--qds-focus-border-offset);pointer-events:none;visibility:hidden;width:calc(100% + var(--qds-control-border-width) - var(\n        --qds-control-border-width-inline-end,\n        var(--qds-control-border-width)\n      ))}.qds-select:focus-visible~.qds-focus-ring{visibility:visible}";
 const QdsSelectStyle0 = selectCss;
 
 // SPDX-FileCopyrightText: © 2024 Schneider Electric

package/dist/cjs/qds-standalone-link.cjs.entry.js

@@ -90,11 +90,11 @@ const StandaloneLink = class {
         __classPrivateFieldGet(this, _StandaloneLink_internals, "f").ariaLabel = this.host.textContent;
     }
     render() {
-        return (index.h("a", { key: '14185a27f43513328980dbd847da91f7c1d6778b', "aria-hidden": "true", class: {
+        return (index.h("a", { key: '0a0852882af03e2e9757cc893572e2e49fd56002', "aria-hidden": "true", class: {
                 'qds-standalone-link': true,
                 'qds-disabled': this.disabled,
                 'qds-visitable': this.visitable,
-            }, "data-importance": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedImportance_get), "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), download: this.download, href: this.href?.toString(), hrefLang: this.hreflang, onBlur: __classPrivateFieldGet(this, _StandaloneLink_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _StandaloneLink_onFocus, "f"), referrerPolicy: this.referrerPolicy, rel: this.rel, tabIndex: this.disabled ? -1 : this.tabIndex, target: this.target }, this.iconName !== undefined && this.iconName !== '' && (index.h("span", { key: '0afd80d2a64d2f82f97a4e834f76479feee27e91', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, index.h("qds-icon", { key: '5806c1ad9b9ca5edb03283ed510f6130247ef71b', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: this.iconLibrary, name: this.iconName }))), index.h("span", { key: 'f0de78c7eb5db711c7800b2228d437a1cce37284', class: "qds-text" }, index.h("slot", { key: '5413b3ad914e928fc65d4fa25f0993cc9cf6c741', onSlotchange: __classPrivateFieldGet(this, _StandaloneLink_onSlotchange, "f") })), this.linkIcon && (index.h("span", { key: 'ab6d397dda7fc8fab3888bfd6c12788f37e35243', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, index.h("qds-icon", { key: '97da13b5f8256f2d01fd6fc53787494912f7b5e1', class: "qds-icon", library: "core", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), name: this.linkIcon }))), this.importance === 'emphasized' && (index.h("span", { key: '0839cd0aa78455482c200a6f756c88ad6621ead4', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, index.h("qds-icon", { key: 'c8b20e77d7c1ddd5f3ac2d92a7e95e2b5937f857', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: "core", name: "next" })))));
+            }, "data-importance": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedImportance_get), "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), download: this.download, href: this.href?.toString(), hrefLang: this.hreflang, onBlur: __classPrivateFieldGet(this, _StandaloneLink_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _StandaloneLink_onFocus, "f"), referrerPolicy: this.referrerPolicy, rel: this.rel, tabIndex: this.disabled ? -1 : this.tabIndex, target: this.target }, this.iconName !== undefined && this.iconName !== '' && (index.h("span", { key: '6d5cf632ea60dd44e8550aab727f9e48278aba4b', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, index.h("qds-icon", { key: 'b8180540954ecac04388afd483d0ef9a603ab2fe', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: this.iconLibrary, name: this.iconName }))), index.h("span", { key: 'c890c8046935d68138fbe8f75dc305a86090c817', class: "qds-text" }, index.h("slot", { key: '732e0415aea65546d4b6499b12f68b885f3200f6', onSlotchange: __classPrivateFieldGet(this, _StandaloneLink_onSlotchange, "f") })), this.linkIcon && (index.h("span", { key: '2a8d58f0fcc5b8968246dd27682faa14eb93d370', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, index.h("qds-icon", { key: 'aae772f29fd61988b2766dbace944b0309b77fc0', class: "qds-icon", library: "core", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), name: this.linkIcon }))), this.importance === 'emphasized' && (index.h("span", { key: '808809863a0a152b735387def27e4f1dd2f09aee', class: "qds-icon-crop", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get) }, index.h("qds-icon", { key: 'e04e12a5a115c865758f528fff82342dc8773b96', class: "qds-icon", "data-size": __classPrivateFieldGet(this, _StandaloneLink_instances, "a", _StandaloneLink_computedSize_get), library: "core", name: "next" })))));
     }
     static get delegatesFocus() { return true; }
     get host() { return index.getElement(this); }

package/dist/cjs/qds-switch.cjs.entry.js

@@ -156,13 +156,13 @@ const Switch = class {
         this.tabindexChanged(this.host.getAttribute('tabindex') ?? '0');
     }
     render() {
-        return (index.h("div", { key: '124a3b649baeeb3fb2dfea6a2fa45f8b41738157', class: {
+        return (index.h("div", { key: '8b4830f1b66ca4bd756e444e332269490e1787b9', class: {
                 'qds-container': true,
                 'qds-disabled': __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedDisabled_get),
                 'qds-inline': this.inline,
-            }, "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, index.h("input", { key: '417acf660662c9f3987bba88886a8e6b4305b13a', "aria-hidden": "true",
+            }, "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, index.h("input", { key: '3c523d904d6fb37e17a4c64ac13d3c657f3dba99', "aria-hidden": "true",
             // eslint-disable-next-line jsx-a11y/no-autofocus
-            autoFocus: this.host.autofocus, checked: this.checked, class: "qds-switch", disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _Switch_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Switch_onFocus, "f"), tabIndex: __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedDisabled_get) ? undefined : this.tabIndex, type: "checkbox", value: this.value ?? undefined, ...this.inheritedAttributes }), index.h("div", { key: 'f922e507766279160da228c4a33630763bbd6acd', class: "qds-track", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, index.h("div", { key: '91c828ada2be4cc6a594b8b473548b3a8f34f1e9', class: "qds-knob", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }))));
+            autoFocus: this.host.autofocus, checked: this.checked, class: "qds-switch", disabled: this.disabled, onBlur: __classPrivateFieldGet(this, _Switch_onBlur, "f"), onFocus: __classPrivateFieldGet(this, _Switch_onFocus, "f"), tabIndex: __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedDisabled_get) ? undefined : this.tabIndex, type: "checkbox", value: this.value ?? undefined, ...this.inheritedAttributes }), index.h("div", { key: '6986512d350d12e7d67b78f65fe1cfaae7874692', class: "qds-track", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }, index.h("div", { key: '8944111f62a2ff14dc63a6ed8871744ac63cae4e', class: "qds-knob", "data-size": __classPrivateFieldGet(this, _Switch_instances, "a", _Switch_computedSize_get) }))));
     }
     static get delegatesFocus() { return true; }
     static get formAssociated() { return true; }