funda-ui 4.5.37 → 4.5.512

package/Date/index.js

@@ -1736,7 +1736,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             var remainingText = getRemainingText(currentSuggestion);
             if (remainingText) {
               // Only the second half of the text is added
-              setChangedVal(changedVal + remainingText);
+              handleChange(e, changedVal + remainingText);
               setCurrentSuggestion('');
             }
           };
@@ -1781,19 +1781,18 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             //
             onFocus === null || onFocus === void 0 ? void 0 : onFocus(event, onComposition, valRef.current);
           }
-          function handleChange(event) {
-            var val = event.target.value;
-            setChangedVal(val);
+          function handleChange(event, curVal) {
+            setChangedVal(curVal);
 
             //----
             //remove focus style
-            if (val === '') {
+            if (curVal === '') {
               var _rootRef$current2;
               (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
             }
 
             //
-            onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current);
+            onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current, curVal);
 
             // It fires in real time as the user enters
             if (typeof onInputCallback === 'function') {
@@ -1950,7 +1949,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             onFocus: handleFocus,
             onBlur: handleBlur,
             onChange: function onChange(e) {
-              handleChange(e);
+              handleChange(e, e.target.value);
 
               // AI Predict
               if (aiPredict) {

package/EventCalendarTimeline/index.js

@@ -5447,12 +5447,23 @@ var EventCalendarTimeline = function EventCalendarTimeline(props) {
   function outerWrapperInit() {
     var _rootRef$current$pare;
     if (rootRef.current === null) return;
+    var hasInlineHeightOrMaxHeight = function hasInlineHeightOrMaxHeight(element) {
+      if (!element) return false;
+      return element.style.height !== '' || element.style.maxHeight !== '';
+    };
 
-    // calculate wrapper width 
+    // calculate wrapper width & height
     var wrapperWidth = ((_rootRef$current$pare = rootRef.current.parentElement) === null || _rootRef$current$pare === void 0 ? void 0 : _rootRef$current$pare.offsetWidth) || 0;
     if (rootRef.current && wrapperWidth > 0 && rootWidth.current === 0) {
+      var _rootRef$current$pare2;
       rootWidth.current = wrapperWidth;
       rootRef.current.style.width = wrapperWidth + 'px';
+
+      // height
+      var wrapperHeight = ((_rootRef$current$pare2 = rootRef.current.parentElement) === null || _rootRef$current$pare2 === void 0 ? void 0 : _rootRef$current$pare2.offsetHeight) || 0;
+      if (hasInlineHeightOrMaxHeight(rootRef.current.parentElement) && wrapperHeight > 0) {
+        rootRef.current.style.height = wrapperHeight + 'px';
+      }
     }
   }
   function tableGridInit() {

package/Input/index.d.ts

@@ -48,7 +48,7 @@ export declare type InputProps = {
     onChangeCallback?: (e: any, el: any) => void;
     onInputCallback?: (e: any, el: any) => void;
     onKeyPressedCallback?: (e: any, el: any) => void;
-    onChange?: (e: any, param: any, el: any) => void;
+    onChange?: (e: any, param: any, el: any, value: string) => void;
     onBlur?: (e: any, param: any, el: any) => void;
     onFocus?: (e: any, param: any, el: any) => void;
     onPressEnter?: (e: any, el: any) => void;

package/Input/index.js

@@ -1182,7 +1182,7 @@ var Input = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(funct
     var remainingText = getRemainingText(currentSuggestion);
     if (remainingText) {
       // Only the second half of the text is added
-      setChangedVal(changedVal + remainingText);
+      handleChange(e, changedVal + remainingText);
       setCurrentSuggestion('');
     }
   };
@@ -1227,19 +1227,18 @@ var Input = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(funct
     //
     onFocus === null || onFocus === void 0 ? void 0 : onFocus(event, onComposition, valRef.current);
   }
-  function handleChange(event) {
-    var val = event.target.value;
-    setChangedVal(val);
+  function handleChange(event, curVal) {
+    setChangedVal(curVal);
 
     //----
     //remove focus style
-    if (val === '') {
+    if (curVal === '') {
       var _rootRef$current2;
       (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
     }
 
     //
-    onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current);
+    onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current, curVal);
 
     // It fires in real time as the user enters
     if (typeof onInputCallback === 'function') {
@@ -1396,7 +1395,7 @@ var Input = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(funct
     onFocus: handleFocus,
     onBlur: handleBlur,
     onChange: function onChange(e) {
-      handleChange(e);
+      handleChange(e, e.target.value);
 
       // AI Predict
       if (aiPredict) {

package/RangeSlider/index.js

@@ -1702,7 +1702,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             var remainingText = getRemainingText(currentSuggestion);
             if (remainingText) {
               // Only the second half of the text is added
-              setChangedVal(changedVal + remainingText);
+              handleChange(e, changedVal + remainingText);
               setCurrentSuggestion('');
             }
           };
@@ -1747,19 +1747,18 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             //
             onFocus === null || onFocus === void 0 ? void 0 : onFocus(event, onComposition, valRef.current);
           }
-          function handleChange(event) {
-            var val = event.target.value;
-            setChangedVal(val);
+          function handleChange(event, curVal) {
+            setChangedVal(curVal);
 
             //----
             //remove focus style
-            if (val === '') {
+            if (curVal === '') {
               var _rootRef$current2;
               (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
             }
 
             //
-            onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current);
+            onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current, curVal);
 
             // It fires in real time as the user enters
             if (typeof onInputCallback === 'function') {
@@ -1916,7 +1915,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             onFocus: handleFocus,
             onBlur: handleBlur,
             onChange: function onChange(e) {
-              handleChange(e);
+              handleChange(e, e.target.value);
 
               // AI Predict
               if (aiPredict) {

package/Textarea/index.d.ts

@@ -37,7 +37,7 @@ export declare type TextareaProps = {
     onChangeCallback?: (e: any, el: any) => void;
     onInputCallback?: (e: any, el: any) => void;
     onKeyPressedCallback?: (e: any, el: any) => void;
-    onChange?: (e: any, el: any) => void;
+    onChange?: (e: any, el: any, value: string) => void;
     onBlur?: (e: any, el: any) => void;
     onFocus?: (e: any, el: any) => void;
     onPressEnter?: (e: any, el: any) => void;

package/Textarea/index.js

@@ -1460,7 +1460,7 @@ var Textarea = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(fu
     var remainingText = getRemainingText(currentSuggestion);
     if (remainingText) {
       // Only the second half of the text is added
-      setChangedVal(changedVal + remainingText);
+      handleChange(e, changedVal + remainingText);
       setCurrentSuggestion('');
     }
   };
@@ -1507,19 +1507,18 @@ var Textarea = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(fu
     //
     onFocus === null || onFocus === void 0 ? void 0 : onFocus(event, valRef.current);
   }
-  function handleChange(event) {
-    var val = event.target.value;
-    setChangedVal(val);
+  function handleChange(event, curVal) {
+    setChangedVal(curVal);
 
     //----
     //remove focus style
-    if (val === '') {
+    if (curVal === '') {
       var _rootRef$current2;
       (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
     }
 
     //
-    onChange === null || onChange === void 0 ? void 0 : onChange(event, valRef.current);
+    onChange === null || onChange === void 0 ? void 0 : onChange(event, valRef.current, curVal);
 
     // It fires in real time as the user enters
     if (typeof onInputCallback === 'function') {
@@ -1686,7 +1685,7 @@ var Textarea = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(fu
     onFocus: handleFocus,
     onBlur: handleBlur,
     onChange: function onChange(e) {
-      handleChange(e);
+      handleChange(e, e.target.value);
 
       // AI Predict
       if (aiPredict) {

package/lib/cjs/Date/index.js

@@ -1736,7 +1736,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             var remainingText = getRemainingText(currentSuggestion);
             if (remainingText) {
               // Only the second half of the text is added
-              setChangedVal(changedVal + remainingText);
+              handleChange(e, changedVal + remainingText);
               setCurrentSuggestion('');
             }
           };
@@ -1781,19 +1781,18 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             //
             onFocus === null || onFocus === void 0 ? void 0 : onFocus(event, onComposition, valRef.current);
           }
-          function handleChange(event) {
-            var val = event.target.value;
-            setChangedVal(val);
+          function handleChange(event, curVal) {
+            setChangedVal(curVal);
 
             //----
             //remove focus style
-            if (val === '') {
+            if (curVal === '') {
               var _rootRef$current2;
               (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
             }
 
             //
-            onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current);
+            onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current, curVal);
 
             // It fires in real time as the user enters
             if (typeof onInputCallback === 'function') {
@@ -1950,7 +1949,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             onFocus: handleFocus,
             onBlur: handleBlur,
             onChange: function onChange(e) {
-              handleChange(e);
+              handleChange(e, e.target.value);
 
               // AI Predict
               if (aiPredict) {

package/lib/cjs/EventCalendarTimeline/index.js

@@ -5447,12 +5447,23 @@ var EventCalendarTimeline = function EventCalendarTimeline(props) {
   function outerWrapperInit() {
     var _rootRef$current$pare;
     if (rootRef.current === null) return;
+    var hasInlineHeightOrMaxHeight = function hasInlineHeightOrMaxHeight(element) {
+      if (!element) return false;
+      return element.style.height !== '' || element.style.maxHeight !== '';
+    };
 
-    // calculate wrapper width 
+    // calculate wrapper width & height
     var wrapperWidth = ((_rootRef$current$pare = rootRef.current.parentElement) === null || _rootRef$current$pare === void 0 ? void 0 : _rootRef$current$pare.offsetWidth) || 0;
     if (rootRef.current && wrapperWidth > 0 && rootWidth.current === 0) {
+      var _rootRef$current$pare2;
       rootWidth.current = wrapperWidth;
       rootRef.current.style.width = wrapperWidth + 'px';
+
+      // height
+      var wrapperHeight = ((_rootRef$current$pare2 = rootRef.current.parentElement) === null || _rootRef$current$pare2 === void 0 ? void 0 : _rootRef$current$pare2.offsetHeight) || 0;
+      if (hasInlineHeightOrMaxHeight(rootRef.current.parentElement) && wrapperHeight > 0) {
+        rootRef.current.style.height = wrapperHeight + 'px';
+      }
     }
   }
   function tableGridInit() {

package/lib/cjs/Input/index.d.ts

@@ -48,7 +48,7 @@ export declare type InputProps = {
     onChangeCallback?: (e: any, el: any) => void;
     onInputCallback?: (e: any, el: any) => void;
     onKeyPressedCallback?: (e: any, el: any) => void;
-    onChange?: (e: any, param: any, el: any) => void;
+    onChange?: (e: any, param: any, el: any, value: string) => void;
     onBlur?: (e: any, param: any, el: any) => void;
     onFocus?: (e: any, param: any, el: any) => void;
     onPressEnter?: (e: any, el: any) => void;

package/lib/cjs/Input/index.js

@@ -1182,7 +1182,7 @@ var Input = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(funct
     var remainingText = getRemainingText(currentSuggestion);
     if (remainingText) {
       // Only the second half of the text is added
-      setChangedVal(changedVal + remainingText);
+      handleChange(e, changedVal + remainingText);
       setCurrentSuggestion('');
     }
   };
@@ -1227,19 +1227,18 @@ var Input = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(funct
     //
     onFocus === null || onFocus === void 0 ? void 0 : onFocus(event, onComposition, valRef.current);
   }
-  function handleChange(event) {
-    var val = event.target.value;
-    setChangedVal(val);
+  function handleChange(event, curVal) {
+    setChangedVal(curVal);
 
     //----
     //remove focus style
-    if (val === '') {
+    if (curVal === '') {
       var _rootRef$current2;
       (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
     }
 
     //
-    onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current);
+    onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current, curVal);
 
     // It fires in real time as the user enters
     if (typeof onInputCallback === 'function') {
@@ -1396,7 +1395,7 @@ var Input = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(funct
     onFocus: handleFocus,
     onBlur: handleBlur,
     onChange: function onChange(e) {
-      handleChange(e);
+      handleChange(e, e.target.value);
 
       // AI Predict
       if (aiPredict) {

package/lib/cjs/RangeSlider/index.js

@@ -1702,7 +1702,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             var remainingText = getRemainingText(currentSuggestion);
             if (remainingText) {
               // Only the second half of the text is added
-              setChangedVal(changedVal + remainingText);
+              handleChange(e, changedVal + remainingText);
               setCurrentSuggestion('');
             }
           };
@@ -1747,19 +1747,18 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             //
             onFocus === null || onFocus === void 0 ? void 0 : onFocus(event, onComposition, valRef.current);
           }
-          function handleChange(event) {
-            var val = event.target.value;
-            setChangedVal(val);
+          function handleChange(event, curVal) {
+            setChangedVal(curVal);
 
             //----
             //remove focus style
-            if (val === '') {
+            if (curVal === '') {
               var _rootRef$current2;
               (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
             }
 
             //
-            onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current);
+            onChange === null || onChange === void 0 ? void 0 : onChange(event, onComposition, valRef.current, curVal);
 
             // It fires in real time as the user enters
             if (typeof onInputCallback === 'function') {
@@ -1916,7 +1915,7 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
             onFocus: handleFocus,
             onBlur: handleBlur,
             onChange: function onChange(e) {
-              handleChange(e);
+              handleChange(e, e.target.value);
 
               // AI Predict
               if (aiPredict) {

package/lib/cjs/Textarea/index.d.ts

@@ -37,7 +37,7 @@ export declare type TextareaProps = {
     onChangeCallback?: (e: any, el: any) => void;
     onInputCallback?: (e: any, el: any) => void;
     onKeyPressedCallback?: (e: any, el: any) => void;
-    onChange?: (e: any, el: any) => void;
+    onChange?: (e: any, el: any, value: string) => void;
     onBlur?: (e: any, el: any) => void;
     onFocus?: (e: any, el: any) => void;
     onPressEnter?: (e: any, el: any) => void;

package/lib/cjs/Textarea/index.js

@@ -1460,7 +1460,7 @@ var Textarea = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(fu
     var remainingText = getRemainingText(currentSuggestion);
     if (remainingText) {
       // Only the second half of the text is added
-      setChangedVal(changedVal + remainingText);
+      handleChange(e, changedVal + remainingText);
       setCurrentSuggestion('');
     }
   };
@@ -1507,19 +1507,18 @@ var Textarea = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(fu
     //
     onFocus === null || onFocus === void 0 ? void 0 : onFocus(event, valRef.current);
   }
-  function handleChange(event) {
-    var val = event.target.value;
-    setChangedVal(val);
+  function handleChange(event, curVal) {
+    setChangedVal(curVal);
 
     //----
     //remove focus style
-    if (val === '') {
+    if (curVal === '') {
       var _rootRef$current2;
       (_rootRef$current2 = rootRef.current) === null || _rootRef$current2 === void 0 ? void 0 : _rootRef$current2.classList.remove('focus');
     }
 
     //
-    onChange === null || onChange === void 0 ? void 0 : onChange(event, valRef.current);
+    onChange === null || onChange === void 0 ? void 0 : onChange(event, valRef.current, curVal);
 
     // It fires in real time as the user enters
     if (typeof onInputCallback === 'function') {
@@ -1686,7 +1685,7 @@ var Textarea = /*#__PURE__*/(0,react__WEBPACK_IMPORTED_MODULE_0__.forwardRef)(fu
     onFocus: handleFocus,
     onBlur: handleBlur,
     onChange: function onChange(e) {
-      handleChange(e);
+      handleChange(e, e.target.value);
 
       // AI Predict
       if (aiPredict) {

package/lib/esm/EventCalendarTimeline/index.tsx

@@ -1826,11 +1826,23 @@ const EventCalendarTimeline = (props: EventCalendarTimelineProps) => {
     function outerWrapperInit() {
         if (rootRef.current === null) return;
 
-        // calculate wrapper width 
+        const hasInlineHeightOrMaxHeight = (element: HTMLElement) => {
+            if (!element) return false;
+            return element.style.height !== '' || element.style.maxHeight !== '';
+        };
+
+        // calculate wrapper width & height
         const wrapperWidth = rootRef.current.parentElement?.offsetWidth || 0;
         if (rootRef.current && wrapperWidth > 0 && rootWidth.current === 0) {
             rootWidth.current = wrapperWidth;
             rootRef.current.style.width = wrapperWidth + 'px';
+ 
+            // height
+            const wrapperHeight = rootRef.current.parentElement?.offsetHeight || 0;
+            if (hasInlineHeightOrMaxHeight(rootRef.current.parentElement) && wrapperHeight > 0) {
+                rootRef.current.style.height = wrapperHeight + 'px';
+            }
+            
         }
     }
 

package/lib/esm/Input/index.tsx

@@ -57,7 +57,7 @@ export type InputProps = {
     onChangeCallback?: (e: any, el: any) => void;
     onInputCallback?: (e: any, el: any) => void;
     onKeyPressedCallback?: (e: any, el: any) => void;
-    onChange?: (e: any, param: any, el: any) => void;
+    onChange?: (e: any, param: any, el: any, value: string) => void;
     onBlur?: (e: any, param: any, el: any) => void;
     onFocus?: (e: any, param: any, el: any) => void;
     onPressEnter?: (e: any, el: any) => void;
@@ -286,7 +286,7 @@ const Input = forwardRef((props: InputProps, externalRef: any) => {
         const remainingText = getRemainingText(currentSuggestion);
         if (remainingText) {
             // Only the second half of the text is added
-            setChangedVal(changedVal + remainingText);
+            handleChange(e, changedVal + remainingText);
             setCurrentSuggestion('');
         }
     };
@@ -338,20 +338,18 @@ const Input = forwardRef((props: InputProps, externalRef: any) => {
         onFocus?.(event, onComposition, valRef.current);
     }
 
-    function handleChange(event: ChangeEvent<HTMLInputElement>) {
-        const val = event.target.value;
-
-        setChangedVal(val);
+    function handleChange(event: ChangeEvent<HTMLInputElement> | KeyboardEvent<HTMLInputElement> | null, curVal: string) {
+        setChangedVal(curVal);
 
-     
+   
         //----
         //remove focus style
-        if (val === '') {
+        if (curVal === '') {
             rootRef.current?.classList.remove('focus');
         }
 
         //
-        onChange?.(event, onComposition, valRef.current);
+        onChange?.(event, onComposition, valRef.current, curVal);
 
         // It fires in real time as the user enters
         if (typeof (onInputCallback) === 'function') {
@@ -537,7 +535,7 @@ const Input = forwardRef((props: InputProps, externalRef: any) => {
                             onFocus={handleFocus}
                             onBlur={handleBlur}
                             onChange={(e: any) => {
-                                handleChange(e);
+                                handleChange(e, e.target.value);
 
                                 // AI Predict
                                 if (aiPredict) {

package/lib/esm/ModalDialog/index.tsx

@@ -13,6 +13,7 @@ import {
 } from 'funda-utils/dist/cjs/bodyScrollLock';
 
 
+
 declare global {
     interface Window {
         curVideo?: any;

package/lib/esm/Textarea/index.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect, useRef, forwardRef, KeyboardEvent, useImperativeHandle } from 'react';
+import React, { useState, useEffect, useRef, forwardRef, ChangeEvent, KeyboardEvent, useImperativeHandle } from 'react';
 
 
 import useComId from 'funda-utils/dist/cjs/useComId';
@@ -46,7 +46,7 @@ export type TextareaProps = {
     onChangeCallback?: (e: any, el: any) => void;
     onInputCallback?: (e: any, el: any) => void;
     onKeyPressedCallback?: (e: any, el: any) => void;
-    onChange?: (e: any, el: any) => void;
+    onChange?: (e: any, el: any, value: string) => void;
     onBlur?: (e: any, el: any) => void;
     onFocus?: (e: any, el: any) => void;
     onPressEnter?: (e: any, el: any) => void;
@@ -262,7 +262,7 @@ const Textarea = forwardRef((props: TextareaProps, externalRef: any) => {
         const remainingText = getRemainingText(currentSuggestion);
         if (remainingText) {
             // Only the second half of the text is added
-            setChangedVal(changedVal + remainingText);
+            handleChange(e, changedVal + remainingText);
             setCurrentSuggestion('');
         }
     };
@@ -318,19 +318,18 @@ const Textarea = forwardRef((props: TextareaProps, externalRef: any) => {
     }
 
     
-    function handleChange(event: any) {
-        const val = event.target.value;
+    function handleChange(event: ChangeEvent<HTMLTextAreaElement> | KeyboardEvent<HTMLTextAreaElement> | null, curVal: string) {
 
-        setChangedVal(val);
+        setChangedVal(curVal);
 
         //----
         //remove focus style
-        if (val === '') {
+        if (curVal === '') {
             rootRef.current?.classList.remove('focus');
         }
 
         //
-        onChange?.(event, valRef.current);
+        onChange?.(event, valRef.current, curVal);
 
         // It fires in real time as the user enters
         if (typeof (onInputCallback) === 'function') {
@@ -527,7 +526,7 @@ const Textarea = forwardRef((props: TextareaProps, externalRef: any) => {
                             onFocus={handleFocus}
                             onBlur={handleBlur}
                             onChange={(e: any) => {
-                                handleChange(e);
+                                handleChange(e, e.target.value);
 
                                 // AI Predict
                                 if (aiPredict) {

package/package.json

@@ -2,7 +2,7 @@
   "author": "UIUX Lab",
   "email": "uiuxlab@gmail.com",
   "name": "funda-ui",
-  "version": "4.5.37",
+  "version": "4.5.512",
   "description": "React components using pure Bootstrap 5+ which does not contain any external style and script libraries.",
   "repository": {
     "type": "git",