Implimentation a type of Date value

Author: NoahMLoomis

src/components/Datepicker.tsx

@@ -9,19 +9,14 @@ import { COLORS, DEFAULT_COLOR } from "../constants";
 import DatepickerContext from "../contexts/DatepickerContext";
 import { formatDate, nextMonth, previousMonth } from "../helpers";
 import useOnClickOutside from "../hooks";
-import { Period } from "../types";
+import { Period, DateValueType } from "../types";
 
 import { Arrow, VerticalDash } from "./utils";
 
 interface Props {
     primaryColor?: string;
-    value: {
-        startDate: string | Date | null;
-        endDate: string | Date | null;
-    } | null;
-    onChange: (
-        value: { startDate: string | Date | null; endDate: string | Date | null } | null
-    ) => void;
+    value: DateValueType;
+    onChange: (value: DateValueType) => void;
     useRange?: boolean;
     showFooter?: boolean;
     showShortcuts?: boolean;

src/contexts/DatepickerContext.ts

@@ -1,12 +1,7 @@
 import dayjs from "dayjs";
 import React, { createContext } from "react";
 
-import { Configs, Period } from "../types";
-
-type DateRange = {
-    startDate: string | Date | null;
-    endDate: string | Date | null;
-} | null;
+import { Configs, Period, DateValueType } from "../types";
 
 interface DatepickerStore {
     asSingle?: boolean;
@@ -22,12 +17,12 @@ interface DatepickerStore {
     inputText: string;
     changeInputText: (text: string) => void;
     updateFirstDate: (date: dayjs.Dayjs) => void;
-    changeDatepickerValue: (value: DateRange) => void;
+    changeDatepickerValue: (value: DateValueType) => void;
     showFooter?: boolean;
     placeholder?: string | null;
     separator?: string;
     i18n: string;
-    value: DateRange;
+    value: DateValueType;
     disabled?: boolean;
     inputClassName?: string | null;
     containerClassName?: string | null;

src/types/index.ts

@@ -25,3 +25,10 @@ export interface ShortcutsItem {
         end: string;
     };
 }
+
+export type DateType = string | null | Date;
+
+export type DateValueType = {
+    startDate: DateType;
+    endDate: DateType;
+} | null;