@ui5/webcomponents-base 0.0.0-32b659ddc → 0.0.0-33e059bcd

package/src/dates/CalendarUtils.js

@@ -1,99 +0,0 @@
-import UniversalDate from "@ui5/webcomponents-utils/dist/sap/ui/core/date/UniversalDate.js";
-import Locale from "@ui5/webcomponents-utils/dist/sap/ui/core/Locale.js";
-import LocaleData from "@ui5/webcomponents-utils/dist/sap/ui/core/LocaleData.js";
-import { getFirstDayOfWeek } from "../config/FormatSettings.js";
-
-const calculateWeekNumber = (oDate, iYear, oLocale, oLocaleData) => {
-	let iWeekNum = 0;
-	let iWeekDay = 0;
-	const confFirstDayOfWeek = getFirstDayOfWeek();
-	const iFirstDayOfWeek = Number.isInteger(confFirstDayOfWeek) ? confFirstDayOfWeek : oLocaleData.getFirstDayOfWeek();
-
-	// search Locale for containing "en-US", since sometimes
-	// when any user settings have been defined, subtag "sapufmt" is added to the locale name
-	// this is described inside sap.ui.core.Configuration file
-	if (oLocale && (oLocale.getLanguage() === "en" && oLocale.getRegion() === "US")) {
-		/*
-			* in US the week starts with Sunday
-			* The first week of the year starts with January 1st. But Dec. 31 is still in the last year
-			* So the week beginning in December and ending in January has 2 week numbers
-			*/
-		const oJanFirst = new UniversalDate(oDate.getTime());
-		oJanFirst.setUTCFullYear(iYear, 0, 1);
-		iWeekDay = oJanFirst.getUTCDay();
-
-		// get the date for the same weekday like jan 1.
-		const oCheckDate = new UniversalDate(oDate.getTime());
-		oCheckDate.setUTCDate(oCheckDate.getUTCDate() - oCheckDate.getUTCDay() + iWeekDay);
-
-		iWeekNum = Math.round((oCheckDate.getTime() - oJanFirst.getTime()) / 86400000 / 7) + 1;
-	} else {
-		// normally the first week of the year is the one where the first Thursday of the year is
-		// find Thursday of this week
-		// if the checked day is before the 1. day of the week use a day of the previous week to check
-		const oThursday = new UniversalDate(oDate.getTime());
-		oThursday.setUTCDate(oThursday.getUTCDate() - iFirstDayOfWeek);
-		iWeekDay = oThursday.getUTCDay();
-		oThursday.setUTCDate(oThursday.getUTCDate() - iWeekDay + 4);
-
-		const oFirstDayOfYear = new UniversalDate(oThursday.getTime());
-		oFirstDayOfYear.setUTCMonth(0, 1);
-		iWeekDay = oFirstDayOfYear.getUTCDay();
-		let iAddDays = 0;
-		if (iWeekDay > 4) {
-			iAddDays = 7; // first day of year is after Thursday, so first Thursday is in the next week
-		}
-		const oFirstThursday = new UniversalDate(oFirstDayOfYear.getTime());
-		oFirstThursday.setUTCDate(1 - iWeekDay + 4 + iAddDays);
-
-		iWeekNum = Math.round((oThursday.getTime() - oFirstThursday.getTime()) / 86400000 / 7) + 1;
-	}
-
-	return iWeekNum;
-};
-
-const getFirstDateOfWeek = oDate => {
-	const oUniversalDate = new UniversalDate(oDate.getTime()),
-		oLocaleData = LocaleData.getInstance(new Locale("en")),
-		confFirstDayOfWeek = getFirstDayOfWeek(),
-		iCLDRFirstWeekDay = Number.isInteger(confFirstDayOfWeek) ? confFirstDayOfWeek : oLocaleData.getFirstDayOfWeek();
-
-
-	const oWeek = UniversalDate.getWeekByDate(oUniversalDate.getCalendarType(), oUniversalDate.getUTCFullYear(),
-		oUniversalDate.getUTCMonth(), oUniversalDate.getUTCDate());
-
-	const oFirstDateOfWeek = UniversalDate.getFirstDateOfWeek(oUniversalDate.getCalendarType(), oWeek.year, oWeek.week);
-	const oFirstUniversalDateOfWeek = new UniversalDate(Date.UTC(oFirstDateOfWeek.year, oFirstDateOfWeek.month, oFirstDateOfWeek.day));
-
-	// In case the day of the computed weekFirstDate is not as in CLDR(e.g. en_US locales), make sure we align it
-	while (oFirstUniversalDateOfWeek.getUTCDay() !== iCLDRFirstWeekDay) {
-		oFirstUniversalDateOfWeek.setUTCDate(oFirstUniversalDateOfWeek.getUTCDate() - 1);
-	}
-
-	return new UniversalDate(Date.UTC(oFirstUniversalDateOfWeek.getUTCFullYear(), oFirstUniversalDateOfWeek.getUTCMonth(),
-		oFirstUniversalDateOfWeek.getUTCDate(), oDate.getUTCHours(), oDate.getUTCMinutes(), oDate.getUTCSeconds())).getJSDate();
-};
-
-const getFirstDateOfMonth = oDate => {
-	const oNewDate = new UniversalDate(oDate.getTime());
-	oNewDate.setUTCDate(1);
-
-	return oNewDate;
-};
-
-const monthsDiffer = (oDate1, oDate2) => {
-	return (oDate1.getMonth() !== oDate2.getMonth() || oDate1.getFullYear() !== oDate2.getFullYear());
-};
-
-const isDateLastInMonth = oDate => {
-	const oNextDay = new Date(oDate.getTime() + 24 * 60 * 60 * 1000);
-	return oNextDay.getUTCDate() < oDate.getUTCDate();
-};
-
-export {
-	calculateWeekNumber,
-	getFirstDateOfWeek,
-	getFirstDateOfMonth,
-	monthsDiffer,
-	isDateLastInMonth,
-};

