@ui5/webcomponents 0.0.0-453158269 → 0.0.0-49cef2d02

package/src/i18n/messagebundle_tr.properties

@@ -59,19 +59,19 @@ COLOR_PALETTE_DIALOG_TITLE=Rengi değiştir
 
 COLOR_PALETTE_MORE_COLORS_TEXT=Daha fazla renk...
 
-COLORPICKER_ALPHA_SLIDER=Alpha control
+COLORPICKER_ALPHA_SLIDER=Alfa denetimi
 
-COLORPICKER_HUE_SLIDER=Hue control
+COLORPICKER_HUE_SLIDER=Renk tonu denetimi
 
-COLORPICKER_HEX=Hexadecimal
+COLORPICKER_HEX=Onaltılı
 
-COLORPICKER_RED=Red
+COLORPICKER_RED=Kırmızı
 
-COLORPICKER_GREEN=Green
+COLORPICKER_GREEN=Yeşil
 
-COLORPICKER_BLUE=Blue
+COLORPICKER_BLUE=Mavi
 
-COLORPICKER_ALPHA=Alpha
+COLORPICKER_ALPHA=Alfa
 
 DATEPICKER_OPEN_ICON_TITLE=Seçiciyi aç
 
@@ -113,6 +113,8 @@ LIST_ITEM_SELECTED=Seçilenler
 
 LIST_ITEM_NOT_SELECTED=Seçilmedi
 
+LIST_ITEM_GROUP_HEADER=Grup başlığı
+
 ARIA_LABEL_LIST_ITEM_CHECKBOX=Çoklu seçim kipi
 
 ARIA_LABEL_LIST_ITEM_RADIO_BUTTON=Öğe seçimi.
@@ -167,7 +169,7 @@ SLIDER_ARIA_DESCRIPTION=Kaydırıcı tutamacı
 
 LOAD_MORE_TEXT=Daha fazla
 
-TABLE_HEADER_ROW_TEXT=Başlık
+TABLE_HEADER_ROW_INFORMATION={0} başlık satırı 1
 
 TABLE_ROW_POSITION={0}/{1}
 
@@ -177,6 +179,14 @@ ARIA_LABEL_ROW_SELECTION=Kalem seçimi
 
 ARIA_LABEL_SELECT_ALL_CHECKBOX=Tüm satırları seç
 
+TAB_ARIA_DESIGN_POSITIVE=Pozitif
+
+TAB_ARIA_DESIGN_NEGATIVE=Negatif
+
+TAB_ARIA_DESIGN_CRITICAL=Kritik
+
+TAB_ARIA_DESIGN_NEUTRAL=Nötr
+
 TABCONTAINER_NEXT_ICON_ACC_NAME=Sonraki
 
 TABCONTAINER_PREVIOUS_ICON_ACC_NAME=Önceki
@@ -197,8 +207,6 @@ TIMEPICKER_MINUTES_LABEL=Dakika
 
 TIMEPICKER_SECONDS_LABEL=Saniye
 
-TIMEPICKER_PERIODS_LABEL=AM/PM
-
 TIMEPICKER_SUBMIT_BUTTON=Tamam
 
 TIMEPICKER_CANCEL_BUTTON=İptal et
@@ -229,6 +237,14 @@ TREE_ITEM_EXPAND_NODE=Düğümü genişlet
 
 TREE_ITEM_COLLAPSE_NODE=Düğümü daralt
 
+VALUE_STATE_TYPE_ERROR=Hata değer durumu
+
+VALUE_STATE_TYPE_WARNING=Uyarı değer durumu
+
+VALUE_STATE_TYPE_SUCCESS=Başarı değer durumu
+
+VALUE_STATE_TYPE_INFORMATION=Bilgi değer durumu
+
 VALUE_STATE_ERROR=Geçersiz giriş
 
 VALUE_STATE_WARNING=Uyarı verildi
@@ -247,6 +263,10 @@ DAY_PICKER_NON_WORKING_DAY=Çalışılmayan gün
 
 DAY_PICKER_TODAY=Bugün
 
+MONTH_PICKER_DESCRIPTION=Ay seçici
+
+YEAR_PICKER_DESCRIPTION=Yıl seçici
+
 STEPINPUT_DEC_ICON_TITLE=Azalt
 
 STEPINPUT_INC_ICON_TITLE=Artır

