From d2b42e8f6cf1e39878447fb55968eb31a3de170a Mon Sep 17 00:00:00 2001
From: Silviu Alexandru Avram <silviu.avram91@gmail.com>
Date: Sat, 9 Mar 2024 14:45:59 +0200
Subject: [PATCH] types(hooks): improve Typescript for onChange funtions
 (#1580)

* types(hooks): improve for onChange funtions

* migration guide

* fix doctoc
---
 src/hooks/MIGRATION_V9.md | 34 ++++++++++++++++++++
 test/useCombobox.test.tsx | 11 +++----
 typings/index.d.ts        | 68 +++++++++++++++++++++++++++++++++------
 3 files changed, 98 insertions(+), 15 deletions(-)
 create mode 100644 src/hooks/MIGRATION_V9.md

diff --git a/src/hooks/MIGRATION_V9.md b/src/hooks/MIGRATION_V9.md
new file mode 100644
index 00000000..a5572590
--- /dev/null
+++ b/src/hooks/MIGRATION_V9.md
@@ -0,0 +1,34 @@
+# Migration from v8 to v9
+
+Downshift v8 receives a list of breaking changes, which are necessary to improve
+both the user and the developer experience. The changes are only affecting the
+hooks and are detailed below.
+
+## Table of Contents
+
+<!-- START doctoc generated TOC please keep comment here to allow auto update -->
+<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
+
+- [onChange Typescript Improvements](#onchange-typescript-improvements)
+
+<!-- END doctoc generated TOC please keep comment here to allow auto update -->
+
+## onChange Typescript Improvements
+
+The handlers below have their types improved to reflect that they will always
+get called with their corresponding state prop:
+
+- useCombobox
+  - onSelectedItemChange: selectedItem is non optional
+  - onIsOpenChange: isOpen is non optional
+  - onHighlightedIndexChange: highlightedIndex is non optional
+
+- useSelect
+  - onSelectedItemChange: selectedItem is non optional
+  - onIsOpenChange: isOpen is non optional
+  - onHighlightedIndexChange: highlightedIndex is non optional
+  - onInputValueChange: inputValue is non optional
+
+- useMultipleSelection
+  - onActiveIndexChange: activeIndex is non optional
+  - onSelectedItemsChange: selectedItems is non optional
\ No newline at end of file
diff --git a/test/useCombobox.test.tsx b/test/useCombobox.test.tsx
index b0752653..08cd8528 100644
--- a/test/useCombobox.test.tsx
+++ b/test/useCombobox.test.tsx
@@ -32,12 +32,11 @@ export default function DropdownCombobox() {
   } = useCombobox({
     items: inputItems,
     onInputValueChange: ({inputValue}) => {
-      inputValue !== undefined &&
-        setInputItems(
-          colors.filter(item =>
-            item.toLowerCase().startsWith(inputValue.toLowerCase()),
-          ),
-        )
+      setInputItems(
+        colors.filter(item =>
+          item.toLowerCase().startsWith(inputValue.toLowerCase()),
+        ),
+      )
     },
   })
   return (
diff --git a/typings/index.d.ts b/typings/index.d.ts
index 4fe90542..e7050f74 100644
--- a/typings/index.d.ts
+++ b/typings/index.d.ts
@@ -363,9 +363,11 @@ export interface UseSelectProps<Item> {
     state: UseSelectState<Item>,
     actionAndChanges: UseSelectStateChangeOptions<Item>,
   ) => Partial<UseSelectState<Item>>
-  onSelectedItemChange?: (changes: UseSelectStateChange<Item>) => void
-  onIsOpenChange?: (changes: UseSelectStateChange<Item>) => void
-  onHighlightedIndexChange?: (changes: UseSelectStateChange<Item>) => void
+  onSelectedItemChange?: (changes: UseSelectSelectedItemChange<Item>) => void
+  onIsOpenChange?: (changes: UseSelectIsOpenChange<Item>) => void
+  onHighlightedIndexChange?: (
+    changes: UseSelectHighlightedIndexChange<Item>,
+  ) => void
   onStateChange?: (changes: UseSelectStateChange<Item>) => void
   environment?: Environment
 }
@@ -390,6 +392,21 @@ export interface UseSelectStateChange<Item>
   type: UseSelectStateChangeTypes
 }
 
+export interface UseSelectSelectedItemChange<Item>
+  extends UseSelectStateChange<Item> {
+  selectedItem: Item
+}
+
+export interface UseSelectHighlightedIndexChange<Item>
+  extends UseSelectStateChange<Item> {
+  highlightedIndex: index
+}
+
+export interface UseSelectIsOpenChange<Item>
+  extends UseSelectStateChange<Item> {
+  isOpen: boolean
+}
+
 export interface UseSelectGetMenuPropsOptions
   extends GetPropsWithRefKey,
     GetMenuPropsOptions {}
@@ -565,11 +582,13 @@ export interface UseComboboxProps<Item> {
     state: UseComboboxState<Item>,
     actionAndChanges: UseComboboxStateChangeOptions<Item>,
   ) => Partial<UseComboboxState<Item>>
-  onSelectedItemChange?: (changes: UseComboboxStateChange<Item>) => void
-  onIsOpenChange?: (changes: UseComboboxStateChange<Item>) => void
-  onHighlightedIndexChange?: (changes: UseComboboxStateChange<Item>) => void
+  onSelectedItemChange?: (changes: UseComboboxSelectedItemChange<Item>) => void
+  onIsOpenChange?: (changes: UseComboboxIsOpenChange<Item>) => void
+  onHighlightedIndexChange?: (
+    changes: UseComboboxHighlightedIndexChange<Item>,
+  ) => void
   onStateChange?: (changes: UseComboboxStateChange<Item>) => void
-  onInputValueChange?: (changes: UseComboboxStateChange<Item>) => void
+  onInputValueChange?: (changes: UseComboboxInputValueChange<Item>) => void
   environment?: Environment
 }
 
@@ -593,6 +612,25 @@ export interface UseComboboxStateChange<Item>
   type: UseComboboxStateChangeTypes
 }
 
+export interface UseComboboxSelectedItemChange<Item>
+  extends UseComboboxStateChange<Item> {
+  selectedItem: Item
+}
+export interface UseComboboxHighlightedIndexChange<Item>
+  extends UseComboboxStateChange<Item> {
+  highlightedIndex: index
+}
+
+export interface UseComboboxIsOpenChange<Item>
+  extends UseComboboxStateChange<Item> {
+  isOpen: boolean
+}
+
+export interface UseComboboxInputValueChange<Item>
+  extends UseComboboxStateChange<Item> {
+  inputValue: string
+}
+
 export interface UseComboboxGetMenuPropsOptions
   extends GetPropsWithRefKey,
     GetMenuPropsOptions {}
@@ -746,9 +784,11 @@ export interface UseMultipleSelectionProps<Item> {
   activeIndex?: number
   initialActiveIndex?: number
   defaultActiveIndex?: number
-  onActiveIndexChange?: (changes: UseMultipleSelectionStateChange<Item>) => void
+  onActiveIndexChange?: (
+    changes: UseMultipleSelectionActiveIndexChange<Item>,
+  ) => void
   onSelectedItemsChange?: (
-    changes: UseMultipleSelectionStateChange<Item>,
+    changes: UseMultipleSelectionSelectedItemsChange<Item>,
   ) => void
   onStateChange?: (changes: UseMultipleSelectionStateChange<Item>) => void
   keyNavigationNext?: string
@@ -774,6 +814,16 @@ export interface UseMultipleSelectionStateChange<Item>
   type: UseMultipleSelectionStateChangeTypes
 }
 
+export interface UseMultipleSelectionActiveIndexChange<Item>
+  extends UseMultipleSelectionStateChange<Item> {
+  activeIndex: number
+}
+
+export interface UseMultipleSelectionSelectedItemsChange<Item>
+  extends UseMultipleSelectionStateChange<Item> {
+  selectedItems: Item[]
+}
+
 export interface A11yRemovalMessage<Item> {
   itemToString: (item: Item) => string
   resultCount: number