Skip to content

Commit 85bbd09

Browse files
committed
rewrite event-to-object
1 parent 1ce2f50 commit 85bbd09

File tree

11 files changed

+971
-486
lines changed

11 files changed

+971
-486
lines changed

src/client/package-lock.json

Lines changed: 227 additions & 199 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Lines changed: 1 addition & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,4 @@
11
{
2-
"compilerOptions": {
3-
"target": "esnext",
4-
"lib": ["DOM", "DOM.Iterable", "esnext"],
5-
"allowJs": false,
6-
"skipLibCheck": false,
7-
"esModuleInterop": false,
8-
"allowSyntheticDefaultImports": true,
9-
"strict": true,
10-
"forceConsistentCasingInFileNames": true,
11-
"module": "esnext",
12-
"moduleResolution": "node",
13-
"resolveJsonModule": true,
14-
"isolatedModules": true,
15-
"noEmit": true,
16-
"jsx": "react"
17-
},
2+
"extends": "../../tsconfig.json",
183
"include": ["src"]
194
}

src/client/packages/client/src/reactpy-vdom.tsx

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
1-
import React, { ComponentType, ReactNode } from "react";
1+
import React, { ComponentType } from "react";
22
import { ReactPyClient } from "./reactpy-client";
3-
// @ts-ignore
43
import serializeEvent from "event-to-object";
5-
import { IncomingMessage, Message, OutgoingMessage } from "./messages";
64