package/src/i18n/messagebundle_uk.properties

@@ -59,19 +59,19 @@ COLOR_PALETTE_DIALOG_TITLE=Змінити колір
 
 COLOR_PALETTE_MORE_COLORS_TEXT=Більше кольорів...
 
-COLORPICKER_ALPHA_SLIDER=Alpha control
+COLORPICKER_ALPHA_SLIDER=Елемент регулювання Альфа
 
-COLORPICKER_HUE_SLIDER=Hue control
+COLORPICKER_HUE_SLIDER=Елемент регулювання відтінку
 
-COLORPICKER_HEX=Hexadecimal
+COLORPICKER_HEX=Шістнадцятковий
 
-COLORPICKER_RED=Red
+COLORPICKER_RED=Червоний
 
-COLORPICKER_GREEN=Green
+COLORPICKER_GREEN=Зелений
 
-COLORPICKER_BLUE=Blue
+COLORPICKER_BLUE=Синій
 
-COLORPICKER_ALPHA=Alpha
+COLORPICKER_ALPHA=Альфа
 
 DATEPICKER_OPEN_ICON_TITLE=Відкрити комплектувальник
 
@@ -113,6 +113,8 @@ LIST_ITEM_SELECTED=Вибране
 
 LIST_ITEM_NOT_SELECTED=Не вибрано
 
+LIST_ITEM_GROUP_HEADER=Заголовок групи
+
 ARIA_LABEL_LIST_ITEM_CHECKBOX=Режим множинного вибору
 
 ARIA_LABEL_LIST_ITEM_RADIO_BUTTON=Вибір позиції.
@@ -141,7 +143,7 @@ VALUE_STATE_ERROR_ALREADY_SELECTED=Це значення вже вибрано.
 
 MULTIINPUT_ROLEDESCRIPTION_TEXT=Багатозначне введення
 
-MULTIINPUT_SHOW_MORE_TOKENS={0} Більше
+MULTIINPUT_SHOW_MORE_TOKENS=Ще {0}
 
 PANEL_ICON=Розгорнути/згорнути
 
@@ -167,7 +169,7 @@ SLIDER_ARIA_DESCRIPTION=Маркер повзунка
 
 LOAD_MORE_TEXT=Більше
 
-TABLE_HEADER_ROW_TEXT=Рядок заголовка
+TABLE_HEADER_ROW_INFORMATION=Рядок заголовка 1 з {0}
 
 TABLE_ROW_POSITION={0} з {1}
 
@@ -177,6 +179,14 @@ ARIA_LABEL_ROW_SELECTION=Вибір позиції
 
 ARIA_LABEL_SELECT_ALL_CHECKBOX=Вибрати всі рядки
 
+TAB_ARIA_DESIGN_POSITIVE=Додатне
+
+TAB_ARIA_DESIGN_NEGATIVE=Від’ємне
+
+TAB_ARIA_DESIGN_CRITICAL=Критично
+
+TAB_ARIA_DESIGN_NEUTRAL=Нейтрально
+
 TABCONTAINER_NEXT_ICON_ACC_NAME=Далі
 
 TABCONTAINER_PREVIOUS_ICON_ACC_NAME=Назад
@@ -197,8 +207,6 @@ TIMEPICKER_MINUTES_LABEL=Хвилини
 
 TIMEPICKER_SECONDS_LABEL=Секунди
 
-TIMEPICKER_PERIODS_LABEL=AM/PM
-
 TIMEPICKER_SUBMIT_BUTTON=OK
 
 TIMEPICKER_CANCEL_BUTTON=Скасувати
@@ -229,6 +237,14 @@ TREE_ITEM_EXPAND_NODE=Розгорнути вузол
 
 TREE_ITEM_COLLAPSE_NODE=Згорнути вузол
 
+VALUE_STATE_TYPE_ERROR=Стан значення: помилка
+
+VALUE_STATE_TYPE_WARNING=Стан значення: застереження
+
+VALUE_STATE_TYPE_SUCCESS=Стан значення: успіх
+
+VALUE_STATE_TYPE_INFORMATION=Стан значення: інформація
+
 VALUE_STATE_ERROR=Недійсний запис
 
 VALUE_STATE_WARNING=Застереження видано
