refactor: move addCustomCSS away from Core (#58)

The addCustomCSS method that used to be on the Core moved to Theming.js BREAKING CHANGE: addCustomCSS is no longer on the Core object. Use Theming instead.
SAP · Feb 15, 2019 · 33152b9 · 33152b9
1 parent b6d6bbd
commit 33152b9
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 12 deletions.
diff --git a/packages/base/src/sap/ui/webcomponents/base/Core.js b/packages/base/src/sap/ui/webcomponents/base/Core.js
@@ -24,10 +24,6 @@ const Core = {
 		return configuration;
 	},
 
-	addCustomCSS: function (tag, theme, css) {
-		ShadowDOM._addCustomCSS(tag, theme, css);
-	},
-
 	/**
 	 * @deprecated - must be here for compatibility
 	 */

diff --git a/packages/base/src/sap/ui/webcomponents/base/Theming.js b/packages/base/src/sap/ui/webcomponents/base/Theming.js
@@ -1,4 +1,5 @@
 import configuration from "./Configuration";
+import ShadowDOM from './compatibility/ShadowDOM';
 
 const themeChangeCallbacks = [];
 
@@ -16,3 +17,7 @@ export const setTheme = function setTheme(theme) {
 	configuration._setTheme(theme);
 	themeChangeCallbacks.forEach(callback => callback(theme));
 };
+
+export const addCustomCSS = function (tag, theme, css) {
+	ShadowDOM._addCustomCSS(tag, theme, css);
+};
diff --git a/packages/main/bundle.es5.js b/packages/main/bundle.es5.js
@@ -4,6 +4,10 @@ import "@ui5/webcomponents-core/dist/sap/ui/thirdparty/es6-other-polyfills";
 import "regenerator-runtime/runtime";
 
 import Core from "@ui5/webcomponents-base/src/sap/ui/webcomponents/base/Core";
+import * as Theming from "@ui5/webcomponents-base/src/sap/ui/webcomponents/base/Theming";
 import "./bundle.esm";
 
-export { Core }; 
+export {
+	Core,
+	Theming,
+};
diff --git a/packages/main/bundle.esm.js b/packages/main/bundle.esm.js
@@ -56,6 +56,8 @@ window.sapUiDevice = Device;
 
 // Note: keep in sync with rollup.config value for IIFE
 import Core from "@ui5/webcomponents-base/src/sap/ui/webcomponents/base/Core";
+import * as Theming from "@ui5/webcomponents-base/src/sap/ui/webcomponents/base/Theming";
 window["sap-ui-webcomponents-main-bundle"] = {
-	Core: Core
-}
+	Core,
+	Theming,
+};
diff --git a/packages/main/test/sap/ui/webcomponents/main/pages/DatePicker_fg.html b/packages/main/test/sap/ui/webcomponents/main/pages/DatePicker_fg.html
@@ -144,9 +144,9 @@
 			}
 
 			// theme change sample
-			var wcCore = window["sap-ui-webcomponents-main-bundle"].Core;
-			wcCore.addCustomCSS('ui5-input', 'sap_belize_hcb', inputCSS);
-			wcCore.addCustomCSS('ui5-icon', 'sap_belize_hcb', iconCSS);
+			var Theming = window["sap-ui-webcomponents-main-bundle"].Theming;
+            Theming.addCustomCSS('ui5-input', 'sap_belize_hcb', inputCSS);
+            Theming.addCustomCSS('ui5-icon', 'sap_belize_hcb', iconCSS);
 
 			$('ui5-radiobutton[group="theme"]').on("select", function (event) {
 				if (event.detail.selected) {
@@ -157,10 +157,10 @@
 					} else {
 						document.body.style.backgroundColor = "white";
 					}
-					wcCore.setTheme(theme);
+                    Theming.setTheme(theme);
 				}
 			});
 		});
 	</script>
 </body>
-</html>
+</html>