hplx-react-elements-dev 1.0.85 → 1.0.87

package/dist/esm/index.js

@@ -2681,26 +2681,30 @@ var TextAreaField = function TextAreaField(_a) {
       _d = _a.rows,
       rows = _d === void 0 ? 2 : _d,
       _e = _a.isDynamicHeight,
-      isDynamicHeight = _e === void 0 ? false : _e;
+      isDynamicHeight = _e === void 0 ? false : _e,
+      _f = _a.isFocus,
+      isFocus = _f === void 0 ? false : _f;
 
-  var _f = inputProps || {},
-      disabled = _f.disabled,
-      onFocus = _f.onFocus,
-      onBlur = _f.onBlur;
+  var _g = inputProps || {},
+      disabled = _g.disabled,
+      onFocus = _g.onFocus,
+      onBlur = _g.onBlur;
 
-  var _g = useState(false),
-      active = _g[0],
-      setActive = _g[1];
+  var _h = useState(false),
+      active = _h[0],
+      setActive = _h[1];
 
-  var _h = useState(rows),
-      row = _h[0],
-      setRow = _h[1];
+  var _j = useState(rows),
+      row = _j[0],
+      setRow = _j[1];
 
   var ref = useRef(null);
 
   var handleHeight = function handleHeight() {
-    var element = ref.current;
-    isDynamicHeight && setRow(element.scrollHeight / 32);
+    if (isFocus = true) {
+      var element = ref === null || ref === void 0 ? void 0 : ref.current;
+      isDynamicHeight && setRow((element === null || element === void 0 ? void 0 : element.scrollHeight) / 32);
+    }
   };
 
   var handleFocus = function handleFocus(event) {
@@ -2712,7 +2716,7 @@ var TextAreaField = function TextAreaField(_a) {
   var handleBlur = function handleBlur(event) {
     setActive(false);
     onBlur && onBlur(event);
-    isDynamicHeight && setRow(rows);
+    isDynamicHeight && !isFocus && setRow(rows);
   };
 
   return jsxRuntime.exports.jsxs("div", __assign({
@@ -2738,7 +2742,7 @@ var TextAreaField = function TextAreaField(_a) {
           ref: ref,
           className: "hplxt-flex-1 hplxt-px-2 hplxt-py-2 focus-visible:hplxt-outline-0 hplxt-border-0 focus:hplxt-border-0",
           style: {
-            height: row * 32 + 'px'
+            height: row * 32 + "px"
           }
         }, inputProps, {
           onInput: handleHeight,
@@ -18155,8 +18159,11 @@ var InputTag = function InputTag(_a) {
 
       if (Boolean(tagInputValue) && tagInputValue.trim() && tagInputValue.trim().length > 1 && (allowDuplicates || !tags.includes(tagInputValue.trim())) // check if allowDuplicates flag is true or tagInputValue is not already in tags
       ) {
-        setTags(__spreadArray(__spreadArray([], tags, true), [tagInputValue.trim()], false));
+        var res = __spreadArray(__spreadArray([], tags, true), [tagInputValue.trim()], false);
+
+        setTags(res);
         setValue(tags.filter(Boolean).join(", "));
+        handleValChange && handleValChange(res.filter(Boolean).join(", "));
       } // reset tag input value and focus index
 
 
@@ -18188,6 +18195,7 @@ var InputTag = function InputTag(_a) {
       setEditInputValue("");
       inputRef.current && inputRef.current.focus();
       setdropdownOffset("".concat((_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.offsetLeft, "px"));
+      handleValChange && handleValChange(newArr.filter(Boolean).join(", "));
     } //on backspace
 
 
@@ -18260,10 +18268,13 @@ var InputTag = function InputTag(_a) {
 
     if (e.keyCode === 13) {
       if (focusIndex >= 0) {
-        setTags(__spreadArray(__spreadArray([], tags, true), [dropdownArr[focusIndex].value.trim()], false));
+        var res = __spreadArray(__spreadArray([], tags, true), [dropdownArr[focusIndex].value.trim()], false);
+
+        setTags(res);
         setValue(tags.filter(Boolean).join(", "));
         setTagInputValue("");
         setFocusIndex(-1);
+        handleValChange && handleValChange(res.filter(Boolean).join(", "));
       }
     }
   };
@@ -18273,12 +18284,12 @@ var InputTag = function InputTag(_a) {
       return del_index !== index;
     });
     setTags(remainingTags);
-    setValue(tags.filter(Boolean).join(", "));
+    handleValChange && handleValChange(remainingTags.filter(Boolean).join(", "));
+    setValue(remainingTags.filter(Boolean).join(", "));
   };
 
   useEffect(function () {
     setValue(tags.filter(Boolean).join(", "));
-    handleValChange && handleValChange(tags.filter(Boolean).join(", "));
   }, [tags]);
   useEffect(function () {
     var _a;
@@ -18314,7 +18325,10 @@ var InputTag = function InputTag(_a) {
               newArr[index] = editInputValue.trim();
               setTags(newArr);
               setValue(tags.filter(Boolean).join(", "));
-            } else deleteTag("", editIndex);
+              handleValChange && handleValChange(newArr.filter(Boolean).join(", "));
+            } else {
+              deleteTag("", editIndex);
+            }
 
             setEditIndex(-1);
             setEditInputValue("");

package/dist/esm/textAreaField/TextAreaField.d.ts

@@ -1,4 +1,4 @@
 /// <reference types="react" />
 import { TextAreaFieldProps } from "../types";
-declare const TextAreaField: ({ label, hint_text_icon, hint_text, errorMsg, inputProps, className, rows, isDynamicHeight, }: TextAreaFieldProps) => JSX.Element;
+declare const TextAreaField: ({ label, hint_text_icon, hint_text, errorMsg, inputProps, className, rows, isDynamicHeight, isFocus, }: TextAreaFieldProps) => JSX.Element;
 export default TextAreaField;

package/dist/esm/types.d.ts

@@ -120,6 +120,7 @@ export interface TextAreaFieldProps {
     className?: string;
     rows?: number;
     isDynamicHeight?: boolean;
+    isFocus?: boolean;
 }
 type badgesizeType = "sm" | "md" | "lg";
 type badgeiconType = "Left" | "Right" | "Only";

package/package.json

@@ -9,7 +9,7 @@
     "frontend",
     "healthplix"
   ],
-  "version": "1.0.85",
+  "version": "1.0.87",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/esm/index.d.ts",