@@ -247,6 +263,10 @@ DAY_PICKER_NON_WORKING_DAY=Неробочий день
 
 DAY_PICKER_TODAY=Сьогодні
 
+MONTH_PICKER_DESCRIPTION=Комплектувальник місяця
+
+YEAR_PICKER_DESCRIPTION=Комплектувальник року
+
 STEPINPUT_DEC_ICON_TITLE=Зменшити
 
 STEPINPUT_INC_ICON_TITLE=Збільшити

package/src/i18n/messagebundle_vi.properties

@@ -59,17 +59,17 @@ COLOR_PALETTE_DIALOG_TITLE=Thay đổi màu
 
 COLOR_PALETTE_MORE_COLORS_TEXT=Nhiều màu hơn...
 
-COLORPICKER_ALPHA_SLIDER=Alpha control
+COLORPICKER_ALPHA_SLIDER=Kiểm soát Alpha
 
-COLORPICKER_HUE_SLIDER=Hue control
+COLORPICKER_HUE_SLIDER=Kiểm soát sắc độ màu
 
-COLORPICKER_HEX=Hexadecimal
+COLORPICKER_HEX=Thập lục phân
 
-COLORPICKER_RED=Red
+COLORPICKER_RED=Đỏ
 
-COLORPICKER_GREEN=Green
+COLORPICKER_GREEN=Xanh lá cây
 
-COLORPICKER_BLUE=Blue
+COLORPICKER_BLUE=Xanh da trời
 
 COLORPICKER_ALPHA=Alpha
 
@@ -113,6 +113,8 @@ LIST_ITEM_SELECTED=Được chọn
 
 LIST_ITEM_NOT_SELECTED=Không được chọn
 
+LIST_ITEM_GROUP_HEADER=Tiêu đề nhóm
+
 ARIA_LABEL_LIST_ITEM_CHECKBOX=Chế độ đa lựa chọn
 
 ARIA_LABEL_LIST_ITEM_RADIO_BUTTON=Lựa chọn mục.
@@ -167,7 +169,7 @@ SLIDER_ARIA_DESCRIPTION=Điều khiển thanh trượt
 
 LOAD_MORE_TEXT=Thêm
 
-TABLE_HEADER_ROW_TEXT=Hàng tiêu đề
+TABLE_HEADER_ROW_INFORMATION=Hàng tiêu đề 1 trong {0}
 
 TABLE_ROW_POSITION={0} của {1}
 
@@ -177,6 +179,14 @@ ARIA_LABEL_ROW_SELECTION=Lựa chọn mục
 
 ARIA_LABEL_SELECT_ALL_CHECKBOX=Lựa chọn tất cả hàng
 
+TAB_ARIA_DESIGN_POSITIVE=Dương
+
+TAB_ARIA_DESIGN_NEGATIVE=Âm
+
+TAB_ARIA_DESIGN_CRITICAL=Tới hạn
+
+TAB_ARIA_DESIGN_NEUTRAL=Trung tính
+
 TABCONTAINER_NEXT_ICON_ACC_NAME=Kế tiếp
 
 TABCONTAINER_PREVIOUS_ICON_ACC_NAME=Trước
@@ -197,8 +207,6 @@ TIMEPICKER_MINUTES_LABEL=Phút
 
 TIMEPICKER_SECONDS_LABEL=Giây
 
-TIMEPICKER_PERIODS_LABEL=AM/PM
-
 TIMEPICKER_SUBMIT_BUTTON=OK
 
 TIMEPICKER_CANCEL_BUTTON=Hủy
@@ -229,6 +237,14 @@ TREE_ITEM_EXPAND_NODE=Mở rộng nút
 
 TREE_ITEM_COLLAPSE_NODE=Thu gọn nút
 
+VALUE_STATE_TYPE_ERROR=Đánh giá tình trạng lỗi
+
+VALUE_STATE_TYPE_WARNING=Đánh giá tình trạng cảnh báo
+
+VALUE_STATE_TYPE_SUCCESS=Đánh giá tình trạng thành công
+
+VALUE_STATE_TYPE_INFORMATION=Thông tin tình trạng giá trị
+
 VALUE_STATE_ERROR=Mục nhập không hợp lệ
 
 VALUE_STATE_WARNING=Cảnh báo được phát hành
