feat: accept readonly array for multiple combobox value (adobe#9741)

* feat: accept readonly array for multiple combobox value

Port the readonly array changes from adobe#9221 (Select) to ComboBox.
This allows passing `readonly Key[]` as the `value` prop for
multiple selection mode without TypeScript errors.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

* fix: sort imports alphabetically to fix lint CI failure

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>

Author: lixiaoyan

packages/@react-stately/combobox/src/useComboBoxState.ts

@@ -10,8 +10,8 @@
  * governing permissions and limitations under the License.
  */
 
+import {ChangeValueType, ComboBoxProps, MenuTriggerAction, SelectionMode, ValueType} from '@react-types/combobox';
 import {Collection, CollectionStateBase, FocusStrategy, Key, Node, Selection} from '@react-types/shared';
-import {ComboBoxProps, MenuTriggerAction, SelectionMode, ValueType} from '@react-types/combobox';
 import {FormValidationState, useFormValidationState} from '@react-stately/form';
 import {getChildNodes} from '@react-stately/collections';
 import {ListCollection, ListState, useListState} from '@react-stately/list';
@@ -373,7 +373,7 @@ export function useComboBoxState<T extends object, M extends SelectionMode = 'si
     // If multiple things are controlled, call onSelectionChange
     if (value !== undefined && props.inputValue !== undefined) {
       props.onSelectionChange?.(selectedKey);
-      props.onChange?.(displayValue);
+      props.onChange?.(displayValue as ChangeValueType<M>);
 
       // Stop menu from reopening from useEffect
       let itemText = selectedKey != null ? collection.getItem(selectedKey)?.textValue ?? '' : '';
@@ -504,7 +504,7 @@ function getDefaultInputValue(defaultInputValue: string | null | undefined, sele
   return defaultInputValue;
 }
 
-function convertValue(value: Key | Key[] | null | undefined) {
+function convertValue(value: Key | readonly Key[] | null | undefined) {
   if (value === undefined) {
     return undefined;
   }

packages/@react-types/combobox/src/index.d.ts

@@ -35,7 +35,8 @@ import {
 
 export type MenuTriggerAction = 'focus' | 'input' | 'manual';
 export type SelectionMode = 'single' | 'multiple';
-export type ValueType<M extends SelectionMode> = M extends 'single' ? Key | null : Key[];
+export type ValueType<M extends SelectionMode> = M extends 'single' ? Key | null : readonly Key[];
+export type ChangeValueType<M extends SelectionMode> = M extends 'single' ? Key | null : Key[];
 type ValidationType<M extends SelectionMode> = M extends 'single' ? Key : Key[];
 
 export interface ComboBoxValidationValue<M extends SelectionMode = 'single'> {
@@ -50,7 +51,7 @@ export interface ComboBoxValidationValue<M extends SelectionMode = 'single'> {
   inputValue: string
 }
 
-export interface ComboBoxProps<T, M extends SelectionMode = 'single'> extends CollectionBase<T>, InputBase, ValueBase<ValueType<M>>, TextInputBase, Validation<ComboBoxValidationValue>, FocusableProps<HTMLInputElement>, LabelableProps, HelpTextProps {
+export interface ComboBoxProps<T, M extends SelectionMode = 'single'> extends CollectionBase<T>, InputBase, ValueBase<ValueType<M>, ChangeValueType<M>>, TextInputBase, Validation<ComboBoxValidationValue>, FocusableProps<HTMLInputElement>, LabelableProps, HelpTextProps {
   /** The list of ComboBox items (uncontrolled). */
   defaultItems?: Iterable<T>,
   /** The list of ComboBox items (controlled). */