@veracity/vui 2.13.6 → 2.14.0

package/dist/cjs/calendar/hooks/useBoundaries.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useBoundaries = void 0;
+const consts_1 = require("../consts");
+/**
+ * Calculates boundaries for max/min dates allowed
+ * Memoized so it will only recalculate when the boundaries changes
+ */
+const useBoundaries = ({ boundaries }) => {
+    const min = new Date(consts_1.minDateTimestamp);
+    const max = new Date(consts_1.maxDateTimestamp);
+    const minDateTime = (boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate) || min;
+    const maxDateTime = (boundaries === null || boundaries === void 0 ? void 0 : boundaries.endDate) || max;
+    return { maxDateTime, minDateTime };
+};
+exports.useBoundaries = useBoundaries;

package/dist/cjs/calendar/hooks/useCalendar.d.ts

@@ -0,0 +1,8 @@
+import { MonthProps, TimeResult } from '../calendar.types';
+/**
+ * Main hook for doing calendar calculations
+ * Calculates for all time unit modes: day, month and year
+ * Depends on useBoundaries and useSelectedDate to do initial setup
+ */
+export declare const useCalendar: ({ boundaries, selectedDates, mode, timeUnitMode, viewDate, fixedNumberOfWeeks }: MonthProps) => TimeResult;
+//# sourceMappingURL=useCalendar.d.ts.map

package/dist/cjs/calendar/hooks/useCalendar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCalendar.d.ts","sourceRoot":"","sources":["../../../../src/calendar/hooks/useCalendar.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,UAAU,EAAY,UAAU,EAAE,MAAM,mBAAmB,CAAA;AAMpE;;;;GAIG;AACH,eAAO,MAAM,WAAW,oFAOrB,UAAU,eA+JZ,CAAA"}

package/dist/cjs/calendar/hooks/useCalendar.js