@@ -247,6 +263,10 @@ DAY_PICKER_NON_WORKING_DAY=Ngày không làm việc
 
 DAY_PICKER_TODAY=Hôm nay
 
+MONTH_PICKER_DESCRIPTION=Trình chọn tháng
+
+YEAR_PICKER_DESCRIPTION=Trình chọn năm
+
 STEPINPUT_DEC_ICON_TITLE=Giảm
 
 STEPINPUT_INC_ICON_TITLE=Tăng

package/src/i18n/messagebundle_zh_CN.properties

@@ -31,9 +31,9 @@ BREADCRUMBS_CANCEL_BUTTON=取消
 
 BUSY_INDICATOR_TITLE=请稍候
 
-BUTTON_ARIA_TYPE_ACCEPT=肯定操作
+BUTTON_ARIA_TYPE_ACCEPT=积极操作
 
-BUTTON_ARIA_TYPE_REJECT=否定操作
+BUTTON_ARIA_TYPE_REJECT=消极操作
 
 BUTTON_ARIA_TYPE_EMPHASIZED=加重
 
@@ -59,17 +59,17 @@ COLOR_PALETTE_DIALOG_TITLE=更改颜色
 
 COLOR_PALETTE_MORE_COLORS_TEXT=更多颜色...
 
-COLORPICKER_ALPHA_SLIDER=Alpha control
+COLORPICKER_ALPHA_SLIDER=Alpha 控制
 
-COLORPICKER_HUE_SLIDER=Hue control
+COLORPICKER_HUE_SLIDER=色度控制
 
-COLORPICKER_HEX=Hexadecimal
+COLORPICKER_HEX=十六进制
 
-COLORPICKER_RED=Red
+COLORPICKER_RED=红色
 
-COLORPICKER_GREEN=Green
+COLORPICKER_GREEN=绿色
 
-COLORPICKER_BLUE=Blue
+COLORPICKER_BLUE=蓝色
 
 COLORPICKER_ALPHA=Alpha
 
@@ -113,6 +113,8 @@ LIST_ITEM_SELECTED=已选择
 
 LIST_ITEM_NOT_SELECTED=未选择
 
+LIST_ITEM_GROUP_HEADER=组抬头
+
 ARIA_LABEL_LIST_ITEM_CHECKBOX=多重选择模式
 
 ARIA_LABEL_LIST_ITEM_RADIO_BUTTON=项目选择。
@@ -167,7 +169,7 @@ SLIDER_ARIA_DESCRIPTION=滑块手柄
 
 LOAD_MORE_TEXT=更多
 
-TABLE_HEADER_ROW_TEXT=抬头行
+TABLE_HEADER_ROW_INFORMATION=抬头行 1 / {0}
 
 TABLE_ROW_POSITION={0} / {1}
 
@@ -177,6 +179,14 @@ ARIA_LABEL_ROW_SELECTION=项目选择
 
 ARIA_LABEL_SELECT_ALL_CHECKBOX=选择所有行
 
+TAB_ARIA_DESIGN_POSITIVE=积极
+
+TAB_ARIA_DESIGN_NEGATIVE=消极
+
+TAB_ARIA_DESIGN_CRITICAL=临界
+
+TAB_ARIA_DESIGN_NEUTRAL=中性
+
 TABCONTAINER_NEXT_ICON_ACC_NAME=下一个
 
 TABCONTAINER_PREVIOUS_ICON_ACC_NAME=上一个
@@ -197,8 +207,6 @@ TIMEPICKER_MINUTES_LABEL=分钟
 
 TIMEPICKER_SECONDS_LABEL=秒
 
-TIMEPICKER_PERIODS_LABEL=AM/PM
-
 TIMEPICKER_SUBMIT_BUTTON=确定
 
 TIMEPICKER_CANCEL_BUTTON=取消
@@ -229,6 +237,14 @@ TREE_ITEM_EXPAND_NODE=展开节点
 
 TREE_ITEM_COLLAPSE_NODE=折叠节点
 
