From f67f483489a1bf2a7a5c6b8182db6382dac80c1c Mon Sep 17 00:00:00 2001
From: Roxanne Young <Roxanne.Young@availity.com>
Date: Fri, 21 Nov 2025 07:53:26 -0500
Subject: [PATCH] fix(mui-controlled-form): update empty value for multi-select
 controlled autocomplete

---
 packages/controlled-form/src/lib/AsyncAutocomplete.tsx | 5 +++--
 packages/controlled-form/src/lib/Autocomplete.tsx      | 5 +++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/packages/controlled-form/src/lib/AsyncAutocomplete.tsx b/packages/controlled-form/src/lib/AsyncAutocomplete.tsx
index 7f5df613ff..150e95a093 100644
--- a/packages/controlled-form/src/lib/AsyncAutocomplete.tsx
+++ b/packages/controlled-form/src/lib/AsyncAutocomplete.tsx
@@ -42,6 +42,7 @@ export const ControlledAsyncAutocomplete = <
   ...rest
 }: ControlledAsyncAutocompleteProps<Option, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>) => {
   const { setValue } = useFormContext();
+  const emptyValue = rest?.multiple ? [] : null;
   return (
     <Controller
       name={name}
@@ -68,12 +69,12 @@ export const ControlledAsyncAutocomplete = <
           }}
           onChange={(event, value, reason) => {
             if (reason === 'clear') {
-              onChange(transform?.output?.(null) ?? null);
+              onChange(transform?.output?.(null) ?? emptyValue);
             }
             onChange(transform?.output?.(value) ?? value);
           }}
           onBlur={onBlur}
-          value={transform?.input?.(value) ?? value ?? null}
+          value={transform?.input?.(value) ?? value ?? emptyValue}
           loadOptions={async (offset, limit, inputValue) => {
             const { options, hasMore, offset: returnedOffsetValue } = await rest.loadOptions(offset, limit, inputValue);
 
diff --git a/packages/controlled-form/src/lib/Autocomplete.tsx b/packages/controlled-form/src/lib/Autocomplete.tsx
index 353da5408e..f7a986e5f8 100644
--- a/packages/controlled-form/src/lib/Autocomplete.tsx
+++ b/packages/controlled-form/src/lib/Autocomplete.tsx
@@ -37,6 +37,7 @@ export const ControlledAutocomplete = <
   transform,
   ...rest
 }: ControlledAutocompleteProps<T, Multiple, DisableClearable, FreeSolo, ChipComponent, Output>) => {
+  const emptyValue = rest?.multiple ? [] : null;
   return (
     <Controller
       name={name}
@@ -69,12 +70,12 @@ export const ControlledAutocomplete = <
           }}
           onChange={(event, value, reason) => {
             if (reason === 'clear') {
-              onChange(transform?.output?.(null) ?? null);
+              onChange(transform?.output?.(null) ?? emptyValue);
             }
             onChange(transform?.output?.(value) ?? value);
           }}
           onBlur={onBlur}
-          value={transform?.input?.(value) ?? value ?? null}
+          value={transform?.input?.(value) ?? value ?? emptyValue}
         />
       )}
     />