@scania/tegel 1.47.2 → 1.48.0

package/dist/components/tds-datetime.js

@@ -1,198 +1 @@
-import { p as proxyCustomElement, H, d as createEvent, h } from './p-28ef5186.js';
-import { g as generateUniqueId } from './p-11648030.js';
-import { d as defineCustomElement$2 } from './p-f086ba26.js';
-
-const datetimeCss = "@supports selector(input::-webkit-datetime-edit){.tds-datetime-input.sc-tds-datetime:not(:focus)::-webkit-datetime-edit,.tds-datetime-input-md.sc-tds-datetime:not(:focus)::-webkit-datetime-edit,.tds-datetime-input-sm.sc-tds-datetime:not(:focus)::-webkit-datetime-edit{color:var(--tds-datetime-placeholder-color)}}.tds-datetime-input[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=month].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=month].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=month].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=week].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=week].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=week].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime,.tds-datetime-input-md[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime,.tds-datetime-input-sm[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime{display:none}.tds-datetime-input.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-20) var(--tds-spacing-element-16)}.tds-datetime-input.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-input-md.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.tds-datetime-input-md.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input-md.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input-md.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-input-sm.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.tds-datetime-input-sm.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input-sm.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input-sm.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-container.sc-tds-datetime{border-radius:4px 4px 0 0;display:flex;position:relative;height:56px;box-sizing:border-box;background-color:var(--tds-datetime-background);border-bottom:1px solid var(--tds-datetime-border-bottom);transition:border-bottom-color 200ms ease}.tds-datetime-container.sc-tds-datetime:hover{border-bottom-color:var(--tds-datetime-border-bottom-hover)}.tds-form-datetime-md.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{height:48px}.tds-form-datetime-sm.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{height:40px}.tds-datetime-input-container.sc-tds-datetime{position:relative;width:100%}.tds-datetime-input-container.sc-tds-datetime .datetime-icon.sc-tds-datetime{height:20px;width:20px;position:absolute;top:50%;transform:translateY(-50%);right:18px;pointer-events:none;color:var(--tds-datetime-icon)}.tds-datetime-label.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:block;margin-bottom:var(--tds-spacing-element-8);color:var(--tds-datetime-label-color)}.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);position:absolute;pointer-events:none;color:var(--tds-datetime-label-inside-color);left:16px}.tds-datetime-label-inside.iphone.sc-tds-datetime{left:8px !important}.tds-form-datetime.sc-tds-datetime{display:block;min-width:208px;background:unset}.tds-form-datetime-nomin.sc-tds-datetime{min-width:auto}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime{padding-top:var(--tds-spacing-element-24);padding-bottom:15px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:20px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:16px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:16px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:12px}.tds-datetime-focus.sc-tds-datetime .tds-datetime-input.sc-tds-datetime,.tds-datetime-focus.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime,.tds-datetime-focus.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime{border-radius:0;outline:2px solid var(--tds-focus-outline-color);box-shadow:inset 0 0 0 3px var(--tds-white);outline-offset:-2px;z-index:1}.tds-datetime-focus.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom:none}.tds-datetime-helper.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:block;flex-basis:100%;padding-top:var(--tds-spacing-element-4);color:var(--tds-datetime-helper)}.tds-datetime-helper.sc-tds-datetime .tds-helper.sc-tds-datetime{display:inline-flex;gap:8px}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:transparent}.tds-form-datetime-disabled.sc-tds-datetime .datetime-icon.sc-tds-datetime tds-icon.sc-tds-datetime{color:var(--tds-datetime-icon-disabled)}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-label.sc-tds-datetime{color:var(--tds-datetime-label-disabled);cursor:not-allowed}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-helper.sc-tds-datetime{color:var(--tds-datetime-helper-disabled)}.tds-form-datetime-success.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:var(--tds-datetime-border-bottom-success);color:var(--tds-datetime-color-success)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-helper.sc-tds-datetime{color:var(--tds-datetime-helper-error)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:var(--tds-datetime-border-bottom-error)}.tds-datetime-textcounter.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-datetime-textcounter);float:right}.tds-datetime-textcounter.sc-tds-datetime .tds-datetime-textcounter-divider.sc-tds-datetime{letter-spacing:var(--tds-detail-05-ls);color:var(--tds-datetime-textcounter-divider)}input[type=datetime-local].sc-tds-datetime::-webkit-inner-spin-button,input[type=datetime-local].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=date].sc-tds-datetime::-webkit-inner-spin-button,input[type=date].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=month].sc-tds-datetime::-webkit-inner-spin-button,input[type=month].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=week].sc-tds-datetime::-webkit-inner-spin-button,input[type=week].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=time].sc-tds-datetime::-webkit-inner-spin-button,input[type=time].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}@supports (-moz-appearance: none){.type-datetime-local.sc-tds-datetime .icon-datetime-local.sc-tds-datetime,.type-date.sc-tds-datetime .icon-datetime-local.sc-tds-datetime{display:none}}";
-const TdsDatetimeStyle0 = datetimeCss;
-
-const TdsDatetime$1 = /*@__PURE__*/ proxyCustomElement(class TdsDatetime extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.tdsChange = createEvent(this, "tdsChange", 6);
-        this.tdsBlur = createEvent(this, "tdsBlur", 6);
-        this.tdsFocus = createEvent(this, "tdsFocus", 6);
-        this.tdsInput = createEvent(this, "tdsInput", 6);
-        this.getDefaultValue = () => {
-            const dateTimeObj = {
-                year: this.defaultValue.slice(0, 4),
-                month: this.defaultValue.slice(5, 7),
-                week: this.defaultValue.slice(6, 8),
-                day: this.defaultValue.slice(8, 10),
-                hours: this.defaultValue.slice(11, 13),
-                minutes: this.defaultValue.slice(14, 16),
-            };
-            switch (this.type) {
-                case 'datetime-local':
-                    return `${dateTimeObj.year}-${dateTimeObj.month}-${dateTimeObj.day}T${dateTimeObj.hours}:${dateTimeObj.minutes}`;
-                case 'date':
-                    return `${dateTimeObj.year}-${dateTimeObj.month}-${dateTimeObj.day}`;
-                case 'month':
-                    return `${dateTimeObj.year}-${dateTimeObj.month}`;
-                case 'week':
-                    return `${dateTimeObj.year}-W${dateTimeObj.week}`;
-                case 'time':
-                    return `${this.defaultValue.slice(0, 2)}:${this.defaultValue.slice(3, 5)}`;
-                default:
-                    throw new Error('Invalid type.');
-            }
-        };
-        this.type = 'datetime-local';
-        this.value = '';
-        this.min = undefined;
-        this.max = undefined;
-        this.defaultValue = 'none';
-        this.disabled = false;
-        this.size = 'lg';
-        this.noMinWidth = false;
-        this.modeVariant = null;
-        this.name = `datetime-${generateUniqueId()}`;
-        this.state = undefined;
-        this.autofocus = false;
-        this.label = '';
-        this.labelPosition = 'no-label';
-        this.helper = '';
-        this.tdsAriaLabel = undefined;
-        this.focusInput = false;
-    }
-    /** Method that resets the value of the Datetime, using defaultValue if is not 'none' */
-    async reset() {
-        this.internalReset();
-        this.tdsChange.emit({
-            name: this.name,
-            value: this.value,
-        });
-    }
-    /** Method that sets the value of the datetime element */
-    async setValue(newValue) {
-        this.value = newValue;
-    }
-    /** Method to programmatically focus the datetime element */
-    async focusElement() {
-        if (this.textInput) {
-            this.textInput.focus();
-            this.focusInput = true;
-        }
-    }
-    componentWillLoad() {
-        if (this.defaultValue !== 'none') {
-            this.value = this.getDefaultValue();
-        }
-    }
-    // Listener if input enters focus state
-    handleFocusIn() {
-        this.focusInput = true;
-    }
-    // Listener if input leaves focus state
-    handleFocusOut() {
-        this.focusInput = false;
-    }
-    // Data input event in value prop
-    handleInput(e) {
-        this.value = e.target.value;
-        this.tdsInput.emit(e);
-    }
-    // Change event isn't a composed:true by default in for input
-    handleChange(e) {
-        this.tdsChange.emit(e);
-    }
-    /** Set the input as focus when clicking the whole Datetime with suffix/prefix */
-    handleFocusClick(e) {
-        this.textInput.focus();
-        this.tdsFocus.emit(e);
-    }
-    /** Set the input as focus when clicking the whole Datetime with suffix/prefix */
-    handleBlur(e) {
-        this.textInput.blur();
-        this.tdsBlur.emit(e);
-    }
-    /** Method that resets the dateteime without emitting an event. */
-    internalReset() {
-        const value = '';
-        if (this.defaultValue !== 'none') {
-            this.value = this.getDefaultValue();
-        }
-        this.value = value;
-    }
-    render() {
-        let className = ' tds-datetime-input';
-        if (this.size === 'md') {
-            className += `${className}-md`;
-        }
-        if (this.size === 'sm') {
-            className += `${className}-sm`;
-        }
-        const classNames = {
-            'tds-form-datetime-nomin': this.noMinWidth,
-            'tds-form-datetime': true,
-            'tds-datetime-focus': this.focusInput,
-            'tds-datetime-data': this.value.length > 0,
-            'tds-form-datetime-disabled': this.disabled,
-            [`tds-form-datetime-${this.size}`]: ['md', 'sm'].includes(this.size),
-            [`tds-form-datetime-${this.state}`]: ['error', 'success'].includes(`${this.state}`),
-            [`tds-mode-variant-${this.modeVariant}`]: this.modeVariant !== null,
-            'tds-datetime-container-label-inside': !!(this.label &&
-                this.labelPosition === 'inside' &&
-                this.size !== 'sm'),
-        };
-        const iphone = navigator.userAgent.toLowerCase().includes('iphone');
-        return (h("div", { key: '93ab9dfbf3fc5a894153be95e9dd0a2b6010efaf', class: classNames, onKeyDown: (e) => {
-                if (e.key === 'Enter') {
-                    const browserIsChrome = navigator.userAgent.toLowerCase().includes('chrome');
-                    if (browserIsChrome) {
-                        // showPicker currently only works reliably for date inputs in Chrome and Chromium-based browsers:
-                        this.textInput.showPicker();
-                    }
-                }
-            } }, this.labelPosition === 'outside' && this.label && (h("label", { key: '151fe0fca5e68938f8f0e466e415d301460bcfb9', htmlFor: this.name, class: "tds-datetime-label" }, this.label)), h("div", { key: '0f279f40278ed65077f17c8ff18963e6d9b22e33', onClick: (e) => this.handleFocusClick(e), class: "tds-datetime-container" }, h("div", { key: 'b0b178d3ee9511ba315f63468061738810fc99e8', class: `tds-datetime-input-container type-${this.type}` }, h("input", { key: '9d09571d4175dcd45ea5a6303855328633b4e2d5', ref: (inputEl) => {
-                if (inputEl)
-                    this.textInput = inputEl;
-            }, class: className, type: this.type, disabled: this.disabled, value: this.value, min: this.min, max: this.max, autofocus: this.autofocus, name: this.name, id: this.name, onInput: (e) => this.handleInput(e), onBlur: (e) => this.handleBlur(e), onChange: (e) => this.handleChange(e), "aria-label": this.tdsAriaLabel ? this.tdsAriaLabel : this.label }), this.labelPosition === 'inside' && this.size !== 'sm' && this.label && (h("label", { key: '8c8bf84bf5fde6e08ca7af7d24416379e6fcebee', class: `tds-datetime-label-inside ${iphone && 'iphone'}`, htmlFor: this.name }, this.label)), h("div", { key: 'bffbf411853315e978d570c44b054f4022ed4156', class: "datetime-icon icon-datetime-local" }, h("tds-icon", { key: '885003370261c85dce5d4840ee3e49bee89f08e5', size: "20px", name: "calendar", svgTitle: "Calendar" })), h("div", { key: '62bca8062e7f1b20b89c835811b98311f501d7da', class: "datetime-icon icon-time" }, h("tds-icon", { key: '77a628ba22fdefe08eed75acaee382f0485ca22d', size: "20px", name: "clock", svgTitle: "Clock" })))), this.helper && (h("div", { key: '3cf041a3d939c96e295bdc83346d038d33336a39', class: "tds-datetime-helper" }, h("div", { key: 'ccdd8ed7ab2ab4a91f4ac699e1fe964234e4db4a', class: "tds-helper" }, this.state === 'error' && h("tds-icon", { key: '509f40f17e1ccec720cacc4863e50cc63e5a4802', name: "error", size: "16px", svgTitle: "error" }), this.helper)))));
-    }
-    static get style() { return TdsDatetimeStyle0; }
-}, [2, "tds-datetime", {
-        "type": [513],
-        "value": [1537],
-        "min": [1],
-        "max": [1],
-        "defaultValue": [1, "default-value"],
-        "disabled": [4],
-        "size": [1],
-        "noMinWidth": [4, "no-min-width"],
-        "modeVariant": [1, "mode-variant"],
-        "name": [1],
-        "state": [1],
-        "autofocus": [4],
-        "label": [1],
-        "labelPosition": [1, "label-position"],
-        "helper": [1],
-        "tdsAriaLabel": [1, "tds-aria-label"],
-        "focusInput": [32],
-        "reset": [64],
-        "setValue": [64],
-        "focusElement": [64]
-    }, [[0, "focusin", "handleFocusIn"], [0, "focusout", "handleFocusOut"]]]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["tds-datetime", "tds-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "tds-datetime":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, TdsDatetime$1);
-            }
-            break;
-        case "tds-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-defineCustomElement$1();
-
-const TdsDatetime = TdsDatetime$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { TdsDatetime, defineCustomElement };
+import{t,p as e,H as d,c as i,h as s}from"./index.js";import{g as a}from"./p-Cn4f8w1e.js";import{d as o}from"./p-C0fx1H4h.js";const m=e(class extends d{constructor(t){super(),!1!==t&&this.__registerHost(),this.tdsChange=i(this,"tdsChange",6),this.tdsBlur=i(this,"tdsBlur",6),this.tdsFocus=i(this,"tdsFocus",6),this.tdsInput=i(this,"tdsInput",6),this.type="datetime-local",this.value="",this.defaultValue="none",this.disabled=!1,this.size="lg",this.noMinWidth=!1,this.modeVariant=null,this.name="datetime-"+a(),this.autofocus=!1,this.label="",this.labelPosition="no-label",this.helper="",this.focusInput=!1,this.getDefaultValue=()=>{const t=this.defaultValue.slice(0,4),e=this.defaultValue.slice(5,7),d=this.defaultValue.slice(6,8),i=this.defaultValue.slice(8,10),s=this.defaultValue.slice(11,13),a=this.defaultValue.slice(14,16);switch(this.type){case"datetime-local":return`${t}-${e}-${i}T${s}:${a}`;case"date":return`${t}-${e}-${i}`;case"month":return`${t}-${e}`;case"week":return`${t}-W${d}`;case"time":return`${this.defaultValue.slice(0,2)}:${this.defaultValue.slice(3,5)}`;default:throw Error("Invalid type.")}}}async reset(){this.internalReset(),this.tdsChange.emit({name:this.name,value:this.value})}async setValue(t){this.value=t}async focusElement(){this.textInput&&(this.textInput.focus(),this.focusInput=!0)}componentWillLoad(){"none"!==this.defaultValue&&(this.value=this.getDefaultValue())}handleFocusIn(){this.focusInput=!0}handleFocusOut(){this.focusInput=!1}handleInput(t){this.value=t.target.value,this.tdsInput.emit(t)}handleChange(t){this.tdsChange.emit(t)}handleFocusClick(t){this.textInput.focus(),this.tdsFocus.emit(t)}handleBlur(t){this.textInput.blur(),this.tdsBlur.emit(t)}internalReset(){"none"!==this.defaultValue&&(this.value=this.getDefaultValue()),this.value=""}render(){let t=" tds-datetime-input";"md"===this.size&&(t+=t+"-md"),"sm"===this.size&&(t+=t+"-sm");const e={"tds-form-datetime-nomin":this.noMinWidth,"tds-form-datetime":!0,"tds-datetime-focus":this.focusInput,"tds-datetime-data":this.value.length>0,"tds-form-datetime-disabled":this.disabled,["tds-form-datetime-"+this.size]:["md","sm"].includes(this.size),["tds-form-datetime-"+this.state]:["error","success"].includes(""+this.state),["tds-mode-variant-"+this.modeVariant]:null!==this.modeVariant,"tds-datetime-container-label-inside":!(!this.label||"inside"!==this.labelPosition||"sm"===this.size)},d=navigator.userAgent.toLowerCase().includes("iphone");return s("div",{key:"93ab9dfbf3fc5a894153be95e9dd0a2b6010efaf",class:e,onKeyDown:t=>{"Enter"===t.key&&navigator.userAgent.toLowerCase().includes("chrome")&&this.textInput.showPicker()}},"outside"===this.labelPosition&&this.label&&s("label",{key:"151fe0fca5e68938f8f0e466e415d301460bcfb9",htmlFor:this.name,class:"tds-datetime-label"},this.label),s("div",{key:"0f279f40278ed65077f17c8ff18963e6d9b22e33",onClick:t=>this.handleFocusClick(t),class:"tds-datetime-container"},s("div",{key:"b0b178d3ee9511ba315f63468061738810fc99e8",class:"tds-datetime-input-container type-"+this.type},s("input",{key:"9d09571d4175dcd45ea5a6303855328633b4e2d5",ref:t=>{t&&(this.textInput=t)},class:t,type:this.type,disabled:this.disabled,value:this.value,min:this.min,max:this.max,autofocus:this.autofocus,name:this.name,id:this.name,onInput:t=>this.handleInput(t),onBlur:t=>this.handleBlur(t),onChange:t=>this.handleChange(t),"aria-label":this.tdsAriaLabel?this.tdsAriaLabel:this.label}),"inside"===this.labelPosition&&"sm"!==this.size&&this.label&&s("label",{key:"8c8bf84bf5fde6e08ca7af7d24416379e6fcebee",class:"tds-datetime-label-inside "+(d&&"iphone"),htmlFor:this.name},this.label),s("div",{key:"bffbf411853315e978d570c44b054f4022ed4156",class:"datetime-icon icon-datetime-local"},s("tds-icon",{key:"885003370261c85dce5d4840ee3e49bee89f08e5",size:"20px",name:"calendar",svgTitle:"Calendar"})),s("div",{key:"62bca8062e7f1b20b89c835811b98311f501d7da",class:"datetime-icon icon-time"},s("tds-icon",{key:"77a628ba22fdefe08eed75acaee382f0485ca22d",size:"20px",name:"clock",svgTitle:"Clock"})))),this.helper&&s("div",{key:"3cf041a3d939c96e295bdc83346d038d33336a39",class:"tds-datetime-helper"},s("div",{key:"ccdd8ed7ab2ab4a91f4ac699e1fe964234e4db4a",class:"tds-helper"},"error"===this.state&&s("tds-icon",{key:"509f40f17e1ccec720cacc4863e50cc63e5a4802",name:"error",size:"16px",svgTitle:"error"}),this.helper)))}static get style(){return"@supports selector(input::-webkit-datetime-edit){.tds-datetime-input.sc-tds-datetime:not(:focus)::-webkit-datetime-edit,.tds-datetime-input-md.sc-tds-datetime:not(:focus)::-webkit-datetime-edit,.tds-datetime-input-sm.sc-tds-datetime:not(:focus)::-webkit-datetime-edit{color:var(--tds-datetime-placeholder-color)}}.tds-datetime-input[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=datetime-local].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=date].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=month].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=month].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=month].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=week].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-md[type=week].sc-tds-datetime~.icon-time.sc-tds-datetime,.tds-datetime-input-sm[type=week].sc-tds-datetime~.icon-time.sc-tds-datetime{display:none}.tds-datetime-input[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime,.tds-datetime-input-md[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime,.tds-datetime-input-sm[type=time].sc-tds-datetime~.icon-datetime-local.sc-tds-datetime{display:none}.tds-datetime-input.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-20) var(--tds-spacing-element-16)}.tds-datetime-input.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-input-md.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.tds-datetime-input-md.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input-md.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input-md.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-input-sm.sc-tds-datetime{box-sizing:border-box;border-radius:4px 4px 0 0;width:100%;box-sizing:border-box;margin:0;border:none;outline:none;height:100%;color:var(--tds-datetime-color);background-color:var(--tds-datetime-background);font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);padding:var(--tds-spacing-element-16)}.tds-datetime-input-sm.sc-tds-datetime *.sc-tds-datetime{box-sizing:border-box}.tds-datetime-input-sm.sc-tds-datetime:disabled{background-color:var(--tds-datetime-background-disabled);color:var(--tds-datetime-color-disabled);cursor:not-allowed}.tds-datetime-input-sm.sc-tds-datetime:disabled~.tds-datetime-label-inside.sc-tds-datetime{color:var(--tds-datetime-label-disabled)}.tds-datetime-container.sc-tds-datetime{border-radius:4px 4px 0 0;display:flex;position:relative;height:56px;box-sizing:border-box;background-color:var(--tds-datetime-background);border-bottom:1px solid var(--tds-datetime-border-bottom);transition:border-bottom-color 200ms ease}.tds-datetime-container.sc-tds-datetime:hover{border-bottom-color:var(--tds-datetime-border-bottom-hover)}.tds-form-datetime-md.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{height:48px}.tds-form-datetime-sm.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{height:40px}.tds-datetime-input-container.sc-tds-datetime{position:relative;width:100%}.tds-datetime-input-container.sc-tds-datetime .datetime-icon.sc-tds-datetime{height:20px;width:20px;position:absolute;top:50%;transform:translateY(-50%);right:18px;pointer-events:none;color:var(--tds-datetime-icon)}.tds-datetime-label.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:block;margin-bottom:var(--tds-spacing-element-8);color:var(--tds-datetime-label-color)}.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-02);letter-spacing:var(--tds-detail-02-ls);position:absolute;pointer-events:none;color:var(--tds-datetime-label-inside-color);left:16px}.tds-datetime-label-inside.iphone.sc-tds-datetime{left:8px !important}.tds-form-datetime.sc-tds-datetime{display:block;min-width:208px;background:unset}.tds-form-datetime-nomin.sc-tds-datetime{min-width:auto}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime{padding-top:var(--tds-spacing-element-24);padding-bottom:15px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:20px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:16px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime{padding-top:var(--tds-spacing-element-20);padding-bottom:11px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{top:16px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:8px}.tds-form-datetime.tds-datetime-container-label-inside.sc-tds-datetime .tds-datetime-input.sc-tds-datetime~.tds-datetime-label-inside.sc-tds-datetime{font:var(--tds-detail-07);letter-spacing:var(--tds-detail-07-ls);transition:0.1s ease all;top:12px}.tds-datetime-focus.sc-tds-datetime .tds-datetime-input.sc-tds-datetime,.tds-datetime-focus.sc-tds-datetime .tds-datetime-input-md.sc-tds-datetime,.tds-datetime-focus.sc-tds-datetime .tds-datetime-input-sm.sc-tds-datetime{border-radius:0;outline:2px solid var(--tds-focus-outline-color);box-shadow:inset 0 0 0 3px var(--tds-white);outline-offset:-2px;z-index:1}.tds-datetime-focus.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom:none}.tds-datetime-helper.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);display:block;flex-basis:100%;padding-top:var(--tds-spacing-element-4);color:var(--tds-datetime-helper)}.tds-datetime-helper.sc-tds-datetime .tds-helper.sc-tds-datetime{display:inline-flex;gap:8px}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:transparent}.tds-form-datetime-disabled.sc-tds-datetime .datetime-icon.sc-tds-datetime tds-icon.sc-tds-datetime{color:var(--tds-datetime-icon-disabled)}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-label.sc-tds-datetime{color:var(--tds-datetime-label-disabled);cursor:not-allowed}.tds-form-datetime-disabled.sc-tds-datetime .tds-datetime-helper.sc-tds-datetime{color:var(--tds-datetime-helper-disabled)}.tds-form-datetime-success.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:var(--tds-datetime-border-bottom-success);color:var(--tds-datetime-color-success)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-helper.sc-tds-datetime{color:var(--tds-datetime-helper-error)}.tds-form-datetime-error.sc-tds-datetime .tds-datetime-container.sc-tds-datetime{border-bottom-color:var(--tds-datetime-border-bottom-error)}.tds-datetime-textcounter.sc-tds-datetime{font:var(--tds-detail-05);letter-spacing:var(--tds-detail-05-ls);color:var(--tds-datetime-textcounter);float:right}.tds-datetime-textcounter.sc-tds-datetime .tds-datetime-textcounter-divider.sc-tds-datetime{letter-spacing:var(--tds-detail-05-ls);color:var(--tds-datetime-textcounter-divider)}input[type=datetime-local].sc-tds-datetime::-webkit-inner-spin-button,input[type=datetime-local].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=date].sc-tds-datetime::-webkit-inner-spin-button,input[type=date].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=month].sc-tds-datetime::-webkit-inner-spin-button,input[type=month].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=week].sc-tds-datetime::-webkit-inner-spin-button,input[type=week].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}input[type=time].sc-tds-datetime::-webkit-inner-spin-button,input[type=time].sc-tds-datetime::-webkit-calendar-picker-indicator{opacity:0}@supports (-moz-appearance: none){.type-datetime-local.sc-tds-datetime .icon-datetime-local.sc-tds-datetime,.type-date.sc-tds-datetime .icon-datetime-local.sc-tds-datetime{display:none}}"}},[2,"tds-datetime",{type:[513],value:[1537],min:[1],max:[1],defaultValue:[1,"default-value"],disabled:[4],size:[1],noMinWidth:[4,"no-min-width"],modeVariant:[1,"mode-variant"],name:[1],state:[1],autofocus:[4],label:[1],labelPosition:[1,"label-position"],helper:[1],tdsAriaLabel:[1,"tds-aria-label"],focusInput:[32],reset:[64],setValue:[64],focusElement:[64]},[[0,"focusin","handleFocusIn"],[0,"focusout","handleFocusOut"]]]);function n(){"undefined"!=typeof customElements&&["tds-datetime","tds-icon"].forEach((e=>{switch(e){case"tds-datetime":customElements.get(t(e))||customElements.define(t(e),m);break;case"tds-icon":customElements.get(t(e))||o()}}))}n();const c=m,r=n;export{c as TdsDatetime,r as defineCustomElement}