@@ -0,0 +1,143 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCalendar = void 0;
+const react_1 = require("react");
+const utils_1 = require("../../utils");
+const consts_1 = require("../consts");
+const utils_2 = require("../utils");
+const useBoundaries_1 = require("./useBoundaries");
+const useSelectedDate_1 = require("./useSelectedDate");
+/**
+ * Main hook for doing calendar calculations
+ * Calculates for all time unit modes: day, month and year
+ * Depends on useBoundaries and useSelectedDate to do initial setup
+ */
+const useCalendar = ({ boundaries, selectedDates, mode = 'exact', timeUnitMode, viewDate, fixedNumberOfWeeks }) => {
+    const boundariesProcessed = (0, useBoundaries_1.useBoundaries)({ boundaries });
+    const selectedProcessed = (0, useSelectedDate_1.useSelectedDate)({ selectedDates, mode });
+    return (0, react_1.useMemo)(() => {
+        const { maxDateTime, minDateTime } = boundariesProcessed;
+        const { currentDateTime, maxSelectedDateTime, minSelectedDateTime } = selectedProcessed;
+        const { utcYear: viewDateYear, utcMonth: viewDateMonth } = (0, utils_1.getDateUTCValue)(viewDate);
+        let calendarFirstDay;
+        let calendarLastDay;
+        let nextFirstDay;
+        let prevLastDay;
+        let firstDay;
+        let lastDay;
+        if ((0, utils_2.isDay)(timeUnitMode)) {
+            firstDay = (0, utils_1.generateDateByUTCValue)(viewDateYear, viewDateMonth, 1);
+            lastDay = (0, utils_1.generateDateByUTCValue)(viewDateYear, viewDateMonth + 1, 0); // lastDay
+            nextFirstDay = (0, utils_1.generateDateByUTCValue)(viewDateYear, viewDateMonth + 1, 1);
+            prevLastDay = (0, utils_1.generateDateByUTCValue)(viewDateYear, viewDateMonth, 0);
+            const weekdayFirst = firstDay.getUTCDay();
+            const weekdayLast = lastDay.getUTCDay();
+            // Monday preceding the month (or first day of the month if it's on a Monday)
+            calendarFirstDay =
+                weekdayFirst === 0
+                    ? new Date(Date.UTC(viewDateYear, viewDateMonth, 2 - 7))
+                    : new Date(Date.UTC(viewDateYear, viewDateMonth, 2 - weekdayFirst));
+            // Sunday after the month (or last day of the month if it's on a Sunday)
+            calendarLastDay =
+                weekdayLast === 0
+                    ? new Date(Date.UTC(viewDateYear, viewDateMonth + 1, 0))
+                    : new Date(Date.UTC(viewDateYear, viewDateMonth + 1, 8 - weekdayLast));
+            // If calendar must contain constant number of weeks (6 weeks)
+            // Missing weeks will be added to the end of the month
+            const numberOfWeeks = Math.round((+calendarLastDay - +calendarFirstDay) / (7 * 24 * 60 * 60 * 1000));
+            if (fixedNumberOfWeeks) {
+                for (let week = numberOfWeeks; week < 6; week++) {
+                    calendarLastDay = (0, utils_1.generateDateByUTCValue)(calendarLastDay.getUTCFullYear(), calendarLastDay.getUTCMonth(), calendarLastDay.getUTCDate() + 7);
+                }
+            }
+        }
+        else if ((0, utils_2.isMonth)(timeUnitMode)) {
+            calendarFirstDay = firstDay = (0, utils_1.generateDateByUTCValue)(viewDateYear, 0, 1);
+            calendarLastDay = lastDay = (0, utils_1.generateDateByUTCValue)(viewDateYear, 11, 31);
+            nextFirstDay = (0, utils_1.generateDateByUTCValue)(viewDateYear + 1, 0, 1);
+            prevLastDay = (0, utils_1.generateDateByUTCValue)(viewDateYear - 1, 11, 31);
+        }
+        else {
+            const calendarStartYear = new Date().getUTCFullYear() - consts_1.viewYears / 2;
+            const diffYears = calendarStartYear - viewDateYear;
+            const startYear = calendarStartYear - Math.ceil(diffYears / consts_1.viewYears) * consts_1.viewYears;
+            const endYear = startYear + consts_1.viewYears - 1;
+            if (startYear === 1753)
+                calendarFirstDay = firstDay = (0, utils_1.generateDateByUTCValue)(startYear, 0, 2);
+            else
+                calendarFirstDay = firstDay = (0, utils_1.generateDateByUTCValue)(startYear, 0, 1);
+            calendarLastDay = lastDay = (0, utils_1.generateDateByUTCValue)(endYear, 11, 31);
+            nextFirstDay = (0, utils_1.generateDateByUTCValue)(endYear + 1, 0, 1);
+            prevLastDay = (0, utils_1.generateDateByUTCValue)(startYear - 1, 11, 31);
+        }
+        const items = [];
+        // Loops between first and last date
+        let dateItem = calendarFirstDay;
+        do {
+            const isHidden = dateItem < firstDay || dateItem >= lastDay;
+            const isToday = (0, utils_1.sameDate)(dateItem, new Date());
+            const { utcYear: minDateYear, utcMonth: minDateMonth } = (0, utils_1.getDateUTCValue)(minDateTime);
+            let minUnitModeDate = minDateTime;
+            if ((0, utils_2.isMonth)(timeUnitMode))
+                // Need to compare with the first day of the month to decide if the month is disabled in the month overview
+                minUnitModeDate = (0, utils_1.generateDateByUTCValue)(minDateYear, minDateMonth, 1);
+            else if ((0, utils_2.isYear)(timeUnitMode))
+                // Need to compare with the first day of the year to decide if the year is disabled in the year overview
+                minUnitModeDate = (0, utils_1.generateDateByUTCValue)(minDateYear, 0, 1);
+            const isDisabled = dateItem < minUnitModeDate || dateItem > maxDateTime ? true : false;
+            // The calendar only select a single date
+            const isExactSelected = (0, utils_2.isExact)(mode) && minSelectedDateTime && +dateItem === +minSelectedDateTime;
+            // The calendar selects a range
+            const inRangeLow = minSelectedDateTime && dateItem >= minSelectedDateTime;
+            const inRangeHigh = maxSelectedDateTime && dateItem <= maxSelectedDateTime;
+            const inRange = !(0, utils_2.isExact)(mode) &&
+                ((!isDisabled && inRangeLow && (!maxSelectedDateTime || inRangeHigh)) ||
+                    (inRangeHigh && (!minSelectedDateTime || inRangeLow)));
+            const isRangeSelected = (0, utils_2.isRange)(mode) && inRange;
+            const isFromSelected = (0, utils_2.isFrom)(mode) && inRangeLow;
+            const isToSelected = (0, utils_2.isTo)(mode) && inRangeHigh;
+            const isSelected = !!(isExactSelected || isFromSelected || isToSelected || isRangeSelected);
+            let maxSelectedCheck = maxSelectedDateTime;
+            let minSelectedCheck = minSelectedDateTime;
+            if ((0, utils_2.isYear)(timeUnitMode)) {
+                if (maxSelectedCheck)
+                    maxSelectedCheck = (0, utils_1.generateDateByUTCValue)(maxSelectedCheck.getUTCFullYear(), 0, 1);
+                if (minSelectedCheck)
+                    minSelectedCheck = (0, utils_1.generateDateByUTCValue)(minSelectedCheck.getUTCFullYear(), 0, 1);
+            }
+            if ((0, utils_2.isMonth)(timeUnitMode)) {
+                if (maxSelectedCheck)
+                    maxSelectedCheck = (0, utils_1.generateDateByUTCValue)(maxSelectedCheck.getUTCFullYear(), maxSelectedCheck.getUTCMonth(), 1);
+                if (minSelectedCheck)
+                    minSelectedCheck = (0, utils_1.generateDateByUTCValue)(minSelectedCheck.getUTCFullYear(), minSelectedCheck.getUTCMonth(), 1);
+            }
+            const boundary = !(0, utils_2.isTo)(mode) && (0, utils_1.sameDate)(dateItem, minSelectedCheck);
+            let current;
+            if ((0, utils_2.isDay)(timeUnitMode))
+                current = (0, utils_1.sameDate)(dateItem, currentDateTime);
+            else if ((0, utils_2.isMonth)(timeUnitMode))
+                current = (0, utils_1.sameYearSameMonth)(dateItem, currentDateTime);
+            else
+                current = (0, utils_1.sameYear)(dateItem, currentDateTime);
+            items.push({
+                date: dateItem,
+                isHidden,
+                isToday,
+                isDisabled: boundary ? false : isDisabled,
+                isSelected,
+                boundary,
+                current
+            });
+            dateItem = (0, utils_2.getNextDate)(dateItem, timeUnitMode);
+        } while (dateItem <= calendarLastDay);
+        // Disables next/prev buttons
+        const prevDisabled = minDateTime > prevLastDay;
+        const nextDisabled = maxDateTime < nextFirstDay;
+        return {
+            items,
+            prevDisabled,
+            nextDisabled
+        };
+    }, [boundaries, selectedDates, mode, timeUnitMode, viewDate]);
+};
+exports.useCalendar = useCalendar;