+VALUE_STATE_TYPE_ERROR=值状态错误
+
+VALUE_STATE_TYPE_WARNING=值状态警告
+
+VALUE_STATE_TYPE_SUCCESS=值状态成功
+
+VALUE_STATE_TYPE_INFORMATION=值状态信息
+
 VALUE_STATE_ERROR=无效输入
 
 VALUE_STATE_WARNING=已发出警告
@@ -247,6 +263,10 @@ DAY_PICKER_NON_WORKING_DAY=非工作日
 
 DAY_PICKER_TODAY=今天
 
+MONTH_PICKER_DESCRIPTION=月份选取器
+
+YEAR_PICKER_DESCRIPTION=年度选取器
+
 STEPINPUT_DEC_ICON_TITLE=减少
 
 STEPINPUT_INC_ICON_TITLE=增加

package/src/i18n/messagebundle_zh_TW.properties

@@ -59,17 +59,17 @@ COLOR_PALETTE_DIALOG_TITLE=更改色彩
 
 COLOR_PALETTE_MORE_COLORS_TEXT=更多色彩...
 
-COLORPICKER_ALPHA_SLIDER=Alpha control
+COLORPICKER_ALPHA_SLIDER=Alpha 控制
 
-COLORPICKER_HUE_SLIDER=Hue control
+COLORPICKER_HUE_SLIDER=色調控制
 
-COLORPICKER_HEX=Hexadecimal
+COLORPICKER_HEX=十六進位
 
-COLORPICKER_RED=Red
+COLORPICKER_RED=紅色
 
-COLORPICKER_GREEN=Green
+COLORPICKER_GREEN=綠色
 
-COLORPICKER_BLUE=Blue
+COLORPICKER_BLUE=藍色
 
 COLORPICKER_ALPHA=Alpha
 
@@ -113,6 +113,8 @@ LIST_ITEM_SELECTED=已勾選
 
 LIST_ITEM_NOT_SELECTED=未選擇
 
+LIST_ITEM_GROUP_HEADER=群組表頭
+
 ARIA_LABEL_LIST_ITEM_CHECKBOX=多重選擇模式
 
 ARIA_LABEL_LIST_ITEM_RADIO_BUTTON=項目選擇。
@@ -167,7 +169,7 @@ SLIDER_ARIA_DESCRIPTION=滑桿控點
 
 LOAD_MORE_TEXT=較多
 
-TABLE_HEADER_ROW_TEXT=表頭列
+TABLE_HEADER_ROW_INFORMATION=表頭列 1/{0}
 
 TABLE_ROW_POSITION={0}/{1}
 
@@ -177,6 +179,14 @@ ARIA_LABEL_ROW_SELECTION=項目選擇
 
 ARIA_LABEL_SELECT_ALL_CHECKBOX=選擇所有列
 
+TAB_ARIA_DESIGN_POSITIVE=正面
+
+TAB_ARIA_DESIGN_NEGATIVE=負面
+
+TAB_ARIA_DESIGN_CRITICAL=重要
+
+TAB_ARIA_DESIGN_NEUTRAL=一般
+
 TABCONTAINER_NEXT_ICON_ACC_NAME=下一步
 
 TABCONTAINER_PREVIOUS_ICON_ACC_NAME=上一步
@@ -197,8 +207,6 @@ TIMEPICKER_MINUTES_LABEL=分
 
 TIMEPICKER_SECONDS_LABEL=秒
 
-TIMEPICKER_PERIODS_LABEL=早上/下午
-
 TIMEPICKER_SUBMIT_BUTTON=成功
 
 TIMEPICKER_CANCEL_BUTTON=取消
@@ -229,6 +237,14 @@ TREE_ITEM_EXPAND_NODE=展開節點
 
 TREE_ITEM_COLLAPSE_NODE=收縮節點
 
+VALUE_STATE_TYPE_ERROR=值狀態 (錯誤)
+
+VALUE_STATE_TYPE_WARNING=值狀態 (警告)
+
+VALUE_STATE_TYPE_SUCCESS=值狀態 (成功)
+
+VALUE_STATE_TYPE_INFORMATION=值狀態資訊
+
 VALUE_STATE_ERROR=無效輸入項
 
 VALUE_STATE_WARNING=已發出警告
