inviton-powerduck 0.0.154 → 0.0.155

package/components/input/plugins/daterangepicker/jquery.daterangepicker.ts

@@ -4,10 +4,12 @@
 // www.jszen.com
 
 /* eslint-disable */
-import { DateWrapper } from '../../../../common/date-wrapper';
+import { Temporal } from '@js-temporal/polyfill';
 import DateUtils from '../../../../common/utils/date-utils';
+import TemporalUtils from '../../../../common/utils/temporal-utils';
 import DaterangePickerConfig from './daterangepicker-config';
 import './daterangepicker.css';
+import { utcEpochMilliseconds } from '../../../../common/extensions/temporal-extensions';
 
 (function ($: any) {
 	$.dateRangePickerLanguages = {
@@ -256,41 +258,184 @@ import './daterangepicker.css';
 		},
 	};
 
-	const startOfDay = (date: DateWrapper | number): DateWrapper => {
-		const d = new DateWrapper(date);
-		d.setHours(
-			0,
-			0,
-			0,
-			0,
-		);
-		return d;
+	const dateNow = () => Temporal.Now.plainDateTimeISO();
+	const ensureTemporal = (date: Temporal.PlainDateTime | number | string): Temporal.PlainDateTime => {
+		if (date == null) {
+			return null;
+		}
+
+		if ((date as Temporal.PlainDateTime).toPlainDate) {
+			return date as Temporal.PlainDateTime;
+		} else if (typeof date == 'number') {
+			return TemporalUtils.fromEpochMs(date as number);
+		} else if (typeof date == 'string') {
+			return Temporal.PlainDateTime.from(date as string);
+		}
+	}
+
+	const startOfDay = (date: Temporal.PlainDateTime | number): Temporal.PlainDateTime => {
+		return ensureTemporal(date)?.with({
+			hour: 0,
+			minute: 0,
+			second: 0,
+			millisecond: 0,
+			microsecond: 0
+		});
 	};
 
-	const getHourString = (date: DateWrapper): string => {
+	const getJsDateDay = (date: Temporal.PlainDateTime): number => {
+		//returns date number like in old JS Date object
+		const day = date.dayOfWeek;
+		if (day == 7) {
+			return 0;
+		}
+
+		return day;
+	}
+
+	const getHourString = (date: Temporal.PlainDateTime): string => {
 		if (date == null) {
 			return null;
 		}
 
-		return date.toLocaleTimeString({
+		return ensureTemporal(date).toLocaleString('sk', {
 			hour: '2-digit',
-			language: 'sk',
 			hour12: false,
 		});
 	};
 
-	const getMinuteString = (date: DateWrapper): string => {
+	const getMinuteString = (date: Temporal.PlainDateTime): string => {
 		if (date == null) {
 			return null;
 		}
 
-		return date.toLocaleTimeString({
+		return ensureTemporal(date).toLocaleString('sk', {
 			minute: '2-digit',
 		});
 	};
 
-	$.fn.dateRangePicker = function (opt) {
-		if (!opt) { opt = {}; }
+	interface DaterangePickerArgsCustomCellRenderArgs {
+		attributesHtml: string;
+		attributes: { [index: string]: string };
+		day: DaterangePickerArgsCustomCellRenderDay;
+	}
+
+	interface DaterangePickerArgsCustomCellRenderDay {
+		date: Temporal.PlainDateTime;
+		day: number;
+		extraClass?: string;
+		time: number;
+		tooltip?: string;
+		type: 'toMonth' | 'nextMonth' | 'lastMonth';
+		valid: boolean;
+	}
+
+	interface DateRangePickerOptions {
+		autoClose: boolean;
+		format: string;
+		separator: string;
+		language: string; // "auto" in your example, but allow any locale tag
+		startOfWeek: 'sunday' | 'monday';
+
+		getValue: () => string;
+		setValue: (s: string, startText?: string, endText?: string) => void;
+
+		startDate: Temporal.PlainDateTime
+		endDate: Temporal.PlainDateTime
+
+		time: {
+			enabled: boolean;
+		};
+
+		minDays: number;
+		maxDays: number;
+
+		leftOffset: () => number
+		showShortcuts: boolean;
+
+		// structure is unclear from comments (arrays of numbers/strings/keywords)
+		shortcuts: any;
+
+		// structure unknown
+		customShortcuts: any[];
+
+		calendarPlacement: string; // 'body' in example; leave open
+		container: string;         // 'body' in example
+
+		alwaysOpen: boolean;
+		singleDate: boolean;
+		lookBehind: boolean;
+
+		// false in example, some libs accept 'week'/'month'. Unknown here.
+		batchMode: 'week-range' | 'month-range' | 'week' | 'workweek' | 'weekend' | 'month'
+		duration: number;
+		stickyMonths: boolean;
+
+		// attribute bags for day cells are unknown
+		dayDivAttrs: any[];
+		dayTdAttrs: any[];
+
+		selectForward: boolean;
+		selectBackward: boolean;
+
+		applyBtnClass: string;
+
+		// 'auto' in example; some libs allow boolean/number. Keep flexible or crash.
+		singleMonth: 'auto' | boolean
+
+		// Tooltip over range hover
+		hoveringTooltip: (
+			days: number,
+			startTime: Temporal.PlainDateTime,
+			hoveringTime: Temporal.PlainDateTime
+		) => string;
+
+		showTopbar: boolean;
+		swapTime: boolean;
+		showWeekNumbers: boolean;
+
+		start: Temporal.PlainDateTime
+		end: Temporal.PlainDateTime
+		startTime: Temporal.PlainDateTime
+		endTime: Temporal.PlainDateTime;
+		isTouchDevice: boolean
+		startWeek: any
+
+		defaultTime: Temporal.PlainDateTime
+		defaultEndTime: Temporal.PlainDateTime
+		ensureMonthContinuity: boolean
+
+		month1: Temporal.PlainDateTime
+		month2: Temporal.PlainDateTime
+
+		// date will be the first day of a week
+		getWeekNumber: (date: Temporal.PlainDateTime) => number;
+
+		// Animations/symbols are null in example; likely function/string but unknown
+		customOpenAnimation: any
+		customCloseAnimation: any
+		customArrowPrevSymbol: any
+		customArrowNextSymbol: any
+
+		displayMode: () => 'modal' | 'below-input';
+		beforeShowDay: (d: Temporal.PlainDateTime) => void
+		maxDaysTooltip?: (maxDays: number) => string
+		hideYearInMonthName: boolean
+		extraClass: string
+		customTopBar: string | (() => string)
+		showCustomValues: boolean
+		customValueLabel: string
+		customValues: any[]
+		getCellHtml?: (args: DaterangePickerArgsCustomCellRenderArgs) => string;
+		showDateFilter?: (date: Temporal.PlainDateTime, day: number) => string | number
+	}
+
+	$.fn.dateRangePicker = function (opt: DateRangePickerOptions) {
+		if (!opt) {
+			opt = {} as any
+		}
+
+
 
 		opt = $.extend(
 			true,
@@ -348,9 +493,9 @@ import './daterangepicker.css';
 				showTopbar: true,
 				swapTime: false,
 				showWeekNumbers: false,
-				getWeekNumber(date) // date will be the first day of a week
+				getWeekNumber(date: Temporal.PlainDateTime) // date will be the first day of a week
 				{
-					return DateUtils.getWeekNumber(date);
+					return date.weekOfYear
 				},
 				customOpenAnimation: null,
 				customCloseAnimation: null,
@@ -360,8 +505,8 @@ import './daterangepicker.css';
 			opt,
 		);
 
-		opt.start = false;
-		opt.end = false;
+		opt.start = null;
+		opt.end = null;
 
 		opt.startWeek = false;
 
@@ -369,19 +514,31 @@ import './daterangepicker.css';
 		opt.isTouchDevice = 'ontouchstart' in window || (navigator as any).msMaxTouchPoints;
 
 		// if it is a touch device, hide hovering tooltip
-		if (opt.isTouchDevice) { opt.hoveringTooltip = false; }
+		if (opt.isTouchDevice) {
+			opt.hoveringTooltip = null;
+		}
 
 		// show one month on mobile devices
-		let singleMonth = opt.singleMonth || 'auto';
-		if (singleMonth == 'auto') { singleMonth = $(window).width() < 480; }
+		let singleMonth: boolean = (opt.singleMonth ?? 'auto') as any;
+		if ((singleMonth as any) == 'auto') {
+			singleMonth = ($(window).width() < 480) as any;
+		}
 
-		if (singleMonth) { opt.stickyMonths = false; }
+		if (singleMonth) {
+			opt.stickyMonths = false;
+		}
 
-		if (!opt.showTopbar) { opt.autoClose = true; }
+		if (!opt.showTopbar) {
+			opt.autoClose = true;
+		}
 
-		if (opt.startDate && typeof opt.startDate == 'string') { opt.startDate = DateUtils.getDateWrapperFromFormat(opt.startDate, opt.format); }
+		if (opt.startDate && typeof opt.startDate == 'string') {
+			opt.startDate = DateUtils.getTemporalFromFormat(opt.startDate, opt.format);
+		}
 
-		if (opt.endDate && typeof opt.endDate == 'string') { opt.endDate = DateUtils.getDateWrapperFromFormat(opt.endDate, opt.format); }
+		if (opt.endDate && typeof opt.endDate == 'string') {
+			opt.endDate = DateUtils.getTemporalFromFormat(opt.endDate, opt.format);
+		}
 
 		const languages = getLanguages();
 		let box;
@@ -409,23 +566,38 @@ import './daterangepicker.css';
 			open(0);
 		}
 
+		const getStartMs = () => {
+			if (opt.start) {
+				return opt.start[utcEpochMilliseconds]();
+			}
+
+			return 0;
+		}
+
+		const getEndMs = () => {
+			if (opt.end) {
+				return opt.end[utcEpochMilliseconds]();
+			}
+
+			return 0;
+		}
+
 		// expose some api
 		$(this).data('dateRangePicker', {
 			setStart(d1) {
 				if (typeof d1 == 'string') {
-					d1 = DateUtils.getDateWrapperFromFormat(d1, opt.format);
+					d1 = DateUtils.getTemporalFromFormat(d1, opt.format);
 				}
 
-				opt.end = false;
+				opt.end = false as any; //TODO: Could be null?
 				setSingleDate(d1);
 
 				return this;
 			},
 			setEnd(d2, silent) {
-				const start = DateWrapper.getCurrent();
-				start.setTime(opt.start);
+				const start = opt.start;
 				if (typeof d2 == 'string') {
-					d2 = DateUtils.getDateWrapperFromFormat(d2, opt.format);
+					d2 = DateUtils.getTemporalFromFormat(d2, opt.format);
 				}
 
 				setDateRange(
@@ -441,8 +613,8 @@ import './daterangepicker.css';
 				silent,
 			) {
 				if (typeof d1 == 'string' && typeof d2 == 'string') {
-					d1 = DateUtils.getDateWrapperFromFormat(d1, opt.format);
-					d2 = DateUtils.getDateWrapperFromFormat(d2, opt.format);
+					d1 = DateUtils.getTemporalFromFormat(d1, opt.format);
+					d2 = DateUtils.getTemporalFromFormat(d2, opt.format);
 				}
 
 				setDateRange(
@@ -539,9 +711,19 @@ import './daterangepicker.css';
 			// showSelectedInfo();
 
 			let defaultTopText = '';
-			if (opt.singleDate) { defaultTopText = translate('default-single'); } else if (opt.minDays && opt.maxDays) { defaultTopText = translate('default-range'); } else if (opt.minDays) { defaultTopText = translate('default-more'); } else if (opt.maxDays) { defaultTopText = translate('default-less'); } else { defaultTopText = translate('default-default'); }
+			if (opt.singleDate) {
+				defaultTopText = translate('default-single');
+			} else if (opt.minDays && opt.maxDays) {
+				defaultTopText = translate('default-range');
+			} else if (opt.minDays) {
+				defaultTopText = translate('default-more');
+			} else if (opt.maxDays) {
+				defaultTopText = translate('default-less');
+			} else {
+				defaultTopText = translate('default-default');
+			}
 
-			box.find('.default-top').html(defaultTopText.replace(/%d/, opt.minDays).replace(/%d/, opt.maxDays));
+			box.find('.default-top').html(defaultTopText.replace(/%d/, opt.minDays.toString()).replace(/%d/, opt.maxDays.toString()));
 			if (singleMonth) {
 				box.addClass('single-month');
 			} else {
@@ -647,60 +829,73 @@ import './daterangepicker.css';
 
 			box.find('.apply-btn').click(() => {
 				closeDatePicker();
-				const dateRange = getDateString(new DateWrapper(opt.start)) + opt.separator + getDateString(new DateWrapper(opt.end));
+				const dateRange = getDateString(ensureTemporal(opt.start)) + opt.separator + getDateString(ensureTemporal(opt.end));
 				$(self).trigger('datepicker-apply', {
 					value: dateRange,
-					date1: new DateWrapper(opt.start),
-					date2: new DateWrapper(opt.end),
+					date1: ensureTemporal(opt.start),
+					date2: ensureTemporal(opt.end),
 				});
 			});
 
 			box.find('[custom]').click(function (this: any) {
 				const valueName = $(this).attr('custom');
-				opt.start = false;
-				opt.end = false;
+				opt.start = null;
+				opt.end = null;
 				box.find('.day.checked').removeClass('checked');
 				opt.setValue.call(selfDom, valueName);
 				checkSelectionValid();
 				showSelectedInfo(true);
 				showSelectedDays();
-				if (opt.autoClose) { closeDatePicker(); }
+				if (opt.autoClose) {
+					closeDatePicker();
+				}
 			});
 
 			box.find('[shortcut]').click(function (this: any) {
 				const shortcut = $(this).attr('shortcut');
-				let end = DateWrapper.getCurrent();
-				let start: any = false;
-				let dir;
+				let end = dateNow();
+				let start: Temporal.PlainDateTime = false as any;
+				let dir: 1 | -1;
 				if (shortcut.includes('day')) {
 					const day = parseInt(shortcut.split(',', 2)[1], 10);
-					start = new DateWrapper(DateWrapper.getCurrent().getTime() + 86400000 * day);
-					end = new DateWrapper(end.getTime() + 86400000 * (day > 0 ? 1 : -1));
+					start = dateNow().add({ milliseconds: 86400000 * day });
+					end = end.add({ milliseconds: 86400000 * (day > 0 ? 1 : -1) });
 				} else if (shortcut.includes('week')) {
 					dir = shortcut.includes('prev,') ? -1 : 1;
-					let stopDay;
-					if (dir == 1) { stopDay = opt.startOfWeek == 'monday' ? 1 : 0; } else { stopDay = opt.startOfWeek == 'monday' ? 0 : 6; }
+					const stopDayISO = opt.startOfWeek === 'monday'
+						? (dir === 1 ? 1 : 7)   // forward → Monday, backward → Sunday
+						: (dir === 1 ? 7 : 6);  // forward → Sunday,  backward → Saturday
+
+					end = end.subtract({ days: 1 });
+					while (end.dayOfWeek !== stopDayISO) {
+						end = end.add({ days: dir });
+					}
 
-					end = new DateWrapper(end.getTime() - 86400000);
-					while (end.getDay() != stopDay) { end = new DateWrapper(end.getTime() + dir * 86400000); }
-					start = new DateWrapper(end.getTime() + dir * 86400000 * 6);
+					start = end.add({ days: 6 * dir });
 				} else if (shortcut.includes('month')) {
 					dir = shortcut.includes('prev,') ? -1 : 1;
-					if (dir == 1) { start = nextMonth(end); } else { start = prevMonth(end); }
+					if (dir == 1) {
+						start = nextMonth(end);
+					} else {
+						start = prevMonth(end);
+					}
 
-					start.setDate(1);
+					start = start.with({ day: 1 });
 					end = nextMonth(start);
-					end.setDate(1);
-					end = new DateWrapper(end.getTime() - 86400000);
+					end = end.with({ day: 1 }).add({ milliseconds: -86400000 });
 				} else if (shortcut.includes('year')) {
 					dir = shortcut.includes('prev,') ? -1 : 1;
-					start = DateWrapper.getCurrent();
-					start.setFullYear(end.getFullYear() + dir);
-					start.setMonth(0);
-					start.setDate(1);
-					end.setFullYear(end.getFullYear() + dir);
-					end.setMonth(11);
-					end.setDate(31);
+					start = dateNow().with({
+						year: end.year + dir,
+						month: 1,
+						day: 1
+					});
+
+					end = end.with({
+						year: end.year + dir,
+						month: 12,
+						day: 31
+					});
 				} else if (shortcut == 'custom') {
 					const name = $(this).html();
 					if (opt.customShortcuts && opt.customShortcuts.length > 0) {
@@ -915,9 +1110,9 @@ import './daterangepicker.css';
 
 		function getValidValue(date: string, format: string) {
 			try {
-				return DateUtils.getDateWrapperFromFormat(date, format);
+				return DateUtils.getTemporalFromFormat(date, format);
 			} catch (error) {
-				return DateWrapper.getCurrent();
+				return dateNow();
 			}
 		}
 
@@ -944,9 +1139,9 @@ import './daterangepicker.css';
 			box.find('.month-wrapper').width(calculateCalendarWidth());
 		}
 
-		function renderTime(name: 'time1' | 'time2', date: DateWrapper) {
-			box.find(`.${name} input[type=range].hour-range`).val(date.getHours());
-			box.find(`.${name} input[type=range].minute-range`).val(date.getMinutes());
+		function renderTime(name: 'time1' | 'time2', date: Temporal.PlainDateTime) {
+			box.find(`.${name} input[type=range].hour-range`).val(date.hour);
+			box.find(`.${name} input[type=range].minute-range`).val(date.minute);
 			setTime(
 				name,
 				getHourString(date),
@@ -954,23 +1149,16 @@ import './daterangepicker.css';
 			);
 		}
 
-		function changeTime(name: 'start' | 'end', date: DateWrapper) {
-			if ((date as any)?._dte == null) {
-				date = new DateWrapper(date);
-			}
-
-			opt[name] = new DateWrapper(
-				date.getFullYear(),
-				date.getMonth(),
-				date.getDate(),
-				Number((opt[`${name}Time`] as DateWrapper).getHours()),
-				Number((opt[`${name}Time`] as DateWrapper).getMinutes()),
-			);
+		function changeTime(name: 'start' | 'end', date: Temporal.PlainDateTime) {
+			opt[name] = ensureTemporal(date).with({
+				hour: Number((opt[`${name}Time`] as Temporal.PlainDateTime).hour),
+				minute: Number((opt[`${name}Time`] as Temporal.PlainDateTime).minute),
+			});
 		}
 
 		function swapTime() {
-			renderTime('time1', opt.start);
-			renderTime('time2', opt.end);
+			renderTime('time1', ensureTemporal(opt.start));
+			renderTime('time2', ensureTemporal(opt.end));
 		}
 
 		function setTime(
@@ -983,28 +1171,25 @@ import './daterangepicker.css';
 			switch (name) {
 				case 'time1':
 					if (opt.start) {
-						setRange('start', new DateWrapper(opt.start));
+						setRange('start', ensureTemporal(opt.start));
 					}
 
-					setRange('startTime', new DateWrapper(opt.startTime));
+					setRange('startTime', ensureTemporal(opt.startTime));
 					break;
 				case 'time2':
 					if (opt.end) {
-						setRange('end', new DateWrapper(opt.end));
+						setRange('end', ensureTemporal(opt.end));
 					}
 
-					setRange('endTime', new DateWrapper(opt.endTime));
+					setRange('endTime', ensureTemporal(opt.endTime));
 					break;
 			}
 
-			function setRange(name: 'start' | 'startTime' | 'end' | 'endTime', timePoint: DateWrapper) {
-				opt[name] = new DateWrapper(
-					timePoint.getFullYear(),
-					timePoint.getMonth(),
-					timePoint.getDate(),
-					Number(hour || getHourString(timePoint)),
-					Number(minute || getMinuteString(timePoint)),
-				);
+			function setRange(name: 'start' | 'startTime' | 'end' | 'endTime', timePoint: Temporal.PlainDateTime) {
+				opt[name] = ensureTemporal(timePoint).with({
+					hour: Number(hour || getHourString(timePoint)),
+					minute: Number(minute || getMinuteString(timePoint)),
+				})
 			}
 			checkSelectionValid();
 			showSelectedInfo();
@@ -1012,8 +1197,8 @@ import './daterangepicker.css';
 		}
 
 		function clearSelection() {
-			opt.start = false;
-			opt.end = false;
+			opt.start = null;
+			opt.end = null;
 			box.find('.day.checked').removeClass('checked');
 			box.find('.day.last-date-selected').removeClass('last-date-selected');
 			box.find('.day.first-date-selected').removeClass('first-date-selected');
@@ -1023,86 +1208,67 @@ import './daterangepicker.css';
 			showSelectedDays();
 		}
 
-		function handleStart(time: number): number {
-			let r = time;
-			const date = new DateWrapper(time);
+		function handleStart(d: Temporal.PlainDateTime): Temporal.PlainDateTime {
+			let r = d;
+			const date = ensureTemporal(d);
 
 			if (opt.batchMode === 'week-range') {
-				const day = date.getDay(); // 0 = Sunday, 1 = Monday, ..., 6 = Saturday
-				const startOfWeekDate = new DateWrapper(date); // copy
-
-				if (opt.startOfWeek === 'monday') {
-					// ISO week starts on Monday
-					const diff = (day === 0 ? -6 : 1 - day); // if Sunday (0), go back 6 days
-					startOfWeekDate.setDate(date.getDate() + diff);
-				} else {
-					// Week starts on Sunday
-					startOfWeekDate.setDate(date.getDate() - day);
-				}
-
-				startOfWeekDate.setHours(
-					0,
-					0,
-					0,
-					0,
-				);
-				r = startOfWeekDate.getTime();
+				const dow = date.dayOfWeek; // 1..7 (Mon..Sun)
+				const daysBack = opt.startOfWeek === "monday"
+					? (dow === 7 ? 6 : dow - 1) // Mon=0 back, Sun=6 back
+					: (dow % 7);                // Sun=0 back, Mon=1 back, ...
+				r = date.with({
+					hour: 0,
+					minute: 0,
+					second: 0,
+					millisecond: 0,
+					microsecond: 0,
+					nanosecond: 0
+				}).subtract({
+					days: daysBack
+				});
 			} else if (opt.batchMode === 'month-range') {
-				const startOfMonth = new DateWrapper(
-					date.getFullYear(),
-					date.getMonth(),
-					1,
-				);
-				startOfMonth.setHours(
-					0,
-					0,
-					0,
-					0,
-				);
-				r = startOfMonth.getTime();
+				r = date.with({
+					day: 1,
+					hour: 0,
+					minute: 0,
+					second: 0,
+					millisecond: 0,
+					microsecond: 0
+				});
 			}
 
 			return r;
 		}
 
-		function handleEnd(time: number): number {
-			let r = time;
-			const date = new DateWrapper(time);
+		function handleEnd(d: Temporal.PlainDateTime): Temporal.PlainDateTime {
+			let r = d;
+			const date = ensureTemporal(d);
 
 			if (opt.batchMode === 'week-range') {
-				const day = date.getDay(); // 0 = Sunday, 1 = Monday, ..., 6 = Saturday
-				const endOfWeekDate = new DateWrapper(date); // copy
-
-				if (opt.startOfWeek === 'monday') {
-					// ISO week ends on Sunday
-					const diff = (day === 0 ? 0 : 7 - day);
-					endOfWeekDate.setDate(date.getDate() + diff);
-				} else {
-					// Week ends on Saturday
-					const diff = 6 - day;
-					endOfWeekDate.setDate(date.getDate() + diff);
-				}
-
-				endOfWeekDate.setHours(
-					23,
-					59,
-					59,
-					999,
-				);
-				r = endOfWeekDate.getTime();
+				const dow = date.dayOfWeek;
+				const diff = opt.startOfWeek === "monday"
+					? (dow === 7 ? 0 : 7 - dow) // ends on Sunday
+					: 6 - (dow % 7);            // ends on Saturday
+
+				r = date.add({ days: diff }).with({
+					hour: 23,
+					minute: 59,
+					second: 59,
+					millisecond: 999,
+					microsecond: 0,
+					nanosecond: 0
+				});
 			} else if (opt.batchMode === 'month-range') {
-				const endOfMonth = new DateWrapper(
-					date.getFullYear(),
-					date.getMonth() + 1,
-					0,
-				); // posledný deň mesiaca
-				endOfMonth.setHours(
-					23,
-					59,
-					59,
-					999,
-				);
-				r = endOfMonth.getTime();
+				r = Temporal.PlainDateTime.from({
+					year: date.year,
+					month: date.month
+				}).add({ months: 1 }).subtract({ days: 1 }).with({
+					hour: 23,
+					minute: 59,
+					second: 59,
+					millisecond: 999
+				});
 			}
 
 			return r;
@@ -1114,123 +1280,98 @@ import './daterangepicker.css';
 			const time = Number(day.attr('time'));
 			day.addClass('checked');
 
-			const date = new DateWrapper(time);
+			const date = ensureTemporal(time);
 
 			if (opt.singleDate) {
-				opt.start = time;
-				opt.end = false;
+				opt.start = date;
+				opt.end = null;
 			} else if (opt.batchMode === 'week') {
-				const start = new DateWrapper(date);
-				const end = new DateWrapper(date);
-				const dayOfWeek = date.getDay(); // 0 = Sunday, 1 = Monday, ..., 6 = Saturday
-
-				if (opt.startOfWeek === 'monday') {
-					const diffToMonday = (dayOfWeek === 0 ? -6 : 1 - dayOfWeek);
-					start.setDate(date.getDate() + diffToMonday);
-					end.setDate(start.getDate() + 6);
+				const dow = date.dayOfWeek; // 1=Mon … 7=Sun
+
+				let start: Temporal.PlainDateTime;
+				let end: Temporal.PlainDateTime;
+
+				if (opt.startOfWeek === "monday") {
+					// ISO weeks: Monday to Sunday
+					const diffToMonday = dow === 7 ? -6 : 1 - dow; // Sunday => go back 6, else back to Monday
+					start = date.add({ days: diffToMonday }).with({
+						hour: 0, minute: 0, second: 0, millisecond: 0,
+						microsecond: 0, nanosecond: 0
+					});
+					end = start.add({ days: 6 }).with({
+						hour: 23, minute: 59, second: 59, millisecond: 999,
+						microsecond: 0, nanosecond: 0
+					});
 				} else {
 					// Sunday to Saturday
-					start.setDate(date.getDate() - dayOfWeek);
-					end.setDate(start.getDate() + 6);
+					const diffToSunday = dow % 7 * -1; // dow=7 (Sunday) -> 0 back, dow=1 (Monday) -> -1 back, etc.
+					start = date.add({ days: diffToSunday }).with({
+						hour: 0, minute: 0, second: 0, millisecond: 0,
+						microsecond: 0, nanosecond: 0
+					});
+					end = start.add({ days: 6 }).with({
+						hour: 23, minute: 59, second: 59, millisecond: 999,
+						microsecond: 0, nanosecond: 0
+					});
 				}
 
-				start.setHours(
-					0,
-					0,
-					0,
-					0,
-				);
-				end.setHours(
-					23,
-					59,
-					59,
-					999,
-				);
-
-				opt.start = start.getTime();
-				opt.end = end.getTime();
+				opt.start = start;
+				opt.end = end;
 			} else if (opt.batchMode === 'workweek') {
-				const monday = new DateWrapper(date);
-				const friday = new DateWrapper(date);
-
-				const dayOfWeek = date.getDay();
-				const diffToMonday = (dayOfWeek === 0 ? -6 : 1 - dayOfWeek);
-
-				monday.setDate(date.getDate() + diffToMonday);
-				monday.setHours(
-					0,
-					0,
-					0,
-					0,
-				);
+				const dow = date.dayOfWeek; // 1=Mon … 7=Sun
+				const diffToMonday = dow === 7 ? -6 : 1 - dow; // if Sunday, go back 6 days, else back to Monday
 
-				friday.setDate(monday.getDate() + 4);
-				friday.setHours(
-					23,
-					59,
-					59,
-					999,
-				);
+				const monday = date.add({ days: diffToMonday }).with({
+					hour: 0, minute: 0, second: 0, millisecond: 0,
+					microsecond: 0, nanosecond: 0
+				});
 
-				opt.start = monday.getTime();
-				opt.end = friday.getTime();
+				const friday = monday.add({ days: 4 }).with({
+					hour: 23, minute: 59, second: 59, millisecond: 999,
+					microsecond: 0, nanosecond: 0
+				});
+
+				opt.start = monday;
+				opt.end = friday;
 			} else if (opt.batchMode === 'weekend') {
-				const saturday = new DateWrapper(date);
-				const sunday = new DateWrapper(date);
-
-				const dayOfWeek = date.getDay();
-				const diffToSaturday = 6 - dayOfWeek;
-
-				saturday.setDate(date.getDate() + diffToSaturday);
-				saturday.setHours(
-					0,
-					0,
-					0,
-					0,
-				);
+				const dow = date.dayOfWeek; // 1=Mon … 7=Sun
+
+				// In JS Date: Saturday = 6, Sunday = 0
+				// In Temporal: Saturday = 6, Sunday = 7
+				const diffToSaturday = 6 - dow;
+				const saturday = date.add({ days: diffToSaturday }).with({
+					hour: 0, minute: 0, second: 0, millisecond: 0,
+					microsecond: 0, nanosecond: 0
+				});
 
-				sunday.setDate(saturday.getDate() + 1);
-				sunday.setHours(
-					23,
-					59,
-					59,
-					999,
-				);
+				const sunday = saturday.add({ days: 1 }).with({
+					hour: 23, minute: 59, second: 59, millisecond: 999,
+					microsecond: 0, nanosecond: 0
+				});
 
-				opt.start = saturday.getTime();
-				opt.end = sunday.getTime();
+				opt.start = saturday;
+				opt.end = sunday;
 			} else if (opt.batchMode === 'month') {
-				const startOfMonth = new DateWrapper(
-					date.getFullYear(),
-					date.getMonth(),
-					1,
-				);
-				startOfMonth.setHours(
-					0,
-					0,
-					0,
-					0,
-				);
+				const startOfMonth = Temporal.PlainDate.from({ year: date.year, month: date.month, day: 1 })
+					.toPlainDateTime({ hour: 0, minute: 0, second: 0, millisecond: 0, microsecond: 0, nanosecond: 0 });
 
-				const endOfMonth = new DateWrapper(
-					date.getFullYear(),
-					date.getMonth() + 1,
-					0,
-				);
-				endOfMonth.setHours(
-					23,
-					59,
-					59,
-					999,
-				);
+				// last day of month: jump to first day of next month, subtract one day
+				const endOfMonthDate = Temporal.PlainYearMonth.from({ year: date.year, month: date.month })
+					.add({ months: 1 })
+					.toPlainDate({ day: 1 })
+					.subtract({ days: 1 });
+
+				const endOfMonth = endOfMonthDate.toPlainDateTime({
+					hour: 23, minute: 59, second: 59, millisecond: 999, microsecond: 0, nanosecond: 0
+				});
 
-				opt.start = startOfMonth.getTime();
-				opt.end = endOfMonth.getTime();
+				opt.start = startOfMonth;
+				opt.end = endOfMonth;
 			} else if ((opt.start && opt.end) || (!opt.start && !opt.end)) {
-				opt.start = handleStart(time);
-				opt.end = false;
+				opt.start = handleStart(date);
+				opt.end = null;
 			} else if (opt.start) {
-				opt.end = handleEnd(time);
+				opt.end = handleEnd(date);
 				if (opt.time?.enabled) {
 					changeTime('end', opt.end);
 				}
@@ -1248,7 +1389,7 @@ import './daterangepicker.css';
 			}
 
 			// In case the start is after the end, swap the timestamps
-			if (!opt.singleDate && opt.start && opt.end && opt.start > opt.end) {
+			if (!opt.singleDate && opt.start && opt.end && getStartMs() > getEndMs()) {
 				const tmp = opt.end;
 				opt.end = handleEnd(opt.start);
 				opt.start = handleStart(tmp);
@@ -1257,13 +1398,13 @@ import './daterangepicker.css';
 				}
 			}
 
-			opt.start = parseInt(opt.start);
-			opt.end = parseInt(opt.end);
+			opt.start = ensureTemporal(opt.start);
+			opt.end = ensureTemporal(opt.end);
 
 			clearHovering();
 			if (opt.start && !opt.end) {
 				$(self).trigger('datepicker-first-date-selected', {
-					date1: new DateWrapper(opt.start),
+					date1: opt.start,
 				});
 				dayHovering(day);
 			}
@@ -1302,41 +1443,61 @@ import './daterangepicker.css';
 			autoclose();
 		}
 
-		function isValidTime(time) {
-			time = parseInt(time, 10);
-			if (opt.startDate && compare_day(time, opt.startDate) < 0) { return false; }
+		function isValidTime(date: Temporal.PlainDateTime) {
+			if (opt.startDate && compare_day(date, opt.startDate) < 0) {
+				return false;
+			}
 
-			if (opt.endDate && compare_day(time, opt.endDate) > 0) { return false; }
+			if (opt.endDate && compare_day(date, opt.endDate) > 0) {
+				return false;
+			}
 
 			if (opt.start && !opt.end && !opt.singleDate) {
 				// check maxDays and minDays setting
-				if (opt.maxDays > 0 && countDays(time, opt.start) > opt.maxDays) { return false; }
+				if (opt.maxDays > 0 && countDays(date, opt.start) > opt.maxDays) {
+					return false;
+				}
 
-				if (opt.minDays > 0 && countDays(time, opt.start) < opt.minDays) { return false; }
+				if (opt.minDays > 0 && countDays(date, opt.start) < opt.minDays) {
+					return false;
+				}
 
 				// check selectForward and selectBackward
-				if (opt.selectForward && time < opt.start) { return false; }
+				if (opt.selectForward && date < opt.start) {
+					return false;
+				}
 
-				if (opt.selectBackward && time > opt.start) { return false; }
+				if (opt.selectBackward && date > opt.start) {
+					return false;
+				}
 
 				// check disabled days
 				if (opt.beforeShowDay && typeof opt.beforeShowDay == 'function') {
 					let valid = true;
-					let timeTmp = time;
+					let timeTmp = date;
 					while (countDays(timeTmp, opt.start) > 1) {
-						const arr = opt.beforeShowDay(new DateWrapper(timeTmp));
+						const arr = opt.beforeShowDay(timeTmp);
 						if (!arr[0]) {
 							valid = false;
 							break;
 						}
 
-						if (Math.abs(timeTmp - opt.start) < 86400000) { break; }
+						if (Math.abs(timeTmp[utcEpochMilliseconds]() - getStartMs()) < 86400000) {
+							break;
+						}
+
+						if (timeTmp > opt.start) {
+							timeTmp = timeTmp.subtract({ milliseconds: 86400000 });
+						}
 
-						if (timeTmp > opt.start) { timeTmp -= 86400000; }
+						if (timeTmp < opt.start) {
+							timeTmp = timeTmp.add({ milliseconds: 86400000 });
+						}
+					}
 
-						if (timeTmp < opt.start) { timeTmp += 86400000; }
+					if (!valid) {
+						return false;
 					}
-					if (!valid) { return false; }
 				}
 			}
 
@@ -1348,14 +1509,18 @@ import './daterangepicker.css';
 			if (opt.start && !opt.end) {
 				box.find('.day.toMonth.valid').each(function (this: any) {
 					const time = parseInt($(this).attr('time'), 10);
-					if (!isValidTime(time)) { $(this).addClass('invalid tmp').removeClass('valid'); } else { $(this).addClass('valid tmp').removeClass('invalid'); }
+					if (!isValidTime(ensureTemporal(time))) {
+						$(this).addClass('invalid tmp').removeClass('valid');
+					} else {
+						$(this).addClass('valid tmp').removeClass('invalid');
+					}
 				});
 			}
 
 			return true;
 		}
 
-		function dayHovering(day) {
+		function dayHovering(day: JQuery) {
 			const hoverTime = parseInt(day.attr('time'));
 			let tooltip = '';
 			let tooltipClass = '';
@@ -1381,8 +1546,8 @@ import './daterangepicker.css';
 						if (
 							(opt.start && !opt.end)
 							&& (
-								(opt.start < time && hoverTime >= time)
-								|| (opt.start > time && hoverTime <= time)
+								(getStartMs() < time && hoverTime >= time)
+								|| (getStartMs() > time && hoverTime <= time)
 							)
 						) {
 							$(this).addClass('hovering');
@@ -1392,7 +1557,8 @@ import './daterangepicker.css';
 					});
 
 					if (opt.start && !opt.end) {
-						const days = countDays(hoverTime, opt.start);
+						const tHoverTime = ensureTemporal(hoverTime);
+						const days = countDays(tHoverTime, opt.start);
 						if (opt.hoveringTooltip) {
 							tooltipClass = 'drp-tooltip-normal';
 
@@ -1400,7 +1566,7 @@ import './daterangepicker.css';
 								tooltip = opt.hoveringTooltip(
 									days,
 									opt.start,
-									hoverTime,
+									tHoverTime,
 								);
 							} else if (opt.hoveringTooltip === true && days > 1) {
 								tooltip = `${days} ${translate('days')}`;
@@ -1411,7 +1577,7 @@ import './daterangepicker.css';
 			} else {
 				if (opt.maxDaysTooltip != null) {
 					const time = parseInt(day.attr('time'));
-					if (time > opt.start) {
+					if (opt.start != null && time > getStartMs()) {
 						tooltip = opt.maxDaysTooltip(opt.maxDays);
 						tooltipClass = 'drp-tooltip-error';
 					}
@@ -1466,19 +1632,23 @@ import './daterangepicker.css';
 		}
 
 		function checkSelectionValid() {
-			const days = Math.ceil((opt.end - opt.start) / 86400000) + 1;
+			const days = Math.ceil((getEndMs() - getStartMs()) / 86400000) + 1;
 			if (opt.singleDate) { // Validate if only start is there
-				if (opt.start && !opt.end) { box.find('.drp_top-bar').removeClass('error').addClass('normal'); } else { box.find('.drp_top-bar').removeClass('error').removeClass('normal'); }
+				if (opt.start && !opt.end) {
+					box.find('.drp_top-bar').removeClass('error').addClass('normal');
+				} else {
+					box.find('.drp_top-bar').removeClass('error').removeClass('normal');
+				}
 			} else if (opt.maxDays && days > opt.maxDays) {
-				opt.start = false;
-				opt.end = false;
+				opt.start = null;
+				opt.end = null;
 				box.find('.day').removeClass('checked');
-				box.find('.drp_top-bar').removeClass('normal').addClass('error').find('.error-top').html(translate('less-than').replace('%d', opt.maxDays));
+				box.find('.drp_top-bar').removeClass('normal').addClass('error').find('.error-top').html(translate('less-than').replace('%d', opt.maxDays.toString()));
 			} else if (opt.minDays && days < opt.minDays) {
-				opt.start = false;
-				opt.end = false;
+				opt.start = null;
+				opt.end = null;
 				box.find('.day').removeClass('checked');
-				box.find('.drp_top-bar').removeClass('normal').addClass('error').find('.error-top').html(translate('more-than').replace('%d', opt.minDays));
+				box.find('.drp_top-bar').removeClass('normal').addClass('error').find('.error-top').html(translate('more-than').replace('%d', opt.minDays.toString()));
 			} else {
 				if (opt.start || opt.end) { box.find('.drp_top-bar').removeClass('error').addClass('normal'); } else { box.find('.drp_top-bar').removeClass('error').removeClass('normal'); }
 			}
@@ -1494,8 +1664,8 @@ import './daterangepicker.css';
 					(opt.start && opt.startDate && compare_day(opt.start, opt.startDate) < 0)
 					|| (opt.end && opt.endDate && compare_day(opt.end, opt.endDate) > 0)
 				) {
-					opt.start = false;
-					opt.end = false;
+					opt.start = null;
+					opt.end = null;
 					box.find('.day').removeClass('checked');
 				}
 			}
@@ -1506,45 +1676,45 @@ import './daterangepicker.css';
 			box.find('.end-day').html('...');
 			box.find('.selected-days').hide();
 			if (opt.start) {
-				box.find('.start-day').html(getDateString(new DateWrapper(parseInt(opt.start))));
+				box.find('.start-day').html(getDateString(opt.start));
 			}
 
 			if (opt.end) {
-				box.find('.end-day').html(getDateString(new DateWrapper(parseInt(opt.end))));
+				box.find('.end-day').html(getDateString(opt.end));
 			}
 
 			let dateRange;
 			if (opt.start && opt.singleDate) {
 				box.find('.apply-btn').removeClass('disabled');
-				dateRange = getDateString(new DateWrapper(opt.start));
+				dateRange = getDateString(opt.start);
 				opt.setValue.call(
 					selfDom,
 					dateRange,
-					getDateString(new DateWrapper(opt.start)),
-					getDateString(new DateWrapper(opt.end)),
+					getDateString(opt.start),
+					getDateString(opt.end),
 				);
 
 				if (initiated && !silent) {
 					$(self).trigger('datepicker-change', {
 						value: dateRange,
-						date1: new DateWrapper(opt.start),
+						date1: opt.start,
 					});
 				}
 			} else if (opt.start && opt.end) {
 				box.find('.selected-days').show().find('.selected-days-num').html(countDays(opt.end, opt.start));
 				box.find('.apply-btn').removeClass('disabled');
-				dateRange = getDateString(new DateWrapper(opt.start)) + opt.separator + getDateString(new DateWrapper(opt.end));
+				dateRange = getDateString(opt.start) + opt.separator + getDateString(opt.end);
 				opt.setValue.call(
 					selfDom,
 					dateRange,
-					getDateString(new DateWrapper(opt.start)),
-					getDateString(new DateWrapper(opt.end)),
+					getDateString(opt.start),
+					getDateString(opt.end),
 				);
 				if (initiated && !silent) {
 					$(self).trigger('datepicker-change', {
 						value: dateRange,
-						date1: new DateWrapper(opt.start),
-						date2: new DateWrapper(opt.end),
+						date1: opt.start,
+						date2: opt.end,
 					});
 				}
 			} else if (forceValid) {
@@ -1554,16 +1724,16 @@ import './daterangepicker.css';
 			}
 		}
 
-		function countDays(start, end) {
+		function countDays(start: Temporal.PlainDateTime, end: Temporal.PlainDateTime) {
 			return Math.abs(daysFrom1970(start) - daysFrom1970(end)) + 1;
 		}
 
 		function setDateRange(
-			date1?,
-			date2?,
-			silent?,
+			date1: Temporal.PlainDateTime,
+			date2: Temporal.PlainDateTime,
+			silent?: boolean,
 		) {
-			if (date1.getTime() > date2.getTime()) {
+			if (date1[utcEpochMilliseconds]() > date2[utcEpochMilliseconds]()) {
 				let tmp = date2;
 				date2 = date1;
 				date1 = tmp;
@@ -1571,9 +1741,13 @@ import './daterangepicker.css';
 			}
 
 			let valid = true;
-			if (opt.startDate && compare_day(date1, opt.startDate) < 0) { valid = false; }
+			if (opt.startDate && compare_day(date1, opt.startDate) < 0) {
+				valid = false;
+			}
 
-			if (opt.endDate && compare_day(date2, opt.endDate) > 0) { valid = false; }
+			if (opt.endDate && compare_day(date2, opt.endDate) > 0) {
+				valid = false;
+			}
 
 			if (!valid) {
 				showMonth(opt.startDate, 'month1');
@@ -1582,8 +1756,8 @@ import './daterangepicker.css';
 				return;
 			}
 
-			opt.start = date1.getTime();
-			opt.end = date2.getTime();
+			opt.start = date1;
+			opt.end = date2;
 
 			if (opt.time.enabled) {
 				renderTime('time1', date1);
@@ -1598,7 +1772,7 @@ import './daterangepicker.css';
 				}
 			}
 
-			if (opt.stickyMonths && opt.endDate !== false && compare_month(date2, opt.endDate) > 0) {
+			if (opt.stickyMonths && opt.endDate && compare_month(date2, opt.endDate) > 0) {
 				date1 = prevMonth(date1);
 				date2 = prevMonth(date2);
 			}
@@ -1657,13 +1831,13 @@ import './daterangepicker.css';
 				let start = opt.start;
 				let end = opt.end;
 				if (opt.time.enabled) {
-					time = startOfDay(time).getTime();
-					start = startOfDay(start).getTime();
-					end = startOfDay(end).getTime();
+					time = startOfDay(time)[utcEpochMilliseconds]();
+					start = startOfDay(start);
+					end = startOfDay(end);
 				}
 
 				if (
-					(opt.start && opt.end && end >= time && start <= time)
+					(opt.start && opt.end && end[utcEpochMilliseconds]() >= time && start[utcEpochMilliseconds]() <= time)
 					|| (opt.start && !opt.end && DateUtils.formatDate(start, 'yyyyMMdd') == DateUtils.formatDate(time, 'yyyyMMdd'))
 				) {
 					$(this).addClass('checked');
@@ -1693,10 +1867,9 @@ import './daterangepicker.css';
 			});
 		}
 
-		function showMonth(date: DateWrapper, month: 'month1' | 'month2') {
-			date = date.clone();
-			const monthName = nameMonth(date.getMonth());
-			box.find(`.${month} .month-name`).html(`${monthName}${opt.hideYearInMonthName ? '' : ` ${date.getFullYear()}`}`);
+		function showMonth(date: Temporal.PlainDateTime, month: 'month1' | 'month2') {
+			const monthName = nameMonth(date.month);
+			box.find(`.${month} .month-name`).html(`${monthName}${opt.hideYearInMonthName ? '' : ` ${date.year}`}`);
 			box.find(`.${month} tbody`).html(createMonthHTML(date));
 			opt[month] = date;
 			updateSelectableRange();
@@ -1724,16 +1897,16 @@ import './daterangepicker.css';
 			});
 		}
 
-		function showTime(date: DateWrapper, name: 'time1' | 'time2') {
+		function showTime(date: Temporal.PlainDateTime, name: 'time1' | 'time2') {
 			box.find(`.${name}`).append(getTimeHTML());
 			renderTime(name, date);
 		}
 
-		function nameMonth(m) {
-			return translate('month-name')[m];
+		function nameMonth(m: number) {
+			return translate('month-name')[m - 1];
 		}
 
-		function getDateString(d) {
+		function getDateString(d: Temporal.PlainDateTime) {
 			return DateUtils.formatDate(d, opt.format);
 		}
 
@@ -1779,7 +1952,7 @@ import './daterangepicker.css';
 			showMonth(opt.month2, 'month2');
 		}
 
-		function compare_month(m1: DateWrapper, m2: DateWrapper): number {
+		function compare_month(m1: Temporal.PlainDateTime, m2: Temporal.PlainDateTime): number {
 			const p = parseInt(DateUtils.formatDate(m1, 'yyyyMM')) - parseInt(DateUtils.formatDate(m2, 'yyyyMM'));
 			if (p > 0) { return 1; }
 
@@ -1788,7 +1961,7 @@ import './daterangepicker.css';
 			return -1;
 		}
 
-		function compare_day(m1: DateWrapper, m2: DateWrapper): number {
+		function compare_day(m1: Temporal.PlainDateTime, m2: Temporal.PlainDateTime): number {
 			const p = parseInt(DateUtils.formatDate(m1, 'yyyyMMdd')) - parseInt(DateUtils.formatDate(m2, 'yyyyMMdd'));
 			if (p > 0) { return 1; }
 
@@ -1797,16 +1970,12 @@ import './daterangepicker.css';
 			return -1;
 		}
 
-		function nextMonth(month: DateWrapper): DateWrapper {
-			const retVal = month.clone();
-			retVal.setMonth(retVal.getMonth() + 1);
-			return retVal;
+		function nextMonth(month: Temporal.PlainDateTime): Temporal.PlainDateTime {
+			return month.add({ months: 1 });
 		}
 
-		function prevMonth(month: DateWrapper): DateWrapper {
-			const retVal = month.clone();
-			retVal.setMonth(retVal.getMonth() - 1);
-			return retVal;
+		function prevMonth(month: Temporal.PlainDateTime): Temporal.PlainDateTime {
+			return month.subtract({ months: 1 });
 		}
 
 		function getTimeHTML() {
@@ -2020,24 +2189,24 @@ import './daterangepicker.css';
 			}
 		}
 
-		function isMonthOutOfBounds(month: DateWrapper): boolean {
-			const date = month.clone();
-			const monthStart = new DateWrapper(
-				date.getFullYear(),
-				date.getMonth(),
-				1,
-			);
-			const monthEnd = new DateWrapper(
-				date.getFullYear(),
-				date.getMonth() + 1,
-				0,
-			);
+		function isMonthOutOfBounds(date: Temporal.PlainDateTime): boolean {
+			const monthStart = date.with({
+				year: date.year,
+				month: date.month,
+				day: 1
+			});
+
+			const monthEnd = date.with({
+				year: date.year,
+				month: date.month,
+				day: 1
+			}).add({ months: 1 }).subtract({ days: 1 });
 
-			if (opt.startDate && monthEnd.getTime() < opt.startDate.getTime()) {
+			if (opt.startDate && monthEnd[utcEpochMilliseconds]() < opt.startDate[utcEpochMilliseconds]()) {
 				return true;
 			}
 
-			if (opt.endDate && monthStart.getTime() > opt.endDate.getTime()) {
+			if (opt.endDate && monthStart[utcEpochMilliseconds]() > opt.endDate[utcEpochMilliseconds]()) {
 				return true;
 			}
 
@@ -2090,80 +2259,89 @@ import './daterangepicker.css';
 			return attrString;
 		}
 
-		function daysFrom1970(t) {
+		function daysFrom1970(t: Temporal.PlainDateTime) {
 			return Math.floor(toLocalTimestamp(t) / 86400000);
 		}
 
-		function toLocalTimestamp(t) {
-			if (typeof t == 'object' && t.getTime) { t = t.getTime(); }
+		function toLocalTimestamp(t: Temporal.PlainDateTime | string): number {
+			if (typeof t == 'object' && (t as any).getTime) {
+				t = (t as any).getTime();
+			}
 
-			if (typeof t == 'string' && !t.match(/\d{13}/)) { t = DateUtils.getDateWrapperFromFormat(t, opt.format).getTime(); }
+			if (typeof t == 'string' && !t.match(/\d{13}/)) {
+				t = DateUtils.getTemporalFromFormat(t, opt.format)[utcEpochMilliseconds]() as any;
+			}
 
-			return t;
+			return (t as Temporal.PlainDateTime)[utcEpochMilliseconds]();
 		}
 
-		function createMonthHTML(d) {
-			const days = [];
-			d.setDate(1);
-			const lastMonth = new DateWrapper(d.getTime() - 86400000);
-			const now = DateWrapper.getCurrent();
+		function createMonthHTML(d: Temporal.PlainDateTime) {
+			const days: DaterangePickerArgsCustomCellRenderDay[] = [];
+			d = d.with({ day: 1 });
+			const lastMonth = d.subtract({ days: 1 });
+			const now = dateNow();
 
-			let dayOfWeek = d.getDay();
+			let dayOfWeek = getJsDateDay(d);
 			if ((dayOfWeek === 0) && (opt.startOfWeek === 'monday')) {
 				// add one week
 				dayOfWeek = 7;
 			}
 
-			let today, valid;
-
 			if (dayOfWeek > 0) {
 				for (let i: number = dayOfWeek; i > 0; i--) {
-					var day: any = new DateWrapper(d.getTime() - 86400000 * i);
-					valid = isValidTime(day.getTime());
-					if (opt.startDate && compare_day(day, opt.startDate) < 0) { valid = false; }
-
-					if (opt.endDate && compare_day(day, opt.endDate) > 0) { valid = false; }
+					let day = d.subtract({ milliseconds: 86400000 * i });
+					let valid = isValidTime(day);
+					if (opt.startDate && compare_day(day, opt.startDate) < 0) {
+						valid = false;
+					} else if (opt.endDate && compare_day(day, opt.endDate) > 0) {
+						valid = false;
+					}
 
 					days.push({
 						date: day,
 						type: 'lastMonth',
-						day: day.getDate(),
-						time: day.getTime(),
+						day: day.day,
+						time: day[utcEpochMilliseconds](),
 						valid,
 					});
 				}
 			}
 
-			const toMonth = d.getMonth();
+			const toMonth = d.month;
 			for (let i: number = 0; i < 40; i++) {
-				today = new DateWrapper(d.getTime() + (86400000 * i));
-				valid = isValidTime(today.getTime());
-				if (opt.startDate && compare_day(today, opt.startDate) < 0) { valid = false; }
-
-				if (opt.endDate && compare_day(today, opt.endDate) > 0) { valid = false; }
+				let today = d.add({ milliseconds: (86400000 * i) });
+				let valid = isValidTime(today);
+				if (opt.startDate && compare_day(today, opt.startDate) < 0) {
+					valid = false;
+				} else if (opt.endDate && compare_day(today, opt.endDate) > 0) {
+					valid = false;
+				}
 
 				days.push({
 					date: today,
-					type: today.getMonth() == toMonth ? 'toMonth' : 'nextMonth',
-					day: today.getDate(),
-					time: today.getTime(),
+					type: today.month == toMonth ? 'toMonth' : 'nextMonth',
+					day: today.day,
+					time: today[utcEpochMilliseconds](),
 					valid,
 				});
 			}
 			const html = [];
 			for (let week = 0; week < 6; week++) {
-				if (days[week * 7].type == 'nextMonth') { break; }
+				if (days[week * 7].type == 'nextMonth') {
+					break;
+				}
 
 				html.push('<tr>');
 
 				for (var day: any = 0; day < 7; day++) {
 					const _day: any = (opt.startOfWeek == 'monday') ? day + 1 : day;
-					today = days[week * 7 + _day];
+					const today = days[week * 7 + _day];
 					const highlightToday = DateUtils.formatDate(today.time, 'yyyyMMdd') == DateUtils.formatDate(now, 'yyyyMMdd');
 					today.extraClass = '';
 					today.tooltip = '';
+
 					if (today.valid && opt.beforeShowDay && typeof opt.beforeShowDay == 'function') {
-						const _r = opt.beforeShowDay(new DateWrapper(today.time));
+						const _r = opt.beforeShowDay(today.date);
 						today.valid = _r[0];
 						today.extraClass = _r[1] || '';
 						today.tooltip = _r[2] || '';
@@ -2204,15 +2382,15 @@ import './daterangepicker.css';
 				attributes,
 				opt.dayDivAttrs,
 				today,
-			)}>${showDayHTML(today.time, today.day)}</div>`;
+			)}>${showDayHTML(today.date, today.day)}</div>`;
 		}
 
-		function showDayHTML(time, date) {
+		function showDayHTML(date: Temporal.PlainDateTime, day: number): string | number {
 			if (opt.showDateFilter && typeof opt.showDateFilter == 'function') {
-				return opt.showDateFilter(time, date);
+				return opt.showDateFilter(date, day);
 			}
 
-			return date;
+			return day;
 		}
 
 		function getLanguages(): any {
@@ -2247,29 +2425,29 @@ import './daterangepicker.css';
 			return result;
 		}
 
-		function getDefaultTime(): DateWrapper {
-			let defaultTime = opt.defaultTime ? opt.defaultTime : DateWrapper.getCurrent();
+		function getDefaultTime(): Temporal.PlainDateTime {
+			let defaultTime = opt.defaultTime ? opt.defaultTime : dateNow();
 
 			if (opt.lookBehind) {
-				if (opt.startDate && compare_month(defaultTime, opt.startDate) < 0) { defaultTime = nextMonth(DateUtils.getDateWrapperFromFormat(opt.startDate, opt.format)); }
+				if (opt.startDate && compare_month(defaultTime, opt.startDate) < 0) { defaultTime = nextMonth(opt.startDate); }
 
-				if (opt.endDate && compare_month(defaultTime, opt.endDate) > 0) { defaultTime = DateUtils.getDateWrapperFromFormat(opt.endDate, opt.format); }
+				if (opt.endDate && compare_month(defaultTime, opt.endDate) > 0) { defaultTime = opt.endDate; }
 			} else {
-				if (opt.startDate && compare_month(defaultTime, opt.startDate) < 0) { defaultTime = DateUtils.getDateWrapperFromFormat(opt.startDate, opt.format); }
+				if (opt.startDate && compare_month(defaultTime, opt.startDate) < 0) { defaultTime = opt.startDate; }
 
-				if (opt.endDate && compare_month(nextMonth(defaultTime), opt.endDate) > 0) { defaultTime = prevMonth(DateUtils.getDateWrapperFromFormat(opt.endDate, opt.format)); }
+				if (opt.endDate && compare_month(nextMonth(defaultTime), opt.endDate) > 0) { defaultTime = prevMonth(opt.endDate); }
 			}
 
 			if (opt.singleDate) {
-				if (opt.startDate && compare_month(defaultTime, opt.startDate) < 0) { defaultTime = DateUtils.getDateWrapperFromFormat(opt.startDate, opt.format); }
+				if (opt.startDate && compare_month(defaultTime, opt.startDate) < 0) { defaultTime = opt.startDate; }
 
-				if (opt.endDate && compare_month(defaultTime, opt.endDate) > 0) { defaultTime = DateUtils.getDateWrapperFromFormat(opt.endDate, opt.format); }
+				if (opt.endDate && compare_month(defaultTime, opt.endDate) > 0) { defaultTime = opt.endDate; }
 			}
 
 			return defaultTime;
 		}
 
-		function resetMonthsView(time: DateWrapper) {
+		function resetMonthsView(time: Temporal.PlainDateTime) {
 			if (!time) {
 				time = getDefaultTime();
 			}