fix(ThemeProvider): Only inject theme properties if they are not present (#55)

Author: MarcusNotheis

packages/main/src/components/ThemeProvider/index.tsx

@@ -1,7 +1,7 @@
-import { createGenerateClassName, sap_fiori_3 } from '@ui5/webcomponents-react-base';
 import boot from '@ui5/webcomponents-base/src/boot';
 import { getCompactSize, getTheme } from '@ui5/webcomponents-base/src/Configuration';
 import { injectThemeProperties } from '@ui5/webcomponents-base/src/theming/StyleInjection';
+import { createGenerateClassName, sap_fiori_3 } from '@ui5/webcomponents-react-base';
 import fiori3ThemeProperties from '@ui5/webcomponents/dist/themes/sap_fiori_3/parameters-bundle.css.json';
 import React, { Fragment, PureComponent, ReactNode } from 'react';
 import { JssProvider, ThemeProvider as ReactJssThemeProvider } from 'react-jss';
@@ -23,9 +23,11 @@ export class ThemeProvider extends PureComponent<ThemeProviderProps> {
 
   constructor(props) {
     super(props);
-    // inject default CSS custom parameters in head
     boot().then((_) => {
-      injectThemeProperties(fiori3ThemeProperties._);
+      let existingThemingProperties = document.querySelector('head style[data-ui5-webcomponents-theme-properties]');
+      if (!existingThemingProperties || !existingThemingProperties.innerHTML) {
+        injectThemeProperties(fiori3ThemeProperties._);
+      }
     });
   }