chore: support TypeScript 4.8

packages/core/src/engines/Engine.ts

@@ -2,7 +2,7 @@ import { Controller } from '../Controller'
 import { getEventDetails } from '../utils/events'
 import { call } from '../utils/fn'
 import { V, computeRubberband } from '../utils/maths'
-import { GestureKey, IngKey, State, Vector2 } from '../types'
+import { GestureKey, IngKey, StateTypes, Vector2 } from '../types'
 
 /**
  * The lib doesn't compute the kinematics on the last event of the gesture
@@ -179,7 +179,7 @@ export abstract class Engine<Key extends GestureKey> {
    * Function ran at the start of the gesture.
    * @param event
    */
-  start(event: NonNullable<State[Key]>['event']) {
+  start(event: StateTypes[Key]['event']) {
     const state = this.state
     const config = this.config
     if (!state._active) {
@@ -222,7 +222,7 @@ export abstract class Engine<Key extends GestureKey> {
    * Computes all sorts of state attributes, including kinematics.
    * @param event
    */
-  compute(event?: NonNullable<State[Key]>['event']) {
+  compute(event?: StateTypes[Key]['event']) {
     const { state, config, shared } = this
     state.args = this.args
 

packages/core/src/types/config.ts

@@ -1,4 +1,4 @@
-import { State } from './state'
+import { State, StateTypes } from './state'
 import { Vector2, Target, PointerType } from './utils'
 
 export type GestureKey = Exclude<keyof State, 'shared'>
@@ -42,7 +42,7 @@ export type GestureOptions<T extends GestureKey> = GenericOptions & {
   /**
    * The position `offset` will start from.
    */
-  from?: Vector2 | ((state: NonNullable<State[T]>) => Vector2)
+  from?: Vector2 | ((state: StateTypes[T]) => Vector2)
   /**
    * The handler will fire only when the gesture displacement is greater than
    * the threshold.
@@ -152,7 +152,7 @@ export type DragConfig = Omit<CoordinatesConfig<'drag'>, 'axisThreshold' | 'boun
    * Limits the gesture `offset` to the specified bounds. Can be a ref or a dom
    * node.
    */
-  bounds?: DragBounds | ((state: State['drag']) => DragBounds)
+  bounds?: DragBounds | ((state: StateTypes['drag']) => DragBounds)
   pointer?: {
     /**
      * The buttons combination that would trigger the drag. Use `-1` to allow

packages/core/src/types/state.ts

@@ -252,14 +252,16 @@ export type EventTypes = {
   pinch: PointerEvent | TouchEvent | WheelEvent | WebKitGestureEvent
 }
 
-export interface State {
+export type StateTypes = {
   shared: SharedGestureState
-  drag?: DragState & { event: EventTypes['drag'] }
-  wheel?: CoordinatesState & { event: EventTypes['wheel'] }
-  scroll?: CoordinatesState & { event: EventTypes['scroll'] }
-  move?: CoordinatesState & { event: EventTypes['move'] }
-  hover?: CoordinatesState & { event: EventTypes['hover'] }
-  pinch?: PinchState & { event: EventTypes['pinch'] }
+  drag: DragState & { event: EventTypes['drag'] }
+  wheel: CoordinatesState & { event: EventTypes['wheel'] }
+  scroll: CoordinatesState & { event: EventTypes['scroll'] }
+  move: CoordinatesState & { event: EventTypes['move'] }
+  hover: CoordinatesState & { event: EventTypes['hover'] }
+  pinch: PinchState & { event: EventTypes['pinch'] }
 }
 
-export type FullGestureState<Key extends GestureKey> = SharedGestureState & NonNullable<State[Key]>
+export type State = Pick<StateTypes, 'shared'> & Partial<Omit<StateTypes, 'shared'>>
+
+export type FullGestureState<Key extends GestureKey> = SharedGestureState & StateTypes[Key]