Skip to content

Commit ffa06e5

Browse files
authored
Typed useEventHandler (#100)
1 parent 85ff56c commit ffa06e5

File tree

3 files changed

+20
-16
lines changed

3 files changed

+20
-16
lines changed

src/components/View/RNView.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -105,7 +105,7 @@ export interface ViewProps<Signals extends {}> extends RNProps {
105105
/**
106106
* Prop to set the event listener map. See [Handlong Events](/docs/guides/handle-events)
107107
*/
108-
on?: Partial<EventListeners | Signals>;
108+
on?: Partial<WidgetEventListeners | Signals>;
109109
/**
110110
* Prop to set the ref. The ref will return the underlying nodegui widget.
111111
*/
@@ -199,7 +199,7 @@ export function setViewProps<Signals extends {}>(
199199
set pos(position: Position) {
200200
widget.move(position.x, position.y);
201201
},
202-
set on(listenerMap: Partial<EventListeners | Signals>) {
202+
set on(listenerMap: Partial<WidgetEventListeners | Signals>) {
203203
const listenerMapLatest: any = Object.assign({}, listenerMap);
204204
const oldListenerMap = Object.assign({}, oldProps.on);
205205
Object.entries(oldListenerMap).forEach(([eventType, oldEvtListener]) => {
@@ -293,14 +293,14 @@ type Position = {
293293
y: number;
294294
};
295295

296-
type EventListeners = {
297-
[key in WidgetEventTypes]: (native?: NativeElement) => void;
298-
};
299-
300296
type WidgetAttributesMap = {
301297
[key: number]: boolean;
302298
};
303299

304300
type WindowFlagsMap = {
305301
[key: number]: boolean;
306302
};
303+
304+
export type WidgetEventListeners = {
305+
[key in WidgetEventTypes]: (native?: NativeElement) => void;
306+
};

src/demo.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,8 @@ import {
77
AnimatedImage,
88
ComboBox
99
} from "./index";
10-
import { QIcon, QVariant } from "@nodegui/nodegui";
10+
import { QIcon, QVariant, QPushButtonSignals } from "@nodegui/nodegui";
11+
import { useEventHandler } from "./hooks";
1112

1213
const items = [
1314
{
@@ -20,12 +21,18 @@ const items = [
2021
{ text: "world" }
2122
];
2223

24+
const handler = useEventHandler<QPushButtonSignals>(
25+
{
26+
clicked: clicked => {}
27+
},
28+
[]
29+
);
2330
const App = () => {
2431
return (
2532
<Window>
2633
<View style={containerStyle}>
2734
<View on={{}}>
28-
<Button on={{}} style={buttonStyle} text={"Hello"} />
35+
<Button on={handler} style={buttonStyle} text={"Hello"} />
2936
<Button style={buttonStyle} text={"World"} />
3037
</View>
3138
<ComboBox items={items} />

src/hooks/index.ts

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,12 @@
11
import { useMemo, DependencyList } from "react";
2+
import { WidgetEventListeners } from "../components/View/RNView";
23

3-
type EventHandlerMap = {
4-
[key: string]: (...args: any[]) => void;
5-
};
6-
7-
export const useEventHandler = (
8-
eventHandlerMap: EventHandlerMap,
4+
export function useEventHandler<Signals>(
5+
eventHandlerMap: Partial<WidgetEventListeners | Signals>,
96
deps: DependencyList
10-
) => {
7+
) {
118
const handler = useMemo(() => {
129
return eventHandlerMap;
1310
}, deps);
1411
return handler;
15-
};
12+
}

0 commit comments

Comments
 (0)