@rededor/cura 1.1.0 → 1.2.0-alpha.0

package/dist/esm/cura-calendar.entry.js

@@ -1,14 +1,5 @@
-import { r as registerInstance, c as createEvent, h, H as Host } from './index-1ad98520.js';
-
-function _typeof(o) {
-  "@babel/helpers - typeof";
-
-  return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) {
-    return typeof o;
-  } : function (o) {
-    return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o;
-  }, _typeof(o);
-}
+import { r as registerInstance, c as createEvent, h, H as Host } from './index-747aad85.js';
+import { r as requiredArgs, t as toDate, _ as _typeof, i as isBefore, a as isAfter } from './index-fbee309a.js';
 
 function toInteger(dirtyNumber) {
   if (dirtyNumber === null || dirtyNumber === true || dirtyNumber === false) {
@@ -21,63 +12,6 @@ function toInteger(dirtyNumber) {
   return number < 0 ? Math.ceil(number) : Math.floor(number);
 }
 
-function requiredArgs(required, args) {
-  if (args.length < required) {
-    throw new TypeError(required + ' argument' + (required > 1 ? 's' : '') + ' required, but only ' + args.length + ' present');
-  }
-}
-
-/**
- * @name toDate
- * @category Common Helpers
- * @summary Convert the given argument to an instance of Date.
- *
- * @description
- * Convert the given argument to an instance of Date.
- *
- * If the argument is an instance of Date, the function returns its clone.
- *
- * If the argument is a number, it is treated as a timestamp.
- *
- * If the argument is none of the above, the function returns Invalid Date.
- *
- * **Note**: *all* Date arguments passed to any *date-fns* function is processed by `toDate`.
- *
- * @param {Date|Number} argument - the value to convert
- * @returns {Date} the parsed date in the local time zone
- * @throws {TypeError} 1 argument required
- *
- * @example
- * // Clone the date:
- * const result = toDate(new Date(2014, 1, 11, 11, 30, 30))
- * //=> Tue Feb 11 2014 11:30:30
- *
- * @example
- * // Convert the timestamp to date:
- * const result = toDate(1392098430000)
- * //=> Tue Feb 11 2014 11:30:30
- */
-function toDate(argument) {
-  requiredArgs(1, arguments);
-  var argStr = Object.prototype.toString.call(argument);
-
-  // Clone the date
-  if (argument instanceof Date || _typeof(argument) === 'object' && argStr === '[object Date]') {
-    // Prevent the date to lose the milliseconds when passed to new Date() in IE10
-    return new Date(argument.getTime());
-  } else if (typeof argument === 'number' || argStr === '[object Number]') {
-    return new Date(argument);
-  } else {
-    if ((typeof argument === 'string' || argStr === '[object String]') && typeof console !== 'undefined') {
-      // eslint-disable-next-line no-console
-      console.warn("Starting with v2.0.0-beta.1 date-fns doesn't accept strings as date arguments. Please use `parseISO` to parse strings. See: https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#string-arguments");
-      // eslint-disable-next-line no-console
-      console.warn(new Error().stack);
-    }
-    return new Date(NaN);
-  }
-}
-
 /**
  * @name addDays
  * @category Day Helpers
@@ -2750,56 +2684,6 @@ function getYear(dirtyDate) {
   return toDate(dirtyDate).getFullYear();
 }
 
-/**
- * @name isAfter
- * @category Common Helpers
- * @summary Is the first date after the second one?
- *
- * @description
- * Is the first date after the second one?
- *
- * @param {Date|Number} date - the date that should be after the other one to return true
- * @param {Date|Number} dateToCompare - the date to compare with
- * @returns {Boolean} the first date is after the second date
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // Is 10 July 1989 after 11 February 1987?
- * const result = isAfter(new Date(1989, 6, 10), new Date(1987, 1, 11))
- * //=> true
- */
-function isAfter(dirtyDate, dirtyDateToCompare) {
-  requiredArgs(2, arguments);
-  var date = toDate(dirtyDate);
-  var dateToCompare = toDate(dirtyDateToCompare);
-  return date.getTime() > dateToCompare.getTime();
-}
-
-/**
- * @name isBefore
- * @category Common Helpers
- * @summary Is the first date before the second one?
- *
- * @description
- * Is the first date before the second one?
- *
- * @param {Date|Number} date - the date that should be before the other one to return true
- * @param {Date|Number} dateToCompare - the date to compare with
- * @returns {Boolean} the first date is before the second date
- * @throws {TypeError} 2 arguments required
- *
- * @example
- * // Is 10 July 1989 before 11 February 1987?
- * const result = isBefore(new Date(1989, 6, 10), new Date(1987, 1, 11))
- * //=> false
- */
-function isBefore(dirtyDate, dirtyDateToCompare) {
-  requiredArgs(2, arguments);
-  var date = toDate(dirtyDate);
-  var dateToCompare = toDate(dirtyDateToCompare);
-  return date.getTime() < dateToCompare.getTime();
-}
-
 /**
  * @name isToday
  * @category Day Helpers
@@ -3563,7 +3447,7 @@ var locale = {
 };
 const ptBR = locale;
 
-const curaCalendarCss = ":host{display:block;width:var(--width)}:host .calendar{display:flex;flex-direction:column;gap:5px;width:var(--width);min-width:268px;border-radius:4px;overflow:hidden;background:#fff;font-family:var(--font-family)}:host .calendar.embedded{border:2px solid var(--neutral-light);padding:0px 12px 12px 12px}:host .calendar.floating{box-shadow:0 4px 8px var(--neutral-light)}:host .header{position:relative;padding:12px 0}:host .header::after{content:\"\";position:absolute;bottom:0;left:2px;right:2px;border-bottom:2px dotted var(--neutral-light)}:host .month-year{display:flex;padding:12px 8px;justify-content:space-between;align-self:stretch}:host .month-year.dropdown{padding:0%}:host .select{display:flex;padding:7px 10px 0px;justify-content:center;align-items:center;gap:6px;flex:1 0 0}:host .drop-month{display:flex;max-width:118px;padding:0px;align-items:flex-start;gap:0px;flex:1 0 0}:host .drop-year{display:flex;min-width:80px;max-width:85px;padding:0px;align-items:flex-start;gap:0px;flex:1 0 0}:host .days-of-week{display:flex;height:30px;padding:4px;justify-content:center;align-items:center;gap:4px;flex-shrink:0}:host .day{flex:1;text-align:center}:host .dates{display:flex;flex-wrap:wrap;align-items:center;align-self:stretch;gap:0}:host .icon{cursor:pointer;position:relative;overflow:hidden;border-radius:50%}:host .icon.dropdown{margin-top:10px}:host .icon::before{content:\"\";position:absolute;border-radius:50%;top:50%;left:50%;width:20px;height:20px;background:var(--accent-base);transform:translate(-50%, -50%) scale(0);transition:transform 0.2s ease}:host .icon:active::before{transform:translate(-50%, -50%) scale(1)}:host .icon:active{transform:scale(1)}:host .collapsed-container{text-align:center;position:relative;display:flex;align-items:center;justify-content:center;padding-top:10px}:host .collapsed-container::before{content:\"\";position:absolute;bottom:0;top:0;left:2px;right:2px;border-top:2px dotted var(--neutral-light)}:host .date{display:flex;justify-content:center;align-items:center;height:auto;width:14.2857142857%;aspect-ratio:1;font-size:14px;cursor:pointer;position:relative;box-sizing:border-box;text-align:center;flex-shrink:0}:host .date.today{border:2px solid var(--primary-darker);border-radius:50%;color:var(--primary-darker)}:host .date.selected,:host .date.default-dates{color:var(--neutral-black) !important;background:var(--accent-base);border-radius:50%;border:none}:host .date.invalid{color:var(--neutral-dark) !important;cursor:not-allowed}:host .date.invalid:hover{background:none;box-shadow:none}:host .date.valid{color:var(--primary-darker);font-weight:var(--font-weight-bold)}:host .date.range.start{border-radius:50% 0 0 50%;color:var(--primary-darker) !important;background:var(--accent-base)}:host .date.range.interval{border-radius:0;background-color:var(--accent-light);color:var(--neutral-black)}:host .date.range.interval.today{border:none}:host .date.range.end{border-radius:0 50% 50% 0;color:var(--primary-darker) !important;background:var(--accent-base)}:host .date:hover{background:var(--accent-light);border-radius:50%;color:var(--neutral-black)}:host select,:host input{width:60px;font-size:16px;box-shadow:0 2px 2px var(--neutral-black);padding:5px;border-radius:4px;border:1px solid #ccc;background:#f7f7f7}.teste{width:100%}";
+const curaCalendarCss = ":host{display:block;width:var(--width);max-width:400px;margin:0 auto}:host .calendar{display:flex;flex-direction:column;gap:5px;width:var(--width);min-width:268px;border-radius:4px;overflow:hidden;background:#fff;font-family:var(--font-family)}:host .calendar.embedded{border:2px solid var(--neutral-light);padding:0px 12px 12px 12px}:host .calendar.floating{box-shadow:0 4px 8px var(--neutral-light)}:host .header{position:relative;padding:12px 0}:host .header::after{content:\"\";position:absolute;bottom:0;left:2px;right:2px;border-bottom:2px dotted var(--neutral-light)}:host .month-year{display:flex;padding:12px 8px;justify-content:space-between;align-self:stretch}:host .month-year.dropdown{padding:0%}:host .select{display:flex;padding:7px 10px 0px;justify-content:center;align-items:center;gap:6px;flex:1 0 0}:host .drop-month{display:flex;max-width:118px;padding:0px;align-items:flex-start;gap:0px;flex:1 0 0}:host .drop-year{display:flex;min-width:80px;max-width:85px;padding:0px;align-items:flex-start;gap:0px;flex:1 0 0}:host .days-of-week{display:flex;height:30px;padding:4px;justify-content:center;align-items:center;gap:4px;flex-shrink:0}:host .day{flex:1;text-align:center}:host .dates{display:flex;flex-wrap:wrap;align-items:center;align-self:stretch;gap:0}:host .icon{cursor:pointer;position:relative;overflow:hidden;border-radius:50%}:host .icon.dropdown{margin-top:10px}:host .icon::before{content:\"\";position:absolute;border-radius:50%;top:50%;left:50%;width:20px;height:20px;background:var(--accent-base);transform:translate(-50%, -50%) scale(0);transition:transform 0.2s ease}:host .icon:active::before{transform:translate(-50%, -50%) scale(1)}:host .icon:active{transform:scale(1)}:host .collapsed-container{text-align:center;position:relative;display:flex;align-items:center;justify-content:center;padding-top:10px}:host .collapsed-container::before{content:\"\";position:absolute;bottom:0;top:0;left:2px;right:2px;border-top:2px dotted var(--neutral-light)}:host .date{display:flex;justify-content:center;align-items:center;height:auto;width:14.2857142857%;aspect-ratio:1;font-size:14px;cursor:pointer;position:relative;box-sizing:border-box;text-align:center;flex-shrink:0}:host .date.today{border:2px solid var(--primary-darker);border-radius:50%;color:var(--primary-darker)}:host .date.selected,:host .date.default-dates{color:var(--neutral-black) !important;background:var(--accent-base);border-radius:50%;border:none}:host .date.invalid{color:var(--neutral-dark) !important;cursor:not-allowed}:host .date.invalid:hover{background:none;box-shadow:none}:host .date.valid{color:var(--primary-darker);font-weight:var(--font-weight-bold)}:host .date.range.start{border-radius:50% 0 0 50%;color:var(--primary-darker) !important;background:var(--accent-base)}:host .date.range.interval{border-radius:0;background-color:var(--accent-light);color:var(--neutral-black)}:host .date.range.interval.today{border:none}:host .date.range.end{border-radius:0 50% 50% 0;color:var(--primary-darker) !important;background:var(--accent-base)}:host .date:hover{background:var(--accent-light);border-radius:50%;color:var(--neutral-black)}:host select,:host input{width:60px;font-size:16px;box-shadow:0 2px 2px var(--neutral-black);padding:5px;border-radius:4px;border:1px solid #ccc;background:#f7f7f7}.teste{width:100%}";
 const CuraCalendarStyle0 = curaCalendarCss;
 
 const CuraCalendar = class {
@@ -3582,6 +3466,7 @@ const CuraCalendar = class {
         this.disable = [];
         this.enable = [];
         this.defaultDate = [];
+        this.customDates = [];
         this.limitRange = null;
         this.disablePassDates = undefined;
         this.disableFutureDates = undefined;
@@ -3597,7 +3482,6 @@ const CuraCalendar = class {
         this.styles = {};
     }
     connectedCallback() {
-        this.initializeDefaultDates();
         this.setFontProperties();
         const colors = [
             { name: '--accent-base', theme: 'accent-base' },
@@ -3607,7 +3491,7 @@ const CuraCalendar = class {
             { name: '--neutral-dark', theme: 'neutral-dark' },
             { name: '--neutral-light', theme: 'neutral-light' },
         ];
-        colors.forEach(color => this.styles = Object.assign(Object.assign({}, this.styles), { [color.name]: this.theme.colors.getColor(color.theme) }));
+        colors.forEach(color => (this.styles = Object.assign(Object.assign({}, this.styles), { [color.name]: this.theme.colors.getColor(color.theme) })));
     }
     setFontProperties() {
         this.styles['--font-family'] = window.CuraAPI.theme.fonts.getFamily();
@@ -3624,19 +3508,19 @@ const CuraCalendar = class {
         this.defaultDates = this.expandDateRanges(this.defaultDate);
     }
     /**
-   * Get the locale for the calendar.
-   *
-   * @returns {Locale} The locale object.
-   */
+     * Get the locale for the calendar.
+     *
+     * @returns {Locale} The locale object.
+     */
     determineLocale() {
         return this.optionsLocale[this.locale] || this.locale;
     }
     /**
-   * Check if a date is within the valid period.
-   *
-   * @param {Date} date - The date to check.
-   * @returns {boolean} Whether the date is valid.
-   */
+     * Check if a date is within the valid period.
+     *
+     * @param {Date} date - The date to check.
+     * @returns {boolean} Whether the date is valid.
+     */
     isDateInValidPeriod(date) {
         if (this.period === null) {
             return true;
@@ -3690,12 +3574,12 @@ const CuraCalendar = class {
         return this.isDateInList(this.expandDateRanges(this.enable), date);
     }
     /**
-   * Checks if a date is in the provided list of dates.
-   *
-   * @param {Date[]} dates - The list of dates to check against.
-   * @param {Date} date - The date to check.
-   * @returns {boolean} Whether the date is in the list.
-   */
+     * Checks if a date is in the provided list of dates.
+     *
+     * @param {Date[]} dates - The list of dates to check against.
+     * @param {Date} date - The date to check.
+     * @returns {boolean} Whether the date is in the list.
+     */
     isDateInList(dates, date) {
         return dates.some(d => isSameDay(d, date));
     }
@@ -3776,7 +3660,7 @@ const CuraCalendar = class {
      */
     selectMultiplesDate(date) {
         if (!this.isDateSelected(date) || !this.isDateInDefaultSelection(date))
-            return this.selectedDates = [...this.selectedDates, date];
+            return (this.selectedDates = [...this.selectedDates, date]);
         this.selectedDates = this.removeDateFromSelection(this.selectedDates, date);
         this.defaultDates = this.removeDateFromSelection(this.defaultDates, date);
     }
@@ -3811,16 +3695,16 @@ const CuraCalendar = class {
         const selectionHandlers = {
             single: this.selectSingleDate.bind(this),
             multiple: this.selectMultiplesDate.bind(this),
-            range: this.selectDateRange.bind(this)
+            range: this.selectDateRange.bind(this),
         };
         selectionHandlers[this.mode](date);
         this.onchangeday.emit({ days: [...this.defaultDates, ...this.selectedDates].filter(d => this.isDateInValidPeriod(d)) });
     }
     /**
-    * Get the days of the week.
-    *
-    * @returns {string[]} An array of abbreviated day names.
-    */
+     * Get the days of the week.
+     *
+     * @returns {string[]} An array of abbreviated day names.
+     */
     fetchWeekDays() {
         const start = startOfWeek(new Date(2021, 0, 3), { locale: this.determineLocale() });
         const end = endOfWeek(new Date(2021, 0, 3), { locale: this.determineLocale() });
@@ -3836,7 +3720,7 @@ const CuraCalendar = class {
             this.fetchDaysOfWeek();
         }
         else
-            (this.fetchDaysOfMonth());
+            this.fetchDaysOfMonth();
         this.collapsed = false;
     }
     showColapsedCalendar() {
@@ -3868,20 +3752,16 @@ const CuraCalendar = class {
         const prevMonthEnd = endOfMonth(prevMonthStart);
         const daysInPrevMonth = eachDayOfInterval({
             start: subDays(prevMonthEnd, getDay(start)),
-            end: prevMonthEnd
+            end: prevMonthEnd,
         });
         const nextMonthStart = startOfMonth(addMonths(end, 1));
         const nextMonthEnd = endOfMonth(nextMonthStart);
         const remainingDays = WEEKS_IN_CALENDAR_VIEW - getDay(end);
         const daysInNextMonth = eachDayOfInterval({
             start: nextMonthStart,
-            end: addDays(nextMonthEnd, remainingDays)
+            end: addDays(nextMonthEnd, remainingDays),
         });
-        const totalDays = [
-            ...daysInPrevMonth.slice(-getDay(start)),
-            ...daysIncurrentDate,
-            ...daysInNextMonth
-        ];
+        const totalDays = [...daysInPrevMonth.slice(-getDay(start)), ...daysIncurrentDate, ...daysInNextMonth];
         return totalDays.slice(0, DAYS_IN_CALENDAR_VIEW);
     }
     /**
@@ -3894,7 +3774,7 @@ const CuraCalendar = class {
         const locale = this.determineLocale();
         const months = eachMonthOfInterval({
             start: startOfYear(new Date(currentYear, 0, 1)),
-            end: new Date(currentYear, 11, 31)
+            end: new Date(currentYear, 11, 31),
         }).map(month => format(month, 'MMMM', { locale }));
         const capitalize = (str) => str.charAt(0).toUpperCase() + str.slice(1).toLowerCase();
         return {
@@ -3911,20 +3791,20 @@ const CuraCalendar = class {
         return Array.from({ length: 100 }, (_, i) => currentYear - i);
     }
     /**
-    * Get the color for the previous button.
-    *
-    * @returns {string} The color name for the previous button.
-    */
+     * Get the color for the previous button.
+     *
+     * @returns {string} The color name for the previous button.
+     */
     determinePrevButtonColor() {
         const isPrevDisabled = isBefore(new Date(getYear(this.currentDate), getMonth(this.currentDate) - 1, 1), startOfMonth(new Date()));
         return isPrevDisabled && 'primary-base';
     }
     /**
-    * Get the status of a given date, determining its position and interval status.
-    *
-    * @param {Date | null} date - The date to evaluate.
-    * @returns {Object} An object containing the status flags for the date.
-    */
+     * Get the status of a given date, determining its position and interval status.
+     *
+     * @param {Date | null} date - The date to evaluate.
+     * @returns {Object} An object containing the status flags for the date.
+     */
     getDateStatus(date) {
         const [startSelected, endSelected] = [this.selectedDates[0], this.selectedDates[this.selectedDates.length - 1]];
         const [startDefault, endDefault] = [this.defaultDates[0], this.defaultDates[this.defaultDates.length - 1]];
@@ -3954,7 +3834,7 @@ const CuraCalendar = class {
             isSelected,
             isRange,
             isDefault,
-            isInterval
+            isInterval,
         };
     }
     /**
@@ -3964,7 +3844,7 @@ const CuraCalendar = class {
      * @returns {Object} An object containing the CSS classes for the date.
      */
     getClasses(date) {
-        const classes = { 'date': true };
+        const classes = { date: true };
         if (date === null)
             return classes;
         const dateStatus = this.getDateStatus(date);
@@ -3989,12 +3869,18 @@ const CuraCalendar = class {
             '--width': this.width,
         };
     }
+    watchDefaultDatesArray() {
+        this.selectedDates = this.customDates;
+    }
     render() {
         const { months } = this.fetchMonthNames();
-        return (h(Host, { key: 'c35f2925c454310e100ffb51291fe5dd590c67ad', style: this.getHostCSSProperties() }, h("div", { key: 'e2b10e544856cd095735b85102ea7f74daf7312f', class: `calendar ${this.floating ? "floating" : ""} ${this.embedded ? "embedded" : ""}`, style: this.styles }, h("header", { key: '68092a2f7fb49ee40ee318dba69f56a0caf2e4eb', class: "header" }, h("div", { key: '5b29701bbde12a32085818ff85cc45f5cfde8d1c', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, h("cura-icon", { key: '48ac9b9790f493c4cc8f5ef7b4b54c1c22bd4286', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "left", color: this.determinePrevButtonColor(), onClick: !this.collapsed ? () => this.updateCurrentMonth('prev') : () => this.updateCurrentWeek('prev') }), this.type === 'dropdown' ? (h("div", { class: "select" }, h("cura-select", { size: 'small', class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: (e) => this.onMonthDropdownChange(e) }, months.map((month, index) => (h("cura-select-option", { size: 'xsmall', key: index, value: month }, month)))), h("cura-select", { size: 'small', class: "drop-year", mode: "transparent", value: getYear(this.currentDate).toString(), onSelected: (e) => this.onYearDropdownChange(e) }, this.fetchYearList().map((year, index) => (h("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (h("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), h("cura-icon", { key: 'a50ea156b4d7a9e6d25393cf68a65ad72ce3679d', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), h("span", { key: '742f91e5361baba1d4d6d2859276279ad24b0c71', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (h("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: 'bold', key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), h("div", { key: 'eb753228943697a38d9b96de60a56c74cdfbc1c7', class: "dates" }, !this.collapsed ?
-            this.fetchDaysOfMonth().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : ''))) :
-            this.fetchDaysOfWeek().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))), this.collapsed !== null ? (this.collapsed ? (h("div", { class: 'collapsed-container' }, h("cura-button-transparent", { onClick: () => this.showNotColapsedCalendar(), size: 'small', color: 'primary', fontColor: 'dark', iconName: 'plusCircle' }, "Veja mais datas"))) : (h("div", { class: 'collapsed-container' }, h("cura-button-transparent", { onClick: () => this.showColapsedCalendar(), size: 'small', color: 'primary', fontColor: 'dark', iconName: 'minusCircle' }, "Veja menos datas")))) : null)));
+        return (h(Host, { key: '3c3a06e4eee0a100a0a9e1eab8d42d839a1cb945', style: this.getHostCSSProperties() }, h("div", { key: 'b82154d8bb381b3452c90e26e2cbae69db670add', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, h("header", { key: '0c9a5ce68444d2ae931aff60efeb20c52172b2cf', class: "header" }, h("div", { key: '68e6c5e716ea1919f423950a22341721d0094d8c', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, h("cura-icon", { key: '54f6799b4d54bed92a671dc75045c52076d3adab', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "left", color: this.determinePrevButtonColor(), onClick: !this.collapsed ? () => this.updateCurrentMonth('prev') : () => this.updateCurrentWeek('prev') }), this.type === 'dropdown' ? (h("div", { class: "select" }, h("cura-select", { size: "small", class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: e => this.onMonthDropdownChange(e) }, months.map((month, index) => (h("cura-select-option", { size: "xsmall", key: index, value: month }, month)))), h("cura-select", { size: "small", class: "drop-year", mode: "transparent", value: getYear(this.currentDate).toString(), onSelected: e => this.onYearDropdownChange(e) }, this.fetchYearList().map((year, index) => (h("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (h("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), h("cura-icon", { key: '66f0f20be96bc0517fb88c284435eda3f85e5227', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), h("span", { key: '5df4ad92b85833a2284830cd69418e9c740fd0f6', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (h("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: "bold", key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), h("div", { key: 'c94c9a2eae554149126f729953245b27a6f82a86', class: "dates" }, !this.collapsed
+            ? this.fetchDaysOfMonth().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))
+            : this.fetchDaysOfWeek().map((day, index) => (h("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))), this.collapsed !== null ? (this.collapsed ? (h("div", { class: "collapsed-container" }, h("cura-button-transparent", { onClick: () => this.showNotColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "plusCircle" }, "Veja mais datas"))) : (h("div", { class: "collapsed-container" }, h("cura-button-transparent", { onClick: () => this.showColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "minusCircle" }, "Veja menos datas")))) : null)));
     }
+    static get watchers() { return {
+        "customDates": ["watchDefaultDatesArray"]
+    }; }
 };
 CuraCalendar.style = CuraCalendarStyle0;