package/dist/cjs/calendar/hooks/useDefaultViewMonth.d.ts

@@ -0,0 +1,8 @@
+import { DefaultViewMonthProps } from '../calendar.types';
+/**
+ * Calculates the default view date, either using selected date, current date or boundaries
+ * Used when initializing, after that viewDate will be set
+ * Memoized so will only recalculate when boundaries or selectedDate changes
+ */
+export declare const useDefaultViewMonth: ({ boundaries, selectedDate, isStartDate }: DefaultViewMonthProps) => Date;
+//# sourceMappingURL=useDefaultViewMonth.d.ts.map

package/dist/cjs/calendar/hooks/useDefaultViewMonth.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDefaultViewMonth.d.ts","sourceRoot":"","sources":["../../../../src/calendar/hooks/useDefaultViewMonth.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAA;AAEzD;;;;GAIG;AACH,eAAO,MAAM,mBAAmB,8CAA+C,qBAAqB,SAUnG,CAAA"}

package/dist/cjs/calendar/hooks/useDefaultViewMonth.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDefaultViewMonth = void 0;
+/**
+ * Calculates the default view date, either using selected date, current date or boundaries
+ * Used when initializing, after that viewDate will be set
+ * Memoized so will only recalculate when boundaries or selectedDate changes
+ */
+const useDefaultViewMonth = ({ boundaries, selectedDate, isStartDate }) => {
+    if (selectedDate)
+        return selectedDate;
+    const currentDate = new Date();
+    if (!boundaries)
+        return currentDate;
+    if (boundaries.endDate && currentDate > boundaries.endDate && !isStartDate)
+        return boundaries.endDate;
+    if (boundaries.startDate && currentDate > boundaries.startDate && isStartDate)
+        return boundaries.startDate;
+    return currentDate;
+};
+exports.useDefaultViewMonth = useDefaultViewMonth;

package/dist/cjs/calendar/hooks/useSelectedDate.d.ts

@@ -0,0 +1,15 @@
+import { CalendarMode, DateRange } from '../calendar.types';
+/**
+ * Calculate the selected dates
+ * If we are in single calendar mode, will use the startDate as selected date
+ * Memoized so will only recalculate when selectedDates or mode changes
+ */
+export declare const useSelectedDate: ({ selectedDates, mode }: {
+    mode: CalendarMode;
+    selectedDates?: DateRange | undefined;
+}) => {
+    currentDateTime: Date | undefined;
+    maxSelectedDateTime: Date | undefined;
+    minSelectedDateTime: Date | undefined;
+};
+//# sourceMappingURL=useSelectedDate.d.ts.map

package/dist/cjs/calendar/hooks/useSelectedDate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectedDate.d.ts","sourceRoot":"","sources":["../../../../src/calendar/hooks/useSelectedDate.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAA;AAG3D;;;;GAIG;AACH,eAAO,MAAM,eAAe;UAAqC,YAAY;;;;;;CAW5E,CAAA"}

package/dist/cjs/calendar/hooks/useSelectedDate.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useSelectedDate = void 0;
+const utils_1 = require("../utils");
+/**
+ * Calculate the selected dates
+ * If we are in single calendar mode, will use the startDate as selected date
+ * Memoized so will only recalculate when selectedDates or mode changes
+ */
+const useSelectedDate = ({ selectedDates, mode }) => {
+    const currentDateTime = (0, utils_1.isFrom)(mode) || (0, utils_1.isExact)(mode) ? selectedDates === null || selectedDates === void 0 ? void 0 : selectedDates.startDate : selectedDates === null || selectedDates === void 0 ? void 0 : selectedDates.endDate;
+    const minSelectedDateTime = (selectedDates === null || selectedDates === void 0 ? void 0 : selectedDates.startDate) || undefined;
+    const maxSelectedDateTime = (selectedDates === null || selectedDates === void 0 ? void 0 : selectedDates.endDate) || undefined;
+    return {
+        currentDateTime,
+        maxSelectedDateTime,
+        minSelectedDateTime
+    };
+};
+exports.useSelectedDate = useSelectedDate;

