@daryasidorovich/modsen-datepicker 1.0.0 → 1.0.1

package/src/constants/holidays.ts

@@ -1,32 +1,32 @@
-const HOLIDAYS_RULES = [
-  { name: 'New Year', getDate: (year: number) => new Date(year, 0, 1) },
-  { name: 'Christmas', getDate: (year: number) => new Date(year, 11, 25) },
-  {
-    name: 'Chinese New Year',
-    getDate: (year: number) => new Date(year, 1, 17),
-  },
-  {
-    name: "International Women's Day",
-    getDate: (year: number) => new Date(year, 2, 8),
-  },
-  {
-    name: 'Defender of the Fatherland Day',
-    getDate: (year: number) => new Date(year, 1, 23),
-  },
-  { name: "Children's Day", getDate: (year: number) => new Date(year, 5, 1) },
-  { name: 'Labor Day', getDate: (year: number) => new Date(year, 4, 1) },
-  {
-    name: 'Thanksgiving Day',
-    getDate: (year: number) => new Date(year, 10, 26),
-  },
-  { name: 'Easter', getDate: (year: number) => new Date(year, 3, 5) },
-  { name: 'Boxing Day', getDate: (year: number) => new Date(year, 11, 26) },
-  { name: 'Eid al-Fitr', getDate: (year: number) => new Date(year, 2, 20) },
-  { name: 'Eid al-Adha', getDate: (year: number) => new Date(year, 4, 27) },
-  { name: 'Nowruz', getDate: (year: number) => new Date(year, 2, 21) },
-  { name: 'Bastille Day', getDate: (year: number) => new Date(year, 6, 14) },
-];
-
-export const getDefaultHolidays = (year: number): Date[] => {
-  return HOLIDAYS_RULES.map((rule) => rule.getDate(year));
-};
+const HOLIDAYS_RULES = [
+  { name: 'New Year', getDate: (year: number) => new Date(year, 0, 1) },
+  { name: 'Christmas', getDate: (year: number) => new Date(year, 11, 25) },
+  {
+    name: 'Chinese New Year',
+    getDate: (year: number) => new Date(year, 1, 17),
+  },
+  {
+    name: "International Women's Day",
+    getDate: (year: number) => new Date(year, 2, 8),
+  },
+  {
+    name: 'Defender of the Fatherland Day',
+    getDate: (year: number) => new Date(year, 1, 23),
+  },
+  { name: "Children's Day", getDate: (year: number) => new Date(year, 5, 1) },
+  { name: 'Labor Day', getDate: (year: number) => new Date(year, 4, 1) },
+  {
+    name: 'Thanksgiving Day',
+    getDate: (year: number) => new Date(year, 10, 26),
+  },
+  { name: 'Easter', getDate: (year: number) => new Date(year, 3, 5) },
+  { name: 'Boxing Day', getDate: (year: number) => new Date(year, 11, 26) },
+  { name: 'Eid al-Fitr', getDate: (year: number) => new Date(year, 2, 20) },
+  { name: 'Eid al-Adha', getDate: (year: number) => new Date(year, 4, 27) },
+  { name: 'Nowruz', getDate: (year: number) => new Date(year, 2, 21) },
+  { name: 'Bastille Day', getDate: (year: number) => new Date(year, 6, 14) },
+];
+
+export const getDefaultHolidays = (year: number): Date[] => {
+  return HOLIDAYS_RULES.map((rule) => rule.getDate(year));
+};

package/src/constants/modes.ts

@@ -1,6 +1,6 @@
-export const MODES = {
-  WEEK: 'week',
-  MONTH: 'month',
-} as const;
-
-export type MODES_TYPES = (typeof MODES)[keyof typeof MODES];
+export const MODES = {
+  WEEK: 'week',
+  MONTH: 'month',
+} as const;
+
+export type MODES_TYPES = (typeof MODES)[keyof typeof MODES];

package/src/constants/monthsNames.ts

@@ -1,14 +1,14 @@
-export const MONTHS_NAMES = [
-  'January',
-  'February',
-  'March',
-  'April',
-  'May',
-  'June',
-  'July',
-  'August',
-  'September',
-  'October',
-  'November',
-  'December',
-];
+export const MONTHS_NAMES = [
+  'January',
+  'February',
+  'March',
+  'April',
+  'May',
+  'June',
+  'July',
+  'August',
+  'September',
+  'October',
+  'November',
+  'December',
+];

package/src/constants/weekdaysNames.ts

@@ -1 +1 @@
-export const WEEKDAYS_NAMES = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];
+export const WEEKDAYS_NAMES = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'];

package/src/hooks/useCalendar.ts

