Bugfixed / changing input stop animation on graphs

src/views/demoComponent/DemoComponent3.js

     }
     return (
         <>
-             <div code="br-hide" style={{ display: 'flex', flexDirection: 'row', border: '1px solid #dedede', width: '50%', height: '200px', backgroundColor: 'white', padding: '5px', borderRadius: '10px' }}>
+             <div code="br-hide" >
                 <div style={{ backgroundColor: 'white', minHeight: '100%', width: '50%', padding: '2px', margin: '5px' }}>
                     <div style={{ backgroundColor: 'white', width: '50%', padding: '2px', marginBottom: '20px' }}>
                         <h4>PDFEngine</h4>
                         <button style={{ marginLeft: '5px' }} className=" btn btn-primary" onClick={exec}>Hide table buttons</button>
                     </div>
                 </div>
-                <div style={{ backgroundColor: 'white', minHeight: '100%', width: '50%', padding: '5px' }}>
-                </div>
+                
             </div>
             <br />
             3

src/views/demoComponent/DemoComponent5.js

-import React, { lazy, useState } from 'react';
+import React, { lazy, useRef, useState } from 'react';
 import {
     CBadge,
     CButton,
 const DemoComponent5 = () => {
 
     const [rowNum, setRowNum] = useState(0);
-    const [inputValue, setInputValue] = useState("");
-
-    const handleChange = (event) => {
-        if (!isNaN(event.target.value)) {
-            setRowNum(event.target.value);
-            setInputValue(event.target.value);
-        } else {
-            alert('Not a number');
-            setInputValue("");
-        }
+    const refInput = useRef();
+    const handleSubmit = (event) =>
+    {
+        setRowNum(event.target.value);
+        exec();
     }
-
+    
     const exec = () => {
         PDFEngine();
         window.print();
                         <h4>PDFEngine</h4>
                     </div>
                     <div style={{ display: 'flex', flexDirection: 'row', marginLeft: '10px' }}>
-                        <input value={inputValue} style={{ border: '.5px solid lightGray', outline: 'none', backgroundColor: '#f2f2f2', borderRadius: '5px' }} placeholder=" Enter row number" type="text" name="name" onChange={handleChange} />
-                        <button style={{ marginLeft: '5px' }} className=" btn btn-primary" onClick={exec}>Remove</button>
+                        <form onSubmit={handleSubmit}>
+                        <input ref={refInput} style={{ border: '.5px solid lightGray', outline: 'none', backgroundColor: '#f2f2f2', borderRadius: '5px' }} placeholder=" Enter row number" type="text" name="name"  />
+                        <button style={{ marginLeft: '5px' }} className=" btn btn-primary">Remove</button>
+                        </form>
                     </div>
                 </div>
             </div>