package/dist/cjs/calendar/index.d.ts

@@ -0,0 +1,5 @@
+export * from './calendar';
+export { default } from './calendar';
+export * from './calendar.types';
+export * from './consts';
+//# sourceMappingURL=index.d.ts.map

package/dist/cjs/calendar/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/calendar/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAA;AAC1B,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AACpC,cAAc,kBAAkB,CAAA;AAChC,cAAc,UAAU,CAAA"}

package/dist/cjs/calendar/index.js

@@ -0,0 +1,25 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+__exportStar(require("./calendar"), exports);
+var calendar_1 = require("./calendar");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(calendar_1).default; } });
+__exportStar(require("./calendar.types"), exports);
+__exportStar(require("./consts"), exports);

package/dist/cjs/calendar/theme.d.ts

@@ -0,0 +1,8 @@
+declare const _default: {
+    baseStyle: {};
+    defaultProps: {};
+    sizes: {};
+    variants: {};
+};
+export default _default;
+//# sourceMappingURL=theme.d.ts.map

package/dist/cjs/calendar/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/calendar/theme.ts"],"names":[],"mappings":";;;;;;AAQA,wBAKC"}

package/dist/cjs/calendar/theme.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const baseStyle = {};
+const defaultProps = {};
+const sizes = {};
+const variants = {};
+exports.default = {
+    baseStyle,
+    defaultProps,
+    sizes,
+    variants
+};

package/dist/cjs/calendar/utils.d.ts

@@ -0,0 +1,26 @@
+import { CalendarMode, DateRange, FlowDirection, TimeItem, TimeUnitMode } from './calendar.types';
+export declare const isExact: (mode?: CalendarMode) => boolean;
+export declare const isFrom: (mode?: CalendarMode) => boolean;
+export declare const isTo: (mode?: CalendarMode) => boolean;
+export declare const isRange: (mode?: CalendarMode) => boolean;
+export declare const isDay: (timeUnitMode?: TimeUnitMode) => boolean;
+export declare const isMonth: (timeUnitMode?: TimeUnitMode) => boolean;
+export declare const isYear: (timeUnitMode?: TimeUnitMode) => boolean;
+/**
+ * Helper to get the next date item when iterating between two dates
+ * @param date current date in the iteration
+ * @param timeUnitMode time unit mode for day, month, year
+ */
+export declare const getNextDate: (date: Date, timeUnitMode?: TimeUnitMode) => Date;
+export declare const processSelectMonth: (clickedDate: Date, mode: CalendarMode, boundaries?: DateRange) => Date;
+/**
+ * Helper that calcs what new date we should set as viewDate when a year is clicked
+ *
+ * @param clickedDate date of year clicked
+ * @param newDate pre-processed potential new view date
+ * @param mode calendar mode
+ * @param boundaries boundaries of date range
+ */
+export declare const processSelectYear: (clickedData: Date, mode: CalendarMode, boundaries?: DateRange) => Date;
+export declare const processViewDate: (viewDate: Date, direction: FlowDirection, timeUnitMode: TimeUnitMode, calendarItems?: TimeItem[]) => Date | null;
+//# sourceMappingURL=utils.d.ts.map

package/dist/cjs/calendar/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../src/calendar/utils.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,aAAa,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAA;AAGjG,eAAO,MAAM,OAAO,UAAW,YAAY,YAAqB,CAAA;AAChE,eAAO,MAAM,MAAM,UAAW,YAAY,YAAoB,CAAA;AAC9D,eAAO,MAAM,IAAI,UAAW,YAAY,YAAkB,CAAA;AAC1D,eAAO,MAAM,OAAO,UAAW,YAAY,YAAqB,CAAA;AAEhE,eAAO,MAAM,KAAK,kBAAmB,YAAY,YAA2B,CAAA;AAC5E,eAAO,MAAM,OAAO,kBAAmB,YAAY,YAA6B,CAAA;AAChF,eAAO,MAAM,MAAM,kBAAmB,YAAY,YAA4B,CAAA;AAE9E;;;;GAIG;AACH,eAAO,MAAM,WAAW,SAAU,IAAI,iBAAiB,YAAY,SAMlE,CAAA;AAED,eAAO,MAAM,kBAAkB,gBAAiB,IAAI,QAAQ,YAAY,eAAe,SAAS,SAkB/F,CAAA;AAED;;;;;;;GAOG;AACH,eAAO,MAAM,iBAAiB,gBAAiB,IAAI,QAAQ,YAAY,eAAe,SAAS,SAmB9F,CAAA;AAED,eAAO,MAAM,eAAe,aAChB,IAAI,aACH,aAAa,gBACV,YAAY,kBACV,QAAQ,EAAE,gBAoB3B,CAAA"}

package/dist/cjs/calendar/utils.js

