feat!: Add option to set openMenu in text-input to toggle (reso…

…lves #905)
Vuepic · Jul 7, 2024 · bee7728 · bee7728
1 parent 58ff212
commit bee7728
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 10 deletions.
diff --git a/src/VueDatePicker/components/DatepickerInput.vue b/src/VueDatePicker/components/DatepickerInput.vue
@@ -272,13 +272,9 @@
     const handleOpen = (ev: KeyboardEvent | MouseEvent) => {
         ev.preventDefault();
         checkStopPropagation(ev, defaultedConfig.value, true);
-        if (
-            defaultedTextInput.value.enabled &&
-            defaultedTextInput.value.openMenu &&
-            !defaultedInline.value.input &&
-            !props.isMenuOpen
-        ) {
-            emit('open');
+        if (defaultedTextInput.value.enabled && defaultedTextInput.value.openMenu && !defaultedInline.value.input) {
+            if (defaultedTextInput.value.openMenu === 'open' && !props.isMenuOpen) return emit('open');
+            if (defaultedTextInput.value.openMenu === 'toggle') return emit('toggle');
         } else if (!defaultedTextInput.value.enabled) {
             emit('toggle');
         }
@@ -304,7 +300,7 @@
 
     const handleKeyPress = (ev: KeyboardEvent, fromInput?: boolean): void => {
         if (ev.key === 'Tab') {
-            handleTab(ev, false);
+            handleTab(ev, fromInput);
         }
         if (ev.key === 'Enter') {
             handleEnter(ev);

diff --git a/src/VueDatePicker/interfaces.ts b/src/VueDatePicker/interfaces.ts
@@ -45,7 +45,7 @@ export interface ICalendarDate {
 export interface TextInputOptions {
     enterSubmit: boolean;
     tabSubmit: boolean;
-    openMenu: boolean;
+    openMenu: string | boolean;
     rangeSeparator: string;
     selectOnFocus: boolean;
     format?: string | string[] | ((value: string) => Date | null);

diff --git a/src/VueDatePicker/utils/defaults.ts b/src/VueDatePicker/utils/defaults.ts
@@ -119,7 +119,7 @@ export const getDefaultTextInputOptions = (textInput: TextInputProp): TextInputO
     const defaultOptions = {
         enterSubmit: true,
         tabSubmit: true,
-        openMenu: true,
+        openMenu: 'open',
         selectOnFocus: false,
         rangeSeparator: ' - ',
     };