diff --git a/src/components/Input.tsx b/src/components/Input.tsx index 38fc856e..b5d2e6c4 100644 --- a/src/components/Input.tsx +++ b/src/components/Input.tsx @@ -3,7 +3,7 @@ import React, { useCallback, useContext, useEffect, useRef } from "react"; import { BORDER_COLOR, DATE_FORMAT, RING_COLOR } from "../constants"; import DatepickerContext from "../contexts/DatepickerContext"; -import { dateIsValid, parseFormattedDate } from "../helpers"; +import { dateIsValid, normalizeDateInput, parseFormattedDate } from "../helpers"; import ToggleButton from "./ToggleButton"; @@ -71,7 +71,8 @@ const Input: React.FC = (e: Props) => { const dates = []; if (asSingle) { - const date = parseFormattedDate(inputValue, displayFormat); + const normalized = normalizeDateInput(inputValue, displayFormat); + const date = parseFormattedDate(normalized, displayFormat); if (dateIsValid(date.toDate())) { dates.push(date.format(DATE_FORMAT)); } diff --git a/src/helpers/index.ts b/src/helpers/index.ts index d59d919a..36889faa 100644 --- a/src/helpers/index.ts +++ b/src/helpers/index.ts @@ -626,3 +626,40 @@ export function loadLanguageModule(language = LANGUAGE) { export function dateIsValid(date: Date | number) { return date instanceof Date && !isNaN(date.getTime()); } + +// Add in slashes if no seperator exists (all numbers), based on the display format +export function normalizeDateInput(value: string, displayFormat: string) { + const displayFormatWithoutSeperators = displayFormat.replace(/[^A-Z]/gi, ""); + if (value.length === 8 && displayFormatWithoutSeperators === "MMDDYYYY") { + const month = value.slice(0, 2); + const day = value.slice(2, 4); + const year = value.slice(4, 8); + return `${month}/${day}/${year}`; + } else if (value.length === 8 && displayFormatWithoutSeperators === "YYYYMMDD") { + const year = value.slice(0, 4); + const month = value.slice(4, 6); + const day = value.slice(6, 8); + return `${year}/${month}/${day}`; + } else if (value.length === 8 && displayFormatWithoutSeperators === "DDMMYYYY") { + const day = value.slice(0, 2); + const month = value.slice(2, 4); + const year = value.slice(4, 8); + return `${day}/${month}/${year}`; + } else if (value.length === 6 && displayFormatWithoutSeperators === "MMDDYY") { + const month = value.slice(0, 2); + const day = value.slice(2, 4); + const year = value.slice(4, 6); + return `${month}/${day}/${year}`; + } else if (value.length === 6 && displayFormatWithoutSeperators === "YYMMDD") { + const year = value.slice(0, 2); + const month = value.slice(2, 4); + const day = value.slice(4, 6); + return `${year}/${month}/${day}`; + } else if (value.length === 6 && displayFormatWithoutSeperators === "DDMMYY") { + const day = value.slice(0, 2); + const month = value.slice(2, 4); + const year = value.slice(4, 6); + return `${day}/${month}/${year}`; + } + return value; +} diff --git a/tsconfig.json b/tsconfig.json index cf845ae2..0e8307d6 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -20,7 +20,8 @@ "skipLibCheck": true, "noEmit": true, "resolveJsonModule": true, - "isolatedModules": true + "isolatedModules": true, + "incremental": true }, "include": ["src/**/*"], "exclude": ["node_modules"]