@@ -0,0 +1,95 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.processViewDate = exports.processSelectYear = exports.processSelectMonth = exports.getNextDate = exports.isYear = exports.isMonth = exports.isDay = exports.isRange = exports.isTo = exports.isFrom = exports.isExact = void 0;
+const utils_1 = require("../utils");
+const consts_1 = require("./consts");
+const isExact = (mode) => mode === 'exact';
+exports.isExact = isExact;
+const isFrom = (mode) => mode === 'from';
+exports.isFrom = isFrom;
+const isTo = (mode) => mode === 'to';
+exports.isTo = isTo;
+const isRange = (mode) => mode === 'range';
+exports.isRange = isRange;
+const isDay = (timeUnitMode) => timeUnitMode === 'day';
+exports.isDay = isDay;
+const isMonth = (timeUnitMode) => timeUnitMode === 'month';
+exports.isMonth = isMonth;
+const isYear = (timeUnitMode) => timeUnitMode === 'year';
+exports.isYear = isYear;
+/**
+ * Helper to get the next date item when iterating between two dates
+ * @param date current date in the iteration
+ * @param timeUnitMode time unit mode for day, month, year
+ */
+const getNextDate = (date, timeUnitMode) => {
+    const { utcYear, utcMonth, utcDate } = (0, utils_1.getDateUTCValue)(date);
+    if ((0, exports.isDay)(timeUnitMode))
+        return (0, utils_1.generateDateByUTCValue)(utcYear, utcMonth, utcDate + 1);
+    if ((0, exports.isMonth)(timeUnitMode))
+        return (0, utils_1.generateDateByUTCValue)(utcYear, utcMonth + 1, utcDate);
+    return (0, utils_1.generateDateByUTCValue)(utcYear + 1, utcMonth, utcDate);
+};
+exports.getNextDate = getNextDate;
+const processSelectMonth = (clickedDate, mode, boundaries) => {
+    const date = clickedDate;
+    const minDateTime = new Date(consts_1.minDateTimestamp);
+    const { utcYear, utcMonth } = (0, utils_1.getDateUTCValue)(clickedDate);
+    if ((0, exports.isTo)(mode)) {
+        const selectDayInMonth = (0, utils_1.generateDateByUTCValue)(utcYear, utcMonth + 1, 0).getUTCDate();
+        if ((boundaries === null || boundaries === void 0 ? void 0 : boundaries.endDate) && (0, utils_1.sameYearSameMonth)(clickedDate, boundaries === null || boundaries === void 0 ? void 0 : boundaries.endDate))
+            return boundaries === null || boundaries === void 0 ? void 0 : boundaries.endDate;
+        return (0, utils_1.generateDateByUTCValue)(utcYear, utcMonth, selectDayInMonth);
+    }
+    if ((0, exports.isFrom)(mode) && (boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate) && (0, utils_1.sameYearSameMonth)(clickedDate, boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate))
+        return boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate;
+    if ((0, exports.isExact)(mode) && (0, utils_1.sameYear)(clickedDate, minDateTime))
+        return minDateTime;
+    return (boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate) && date < (boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate) ? boundaries.startDate : date;
+};
+exports.processSelectMonth = processSelectMonth;
+/**
+ * Helper that calcs what new date we should set as viewDate when a year is clicked
+ *
+ * @param clickedDate date of year clicked
+ * @param newDate pre-processed potential new view date
+ * @param mode calendar mode
+ * @param boundaries boundaries of date range
+ */
+const processSelectYear = (clickedData, mode, boundaries) => {
+    const { utcYear, utcMonth } = (0, utils_1.getDateUTCValue)(clickedData);
+    const minDateTime = new Date(consts_1.minDateTimestamp);
+    const date = clickedData;
+    if ((0, exports.isTo)(mode)) {
+        const selectDayInMonth = (0, utils_1.generateDateByUTCValue)(utcYear, utcMonth + 1, 0).getUTCDate();
+        const selectMonthInYear = 11;
+        if ((boundaries === null || boundaries === void 0 ? void 0 : boundaries.endDate) && (0, utils_1.sameYear)(clickedData, boundaries === null || boundaries === void 0 ? void 0 : boundaries.endDate))
+            return boundaries.endDate;
+        return (0, utils_1.generateDateByUTCValue)(clickedData.getUTCFullYear(), selectMonthInYear, selectDayInMonth);
+    }
+    if ((0, exports.isFrom)(mode) && (boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate) && (0, utils_1.sameYear)(clickedData, boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate))
+        return boundaries.startDate;
+    if ((0, exports.isExact)(mode) && (0, utils_1.sameYear)(clickedData, minDateTime))
+        return minDateTime;
+    return (boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate) && date < (boundaries === null || boundaries === void 0 ? void 0 : boundaries.startDate) ? boundaries.startDate : date;
+};
+exports.processSelectYear = processSelectYear;
+const processViewDate = (viewDate, direction, timeUnitMode, calendarItems) => {
+    const { utcYear, utcMonth } = (0, utils_1.getDateUTCValue)(viewDate);
+    if ((0, exports.isDay)(timeUnitMode)) {
+        const newMonth = (0, utils_1.generateDateByUTCValue)(utcYear, utcMonth + (direction === 'next' ? 1 : -1));
+        return newMonth;
+    }
+    if ((0, exports.isMonth)(timeUnitMode)) {
+        const newMonth = (0, utils_1.generateDateByUTCValue)(utcYear + (direction === 'next' ? 1 : -1), 0);
+        return newMonth;
+    }
+    if (calendarItems) {
+        const date = calendarItems[direction === 'next' ? calendarItems.length - 1 : 0].date;
+        const year = date.getUTCFullYear();
+        const newViewDate = (0, utils_1.generateDateByUTCValue)(year + (direction === 'next' ? 1 : -consts_1.viewYears), 0);
+        return newViewDate;
+    }
+    return null;
+};
+exports.processViewDate = processViewDate;

