ublo-lib 1.40.7 → 1.40.8

package/es/common/components/date-picker/date-item.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-item.d.ts","sourceRoot":"","sources":["../../../../src/common/components/date-picker/date-item.js"],"names":[],"mappings":"AASA;;;;;;;;;;;;;;;;;;;4CAsLC"}
+{"version":3,"file":"date-item.d.ts","sourceRoot":"","sources":["../../../../src/common/components/date-picker/date-item.js"],"names":[],"mappings":"AASA;;;;;;;;;;;;;;;;;;;4CAuLC"}

package/es/common/components/date-picker/date-item.js

@@ -13,9 +13,10 @@ export default function DateItem({ date, index, month, year, min, max, selectedD
     const _date = React.useMemo(() => new Date(date), [date]);
     _date.setHours(0, 0, 0, 0);
     const isToday = Utils.isSameDay(_date, today);
-    const isInMonth = month &&
-        year &&
-        Utils.isSameMonth(_date, new Date(`${Utils.zeroPad(year, 2)}-${Utils.zeroPad(month, 2)}-02`));
+    const monthReference = new Date(`${Utils.zeroPad(year, 2)}-${Utils.zeroPad(month, 2)}-02`);
+    const isInMonth = month && year && Utils.isSameMonth(_date, monthReference);
+    const isInPastMonth = Utils.isInPastMonth(_date, monthReference);
+    const isInNextMonth = Utils.isInNextMonth(_date, monthReference);
     const firstSelectedDate = selectedDates[0];
     const isFirstSelected = selectedDates.map(Number).indexOf(Number(_date)) === 0;
     const isLastSelected = selectedDates.map(Number).indexOf(Number(_date)) ===
@@ -107,6 +108,8 @@ export default function DateItem({ date, index, month, year, min, max, selectedD
         [styles.dateFirstSelected]: isFirstSelected,
         [styles.dateLastSelected]: isLastSelected,
         [styles.dateNotInMonth]: !isInMonth,
+        [styles.datePastMonth]: isInPastMonth,
+        [styles.dateNextMonth]: isInNextMonth,
         [styles.dateIsPast]: !isSelected && isDisabled,
         [styles.available]: enableAvailability && isAvailable,
         [styles.notAvailable]: enableAvailability && !isAvailable && !isSelected,

package/es/common/components/date-picker/date-item.module.css

@@ -64,6 +64,15 @@
   opacity: 0.5;
 }
 
+@media (min-width: 810px) {
+  [data-month]:nth-child(2) .dateNextMonth,
+  [data-month]:nth-child(3) .datePastMonth {
+    opacity: 0;
+    pointer-events: none;
+    touch-action: none;
+  }
+}
+
 .date:not(:disabled):hover {
   background-color: var(--ds-grey-200, #efefef);
 }

package/es/common/components/date-picker/date-picker.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../../src/common/components/date-picker/date-picker.js"],"names":[],"mappings":"AAWA;;;;;;;;;;;;4CAuDC;sBA7DqB,QAAQ;uBACP,SAAS"}
+{"version":3,"file":"date-picker.d.ts","sourceRoot":"","sources":["../../../../src/common/components/date-picker/date-picker.js"],"names":[],"mappings":"AAWA;;;;;;;;;;;;4CAqDC;sBA3DqB,QAAQ;uBACP,SAAS"}

package/es/common/components/date-picker/date-picker.js

@@ -13,11 +13,9 @@ export default function DatePicker({ stayDates = [], onSubmit, close, min, max,
     React.useEffect(() => {
         if (windowWidth <= Data.BREAKPOINTS.PHONE) {
             setDisplay(Data.DISPLAYS.PHONE);
-            return;
         }
         if (windowWidth <= Data.BREAKPOINTS.TABLET) {
             setDisplay(Data.DISPLAYS.TABLET);
-            return;
         }
         else {
             setDisplay(Data.DISPLAYS.DESKTOP);

package/es/common/components/date-picker/month.js

@@ -13,7 +13,7 @@ export default function Month({ display, month, year, min, max, selecting, setSe
     const calendarMonth = month;
     const calendarYear = year;
     const calendarDates = Data.calendar(calendarMonth, calendarYear);
-    return (_jsxs("div", { className: styles.month, children: [_jsxs("div", { className: styles.title, children: [monthName, " ", year] }), _jsx("div", { className: styles.days, children: days.map((day) => {
+    return (_jsxs("div", { className: styles.month, "data-month": "", children: [_jsxs("div", { className: styles.title, children: [monthName, " ", year] }), _jsx("div", { className: styles.days, children: days.map((day) => {
                     return (_jsx("div", { className: styles.day, children: i18nWeekDays[day] }, day));
                 }) }), _jsx("div", { className: styles.dates, children: calendarDates.map((date, i) => {
                     return (_jsx(DateItem, { index: i, display: display, date: date, month: month, year: year, min: min, max: max, selectedDates: selectedDates, setSelectedDates: setSelectedDates, setFirstSelectedDate: setFirstSelectedDate, setLastSelectedDate: setLastSelectedDate, selecting: selecting, setSelecting: setSelecting, singleDate: singleDate, submitOnSelectionEnd: submitOnSelectionEnd, onSubmit: onSubmit, stays: stays, matchingStays: matchingStays, allMatchingStaysEnd: allMatchingStaysEnd }, i));

package/es/common/components/date-picker/utils.d.ts

@@ -8,6 +8,8 @@ export function formatDate(date: any): string;
 export function isDate(date: any): boolean;
 export function isSameMonth(date: any, basedate?: Date): boolean;
 export function isSameDay(date: any, basedate?: Date): boolean;
+export function isInPastMonth(date: any, basedate?: Date): boolean;
+export function inInNextMonth(date: any, basedate?: Date): boolean;
 export function isPast(date: any): boolean;
 export function isBefore(date: any, ref: any): boolean;
 export function isAfter(date: any, ref: any): boolean;

package/es/common/components/date-picker/utils.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/common/components/date-picker/utils.js"],"names":[],"mappings":"AAoHA,qDAIC;AAkDD,sEAQC;AAhLM,yDAAmE;AAEnE,+EAcN;AAEM,wEAON;AAEM,kDAON;AAEM,8CAON;AAEM,2CAKN;AAEM,iEAaN;AAEM,+DAmBN;AAEM,2CAMN;AAEM,uDAON;AAEM,sDAON;AAQM,qEAQN;AAEM,gDAON;AAEM,yEAaN;AAEM;;;EAKN;AAEM;;;EAKN"}
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/common/components/date-picker/utils.js"],"names":[],"mappings":"AAwJA,qDAIC;AAkDD,sEAQC;AApNM,yDAAmE;AAEnE,+EAcN;AAEM,wEAON;AAEM,kDAON;AAEM,8CAON;AAEM,2CAKN;AAEM,iEAaN;AAEM,+DAmBN;AAEM,mEAgBN;AAEM,mEAgBN;AAEM,2CAMN;AAEM,uDAON;AAEM,sDAON;AAQM,qEAQN;AAEM,gDAON;AAEM,yEAaN;AAEM;;;EAKN;AAEM;;;EAKN"}

package/es/common/components/date-picker/utils.js

@@ -63,6 +63,36 @@ export const isSameDay = (date, basedate = new Date()) => {
         basedateMonth === dateMonth &&
         basedateYear === dateYear);
 };
+export const isInPastMonth = (date, basedate = new Date()) => {
+    if (!(isDate(date) && isDate(basedate)))
+        return false;
+    date.setHours(0, 0, 0, 0);
+    basedate.setHours(0, 0, 0, 0);
+    const basedateMonth = basedate.getMonth() + 1;
+    const basedateYear = basedate.getFullYear();
+    const dateMonth = date.getMonth() + 1;
+    const dateYear = date.getFullYear();
+    if (basedateYear < dateYear)
+        return false;
+    if (basedateYear > dateYear)
+        return true;
+    return basedateMonth > dateMonth;
+};
+export const inInNextMonth = (date, basedate = new Date()) => {
+    if (!(isDate(date) && isDate(basedate)))
+        return false;
+    date.setHours(0, 0, 0, 0);
+    basedate.setHours(0, 0, 0, 0);
+    const basedateMonth = basedate.getMonth() + 1;
+    const basedateYear = basedate.getFullYear();
+    const dateMonth = date.getMonth() + 1;
+    const dateYear = date.getFullYear();
+    if (basedateYear > dateYear)
+        return false;
+    if (basedateYear < dateYear)
+        return true;
+    return basedateMonth < dateMonth;
+};
 export const isPast = (date) => {
     const d = Array.isArray(date) ? date.join("-") : date;
     const _date = new Date(d);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ublo-lib",
-  "version": "1.40.7",
+  "version": "1.40.8",
   "peerDependencies": {
     "dt-design-system": "^3.10.8",
     "leaflet": "^1.9.1",