@uxf/datepicker 10.0.0-beta.35 → 10.0.0-beta.41

package/contexts/date-picker-context.js

@@ -29,4 +29,5 @@ exports.DatePickerContext = (0, react_1.createContext)({
     onDateHover: () => undefined,
     onDateSelect: () => undefined,
     onResetDates: () => undefined,
+    preventScroll: undefined,
 });

package/contexts/time-picker-context.d.ts

@@ -10,5 +10,6 @@ export type TimePickerContextProps = {
     onHourSelect: (hour: number) => void;
     onMinuteFocus: (minute: number) => void;
     onMinuteSelect: (minute: number) => void;
+    preventScroll?: boolean;
 };
 export declare const TimePickerContext: import("react").Context<TimePickerContextProps>;

package/contexts/time-picker-context.js

@@ -13,4 +13,5 @@ exports.TimePickerContext = (0, react_1.createContext)({
     onHourSelect: () => undefined,
     onMinuteFocus: () => undefined,
     onMinuteSelect: () => undefined,
+    preventScroll: undefined,
 });

package/hooks/use-date-picker.d.ts

@@ -9,6 +9,7 @@ export interface UseDatePickerProps {
     minBookingDate?: Date;
     numberOfMonths?: number;
     onDateChange: (data: OnDateChangeType) => void;
+    preventScroll?: boolean;
     selectedDate: Date | null;
     unavailableDates?: Date[];
 }
@@ -26,5 +27,6 @@ export interface UseDatePickerReturnType extends UseDatePickerNavigationReturnTy
     onDateHover: (date: Date | null) => void;
     onDateSelect: (date: Date) => void;
     onResetDates: () => void;
+    preventScroll?: boolean;
 }
-export declare function useDatePicker({ firstDayOfWeek, initialVisibleMonth, isDateBlocked: isDateBlockedProps, maxBookingDate, minBookingDate, numberOfMonths, onDateChange, selectedDate, unavailableDates, }: UseDatePickerProps): UseDatePickerReturnType;
+export declare function useDatePicker({ firstDayOfWeek, initialVisibleMonth, isDateBlocked: isDateBlockedProps, maxBookingDate, minBookingDate, numberOfMonths, onDateChange, preventScroll, selectedDate, unavailableDates, }: UseDatePickerProps): UseDatePickerReturnType;

package/hooks/use-date-picker.js

@@ -10,7 +10,7 @@ const is_start_date_1 = require("../utils/is-start-date");
 const use_date_picker_navigation_1 = require("./use-date-picker-navigation");
 const is_browser_1 = require("../utils/is-browser");
 const dayjs_en_1 = require("../utils/dayjs-en");