package/src/delegate/CustomResize.js

@@ -1,78 +0,0 @@
-const INTERVAL = 300;
-
-class CustomResize {
-	static initialize() {
-		CustomResize.initialized = false;
-		CustomResize.resizeInterval = undefined;
-		CustomResize.resizeListeners = new Map();
-	}
-
-	static attachListener(ref, callback) {
-		const observedObject = CustomResize.resizeListeners.get(ref);
-		const existingCallbacks = observedObject ? observedObject.callbacks : [];
-
-		CustomResize.resizeListeners.set(ref, {
-			width: ref ? ref.offsetWidth : 0,
-			height: ref ? ref.offsetHeight : 0,
-			callbacks: existingCallbacks.concat(callback),
-		});
-
-		CustomResize.initListener();
-	}
-
-	static initListener() {
-		if (CustomResize.resizeListeners.size > 0 && !CustomResize.initialized) {
-			CustomResize.resizeInterval = setInterval(CustomResize.checkListeners.bind(CustomResize), INTERVAL);
-		}
-	}
-
-	static checkListeners() {
-		CustomResize.resizeListeners.forEach((entry, ref) => {
-			const changed = CustomResize.checkSizes(entry, ref);
-
-			if (changed || (entry && !entry._hasBeenRendered)) {
-				CustomResize.updateSizes(entry, ref.offsetWidth, ref.offsetHeight);
-				entry.callbacks.forEach(el => el());
-				entry._hasBeenRendered = true;
-			}
-		});
-	}
-
-	static updateSizes(sizes, newWidth, newHeight) {
-		sizes.width = newWidth;
-		sizes.height = newHeight;
-	}
-
-	static checkSizes(entry, ref) {
-		const oldHeight = entry.height;
-		const oldWidth = entry.width;
-		const newHeight = ref.offsetHeight;
-		const newWidth = ref.offsetWidth;
-
-		return ((oldHeight !== newHeight) || oldWidth !== newWidth);
-	}
-
-	static detachListener(ref, callback) {
-		const listenerObject = CustomResize.resizeListeners.get(ref);
-		const callbacks = listenerObject ? listenerObject.callbacks : [];
-		const filteredCallbacks = callbacks.filter(fn => fn !== callback);
-
-		if (!listenerObject || (callbacks.length === filteredCallbacks.length && callbacks.length !== 0)) {
-			return;
-		}
-
-		CustomResize.resizeListeners.set(ref, Object.assign(listenerObject, { callbacks: filteredCallbacks }));
-
-		if (!filteredCallbacks.length) {
-			listenerObject.callbacks = null;
-			CustomResize.resizeListeners.delete(ref);
-		}
-
-		if (CustomResize.resizeListeners.size === 0) {
-			CustomResize.initialized = false;
-			clearInterval(CustomResize.resizeInterval);
-		}
-	}
-}
-
-export default CustomResize;