75
export async function loadImportSource(
86
vdomImportSource: ReactPyVdomImportSource,
@@ -157,17 +155,17 @@ function createEventHandler(
157155
name,
158156
function () {
159157
const data = Array.from(arguments).map((value) => {
160-
if (typeof value === "object" && value.nativeEvent) {
161-
if (preventDefault) {
162-
value.preventDefault();
163-
}
164-
if (stopPropagation) {
165-
value.stopPropagation();
166-
}
167-
return serializeEvent(value);
168-
} else {
158+
if (!(typeof value === "object" && value.nativeEvent)) {
169159
return value;
170160
}
161+
const event = value as React.SyntheticEvent<any>;
162+
if (preventDefault) {
163+
event.preventDefault();
164+
}
165+
if (stopPropagation) {
166+
event.stopPropagation();
167+
}
168+
return serializeEvent(event.nativeEvent);
171169
});
172170
client.sendMessage({ type: "layout-event", data, target });
173171
},
Lines changed: 1 addition & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,4 @@
11
{
2-
"compilerOptions": {
3-
"target": "esnext",
4-
"lib": ["DOM", "DOM.Iterable", "esnext"],
5-
"allowJs": false,
6-
"skipLibCheck": false,
7-
"esModuleInterop": false,
8-
"allowSyntheticDefaultImports": true,
9-
"strict": true,
10-
"forceConsistentCasingInFileNames": true,
11-
"module": "esnext",
12-
"moduleResolution": "node",
13-
"resolveJsonModule": true,
14-
"isolatedModules": true,
15-
"noEmit": true,
16-
"jsx": "react"
17-
},
2+
"extends": "../../tsconfig.json",
183
"include": ["src"]
194
}

src/client/packages/event-to-object/package.json

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,9 @@
99
"jsdom": "16.5.0",
1010
"lodash": "^4.17.21",
1111
"prettier": "^3.0.0-alpha.6",
12-
"uvu": "^0.5.1"
12+
"uvu": "^0.5.1",
13+
"tsm": "^2.0.0",
14+
"typescript": "^4.9.5"
1315
},
1416
"license": "MIT",
1517
"main": "src/index.js",
@@ -21,7 +23,7 @@
2123
"scripts": {
2224
"format": "prettier --write ./src ./tests",
2325
"check:format": "prettier --check ./src ./tests",
24-
"check:tests": "uvu tests",
26+
"check:tests": "uvu -r tsm tests",
2527
"check:types": "tsc"
2628
},
2729
"type": "module",
Lines changed: 283 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,283 @@
1+
// TODO
2+
type FileListObject = any;
3+
type DataTransferItemListObject = any;
4+
5+
export type EventToObjectMap = {
6+
event: [Event, EventObject];
7+
animation: [AnimationEvent, AnimationEventObject];
8+
clipboard: [ClipboardEvent, ClipboardEventObject];
9+
composition: [CompositionEvent, CompositionEventObject];
10+
devicemotion: [DeviceMotionEvent, DeviceMotionEventObject];
11+
deviceorientation: [DeviceOrientationEvent, DeviceOrientationEventObject];
12+
drag: [DragEvent, DragEventObject];
13+
focus: [FocusEvent, FocusEventObject];
14+
formdata: [FormDataEvent, FormDataEventObject];
15+
gamepad: [GamepadEvent, GamepadEventObject];
16+
input: [InputEvent, InputEventObject];
17+
keyboard: [KeyboardEvent, KeyboardEventObject];
18+
mouse: [MouseEvent, MouseEventObject];
19+
pointer: [PointerEvent, PointerEventObject];
20+
submit: [SubmitEvent, SubmitEventObject];
21+
touch: [TouchEvent, TouchEventObject];
22+
transition: [TransitionEvent, TransitionEventObject];
23+
ui: [UIEvent, UIEventObject];
24+
wheel: [WheelEvent, WheelEventObject];
25+
};
26+
27+
export interface EventObject {
28+
bubbles: boolean;
29+
composed: boolean;
30+
currentTarget: EventTargetObject | null;
31+
defaultPrevented: boolean;
32+
eventPhase: number;
33+
isTrusted: boolean;
34+
target: EventTargetObject | null;
35+
timeStamp: DOMHighResTimeStamp;
36+
type: string;
37+
selection: SelectionObject | null;
38+
}
39+
40+
export interface SubmitEventObject extends EventObject {
41+
submitter: EventTargetObject;
42+
}
43+
44+
export interface InputEventObject extends UIEventObject {
45+
data: string | null;
46+
dataTransfer: DataTransferObject | null;
47+
isComposing: boolean;
48+
inputType: string;
49+
}
50+
51+
export interface GamepadEventObject extends EventObject {
52+
gamepad: GamepadObject;
53+
}
54+
55+
export interface GamepadObject {
56+
axes: number[];
57+
buttons: GamepadButtonObject[];
58+
connected: boolean;
59+
hapticActuators: GamepadHapticActuatorObject[];
60+
id: string;
61+
index: number;
62+
mapping: GamepadMappingType;
63+
timestamp: DOMHighResTimeStamp;
64+
}
65+
66+
export interface GamepadButtonObject {
67+
pressed: boolean;
68+
touched: boolean;
69+
value: number;
70+
}
71+
export interface GamepadHapticActuatorObject {
72+
type: string;
73+
}
74+
75+
export interface DragEventObject extends MouseEventObject {
76+
/** Returns the DataTransfer object for the event. */
77+
readonly dataTransfer: DataTransferObject | null;
78+
}
79+
80+
export interface DeviceMotionEventObject extends EventObject {
81+
acceleration: DeviceAccelerationObject | null;
82+
accelerationIncludingGravity: DeviceAccelerationObject | null;
83+
interval: number;
84+
rotationRate: DeviceRotationRateObject | null;
85+
}
86+
87+
export interface DeviceAccelerationObject {
88+
x: number | null;
89+
y: number | null;
90+
z: number | null;
91+
}
92+
93+
export interface DeviceRotationRateObject {
94+
alpha: number | null;
95+
beta: number | null;
96+
gamma: number | null;
97+
}
98+
99+
export interface DeviceOrientationEventObject extends EventObject {
100+
absolute: boolean;
101+
alpha: number | null;
102+
beta: number | null;
103+
gamma: number | null;
104+
}
105+
106+
export interface MouseEventObject extends EventObject {
107+
altKey: boolean;
108+
button: number;
109+
buttons: number;
110+
clientX: number;
111+
clientY: number;
112+
ctrlKey: boolean;
113+
metaKey: boolean;
114+
movementX: number;
115+
movementY: number;
116+
offsetX: number;
117+
offsetY: number;
118+
pageX: number;
119+
pageY: number;
120+
relatedTarget: EventTargetObject | null;
121+
screenX: number;
122+
screenY: number;
123+
shiftKey: boolean;
124+
x: number;
125+
y: number;
126+
}
127+
128+
export interface FormDataEventObject extends EventObject {
129+
formData: FormDataObject;
130+
}
131+
132+
export type FormDataObject = [string, string | FileObject][];
133+
134+
export interface AnimationEventObject extends EventObject {
135+
animationName: string;
136+
elapsedTime: number;
137+
pseudoElement: string;
138+
}
139+
140+
export interface ClipboardEventObject extends EventObject {
141+
clipboardData: DataTransferObject | null;
142+
}
143+
144+
export interface UIEventObject extends EventObject {
145+
detail: number;
146+
}
147+
148+
/** The DOM CompositionEvent represents events that occur due to the user indirectly
149+
* entering text. */
150+
export interface CompositionEventObject extends UIEventObject {
151+
data: string;
152+
}
153+
154+
export interface KeyboardEventObject extends UIEventObject {
155+
altKey: boolean;
156+
code: string;
157+
ctrlKey: boolean;
158+
isComposing: boolean;
159+
key: string;
160+
location: number;
161+
metaKey: boolean;
162+
repeat: boolean;
163+
shiftKey: boolean;
164+
}
165+
166+
export interface FocusEventObject extends UIEventObject {
167+
relatedTarget: EventTargetObject | null;
168+
}
169+
170+
export interface TouchEventObject extends UIEventObject {
171+
altKey: boolean;
172+
changedTouches: TouchObject[];
173+
ctrlKey: boolean;
174+
metaKey: boolean;
175+
shiftKey: boolean;
176+
targetTouches: TouchObject[];
177+
touches: TouchObject[];
178+
}
179+
180+
export interface PointerEventObject extends MouseEventObject {
181+
height: number;
182+
isPrimary: boolean;
183+
pointerId: number;
184+
pointerType: string;
185+
pressure: number;
186+
tangentialPressure: number;
187+
tiltX: number;
188+
tiltY: number;
189+
twist: number;
190+
width: number;
191+
}
192+
193+
export interface TransitionEventObject extends EventObject {
194+
elapsedTime: number;
195+
propertyName: string;
196+
pseudoElement: string;
197+
}
198+
199+
export interface WheelEventObject extends MouseEventObject {
200+
readonly deltaMode: number;
201+
readonly deltaX: number;
202+
readonly deltaY: number;
203+
readonly deltaZ: number;
204+
}
205+
206+
export interface TouchObject {
207+
clientX: number;
208+
clientY: number;
209+
force: number;
210+
identifier: number;
211+
pageX: number;
212+
pageY: number;
213+
radiusX: number;
214+
radiusY: number;
215+
rotationAngle: number;
216+
screenX: number;
217+
screenY: number;
218+
target: EventTargetObject;
219+
}
220+
221+
export interface DataTransferObject {
222+
/**
223+
* Returns the kind of operation that is currently selected. If the kind of operation
224+
* isn't one of those that is allowed by the effectAllowed attribute, then the
225+
* operation will fail.
226+
*
227+
* Can be set, to change the selected operation.
228+
*
229+
* The possible values are "none", "copy", "link", and "move".
230+
*/
231+
dropEffect: "none" | "copy" | "link" | "move";
232+
/**
233+
* Returns the kinds of operations that are to be allowed.
234+
*
235+
* Can be set (during the dragstart event), to change the allowed operations.
236+
*
237+
* The possible values are "none", "copy", "copyLink", "copyMove", "link", "linkMove",
238+
* "move", "all", and "uninitialized",
239+
*/
240+
effectAllowed:
241+
| "none"
242+
| "copy"
243+
| "copyLink"
244+
| "copyMove"
245+
| "link"
246+
| "linkMove"
247+
| "move"
248+
| "all"
249+
| "uninitialized";
250+
/** Returns a FileList of the files being dragged, if any. */
251+
files: FileListObject;
252+
/** Returns a DataTransferItemList object, with the drag data. */
253+
items: DataTransferItemListObject;
254+
/** Lists the formats that were set in the dragstart event. In addition, if any files
255+
* are being dragged, then one of the types will be the string "Files". */
256+
types: string[];
257+
}
258+
259+
export interface SelectionObject {
260+
anchorNode: EventTargetObject | null;
261+
anchorOffset: number;
262+
focusNode: EventTargetObject | null;
263+
focusOffset: number;
264+
isCollapsed: boolean;
265+
rangeCount: number;
266+
type: string;
267+
}
268+
269+
export interface EventTargetObject {
270+
value?: string;
271+
textContent?: string;
272+
}
273+
274+
export interface FileObject {
275+
name: string;
276+
size: number;
277+
type: string;
278+
}
279+
280+
type NONE = 0;
281+
type CAPTURING_PHASE = 1;
282+
type AT_TARGET = 2;
283+
type BUBBLING_PHASE = 3;

0 commit comments

Comments
 (0)