fis-component 0.0.84 → 0.0.86

package/dist/cjs/index.js

@@ -64947,13 +64947,42 @@ FISInputLabel.displayName = "FISInputLabel";
 
 const FISInputText = React.forwardRef((props, ref) => {
     const { className, typeSuffix, textLabel = "", iconLabel, required, iconPrefix, sizeInput, showCount, message, negative, positive, maxLength = 500, disabled, onChange, onEnter, onKeyDown, onClickIconLabel, onClickSuffix, ...rest } = props;
-    const [internalValue, setInternalValue] = React.useState("");
+    // Internal ref to access DOM element when external ref is not provided
+    const internalRef = React.useRef(null);
+    const inputRef = ref || internalRef;
+    const [internalValue, setInternalValue] = React.useState(rest.value || rest.defaultValue || "");
+    // State to trigger re-render for character count (React Hook Form compatibility)
+    const [, forceUpdate] = React.useReducer((x) => x + 1, 0);
+    // Sync internal value with controlled value prop
+    React.useEffect(() => {
+        if (rest.value !== undefined) {
+            setInternalValue(rest.value);
+        }
+    }, [rest.value]);
+    // Get current value for display (controlled vs uncontrolled)
+    const getCurrentValue = () => {
+        // Controlled mode: use value prop
+        if (rest.value !== undefined) {
+            return rest.value;
+        }
+        // Uncontrolled mode: use internal state, fallback to DOM value for React Hook Form
+        return internalValue ?? inputRef.current?.value ?? "";
+    };
     const handleChange = React.useCallback((event) => {
-        setInternalValue(event.target.value);
+        const newValue = event.target.value;
+        // Only update internal state if not controlled
+        if (rest.value === undefined) {
+            setInternalValue(newValue);
+        }
+        else {
+            // Force re-render for character count when using React Hook Form
+            // This ensures character count updates even when value prop doesn't change
+            forceUpdate();
+        }
         if (onChange) {
             onChange(event);
         }
-    }, [onChange]);
+    }, [onChange, rest.value, forceUpdate]);
     const handleKeyPress = React.useCallback((event) => {
         if (!event)
             return;
@@ -64963,13 +64992,13 @@ const FISInputText = React.forwardRef((props, ref) => {
             }
         }
     }, [onEnter]);
-    return (jsxRuntime.jsxs(DivContainerSC$6, { className: className, children: [(textLabel || iconLabel) && (jsxRuntime.jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsxRuntime.jsx(FISInputField, { ...rest, ref: ref, typeSuffix: typeSuffix, sizeInput: sizeInput, iconPrefix: iconPrefix, onKeyPress: handleKeyPress, onChange: handleChange, disabled: disabled, negative: negative, maxLength: maxLength, onClickSuffix: onClickSuffix }), (message || showCount) && (jsxRuntime.jsxs(DivHintWrapperSC$1, { children: [jsxRuntime.jsx(SpanHintSC$3, { className: classNames({
+    return (jsxRuntime.jsxs(DivContainerSC$6, { className: className, children: [(textLabel || iconLabel) && (jsxRuntime.jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsxRuntime.jsx(FISInputField, { ...rest, ref: inputRef, typeSuffix: typeSuffix, sizeInput: sizeInput, iconPrefix: iconPrefix, onKeyPress: handleKeyPress, onChange: handleChange, disabled: disabled, negative: negative, maxLength: maxLength, onClickSuffix: onClickSuffix }), (message || showCount) && (jsxRuntime.jsxs(DivHintWrapperSC$1, { children: [jsxRuntime.jsx(SpanHintSC$3, { className: classNames({
                             disabled: disabled,
                             negative: negative,
                             positive: positive,
                         }), children: message ? message : "" }), showCount && maxLength > 0 && (jsxRuntime.jsxs(SpanCountSC, { className: classNames({
-                            negative: internalValue?.length > maxLength,
-                        }), children: [internalValue?.length, "/", maxLength] }))] }))] }));
+                            negative: getCurrentValue()?.length > maxLength,
+                        }), children: [getCurrentValue()?.length, "/", maxLength] }))] }))] }));
 });
 FISInputText.displayName = "FISInputText";