This commit is contained in:
@@ -3,13 +3,13 @@ import {addDelegatedEventListener, generateElemId, isDocumentFragmentOrElementNo
|
||||
import octiconKebabHorizontal from '../../../public/assets/img/svg/octicon-kebab-horizontal.svg';
|
||||
|
||||
window.customElements.define('overflow-menu', class extends HTMLElement {
|
||||
popup: HTMLDivElement;
|
||||
overflowItems: Array<HTMLElement>;
|
||||
button: HTMLButtonElement | null;
|
||||
menuItemsEl: HTMLElement;
|
||||
resizeObserver: ResizeObserver;
|
||||
mutationObserver: MutationObserver;
|
||||
lastWidth: number;
|
||||
popup!: HTMLDivElement;
|
||||
overflowItems: Array<HTMLElement> = [];
|
||||
button: HTMLButtonElement | null = null;
|
||||
menuItemsEl!: HTMLElement;
|
||||
resizeObserver!: ResizeObserver;
|
||||
mutationObserver!: MutationObserver;
|
||||
lastWidth!: number;
|
||||
|
||||
updateButtonActivationState() {
|
||||
if (!this.button || !this.popup) return;
|
||||
@@ -21,7 +21,7 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
|
||||
this.popup.style.display = '';
|
||||
this.button!.setAttribute('aria-expanded', 'true');
|
||||
setTimeout(() => this.popup.focus(), 0);
|
||||
document.addEventListener('click', this.onClickOutside, true);
|
||||
document.addEventListener('click', this.onClickOutside, {capture: true});
|
||||
}
|
||||
|
||||
hidePopup() {
|
||||
@@ -100,7 +100,7 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
|
||||
const itemOverFlowMenuButton = this.querySelector<HTMLButtonElement>('.overflow-menu-button');
|
||||
|
||||
// move items in popup back into the menu items for subsequent measurement
|
||||
for (const item of this.overflowItems || []) {
|
||||
for (const item of this.overflowItems) {
|
||||
if (!itemFlexSpace || item.getAttribute('data-after-flex-space')) {
|
||||
this.menuItemsEl.append(item);
|
||||
} else {
|
||||
@@ -125,7 +125,7 @@ window.customElements.define('overflow-menu', class extends HTMLElement {
|
||||
const itemRight = item.offsetLeft + item.offsetWidth;
|
||||
if (menuRight - itemRight < 38) { // roughly the width of .overflow-menu-button with some extra space
|
||||
const onlyLastItem = idx === menuItems.length - 1 && this.overflowItems.length === 0;
|
||||
const lastItemFit = onlyLastItem && menuRight - itemRight > 0;
|
||||
const lastItemFit = onlyLastItem && menuRight > itemRight;
|
||||
const moveToPopup = !onlyLastItem || !lastItemFit;
|
||||
if (moveToPopup) this.overflowItems.push(item);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user