fix types and usages

Author: silviuaavram

src/hooks/__tests__/utils.test.js

@@ -1,6 +1,6 @@
 import {renderHook} from '@testing-library/react'
 import {useMouseAndTouchTracker, isDropdownsStateEqual} from '../utils'
-import {getInitialValue, getDefaultValue, getItemAndIndex} from '../utils-ts'
+import {getItemAndIndex} from '../utils-ts'
 import {dropdownDefaultProps} from '../utils.dropdown'
 
 describe('utils', () => {
@@ -43,39 +43,6 @@ describe('utils', () => {
     })
   })
 
-  test('getInitialValue will not return undefined as initial value', () => {
-    const defaults = {bogusValue: 'hello'}
-    const value = getInitialValue(
-      {initialBogusValue: undefined},
-      'bogusValue',
-      defaults,
-    )
-
-    expect(value).toEqual(defaults.bogusValue)
-  })
-
-  test('getInitialValue will not return undefined as value', () => {
-    const defaults = {bogusValue: 'hello'}
-    const value = getInitialValue(
-      {bogusValue: undefined},
-      'bogusValue',
-      defaults,
-    )
-
-    expect(value).toEqual(defaults.bogusValue)
-  })
-
-  test('getDefaultValue will not return undefined as value', () => {
-    const defaults = {bogusValue: 'hello'}
-    const value = getDefaultValue(
-      {defaultBogusValue: undefined},
-      'bogusValue',
-      defaults,
-    )
-
-    expect(value).toEqual(defaults.bogusValue)
-  })
-
   describe('useMouseAndTouchTracker', () => {
     test('renders without error', () => {
       expect(() => {

src/hooks/reducer.js

@@ -67,16 +67,17 @@ export default function downshiftCommonReducer(
     case stateChangeTypes.FunctionReset:
       changes = {
         highlightedIndex: getDefaultHighlightedIndex(props),
-        isOpen: getDefaultValue(props, 'isOpen', dropdownDefaultStateValues),
+        isOpen: getDefaultValue(
+          props.defaultIsOpen,
+          dropdownDefaultStateValues.isOpen,
+        ),
         selectedItem: getDefaultValue(
-          props,
-          'selectedItem',
-          dropdownDefaultStateValues,
+          props.defaultSelectedItem,
+          dropdownDefaultStateValues.selectedItem,
         ),
         inputValue: getDefaultValue(
-          props,
-          'inputValue',
-          dropdownDefaultStateValues,
+          props.defaultInputValue,
+          dropdownDefaultStateValues.inputValue,
         ),
       }
 

src/hooks/testUtils.js

@@ -114,27 +114,27 @@ export async function tab(shiftKey = false) {
 
 // format is: [initialIsOpen, defaultIsOpen, props.isOpen]
 export const initialFocusAndOpenTestCases = [
-  [undefined, undefined, true, true],
-  [true, true, true, true],
-  [true, false, true, true],
-  [false, true, true, true],
-  [false, false, true, true],
-  [true, undefined, undefined, true],
-  [true, false, undefined, true],
-  [true, true, undefined, true],
-  [undefined, true, undefined, true],
+  [undefined, undefined, true],
+  [true, true, true],
+  [true, false, true],
+  [false, true, true],
+  [false, false, true],
+  [true, undefined, undefined],
+  [true, false, undefined],
+  [true, true, undefined],
+  [undefined, true, undefined],
 ]
 
 // format is: [initialIsOpen, defaultIsOpen, props.isOpen]
 export const initialNoFocusOrOpenTestCases = [
-  [undefined, undefined, undefined, false],
-  [undefined, undefined, false, false],
-  [true, true, false, false],
-  [true, false, false, false],
-  [false, true, false, false],
-  [false, false, false, false],
-  [false, undefined, undefined, false],
-  [false, false, undefined, false],
-  [false, true, undefined, false],
-  [undefined, false, undefined, false],
+  [undefined, undefined, undefined],
+  [undefined, undefined, false],
+  [true, true, false],
+  [true, false, false],
+  [false, true, false],
+  [false, false, false],
+  [false, undefined, undefined],
+  [false, false, undefined],
+  [false, true, undefined],
+  [undefined, false, undefined],
 ]

src/hooks/useCombobox/index.js

@@ -16,6 +16,7 @@ import {
   useA11yMessageStatus,
 } from '../utils-ts'
 import {defaultStateValues} from '../utils.dropdown/defaultStateValues'
+import {useElementIds} from '../utils.dropdown/useElementIds'
 import {
   getInitialState,
   defaultProps,
@@ -24,7 +25,6 @@ import {
 } from './utils'
 import downshiftUseComboboxReducer from './reducer'
 import * as stateChangeTypes from './stateChangeTypes'
-import {useElementIds} from '../utils.dropdown/useElementIds'
 
 useCombobox.stateChangeTypes = stateChangeTypes
 
@@ -87,7 +87,12 @@ function useCombobox(userProps = {}) {
   })
   // Focus the input on first render if required.
   useEffect(() => {
-    const focusOnOpen = getInitialValue(props, 'isOpen', defaultStateValues)
+    const focusOnOpen = getInitialValue(
+      props.isOpen,
+      props.initialIsOpen,
+      props.defaultIsOpen,
+      defaultStateValues.isOpen,
+    )
 
     if (focusOnOpen && inputRef.current) {
       inputRef.current.focus()

src/hooks/useCombobox/reducer.js

@@ -17,7 +17,10 @@ export default function downshiftUseComboboxReducer(state, action) {
   switch (type) {
     case stateChangeTypes.ItemClick:
       changes = {
-        isOpen: getDefaultValue(props, 'isOpen', dropdownDefaultStateValues),
+        isOpen: getDefaultValue(
+          props.defaultIsOpen,
+          dropdownDefaultStateValues.isOpen,
+        ),
         highlightedIndex: getDefaultHighlightedIndex(props),
         selectedItem: props.items[action.index],
         inputValue: props.itemToString(props.items[action.index]),

src/hooks/useMultipleSelection/reducer.js

@@ -1,13 +1,10 @@
-import {getDefaultValue} from './utils'
+import {getDefaultValue} from '../utils-ts'
+import {defaultStateValues} from './utils'
 import * as stateChangeTypes from './stateChangeTypes'
 
 /* eslint-disable complexity */
-export default function downshiftMultipleSelectionReducer(
-  state,
-  props,
-  action,
-) {
-  const {type, index, selectedItem} = action
+export default function downshiftMultipleSelectionReducer(state, action) {
+  const {type, index, selectedItem, props} = action
   const {activeIndex, selectedItems} = state
   let changes
 
@@ -118,8 +115,14 @@ export default function downshiftMultipleSelectionReducer(
     }
     case stateChangeTypes.FunctionReset:
       changes = {
-        activeIndex: getDefaultValue(props, 'activeIndex'),
-        selectedItems: getDefaultValue(props, 'selectedItems'),
+        activeIndex: getDefaultValue(
+          props.defaultActiveIndex,
+          defaultStateValues.activeIndex,
+        ),
+        selectedItems: getDefaultValue(
+          props.defaultSelectedItems,
+          defaultStateValues.selectedItems,
+        ),
       }
       break
     default:

src/hooks/useMultipleSelection/utils.js

@@ -1,42 +1,14 @@
 import PropTypes from 'prop-types'
 
 import {noop} from '../../utils-ts'
-import {
-  getInitialValue as getInitialValueCommon,
-  getDefaultValue as getDefaultValueCommon,
-} from '../utils-ts'
+import {getInitialValue} from '../utils-ts'
 import {dropdownDefaultProps, dropdownPropTypes} from '../utils.dropdown'
 
-const defaultStateValues = {
+export const defaultStateValues = {
   activeIndex: -1,
   selectedItems: [],
 }
 
-/**
- * Returns the initial value for a state key in the following order:
- * 1. controlled prop, 2. initial prop, 3. default prop, 4. default
- * value from Downshift.
- *
- * @param {Object} props Props passed to the hook.
- * @param {string} propKey Props key to generate the value for.
- * @returns {any} The initial value for that prop.
- */
-function getInitialValue(props, propKey) {
-  return getInitialValueCommon(props, propKey, defaultStateValues)
-}
-
-/**
- * Returns the default value for a state key in the following order:
- * 1. controlled prop, 2. default prop, 3. default value from Downshift.
- *
- * @param {Object} props Props passed to the hook.
- * @param {string} propKey Props key to generate the value for.
- * @returns {any} The initial value for that prop.
- */
-function getDefaultValue(props, propKey) {
-  return getDefaultValueCommon(props, propKey, defaultStateValues)
-}
-
 /**
  * Gets the initial state based on the provided props. It uses initial, default
  * and controlled props related to state in order to compute the initial value.
@@ -45,8 +17,18 @@ function getDefaultValue(props, propKey) {
  * @returns {Object} The initial state.
  */
 function getInitialState(props) {
-  const activeIndex = getInitialValue(props, 'activeIndex')
-  const selectedItems = getInitialValue(props, 'selectedItems')
+  const activeIndex = getInitialValue(
+    props.activeIndex,
+    props.initialActiveIndex,
+    props.defaultActiveIndex,
+    defaultStateValues.activeIndex,
+  )
+  const selectedItems = getInitialValue(
+    props.selectedItems,
+    props.initialSelectedItems,
+    props.defaultSelectedItems,
+    defaultStateValues.selectedItems,
+  )
 
   return {
     activeIndex,
@@ -133,7 +115,6 @@ if (process.env.NODE_ENV !== 'production') {
 
 export {
   validatePropTypes,
-  getDefaultValue,
   getInitialState,
   isKeyDownOperationPermitted,
   isStateEqual,

src/hooks/useSelect/__tests__/utils.test.ts

@@ -59,6 +59,6 @@ describe('getItemIndexByCharacterKey', () => {
 
 test('reducer throws error if called without proper action type', () => {
   expect(() => {
-    reducer({}, {}, {type: 'super-bogus'})
+    reducer({}, {type: 'super-bogus'})
   }).toThrow('Reducer called without proper action type.')
 })

src/hooks/useSelect/index.js

@@ -22,11 +22,11 @@ import {
   useA11yMessageStatus,
 } from '../utils-ts'
 import {defaultStateValues} from '../utils.dropdown/defaultStateValues'
+import {useElementIds} from '../utils.dropdown/useElementIds'
 import {isReactNative, isReactNativeWeb} from '../../is.macro'
 import downshiftSelectReducer from './reducer'
 import {defaultProps, propTypes} from './utils'
 import * as stateChangeTypes from './stateChangeTypes'
-import { useElementIds } from '../utils.dropdown/useElementIds'
 
 useSelect.stateChangeTypes = stateChangeTypes
 
@@ -114,7 +114,12 @@ function useSelect(userProps = {}) {
   })
   // Focus the toggle button on first render if required.
   useEffect(() => {
-    const focusOnOpen = getInitialValue(props, 'isOpen', defaultStateValues)
+    const focusOnOpen = getInitialValue(
+      props.isOpen,
+      props.initialIsOpen,
+      props.defaultIsOpen,
+      defaultStateValues.isOpen,
+    )
 
     if (focusOnOpen && toggleButtonRef.current) {
       toggleButtonRef.current.focus()

src/hooks/useSelect/reducer.js

@@ -18,7 +18,7 @@ export default function downshiftSelectReducer(state, action) {
   switch (type) {
     case stateChangeTypes.ItemClick:
       changes = {
-        isOpen: getDefaultValue(props, 'isOpen', defaultStateValues),
+        isOpen: getDefaultValue(props.defaultIsOpen, defaultStateValues.isOpen),
         highlightedIndex: getDefaultHighlightedIndex(props),
         selectedItem: props.items[action.index],
       }