Update Switch samples for React19

Author: Mariela Tihova

samples/inputs/switches/checking/src/index.tsx

@@ -1,26 +1,18 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import './index.css';
-import { IgrSwitch, IgrSwitchModule } from 'igniteui-react';
+import { IgrSwitch } from 'igniteui-react';
 import 'igniteui-webcomponents/themes/light/bootstrap.css';
 
-IgrSwitchModule.register();
+export default function SwitchOutlined() {
 
-export default class SwitchOutlined extends React.Component<any, any> {
-
-    constructor(props: any) {
-        super(props);           
-    }
-
-    public render(): JSX.Element {
-        return (
-            <div className="container sample">
-                <IgrSwitch checked={true} ><span>Label</span></IgrSwitch>
-            </div>
-        );
-    }
+    return (
+        <div className="container sample">
+            <IgrSwitch checked={true} ><span>Label</span></IgrSwitch>
+        </div>
+    );
 }
 
-// rendering above class to the React DOM
+// rendering above component to the React DOM
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(<SwitchOutlined/>);

samples/inputs/switches/disabled/src/index.tsx

@@ -1,26 +1,18 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import './index.css';
-import { IgrSwitch, IgrSwitchModule } from 'igniteui-react';
+import { IgrSwitch } from 'igniteui-react';
 import 'igniteui-webcomponents/themes/light/bootstrap.css';
 
-IgrSwitchModule.register();
+export default function SwitchDisabled() {
 
-export default class SwitchDisabled extends React.Component<any, any> {
-
-    constructor(props: any) {
-        super(props);           
-    }
-
-    public render(): JSX.Element {
-        return (
-            <div className="container sample">
-                 <IgrSwitch disabled={true} />
-            </div>
-        );
-    }
+    return (
+        <div className="container sample">
+             <IgrSwitch disabled={true} />
+        </div>
+    );
 }
 
-// rendering above class to the React DOM
+// rendering above component to the React DOM
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(<SwitchDisabled/>);

samples/inputs/switches/label/src/index.tsx

@@ -1,26 +1,18 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import './index.css';
-import { IgrSwitch, IgrSwitchModule } from 'igniteui-react';
+import { IgrSwitch } from 'igniteui-react';
 import 'igniteui-webcomponents/themes/light/bootstrap.css';
 
-IgrSwitchModule.register();
+export default function SwitchLabel() {
 
-export default class SwitchLabel extends React.Component<any, any> {
-
-    constructor(props: any) {
-        super(props);           
-    }
-
-    public render(): JSX.Element {
-        return (
-            <div className="sample">
-                <IgrSwitch aria-labelledby="switchLabel" labelPosition="before" ><span id="switch-label">Label</span></IgrSwitch>
-            </div>
-        );
-    }
+    return (
+        <div className="sample">
+            <IgrSwitch aria-labelledby="switchLabel" labelPosition="before"><span id="switch-label">Label</span></IgrSwitch>
+        </div>
+    );
 }
 
-// rendering above class to the React DOM
+// rendering above component to the React DOM
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(<SwitchLabel/>);

samples/inputs/switches/overview/src/index.tsx

@@ -1,26 +1,18 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
 import './index.css';
-import { IgrSwitch, IgrSwitchModule } from 'igniteui-react';
+import { IgrSwitch } from 'igniteui-react';
 import 'igniteui-webcomponents/themes/light/bootstrap.css';
 
-IgrSwitchModule.register();
+export default function SwitchOverview() {
 
-export default class SwitchOverview extends React.Component<any, any> {
-
-    constructor(props: any) {
-        super(props);           
-    }
-
-    public render(): JSX.Element {
-        return (
-            <div className="container sample">
-                <IgrSwitch></IgrSwitch>
-            </div>
-        );
-    }
+    return (
+        <div className="container sample">
+            <IgrSwitch></IgrSwitch>
+        </div>
+    );
 }
 
-// rendering above class to the React DOM
+// rendering above component to the React DOM
 const root = ReactDOM.createRoot(document.getElementById('root'));
 root.render(<SwitchOverview/>);