Fixed #4850 - PickList OrderList | Keyboard Support Enhancements

primefaces · Nov 20, 2023 · a5a4f62 · a5a4f62
1 parent 20a818b
commit a5a4f62
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 2 deletions.
diff --git a/components/lib/orderlist/OrderList.vue b/components/lib/orderlist/OrderList.vue
@@ -187,6 +187,8 @@ export default {
                     if (event.ctrlKey) {
                         this.d_selection = [...this.modelValue];
                         this.$emit('update:selection', this.d_selection);
+
+                        event.preventDefault();
                     }
 
                 default:
@@ -227,6 +229,10 @@ export default {
 
                 this.d_selection = [...this.modelValue].slice(0, matchedOptionIndex + 1);
                 this.$emit('update:selection', this.d_selection);
+                this.$emit('selection-change', {
+                    originalEvent: event,
+                    value: this.d_selection
+                });
             } else {
                 this.changeFocusedOptionIndex(0);
             }
@@ -241,6 +247,10 @@ export default {
 
                 this.d_selection = [...this.modelValue].slice(matchedOptionIndex, items.length);
                 this.$emit('update:selection', this.d_selection);
+                this.$emit('selection-change', {
+                    originalEvent: event,
+                    value: this.d_selection
+                });
             } else {
                 this.changeFocusedOptionIndex(DomHandler.find(this.list, '[data-pc-section="item"]').length - 1);
             }
@@ -257,14 +267,20 @@ export default {
             event.preventDefault();
         },
         onSpaceKey(event) {
-            if (event.shiftKey) {
+            event.preventDefault();
+
+            if (event.shiftKey && this.d_selection && this.d_selection.length > 0) {
                 const items = DomHandler.find(this.list, '[data-pc-section="item"]');
                 const selectedItemIndex = ObjectUtils.findIndexInList(this.d_selection[0], [...this.modelValue]);
                 const focusedItem = DomHandler.findSingle(this.list, `[data-pc-section="item"][id=${this.focusedOptionIndex}]`);
                 const matchedOptionIndex = [...items].findIndex((item) => item === focusedItem);
 
                 this.d_selection = [...this.modelValue].slice(Math.min(selectedItemIndex, matchedOptionIndex), Math.max(selectedItemIndex, matchedOptionIndex) + 1);
                 this.$emit('update:selection', this.d_selection);
+                this.$emit('selection-change', {
+                    originalEvent: event,
+                    value: this.d_selection
+                });
             } else {
                 this.onEnterKey(event);
             }

diff --git a/components/lib/picklist/PickList.vue b/components/lib/picklist/PickList.vue
@@ -617,6 +617,8 @@ export default {
                     if (event.ctrlKey) {
                         this.d_selection = [...this.modelValue];
                         this.$emit('update:selection', this.d_selection);
+
+                        event.preventDefault();
                     }
 
                 default:
@@ -658,7 +660,7 @@ export default {
         onSpaceKey(event, listType) {
             event.preventDefault();
 
-            if (event.shiftKey) {
+            if (event.shiftKey && this.d_selection && this.d_selection.length > 0) {
                 const listId = listType === 'sourceList' ? 0 : 1;
                 const items = DomHandler.find(this.$refs[listType].$el, '[data-pc-section="item"]');
                 const selectedItemIndex = ObjectUtils.findIndexInList(this.d_selection[listId][0], [...this.modelValue[listId]]);
@@ -667,6 +669,10 @@ export default {
 
                 this.d_selection[listId] = [...this.modelValue[listId]].slice(Math.min(selectedItemIndex, matchedOptionIndex), Math.max(selectedItemIndex, matchedOptionIndex) + 1);
                 this.$emit('update:selection', this.d_selection);
+                this.$emit('selection-change', {
+                    originalEvent: event,
+                    value: this.d_selection
+                });
             } else {
                 this.onEnterKey(event, listType);
             }
@@ -680,6 +686,10 @@ export default {
 
                 this.d_selection[listId] = [...this.modelValue[listId]].slice(0, matchedOptionIndex + 1);
                 this.$emit('update:selection', this.d_selection);
+                this.$emit('selection-change', {
+                    originalEvent: event,
+                    value: this.d_selection
+                });
             } else {
                 this.changeFocusedOptionIndex(0, listType);
             }
@@ -696,6 +706,10 @@ export default {
 
                 this.d_selection[listId] = [...this.modelValue[listId]].slice(matchedOptionIndex, items.length);
                 this.$emit('update:selection', this.d_selection);
+                this.$emit('selection-change', {
+                    originalEvent: event,
+                    value: this.d_selection
+                });
             } else {
                 this.changeFocusedOptionIndex(items.length - 1, listType);
             }