package/dist/components/tds-divider.js

@@ -1,6 +1 @@
-import { D as Divider, d as defineCustomElement$1 } from './p-381677ec.js';
-
-const TdsDivider = Divider;
-const defineCustomElement = defineCustomElement$1;
-
-export { TdsDivider, defineCustomElement };
+import{D as o,d as r}from"./p-MrnWQiwK.js";const s=o,p=r;export{s as TdsDivider,p as defineCustomElement}

package/dist/components/tds-dropdown-option.js

@@ -1,6 +1 @@
-import { T as TdsDropdownOption$1, d as defineCustomElement$1 } from './p-ae4ca8c3.js';
-
-const TdsDropdownOption = TdsDropdownOption$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { TdsDropdownOption, defineCustomElement };
+import{T as o,d as s}from"./p-BfVaBQQ6.js";const a=o,p=s;export{a as TdsDropdownOption,p as defineCustomElement}

package/dist/components/tds-dropdown.js

@@ -1,6 +1 @@
-import { T as TdsDropdown$1, d as defineCustomElement$1 } from './p-871223b7.js';
-
-const TdsDropdown = TdsDropdown$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { TdsDropdown, defineCustomElement };
+import{T as o,d as s}from"./p-Civ53ZSy.js";const p=o,r=s;export{p as TdsDropdown,r as defineCustomElement}

