feat(react): add setupIonicReact function (#24254)

resolves #24139

packages/react-router/test-app/src/App.tsx

@@ -1,4 +1,4 @@
-import { IonApp } from '@ionic/react';
+import { IonApp, setupIonicReact } from '@ionic/react';
 import React from 'react';
 import { Route } from 'react-router-dom';
 
@@ -36,6 +36,9 @@ import Refs from './pages/refs/Refs';
 import DynamicIonpageClassnames from './pages/dynamic-ionpage-classnames/DynamicIonpageClassnames';
 import Tabs from './pages/tabs/Tabs';
 import TabsSecondary from './pages/tabs/TabsSecondary';
+
+setupIonicReact();
+
 const App: React.FC = () => {
   return (
     <IonApp>

packages/react/src/components/index.ts

@@ -1,4 +1,4 @@
-import { initialize } from '@ionic/core/components';
+import { IonicConfig, initialize } from '@ionic/core/components';
 import { addIcons } from 'ionicons';
 import {
   arrowBackSharp,
@@ -23,7 +23,6 @@ export {
   createGesture,
   iosTransitionAnimation,
   mdTransitionAnimation,
-  setupConfig,
   IonicSwiper,
   IonicSlides,
   getTimeGivenProgression,
@@ -190,13 +189,17 @@ addIcons({
   'search-sharp': searchSharp,
 });
 
-/**
- * By default Ionic Framework hides elements that
- * are not hydrated, but in the CE build there is no
- * hydration.
- * TODO: Remove when all integrations have been
- * migrated to CE build.
- */
-document.documentElement.classList.add('ion-ce');
+export const setupIonicReact = (config: IonicConfig = {}) => {
+  /**
+   * By default Ionic Framework hides elements that
+   * are not hydrated, but in the CE build there is no
+   * hydration.
+   * TODO: Remove when all integrations have been
+   * migrated to CE build.
+   */
+  document.documentElement.classList.add('ion-ce');
 
-initialize();
+  initialize({
+    ...config
+  });
+}

packages/react/test-app/src/App.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Route } from 'react-router-dom';
-import { IonApp } from '@ionic/react';
+import { IonApp, setupIonicReact } from '@ionic/react';
 import { IonReactRouter } from '@ionic/react-router';
 
 /* Core CSS required for Ionic components to work properly */
@@ -25,6 +25,8 @@ import Main from './pages/Main';
 import OverlayHooks from './pages/overlay-hooks/OverlayHooks';
 import OverlayComponents from './pages/overlay-components/OverlayComponents';
 
+setupIonicReact();
+
 const App: React.FC = () => (
   <IonApp>
     <IonReactRouter>

packages/vue/src/index.ts

@@ -40,7 +40,6 @@ export {
   createGesture,
   iosTransitionAnimation,
   mdTransitionAnimation,
-  setupConfig,
   IonicSwiper,
   IonicSlides,
   getPlatforms,