chore: rewrite imports with file extensions (#344)

Rewrite all imports across all packages (core, base and main) with file extensions
and force writing them this way by adding an eslint rule.
Example:
import WebComponent from "@ui5/webcomponents-base/src/WebComponent.js";
import ButtonRenderer from "./build/compiled/ButtonRenderer.lit.js";
import buttonCss from "./themes/Button.css.js";
* Packages are ignored: import { render } from "lit-html";
* The eslint rule is: "import/extensions": ["error", "ignorePackages"]

Author: ilhan007

packages/base/.eslintrc.js

@@ -11,6 +11,7 @@ module.exports = {
 	},
 	"rules": {
 		"comma-dangle": [2, "always-multiline"], // difference from openui5
+		"import/extensions": ["error", "ignorePackages"], // override for UI5 WebComponents
 		"no-cond-assign": 2,
 		"no-console": 2,
 		"no-constant-condition": 2,

packages/base/src/Bootstrap.js

@@ -1,10 +1,10 @@
-import whenDOMReady from "./util/whenDOMReady";
-import EventEnrichment from "./events/EventEnrichment";
-import { insertIconFontFace } from "./IconFonts";
-import DOMEventHandler from "./DOMEventHandler";
-import { initConfiguration } from "./Configuration";
-import { applyTheme } from "./Theming";
-import whenPolyfillLoaded from "./compatibility/whenPolyfillLoaded";
+import whenDOMReady from "./util/whenDOMReady.js";
+import EventEnrichment from "./events/EventEnrichment.js";
+import { insertIconFontFace } from "./IconFonts.js";
+import DOMEventHandler from "./DOMEventHandler.js";
+import { initConfiguration } from "./Configuration.js";
+import { applyTheme } from "./Theming.js";
+import whenPolyfillLoaded from "./compatibility/whenPolyfillLoaded.js";
 
 EventEnrichment.run();
 

packages/base/src/CLDR.js

@@ -73,8 +73,8 @@ import zh_HK from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/zh_HK.json";
 import zh_SG from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/zh_SG.json";
 import zh_TW from "@ui5/webcomponents-core/dist/sap/ui/core/cldr/zh_TW.json";
 
-import { registerModuleContent } from "./ResourceLoaderOverrides";
-import { fetchTextOnce } from "./util/FetchHelper";
+import { registerModuleContent } from "./ResourceLoaderOverrides.js";
+import { fetchTextOnce } from "./util/FetchHelper.js";
 
 const cldrData = {
 	ar,

packages/base/src/CSS.js

@@ -1,5 +1,5 @@
-import { getTheme } from "./Configuration";
-import { getEffectiveStyle } from "./Theming";
+import { getTheme } from "./Configuration.js";
+import { getEffectiveStyle } from "./Theming.js";
 
 const styleMap = new Map();
 

packages/base/src/Configuration.js

@@ -1,5 +1,5 @@
-import CalendarType from "@ui5/webcomponents-core/dist/sap/ui/core/CalendarType";
-import getDesigntimePropertyAsArray from "./util/getDesigntimePropertyAsArray";
+import CalendarType from "@ui5/webcomponents-core/dist/sap/ui/core/CalendarType.js";
+import getDesigntimePropertyAsArray from "./util/getDesigntimePropertyAsArray.js";
 
 const CONFIGURATION = {
 	theme: "sap_fiori_3",

packages/base/src/ControlRenderer.js

@@ -1,4 +1,4 @@
-import LitRenderer from "./renderer/LitRenderer";
+import LitRenderer from "./renderer/LitRenderer.js";
 
 const RendererImpl = LitRenderer;
 

packages/base/src/DOMEventHandler.js

@@ -1,6 +1,6 @@
-import ControlEvents from "./events/ControlEvents";
-import getOriginalEventTarget from "./events/getOriginalEventTarget";
-import WebComponent from "./WebComponent";
+import ControlEvents from "./events/ControlEvents.js";
+import getOriginalEventTarget from "./events/getOriginalEventTarget.js";
+import WebComponent from "./WebComponent.js";
 
 const handleEvent = function handleEvent(event) {
 	// Get the DOM node where the original event occurred

packages/base/src/FocusHelper.js

@@ -1,4 +1,4 @@
-import WebComponent from "./WebComponent";
+import WebComponent from "./WebComponent.js";
 
 const rFocusable = /^(?:input|select|textarea|button)$/i,
 	rClickable = /^(?:a|area)$/i;

packages/base/src/FormatSettings.js

@@ -1,5 +1,5 @@
-import Locale from "./Locale";
-import { getLocale } from "./LocaleProvider";
+import Locale from "./Locale.js";
+import { getLocale } from "./LocaleProvider.js";
 
 const mSettings = {};
 

packages/base/src/IconPool.js

@@ -1,4 +1,4 @@
-import URI from "@ui5/webcomponents-core/dist/sap/ui/thirdparty/URI";
+import URI from "@ui5/webcomponents-core/dist/sap/ui/thirdparty/URI.js";
 /* eslint-disable */
 
 const SAP_ICON_FONT_FAMILY = 'SAP-icons';