fis-component 0.0.85 → 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/esm/index.js CHANGED
@@ -64927,7 +64927,12 @@ 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
+ // Internal ref to access DOM element when external ref is not provided
64931
+ const internalRef = React__default.useRef(null);
64932
+ const inputRef = ref || internalRef;
64930
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);
64931
64936
  // Sync internal value with controlled value prop
64932
64937
  React__default.useEffect(() => {
64933
64938
  if (rest.value !== undefined) {
@@ -64936,7 +64941,12 @@ const FISInputText = forwardRef((props, ref) => {
64936
64941
  }, [rest.value]);
64937
64942
  // Get current value for display (controlled vs uncontrolled)
64938
64943
  const getCurrentValue = () => {
64939
- return rest.value !== undefined ? rest.value : internalValue;
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 ?? "";
64940
64950
  };
64941
64951
  const handleChange = React__default.useCallback((event) => {
64942
64952
  const newValue = event.target.value;
@@ -64944,10 +64954,15 @@ const FISInputText = forwardRef((props, ref) => {
64944
64954
  if (rest.value === undefined) {
64945
64955
  setInternalValue(newValue);
64946
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
+ }
64947
64962
  if (onChange) {
64948
64963
  onChange(event);
64949
64964
  }
64950
- }, [onChange, rest.value]);
64965
+ }, [onChange, rest.value, forceUpdate]);
64951
64966
  const handleKeyPress = React__default.useCallback((event) => {
64952
64967
  if (!event)
64953
64968
  return;
@@ -64957,7 +64972,7 @@ const FISInputText = forwardRef((props, ref) => {
64957
64972
  }
64958
64973
  }
64959
64974
  }, [onEnter]);
64960
- return (jsxs(DivContainerSC$6, { className: className, children: [(textLabel || iconLabel) && (jsx(FISInputLabel, { textLabel: textLabel, required: required, iconLabel: iconLabel, onClickIconLabel: onClickIconLabel })), 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) && (jsxs(DivHintWrapperSC$1, { children: [jsx(SpanHintSC$3, { className: classNames({
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({
64961
64976
  disabled: disabled,
64962
64977
  negative: negative,
64963
64978
  positive: positive,