package/src/delegate/ItemNavigation.js

@@ -1,278 +0,0 @@
-import RenderScheduler from "../RenderScheduler.js";
-import {
-	isDown,
-	isUp,
-	isLeft,
-	isRight,
-	isHome,
-	isEnd,
-} from "../events/PseudoEvents.js";
-
-import EventProvider from "../EventProvider.js";
-import UI5Element from "../UI5Element.js";
-import NavigationMode from "../types/NavigationMode.js";
-import ItemNavigationBehavior from "../types/ItemNavigationBehavior.js";
-
-// navigatable items must have id and tabindex
-class ItemNavigation extends EventProvider {
-	constructor(rootWebComponent, options = {}) {
-		super();
-
-		this.currentIndex = options.currentIndex || 0;
-		this.rowSize = options.rowSize || 1;
-		this.behavior = options.behavior || ItemNavigationBehavior.Static;
-		this.hasNextPage = true; // used in Paging mode and controlled from the rootWebComponent
-		this.hasPrevPage = true; // used in Paging mode and controlled from the rootWebComponent
-		const navigationMode = options.navigationMode;
-		const autoNavigation = !navigationMode || navigationMode === NavigationMode.Auto;
-		this.horizontalNavigationOn = autoNavigation || navigationMode === NavigationMode.Horizontal;
-		this.verticalNavigationOn = autoNavigation || navigationMode === NavigationMode.Vertical;
-
-		this.rootWebComponent = rootWebComponent;
-		this.rootWebComponent.addEventListener("keydown", this.onkeydown.bind(this));
-		this.rootWebComponent._onComponentStateFinalized = () => {
-			this._init();
-		};
-	}
-
-	_init() {
-		this._getItems().forEach((item, idx) => {
-			item._tabIndex = (idx === this.currentIndex) ? "0" : "-1";
-		});
-	}
-
-	_horizontalNavigationOn() {
-		return this.horizontalNavigationOn;
-	}
-
-	_verticalNavigationOn() {
-		return this.verticalNavigationOn;
-	}
-
-	async _onKeyPress(event) {
-		if (this.currentIndex >= this._getItems().length) {
-			this.onOverflowBottomEdge();
-		} else if (this.currentIndex < 0) {
-			this.onOverflowTopEdge();
-		}
-
-		event.preventDefault();
-
-		await RenderScheduler.whenFinished();
-
-		this.update();
-		this.focusCurrent();
-	}
-
-	onkeydown(event) {
-		if (isUp(event) && this._verticalNavigationOn()) {
-			return this._handleUp(event);
-		}
-
-		if (isDown(event) && this._verticalNavigationOn()) {
-			return this._handleDown(event);
-		}
-
-		if (isLeft(event) && this._horizontalNavigationOn()) {
-			return this._handleLeft(event);
-		}
-
-		if (isRight(event) && this._horizontalNavigationOn()) {
-			return this._handleRight(event);
-		}
-
-		if (isHome(event)) {
-			return this._handleHome(event);
-		}
-
-		if (isEnd(event)) {
-			return this._handleEnd(event);
-		}
-	}
-
-	_handleUp(event) {
-		if (this._canNavigate()) {
-			this.currentIndex -= this.rowSize;
-			this._onKeyPress(event);
-		}
-	}
-
-	_handleDown(event) {
-		if (this._canNavigate()) {
-			this.currentIndex += this.rowSize;
-			this._onKeyPress(event);
-		}
-	}
-
-	_handleLeft(event) {
-		if (this._canNavigate()) {
-			this.currentIndex -= 1;
-			this._onKeyPress(event);
-		}
-	}
-
-	_handleRight(event) {
-		if (this._canNavigate()) {
-			this.currentIndex += 1;
-			this._onKeyPress(event);
-		}
-	}
-
-	_handleHome(event) {
-		if (this._canNavigate()) {
-			const homeEndRange = this.rowSize > 1 ? this.rowSize : this._getItems().length;
-			this.currentIndex -= this.currentIndex % homeEndRange;
-			this._onKeyPress(event);
-		}
-	}
-
-	_handleEnd(event) {
-		if (this._canNavigate()) {
-			const homeEndRange = this.rowSize > 1 ? this.rowSize : this._getItems().length;
-			this.currentIndex += (homeEndRange - 1 - this.currentIndex % homeEndRange); // eslint-disable-line
-			this._onKeyPress(event);
-		}
-	}
-
-	update(current) {
-		const origItems = this._getItems();
-
-		if (current) {
-			this.currentIndex = this._getItems().indexOf(current);
-		}
-
-		if (!origItems[this.currentIndex]
-			|| (origItems[this.currentIndex]._tabIndex && origItems[this.currentIndex]._tabIndex === "0")) {
-			return;
-		}
-
-		const items = origItems.slice(0);
-
-		for (let i = 0; i < items.length; i++) {
-			items[i]._tabIndex = (i === this.currentIndex ? "0" : "-1");
-		}
-
-
-		this.rootWebComponent._invalidate();
-	}
-
-	focusCurrent() {
-		const currentItem = this._getCurrentItem();
-		if (currentItem) {
-			currentItem.focus();
-		}
-	}
-
-	_canNavigate() {
-		const currentItem = this._getCurrentItem();
-
-		let activeElement = document.activeElement;
-
-		while (activeElement.shadowRoot && activeElement.shadowRoot.activeElement) {
-			activeElement = activeElement.shadowRoot.activeElement;
-		}
-
-		return currentItem && currentItem === activeElement;
-	}
-
-	_getCurrentItem() {
-		const items = this._getItems();
-
-		if (!items.length) {
-			return null;
-		}
-
-		// normalize the index
-		while (this.currentIndex >= items.length) {
-			this.currentIndex -= this.rowSize;
-		}
-
-		if (this.currentIndex < 0) {
-			this.currentIndex = 0;
-		}
-
-		const currentItem = items[this.currentIndex];
-
-		if (currentItem instanceof UI5Element) {
-			return currentItem.getFocusDomRef();
-		}
-
-		if (!this.rootWebComponent.getDomRef()) {
-			return;
-		}
-
-		return this.rootWebComponent.getDomRef().querySelector(`#${currentItem.id}`);
-	}
-
-	set getItemsCallback(fn) {
-		this._getItems = fn;
-	}
-
-	set current(val) {
-		this.currentIndex = val;
-	}
-
-	onOverflowBottomEdge() {
-		const items = this._getItems();
-		const offset = this.currentIndex - items.length;
-
-		if (this.behavior === ItemNavigationBehavior.Cyclic) {
-			this.currentIndex = 0;
-			return;
-		}
-
-		if (this.behavior === ItemNavigationBehavior.Paging) {
-			this._handleNextPage();
-		} else {
-			this.currentIndex = items.length - 1;
-		}
-
-		this.fireEvent(ItemNavigation.BORDER_REACH, { start: false, end: true, offset });
-	}
-
-	onOverflowTopEdge() {
-		const items = this._getItems();
-		const offset = this.currentIndex + this.rowSize;
-
-		if (this.behavior === ItemNavigationBehavior.Cyclic) {
-			this.currentIndex = items.length - 1;
-			return;
-		}
-
-		if (this.behavior === ItemNavigationBehavior.Paging) {
-			this._handlePrevPage();
-		} else {
-			this.currentIndex = 0;
-		}
-
-		this.fireEvent(ItemNavigation.BORDER_REACH, { start: true, end: false, offset });
-	}
-
-	_handleNextPage() {
-		this.fireEvent(ItemNavigation.PAGE_BOTTOM);
-		const items = this._getItems();
-
-		if (!this.hasNextPage) {
-			this.currentIndex = items.length - 1;
-		} else {
-			this.currentIndex = 0;
-		}
-	}
-
-	_handlePrevPage() {
-		this.fireEvent(ItemNavigation.PAGE_TOP);
-		const items = this._getItems();
-
-		if (!this.hasPrevPage) {
-			this.currentIndex = 0;
-		} else {
-			this.currentIndex = (this.pageSize || items.length) - 1;
-		}
-	}
-}
-
-ItemNavigation.PAGE_TOP = "PageTop";
-ItemNavigation.PAGE_BOTTOM = "PageBottom";
-ItemNavigation.BORDER_REACH = "_borderReach";
-
-export default ItemNavigation;

