@tet/tet-components 1.4.135-production → 1.4.135-testing

package/dist/cjs/tet-datepicker-header_4.cjs.entry.js

@@ -0,0 +1,387 @@
+'use strict';
+
+var index = require('./index-DKg1QTRW.js');
+var string = require('./string-D0kCSyUd.js');
+var typecheck = require('./typecheck--Bs-bZ_K.js');
+
+const DATEPICKER_WEEK_DAYS = ['P.', 'Ot.', 'Tr.', 'Ce.', 'Pk.', 'Se.', 'Sv.'];
+const DATEPICKER_MONTHS = [
+    'Janvāris',
+    'Februāris',
+    'Marts',
+    'Aprīlis',
+    'Maijs',
+    'Jūnijs',
+    'Jūlijs',
+    'Augusts',
+    'Septembris',
+    'Oktobris',
+    'Novembris',
+    'Decembris'
+];
+
+const subtractYears = (date, years) => {
+    date.setFullYear(date.getFullYear() - years);
+    return date;
+};
+const addYears = (date, years) => {
+    date.setFullYear(date.getFullYear() + years);
+    return date;
+};
+
+const tetDatepickerHeaderCss = () => `:host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:"\\e86e"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:"\\e85a"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:"\\e85b"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:"\\e86c"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:"\\e855"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:"\\e859"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:"\\e856"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:"\\e86a"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:"\\e81d"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:"\\e867"}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{display:block;-webkit-tap-highlight-color:transparent}.header{display:flex;justify-content:space-between;align-items:center;height:3rem;user-select:none}.header .control-button{padding:0.5rem 1rem;border-radius:1.5rem;cursor:pointer}.header .control-button .chevron-down{--icon-size:1.2rem;position:relative;top:-0.125rem;margin-left:0.5rem}.header .control-button:hover{background:var(--interaction-state-gray)}.header .icon-container{display:flex;justify-content:center;align-items:center;max-width:3rem;max-height:3rem;width:100%;height:100%;border-radius:1.5rem;cursor:pointer}.header .icon-container:hover{background:rgb(235, 237, 239)}.header .icon-container .arrow-right,.header .icon-container .arrow-left{--icon-size:1.2rem}`;
+
+const TetDatepickerHeader = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.internalDateChanged = index.createEvent(this, "internalDateChanged");
+        this.datepickerViewChanged = index.createEvent(this, "datepickerViewChanged");
+    }
+    /** The selected locale. */
+    locale;
+    /** The selected date. */
+    selectedDate;
+    /** Separate internal date to handle date browsing. */
+    internalDate;
+    /** Current datepicker view */
+    datepickerView;
+    /** Event that will be emitted when the internal date will change. */
+    internalDateChanged;
+    /** Event that will be emitted when the datepicker view will change. */
+    datepickerViewChanged;
+    getControlButtonDate = () => {
+        const fullYear = this.internalDate.getFullYear();
+        const monthNameFormatter = new Intl.DateTimeFormat(this.locale, { month: 'long' });
+        const monthName = string.capitalize(monthNameFormatter.format(this.internalDate));
+        return `${monthName} ${fullYear}`;
+    };
+    subtractDates() {
+        let newDate;
+        if (this.datepickerView === 'multi-year') {
+            newDate = subtractYears(this.internalDate, 12);
+        }
+        if (this.datepickerView === 'year') {
+            newDate = subtractYears(this.internalDate, 1);
+        }
+        if (this.datepickerView === 'month') {
+            newDate = new Date(this.internalDate.getFullYear(), this.internalDate.getMonth() - 1, 1);
+        }
+        this.internalDateChanged.emit(newDate);
+    }
+    addDates() {
+        let newDate;
+        if (this.datepickerView === 'multi-year') {
+            newDate = addYears(this.internalDate, 12);
+        }
+        if (this.datepickerView === 'year') {
+            newDate = addYears(this.internalDate, 1);
+        }
+        if (this.datepickerView === 'month') {
+            newDate = new Date(this.internalDate.getFullYear(), this.internalDate.getMonth() + 1, 1);
+        }
+        this.internalDateChanged.emit(newDate);
+    }
+    changeDatepickerView = () => {
+        let view;
+        if (this.datepickerView === 'month') {
+            view = 'multi-year';
+        }
+        if (this.datepickerView === 'year' || this.datepickerView === 'multi-year') {
+            view = 'month';
+        }
+        this.datepickerViewChanged.emit(view);
+    };
+    render() {
+        return (index.h("div", { key: 'f9ded7080afd62e27b776ea487a6dff3ff11849c', class: "header" }, this.datepickerView !== 'year'
+            ? (index.h("div", { class: "icon-container", onClick: () => this.subtractDates() }, index.h("tet-icon", { class: "arrow-left", name: "tc-arrow-left" })))
+            : index.h("div", null), index.h("div", { key: '0fc34633a46329e428c9449112a3a332363fba52', class: "control-button", onClick: () => this.changeDatepickerView() }, this.getControlButtonDate(), index.h("tet-icon", { key: '6854d7c2c577568425ecaf0faba756195461f506', class: "chevron-down", name: this.datepickerView === 'month' ? 'tc-chevron-down' : 'tc-chevron-up' })), this.datepickerView !== 'year'
+            ? (index.h("div", { class: "icon-container", onClick: () => this.addDates() }, index.h("tet-icon", { class: "arrow-left", name: "tc-arrow-right" })))
+            : index.h("div", null)));
+    }
+};
+TetDatepickerHeader.style = tetDatepickerHeaderCss();
+
+const tetDatepickerMonthViewCss = () => `:host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:"\\e86e"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:"\\e85a"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:"\\e85b"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:"\\e86c"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:"\\e855"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:"\\e859"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:"\\e856"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:"\\e86a"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:"\\e81d"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:"\\e867"}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{display:block;-webkit-tap-highlight-color:transparent}.weekday-header{display:grid;grid-template-columns:repeat(7, 1fr)}.weekday-header .day{display:flex;justify-content:center;align-items:center;height:100%;width:100%;aspect-ratio:1/1}.month-dates{display:grid;grid-template-columns:repeat(7, 1fr);row-gap:0.25rem;font:500 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif"}.month-dates .date-container{border:dashed transparent;border-width:0.09375rem 0}.month-dates .date-container.range-start{border-radius:5rem 0 0 5rem;border-color:rgb(10, 11, 13)}.month-dates .date-container.range-start .date{background:rgb(10, 11, 13);color:var(--text-color-primary-light) !important}.month-dates .date-container.range-start .date:hover{background:rgb(153, 160, 174) !important}.month-dates .date-container.range-start.in-range-selected{border-color:transparent}.month-dates .date-container.range-start.range-end{background:transparent}.month-dates .date-container.range-end{border-radius:0 5rem 5rem 0;border-color:rgb(10, 11, 13)}.month-dates .date-container.range-end .date{background:rgb(10, 11, 13);color:var(--text-color-primary-light) !important}.month-dates .date-container.range-end .date:hover{background:rgb(153, 160, 174) !important}.month-dates .date-container.range-end.in-range-selected{border-color:transparent}.month-dates .date-container.in-range{border-color:rgb(10, 11, 13)}.month-dates .date-container.in-range-selected{background:rgb(215, 219, 224)}.month-dates .date-container.in-range-selected .date{color:rgb(67, 75, 86)}.month-dates .date-container.in-range-hover{border-radius:0 5rem 5rem 0;border-color:rgb(10, 11, 13)}.month-dates .date-container.in-range-hover .date:hover{color:var(--text-color-primary-light);background:rgb(153, 160, 174) !important}.month-dates .preview-date{display:flex;justify-content:center;align-items:center;height:100%;width:100%;aspect-ratio:1/1;color:rgb(153, 160, 174)}.month-dates .date{display:flex;justify-content:center;align-items:center;height:100%;width:100%;aspect-ratio:1/1;border-radius:5rem;cursor:pointer}.month-dates .date.current:not(.month-dates .date.selected,.month-dates .date:active){border:0.09375rem solid rgb(153, 160, 174)}.month-dates .date:active,.month-dates .date.selected{color:var(--text-color-primary-light);background:rgb(10, 11, 13)}.month-dates .date:hover:not(.month-dates .date.selected,.month-dates .date:active){background:var(--interaction-state-gray)}`;
+
+const TetDatepickerMonthView = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.internalDateChanged = index.createEvent(this, "internalDateChanged");
+        this.dateChanged = index.createEvent(this, "dateChanged");
+        this.datepickerClosed = index.createEvent(this, "datepickerClosed");
+        this.rangeDateSet = index.createEvent(this, "rangeDateSet");
+    }
+    days = DATEPICKER_WEEK_DAYS;
+    currentDate;
+    previousMonthPreviewDates = [];
+    monthDates = [];
+    nextMonthPreviewDates = [];
+    /** The range dates that are being used for range picking mode. */
+    rangeDates;
+    /** Date used in range picker mode after setting range start to identify which date is currently hovered over. */
+    inRangeHoverDate;
+    /** The currently selected date. */
+    selectedDate;
+    /** Separate internal date to handle date browsing. */
+    internalDate;
+    /** Determines whether the current datepicker logic is set up for range picking. */
+    rangePickerMode = false;
+    /** Event that will be emitted when the internal date will change. */
+    internalDateChanged;
+    /** Event that will be emitted when date will change. */
+    dateChanged;
+    /** Event that will be emitted when the datepicker will be closed. */
+    datepickerClosed;
+    /** Event that will be emitted when one of the range dates will be set. */
+    rangeDateSet;
+    handleDateChange() {
+        this.previousMonthPreviewDates = this.getPreviousMonthPreviewDates();
+        this.monthDates = this.getDaysInMonth(this.internalDate.getMonth(), this.internalDate.getFullYear());
+        this.nextMonthPreviewDates = this.getNextMonthPreviewDates();
+    }
+    componentWillLoad() {
+        this.currentDate = new Date();
+        this.previousMonthPreviewDates = this.getPreviousMonthPreviewDates();
+        this.monthDates = this.getDaysInMonth(this.internalDate.getMonth(), this.internalDate.getFullYear());
+        this.nextMonthPreviewDates = this.getNextMonthPreviewDates();
+    }
+    getDaysInMonth = (month, year) => {
+        const date = new Date(year, month, 1);
+        const days = [];
+        while (date.getMonth() === month) {
+            days.push(new Date(date));
+            date.setDate(date.getDate() + 1);
+        }
+        return days;
+    };
+    getPreviousMonthPreviewDates = () => {
+        const firstMonthDay = new Date(this.internalDate.getFullYear(), this.internalDate.getMonth(), 1);
+        let previousMonthPreviewDays = firstMonthDay.getDay() - 1;
+        // An exception - sundays have zero index.
+        // Meaning that they actually would have negative preview days from the previous month, if using the existing logic.
+        if (previousMonthPreviewDays === -1) {
+            previousMonthPreviewDays = 6;
+        }
+        return this.getPreviousMonthLastDates(previousMonthPreviewDays);
+    };
+    getNextMonthPreviewDates = () => {
+        const currentDateCount = this.monthDates.length + this.previousMonthPreviewDates.length;
+        const nextMonthPreviewDays = 7 - currentDateCount % 7;
+        // If all rows are full, do not render additional preview date fields.
+        if (nextMonthPreviewDays === 7) {
+            return [];
+        }
+        return Array.from({ length: nextMonthPreviewDays }).map((_, day) => day + 1);
+    };
+    getPreviousMonthLastDates = (lastDays) => {
+        const previousMonthPreviewDays = [];
+        if (!lastDays) {
+            return previousMonthPreviewDays;
+        }
+        const previousMonthLastDate = new Date(this.internalDate.getFullYear(), this.internalDate.getMonth(), 0);
+        const previousMonthLastPreviewDay = (previousMonthLastDate.getDate() - lastDays) + 1;
+        Array.from({ length: lastDays }).forEach((_, days) => {
+            const previousMonth = this.internalDate.getMonth() - 1;
+            const date = new Date(this.internalDate.getFullYear(), previousMonth, previousMonthLastPreviewDay + days);
+            previousMonthPreviewDays.push(date);
+        });
+        return previousMonthPreviewDays;
+    };
+    isCurrentDate(date) {
+        return date.toDateString() === this.currentDate.toDateString();
+    }
+    isSelectedDate = (date) => {
+        if (this.rangePickerMode || typecheck.isUndefinedOrNull(this.selectedDate)) {
+            return false;
+        }
+        return date.toDateString() === this.selectedDate.toDateString();
+    };
+    handleDateSelection = (date) => {
+        const newDate = new Date(date);
+        this.internalDateChanged.emit(newDate);
+        if (!this.rangePickerMode) {
+            this.datepickerClosed.emit(true);
+            return;
+        }
+        const isSelectedDateRangeEnd = this.isRangeEnd(date);
+        const isSelectedBeforeRangeStartDate = date.getTime() < this.rangeDates?.startDate?.getTime();
+        if (this.rangeDates.startDate && this.rangeDates.endDate || isSelectedBeforeRangeStartDate) {
+            this.rangeDateSet.emit({ date: newDate, position: 0 });
+            return;
+        }
+        if (this.rangeDates.startDate && !isSelectedDateRangeEnd) {
+            this.rangeDateSet.emit({ date: newDate, position: 1 });
+            this.datepickerClosed.emit(true);
+        }
+        if (typecheck.isUndefinedOrNull(this.rangeDates.startDate) && typecheck.isUndefinedOrNull(this.rangeDates.endDate)) {
+            this.rangeDateSet.emit({ date: newDate, position: 0 });
+        }
+    };
+    isRangeStart = (date) => {
+        return date.toDateString() === this.rangeDates?.startDate?.toDateString();
+    };
+    isRangeEnd = (date) => {
+        return date.toDateString() === this.rangeDates?.endDate?.toDateString();
+    };
+    isSelectedInRange = (date) => {
+        const isDateInStartRange = date.getTime() >= this.rangeDates?.startDate?.getTime();
+        const isDateInEndRange = date.getTime() <= this.rangeDates?.endDate?.getTime();
+        return isDateInStartRange && isDateInEndRange;
+    };
+    isInRange = (date) => {
+        const isRangeStartAndEndSet = this.rangeDates.startDate && this.rangeDates.endDate;
+        if (!this.rangePickerMode || typecheck.isUndefinedOrNull(this.rangeDates.startDate) || isRangeStartAndEndSet) {
+            return false;
+        }
+        const isDatePastRangeStart = date.getTime() > this.rangeDates?.startDate?.getTime();
+        const isDateInHoverRange = date.getTime() <= this.inRangeHoverDate?.getTime();
+        return isDatePastRangeStart && isDateInHoverRange;
+    };
+    setInRangeHover = (date, event) => {
+        const isRangeStartAndEndSet = this.rangeDates.startDate && this.rangeDates.endDate;
+        if (!this.rangePickerMode || typecheck.isUndefinedOrNull(this.rangeDates.startDate) || isRangeStartAndEndSet) {
+            return;
+        }
+        const element = event.target;
+        const isDatePastRangeStart = date.getTime() > this.rangeDates?.startDate?.getTime();
+        if (isDatePastRangeStart) {
+            element.classList.add('in-range-hover');
+            this.inRangeHoverDate = date;
+        }
+    };
+    removeInRangeHover = (event) => {
+        const element = event.target;
+        element.classList.contains('in-range-hover') && element.classList.remove('in-range-hover');
+        this.inRangeHoverDate = null;
+    };
+    getDateContainerClasses = (date) => {
+        return {
+            'date-container': true,
+            'range-start': this.isRangeStart(date),
+            'in-range': this.isInRange(date),
+            'in-range-selected': this.isSelectedInRange(date),
+            'range-end': this.isRangeEnd(date)
+        };
+    };
+    getDateClasses = (date) => {
+        return {
+            date: true,
+            current: this.isCurrentDate(date),
+            selected: this.isSelectedDate(date)
+        };
+    };
+    render() {
+        return (index.h(index.Host, { key: 'e3e7369a51d97d88d28a66545848f915902c239b' }, index.h("div", { key: '79fd22e0542d4bb1d3dca9a027a38732568adf1e', class: "weekday-header" }, this.days.map((day) => index.h("div", { class: "day" }, day))), index.h("div", { key: '417e6eee4ff8505998ecd432a9607010057d748e', class: "month-dates" }, this.previousMonthPreviewDates.map((date) => index.h("div", { class: "date-container" }, index.h("div", { class: "preview-date" }, date.getDate()))), this.monthDates.map(date => index.h("div", { class: this.getDateContainerClasses(date), onPointerEnter: (event) => this.setInRangeHover(date, event), onPointerLeave: (event) => this.removeInRangeHover(event) }, index.h("div", { class: this.getDateClasses(date), onClick: () => this.handleDateSelection(date) }, date.getDate()))), this.nextMonthPreviewDates.map((date) => index.h("div", { class: "date-container" }, index.h("div", { class: "preview-date" }, date))))));
+    }
+    static get watchers() { return {
+        "internalDate": [{
+                "handleDateChange": 0
+            }]
+    }; }
+};
+TetDatepickerMonthView.style = tetDatepickerMonthViewCss();
+
+const tetDatepickerMultiYearViewCss = () => `:host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:"\\e86e"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:"\\e85a"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:"\\e85b"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:"\\e86c"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:"\\e855"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:"\\e859"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:"\\e856"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:"\\e86a"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:"\\e81d"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:"\\e867"}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{display:block;-webkit-tap-highlight-color:transparent}.container{display:grid;grid-template-columns:repeat(3, 1fr);row-gap:2rem;column-gap:0.25rem;margin:1.25rem 0 0.75rem;font:500 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif"}.container .year{display:flex;width:100%;height:2.875rem;align-items:center;justify-content:center;border-radius:1.5rem;cursor:pointer}.container .year.current:not(.container .year.selected,.container .year:active){border:0.09375rem solid rgb(153, 160, 174)}.container .year:active,.container .year.selected{color:var(--text-color-primary-light);background:rgb(10, 11, 13)}.container .year:hover:not(.container .year.selected,.container .year:active){background:var(--interaction-state-gray)}`;
+
+const TetDatepickerMultiYearView = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.internalDateChanged = index.createEvent(this, "internalDateChanged");
+        this.datepickerViewChanged = index.createEvent(this, "datepickerViewChanged");
+    }
+    years = [];
+    /** Selected Date. */
+    selectedDate;
+    /** Internal Date. */
+    internalDate;
+    /** Internal date changed event. */
+    internalDateChanged;
+    /** Datepicker view changed event. */
+    datepickerViewChanged;
+    handleInternalDateChange(date) {
+        this.years = this.getYears(date);
+    }
+    componentWillLoad() {
+        this.years = this.getYears(this.internalDate);
+    }
+    getYears = (date) => {
+        const startYear = date.getFullYear();
+        return Array.from({ length: 12 }, (_, index) => startYear + index);
+    };
+    handleYearSelection = (year) => {
+        const newDate = new Date(this.internalDate.setFullYear(year));
+        this.internalDateChanged.emit(newDate);
+        this.datepickerViewChanged.emit('year');
+    };
+    isSelectedYear = (year) => {
+        return this.selectedDate?.getFullYear() === year;
+    };
+    getYearClasses = (year) => {
+        const currentYear = new Date().getFullYear();
+        return { year: true, current: year === currentYear, selected: this.isSelectedYear(year) };
+    };
+    render() {
+        return (index.h("div", { key: '03c2b00f5549cbd3e500c0063152d3861f74ff2c', class: "container" }, this.years.map((year) => index.h("div", { class: this.getYearClasses(year), onClick: () => this.handleYearSelection(year) }, year))));
+    }
+    static get watchers() { return {
+        "internalDate": [{
+                "handleInternalDateChange": 0
+            }]
+    }; }
+};
+TetDatepickerMultiYearView.style = tetDatepickerMultiYearViewCss();
+
+const tetDatepickerYearViewCss = () => `:host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:"\\e86e"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:"\\e85a"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:"\\e85b"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:"\\e86c"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:"\\e855"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:"\\e859"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:"\\e856"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:"\\e86a"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:"\\e81d"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:"\\e867"}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{display:block;-webkit-tap-highlight-color:transparent}.container{display:grid;grid-template-columns:repeat(3, 1fr);row-gap:2rem;column-gap:0.25rem;margin:1.25rem 0.5rem 0.75rem 0;font:500 0.875rem/1.25rem "Inter", "Gilroy, Arial, sans-serif"}.container .month{display:flex;width:100%;height:2.875rem;align-items:center;justify-content:center;border-radius:1.5rem;cursor:pointer}.container .month.current:not(.container .month.selected,.container .month:active){border:0.09375rem solid rgb(153, 160, 174)}.container .month:active,.container .month.selected{color:var(--text-color-primary-light);background:rgb(10, 11, 13)}.container .month:hover:not(.container .month.selected,.container .month:active){background:var(--interaction-state-gray)}`;
+
+const TetDatepickerYearView = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.internalDateChanged = index.createEvent(this, "internalDateChanged");
+        this.datepickerViewChanged = index.createEvent(this, "datepickerViewChanged");
+    }
+    months = DATEPICKER_MONTHS;
+    todayDate;
+    /** The selected date. */
+    selectedDate;
+    /** Separate internal date to handle date browsing. */
+    internalDate;
+    /** Event that will be emitted when the internal date will change. */
+    internalDateChanged;
+    /** Event that will be emitted when the datepicker view will change. */
+    datepickerViewChanged;
+    componentWillLoad() {
+        this.todayDate = new Date();
+    }
+    isCurrentMonth(monthIndex) {
+        return this.todayDate.getMonth() === monthIndex;
+    }
+    handleMonthSelection = (monthIndex) => {
+        const newDate = new Date(this.internalDate.setMonth(monthIndex));
+        this.internalDateChanged.emit(newDate);
+        this.datepickerViewChanged.emit('month');
+    };
+    isMonthSelected = (monthIndex) => {
+        if (typecheck.isUndefinedOrNull(this.selectedDate)) {
+            return false;
+        }
+        const isSameYear = this.selectedDate.getFullYear() === this.internalDate.getFullYear();
+        const isSameMonth = this.selectedDate.getMonth() === monthIndex;
+        return isSameYear && isSameMonth;
+    };
+    getMonthClasses = (monthIndex) => {
+        return {
+            month: true,
+            current: this.isCurrentMonth(monthIndex),
+            selected: this.isMonthSelected(monthIndex)
+        };
+    };
+    render() {
+        return (index.h("div", { key: '8968d573ef922b5ae1e1fc5e3f3bede1cca24fc3', class: "container" }, this.months.map((month, index$1) => index.h("div", { class: "month-container" }, index.h("div", { class: this.getMonthClasses(index$1), onClick: () => this.handleMonthSelection(index$1) }, month)))));
+    }
+};
+TetDatepickerYearView.style = tetDatepickerYearViewCss();
+
+exports.tet_datepicker_header = TetDatepickerHeader;
+exports.tet_datepicker_month_view = TetDatepickerMonthView;
+exports.tet_datepicker_multi_year_view = TetDatepickerMultiYearView;
+exports.tet_datepicker_year_view = TetDatepickerYearView;

