pesona-ui 1.0.31 → 1.0.33

package/dist/index.esm.js

@@ -8193,35 +8193,50 @@ const Select = forwardRef((props, ref) => {
     const dropdownRef = useRef(null);
     const dropdownOptionsRef = useRef(null);
     const selectRef = useRef(null);
+    const displayText = options.find((opt) => opt.value === value)?.label ?? selectLabel;
     useImperativeHandle(ref, () => selectRef.current);
     useEffect(() => setIsOpen(false), []);
     useOutsideClick([dropdownRef], () => {
         setIsOpen(false);
-        selectRef.current?.blur(); // Trigger onBlur RHF
+        selectRef.current?.blur();
     });
     useDropdownPositionAndScroll(isOpen, dropdownOptionsRef);
-    const displayText = value
-        ? options.find((opt) => opt.value === value)?.label
-        : selectLabel;
     const handleOptionClick = (optionValue) => {
+        const selectedOption = options.find((opt) => opt.value === optionValue);
+        if (!selectedOption)
+            return;
+        // Pastikan nilai tetap sesuai tipe aslinya
+        const actualValue = selectedOption.value;
+        // Create synthetic event dengan tipe data yang benar
         const syntheticEvent = {
             target: {
                 name,
-                value: optionValue,
+                value: actualValue, // Tetap gunakan tipe asli (number/string)
+                type: 'select-one'
             },
+            currentTarget: {
+                name,
+                value: actualValue
+            }
         };
+        // Trigger onChange dengan nilai yang benar
         onChange?.(syntheticEvent);
-        // Change the select value to trigger onChange in RHF
+        // Update hidden select element - gunakan string untuk DOM tapi RHF tetap dapat nilai asli
         if (selectRef.current) {
-            selectRef.current.value = String(optionValue);
-            selectRef.current.dispatchEvent(new Event('change', { bubbles: true }));
+            selectRef.current.value = String(actualValue);
+            // Buat custom event yang membawa nilai asli
+            const customEvent = new CustomEvent('change', {
+                bubbles: true,
+                detail: { originalValue: actualValue }
+            });
+            selectRef.current.dispatchEvent(customEvent);
         }
         setIsOpen(false);
     };
     return (React.createElement(React.Fragment, null,
-        React.createElement("select", { ref: selectRef, name: name, value: value, onChange: onChange, onBlur: onBlur, required: required, disabled: disabled, style: { position: 'absolute', left: '-9999px' }, tabIndex: -1, "aria-hidden": "true" },
+        React.createElement("select", { ref: selectRef, name: name, value: value !== undefined && value !== null && !Number.isNaN(value) ? value : '', onChange: onChange, onBlur: onBlur, required: required, disabled: disabled, style: { position: 'absolute', left: '-9999px' }, tabIndex: -1 },
             React.createElement("option", { value: "" }, "Select an option"),
-            options.map((opt) => (React.createElement("option", { key: opt.value, value: opt.value }, opt.label)))),
+            options.map((opt) => (React.createElement("option", { key: opt.value, value: String(opt.value) }, opt.label)))),
         label && !floatingLabel && (React.createElement("label", { htmlFor: name },
             label,
             " ",
@@ -8660,7 +8675,7 @@ const SelectWithSearch = forwardRef((props, ref) => {
         setIsOpen(false);
     };
     return (React.createElement(React.Fragment, null,
-        React.createElement("select", { ref: selectRef, name: name, value: value, onChange: onChange, style: { position: 'absolute', left: '-9999px' }, tabIndex: -1, "aria-hidden": "true" },
+        React.createElement("select", { ref: selectRef, name: name, value: value, onChange: onChange, style: { position: 'absolute', left: '-9999px' }, tabIndex: -1 },
             React.createElement("option", { value: "" }, "Select an option"),
             options.map((opt) => (React.createElement("option", { key: opt.value, value: opt.value }, opt.label)))),
         label && !floatingLabel && (React.createElement("label", { htmlFor: name },