package/src/delegate/NativeResize.js

@@ -1,44 +0,0 @@
-class NativeResize {
-	static initialize() {
-		NativeResize.resizeObserver = new window.ResizeObserver(entries => {
-			// call attached callbacks
-			entries.forEach(entry => {
-				const callbacks = NativeResize.observedObjects.get(entry.target);
-
-				callbacks.forEach(el => el());
-			});
-		});
-
-		NativeResize.observedObjects = new Map();
-	}
-
-	static attachListener(ref, callback) {
-		const observedDOMs = NativeResize.observedObjects;
-		const callbacks = observedDOMs.get(ref) || [];
-
-		// if no callbacks has been added for this ref - start observing it
-		if (!callbacks.length) {
-			NativeResize.resizeObserver.observe(ref);
-		}
-
-		// save the callbacks in an array
-		observedDOMs.set(ref, [...callbacks, callback]);
-	}
-
-	static detachListener(ref, callback) {
-		const callbacks = NativeResize.observedObjects.get(ref) || [];
-		const filteredCallbacks = callbacks.filter(fn => fn !== callback);
-
-		if (!callbacks.length || (callbacks.length === filteredCallbacks.length && callbacks.length !== 0)) {
-			return;
-		}
-
-		NativeResize.observedObjects.set(ref, filteredCallbacks);
-
-		if (!filteredCallbacks.length) {
-			NativeResize.resizeObserver.unobserve(ref);
-		}
-	}
-}
-
-export default NativeResize;

