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

package/dist/components/mds-input-date-range-preselection.js

@@ -1,73 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { d as defineCustomElement$5 } from './mds-button2.js';
-import { d as defineCustomElement$4 } from './mds-icon2.js';
-import { d as defineCustomElement$3 } from './mds-spinner2.js';
-import { d as defineCustomElement$2 } from './mds-text2.js';
-
-const mdsInputDateRangePreselectionCss = "@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-date-range-preselection-default-background:rgb(var(--tone-neutral-08,107 107 107)/0);--mds-date-range-preselection-default-border:var(--tone-neutral-08,107 107 107);--mds-date-range-preselection-default-color:rgb(var(--tone-neutral-03,233 233 233));--mds-date-range-preselection-selected-background:rgb(var(--variant-primary-03,211 226 255));--mds-date-range-preselection-selected-border:var(--variant-primary-03,211 226 255);--mds-date-range-preselection-selected-color:rgb(var(--tone-neutral,0 0 0));--mds-date-range-preselection-hover-background:rgb(var(--tone-neutral,0 0 0));--mds-date-range-preselection-hover-border:var(--tone-neutral,0 0 0);--mds-date-range-preselection-hover-color:rgb(var(--tone-neutral-03,233 233 233))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-button:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{--mds-date-range-preselection-default-background:rgb(var(--tone-neutral-08,107 107 107)/0);--mds-date-range-preselection-default-border:var(--tone-neutral-08,107 107 107);--mds-date-range-preselection-default-color:rgb(var(--tone-neutral-03,233 233 233));--mds-date-range-preselection-selected-background:rgb(var(--variant-primary-03,211 226 255));--mds-date-range-preselection-selected-border:var(--variant-primary-03,211 226 255);--mds-date-range-preselection-selected-color:rgb(var(--tone-neutral,0 0 0));--mds-date-range-preselection-hover-background:rgb(var(--tone-neutral,0 0 0));--mds-date-range-preselection-hover-border:var(--tone-neutral,0 0 0);--mds-date-range-preselection-hover-color:rgb(var(--tone-neutral-03,233 233 233));--mds-date-range-preselection-background:var(--mds-date-range-preselection-default-background,rgb(var(--tone-neutral-08,107 107 107)/0));--mds-date-range-preselection-border:var(--mds-date-range-preselection-default-border,var(--tone-neutral-08,107 107 107));--mds-date-range-preselection-color:var(--mds-date-range-preselection-default-color,rgb(var(--tone-neutral-03,233 233 233)));display:inline-flex;justify-self:start}:host .action{--mds-button-background:var(--mds-date-range-preselection-background);--mds-button-border-color:var(--mds-date-range-preselection-border);--mds-button-color:var(--mds-date-range-preselection-color)}:host .action:hover{--mds-date-range-preselection-background:var(--mds-date-range-preselection-hover-background,rgb(var(--tone-neutral,0 0 0)));--mds-date-range-preselection-border:var(--mds-date-range-preselection-hover-border,var(--tone-neutral,0 0 0));--mds-date-range-preselection-color:var(--mds-date-range-preselection-hover-color,rgb(var(--tone-neutral-03,233 233 233)))}:host([selected]) .action{--mds-date-range-preselection-background:var(--mds-date-range-preselection-selected-background,rgb(var(--variant-primary-03,211 226 255)));--mds-date-range-preselection-border:var(--mds-date-range-preselection-selected-border,var(--variant-primary-03,211 226 255));--mds-date-range-preselection-color:var(--mds-date-range-preselection-selected-color,rgb(var(--tone-neutral,0 0 0)));pointer-events:none}";
-
-const MdsInputDateRangePreselection$1 = /*@__PURE__*/ proxyCustomElement(class MdsInputDateRangePreselection extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.onClick = (event) => {
-            var _a;
-            event.stopPropagation();
-            const mdsInputDateRange = (_a = this.host) === null || _a === void 0 ? void 0 : _a.closest('mds-input-date-range');
-            if (mdsInputDateRange) {
-                mdsInputDateRange.preselect({ caller: this.host, start: this.start, end: this.end });
-                this.selected = true;
-            }
-        };
-    }
-    render() {
-        return (h(Host, { key: '8fa6eff199d4eb92067407c1efd132a4185caf71', slot: "calendar-preselection" }, h("mds-button", { key: 'c44190a71d6fc70321dbbf987c09d0b5e7398515', onClick: this.onClick, class: "action", variant: "primary", tone: "strong" }, h("slot", { key: '61050bd14f48b266a8db2dc120e51c40aa2ebadc' }))));
-    }
-    get host() { return this; }
-    static get style() { return mdsInputDateRangePreselectionCss; }
-}, [257, "mds-input-date-range-preselection", {
-        "selected": [1540],
-        "start": [513],
-        "end": [513]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["mds-input-date-range-preselection", "mds-button", "mds-icon", "mds-spinner", "mds-text"];
-    components.forEach(tagName => { switch (tagName) {
-        case "mds-input-date-range-preselection":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, MdsInputDateRangePreselection$1);
-            }
-            break;
-        case "mds-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "mds-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "mds-spinner":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "mds-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const MdsInputDateRangePreselection = MdsInputDateRangePreselection$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { MdsInputDateRangePreselection, defineCustomElement };
+import{proxyCustomElement as e,HTMLElement as r,h as t,Host as a,transformTag as n}from"@stencil/core/internal/client";import{d as o}from"./mds-button2.js";import{d as s}from"./mds-icon2.js";import{d}from"./mds-spinner2.js";import{d as i}from"./mds-text2.js";const l=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.onClick=e=>{var r;e.stopPropagation();const t=null===(r=this.host)||void 0===r?void 0:r.closest("mds-input-date-range");t&&(t.preselect({caller:this.host,start:this.start,end:this.end}),this.selected=!0)}}render(){return t(a,{key:"e5571b251d0b86eccf975c07af016fd0e25387d3",slot:"calendar-preselection"},t("mds-button",{key:"95b8be91464b8e283c623c191514f7c293b941af",onClick:this.onClick,class:"action",variant:"primary",tone:"strong"},t("slot",{key:"6a96b556f736d867ab858ffba7307c45fb15dd65"})))}get host(){return this}static get style(){return"@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-date-range-preselection-default-background:rgb(var(--tone-neutral-08,107 107 107)/0);--mds-date-range-preselection-default-border:var(--tone-neutral-08,107 107 107);--mds-date-range-preselection-default-color:rgb(var(--tone-neutral-03,233 233 233));--mds-date-range-preselection-selected-background:rgb(var(--variant-primary-03,211 226 255));--mds-date-range-preselection-selected-border:var(--variant-primary-03,211 226 255);--mds-date-range-preselection-selected-color:rgb(var(--tone-neutral,0 0 0));--mds-date-range-preselection-hover-background:rgb(var(--tone-neutral,0 0 0));--mds-date-range-preselection-hover-border:var(--tone-neutral,0 0 0);--mds-date-range-preselection-hover-color:rgb(var(--tone-neutral-03,233 233 233))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-button:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{--mds-date-range-preselection-default-background:rgb(var(--tone-neutral-08,107 107 107)/0);--mds-date-range-preselection-default-border:var(--tone-neutral-08,107 107 107);--mds-date-range-preselection-default-color:rgb(var(--tone-neutral-03,233 233 233));--mds-date-range-preselection-selected-background:rgb(var(--variant-primary-03,211 226 255));--mds-date-range-preselection-selected-border:var(--variant-primary-03,211 226 255);--mds-date-range-preselection-selected-color:rgb(var(--tone-neutral,0 0 0));--mds-date-range-preselection-hover-background:rgb(var(--tone-neutral,0 0 0));--mds-date-range-preselection-hover-border:var(--tone-neutral,0 0 0);--mds-date-range-preselection-hover-color:rgb(var(--tone-neutral-03,233 233 233));--mds-date-range-preselection-background:var(--mds-date-range-preselection-default-background,rgb(var(--tone-neutral-08,107 107 107)/0));--mds-date-range-preselection-border:var(--mds-date-range-preselection-default-border,var(--tone-neutral-08,107 107 107));--mds-date-range-preselection-color:var(--mds-date-range-preselection-default-color,rgb(var(--tone-neutral-03,233 233 233)));display:inline-flex;justify-self:start}:host .action{--mds-button-background:var(--mds-date-range-preselection-background);--mds-button-border-color:var(--mds-date-range-preselection-border);--mds-button-color:var(--mds-date-range-preselection-color)}:host .action:hover{--mds-date-range-preselection-background:var(--mds-date-range-preselection-hover-background,rgb(var(--tone-neutral,0 0 0)));--mds-date-range-preselection-border:var(--mds-date-range-preselection-hover-border,var(--tone-neutral,0 0 0));--mds-date-range-preselection-color:var(--mds-date-range-preselection-hover-color,rgb(var(--tone-neutral-03,233 233 233)))}:host([selected]) .action{--mds-date-range-preselection-background:var(--mds-date-range-preselection-selected-background,rgb(var(--variant-primary-03,211 226 255)));--mds-date-range-preselection-border:var(--mds-date-range-preselection-selected-border,var(--variant-primary-03,211 226 255));--mds-date-range-preselection-color:var(--mds-date-range-preselection-selected-color,rgb(var(--tone-neutral,0 0 0)));pointer-events:none}"}},[257,"mds-input-date-range-preselection",{selected:[1540],start:[513],end:[513]}]),c=l,m=function(){"undefined"!=typeof customElements&&["mds-input-date-range-preselection","mds-button","mds-icon","mds-spinner","mds-text"].forEach((e=>{switch(e){case"mds-input-date-range-preselection":customElements.get(n(e))||customElements.define(n(e),l);break;case"mds-button":customElements.get(n(e))||o();break;case"mds-icon":customElements.get(n(e))||s();break;case"mds-spinner":customElements.get(n(e))||d();break;case"mds-text":customElements.get(n(e))||i()}}))};export{c as MdsInputDateRangePreselection,m as defineCustomElement}

