@scania/tegel 1.38.0 → 1.40.0-stencil-core-4.38.1-beta.0

package/dist/components/p-Ip9G3co9.js

@@ -0,0 +1,205 @@
+import { p as proxyCustomElement, H, c as createEvent, h } from './index.js';
+import { h as hasSlot } from './p-DDX6uFcm.js';
+import { g as generateUniqueId } from './p-Cn4f8w1e.js';
+import { g as getAriaInvalid } from './p-wEP_nEaO.js';
+import { d as defineCustomElement$3 } from './p-CPDv0bBc.js';
+import { d as defineCustomElement$2 } from './p-X1sPx4t5.js';
+import { d as defineCustomElement$1 } from './p-DnzQe_HU.js';
+
+const textFieldCss = ".text-field-input-lg.sc-tds-text-field{all:unset;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-text-field-color);background-color:var(--tds-text-field-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-20) var(--tds-spacing-element-16)}.text-field-input-lg.sc-tds-text-field::placeholder{color:var(--tds-text-field-placeholder)}.text-field-input-lg.sc-tds-text-field:disabled{user-select:none;pointer-events:none;background-color:var(--tds-text-field-background-disabled);color:var(--tds-text-field-color-disabled)}.text-field-input-lg.sc-tds-text-field:disabled::placeholder{color:var(--tds-text-field-placeholder-disabled)}.text-field-input-lg.sc-tds-text-field:disabled~.text-field-label-inside.sc-tds-text-field{color:var(--tds-text-field-label-disabled)}.text-field-input-md.sc-tds-text-field{all:unset;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-text-field-color);background-color:var(--tds-text-field-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.text-field-input-md.sc-tds-text-field::placeholder{color:var(--tds-text-field-placeholder)}.text-field-input-md.sc-tds-text-field:disabled{user-select:none;pointer-events:none;background-color:var(--tds-text-field-background-disabled);color:var(--tds-text-field-color-disabled)}.text-field-input-md.sc-tds-text-field:disabled::placeholder{color:var(--tds-text-field-placeholder-disabled)}.text-field-input-md.sc-tds-text-field:disabled~.text-field-label-inside.sc-tds-text-field{color:var(--tds-text-field-label-disabled)}.text-field-input-sm.sc-tds-text-field{all:unset;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-text-field-color);background-color:var(--tds-text-field-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.text-field-input-sm.sc-tds-text-field::placeholder{color:var(--tds-text-field-placeholder)}.text-field-input-sm.sc-tds-text-field:disabled{user-select:none;pointer-events:none;background-color:var(--tds-text-field-background-disabled);color:var(--tds-text-field-color-disabled)}.text-field-input-sm.sc-tds-text-field:disabled::placeholder{color:var(--tds-text-field-placeholder-disabled)}.text-field-input-sm.sc-tds-text-field:disabled~.text-field-label-inside.sc-tds-text-field{color:var(--tds-text-field-label-disabled)}.text-field-container.sc-tds-text-field{border-radius:4px 4px 0 0;display:flex;position:relative;height:56px;box-sizing:border-box;background-color:var(--tds-text-field-background);border-bottom:1px solid var(--tds-text-field-border-bottom);border-top:1px solid transparent;transition:border-bottom-color 200ms ease}.text-field-container.sc-tds-text-field:hover{border-bottom-color:var(--tds-text-field-border-bottom-hover)}.form-text-field-md.sc-tds-text-field .text-field-container.sc-tds-text-field{height:48px}.form-text-field-sm.sc-tds-text-field .text-field-container.sc-tds-text-field{height:40px}.text-field-container.sc-tds-text-field:focus-within{border:2px solid var(--tds-focus-outline-color);margin:0 -2px}.text-field-input-container.sc-tds-text-field{position:relative;width:100%}.text-field-data.sc-tds-text-field,.text-field-input.sc-tds-text-field{color:var(--tds-text-field-data-color)}.text-field-label-outside.sc-tds-text-field>*.sc-tds-text-field{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:block;margin-bottom:var(--tds-spacing-element-8);color:var(--tds-text-field-label-color)}.text-field-label-inside.sc-tds-text-field{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);position:absolute;pointer-events:none;color:var(--tds-text-field-label-inside-color);left:16px}.form-text-field.sc-tds-text-field{display:block;min-width:208px}.form-text-field-nomin.sc-tds-text-field{min-width:auto}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-lg.sc-tds-text-field{padding-top:var(--tds-spacing-element-24);padding-bottom:15px}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-lg.sc-tds-text-field~.text-field-label-inside.sc-tds-text-field{top:20px}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-lg.sc-tds-text-field::placeholder{color:transparent}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-lg.sc-tds-text-field .sc-tds-text-field::placeholder{color:transparent}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-lg.sc-tds-text-field:focus::placeholder{transition:color 0.35s ease;color:var(--tds-text-field-placeholder)}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-md.sc-tds-text-field{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-md.sc-tds-text-field~.text-field-label-inside.sc-tds-text-field{top:16px}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-md.sc-tds-text-field::placeholder{color:transparent}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-md.sc-tds-text-field .sc-tds-text-field::placeholder{color:transparent}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-md.sc-tds-text-field:focus::placeholder{transition:color 0.35s ease;color:var(--tds-text-field-placeholder)}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-sm.sc-tds-text-field{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-sm.sc-tds-text-field~.text-field-label-inside.sc-tds-text-field{top:16px}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-sm.sc-tds-text-field::placeholder{color:transparent}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-sm.sc-tds-text-field .sc-tds-text-field::placeholder{color:transparent}.form-text-field.text-field-container-label-inside.sc-tds-text-field .text-field-input-sm.sc-tds-text-field:focus::placeholder{transition:color 0.35s ease;color:var(--tds-text-field-placeholder)}.form-text-field.text-field-container-label-inside.text-field-focus.sc-tds-text-field .text-field-input-sm.sc-tds-text-field~.text-field-label-inside.sc-tds-text-field,.form-text-field.text-field-container-label-inside.text-field-data.sc-tds-text-field .text-field-input-sm.sc-tds-text-field~.text-field-label-inside.sc-tds-text-field{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.form-text-field.text-field-container-label-inside.text-field-focus.sc-tds-text-field .text-field-input-md.sc-tds-text-field~.text-field-label-inside.sc-tds-text-field,.form-text-field.text-field-container-label-inside.text-field-data.sc-tds-text-field .text-field-input-md.sc-tds-text-field~.text-field-label-inside.sc-tds-text-field{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.form-text-field.text-field-container-label-inside.text-field-focus.sc-tds-text-field .text-field-input-lg.sc-tds-text-field~.text-field-label-inside.sc-tds-text-field,.form-text-field.text-field-container-label-inside.text-field-data.sc-tds-text-field .text-field-input-lg.sc-tds-text-field~.text-field-label-inside.sc-tds-text-field{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:12px}.text-field-helper.sc-tds-text-field{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:flex;gap:8px;justify-content:space-between;flex-basis:100%;padding-top:var(--tds-spacing-element-4);color:var(--tds-text-field-helper)}.text-field-helper.sc-tds-text-field .text-field-textcounter.sc-tds-text-field{margin-left:auto}.form-text-field-disabled.sc-tds-text-field .text-field-container.sc-tds-text-field{cursor:not-allowed;border-bottom-color:transparent}.form-text-field-disabled.sc-tds-text-field .text-field-slot-wrap-prefix.sc-tds-text-field>*.sc-tds-text-field,.form-text-field-disabled.sc-tds-text-field .text-field-slot-wrap-suffix.sc-tds-text-field>*.sc-tds-text-field{color:var(--tds-text-field-ps-color-disabled)}.form-text-field-disabled.sc-tds-text-field .text-field-label-outside.sc-tds-text-field>*.sc-tds-text-field{color:var(--tds-text-field-label-disabled)}.form-text-field-disabled.sc-tds-text-field .text-field-helper.sc-tds-text-field{color:var(--tds-text-field-helper-disabled)}.text-field-icon__readonly.sc-tds-text-field{display:none;position:absolute;right:18px;top:50%;transform:translateY(-50%);color:var(--tds-text-field-icon-read-only-label-color)}.text-field-icon__readonly.sc-tds-text-field .tds-tooltip.sc-tds-text-field{min-width:150px}.form-text-field-readonly.sc-tds-text-field{user-select:auto;caret-color:transparent;cursor:default}.form-text-field-readonly.sc-tds-text-field .text-field-container.sc-tds-text-field{border-bottom-color:var(--tds-text-field-border-bottom-readonly)}.form-text-field-readonly.sc-tds-text-field .text-field-icon__readonly.sc-tds-text-field{display:block}.form-text-field-readonly.sc-tds-text-field .text-field-icon__readonly.sc-tds-text-field:hover~.text-field-icon__readonly-label.sc-tds-text-field{display:block}.form-text-field-readonly.sc-tds-text-field .text-field-input.sc-tds-text-field{background-color:transparent}.form-text-field-readonly.sc-tds-text-field:has(.text-field-icon__readonly) .text-field-input.sc-tds-text-field{padding-right:54px}.form-text-field-success.sc-tds-text-field:not(.form-text-field-readonly) .text-field-container.sc-tds-text-field{border-bottom-color:var(--tds-text-field-border-bottom-success)}.form-text-field-error.sc-tds-text-field:not(.form-text-field-readonly) .text-field-helper.sc-tds-text-field{color:var(--tds-text-field-helper-error)}.form-text-field-error.sc-tds-text-field:not(.form-text-field-readonly) .text-field-container.sc-tds-text-field{border-bottom-color:var(--tds-text-field-border-bottom-error)}.text-field-helper-error-state.sc-tds-text-field{display:flex;gap:8px;flex-wrap:nowrap}.text-field-textcounter-disabled.sc-tds-text-field{color:var(--tds-text-field-textcounter-disabled)}.text-field-textcounter.sc-tds-text-field{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-text-field-textcounter);float:right}.text-field-textcounter.text-field-textcounter-disabled.sc-tds-text-field{color:var(--tds-text-field-textcounter-disabled)}.text-field-textcounter.text-field-textcounter-divider.sc-tds-text-field{color:var(--tds-text-field-textcounter-divider)}.text-field-textcounter.text-field-textcounter-divider-disabled.sc-tds-text-field{color:var(--tds-text-field-textcounter-divider-disabled)}.text-field-slot-wrap-prefix.sc-tds-text-field,.text-field-slot-wrap-suffix.sc-tds-text-field{align-self:center;font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);margin:0 0 0 14px;color:var(--tds-text-field-ps-color)}.text-field-slot-wrap-prefix.sc-tds-text-field-s>:not(tds-icon),.text-field-slot-wrap-suffix.sc-tds-text-field-s>:not(tds-icon){margin:0 0 0 2px}.text-field-slot-wrap-prefix.text-field-error.sc-tds-text-field,.text-field-slot-wrap-suffix.text-field-error.sc-tds-text-field{color:var(--tds-text-field-ps-color-error)}.text-field-slot-wrap-suffix.sc-tds-text-field{margin:0 14px 0 0}.text-field-slot-wrap-suffix.sc-tds-text-field-s>:not(tds-icon){margin:0 2px 0 0}";
+
+const TdsTextField = /*@__PURE__*/ proxyCustomElement(class TdsTextField extends H {
+    constructor(registerHost) {
+        super();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
+        this.tdsChange = createEvent(this, "tdsChange", 6);
+        this.tdsInput = createEvent(this, "tdsInput", 6);
+        this.tdsFocus = createEvent(this, "tdsFocus", 6);
+        this.tdsBlur = createEvent(this, "tdsBlur", 6);
+        this.uuid = generateUniqueId();
+        /** Which input type, text, password or similar */
+        this.type = 'text';
+        /** Position of the label for the Text Field. */
+        this.labelPosition = 'no-label';
+        /** Label text */
+        this.label = '';
+        /** Placeholder text */
+        this.placeholder = '';
+        /** Value of the input text */
+        this.value = '';
+        /** Set input in disabled state */
+        this.disabled = false;
+        /** Set input in readonly state */
+        this.readOnly = false;
+        /** Hides the read-only icon in the Text Field. Requires Read Only to be enabled. */
+        this.hideReadOnlyIcon = false;
+        /** Size of the input */
+        this.size = 'lg';
+        /** Mode variant of the Text Field */
+        this.modeVariant = null;
+        /** Unset minimum width of 208px. */
+        this.noMinWidth = false;
+        /** Name property */
+        this.name = '';
+        /** Error state of input */
+        this.state = 'default';
+        /** Autofocus for input */
+        this.autofocus = false;
+        /** Makes the text field required */
+        this.required = false;
+        /** Value to be used for the text field's autocomplete attribute */
+        this.autocomplete = 'off';
+        /** Listen to the focus state of the input */
+        this.focusInput = false;
+    }
+    handleChange(event) {
+        this.tdsChange.emit(event);
+    }
+    // Data input event in value prop
+    handleInput(event) {
+        const inputEl = event.target;
+        let { value } = inputEl;
+        // Custom handling of number inputs when min/max are set
+        if (this.type === 'number') {
+            const numericValue = Number(value);
+            if (this.min !== undefined && numericValue < Number(this.min)) {
+                value = String(this.min);
+            }
+            if (this.max !== undefined && numericValue > Number(this.max)) {
+                value = String(this.max);
+            }
+            inputEl.value = value;
+        }
+        this.value = value;
+        this.tdsInput.emit(event);
+    }
+    /** Set the input as focus when clicking the whole Text Field with suffix/prefix */
+    handleFocus(event) {
+        this.textInput.focus();
+        this.focusInput = true;
+        this.tdsFocus.emit(event);
+    }
+    /** Set the input as focus when clicking the whole Text Field with suffix/prefix */
+    handleBlur(event) {
+        this.focusInput = false;
+        this.tdsBlur.emit(event);
+    }
+    /** Method to handle focus */
+    async focusElement() {
+        if (this.textInput) {
+            this.textInput.focus();
+        }
+    }
+    render() {
+        var _a;
+        const usesPrefixSlot = hasSlot('prefix', this.host);
+        const usesSuffixSlot = hasSlot('suffix', this.host);
+        return (h("div", { key: '3a072497874b410339fc3368f49b9048fdcc6641', class: {
+                'form-text-field': true,
+                'form-text-field-nomin': this.noMinWidth,
+                'text-field-focus': this.focusInput && !this.disabled,
+                'text-field-data': this.value !== '' && this.value !== null,
+                'text-field-container-label-inside': this.labelPosition === 'inside' && this.size !== 'sm',
+                'form-text-field-disabled': this.disabled,
+                'form-text-field-readonly': this.disabled ? false : this.readOnly,
+                'tds-mode-variant-primary': this.readOnly
+                    ? this.modeVariant === 'secondary'
+                    : this.modeVariant === 'primary',
+                'tds-mode-variant-secondary': this.readOnly
+                    ? this.modeVariant === 'primary'
+                    : this.modeVariant === 'secondary',
+                'form-text-field-md': this.size === 'md',
+                'form-text-field-sm': this.size === 'sm',
+                'form-text-field-error': this.state === 'error',
+                'form-text-field-success': this.state === 'success',
+            } }, this.labelPosition === 'outside' && (h("div", { key: '190b617811d0993b85b3df6951a41678bc51879e', class: "text-field-label-outside" }, h("label", { key: '6e5099cc43259b790d83d3f127e85463e58c9ac2', htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), h("div", { key: 'd5064e04015238d38a70b09c9eba4cbbb1da19cb', onClick: () => this.textInput.focus(), class: "text-field-container" }, usesPrefixSlot && (h("div", { key: '69af0c24b21e3edda262749538cc9775c501e115', class: {
+                'text-field-slot-wrap-prefix': true,
+                'text-field-error': this.state === 'error',
+                'text-field-success': this.state === 'success',
+                'text-field-default': this.state === 'default',
+            } }, h("slot", { key: 'f397647f1458b1d132080cb15b92be60e2942459', name: "prefix" }))), h("div", { key: '33674576cce732cc66e7ca830669b7535aea7f00', class: "text-field-input-container" }, h("input", { key: 'a27eca3e8862b099475fd46c2182f86d7d110533', ref: (inputEl) => {
+                this.textInput = inputEl;
+            }, class: {
+                'text-field-input': true,
+                'text-field-input-sm': this.size === 'sm',
+                'text-field-input-md': this.size === 'md',
+                'text-field-input-lg': this.size === 'lg',
+            }, type: this.type, disabled: this.disabled, readonly: this.disabled ? false : this.readOnly, placeholder: this.placeholder, value: this.value, autofocus: this.autofocus, maxlength: this.maxLength, name: this.name, min: this.min, max: this.max, onInput: (event) => this.handleInput(event), onChange: (event) => this.handleChange(event), onFocus: (event) => {
+                if (!this.readOnly) {
+                    this.handleFocus(event);
+                }
+            }, onBlur: (event) => {
+                if (!this.readOnly) {
+                    this.handleBlur(event);
+                }
+            }, "aria-invalid": getAriaInvalid(this.host, this.state), "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label, "aria-describedby": `text-field-helper-element-${this.uuid}`, "aria-readonly": this.readOnly, id: `text-field-input-element-${this.uuid}`, required: this.required, autocomplete: this.autocomplete }), this.labelPosition === 'inside' && this.size !== 'sm' && (h("label", { key: '7671a287273c976a1ad73032020838d6c4cedab0', class: "text-field-label-inside", htmlFor: `text-field-input-element-${this.uuid}` }, this.label))), usesSuffixSlot && (h("div", { key: '19a93786e8647aa1d2e5b9a9b80c71c250330d8d', class: {
+                'text-field-slot-wrap-suffix': true,
+                'text-field-error': this.state === 'error',
+                'text-field-success': this.state === 'success',
+                'text-field-default': this.state === 'default',
+                'tds-u-display-none': this.readOnly,
+            } }, h("slot", { key: 'dd76e5bb941bc791caa395206be040319e00a708', name: "suffix" }))), this.readOnly && !this.hideReadOnlyIcon && (h("span", { key: '2ba57774f40412b9a337ef7bf47ce65bcf44a704', class: "text-field-icon__readonly" }, h("tds-tooltip", { key: 'bfb0f704470e77f9ce6e11fe3d01af3dd8569015', placement: "top-end", text: "This field is non-editable", selector: "#readonly-tooltip" }), h("tds-icon", { key: '28ded9080cb2abfe6a06b284af3807584f4dda02', id: "readonly-tooltip", name: "edit_inactive", size: "20px" })))), h("div", { key: '636205c9e69b3a2602ea0b8817a585e5cd4e16b2', "aria-live": "assertive" }, (this.helper || this.maxLength > 0) && (h("div", { key: '4ece49df31864f53d0fadc3709cd06d34da6830a', class: "text-field-helper", id: `text-field-helper-element-${this.uuid}` }, this.state === 'error' && (h("div", { key: 'ba1e7f916ebbfa6775b46febed47e4bf55af9fd3', class: "text-field-helper-error-state" }, !this.readOnly && h("tds-icon", { key: '45eb885352b32dd3483a1c01f4dbaa49fcfda8ba', name: "error", size: "16px" }), this.helper)), this.state !== 'error' && this.helper, !this.readOnly && this.maxLength > 0 && (h("span", { key: '9934f078456a0af683b0d1f8a997c5484e58868c', class: {
+                'text-field-textcounter-divider': true,
+                'text-field-textcounter-disabled': this.disabled,
+            } }, this.value === null ? 0 : (_a = this.value) === null || _a === void 0 ? void 0 : _a.length, " / ", this.maxLength)))))));
+    }
+    get host() { return this; }
+    static get style() { return textFieldCss; }
+}, [262, "tds-text-field", {
+        "type": [513],
+        "labelPosition": [1, "label-position"],
+        "label": [1],
+        "min": [8],
+        "max": [8],
+        "helper": [1],
+        "placeholder": [1],
+        "value": [513],
+        "disabled": [4],
+        "readOnly": [4, "read-only"],
+        "hideReadOnlyIcon": [4, "hide-read-only-icon"],
+        "size": [1],
+        "modeVariant": [1, "mode-variant"],
+        "noMinWidth": [4, "no-min-width"],
+        "name": [1],
+        "state": [1],
+        "maxLength": [2, "max-length"],
+        "autofocus": [4],
+        "tdsAriaLabel": [1, "tds-aria-label"],
+        "required": [4],
+        "autocomplete": [1],
+        "focusInput": [32],
+        "focusElement": [64]
+    }]);
+function defineCustomElement() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["tds-text-field", "tds-icon", "tds-popover-core", "tds-tooltip"];
+    components.forEach(tagName => { switch (tagName) {
+        case "tds-text-field":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, TdsTextField);
+            }
+            break;
+        case "tds-icon":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$3();
+            }
+            break;
+        case "tds-popover-core":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$2();
+            }
+            break;
+        case "tds-tooltip":
+            if (!customElements.get(tagName)) {
+                defineCustomElement$1();
+            }
+            break;
+    } });
+}
+defineCustomElement();
+
+export { TdsTextField as T, defineCustomElement as d };