package/src/delegate/ResizeHandler.js

@@ -1,66 +0,0 @@
-import UI5Element from "../UI5Element.js";
-import NativeResize from "./NativeResize.js";
-import CustomResize from "./CustomResize.js";
-
-class ResizeHandler {
-	static initialize() {
-		ResizeHandler.Implementation = window.ResizeObserver ? NativeResize : CustomResize;
-		ResizeHandler.Implementation.initialize();
-	}
-
-	/**
-	 * @static
-	 * @private
-	 * @param {*} ref Reference to be observed
-	 * @param {*} callback Callback to be executed
-	 * @memberof ResizeHandler
-	 */
-	static attachListener(ref, callback) {
-		ResizeHandler.Implementation.attachListener.call(ResizeHandler.Implementation, ref, callback);
-	}
-
-	/**
-	 * @static
-	 * @private
-	 * @param {*} ref Reference to be unobserved
-	 * @memberof ResizeHandler
-	 */
-	static detachListener(ref, callback) {
-		ResizeHandler.Implementation.detachListener.call(ResizeHandler.Implementation, ref, callback);
-	}
-
-
-	/**
-	 * @static
-	 * @public
-	 * @param {*} ref Reference to a UI5 Web Component or DOM Element to be observed
-	 * @param {*} callback Callback to be executed
-	 * @memberof ResizeHandler
-	 */
-	static register(ref, callback) {
-		if (ref instanceof UI5Element) {
-			ref = ref.getDomRef();
-		}
-
-		ResizeHandler.attachListener(ref, callback);
-	}
-
-
-	/**
-	 * @static
-	 * @public
-	 * @param {*} ref Reference to UI5 Web Component or DOM Element to be unobserved
-	 * @memberof ResizeHandler
-	 */
-	static deregister(ref, callback) {
-		if (ref instanceof UI5Element) {
-			ref = ref.getDomRef();
-		}
-
-		ResizeHandler.detachListener(ref, callback);
-	}
-}
-
-ResizeHandler.initialize();
-
-export default ResizeHandler;

