feat: Add option for multiple text-input parser patterns (resolves #106)

- fix: Changing value after submit, resets to previous value

Author: Jasenkoo

index.d.ts

@@ -138,7 +138,7 @@ interface VueDatePicker {
         tabSubmit?: boolean;
         openMenu?: boolean;
         rangeSeparator?: string;
-        format?: string;
+        format?: string | string[] | ((value: string) => Date | null);
     };
     teleport?: string | HTMLElement;
     monthNameFormat?: 'long' | 'short';

src/VueDatePicker/components/DatepickerInput.vue

@@ -114,6 +114,9 @@
         const { value } = event.target as HTMLInputElement;
         const { format, rangeSeparator } = props.textInputOptions;
         if (value !== '') {
+            if (props.textInputOptions?.openMenu && !props.isMenuOpen) {
+                emit('open');
+            }
             if (props.range) {
                 const [dateOne, dateTwo] = value.split(`${rangeSeparator}`);
 

src/VueDatePicker/interfaces.ts

@@ -47,7 +47,7 @@ export interface ITextInputOptions {
     tabSubmit: boolean;
     openMenu: boolean;
     rangeSeparator: string;
-    format?: null;
+    format?: string | string[] | ((value: string) => Date | null);
 }
 
 export interface IMonthValue {

src/VueDatePicker/utils/date-utils.ts

@@ -37,14 +37,40 @@ import type {
     IDateFilter,
 } from '@/interfaces';
 
-export const parseFreeInput = (value: string, pattern: string): Date | null => {
+const parseTextToDate = (value: string, pattern: string): Date | null => {
     const parsedDate = parse(value, pattern.slice(0, value.length), new Date());
     if (isValid(parsedDate) && isDate(parsedDate)) {
         return parsedDate;
     }
     return null;
 };
 
+export const parseFreeInput = (
+    value: string,
+    pattern: string | string[] | ((value: string) => Date | null),
+): Date | null => {
+    if (typeof pattern === 'string') {
+        return parseTextToDate(value, pattern);
+    }
+
+    if (Array.isArray(pattern)) {
+        let parsedDate = null;
+        for (let i = 0; i < pattern.length; i++) {
+            parsedDate = parseTextToDate(value, pattern[i]);
+            if (parsedDate) {
+                break;
+            }
+        }
+        return parsedDate;
+    }
+
+    if (typeof pattern === 'function') {
+        return pattern(value);
+    }
+
+    return null;
+};
+
 export const resetDateTime = (value: Date | string): Date => {
     let dateParse = new Date(JSON.parse(JSON.stringify(value)));
     dateParse = setHours(dateParse, 0);