diff --git a/packages/components/src/input-control/reducer/actions.ts b/packages/components/src/input-control/reducer/actions.ts index 846421dbc5e8eb..374d53433d3724 100644 --- a/packages/components/src/input-control/reducer/actions.ts +++ b/packages/components/src/input-control/reducer/actions.ts @@ -24,7 +24,7 @@ interface EventPayload { event?: SyntheticEvent; } -interface Action< Type, ExtraPayload = {} > { +export interface Action< Type = string, ExtraPayload = {} > { type: Type; payload: EventPayload & ExtraPayload; } diff --git a/packages/components/src/input-control/reducer/reducer.ts b/packages/components/src/input-control/reducer/reducer.ts index 3f3302608daeb2..c41ae857755382 100644 --- a/packages/components/src/input-control/reducer/reducer.ts +++ b/packages/components/src/input-control/reducer/reducer.ts @@ -50,7 +50,7 @@ function mergeInitialState( */ function inputControlStateReducer( composedStateReducers: StateReducer -): StateReducer { +): StateReducer< actions.ControlAction > { return ( state, action ) => { const nextState = { ...state }; @@ -151,7 +151,7 @@ export function useInputControlStateReducer( initialState: Partial< InputState > = initialInputControlState, onChangeHandler: InputChangeCallback ) { - const [ state, dispatch ] = useReducer< StateReducer >( + const [ state, dispatch ] = useReducer( inputControlStateReducer( stateReducer ), mergeInitialState( initialState ) ); diff --git a/packages/components/src/input-control/reducer/state.ts b/packages/components/src/input-control/reducer/state.ts index 53a49aa765feb8..a26dacdd83f4ea 100644 --- a/packages/components/src/input-control/reducer/state.ts +++ b/packages/components/src/input-control/reducer/state.ts @@ -6,7 +6,7 @@ import type { Reducer, SyntheticEvent } from 'react'; /** * Internal dependencies */ -import type { ControlAction, InputAction } from './actions'; +import type { Action, InputAction } from './actions'; export interface InputState { _event?: SyntheticEvent; @@ -19,7 +19,10 @@ export interface InputState { value?: string; } -export type StateReducer = Reducer< InputState, InputAction | ControlAction >; +export type StateReducer< SpecializedAction = Action > = Reducer< + InputState, + InputAction | SpecializedAction +>; export const initialStateReducer: StateReducer = ( state: InputState ) => state;