@maggioli-design-system/magma 1.11.7 → 1.12.0

package/dist/esm/mds-dropdown.entry.js

@@ -217,9 +217,9 @@ const MdsDropdown = class {
         this.km.detachEscapeBehavior();
     }
     render() {
-        return (h(Host, { key: 'd1da570558e373c58fd8806494d50903705f3975', style: {
+        return (h(Host, { key: '611b52d0d95b82ff0a15418a2912436aa8036a25', style: {
                 zIndex: `${this.zIndex}`,
-            } }, h("div", { key: '08ca7259305dbb9dfcf979b6f4e65701187ea65f', class: "arrow", innerHTML: arrowSvg }), h("slot", { key: 'cafea12f69617beda65ae7653804d03a39f3ffa7' })));
+            } }, h("div", { key: '438608dea4c704636a0ebb60d77403a55820972c', class: "arrow", innerHTML: arrowSvg }), h("slot", { key: '72b92abf8d288c0ae4dbb606c23ff9bfc274cf78' })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/mds-emoji.entry.js

@@ -6422,7 +6422,7 @@ const MdsEmoji = class {
         window.removeEventListener('mousemove', this.handleFollowMouse);
     }
     render() {
-        return h(Host, { key: '27445bb72a3b9356d04c9f750659e340c55df645' }, this.name === 'hexabot' && (h("svg", { key: 'dc5b2458b8d81a2442a17ab78977872d1e38980d', ref: el => (this.emojiEl = el), viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: '1fcbc98434f91dde73cd07d0949fa204054f77b1', class: "head", ref: el => (this.headEl = el), d: this.headGeometry.hexagonRounded, fill: "black" }), h("path", { key: '83e37976089c0178c1fae60afbebc69c095c58ba', class: "eye", ref: el => (this.eyeLeftEl = el), d: this.eyeLeftGeometry.open, fill: "white" }), h("path", { key: 'b269ce64bf75a48edcfda40ce43148e96aa01040', class: "eye", ref: el => (this.eyeRightEl = el), d: this.eyeRightGeometry.open, fill: "white" }), h("path", { key: '181b23f8bfe386eb904b03a2c701dc8afc897214', class: "mouth", ref: el => (this.mouthEl = el), d: this.mouthGeometry.smile, fill: "white" }), h("path", { key: '97f3ab4d10088161dee6c9e577815cb38ac5cbd0', class: "hand", ref: el => (this.handLeftEl = el), d: this.handLeftGeometry.think, fill: "white" }))));
+        return h(Host, { key: '426c2dbb4cb80336f8897c8ae70049d3deef5a3b' }, this.name === 'hexabot' && (h("svg", { key: 'f9ce19561efca4aebf8149aa74e08afe74cc3e9c', ref: el => (this.emojiEl = el), viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { key: 'f240afd90d41d7581678cf524ef91d0738954821', class: "head", ref: el => (this.headEl = el), d: this.headGeometry.hexagonRounded, fill: "black" }), h("path", { key: '6a8e51ad759a6db9fb97723d287a0fa4bde2db10', class: "eye", ref: el => (this.eyeLeftEl = el), d: this.eyeLeftGeometry.open, fill: "white" }), h("path", { key: '737dceb5d0f2e03097b9745d823f7f71f5a467c6', class: "eye", ref: el => (this.eyeRightEl = el), d: this.eyeRightGeometry.open, fill: "white" }), h("path", { key: 'cb7132bdb42a7cd33218de1eeb7be5f620c104ba', class: "mouth", ref: el => (this.mouthEl = el), d: this.mouthGeometry.smile, fill: "white" }), h("path", { key: '3f04aa7216b868422217406347d85c6ef55e667d', class: "hand", ref: el => (this.handLeftEl = el), d: this.handLeftGeometry.think, fill: "white" }))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/mds-entity.entry.js

@@ -28,10 +28,10 @@ const MdsEntity = class {
         this.actions = this.hostElement.querySelector(':scope > [slot="action"]') !== null;
     }
     render() {
-        return (h(Host, { key: 'cfd85b00824cadeb2bfec79d882245da68f701ea' }, h("div", { key: '79b7d8cfc266afc9038097b599688c43e20d5147', class: "spinner", part: "spinner" }, h("mds-spinner", { key: 'd0a82d4f9109a19e9298bdebfa37b16d6d1a4d8f', running: true })), this.checkAvatar() &&
-            h("mds-avatar", { key: '656e4ed33bde9f84e8d2c7d35c45b08b1cd745d9', class: "preview", icon: this.icon, initials: this.initials, src: this.src, tone: this.tone, variant: this.variant, part: "avatar" }), h("div", { key: '26d617f56a8eba8008ef7f0a8fcde6d1e2d4a4ac', class: "infos" }, h("slot", { key: 'f888a79c15751a0a5779b366c16dbfd042910512' }), this.details &&
-            h("div", { key: 'a35c706ecef07339731134b1505f181c77bfc741', class: "details" }, h("slot", { key: 'a344fbfebcd221378c8f578f320d9535666673e8', name: "detail" }))), this.actions &&
-            h("div", { key: 'c951b6f3bd800e95f32e860a1debf479757c5a6f', class: "actions" }, h("slot", { key: '9989dfecd6c28f61d32dc52be477b0e18a71b41f', name: "action" }))));
+        return (h(Host, { key: '8a36994c8dba823ded1073269f7daba8761fb74c' }, h("div", { key: 'ff0fe77bfc04bfbc80028ddedbdfdf16ba1e76a5', class: "spinner", part: "spinner" }, h("mds-spinner", { key: '16708efad1581c6be3f522e30fadf67dced790b2', running: true })), this.checkAvatar() &&
+            h("mds-avatar", { key: 'f175454b831126d2efaa021748e4f5da7d1fb827', class: "preview", icon: this.icon, initials: this.initials, src: this.src, tone: this.tone, variant: this.variant, part: "avatar" }), h("div", { key: '55431edca0683dbae25d19b538185e1c74552ca2', class: "infos" }, h("slot", { key: 'c79cf3176f50bee9cae1653b8271d665b001355e' }), this.details &&
+            h("div", { key: '0ab6bab732c454d92305f9c4d3cdaa5f3b670bd4', class: "details" }, h("slot", { key: 'f7bc347f5f5ff968220d0d572c6758624db8283f', name: "detail" }))), this.actions &&
+            h("div", { key: '062cc22d512b0298b3bbd71b435ed47e06e9fe18', class: "actions" }, h("slot", { key: '9ac39cd0db729de640ef90b4c48b2bb59fe416e5', name: "action" }))));
     }
     get hostElement() { return getElement(this); }
 };

package/dist/esm/mds-file-preview.entry.js

@@ -271,11 +271,11 @@ const MdsFilePreview = class {
     }
     render() {
         var _a, _b, _c;
-        return (h(Host, { key: '0710d30368cdde1184606c5faa805cdd0bb9054a' }, this.deletable && h("mds-button", { key: '366d3fe7de6e92b3bf8c0be6736666b593ec16cb', title: this.t.get('remove'), class: "action-delete", icon: miBaselineCancel, variant: "light", onClick: this.onClickDeletedEvent }), h("div", { key: 'a9c09b7749ea1f63e8cb4ee2e5383bfc9ae0d1b3', class: "card", part: "card", onClick: this.onClickDownloadEvent }, this.src && !this.message && getExtensionInfos(this.filename, this.suffix).preview
+        return (h(Host, { key: 'c19f52934f1fa591d71175d1a0a584c0e9d0bd92' }, this.deletable && h("mds-button", { key: '89ea5ca40b769a2be0fd1a85a647c76cfec19d1a', title: this.t.get('remove'), class: "action-delete", icon: miBaselineCancel, variant: "light", onClick: this.onClickDeletedEvent }), h("div", { key: '4549aaf3814a0b76176ba5ff7c661ccb8459f537', class: "card", part: "card", onClick: this.onClickDownloadEvent }, this.src && !this.message && getExtensionInfos(this.filename, this.suffix).preview
             ? h("mds-img", { src: this.src, class: "preview preview--image", "aspect-ratio": "1/1" })
             : h("div", { class: clsx('preview', !this.message ? 'preview--icon' : 'preview--status') }, this.icon
                 ? h("mds-icon", { class: "icon", name: this.icon })
-                : h("mds-icon", { class: "icon", name: getFormatsVariant(this.filename, this.suffix).icon }), this.message && h("mds-text", { class: "message", typography: "caption", variant: "info" }, this.message)), h("mds-text", { key: 'e2f1c6aca7f7e98f66d89aea9c53610ab9300f95', class: "file-name", typography: "h6", variant: "title", truncate: this.truncate, title: this.filename }, this.filename), h("footer", { key: '3535084a42e1ad9f62c57ac54032a479f3a34463', class: clsx('infos', this.filesize && 'infos--has-file-size') }, this.filesize && this.filesize === Number(this.filesize).toString() && h("mds-text", { key: '79c2bccab6b0740730193a54551a264beac1d772', class: "file-size", truncate: "word", typography: "caption", variant: "info" }, filesize(Number(this.filesize), { standard: 'jedec' })), this.filesize && this.filesize !== Number(this.filesize).toString() && h("mds-text", { key: '143a603b4d3d974e3f93a06d3e2771a723a257d3', class: "file-size", truncate: "word", typography: "caption", variant: "info" }, this.filesize), getSuffix(this.filename, this.suffix) && h("mds-badge", { key: '39c15b38bc2c5d92151b299f4f93095e9fd17f4e', variant: getFormatsVariant(this.filename, this.suffix).variant, tone: "weak", class: "suffix", title: (_a = this.description) !== null && _a !== void 0 ? _a : this.t.get(this.getDefaultKeyDescription()) }, getSuffix(this.filename, this.suffix)), !this.filesize && h("mds-text", { key: '646a25849f8188fb5ac60cfeac9d0977ecd9f806', class: "description", truncate: "word", typography: "caption", variant: "info", title: (_b = this.description) !== null && _b !== void 0 ? _b : this.t.get(this.getDefaultKeyDescription()) }, (_c = this.description) !== null && _c !== void 0 ? _c : this.t.get(this.getDefaultKeyDescription()))))));
+                : h("mds-icon", { class: "icon", name: getFormatsVariant(this.filename, this.suffix).icon }), this.message && h("mds-text", { class: "message", typography: "caption", variant: "info" }, this.message)), h("mds-text", { key: 'b65a6b6b3dff0c40cda7493fede3e906ec2a39bb', class: "file-name", typography: "h6", variant: "title", truncate: this.truncate, title: this.filename }, this.filename), h("footer", { key: '9a3ab25be54faa5d535eaaf4449985090aa5a9ea', class: clsx('infos', this.filesize && 'infos--has-file-size') }, this.filesize && this.filesize === Number(this.filesize).toString() && h("mds-text", { key: '4c975b0c31a93568e2776ec71778a117d5eeeb66', class: "file-size", truncate: "word", typography: "caption", variant: "info" }, filesize(Number(this.filesize), { standard: 'jedec' })), this.filesize && this.filesize !== Number(this.filesize).toString() && h("mds-text", { key: '98912a75f1d391ec5ef30ddb122c71750a21dff2', class: "file-size", truncate: "word", typography: "caption", variant: "info" }, this.filesize), getSuffix(this.filename, this.suffix) && h("mds-badge", { key: 'e4985c4617aa81233dbb48dfa774c809e62f8384', variant: getFormatsVariant(this.filename, this.suffix).variant, tone: "weak", class: "suffix", title: (_a = this.description) !== null && _a !== void 0 ? _a : this.t.get(this.getDefaultKeyDescription()) }, getSuffix(this.filename, this.suffix)), !this.filesize && h("mds-text", { key: '180c16a686a3b627279388fd0f5f001bded84b65', class: "description", truncate: "word", typography: "caption", variant: "info", title: (_b = this.description) !== null && _b !== void 0 ? _b : this.t.get(this.getDefaultKeyDescription()) }, (_c = this.description) !== null && _c !== void 0 ? _c : this.t.get(this.getDefaultKeyDescription()))))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/mds-file.entry.js

@@ -7247,10 +7247,10 @@ const MdsFile = class {
     }
     render() {
         var _a, _b;
-        return (h(Host, { key: '98164a90398e0d806e0670b4340d0561603f9136', tabindex: "0", onClick: this.handleOnClick }, h("div", { key: 'aecf3480d6cbbf362579d657e19e83c94efa41c3', class: "preview" }, this.preview !== undefined
+        return (h(Host, { key: '0bb5dc19b383951d7fbc1327628fc243a44df46f', tabindex: "0", onClick: this.handleOnClick }, h("div", { key: '6db2f755dbe8a7bcb32408b2f432fa8c21bf8ffb', class: "preview" }, this.preview !== undefined
             ? h("div", { class: "image-preview", style: { backgroundImage: `url(${this.preview})` } })
-            : h("mds-icon", { name: getFormatsVariant(this.filename, this.suffix).icon })), h("div", { key: 'fda6deb724c9de6a6026682741403118c21a5ea7', class: "info" }, h("div", { key: 'c0a75cddb21deaad91ade553996c212676dfd78c', class: "filename", title: this.filename }, h("mds-text", { key: '18379a4576df47772387ed6a7b166b5477c56747', truncate: "word", typography: "h6", class: "name" }, getName(this.filename)), this.suffix === undefined && getSuffix(this.filename, this.suffix) && h("mds-text", { key: '49a7b61565e18930954d7cbb669747ad51d8b20d', typography: "h6", class: "extension" }, ".", getSuffix(this.filename, this.suffix))), h("div", { key: '39a5744eda874b5b5f983b17791f6c366e5b9ff2', class: "detail" }, getSuffix(this.filename, this.suffix) && h("mds-badge", { key: 'f5898dbc6fb1fa770acde22a473cd163dff5accd', variant: getFormatsVariant(this.filename, this.suffix).variant, tone: "weak", class: "suffix" }, getSuffix(this.filename, this.suffix)), h("mds-text", { key: 'e715745896c8ffb973271fae88bbbed23036190a', truncate: "word", typography: "caption", class: "description", title: (_a = this.description) !== null && _a !== void 0 ? _a : this.t.get(this.getDefaultDescription()) }, (_b = this.description) !== null && _b !== void 0 ? _b : this.t.get(this.getDefaultDescription())))), this.wasDownloaded && this.showDownloadedIcon &&
-            h("div", { key: '67fc181b52fa0cbedc2e0e35ee1def88222815e8', class: "indicator" }, h("i", { key: 'ee1d101f49d8925c11d1dccc91d480a6d84daab4', class: "downloaded", innerHTML: miBaselineFileDownloadDone, title: this.t.get('alreadyDownloaded') }))));
+            : h("mds-icon", { name: getFormatsVariant(this.filename, this.suffix).icon })), h("div", { key: '490831c841387780442520bca2411987013197c9', class: "info" }, h("div", { key: 'bb3cb62007b8b92885c78ebc2ff1189996f6cca2', class: "filename", title: this.filename }, h("mds-text", { key: 'c51ab1c69ebcc754d99acffe402f30df11368b70', truncate: "word", typography: "h6", class: "name" }, getName(this.filename)), this.suffix === undefined && getSuffix(this.filename, this.suffix) && h("mds-text", { key: '0a8ad649ed9292ce4e9c38ac0debe6826d302d75', typography: "h6", class: "extension" }, ".", getSuffix(this.filename, this.suffix))), h("div", { key: '7b87440b745f63583164e99802c01a770f545a82', class: "detail" }, getSuffix(this.filename, this.suffix) && h("mds-badge", { key: 'a2d422ba97d0d89bedbd597871df41af2381ddf0', variant: getFormatsVariant(this.filename, this.suffix).variant, tone: "weak", class: "suffix" }, getSuffix(this.filename, this.suffix)), h("mds-text", { key: '2e9534a1bae77749db33258609fafc27d1cf69a6', truncate: "word", typography: "caption", class: "description", title: (_a = this.description) !== null && _a !== void 0 ? _a : this.t.get(this.getDefaultDescription()) }, (_b = this.description) !== null && _b !== void 0 ? _b : this.t.get(this.getDefaultDescription())))), this.wasDownloaded && this.showDownloadedIcon &&
+            h("div", { key: '893d59f13b76e6d45489c278e312624b166ceab9', class: "indicator" }, h("i", { key: 'ff428c5087baa52839e4094d517a76fee8d16ceb', class: "downloaded", innerHTML: miBaselineFileDownloadDone, title: this.t.get('alreadyDownloaded') }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/mds-filter-item.entry.js

@@ -23,7 +23,7 @@ const MdsFilterItem = class {
     }
     render() {
         var _a;
-        return (h(Host, { key: '2c895fbc29ea9a0a3821a0dc60dee5dea65ab6cd', tabindex: this.disabled ? '-1' : '0', role: "menuitem", "aria-label": (_a = this.label) !== null && _a !== void 0 ? _a : this.icon, onClick: this.toggle }, this.icon && h("mds-icon", { key: 'a4bc5acb9550092fa6fdea9004a602c6e3912b7a', "aria-hidden": "true", name: this.icon }), this.label && h("mds-text", { key: '14d86de48ed76faeee001c5d4a7077b1997693a1', "aria-hidden": "true", variant: "info", typography: "caption" }, this.label), this.count && h("div", { key: '8fb24204fd2f30917f5041fda4e92c1271877294', class: "count" }, h("mds-text", { key: '2a282fdf25234f0e07c3be767408967070d2d33a', "aria-hidden": "true", variant: "info", typography: "option" }, this.count))));
+        return (h(Host, { key: 'cce4de5afd4da30374952cbbc4c6b694757d3d5f', tabindex: this.disabled ? '-1' : '0', role: "menuitem", "aria-label": (_a = this.label) !== null && _a !== void 0 ? _a : this.icon, onClick: this.toggle }, this.icon && h("mds-icon", { key: 'b03f521485192a0149f70b83730988214dd304d6', "aria-hidden": "true", name: this.icon }), this.label && h("mds-text", { key: '5fa46497d02b5e05b056cdea546d1b9d9eecc3af', "aria-hidden": "true", variant: "info", typography: "caption" }, this.label), this.count && h("div", { key: '9cdc8d67fcb81c58db3943dec77709fba4a03e3b', class: "count" }, h("mds-text", { key: 'b402310eb0d4043987776008c6584ed95b8e8e7d', "aria-hidden": "true", variant: "info", typography: "option" }, this.count))));
     }
     get element() { return getElement(this); }
 };

package/dist/esm/mds-filter.entry.js

@@ -94,7 +94,7 @@ const MdsFilter = class {
         this.changedEvent.emit({ children: items, value: this.itemsValues() });
     }
     render() {
-        return (h(Host, { key: '5e8605b02237f9249889191d54ae4246652c92d2', "aria-label": this.label, role: "menubar" }, this.label && h("mds-text", { key: '4d4ee003acd78cbc9a87e2ac9dba5f0aa3481530', class: "label", typography: "label" }, this.label), h("div", { key: '211a57862ff7facadb36b0fc74d82cc2b93c7764', class: "items-wrapper" }, h("div", { key: '99fbbc2e399a0a217a79e453c27e4277bb247721', class: clsx('items', this.active && 'active') }, h("slot", { key: '3803d540618c02719130c4fc44b208190962e3e1' }), h("div", { key: 'd516841b2efe68e2e603099223c6eb0e7d1e5377', class: clsx('reset', this.active && 'reset--opened') }, h("mds-filter-item", { key: 'e9b5c15cd2199d855007a617be24948d16e84fbf', selected: this.active, disabled: !this.active && this.reset, class: clsx('reset-button', this.active && 'reset-button-opened'), icon: miBaselineClose, onClick: this.resetItems }))))));
+        return (h(Host, { key: '2dcf168d8cd1db1f50e0162bf18c63f96e260ced', "aria-label": this.label, role: "menubar" }, this.label && h("mds-text", { key: '88a354f4000f4c12b3da275969ee394d7943c6ff', class: "label", typography: "label" }, this.label), h("div", { key: '9dd4279f939b7dea4213dbebcbf93d46c650f6e8', class: "items-wrapper" }, h("div", { key: '51f5aa8ce8baf80de5890354e7a12ffb8dd68c23', class: clsx('items', this.active && 'active') }, h("slot", { key: '7ed3b110e0c0e2025bdfe224cf4c50aaae8ef4c9' }), h("div", { key: '4ee1483f268903dae707a604c857441bbaf15509', class: clsx('reset', this.active && 'reset--opened') }, h("mds-filter-item", { key: '7be06d770241ae01527c798a1e7958e6a90971b9', selected: this.active, disabled: !this.active && this.reset, class: clsx('reset-button', this.active && 'reset-button-opened'), icon: miBaselineClose, onClick: this.resetItems }))))));
     }
     get element() { return getElement(this); }
 };

package/dist/esm/mds-header-bar.entry.js

@@ -31,9 +31,9 @@ const MdsHeaderBar = class {
         this.isOpened = isOpened;
     }
     render() {
-        return (h(Host, { key: 'f8dff045e6be9b205bbee68f373ae90ad6f74709' }, h("div", { key: 'c8d0ab25b9ef9c65c95ab7d637f398716a9ccd69', class: "content", part: "content" }, h("div", { key: '8f638de0bc8f252412960300bcbd08eb4507eb97', class: "logo" }, h("slot", { key: 'a663ac9cc2b1e560a3e124622a0e37ddc939f828' })), h("div", { key: '769051e97bc1487231f9a604c998c555618b96c5', class: "actions", part: "actions" }, this.nav !== 'none' && this.hasNav &&
-            h("nav", { key: '56c2c94577457bec5f1799a3ac8b0b975cca6862', class: "nav", part: "nav" }, h("slot", { key: '1eae94afa33201e1c3840d848664d36f3e93730c', name: "nav" })), this.menu !== 'none' &&
-            h("mds-button", { key: '8ef11e0014ef070974fbef39824cc1ca380d0ce9', class: "menu", variant: "dark", tone: "quiet", icon: miRoundMenu, onClick: this.open, part: "hamburger" })))));
+        return (h(Host, { key: '4f05a5967beb2dc2176612fd9a1c4c762d732d36' }, h("div", { key: 'd0a9f9d2f21b4f1ec90d843662ddee100d4a8224', class: "content", part: "content" }, h("div", { key: '95dba7bda54e9615745c1dbce97877d6c270dfd7', class: "logo" }, h("slot", { key: '928754982fc5c8037dda2e96d1b13737681d9229' })), h("div", { key: 'b323873b3ab16269815bbc3c8f01299981fcb684', class: "actions", part: "actions" }, this.nav !== 'none' && this.hasNav &&
+            h("nav", { key: '72788eba14482c7cb1020016094526370e333609', class: "nav", part: "nav" }, h("slot", { key: '6b46a30da15b1960770192f161e8c2c8fcd4dd97', name: "nav" })), this.menu !== 'none' &&
+            h("mds-button", { key: '88abd41f054df676ab99e597f172978ef3883bc8', class: "menu", variant: "dark", tone: "quiet", icon: miRoundMenu, onClick: this.open, part: "hamburger" })))));
     }
     get host() { return getElement(this); }
 };

package/dist/esm/mds-header.entry.js

@@ -175,8 +175,8 @@ const MdsHeader = class {
         }
     }
     render() {
-        return (h(Host, { key: 'ed4faa9268044cc9b6046ff39cda66f7553a0043' }, this.backdrop && h("div", { key: 'bb88d582b85506376e70e623c5d536392737eac7', class: "backdrop" }), h("slot", { key: '3e3b3b5b19de464572e1a2f1ac3be1b810c41af6' }), this.hasMenu &&
-            h("div", { key: '9bd8c9c2e49b2b2b5df5c6aa69e065a628e1508e', class: "menu", part: "menu" }, h("mds-modal", { key: '50de497869acb91e1a3df249c48063aa1a999ad0', class: "modal", opened: this.isOpened, onMdsModalClose: this.close, position: "right" }, h("slot", { key: '0d8173ec63daaf17959d2aaec7ffbfbfab9daa24', name: "menu" })))));
+        return (h(Host, { key: '5f7a197284f180ab816c563e388a7f8e521e1f05' }, this.backdrop && h("div", { key: 'e02d7329e0556d2cee684004faeefcfedf764fcc', class: "backdrop" }), h("slot", { key: '4ed32166f6ace18694cb3f060a6a23c22abc5771' }), this.hasMenu &&
+            h("div", { key: 'ee646a278ebeff78208618be2a601a3c0f62d651', class: "menu", part: "menu" }, h("mds-modal", { key: 'e29e93cd02bd159d4dee010648f8a919140fbb6a', class: "modal", opened: this.isOpened, onMdsModalClose: this.close, position: "right" }, h("slot", { key: '2910bffcf16ace95aead03ac16a358599f3f5b06', name: "menu" })))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/mds-horizontal-scroll.entry.js

@@ -195,7 +195,7 @@ const MdsHorizontalScroll = class {
         this.contents.removeEventListener('scroll', this.translateNavigationDot);
     }
     render() {
-        return (h(Host, { key: 'b65cd5aef21f81cf9c660b9e16ee0742033b0522' }, h("div", { key: '957de53a7aeee4ddb820288c54fe4b976b74bac9', class: "contents", part: "content" }, h("div", { key: '385e764035e30f5e0d656c700198de314eb87a8d', class: "spacer" }), h("slot", { key: '85fff563ccf060e4fc590faf05595a79dbd87d57', onSlotchange: this.updateElements }), h("div", { key: '181ee99f3e0d61f4c1062dec205632f0b9d287fc', class: "spacer" })), h("div", { key: 'd575c09eab0fa7e5d08e0fcb720d1740035cf38d', class: "dot-navigation" }, h("div", { key: '403830bc1cca796930ae5da665f9f3d3a206c7b9', class: "dot" })), this.controls && this.controls !== 'none' && h("mds-button", { key: '47befe2f2aa6522819c7ff80b3385ab574ce6c30', onClick: this.moveBack, size: "lg", class: clsx('navigation navigation--back', !this.showBack && 'navigation--disabled'), icon: miBaselineArrowBack }), this.controls && this.controls !== 'none' && h("mds-button", { key: '3bcdf715858fbed99e63957506f751e5188f4a53', onClick: this.moveForward, size: "lg", class: clsx('navigation navigation--forward', !this.showForward && 'navigation--disabled'), icon: miBaselineArrowForward })));
+        return (h(Host, { key: 'eb238b7afa371c9588db89fc1a721dbefef6d52e' }, h("div", { key: '70bc5033b4f8b36b2bbde1b1a2aac2f3d2db99de', class: "contents", part: "content" }, h("div", { key: 'a13f42f412af0d5c5a0dbfc579cd09b44407d591', class: "spacer" }), h("slot", { key: '8193210041eee84c0486bed982733e50d7c6216f', onSlotchange: this.updateElements }), h("div", { key: '374bf2c6b6862b25c1ccad086eaa6d0ee88c2f8f', class: "spacer" })), h("div", { key: '73c9253ac43b706ea7e5793755b431739a82c4f7', class: "dot-navigation" }, h("div", { key: '604b8d2bddb159d35cd69c6cadd33fa879cf1132', class: "dot" })), this.controls && this.controls !== 'none' && h("mds-button", { key: '75491ac6071cebaa6452e82ddbd7bdd6e9383bd1', onClick: this.moveBack, size: "lg", class: clsx('navigation navigation--back', !this.showBack && 'navigation--disabled'), icon: miBaselineArrowBack }), this.controls && this.controls !== 'none' && h("mds-button", { key: '99ce389ee2f28dbeafbc740639f9b9f67f3307e5', onClick: this.moveForward, size: "lg", class: clsx('navigation navigation--forward', !this.showForward && 'navigation--disabled'), icon: miBaselineArrowForward })));
     }
     get host() { return getElement(this); }
     static get watchers() { return {

package/dist/esm/mds-hr.entry.js

@@ -8,7 +8,7 @@ const MdsHr = class {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h(Host, { key: 'cc9708f0bbede0b64897ded6362a273781ac97c4' }));
+        return (h(Host, { key: '1feeafb202973ecfbc1964d97f6c4689c71fbc01' }));
     }
 };
 MdsHr.style = MdsHrStyle0;

package/dist/esm/mds-input-date-range.entry.js

@@ -33,13 +33,12 @@ const localeIt = {
 	to: to
 };
 
-const mdsInputDateRangeCss = ":host{--mds-input-date-range-background:rgb(var(--tone-neutral));--mds-input-date-range-fields-firefox-justify-content:start;--mds-input-date-range-fields-gap:0 0.5rem;--mds-input-date-range-icon-color:var(--mds-input-date-range-variant-color);--mds-input-date-range-ring:0 0 0 1px rgb(var(--mds-input-date-range-variant-color) / 0.1);--mds-input-date-range-shadow:0 1px 3px 0 rgb(var(--mds-input-date-range-variant-color) / 0.1), 0 1px 2px 0 rgb(var(--mds-input-date-range-variant-color) / 0.06);--mds-input-date-range-variant-color:0 0 0;min-height:1.5rem;font-family:Karla, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;font-size:1rem;line-height:1.5rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;gap:0.5rem;color:rgb(var(--tone-neutral-02));container-type:inline-size;cursor:text;display:-ms-flexbox;display:flex;overflow:visible;position:relative}.date-preselection{display:grid;gap:0.5rem}.inputs{font-family:'Roboto Mono', 'Courier New', monospace;font-size:0.875rem;line-height:1.25rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0rem;border-radius:0.5rem;padding-left:1rem;padding-right:3rem;-webkit-transition-duration:300ms;transition-duration:300ms;-webkit-transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1);transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1);-ms-flex-align:center;align-items:center;background-color:var(--mds-input-date-range-background);border:0;-webkit-box-shadow:var(--mds-input-date-range-ring), var(--mds-input-date-range-shadow);box-shadow:var(--mds-input-date-range-ring), var(--mds-input-date-range-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--mds-input-date-range-fields-gap);min-height:3rem;overflow:hidden;text-overflow:ellipsis;-webkit-transition-property:background-color, border-color, color, fill, margin, opacity, padding, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, margin, opacity, padding, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, margin, opacity, padding, transform;transition-property:background-color, border-color, box-shadow, color, fill, margin, opacity, padding, transform, -webkit-box-shadow, -webkit-transform;width:100%}.input-element{-ms-flex-align:baseline;align-items:baseline;display:-ms-inline-flexbox;display:inline-flex}:host(:focus-within) .inputs{outline:2px solid transparent;outline-offset:2px;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:300ms;transition-duration:300ms;-webkit-transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1);transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1);--mds-input-date-range-ring:0 0 0 3px rgb(var(--mds-input-date-range-variant-color) / 1);--mds-input-date-range-shadow:0 4px 6px 3px rgb(var(--mds-input-date-range-variant-color) / 0.1), 0 2px 4px -1px rgb(var(--mds-input-date-range-variant-color) / 0.06)}.input-wrapper{display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0}:host() ::slotted(mds-input-date){color:inherit}.date-label{margin-left:0.125rem;margin-right:0.125rem;min-width:-moz-min-content;min-width:-webkit-min-content;min-width:min-content;white-space:nowrap}.date-label:first-child{margin-left:0}mds-calendar{min-width:-moz-max-content;min-width:-webkit-max-content;min-width:max-content}.action-open-calendar{--mds-button-color:rgb(var(--mds-input-date-range-icon-color));aspect-ratio:1;bottom:0;position:absolute;right:0;top:0}mds-dropdown{padding:0}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}:host-context(.pref-animation-reduce) .input{-webkit-transition-duration:0s;transition-duration:0s}@media (prefers-reduced-motion){:host-context(.pref-animation-system) .input{-webkit-transition-duration:0s;transition-duration:0s}}:host-context(.pref-theme-dark){--mds-input-date-range-ring:0 0 0 2px rgb(var(--tone-neutral-01) / 0.3);--mds-input-date-range-background:rgb(var(--tone-neutral-09));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-06))}:host-context(.pref-theme-dark) .counter-button:hover{--mds-button-background:rgb(var(--tone-neutral-08))}@media (prefers-color-scheme: dark){:host-context(.pref-theme-system){--mds-input-date-range-ring:0 0 0 2px rgb(var(--tone-neutral-01) / 0.3);--mds-input-date-range-background:rgb(var(--tone-neutral-09));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-06))}:host-context(.pref-theme-system) .counter-button:hover{--mds-button-background:rgb(var(--tone-neutral-08))}}:host-context(.pref-contrast-more){--mds-input-date-range-ring:0 0 0 2px rgb(var(--tone-neutral-01) / 0.6);--mds-input-date-range-background:rgb(var(--tone-neutral-09));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-05))}:host-context(.pref-contrast-more) .input::-moz-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::-webkit-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input:-ms-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::-ms-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::placeholder{color:rgb(var(--tone-neutral-03))}@media (prefers-contrast: more){:host-context(.pref-contrast-system){--mds-input-date-range-ring:0 0 0 2px rgb(var(--tone-neutral-01) / 0.6);--mds-input-date-range-background:rgb(var(--tone-neutral-09));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-05))}:host-context(.pref-contrast-more) .input::-moz-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::-webkit-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input:-ms-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::-ms-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::placeholder{color:rgb(var(--tone-neutral-03))}}@supports (-moz-appearance: none){.action-open-calendar{display:none}.inputs{padding-right:1rem;-ms-flex-pack:var(--mds-input-date-range-fields-firefox-justify-content);justify-content:var(--mds-input-date-range-fields-firefox-justify-content)}}:host{--mds-input-date-range-icon-color:var(--variant-primary-03);--mds-input-date-range-variant-color:0 0 0}:host(:focus-within){--mds-input-date-range-variant-color:var(--variant-primary-04)}:host([variant=\"info\"]){--mds-input-date-range-icon-color:var(--status-info-05);--mds-input-date-range-variant-color:0 0 0}:host([variant=\"info\"]:focus-within){--mds-input-date-range-icon-color:var(--status-info-04);--mds-input-date-range-variant-color:var(--status-info-05)}:host([variant=\"success\"]){--mds-input-date-range-icon-color:var(--status-success-05);--mds-input-date-range-variant-color:0 0 0}:host([variant=\"success\"]:focus-within){--mds-input-date-range-icon-color:var(--status-success-04);--mds-input-date-range-variant-color:var(--status-success-05)}:host([variant=\"warning\"]){--mds-input-date-range-icon-color:var(--status-warning-05);--mds-input-date-range-variant-color:0 0 0}:host([variant=\"warning\"]:focus-within){--mds-input-date-range-icon-color:var(--status-warning-04);--mds-input-date-range-variant-color:var(--status-warning-05)}:host([variant=\"error\"]){--mds-input-date-range-icon-color:var(--status-error-05);--mds-input-date-range-variant-color:0 0 0}:host([variant=\"error\"]:focus-within){--mds-input-date-range-icon-color:var(--status-error-04);--mds-input-date-range-variant-color:var(--status-error-05)}";
+const mdsInputDateRangeCss = ":host{--mds-input-date-range-background:rgb(var(--tone-neutral));--mds-input-date-range-calendar-width:22rem;--mds-input-date-range-fields-firefox-justify-content:start;--mds-input-date-range-fields-gap:0 0.5rem;--mds-input-date-range-icon-color:var(--mds-input-date-range-variant-color);--mds-input-date-range-ring:0 0 0 1px rgb(var(--mds-input-date-range-variant-color) / 0.1);--mds-input-date-range-shadow:0 1px 3px 0 rgb(var(--mds-input-date-range-variant-color) / 0.1), 0 1px 2px 0 rgb(var(--mds-input-date-range-variant-color) / 0.06);--mds-input-date-range-variant-color:0 0 0;min-height:1.5rem;font-family:Karla, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;font-size:1rem;line-height:1.5rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;gap:0.5rem;color:rgb(var(--tone-neutral-02));container-type:inline-size;cursor:text;display:-ms-flexbox;display:flex;overflow:visible;position:relative}.date-preselection{display:grid;gap:0.5rem}.inputs{font-family:'Roboto Mono', 'Courier New', monospace;font-size:0.875rem;line-height:1.25rem;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0rem;border-radius:0.5rem;padding-left:1rem;padding-right:3rem;-webkit-transition-duration:300ms;transition-duration:300ms;-webkit-transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1);transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1);-ms-flex-align:center;align-items:center;background-color:var(--mds-input-date-range-background);border:0;-webkit-box-shadow:var(--mds-input-date-range-ring), var(--mds-input-date-range-shadow);box-shadow:var(--mds-input-date-range-ring), var(--mds-input-date-range-shadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:inherit;display:-ms-inline-flexbox;display:inline-flex;-ms-flex-wrap:wrap;flex-wrap:wrap;gap:var(--mds-input-date-range-fields-gap);min-height:3rem;overflow:hidden;text-overflow:ellipsis;-webkit-transition-property:background-color, border-color, color, fill, margin, opacity, padding, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, margin, opacity, padding, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, margin, opacity, padding, transform;transition-property:background-color, border-color, box-shadow, color, fill, margin, opacity, padding, transform, -webkit-box-shadow, -webkit-transform;width:100%}.input-element{-ms-flex-align:baseline;align-items:baseline;display:-ms-inline-flexbox;display:inline-flex}:host(:focus-within) .inputs{outline:2px solid transparent;outline-offset:2px;-webkit-transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, color, fill, height, margin, opacity, padding, width, -webkit-box-shadow, -webkit-transform;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width;transition-property:background-color, border-color, box-shadow, color, fill, height, margin, opacity, padding, transform, width, -webkit-box-shadow, -webkit-transform;-webkit-transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);-webkit-transition-duration:300ms;transition-duration:300ms;-webkit-transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1);transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1);--mds-input-date-range-ring:0 0 0 3px rgb(var(--mds-input-date-range-variant-color) / 1);--mds-input-date-range-shadow:0 4px 6px 3px rgb(var(--mds-input-date-range-variant-color) / 0.1), 0 2px 4px -1px rgb(var(--mds-input-date-range-variant-color) / 0.06)}.input-wrapper{display:-ms-flexbox;display:flex;-ms-flex-negative:0;flex-shrink:0}:host() ::slotted(mds-input-date){color:inherit}.date-label{margin-left:0.125rem;margin-right:0.125rem;min-width:-moz-min-content;min-width:-webkit-min-content;min-width:min-content;white-space:nowrap}.date-label:first-child{margin-left:0}.calendars{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;gap:--spacing(200);min-width:-moz-max-content;min-width:-webkit-max-content;min-width:max-content}.calendar-preselection-panel{background-color:rgb(var(--tone-neutral-09));border-radius:0.5rem;-webkit-box-sizing:border-box;box-sizing:border-box;display:grid;-ms-flex-line-pack:start;align-content:start;min-inline-size:-moz-max-content;min-inline-size:-webkit-max-content;min-inline-size:max-content;padding:1rem}.calendar-single{display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;gap:--spacing(200);min-width:-moz-max-content;min-width:-webkit-max-content;min-width:max-content}.calendar-single mds-calendar,.calendars mds-calendar{-ms-flex:0 0 var(--mds-input-date-range-calendar-width);flex:0 0 var(--mds-input-date-range-calendar-width);inline-size:var(--mds-input-date-range-calendar-width);max-inline-size:var(--mds-input-date-range-calendar-width);min-inline-size:var(--mds-input-date-range-calendar-width)}.action-open-calendar{--mds-button-color:rgb(var(--mds-input-date-range-icon-color));aspect-ratio:1;bottom:0;position:absolute;right:0;top:0}mds-dropdown{padding:0}:host(:not(:is([hydrated],.hydrated))){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}mds-accordion:not(:is([hydrated],.hydrated)),mds-accordion-item:not(:is([hydrated],.hydrated)),mds-accordion-timer:not(:is([hydrated],.hydrated)),mds-accordion-timer-item:not(:is([hydrated],.hydrated)),mds-author:not(:is([hydrated],.hydrated)),mds-avatar:not(:is([hydrated],.hydrated)),mds-badge:not(:is([hydrated],.hydrated)),mds-banner:not(:is([hydrated],.hydrated)),mds-benchmark-bar:not(:is([hydrated],.hydrated)),mds-bibliography:not(:is([hydrated],.hydrated)),mds-breadcrumb:not(:is([hydrated],.hydrated)),mds-breadcrumb-item:not(:is([hydrated],.hydrated)),mds-button:not(:is([hydrated],.hydrated)),mds-card:not(:is([hydrated],.hydrated)),mds-card-content:not(:is([hydrated],.hydrated)),mds-card-footer:not(:is([hydrated],.hydrated)),mds-card-header:not(:is([hydrated],.hydrated)),mds-card-media:not(:is([hydrated],.hydrated)),mds-chip:not(:is([hydrated],.hydrated)),mds-details:not(:is([hydrated],.hydrated)),mds-dropdown:not(:is([hydrated],.hydrated)),mds-entity:not(:is([hydrated],.hydrated)),mds-file:not(:is([hydrated],.hydrated)),mds-file-preview:not(:is([hydrated],.hydrated)),mds-filter:not(:is([hydrated],.hydrated)),mds-filter-item:not(:is([hydrated],.hydrated)),mds-header:not(:is([hydrated],.hydrated)),mds-header-bar:not(:is([hydrated],.hydrated)),mds-help:not(:is([hydrated],.hydrated)),mds-horizontal-scroll:not(:is([hydrated],.hydrated)),mds-hr:not(:is([hydrated],.hydrated)),mds-icon:not(:is([hydrated],.hydrated)),mds-img:not(:is([hydrated],.hydrated)),mds-input:not(:is([hydrated],.hydrated)),mds-input-field:not(:is([hydrated],.hydrated)),mds-input-range:not(:is([hydrated],.hydrated)),mds-input-select:not(:is([hydrated],.hydrated)),mds-input-switch:not(:is([hydrated],.hydrated)),mds-input-tip:not(:is([hydrated],.hydrated)),mds-input-tip-item:not(:is([hydrated],.hydrated)),mds-input-upload:not(:is([hydrated],.hydrated)),mds-keyboard:not(:is([hydrated],.hydrated)),mds-keyboard-key:not(:is([hydrated],.hydrated)),mds-kpi:not(:is([hydrated],.hydrated)),mds-kpi-item:not(:is([hydrated],.hydrated)),mds-label:not(:is([hydrated],.hydrated)),mds-list:not(:is([hydrated],.hydrated)),mds-list-item:not(:is([hydrated],.hydrated)),mds-modal:not(:is([hydrated],.hydrated)),mds-note:not(:is([hydrated],.hydrated)),mds-notification:not(:is([hydrated],.hydrated)),mds-paginator:not(:is([hydrated],.hydrated)),mds-paginator-item:not(:is([hydrated],.hydrated)),mds-pref:not(:is([hydrated],.hydrated)),mds-pref-animation:not(:is([hydrated],.hydrated)),mds-pref-consumption:not(:is([hydrated],.hydrated)),mds-pref-contrast:not(:is([hydrated],.hydrated)),mds-pref-language:not(:is([hydrated],.hydrated)),mds-pref-language-item:not(:is([hydrated],.hydrated)),mds-pref-theme:not(:is([hydrated],.hydrated)),mds-price-table:not(:is([hydrated],.hydrated)),mds-price-table-features:not(:is([hydrated],.hydrated)),mds-price-table-features-cell:not(:is([hydrated],.hydrated)),mds-price-table-features-row:not(:is([hydrated],.hydrated)),mds-price-table-header:not(:is([hydrated],.hydrated)),mds-price-table-list:not(:is([hydrated],.hydrated)),mds-price-table-list-item:not(:is([hydrated],.hydrated)),mds-progress:not(:is([hydrated],.hydrated)),mds-push-notification:not(:is([hydrated],.hydrated)),mds-push-notifications:not(:is([hydrated],.hydrated)),mds-quote:not(:is([hydrated],.hydrated)),mds-separator:not(:is([hydrated],.hydrated)),mds-spinner:not(:is([hydrated],.hydrated)),mds-stepper-bar:not(:is([hydrated],.hydrated)),mds-stepper-bar-item:not(:is([hydrated],.hydrated)),mds-tab:not(:is([hydrated],.hydrated)),mds-tab-bar:not(:is([hydrated],.hydrated)),mds-tab-bar-item:not(:is([hydrated],.hydrated)),mds-tab-item:not(:is([hydrated],.hydrated)),mds-table:not(:is([hydrated],.hydrated)),mds-table-body:not(:is([hydrated],.hydrated)),mds-table-cell:not(:is([hydrated],.hydrated)),mds-table-footer:not(:is([hydrated],.hydrated)),mds-table-header:not(:is([hydrated],.hydrated)),mds-table-header-cell:not(:is([hydrated],.hydrated)),mds-table-row:not(:is([hydrated],.hydrated)),mds-text:not(:is([hydrated],.hydrated)),mds-toast:not(:is([hydrated],.hydrated)),mds-tooltip:not(:is([hydrated],.hydrated)),mds-tree:not(:is([hydrated],.hydrated)),mds-tree-item:not(:is([hydrated],.hydrated)),mds-url-view:not(:is([hydrated],.hydrated)),mds-usage:not(:is([hydrated],.hydrated)),mds-video-wall:not(:is([hydrated],.hydrated)),mds-zero:not(:is([hydrated],.hydrated)){-webkit-animation-duration:0s;animation-duration:0s;border-color:transparent;-webkit-box-shadow:0 0 0 transparent;box-shadow:0 0 0 transparent;opacity:0;outline-color:transparent;-webkit-transition-delay:0s;transition-delay:0s;-webkit-transition-duration:0s;transition-duration:0s;visibility:hidden}:host-context(.pref-animation-reduce) .input{-webkit-transition-duration:0s;transition-duration:0s}@media (prefers-reduced-motion){:host-context(.pref-animation-system) .input{-webkit-transition-duration:0s;transition-duration:0s}}:host-context(.pref-theme-dark){--mds-input-date-range-ring:0 0 0 2px rgb(var(--tone-neutral-01) / 0.3);--mds-input-date-range-background:rgb(var(--tone-neutral-09));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-06))}:host-context(.pref-theme-dark) .counter-button:hover{--mds-button-background:rgb(var(--tone-neutral-08))}@media (prefers-color-scheme: dark){:host-context(.pref-theme-system){--mds-input-date-range-ring:0 0 0 2px rgb(var(--tone-neutral-01) / 0.3);--mds-input-date-range-background:rgb(var(--tone-neutral-09));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-06))}:host-context(.pref-theme-system) .counter-button:hover{--mds-button-background:rgb(var(--tone-neutral-08))}}:host-context(.pref-contrast-more){--mds-input-date-range-ring:0 0 0 2px rgb(var(--tone-neutral-01) / 0.6);--mds-input-date-range-background:rgb(var(--tone-neutral-09));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-05))}:host-context(.pref-contrast-more) .input::-moz-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::-webkit-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input:-ms-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::-ms-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::placeholder{color:rgb(var(--tone-neutral-03))}@media (prefers-contrast: more){:host-context(.pref-contrast-system){--mds-input-date-range-ring:0 0 0 2px rgb(var(--tone-neutral-01) / 0.6);--mds-input-date-range-background:rgb(var(--tone-neutral-09));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-05))}:host-context(.pref-contrast-more) .input::-moz-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::-webkit-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input:-ms-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::-ms-input-placeholder{color:rgb(var(--tone-neutral-03))}:host-context(.pref-contrast-more) .input::placeholder{color:rgb(var(--tone-neutral-03))}}@supports (-moz-appearance: none){.action-open-calendar{display:none}.inputs{padding-right:1rem;-ms-flex-pack:var(--mds-input-date-range-fields-firefox-justify-content);justify-content:var(--mds-input-date-range-fields-firefox-justify-content)}}:host{--mds-input-date-range-icon-color:var(--variant-primary-03);--mds-input-date-range-variant-color:0 0 0}:host(:focus-within){--mds-input-date-range-variant-color:var(--variant-primary-04)}:host([variant=\"info\"]){--mds-input-date-range-icon-color:var(--status-info-05);--mds-input-date-range-variant-color:0 0 0}:host([variant=\"info\"]:focus-within){--mds-input-date-range-icon-color:var(--status-info-04);--mds-input-date-range-variant-color:var(--status-info-05)}:host([variant=\"success\"]){--mds-input-date-range-icon-color:var(--status-success-05);--mds-input-date-range-variant-color:0 0 0}:host([variant=\"success\"]:focus-within){--mds-input-date-range-icon-color:var(--status-success-04);--mds-input-date-range-variant-color:var(--status-success-05)}:host([variant=\"warning\"]){--mds-input-date-range-icon-color:var(--status-warning-05);--mds-input-date-range-variant-color:0 0 0}:host([variant=\"warning\"]:focus-within){--mds-input-date-range-icon-color:var(--status-warning-04);--mds-input-date-range-variant-color:var(--status-warning-05)}:host([variant=\"error\"]){--mds-input-date-range-icon-color:var(--status-error-05);--mds-input-date-range-variant-color:0 0 0}:host([variant=\"error\"]:focus-within){--mds-input-date-range-icon-color:var(--status-error-04);--mds-input-date-range-variant-color:var(--status-error-05)}";
 const MdsInputDateRangeStyle0 = mdsInputDateRangeCss;
 
 const MdsInputDateRange = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.dateRangeSelected = createEvent(this, "mdsInputDateRangeSelect", 7);
         this.valueChanged = createEvent(this, "mdsInputDateRangeValueChange", 7);
         if (hostRef.$hostElement$["s-ei"]) {
             this.internals = hostRef.$hostElement$["s-ei"];
@@ -51,6 +50,7 @@ const MdsInputDateRange = class {
         this.calendarKey = 0;
         this.internalStartDate = '';
         this.internalEndDate = '';
+        this.visibleCalendarDate = '';
         this.hasPreselection = false;
         this.t = new Locale({
             el: localeEl,
@@ -83,10 +83,16 @@ const MdsInputDateRange = class {
          * @description Default is 500
          */
         this.delay = 500;
+        /**
+         * Enables the linked dual-calendar range picker behavior.
+         */
+        this.dualCalendar = false;
         this.lastEmittedStartDate = null;
         this.lastEmittedEndDate = null;
         this.initialStartDate = '';
         this.initialEndDate = '';
+        this.hoveredCalendarDate = null;
+        this.syncingInputSlots = new Set();
         this.handleFocusOut = (event) => {
             if (!this.host.contains(event.relatedTarget)) {
                 const startValid = DateTime_1.fromISO(this.internalStartDate).isValid;
@@ -94,20 +100,8 @@ const MdsInputDateRange = class {
                 if (startValid && endValid) {
                     this.validateDateRange();
                     this.syncFormValue();
-                    this.dateRangeSelected.emit({
-                        startDate: this.internalStartDate,
-                        endDate: this.internalEndDate,
-                    });
                     this.checkPreselections();
-                }
-                if (this.internalStartDate !== this.lastEmittedStartDate ||
-                    this.internalEndDate !== this.lastEmittedEndDate) {
-                    this.valueChanged.emit({
-                        startDate: this.internalStartDate,
-                        endDate: this.internalEndDate,
-                    });
-                    this.lastEmittedStartDate = this.internalStartDate;
-                    this.lastEmittedEndDate = this.internalEndDate;
+                    this.emitValueChanged();
                 }
             }
         };
@@ -130,10 +124,152 @@ const MdsInputDateRange = class {
             ev.stopPropagation();
             this.focusInput(this.host.querySelector('mds-input-date[slot="end"]'));
         };
+        this.handleCalendarHover = (ev) => {
+            if (!this.internalStartDate || this.internalEndDate) {
+                this.clearHoverPreview();
+                return;
+            }
+            const nextHoverDate = ev.detail.hoverDate;
+            if (this.hoveredCalendarDate === nextHoverDate)
+                return;
+            this.hoveredCalendarDate = nextHoverDate;
+            this.syncCalendarsHoverAttributes();
+        };
+        this.handleCalendarChange = (ev) => {
+            this.clearHoverPreview();
+            this.internalStartDate = ev.detail.startDate;
+            this.updateInputValue('start', this.internalStartDate);
+            if (ev.detail.endDate) {
+                this.internalEndDate = ev.detail.endDate;
+                this.updateInputValue('end', this.internalEndDate);
+            }
+            else {
+                this.internalEndDate = '';
+                this.updateInputValue('end', this.internalEndDate);
+            }
+            this.syncFormValue();
+            this.syncCalendarsSelectionAttributes();
+            if (this.internalStartDate && this.internalEndDate) {
+                this.emitValueChanged();
+                this.closeDropdownAfterSelection();
+            }
+        };
+        this.handleCalendarNavigate = (ev) => {
+            if (!this.dualCalendar)
+                return;
+            const calendars = this.getCalendars();
+            const calendarIndex = calendars.indexOf(ev.target);
+            const currentDate = DateTime_1.fromISO(ev.detail.currentDate);
+            if (!currentDate.isValid)
+                return;
+            this.visibleCalendarDate = currentDate
+                .minus({ months: calendarIndex === 1 ? 1 : 0 })
+                .startOf('month')
+                .toISODate();
+        };
     }
     async updateLang() {
         this.language = this.t.lang(this.host);
     }
+    getCalendars() {
+        var _a, _b;
+        return Array.from((_b = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('mds-calendar')) !== null && _b !== void 0 ? _b : []);
+    }
+    resolveVisibleCalendarDate(startDate, endDate) {
+        var _a;
+        const initialDates = [startDate, endDate]
+            .map(value => DateTime_1.fromISO(value !== null && value !== void 0 ? value : ''))
+            .filter(date => date.isValid);
+        const initialVisibleDate = (_a = initialDates[0]) !== null && _a !== void 0 ? _a : DateTime_1.now();
+        return initialVisibleDate.startOf('month').toISODate();
+    }
+    getCalendarViewDate(monthOffset = 0) {
+        const visibleCalendarDate = DateTime_1.fromISO(this.visibleCalendarDate);
+        const startDate = DateTime_1.fromISO(this.internalStartDate);
+        let baseDate = DateTime_1.now();
+        if (visibleCalendarDate.isValid) {
+            baseDate = visibleCalendarDate;
+        }
+        else if (startDate.isValid) {
+            baseDate = startDate;
+        }
+        return baseDate.startOf('month').plus({ months: monthOffset }).toISODate();
+    }
+    setVisibleCalendarDate(date) {
+        const visibleCalendarDate = DateTime_1.fromISO(date);
+        if (visibleCalendarDate.isValid) {
+            this.visibleCalendarDate = visibleCalendarDate.startOf('month').toISODate();
+        }
+    }
+    closeDropdownAfterSelection() {
+        if (this.delay === 0)
+            return;
+        const { dropdownRef } = this;
+        if (dropdownRef) {
+            setTimeout(() => {
+                dropdownRef.visible = false;
+            }, this.delay);
+        }
+    }
+    syncCalendarsSelectionAttributes() {
+        var _a;
+        (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('mds-calendar').forEach(calendar => {
+            if (this.internalStartDate) {
+                calendar.setAttribute('start-date', this.internalStartDate);
+            }
+            else {
+                calendar.removeAttribute('start-date');
+            }
+            if (this.internalEndDate) {
+                calendar.setAttribute('end-date', this.internalEndDate);
+            }
+            else {
+                calendar.removeAttribute('end-date');
+            }
+        });
+        this.syncCalendarsHoverAttributes();
+    }
+    syncCalendarsHoverAttributes() {
+        var _a;
+        (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('mds-calendar').forEach(calendar => {
+            if (this.hoveredCalendarDate) {
+                calendar.setAttribute('hover-date', this.hoveredCalendarDate);
+            }
+            else {
+                calendar.removeAttribute('hover-date');
+            }
+        });
+    }
+    clearHoverPreview() {
+        if (this.hoveredCalendarDate === null)
+            return;
+        this.hoveredCalendarDate = null;
+        this.syncCalendarsHoverAttributes();
+    }
+    getEmittableDateRangeDetail() {
+        const startDate = DateTime_1.fromISO(this.internalStartDate);
+        const endDate = DateTime_1.fromISO(this.internalEndDate);
+        if (!startDate.isValid || !endDate.isValid) {
+            return null;
+        }
+        return {
+            startDate: this.internalStartDate,
+            endDate: this.internalEndDate,
+        };
+    }
+    emitValueChanged() {
+        const detail = this.getEmittableDateRangeDetail();
+        if (!detail)
+            return false;
+        if (detail.startDate === this.lastEmittedStartDate &&
+            detail.endDate === this.lastEmittedEndDate) {
+            return false;
+        }
+        this.valueChanged.emit(detail);
+        this.lastEmittedStartDate = detail.startDate;
+        this.lastEmittedEndDate = detail.endDate;
+        return true;
+    }
     handleStartDateChange(newValue) {
         this.syncExternalDate('start', newValue);
     }
@@ -146,6 +282,7 @@ const MdsInputDateRange = class {
         this.internalEndDate = this.endDate;
         this.initialStartDate = this.startDate;
         this.initialEndDate = this.endDate;
+        this.visibleCalendarDate = this.resolveVisibleCalendarDate(this.internalStartDate, this.internalEndDate);
         // Se max è precedente a min, imposto max uguale a min
         if (this.min && this.max) {
             const minDate = DateTime_1.fromISO(this.min);
@@ -157,10 +294,11 @@ const MdsInputDateRange = class {
         this.syncFormValue();
     }
     disconnectedCallback() {
+        var _a;
         this.host.removeEventListener('focusout', this.handleFocusOut);
+        (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.removeEventListener('mdsCalendarHover', this.handleCalendarHover);
     }
     async preselect(event) {
-        var _a, _b;
         if (!this.togglePreselection) {
             this.togglePreselection = Array.from(this.host.querySelectorAll('mds-input-date-range-preselection'));
         }
@@ -168,9 +306,11 @@ const MdsInputDateRange = class {
             element.selected = false;
         });
         event.caller.selected = true;
+        this.clearHoverPreview();
         const startDate = DateTime_1.fromISO(event.start);
         if (startDate.isValid) {
             this.internalStartDate = event.start;
+            this.setVisibleCalendarDate(this.internalStartDate);
             this.updateInputValue('start', this.internalStartDate);
         }
         if (event.end !== undefined) {
@@ -184,31 +324,28 @@ const MdsInputDateRange = class {
         }
         this.updateInputValue('end', this.internalEndDate);
         this.syncFormValue();
-        const calendar = (_b = (_a = this.host) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('mds-calendar');
-        if (calendar) {
-            await calendar.updateCurrentDate(this.internalStartDate);
-            if (this.delay === 0)
-                return;
-            const { dropdownRef } = this;
-            if (dropdownRef) {
-                setTimeout(() => {
-                    dropdownRef.visible = false;
-                }, this.delay);
-            }
+        const calendars = this.getCalendars();
+        if (calendars.length) {
+            await Promise.all(calendars.map((calendar, index) => calendar.updateCurrentDate(this.getCalendarViewDate(index))));
+            this.closeDropdownAfterSelection();
         }
-        this.dateRangeSelected.emit({ startDate: this.internalStartDate, endDate: this.internalEndDate });
+        this.emitValueChanged();
         return Promise.resolve();
     }
     componentDidLoad() {
+        var _a;
         this.updateInputListeners();
         this.updateInputValue('start', this.internalStartDate);
         this.updateInputValue('end', this.internalEndDate);
         this.syncFormValue();
         this.host.addEventListener('focusout', this.handleFocusOut);
+        (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.addEventListener('mdsCalendarHover', this.handleCalendarHover);
     }
     formResetCallback() {
+        this.clearHoverPreview();
         this.internalStartDate = this.initialStartDate;
         this.internalEndDate = this.initialEndDate;
+        this.visibleCalendarDate = this.resolveVisibleCalendarDate(this.initialStartDate, this.initialEndDate);
         this.updateInputValue('start', this.internalStartDate);
         this.updateInputValue('end', this.internalEndDate);
         this.checkPreselections();
@@ -216,10 +353,12 @@ const MdsInputDateRange = class {
     }
     syncExternalDate(slotName, newValue) {
         const normalizedValue = newValue !== null && newValue !== void 0 ? newValue : '';
+        this.clearHoverPreview();
         if (slotName === 'start') {
             if (normalizedValue === this.internalStartDate)
                 return;
             this.internalStartDate = normalizedValue;
+            this.setVisibleCalendarDate(this.internalStartDate);
         }
         else {
             if (normalizedValue === this.internalEndDate)
@@ -237,7 +376,12 @@ const MdsInputDateRange = class {
         const slot = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(`slot[name="${slotName}"]`);
         const input = slot === null || slot === void 0 ? void 0 : slot.assignedElements()[0];
         if (input) {
-            input.setValue(newValue);
+            this.syncingInputSlots.add(slotName);
+            input.setValue(newValue).finally(() => {
+                requestAnimationFrame(() => {
+                    this.syncingInputSlots.delete(slotName);
+                });
+            });
         }
     }
     updateInputListeners() {
@@ -256,9 +400,14 @@ const MdsInputDateRange = class {
     }
     createFocusoutListener(slotName) {
         return (ev) => {
+            if (this.syncingInputSlots.has(slotName)) {
+                return;
+            }
             const event = ev;
+            this.clearHoverPreview();
             if (slotName === 'start') {
                 this.internalStartDate = event.detail;
+                this.setVisibleCalendarDate(this.internalStartDate);
             }
             else {
                 this.internalEndDate = event.detail;
@@ -295,34 +444,27 @@ const MdsInputDateRange = class {
             });
         }
     }
+    renderCalendarPreselectionPanel() {
+        if (!this.hasPreselection)
+            return null;
+        return (h("div", { class: "calendar-preselection-panel" }, h("div", { class: clsx('date-preselection', this.hasPreselection && 'date-preselection--has-preselection') }, h("slot", { name: "calendar-preselection" }))));
+    }
+    renderSingleCalendar() {
+        return (h("div", { class: "calendar-single" }, this.renderCalendarPreselectionPanel(), h("mds-calendar", Object.assign({ lang: this.language, key: this.calendarKey, rangePicker: true, onMdsCalendarChange: this.handleCalendarChange, onMdsCalendarPreselect: () => {
+                this.checkPreselections();
+            }, startDate: this.internalStartDate, endDate: this.internalEndDate }, (this.min ? { min: this.min } : {}), (this.max ? { max: this.max } : {})))));
+    }
+    renderDualCalendars() {
+        return (h("div", { class: "calendars" }, this.renderCalendarPreselectionPanel(), h("mds-calendar", Object.assign({ lang: this.language, key: `${this.calendarKey}-start`, rangePicker: true, showNextButton: false, disableMonthYearSelection: true, viewDate: this.getCalendarViewDate(), onMdsCalendarNavigate: this.handleCalendarNavigate, onMdsCalendarChange: this.handleCalendarChange, onMdsCalendarPreselect: () => {
+                this.checkPreselections();
+            }, startDate: this.internalStartDate, endDate: this.internalEndDate }, (this.min ? { min: this.min } : {}), (this.max ? { max: this.max } : {}))), h("mds-calendar", Object.assign({ lang: this.language, key: `${this.calendarKey}-end`, rangePicker: true, showPreviousButton: false, disableMonthYearSelection: true, viewDate: this.getCalendarViewDate(1), onMdsCalendarNavigate: this.handleCalendarNavigate, onMdsCalendarChange: this.handleCalendarChange, onMdsCalendarPreselect: () => {
+                this.checkPreselections();
+            }, startDate: this.internalStartDate, endDate: this.internalEndDate }, (this.min ? { min: this.min } : {}), (this.max ? { max: this.max } : {})))));
+    }
     render() {
-        return (h(Host, { key: 'a0d2991f2840c21d10410d9a2759bea2140b5fb8', onClick: this.focusDateInput }, h("div", { key: '42a70b643de49c02a1db422e9f7e69c4c16b5df2', class: "inputs" }, h("div", { key: '9aaef7664e161099e93dcf09f70e8a12ac26cba5', class: "input-element" }, h("mds-text", { key: 'd7a2f85dbd2ad2d4f2dbeefcad2d23c7062fa193', class: "date-label", typography: "detail", onClick: this.focusStartDateInput }, this.t.get('from')), h("div", { key: 'c430288d5850666258269faf269934c9771b62bf', class: "input-wrapper" }, h("slot", { key: '3cfdeacc1c9b024ce7f5a2a306425eeaa51f1130', name: "start" }))), h("div", { key: 'e8543d95071704939d879f87790f0fc711a34046', class: "input-element" }, h("mds-text", { key: '125cb1e5b7fe872f353624555af070cad0da30b0', class: "date-label", typography: "detail", onClick: this.focusEndDateInput }, this.t.get('to')), h("div", { key: '35884f542a3ebd824dab00a514e3aec69c79ae11', class: "input-wrapper" }, h("slot", { key: '74f1b59daecc34daf576297c93fff43071dccabd', name: "end" })))), h("mds-button", { key: 'be0b0f4af844d95a82211330de00c3545b136da3', class: "action-open-calendar", variant: "dark", tone: "quiet", icon: miBaselineCalendarToday, id: "calendar-dropdown", onClick: () => {
+        return (h(Host, { key: '9f1d15ce17187fb4346d4a8248d9fef359235f54', onClick: this.focusDateInput }, h("div", { key: '419236ee8bead4665a0164957282bcd5e7659661', class: "inputs" }, h("div", { key: 'e25a78a35ab091ccf357ade3a27b646b94ec42a6', class: "input-element" }, h("mds-text", { key: '7d93c5d1ee1a8c690aeb18b88607f081c3785c1e', class: "date-label", typography: "detail", onClick: this.focusStartDateInput }, this.t.get('from')), h("div", { key: 'bb2b95cf1de464d9158df7aecb950af7927e7272', class: "input-wrapper" }, h("slot", { key: '57cf6f4832fe383e22e5210e8d8f1584ac0a0f34', name: "start" }))), h("div", { key: 'dd707a289ce5862549a1d98b3010861af2fe05ac', class: "input-element" }, h("mds-text", { key: '212ba05e753f6b5f04032fc9eadbee33a66abccc', class: "date-label", typography: "detail", onClick: this.focusEndDateInput }, this.t.get('to')), h("div", { key: '15cf868bb6808fd8f2bf4a8c13720e813c277d66', class: "input-wrapper" }, h("slot", { key: '788d2c3ee00fd81724f1b058971a1366f3db6172', name: "end" })))), h("div", { key: 'ca0c8be9804fdd2b7c4b7d17d234328182023f0b', class: "action-open-calendar-wrapper" }, h("mds-button", { key: '9b4beb75e39698d2877c129b346024d785d8ba98', class: "action-open-calendar", variant: "dark", tone: "quiet", icon: miBaselineCalendarToday, id: "calendar-dropdown", onClick: () => {
                 this.calendarKey += 1;
-            } }), h("mds-dropdown", { key: 'd7bd7782dbcb0f7647643d6054b5fec2947e81e9', ref: el => this.dropdownRef = el, target: "#calendar-dropdown", "auto-placement": false, placement: "bottom-end" }, h("mds-calendar", Object.assign({ lang: this.language, key: this.calendarKey, rangePicker: true, onMdsCalendarChange: ev => {
-                this.internalStartDate = ev.detail.startDate;
-                this.updateInputValue('start', this.internalStartDate);
-                if (ev.detail.endDate) {
-                    this.internalEndDate = ev.detail.endDate;
-                    this.updateInputValue('end', this.internalEndDate);
-                }
-                this.syncFormValue();
-                if (this.internalStartDate && this.internalEndDate) {
-                    this.dateRangeSelected.emit({
-                        startDate: this.internalStartDate,
-                        endDate: this.internalEndDate,
-                    });
-                    if (this.delay === 0)
-                        return;
-                    const { dropdownRef } = this;
-                    if (dropdownRef) {
-                        setTimeout(() => {
-                            dropdownRef.visible = false;
-                        }, this.delay);
-                    }
-                }
-            }, onMdsCalendarPreselect: () => {
-                this.checkPreselections();
-            }, startDate: this.internalStartDate, endDate: this.internalEndDate }, (this.min ? { min: this.min } : {}), (this.max ? { max: this.max } : {})), h("div", { key: '5f94b5fef9bdca001020776e18c79875015452c7', slot: "preselection", class: clsx('date-preselection', this.hasPreselection && 'date-preselection--has-preselection') }, h("slot", { key: '58524f199d07343671ffc752be0ed74d21c3f021', name: "calendar-preselection" }))))));
+            } })), h("mds-dropdown", { key: '3274e94a6ae30fa2f060edeaa8f906972689af63', ref: el => (this.dropdownRef = el), target: "#calendar-dropdown", "auto-placement": false, placement: "bottom-end" }, this.dualCalendar ? this.renderDualCalendars() : this.renderSingleCalendar())));
     }
     syncFormValue() {
         var _a, _b, _c, _d;