@@ -1,62 +1,62 @@
-import { useEffect, useState } from 'react';
-
-import { CalendarProps } from '@/components/Calendar/types';
-import { getDefaultHolidays } from '@/constants/holidays';
-import { CalendarService } from '@/services/calendarService';
-import { withHolidays } from '@/services/decorators/withHolidays';
-import { withMinMax } from '@/services/decorators/withMinMax';
-import { getHolidays } from '@/services/holidayService';
-
-export function useCalendar(props: CalendarProps) {
-  const year = props.monthDate.getFullYear();
-  const [holidays, setHolidays] = useState<Date[]>([]);
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState('');
-
-  useEffect(() => {
-    const abortController = new AbortController();
-
-    if (props.showHolidays) {
-      setLoading(true);
-      setError('');
-      getHolidays(year, abortController.signal)
-        .then((result) => {
-          setHolidays(result);
-        })
-        .catch((err) => {
-          if (err.name === 'AbortError') {
-            return;
-          }
-          setHolidays(getDefaultHolidays(year));
-          setError(err.message);
-        })
-        .finally(() => setLoading(false));
-    }
-    return () => {
-      abortController.abort();
-    };
-  }, [props.showHolidays, year]);
-
-  const calendar: CalendarService = new CalendarService(
-    props.monthDate,
-    props.firstDayOfWeek,
-    props.selectedDate,
-    props.mode,
-    props.rangeStart,
-    props.rangeEnd
-  );
-
-  if (props.hideWeekends) {
-    calendar.setHideWeekends(true);
-  }
-
-  if (props.showHolidays && holidays.length > 0) {
-    withHolidays(calendar, holidays);
-  }
-
-  if (props.minDate || props.maxDate) {
-    withMinMax(calendar, props.minDate, props.maxDate);
-  }
-
-  return { calendar, loading, error };
-}
+import { useEffect, useState } from 'react';
+
+import { CalendarProps } from '@/components/Calendar/types';
+import { getDefaultHolidays } from '@/constants/holidays';
+import { CalendarService } from '@/services/calendarService';
+import { withHolidays } from '@/services/decorators/withHolidays';
+import { withMinMax } from '@/services/decorators/withMinMax';
+import { getHolidays } from '@/services/holidayService';
+
+export function useCalendar(props: CalendarProps) {
+  const year = props.monthDate.getFullYear();
+  const [holidays, setHolidays] = useState<Date[]>([]);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState('');
+
+  useEffect(() => {
+    const abortController = new AbortController();
+
+    if (props.showHolidays) {
+      setLoading(true);
+      setError('');
+      getHolidays(year, abortController.signal)
+        .then((result) => {
+          setHolidays(result);
+        })
+        .catch((err) => {
+          if (err.name === 'AbortError') {
+            return;
+          }
+          setHolidays(getDefaultHolidays(year));
+          setError(err.message);
+        })
+        .finally(() => setLoading(false));
+    }
+    return () => {
+      abortController.abort();
+    };
+  }, [props.showHolidays, year]);
+
+  const calendar: CalendarService = new CalendarService(
+    props.monthDate,
+    props.firstDayOfWeek,
+    props.selectedDate,
+    props.mode,
+    props.rangeStart,
+    props.rangeEnd
+  );
+
+  if (props.hideWeekends) {
+    calendar.setHideWeekends(true);
+  }
+
+  if (props.showHolidays && holidays.length > 0) {
+    withHolidays(calendar, holidays);
+  }
+
+  if (props.minDate || props.maxDate) {
+    withMinMax(calendar, props.minDate, props.maxDate);
+  }
+
+  return { calendar, loading, error };
+}

package/src/hooks/useLockBodyScroll.ts

@@ -1,19 +1,19 @@
-import { useEffect } from 'react';
-
-export const useLockBodyScroll = (isLocked: boolean) => {
-  useEffect(() => {
-    const originalOverflow = document.body.style.overflow;
-
-    if (isLocked) {
-      document.body.style.overflow = 'hidden';
-    } else {
-      document.body.style.overflow = 'unset';
-    }
-
-    return () => {
-      document.body.style.overflow = originalOverflow;
-    };
-  }, [isLocked]);
-};
-
-export default useLockBodyScroll;
+import { useEffect } from 'react';
+
+export const useLockBodyScroll = (isLocked: boolean) => {
+  useEffect(() => {
+    const originalOverflow = document.body.style.overflow;
+
+    if (isLocked) {
+      document.body.style.overflow = 'hidden';
+    } else {
+      document.body.style.overflow = 'unset';
+    }
+
+    return () => {
+      document.body.style.overflow = originalOverflow;
+    };
+  }, [isLocked]);
+};
+
+export default useLockBodyScroll;

package/src/hooks/useModal.ts