package/dist/components/{p-0bd4c19c.js → p-Q3W78DlP.js}

@@ -1,4 +1,4 @@
-import { i as inheritAttributes } from './p-3fe9cbbf.js';
+import { i as inheritAttributes } from './p-CF8bH08v.js';
 
 /**
  * List of available ARIA attributes + `role`.

package/dist/components/{p-d0cf68be.js → p-QnvG_QPu.js}

@@ -1,18 +1,19 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
-import { g as getPreviousNestedChildOfSiblingsMatching, i as isHeadingElement } from './p-859e3ebf.js';
+import { p as proxyCustomElement, H, h, a as Host } from './index.js';
+import { g as getPreviousNestedChildOfSiblingsMatching, i as isHeadingElement } from './p-CuIyaNyT.js';
 
 const headerDropdownListCss = ":host{display:block;width:190px;padding:0;margin:0;list-style:none;border-radius:unset;background-color:var(--tds-header-app-launcher-menu-bg)}@media all and (max-width: 384px){:host{width:100vw}}:host([size=lg]){width:320px}";
-const TdsHeaderDropdownListStyle0 = headerDropdownListCss;
 
 const TdsHeaderDropdownList = /*@__PURE__*/ proxyCustomElement(class TdsHeaderDropdownList extends H {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         // A Map to store the slots and their associated slotchange listeners.
         this.slotListeners = new Map();
+        /** The size of the component. */
         this.size = 'md';
-        this.headingElement = undefined;
     }
     componentWillLoad() {
         const { children } = this.host;
@@ -75,11 +76,11 @@ const TdsHeaderDropdownList = /*@__PURE__*/ proxyCustomElement(class TdsHeaderDr
             'role': 'list',
             'aria-labelledby': (_a = this.headingElement) === null || _a === void 0 ? void 0 : _a.id,
         };
-        return (h(Host, Object.assign({ key: '3eeb33a5a5ba4afbfa21bd65fc4ad8ca7d8feddf' }, attributes), h("slot", { key: '5561862a0377a76cae8d781849c4de10c9e8cdeb' })));
+        return (h(Host, Object.assign({ key: '57e8ecd046b7a260f1516fc80673e9d095ffd4d3' }, attributes), h("slot", { key: 'e0bafe5fffcf8864faebd4603597e3e424a35046' })));
     }
     get host() { return this; }
-    static get style() { return TdsHeaderDropdownListStyle0; }
-}, [1, "tds-header-dropdown-list", {
+    static get style() { return headerDropdownListCss; }
+}, [257, "tds-header-dropdown-list", {
         "size": [513],
         "headingElement": [32]
     }]);

