mirror of
https://github.com/Choices-js/Choices.git
synced 2026-03-14 14:45:47 +01:00
Only add events and more when the dropdown is detached
This commit is contained in:
parent
2c4e4e8642
commit
d90693da2d
2 changed files with 16 additions and 8 deletions
|
|
@ -1572,8 +1572,6 @@ class Choices {
|
|||
documentElement.addEventListener('touchend', this._onTouchEnd, true);
|
||||
outerElement.addEventListener('keydown', this._onKeyDown, true);
|
||||
outerElement.addEventListener('mousedown', this._onMouseDown, true);
|
||||
dropdownElement.addEventListener('keydown', this._onKeyDown, true);
|
||||
dropdownElement.addEventListener('mousedown', this._onMouseDown, true);
|
||||
|
||||
// passive events - doesn't call `preventDefault` or `stopPropagation`
|
||||
documentElement.addEventListener('click', this._onClick, { passive: true });
|
||||
|
|
@ -1624,6 +1622,8 @@ class Choices {
|
|||
}
|
||||
|
||||
if (this._dropdownDetached) {
|
||||
dropdownElement.addEventListener('keydown', this._onKeyDown, true);
|
||||
dropdownElement.addEventListener('mousedown', this._onMouseDown, true);
|
||||
window.addEventListener('resize', this._onWindowResize);
|
||||
}
|
||||
|
||||
|
|
@ -1640,8 +1640,6 @@ class Choices {
|
|||
documentElement.removeEventListener('touchend', this._onTouchEnd, true);
|
||||
outerElement.removeEventListener('keydown', this._onKeyDown, true);
|
||||
outerElement.removeEventListener('mousedown', this._onMouseDown, true);
|
||||
dropdownElement.removeEventListener('keydown', this._onKeyDown);
|
||||
dropdownElement.removeEventListener('mousedown', this._onMouseDown);
|
||||
|
||||
documentElement.removeEventListener('click', this._onClick);
|
||||
documentElement.removeEventListener('touchmove', this._onTouchMove);
|
||||
|
|
@ -1667,6 +1665,8 @@ class Choices {
|
|||
}
|
||||
|
||||
if (this._dropdownDetached) {
|
||||
dropdownElement.removeEventListener('keydown', this._onKeyDown);
|
||||
dropdownElement.removeEventListener('mousedown', this._onMouseDown);
|
||||
window.removeEventListener('resize', this._onWindowResize);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -68,21 +68,25 @@ export default class Container {
|
|||
this.element.removeAttribute('aria-activedescendant');
|
||||
}
|
||||
|
||||
open(dropdownPos: number, dropdownHeight: number, dropdown: HTMLElement): boolean {
|
||||
open(dropdownPos: number, dropdownHeight: number, dropdown: HTMLElement | null = null): boolean {
|
||||
addClassesToElement(this.element, this.classNames.openState);
|
||||
this.element.setAttribute('aria-expanded', 'true');
|
||||
this.isOpen = true;
|
||||
|
||||
if (this.shouldFlip(dropdownPos, dropdownHeight)) {
|
||||
addClassesToElement(this.element, this.classNames.flippedState);
|
||||
addClassesToElement(dropdown, this.classNames.flippedState);
|
||||
|
||||
if (dropdown !== null) {
|
||||
addClassesToElement(dropdown, this.classNames.flippedState);
|
||||
}
|
||||
|
||||
this.isFlipped = true;
|
||||
}
|
||||
|
||||
return this.isFlipped;
|
||||
}
|
||||
|
||||
close(dropdown: HTMLElement): void {
|
||||
close(dropdown: HTMLElement | null = null): void {
|
||||
removeClassesFromElement(this.element, this.classNames.openState);
|
||||
this.element.setAttribute('aria-expanded', 'false');
|
||||
this.removeActiveDescendant();
|
||||
|
|
@ -90,7 +94,11 @@ export default class Container {
|
|||
|
||||
// A dropdown flips if it does not have space within the page
|
||||
removeClassesFromElement(this.element, this.classNames.flippedState);
|
||||
removeClassesFromElement(dropdown, this.classNames.flippedState);
|
||||
|
||||
if (dropdown !== null) {
|
||||
removeClassesFromElement(dropdown, this.classNames.flippedState);
|
||||
}
|
||||
|
||||
this.isFlipped = false;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue