fis-component 0.0.83 → 0.0.85

package/dist/cjs/index.js

@@ -61561,7 +61561,7 @@ function ExitIcon(props) {
 }
 
 function InfoIcon(props) {
-    return (jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M7.99996 0.666626C3.94987 0.666626 0.666626 3.94987 0.666626 7.99996C0.666626 12.05 3.94987 15.3333 7.99996 15.3333C12.05 15.3333 15.3333 12.05 15.3333 7.99996C15.3333 3.94987 12.05 0.666626 7.99996 0.666626ZM7.99996 4.66663C7.63177 4.66663 7.33329 4.9651 7.33329 5.33329C7.33329 5.70148 7.63177 5.99996 7.99996 5.99996H8.00663C8.37482 5.99996 8.67329 5.70148 8.67329 5.33329C8.67329 4.9651 8.37482 4.66663 8.00663 4.66663H7.99996ZM8.66663 7.99996C8.66663 7.63177 8.36815 7.33329 7.99996 7.33329C7.63177 7.33329 7.33329 7.63177 7.33329 7.99996V10.6666C7.33329 11.0348 7.63177 11.3333 7.99996 11.3333C8.36815 11.3333 8.66663 11.0348 8.66663 10.6666V7.99996Z", fill: "#0055C2" }) }));
+    return (jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [jsxRuntime.jsx("g", { "clip-path": "url(#clip0_11224_1706)", children: jsxRuntime.jsx("path", { d: "M7.99992 10.6666V7.99992M7.99992 5.33325H8.00659M14.6666 7.99992C14.6666 11.6818 11.6818 14.6666 7.99992 14.6666C4.31802 14.6666 1.33325 11.6818 1.33325 7.99992C1.33325 4.31802 4.31802 1.33325 7.99992 1.33325C11.6818 1.33325 14.6666 4.31802 14.6666 7.99992Z", stroke: "#505A5F", "stroke-linecap": "round", "stroke-linejoin": "round" }) }), jsxRuntime.jsx("defs", { children: jsxRuntime.jsx("clipPath", { id: "clip0_11224_1706", children: jsxRuntime.jsx("rect", { width: "16", height: "16", fill: "white" }) }) })] }));
 }
 
 function CheckIcon(props) {
@@ -64947,13 +64947,27 @@ 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("");
+    const [internalValue, setInternalValue] = React.useState(rest.value || rest.defaultValue || "");
+    // 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 = () => {
+        return rest.value !== undefined ? rest.value : internalValue;
+    };
     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);
+        }
         if (onChange) {
             onChange(event);
         }
-    }, [onChange]);
+    }, [onChange, rest.value]);
     const handleKeyPress = React.useCallback((event) => {
         if (!event)
             return;
@@ -64968,8 +64982,8 @@ const FISInputText = React.forwardRef((props, ref) => {
                             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";
 
@@ -71236,10 +71250,12 @@ const DivInputWrapperSC$1 = styled.div `
   width: 100%;
 `;
 const HiddenDatePickerSC = styled(DatePicker) `
+  top: 0;
+  background-color: red;
   position: absolute;
+  height: 100%;
   opacity: 0;
   z-index: -1;
-  height: 0;
 `;
 
 /**
@@ -73929,7 +73945,7 @@ const FISPagination = ({ pageSize = LIMIT_DEFAULT, current = 1, total = 0, minim
             current * pageSize > total ? total : current * pageSize,
         ];
     }, [current, pageSize, total]);
-    const defaultShowTotal = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: ["Hi\u1EC3n th\u1ECB ", rangeRecords[0], "-", rangeRecords[1], recordCounted ? (`trong ${total} bản ghi`) : (jsxRuntime.jsx(FISIconButton, { size: "xs", icon: jsxRuntime.jsx(InfoIcon, {}), variant: "tertiary-invisible", onClick: onIconPageRecordClick }))] }));
+    const defaultShowTotal = (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: ["Hi\u1EC3n th\u1ECB ", rangeRecords[0], "-", rangeRecords[1], recordCounted ? (` trong ${total} bản ghi`) : (jsxRuntime.jsx(FISIconButton, { size: "xs", icon: jsxRuntime.jsx(InfoIcon, {}), variant: "tertiary-invisible", onClick: onIconPageRecordClick }))] }));
     // Merge the default props with the provided props
     const mergedProps = {
         size: "small",