@@ -247,6 +263,10 @@ DAY_PICKER_NON_WORKING_DAY=非工作日
 
 DAY_PICKER_TODAY=今天
 
+MONTH_PICKER_DESCRIPTION=月份選擇器
+
+YEAR_PICKER_DESCRIPTION=年份選擇器
+
 STEPINPUT_DEC_ICON_TITLE=減少
 
 STEPINPUT_INC_ICON_TITLE=增加

package/src/popup-utils/{OpenedPopupsRegistry.js → OpenedPopupsRegistry.ts}

@@ -1,25 +1,35 @@
 import { isEscape } from "@ui5/webcomponents-base/dist/Keys.js";
+import Popup from "../Popup.js";
 
-let openedRegistry = [];
+type RegisteredPopupT = {
+	instance: Popup;
+	parentPopovers: Array<Popup>;
+}
 
-const addOpenedPopup = (instance, parentPopovers = []) => {
-	if (!openedRegistry.includes(instance)) {
+let openedRegistry: Array<RegisteredPopupT> = [];
+
+const addOpenedPopup = (instance: Popup, parentPopovers: Array<Popup> = []) => {
+	if (!openedRegistry.some(popup => popup.instance === instance)) {
 		openedRegistry.push({
 			instance,
 			parentPopovers,
 		});
 	}
 
+	_updateTopModalPopup();
+
 	if (openedRegistry.length === 1) {
 		attachGlobalListener();
 	}
 };
 
-const removeOpenedPopup = instance => {
+const removeOpenedPopup = (instance: Popup) => {
 	openedRegistry = openedRegistry.filter(el => {
 		return el.instance !== instance;
 	});
 
+	_updateTopModalPopup();
+
 	if (!openedRegistry.length) {
 		detachGlobalListener();
 	}
@@ -29,7 +39,7 @@ const getOpenedPopups = () => {
 	return [...openedRegistry];
 };
 
-const _keydownListener = event => {
+const _keydownListener = (event: KeyboardEvent) => {
 	if (!openedRegistry.length) {
 		return;
 	}
@@ -47,4 +57,20 @@ const detachGlobalListener = () => {
 	document.removeEventListener("keydown", _keydownListener);
 };
 
+const _updateTopModalPopup = () => {
+	let popup;
+	let hasModal = false;
+
+	for (let i = openedRegistry.length - 1; i >= 0; i--) {
+		popup = openedRegistry[i].instance;
+
+		if (!hasModal && popup.isModal) {
+			popup.isTopModalPopup = true;
+			hasModal = true;
+		} else {
+			popup.isTopModalPopup = false;
+		}
+	}
+};
+
 export { addOpenedPopup, removeOpenedPopup, getOpenedPopups };

package/src/popup-utils/{PopoverRegistry.js → PopoverRegistry.ts}

@@ -1,27 +1,35 @@
 import { isClickInRect } from "@ui5/webcomponents-base/dist/util/PopupUtils.js";
+import type { Interval } from "@ui5/webcomponents-base/dist/types.js";
+import type Popover from "../Popover.js";
+import { instanceOfPopover } from "../Popover.js";
 import { getOpenedPopups, addOpenedPopup, removeOpenedPopup } from "./OpenedPopupsRegistry.js";
 
-let updateInterval = null;
+type RegisteredPopover = {
+	instance: Popover;
+	parentPopovers: Array<Popover>;
+}
+
+let updateInterval: Interval;
 const intervalTimeout = 300;
-const openedRegistry = [];
+const openedRegistry: Array<RegisteredPopover> = [];
 
-const repositionPopovers = event => {
+const repositionPopovers = () => {
 	openedRegistry.forEach(popover => {
 		popover.instance.reposition();
 	});
 };
 
-const attachGlobalScrollHandler = () => {
-	document.body.addEventListener("scroll", repositionPopovers, true);
-};
-
-const detachGlobalScrollHandler = () => {
-	document.body.removeEventListener("scroll", repositionPopovers, true);
+const closePopoversIfLostFocus = () => {
+	if (document.activeElement!.tagName === "IFRAME") {
+		getRegistry().reverse().forEach(popup => popup.instance.close(false, false, true));
+	}
 };
 
 const runUpdateInterval = () => {
 	updateInterval = setInterval(() => {
 		repositionPopovers();
+
+		closePopoversIfLostFocus();
 	}, intervalTimeout);
 };
 
@@ -29,6 +37,22 @@ const stopUpdateInterval = () => {
 	clearInterval(updateInterval);
 };
 
+const attachGlobalScrollHandler = () => {
+	document.body.addEventListener("scroll", repositionPopovers, { capture: true });
+};
+
+const detachGlobalScrollHandler = () => {
+	document.body.removeEventListener("scroll", repositionPopovers, { capture: true });
+};
+
+const attachScrollHandler = (popover: Popover) => {
+	popover && popover.shadowRoot!.addEventListener("scroll", repositionPopovers, { capture: true });
+};
+
+const detachScrollHandler = (popover: Popover) => {
+	popover && popover.shadowRoot!.removeEventListener("scroll", repositionPopovers, { capture: true });
+};
+
 const attachGlobalClickHandler = () => {
 	document.addEventListener("mousedown", clickHandler);
 };
@@ -37,11 +61,16 @@ const detachGlobalClickHandler = () => {
 	document.removeEventListener("mousedown", clickHandler);
 };
 
-const clickHandler = event => {
+const clickHandler = (event: MouseEvent) => {
 	const openedPopups = getOpenedPopups();
-	const isTopPopupPopover = openedPopups[openedPopups.length - 1].instance.showAt;
 
-	if (openedPopups.length === 0 || !isTopPopupPopover) {
+	if (openedPopups.length === 0) {
+		return;
+	}
+
+	const isTopPopupPopover = instanceOfPopover(openedPopups[openedPopups.length - 1].instance);
+
+	if (!isTopPopupPopover) {
 		return;
 	}
 
@@ -50,7 +79,7 @@ const clickHandler = event => {
 		const popup = openedPopups[i].instance;
 
 		// if popup is modal, opener is clicked, popup is dialog skip closing
-		if (popup.isModal || popup.isOpenerClicked(event)) {
+		if (popup.isModal || (popup as Popover).isOpenerClicked(event)) {
 			return;
 		}
 
@@ -62,15 +91,7 @@ const clickHandler = event => {
 	}
 };
 
-const attachScrollHandler = popover => {
-	popover && popover.shadowRoot.addEventListener("scroll", repositionPopovers, true);
-};
-
-const detachScrollHandler = popover => {
-	popover && popover.shadowRoot.removeEventListener("scroll", repositionPopovers);
-};
-
-const addOpenedPopover = instance => {
+const addOpenedPopover = (instance: Popover) => {
 	const parentPopovers = getParentPopoversIfNested(instance);
 
 	addOpenedPopup(instance, parentPopovers);
@@ -88,7 +109,7 @@ const addOpenedPopover = instance => {
 	}
 };
 
-const removeOpenedPopover = instance => {
+const removeOpenedPopover = (instance: Popover) => {
 	const popoversToClose = [instance];
 
 	for (let i = 0; i < openedRegistry.length; i++) {
@@ -100,7 +121,7 @@ const removeOpenedPopover = instance => {
 
 	for (let i = popoversToClose.length - 1; i >= 0; i--) {
 		for (let j = 0; j < openedRegistry.length; j++) {
-			let indexOfItemToRemove;
+			let indexOfItemToRemove = -1;
 			if (popoversToClose[i] === openedRegistry[j].instance) {
 				indexOfItemToRemove = j;
 			}
@@ -125,14 +146,14 @@ const getRegistry = () => {
 	return openedRegistry;
 };
 
-const getParentPopoversIfNested = instance => {
+const getParentPopoversIfNested = (instance: Popover) => {
 	let currentElement = instance.parentNode;
-	const parentPopovers = [];
+	const parentPopovers: Array<Popover> = [];
 
-	while (currentElement.parentNode) {
+	while (currentElement && currentElement.parentNode) {
 		for (let i = 0; i < openedRegistry.length; i++) {
-			if (currentElement && currentElement === openedRegistry[i].instance) {
-				parentPopovers.push(currentElement);
+			if (currentElement === openedRegistry[i].instance) {
+				parentPopovers.push(currentElement as Popover);
 			}
 		}