-function useDatePicker({ firstDayOfWeek = 0, initialVisibleMonth, isDateBlocked: isDateBlockedProps = () => false, maxBookingDate, minBookingDate, numberOfMonths = 1, onDateChange, selectedDate, unavailableDates = [], }) {
+function useDatePicker({ firstDayOfWeek = 0, initialVisibleMonth, isDateBlocked: isDateBlockedProps = () => false, maxBookingDate, minBookingDate, numberOfMonths = 1, onDateChange, preventScroll, selectedDate, unavailableDates = [], }) {
     const [activeMonths, setActiveMonths] = (0, react_1.useState)(() => selectedDate
         ? (0, get_initial_months_1.getInitialMonths)(numberOfMonths, selectedDate)
         : (0, get_initial_months_1.getInitialMonths)(numberOfMonths, initialVisibleMonth || null));
@@ -109,6 +109,7 @@ function useDatePicker({ firstDayOfWeek = 0, initialVisibleMonth, isDateBlocked:
         onDateHover,
         onDateSelect,
         onResetDates: onReset,
+        preventScroll,
     };
 }
 exports.useDatePicker = useDatePicker;

package/hooks/use-date-range-picker.d.ts

@@ -21,6 +21,7 @@ export interface UseDateRangePickerProps {
     minBookingDays?: number;
     numberOfMonths?: number;
     onDatesChange: (data: OnDatesChangeProps) => void;
+    preventScroll?: boolean;
     startDate: Date | null;
     unavailableDates?: Date[];
 }
@@ -41,5 +42,6 @@ export interface UseDateRangePickerReturnType extends UseDatePickerNavigationRet
     onDateHover: (date: Date | null) => void;
     onDateSelect: (date: Date) => void;
     onResetDates: () => void;
+    preventScroll?: boolean;
 }
 export declare function useDateRangePicker({ changeActiveMonthOnSelect, endDate, exactMinBookingDays, firstDayOfWeek, focusedInput, initialVisibleMonth, isDateBlocked: isDateBlockedProps, maxBookingDate, minBookingDate, minBookingDays, numberOfMonths, onDatesChange, startDate, unavailableDates, }: UseDateRangePickerProps): UseDateRangePickerReturnType;

package/hooks/use-day.d.ts

@@ -11,6 +11,7 @@ export interface UseDayProps {
     onDateFocus: (date: Date) => void;
     onDateHover: (date: Date) => void;
     onDateSelect: (date: Date) => void;
+    preventScroll?: boolean;
 }
 export interface UseDayReturnType {
     disabledDate: boolean;
@@ -24,4 +25,4 @@ export interface UseDayReturnType {
     onMouseEnter: () => void;
     tabIndex: number;
 }
-export declare function useDay({ date, dayRef, focusedDate, isDateBlocked, isDateFocused, isDateHovered, isDateInsideRange, isDateSelected, onDateFocus, onDateHover, onDateSelect, }: UseDayProps): UseDayReturnType;
+export declare function useDay({ date, dayRef, focusedDate, isDateBlocked, isDateFocused, isDateHovered, isDateInsideRange, isDateSelected, onDateFocus, onDateHover, onDateSelect, preventScroll, }: UseDayProps): UseDayReturnType;

package/hooks/use-day.js

@@ -3,16 +3,18 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useDay = void 0;
 const react_1 = require("react");
 const dayjs_en_1 = require("../utils/dayjs-en");
-function useDay({ date, dayRef, focusedDate, isDateBlocked, isDateFocused, isDateHovered, isDateInsideRange, isDateSelected, onDateFocus, onDateHover, onDateSelect, }) {
+function useDay({ date, dayRef, focusedDate, isDateBlocked, isDateFocused, isDateHovered, isDateInsideRange, isDateSelected, onDateFocus, onDateHover, onDateSelect, preventScroll, }) {
     const onClick = (0, react_1.useCallback)(() => onDateSelect(date), [date, onDateSelect]);
     const onMouseEnter = (0, react_1.useCallback)(() => onDateHover(date), [date, onDateHover]);
     const disabled = isDateBlocked(date) && !isDateHovered(date);
     const isToday = (0, dayjs_en_1.dayjsEn)().isSame(date, "day");
     (0, react_1.useEffect)(() => {
         if (dayRef && dayRef.current && isDateFocused(date)) {
-            dayRef.current.focus();
+            dayRef.current.focus({
+                preventScroll,
+            });
         }
-    }, [dayRef, date, isDateFocused]);
+    }, [dayRef, date, isDateFocused, preventScroll]);
     const onKeyDown = (0, react_1.useCallback)((e) => {
         if (["ArrowRight", "ArrowLeft", "ArrowUp", "ArrowDown"].includes(e.key)) {
             e.preventDefault();

package/hooks/use-hour.d.ts

@@ -7,6 +7,7 @@ export interface UseHourProps {
     isHourSelected: (hour: number) => boolean;
     onHourFocus: (hour: number) => void;
     onHourSelect: (hour: number) => void;
+    preventScroll?: boolean;
 }
 export interface UseHourReturnType {
     isSelected: boolean;
@@ -14,4 +15,4 @@ export interface UseHourReturnType {
     onKeyDown: (e: KeyboardEvent<HTMLElement>) => void;
     tabIndex: number;
 }
-export declare function useHour({ hour, hourRef, focusedHour, isHourFocused, isHourSelected, onHourFocus, onHourSelect, }: UseHourProps): UseHourReturnType;
+export declare function useHour({ hour, hourRef, focusedHour, isHourFocused, isHourSelected, onHourFocus, onHourSelect, preventScroll, }: UseHourProps): UseHourReturnType;

package/hooks/use-hour.js

@@ -2,13 +2,15 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useHour = void 0;
 const react_1 = require("react");
-function useHour({ hour, hourRef, focusedHour, isHourFocused, isHourSelected, onHourFocus, onHourSelect, }) {
+function useHour({ hour, hourRef, focusedHour, isHourFocused, isHourSelected, onHourFocus, onHourSelect, preventScroll, }) {
     const onClick = (0, react_1.useCallback)(() => onHourSelect(hour), [hour, onHourSelect]);
     (0, react_1.useEffect)(() => {
         if (hourRef && hourRef.current && isHourFocused(hour)) {
-            hourRef.current.focus();
+            hourRef.current.focus({
+                preventScroll,
+            });
         }
-    }, [hourRef, hour, isHourFocused]);
+    }, [hourRef, hour, isHourFocused, preventScroll]);
     const onKeyDown = (0, react_1.useCallback)((e) => {
         if (["ArrowRight", "ArrowLeft", "ArrowUp", "ArrowDown"].includes(e.key)) {
             e.preventDefault();

package/hooks/use-minute.d.ts

@@ -7,6 +7,7 @@ export interface UseMinuteProps {
     isMinuteSelected: (minute: number) => boolean;
     onMinuteFocus: (minute: number) => void;
     onMinuteSelect: (minute: number) => void;
+    preventScroll?: boolean;
 }
 export interface UseMinuteReturnType {
     isSelected: boolean;
@@ -14,4 +15,4 @@ export interface UseMinuteReturnType {
     onKeyDown: (e: KeyboardEvent<HTMLElement>) => void;
     tabIndex: number;
 }
-export declare function useMinute({ minute, minuteRef, focusedMinute, isMinuteFocused, isMinuteSelected, onMinuteFocus, onMinuteSelect, }: UseMinuteProps): UseMinuteReturnType;
+export declare function useMinute({ minute, minuteRef, focusedMinute, isMinuteFocused, isMinuteSelected, onMinuteFocus, onMinuteSelect, preventScroll, }: UseMinuteProps): UseMinuteReturnType;

package/hooks/use-minute.js

@@ -2,13 +2,15 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useMinute = void 0;
 const react_1 = require("react");
-function useMinute({ minute, minuteRef, focusedMinute, isMinuteFocused, isMinuteSelected, onMinuteFocus, onMinuteSelect, }) {
+function useMinute({ minute, minuteRef, focusedMinute, isMinuteFocused, isMinuteSelected, onMinuteFocus, onMinuteSelect, preventScroll, }) {
     const onClick = (0, react_1.useCallback)(() => onMinuteSelect(minute), [minute, onMinuteSelect]);
     (0, react_1.useEffect)(() => {
         if (minuteRef && minuteRef.current && isMinuteFocused(minute)) {
-            minuteRef.current.focus();
+            minuteRef.current.focus({
+                preventScroll,
+            });
         }
-    }, [minuteRef, minute, isMinuteFocused]);
+    }, [minuteRef, minute, isMinuteFocused, preventScroll]);
     const onKeyDown = (0, react_1.useCallback)((e) => {
         if (["ArrowRight", "ArrowLeft", "ArrowUp", "ArrowDown"].includes(e.key)) {
             e.preventDefault();

package/hooks/use-time-picker.d.ts

@@ -6,6 +6,7 @@ export type OnTimeChangeType = TimeType | null;
 export interface UseTimePickerProps {
     onSelectCallback?: () => void;
     onTimeChange: (data: OnTimeChangeType) => void;
+    preventScroll?: boolean;
     selectedTime: TimeType | null;
 }
 export interface UseTimePickerReturnType {
@@ -24,5 +25,6 @@ export interface UseTimePickerReturnType {
     onHourSelect: (hour: number) => void;
     onMinuteFocus: (minute: number) => void;
     onMinuteSelect: (minute: number) => void;
+    preventScroll?: boolean;
 }
-export declare function useTimePicker({ selectedTime, onTimeChange, onSelectCallback, }: UseTimePickerProps): UseTimePickerReturnType;
+export declare function useTimePicker({ selectedTime, onTimeChange, onSelectCallback, preventScroll, }: UseTimePickerProps): UseTimePickerReturnType;

package/hooks/use-time-picker.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.useTimePicker = void 0;
 const react_1 = require("react");
-function useTimePicker({ selectedTime, onTimeChange, onSelectCallback, }) {
+function useTimePicker({ selectedTime, onTimeChange, onSelectCallback, preventScroll, }) {
     var _a, _b;
     const [focusedHour, setFocusedHour] = (0, react_1.useState)((_a = selectedTime === null || selectedTime === void 0 ? void 0 : selectedTime.hour) !== null && _a !== void 0 ? _a : null);
     const [focusedMinute, setFocusedMinute] = (0, react_1.useState)((_b = selectedTime === null || selectedTime === void 0 ? void 0 : selectedTime.minute) !== null && _b !== void 0 ? _b : null);
@@ -78,6 +78,7 @@ function useTimePicker({ selectedTime, onTimeChange, onSelectCallback, }) {
         onHourSelect,
         onMinuteFocus,
         onMinuteSelect,
+        preventScroll,
     };
 }
 exports.useTimePicker = useTimePicker;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/datepicker",
-  "version": "10.0.0-beta.35",
+  "version": "10.0.0-beta.41",
   "description": "A set of React hooks to create an awesome datepicker.",
   "main": "index.js",
   "scripts": {