@@ -1,45 +1,45 @@
-import { useState } from 'react';
-
-interface UseModalOptions {
-  initial?: boolean;
-  onOpen?: () => void;
-  onClose?: () => void;
-}
-
-export const useModal = (options: UseModalOptions = {}) => {
-  const { initial = false, onOpen, onClose } = options;
-  const [isOpen, setIsOpen] = useState(initial);
-
-  const open = () => {
-    onOpen?.();
-    setIsOpen(true);
-  };
-
-  const close = () => {
-    onClose?.();
-    setIsOpen(false);
-  };
-
-  const toggle = () => {
-    setIsOpen((prev) => {
-      const newState = !prev;
-      if (newState) {
-        onOpen?.();
-      } else {
-        onClose?.();
-      }
-      return newState;
-    });
-  };
-
-  const setOpen = (value: boolean) => {
-    if (value) {
-      onOpen?.();
-    } else {
-      onClose?.();
-    }
-    setIsOpen(value);
-  };
-
-  return { isOpen, open, close, toggle, setOpen };
-};
+import { useState } from 'react';
+
+interface UseModalOptions {
+  initial?: boolean;
+  onOpen?: () => void;
+  onClose?: () => void;
+}
+
+export const useModal = (options: UseModalOptions = {}) => {
+  const { initial = false, onOpen, onClose } = options;
+  const [isOpen, setIsOpen] = useState(initial);
+
+  const open = () => {
+    onOpen?.();
+    setIsOpen(true);
+  };
+
+  const close = () => {
+    onClose?.();
+    setIsOpen(false);
+  };
+
+  const toggle = () => {
+    setIsOpen((prev) => {
+      const newState = !prev;
+      if (newState) {
+        onOpen?.();
+      } else {
+        onClose?.();
+      }
+      return newState;
+    });
+  };
+
+  const setOpen = (value: boolean) => {
+    if (value) {
+      onOpen?.();
+    } else {
+      onClose?.();
+    }
+    setIsOpen(value);
+  };
+
+  return { isOpen, open, close, toggle, setOpen };
+};

package/src/hooks/useTooltip.ts

@@ -1,41 +1,41 @@
-import { useRef, useState } from 'react';
-
-export const useTooltip = () => {
-  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
-
-  const [tooltip, setTooltip] = useState({
-    isVisible: false,
-    x: 0,
-    y: 0,
-  });
-
-  const handleDayMouseEnter = (e: React.MouseEvent<HTMLButtonElement>) => {
-    const rect = e.currentTarget.getBoundingClientRect();
-    const coords = {
-      x: rect.right - 5,
-      y: rect.top - 10,
-    };
-
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-
-    timeoutRef.current = setTimeout(() => {
-      setTooltip({
-        isVisible: true,
-        x: coords.x,
-        y: coords.y,
-      });
-    }, 500);
-  };
-
-  const handleDayMouseLeave = () => {
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-
-    setTooltip((prev) => ({ ...prev, isVisible: false }));
-  };
-
-  return { tooltip, handleDayMouseEnter, handleDayMouseLeave };
-};
+import { useRef, useState } from 'react';
+
+export const useTooltip = () => {
+  const timeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+
+  const [tooltip, setTooltip] = useState({
+    isVisible: false,
+    x: 0,
+    y: 0,
+  });
+
+  const handleDayMouseEnter = (e: React.MouseEvent<HTMLButtonElement>) => {
+    const rect = e.currentTarget.getBoundingClientRect();
+    const coords = {
+      x: rect.right - 5,
+      y: rect.top - 10,
+    };
+
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+    }
+
+    timeoutRef.current = setTimeout(() => {
+      setTooltip({
+        isVisible: true,
+        x: coords.x,
+        y: coords.y,
+      });
+    }, 500);
+  };
+
+  const handleDayMouseLeave = () => {
+    if (timeoutRef.current) {
+      clearTimeout(timeoutRef.current);
+    }
+
+    setTooltip((prev) => ({ ...prev, isVisible: false }));
+  };
+
+  return { tooltip, handleDayMouseEnter, handleDayMouseLeave };
+};

package/src/hooks/useValidate.ts

