@rededor/cura 1.6.0-alpha.0 → 1.6.0-alpha.2

package/dist/components/cura-calendar2.js

@@ -3569,7 +3569,7 @@ var locale = {
 };
 const ptBR = locale;
 
-const curaCalendarCss = ":host{display:block;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);margin:0 auto}:host .calendar{display:flex;flex-direction:column;gap:5px;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);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);min-width:var(--min-width);max-width:var(--max-width);margin:0 auto}:host .calendar{display:flex;flex-direction:column;gap:5px;width:var(--width);min-width:var(--min-width);max-width:var(--max-width);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(--primary-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{color:var(--select-label) !important;background:var(--primary-base);border-radius:50%}:host .date.default-dates{color:var(--select-label) !important;background:var(--primary-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(--select-label) !important;background:var(--primary-base)}:host .date.range.interval{border-radius:0;background:var(--primary-lighter);color:var(--neutral-black) !important}:host .date.range.interval.today{border:none}:host .date.range.end{border-radius:0 50% 50% 0;color:var(--select-label) !important;background:var(--primary-base)}:host .date:hover{background:var(--primary-lighter);border-radius:50%;color:var(--neutral-white)}: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}";
 const CuraCalendarStyle0 = curaCalendarCss;
 
 const CuraCalendar = /*@__PURE__*/ proxyCustomElement(class CuraCalendar extends HTMLElement {
@@ -3599,10 +3599,11 @@ const CuraCalendar = /*@__PURE__*/ proxyCustomElement(class CuraCalendar extends
         this.collapsed = null;
         this.floating = undefined;
         this.embedded = undefined;
-        this.currentDate = new Date();
+        this.selectLabelColorMode = 'light';
         this.selectedDates = [];
         this.rangeStart = null;
         this.defaultDates = [];
+        this.currentDate = new Date();
         this.selectMonth = '';
         this.selectYear = '';
         this.styles = {};
@@ -3611,12 +3612,15 @@ const CuraCalendar = /*@__PURE__*/ proxyCustomElement(class CuraCalendar extends
         this.setFontProperties();
         this.initializeDefaultDates();
         const colors = [
-            { name: '--accent-base', theme: 'accent-base' },
-            { name: '--accent-light', theme: 'accent-light' },
+            { name: '--primary-base', theme: 'primary-base' },
+            { name: '--primary-lighter', theme: 'primary-lighter' },
+            { name: '--primary-light', theme: 'primary-light' },
             { name: '--neutral-black', theme: 'neutral-black' },
             { name: '--primary-darker', theme: 'primary-darker' },
             { name: '--neutral-dark', theme: 'neutral-dark' },
             { name: '--neutral-light', theme: 'neutral-light' },
+            { name: '--neutral-white', theme: 'neutral-white' },
+            { name: '--select-label', theme: this.selectLabelColorMode === 'dark' ? 'neutral-black' : 'neutral-white' },
         ];
         colors.forEach(color => (this.styles = Object.assign(Object.assign({}, this.styles), { [color.name]: this.theme.colors.getColor(color.theme) })));
     }
@@ -3642,6 +3646,7 @@ const CuraCalendar = /*@__PURE__*/ proxyCustomElement(class CuraCalendar extends
             }
         }
         this.defaultDates = this.expandDateRanges(this.defaultDate);
+        this.currentDate = this.defaultDates[0] ? this.defaultDates[0] : this.currentDate;
     }
     /**
      * Get the locale for the calendar.
@@ -3735,7 +3740,7 @@ const CuraCalendar = /*@__PURE__*/ proxyCustomElement(class CuraCalendar extends
      * @param {string} direction - 'prev' | 'next'
      */
     updateCurrentMonth(direction) {
-        let newMonth = new Date(this.currentDate);
+        let newMonth = this.currentDate;
         if (direction === 'prev')
             newMonth = subMonths(this.currentDate, 1);
         if (direction === 'next')
@@ -3873,7 +3878,7 @@ const CuraCalendar = /*@__PURE__*/ proxyCustomElement(class CuraCalendar extends
         return daysIncurrentDate.slice(0, DAYS_IN_CALENDAR_VIEW);
     }
     updateCurrentWeek(direction) {
-        let newWeek = new Date(this.currentDate);
+        let newWeek = this.currentDate;
         if (direction === 'prev')
             newWeek = subWeeks(this.currentDate, 1);
         if (direction === 'next')
@@ -4026,7 +4031,7 @@ const CuraCalendar = /*@__PURE__*/ proxyCustomElement(class CuraCalendar extends
     }
     render() {
         const { months } = this.fetchMonthNames();
-        return (h(Host, { key: '859c5f15de173c774dc9f8a88792845741b665e2', style: this.getHostCSSProperties() }, h("div", { key: '5838783d7ecb5b2258ef7ef73ba32ca7ddbad470', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, h("header", { key: '16245dbb73d9d0a277891b3853f451b89acccc35', class: "header" }, h("div", { key: '9a22c4386363642fa7219edebd9e9a5cfb5220aa', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, h("cura-icon", { key: '4d3ee4454dfc8bbcd8d76df101b553c86b0cea8f', 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: '1f54119aafaa80816cdd016100a7987cba6656b0', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), h("span", { key: '40be6c876675cf43b42e214e30639e48873dc4bc', 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: '72cae6b30fa5b7d5e180b796458d1844aba27ea9', class: "dates" }, !this.collapsed
+        return (h(Host, { key: 'a27b858fff12fe2d19898dbb0be8080a0175c465', style: this.getHostCSSProperties() }, h("div", { key: 'e2fe9991e3ef03d11b0e58b412d31020ead1b344', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, h("header", { key: '8bf8a4f703043d907d8bc81ed22061380cd67ade', class: "header" }, h("div", { key: '66c2b27693f188929065972828c2ce4a672f1e74', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, h("cura-icon", { key: '0e6841eb77061f404e23fbfc28be40600255767a', 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: 'cdc62d8666dc7b890daadf63d2ffe0d0000ec545', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), h("span", { key: 'fa0d8c6ff291f343da594799b3ba366d3e020e74', 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: 'dc072663767251cc694d51612cacd94f1fe31a84', 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)));
     }
@@ -4054,10 +4059,11 @@ const CuraCalendar = /*@__PURE__*/ proxyCustomElement(class CuraCalendar extends
         "collapsed": [1540],
         "floating": [1540],
         "embedded": [1540],
-        "currentDate": [32],
+        "selectLabelColorMode": [1537, "select-label-color-mode"],
         "selectedDates": [32],
         "rangeStart": [32],
         "defaultDates": [32],
+        "currentDate": [32],
         "selectMonth": [32],
         "selectYear": [32],
         "styles": [32]