package/dist/components/mds-input-date-range.js

@@ -1,420 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { m as miBaselineCalendarToday } from './calendar-today.js';
-import { D as DateTime, d as defineCustomElement$7 } from './mds-calendar2.js';
-import { c as clsx } from './clsx.js';
-import { L as Locale } from './locale.js';
-import { d as defineCustomElement$8 } from './mds-button2.js';
-import { d as defineCustomElement$6 } from './mds-calendar-cell2.js';
-import { d as defineCustomElement$5 } from './mds-dropdown2.js';
-import { d as defineCustomElement$4 } from './mds-icon2.js';
-import { d as defineCustomElement$3 } from './mds-spinner2.js';
-import { d as defineCustomElement$2 } from './mds-text2.js';
-
-const from$3 = "Από";
-const to$3 = "έως";
-var localeEl = {
-	from: from$3,
-	to: to$3
-};
-
-const from$2 = "From";
-const to$2 = "to";
-var localeEn = {
-	from: from$2,
-	to: to$2
-};
-
-const from$1 = "De";
-const to$1 = "a";
-var localeEs = {
-	from: from$1,
-	to: to$1
-};
-
-const from = "Dal";
-const to = "al";
-var localeIt = {
-	from: from,
-	to: to
-};
-
-const mdsInputDateRangeCss = "@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-input-date-range-background:rgb(var(--tone-neutral,0 0 0));--mds-input-date-range-fields-firefox-justify-content:start;--mds-input-date-range-fields-gap:0 calc(var(--spacing,.0025rem)*200);--mds-input-date-range-icon-color:rgb(var(--variant-primary-03,211 226 255));--mds-input-date-range-variant-color-rgb:0 0 0}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-button,mds-calendar,mds-dropdown,mds-text):not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-input-date-range-fields-firefox-justify-content{syntax:\"start|end|center|left|right|flex-start|flex-end\";inherits:false;initial-value:start}@property --mds-input-date-range-variant-color-rgb{syntax:\"<integer>+\";inherits:false;initial-value:0 0 0}:host{--mds-input-date-range-background:rgb(var(--tone-neutral,0 0 0));--mds-input-date-range-fields-firefox-justify-content:start;--mds-input-date-range-fields-gap:0 calc(var(--spacing,.0025rem)*200);--mds-input-date-range-icon-color:rgb(var(--variant-primary-03,211 226 255));--mds-input-date-range-ring:0 0 0 1px rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.1);--mds-input-date-range-shadow:0 1px 3px 0 rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.1),0 1px 2px 0 rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.06);font-family:var(--font-info,Karla,system-ui,-apple-system,BlinkMacSystemFont,\"Segoe UI\",sans-serif);font-size:var(--text-size-info-detail,1rem);font-weight:var(--tw-font-weight,var(--text-size-info-detail--font-weight,400));line-height:var(--tw-leading,var(--text-size-info-detail--line-height,1.5rem));min-height:auto;text-box:trim-both text;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-radius:var(--radius-2xl,24px);color:rgb(var(--tone-neutral-02,244 244 244));corner-shape:var(--magma-corner-shape,round);container-type:inline-size;cursor:text;display:flex;gap:calc(var(--spacing,.0025rem)*200);overflow:visible;position:relative;--mds-input-date-range-icon-color:rgb(var(--variant-primary-04,184 208 255));--mds-input-date-range-variant-color-rgb:0 0 0}.date-preselection{display:grid;gap:calc(var(--spacing,.0025rem)*200)}.inputs{font-family:var(--font-code,\"Roboto Mono\",\"Courier New\",monospace);font-size:var(--text-size-code-hack,.875rem);font-weight:var(--tw-font-weight,var(--text-size-code-hack--font-weight,400));line-height:var(--tw-leading,var(--text-size-code-hack--line-height,1.25rem));min-height:auto;text-box:trim-both text;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--mds-input-date-range-background,rgb(var(--tone-neutral,0 0 0)));border-radius:inherit;-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);box-sizing:border-box;color:inherit;corner-shape:inherit;align-items:center;border:0;display:inline-flex;flex-wrap:wrap;gap:var(--mds-input-date-range-fields-gap,0 calc(var(--spacing,.0025rem)*200));margin:0;min-height:3rem;overflow:hidden;padding-left:calc(var(--spacing,.0025rem)*400);padding-right:calc(var(--spacing,.0025rem)*1200);text-overflow:ellipsis;-webkit-transition-duration:var(--duration-300,.3s);transition-duration:var(--duration-300,.3s);transition-property:background-color,border-color,box-shadow,color,fill,margin,opacity,padding,transform;-webkit-transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));width:100%}.input-element{align-items:baseline;display:inline-flex}:host(:focus-within) .inputs{--tw-outline-style:none;outline-style:none;transition-duration:var(--default-transition-duration);transition-property:background-color,border-color,box-shadow,color,fill,height,margin,opacity,padding,transform,width;transition-timing-function:var(--default-transition-timing-function);--mds-input-date-range-ring:0 0 0 3px rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/1);--mds-input-date-range-shadow:0 4px 6px 3px rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.1),0 2px 4px -1px rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.06);-webkit-transition-duration:var(--duration-300,.3s);transition-duration:var(--duration-300,.3s);-webkit-transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1))}.input-wrapper{display:flex;flex-shrink:0}.date-label{margin-left:calc(var(--spacing,.0025rem)*50);margin-right:calc(var(--spacing,.0025rem)*50);min-width:min-content;white-space:nowrap}.date-label:first-child{margin-left:0}mds-calendar{min-width:max-content}.action-open-calendar-wrapper{align-items:center;aspect-ratio:1;bottom:0;display:flex;justify-content:center;position:absolute;right:0;top:0}.action-open-calendar{--mds-button-color:var(--mds-input-date-range-icon-color,rgb(var(--variant-primary-03,211 226 255)))}mds-dropdown{padding:0}:host-context(:root.pref-animation-reduce) .input{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-input-date-range-ring:var(--shadow-outline-50);--mds-input-date-range-background:rgb(var(--tone-neutral-09,76 76 76));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-06,158 158 158))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .counter-button:hover{--mds-button-background:rgb(var(--tone-neutral-08,107 107 107))}:host-context(:root.pref-contrast-more){--mds-input-date-range-ring:var(--shadow-outline-strong-50);--mds-input-date-range-background:rgb(var(--tone-neutral-09,76 76 76));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-05,197 197 197))}:host-context(:root.pref-contrast-more) .input::placeholder{color:rgb(var(--tone-neutral-03,233 233 233))}:host-context(:root.pref-contrast-more) .input:-ms-placeholder-shown{color:rgb(var(--tone-neutral-03,233 233 233))}@supports ((-moz-appearance:none)){.action-open-calendar{display:none}.inputs{-ms-flex-pack:var(--mds-input-date-range-fields-firefox-justify-content,start);justify-content:var(--mds-input-date-range-fields-firefox-justify-content,start);padding-right:calc(var(--spacing,.0025rem)*400)}}:host(:focus-within){--mds-input-date-range-icon-color:rgb(var(--variant-primary-05,152 188 255));--mds-input-date-range-variant-color-rgb:var(--variant-primary-04,184 208 255)}:host([variant=ai]){--mds-input-date-range-icon-color:rgb(var(--variant-ai-04,218 199 253));--mds-input-tip-background:rgb(var(--variant-ai-05,202 174 251));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=ai]:focus-within){--mds-input-date-range-icon-color:rgb(var(--variant-ai-05,202 174 251));--mds-input-date-range-variant-color-rgb:var(--variant-ai-04,218 199 253)}:host([variant=info]){--mds-input-date-range-icon-color:rgb(var(--status-info-04,159 216 241));--mds-input-tip-background:rgb(var(--status-info-05,112 198 234));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=info]:focus-within){--mds-input-date-range-icon-color:rgb(var(--status-info-05,112 198 234));--mds-input-date-range-variant-color-rgb:var(--status-info-04,159 216 241)}:host([variant=success]){--mds-input-date-range-icon-color:rgb(var(--status-success-04,158 222 181));--mds-input-tip-background:rgb(var(--status-success-05,107 206 147));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=success]:focus-within){--mds-input-date-range-icon-color:rgb(var(--status-success-05,107 206 147));--mds-input-date-range-variant-color-rgb:var(--status-success-04,158 222 181)}:host([variant=warning]){--mds-input-date-range-icon-color:rgb(var(--status-warning-04,255 200 33));--mds-input-tip-background:rgb(var(--status-warning-05,237 177 0));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=warning]:focus-within){--mds-input-date-range-icon-color:rgb(var(--status-warning-05,237 177 0));--mds-input-date-range-variant-color-rgb:var(--status-warning-04,255 200 33)}:host([variant=error]){--mds-input-date-range-icon-color:rgb(var(--status-error-04,254 193 189));--mds-input-tip-background:rgb(var(--status-error-05,250 165 160));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=error]:focus-within){--mds-input-date-range-icon-color:rgb(var(--status-error-05,250 165 160));--mds-input-date-range-variant-color-rgb:var(--status-error-04,254 193 189)}@media (forced-colors:active){:host(:focus-within) .inputs{outline:2px solid #0000;outline-offset:2px}}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .input{transition-duration:0s}}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){--mds-input-date-range-ring:var(--shadow-outline-50);--mds-input-date-range-background:rgb(var(--tone-neutral-09,76 76 76));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-06,158 158 158))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .counter-button:hover{--mds-button-background:rgb(var(--tone-neutral-08,107 107 107))}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-input-date-range-ring:var(--shadow-outline-strong-50);--mds-input-date-range-background:rgb(var(--tone-neutral-09,76 76 76));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-05,197 197 197))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))) .input::placeholder{color:rgb(var(--tone-neutral-03,233 233 233))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))) .input:-ms-placeholder-shown{color:rgb(var(--tone-neutral-03,233 233 233))}}";
-
-const MdsInputDateRange$1 = /*@__PURE__*/ proxyCustomElement(class MdsInputDateRange extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.dateRangeSelected = createEvent(this, "mdsInputDateRangeSelect", 7);
-        this.valueChanged = createEvent(this, "mdsInputDateRangeValueChange", 7);
-        this.internals = this.attachInternals();
-        this.calendarKey = 0;
-        this.internalStartDate = '';
-        this.internalEndDate = '';
-        this.hasPreselection = false;
-        this.t = new Locale({
-            el: localeEl,
-            en: localeEn,
-            es: localeEs,
-            it: localeIt,
-        });
-        /**
-         * Specifies the start date of the range
-         * @description It's in ISO format (YYYY-MM-DD).
-         */
-        this.startDate = '';
-        /**
-         * Specifies the end date of the range
-         * @description It's in ISO format (YYYY-MM-DD).
-         */
-        this.endDate = '';
-        /**
-         * Specifies the min date of the range, user cannot set dates before this date
-         * @description It's in ISO format (YYYY-MM-DD).
-         */
-        this.min = null;
-        /**
-         * Specifies the max date of the range, user cannot set dates after this date
-         * @description It's in ISO format (YYYY-MM-DD).
-         */
-        this.max = null;
-        /**
-         * Specifies the delay in milliseconds before closing the calendar dropdown, if the value is 0 the dropdown will not close
-         * @description Default is 500
-         */
-        this.delay = 500;
-        this.lastEmittedStartDate = null;
-        this.lastEmittedEndDate = null;
-        this.initialStartDate = '';
-        this.initialEndDate = '';
-        this.handleFocusOut = (event) => {
-            if (!this.host.contains(event.relatedTarget)) {
-                const startValid = DateTime.fromISO(this.internalStartDate).isValid;
-                const endValid = DateTime.fromISO(this.internalEndDate).isValid;
-                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.focusInput = (element) => {
-            element.focusInput();
-        };
-        this.focusDateInput = (ev) => {
-            if (ev.target !== this.host) {
-                return;
-            }
-            this.focusStartDateInput(ev);
-        };
-        this.focusStartDateInput = (ev) => {
-            ev.preventDefault();
-            ev.stopPropagation();
-            this.focusInput(this.host.querySelector('mds-input-date[slot="start"]'));
-        };
-        this.focusEndDateInput = (ev) => {
-            ev.preventDefault();
-            ev.stopPropagation();
-            this.focusInput(this.host.querySelector('mds-input-date[slot="end"]'));
-        };
-    }
-    async updateLang() {
-        this.language = this.t.lang(this.host);
-    }
-    handleStartDateChange(newValue) {
-        this.syncExternalDate('start', newValue);
-    }
-    handleEndDateChange(newValue) {
-        this.syncExternalDate('end', newValue);
-    }
-    componentWillLoad() {
-        this.language = this.t.lang(this.host);
-        this.internalStartDate = this.startDate;
-        this.internalEndDate = this.endDate;
-        this.initialStartDate = this.startDate;
-        this.initialEndDate = this.endDate;
-        // Se max è precedente a min, imposto max uguale a min
-        if (this.min && this.max) {
-            const minDate = DateTime.fromISO(this.min);
-            const maxDate = DateTime.fromISO(this.max);
-            if (maxDate < minDate) {
-                this.max = this.min;
-            }
-        }
-        this.syncFormValue();
-    }
-    disconnectedCallback() {
-        this.host.removeEventListener('focusout', this.handleFocusOut);
-    }
-    async preselect(event) {
-        var _a, _b;
-        if (!this.togglePreselection) {
-            this.togglePreselection = Array.from(this.host.querySelectorAll('mds-input-date-range-preselection'));
-        }
-        this.togglePreselection.forEach((element) => {
-            element.selected = false;
-        });
-        event.caller.selected = true;
-        const startDate = DateTime.fromISO(event.start);
-        if (startDate.isValid) {
-            this.internalStartDate = event.start;
-            this.updateInputValue('start', this.internalStartDate);
-        }
-        if (event.end !== undefined) {
-            const endDate = DateTime.fromISO(event.end);
-            if (endDate.isValid) {
-                this.internalEndDate = event.end;
-            }
-        }
-        else {
-            this.internalEndDate = event.start;
-        }
-        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);
-            }
-        }
-        this.dateRangeSelected.emit({
-            startDate: this.internalStartDate,
-            endDate: this.internalEndDate,
-        });
-        return Promise.resolve();
-    }
-    componentDidLoad() {
-        this.updateInputListeners();
-        this.updateInputValue('start', this.internalStartDate);
-        this.updateInputValue('end', this.internalEndDate);
-        this.syncFormValue();
-        this.host.addEventListener('focusout', this.handleFocusOut);
-    }
-    formResetCallback() {
-        this.internalStartDate = this.initialStartDate;
-        this.internalEndDate = this.initialEndDate;
-        this.updateInputValue('start', this.internalStartDate);
-        this.updateInputValue('end', this.internalEndDate);
-        this.checkPreselections();
-        this.syncFormValue();
-    }
-    syncExternalDate(slotName, newValue) {
-        const normalizedValue = newValue !== null && newValue !== void 0 ? newValue : '';
-        if (slotName === 'start') {
-            if (normalizedValue === this.internalStartDate)
-                return;
-            this.internalStartDate = normalizedValue;
-        }
-        else {
-            if (normalizedValue === this.internalEndDate)
-                return;
-            this.internalEndDate = normalizedValue;
-        }
-        this.validateDateRange();
-        this.updateInputValue('start', this.internalStartDate);
-        this.updateInputValue('end', this.internalEndDate);
-        this.checkPreselections();
-        this.syncFormValue();
-    }
-    updateInputValue(slotName, newValue) {
-        var _a;
-        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);
-        }
-    }
-    updateInputListeners() {
-        var _a, _b;
-        const startSlot = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('slot[name="start"]');
-        const endSlot = (_b = this.host.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('slot[name="end"]');
-        this.hasPreselection = this.host.querySelector('mds-input-date-range-preselection') !== null;
-        if (startSlot) {
-            const input = startSlot.assignedElements()[0];
-            input.addEventListener('mdsInputDateSelect', this.createFocusoutListener('start'));
-        }
-        if (endSlot) {
-            const input = endSlot.assignedElements()[0];
-            input.addEventListener('mdsInputDateSelect', this.createFocusoutListener('end'));
-        }
-    }
-    createFocusoutListener(slotName) {
-        return (ev) => {
-            const event = ev;
-            if (slotName === 'start') {
-                this.internalStartDate = event.detail;
-            }
-            else {
-                this.internalEndDate = event.detail;
-            }
-            this.syncFormValue();
-        };
-    }
-    validateDateRange() {
-        if (this.internalStartDate && this.internalEndDate) {
-            const start = DateTime.fromISO(this.internalStartDate);
-            const end = DateTime.fromISO(this.internalEndDate);
-            if (end < start) {
-                this.internalEndDate = this.internalStartDate;
-                this.updateInputValue('end', this.internalEndDate);
-            }
-        }
-    }
-    checkPreselections() {
-        const preselections = Array.from(this.host.querySelectorAll('mds-input-date-range-preselection'));
-        if (preselections) {
-            preselections.forEach((element) => {
-                const preselection = element;
-                const isSameRange = preselection.start === this.internalStartDate &&
-                    preselection.end === this.internalEndDate;
-                const isSingleDayMatch = preselection.start === this.internalStartDate &&
-                    this.internalStartDate === this.internalEndDate &&
-                    preselection.end === undefined;
-                if (isSameRange || isSingleDayMatch) {
-                    preselection.selected = true;
-                }
-                else {
-                    preselection.selected = false;
-                }
-            });
-        }
-    }
-    render() {
-        return (h(Host, { key: '4aef8d318b0cab17f4ad1d7c276cbd0db2d2038d', onClick: this.focusDateInput }, h("div", { key: '8cc6be57143826af84c01a617fe4e2f47f45b63d', class: "inputs" }, h("div", { key: 'b79ce756d5064394cc2a3920ff72beb30e01ceb1', class: "input-element" }, h("mds-text", { key: '29825a813f7b8fb553c7ffce9db377e1884409fe', class: "date-label", typography: "detail", onClick: this.focusStartDateInput }, this.t.get('from')), h("div", { key: '829e272b2e59be82c1e7d46e1c7f219965ed9645', class: "input-wrapper" }, h("slot", { key: '9dce89ebb990e417772dfd22f3773e34e0372087', name: "start" }))), h("div", { key: '7d1c88dac297479bbb7ac19d29bdc2a61878c9ec', class: "input-element" }, h("mds-text", { key: 'ed4e0bf4f145127142cb4b093aadc8e065259395', class: "date-label", typography: "detail", onClick: this.focusEndDateInput }, this.t.get('to')), h("div", { key: '41c3ec52338798b32eb5439c6c429785405fb17d', class: "input-wrapper" }, h("slot", { key: '9d2c09367d5aa5e4f53dfbfb46ddab6695372cbb', name: "end" })))), h("div", { key: '6a3d364492b926fc9ff36173acc973b4a2f5d549', class: "action-open-calendar-wrapper" }, h("mds-button", { key: '1542474a4fd9d8f293511daa0021105d995d59a2', class: "action-open-calendar", variant: "dark", tone: "text", icon: miBaselineCalendarToday, id: "calendar-dropdown", onClick: () => {
-                this.calendarKey += 1;
-            } })), h("mds-dropdown", { key: 'aaa26eeab22f16125384fcfcc35ea7b1e6daf8cf', 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: '906707dd59ff68bb46a411aae205d74cb61113bf', slot: "preselection", class: clsx('date-preselection', this.hasPreselection && 'date-preselection--has-preselection') }, h("slot", { key: 'e96a49b3797994bb00f66f5f9e88d4c7435e91cb', name: "calendar-preselection" }))))));
-    }
-    syncFormValue() {
-        var _a, _b, _c, _d;
-        const startDate = (_b = (_a = this.internalStartDate) === null || _a === void 0 ? void 0 : _a.trim()) !== null && _b !== void 0 ? _b : '';
-        const endDate = (_d = (_c = this.internalEndDate) === null || _c === void 0 ? void 0 : _c.trim()) !== null && _d !== void 0 ? _d : '';
-        if (!startDate && !endDate) {
-            this.internals.setFormValue(null);
-            return;
-        }
-        this.internals.setFormValue(JSON.stringify({ startDate, endDate }));
-    }
-    static get formAssociated() { return true; }
-    get host() { return this; }
-    static get watchers() { return {
-        "startDate": ["handleStartDateChange"],
-        "endDate": ["handleEndDateChange"]
-    }; }
-    static get style() { return mdsInputDateRangeCss; }
-}, [321, "mds-input-date-range", {
-        "startDate": [513, "start-date"],
-        "endDate": [513, "end-date"],
-        "min": [513],
-        "max": [513],
-        "delay": [514],
-        "name": [513],
-        "calendarKey": [32],
-        "internalStartDate": [32],
-        "internalEndDate": [32],
-        "dropdownRef": [32],
-        "hasPreselection": [32],
-        "language": [32],
-        "updateLang": [64],
-        "preselect": [64]
-    }, undefined, {
-        "startDate": ["handleStartDateChange"],
-        "endDate": ["handleEndDateChange"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["mds-input-date-range", "mds-button", "mds-calendar", "mds-calendar-cell", "mds-dropdown", "mds-icon", "mds-spinner", "mds-text"];
-    components.forEach(tagName => { switch (tagName) {
-        case "mds-input-date-range":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, MdsInputDateRange$1);
-            }
-            break;
-        case "mds-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$8();
-            }
-            break;
-        case "mds-calendar":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "mds-calendar-cell":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "mds-dropdown":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "mds-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "mds-spinner":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "mds-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const MdsInputDateRange = MdsInputDateRange$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { MdsInputDateRange, defineCustomElement };
+import{proxyCustomElement as t,HTMLElement as e,createEvent as a,h as n,Host as i,transformTag as r}from"@stencil/core/internal/client";import{m as s}from"./calendar-today.js";import{D as o,d}from"./mds-calendar2.js";import{c as l}from"./clsx.js";import{L as h}from"./locale.js";import{d as c}from"./mds-button2.js";import{d as m}from"./mds-calendar-cell2.js";import{d as u}from"./mds-dropdown2.js";import{d as p}from"./mds-icon2.js";import{d as g}from"./mds-spinner2.js";import{d as v}from"./mds-text2.js";var b={from:"Από",to:"έως"},f={from:"From",to:"to"},x={from:"De",to:"a"},y={from:"Dal",to:"al"};const w=t(class extends e{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.valueChanged=a(this,"mdsInputDateRangeValueChange",7),this.internals=this.attachInternals(),this.calendarKey=0,this.internalStartDate="",this.internalEndDate="",this.visibleCalendarDate="",this.hasPreselection=!1,this.t=new h({el:b,en:f,es:x,it:y}),this.startDate="",this.endDate="",this.min=null,this.max=null,this.delay=500,this.dualCalendar=!1,this.lastEmittedStartDate=null,this.lastEmittedEndDate=null,this.initialStartDate="",this.initialEndDate="",this.hoveredCalendarDate=null,this.syncingInputSlots=new Set,this.handleFocusOut=t=>{if(!this.host.contains(t.relatedTarget)){const t=o.fromISO(this.internalStartDate).isValid,e=o.fromISO(this.internalEndDate).isValid;t&&e&&(this.validateDateRange(),this.syncFormValue(),this.checkPreselections(),this.emitValueChanged())}},this.focusInput=t=>{t.focusInput()},this.focusDateInput=t=>{t.target===this.host&&this.focusStartDateInput(t)},this.focusStartDateInput=t=>{t.preventDefault(),t.stopPropagation(),this.focusInput(this.host.querySelector('mds-input-date[slot="start"]'))},this.focusEndDateInput=t=>{t.preventDefault(),t.stopPropagation(),this.focusInput(this.host.querySelector('mds-input-date[slot="end"]'))},this.handleCalendarHover=t=>{if(""===this.internalStartDate||""!==this.internalEndDate)return void this.clearHoverPreview();const e=t.detail.hoverDate;this.hoveredCalendarDate!==e&&(this.hoveredCalendarDate=e,this.syncCalendarsHoverAttributes())},this.handleCalendarChange=t=>{this.clearHoverPreview(),this.internalStartDate=t.detail.startDate,this.updateInputValue("start",this.internalStartDate),void 0!==t.detail.endDate&&""!==t.detail.endDate?(this.internalEndDate=t.detail.endDate,this.updateInputValue("end",this.internalEndDate)):(this.internalEndDate="",this.updateInputValue("end",this.internalEndDate)),this.syncFormValue(),this.syncCalendarsSelectionAttributes(),""!==this.internalStartDate&&""!==this.internalEndDate&&(this.emitValueChanged(),this.closeDropdownAfterSelection())},this.handleCalendarNavigate=t=>{if(!this.dualCalendar)return;const e=this.getCalendars().indexOf(t.target),a=o.fromISO(t.detail.currentDate);a.isValid&&(this.visibleCalendarDate=a.minus({months:1===e?1:0}).startOf("month").toISODate())}}async updateLang(){this.language=this.t.lang(this.host)}getCalendars(){var t,e;return Array.from(null!==(e=null===(t=this.host.shadowRoot)||void 0===t?void 0:t.querySelectorAll("mds-calendar"))&&void 0!==e?e:[])}resolveVisibleCalendarDate(t,e){var a;return(null!==(a=[t,e].map((t=>o.fromISO(null!=t?t:""))).filter((t=>t.isValid))[0])&&void 0!==a?a:o.now()).startOf("month").toISODate()}getCalendarViewDate(t=0){const e=o.fromISO(this.visibleCalendarDate),a=o.fromISO(this.internalStartDate);let n=o.now();return e.isValid?n=e:a.isValid&&(n=a),n.startOf("month").plus({months:t}).toISODate()}setVisibleCalendarDate(t){const e=o.fromISO(t);e.isValid&&(this.visibleCalendarDate=e.startOf("month").toISODate())}closeDropdownAfterSelection(){if(0===this.delay)return;const{dropdownRef:t}=this;t&&setTimeout((()=>{t.visible=!1}),this.delay)}syncCalendarsSelectionAttributes(){var t;null===(t=this.host.shadowRoot)||void 0===t||t.querySelectorAll("mds-calendar").forEach((t=>{""!==this.internalStartDate?t.setAttribute("start-date",this.internalStartDate):t.removeAttribute("start-date"),""!==this.internalEndDate?t.setAttribute("end-date",this.internalEndDate):t.removeAttribute("end-date")})),this.syncCalendarsHoverAttributes()}syncCalendarsHoverAttributes(){var t;null===(t=this.host.shadowRoot)||void 0===t||t.querySelectorAll("mds-calendar").forEach((t=>{null!==this.hoveredCalendarDate&&""!==this.hoveredCalendarDate?t.setAttribute("hover-date",this.hoveredCalendarDate):t.removeAttribute("hover-date")}))}clearHoverPreview(){null!==this.hoveredCalendarDate&&(this.hoveredCalendarDate=null,this.syncCalendarsHoverAttributes())}getEmittableDateRangeDetail(){const t=o.fromISO(this.internalStartDate),e=o.fromISO(this.internalEndDate);return t.isValid&&e.isValid?{startDate:this.internalStartDate,endDate:this.internalEndDate}:null}emitValueChanged(){const t=this.getEmittableDateRangeDetail();return!(!t||t.startDate===this.lastEmittedStartDate&&t.endDate===this.lastEmittedEndDate||(this.valueChanged.emit(t),this.lastEmittedStartDate=t.startDate,this.lastEmittedEndDate=t.endDate,0))}handleStartDateChange(t){this.syncExternalDate("start",t)}handleEndDateChange(t){this.syncExternalDate("end",t)}componentWillLoad(){if(this.language=this.t.lang(this.host),this.internalStartDate=this.startDate,this.internalEndDate=this.endDate,this.initialStartDate=this.startDate,this.initialEndDate=this.endDate,this.visibleCalendarDate=this.resolveVisibleCalendarDate(this.internalStartDate,this.internalEndDate),null!==this.min&&""!==this.min&&null!==this.max&&""!==this.max){const t=o.fromISO(this.min);o.fromISO(this.max)<t&&(this.max=this.min)}this.syncFormValue()}disconnectedCallback(){var t;this.host.removeEventListener("focusout",this.handleFocusOut),null===(t=this.host.shadowRoot)||void 0===t||t.removeEventListener("mdsCalendarHover",this.handleCalendarHover)}async preselect(t){null==this.togglePreselection&&(this.togglePreselection=Array.from(this.host.querySelectorAll("mds-input-date-range-preselection"))),this.togglePreselection.forEach((t=>{t.selected=!1})),t.caller.selected=!0,this.clearHoverPreview(),o.fromISO(t.start).isValid&&(this.internalStartDate=t.start,this.setVisibleCalendarDate(this.internalStartDate),this.updateInputValue("start",this.internalStartDate)),void 0!==t.end?o.fromISO(t.end).isValid&&(this.internalEndDate=t.end):this.internalEndDate=t.start,this.updateInputValue("end",this.internalEndDate),this.syncFormValue();const e=this.getCalendars();return 0!==e.length&&(await Promise.all(e.map(((t,e)=>t.updateCurrentDate(this.getCalendarViewDate(e))))),this.closeDropdownAfterSelection()),this.emitValueChanged(),Promise.resolve()}componentDidLoad(){var t;this.updateInputListeners(),this.updateInputValue("start",this.internalStartDate),this.updateInputValue("end",this.internalEndDate),this.syncFormValue(),this.host.addEventListener("focusout",this.handleFocusOut),null===(t=this.host.shadowRoot)||void 0===t||t.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(),this.syncFormValue()}syncExternalDate(t,e){const a=null!=e?e:"";if(this.clearHoverPreview(),"start"===t){if(a===this.internalStartDate)return;this.internalStartDate=a,this.setVisibleCalendarDate(this.internalStartDate)}else{if(a===this.internalEndDate)return;this.internalEndDate=a}this.validateDateRange(),this.updateInputValue("start",this.internalStartDate),this.updateInputValue("end",this.internalEndDate),this.checkPreselections(),this.syncFormValue()}updateInputValue(t,e){var a;const n=null===(a=this.host.shadowRoot)||void 0===a?void 0:a.querySelector(`slot[name="${t}"]`),i=null==n?void 0:n.assignedElements()[0];null!=i&&(this.syncingInputSlots.add(t),i.setValue(e).finally((()=>{requestAnimationFrame((()=>{this.syncingInputSlots.delete(t)}))})))}updateInputListeners(){var t,e;const a=null===(t=this.host.shadowRoot)||void 0===t?void 0:t.querySelector('slot[name="start"]'),n=null===(e=this.host.shadowRoot)||void 0===e?void 0:e.querySelector('slot[name="end"]');this.hasPreselection=null!==this.host.querySelector("mds-input-date-range-preselection"),null!=a&&a.assignedElements()[0].addEventListener("mdsInputDateSelect",this.createFocusoutListener("start")),null!=n&&n.assignedElements()[0].addEventListener("mdsInputDateSelect",this.createFocusoutListener("end"))}createFocusoutListener(t){return e=>{if(this.syncingInputSlots.has(t))return;const a=e;this.clearHoverPreview(),"start"===t?(this.internalStartDate=a.detail,this.setVisibleCalendarDate(this.internalStartDate)):this.internalEndDate=a.detail,this.syncFormValue()}}validateDateRange(){if(""!==this.internalStartDate&&""!==this.internalEndDate){const t=o.fromISO(this.internalStartDate);o.fromISO(this.internalEndDate)<t&&(this.internalEndDate=this.internalStartDate,this.updateInputValue("end",this.internalEndDate))}}checkPreselections(){const t=Array.from(this.host.querySelectorAll("mds-input-date-range-preselection"));null!=t&&t.forEach((t=>{t.selected=!!(t.start===this.internalStartDate&&t.end===this.internalEndDate||t.start===this.internalStartDate&&this.internalStartDate===this.internalEndDate&&void 0===t.end)}))}renderCalendarPreselectionPanel(){return this.hasPreselection?n("div",{class:"calendar-preselection-panel"},n("div",{class:l("date-preselection",this.hasPreselection&&"date-preselection--has-preselection")},n("slot",{name:"calendar-preselection"}))):null}renderSingleCalendar(){return n("div",{class:"calendar-single"},this.renderCalendarPreselectionPanel(),n("mds-calendar",Object.assign({lang:this.language,key:this.calendarKey,rangePicker:!0,onMdsCalendarChange:this.handleCalendarChange,onMdsCalendarPreselect:()=>{this.checkPreselections()},startDate:this.internalStartDate,endDate:this.internalEndDate},null!==this.min&&""!==this.min?{min:this.min}:{},null!==this.max&&""!==this.max?{max:this.max}:{})))}renderDualCalendars(){return n("div",{class:"calendars"},this.renderCalendarPreselectionPanel(),n("mds-calendar",Object.assign({lang:this.language,key:this.calendarKey+"-start",rangePicker:!0,showNextButton:!1,disableMonthYearSelection:!0,viewDate:this.getCalendarViewDate(),onMdsCalendarNavigate:this.handleCalendarNavigate,onMdsCalendarChange:this.handleCalendarChange,onMdsCalendarPreselect:()=>{this.checkPreselections()},startDate:this.internalStartDate,endDate:this.internalEndDate},null!==this.min&&""!==this.min?{min:this.min}:{},null!==this.max&&""!==this.max?{max:this.max}:{})),n("mds-calendar",Object.assign({lang:this.language,key:this.calendarKey+"-end",rangePicker:!0,showPreviousButton:!1,disableMonthYearSelection:!0,viewDate:this.getCalendarViewDate(1),onMdsCalendarNavigate:this.handleCalendarNavigate,onMdsCalendarChange:this.handleCalendarChange,onMdsCalendarPreselect:()=>{this.checkPreselections()},startDate:this.internalStartDate,endDate:this.internalEndDate},null!==this.min&&""!==this.min?{min:this.min}:{},null!==this.max&&""!==this.max?{max:this.max}:{})))}render(){return n(i,{key:"13d9a565316927ca4ec2586f82e2f25f7d04ae25",onClick:this.focusDateInput},n("div",{key:"71bda796783e6ead96c24ad4ed84ac79265291e8",class:"inputs"},n("div",{key:"c06b73facc486130eb89e857b782b15581cfba20",class:"input-element"},n("mds-text",{key:"340fa48ce0a88bd6445cfc874c27ec70e2426feb",class:"date-label",typography:"detail",onClick:this.focusStartDateInput},this.t.get("from")),n("div",{key:"b82416e3ffa442ee84004d20e298b859ca5543a8",class:"input-wrapper"},n("slot",{key:"9b8741fecf76c4503e58b044222b4ccb6bb889e0",name:"start"}))),n("div",{key:"fcd38e4e5d5a065001c712a960dd5bcae1dd5e79",class:"input-element"},n("mds-text",{key:"269cdf295bfefe625a3cf98f1aaf7fb021b688d4",class:"date-label",typography:"detail",onClick:this.focusEndDateInput},this.t.get("to")),n("div",{key:"ee917dba0a0af805e1ebe5b69fb997b492e044ba",class:"input-wrapper"},n("slot",{key:"dd22c8a98be387b76aa6b355f6b025db1a8fdbb6",name:"end"})))),n("div",{key:"ca651a85e149d23e4eafdf66c121ffa3d5685dca",class:"action-open-calendar-wrapper"},n("mds-button",{key:"ff5e89aec57614f98890f52859bc2f10e33bc85d",class:"action-open-calendar",variant:"dark",tone:"text",icon:s,id:"calendar-dropdown",onClick:()=>{this.calendarKey+=1}})),n("mds-dropdown",{key:"30609e1d1eb75209b5e17444758b1b9b2ac19bce",ref:t=>this.dropdownRef=t,target:"#calendar-dropdown","auto-placement":!1,placement:"bottom-end"},this.dualCalendar?this.renderDualCalendars():this.renderSingleCalendar()))}syncFormValue(){var t,e,a,n;const i=null!==(e=null===(t=this.internalStartDate)||void 0===t?void 0:t.trim())&&void 0!==e?e:"",r=null!==(n=null===(a=this.internalEndDate)||void 0===a?void 0:a.trim())&&void 0!==n?n:"";this.internals.setFormValue(""!==i||""!==r?JSON.stringify({startDate:i,endDate:r}):null)}static get formAssociated(){return!0}get host(){return this}static get watchers(){return{startDate:[{handleStartDateChange:0}],endDate:[{handleEndDateChange:0}]}}static get style(){return'@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-input-date-range-background:rgb(var(--tone-neutral,0 0 0));--mds-input-date-range-calendar-width:22rem;--mds-input-date-range-fields-firefox-justify-content:start;--mds-input-date-range-fields-gap:0 calc(var(--spacing,.0025rem)*200);--mds-input-date-range-icon-color:rgb(var(--variant-primary-03,211 226 255));--mds-input-date-range-variant-color-rgb:0 0 0}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-button,mds-calendar,mds-dropdown,mds-text):not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-input-date-range-calendar-width{syntax:"<length>";inherits:false;initial-value:22rem}@property --mds-input-date-range-fields-firefox-justify-content{syntax:"start|end|center|left|right|flex-start|flex-end";inherits:false;initial-value:start}@property --mds-input-date-range-variant-color-rgb{syntax:"<integer>+";inherits:false;initial-value:0 0 0}:host{--mds-input-date-range-background:rgb(var(--tone-neutral,0 0 0));--mds-input-date-range-calendar-width:22rem;--mds-input-date-range-fields-firefox-justify-content:start;--mds-input-date-range-fields-gap:0 calc(var(--spacing,.0025rem)*200);--mds-input-date-range-icon-color:rgb(var(--variant-primary-03,211 226 255));--mds-input-date-range-ring:0 0 0 1px rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.1);--mds-input-date-range-shadow:0 1px 3px 0 rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.1),0 1px 2px 0 rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.06);font-family:var(--font-info,Karla,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif);font-size:var(--text-size-info-detail,1rem);font-weight:var(--tw-font-weight,var(--text-size-info-detail--font-weight,400));line-height:var(--tw-leading,var(--text-size-info-detail--line-height,1.5rem));min-height:auto;text-box:trim-both text;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;border-radius:var(--radius-2xl,24px);color:rgb(var(--tone-neutral-02,244 244 244));corner-shape:var(--magma-corner-shape,round);container-type:inline-size;cursor:text;display:flex;gap:calc(var(--spacing,.0025rem)*200);overflow:visible;position:relative;--mds-input-date-range-icon-color:rgb(var(--variant-primary-04,184 208 255));--mds-input-date-range-variant-color-rgb:0 0 0}.date-preselection{display:grid;gap:calc(var(--spacing,.0025rem)*200)}.inputs{font-family:var(--font-code,"Roboto Mono","Courier New",monospace);font-size:var(--text-size-code-hack,.875rem);font-weight:var(--tw-font-weight,var(--text-size-code-hack--font-weight,400));line-height:var(--tw-leading,var(--text-size-code-hack--line-height,1.25rem));min-height:auto;text-box:trim-both text;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--mds-input-date-range-background,rgb(var(--tone-neutral,0 0 0)));border-radius:inherit;-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);box-sizing:border-box;color:inherit;corner-shape:inherit;align-items:center;border:0;display:inline-flex;flex-wrap:wrap;gap:var(--mds-input-date-range-fields-gap,0 calc(var(--spacing,.0025rem)*200));margin:0;min-height:3rem;overflow:hidden;padding-left:calc(var(--spacing,.0025rem)*400);padding-right:calc(var(--spacing,.0025rem)*1200);text-overflow:ellipsis;-webkit-transition-duration:var(--duration-300,.3s);transition-duration:var(--duration-300,.3s);transition-property:background-color,border-color,box-shadow,color,fill,margin,opacity,padding,transform;-webkit-transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));width:100%}.input-element{align-items:baseline;display:inline-flex}:host(:focus-within) .inputs{--tw-outline-style:none;outline-style:none;transition-duration:var(--default-transition-duration);transition-property:background-color,border-color,box-shadow,color,fill,height,margin,opacity,padding,transform,width;transition-timing-function:var(--default-transition-timing-function);--mds-input-date-range-ring:0 0 0 3px rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/1);--mds-input-date-range-shadow:0 4px 6px 3px rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.1),0 2px 4px -1px rgb(var(--mds-input-date-range-variant-color-rgb,0 0 0)/.06);-webkit-transition-duration:var(--duration-300,.3s);transition-duration:var(--duration-300,.3s);-webkit-transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1))}.input-wrapper{display:flex;flex-shrink:0}.date-label{margin-left:calc(var(--spacing,.0025rem)*50);margin-right:calc(var(--spacing,.0025rem)*50);min-width:min-content;white-space:nowrap}.date-label:first-child{margin-left:0}.calendars{display:flex;flex-wrap:nowrap;gap:calc(var(--spacing,.0025rem)*200);min-width:max-content}.calendar-preselection-panel{align-content:start;background-color:rgb(var(--tone-neutral-09,76 76 76));border-radius:var(--radius-lg,16px);box-sizing:border-box;display:grid;min-inline-size:max-content;padding:calc(var(--spacing,.0025rem)*400)}.calendar-single{display:flex;flex-wrap:nowrap;gap:calc(var(--spacing,.0025rem)*200);min-width:max-content}.calendar-single mds-calendar,.calendars mds-calendar{-ms-flex:0 0 var(--mds-input-date-range-calendar-width,22rem);flex:0 0 var(--mds-input-date-range-calendar-width,22rem);inline-size:var(--mds-input-date-range-calendar-width,22rem);max-inline-size:var(--mds-input-date-range-calendar-width,22rem);min-inline-size:var(--mds-input-date-range-calendar-width,22rem)}.action-open-calendar-wrapper{align-items:center;aspect-ratio:1;bottom:0;display:flex;justify-content:center;position:absolute;right:0;top:0}.action-open-calendar{--mds-button-color:var(--mds-input-date-range-icon-color,rgb(var(--variant-primary-03,211 226 255)))}mds-dropdown{padding:0}:host-context(:root.pref-animation-reduce) .input{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-input-date-range-ring:var(--shadow-outline-50);--mds-input-date-range-background:rgb(var(--tone-neutral-09,76 76 76));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-06,158 158 158))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .counter-button:hover{--mds-button-background:rgb(var(--tone-neutral-08,107 107 107))}:host-context(:root.pref-contrast-more){--mds-input-date-range-ring:var(--shadow-outline-strong-50);--mds-input-date-range-background:rgb(var(--tone-neutral-09,76 76 76));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-05,197 197 197))}:host-context(:root.pref-contrast-more) .input::placeholder{color:rgb(var(--tone-neutral-03,233 233 233))}:host-context(:root.pref-contrast-more) .input:-ms-placeholder-shown{color:rgb(var(--tone-neutral-03,233 233 233))}@supports ((-moz-appearance:none)){.action-open-calendar{display:none}.inputs{-ms-flex-pack:var(--mds-input-date-range-fields-firefox-justify-content,start);justify-content:var(--mds-input-date-range-fields-firefox-justify-content,start);padding-right:calc(var(--spacing,.0025rem)*400)}}:host(:focus-within){--mds-input-date-range-icon-color:rgb(var(--variant-primary-05,152 188 255));--mds-input-date-range-variant-color-rgb:var(--variant-primary-04,184 208 255)}:host([variant=ai]){--mds-input-date-range-icon-color:rgb(var(--variant-ai-04,218 199 253));--mds-input-tip-background:rgb(var(--variant-ai-05,202 174 251));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=ai]:focus-within){--mds-input-date-range-icon-color:rgb(var(--variant-ai-05,202 174 251));--mds-input-date-range-variant-color-rgb:var(--variant-ai-04,218 199 253)}:host([variant=info]){--mds-input-date-range-icon-color:rgb(var(--status-info-04,159 216 241));--mds-input-tip-background:rgb(var(--status-info-05,112 198 234));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=info]:focus-within){--mds-input-date-range-icon-color:rgb(var(--status-info-05,112 198 234));--mds-input-date-range-variant-color-rgb:var(--status-info-04,159 216 241)}:host([variant=success]){--mds-input-date-range-icon-color:rgb(var(--status-success-04,158 222 181));--mds-input-tip-background:rgb(var(--status-success-05,107 206 147));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=success]:focus-within){--mds-input-date-range-icon-color:rgb(var(--status-success-05,107 206 147));--mds-input-date-range-variant-color-rgb:var(--status-success-04,158 222 181)}:host([variant=warning]){--mds-input-date-range-icon-color:rgb(var(--status-warning-04,255 200 33));--mds-input-tip-background:rgb(var(--status-warning-05,237 177 0));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=warning]:focus-within){--mds-input-date-range-icon-color:rgb(var(--status-warning-05,237 177 0));--mds-input-date-range-variant-color-rgb:var(--status-warning-04,255 200 33)}:host([variant=error]){--mds-input-date-range-icon-color:rgb(var(--status-error-04,254 193 189));--mds-input-tip-background:rgb(var(--status-error-05,250 165 160));--mds-input-date-range-variant-color-rgb:0 0 0}:host([variant=error]:focus-within){--mds-input-date-range-icon-color:rgb(var(--status-error-05,250 165 160));--mds-input-date-range-variant-color-rgb:var(--status-error-04,254 193 189)}@media (forced-colors:active){:host(:focus-within) .inputs{outline:2px solid #0000;outline-offset:2px}}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .input{transition-duration:0s}}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){--mds-input-date-range-ring:var(--shadow-outline-50);--mds-input-date-range-background:rgb(var(--tone-neutral-09,76 76 76));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-06,158 158 158))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .counter-button:hover{--mds-button-background:rgb(var(--tone-neutral-08,107 107 107))}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-input-date-range-ring:var(--shadow-outline-strong-50);--mds-input-date-range-background:rgb(var(--tone-neutral-09,76 76 76));--mds-input-date-range-controls-border:2px solid rgb(var(--tone-neutral-05,197 197 197))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))) .input::placeholder{color:rgb(var(--tone-neutral-03,233 233 233))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))) .input:-ms-placeholder-shown{color:rgb(var(--tone-neutral-03,233 233 233))}}'}},[321,"mds-input-date-range",{startDate:[513,"start-date"],endDate:[513,"end-date"],min:[513],max:[513],delay:[514],dualCalendar:[516,"dual-calendar"],name:[513],calendarKey:[32],internalStartDate:[32],internalEndDate:[32],visibleCalendarDate:[32],dropdownRef:[32],hasPreselection:[32],language:[32],updateLang:[64],preselect:[64]},void 0,{startDate:[{handleStartDateChange:0}],endDate:[{handleEndDateChange:0}]}]),k=w,D=function(){"undefined"!=typeof customElements&&["mds-input-date-range","mds-button","mds-calendar","mds-calendar-cell","mds-dropdown","mds-icon","mds-spinner","mds-text"].forEach((t=>{switch(t){case"mds-input-date-range":customElements.get(r(t))||customElements.define(r(t),w);break;case"mds-button":customElements.get(r(t))||c();break;case"mds-calendar":customElements.get(r(t))||d();break;case"mds-calendar-cell":customElements.get(r(t))||m();break;case"mds-dropdown":customElements.get(r(t))||u();break;case"mds-icon":customElements.get(r(t))||p();break;case"mds-spinner":customElements.get(r(t))||g();break;case"mds-text":customElements.get(r(t))||v()}}))};export{k as MdsInputDateRange,D as defineCustomElement}