package/dist/components/tds-folder-tab.js

@@ -1,74 +1 @@
-import { p as proxyCustomElement, H, h, c as Host } from './p-28ef5186.js';
-
-const folderTabCss = ":host{box-sizing:border-box;position:relative}:host *{box-sizing:border-box}:host ::slotted(*){all:unset;min-width:142px;display:block;width:calc(100% - 32px);font:var(--tds-headline-07) !important;letter-spacing:var(--tds-headline-07-ls) !important;cursor:pointer;padding:16px;white-space:nowrap;text-decoration:none;text-align:left;outline:none;border:none}:host ::slotted(*:focus-within)::before{outline:2px solid var(--tds-focus-outline-color);box-shadow:0 0 0 1px var(--tds-white);outline-offset:1px;z-index:1;content:\"\";position:absolute;top:3px;bottom:3px;left:3px;right:3px}:host div:not(.selected){background-color:var(--tds-folder-tab-background);position:relative}:host div:not(.selected)::before{content:\"\";position:absolute;left:0;top:0;bottom:0;width:1px;background-color:var(--tds-folder-tab-divider-color)}:host div:not(.selected) ::slotted(*){border-top:2px solid transparent;color:var(--tds-folder-tab-item-color)}:host div:not(.selected):hover:not(.disabled){background-color:var(--tds-folder-tab-background-hover);cursor:pointer}:host div:not(.selected):hover:not(.disabled) ::slotted(*){border-top:2px solid var(--tds-folder-tab-top-border-hover);color:var(--tds-folder-tab-color)}:host div:not(.selected).disabled{background-color:var(--tds-folder-tab-item-background-disabled)}:host div:not(.selected).disabled ::slotted(*){color:var(--tds-folder-tab-item-color-disabled)}:host div:not(.selected).disabled ::slotted(*:focus-visible){outline:none}:host div:not(.selected).disabled ::slotted(*:hover){cursor:not-allowed}:host div:not(.selected).disabled ::slotted(*::after){content:none}:host .selected{background-color:var(--tds-folder-tab-background-selected);border-top:2px solid var(--tds-folder-tab-border-selected)}:host .selected::after{content:\" \";background-color:var(--tds-folder-tab-divider-color);width:1px;top:0;bottom:0;right:-1px;display:block;position:absolute;z-index:1}:host .selected ::slotted(*){color:var(--tds-folder-tab-color)}:host .selected:hover:not(.disabled){background-color:var(--tds-folder-tab-background-hover);cursor:pointer}:host .selected:hover:not(.disabled) ::slotted(*){color:var(--tds-folder-tab-color)}:host(.first) ::slotted(*){border-left-color:transparent}:host(.first) .selected{border-left:none}";
-const TdsFolderTabStyle0 = folderTabCss;
-
-const TdsFolderTab$1 = /*@__PURE__*/ proxyCustomElement(class TdsFolderTab extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.disabled = false;
-        this.selected = false;
-        this.tabWidth = undefined;
-    }
-    /** @internal Method to set the width of the tab. Used by the <tds-folder-tabs> */
-    async setTabWidth(width) {
-        this.tabWidth = width;
-    }
-    /** @internal Method to set the tab as selected. Used by the <tds-folder-tabs> */
-    async setSelected(selected) {
-        this.selected = selected;
-    }
-    connectedCallback() {
-        const elements = this.host.querySelectorAll('button, a');
-        for (let index = 0; index < elements.length; index++) {
-            const element = elements[index];
-            if (!element.getAttribute('aria-controls')) {
-                console.warn('Tegel folder-tab component: Interactive elements should have aria-controls attribute to link the tab to its corresponding panel');
-            }
-            if (element.getAttribute('role') !== 'tab') {
-                console.warn('Tegel folder-tab component: Interactive elements should have attribute role="tab"');
-            }
-            if (this.disabled) {
-                element.setAttribute('aria-disabled', 'true');
-            }
-            else {
-                element.removeAttribute('aria-disabled');
-            }
-        }
-    }
-    render() {
-        return (h(Host, { key: '4a695d366a2e8e8e5b11b76f4be517c348e55c5b', "aria-selected": this.selected }, h("div", { key: 'b5dc85bc80aede911238d245d41b06ba82143c47', class: {
-                selected: this.selected,
-                disabled: this.disabled,
-            }, style: { width: `${this.tabWidth}px` } }, h("slot", { key: 'a3c58caf8081862b9b89052f30e7100493ea0985' }))));
-    }
-    get host() { return this; }
-    static get style() { return TdsFolderTabStyle0; }
-}, [1, "tds-folder-tab", {
-        "disabled": [4],
-        "selected": [32],
-        "tabWidth": [32],
-        "setTabWidth": [64],
-        "setSelected": [64]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["tds-folder-tab"];
-    components.forEach(tagName => { switch (tagName) {
-        case "tds-folder-tab":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, TdsFolderTab$1);
-            }
-            break;
-    } });
-}
-defineCustomElement$1();
-
-const TdsFolderTab = TdsFolderTab$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { TdsFolderTab, defineCustomElement };
+import{t,p as e,H as o,h as d,a as s}from"./index.js";const r=e(class extends o{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.disabled=!1,this.selected=!1}async setTabWidth(t){this.tabWidth=t}async setSelected(t){this.selected=t}connectedCallback(){const t=this.host.querySelectorAll("button, a");for(let e=0;e<t.length;e++){const o=t[e];o.getAttribute("aria-controls")||console.warn("Tegel folder-tab component: Interactive elements should have aria-controls attribute to link the tab to its corresponding panel"),"tab"!==o.getAttribute("role")&&console.warn('Tegel folder-tab component: Interactive elements should have attribute role="tab"'),this.disabled?o.setAttribute("aria-disabled","true"):o.removeAttribute("aria-disabled")}}render(){return d(s,{key:"4a695d366a2e8e8e5b11b76f4be517c348e55c5b","aria-selected":this.selected},d("div",{key:"b5dc85bc80aede911238d245d41b06ba82143c47",class:{selected:this.selected,disabled:this.disabled},style:{width:this.tabWidth+"px"}},d("slot",{key:"a3c58caf8081862b9b89052f30e7100493ea0985"})))}get host(){return this}static get style(){return':host{box-sizing:border-box;position:relative}:host *{box-sizing:border-box}:host ::slotted(*){all:unset;min-width:142px;display:block;width:calc(100% - 32px);font:var(--tds-headline-07) !important;letter-spacing:var(--tds-headline-07-ls) !important;cursor:pointer;padding:16px;white-space:nowrap;text-decoration:none;text-align:left;outline:none;border:none}:host ::slotted(*:focus-within)::before{outline:2px solid var(--tds-focus-outline-color);box-shadow:0 0 0 1px var(--tds-white);outline-offset:1px;z-index:1;content:"";position:absolute;top:3px;bottom:3px;left:3px;right:3px}:host div:not(.selected){background-color:var(--tds-folder-tab-background);position:relative}:host div:not(.selected)::before{content:"";position:absolute;left:0;top:0;bottom:0;width:1px;background-color:var(--tds-folder-tab-divider-color)}:host div:not(.selected) ::slotted(*){border-top:2px solid transparent;color:var(--tds-folder-tab-item-color)}:host div:not(.selected):hover:not(.disabled){background-color:var(--tds-folder-tab-background-hover);cursor:pointer}:host div:not(.selected):hover:not(.disabled) ::slotted(*){border-top:2px solid var(--tds-folder-tab-top-border-hover);color:var(--tds-folder-tab-color)}:host div:not(.selected).disabled{background-color:var(--tds-folder-tab-item-background-disabled)}:host div:not(.selected).disabled ::slotted(*){color:var(--tds-folder-tab-item-color-disabled)}:host div:not(.selected).disabled ::slotted(*:focus-visible){outline:none}:host div:not(.selected).disabled ::slotted(*:hover){cursor:not-allowed}:host div:not(.selected).disabled ::slotted(*::after){content:none}:host .selected{background-color:var(--tds-folder-tab-background-selected);border-top:2px solid var(--tds-folder-tab-border-selected)}:host .selected::after{content:" ";background-color:var(--tds-folder-tab-divider-color);width:1px;top:0;bottom:0;right:-1px;display:block;position:absolute;z-index:1}:host .selected ::slotted(*){color:var(--tds-folder-tab-color)}:host .selected:hover:not(.disabled){background-color:var(--tds-folder-tab-background-hover);cursor:pointer}:host .selected:hover:not(.disabled) ::slotted(*){color:var(--tds-folder-tab-color)}:host(.first) ::slotted(*){border-left-color:transparent}:host(.first) .selected{border-left:none}'}},[257,"tds-folder-tab",{disabled:[4],selected:[32],tabWidth:[32],setTabWidth:[64],setSelected:[64]}]);function l(){"undefined"!=typeof customElements&&["tds-folder-tab"].forEach((e=>{"tds-folder-tab"===e&&(customElements.get(t(e))||customElements.define(t(e),r))}))}l();const a=r,i=l;export{a as TdsFolderTab,i as defineCustomElement}

