fis-component 0.0.84 → 0.0.86
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +35 -6
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/index.js +35 -6
- package/dist/esm/index.js.map +1 -1
- package/package.json +1 -1
package/dist/esm/index.js
CHANGED
|
@@ -64927,13 +64927,42 @@ FISInputLabel.displayName = "FISInputLabel";
|
|
|
64927
64927
|
|
|
64928
64928
|
const FISInputText = forwardRef((props, ref) => {
|
|
64929
64929
|
const { className, typeSuffix, textLabel = "", iconLabel, required, iconPrefix, sizeInput, showCount, message, negative, positive, maxLength = 500, disabled, onChange, onEnter, onKeyDown, onClickIconLabel, onClickSuffix, ...rest } = props;
|
|
64930
|
-
|
|
64930
|
+
// Internal ref to access DOM element when external ref is not provided
|
|
64931
|
+
const internalRef = React__default.useRef(null);
|
|
64932
|
+
const inputRef = ref || internalRef;
|
|
64933
|
+
const [internalValue, setInternalValue] = React__default.useState(rest.value || rest.defaultValue || "");
|
|
64934
|
+
// State to trigger re-render for character count (React Hook Form compatibility)
|
|
64935
|
+
const [, forceUpdate] = React__default.useReducer((x) => x + 1, 0);
|
|
64936
|
+
// Sync internal value with controlled value prop
|
|
64937
|
+
React__default.useEffect(() => {
|
|
64938
|
+
if (rest.value !== undefined) {
|
|
64939
|
+
setInternalValue(rest.value);
|
|
64940
|
+
}
|
|
64941
|
+
}, [rest.value]);
|
|
64942
|
+
// Get current value for display (controlled vs uncontrolled)
|
|
64943
|
+
const getCurrentValue = () => {
|
|
64944
|
+
// Controlled mode: use value prop
|
|
64945
|
+
if (rest.value !== undefined) {
|
|
64946
|
+
return rest.value;
|
|
64947
|
+
}
|
|
64948
|
+
// Uncontrolled mode: use internal state, fallback to DOM value for React Hook Form
|
|
64949
|
+
return internalValue ?? inputRef.current?.value ?? "";
|
|
64950
|
+
};
|
|
64931
64951
|
const handleChange = React__default.useCallback((event) => {
|
|
64932
|
-
|
|
64952
|
+
const newValue = event.target.value;
|
|
64953
|
+
// Only update internal state if not controlled
|
|
64954
|
+
if (rest.value === undefined) {
|
|
64955
|
+
setInternalValue(newValue);
|
|
64956
|
+
}
|
|
64957
|
+
else {
|
|
64958
|
+
// Force re-render for character count when using React Hook Form
|
|
64959
|
+
// This ensures character count updates even when value prop doesn't change
|
|
64960
|
+
forceUpdate();
|
|
64961
|
+
}
|
|
64933
64962
|
if (onChange) {
|
|
64934
64963
|
onChange(event);
|
|
64935
64964
|
}
|
|
64936
|
-
}, [onChange]);
|
|
64965
|
+
}, [onChange, rest.value, forceUpdate]);
|
|
64937
64966
|
const handleKeyPress = React__default.useCallback((event) => {
|
|
64938
64967
|
if (!event)
|
|
64939
64968
|
return;
|
|
@@ -64943,13 +64972,13 @@ const FISInputText = forwardRef((props, ref) => {
|
|
|
64943
64972
|
}
|
|
64944
64973
|
}
|
|
64945
64974
|
}, [onEnter]);
|
|
64946
|
-
return (jsxs(DivContainerSC$6, { className: className, children: [(textLabel || iconLabel) && (jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), jsx(FISInputField, { ...rest, ref:
|
|
64975
|
+
return (jsxs(DivContainerSC$6, { className: className, children: [(textLabel || iconLabel) && (jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), 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) && (jsxs(DivHintWrapperSC$1, { children: [jsx(SpanHintSC$3, { className: classNames({
|
|
64947
64976
|
disabled: disabled,
|
|
64948
64977
|
negative: negative,
|
|
64949
64978
|
positive: positive,
|
|
64950
64979
|
}), children: message ? message : "" }), showCount && maxLength > 0 && (jsxs(SpanCountSC, { className: classNames({
|
|
64951
|
-
negative:
|
|
64952
|
-
}), children: [
|
|
64980
|
+
negative: getCurrentValue()?.length > maxLength,
|
|
64981
|
+
}), children: [getCurrentValue()?.length, "/", maxLength] }))] }))] }));
|
|
64953
64982
|
});
|
|
64954
64983
|
FISInputText.displayName = "FISInputText";
|
|
64955
64984
|
|