package/src/delegate/ScrollEnablement.js

@@ -1,106 +0,0 @@
-import EventProvider from "../EventProvider.js";
-import scroll from "../animations/scroll.js";
-
-const scrollEventName = "scroll";
-const touchEndEventName = "touchend";
-
-class ScrollEnablement extends EventProvider {
-	constructor(containerComponent) {
-		super();
-		containerComponent.addEventListener("touchstart", this.ontouchstart.bind(this), { passive: true });
-		containerComponent.addEventListener("touchmove", this.ontouchmove.bind(this), { passive: true });
-		containerComponent.addEventListener("touchend", this.ontouchend.bind(this), { passive: true });
-	}
-
-	set scrollContainer(container) {
-		this._container = container;
-	}
-
-	get scrollContainer() {
-		return this._container;
-	}
-
-	scrollTo(left, top) {
-		this._container.scrollLeft = left;
-		this._container.scrollTop = top;
-	}
-
-	move(dx, dy) {
-		return scroll({
-			element: this._container,
-			dx,
-			dy,
-		});
-	}
-
-	getScrollLeft() {
-		return this._container.scrollLeft;
-	}
-
-	getScrollTop() {
-		return this._container.scrollTop;
-	}
-
-	_isTouchInside(touch) {
-		const rect = this._container.getBoundingClientRect();
-		const x = touch.clientX;
-		const y = touch.clientY;
-
-		return x >= rect.left && x <= rect.right
-			&& y >= rect.top && y <= rect.bottom;
-	}
-
-	ontouchstart(event) {
-		const touch = event.touches[0];
-		this._prevDragX = touch.pageX;
-		this._prevDragY = touch.pageY;
-
-		this._canScroll = this._isTouchInside(touch);
-	}
-
-	ontouchmove(event) {
-		if (!this._canScroll) {
-			return;
-		}
-
-		const container = this._container;
-		const touch = event.touches[0];
-
-		const dragX = touch.pageX;
-		const dragY = touch.pageY;
-
-		container.scrollLeft += this._prevDragX - dragX;
-		container.scrollTop += this._prevDragY - dragY;
-
-		this.fireEvent(scrollEventName, {
-			isLeft: dragX > this._prevDragX,
-			isRight: dragX < this._prevDragX,
-		});
-
-		this._prevDragX = dragX;
-		this._prevDragY = dragY;
-	}
-
-	ontouchend(event) {
-		if (!this._canScroll) {
-			return;
-		}
-
-		const container = this._container;
-		const dragX = event.pageX;
-		const dragY = event.pageY;
-
-		container.scrollLeft += this._prevDragX - dragX;
-		container.scrollTop += this._prevDragY - dragY;
-
-		this.fireEvent(touchEndEventName, {
-			isLeft: dragX > this._prevDragX,
-			isRight: dragX < this._prevDragX,
-		});
-
-		this._prevDragX = dragX;
-		this._prevDragY = dragY;
-	}
-}
-
-export default ScrollEnablement;