Passing custom event with details into event handler in TS

Viewed 155

I want to pass the mouse event along with the detail object. I get this error: Property 'detail' does not exist on type 'never'.ts(2339)

interface CustomEvent {
    detail: {
        left: number;
        top: number;
        radius: number;
        label: string;
        color: string;
    };
}

export const Cursor: FC = () => {
    const onCursorEvent = (event: MouseEvent | CustomEvent) => {
        const newState = {}

        if ('detail.radius' in event) {
            newState.radius = event.detail.radius
        }


        setCursorState(newState)
    }

    const setSubscription = () => {
        const cursor$ = fromEvent<MouseEvent>(document, 'cursor')
        const move$ = fromEvent<MouseEvent>(document, 'mousemove').pipe(throttleTime(12))

        const cursorEvents = merge(
            cursor$,
            move$
        )

        cursorEvents.subscribe(event => onCursorEvent(event))
    }
}
0 Answers
Related