package/dist/cjs/tet-datepicker.cjs.entry.js

@@ -0,0 +1,132 @@
+'use strict';
+
+var index = require('./index-DKg1QTRW.js');
+var typecheck = require('./typecheck--Bs-bZ_K.js');
+
+const tetDatepickerCss = () => `:host{box-sizing:border-box}*,*:before,*:after{box-sizing:inherit;padding:0;margin:0}:host{--color-gray-light:#cdd2de;--color-ta070:#f5f6f8;--color-ta080:#e6e8ee;--color-ta100:#cdd2de;--color-ta200:#9ba5be;--color-ta300:#69789c;--color-ta500:#1e356a;--color-ta600:#051d59;--color-tc090:#d6e6fd;--color-tc100:#d1dffe;--color-tc300:#75a1fb;--color-tc500:#1a70f6;--color-tc600:#0060f5;--color-td500:#00F1F2;--color-td600:#01cbe0;--color-tf600:#f53b2a;--color-tg300:#2b3036;--color-tg400:#1d2128;--color-tg500:#12171e;--color-tg600:#01050c;--color-th500:#f5f5f5;--color-ti500:#869198;--color-ti600:#aeb7bc;--text-font:Gilroy, serif;--text-color-darker:var(--color-ta600);--text-color-dark:var(--color-ta500);--text-color-dark-theme:var(--color-th500);--icons-font:Tet Icons, serif}.icon.tet-search{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-search::before{content:"\\e86e"}.icon.tet-close-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close-circled::before{content:"\\e85a"}.icon.tet-close{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-close::before{content:"\\e85b"}.icon.tet-check-circled{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check-circled::before{content:"\\e86c"}.icon.tet-check{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-check::before{content:"\\e855"}.icon.tet-chevron-up{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-up::before{content:"\\e859"}.icon.tet-chevron-down{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-chevron-down::before{content:"\\e856"}.icon.tet-clipboard{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-clipboard::before{content:"\\e86a"}.icon.tet-info{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-info::before{content:"\\e81d"}.icon.tet-done{font-family:var(--icons-font);font-weight:400;font-style:normal;font-size:1.25rem;display:inline-block;line-height:1;text-transform:none;letter-spacing:normal;word-wrap:normal;white-space:nowrap;direction:ltr;speak:none;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale}.icon.tet-done::before{content:"\\e867"}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Gilroy-W05-Medium.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Medium.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Gilroy-W05-Semibold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Semibold.woff") format("woff")}@font-face{font-family:"Gilroy";font-style:normal;font-weight:700;font-display:swap;src:url("assets/fonts/Gilroy-W05-Bold.woff2") format("woff2"), url("assets/fonts/Gilroy-W05-Bold.woff") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("assets/fonts/Inter-Regular.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Regular.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("assets/fonts/Inter-Medium.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-Medium.woff?v=3.19") format("woff")}@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("assets/fonts/Inter-SemiBold.woff2?v=3.19") format("woff2"), url("assets/fonts/Inter-SemiBold.woff?v=3.19") format("woff")}:host{--font-family-fallback:Gilroy, Arial, sans-serif;--font-family-headline:Gilroy;--font-family-content:Inter, var(--font-family-fallback);font-family:var(--font-family-content)}:host{display:block;--light-theme-elevation-3:0 0.0625rem 0.125rem rgba(10, 11, 13, 0.05), 0 0.3125rem 0.6875rem rgba(10, 11, 13, 0.12);--text-color-primary-light:#f6f7f8;--interaction-state-gray:rgba(89, 99, 115, 0.08)}.overlay{position:fixed;z-index:100;inset:0}.overlay-effect{background:rgba(10, 11, 13, 0.4)}.overlay.closed{display:none}.overlay .container{max-width:22rem;min-height:20rem;height:auto;width:100%;background:rgb(255, 255, 255);border:0.0625rem solid rgb(192, 197, 206);box-shadow:var(--light-theme-elevation-3);border-radius:0.875rem;padding:0.5rem;position:absolute}`;
+
+const TetDatepicker = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.dateChanged = index.createEvent(this, "dateChanged");
+        this.rangeDatesChanged = index.createEvent(this, "rangeDatesChanged");
+    }
+    datepickerContainer;
+    get el() { return index.getElement(this); }
+    /** The locale that is being used in to format the control button text. */
+    locale = 'lv-LV';
+    /** Determines whether to display modal like overlay for the datepicker. */
+    overlayEffect = false;
+    /** Determines whether the current datepicker logic is set up for range picking. */
+    rangePickerMode = false;
+    /** Determines if the datepicker is open. */
+    isOpen = false;
+    /** The currently selected date. Initially, can be passed as a default date. */
+    date;
+    /** Current datepicker view. */
+    datepickerView = 'month';
+    /** Range dates that are being used when `rangePickerMode` is turned on. */
+    rangeDates = {};
+    /** Separate internal date to handle date browsing. (to not emit event on date browsing but only on date selection) */
+    internalDate;
+    /** Event that will be emitted when date will change. */
+    dateChanged;
+    /** Event that will be emitted when at least one of the range dates will change. */
+    rangeDatesChanged;
+    handleDateChanged(event) {
+        this.date = event.detail;
+    }
+    /** Toggles the datepicker `isOpen` attribute. */
+    async toggleIsOpen() {
+        this.isOpen = !this.isOpen;
+    }
+    handleDatepickerViewChanged(event) {
+        this.datepickerView = event.detail;
+    }
+    handleInternalDateChanged({ detail }) {
+        this.internalDate = new Date(detail);
+    }
+    handleRangeDateSet({ detail: { date, position } }) {
+        if (position === 0) {
+            this.rangeDates.startDate = new Date(date);
+            this.rangeDates.endDate = null;
+        }
+        else {
+            this.rangeDates.endDate = new Date(date);
+        }
+        this.rangeDates = { ...this.rangeDates };
+    }
+    handleDatepickerClosed() {
+        if (!this.rangePickerMode) {
+            this.date = new Date(this.internalDate);
+        }
+        this.isOpen = false;
+    }
+    onWindowResize() {
+        this.positionDatepicker();
+    }
+    onWindowScroll() {
+        this.positionDatepicker();
+    }
+    componentWillLoad() {
+        if (typecheck.isUndefinedOrNull(this.date)) {
+            this.internalDate = new Date();
+            return;
+        }
+        this.date = new Date(this.date);
+        this.internalDate = new Date(this.date);
+    }
+    componentDidLoad() {
+        this.positionDatepicker();
+    }
+    handleDateChange(newDate) {
+        this.dateChanged.emit(newDate);
+    }
+    handleRangeDateChange(newDates) {
+        this.rangeDatesChanged.emit(newDates);
+    }
+    isMobileScreenSize = () => {
+        return window.innerWidth <= 499;
+    };
+    positionDatepicker = () => {
+        const boundElementPosition = this.el.previousElementSibling.getBoundingClientRect();
+        const mobileDatepickerWidth = `${boundElementPosition.width}px`;
+        const desktopDatepickerWidth = '22rem';
+        const topOffsetInPx = 8;
+        if (this.isMobileScreenSize()) {
+            this.datepickerContainer.style.maxWidth = mobileDatepickerWidth;
+        }
+        else {
+            this.datepickerContainer.style.maxWidth = desktopDatepickerWidth;
+        }
+        this.datepickerContainer.style.left = `${boundElementPosition.left}px`;
+        this.datepickerContainer.style.top = `${boundElementPosition.bottom + topOffsetInPx}px`;
+    };
+    handleDatepickerClose = (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        if (event.target === event.currentTarget) {
+            this.isOpen = false;
+        }
+    };
+    getOverlayClasses = () => {
+        return { overlay: true, closed: !this.isOpen, 'overlay-effect': this.overlayEffect };
+    };
+    render() {
+        return (index.h("div", { key: 'acce2fbc7d54bbcdb4410581d9f6bc6667aa0d2c', class: this.getOverlayClasses(), onClick: this.handleDatepickerClose }, index.h("div", { key: '0c8d388af9d7cbe8b3d3ec303217b10e52a91ffd', class: "container", ref: (el) => this.datepickerContainer = el }, index.h("tet-datepicker-header", { key: '4cefe3b29bead3c72a9c7342aa1a278767cf87b9', selectedDate: this.date, internalDate: this.internalDate, locale: this.locale, datepickerView: this.datepickerView }), this.datepickerView === 'month' &&
+            index.h("tet-datepicker-month-view", { key: 'a2a8a1e040d283ec54b7fb479ba907ff028f16bc', selectedDate: this.date, internalDate: this.internalDate, rangePickerMode: this.rangePickerMode, rangeDates: this.rangeDates }), this.datepickerView === 'multi-year' &&
+            index.h("tet-datepicker-multi-year-view", { key: '6af036908892b25750daa38f166026c30ca09b6d', selectedDate: this.date, internalDate: this.internalDate }), this.datepickerView === 'year' &&
+            index.h("tet-datepicker-year-view", { key: 'ab893a06d2e225a287be0d96ca068443c897396e', selectedDate: this.date, internalDate: this.internalDate }))));
+    }
+    static get watchers() { return {
+        "date": [{
+                "handleDateChange": 0
+            }],
+        "rangeDates": [{
+                "handleRangeDateChange": 0
+            }]
+    }; }
+};
+TetDatepicker.style = tetDatepickerCss();
+
+exports.tet_datepicker = TetDatepicker;