vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Fixed #5144 - Keyboard accessibility is not working on OrderList and PickList

pull/5161/head
mertsincan 2024-01-24 16:22:47 +00:00
parent f7f857be9d
commit 0512362f38
2 changed files with 13 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
components/lib/orderlist/OrderList.vue
View File

@ -142,6 +142,7 @@ export default {
onListFocus(event) { onListFocus(event) {
this.focused = true; this.focused = true;
this.findCurrentFocusedIndex(); this.findCurrentFocusedIndex();
this.scrollInView(this.focusedOptionIndex);
this.$emit('focus', event); this.$emit('focus', event);
}, },
onListBlur(event) { onListBlur(event) {
@ -189,9 +190,7 @@ export default {
} }
}, },
onOptionMouseDown(event, index) { onOptionMouseDown(event, index) {
this.focused = true; this.changeFocusedOptionIndex(index);
this.focusedOptionIndex = `${this.id}_${index}`;
event.preventDefault();
}, },
onOptionMouseMove(index) { onOptionMouseMove(index) {
if (this.focusOnHover && this.focused) { if (this.focusOnHover && this.focused) {
@ -282,13 +281,13 @@ export default {
return DomHandler.findSingle(this.list, `[data-pc-section="item"][id=${this.focusedOptionIndex}]`); return DomHandler.findSingle(this.list, `[data-pc-section="item"][id=${this.focusedOptionIndex}]`);
}, },
findCurrentFocusedIndex() { findCurrentFocusedIndex() {
if (this.focusedOptionIndex === -1) {
this.focusedOptionIndex = this.findFirstSelectedOptionIndex(); this.focusedOptionIndex = this.findFirstSelectedOptionIndex();
if (this.autoOptionFocus && this.focusedOptionIndex === -1) { if (this.autoOptionFocus && this.focusedOptionIndex === -1) {
this.focusedOptionIndex = this.findFirstFocusedOptionIndex(); this.focusedOptionIndex = this.findFirstFocusedOptionIndex();
} }
}
this.scrollInView(this.focusedOptionIndex);
}, },
findFirstFocusedOptionIndex() { findFirstFocusedOptionIndex() {
const firstFocusableItem = DomHandler.findSingle(this.list, '[data-pc-section="item"]'); const firstFocusableItem = DomHandler.findSingle(this.list, '[data-pc-section="item"]');

6
components/lib/picklist/PickList.vue
View File

@ -304,6 +304,7 @@ export default {
onListFocus(event, listType) { onListFocus(event, listType) {
this.focused[listType] = true; this.focused[listType] = true;
this.findCurrentFocusedIndex(listType); this.findCurrentFocusedIndex(listType);
this.scrollInView(this.focusedOptionIndex, listType);
this.$emit('focus', event); this.$emit('focus', event);
}, },
onListBlur(event, listType) { onListBlur(event, listType) {
@ -314,7 +315,6 @@ export default {
onOptionMouseDown(event, index, listType) { onOptionMouseDown(event, index, listType) {
this.focused[listType] = true; this.focused[listType] = true;
this.focusedOptionIndex = index; this.focusedOptionIndex = index;
event.preventDefault();
}, },
onOptionMouseMove(index, listType) { onOptionMouseMove(index, listType) {
if (this.focusOnHover && this.focused[listType]) { if (this.focusOnHover && this.focused[listType]) {
@ -752,13 +752,13 @@ export default {
return DomHandler.findSingle(this.$refs[listType].$el, `[data-pc-section="item"][id=${this.focusedOptionIndex}]`); return DomHandler.findSingle(this.$refs[listType].$el, `[data-pc-section="item"][id=${this.focusedOptionIndex}]`);
}, },
findCurrentFocusedIndex(listType) { findCurrentFocusedIndex(listType) {
if (this.focusedOptionIndex === -1) {
this.focusedOptionIndex = this.findFirstSelectedOptionIndex(listType); this.focusedOptionIndex = this.findFirstSelectedOptionIndex(listType);
if (this.autoOptionFocus && this.focusedOptionIndex === -1) { if (this.autoOptionFocus && this.focusedOptionIndex === -1) {
this.focusedOptionIndex = this.findFirstFocusedOptionIndex(listType); this.focusedOptionIndex = this.findFirstFocusedOptionIndex(listType);
} }
}
this.scrollInView(this.focusedOptionIndex, listType);
}, },
findFirstFocusedOptionIndex(listType) { findFirstFocusedOptionIndex(listType) {
const firstFocusableItem = DomHandler.findSingle(this.$refs[listType].$el, '[data-pc-section="item"]'); const firstFocusableItem = DomHandler.findSingle(this.$refs[listType].$el, '[data-pc-section="item"]');