package/dist/components/tds-folder-tabs.js

@@ -1,228 +1 @@
-import { p as proxyCustomElement, H, d as createEvent, h, c as Host } from './p-28ef5186.js';
-import { d as defineCustomElement$2 } from './p-f086ba26.js';
-
-const folderTabsCss = ":host{box-sizing:border-box;overflow:hidden;outline:0}:host *{box-sizing:border-box}:host .wrapper{display:flex;overflow-x:scroll;scrollbar-width:none;position:relative}:host .wrapper::-webkit-scrollbar{display:none}:host .scroll-right-button{z-index:1;right:0}:host .scroll-left-button{z-index:1;left:0}:host .scroll-right-button,:host .scroll-left-button{height:50px;color:var(--tds-folder-tabs-scroll-btn-color);cursor:pointer;border:0;width:0;background-color:var(--tds-folder-tabs-scroll-btn-background);display:none;justify-content:center;align-items:center;opacity:0;pointer-events:none;position:sticky}:host .scroll-right-button.show,:host .scroll-left-button.show{min-width:48px;display:block;opacity:1;pointer-events:all}:host .scroll-right-button:hover,:host .scroll-left-button:hover{background-color:var(--tds-folder-tabs-scroll-btn-background-hover)}:host .scroll-right-button:active,:host .scroll-left-button:active{background-color:var(--tds-folder-tabs-scroll-btn-background-active)}:host .scroll-right-button:focus-within::before,:host .scroll-left-button:focus-within::before{outline:2px solid var(--tds-focus-outline-color);box-shadow:0 0 0 1px var(--tds-white);outline-offset:1px;z-index:1;content:\"\";position:absolute;top:3px;bottom:3px;left:3px;right:3px}:host .scroll-right-button:focus,:host .scroll-left-button:focus{outline:0}:host .scroll-right-button svg,:host .scroll-left-button svg{fill:var(--tds-folder-tabs-scroll-btn-color)}";
-const TdsFolderTabsStyle0 = folderTabsCss;
-
-const TdsFolderTabs$1 = /*@__PURE__*/ proxyCustomElement(class TdsFolderTabs extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.tdsChange = createEvent(this, "tdsChange", 7);
-        this.navWrapperElement = null; // reference to container with nav buttons
-        this.componentWidth = 0; // visible width of this component
-        this.buttonsWidth = 0; // total width of all nav items combined
-        this.scrollWidth = 0; // total amount that is possible to scroll in the nav wrapper
-        this.children = [];
-        this.clickHandlers = new WeakMap();
-        this.addResizeObserver = () => {
-            const resizeObserver = new ResizeObserver((entries) => {
-                entries.forEach((entry) => {
-                    const componentWidth = entry.contentRect.width;
-                    let buttonsWidth = 0;
-                    const navButtons = Array.from(this.host.children);
-                    navButtons.forEach((navButton) => {
-                        const style = window.getComputedStyle(navButton);
-                        buttonsWidth +=
-                            navButton.clientWidth + parseFloat(style.marginLeft) + parseFloat(style.marginRight);
-                    });
-                    this.componentWidth = componentWidth;
-                    this.buttonsWidth = buttonsWidth;
-                    this.scrollWidth = buttonsWidth - componentWidth;
-                    this.updateScrollButtons();
-                });
-            });
-            if (this.navWrapperElement)
-                resizeObserver.observe(this.navWrapperElement);
-        };
-        this.addEventListenerToTabs = () => {
-            this.children = Array.from(this.host.children);
-            this.children.map((item, index) => {
-                const clickHandler = () => {
-                    if (!item.disabled) {
-                        const tdsChangeEvent = this.tdsChange.emit({
-                            selectedTabIndex: this.children.indexOf(item),
-                        });
-                        if (!tdsChangeEvent.defaultPrevented) {
-                            this.children.forEach((element) => element.setSelected(false));
-                            item.setSelected(true);
-                            this.selectedIndex = index;
-                        }
-                    }
-                };
-                item.addEventListener('click', clickHandler);
-                this.clickHandlers.set(item, clickHandler); // Store the handler in WeakMap
-                return item;
-            });
-        };
-        this.removeEventListenerFromTabs = () => {
-            this.children.forEach((item) => {
-                const clickHandler = this.clickHandlers.get(item);
-                if (clickHandler) {
-                    item.removeEventListener('click', clickHandler);
-                    this.clickHandlers.delete(item);
-                }
-            });
-        };
-        this.modeVariant = null;
-        this.defaultSelectedIndex = 0;
-        this.selectedIndex = undefined;
-        this.tdsScrollLeftAriaLabel = 'Scroll left';
-        this.tdsScrollRightAriaLabel = 'Scroll right';
-        this.buttonWidth = 0;
-        this.showLeftScroll = false;
-        this.showRightScroll = false;
-    }
-    /** Sets the passed tabindex as the selected Tab. */
-    async selectTab(tabIndex) {
-        if (tabIndex < 0 || tabIndex >= this.children.length) {
-            throw new Error('Tab index out of bounds');
-        }
-        if (!this.children[tabIndex].disabled) {
-            this.children.forEach((element) => element.setSelected(false));
-            this.children = this.children.map((element, index) => {
-                if (index === tabIndex) {
-                    element.setSelected(true);
-                    this.selectedIndex = tabIndex;
-                }
-                return element;
-            });
-        }
-        return { selectedTabIndex: this.selectedIndex };
-    }
-    /** Reinitializes the component. */
-    async reinitialize() {
-        this.handleSlotChange();
-    }
-    handleSelectedIndexUpdate() {
-        const tabs = Array.from(this.host.children);
-        this.children = tabs.map((tabElement) => {
-            tabElement.setSelected(false);
-            return tabElement;
-        });
-        if (this.selectedIndex) {
-            this.children[this.selectedIndex].setSelected(true);
-        }
-    }
-    scrollRight() {
-        if (!this.navWrapperElement)
-            return;
-        const scroll = this.navWrapperElement.scrollLeft;
-        this.navWrapperElement.scrollLeft = scroll + this.buttonsWidth;
-        this.evaluateScrollButtons();
-    }
-    scrollLeft() {
-        if (!this.navWrapperElement)
-            return;
-        const scroll = this.navWrapperElement.scrollLeft;
-        this.navWrapperElement.scrollLeft = scroll - this.buttonsWidth;
-        this.evaluateScrollButtons();
-    }
-    evaluateScrollButtons() {
-        if (!this.navWrapperElement)
-            return;
-        const scroll = this.navWrapperElement.scrollLeft;
-        this.showRightScroll = scroll <= this.scrollWidth;
-        this.showLeftScroll = scroll > 0;
-    }
-    initializeTabs() {
-        this.children = Array.from(this.host.children);
-        // remove first and last class from other tabs in case of initialization
-        this.children.forEach((child) => {
-            child.classList.remove('last');
-            child.classList.remove('first');
-        });
-        this.children[0].classList.add('first');
-        this.children[this.children.length - 1].classList.add('last');
-    }
-    initializeSelectedTab() {
-        if (this.selectedIndex === undefined) {
-            this.addEventListenerToTabs();
-            this.children[this.defaultSelectedIndex].setSelected(true);
-            this.selectedIndex = this.defaultSelectedIndex;
-        }
-        else {
-            this.children[this.selectedIndex].setSelected(true);
-        }
-        this.tdsChange.emit({
-            selectedTabIndex: this.selectedIndex,
-        });
-    }
-    updateScrollButtons() {
-        if (this.buttonsWidth > this.componentWidth) {
-            this.evaluateScrollButtons();
-        }
-        else {
-            this.showLeftScroll = false;
-            this.showRightScroll = false;
-        }
-    }
-    handleSlotChange() {
-        this.initializeTabs();
-        this.addEventListenerToTabs();
-        this.initializeSelectedTab();
-        this.updateScrollButtons();
-        this.addResizeObserver();
-    }
-    connectedCallback() {
-        this.initializeTabs();
-    }
-    componentDidLoad() {
-        this.initializeSelectedTab();
-    }
-    componentDidRender() {
-        this.updateScrollButtons();
-        this.addResizeObserver();
-    }
-    disconnectedCallback() {
-        this.removeEventListenerFromTabs();
-    }
-    render() {
-        return (h(Host, { key: '093e2804b56cb6c336744551ad4d27d962a34d02', role: "tablist", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, h("div", { key: 'eaaa9db902ead14bd581416c661b7c105263e335', class: "wrapper", ref: (el) => {
-                this.navWrapperElement = el;
-            } }, h("button", { key: '50a7f0455048807c8642ecb66de0d01b7a27ce58', "aria-label": this.tdsScrollLeftAriaLabel, class: `scroll-left-button ${this.showLeftScroll ? 'show' : ''}`, disabled: !this.showLeftScroll, onClick: () => this.scrollLeft() }, h("tds-icon", { key: '411a393ac446ae8224ec8c407b5e1b0adda87098', name: "chevron_left", size: "20px" })), h("slot", { key: 'a534cd27f044a0ac8a03ffb28e20f04cb8eba7a6', onSlotchange: () => this.handleSlotChange() }), h("button", { key: '6284e9746b9dfdc2010ff65b201e39db0e51feda', "aria-label": this.tdsScrollRightAriaLabel, class: `scroll-right-button ${this.showRightScroll ? 'show' : ''}`, disabled: !this.showRightScroll, onClick: () => this.scrollRight() }, h("tds-icon", { key: '6a2e53089c50e1aa03a87af001a685ff9ba059dc', name: "chevron_right", size: "20px" })))));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "selectedIndex": ["handleSelectedIndexUpdate"]
-    }; }
-    static get style() { return TdsFolderTabsStyle0; }
-}, [1, "tds-folder-tabs", {
-        "modeVariant": [1, "mode-variant"],
-        "defaultSelectedIndex": [2, "default-selected-index"],
-        "selectedIndex": [514, "selected-index"],
-        "tdsScrollLeftAriaLabel": [1, "tds-scroll-left-aria-label"],
-        "tdsScrollRightAriaLabel": [1, "tds-scroll-right-aria-label"],
-        "buttonWidth": [32],
-        "showLeftScroll": [32],
-        "showRightScroll": [32],
-        "selectTab": [64],
-        "reinitialize": [64]
-    }, undefined, {
-        "selectedIndex": ["handleSelectedIndexUpdate"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["tds-folder-tabs", "tds-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "tds-folder-tabs":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, TdsFolderTabs$1);
-            }
-            break;
-        case "tds-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-defineCustomElement$1();
-
-const TdsFolderTabs = TdsFolderTabs$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { TdsFolderTabs, defineCustomElement };
+import{t,p as s,H as e,c as i,h as o,a as l}from"./index.js";import{d as h}from"./p-C0fx1H4h.js";const r=s(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.tdsChange=i(this,"tdsChange",7),this.modeVariant=null,this.defaultSelectedIndex=0,this.tdsScrollLeftAriaLabel="Scroll left",this.tdsScrollRightAriaLabel="Scroll right",this.buttonWidth=0,this.showLeftScroll=!1,this.showRightScroll=!1,this.navWrapperElement=null,this.componentWidth=0,this.buttonsWidth=0,this.scrollableWidth=0,this.tabElements=[],this.clickHandlers=new WeakMap,this.addResizeObserver=()=>{const t=new ResizeObserver((t=>{t.forEach((t=>{const s=t.contentRect.width;let e=0;Array.from(this.host.children).forEach((t=>{const s=window.getComputedStyle(t);e+=t.clientWidth+parseFloat(s.marginLeft)+parseFloat(s.marginRight)})),this.componentWidth=s,this.buttonsWidth=e,this.scrollableWidth=e-s,this.updateScrollButtons()}))}));this.navWrapperElement&&t.observe(this.navWrapperElement)},this.addEventListenerToTabs=()=>{this.tabElements=Array.from(this.host.children),this.tabElements.map(((t,s)=>{const e=()=>{t.disabled||this.tdsChange.emit({selectedTabIndex:this.tabElements.indexOf(t)}).defaultPrevented||(this.tabElements.forEach((t=>t.setSelected(!1))),t.setSelected(!0),this.selectedIndex=s)};return t.addEventListener("click",e),this.clickHandlers.set(t,e),t}))},this.removeEventListenerFromTabs=()=>{this.tabElements.forEach((t=>{const s=this.clickHandlers.get(t);s&&(t.removeEventListener("click",s),this.clickHandlers.delete(t))}))}}async selectTab(t){if(t<0||t>=this.tabElements.length)throw Error("Tab index out of bounds");return this.tabElements[t].disabled||(this.tabElements.forEach((t=>t.setSelected(!1))),this.tabElements=this.tabElements.map(((s,e)=>(e===t&&(s.setSelected(!0),this.selectedIndex=t),s)))),{selectedTabIndex:this.selectedIndex}}async reinitialize(){this.handleSlotChange()}handleSelectedIndexUpdate(){const t=Array.from(this.host.children);this.tabElements=t.map((t=>(t.setSelected(!1),t))),this.selectedIndex&&this.tabElements[this.selectedIndex].setSelected(!0)}scrollRight(){this.navWrapperElement&&(this.navWrapperElement.scrollLeft=this.navWrapperElement.scrollLeft+this.buttonsWidth,this.evaluateScrollButtons())}scrollLeft(){this.navWrapperElement&&(this.navWrapperElement.scrollLeft=this.navWrapperElement.scrollLeft-this.buttonsWidth,this.evaluateScrollButtons())}evaluateScrollButtons(){if(!this.navWrapperElement)return;const t=this.navWrapperElement.scrollLeft;this.showRightScroll=t<=this.scrollableWidth,this.showLeftScroll=t>0}initializeTabs(){this.tabElements=Array.from(this.host.children),this.tabElements.forEach((t=>{t.classList.remove("last"),t.classList.remove("first")})),this.tabElements[0].classList.add("first"),this.tabElements[this.tabElements.length-1].classList.add("last")}initializeSelectedTab(){void 0===this.selectedIndex?(this.addEventListenerToTabs(),this.tabElements[this.defaultSelectedIndex].setSelected(!0),this.selectedIndex=this.defaultSelectedIndex):this.tabElements[this.selectedIndex].setSelected(!0),this.tdsChange.emit({selectedTabIndex:this.selectedIndex})}updateScrollButtons(){this.buttonsWidth>this.componentWidth?this.evaluateScrollButtons():(this.showLeftScroll=!1,this.showRightScroll=!1)}handleSlotChange(){this.initializeTabs(),this.addEventListenerToTabs(),this.initializeSelectedTab(),this.updateScrollButtons(),this.addResizeObserver()}connectedCallback(){this.initializeTabs()}componentDidLoad(){this.initializeSelectedTab()}componentDidRender(){this.updateScrollButtons(),this.addResizeObserver()}disconnectedCallback(){this.removeEventListenerFromTabs()}render(){return o(l,{key:"9c64e9c2433f0f4fbcc63874c0761d41ae395328",role:"tablist",class:this.modeVariant?"tds-mode-variant-"+this.modeVariant:""},o("div",{key:"dba05c1eef5e9ade40f6c40c6b965445a5764d2d",class:"wrapper",ref:t=>{this.navWrapperElement=t}},o("button",{key:"d9a3c552a6ebb2f0407d95e0abad6e58208839cd","aria-label":this.tdsScrollLeftAriaLabel,class:"scroll-left-button "+(this.showLeftScroll?"show":""),disabled:!this.showLeftScroll,onClick:()=>this.scrollLeft()},o("tds-icon",{key:"b3dcd4f307802fe3e0fe8a81a2bc212c9554e391",name:"chevron_left",size:"20px"})),o("slot",{key:"d600bdef36a9a2082e545b7a67ed3e3d88dd4774",onSlotchange:()=>this.handleSlotChange()}),o("button",{key:"ce9777c7111d8d162ca08fa6f7ca89ea7a461945","aria-label":this.tdsScrollRightAriaLabel,class:"scroll-right-button "+(this.showRightScroll?"show":""),disabled:!this.showRightScroll,onClick:()=>this.scrollRight()},o("tds-icon",{key:"c85e5180b8051e0ec7e1ad94b32594f423a3f483",name:"chevron_right",size:"20px"}))))}get host(){return this}static get watchers(){return{selectedIndex:[{handleSelectedIndexUpdate:0}]}}static get style(){return':host{box-sizing:border-box;overflow:hidden;outline:0}:host *{box-sizing:border-box}:host .wrapper{display:flex;overflow-x:scroll;scrollbar-width:none;position:relative}:host .wrapper::-webkit-scrollbar{display:none}:host .scroll-right-button{z-index:1;right:0}:host .scroll-left-button{z-index:1;left:0}:host .scroll-right-button,:host .scroll-left-button{height:50px;color:var(--tds-folder-tabs-scroll-btn-color);cursor:pointer;border:0;width:0;background-color:var(--tds-folder-tabs-scroll-btn-background);display:none;justify-content:center;align-items:center;opacity:0;pointer-events:none;position:sticky}:host .scroll-right-button.show,:host .scroll-left-button.show{min-width:48px;display:block;opacity:1;pointer-events:all}:host .scroll-right-button:hover,:host .scroll-left-button:hover{background-color:var(--tds-folder-tabs-scroll-btn-background-hover)}:host .scroll-right-button:active,:host .scroll-left-button:active{background-color:var(--tds-folder-tabs-scroll-btn-background-active)}:host .scroll-right-button:focus-within::before,:host .scroll-left-button:focus-within::before{outline:2px solid var(--tds-focus-outline-color);box-shadow:0 0 0 1px var(--tds-white);outline-offset:1px;z-index:1;content:"";position:absolute;top:3px;bottom:3px;left:3px;right:3px}:host .scroll-right-button:focus,:host .scroll-left-button:focus{outline:0}:host .scroll-right-button svg,:host .scroll-left-button svg{fill:var(--tds-folder-tabs-scroll-btn-color)}'}},[257,"tds-folder-tabs",{modeVariant:[1,"mode-variant"],defaultSelectedIndex:[2,"default-selected-index"],selectedIndex:[514,"selected-index"],tdsScrollLeftAriaLabel:[1,"tds-scroll-left-aria-label"],tdsScrollRightAriaLabel:[1,"tds-scroll-right-aria-label"],buttonWidth:[32],showLeftScroll:[32],showRightScroll:[32],selectTab:[64],reinitialize:[64]},void 0,{selectedIndex:[{handleSelectedIndexUpdate:0}]}]);function n(){"undefined"!=typeof customElements&&["tds-folder-tabs","tds-icon"].forEach((s=>{switch(s){case"tds-folder-tabs":customElements.get(t(s))||customElements.define(t(s),r);break;case"tds-icon":customElements.get(t(s))||h()}}))}n();const c=r,a=n;export{c as TdsFolderTabs,a as defineCustomElement}