diff --git a/packages/input-value/src/__tests__/index.test.js b/packages/input-value/src/__tests__/index.test.js index 8044fe1..4c58684 100644 --- a/packages/input-value/src/__tests__/index.test.js +++ b/packages/input-value/src/__tests__/index.test.js @@ -2,14 +2,14 @@ import {renderHook, act} from '@testing-library/react-hooks'; import {useInputValue} from '../index'; test('has value and onChange', () => { - const {result} = renderHook(() => useInputValue()); + const {result} = renderHook(() => useInputValue('')); expect(typeof result.current.value).toBe('string'); expect(typeof result.current.onChange).toBe('function'); }); -test('default initial value to empty string', () => { +test('default initial value is undefined', () => { const {result} = renderHook(() => useInputValue()); - expect(result.current.value).toBe(''); + expect(result.current.value).toBe(undefined); }); test('specified initial value', () => { @@ -24,3 +24,9 @@ test('change value via onChange', () => { act(() => result.current.onChange({target: {value: newValue}})); expect(result.current.value).toBe(newValue); }); + +test('target not in change value', () => { + const {result} = renderHook(() => useInputValue()); + act(() => result.current.onChange('foo')); + expect(result.current.value).toBe('foo'); +}); diff --git a/packages/input-value/src/index.ts b/packages/input-value/src/index.ts index 6927a9e..1471096 100644 --- a/packages/input-value/src/index.ts +++ b/packages/input-value/src/index.ts @@ -1,18 +1,19 @@ import {useState, useCallback} from 'react'; -interface ChangeEvent { - target: {value: string}; +export interface InputValueState { + value: T; + onChange(e: any): void; } -export interface InputValueState { - value: string; - onChange(e: ChangeEvent): void; -} - -export function useInputValue(initialValue: string = ''): InputValueState { - const [value, setValue] = useState(initialValue); +export function useInputValue(initialValue: T): InputValueState { + const [value, setValue] = useState(initialValue); const onChange = useCallback( - (e: ChangeEvent) => setValue(e.target.value), + (event: any) => { + const v = event && event.target && 'value' in event.target + ? (event.target as HTMLInputElement).value + : event; + setValue(v as T); + }, [] ); return {value, onChange};