package/dist/cjs/core/theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/core/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,MAAM,EAAa,WAAW,EAAe,MAAM,4BAA4B,CAAA;AAI/F,OAAqB,EAAE,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAA;AACnF,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAkB,MAAM,UAAU,CAAA;AAErE,KAAK,cAAc,CAAC,QAAQ,SAAS,MAAM,QAAQ,IAAI,WAAW,CAAC,MAAM,QAAQ,CAAC,QAAQ,CAAC,GAAG,SAAS,GAAG,SAAS,CAAC,CAAA;AAEpH,8CAA8C;AAC9C,MAAM,MAAM,QAAQ,GAAG;IACrB,CAAC,IAAI,EAAE,MAAM,EAAE,YAAY,CAAC,EAAE,GAAG,GAAG,CAAC,KAAK,EAAE,MAAM,KAAK,GAAG,CAAA;IAC1D,SAAS,EAAE,cAAc,CAAC,YAAY,CAAC,CAAA;IACvC,OAAO,EAAE,cAAc,CAAC,SAAS,CAAC,CAAA;IAClC,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAA;IAC/B,QAAQ,EAAE,cAAc,CAAC,WAAW,CAAC,CAAA;IACrC,IAAI,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IAC7B,QAAQ,EAAE,cAAc,CAAC,WAAW,CAAC,CAAA;IACrC,UAAU,EAAE,cAAc,CAAC,aAAa,CAAC,CAAA;IACzC,MAAM,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IAC/B,SAAS,EAAE,cAAc,CAAC,YAAY,CAAC,CAAA;IACvC,MAAM,EAAE,cAAc,CAAC,SAAS,CAAC,CAAA;IACjC,MAAM,EAAE,cAAc,CAAC,SAAS,CAAC,CAAA;IACjC,IAAI,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IAC7B,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAA;IAC/B,SAAS,EAAE,cAAc,CAAC,YAAY,CAAC,CAAA;IACvC,UAAU,EAAE,cAAc,CAAC,aAAa,CAAC,CAAA;IACzC,MAAM,EAAE,cAAc,CAAC,UAAU,CAAC,CAAA;CACnC,CAAA;AAED,6EAA6E;AAC7E,wBAAgB,WAAW,CAAC,UAAU,EAAE,kBAAkB,GAAG,QAAQ,CAEpE;AAED,0DAA0D;AAC1D,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,YAAY,EAAE,KAAK,EAAE,CAAC,+BAIhE;AAED,sEAAsE;AACtE,QAAA,MAAM,EAAE,UAA6B,CAAA;AAMrC,OAAO,EAAE,EAAE,EAAE,CAAA;AAEb;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,SAAS,EAAE,MAAM,QAAQ,CAAC,YAAY,CAAC,EAAE,KAAK,GAAE,GAAQ,aA4BtF;AAED,6CAA6C;AAC7C,wBAAgB,KAAK,CAAC,IAAI,EAAE,MAAM,QAAQ,GAAG,SAAS,EAAE,YAAY,CAAC,EAAE,GAAG,OAGzE;AAED,gDAAgD;AAChD,wBAAgB,QAAQ,IAAI,QAAQ,CAEnC"}
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../../src/core/theme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAS,MAAM,EAAa,WAAW,EAAe,MAAM,4BAA4B,CAAA;AAI/F,OAAqB,EAAE,YAAY,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAA;AACnF,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAkB,MAAM,UAAU,CAAA;AAErE,KAAK,cAAc,CAAC,QAAQ,SAAS,MAAM,QAAQ,IAAI,WAAW,CAAC,MAAM,QAAQ,CAAC,QAAQ,CAAC,GAAG,SAAS,GAAG,SAAS,CAAC,CAAA;AAEpH,8CAA8C;AAC9C,MAAM,MAAM,QAAQ,GAAG;IACrB,CAAC,IAAI,EAAE,MAAM,EAAE,YAAY,CAAC,EAAE,GAAG,GAAG,CAAC,KAAK,EAAE,MAAM,KAAK,GAAG,CAAA;IAC1D,SAAS,EAAE,cAAc,CAAC,YAAY,CAAC,CAAA;IACvC,OAAO,EAAE,cAAc,CAAC,SAAS,CAAC,CAAA;IAClC,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAA;IAC/B,QAAQ,EAAE,cAAc,CAAC,WAAW,CAAC,CAAA;IACrC,IAAI,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IAC7B,QAAQ,EAAE,cAAc,CAAC,WAAW,CAAC,CAAA;IACrC,UAAU,EAAE,cAAc,CAAC,aAAa,CAAC,CAAA;IACzC,MAAM,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IAC/B,SAAS,EAAE,cAAc,CAAC,YAAY,CAAC,CAAA;IACvC,MAAM,EAAE,cAAc,CAAC,SAAS,CAAC,CAAA;IACjC,MAAM,EAAE,cAAc,CAAC,SAAS,CAAC,CAAA;IACjC,IAAI,EAAE,cAAc,CAAC,OAAO,CAAC,CAAA;IAC7B,KAAK,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAA;IAC/B,SAAS,EAAE,cAAc,CAAC,YAAY,CAAC,CAAA;IACvC,UAAU,EAAE,cAAc,CAAC,aAAa,CAAC,CAAA;IACzC,MAAM,EAAE,cAAc,CAAC,UAAU,CAAC,CAAA;CACnC,CAAA;AAED,6EAA6E;AAC7E,wBAAgB,WAAW,CAAC,UAAU,EAAE,kBAAkB,GAAG,QAAQ,CAEpE;AAED,0DAA0D;AAC1D,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,YAAY,EAAE,KAAK,EAAE,CAAC,+BAIhE;AAED,sEAAsE;AACtE,QAAA,MAAM,EAAE,UAA6B,CAAA;AAMrC,OAAO,EAAE,EAAE,EAAE,CAAA;AAEb;;;;GAIG;AACH,wBAAgB,cAAc,CAAC,SAAS,EAAE,MAAM,QAAQ,CAAC,YAAY,CAAC,EAAE,KAAK,GAAE,GAAQ,aA0BtF;AAED,6CAA6C;AAC7C,wBAAgB,KAAK,CAAC,IAAI,EAAE,MAAM,QAAQ,GAAG,SAAS,EAAE,YAAY,CAAC,EAAE,GAAG,OAGzE;AAED,gDAAgD;AAChD,wBAAgB,QAAQ,IAAI,QAAQ,CAEnC"}

