@scania/tegel 1.23.0-value-prop.beta.3 → 1.23.0-value-prop.beta.4

package/dist/cjs/tds-block.cjs.entry.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-ca8040ad.js');
 
-const blockCss = ".tds-block{box-sizing:border-box;color:var(--tds-block-color);border-radius:4px;padding:16px;font:var(--tds-body-01);letter-spacing:var(--tds-body-01-ls);background-color:var(--tds-block-background)}.tds-block *{box-sizing:border-box}.tds-mode-variant-primary{--tds-block-background:var(--tds-block-background-primary);--tds-block-background-nested:var(--tds-block-background-nested-primary)}.tds-mode-variant-secondary{--tds-block-background:var(--tds-block-background-secondary);--tds-block-background-nested:var(--tds-block-background-nested-secondary)}";
+const blockCss = ".tds-block{box-sizing:border-box;color:var(--tds-block-color);background-color:var(--tds-block-background);border-radius:4px;padding:16px;font:var(--tds-body-01);letter-spacing:var(--tds-body-01-ls)}.tds-block *{box-sizing:border-box}.tds-mode-variant-primary{background-color:var(--tds-block-background-primary)}.tds-mode-variant-secondary{background-color:var(--tds-block-background-secondary)}.tds-block-even{background-color:var(--tds-block-background-even)}.tds-block-odd{background-color:var(--tds-block-background-odd)}";
 const TdsBlockStyle0 = blockCss;
 
 const TdsBlock = class {
@@ -12,21 +12,25 @@ const TdsBlock = class {
         index.registerInstance(this, hostRef);
         this.modeVariant = null;
     }
-    setModeVariantOnChildBlocks() {
-        var _a;
-        this.children = Array.from(this.host.children).filter((item) => item.tagName === 'TDS-BLOCK');
-        (_a = this.children) === null || _a === void 0 ? void 0 : _a.forEach((item) => {
-            if (!this.modeVariant) {
-                item.setAttribute('mode-variant', 'secondary');
+    getNestingLevel() {
+        let level = 0;
+        let parent = this.host.parentElement;
+        while (parent) {
+            if (parent.tagName.toLowerCase() === 'tds-block') {
+                level++;
             }
-            else {
-                item.setAttribute('mode-variant', this.modeVariant === 'primary' ? 'secondary' : 'primary');
-            }
-        });
+            parent = parent.parentElement;
+        }
+        return level;
     }
     render() {
-        this.setModeVariantOnChildBlocks();
-        return (index.h("div", { key: 'a40067afde48258475108cb9785555e7c2bd0a47', class: `tds-block ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("slot", { key: 'aaf62c59a3a01a0c41a594c15257e4746a049418' })));
+        const nestingLevel = this.getNestingLevel();
+        const evenOddClass = this.modeVariant === null
+            ? nestingLevel % 2 === 0
+                ? 'tds-block-even'
+                : 'tds-block-odd'
+            : '';
+        return (index.h("div", { key: '5f22f1b8ae254a577a151563deadd969e90e3d20', class: `tds-block ${evenOddClass} ${this.modeVariant !== null ? `tds-mode-variant-${this.modeVariant}` : ''}` }, index.h("slot", { key: '52367d3055296ebd2b6e8291786554f34253750f' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/tds-dropdown_2.cjs.entry.js

@@ -175,8 +175,10 @@ const TdsDropdown = class {
         this.handleFilterReset = () => {
             this.reset();
             this.inputElement.value = '';
-            this.handleFilter({ target: { value: this.inputElement.value } });
+            this.handleFilter({ target: { value: '' } });
             this.inputElement.focus();
+            // Add this line to ensure internal value is cleared
+            this.internalValue = '';
         };
         this.handleFocus = (event) => {
             this.open = true;
@@ -353,7 +355,7 @@ const TdsDropdown = class {
     handleOpenState() {
         if (this.filter && this.multiselect) {
             if (!this.open) {
-                this.inputElement.value = this.getValue();
+                this.inputElement.value = this.selectedOptions.length ? this.getValue() : '';
             }
         }
     }
@@ -393,7 +395,7 @@ const TdsDropdown = class {
     }
     render() {
         appendHiddenInput(this.host, this.name, this.selectedOptions.join(','), this.disabled);
-        return (index.h(index.Host, { key: 'b80b938a7e06df4883e939cf9cf06cbb5d2dc12b', role: "select", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && this.labelPosition === 'outside' && (index.h("div", { key: '75172f55ac3adc34a050bbeba543165b6c6ec445', class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), index.h("div", { key: 'd0498b07c2446b7ccde5bd09a95157454ffc2331', class: `dropdown-select ${this.size} ${this.disabled ? 'disabled' : ''}` }, this.filter ? (index.h("div", { class: {
+        return (index.h(index.Host, { key: '198e38f89945016a0305584262b751053a00ac2e', role: "select", class: `${this.modeVariant ? `tds-mode-variant-${this.modeVariant}` : ''}` }, this.label && this.labelPosition === 'outside' && (index.h("div", { key: 'f785bd85282f653e9da367ced8aac22b62061b6d', class: `label-outside ${this.disabled ? 'disabled' : ''}` }, this.label)), index.h("div", { key: '9a93fa9b9c343bb748de3324cf3fda0839d24b5b', class: `dropdown-select ${this.size} ${this.disabled ? 'disabled' : ''}` }, this.filter ? (index.h("div", { class: {
                 filter: true,
                 focus: this.filterFocus,
                 disabled: this.disabled,
@@ -435,7 +437,7 @@ const TdsDropdown = class {
                     label-inside-as-placeholder
                     ${this.size}
                     ${this.selectedOptions.length ? 'selected' : ''}
-                    ` }, this.label)), index.h("div", { class: `placeholder ${this.size}` }, this.selectedOptions.length ? this.getValue() : this.placeholder), index.h("tds-icon", { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), index.h("div", { key: '999a08cee6035f37217270681b58411badc1596d', ref: (element) => (this.dropdownList = element), class: {
+                    ` }, this.label)), index.h("div", { class: `placeholder ${this.size}` }, this.selectedOptions.length ? this.getValue() : this.placeholder), index.h("tds-icon", { "aria-label": "Open/Close dropdown", svgTitle: "Open/Close dropdown", class: `menu-icon ${this.open ? 'open' : 'closed'}`, name: "chevron_down", size: "16px" }))))), index.h("div", { key: '38ea3153aa17144d03c3472600f7c22b9e7d1ee8', ref: (element) => (this.dropdownList = element), class: {
                 'dropdown-list': true,
                 [this.size]: true,
                 [this.getOpenDirection()]: true,
@@ -444,7 +446,7 @@ const TdsDropdown = class {
                 'closed': !this.open,
                 [`animation-enter-${this.animation}`]: this.animation !== 'none' && this.open,
                 [`animation-exit-${this.animation}`]: this.animation !== 'none' && !this.open,
-            } }, index.h("slot", { key: 'f6e55be5581a1b5a24da4643508c4fe76767c9c7', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (index.h("div", { key: '6184dce7e827ee6c2c0403e8531ea8ac782e3073', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (index.h("div", { key: '33bd5d3695247cfaaa66bb67b6ac6a5ced795c72', class: `helper ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, this.error && index.h("tds-icon", { key: '6f3681a038fc95bb90e7877c54eff0b4c807b877', name: "error", size: "16px" }), this.helper))));
+            } }, index.h("slot", { key: 'dfe65bc02f12a01b4ef4d710c3e8fabe68d36530', onSlotchange: () => this.handleSlotChange() }), this.filterResult === 0 && this.noResultText !== '' && (index.h("div", { key: '5d4d52a9dc9a1ac4c35ae62a2543c15d8f252a08', class: `no-result ${this.size}` }, this.noResultText))), this.helper && (index.h("div", { key: 'f48a3d2320ebe64c439127898eb4540ccd21b421', class: `helper ${this.error ? 'error' : ''} ${this.disabled ? 'disabled' : ''}` }, this.error && index.h("tds-icon", { key: 'ca396e64d54c1f4fe95b0407eab80e78a7249c43', name: "error", size: "16px" }), this.helper))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {