Remove onActiveItemChange

src/components/MenuItem/MenuItem.test.tsx

@@ -84,22 +84,6 @@ describe('<MenuItem>', () => {
     expect(onInitialItemChange).toHaveBeenCalledTimes(1);
   });
 
-  it('conditionally calls `onInitialItemChange`', () => {
-    const onActiveItemChange = jest.fn();
-    const context = {
-      activeIndex: 1,
-      onActiveItemChange,
-    };
-
-    const { rerender } = render(
-      <Default context={context} props={{ option, position: 0 }} />
-    );
-    expect(onActiveItemChange).toHaveBeenCalledTimes(0);
-
-    rerender(<Default context={context} props={{ option, position: 1 }} />);
-    expect(onActiveItemChange).toHaveBeenCalledTimes(1);
-  });
-
   it('changes the active state of the menu item', () => {
     render(<Default context={{ activeIndex: 0 }} />);
 

src/core/Context.tsx

@@ -10,7 +10,6 @@ export interface TypeaheadContextType {
   initialItem?: Option;
   inputNode: HTMLInputElement | null;
   isOnlyResult: boolean;
-  onActiveItemChange: OptionHandler;
   onAdd: OptionHandler;
   onInitialItemChange: (option?: Option) => void;
   onMenuItemClick: (option: Option, event: SelectEvent<HTMLElement>) => void;
@@ -24,7 +23,6 @@ export const defaultContext = {
   initialItem: undefined,
   inputNode: null,
   isOnlyResult: false,
-  onActiveItemChange: noop,
   onAdd: noop,
   onInitialItemChange: noop,
   onMenuItemClick: noop,

src/core/TypeaheadManager.tsx

@@ -44,7 +44,6 @@ const TypeaheadManager = (props: TypeaheadManagerProps) => {
     initialItem: props.initialItem,
     inputNode: props.inputNode,
     isOnlyResult: props.isOnlyResult,
-    onActiveItemChange: props.onActiveItemChange,
     onAdd: props.onAdd,
     onInitialItemChange: props.onInitialItemChange,
     onMenuItemClick: props.onMenuItemClick,

src/core/useItem.tsx

@@ -30,7 +30,6 @@ function useItem<T extends HTMLElement>({
     activeIndex,
     id,
     isOnlyResult,
-    onActiveItemChange,
     onInitialItemChange,
     onMenuItemClick,
     setItem,
@@ -46,8 +45,6 @@ function useItem<T extends HTMLElement>({
 
   useEffect(() => {
     if (position === activeIndex) {
-      onActiveItemChange(option);
-
       // Automatically scroll the menu as the user keys through it.
       const node = itemRef.current;
 
@@ -57,7 +54,7 @@ function useItem<T extends HTMLElement>({
           scrollMode: 'if-needed',
         });
     }
-  }, [activeIndex, onActiveItemChange, option, position]);
+  }, [activeIndex, option, position]);
 
   const handleClick = useCallback(
     (e: MouseEvent<T>) => {

src/core/useTypeahead.ts

@@ -254,17 +254,10 @@ function useTypeahead(
   }
 
   function onActiveIndexChange(index: number) {
-    setState((currentState) => ({
+    setState({
       activeIndex: index,
-      activeItem: index >= 0 ? currentState.activeItem : undefined,
-    }));
-  }
-
-  function onActiveItemChange(activeItem: Option) {
-    // Don't update the active item if it hasn't changed.
-    if (!isEqual(activeItem, state.activeItem)) {
-      setState({ activeItem });
-    }
+      activeItem: index >= 0 ? items[index] : undefined,
+    });
   }
 
   function onBlur(e: React.FocusEvent<HTMLInputElement>) {
@@ -451,7 +444,6 @@ function useTypeahead(
     inputRef: setInputNode,
     isMenuShown,
     isOnlyResult,
-    onActiveItemChange,
     onAdd,
     onBlur,
     onChange: onInputChange,

src/types.ts

@@ -139,7 +139,6 @@ export interface TypeaheadManagerProps extends TypeaheadPropsAndState {
   inputRef: RefCallback<HTMLInputElement>;
   isMenuShown: boolean;
   isOnlyResult: boolean;
-  onActiveItemChange: OptionHandler;
   onAdd: OptionHandler;
   onChange: ChangeEventHandler<HTMLInputElement>;
   onClear: () => void;