fix(select): pass form prop to hidden-select (#4854)

* fix(select): pass form prop to hidden-select * chore(select): changeset
heroui-inc · Feb 26, 2025 · 989cbe1 · 989cbe1
1 parent fd446da
commit 989cbe1
Show file tree

Hide file tree

Showing 3 changed files with 10 additions and 1 deletion.
diff --git a/.changeset/four-terms-relax.md b/.changeset/four-terms-relax.md
@@ -0,0 +1,5 @@
+---
+"@heroui/select": patch
+---
+
+Pass form prop to hidden-select
diff --git a/packages/components/select/src/hidden-select.tsx b/packages/components/select/src/hidden-select.tsx
@@ -68,6 +68,7 @@ export function useHiddenSelect<T>(
     isDisabled = data.isDisabled,
     selectionMode,
     onChange,
+    form,
   } = props;
   let {validationBehavior, isRequired, isInvalid} = data;
   let {visuallyHiddenProps} = useVisuallyHidden();
@@ -92,6 +93,7 @@ export function useHiddenSelect<T>(
       style: {display: "none"},
     },
     selectProps: {
+      form,
       autoComplete,
       disabled: isDisabled,
       "aria-invalid": isInvalid || undefined,
@@ -117,7 +119,7 @@ export function useHiddenSelect<T>(
  * form autofill, mobile form navigation, and native form submission.
  */
 export function HiddenSelect<T>(props: HiddenSelectProps<T>) {
-  let {state, triggerRef, selectRef, label, name, isDisabled} = props;
+  let {state, triggerRef, selectRef, label, name, isDisabled, form} = props;
 
   let {containerProps, selectProps} = useHiddenSelect({...props, selectRef}, state, triggerRef);
 
@@ -151,6 +153,7 @@ export function HiddenSelect<T>(props: HiddenSelectProps<T>) {
       <input
         autoComplete={selectProps.autoComplete}
         disabled={isDisabled}
+        form={form}
         name={name}
         type="hidden"
         value={[...state.selectedKeys].join(",") ?? ""}

diff --git a/packages/components/select/src/use-select.ts b/packages/components/select/src/use-select.ts
@@ -493,6 +493,7 @@ export function useSelect<T extends object>(originalProps: UseSelectProps<T>) {
         isRequired: originalProps?.isRequired,
         autoComplete: originalProps?.autoComplete,
         isDisabled: originalProps?.isDisabled,
+        form: originalProps?.form,
         onChange,
         ...props,
       } as HiddenSelectProps<T>),