@ui5/webcomponents-base 0.0.0-dff5837d7 → 0.0.0-e0658a650

package/src/delegate/ResizeHandler.js

@@ -1,65 +0,0 @@
-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.isUI5Element) {
-			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.isUI5Element) {
-			ref = ref.getDomRef();
-		}
-
-		ResizeHandler.detachListener(ref, callback);
-	}
-}
-
-ResizeHandler.initialize();
-
-export default ResizeHandler;

package/src/delegate/ScrollEnablement.js

@@ -1,159 +0,0 @@
-import { isPhone } from "../Device.js";
-import EventProvider from "../EventProvider.js";
-import scroll from "../animations/scroll.js";
-
-const scrollEventName = "scroll";
-const touchEndEventName = isPhone() ? "touchend" : "mouseup";
-
-class ScrollEnablement extends EventProvider {
-	constructor(containerComponent) {
-		super();
-		this.containerComponent = containerComponent;
-		this.mouseMove = this.ontouchmove.bind(this);
-		this.mouseUp = this.ontouchend.bind(this);
-		this.touchStart = this.ontouchstart.bind(this);
-
-		this.isPhone = isPhone();
-
-		// On Android devices touchmove is thrown one more time than neccessary (together with touchend)
-		// so we have to cache the previus coordinates in order to provide correct parameters in the
-		// event for Android
-		this.cachedValue = {};
-
-		// In components like Carousel you need to know if the user has clicked on something or swiped
-		// in order to throw the needed event or not
-		this.startX = 0;
-		this.startY = 0;
-
-		if (this.isPhone) {
-			containerComponent.addEventListener("touchstart", this.touchStart, { passive: true });
-			containerComponent.addEventListener("touchmove", this.mouseMove, { passive: true });
-			containerComponent.addEventListener("touchend", this.mouseUp, { passive: true });
-		} else {
-			containerComponent.addEventListener("mousedown", this.touchStart, { 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 = this.isPhone ? touch.clientX : touch.x;
-		const y = this.isPhone ? touch.clientY : touch.y;
-
-		return x >= rect.left && x <= rect.right
-			&& y >= rect.top && y <= rect.bottom;
-	}
-
-	ontouchstart(event) {
-		const touch = this.isPhone ? event.touches[0] : null;
-
-		if (!this.isPhone) {
-			document.addEventListener("mouseup", this.mouseUp, { passive: true });
-			document.addEventListener("mousemove", this.mouseMove, { passive: true });
-		} else {
-			// Needed only on mobile
-			this.startX = touch.pageX;
-			this.startY = touch.pageY;
-		}
-
-		this._prevDragX = this.isPhone ? touch.pageX : event.x;
-		this._prevDragY = this.isPhone ? touch.pageY : event.y;
-
-		this._canScroll = this._isTouchInside(this.isPhone ? touch : event);
-	}
-
-	ontouchmove(event) {
-		if (!this._canScroll) {
-			return;
-		}
-
-		const container = this._container;
-		const touch = this.isPhone ? event.touches[0] : null;
-
-		const dragX = this.isPhone ? touch.pageX : event.x;
-		const dragY = this.isPhone ? touch.pageY : event.y;
-
-		container.scrollLeft += this._prevDragX - dragX;
-		container.scrollTop += this._prevDragY - dragY;
-
-		this.fireEvent(scrollEventName, {
-			isLeft: dragX > this._prevDragX,
-			isRight: dragX < this._prevDragX,
-		});
-
-		this.cachedValue.dragX = this._prevDragX;
-		this.cachedValue.dragY = this._prevDragY;
-
-		this._prevDragX = dragX;
-		this._prevDragY = dragY;
-	}
-
-	ontouchend(event) {
-		if (this.isPhone) {
-			const deltaX = Math.abs(event.changedTouches[0].pageX - this.startX);
-			const deltaY = Math.abs(event.changedTouches[0].pageY - this.startY);
-
-			if (deltaX < 10 && deltaY < 10) {
-				return;
-			}
-		}
-
-		if (!this._canScroll) {
-			return;
-		}
-
-		const container = this._container;
-		const dragX = this.isPhone ? event.changedTouches[0].pageX : event.x;
-		const dragY = this.isPhone ? event.changedTouches[0].pageY : event.y;
-
-		container.scrollLeft += this._prevDragX - dragX;
-		container.scrollTop += this._prevDragY - dragY;
-
-		const useCachedValues = dragX === this._prevDragX;
-		const _dragX = useCachedValues ? this.cachedValue.dragX : dragX;
-		// const _dragY = useCachedValues ? this.cachedValue.dragY : dragY; add if needed
-
-		this.fireEvent(touchEndEventName, {
-			isLeft: _dragX < this._prevDragX,
-			isRight: _dragX > this._prevDragX,
-		});
-
-		this._prevDragX = dragX;
-		this._prevDragY = dragY;
-
-		if (!this.isPhone) {
-			document.removeEventListener("mousemove", this.mouseMove, { passive: true });
-			document.removeEventListener("mouseup", this.mouseUp);
-		}
-	}
-}
-
-export default ScrollEnablement;

package/src/features/OpenUI5Support.js

@@ -1,90 +0,0 @@
-import { registerFeature } from "../FeaturesRegistry.js";
-import { setTheme } from "../config/Theme.js";
-
-const sap = window.sap;
-const core = sap && sap.ui && typeof sap.ui.getCore === "function" && sap.ui.getCore();
-
-const isLoaded = () => {
-	return !!core;
-};
-
-const init = () => {
-	if (!core) {
-		return Promise.resolve();
-	}
-
-	return new Promise(resolve => {
-		core.attachInit(() => {
-			sap.ui.require(["sap/ui/core/LocaleData"], resolve);
-		});
-	});
-};
-
-const getConfigurationSettingsObject = () => {
-	if (!core) {
-		return;
-	}
-
-	const config = core.getConfiguration();
-	const LocaleData = sap.ui.require("sap/ui/core/LocaleData");
-
-	return {
-		animationMode: config.getAnimationMode(),
-		language: config.getLanguage(),
-		theme: config.getTheme(),
-		rtl: config.getRTL(),
-		calendarType: config.getCalendarType(),
-		formatSettings: {
-			firstDayOfWeek: LocaleData ? LocaleData.getInstance(config.getLocale()).getFirstDayOfWeek() : undefined,
-		},
-	};
-};
-
-const getLocaleDataObject = () => {
-	if (!core) {
-		return;
-	}
-
-	const config = core.getConfiguration();
-	const LocaleData = sap.ui.require("sap/ui/core/LocaleData");
-	return LocaleData.getInstance(config.getLocale())._get();
-};
-
-const listenForThemeChange = () => {
-	const config = core.getConfiguration();
-	core.attachThemeChanged(async () => {
-		await setTheme(config.getTheme());
-	});
-};
-
-const attachListeners = () => {
-	if (!core) {
-		return;
-	}
-
-	listenForThemeChange();
-};
-
-const cssVariablesLoaded = () => {
-	if (!core) {
-		return;
-	}
-
-	const link = [...document.head.children].find(el => el.id === "sap-ui-theme-sap.ui.core"); // more reliable than querySelector early
-	if (!link) {
-		return;
-	}
-
-	return !!link.href.match(/\/css-variables\.css/);
-};
-
-const OpenUI5Support = {
-	isLoaded,
-	init,
-	getConfigurationSettingsObject,
-	getLocaleDataObject,
-	attachListeners,
-	cssVariablesLoaded,
-};
-
-registerFeature("OpenUI5Support", OpenUI5Support);

package/src/features/PropertiesFormatSupport.js

@@ -1,8 +0,0 @@
-import { registerFeature } from "../FeaturesRegistry.js";
-import parseProperties from "../util/parseProperties.js";
-
-const PropertiesFormatSupport = {
-	parser: parseProperties,
-};
-
-registerFeature("PropertiesFormatSupport", PropertiesFormatSupport);

package/src/features/browsersupport/Edge.js

@@ -1,6 +0,0 @@
-// URLSearchParams
-import "url-search-params-polyfill/index.js";
-
-
-// "pseudo mutation observer" fix for nodeValue
-import "../../compatibility/patchNodeValue.js";

package/src/features/browsersupport/IE11.js

@@ -1,41 +0,0 @@
-// CSS Custom Properties
-import cssVars from "css-vars-ponyfill/dist/css-vars-ponyfill.esm.js";
-
-// String
-import "../../thirdparty/es6-string-methods.js";
-
-// Object
-import "../../thirdparty/Object.entries.js";
-
-// Array
-import "../../thirdparty/Array.prototype.fill.js";
-import "../../thirdparty/Array.prototype.find.js";
-import "../../thirdparty/Array.prototype.includes.js";
-
-// Map
-import "../../thirdparty/Map.prototype.keys.js";
-
-// Number
-import "../../thirdparty/Number.isInteger.js";
-import "../../thirdparty/Number.isNaN.js";
-import "../../thirdparty/Number.parseInt.js";
-
-// Element
-import "../../thirdparty/Element.prototype.matches.js";
-import "../../thirdparty/Element.prototype.closest.js";
-
-// WeakSet
-import "../../thirdparty/WeakSet.js";
-
-// fetch
-import "../../thirdparty/fetch.js";
-
-// async - await
-import "regenerator-runtime/runtime.js";
-
-// Plus all polyfills needed for Edge are also needed for IE11
-import "./Edge.js";
-
-window.CSSVarsPonyfill = {
-	cssVars,
-};

package/src/features/browsersupport/IE11WithWebComponentsPolyfill.js

@@ -1,5 +0,0 @@
-// All web components polyfills (including platform) with "window" passed as argument to the iife
-import "../../thirdparty/webcomponents-sd-ce-pf.js";
-
-// All IE11 polyfills, needed by the project itself
-import "./IE11.js";

package/src/i18nBundle.js

@@ -1,33 +0,0 @@
-import { fetchI18nBundle, getI18nBundleData } from "./asset-registries/i18n.js";
-import formatMessage from "./util/formatMessage.js";
-
-const I18nBundleInstances = new Map();
-
-class I18nBundle {
-	constructor(packageName) {
-		this.packageName = packageName;
-	}
-
-	getText(textObj, ...params) {
-		if (!textObj || !textObj.key || !textObj.defaultText) {
-			return "";
-		}
-
-		const bundle = getI18nBundleData(this.packageName);
-		const messageText = bundle && bundle[textObj.key] ? bundle[textObj.key] : textObj.defaultText;
-
-		return formatMessage(messageText, params);
-	}
-}
-
-const getI18nBundle = packageName => {
-	if (I18nBundleInstances.has(packageName)) {
-		return I18nBundleInstances.get(packageName);
-	}
-
-	const i18nBundle = new I18nBundle(packageName);
-	I18nBundleInstances.set(packageName, i18nBundle);
-	return i18nBundle;
-};
-
-export { fetchI18nBundle, getI18nBundle };

package/src/locale/RTLAwareRegistry.js

@@ -1,14 +0,0 @@
-const rtlAwareSet = new Set();
-
-const markAsRtlAware = klass => {
-	rtlAwareSet.add(klass);
-};
-
-const isRtlAware = klass => {
-	return rtlAwareSet.has(klass);
-};
-
-export {
-	markAsRtlAware,
-	isRtlAware,
-};

package/src/locale/applyDirection.js

@@ -1,15 +0,0 @@
-import RenderScheduler from "../RenderScheduler.js";
-
-/**
- * Re-renders all RTL-aware UI5 Elements.
- * Call this method whenever you change the "dir" property anywhere in your HTML page
- * Example: document.body.dir = "rtl"; applyDirection();
- *
- * @returns {Promise<void>}
- */
-const applyDirection = () => {
-	RenderScheduler.reRenderAllUI5Elements({ rtlAware: true });
-	return RenderScheduler.whenFinished();
-};
-
-export default applyDirection;

package/src/locale/languageChange.js

@@ -1,22 +0,0 @@
-import EventProvider from "../EventProvider.js";
-
-const eventProvider = new EventProvider();
-const LANG_CHANGE = "languageChange";
-
-const attachLanguageChange = listener => {
-	eventProvider.attachEvent(LANG_CHANGE, listener);
-};
-
-const detachLanguageChange = listener => {
-	eventProvider.detachEvent(LANG_CHANGE, listener);
-};
-
-const fireLanguageChange = lang => {
-	return eventProvider.fireEvent(LANG_CHANGE, lang);
-};
-
-export {
-	attachLanguageChange,
-	detachLanguageChange,
-	fireLanguageChange,
-};

package/src/renderer/LitRenderer.js

@@ -1,15 +0,0 @@
-import { html, render } from "lit-html/lit-html.js";
-
-const litRender = (templateResult, domNode, styles, { eventContext } = {}) => {
-	if (styles) {
-		templateResult = html`<style>${styles}</style>${templateResult}`;
-	}
-	render(templateResult, domNode, { eventContext });
-};
-
-export { html, svg } from "lit-html/lit-html.js";
-export { repeat } from "lit-html/directives/repeat.js";
-export { classMap } from "lit-html/directives/class-map.js";
-export { styleMap } from "lit-html/directives/style-map.js";
-
-export default litRender;

package/src/renderer/ifDefined.js

@@ -1,21 +0,0 @@
-import {
-	AttributePart,
-	directive,
-	noChange,
-} from "lit-html/lit-html.js";
-
-/*
-	lit-html directive that removes and attribute if it is undefined
-*/
-export default directive(value => part => {
-	if ((value === undefined) && part instanceof AttributePart) {
-		if (value !== part.value) {
-			const name = part.committer.name;
-			part.committer.element.removeAttribute(name);
-		}
-	} else if (part.committer && part.committer.element && part.committer.element.getAttribute(part.committer.name) === value) {
-		part.setValue(noChange);
-	} else {
-		part.setValue(value);
-	}
-});

package/src/theming/CSSVarsPonyfill.js

@@ -1,24 +0,0 @@
-let ponyfillTimer;
-
-const ponyfillNeeded = () => !!window.CSSVarsPonyfill;
-
-const runPonyfill = () => {
-	ponyfillTimer = undefined;
-
-	window.CSSVarsPonyfill.cssVars({
-		rootElement: document.head,
-		silent: true,
-	});
-};
-
-const schedulePonyfill = () => {
-	if (!ponyfillTimer) {
-		ponyfillTimer = window.setTimeout(runPonyfill, 0);
-	}
-};
-
-export {
-	ponyfillNeeded,
-	runPonyfill,
-	schedulePonyfill,
-};

package/src/theming/CustomStyle.js

@@ -1,19 +0,0 @@
-const customCSSFor = {};
-
-const addCustomCSS = (tag, css, ...rest) => {
-	if (rest.length) {
-		throw new Error("addCustomCSS no longer accepts theme specific CSS. new signature is `addCustomCSS(tag, css)`");
-	}
-
-	if (!customCSSFor[tag]) {
-		customCSSFor[tag] = [];
-	}
-
-	customCSSFor[tag].push(css);
-};
-
-const getCustomCSS = tag => {
-	return customCSSFor[tag] ? customCSSFor[tag].join("") : "";
-};
-
-export { addCustomCSS, getCustomCSS };

package/src/theming/adaptCSSForIE.js

@@ -1,90 +0,0 @@
-const findClosingParenthesisPos = (str, openingParenthesisPos) => {
-	let opened = 1;
-	for (let pos = openingParenthesisPos + 1; pos < str.length; pos++) {
-		const char = str.charAt(pos);
-		if (char === "(") {
-			opened++;
-		} else if (char === ")") {
-			opened--;
-		}
-		if (opened === 0) {
-			return pos;
-		}
-	}
-};
-
-const replaceSelector = (str, selector, selectorStartPos, replacement) => {
-	const charAfterSelectorPos = selectorStartPos + selector.length;
-	const charAfterSelector = str.charAt(charAfterSelectorPos);
-
-	const upToSelector = str.substring(0, selectorStartPos) + replacement;
-	if (charAfterSelector === "(") {
-		const closingParenthesisPos = findClosingParenthesisPos(str, charAfterSelectorPos);
-		return upToSelector + str.substring(charAfterSelectorPos + 1, closingParenthesisPos) + str.substring(closingParenthesisPos + 1);
-	}
-
-	return upToSelector + str.substring(charAfterSelectorPos);
-};
-
-/**
- * :host => ui5-button
- * :host([expr]) => ui5-button[expr]
- * ::slotted(expr) => expr
- * @param str - source string
- * @param selector - :host or ::slotted
- * @param replacement - normally tag name
- * @returns {*}
- */
-const replaceSelectors = (str, selector, replacement) => {
-	let selectorStartPos = str.indexOf(selector);
-	while (selectorStartPos !== -1) {
-		str = replaceSelector(str, selector, selectorStartPos, replacement);
-		selectorStartPos = str.indexOf(selector);
-	}
-	return str;
-};
-
-const adaptLinePart = (line, tag) => {
-	line = line.trim();
-	line = replaceSelectors(line, "::slotted", ``); // first remove all ::slotted() occurrences
-
-	// Host selector - replace it
-	if (line.startsWith(":host")) {
-		return replaceSelector(line, ":host", 0, tag);
-	}
-
-	// Leave out @keyframes and keyframe values (0%, 100%, etc...)
-	// csso shortens '100%' -> 'to', make sure to leave it untouched
-	if (line.match(/^[@0-9]/) || line === "to" || line === "to{") {
-		return line;
-	}
-
-	// IE specific selector (directly written with the tag) - keep it
-	if (line.match(new RegExp(`^${tag}[^a-zA-Z0-9-]`))) {
-		return line;
-	}
-
-	// No host and no tag in the beginning of the selector - prepend the tag
-	return `${tag} ${line}`;
-};
-
-const adaptCSSForIE = (str, tag) => {
-	str = str.replace(/\n/g, ` `);
-	str = str.replace(/([{}])/g, `$1\n`);
-	let result = ``;
-	const lines = str.split(`\n`);
-	lines.forEach(line => {
-		const mustProcess = line.match(/{$/); // Only work on lines that end on {, otherwise just append to result
-		if (mustProcess) {
-			const lineParts = line.split(",");
-			const processedLineParts = lineParts.map(linePart => {
-				return adaptLinePart(linePart, tag);
-			});
-			line = processedLineParts.join(",");
-		}
-		result = `${result}${line}`;
-	});
-	return result;
-};
-
-export default adaptCSSForIE;