@@ -1,80 +1,80 @@
-import { useEffect, useState } from 'react';
-import { useIMask } from 'react-imask';
-
-import { DATE_MASK } from '@/constants/dateMask';
-import { getRangeError } from '@/utils/dateChecks';
-import { formatDateForInput, parseDate } from '@/utils/formatDate';
-
-export function useValidate(selectedDate: Date | undefined) {
-  const [currentDate, setCurrentDate] = useState(selectedDate);
-  const [error, setError] = useState('');
-  const { ref, value, setValue } = useIMask(DATE_MASK);
-
-  useEffect(() => {
-    setCurrentDate(selectedDate);
-    if (selectedDate) {
-      setValue(formatDateForInput(selectedDate));
-    } else {
-      setValue('');
-    }
-  }, [selectedDate, setValue]);
-
-  const handleDateValidation = (
-    value: string,
-    startDate?: Date
-  ): Date | undefined => {
-    if (!value) {
-      setError('');
-      setCurrentDate(undefined);
-      return;
-    }
-    const parsed = parseDate(value);
-
-    if (!parsed) {
-      setError('Invalid date');
-      setCurrentDate(undefined);
-      return;
-    }
-
-    if (startDate) {
-      const rangeError = getRangeError(parsed, startDate);
-      if (rangeError) {
-        setError(rangeError);
-        setCurrentDate(undefined);
-        return;
-      }
-    }
-
-    setError('');
-    setCurrentDate(parsed);
-    return parsed;
-  };
-
-  const handleClearInput = () => {
-    setCurrentDate(undefined);
-    setValue('');
-    setError('');
-  };
-
-  const handleDateSelect = (date?: Date) => {
-    setCurrentDate(date);
-    if (!date) {
-      setValue('');
-      return;
-    }
-    setValue(formatDateForInput(date));
-    setError('');
-  };
-
-  return {
-    currentDate,
-    setCurrentDate,
-    handleDateValidation,
-    handleClearInput,
-    handleDateSelect,
-    ref,
-    value,
-    setValue,
-    error,
-  };
-}
+import { useEffect, useState } from 'react';
+import { useIMask } from 'react-imask';
+
+import { DATE_MASK } from '@/constants/dateMask';
+import { getRangeError } from '@/utils/dateChecks';
+import { formatDateForInput, parseDate } from '@/utils/formatDate';
+
+export function useValidate(selectedDate: Date | undefined) {
+  const [currentDate, setCurrentDate] = useState(selectedDate);
+  const [error, setError] = useState('');
+  const { ref, value, setValue } = useIMask(DATE_MASK);
+
+  useEffect(() => {
+    setCurrentDate(selectedDate);
+    if (selectedDate) {
+      setValue(formatDateForInput(selectedDate));
+    } else {
+      setValue('');
+    }
+  }, [selectedDate, setValue]);
+
+  const handleDateValidation = (
+    value: string,
+    startDate?: Date
+  ): Date | undefined => {
+    if (!value) {
+      setError('');
+      setCurrentDate(undefined);
+      return;
+    }
+    const parsed = parseDate(value);
+
+    if (!parsed) {
+      setError('Invalid date');
+      setCurrentDate(undefined);
+      return;
+    }
+
+    if (startDate) {
+      const rangeError = getRangeError(parsed, startDate);
+      if (rangeError) {
+        setError(rangeError);
+        setCurrentDate(undefined);
+        return;
+      }
+    }
+
+    setError('');
+    setCurrentDate(parsed);
+    return parsed;
+  };
+
+  const handleClearInput = () => {
+    setCurrentDate(undefined);
+    setValue('');
+    setError('');
+  };
+
+  const handleDateSelect = (date?: Date) => {
+    setCurrentDate(date);
+    if (!date) {
+      setValue('');
+      return;
+    }
+    setValue(formatDateForInput(date));
+    setError('');
+  };
+
+  return {
+    currentDate,
+    setCurrentDate,
+    handleDateValidation,
+    handleClearInput,
+    handleDateSelect,
+    ref,
+    value,
+    setValue,
+    error,
+  };
+}

package/src/index.ts

@@ -1,15 +1,15 @@
-import { FIRST_DAY_OF_WEEK } from './constants/firstDayOfWeek';
-import { MODES } from './constants/modes';
-
-export { BaseCalendar } from './components/BaseCalendar';
-export type {
-  BaseCalendarProps,
-  CalendarProps,
-} from './components/Calendar/types';
-export type { DatePickerProps } from './components/DatePicker';
-export { DatePicker } from './components/DatePicker';
-export type { RangePickerProps } from './components/RangePicker';
-export { RangePicker } from './components/RangePicker';
-export type { FIRST_DAY_OF_WEEK_TYPES } from './constants/firstDayOfWeek';
-export type { MODES_TYPES } from './constants/modes';
-export { FIRST_DAY_OF_WEEK, MODES };
+import { FIRST_DAY_OF_WEEK } from './constants/firstDayOfWeek';
+import { MODES } from './constants/modes';
+
+export { BaseCalendar } from './components/BaseCalendar';
+export type {
+  BaseCalendarProps,
+  CalendarProps,
+} from './components/Calendar/types';
+export type { DatePickerProps } from './components/DatePicker';
+export { DatePicker } from './components/DatePicker';
+export type { RangePickerProps } from './components/RangePicker';
+export { RangePicker } from './components/RangePicker';
+export type { FIRST_DAY_OF_WEEK_TYPES } from './constants/firstDayOfWeek';
+export type { MODES_TYPES } from './constants/modes';
+export { FIRST_DAY_OF_WEEK, MODES };