package/dist/components/{p-d3866be7.js → p-X1sPx4t5.js}

@@ -1,5 +1,5 @@
-import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
-import { g as generateUniqueId } from './p-11648030.js';
+import { p as proxyCustomElement, H, c as createEvent, h, a as Host } from './index.js';
+import { g as generateUniqueId } from './p-Cn4f8w1e.js';
 
 var top = 'top';
 var bottom = 'bottom';
@@ -144,7 +144,7 @@ function effect$2(_ref2) {
 } // eslint-disable-next-line import/no-unused-modules
 
 
-const applyStyles$1 = {
+var applyStyles$1 = {
   name: 'applyStyles',
   enabled: true,
   phase: 'write',
@@ -459,7 +459,7 @@ function effect$1(_ref2) {
 } // eslint-disable-next-line import/no-unused-modules
 
 
-const arrow$1 = {
+var arrow$1 = {
   name: 'arrow',
   enabled: true,
   phase: 'main',
@@ -626,7 +626,7 @@ function computeStyles(_ref5) {
 } // eslint-disable-next-line import/no-unused-modules
 
 
-const computeStyles$1 = {
+var computeStyles$1 = {
   name: 'computeStyles',
   enabled: true,
   phase: 'beforeWrite',
@@ -673,7 +673,7 @@ function effect(_ref) {
 } // eslint-disable-next-line import/no-unused-modules
 
 
-const eventListeners = {
+var eventListeners = {
   name: 'eventListeners',
   enabled: true,
   phase: 'write',
@@ -983,7 +983,6 @@ function detectOverflow(state, options) {
   var popperOffsets = computeOffsets({
     reference: referenceClientRect,
     element: popperRect,
-    strategy: 'absolute',
     placement: placement
   });
   var popperClientRect = rectToClientRect(Object.assign({}, popperRect, popperOffsets));
@@ -1179,7 +1178,7 @@ function flip(_ref) {
 } // eslint-disable-next-line import/no-unused-modules
 
 
-const flip$1 = {
+var flip$1 = {
   name: 'flip',
   enabled: true,
   phase: 'main',
@@ -1241,7 +1240,7 @@ function hide(_ref) {
 } // eslint-disable-next-line import/no-unused-modules
 
 
-const hide$1 = {
+var hide$1 = {
   name: 'hide',
   enabled: true,
   phase: 'main',
@@ -1293,7 +1292,7 @@ function offset(_ref2) {
 } // eslint-disable-next-line import/no-unused-modules
 
 
-const offset$1 = {
+var offset$1 = {
   name: 'offset',
   enabled: true,
   phase: 'main',
@@ -1311,13 +1310,12 @@ function popperOffsets(_ref) {
   state.modifiersData[name] = computeOffsets({
     reference: state.rects.reference,
     element: state.rects.popper,
-    strategy: 'absolute',
     placement: state.placement
   });
 } // eslint-disable-next-line import/no-unused-modules
 
 
-const popperOffsets$1 = {
+var popperOffsets$1 = {
   name: 'popperOffsets',
   enabled: true,
   phase: 'read',
@@ -1452,7 +1450,7 @@ function preventOverflow(_ref) {
 } // eslint-disable-next-line import/no-unused-modules
 
 
-const preventOverflow$1 = {
+var preventOverflow$1 = {
   name: 'preventOverflow',
   enabled: true,
   phase: 'main',
@@ -1816,14 +1814,42 @@ const generateClassList = (classes) => {
 };
 
 const tdsPopoverCoreCss = ".sc-tds-popover-core-h{pointer-events:none;display:block}.tds-animation-enter-fade.sc-tds-popover-core-h{animation:tds-fade-in var(--tds-motion-duration-moderate-01) var(--tds-motion-easing-enter) forwards}.tds-animation-exit-fade.sc-tds-popover-core-h{animation:tds-fade-out var(--tds-motion-duration-moderate-01) var(--tds-motion-easing-exit) forwards}.is-shown.sc-tds-popover-core-h{opacity:1;pointer-events:auto;visibility:visible}.is-hidden.sc-tds-popover-core-h{opacity:0;pointer-events:none;visibility:hidden}.initially-hidden.sc-tds-popover-core-h{opacity:0;pointer-events:none;visibility:hidden}";
-const TdsPopoverCoreStyle0 = tdsPopoverCoreCss;
 
 const TdsPopoverCore = /*@__PURE__*/ proxyCustomElement(class TdsPopoverCore extends H {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.internalTdsShow = createEvent(this, "internalTdsShow", 4);
         this.internalTdsClose = createEvent(this, "internalTdsClose", 0);
+        /** Decides if the component should be visible from the start. */
+        this.defaultShow = false;
+        /** Whether the popover should animate when being opened/closed or not */
+        this.animation = 'none';
+        /** Controls whether the Popover is shown or not. If this is set hiding and showing
+         * will be decided by this prop and will need to be controlled from the outside. This
+         * also means that clicking outside of the popover won't close it. Takes precedence over `defaultShow` prop.
+         */
+        this.show = null;
+        /** Decides the placement of the Popover Menu */
+        this.placement = 'auto';
+        /** Sets the offset skidding */
+        this.offsetSkidding = 0;
+        /** Sets the offset distance */
+        this.offsetDistance = 8;
+        /** Array of modifier objects to pass to popper.js. See https://popper.js.org/docs/v2/modifiers/ */
+        this.modifiers = [];
+        /** What triggers the popover to show */
+        this.trigger = 'click';
+        /** Decides if the popover should hide automatically.
+         * Alternatevly it can be hidden externally based on emitted events. */
+        this.autoHide = true;
+        this.renderedShowValue = false;
+        this.isShown = false;
+        this.disableLogic = false;
+        this.hasShownAtLeastOnce = false;
+        this.openedByKeyboard = false;
         this.uuid = generateUniqueId();
         this.setIsShown = function setIsShown(isShown) {
             if (typeof isShown === 'function') {
@@ -1860,24 +1886,6 @@ const TdsPopoverCore = /*@__PURE__*/ proxyCustomElement(class TdsPopoverCore ext
             event.stopPropagation();
             this.setIsShown(false);
         }.bind(this);
-        this.selector = undefined;
-        this.referenceEl = undefined;
-        this.defaultShow = false;
-        this.animation = 'none';
-        this.show = null;
-        this.placement = 'auto';
-        this.offsetSkidding = 0;
-        this.offsetDistance = 8;
-        this.modifiers = [];
-        this.trigger = 'click';
-        this.autoHide = true;
-        this.renderedShowValue = false;
-        this.popperInstance = undefined;
-        this.target = undefined;
-        this.isShown = false;
-        this.disableLogic = false;
-        this.hasShownAtLeastOnce = false;
-        this.openedByKeyboard = false;
     }
     /** Property for closing popover programmatically */
     async close() {
@@ -2044,7 +2052,7 @@ const TdsPopoverCore = /*@__PURE__*/ proxyCustomElement(class TdsPopoverCore ext
             'tds-animation-exit-fade': !this.isShown && this.animation === 'fade',
         };
         const classList = generateClassList(classes);
-        return (h(Host, { key: 'e00527f6f668e309529ff607c744eb64bba30c6a', role: this.host.getAttribute('role'), class: classList, id: `tds-popover-core-${this.uuid}` }, h("slot", { key: 'e562ffae5ecbca928a541de6b50f88efa1eded8c' })));
+        return (h(Host, { key: '5c557610103827aedbabbd37a79730580d15ca2d', role: this.host.getAttribute('role'), class: classList, id: `tds-popover-core-${this.uuid}` }, h("slot", { key: '487a937b3c9d87b91425f6bd9eb88bc3fa85d7df' })));
     }
     get host() { return this; }
     static get watchers() { return {
@@ -2053,8 +2061,8 @@ const TdsPopoverCore = /*@__PURE__*/ proxyCustomElement(class TdsPopoverCore ext
         "trigger": ["onTriggerChanged"],
         "isShown": ["onIsShownChange"]
     }; }
-    static get style() { return TdsPopoverCoreStyle0; }
-}, [6, "tds-popover-core", {
+    static get style() { return tdsPopoverCoreCss; }
+}, [262, "tds-popover-core", {
         "selector": [1],
         "referenceEl": [16],
         "defaultShow": [4, "default-show"],

package/dist/components/p-wEP_nEaO.js

@@ -0,0 +1,23 @@
+/**
+ * Gets the appropriate aria-invalid value for form components.
+ *
+ * This utility handles cross-framework compatibility by checking for an explicit
+ * aria-invalid attribute on the host element first, then falling back to the
+ * component's state. It properly handles both string and boolean values that
+ * may be passed from different frameworks (especially React).
+ *
+ * @param host - The host element to check for aria-invalid attribute
+ * @param state - The component's state ('error', 'success', 'default')
+ * @returns The aria-invalid value as a string ('true' or 'false')
+ *
+ */
+const getAriaInvalid = (host, state) => {
+    const hostAriaInvalid = host.getAttribute('aria-invalid');
+    if (hostAriaInvalid !== null) {
+        return String(hostAriaInvalid);
+    }
+    // Fallback to state-based aria-invalid
+    return state === 'error' ? 'true' : 'false';
+};
+
+export { getAriaInvalid as g };

package/dist/components/tds-accordion-item.js

@@ -1,21 +1,28 @@
-import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
-import { g as generateUniqueId } from './p-11648030.js';
-import { d as defineCustomElement$2 } from './p-b390ece5.js';
+import { p as proxyCustomElement, H, c as createEvent, h, a as Host } from './index.js';
+import { g as generateUniqueId } from './p-Cn4f8w1e.js';
+import { d as defineCustomElement$2 } from './p-CPDv0bBc.js';
 
-const accordionItemCss = ".tds-accordion-item{box-sizing:border-box;list-style:none;color:var(--tds-accordion-color);position:relative;border-top:1px solid var(--tds-accordion-border)}.tds-accordion-item *{box-sizing:border-box}.tds-accordion-item button.tds-accordion-header-icon-start,.tds-accordion-item button.tds-accordion-header-icon-end{all:unset}.tds-accordion-item .tds-accordion-header-icon-start,.tds-accordion-item .tds-accordion-header-icon-end,.tds-accordion-item button.tds-accordion-header-icon-start,.tds-accordion-item button.tds-accordion-header-icon-end{box-sizing:border-box;cursor:pointer;display:flex;align-items:center;width:100%;font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);padding:var(--tds-spacing-element-16);background-color:var(--tds-accordion-background)}.tds-accordion-item .tds-accordion-header-icon-start *,.tds-accordion-item .tds-accordion-header-icon-end *,.tds-accordion-item button.tds-accordion-header-icon-start *,.tds-accordion-item button.tds-accordion-header-icon-end *{box-sizing:border-box}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon,.tds-accordion-item button.tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item button.tds-accordion-header-icon-end .tds-accordion-icon{transform-origin:center;transition:transform 0.15s ease-in-out;color:var(--tds-accordion-icon-color)}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon>tds-icon,.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon>tds-icon,.tds-accordion-item button.tds-accordion-header-icon-start .tds-accordion-icon>tds-icon,.tds-accordion-item button.tds-accordion-header-icon-end .tds-accordion-icon>tds-icon{display:block}.tds-accordion-item .tds-accordion-title{flex-grow:2}.tds-accordion-item .tds-accordion-panel{cursor:default;padding:var(--tds-spacing-element-8) var(--tds-spacing-layout-64) var(--tds-spacing-element-32) var(--tds-spacing-element-16);display:none;font:var(--tds-detail-03);letter-spacing:var(--tds-detail-03-ls)}.tds-accordion-item .tds-accordion-panel p{margin:0;padding:0}.tds-accordion-item .tds-accordion-panel--padding-reset{padding-right:var(--tds-spacing-element-16)}.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon{margin:0 0 0 var(--tds-spacing-element-32)}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-title{order:1}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon{order:0;margin:0 var(--tds-spacing-element-16) 0 0}.tds-accordion-item.disabled,.tds-accordion-item.disabled .tds-accordion-header-icon-end,.tds-accordion-item.disabled .tds-accordion-header-icon-start,.tds-accordion-item.disabled .tds-accordion-panel{color:var(--tds-accordion-color-disabled);cursor:not-allowed}.tds-accordion-item.disabled .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-header-icon-end .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-panel .tds-accordion-icon{color:var(--tds-accordion-color-disabled)}.tds-accordion-item.disabled:hover,.tds-accordion-item.disabled:hover *,.tds-accordion-item.disabled:active,.tds-accordion-item.disabled:active *,.tds-accordion-item.disabled.active,.tds-accordion-item.disabled.active *{cursor:not-allowed}.tds-accordion-item.disabled:hover .tds-accordion-header-icon-start,.tds-accordion-item.disabled:hover .tds-accordion-header-icon-end,.tds-accordion-item.disabled:active .tds-accordion-header-icon-start,.tds-accordion-item.disabled:active .tds-accordion-header-icon-end,.tds-accordion-item.disabled.active .tds-accordion-header-icon-start,.tds-accordion-item.disabled.active .tds-accordion-header-icon-end{background-color:var(--tds-accordion-bg);outline:none;pointer-events:none}.tds-accordion-item.disabled:hover .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:hover .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled:active .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:active .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled.active .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled.active .tds-accordion-header-icon-end::after{border-color:transparent}.tds-accordion-item.expanded .tds-accordion-panel{display:block;padding-bottom:31px}.tds-accordion-item.expanded .tds-accordion-icon{transform:rotate(180deg)}.tds-accordion-item.expanded .tds-accordion-header-icon-end .tds-accordion-icon{margin-right:0;margin-left:var(--tds-spacing-element-32)}.tds-accordion-item.expanded .tds-accordion-header-icon-start .tds-accordion-icon{margin-left:0;margin-right:var(--tds-spacing-element-16)}.tds-accordion-item:first-child{margin-bottom:-1px;border-bottom:1px solid var(--tds-accordion-border)}.tds-accordion-item:has(.tds-accordion-header-icon-start:focus-visible),.tds-accordion-item:has(.tds-accordion-header-icon-end:focus-visible){outline:2px solid var(--tds-focus-outline-color);box-shadow:0 0 0 1px var(--tds-white);outline-offset:1px;z-index:1;background-color:var(--tds-accordion-background-focus)}.tds-accordion-item[disabled=true]:focus-visible{border-color:var(--tds-accordion-border)}:host(:hover) .tds-accordion-header-icon-start,:host(:hover) .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-hover)}.tds-accordion-item:has(:hover){background-color:var(--tds-accordion-background-hover)}.tds-accordion-item:has(.tds-accordion-header-icon-start:active),.tds-accordion-item:has(.tds-accordion-header-icon-end:active){background-color:var(--tds-accordion-background-active)}:host(:hover) .tds-accordion-item:has(.tds-accordion-header-icon-start:active) .tds-accordion-header-icon-start,:host(:hover) .tds-accordion-item:has(.tds-accordion-header-icon-end:active) .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-active)}.tds-accordion-header-icon-start:active,.tds-accordion-header-icon-end:active{outline:none}";
-const TdsAccordionItemStyle0 = accordionItemCss;
+const accordionItemCss = ".tds-accordion-item{box-sizing:border-box;list-style:none;color:var(--tds-accordion-color);position:relative;border-top:1px solid var(--tds-accordion-border)}.tds-accordion-item *{box-sizing:border-box}.tds-accordion-item:hover{background-color:var(--tds-accordion-background-hover);border-bottom:1px solid var(--tds-accordion-border-hover);border-top:1px solid var(--tds-accordion-border-hover);margin-bottom:-1px;z-index:1}.tds-accordion-item button.tds-accordion-header-icon-start,.tds-accordion-item button.tds-accordion-header-icon-end{all:unset}.tds-accordion-item .tds-accordion-header-icon-start,.tds-accordion-item .tds-accordion-header-icon-end,.tds-accordion-item button.tds-accordion-header-icon-start,.tds-accordion-item button.tds-accordion-header-icon-end{box-sizing:border-box;cursor:pointer;display:flex;align-items:center;width:100%;font:var(--tds-headline-07);letter-spacing:var(--tds-headline-07-ls);padding:var(--tds-spacing-element-16);background-color:var(--tds-accordion-background)}.tds-accordion-item .tds-accordion-header-icon-start *,.tds-accordion-item .tds-accordion-header-icon-end *,.tds-accordion-item button.tds-accordion-header-icon-start *,.tds-accordion-item button.tds-accordion-header-icon-end *{box-sizing:border-box}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon,.tds-accordion-item button.tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item button.tds-accordion-header-icon-end .tds-accordion-icon{transform-origin:center;transition:transform 0.15s ease-in-out;color:var(--tds-accordion-icon-color)}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon>tds-icon,.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon>tds-icon,.tds-accordion-item button.tds-accordion-header-icon-start .tds-accordion-icon>tds-icon,.tds-accordion-item button.tds-accordion-header-icon-end .tds-accordion-icon>tds-icon{display:block}.tds-accordion-item .tds-accordion-title{flex-grow:2}.tds-accordion-item .tds-accordion-panel{cursor:default;padding:var(--tds-spacing-element-8) var(--tds-spacing-layout-64) var(--tds-spacing-element-32) var(--tds-spacing-element-16);display:none;font:var(--tds-detail-03);letter-spacing:var(--tds-detail-03-ls)}.tds-accordion-item .tds-accordion-panel p{margin:0;padding:0}.tds-accordion-item .tds-accordion-panel--padding-reset{padding-right:var(--tds-spacing-element-16)}.tds-accordion-item .tds-accordion-header-icon-end .tds-accordion-icon{margin:0 0 0 var(--tds-spacing-element-32)}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-title{order:1}.tds-accordion-item .tds-accordion-header-icon-start .tds-accordion-icon{order:0;margin:0 var(--tds-spacing-element-16) 0 0}.tds-accordion-item.disabled,.tds-accordion-item.disabled .tds-accordion-header-icon-end,.tds-accordion-item.disabled .tds-accordion-header-icon-start,.tds-accordion-item.disabled .tds-accordion-panel{color:var(--tds-accordion-color-disabled);cursor:not-allowed}.tds-accordion-item.disabled .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-header-icon-end .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-header-icon-start .tds-accordion-icon,.tds-accordion-item.disabled .tds-accordion-panel .tds-accordion-icon{color:var(--tds-accordion-color-disabled)}.tds-accordion-item.disabled:hover,.tds-accordion-item.disabled:hover *,.tds-accordion-item.disabled:active,.tds-accordion-item.disabled:active *,.tds-accordion-item.disabled.active,.tds-accordion-item.disabled.active *{cursor:not-allowed}.tds-accordion-item.disabled:hover .tds-accordion-header-icon-start,.tds-accordion-item.disabled:hover .tds-accordion-header-icon-end,.tds-accordion-item.disabled:active .tds-accordion-header-icon-start,.tds-accordion-item.disabled:active .tds-accordion-header-icon-end,.tds-accordion-item.disabled.active .tds-accordion-header-icon-start,.tds-accordion-item.disabled.active .tds-accordion-header-icon-end{background-color:var(--tds-accordion-bg);outline:none;pointer-events:none}.tds-accordion-item.disabled:hover .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:hover .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled:active .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled:active .tds-accordion-header-icon-end::after,.tds-accordion-item.disabled.active .tds-accordion-header-icon-start::after,.tds-accordion-item.disabled.active .tds-accordion-header-icon-end::after{border-color:transparent}.tds-accordion-item.expanded .tds-accordion-panel{display:block;padding-bottom:31px}.tds-accordion-item.expanded .tds-accordion-icon{transform:rotate(180deg)}.tds-accordion-item.expanded .tds-accordion-header-icon-end .tds-accordion-icon{margin-right:0;margin-left:var(--tds-spacing-element-32)}.tds-accordion-item.expanded .tds-accordion-header-icon-start .tds-accordion-icon{margin-left:0;margin-right:var(--tds-spacing-element-16)}.tds-accordion-item:has(:focus-visible){outline:2px solid var(--tds-focus-outline-color);box-shadow:0 0 0 1px var(--tds-white);outline-offset:1px;z-index:1;z-index:2}.tds-accordion-item[disabled=true]:focus-visible{border-color:var(--tds-accordion-border)}";
 
 const TdsAccordionItem$1 = /*@__PURE__*/ proxyCustomElement(class TdsAccordionItem extends H {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
         this.tdsToggle = createEvent(this, "tdsToggle", 7);
+        /** The header gives users the context about the additional information available inside the panel */
         this.header = '';
+        /** Changes position of the expand icon. */
         this.expandIconPosition = 'end';
+        /** Disabled option in `boolean`. */
         this.disabled = false;
+        /** Set to true to expand panel open */
         this.expanded = false;
+        /** When true, 16px on right padding instead of 64px */
         this.paddingReset = false;
+        /** Specifies the heading level (aria-level) for accessibility. Only accepts values between 1 and 6. */
         this.ariaLevelValue = '6';
     }
     /** Method for toggling the expanded state of the Accordion Item. */
@@ -59,8 +66,8 @@ const TdsAccordionItem$1 = /*@__PURE__*/ proxyCustomElement(class TdsAccordionIt
             ${this.paddingReset ? 'tds-accordion-panel--padding-reset ' : ''}
             ` }, h("slot", { key: '274f9aff706adceb82aea35db3a91494e798ab2c' })))));
     }
-    static get style() { return TdsAccordionItemStyle0; }
-}, [1, "tds-accordion-item", {
+    static get style() { return accordionItemCss; }
+}, [257, "tds-accordion-item", {
         "header": [1],
         "expandIconPosition": [1, "expand-icon-position"],
         "disabled": [4],

package/dist/components/tds-accordion.js

@@ -1,14 +1,17 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
+import { p as proxyCustomElement, H, h, a as Host } from './index.js';
 
 const accordionCss = ":host{display:block;box-sizing:border-box;background-color:transparent}:host *{box-sizing:border-box}:host .tds-accordion-header-icon-start,:host .tds-accordion-header-icon-end{position:relative}:host(:active) .tds-accordion-item .tds-accordion-header-icon-start,:host(:active) .tds-accordion-item .tds-accordion-header-icon-end{background-color:var(--tds-accordion-background-active);outline:none}:host(:active) .disabled,:host(:active) .disabled *{cursor:not-allowed}:host(:active) .disabled .tds-accordion-header-icon-start,:host(:active) .disabled .tds-accordion-header-icon-end{background-color:var(--tds-accordion-bg);outline:none;pointer-events:none}:host(:active) .disabled .tds-accordion-header-icon-start::after,:host(:active) .disabled .tds-accordion-header-icon-end::after{border-color:transparent}:host(:last-child){border-bottom:1px solid var(--tds-accordion-border)}:host(.hide-last-border:last-child){border-bottom:none}:host(.tds-mode-variant-secondary){background-color:var(--tds-accordion-background)}:host(.tds-mode-variant-primary){background-color:var(--tds-accordion-background)}";
-const TdsAccordionStyle0 = accordionCss;
 
 const TdsAccordion$1 = /*@__PURE__*/ proxyCustomElement(class TdsAccordion extends H {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
+        /** Set the variant of the Accordion. */
         this.modeVariant = null;
+        /** Removes the bottom border of the last Accordion item. */
         this.hideLastBorder = false;
     }
     render() {
@@ -18,8 +21,8 @@ const TdsAccordion$1 = /*@__PURE__*/ proxyCustomElement(class TdsAccordion exten
                 'hide-last-border': this.hideLastBorder,
             } }, h("slot", { key: '4dd6d46024e918a3cd5e7594449147a94d07d6a0' })));
     }
-    static get style() { return TdsAccordionStyle0; }
-}, [1, "tds-accordion", {
+    static get style() { return accordionCss; }
+}, [257, "tds-accordion", {
         "modeVariant": [1, "mode-variant"],
         "hideLastBorder": [4, "hide-last-border"]
     }]);

package/dist/components/tds-badge.js

@@ -1,16 +1,21 @@
-import { p as proxyCustomElement, H, h } from './p-28ef5186.js';
+import { p as proxyCustomElement, H, h } from './index.js';
 
 const badgeCss = ":host{--tds-badge-background-color:var(--tds-red-400);--tds-badge-color-text:var(--tds-white);box-sizing:border-box;display:block}:host *{box-sizing:border-box}.tds-badge{display:block;border-radius:12px;background-color:var(--tds-badge-background-color);text-align:center}.tds-badge.tds-badge-sm{height:8px;width:8px;line-height:8px}.tds-badge.tds-badge-lg{height:20px;line-height:20px;width:20px}.tds-badge.tds-badge-pill{display:inline-block;width:unset;padding-left:8px;padding-right:8px}.tds-badge.tds-badge-hidden{display:none}.tds-badge-text{font-size:12px;color:var(--tds-badge-color-text);font-weight:bold}";
-const TdsBadgeStyle0 = badgeCss;
 
 const TdsBadge$1 = /*@__PURE__*/ proxyCustomElement(class TdsBadge extends H {
-    constructor() {
+    constructor(registerHost) {
         super();
-        this.__registerHost();
+        if (registerHost !== false) {
+            this.__registerHost();
+        }
         this.__attachShadow();
+        /** Value shown in Badge */
         this.value = '';
+        /** Changes visibility of Badge */
         this.hidden = false;
+        /** Sets component size. */
         this.size = 'lg';
+        /** Defines aria-live attribute */
         this.tdsAriaLive = 'polite';
         this.tdsAriaLabel = '';
         this.shape = '';
@@ -42,8 +47,8 @@ const TdsBadge$1 = /*@__PURE__*/ proxyCustomElement(class TdsBadge extends H {
         "value": ["watchProps"],
         "size": ["watchProps"]
     }; }
-    static get style() { return TdsBadgeStyle0; }
-}, [1, "tds-badge", {
+    static get style() { return badgeCss; }
+}, [257, "tds-badge", {
         "value": [1],
         "hidden": [516],
         "size": [1],