package/dist/cjs/core/theme.js

@@ -56,15 +56,13 @@ function useStyleConfig(component, props = {}) {
         const sizeStyles = (_b = (0, utils_1.runIfFn)(sizes === null || sizes === void 0 ? void 0 : sizes[size], mergedProps)) !== null && _b !== void 0 ? _b : {};
         const variantStyles = (_c = (0, utils_1.runIfFn)(variants === null || variants === void 0 ? void 0 : variants[variant], mergedProps)) !== null && _c !== void 0 ? _c : {};
         let styles = {};
-        if (parts.length > 0) {
+        if (parts.length > 0)
             parts.forEach((part) => {
                 var _a, _b, _c;
                 styles[part] = (0, utils_1.merge)((_a = baseStyles[part]) !== null && _a !== void 0 ? _a : {}, (_b = sizeStyles[part]) !== null && _b !== void 0 ? _b : {}, (_c = variantStyles[part]) !== null && _c !== void 0 ? _c : {});
             });
-        }
-        else {
+        else
             styles = (0, utils_1.merge)(baseStyles, sizeStyles, variantStyles);
-        }
         return styles;
     }, [colorScheme, size, variant]);
 }

package/dist/cjs/datePicker/components/pickerPanel.d.ts

@@ -0,0 +1,6 @@
+import { DatePickerPopupPosition } from '../datePicker.types';
+export declare const PickerPanel: import("styled-components").StyledComponent<import("../../core").VuiComponent<"div", import("../../panel").PanelProps>, import("styled-components").DefaultTheme, {
+    popupPosition: DatePickerPopupPosition;
+    showPopupBelow: boolean;
+}, never>;
+//# sourceMappingURL=pickerPanel.d.ts.map

package/dist/cjs/datePicker/components/pickerPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"pickerPanel.d.ts","sourceRoot":"","sources":["../../../../src/datePicker/components/pickerPanel.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,uBAAuB,EAAE,MAAM,qBAAqB,CAAA;AAE7D,eAAO,MAAM,WAAW;mBAAkC,uBAAuB;oBAAkB,OAAO;SAiBzG,CAAA"}

package/dist/cjs/datePicker/components/pickerPanel.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.PickerPanel = void 0;
+const core_1 = require("../../core");
+const panel_1 = __importDefault(require("../../panel"));
+exports.PickerPanel = (0, core_1.styled)(panel_1.default) `
+  display: flex;
+  flex-direction: column;
+  padding: 0px;
+  position: absolute;
+  z-index: 999;
+  ${p => (p.popupPosition === 'right' ? 'right: 0;' : 'left: 0;')}
+  ${p => p.showPopupBelow
+    ? (0, core_1.css) `
+          margin-top: 50px;
+          top: 0;
+        `
+    : (0, core_1.css) `
+          bottom: 0;
+          margin-bottom: 50px;
+        `}
+`;

