fis-component 0.0.87 → 0.0.88

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
@@ -64954,38 +64954,23 @@ const FISInputText = forwardRef((props, ref) => {
64954
64954
  const { className, typeSuffix, textLabel = "", iconLabel, required, iconPrefix, sizeInput, showCount, message, negative, positive, maxLength = 500, disabled, onChange, onEnter, onKeyDown, onClickIconLabel, onClickSuffix, ...rest } = props;
64955
64955
  // Internal ref to access DOM element for character count
64956
64956
  const internalRef = React__default.useRef(null);
64957
- const [internalValue, setInternalValue] = React__default.useState(rest.value || rest.defaultValue || "");
64957
+ const [internalValue, setInternalValue] = React__default.useState("");
64958
64958
  // State to trigger re-render for character count (React Hook Form compatibility)
64959
64959
  const [, forceUpdate] = React__default.useReducer((x) => x + 1, 0);
64960
- // Sync internal value with controlled value prop
64961
- React__default.useEffect(() => {
64962
- if (rest.value !== undefined) {
64963
- setInternalValue(rest.value);
64964
- }
64965
- }, [rest.value]);
64966
- // Get current value for display (controlled vs uncontrolled)
64960
+ // Get current value for display (prioritize DOM for React Hook Form)
64967
64961
  const getCurrentValue = () => {
64968
- // Always prioritize DOM value for React Hook Form compatibility
64969
- const domValue = internalRef.current?.value;
64970
- if (domValue !== undefined) {
64971
- return domValue;
64972
- }
64973
- // Fallback to controlled value prop
64974
- if (rest.value !== undefined) {
64975
- return rest.value;
64976
- }
64977
- // Fallback to internal state for uncontrolled mode
64978
- return internalValue ?? "";
64962
+ return (internalRef.current?.value ??
64963
+ rest.value ??
64964
+ internalValue ??
64965
+ "");
64979
64966
  };
64980
64967
  const handleChange = React__default.useCallback((event) => {
64981
- const newValue = event.target.value;
64982
64968
  // Update internal state for uncontrolled mode
64983
64969
  if (rest.value === undefined) {
64984
- setInternalValue(newValue);
64970
+ setInternalValue(event.target.value);
64985
64971
  }
64986
64972
  else {
64987
64973
  // Force re-render only for controlled mode (React Hook Form case)
64988
- // This ensures character count updates when value prop doesn't change
64989
64974
  forceUpdate();
64990
64975
  }
64991
64976
  if (onChange) {
@@ -66038,13 +66023,26 @@ styled.div `
66038
66023
  const FISInputArea = forwardRef((props, ref) => {
66039
66024
  const { className, required = false, textLabel = "", iconLabel, iconSuffix, disabled = false, readOnly = false, negative, message, positive, maxLength = 50, showCount, size = "md", fixedWidth, onClickIconLabel, onClickIconSuffix, onChange, onEnter, ...rest } = props;
66040
66025
  const [internalValue, setInternalValue] = React__default.useState("");
66026
+ // State to trigger re-render for character count (React Hook Form compatibility)
66027
+ const [, forceUpdate] = React__default.useReducer((x) => x + 1, 0);
66041
66028
  const inputRef = React__default.useRef(null);
66029
+ // Get current value for display (prioritize DOM for React Hook Form)
66030
+ const getCurrentValue = () => {
66031
+ return (inputRef.current?.value ?? rest.value ?? internalValue ?? "");
66032
+ };
66042
66033
  const handleChange = React__default.useCallback((event) => {
66043
- setInternalValue(event.target.value);
66034
+ // Update internal state for uncontrolled mode
66035
+ if (rest.value === undefined) {
66036
+ setInternalValue(event.target.value);
66037
+ }
66038
+ else {
66039
+ // Force re-render only for controlled mode (React Hook Form case)
66040
+ forceUpdate();
66041
+ }
66044
66042
  if (onChange) {
66045
66043
  onChange(event);
66046
66044
  }
66047
- }, [onChange]);
66045
+ }, [onChange, rest.value]);
66048
66046
  const handleKeyPress = React__default.useCallback((event) => {
66049
66047
  if (!event)
66050
66048
  return;
@@ -66054,28 +66052,6 @@ const FISInputArea = forwardRef((props, ref) => {
66054
66052
  }
66055
66053
  }
66056
66054
  }, [onEnter]);
66057
- useImperativeHandle(ref, () => {
66058
- const inputElement = inputRef.current;
66059
- return {
66060
- ...inputElement,
66061
- focus: () => {
66062
- if (inputRef.current) {
66063
- inputRef.current.focus();
66064
- }
66065
- },
66066
- blur: () => {
66067
- if (inputRef.current) {
66068
- inputRef.current.blur();
66069
- }
66070
- },
66071
- clear: () => {
66072
- if (inputRef.current) {
66073
- inputRef.current.value = "";
66074
- setInternalValue("");
66075
- }
66076
- },
66077
- };
66078
- });
66079
66055
  const handleResize = (e) => {
66080
66056
  e.preventDefault();
66081
66057
  e.stopPropagation();
@@ -66116,7 +66092,7 @@ const FISInputArea = forwardRef((props, ref) => {
66116
66092
  "input-area-lg": size === "lg",
66117
66093
  "input-area-icon": iconSuffix,
66118
66094
  negative,
66119
- }), style: { width: fixedWidth ? `${fixedWidth}px` : "auto" }, children: [jsx(TextAreaSC, { ...rest, onChange: handleChange, onKeyDown: handleKeyPress, ref: inputRef, disabled: disabled, className: classNames({
66095
+ }), style: { width: fixedWidth ? `${fixedWidth}px` : "auto" }, children: [jsx(TextAreaSC, { ...rest, onChange: handleChange, onKeyDown: handleKeyPress, ref: mergeRefs(ref, inputRef), disabled: disabled, className: classNames({
66120
66096
  negative,
66121
66097
  "input-area-lg": size === "lg",
66122
66098
  "input-area-icon": iconSuffix,
@@ -66127,8 +66103,8 @@ const FISInputArea = forwardRef((props, ref) => {
66127
66103
  negative,
66128
66104
  positive,
66129
66105
  }), children: message ? message : "" }), jsx(DivCountSC, { children: showCount && maxLength > 0 && (jsxs("span", { className: classNames("text-area__count", {
66130
- negative: internalValue.length > maxLength,
66131
- }), children: [internalValue?.replaceAll("\n", "")?.length, "/", maxLength] })) })] })] }));
66106
+ negative: getCurrentValue()?.length > maxLength,
66107
+ }), children: [getCurrentValue()?.length, "/", maxLength] })) })] })] }));
66132
66108
  });
66133
66109
  FISInputArea.displayName = "FISInputArea";
66134
66110