@maggioli-design-system/magma 2.0.0-beta.1 → 2.0.0-beta.2

package/dist/collection/components/mds-price-table/mds-price-table.js

@@ -1,7 +1,10 @@
 import { Host, h } from "@stencil/core";
+/**
+ * @slot - Add `mds-price-table-list` elements or `components` to this slot.
+ */
 export class MdsPriceTable {
     render() {
-        return (h(Host, { key: '2d2b09b6b5ec12bccfa957bf0a7ab636eacf8639' }, h("slot", { key: '1db821d187a0488397440de72739af6d7c30c971' })));
+        return (h(Host, { key: '4a7524eda2d51d229b579063684f617d686bca52' }, h("slot", { key: 'c6eeb79e4b5439383b992832d6e346221a8ee067' })));
     }
     static get is() { return "mds-price-table"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-price-table-features/mds-price-table-features.js

@@ -1,11 +1,11 @@
 import { Host, h } from "@stencil/core";
 /**
  * @part header - Selects the HTML element wrapper of label text
- * @slot default - Expects to slot `mds-price-table-features-row` component
+ * @slot - Expects to slot `mds-price-table-features-row` component
  */
 export class MdsPriceTableFeatures {
     render() {
-        return (h(Host, { key: 'c1c9c47c868a3811604fa8a2a163b2093f146e03' }, h("div", { key: 'a308014a1778ff72e0e3e552bff15c0f1d18c15d', class: "table-wrapper" }, this.label && (h("header", { key: '421aecece294adb7d717a8f5b5b55bc7cb39e801', part: "header" }, h("mds-text", { key: '4506989506031cc040e201e2aa1ee1f2b217b53c', typography: "detail" }, h("b", { key: 'f065ba3c8c054f385ee8fef05dcff1b4bdf65ade' }, this.label)))), h("table", { key: '97bb2c61f606d69a815f29a5d6c994cc19ae4e84' }, h("tbody", { key: 'c70053b39c21e3ad4f9558d0fe031c111ce5b9cd' }, h("slot", { key: 'c854ebd92ead2d68d63b4838f8826cadf3338211' }))))));
+        return (h(Host, { key: 'e7f9344d10b9d60dc268381a74eccf8514b3c398' }, h("div", { key: '5b705f564d319faeac9d4eb622e462eabeee7031', class: "table-wrapper" }, this.label && (h("header", { key: '5f84a45d54385488a527afc523448756624170f9', part: "header" }, h("mds-text", { key: '7316e7c2d5793513f582643b76974c266faedc10', typography: "detail" }, h("b", { key: 'baa6b6737d4cdd98c8405d3eb4421a1fb0b1b518' }, this.label)))), h("table", { key: 'f20e7627f4e4770b1e4bd475a945acc111e5ce8a' }, h("tbody", { key: '6f4d54def644b954a56e8a7ada75ca913f65a837' }, h("slot", { key: '2b96abcc2dc865bd55ec953d429f345d89904dc7' }))))));
     }
     static get is() { return "mds-price-table-features"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-price-table-features-cell/mds-price-table-features-cell.js

@@ -4,7 +4,7 @@ import miBaselineHorizontalRule from "@icon/mi/baseline/horizontal-rule.svg";
 /**
  * @part icon - Selects the HTML element of the icon when `type` attribute when is `supported` or `unsupported`.
  * @part text - Selects the HTML element wrapper of text when `type` attribute when is `text`.
- * @slot default - Add `text string`, `HTML elements` or `components` to this slot.
+ * @slot - Add `text string`, `HTML elements` or `components` to this slot.
  */
 export class MdsPriceTableFeaturesCell {
     constructor() {
@@ -14,7 +14,7 @@ export class MdsPriceTableFeaturesCell {
         this.type = 'text';
     }
     render() {
-        return (h(Host, { key: '54e7d4ba98f366ca072ce0e4faf02a093db43369' }, this.type === 'supported' && (h("i", { key: '3131fd8fc3fae4b821fd643e84477ef78700d2e2', class: "icon icon--supported", innerHTML: miBaselineCheckCircle, part: "icon" })), this.type === 'unsupported' && (h("i", { key: '8080a37fd7dc031bc3e162480a76d88b5b1a32f6', class: "icon icon--unsupported", innerHTML: miBaselineHorizontalRule, part: "icon" })), this.type === 'text' && (h("mds-text", { key: '47ccf913caed4f3a3b8070e8c5d51699fa66b96b', part: "text", typography: "detail" }, h("slot", { key: '125c00d4287ce168a20d1cde74ad06bd61d19112' }))), this.type === 'custom' && h("slot", { key: '875b44b69e06f7d8a464b4d598b5a00680d78a3a' }), this.type === 'label' && h("slot", { key: 'f584c21d6d8af59d3a8a0be9b4f008478eefd279' })));
+        return (h(Host, { key: 'c2128e191ac5c1b87f07094c22ec8933b7a21874' }, this.type === 'supported' && (h("i", { key: 'af9fc4de6bdf3698ce80126b5166809920ec209c', class: "icon icon--supported", innerHTML: miBaselineCheckCircle, part: "icon" })), this.type === 'unsupported' && (h("i", { key: 'ca1fd3835fa926af3989f75e79354512d46ae37a', class: "icon icon--unsupported", innerHTML: miBaselineHorizontalRule, part: "icon" })), this.type === 'text' && (h("mds-text", { key: '6ad51db1f44912c8e175edf8530234d947bda5a5', part: "text", typography: "detail" }, h("slot", { key: '856ddd5a1d444fe3127379f2d7b2c2ce1a27c292' }))), this.type === 'custom' && h("slot", { key: '0a206aad7c9d1e7ba0e647db8ebb47a8eef396aa' }), this.type === 'label' && h("slot", { key: '17d326be1ffeb2fb4f0dc832e0233a8cf5fcd197' })));
     }
     static get is() { return "mds-price-table-features-cell"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-price-table-features-row/mds-price-table-features-row.js

@@ -1,6 +1,6 @@
 import { Host, h } from "@stencil/core";
 /**
- * @slot default - Expects to slot `mds-price-table-features-cell` component
+ * @slot - Expects to slot `mds-price-table-features-cell` component
  */
 export class MdsPriceTableFeaturesRow {
     componentWillRender() {
@@ -11,7 +11,7 @@ export class MdsPriceTableFeaturesRow {
         });
     }
     render() {
-        return (h(Host, { key: '81ade11b3ab36047fe6ea3abd16b8766f1660b87' }, h("slot", { key: '570984b400f99165ee9f3f40ffd93ad19b437dd9' })));
+        return (h(Host, { key: '49b215263ed6aad599fcf7371fc88091febf16de' }, h("slot", { key: 'edbfb6111c9363ecf3510f29a3d2ce137e303472' })));
     }
     static get is() { return "mds-price-table-features-row"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-price-table-header/mds-price-table-header.js

@@ -1,7 +1,10 @@
 import { Host, h } from "@stencil/core";
+/**
+ * @slot - Add `text string`, `HTML elements` or `components` to this slot.
+ */
 export class MdsPriceTableHeader {
     render() {
-        return (h(Host, { key: '42fabeb365252635792adb6b5f28ba16f6ebe9e3' }, h("slot", { key: '1f2726a1e4df0605cb2e5d635f37193834408d47' })));
+        return (h(Host, { key: 'b882376c905d6e22fddcc441877d7b2ffd2eda12' }, h("slot", { key: 'cc100d18a2026ea3223fefb6207969e8e2ac46ab' })));
     }
     static get is() { return "mds-price-table-header"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-price-table-list/mds-price-table-list.js

@@ -4,7 +4,7 @@ import { Host, h } from "@stencil/core";
  * @part footer - Selects the element which wraps elements added via `slot="price"` and `slot="action"`
  * @part header - Selects the element which wraps elements added via `slot="header"`
  * @slot action - Add `HTML elements` or `components`, it is **recommended** to use `mds-button` element.
- * @slot default - Add `mds-price-table-list-item` component, `HTML elements` or other `components` to this slot.
+ * @slot item - Add `mds-price-table-list-item` component, `HTML elements` or other `components` to this slot.
  * @slot header - Add `text string`, `HTML elements` or `components` to this slot.
  * @slot price - Add `text string`, `HTML elements` or `components` to this slot.
  */
@@ -14,7 +14,7 @@ export class MdsPriceTableList {
             this.hostElement.querySelectorAll('[slot="item"], mds-price-table-list-item').length > 0;
     }
     render() {
-        return (h(Host, { key: '9839e2822db4193a8deb66c594a425786a535d1f' }, h("div", { key: '58507843f8e7eae61e26eafaeb99f01c77480ed1', class: "header", part: "header" }, h("slot", { key: '5f7541028888ada10f64725d1ecf0ebb5e4d9832', name: "header" })), this.hasItems && h("mds-separator", { key: '566ca8c9ba02b76f47f3bfcaa0100449b07e6146', class: "separator" }), this.hasItems && (h("main", { key: '0f03d7c886ce609ee8efa658408ba2c53e38015b', class: "main", part: "content" }, h("slot", { key: '1044b8d53d3234bcd10dd9cd912c4574c0d3436a', name: "item" }))), h("div", { key: '4f5ace1034982ee7f4d8942819a987439ba36509', class: "footer", part: "footer" }, h("slot", { key: 'a8f206d356219f57376bd341c7447497a6e88c52', name: "price" }), h("slot", { key: 'c9ed7291e71ee29a1c0a7542fb79065934523ec0', name: "action" }))));
+        return (h(Host, { key: 'bb6d784c26371390055494e96fb4194f6525113f' }, h("div", { key: '4158b4739e07535d56db97ff286f6c6339da5f76', class: "header", part: "header" }, h("slot", { key: 'bccecac7c5f63db407b2658e6a9d5ef1eb2f5468', name: "header" })), this.hasItems && h("mds-separator", { key: '2822bfea0edcf58ea26f5ac8f3b2c4f0751f0318', class: "separator" }), this.hasItems && (h("main", { key: '32c5d76670faf634a9d386a78e2e201c16b270b2', class: "main", part: "content" }, h("slot", { key: 'd3c61f5f594a1e4e323e86ecded79587deb875ae', name: "item" }))), h("div", { key: '422d6ac5f00182b404b32fd7adf7bf9214e5bedd', class: "footer", part: "footer" }, h("slot", { key: '74fdaaf493a48a6251f4ca7d38abea6e560d201b', name: "price" }), h("slot", { key: 'eff0dfa6116d33f667f342ccd79b9bff13364511', name: "action" }))));
     }
     static get is() { return "mds-price-table-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-price-table-list-item/mds-price-table-list-item.js

@@ -1,6 +1,9 @@
 import { Host, h } from "@stencil/core";
 import miBaselineCheckCircle from "@icon/mi/baseline/check-circle.svg";
 import miBaselineHorizontalRule from "@icon/mi/baseline/horizontal-rule.svg";
+/**
+ * @slot - Add `text string`, `HTML elements` or `components` to this slot.
+ */
 export class MdsPriceTableListItem {
     constructor() {
         /**
@@ -13,7 +16,7 @@ export class MdsPriceTableListItem {
         this.typography = 'detail';
     }
     render() {
-        return (h(Host, { key: '90b909850952b68e79aecf6222ca9eb2e0d32a3f', slot: "item" }, h("mds-text", { key: '16c8618310b452ac9f478036605655139eec1513', class: "icon-container", typography: this.typography }, this.supported ? (h("i", { class: "icon", innerHTML: miBaselineCheckCircle, part: "icon" })) : (h("i", { class: "icon", innerHTML: miBaselineHorizontalRule, part: "icon" }))), h("mds-text", { key: '5cc3f23b819caebb5b5c25401da75dbc9b023659', class: "text", typography: this.typography }, h("slot", { key: 'd824314eb2e3e056b2924a159ffa85152ebbf9e4' }))));
+        return (h(Host, { key: '10cdc06ed8d528e21a4d5c9d40752e61e5a670a0', slot: "item" }, h("mds-text", { key: '93487f55363206856aa655044df9b4190b486a77', class: "icon-container", typography: this.typography }, this.supported ? (h("i", { class: "icon", innerHTML: miBaselineCheckCircle, part: "icon" })) : (h("i", { class: "icon", innerHTML: miBaselineHorizontalRule, part: "icon" }))), h("mds-text", { key: '8e91a53122918c3629d7d2db466f66e8f0a2d838', class: "text", typography: this.typography }, h("slot", { key: '9d6d6071ca509914c1b6f467b6cda11d4eb51fec' }))));
     }
     static get is() { return "mds-price-table-list-item"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-progress/mds-progress.js

@@ -46,7 +46,7 @@ export class MdsProgress {
         ]);
     }
     setProgress(progress) {
-        if (this.steps) {
+        if (this.steps !== '') {
             this.currentStep = this.stepsList[Math.round(progress * (this.stepsList.length - 1))];
             if (!ifAttribute(this.element, 'aria-hidden')) {
                 this.element.setAttribute('aria-valuetext', this.currentStep);
@@ -60,7 +60,7 @@ export class MdsProgress {
         this.stepsList = steps.split(',');
     }
     render() {
-        return (h(Host, { key: 'b515b4bc8d9bb3e124374ad1adc90a50016c1434', "aria-valuemax": "100", "aria-valuemin": "0", "aria-valuenow": !ifAttribute(this.element, 'aria-hidden') && Math.round(this.progress * 100), role: "progressbar" }, this.direction === 'radial' ? (h("mds-radial-progress", { progress: this.progress, part: "radial-progress", typography: this.typography, variant: this.variant })) : (h("div", { class: "progress", part: "progress", style: this.direction === 'horizontal'
+        return (h(Host, { key: '55ba8cb650c555ca15fd05464edfed54eb419787', "aria-valuemax": "100", "aria-valuemin": "0", "aria-valuenow": !ifAttribute(this.element, 'aria-hidden') && Math.round(this.progress * 100), role: "progressbar" }, this.direction === 'radial' ? (h("mds-radial-progress", { progress: this.progress, part: "radial-progress", typography: this.typography, variant: this.variant })) : (h("div", { class: "progress", part: "progress", style: this.direction === 'horizontal'
                 ? { flexGrow: `${this.progress}` }
                 : { flexGrow: `${this.progress}`, width: '100%' } }))));
     }

package/dist/collection/components/mds-push-notification/mds-push-notification.js

@@ -2,9 +2,7 @@ import { Host, h, } from "@stencil/core";
 import { cssDurationToMilliseconds, cssSizeToNumber } from "../../common/unit";
 /**
  * @part notifications - The container wrapper of the notifications.
- * @slot top - Add `HTML elements` or `components`, it is **recommended** to use `mds-button` element.
- * @slot bottom - Add `HTML elements` or `components`, it is **recommended** to use `mds-button` element.
- * @slot default - Add `HTML elements` or `components`, it is **recommended** to use `mds-push-notification` element.
+ * @slot - Add `HTML elements` or `components`, it is **recommended** to use `mds-push-notification` element.
  */
 export class MdsPushNotification {
     constructor() {
@@ -79,7 +77,7 @@ export class MdsPushNotification {
             const elements = this.slotNotifications
                 .assignedElements()
                 .map((e) => e)
-                .filter((e) => !e.style.visibility);
+                .filter((e) => e.style.visibility === '');
             if (elements.length === 0)
                 return;
             elements.forEach(async (e) => {
@@ -99,19 +97,29 @@ export class MdsPushNotification {
             this.cssItemsOutroDuration =
                 (_c = elementStyles.getPropertyValue('--mds-push-notification-items-outro-delay')) !== null && _c !== void 0 ? _c : '0ms';
         };
+        this.clear = () => {
+            this.slotNotifications.assignedElements().forEach((e) => this.outroItem(e));
+            this.hide();
+        };
     }
-    clear() {
-        this.slotNotifications.assignedElements().forEach((e) => this.outroItem(e));
-        this.hide();
-    }
+    /**
+     * Shows the notification container.
+     */
     show() {
         this.visible = true;
         return Promise.resolve();
     }
+    /**
+     * Hides the notification container.
+     */
     hide() {
         this.visible = undefined;
         return Promise.resolve();
     }
+    /**
+     * Removes the given notification item(s) from the stack.
+     * @param notification the notification item or items to remove
+     */
     removeNotification(notification) {
         if (Array.isArray(notification)) {
             notification.forEach(this.outroItem);
@@ -140,7 +148,7 @@ export class MdsPushNotification {
         this.visible = undefined;
     }
     render() {
-        return (h(Host, { key: '018cec5fec78b7abed252a3acc8a13352f534306' }, h("mds-button", { key: 'c96d02897f1fed58ae9d6252d9e53f8023d2c14a', variant: "dark", onClick: this.clear.bind(this) }, "Cancella notifiche"), h("div", { key: 'aabdf019411f23c91a3352ab9bc1a9c8aa02df9e', class: "notifications", part: "notifications" }, h("slot", { key: '52e483e93b453f8f860eaba64f4a2223a2eceb38', ref: (el) => (this.slotNotifications = el) }))));
+        return (h(Host, { key: 'd115a147fe975c346f325931e496bc5a725faca2' }, h("mds-button", { key: 'b9155d4e0666827ff1745da75db1595b2b2530aa', variant: "dark", onClick: this.clear }, "Cancella notifiche"), h("div", { key: '3d73cddf9bc67c9c4c7e68486c7091cd12979b0c', class: "notifications", part: "notifications" }, h("slot", { key: '1a46c225c799b00f02f6e0e44da4a8c490cc6268', ref: (el) => (this.slotNotifications = el) }))));
     }
     static get is() { return "mds-push-notification"; }
     static get encapsulation() { return "shadow"; }
@@ -267,7 +275,7 @@ export class MdsPushNotification {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "",
+                    "text": "Shows the notification container.",
                     "tags": []
                 }
             },
@@ -284,7 +292,7 @@ export class MdsPushNotification {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "",
+                    "text": "Hides the notification container.",
                     "tags": []
                 }
             },
@@ -294,7 +302,7 @@ export class MdsPushNotification {
                     "parameters": [{
                             "name": "notification",
                             "type": "HTMLMdsPushNotificationItemElement | HTMLMdsPushNotificationItemElement[]",
-                            "docs": ""
+                            "docs": "the notification item or items to remove"
                         }],
                     "references": {
                         "Promise": {
@@ -309,8 +317,11 @@ export class MdsPushNotification {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "",
-                    "tags": []
+                    "text": "Removes the given notification item(s) from the stack.",
+                    "tags": [{
+                            "name": "param",
+                            "text": "notification the notification item or items to remove"
+                        }]
                 }
             }
         };

package/dist/collection/components/mds-push-notification-item/mds-push-notification-item.js

@@ -50,6 +50,9 @@ export class MdsPushNotificationItem {
             this.closedEvent.emit();
         };
     }
+    /**
+     * Updates the component's texts to the locale currently set on the host element.
+     */
     async updateLang() {
         this.language = this.t.lang(this.host);
     }
@@ -60,7 +63,7 @@ export class MdsPushNotificationItem {
         var _a;
         this.hasActions = this.host.querySelector(':scope > [slot="action"]') !== null;
         this.hasBadge = this.host.querySelector(':scope > [slot="badge"]') !== null;
-        if (this.datetime) {
+        if (this.datetime !== undefined && this.datetime !== '') {
             this.datetime = sanitizeISO8601Date((_a = this.datetime) === null || _a === void 0 ? void 0 : _a.toString());
         }
         this.t.lang(this.host);
@@ -88,9 +91,9 @@ export class MdsPushNotificationItem {
     }
     render() {
         var _a;
-        return (h(Host, { key: 'cef1482e9e16dcc52b6fc255c7392f575f0c1772' }, ((_a = this.icon) !== null && _a !== void 0 ? _a : this.preview === 'avatar') && (h("mds-avatar", { key: '0bfdb9ecf0fa36599c981aa778a02f73d0b80a32', class: "avatar", icon: this.icon, initials: this.initials, part: "avatar", src: this.src, tone: this.tone, variant: this.variant })), this.src && this.preview !== 'avatar' && (h("mds-img", { key: '719fe7dae8dc94021f0efd96c50b86b614572aca', class: "picture", part: "picture", src: this.src })), h("div", { key: 'a5ead1ed262e19ed60a37f23cce81a29889daedb', class: "content", part: "content" }, h("div", { key: 'a747e13b1fcb292b193db53ebf2c6174eac99fd9', class: "header" }, h("div", { key: '4a402d86378e9b5269dc4ffbbc25a1b0b54be36d', class: "infos" }, this.hasBadge && (h("div", { key: '40eb647711cb32839e9ee5cec391c800b5a8d983' }, h("slot", { key: 'f73ddcfd20ebb75f62a0ff3b7dfe5dfa0a9477a4', name: "badge" }))), this.subject && (h("mds-text", { key: 'aab0df869115c44eecc4d5fa180210392c72e1e1', class: "subject", typography: "h6", variant: "title", truncate: "all" }, this.subject))), this.datetime && (h("mds-text", { key: 'e93ee1684aeb8a4df9203a9b416df5181bc2342f', class: "time", typography: "option" }, this.dateFormat === 'timeago'
+        return (h(Host, { key: 'fe5ea12872387bc99ada81d55dee421a4d37ba39' }, ((_a = this.icon) !== null && _a !== void 0 ? _a : this.preview === 'avatar') && (h("mds-avatar", { key: '06e5ff16f76708c1cc79f48552c8bb8c2a72e723', class: "avatar", icon: this.icon, initials: this.initials, part: "avatar", src: this.src, tone: this.tone, variant: this.variant })), this.src && this.preview !== 'avatar' && (h("mds-img", { key: '1bb87768a03fd62aecbbc7386bcaf401ecbe1259', class: "picture", part: "picture", src: this.src })), h("div", { key: '28c4c0b772b782f9762c04f0cc427ff4da3945b5', class: "content", part: "content" }, h("div", { key: '301eb2070f2533ed6b8b8d845dda4d84c3a9cc03', class: "header" }, h("div", { key: '6dbd4c9f6eb046caf3c71fea61e93aafd26b052b', class: "infos" }, this.hasBadge && (h("div", { key: '13193cf6115c77c24530b037a1dead25b5107d26' }, h("slot", { key: '028a3b61823ba984c6a66134eeeff7099712eed1', name: "badge" }))), this.subject && (h("mds-text", { key: '0b6e0d5fac1ad8862a445ecf648aff1b5e5ddf96', class: "subject", typography: "h6", variant: "title", truncate: "all" }, this.subject))), this.datetime && (h("mds-text", { key: 'd198e534b59b39ccc8f34179b6e7cc8e875cbba4', class: "time", typography: "option" }, this.dateFormat === 'timeago'
             ? dayjs(this.datetime).fromNow()
-            : dayjs(this.datetime).format(this.dateFormat)))), h("mds-text", { key: '4554d9ae482fefec3899d740d74227657d612fd5', class: "message", truncate: "all", typography: "caption", variant: "info" }, this.message), this.hasActions && (h("div", { key: 'ddc27141fb944f8ecf6c1e72082c9fc2428edb4e', class: "actions", part: "actions" }, h("slot", { key: '315db21f5d2f6e3f43849c64de4407422dfafed2', name: "action" })))), this.deletable && (h("mds-button", { key: '25190761bcc0b1afb4ae807bc6e880edd98d7dcc', class: "close-button", variant: "dark", tone: "text", title: this.t.get('dismiss'), icon: miBaselineCancel, onClick: this.onClickClose.bind(this) }))));
+            : dayjs(this.datetime).format(this.dateFormat)))), h("mds-text", { key: '4ae6ff7676fb2915ba1f0c11c3c888c2e0e90227', class: "message", truncate: "all", typography: "caption", variant: "info" }, this.message), this.hasActions && (h("div", { key: '4fdaef14f44055d0b8067a6d5e5c468b3bce978c', class: "actions", part: "actions" }, h("slot", { key: '9133fc9fc13f8b049b4c527ee69e536b79404e12', name: "action" })))), this.deletable && (h("mds-button", { key: '18673378fcf8dbb38c3db8c0e5c2f95da606f1e3', class: "close-button", variant: "dark", tone: "text", title: this.t.get('dismiss'), icon: miBaselineCancel, onClick: this.onClickClose }))));
     }
     static get is() { return "mds-push-notification-item"; }
     static get encapsulation() { return "shadow"; }
@@ -395,7 +398,7 @@ export class MdsPushNotificationItem {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "",
+                    "text": "Updates the component's texts to the locale currently set on the host element.",
                     "tags": []
                 }
             }

package/dist/collection/components/mds-quote/mds-quote.js

@@ -1,6 +1,6 @@
 import { Host, h } from "@stencil/core";
 /**
- * @slot default - Add `text string`, `HTML elements` or `components` to this slot.
+ * @slot - Add `text string`, `HTML elements` or `components` to this slot.
  * @slot author - Add `text string`, `HTML elements` or `components` to this slot.
  */
 export class MdsQuote {
@@ -15,7 +15,7 @@ export class MdsQuote {
         this.tag = 'h3';
     }
     render() {
-        return (h(Host, { key: '26db9230c187400e8df30d1c9300e0a39b4a709f' }, h("mds-text", { key: '4a1227b9e6e66376831c457746e26ec0d47b3144', class: "open-quote", tag: "div", typography: this.typography }, h("span", { key: '9d6f5ae659999f27d8de5b8e92ee13bdff75244b' }, h("i", { key: '89a139df5d605e4695f67a995174a2fbe3ca263b' }, "\u275D\u00A0"))), h("div", { key: '73d10c6274ac92bf79f1acdad40c4e7144738b4f', class: "quote" }, h("mds-text", { key: '8e6d76eec0ed6ca49b1ce01bdf5448b14c84fc1a', tag: this.tag, typography: this.typography }, h("i", { key: 'b7f817a0eda2745607a9c84d77d1059763f3d5e3' }, h("slot", { key: '1617cb4cd4ed8dc8608447c49e8872677bf69367' }), h("span", { key: '2d9982646e27a1f642d3c62bc4007caab348012e' }, "\u00A0\u275E"))), h("slot", { key: '4283ff3a9b4a31cb1e98e88e3ead9aa7e27fedb3', name: "author" }))));
+        return (h(Host, { key: 'e0461e5b838a8e7db53d39384f327fd843e21eda' }, h("mds-text", { key: 'beded9d2cbc0f1a3c723bea0fd7f6068cf7ab27c', class: "open-quote", tag: "div", typography: this.typography }, h("span", { key: '351fd3ab34a3416385141a27247334bab07f74e3' }, h("i", { key: '4ae64a9448f4a62e0bd70477c67ed64c8d2a40ff' }, "\u275D\u00A0"))), h("div", { key: '802b1c82e542f35db1979f2dac7453ca9e861827', class: "quote" }, h("mds-text", { key: '9932770037d60dfa3735981e61ef932970b8e25c', tag: this.tag, typography: this.typography }, h("i", { key: '369ec5348d4da453780dbb07010e9532efcfc5a4' }, h("slot", { key: 'f10a113f38016c56ccd8664197f2fc81f4b4accd' }), h("span", { key: 'dc6c06d16515abdcbb988e2334bb6e0994700114' }, "\u00A0\u275E"))), h("slot", { key: '9240410db5eae81038a3275087fa0edf04d0ce86', name: "author" }))));
     }
     static get is() { return "mds-quote"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-radial-menu/mds-radial-menu.js

@@ -3,6 +3,9 @@ import miBaselineMoreVert from "@icon/mi/baseline/more-vert.svg";
 import miBaselineClose from "@icon/mi/baseline/close.svg";
 import clsx from "clsx";
 import { Backdrop } from "../../common/floating-controller";
+/**
+ * @slot item - Add `mds-radial-menu-item` elements or `components` to this slot.
+ */
 export class MdsRadialMenu {
     constructor() {
         this.backdropController = new Backdrop('mds-radial-menu-backdrop');
@@ -111,7 +114,7 @@ export class MdsRadialMenu {
         this.onInteractionChange(this.interaction);
     }
     disconnectedCallback() {
-        if (!document)
+        if (typeof document === 'undefined')
             return;
         document.removeEventListener('contextmenu', this.toggleRightClickMenu);
     }
@@ -127,7 +130,7 @@ export class MdsRadialMenu {
         this.handleBackdrop();
     }
     onInteractionChange(newValue) {
-        if (!document)
+        if (typeof document === 'undefined')
             return;
         if (newValue === 'rightclick') {
             document.addEventListener('contextmenu', this.toggleRightClickMenu);
@@ -158,7 +161,7 @@ export class MdsRadialMenu {
         this.handleBackdrop();
     }
     render() {
-        return (h(Host, { key: '18679022a9759985a3c518df2d733b94d28473dc' }, h("mds-button", { key: '156f0692417d19bc2f9418469d1b011ea5f0f72f', class: clsx('menu-button', this.interaction !== 'click' && 'menu-button--hidden'), icon: this.opened ? miBaselineClose : this.icon, tone: this.tone, variant: this.variant, size: this.size, onClick: this.toggleMenu }), h("div", { key: '4277fb28c411a3ec3808d46e260e0800fc92eebb', class: "radial-menu", part: "radial-menu" }, h("slot", { key: 'ff21f4e1110c14954128ec0e891507ff178fa548', name: "item", onSlotchange: this.updateItems })), h("div", { key: 'e5dc3a9fbd3f813721bfdefbbf445fb4b4301995', class: "disc" })));
+        return (h(Host, { key: 'c17ebeeb32b4986baceb48b61e814c6ca2830caf' }, h("mds-button", { key: '7e57c42d3dd0f5067da69c327810f70a31370750', class: clsx('menu-button', this.interaction !== 'click' && 'menu-button--hidden'), icon: this.opened ? miBaselineClose : this.icon, tone: this.tone, variant: this.variant, size: this.size, onClick: this.toggleMenu }), h("div", { key: '107da816c1d1aba0cd8f660e6911c6e603728747', class: "radial-menu", part: "radial-menu" }, h("slot", { key: '67c7f462a71df73038287f5fb5cf1a83eb78bc22', name: "item", onSlotchange: this.updateItems })), h("div", { key: '405b0c970a702148029f52c628974f6e38b179df', class: "disc" })));
     }
     static get is() { return "mds-radial-menu"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-radial-menu-item/mds-radial-menu-item.js

@@ -9,10 +9,13 @@ export class MdsRadialMenuItem {
          * Specifies the color variant for the button
          */
         this.variant = 'dark';
+        /**
+         * Specifies the size of the menu item.
+         */
         this.size = 'lg';
     }
     render() {
-        return (h(Host, { key: '9611b4afe26d59d69b5e934e6048998a5a6b15a1', slot: "item" }, h("mds-button", { key: '93984131bf9fe5aafcb1e08e3ceb86df18a2ee39', "aria-label": this.tooltip, class: "button", icon: this.icon, variant: this.variant, tone: this.tone, size: this.size }), this.tooltip && (h("mds-tooltip", { key: '849a979a53edeca55985f31b88f4e136558fea48', class: "tooltip", target: ".button", placement: "top", autoPlacement: false }, this.tooltip))));
+        return (h(Host, { key: 'aa8e1d03c590ad9efbf6e5090a59f70460782a33', slot: "item" }, h("mds-button", { key: '06ca066406df3e40b262bc0ffbbda3cc65c190cf', "aria-label": this.tooltip, class: "button", icon: this.icon, variant: this.variant, tone: this.tone, size: this.size }), this.tooltip && (h("mds-tooltip", { key: '50a03f527adb6ead0757ea380d31c51943129570', class: "tooltip", target: ".button", placement: "top", autoPlacement: false }, this.tooltip))));
     }
     static get is() { return "mds-radial-menu-item"; }
     static get encapsulation() { return "shadow"; }
@@ -139,7 +142,7 @@ export class MdsRadialMenuItem {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "Specifies the size of the menu item."
                 },
                 "getter": false,
                 "setter": false,

package/dist/collection/components/mds-radial-progress/mds-radial-progress.js

@@ -71,7 +71,7 @@ export class MdsRadialProgress {
     render() {
         const progressVar = `${(this.animatedProgress * 100).toFixed(2)}%`;
         const progressText = this.progressPercentage(this.clampProgress(this.progress));
-        return (h(Host, { key: 'bcac88e69c445c6bfb5de1cbbfc649ffd507dc12', style: { '--mds-radial-progress': progressVar }, role: "progressbar" }, h("div", { key: 'c874c37272324a7edfa12252e22547c4ae6a8c5b', class: "value-container", part: "value-container" }, this.icon && h("mds-icon", { key: 'ab14594f35d5ed15f6997c2cce47ca44612eab1d', class: "icon", name: this.icon, part: "icon" }), h("div", { key: '107216f2319c2895f0a9c6936c1c1ae42a54a0b5', class: "value-container__text" }, h("mds-text", { key: '27127a11de571b6b1703690aa37553b20db84aff', class: "value", typography: this.typography }, progressText)))));
+        return (h(Host, { key: '68c58b94fb1a5b12e843323d1d497a33a2e91e8f', style: { '--mds-radial-progress': progressVar }, role: "progressbar" }, h("div", { key: '0d8b174656f21146ac18a0c613ecc9482262b205', class: "value-container", part: "value-container" }, this.icon && h("mds-icon", { key: 'd17e55a7ba548f7e603f717a828907a873eaa4d6', class: "icon", name: this.icon, part: "icon" }), h("div", { key: 'c4f2d539d974d3a63ec73381d60abc9afc9be8e7', class: "value-container__text" }, h("mds-text", { key: 'c40e43da4bb6d581569cb515c30dd8554a8bfcd2', class: "value", typography: this.typography }, progressText)))));
     }
     static get is() { return "mds-radial-progress"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-separator/mds-separator.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class MdsSeparator {
     render() {
-        return h(Host, { key: 'b77bfa637825f2c45736df617eaac64b69427ad0' });
+        return h(Host, { key: '8056c695f2c418fbcb7041fb5f343a0ce76f80a7' });
     }
     static get is() { return "mds-separator"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-spinner/mds-spinner.js

@@ -13,7 +13,7 @@ export class MdsSpinner {
         }
     }
     render() {
-        return (h(Host, { key: 'da29b22d2ddd2824a2f71aa9a6ea2c31da835b14' }, h("i", { key: 'c8cdc857de88d6e1c89f1365b4f11a7dc96e1ef1', class: "await-icon", innerHTML: awaitIcon })));
+        return (h(Host, { key: '687dc98a043d362db35bf00ec71052097b3f509c' }, h("i", { key: '9b374e6a3aeebf211fbc56ad1446dec19cd1da9e', class: "await-icon", innerHTML: awaitIcon })));
     }
     static get is() { return "mds-spinner"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-status-bar/mds-status-bar.js

@@ -1,6 +1,6 @@
 import { Host, h } from "@stencil/core";
 /**
- * @slot default - Add `HTML elements` or `components`, it is **recommended** to use `mds-button` element.
+ * @slot - Add `HTML elements` or `components`, it is **recommended** to use `mds-button` element.
  * @part actions - Selects the `actions` container element wrapped in shadowDOM.
  * @part status-bar - Selects the `status-bar` window component wrapped in shadowDOM.
  * @part status-bar-area - Selects the `status-bar-area` which wraps `status-bar` element with darker area in shadowDOM.
@@ -26,11 +26,14 @@ export class MdsStatusBar {
             this.visible = undefined;
         }
     }
+    /**
+     * Hides the status bar.
+     */
     async hide() {
         this.visible = undefined;
     }
     render() {
-        return (h(Host, { key: '2e37f49ed168ac4f92de372d2174073b193ed5f3' }, h("mds-modal", { key: '248f8662369de074f704d86b3ff83597b2403592', class: "modal", opened: this.visible, position: this.position, animation: "custom", overflow: this.overflow }, h("div", { key: '3acce82b21bd279dab72e67cf3ecaa6c2c88c228', class: "status-bar-area", part: "status-bar-area", slot: "window" }, h("div", { key: '40b7f67c8e568860cbdf843ca46b98f5fa61a765', class: "status-bar", part: "status-bar" }, this.description && (h("mds-text", { key: 'e669ba5dfe960c3a11812f55720f35ad2d1514a6', typography: "caption", class: "description" }, this.description)), h("div", { key: 'bb0266d41aa9eabd340e1a709a625e94c08682ed', class: "actions", part: "actions" }, h("slot", { key: 'aac6557450ec7509c1126dfc1ccc629474e4d5e8' })))))));
+        return (h(Host, { key: '8b1a0fd4300583d834e1f33796bb8d01b4b585a8' }, h("mds-modal", { key: 'f1ab035918beff8cffd0c10474fff898b00952cf', class: "modal", opened: this.visible, position: this.position, animation: "custom", overflow: this.overflow }, h("div", { key: 'a2a57a2c80322db3622b8e44ea5ca29f12946eea', class: "status-bar-area", part: "status-bar-area", slot: "window" }, h("div", { key: 'ea668180e6691b33d2a5377e6c6f510be23a227f', class: "status-bar", part: "status-bar" }, this.description && (h("mds-text", { key: '3db7d7efc103c0186f3504db52aea0406c1e57bb', typography: "caption", class: "description" }, this.description)), h("div", { key: 'd1daa893d59a6f7b1c5e7316bc3fec6352b919b8', class: "actions", part: "actions" }, h("slot", { key: 'd24bdaf3e0e25b3f2e8594dbe050436ea270f338' })))))));
     }
     static get is() { return "mds-status-bar"; }
     static get encapsulation() { return "shadow"; }
@@ -155,7 +158,7 @@ export class MdsStatusBar {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "",
+                    "text": "Hides the status bar.",
                     "tags": []
                 }
             }

package/dist/collection/components/mds-stepper-bar/mds-stepper-bar.js

@@ -1,6 +1,6 @@
 import { Host, h, } from "@stencil/core";
 /**
- * @slot default - Add `mds-tepper-bar-item` element/s.
+ * @slot - Add `mds-tepper-bar-item` element/s.
  * @slot content - Add `HTML elements` or `components`, one per mds-stepper-bar-item added
  * @part items - Selects the `items` container element wrapped in shadowDOM.
  * @part contents - Selects the `contents` container element wrapped in shadowDOM.
@@ -29,7 +29,7 @@ export class MdsStepperBar {
                 item.done = false;
                 if (key < this.currentItem) {
                     item.done = true;
-                    if (item.value) {
+                    if (item.value !== undefined && item.value !== '') {
                         values.push(item.value);
                     }
                 }
@@ -99,7 +99,7 @@ export class MdsStepperBar {
         });
     }
     render() {
-        return (h(Host, { key: 'a0b7e159765a3130fcc67b2e3a1146b0c43907ff' }, h("div", { key: '25d1984f704bc071cda8010ab382384d28b86273', class: "items", part: "items" }, h("slot", { key: 'f32c13a94bbce2e93f28ef23b2dfcaeec17269d1' })), h("div", { key: '7dc90454240058f41ce07f98bb53e4376346b582', class: "contents", part: "contents" }, h("slot", { key: '25185f4817e18132b066c01d9d98353e1f62b19e', name: "content" }))));
+        return (h(Host, { key: '07b3ac18136f0bc4e6b7424238705c951a37e0bf' }, h("div", { key: '7d2e747d084bc581966e88c55ad19a8b27086030', class: "items", part: "items" }, h("slot", { key: '7934e741a279fdf3635c9ef56a92c96441f21081' })), h("div", { key: '3d3c6e31fa33b046604845886bfd94093e51bba8', class: "contents", part: "contents" }, h("slot", { key: '9af87d63470bf64e882477dc4f8d0e25159a708d', name: "content" }))));
     }
     static get is() { return "mds-stepper-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-stepper-bar-item/mds-stepper-bar-item.js

@@ -44,6 +44,9 @@ export class MdsStepperBarItem {
             return (h("mds-badge", { class: "badge", variant: "dark", tone: "weak", typography: "option" }, this.t.get('badgeQueued')));
         };
     }
+    /**
+     * Updates the component's texts to the locale currently set on the host element.
+     */
     async updateLang() {
         this.language = this.t.lang(this.host);
     }
@@ -71,7 +74,7 @@ export class MdsStepperBarItem {
         this.isCurrent = newValue;
     }
     render() {
-        return (h(Host, { key: '117ff77114f72fb2e58659a53a594b133092edc2' }, h("div", { key: 'bdfcff07ea6e0c849643b1c36d8d0a3004d90a0f', class: "header" }, h("mds-icon", { key: '15a20b0bb4bd3ec80e04890fafe28f657aa50c62', class: "icon", name: clsx(this.isDone && !this.isCurrent ? this.iconChecked : this.icon) }), h("mds-progress", { key: '3da9d9cd257d82f7628f5f2845524854fd6a43e2', "aria-hidden": "true", class: "progress", progress: this.isDone ? 1 : 0 })), h("div", { key: '21ceca94f0545a0110558483668f289122fb2dcf', class: "infos" }, this.step && (h("mds-text", { key: 'd7609567247c9cf43acf3a52b8ee0c3e1697fbc5', class: "step", typography: "option" }, this.t.get('step', { index: this.index + 1 }))), this.label && (h("mds-text", { key: '3fc26167d085031d5ff9c7241c80046d28a1843d', class: "text", typography: this.typography }, this.label)), this.badge && h("div", { key: '1ff407f2b05a19f13d3cdf7abc508853e9fb951c', part: "badge" }, this.showBadge()))));
+        return (h(Host, { key: '153ad28fc7602065f33667e8eee0674ed6c03199' }, h("div", { key: 'eb763ce9856102511798408c6d060154e2ac6ea5', class: "header" }, h("mds-icon", { key: '1be42e5b2c360eba80ab2a17b350081a18b47539', class: "icon", name: clsx(this.isDone && !this.isCurrent ? this.iconChecked : this.icon) }), h("mds-progress", { key: 'ffc6dd8c3d9e643d6baf1b05847dad5f18425607', "aria-hidden": "true", class: "progress", progress: this.isDone ? 1 : 0 })), h("div", { key: '2ada9d24154c880007dfc39c626ada7605260e00', class: "infos" }, this.step && (h("mds-text", { key: '841db62d45c451aae46b1bd27fe459d9ab35ca00', class: "step", typography: "option" }, this.t.get('step', { index: this.index + 1 }))), this.label && (h("mds-text", { key: 'c11ce137d906cf357e478e53a83cc3b802b2d15d', class: "text", typography: this.typography }, this.label)), this.badge && h("div", { key: 'bc067a6ad5462ddcc7d9b8cdfda458e5e7fff73a', part: "badge" }, this.showBadge()))));
     }
     static get is() { return "mds-stepper-bar-item"; }
     static get encapsulation() { return "shadow"; }
@@ -319,7 +322,7 @@ export class MdsStepperBarItem {
                     "return": "Promise<void>"
                 },
                 "docs": {
-                    "text": "",
+                    "text": "Updates the component's texts to the locale currently set on the host element.",
                     "tags": []
                 }
             }

package/dist/collection/components/mds-tab/mds-tab.js

@@ -7,7 +7,7 @@ import { cssDurationToMilliseconds } from "../../common/unit";
  * @part slider - Selects the slider element which is visible when attribute `animation` is set to `slide`.
  * @part tabs - Selects the container of `mds-tab-item` list elements.
  * @slot content - Add `HTML elements` or `components`, one per mds-tab-item added.
- * @slot default - Add `mds-tab-item` element/s.
+ * @slot - Add `mds-tab-item` element/s.
  */
 export class MdsTab {
     constructor() {
@@ -44,7 +44,7 @@ export class MdsTab {
                 item.size = this.size;
             });
             this.tabItems.forEach((item, key) => {
-                if (!item.id) {
+                if (item.id === '') {
                     setAttributeIfEmpty(item, 'id', hashRandomValue('mds-tab-item'));
                 }
                 if (item.selected) {
@@ -75,7 +75,7 @@ export class MdsTab {
             this.updateOverflowState();
         };
         this.updateOverflowState = () => {
-            if (!this.tabs || !this.tabsContainer)
+            if (this.tabs == null || this.tabsContainer == null)
                 return;
             const containerWidth = this.tabsContainer.offsetWidth;
             const tabsWidth = this.tabs.scrollWidth;
@@ -206,12 +206,12 @@ export class MdsTab {
         });
     }
     render() {
-        return (h(Host, { key: 'cce3940ff16568da1dfe05f92703e4728bccb046' }, h("div", { key: '36e2dac7142dc4656ffc7e8c0428a3cebf922eeb', class: clsx('tabs-wrapper', this.fill && 'tabs-wrapper--fill') }, this.overflow && (h("div", { key: '12f6f6cbbdd3de8aacddb74cd9dd853e4d6b8b3d', class: clsx('tabs-wrapper-overflow-left', this.overflowLeft && 'tabs-wrapper-overflow-left--show') })), this.overflow && (h("div", { key: '5fbac5f5d688d73c5691a5620876a3d3393ff3ce', class: clsx('tabs-wrapper-overflow-right', this.overflowRight && 'tabs-wrapper-overflow-right--show') })), h("div", { key: 'b20ce9bd0f6706d5f8ba7c89cdc1fe7656c59c81', class: "tabs", part: "tabs", role: "tablist" }, h("slot", { key: '6e1266f9ba7bb07121ea46e4b6703b11b6dc1dab' }), this.animation === 'slide' && (h("div", { key: 'b314111ac0a86da0fbe6105d2b152007df9102c8', class: "slider", part: "slider", style: {
+        return (h(Host, { key: '80d8b12242b72f94479bdf196c8bc7135a305a8c' }, h("div", { key: '307d15fe46c0a82d4a3f9806aecc0592e04f9cfb', class: clsx('tabs-wrapper', this.fill && 'tabs-wrapper--fill') }, this.overflow && (h("div", { key: 'b593c0214f0e9c11a0d8831093e08c4a96b4e6e9', class: clsx('tabs-wrapper-overflow-left', this.overflowLeft && 'tabs-wrapper-overflow-left--show') })), this.overflow && (h("div", { key: '384ef0a5d39785aee8dc42e093fe4c50b8270dc7', class: clsx('tabs-wrapper-overflow-right', this.overflowRight && 'tabs-wrapper-overflow-right--show') })), h("div", { key: '90f41f2d5ac1fc3e286ac262ae1502c5f9ebb33e', class: "tabs", part: "tabs", role: "tablist" }, h("slot", { key: '4b9183053872aa01d857a3fe3a1009d50125d0b1' }), this.animation === 'slide' && (h("div", { key: 'fdc734f877ef9a41da18e694a7bf68bdb2bf0db5', class: "slider", part: "slider", style: {
                 '--mds-tab-slider-width': `${this.sliderWidth}px`,
                 '--mds-tab-slider-height': `${this.sliderHeight}px`,
                 '--mds-tab-slider-offset-x': `${this.sliderOffsetX}px`,
                 '--mds-tab-slider-offset-y': `${this.sliderOffsetY}px`,
-            } })))), h("div", { key: 'e3cc9d9abc57bd7ddcf6ee17043100d816100531', class: "contents", part: "contents" }, h("slot", { key: '4ecc3ff8d6687f293092d5420d0d4858da344d43', name: "content", onSlotchange: this.updateContentItems }))));
+            } })))), h("div", { key: 'c64737e1a93159defa4b48b56b166f508d40cf84', class: "contents", part: "contents" }, h("slot", { key: '2c795ecacb613662ddd79108d8c0028bc1135fd0', name: "content", onSlotchange: this.updateContentItems }))));
     }
     static get is() { return "mds-tab"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-tab-bar/mds-tab-bar.js

@@ -1,6 +1,6 @@
 import { Host, h } from "@stencil/core";
 /**
- * @slot default - Add `mds-tab-bar-item` element/s.
+ * @slot - Add `mds-tab-bar-item` element/s.
  */
 export class MdsTabBar {
     constructor() {
@@ -20,7 +20,7 @@ export class MdsTabBar {
         });
     }
     render() {
-        return (h(Host, { key: '65e92345e90f0b287bcb89e42803730b914bb6c1' }, h("slot", { key: 'c5eb2105f89f7957a0fb0aa5752d40d90d4396b3' })));
+        return (h(Host, { key: '84740f9df076cec8856a6cbe740bfc3f1611cbb8' }, h("slot", { key: '0ce78860c913e57192918839130e566b349b7804' })));
     }
     static get is() { return "mds-tab-bar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/mds-tab-bar-item/mds-tab-bar-item.js

@@ -1,10 +1,13 @@
 import { Host, h, } from "@stencil/core";
 import { readSlottedLabel, sanitizeLabel } from "../../common/slot";
 /**
- * @slot default - **Deprecated**, use the `label` property instead. Add `text string` to this slot, **avoid** to add `HTML elements` or `components` here.
+ * @slot - **Deprecated**, use the `label` property instead. Add `text string` to this slot, **avoid** to add `HTML elements` or `components` here.
  */
 export class MdsTabBarItem {
     constructor() {
+        /**
+         * The icon displayed in the tab bar item.
+         */
         this.icon = '';
         /**
          * Specifies the typography of the element
@@ -18,7 +21,7 @@ export class MdsTabBarItem {
         };
         this.onSlotChangeHandler = () => {
             /* this should be removed in the future once slotted text is no longer used, use the label property instead */
-            if (this.label)
+            if (this.label !== undefined && this.label !== '')
                 return;
             this.label = readSlottedLabel(this.element);
         };
@@ -33,7 +36,7 @@ export class MdsTabBarItem {
         this.label = sanitizeLabel(newValue);
     }
     render() {
-        return (h(Host, { key: 'cfdd8682bdab7117d3853abff77c31f871314a20', onClick: this.select }, h("mds-icon", { key: '4dd1b08193a0c6c1238104c1484523b7cc074a8a', name: this.icon }), h("mds-text", { key: 'd8bb748fbc4941fd5b65101997a1a21b1b7a1ed4', typography: this.typography }, this.label || h("slot", { key: '7e4fead88e847406b6e22ac534fcd67862fbe613', onSlotchange: this.onSlotChangeHandler }))));
+        return (h(Host, { key: 'f3c37cdf12cd99a5e9c2ffa3ef04af68548c4c3c', onClick: this.select }, h("mds-icon", { key: 'f79a29591079ab87d9afcc6e5bcf3acf8db4c66c', name: this.icon }), h("mds-text", { key: '5399aa307b7c9e097232b903e3482b2f2d8eebc4', typography: this.typography }, this.label || h("slot", { key: 'ebd5d848468f5f0fd895c93b5c67f7954636234a', onSlotchange: this.onSlotChangeHandler }))));
     }
     static get is() { return "mds-tab-bar-item"; }
     static get encapsulation() { return "shadow"; }
@@ -61,7 +64,7 @@ export class MdsTabBarItem {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": ""
+                    "text": "The icon displayed in the tab bar item."
                 },
                 "getter": false,
                 "setter": false,