Mobile behavior changes

pull/6577/head
tugcekucukoglu 2024-10-15 08:43:41 +03:00
parent 36e32c7d71
commit 42a80d2726
3 changed files with 29 additions and 14 deletions

View File

@ -306,7 +306,7 @@ export default {
this.clicked = false; this.clicked = false;
}, },
onOptionChange(event) { onOptionChange(event) {
const { processedOption } = event; const { processedOption, type } = event;
if (isEmpty(processedOption)) return; if (isEmpty(processedOption)) return;
@ -314,15 +314,20 @@ export default {
const grouped = isNotEmpty(children); const grouped = isNotEmpty(children);
const activeOptionPath = this.activeOptionPath.filter((p) => p.parentKey !== parentKey && p.parentKey !== key); const activeOptionPath = this.activeOptionPath.filter((p) => p.parentKey !== parentKey && p.parentKey !== key);
this.focusedOptionInfo = { index, level, parentKey };
if (type == 'hover' && this.queryMatches) {
return;
}
if (grouped) { if (grouped) {
activeOptionPath.push(processedOption); activeOptionPath.push(processedOption);
} }
this.focusedOptionInfo = { index, level, parentKey };
this.activeOptionPath = activeOptionPath; this.activeOptionPath = activeOptionPath;
}, },
onOptionClick(event, preventSelection) { onOptionClick(event) {
const { originalEvent, processedOption, isFocus, isHide } = event; const { originalEvent, processedOption, isFocus, isHide, preventSelection } = event;
const { index, key, level, parentKey } = processedOption; const { index, key, level, parentKey } = processedOption;
const grouped = this.isProccessedOptionGroup(processedOption); const grouped = this.isProccessedOptionGroup(processedOption);
const selected = this.isSelected(processedOption); const selected = this.isSelected(processedOption);
@ -353,9 +358,9 @@ export default {
onOptionMouseEnter(event) { onOptionMouseEnter(event) {
if (this.focusOnHover) { if (this.focusOnHover) {
if (this.dirty || (!this.dirty && isNotEmpty(this.modelValue))) { if (this.dirty || (!this.dirty && isNotEmpty(this.modelValue))) {
this.onOptionChange(event); this.onOptionChange({ ...event, type: 'hover' });
} else if (!this.dirty && event.processedOption.level === 0) { } else if (!this.dirty && event.processedOption.level === 0) {
this.onOptionClick(event); this.onOptionClick({ ...event, type: 'hover' });
} }
} }
}, },
@ -496,7 +501,7 @@ export default {
const processedOption = this.visibleOptions[this.focusedOptionInfo.index]; const processedOption = this.visibleOptions[this.focusedOptionInfo.index];
const grouped = this.isProccessedOptionGroup(processedOption); const grouped = this.isProccessedOptionGroup(processedOption);
this.onOptionClick({ originalEvent: event, processedOption }, false); this.onOptionClick({ originalEvent: event, processedOption, preventSelection: false });
!grouped && this.hide(); !grouped && this.hide();
} }
} }
@ -732,7 +737,7 @@ export default {
this.scrollInView(); this.scrollInView();
if (this.focusOnHover) { if (this.focusOnHover) {
this.onOptionClick({ originalEvent: event, processedOption: this.visibleOptions[index], isHide: false }, preventSelection); this.onOptionClick({ originalEvent: event, processedOption: this.visibleOptions[index], isHide: false, preventSelection });
} }
if (this.selectOnFocus) { if (this.selectOnFocus) {

View File

@ -223,7 +223,7 @@ export default {
break; break;
} }
}, },
onItemChange(event) { onItemChange(event, type) {
const { processedItem, isFocus } = event; const { processedItem, isFocus } = event;
if (isEmpty(processedItem)) return; if (isEmpty(processedItem)) return;
@ -238,9 +238,14 @@ export default {
} }
this.focusedItemInfo = { index, level, parentKey }; this.focusedItemInfo = { index, level, parentKey };
this.activeItemPath = activeItemPath;
isFocus && focus(this.list); isFocus && focus(this.list);
if (type === 'hover' && this.queryMatches) {
return;
}
this.activeItemPath = activeItemPath;
}, },
onItemClick(event) { onItemClick(event) {
const { processedItem } = event; const { processedItem } = event;
@ -259,7 +264,7 @@ export default {
} }
}, },
onItemMouseEnter(event) { onItemMouseEnter(event) {
this.onItemChange(event); this.onItemChange(event, 'hover');
}, },
onItemMouseMove(event) { onItemMouseMove(event) {
if (this.focused) { if (this.focused) {

View File

@ -248,7 +248,7 @@ export default {
break; break;
} }
}, },
onItemChange(event) { onItemChange(event, type) {
const { processedItem, isFocus } = event; const { processedItem, isFocus } = event;
if (isEmpty(processedItem)) return; if (isEmpty(processedItem)) return;
@ -264,10 +264,15 @@ export default {
} }
this.focusedItemInfo = { index, level, parentKey }; this.focusedItemInfo = { index, level, parentKey };
this.activeItemPath = activeItemPath;
grouped && (this.dirty = true); grouped && (this.dirty = true);
isFocus && focus(this.menubar); isFocus && focus(this.menubar);
if (type === 'hover' && this.queryMatches) {
return;
}
this.activeItemPath = activeItemPath;
}, },
onOverlayClick(event) { onOverlayClick(event) {
OverlayEventBus.emit('overlay-click', { OverlayEventBus.emit('overlay-click', {
@ -304,7 +309,7 @@ export default {
}, },
onItemMouseEnter(event) { onItemMouseEnter(event) {
if (this.dirty) { if (this.dirty) {
this.onItemChange(event); this.onItemChange(event, 'hover');
} }
}, },
onItemMouseMove(event) { onItemMouseMove(event) {