package/dist/cjs/datePicker/dateInput.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+import { InputProps } from '../input';
+type Props = InputProps & {
+    initialDate?: Date;
+    onChange: (date?: Date) => void;
+    onValidate: (date?: Date) => string;
+    setValidateStatus: (inValid: boolean) => void;
+};
+export declare const DateInput: ({ initialDate, onChange, onValidate, setValidateStatus, ...rest }: Props) => JSX.Element;
+export {};
+//# sourceMappingURL=dateInput.d.ts.map

package/dist/cjs/datePicker/dateInput.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"dateInput.d.ts","sourceRoot":"","sources":["../../../src/datePicker/dateInput.tsx"],"names":[],"mappings":";AAEA,OAAO,EAAS,UAAU,EAAE,MAAM,UAAU,CAAA;AAI5C,KAAK,KAAK,GAAG,UAAU,GAAG;IACxB,WAAW,CAAC,EAAE,IAAI,CAAA;IAClB,QAAQ,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,IAAI,CAAA;IAC/B,UAAU,EAAE,CAAC,IAAI,CAAC,EAAE,IAAI,KAAK,MAAM,CAAA;IACnC,iBAAiB,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;CAC9C,CAAA;AAED,eAAO,MAAM,SAAS,sEAAuE,KAAK,gBA+DjG,CAAA"}

package/dist/cjs/datePicker/dateInput.js

@@ -0,0 +1,92 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DateInput = void 0;
+const react_1 = __importStar(require("react"));
+const input_1 = require("../input");
+const t_1 = require("../t");
+const utils_1 = require("../utils");
+const DateInput = (_a) => {
+    var { initialDate, onChange, onValidate, setValidateStatus } = _a, rest = __rest(_a, ["initialDate", "onChange", "onValidate", "setValidateStatus"]);
+    const formattedInitialDate = initialDate ? (0, utils_1.formatDate)(initialDate, 'YYYY-MM-DD', { timeZone: 'UTC' }) : '';
+    const [dateInput, setDateInput] = (0, react_1.useState)(formattedInitialDate);
+    const [dateInputValidated, setDateInputValidated] = (0, react_1.useState)(true);
+    const [errorMessage, setErrorMessage] = (0, react_1.useState)('');
+    const isValidDate = (dateString) => {
+        if (!(0, utils_1.validateDateFormat)(dateString))
+            return false;
+        if (!(0, utils_1.parseIsoDate)(dateString))
+            return false;
+        return true;
+    };
+    const handleOnBlur = () => {
+        setDateInputValidated(!dateInput);
+        const parsedDate = (0, utils_1.parseIsoDate)(dateInput);
+        if (parsedDate) {
+            setDateInput((0, utils_1.formatDate)(parsedDate, 'YYYY-MM-DD', { timeZone: 'UTC' }));
+            const validateMessage = onValidate(parsedDate);
+            !validateMessage && onChange(parsedDate);
+            setDateInputValidated(!validateMessage);
+            setErrorMessage(validateMessage);
+        }
+    };
+    (0, react_1.useEffect)(() => {
+        setDateInput(formattedInitialDate);
+        const validation = onValidate(initialDate);
+        setDateInputValidated(!validation);
+        setValidateStatus(!validation);
+        setErrorMessage(validation);
+    }, [initialDate]);
+    (0, react_1.useEffect)(() => {
+        if (dateInput) {
+            const isValidDateString = isValidDate(dateInput);
+            setValidateStatus(isValidDateString);
+            if (!(0, utils_1.validateDateFormat)(dateInput))
+                setErrorMessage('Supported format is YYYY-MM-DD');
+            else if (!(0, utils_1.parseIsoDate)(dateInput))
+                setErrorMessage('Invalid date');
+            else {
+                const parsedDate = (0, utils_1.parseIsoDate)(dateInput);
+                const validateMessage = onValidate(parsedDate);
+                !validateMessage && onChange(parsedDate);
+                setDateInputValidated(!validateMessage);
+                setErrorMessage(validateMessage);
+            }
+        }
+    }, [dateInput]);
+    return (react_1.default.createElement(input_1.Input, Object.assign({ borderColor: dateInputValidated ? 'sandstone.main' : 'energyRed.main', className: "dateInput", "data-testid": "test-date-input", errorText: !dateInputValidated && react_1.default.createElement(t_1.T, { size: "md" }, errorMessage), onBlur: handleOnBlur, onChange: e => setDateInput(e.target.value), placeholder: "YYYY-MM-DD", size: "md", state: !dateInputValidated && !errorMessage ? 'error' : 'default', value: dateInput }, rest)));
+};
+exports.DateInput = DateInput;

package/dist/cjs/datePicker/datePicker.d.ts

@@ -0,0 +1,5 @@
+import { DatePickerProps } from './datePicker.types';
+/** [Beta] Select or input a date. */
+export declare const DatePicker: import("../core").VuiComponent<"span", DatePickerProps>;
+export default DatePicker;
+//# sourceMappingURL=datePicker.d.ts.map

package/dist/cjs/datePicker/datePicker.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"datePicker.d.ts","sourceRoot":"","sources":["../../../src/datePicker/datePicker.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAMpD,qCAAqC;AACrC,eAAO,MAAM,UAAU,yDAuJrB,CAAA;AAIF,eAAe,UAAU,CAAA"}