ctrl-fx 0.0.1 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +13 -0
- package/dist/chunk-DZAR6PTR.js +3966 -0
- package/dist/chunk-KNHJPAIU.js +1800 -0
- package/dist/chunk-NSWOTCDU.js +916 -0
- package/dist/chunk-PKBMQBKP.js +7 -0
- package/dist/chunk-XICUXW4T.js +252 -0
- package/dist/db/index.d.ts +234 -0
- package/dist/db/index.js +53 -0
- package/dist/dom/index.d.ts +2 -0
- package/dist/dom/index.js +30 -0
- package/dist/effects.d.ts +2 -0
- package/dist/effects.js +111 -0
- package/dist/index-fpCmXVEu.d.ts +1391 -0
- package/dist/index.d.ts +2 -0
- package/dist/index.js +18 -0
- package/dist/router.d.ts +39 -0
- package/dist/router.js +66 -0
- package/dist/testing.d.ts +254 -0
- package/dist/testing.js +40 -0
- package/dist/webcomponent.d.ts +18 -0
- package/dist/webcomponent.js +51 -0
- package/package.json +4 -3
|
@@ -0,0 +1,1391 @@
|
|
|
1
|
+
import { DbName, DbVersion, DbSetupEffect, ObjectStore, DbEffect, DbError } from './db/index.js';
|
|
2
|
+
|
|
3
|
+
type NodeId = {
|
|
4
|
+
_tag: 'node_id';
|
|
5
|
+
value: string;
|
|
6
|
+
eq(that: NodeId): boolean;
|
|
7
|
+
};
|
|
8
|
+
declare function nodeId(value: string): NodeId;
|
|
9
|
+
|
|
10
|
+
/** A virtual DOM attribute: a name/value pair set on the real DOM element via
|
|
11
|
+
* `setAttribute`. */
|
|
12
|
+
interface Attr {
|
|
13
|
+
readonly name: string;
|
|
14
|
+
readonly value?: string;
|
|
15
|
+
}
|
|
16
|
+
/** Creates an `Attr`. */
|
|
17
|
+
declare function attr(name: string, value: string): Attr;
|
|
18
|
+
/** A JavaScript property set directly on the DOM element object, as opposed to
|
|
19
|
+
* an HTML attribute. */
|
|
20
|
+
interface Prop {
|
|
21
|
+
readonly name: string;
|
|
22
|
+
readonly value: unknown;
|
|
23
|
+
}
|
|
24
|
+
/** Creates a `Prop`. */
|
|
25
|
+
declare function prop(name: string, value: unknown): Prop;
|
|
26
|
+
type AttrArg = Attr | [string, string] | string;
|
|
27
|
+
type AttrOrNodeIdArgs = [NodeId, ...AttrArg[]] | [...AttrArg[]];
|
|
28
|
+
/** Shorthand for `attr('id', value)`. */
|
|
29
|
+
declare function id(value: string): Attr;
|
|
30
|
+
/** Shorthand for `attr('type', value)`. */
|
|
31
|
+
declare function typeAttr(value: string): Attr;
|
|
32
|
+
/** Converts a map of CSS custom property names to values into a `style`
|
|
33
|
+
* attribute. */
|
|
34
|
+
declare function cssVars(vars: Record<string, string>): Attr;
|
|
35
|
+
|
|
36
|
+
/** The success variant of a Result. */
|
|
37
|
+
type Success<A, E> = {
|
|
38
|
+
_tag: 'success';
|
|
39
|
+
value: A;
|
|
40
|
+
/** Transforms the success value, leaving failure unchanged. */
|
|
41
|
+
map<B>(f: (a: A) => B): Result<B, E>;
|
|
42
|
+
/** Chains a function that can fail, short-circuiting on existing failure. */
|
|
43
|
+
andThen<B, EE>(f: (a: A) => Result<B, EE>): Result<B, E | EE>;
|
|
44
|
+
/** Transforms the error value, leaving success unchanged. */
|
|
45
|
+
errorMap<EE>(f: (e: E) => EE): Result<A, EE>;
|
|
46
|
+
/** Returns either the success value or the error value. */
|
|
47
|
+
merge(): A | E;
|
|
48
|
+
/** Recovers from failure by applying `f` to the error. */
|
|
49
|
+
recover<AA, EE>(f: (e: E) => Result<AA, EE>): Result<A | AA, E | EE>;
|
|
50
|
+
/** Applies `onSuccess` or `onError` and returns a single value. */
|
|
51
|
+
fold<T>(onSuccess: (a: A) => T, onError: (e: E) => T): T;
|
|
52
|
+
};
|
|
53
|
+
/** The failure variant of a Result. */
|
|
54
|
+
type Failure<A, E> = {
|
|
55
|
+
_tag: 'failure';
|
|
56
|
+
error: E;
|
|
57
|
+
/** Transforms the success value, leaving failure unchanged. */
|
|
58
|
+
map<B>(f: (a: A) => B): Result<B, E>;
|
|
59
|
+
/** Chains a function that can fail, short-circuiting on existing failure. */
|
|
60
|
+
andThen<B, EE>(f: (a: A) => Result<B, EE>): Result<B, E | EE>;
|
|
61
|
+
/** Transforms the error value, leaving success unchanged. */
|
|
62
|
+
errorMap<EE>(f: (e: E) => EE): Result<A, EE>;
|
|
63
|
+
/** Returns either the success value or the error value. */
|
|
64
|
+
merge(): A | E;
|
|
65
|
+
/** Recovers from failure by applying `f` to the error. */
|
|
66
|
+
recover<AA, EE>(f: (e: E) => Result<AA, EE>): Result<A | AA, E | EE>;
|
|
67
|
+
/** Applies `onSuccess` or `onError` and returns a single value. */
|
|
68
|
+
fold<T>(onSuccess: (a: A) => T, onError: (e: E) => T): T;
|
|
69
|
+
};
|
|
70
|
+
/** A value that is either a success (`A`) or a failure (`E`). */
|
|
71
|
+
type Result<A, E> = Success<A, E> | Failure<A, E>;
|
|
72
|
+
|
|
73
|
+
type Method = 'GET' | 'POST' | 'DELETE' | 'PUT' | 'HEAD' | 'OPTIONS';
|
|
74
|
+
type HttpRequest = {
|
|
75
|
+
readonly uri: string;
|
|
76
|
+
readonly method: Method;
|
|
77
|
+
readonly headers: Headers;
|
|
78
|
+
readonly body?: string;
|
|
79
|
+
};
|
|
80
|
+
type Headers = {
|
|
81
|
+
[key: string]: string;
|
|
82
|
+
};
|
|
83
|
+
type HttpResponse = {
|
|
84
|
+
readonly headers: Headers;
|
|
85
|
+
readonly body: ResponseBody;
|
|
86
|
+
};
|
|
87
|
+
type HttpError = {
|
|
88
|
+
_type: 'HttpError';
|
|
89
|
+
};
|
|
90
|
+
type RequestError = {
|
|
91
|
+
_type: 'RequestError';
|
|
92
|
+
cause: 'RequestAborted' | 'NetworkFailure' | 'UnexpectedError';
|
|
93
|
+
message: string;
|
|
94
|
+
};
|
|
95
|
+
type DecodingError = {
|
|
96
|
+
_type: 'DecodingError';
|
|
97
|
+
message: string;
|
|
98
|
+
};
|
|
99
|
+
declare class Json {
|
|
100
|
+
private wrapped;
|
|
101
|
+
constructor(wrapped: any);
|
|
102
|
+
decodeUnsafe<A>(): A;
|
|
103
|
+
}
|
|
104
|
+
declare class ResponseBody {
|
|
105
|
+
private data;
|
|
106
|
+
constructor(data: ArrayBuffer);
|
|
107
|
+
asString(): string;
|
|
108
|
+
asBlob(): Blob;
|
|
109
|
+
asJson(): Result<Json, DecodingError>;
|
|
110
|
+
}
|
|
111
|
+
|
|
112
|
+
type ClipboardError = {
|
|
113
|
+
_type: 'ClipboardError';
|
|
114
|
+
cause: 'NotAllowed' | 'NotSupported' | 'UnexpectedError';
|
|
115
|
+
message: string;
|
|
116
|
+
};
|
|
117
|
+
|
|
118
|
+
type ScrollElementError = {
|
|
119
|
+
_type: 'ScrollElementError';
|
|
120
|
+
cause: 'ElementNotFound';
|
|
121
|
+
selector: string;
|
|
122
|
+
};
|
|
123
|
+
|
|
124
|
+
type Path$1 = {
|
|
125
|
+
readonly elems: readonly string[];
|
|
126
|
+
format(): string;
|
|
127
|
+
matches(that: Path$1): boolean;
|
|
128
|
+
};
|
|
129
|
+
|
|
130
|
+
interface QueryParam {
|
|
131
|
+
name: string;
|
|
132
|
+
value?: string;
|
|
133
|
+
format: string;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
interface Fragment {
|
|
137
|
+
path: Path$1;
|
|
138
|
+
queryParams: QueryParam[];
|
|
139
|
+
format: string;
|
|
140
|
+
}
|
|
141
|
+
|
|
142
|
+
interface InternalLocation {
|
|
143
|
+
readonly path: Path$1;
|
|
144
|
+
readonly queryParams: readonly QueryParam[];
|
|
145
|
+
readonly fragment?: Fragment;
|
|
146
|
+
}
|
|
147
|
+
|
|
148
|
+
/** A pair of get/set functions that focus on a field `A` within a structure `S`. */
|
|
149
|
+
type Lens<S, A> = {
|
|
150
|
+
/** Reads the focused field from `S`. */
|
|
151
|
+
get: (source: S) => A;
|
|
152
|
+
/** Returns a new `S` with the focused field replaced. */
|
|
153
|
+
set: (source: S, value: A) => S;
|
|
154
|
+
};
|
|
155
|
+
|
|
156
|
+
/** Current value and cursor position of a text input, passed to `onTextInput` handlers. */
|
|
157
|
+
type TextState = {
|
|
158
|
+
value: string;
|
|
159
|
+
selectionStart: number | null;
|
|
160
|
+
selectionEnd: number | null;
|
|
161
|
+
};
|
|
162
|
+
type TextInputListener<State, Event> = {
|
|
163
|
+
_type: 'textinput';
|
|
164
|
+
effect: (textState: TextState) => Effect<State, Event, EventListenerResult>;
|
|
165
|
+
options: EventOptions;
|
|
166
|
+
};
|
|
167
|
+
/** Key name and code from a keyboard event, passed to `onKeyDown`/`onKeyUp` handlers. */
|
|
168
|
+
type KeyData = {
|
|
169
|
+
key: string;
|
|
170
|
+
code: string;
|
|
171
|
+
};
|
|
172
|
+
type KeyDownListener<State, Event> = {
|
|
173
|
+
_type: 'keydown';
|
|
174
|
+
effect: (key: KeyData) => Effect<State, Event, EventListenerResult>;
|
|
175
|
+
options: EventOptions;
|
|
176
|
+
};
|
|
177
|
+
type KeyUpListener<State, Event> = {
|
|
178
|
+
_type: 'keyup';
|
|
179
|
+
effect: (key: KeyData) => Effect<State, Event, EventListenerResult>;
|
|
180
|
+
options: EventOptions;
|
|
181
|
+
};
|
|
182
|
+
/** Touch-point coordinates from a touch event, passed to `onTouchStart`/`onTouchMove`/`onTouchEnd` handlers. */
|
|
183
|
+
type TouchData = {
|
|
184
|
+
clientX: number;
|
|
185
|
+
clientY: number;
|
|
186
|
+
pageX: number;
|
|
187
|
+
pageY: number;
|
|
188
|
+
};
|
|
189
|
+
type TouchStartListener<State, Event> = {
|
|
190
|
+
_type: 'touchstart';
|
|
191
|
+
effect: (touches: readonly TouchData[]) => Effect<State, Event, EventListenerResult>;
|
|
192
|
+
options: EventOptions;
|
|
193
|
+
};
|
|
194
|
+
type TouchMoveListener<State, Event> = {
|
|
195
|
+
_type: 'touchmove';
|
|
196
|
+
effect: (touches: readonly TouchData[]) => Effect<State, Event, EventListenerResult>;
|
|
197
|
+
options: EventOptions;
|
|
198
|
+
};
|
|
199
|
+
type TouchCancelListener<State, Event> = {
|
|
200
|
+
_type: 'touchcancel';
|
|
201
|
+
effect: (touches: readonly TouchData[]) => Effect<State, Event, EventListenerResult>;
|
|
202
|
+
options: EventOptions;
|
|
203
|
+
};
|
|
204
|
+
type TouchEndListener<State, Event> = {
|
|
205
|
+
_type: 'touchend';
|
|
206
|
+
effect: (touches: readonly TouchData[]) => Effect<State, Event, EventListenerResult>;
|
|
207
|
+
options: EventOptions;
|
|
208
|
+
};
|
|
209
|
+
/** Options forwarded to `addEventListener`. */
|
|
210
|
+
type EventOptions = {
|
|
211
|
+
capture?: boolean;
|
|
212
|
+
passive?: boolean;
|
|
213
|
+
};
|
|
214
|
+
/** Browser event modifiers an event handler can request. Return from a handler to call `preventDefault` or `stopPropagation`. */
|
|
215
|
+
type EventActions = {
|
|
216
|
+
stopPropagation?: boolean;
|
|
217
|
+
preventDefault?: boolean;
|
|
218
|
+
};
|
|
219
|
+
/** Return type of event handlers: `void` or an `EventActions` object to modify browser behavior. */
|
|
220
|
+
type EventListenerResult = void | EventActions;
|
|
221
|
+
type BlurListener<State, Event> = {
|
|
222
|
+
_type: 'blur';
|
|
223
|
+
effect: Effect<State, Event, EventListenerResult>;
|
|
224
|
+
options: EventOptions;
|
|
225
|
+
};
|
|
226
|
+
/** Current value and checked state of a form element, passed to `onChange` handlers. */
|
|
227
|
+
type ChangeData = {
|
|
228
|
+
value: string;
|
|
229
|
+
checked: boolean;
|
|
230
|
+
};
|
|
231
|
+
type ChangeListener<State, Event> = {
|
|
232
|
+
_type: 'change';
|
|
233
|
+
effect: (data: ChangeData) => Effect<State, Event, EventListenerResult>;
|
|
234
|
+
options: EventOptions;
|
|
235
|
+
};
|
|
236
|
+
type ClickListener<State, Event> = {
|
|
237
|
+
_type: 'click';
|
|
238
|
+
effect: Effect<State, Event, EventListenerResult>;
|
|
239
|
+
options: EventOptions;
|
|
240
|
+
};
|
|
241
|
+
type DblClickListener<State, Event> = {
|
|
242
|
+
_type: 'dblclick';
|
|
243
|
+
effect: Effect<State, Event, EventListenerResult>;
|
|
244
|
+
options: EventOptions;
|
|
245
|
+
};
|
|
246
|
+
/** Mouse position and movement delta, passed to `onMouseMove` handlers. */
|
|
247
|
+
type MouseMoveData = {
|
|
248
|
+
clientX: number;
|
|
249
|
+
clientY: number;
|
|
250
|
+
pageX: number;
|
|
251
|
+
pageY: number;
|
|
252
|
+
movementX: number;
|
|
253
|
+
movementY: number;
|
|
254
|
+
};
|
|
255
|
+
type MouseMoveListener<State, Event> = {
|
|
256
|
+
_type: 'mousemove';
|
|
257
|
+
effect: (data: MouseMoveData) => Effect<State, Event, EventListenerResult>;
|
|
258
|
+
options: EventOptions;
|
|
259
|
+
};
|
|
260
|
+
/** Scroll deltas from a wheel event, passed to `onWheel` handlers. */
|
|
261
|
+
type WheelData = {
|
|
262
|
+
deltaX: number;
|
|
263
|
+
deltaY: number;
|
|
264
|
+
deltaZ: number;
|
|
265
|
+
deltaMode: number;
|
|
266
|
+
};
|
|
267
|
+
type WheelListener<State, Event> = {
|
|
268
|
+
_type: 'wheel';
|
|
269
|
+
effect: (data: WheelData) => Effect<State, Event, EventListenerResult>;
|
|
270
|
+
options: EventOptions;
|
|
271
|
+
};
|
|
272
|
+
type FocusListener<State, Event> = {
|
|
273
|
+
_type: 'focus';
|
|
274
|
+
effect: Effect<State, Event, EventListenerResult>;
|
|
275
|
+
options: EventOptions;
|
|
276
|
+
};
|
|
277
|
+
type MouseEnterListener<State, Event> = {
|
|
278
|
+
_type: 'mouseenter';
|
|
279
|
+
effect: Effect<State, Event, EventListenerResult>;
|
|
280
|
+
options: EventOptions;
|
|
281
|
+
};
|
|
282
|
+
type MouseLeaveListener<State, Event> = {
|
|
283
|
+
_type: 'mouseleave';
|
|
284
|
+
effect: Effect<State, Event, EventListenerResult>;
|
|
285
|
+
options: EventOptions;
|
|
286
|
+
};
|
|
287
|
+
/** Scroll offset of the element, passed to `onScroll`/`onScrollEnd` handlers. */
|
|
288
|
+
type ScrollData = {
|
|
289
|
+
scrollTop: number;
|
|
290
|
+
scrollLeft: number;
|
|
291
|
+
};
|
|
292
|
+
type ScrollListener<State, Event> = {
|
|
293
|
+
_type: 'scroll';
|
|
294
|
+
effect: (data: ScrollData) => Effect<State, Event, EventListenerResult>;
|
|
295
|
+
options: EventOptions;
|
|
296
|
+
};
|
|
297
|
+
type ScrollEndListener<State, Event> = {
|
|
298
|
+
_type: 'scrollend';
|
|
299
|
+
effect: (data: ScrollData) => Effect<State, Event, EventListenerResult>;
|
|
300
|
+
options: EventOptions;
|
|
301
|
+
};
|
|
302
|
+
type SubmitListener<State, Event> = {
|
|
303
|
+
_type: 'submit';
|
|
304
|
+
effect: Effect<State, Event, EventListenerResult>;
|
|
305
|
+
options: EventOptions;
|
|
306
|
+
};
|
|
307
|
+
type CustomEventListener<State, Event> = {
|
|
308
|
+
_type: 'custom';
|
|
309
|
+
eventName: string;
|
|
310
|
+
effect: (detail: unknown) => Effect<State, Event, EventListenerResult>;
|
|
311
|
+
options: EventOptions;
|
|
312
|
+
};
|
|
313
|
+
type EventListener<State, Event> = BlurListener<State, Event> | ChangeListener<State, Event> | ClickListener<State, Event> | CustomEventListener<State, Event> | SubmitListener<State, Event> | DblClickListener<State, Event> | FocusListener<State, Event> | KeyDownListener<State, Event> | KeyUpListener<State, Event> | MouseEnterListener<State, Event> | MouseLeaveListener<State, Event> | MouseMoveListener<State, Event> | ScrollListener<State, Event> | ScrollEndListener<State, Event> | TextInputListener<State, Event> | TouchCancelListener<State, Event> | TouchEndListener<State, Event> | TouchMoveListener<State, Event> | TouchStartListener<State, Event> | WheelListener<State, Event>;
|
|
314
|
+
/** Wraps `effect` and instructs the runtime to call `event.preventDefault()` after it runs. */
|
|
315
|
+
declare function preventDefault<State, Event>(effect: Effect<State, Event, void>): Effect<State, Event, EventActions>;
|
|
316
|
+
/** Wraps `effect` and instructs the runtime to call `event.stopPropagation()` after it runs. */
|
|
317
|
+
declare function stopPropagation<State, Event>(effect: Effect<State, Event, void>): Effect<State, Event, EventActions>;
|
|
318
|
+
/** Wraps `effect` and instructs the runtime to call both `event.stopPropagation()` and `event.preventDefault()`. */
|
|
319
|
+
declare function stopPropagationAndPreventDefault<State, Event>(effect: Effect<State, Event, void>): Effect<State, Event, EventActions>;
|
|
320
|
+
type ResizeListener<State, Event> = {
|
|
321
|
+
_type: 'resize';
|
|
322
|
+
onChange: (dimensions: Dimensions) => Effect<State, Event, void>;
|
|
323
|
+
options: EventOptions;
|
|
324
|
+
};
|
|
325
|
+
type PopStateListener<State, Event> = {
|
|
326
|
+
_type: 'popstate';
|
|
327
|
+
onChange: (location: InternalLocation) => Effect<State, Event, void>;
|
|
328
|
+
options: EventOptions;
|
|
329
|
+
};
|
|
330
|
+
type LocationChangeListener<State, Event> = {
|
|
331
|
+
_type: 'locationchange';
|
|
332
|
+
onChange: (location: InternalLocation) => Effect<State, Event, void>;
|
|
333
|
+
options: EventOptions;
|
|
334
|
+
};
|
|
335
|
+
type VisibilityChangeListener<State, Event> = {
|
|
336
|
+
_type: 'visibilitychange';
|
|
337
|
+
onChange: (state: 'visible' | 'hidden') => Effect<State, Event, void>;
|
|
338
|
+
options: EventOptions;
|
|
339
|
+
};
|
|
340
|
+
type OnlineListener<State, Event> = {
|
|
341
|
+
_type: 'online';
|
|
342
|
+
effect: Effect<State, Event, void>;
|
|
343
|
+
options: EventOptions;
|
|
344
|
+
};
|
|
345
|
+
type OfflineListener<State, Event> = {
|
|
346
|
+
_type: 'offline';
|
|
347
|
+
effect: Effect<State, Event, void>;
|
|
348
|
+
options: EventOptions;
|
|
349
|
+
};
|
|
350
|
+
type ContainerListener<State, Event> = ResizeListener<State, Event> | PopStateListener<State, Event> | LocationChangeListener<State, Event> | KeyDownListener<State, Event> | KeyUpListener<State, Event> | VisibilityChangeListener<State, Event> | OnlineListener<State, Event> | OfflineListener<State, Event>;
|
|
351
|
+
|
|
352
|
+
/**
|
|
353
|
+
* The return type of a view function: a list of virtual DOM nodes plus optional
|
|
354
|
+
* container-level event listeners. Create one with `nodeGroup(...)` or the `_` shorthand.
|
|
355
|
+
*/
|
|
356
|
+
type NodeGroup<State, Event> = {
|
|
357
|
+
_type: 'NodeGroup';
|
|
358
|
+
nodes: Node<State, Event>[];
|
|
359
|
+
containerListeners: ContainerListener<State, Event>[];
|
|
360
|
+
/** Runs `effect` whenever the component's container is resized, receiving the new dimensions. */
|
|
361
|
+
onResize(effect: (dimensions: Dimensions) => Effect<State, Event, void>): NodeGroup<State, Event>;
|
|
362
|
+
/** Runs `effect` when the browser back/forward buttons are used. */
|
|
363
|
+
onPopState(effect: (location: InternalLocation) => Effect<State, Event, void>): NodeGroup<State, Event>;
|
|
364
|
+
/** Runs `effect` on any location change, including `pushState` and `replaceState` as well as `popstate`. */
|
|
365
|
+
onLocationChange(effect: (location: InternalLocation) => Effect<State, Event, void>): NodeGroup<State, Event>;
|
|
366
|
+
/** Runs `effect` on document-level keyup events. */
|
|
367
|
+
onKeyUp(effect: (key: KeyData) => Effect<State, Event, EventListenerResult>, options?: EventOptions): NodeGroup<State, Event>;
|
|
368
|
+
/** Runs `effect` on document-level keydown events. */
|
|
369
|
+
onKeyDown(effect: (key: KeyData) => Effect<State, Event, EventListenerResult>, options?: EventOptions): NodeGroup<State, Event>;
|
|
370
|
+
/** Runs `effect` when the page becomes visible or hidden (e.g. user switches tabs). */
|
|
371
|
+
onVisibilityChange(effect: (state: 'visible' | 'hidden') => Effect<State, Event, void>): NodeGroup<State, Event>;
|
|
372
|
+
/** Runs `effect` when the browser comes online. */
|
|
373
|
+
onOnline(effect: Effect<State, Event, void>): NodeGroup<State, Event>;
|
|
374
|
+
/** Runs `effect` when the browser goes offline. */
|
|
375
|
+
onOffline(effect: Effect<State, Event, void>): NodeGroup<State, Event>;
|
|
376
|
+
renderEffects: Effect<State, Event, void>[];
|
|
377
|
+
/** Runs `effects` once immediately after the component mounts. Use this for initial data loading or setup that requires the DOM to exist. */
|
|
378
|
+
onRender(...effects: Effect<State, Event, void>[]): NodeGroup<State, Event>;
|
|
379
|
+
};
|
|
380
|
+
/** A memoized subtree node produced by `view` or `fixedView`. */
|
|
381
|
+
type View<State, Params, Event> = {
|
|
382
|
+
_type: 'View';
|
|
383
|
+
nodeId: NodeId;
|
|
384
|
+
params: Params;
|
|
385
|
+
nodes: (params: Params) => NodeGroup<State, Event>;
|
|
386
|
+
};
|
|
387
|
+
|
|
388
|
+
/** A self-contained UI unit with its own state, view, and optional scoped CSS. */
|
|
389
|
+
type Component<State, Params, Event> = {
|
|
390
|
+
readonly _type: 'Component';
|
|
391
|
+
readonly params: Params;
|
|
392
|
+
readonly css?: string | ((params: Params) => string);
|
|
393
|
+
readonly initialState: (params: Params) => Effect<State, Event, State>;
|
|
394
|
+
view(state: State, params: Params): NodeGroup<State, Event>;
|
|
395
|
+
};
|
|
396
|
+
type ComponentEventListener<State, Event, ComponentEvent> = (event: ComponentEvent) => Effect<State, Event, void>;
|
|
397
|
+
/** A mounted instance of a Component inside a parent view. */
|
|
398
|
+
type ComponentElement<State, Event, ComponentState, Params, ComponentEvent> = {
|
|
399
|
+
readonly _type: 'Component';
|
|
400
|
+
readonly nodeId: NodeId;
|
|
401
|
+
readonly component: Component<ComponentState, Params, ComponentEvent>;
|
|
402
|
+
readonly componentEventListeners: readonly ComponentEventListener<State, Event, ComponentEvent>[];
|
|
403
|
+
/** Registers a listener for events fired by the component. */
|
|
404
|
+
onEvent(eventListener: ComponentEventListener<State, Event, ComponentEvent>): ComponentElement<State, Event, ComponentState, Params, ComponentEvent>;
|
|
405
|
+
};
|
|
406
|
+
/**
|
|
407
|
+
* Creates a `Component` — a self-contained UI unit with its own managed state.
|
|
408
|
+
*
|
|
409
|
+
* The simple overload `component(view, initialState, css?)` is for components
|
|
410
|
+
* that do not accept external configuration. The params overload
|
|
411
|
+
* `component(view, initialStateFactory, params, css?)` is for components that
|
|
412
|
+
* accept a `Params` value from their parent, which is passed to both `view` and
|
|
413
|
+
* the initial-state factory on mount.
|
|
414
|
+
*
|
|
415
|
+
* The runtime calls `view(state, params)` whenever state changes and diffs the
|
|
416
|
+
* result against the previous virtual DOM to update the browser.
|
|
417
|
+
*
|
|
418
|
+
* @param css Optional scoped CSS string (or a function of params returning one)
|
|
419
|
+
* that is injected into a `<style>` element inside the component's shadow root.
|
|
420
|
+
*/
|
|
421
|
+
declare function component<State, Event>(view: (state: State) => Node<State, Event> | NodeGroup<State, Event>, initialState: State | Effect<State, Event, State>, css?: string): Component<State, void, Event>;
|
|
422
|
+
declare function component<State, Params, Event>(view: (state: State, params: Params) => Node<State, Event> | NodeGroup<State, Event>, initialState: (params: Params) => State | Effect<State, Event, State>, params: Params, css?: string | ((params: Params) => string)): Component<State, Params, Event>;
|
|
423
|
+
|
|
424
|
+
/** Type guard that returns true when `effectOrState` is a plain state value rather than an `Effect`. */
|
|
425
|
+
declare function isState<State>(effectOrState: Effect<State, never, State> | State): effectOrState is State;
|
|
426
|
+
/** Converts a plain view function and initial state into a `Component`. Used internally by `manageApplication`; prefer `component()` from `ctrl-fx/dom` in application code. */
|
|
427
|
+
declare function toComponent<State>(app: (state: State) => Node<State, never> | NodeGroup<State, never>, initialState: State | Effect<State, never, State>): Component<State, void, never>;
|
|
428
|
+
/**
|
|
429
|
+
* Mounts a ctrl-fx application into the DOM element with id `mountId` and starts the runtime.
|
|
430
|
+
* Returns a `dispatchEffect` handle for triggering effects from outside the framework
|
|
431
|
+
* (e.g. from a service worker message).
|
|
432
|
+
* @param mountId The id of the mount element. Defaults to `'app'`.
|
|
433
|
+
*/
|
|
434
|
+
declare function manageApplication<State>(app: (state: State) => Node<State, never> | NodeGroup<State, never>, initialState: State | Effect<State, never, State>, mountId?: string): {
|
|
435
|
+
dispatchEffect: (effect: Effect<State, never, void>) => void;
|
|
436
|
+
};
|
|
437
|
+
/** Width and height in pixels, as reported by a resize observer. */
|
|
438
|
+
type Dimensions = {
|
|
439
|
+
width: number;
|
|
440
|
+
height: number;
|
|
441
|
+
};
|
|
442
|
+
/** The browser permission state for a feature such as notifications. */
|
|
443
|
+
interface Permission {
|
|
444
|
+
value: 'default' | 'granted' | 'denied';
|
|
445
|
+
/** Returns true when the permission has been explicitly granted. */
|
|
446
|
+
isGranted(): boolean;
|
|
447
|
+
/** Returns true when the user has not yet been prompted. */
|
|
448
|
+
isDefault(): boolean;
|
|
449
|
+
/** Returns true when the permission has been explicitly denied. */
|
|
450
|
+
isDenied(): boolean;
|
|
451
|
+
}
|
|
452
|
+
/** Constructs a `Permission` value from a raw browser permission string. */
|
|
453
|
+
declare function permission(value: 'default' | 'granted' | 'denied'): Permission;
|
|
454
|
+
/** A branded string containing a UUID v4. */
|
|
455
|
+
type Uuid = string & {
|
|
456
|
+
__brand: 'Uuid';
|
|
457
|
+
};
|
|
458
|
+
/** Deterministically derives a UUID-shaped string from `input` by hashing it. Useful for generating stable node identifiers from content. */
|
|
459
|
+
declare function uuidFromString(input: string): Uuid;
|
|
460
|
+
|
|
461
|
+
type Alert = {
|
|
462
|
+
_type: 'Alert';
|
|
463
|
+
input: any;
|
|
464
|
+
};
|
|
465
|
+
type Async<State, Event> = {
|
|
466
|
+
_type: 'Async';
|
|
467
|
+
input: {
|
|
468
|
+
effect: Effect<State, Event, void>;
|
|
469
|
+
delayInMillis: number;
|
|
470
|
+
};
|
|
471
|
+
};
|
|
472
|
+
type CancelTask = {
|
|
473
|
+
_type: 'CancelTask';
|
|
474
|
+
input: TaskId;
|
|
475
|
+
};
|
|
476
|
+
type ClearAppBadge = {
|
|
477
|
+
_type: 'ClearAppBadge';
|
|
478
|
+
input: void;
|
|
479
|
+
};
|
|
480
|
+
type ReadClipboard = {
|
|
481
|
+
_type: 'ReadClipboard';
|
|
482
|
+
input: void;
|
|
483
|
+
};
|
|
484
|
+
type WriteClipboard = {
|
|
485
|
+
_type: 'WriteClipboard';
|
|
486
|
+
input: string;
|
|
487
|
+
};
|
|
488
|
+
type SetAppBadge = {
|
|
489
|
+
_type: 'SetAppBadge';
|
|
490
|
+
input: number;
|
|
491
|
+
};
|
|
492
|
+
type SetDocumentTitle = {
|
|
493
|
+
_type: 'SetDocumentTitle';
|
|
494
|
+
input: string;
|
|
495
|
+
};
|
|
496
|
+
type Confirm = {
|
|
497
|
+
_type: 'Confirm';
|
|
498
|
+
input: string;
|
|
499
|
+
};
|
|
500
|
+
type FireEvent<Event> = {
|
|
501
|
+
_type: 'FireEvent';
|
|
502
|
+
input: Event;
|
|
503
|
+
};
|
|
504
|
+
type GenerateUuid = {
|
|
505
|
+
_type: 'GenerateUuid';
|
|
506
|
+
input: void;
|
|
507
|
+
};
|
|
508
|
+
type GetNotificationPermission = {
|
|
509
|
+
_type: 'GetNotificationPermission';
|
|
510
|
+
input: void;
|
|
511
|
+
};
|
|
512
|
+
type RequestNotificationPermission = {
|
|
513
|
+
_type: 'RequestNotificationPermission';
|
|
514
|
+
input: void;
|
|
515
|
+
};
|
|
516
|
+
type GetLocation = {
|
|
517
|
+
_type: 'GetLocation';
|
|
518
|
+
input: void;
|
|
519
|
+
};
|
|
520
|
+
type GetState = {
|
|
521
|
+
_type: 'GetState';
|
|
522
|
+
input: void;
|
|
523
|
+
};
|
|
524
|
+
type GetTime = {
|
|
525
|
+
_type: 'GetTime';
|
|
526
|
+
input: void;
|
|
527
|
+
};
|
|
528
|
+
type GetRandom = {
|
|
529
|
+
_type: 'GetRandom';
|
|
530
|
+
input: void;
|
|
531
|
+
};
|
|
532
|
+
type Prompt = {
|
|
533
|
+
_type: 'Prompt';
|
|
534
|
+
input: {
|
|
535
|
+
message: string;
|
|
536
|
+
default: string | undefined;
|
|
537
|
+
};
|
|
538
|
+
};
|
|
539
|
+
type Log = {
|
|
540
|
+
_type: 'Log';
|
|
541
|
+
input: any;
|
|
542
|
+
};
|
|
543
|
+
type MakeHttpRequest = {
|
|
544
|
+
_type: 'MakeHttpRequest';
|
|
545
|
+
input: HttpRequest;
|
|
546
|
+
};
|
|
547
|
+
type OpenDatabase = {
|
|
548
|
+
_type: 'OpenDatabase';
|
|
549
|
+
input: {
|
|
550
|
+
db: DbName;
|
|
551
|
+
version: DbVersion;
|
|
552
|
+
setup: (oldVersion: DbVersion) => DbSetupEffect<void>;
|
|
553
|
+
};
|
|
554
|
+
};
|
|
555
|
+
type RunDbTransaction = {
|
|
556
|
+
_type: 'RunDbTransaction';
|
|
557
|
+
input: {
|
|
558
|
+
db: DbName;
|
|
559
|
+
objectStores: readonly ObjectStore[];
|
|
560
|
+
mode: 'readonly' | 'readwrite';
|
|
561
|
+
effect: DbEffect<void>;
|
|
562
|
+
};
|
|
563
|
+
};
|
|
564
|
+
type Product<State, Event, A, B> = {
|
|
565
|
+
_type: 'Product';
|
|
566
|
+
input: [Effect<State, Event, A>, Effect<State, Event, B>];
|
|
567
|
+
};
|
|
568
|
+
/** A branded string that uniquely identifies a scheduled task. */
|
|
569
|
+
type TaskId = string & {
|
|
570
|
+
__brand: 'TaskId';
|
|
571
|
+
};
|
|
572
|
+
/** Creates a typed TaskId from a plain string. */
|
|
573
|
+
declare function taskId(id: string): TaskId;
|
|
574
|
+
type ScheduleTask<State, Event> = {
|
|
575
|
+
_type: 'ScheduleTask';
|
|
576
|
+
input: {
|
|
577
|
+
task: Effect<State, Event, void>;
|
|
578
|
+
initialDelayInMillis: number;
|
|
579
|
+
repeatIntervalInMillis: number | undefined;
|
|
580
|
+
taskId: TaskId | undefined;
|
|
581
|
+
};
|
|
582
|
+
};
|
|
583
|
+
type SetTimeout = {
|
|
584
|
+
_type: 'SetTimeout';
|
|
585
|
+
input: number;
|
|
586
|
+
};
|
|
587
|
+
type UpdateState<State> = {
|
|
588
|
+
_type: 'UpdateState';
|
|
589
|
+
input: (state: State) => State;
|
|
590
|
+
};
|
|
591
|
+
type StorageTarget = 'local' | 'session';
|
|
592
|
+
type GetStorageItem = {
|
|
593
|
+
_type: 'GetStorageItem';
|
|
594
|
+
input: {
|
|
595
|
+
storage: StorageTarget;
|
|
596
|
+
key: string;
|
|
597
|
+
};
|
|
598
|
+
};
|
|
599
|
+
type Go = {
|
|
600
|
+
_type: 'Go';
|
|
601
|
+
input: number;
|
|
602
|
+
};
|
|
603
|
+
type PushState = {
|
|
604
|
+
_type: 'PushState';
|
|
605
|
+
input: InternalLocation;
|
|
606
|
+
};
|
|
607
|
+
type ReplaceState = {
|
|
608
|
+
_type: 'ReplaceState';
|
|
609
|
+
input: InternalLocation;
|
|
610
|
+
};
|
|
611
|
+
type SetStorageItem = {
|
|
612
|
+
_type: 'SetStorageItem';
|
|
613
|
+
input: {
|
|
614
|
+
storage: StorageTarget;
|
|
615
|
+
key: string;
|
|
616
|
+
value: string;
|
|
617
|
+
};
|
|
618
|
+
};
|
|
619
|
+
type RemoveStorageItem = {
|
|
620
|
+
_type: 'RemoveStorageItem';
|
|
621
|
+
input: {
|
|
622
|
+
storage: StorageTarget;
|
|
623
|
+
key: string;
|
|
624
|
+
};
|
|
625
|
+
};
|
|
626
|
+
type ClearStorage = {
|
|
627
|
+
_type: 'ClearStorage';
|
|
628
|
+
input: {
|
|
629
|
+
storage: StorageTarget;
|
|
630
|
+
};
|
|
631
|
+
};
|
|
632
|
+
type ScrollOptions = {
|
|
633
|
+
top?: number;
|
|
634
|
+
left?: number;
|
|
635
|
+
behavior?: 'smooth' | 'instant' | 'auto';
|
|
636
|
+
};
|
|
637
|
+
type ScrollWindow = {
|
|
638
|
+
_type: 'ScrollWindow';
|
|
639
|
+
input: ScrollOptions;
|
|
640
|
+
};
|
|
641
|
+
type ScrollElement = {
|
|
642
|
+
_type: 'ScrollElement';
|
|
643
|
+
input: {
|
|
644
|
+
selector: string;
|
|
645
|
+
options: ScrollOptions;
|
|
646
|
+
};
|
|
647
|
+
};
|
|
648
|
+
type DownloadInput = {
|
|
649
|
+
filename: string;
|
|
650
|
+
content: string;
|
|
651
|
+
contentType: string;
|
|
652
|
+
};
|
|
653
|
+
type Download = {
|
|
654
|
+
_type: 'Download';
|
|
655
|
+
input: DownloadInput;
|
|
656
|
+
};
|
|
657
|
+
type PostBroadcastMessage = {
|
|
658
|
+
_type: 'PostBroadcastMessage';
|
|
659
|
+
input: {
|
|
660
|
+
channel: string;
|
|
661
|
+
message: unknown;
|
|
662
|
+
};
|
|
663
|
+
};
|
|
664
|
+
type SubscribeToBroadcastChannel<State, Event> = {
|
|
665
|
+
_type: 'SubscribeToBroadcastChannel';
|
|
666
|
+
input: {
|
|
667
|
+
channel: string;
|
|
668
|
+
handler: (message: unknown) => Effect<State, Event, void>;
|
|
669
|
+
taskId: TaskId | undefined;
|
|
670
|
+
};
|
|
671
|
+
};
|
|
672
|
+
type CustomEffect<In, Out, Custom> = {
|
|
673
|
+
_type: 'CustomEffect';
|
|
674
|
+
input: {
|
|
675
|
+
args: In;
|
|
676
|
+
f: (args: In) => Out | Promise<Out>;
|
|
677
|
+
test: (args: In, data: Custom) => {
|
|
678
|
+
out: Out;
|
|
679
|
+
data: Custom;
|
|
680
|
+
};
|
|
681
|
+
};
|
|
682
|
+
};
|
|
683
|
+
/**
|
|
684
|
+
* Creates a factory for effects that call an external library function.
|
|
685
|
+
* Use this when you want to call a library whose logic would be too cumbersome
|
|
686
|
+
* to reimplement using built-in effects. In production `f` is called directly.
|
|
687
|
+
* In tests the `test` callback receives the arguments and a queue of scripted
|
|
688
|
+
* return values (`data`), and must return `{ out, data }` where `data` is the
|
|
689
|
+
* remaining queue after consuming one entry.
|
|
690
|
+
*
|
|
691
|
+
* @param f Production implementation. May return a Promise.
|
|
692
|
+
* @param test Test-time implementation. Receives the scripted data queue and
|
|
693
|
+
* returns `{ out, data }` — `out` is the value to return, `data` is the
|
|
694
|
+
* remaining queue. Provide scripted values via `newTestData(queue)`.
|
|
695
|
+
*/
|
|
696
|
+
declare function customEffect<State, Event, In, Out, Custom>(f: (args: In) => Out | Promise<Out>, test: (args: In, data: Custom) => {
|
|
697
|
+
out: Out;
|
|
698
|
+
data: Custom;
|
|
699
|
+
}): (args: In) => Effect<State, Event, Out>;
|
|
700
|
+
type Operation<State, Event> = Alert | Async<State, Event> | CancelTask | ClearAppBadge | ClearStorage | Confirm | CustomEffect<unknown, unknown, unknown> | Download | FireEvent<Event> | GetLocation | GetNotificationPermission | RequestNotificationPermission | PostBroadcastMessage | ReadClipboard | WriteClipboard | GenerateUuid | GetState | GetStorageItem | GetTime | GetRandom | Log | MakeHttpRequest | Go | OpenDatabase | Product<State, Event, unknown, unknown> | Prompt | PushState | ReplaceState | RemoveStorageItem | RunDbTransaction | ScheduleTask<State, Event> | ScrollElement | ScrollWindow | SetAppBadge | SetDocumentTitle | SetStorageItem | SetTimeout | SubscribeToBroadcastChannel<State, Event> | UpdateState<State>;
|
|
701
|
+
type Suspend<State, Event, A> = {
|
|
702
|
+
_type: 'Suspend';
|
|
703
|
+
operation: Operation<State, Event>;
|
|
704
|
+
/**
|
|
705
|
+
* Sequences this effect with another, passing its result to `f` to produce
|
|
706
|
+
* the next effect. Use this when the second effect depends on the value
|
|
707
|
+
* produced by the first. For independent sequencing use `and`.
|
|
708
|
+
*/
|
|
709
|
+
flatMap<B>(f: (a: A) => Effect<State, Event, B>): Effect<State, Event, B>;
|
|
710
|
+
/**
|
|
711
|
+
* Sequences this effect and `effect`, discarding this effect's result. Use
|
|
712
|
+
* this when you want both effects to run but the first result is not needed.
|
|
713
|
+
* For result-dependent sequencing use `flatMap`.
|
|
714
|
+
*/
|
|
715
|
+
and<B>(effect: Effect<State, Event, B>): Effect<State, Event, B>;
|
|
716
|
+
/** Transforms the result of this effect with `f`, without performing any additional effects. */
|
|
717
|
+
map<B>(f: (a: A) => B): Effect<State, Event, B>;
|
|
718
|
+
/** Replaces the result of this effect with `b`, discarding the original result. */
|
|
719
|
+
as<B>(b: B): Effect<State, Event, B>;
|
|
720
|
+
/** Discards the result, producing `Effect<State, Event, void>`. */
|
|
721
|
+
void(): Effect<State, Event, void>;
|
|
722
|
+
/** Passes this effect to `f` and returns the result. Useful for applying a function that takes an effect without breaking a method chain. */
|
|
723
|
+
apply<B>(f: (effect: Effect<State, Event, A>) => B): B;
|
|
724
|
+
};
|
|
725
|
+
type Return<State, Event, A> = {
|
|
726
|
+
_type: 'Return';
|
|
727
|
+
value: A;
|
|
728
|
+
/** @inheritDoc Suspend.flatMap */
|
|
729
|
+
flatMap<B>(f: (a: A) => Effect<State, Event, B>): Effect<State, Event, B>;
|
|
730
|
+
/** @inheritDoc Suspend.and */
|
|
731
|
+
and<B>(effect: Effect<State, Event, B>): Effect<State, Event, B>;
|
|
732
|
+
/** @inheritDoc Suspend.map */
|
|
733
|
+
map<B>(f: (a: A) => B): Effect<State, Event, B>;
|
|
734
|
+
/** @inheritDoc Suspend.as */
|
|
735
|
+
as<B>(b: B): Effect<State, Event, B>;
|
|
736
|
+
/** @inheritDoc Suspend.void */
|
|
737
|
+
void(): Effect<State, Event, void>;
|
|
738
|
+
/** @inheritDoc Suspend.apply */
|
|
739
|
+
apply<B>(f: (effect: Effect<State, Event, A>) => B): B;
|
|
740
|
+
};
|
|
741
|
+
type FlatMap<State, Event, A, B> = {
|
|
742
|
+
_type: 'FlatMap';
|
|
743
|
+
effect: Effect<State, Event, A>;
|
|
744
|
+
next: (a: A) => Effect<State, Event, B>;
|
|
745
|
+
/** @inheritDoc Suspend.flatMap */
|
|
746
|
+
flatMap<C>(f: (b: B) => Effect<State, Event, C>): Effect<State, Event, C>;
|
|
747
|
+
/** @inheritDoc Suspend.and */
|
|
748
|
+
and<C>(effect: Effect<State, Event, C>): Effect<State, Event, C>;
|
|
749
|
+
/** @inheritDoc Suspend.map */
|
|
750
|
+
map<C>(f: (b: B) => C): Effect<State, Event, C>;
|
|
751
|
+
/** @inheritDoc Suspend.as */
|
|
752
|
+
as<C>(c: C): Effect<State, Event, C>;
|
|
753
|
+
/** @inheritDoc Suspend.void */
|
|
754
|
+
void(): Effect<State, Event, void>;
|
|
755
|
+
/** @inheritDoc Suspend.apply */
|
|
756
|
+
apply<C>(f: (effect: Effect<State, Event, B>) => C): C;
|
|
757
|
+
};
|
|
758
|
+
/**
|
|
759
|
+
* A lazy, pure description of a side effect to be performed by the framework.
|
|
760
|
+
* An Effect is just a data structure — it does nothing until the framework
|
|
761
|
+
* interprets it. This means effects can be composed, transformed, and tested
|
|
762
|
+
* without executing any real side effects.
|
|
763
|
+
*
|
|
764
|
+
* `State` is the application state type the effect can read and update.
|
|
765
|
+
* `Event` is the component event type the effect can fire.
|
|
766
|
+
* `A` is the value the effect produces when it completes.
|
|
767
|
+
*/
|
|
768
|
+
type Effect<State, Event, A> = Suspend<State, Event, A> | Return<State, Event, A> | FlatMap<State, Event, any, A>;
|
|
769
|
+
/**
|
|
770
|
+
* Wraps a plain value in an Effect that completes immediately without performing any operations.
|
|
771
|
+
* Useful as a base case when building effects conditionally, or to lift a
|
|
772
|
+
* computed value into the Effect chain.
|
|
773
|
+
*/
|
|
774
|
+
declare function pure<State, Event, A>(value: A): Effect<State, Event, A>;
|
|
775
|
+
/** An effect describing a browser alert dialog. */
|
|
776
|
+
declare function alert<State, Event>(message: any): Effect<State, Event, void>;
|
|
777
|
+
/**
|
|
778
|
+
* An effect describing a browser confirm dialog.
|
|
779
|
+
* @returns true if confirmed
|
|
780
|
+
*/
|
|
781
|
+
declare function confirm<State, Event>(message: string): Effect<State, Event, boolean>;
|
|
782
|
+
/**
|
|
783
|
+
* An effect describing a browser prompt dialog.
|
|
784
|
+
* @returns the entered string, or null if cancelled
|
|
785
|
+
*/
|
|
786
|
+
declare function prompt<State, Event>(message: string, defaultValue?: string): Effect<State, Event, string | null>;
|
|
787
|
+
/** An effect describing a clear of the app badge on the browser/OS icon. */
|
|
788
|
+
declare function clearAppBadge<State, Event>(): Effect<State, Event, void>;
|
|
789
|
+
/** An effect describing a clipboard text read. */
|
|
790
|
+
declare function readClipboard<State, Event>(): Effect<State, Event, Result<string, ClipboardError>>;
|
|
791
|
+
/** An effect describing a clipboard write of `text`. */
|
|
792
|
+
declare function writeClipboard<State, Event>(text: string): Effect<State, Event, Result<void, ClipboardError>>;
|
|
793
|
+
/** An effect describing a `document.title` update. */
|
|
794
|
+
declare function setDocumentTitle<State, Event>(title: string): Effect<State, Event, void>;
|
|
795
|
+
/** An effect describing an app badge count update on the browser/OS icon. */
|
|
796
|
+
declare function setAppBadge<State, Event>(count: number): Effect<State, Event, void>;
|
|
797
|
+
/**
|
|
798
|
+
* An effect describing fire-and-forget async dispatch of `effect`.
|
|
799
|
+
* The chain continues without waiting for `effect` to complete.
|
|
800
|
+
* Use `scheduleTask` instead if you need cancellation or debounce/repeat behaviour.
|
|
801
|
+
*/
|
|
802
|
+
declare function async<State, Event>(effect: Effect<State, Event, void>, delayInMillis?: number): Effect<State, Event, void>;
|
|
803
|
+
/** An effect describing the cancellation of a previously scheduled task. */
|
|
804
|
+
declare function cancelTask<State, Event>(taskId: TaskId): Effect<State, Event, void>;
|
|
805
|
+
/**
|
|
806
|
+
* An effect describing a typed component event to be delivered to any `onEvent` listener
|
|
807
|
+
* registered by the parent that mounted this component. Has no effect when
|
|
808
|
+
* used in a top-level application (which has no parent).
|
|
809
|
+
*/
|
|
810
|
+
declare function fireEvent<State, Event>(event: Event): Effect<State, Event, void>;
|
|
811
|
+
/** An effect describing a UUID v4 generation. */
|
|
812
|
+
declare function generateUuid<State, Event>(): Effect<State, Event, Uuid>;
|
|
813
|
+
/** An effect describing a read of the current time. */
|
|
814
|
+
declare function getTime<State, Event>(): Effect<State, Event, Date>;
|
|
815
|
+
/** An effect describing a random number in [0, 1), equivalent to Math.random(). */
|
|
816
|
+
declare function getRandom<State, Event>(): Effect<State, Event, number>;
|
|
817
|
+
/** An effect describing a console log of `message`. */
|
|
818
|
+
declare function log<State, Event>(message: any): Effect<State, Event, void>;
|
|
819
|
+
/** An effect describing an HTTP request. */
|
|
820
|
+
declare function makeHttpRequest<State, Event>(request: HttpRequest): Effect<State, Event, Result<HttpResponse, RequestError | HttpError>>;
|
|
821
|
+
/** An effect describing a read of the current browser location. */
|
|
822
|
+
declare function getLocation<State, Event>(): Effect<State, Event, InternalLocation>;
|
|
823
|
+
/** An effect describing a read of the current notification permission state. */
|
|
824
|
+
declare function getNotificationPermission<State, Event>(): Effect<State, Event, Permission>;
|
|
825
|
+
/** An effect describing a notification permission request. */
|
|
826
|
+
declare function requestNotificationPermission<State, Event>(): Effect<State, Event, Permission>;
|
|
827
|
+
/**
|
|
828
|
+
* An effect describing a read of the current application state. Because state updates are
|
|
829
|
+
* themselves effects sequenced in order, the value produced reflects all
|
|
830
|
+
* `updateState` effects that appear earlier in the same effect chain.
|
|
831
|
+
*/
|
|
832
|
+
declare function getState<State, Event>(): Effect<State, Event, State>;
|
|
833
|
+
/**
|
|
834
|
+
* An effect describing two concurrent sub-effects, returning both results as a tuple `[A, B]`.
|
|
835
|
+
* Both effects share the same initial state snapshot; neither sees state
|
|
836
|
+
* changes made by the other. Use `flatMap` instead when the second effect
|
|
837
|
+
* must observe state updates from the first.
|
|
838
|
+
*/
|
|
839
|
+
declare function product<State, Event, A, B>(effectA: Effect<State, Event, A>, effectB: Effect<State, Event, B>): Effect<State, Event, [A, B]>;
|
|
840
|
+
/**
|
|
841
|
+
* An effect describing the scheduling of `task` to run after `initialDelayInMillis` milliseconds.
|
|
842
|
+
*
|
|
843
|
+
* If `taskId` is provided and a task with that id is already pending, the
|
|
844
|
+
* pending task is cancelled and replaced. This makes `scheduleTask` the
|
|
845
|
+
* idiomatic way to implement debouncing: use the same `taskId` on
|
|
846
|
+
* every keystroke and only the final one will fire.
|
|
847
|
+
*
|
|
848
|
+
* @param repeatIntervalInMillis If provided, the task repeats on this interval
|
|
849
|
+
* indefinitely after the initial delay. Cancel with `cancelTask`.
|
|
850
|
+
* @param taskId Stable identifier used to cancel-and-reschedule. Create one
|
|
851
|
+
* with `taskId('name')` and store it as a module-level constant.
|
|
852
|
+
* @returns The TaskId of the newly scheduled task.
|
|
853
|
+
*/
|
|
854
|
+
declare function scheduleTask<State, Event>(task: Effect<State, Event, void>, initialDelayInMillis: number, repeatIntervalInMillis: number | undefined, taskId: TaskId | undefined): Effect<State, Event, TaskId>;
|
|
855
|
+
/** An effect describing a delay of `delayInMilliseconds` ms before continuing the chain. */
|
|
856
|
+
declare function setTimeout<State, Event>(delayInMilliseconds: number): Effect<State, Event, void>;
|
|
857
|
+
/** An effect describing a state update via `f`. */
|
|
858
|
+
declare function updateState<State, Event>(f: (state: State) => State): Effect<State, Event, void>;
|
|
859
|
+
/** An effect describing an IndexedDB database open (or create), with `setup` applied for schema migrations. */
|
|
860
|
+
declare function openDatabase<State, Event>(db: DbName, version: DbVersion, setup: (oldVersion: DbVersion) => DbSetupEffect<void>): Effect<State, Event, Result<void, DbError>>;
|
|
861
|
+
/** An effect describing an IndexedDB transaction containing `effect`. */
|
|
862
|
+
declare function runDbTransaction<State, Event>(db: DbName, objectStores: readonly ObjectStore[], mode: 'readonly' | 'readwrite', effect: DbEffect<void>): Effect<State, Event, Result<void, DbError>>;
|
|
863
|
+
/** An effect describing a browser history navigation of `delta` steps. */
|
|
864
|
+
declare function go<State, Event>(delta: number): Effect<State, Event, void>;
|
|
865
|
+
/** An effect describing a `history.pushState` to `location`. */
|
|
866
|
+
declare function pushState<State, Event>(location: InternalLocation | string): Effect<State, Event, void>;
|
|
867
|
+
/** An effect describing a `history.replaceState` with `location`. */
|
|
868
|
+
declare function replaceState<State, Event>(location: InternalLocation | string): Effect<State, Event, void>;
|
|
869
|
+
/** An effect describing a localStorage read for `key`. */
|
|
870
|
+
declare function getLocalStorageItem<State, Event>(key: string): Effect<State, Event, string | null>;
|
|
871
|
+
/** An effect describing a localStorage write of `value` for `key`. */
|
|
872
|
+
declare function setLocalStorageItem<State, Event>(key: string, value: string): Effect<State, Event, void>;
|
|
873
|
+
/** An effect describing the removal of `key` from localStorage. */
|
|
874
|
+
declare function removeLocalStorageItem<State, Event>(key: string): Effect<State, Event, void>;
|
|
875
|
+
/** An effect describing a localStorage clear. */
|
|
876
|
+
declare function clearLocalStorage<State, Event>(): Effect<State, Event, void>;
|
|
877
|
+
/** An effect describing a sessionStorage read for `key`. */
|
|
878
|
+
declare function getSessionStorageItem<State, Event>(key: string): Effect<State, Event, string | null>;
|
|
879
|
+
/** An effect describing a sessionStorage write of `value` for `key`. */
|
|
880
|
+
declare function setSessionStorageItem<State, Event>(key: string, value: string): Effect<State, Event, void>;
|
|
881
|
+
/** An effect describing the removal of `key` from sessionStorage. */
|
|
882
|
+
declare function removeSessionStorageItem<State, Event>(key: string): Effect<State, Event, void>;
|
|
883
|
+
/** An effect describing a sessionStorage clear. */
|
|
884
|
+
declare function clearSessionStorage<State, Event>(): Effect<State, Event, void>;
|
|
885
|
+
/**
|
|
886
|
+
* Transforms the `Event` type of an effect by mapping each fired event through `f`.
|
|
887
|
+
* Used when composing components: a child component fires `EventA`, and the
|
|
888
|
+
* parent needs to convert those into its own `EventB` before wiring them up.
|
|
889
|
+
* You rarely need to call this directly — `ComponentElement.onEvent` handles it.
|
|
890
|
+
*/
|
|
891
|
+
declare function mapEvent<State, EventA, EventB, R>(effect: Effect<State, EventA, R>, f: (eventA: EventA) => EventB): Effect<State, EventB, R>;
|
|
892
|
+
/**
|
|
893
|
+
* Adapts an effect written against a sub-state `StateA` so it can run in a
|
|
894
|
+
* parent context with state `StateB`. The lens provides the `get`/`set`
|
|
895
|
+
* functions that translate between the two state shapes.
|
|
896
|
+
* Used when composing components whose effects operate on a slice of a larger state.
|
|
897
|
+
*/
|
|
898
|
+
declare function mapState<StateA, StateB, Event, R>(effect: Effect<StateA, Event, R>, lens: Lens<StateB, StateA>): Effect<StateB, Event, R>;
|
|
899
|
+
/** Returns true if `value` is an Effect. */
|
|
900
|
+
declare function isEffect(value: any): value is Effect<any, any, any>;
|
|
901
|
+
/** An effect describing a window scroll. */
|
|
902
|
+
declare function scrollWindow<State, Event>(options: ScrollOptions): Effect<State, Event, void>;
|
|
903
|
+
/** An effect describing a scroll of the element matching `selector`. */
|
|
904
|
+
declare function scrollElement<State, Event>(selector: string, options: ScrollOptions): Effect<State, Event, Result<void, ScrollElementError>>;
|
|
905
|
+
/** An effect describing a file download. */
|
|
906
|
+
declare function download<State, Event>(filename: string, content: string, contentType?: string): Effect<State, Event, void>;
|
|
907
|
+
/** An effect describing a BroadcastChannel message post. */
|
|
908
|
+
declare function postBroadcastMessage<State, Event>(channel: string, message: unknown): Effect<State, Event, void>;
|
|
909
|
+
/**
|
|
910
|
+
* An effect describing a BroadcastChannel subscription, with `handler` called for each message received.
|
|
911
|
+
* @returns a TaskId that can be used to cancel the subscription
|
|
912
|
+
*/
|
|
913
|
+
declare function subscribeToBroadcastChannel<State, Event>(channel: string, handler: (message: unknown) => Effect<State, Event, void>, taskId?: TaskId | undefined): Effect<State, Event, TaskId>;
|
|
914
|
+
/** An Effect that does nothing. */
|
|
915
|
+
declare function noop<State, Event>(): Effect<State, Event, void>;
|
|
916
|
+
/**
|
|
917
|
+
* Returns all built-in effect constructors with `State` and `Event` pre-applied.
|
|
918
|
+
* Call this once per module, passing your application's state and event types,
|
|
919
|
+
* and destructure the effects you need. This removes the need to repeat the
|
|
920
|
+
* type parameters at every call site.
|
|
921
|
+
*
|
|
922
|
+
* ```ts
|
|
923
|
+
* const { updateState, getTime, scheduleTask } = makeEffects<MyState, MyEvent>()
|
|
924
|
+
* ```
|
|
925
|
+
*/
|
|
926
|
+
declare function makeEffects<State, Event>(): {
|
|
927
|
+
alert: (message: any) => Effect<State, Event, void>;
|
|
928
|
+
confirm: (message: string) => Effect<State, Event, boolean>;
|
|
929
|
+
prompt: (message: string, defaultValue?: string) => Effect<State, Event, string | null>;
|
|
930
|
+
cancelTask: (taskId: TaskId) => Effect<State, Event, void>;
|
|
931
|
+
getLocation: () => Effect<State, Event, InternalLocation>;
|
|
932
|
+
getNotificationPermission: () => Effect<State, Event, Permission>;
|
|
933
|
+
requestNotificationPermission: () => Effect<State, Event, Permission>;
|
|
934
|
+
clearAppBadge: () => Effect<State, Event, void>;
|
|
935
|
+
readClipboard: () => Effect<State, Event, Result<string, ClipboardError>>;
|
|
936
|
+
setAppBadge: (count: number) => Effect<State, Event, void>;
|
|
937
|
+
setDocumentTitle: (title: string) => Effect<State, Event, void>;
|
|
938
|
+
writeClipboard: (text: string) => Effect<State, Event, Result<void, ClipboardError>>;
|
|
939
|
+
fireEvent: (event: Event) => Effect<State, Event, void>;
|
|
940
|
+
getState: () => Effect<State, Event, State>;
|
|
941
|
+
getTime: () => Effect<State, Event, Date>;
|
|
942
|
+
getRandom: () => Effect<State, Event, number>;
|
|
943
|
+
log: (message: any) => Effect<State, Event, void>;
|
|
944
|
+
makeHttpRequest: (request: HttpRequest) => Effect<State, Event, Result<HttpResponse, HttpError | RequestError>>;
|
|
945
|
+
scheduleTask: (task: Effect<State, Event, void>, initialDelayInMillis: number, repeatIntervalInMillis: number | undefined, taskId: TaskId | undefined) => Effect<State, Event, TaskId>;
|
|
946
|
+
setTimeout: (delayInMilliseconds: number) => Effect<State, Event, void>;
|
|
947
|
+
updateState: (f: (state: State) => State) => Effect<State, Event, void>;
|
|
948
|
+
pure<A>(a: A): Effect<State, Event, A>;
|
|
949
|
+
noop: () => Effect<State, Event, void>;
|
|
950
|
+
generateUuid: () => Effect<State, Event, Uuid>;
|
|
951
|
+
getJson: (uri: string) => Effect<State, Event, Result<Json, HttpError | RequestError | DecodingError>>;
|
|
952
|
+
go: (delta: number) => Effect<State, Event, void>;
|
|
953
|
+
scrollWindow: (options: ScrollOptions) => Effect<State, Event, void>;
|
|
954
|
+
scrollElement: (selector: string, options: ScrollOptions) => Effect<State, Event, Result<void, ScrollElementError>>;
|
|
955
|
+
download: (filename: string, content: string, contentType?: string) => Effect<State, Event, void>;
|
|
956
|
+
postBroadcastMessage: (channel: string, message: unknown) => Effect<State, Event, void>;
|
|
957
|
+
subscribeToBroadcastChannel: (channel: string, handler: (message: unknown) => Effect<State, Event, void>, taskId?: TaskId | undefined) => Effect<State, Event, TaskId>;
|
|
958
|
+
pushState: (location: InternalLocation | string) => Effect<State, Event, void>;
|
|
959
|
+
replaceState: (location: InternalLocation | string) => Effect<State, Event, void>;
|
|
960
|
+
getLocalStorageItem: (key: string) => Effect<State, Event, string | null>;
|
|
961
|
+
setLocalStorageItem: (key: string, value: string) => Effect<State, Event, void>;
|
|
962
|
+
removeLocalStorageItem: (key: string) => Effect<State, Event, void>;
|
|
963
|
+
clearLocalStorage: () => Effect<State, Event, void>;
|
|
964
|
+
getSessionStorageItem: (key: string) => Effect<State, Event, string | null>;
|
|
965
|
+
setSessionStorageItem: (key: string, value: string) => Effect<State, Event, void>;
|
|
966
|
+
removeSessionStorageItem: (key: string) => Effect<State, Event, void>;
|
|
967
|
+
clearSessionStorage: () => Effect<State, Event, void>;
|
|
968
|
+
resultT<A, E>(effect: Effect<State, Event, Result<A, E>>): ResultTransformer<State, Event, A, E>;
|
|
969
|
+
};
|
|
970
|
+
/**
|
|
971
|
+
* Maps each element of `as` to an effect and runs them in sequence, collecting
|
|
972
|
+
* all results into an array. Each effect runs after the previous one completes,
|
|
973
|
+
* so state changes from earlier effects are visible to later ones.
|
|
974
|
+
*/
|
|
975
|
+
declare function traverse<State, Event, A, B>(as: readonly A[], f: (a: A) => Effect<State, Event, B>): Effect<State, Event, readonly B[]>;
|
|
976
|
+
/**
|
|
977
|
+
* Wraps an `Effect<State, Event, Result<A, E>>` to allow chaining on the
|
|
978
|
+
* success and error branches without manually unwrapping the `Result` at each
|
|
979
|
+
* step. Methods like `flatMap` and `errorFlatMap` short-circuit on the other
|
|
980
|
+
* branch. Call `.value` to get the underlying effect back.
|
|
981
|
+
*/
|
|
982
|
+
declare class ResultTransformer<State, Event, A, E> {
|
|
983
|
+
/** The underlying wrapped effect. */
|
|
984
|
+
readonly value: Effect<State, Event, Result<A, E>>;
|
|
985
|
+
constructor(value: Effect<State, Event, Result<A, E>>);
|
|
986
|
+
/** Transforms the success value. */
|
|
987
|
+
map<B>(f: (a: A) => B): ResultTransformer<State, Event, B, E>;
|
|
988
|
+
/** Replaces the success value with `b`. */
|
|
989
|
+
as<B>(b: B): ResultTransformer<State, Event, B, E>;
|
|
990
|
+
/** Discards the success value. */
|
|
991
|
+
void(): ResultTransformer<State, Event, void, E>;
|
|
992
|
+
/** Discards the error value. */
|
|
993
|
+
errorVoid(): ResultTransformer<State, Event, A, void>;
|
|
994
|
+
/** Chains on success, short-circuits on failure. */
|
|
995
|
+
flatMap<B>(f: (a: A) => Effect<State, Event, Result<B, E>>): ResultTransformer<State, Event, B, E>;
|
|
996
|
+
/** Like `flatMap` but `f` returns an unwrapped Effect rather than an Effect of Result. */
|
|
997
|
+
semiFlatMap<B>(f: (a: A) => Effect<State, Event, B>): ResultTransformer<State, Event, B, E>;
|
|
998
|
+
/** Sequences on success, short-circuits on failure. */
|
|
999
|
+
and<B>(effect: Effect<State, Event, Result<B, E>>): ResultTransformer<State, Event, B, E>;
|
|
1000
|
+
/** Unwraps the Result, returning either the success value or the error. */
|
|
1001
|
+
merge(): Effect<State, Event, A | E>;
|
|
1002
|
+
/** Logs the error to the console without changing the Result. */
|
|
1003
|
+
logError(): ResultTransformer<State, Event, A, E>;
|
|
1004
|
+
/** Logs the error and converts it to void. */
|
|
1005
|
+
logAndDropError(): ResultTransformer<State, Event, A, void>;
|
|
1006
|
+
/** Transforms the error value. */
|
|
1007
|
+
errorMap<EE>(f: (error: E) => EE): ResultTransformer<State, Event, A, EE>;
|
|
1008
|
+
/** Chains on failure, short-circuits on success. */
|
|
1009
|
+
errorFlatMap<EE>(f: (error: E) => Effect<State, Event, EE>): ResultTransformer<State, Event, A, EE>;
|
|
1010
|
+
}
|
|
1011
|
+
/**
|
|
1012
|
+
* Lifts an `Effect<State, Event, Result<A, E>>` into a `ResultTransformer` for
|
|
1013
|
+
* chaining. Equivalent to `new ResultTransformer(effect)`.
|
|
1014
|
+
*/
|
|
1015
|
+
declare function resultT<State, Event, A, E>(effect: Effect<State, Event, Result<A, E>>): ResultTransformer<State, Event, A, E>;
|
|
1016
|
+
|
|
1017
|
+
interface SupportsApply {
|
|
1018
|
+
apply(f: (t: this) => this): this;
|
|
1019
|
+
applyIf(condition: boolean, f: (self: this) => this): this;
|
|
1020
|
+
}
|
|
1021
|
+
|
|
1022
|
+
type SvgGraphicElement<State, Event> = Circle<State, Event> | Ellipse<State, Event> | Image<State, Event> | Line<State, Event> | Polyline<State, Event> | Polygon<State, Event> | Path<State, Event> | Rect<State, Event> | Use<State, Event>;
|
|
1023
|
+
interface Circle<State, Event> extends VoidElement<State, Event, 'svg/circle'> {
|
|
1024
|
+
}
|
|
1025
|
+
interface Ellipse<State, Event> extends VoidElement<State, Event, 'svg/ellipse'> {
|
|
1026
|
+
}
|
|
1027
|
+
interface Image<State, Event> extends VoidElement<State, Event, 'svg/image'> {
|
|
1028
|
+
}
|
|
1029
|
+
interface Line<State, Event> extends VoidElement<State, Event, 'svg/line'> {
|
|
1030
|
+
}
|
|
1031
|
+
interface Polyline<State, Event> extends VoidElement<State, Event, 'svg/polyline'> {
|
|
1032
|
+
}
|
|
1033
|
+
interface Polygon<State, Event> extends VoidElement<State, Event, 'svg/polygon'> {
|
|
1034
|
+
}
|
|
1035
|
+
interface Path<State, Event> extends VoidElement<State, Event, 'svg/path'> {
|
|
1036
|
+
}
|
|
1037
|
+
interface Rect<State, Event> extends VoidElement<State, Event, 'svg/rect'> {
|
|
1038
|
+
}
|
|
1039
|
+
interface Use<State, Event> extends VoidElement<State, Event, 'svg/use'> {
|
|
1040
|
+
}
|
|
1041
|
+
interface Svg<State, Event> extends NonVoidElement<State, Event, 'svg/svg', SvgGraphicElement<State, Event>> {
|
|
1042
|
+
}
|
|
1043
|
+
|
|
1044
|
+
/**
|
|
1045
|
+
* Base interface for all virtual DOM elements. Provides typed event handler methods that
|
|
1046
|
+
* each return `this`, so calls can be chained: `button_('Save').onClick(save).onFocus(highlight)`.
|
|
1047
|
+
*/
|
|
1048
|
+
interface BaseElement<State, Event, Tag> extends SupportsApply {
|
|
1049
|
+
readonly _type: 'Element';
|
|
1050
|
+
readonly tag: Tag;
|
|
1051
|
+
readonly nodeId?: NodeId;
|
|
1052
|
+
readonly attrs: readonly Attr[];
|
|
1053
|
+
readonly props: readonly Prop[];
|
|
1054
|
+
readonly eventListeners: readonly EventListener<State, Event>[];
|
|
1055
|
+
onClick(effect: Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1056
|
+
onDblClick(effect: Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1057
|
+
onFocus(effect: Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1058
|
+
onBlur(effect: Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1059
|
+
onChange(f: (data: ChangeData) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1060
|
+
onTextInput(f: (textState: TextState) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1061
|
+
onKeyDown(effect: (key: KeyData) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1062
|
+
onKeyUp(effect: (key: KeyData) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1063
|
+
onMouseEnter(effect: Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1064
|
+
onMouseLeave(effect: Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1065
|
+
onMouseMove(f: (data: MouseMoveData) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1066
|
+
onScroll(f: (data: ScrollData) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1067
|
+
onScrollEnd(f: (data: ScrollData) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1068
|
+
onWheel(f: (data: WheelData) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1069
|
+
onTouchStart(effect: (touchData: readonly TouchData[]) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1070
|
+
onTouchMove(effect: (touchData: readonly TouchData[]) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1071
|
+
onTouchEnd(effect: (touchData: readonly TouchData[]) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1072
|
+
onTouchCancel(effect: (touchData: readonly TouchData[]) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1073
|
+
onEvent(eventName: string, effect: (detail: unknown) => Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1074
|
+
onSubmit(effect: Effect<State, Event, EventListenerResult>, options?: EventOptions): this;
|
|
1075
|
+
prop(name: string, value: unknown): this;
|
|
1076
|
+
}
|
|
1077
|
+
/** A virtual DOM element that cannot have children (e.g. `br`, `hr`, `img`, `input`). */
|
|
1078
|
+
interface VoidElement<State, Event, Tag> extends BaseElement<State, Event, Tag> {
|
|
1079
|
+
}
|
|
1080
|
+
/** A virtual DOM element with typed children. */
|
|
1081
|
+
interface NonVoidElement<State, Event, Tag, Children> extends BaseElement<State, Event, Tag> {
|
|
1082
|
+
readonly children: readonly Children[];
|
|
1083
|
+
}
|
|
1084
|
+
type ButtonContent<State, Event> = NonVoidInlineElement<State, Event> | string | Svg<State, Event>;
|
|
1085
|
+
type Button<State, Event> = NonVoidElement<State, Event, 'button', ButtonContent<State, Event>>;
|
|
1086
|
+
type Div<State, Event> = NonVoidElement<State, Event, 'div', FlowContent<State, Event>>;
|
|
1087
|
+
type H1<State, Event> = NonVoidElement<State, Event, 'h1', FlowContent<State, Event>>;
|
|
1088
|
+
type H2<State, Event> = NonVoidElement<State, Event, 'h2', FlowContent<State, Event>>;
|
|
1089
|
+
type H3<State, Event> = NonVoidElement<State, Event, 'h3', FlowContent<State, Event>>;
|
|
1090
|
+
type H4<State, Event> = NonVoidElement<State, Event, 'h4', FlowContent<State, Event>>;
|
|
1091
|
+
type H5<State, Event> = NonVoidElement<State, Event, 'h5', FlowContent<State, Event>>;
|
|
1092
|
+
type H6<State, Event> = NonVoidElement<State, Event, 'h6', FlowContent<State, Event>>;
|
|
1093
|
+
type Header<State, Event> = NonVoidElement<State, Event, 'header', FlowContent<State, Event>>;
|
|
1094
|
+
type Li<State, Event> = NonVoidElement<State, Event, 'li', FlowContent<State, Event>>;
|
|
1095
|
+
type Main<State, Event> = NonVoidElement<State, Event, 'main', FlowContent<State, Event>>;
|
|
1096
|
+
type Nav<State, Event> = NonVoidElement<State, Event, 'nav', FlowContent<State, Event>>;
|
|
1097
|
+
type Ol<State, Event> = NonVoidElement<State, Event, 'ol', Li<State, Event>>;
|
|
1098
|
+
type P<State, Event> = NonVoidElement<State, Event, 'p', FlowContent<State, Event>>;
|
|
1099
|
+
type Ul<State, Event> = NonVoidElement<State, Event, 'ul', Li<State, Event>>;
|
|
1100
|
+
type Address<State, Event> = NonVoidElement<State, Event, 'address', FlowContent<State, Event>>;
|
|
1101
|
+
type Article<State, Event> = NonVoidElement<State, Event, 'article', FlowContent<State, Event>>;
|
|
1102
|
+
type Aside<State, Event> = NonVoidElement<State, Event, 'aside', FlowContent<State, Event>>;
|
|
1103
|
+
type Blockquote<State, Event> = NonVoidElement<State, Event, 'blockquote', FlowContent<State, Event>>;
|
|
1104
|
+
type Dd<State, Event> = NonVoidElement<State, Event, 'dd', FlowContent<State, Event>>;
|
|
1105
|
+
type Details<State, Event> = NonVoidElement<State, Event, 'details', FlowContent<State, Event>>;
|
|
1106
|
+
type Dt<State, Event> = NonVoidElement<State, Event, 'dt', PhrasingContent<State, Event>>;
|
|
1107
|
+
type Dl<State, Event> = NonVoidElement<State, Event, 'dl', Dt<State, Event> | Dd<State, Event>>;
|
|
1108
|
+
type Fieldset<State, Event> = NonVoidElement<State, Event, 'fieldset', FlowContent<State, Event>>;
|
|
1109
|
+
type Figcaption<State, Event> = NonVoidElement<State, Event, 'figcaption', FlowContent<State, Event>>;
|
|
1110
|
+
type Figure<State, Event> = NonVoidElement<State, Event, 'figure', FlowContent<State, Event>>;
|
|
1111
|
+
type Footer<State, Event> = NonVoidElement<State, Event, 'footer', FlowContent<State, Event>>;
|
|
1112
|
+
type Form<State, Event> = NonVoidElement<State, Event, 'form', FlowContent<State, Event>>;
|
|
1113
|
+
type Hr<State, Event> = VoidElement<State, Event, 'hr'>;
|
|
1114
|
+
type Pre<State, Event> = NonVoidElement<State, Event, 'pre', PhrasingContent<State, Event>>;
|
|
1115
|
+
type Section<State, Event> = NonVoidElement<State, Event, 'section', FlowContent<State, Event>>;
|
|
1116
|
+
type Summary<State, Event> = NonVoidElement<State, Event, 'summary', PhrasingContent<State, Event>>;
|
|
1117
|
+
type Td<State, Event> = NonVoidElement<State, Event, 'td', FlowContent<State, Event>>;
|
|
1118
|
+
type Th<State, Event> = NonVoidElement<State, Event, 'th', FlowContent<State, Event>>;
|
|
1119
|
+
type Tr<State, Event> = NonVoidElement<State, Event, 'tr', Th<State, Event> | Td<State, Event>>;
|
|
1120
|
+
type Tbody<State, Event> = NonVoidElement<State, Event, 'tbody', Tr<State, Event>>;
|
|
1121
|
+
type Tfoot<State, Event> = NonVoidElement<State, Event, 'tfoot', Tr<State, Event>>;
|
|
1122
|
+
type Thead<State, Event> = NonVoidElement<State, Event, 'thead', Tr<State, Event>>;
|
|
1123
|
+
type Table<State, Event> = NonVoidElement<State, Event, 'table', Thead<State, Event> | Tbody<State, Event> | Tfoot<State, Event> | Tr<State, Event>>;
|
|
1124
|
+
type BlockElement<State, Event> = Address<State, Event> | Article<State, Event> | Aside<State, Event> | Blockquote<State, Event> | Button<State, Event> | Dd<State, Event> | Details<State, Event> | Dl<State, Event> | Dt<State, Event> | Div<State, Event> | Fieldset<State, Event> | Figcaption<State, Event> | Figure<State, Event> | Footer<State, Event> | Form<State, Event> | H1<State, Event> | H2<State, Event> | H3<State, Event> | H4<State, Event> | H5<State, Event> | H6<State, Event> | Header<State, Event> | Hr<State, Event> | Li<State, Event> | Main<State, Event> | Nav<State, Event> | Ol<State, Event> | P<State, Event> | Pre<State, Event> | Section<State, Event> | Summary<State, Event> | Table<State, Event> | Tbody<State, Event> | Td<State, Event> | Tfoot<State, Event> | Th<State, Event> | Thead<State, Event> | Tr<State, Event> | Ul<State, Event>;
|
|
1125
|
+
type Br<State, Event> = VoidElement<State, Event, 'br'>;
|
|
1126
|
+
type Img<State, Event> = VoidElement<State, Event, 'img'>;
|
|
1127
|
+
type Input<State, Event> = VoidElement<State, Event, 'input'>;
|
|
1128
|
+
type VoidInlineElement<State, Event> = Br<State, Event> | Img<State, Event> | Input<State, Event>;
|
|
1129
|
+
type A<State, Event> = NonVoidElement<State, Event, 'a', FlowContent<State, Event>>;
|
|
1130
|
+
type Abbr<State, Event> = NonVoidElement<State, Event, 'abbr', PhrasingContent<State, Event>>;
|
|
1131
|
+
type B<State, Event> = NonVoidElement<State, Event, 'b', PhrasingContent<State, Event>>;
|
|
1132
|
+
type Cite<State, Event> = NonVoidElement<State, Event, 'cite', PhrasingContent<State, Event>>;
|
|
1133
|
+
type Code<State, Event> = NonVoidElement<State, Event, 'code', PhrasingContent<State, Event>>;
|
|
1134
|
+
type Em<State, Event> = NonVoidElement<State, Event, 'em', PhrasingContent<State, Event>>;
|
|
1135
|
+
type I<State, Event> = NonVoidElement<State, Event, 'i', PhrasingContent<State, Event>>;
|
|
1136
|
+
type Kbd<State, Event> = NonVoidElement<State, Event, 'kbd', PhrasingContent<State, Event>>;
|
|
1137
|
+
type Label<State, Event> = NonVoidElement<State, Event, 'label', PhrasingContent<State, Event>>;
|
|
1138
|
+
type Mark<State, Event> = NonVoidElement<State, Event, 'mark', PhrasingContent<State, Event>>;
|
|
1139
|
+
type Option<State, Event> = NonVoidElement<State, Event, 'option', string>;
|
|
1140
|
+
type Q<State, Event> = NonVoidElement<State, Event, 'q', PhrasingContent<State, Event>>;
|
|
1141
|
+
type S<State, Event> = NonVoidElement<State, Event, 's', PhrasingContent<State, Event>>;
|
|
1142
|
+
type Select<State, Event> = NonVoidElement<State, Event, 'select', Option<State, Event>>;
|
|
1143
|
+
type Small<State, Event> = NonVoidElement<State, Event, 'small', PhrasingContent<State, Event>>;
|
|
1144
|
+
type Span<State, Event> = NonVoidElement<State, Event, 'span', PhrasingContent<State, Event>>;
|
|
1145
|
+
type Strong<State, Event> = NonVoidElement<State, Event, 'strong', PhrasingContent<State, Event>>;
|
|
1146
|
+
type Sub<State, Event> = NonVoidElement<State, Event, 'sub', PhrasingContent<State, Event>>;
|
|
1147
|
+
type Sup<State, Event> = NonVoidElement<State, Event, 'sup', PhrasingContent<State, Event>>;
|
|
1148
|
+
type Textarea<State, Event> = NonVoidElement<State, Event, 'textarea', string>;
|
|
1149
|
+
type Time<State, Event> = NonVoidElement<State, Event, 'time', PhrasingContent<State, Event>>;
|
|
1150
|
+
type U<State, Event> = NonVoidElement<State, Event, 'u', PhrasingContent<State, Event>>;
|
|
1151
|
+
type NonVoidInlineElement<State, Event> = A<State, Event> | Abbr<State, Event> | B<State, Event> | Cite<State, Event> | Code<State, Event> | Em<State, Event> | I<State, Event> | Kbd<State, Event> | Label<State, Event> | Mark<State, Event> | Option<State, Event> | Q<State, Event> | S<State, Event> | Select<State, Event> | Small<State, Event> | Span<State, Event> | Strong<State, Event> | Sub<State, Event> | Sup<State, Event> | Textarea<State, Event> | Time<State, Event> | U<State, Event>;
|
|
1152
|
+
type InlineElement<State, Event> = VoidInlineElement<State, Event> | NonVoidInlineElement<State, Event>;
|
|
1153
|
+
type Element<State, Event> = BlockElement<State, Event> | InlineElement<State, Event> | ReplacedElement<State, Event> | SvgGraphicElement<State, Event>;
|
|
1154
|
+
type ReplacedElement<State, Event> = Svg<State, Event>;
|
|
1155
|
+
|
|
1156
|
+
/** A non-void element with an arbitrary tag name, for custom or non-standard HTML elements. */
|
|
1157
|
+
type CustomElement<State, Event> = NonVoidElement<State, Event, string, any>;
|
|
1158
|
+
/** Union of all node types valid in block-level (flow) positions. */
|
|
1159
|
+
type FlowContent<State, Event> = PhrasingContent<State, Event> | BlockElement<State, Event> | ReplacedElement<State, Event> | SvgGraphicElement<State, Event> | string | View<State, unknown, Event> | ComponentElement<any, any, any, any, any> | CustomElement<State, Event>;
|
|
1160
|
+
/** Union of inline elements and plain text nodes. */
|
|
1161
|
+
type PhrasingContent<State, Event> = InlineElement<State, Event> | string;
|
|
1162
|
+
/** Union of all virtual DOM node types: elements, text, views, and component instances. */
|
|
1163
|
+
type Node<State, Event> = Element<State, Event> | string | View<State, unknown, Event> | ComponentElement<any, any, any, any, any> | CustomElement<State, Event>;
|
|
1164
|
+
type NonTextNode<State, Event> = Exclude<Node<State, Event>, string>;
|
|
1165
|
+
/**
|
|
1166
|
+
* Factory that returns all HTML and SVG element builders with `State` and `Event` pre-applied.
|
|
1167
|
+
*
|
|
1168
|
+
* Each element comes in three forms:
|
|
1169
|
+
* - `div(...attrs)(...children)` — full curried form, accepts attributes then children
|
|
1170
|
+
* - `div_(...children)` — no-attribute shorthand, equivalent to `div()(...)`
|
|
1171
|
+
* - `div__(...attrs)` — no-children shorthand, equivalent to `div(...)()`
|
|
1172
|
+
*
|
|
1173
|
+
* Call `makeDom<State, Event>()` once at the top of your module and destructure the elements you need:
|
|
1174
|
+
* ```ts
|
|
1175
|
+
* const { div_, span_, button } = makeDom<State, Event>()
|
|
1176
|
+
* ```
|
|
1177
|
+
*/
|
|
1178
|
+
declare function makeDom<State, Event>(): {
|
|
1179
|
+
a_: (...children: readonly FlowContent<State, Event>[]) => A<State, Event>;
|
|
1180
|
+
a__: (...attrs: AttrArg[]) => A<State, Event>;
|
|
1181
|
+
abbr_: (...children: readonly PhrasingContent<State, Event>[]) => Abbr<State, Event>;
|
|
1182
|
+
abbr__: (...attrs: AttrArg[]) => Abbr<State, Event>;
|
|
1183
|
+
address_: (...children: readonly FlowContent<State, Event>[]) => Address<State, Event>;
|
|
1184
|
+
address__: (...attrs: AttrArg[]) => Address<State, Event>;
|
|
1185
|
+
article_: (...children: readonly FlowContent<State, Event>[]) => Article<State, Event>;
|
|
1186
|
+
article__: (...attrs: AttrArg[]) => Article<State, Event>;
|
|
1187
|
+
aside_: (...children: readonly FlowContent<State, Event>[]) => Aside<State, Event>;
|
|
1188
|
+
aside__: (...attrs: AttrArg[]) => Aside<State, Event>;
|
|
1189
|
+
b_: (...children: readonly PhrasingContent<State, Event>[]) => B<State, Event>;
|
|
1190
|
+
b__: (...attrs: AttrArg[]) => B<State, Event>;
|
|
1191
|
+
blockquote_: (...children: readonly FlowContent<State, Event>[]) => Blockquote<State, Event>;
|
|
1192
|
+
blockquote__: (...attrs: AttrArg[]) => Blockquote<State, Event>;
|
|
1193
|
+
button_: (...children: readonly ButtonContent<State, Event>[]) => Button<State, Event>;
|
|
1194
|
+
button__: (...attrs: AttrArg[]) => Button<State, Event>;
|
|
1195
|
+
cite_: (...children: readonly PhrasingContent<State, Event>[]) => Cite<State, Event>;
|
|
1196
|
+
cite__: (...attrs: AttrArg[]) => Cite<State, Event>;
|
|
1197
|
+
code_: (...children: readonly PhrasingContent<State, Event>[]) => Code<State, Event>;
|
|
1198
|
+
code__: (...attrs: AttrArg[]) => Code<State, Event>;
|
|
1199
|
+
dd_: (...children: readonly FlowContent<State, Event>[]) => Dd<State, Event>;
|
|
1200
|
+
dd__: (...attrs: AttrArg[]) => Dd<State, Event>;
|
|
1201
|
+
details_: (...children: readonly FlowContent<State, Event>[]) => Details<State, Event>;
|
|
1202
|
+
details__: (...attrs: AttrArg[]) => Details<State, Event>;
|
|
1203
|
+
div_: (...children: readonly FlowContent<State, Event>[]) => Div<State, Event>;
|
|
1204
|
+
div__: (...attrs: AttrArg[]) => Div<State, Event>;
|
|
1205
|
+
dl_: (...children: readonly (Dd<State, Event> | Dt<State, Event>)[]) => Dl<State, Event>;
|
|
1206
|
+
dl__: (...attrs: AttrArg[]) => Dl<State, Event>;
|
|
1207
|
+
dt_: (...children: readonly PhrasingContent<State, Event>[]) => Dt<State, Event>;
|
|
1208
|
+
dt__: (...attrs: AttrArg[]) => Dt<State, Event>;
|
|
1209
|
+
em_: (...children: readonly PhrasingContent<State, Event>[]) => Em<State, Event>;
|
|
1210
|
+
em__: (...attrs: AttrArg[]) => Em<State, Event>;
|
|
1211
|
+
fieldset_: (...children: readonly FlowContent<State, Event>[]) => Fieldset<State, Event>;
|
|
1212
|
+
fieldset__: (...attrs: AttrArg[]) => Fieldset<State, Event>;
|
|
1213
|
+
figcaption_: (...children: readonly FlowContent<State, Event>[]) => Figcaption<State, Event>;
|
|
1214
|
+
figcaption__: (...attrs: AttrArg[]) => Figcaption<State, Event>;
|
|
1215
|
+
figure_: (...children: readonly FlowContent<State, Event>[]) => Figure<State, Event>;
|
|
1216
|
+
figure__: (...attrs: AttrArg[]) => Figure<State, Event>;
|
|
1217
|
+
footer_: (...children: readonly FlowContent<State, Event>[]) => Footer<State, Event>;
|
|
1218
|
+
footer__: (...attrs: AttrArg[]) => Footer<State, Event>;
|
|
1219
|
+
form_: (...children: readonly FlowContent<State, Event>[]) => Form<State, Event>;
|
|
1220
|
+
form__: (...attrs: AttrArg[]) => Form<State, Event>;
|
|
1221
|
+
h1_: (...children: readonly FlowContent<State, Event>[]) => H1<State, Event>;
|
|
1222
|
+
h1__: (...attrs: AttrArg[]) => H1<State, Event>;
|
|
1223
|
+
h2_: (...children: readonly FlowContent<State, Event>[]) => H2<State, Event>;
|
|
1224
|
+
h2__: (...attrs: AttrArg[]) => H2<State, Event>;
|
|
1225
|
+
h3_: (...children: readonly FlowContent<State, Event>[]) => H3<State, Event>;
|
|
1226
|
+
h3__: (...attrs: AttrArg[]) => H3<State, Event>;
|
|
1227
|
+
h4_: (...children: readonly FlowContent<State, Event>[]) => H4<State, Event>;
|
|
1228
|
+
h4__: (...attrs: AttrArg[]) => H4<State, Event>;
|
|
1229
|
+
h5_: (...children: readonly FlowContent<State, Event>[]) => H5<State, Event>;
|
|
1230
|
+
h5__: (...attrs: AttrArg[]) => H5<State, Event>;
|
|
1231
|
+
h6_: (...children: readonly FlowContent<State, Event>[]) => H6<State, Event>;
|
|
1232
|
+
h6__: (...attrs: AttrArg[]) => H6<State, Event>;
|
|
1233
|
+
header_: (...children: readonly FlowContent<State, Event>[]) => Header<State, Event>;
|
|
1234
|
+
header__: (...attrs: AttrArg[]) => Header<State, Event>;
|
|
1235
|
+
i_: (...children: readonly PhrasingContent<State, Event>[]) => I<State, Event>;
|
|
1236
|
+
i__: (...attrs: AttrArg[]) => I<State, Event>;
|
|
1237
|
+
kbd_: (...children: readonly PhrasingContent<State, Event>[]) => Kbd<State, Event>;
|
|
1238
|
+
kbd__: (...attrs: AttrArg[]) => Kbd<State, Event>;
|
|
1239
|
+
label_: (...children: readonly PhrasingContent<State, Event>[]) => Label<State, Event>;
|
|
1240
|
+
label__: (...attrs: AttrArg[]) => Label<State, Event>;
|
|
1241
|
+
li_: (...children: readonly FlowContent<State, Event>[]) => Li<State, Event>;
|
|
1242
|
+
li__: (...attrs: AttrArg[]) => Li<State, Event>;
|
|
1243
|
+
main_: (...children: readonly FlowContent<State, Event>[]) => Main<State, Event>;
|
|
1244
|
+
main__: (...attrs: AttrArg[]) => Main<State, Event>;
|
|
1245
|
+
mark_: (...children: readonly PhrasingContent<State, Event>[]) => Mark<State, Event>;
|
|
1246
|
+
mark__: (...attrs: AttrArg[]) => Mark<State, Event>;
|
|
1247
|
+
nav_: (...children: readonly FlowContent<State, Event>[]) => Nav<State, Event>;
|
|
1248
|
+
nav__: (...attrs: AttrArg[]) => Nav<State, Event>;
|
|
1249
|
+
ol_: (...children: readonly Li<State, Event>[]) => Ol<State, Event>;
|
|
1250
|
+
ol__: (...attrs: AttrArg[]) => Ol<State, Event>;
|
|
1251
|
+
option_: (...children: readonly string[]) => Option<State, Event>;
|
|
1252
|
+
option__: (...attrs: AttrArg[]) => Option<State, Event>;
|
|
1253
|
+
p_: (...children: readonly FlowContent<State, Event>[]) => P<State, Event>;
|
|
1254
|
+
p__: (...attrs: AttrArg[]) => P<State, Event>;
|
|
1255
|
+
pre_: (...children: readonly PhrasingContent<State, Event>[]) => Pre<State, Event>;
|
|
1256
|
+
pre__: (...attrs: AttrArg[]) => Pre<State, Event>;
|
|
1257
|
+
q_: (...children: readonly PhrasingContent<State, Event>[]) => Q<State, Event>;
|
|
1258
|
+
q__: (...attrs: AttrArg[]) => Q<State, Event>;
|
|
1259
|
+
s_: (...children: readonly PhrasingContent<State, Event>[]) => S<State, Event>;
|
|
1260
|
+
s__: (...attrs: AttrArg[]) => S<State, Event>;
|
|
1261
|
+
section_: (...children: readonly FlowContent<State, Event>[]) => Section<State, Event>;
|
|
1262
|
+
section__: (...attrs: AttrArg[]) => Section<State, Event>;
|
|
1263
|
+
select_: (...children: readonly Option<State, Event>[]) => Select<State, Event>;
|
|
1264
|
+
select__: (...attrs: AttrArg[]) => Select<State, Event>;
|
|
1265
|
+
small_: (...children: readonly PhrasingContent<State, Event>[]) => Small<State, Event>;
|
|
1266
|
+
small__: (...attrs: AttrArg[]) => Small<State, Event>;
|
|
1267
|
+
span_: (...children: readonly PhrasingContent<State, Event>[]) => Span<State, Event>;
|
|
1268
|
+
span__: (...attrs: AttrArg[]) => Span<State, Event>;
|
|
1269
|
+
strong_: (...children: readonly PhrasingContent<State, Event>[]) => Strong<State, Event>;
|
|
1270
|
+
strong__: (...attrs: AttrArg[]) => Strong<State, Event>;
|
|
1271
|
+
sub_: (...children: readonly PhrasingContent<State, Event>[]) => Sub<State, Event>;
|
|
1272
|
+
sub__: (...attrs: AttrArg[]) => Sub<State, Event>;
|
|
1273
|
+
summary_: (...children: readonly PhrasingContent<State, Event>[]) => Summary<State, Event>;
|
|
1274
|
+
summary__: (...attrs: AttrArg[]) => Summary<State, Event>;
|
|
1275
|
+
sup_: (...children: readonly PhrasingContent<State, Event>[]) => Sup<State, Event>;
|
|
1276
|
+
sup__: (...attrs: AttrArg[]) => Sup<State, Event>;
|
|
1277
|
+
svg_: (...children: readonly SvgGraphicElement<State, Event>[]) => Svg<State, Event>;
|
|
1278
|
+
svg__: (...attrs: AttrArg[]) => Svg<State, Event>;
|
|
1279
|
+
table_: (...children: readonly (Tbody<State, Event> | Tfoot<State, Event> | Thead<State, Event> | Tr<State, Event>)[]) => Table<State, Event>;
|
|
1280
|
+
table__: (...attrs: AttrArg[]) => Table<State, Event>;
|
|
1281
|
+
tbody_: (...children: readonly Tr<State, Event>[]) => Tbody<State, Event>;
|
|
1282
|
+
tbody__: (...attrs: AttrArg[]) => Tbody<State, Event>;
|
|
1283
|
+
td_: (...children: readonly FlowContent<State, Event>[]) => Td<State, Event>;
|
|
1284
|
+
td__: (...attrs: AttrArg[]) => Td<State, Event>;
|
|
1285
|
+
textarea_: (...children: readonly PhrasingContent<State, Event>[]) => Textarea<State, Event>;
|
|
1286
|
+
textarea__: (...attrs: AttrArg[]) => Textarea<State, Event>;
|
|
1287
|
+
tfoot_: (...children: readonly Tr<State, Event>[]) => Tfoot<State, Event>;
|
|
1288
|
+
tfoot__: (...attrs: AttrArg[]) => Tfoot<State, Event>;
|
|
1289
|
+
th_: (...children: readonly FlowContent<State, Event>[]) => Th<State, Event>;
|
|
1290
|
+
th__: (...attrs: AttrArg[]) => Th<State, Event>;
|
|
1291
|
+
thead_: (...children: readonly Tr<State, Event>[]) => Thead<State, Event>;
|
|
1292
|
+
thead__: (...attrs: AttrArg[]) => Thead<State, Event>;
|
|
1293
|
+
time_: (...children: readonly PhrasingContent<State, Event>[]) => Time<State, Event>;
|
|
1294
|
+
time__: (...attrs: AttrArg[]) => Time<State, Event>;
|
|
1295
|
+
tr_: (...children: readonly (Td<State, Event> | Th<State, Event>)[]) => Tr<State, Event>;
|
|
1296
|
+
tr__: (...attrs: AttrArg[]) => Tr<State, Event>;
|
|
1297
|
+
u_: (...children: readonly PhrasingContent<State, Event>[]) => U<State, Event>;
|
|
1298
|
+
u__: (...attrs: AttrArg[]) => U<State, Event>;
|
|
1299
|
+
ul_: (...children: readonly Li<State, Event>[]) => Ul<State, Event>;
|
|
1300
|
+
ul__: (...attrs: AttrArg[]) => Ul<State, Event>;
|
|
1301
|
+
view<Params>(nodeId: NodeId | string, nodes: (params: Params) => NodeGroup<State, Event> | Node<State, Event>): (params: Params) => View<State, Params, Event>;
|
|
1302
|
+
componentElem<ComponentState, Params, ComponentEvent>(comp: Component<ComponentState, Params, ComponentEvent>, nodeId: NodeId, params?: Params): ComponentElement<State, Event, ComponentState, Params, ComponentEvent>;
|
|
1303
|
+
br: (...attrs: AttrOrNodeIdArgs) => Br<State, Event>;
|
|
1304
|
+
hr: (...attrs: AttrOrNodeIdArgs) => Hr<State, Event>;
|
|
1305
|
+
img: (...attrs: AttrOrNodeIdArgs) => Img<State, Event>;
|
|
1306
|
+
input: (...attrs: AttrOrNodeIdArgs) => Input<State, Event>;
|
|
1307
|
+
a: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => A<State, Event>;
|
|
1308
|
+
abbr: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Abbr<State, Event>;
|
|
1309
|
+
address: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Address<State, Event>;
|
|
1310
|
+
article: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Article<State, Event>;
|
|
1311
|
+
aside: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Aside<State, Event>;
|
|
1312
|
+
b: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => B<State, Event>;
|
|
1313
|
+
blockquote: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Blockquote<State, Event>;
|
|
1314
|
+
button: (...attrs: AttrOrNodeIdArgs) => (...children: readonly ButtonContent<State, Event>[]) => Button<State, Event>;
|
|
1315
|
+
cite: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Cite<State, Event>;
|
|
1316
|
+
code: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Code<State, Event>;
|
|
1317
|
+
dd: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Dd<State, Event>;
|
|
1318
|
+
details: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Details<State, Event>;
|
|
1319
|
+
div: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Div<State, Event>;
|
|
1320
|
+
dl: (...attrs: AttrOrNodeIdArgs) => (...children: readonly (Dd<State, Event> | Dt<State, Event>)[]) => Dl<State, Event>;
|
|
1321
|
+
dt: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Dt<State, Event>;
|
|
1322
|
+
em: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Em<State, Event>;
|
|
1323
|
+
fieldset: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Fieldset<State, Event>;
|
|
1324
|
+
figcaption: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Figcaption<State, Event>;
|
|
1325
|
+
figure: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Figure<State, Event>;
|
|
1326
|
+
footer: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Footer<State, Event>;
|
|
1327
|
+
form: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Form<State, Event>;
|
|
1328
|
+
h1: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => H1<State, Event>;
|
|
1329
|
+
h2: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => H2<State, Event>;
|
|
1330
|
+
h3: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => H3<State, Event>;
|
|
1331
|
+
h4: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => H4<State, Event>;
|
|
1332
|
+
h5: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => H5<State, Event>;
|
|
1333
|
+
h6: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => H6<State, Event>;
|
|
1334
|
+
header: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Header<State, Event>;
|
|
1335
|
+
i: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => I<State, Event>;
|
|
1336
|
+
kbd: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Kbd<State, Event>;
|
|
1337
|
+
label: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Label<State, Event>;
|
|
1338
|
+
li: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Li<State, Event>;
|
|
1339
|
+
main: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Main<State, Event>;
|
|
1340
|
+
mark: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Mark<State, Event>;
|
|
1341
|
+
nav: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Nav<State, Event>;
|
|
1342
|
+
ol: (...attrs: AttrOrNodeIdArgs) => (...children: readonly Li<State, Event>[]) => Ol<State, Event>;
|
|
1343
|
+
option: (...attrs: AttrOrNodeIdArgs) => (...children: readonly string[]) => Option<State, Event>;
|
|
1344
|
+
p: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => P<State, Event>;
|
|
1345
|
+
pre: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Pre<State, Event>;
|
|
1346
|
+
q: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Q<State, Event>;
|
|
1347
|
+
s: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => S<State, Event>;
|
|
1348
|
+
section: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Section<State, Event>;
|
|
1349
|
+
select: (...attrs: AttrOrNodeIdArgs) => (...children: readonly Option<State, Event>[]) => Select<State, Event>;
|
|
1350
|
+
small: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Small<State, Event>;
|
|
1351
|
+
span: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Span<State, Event>;
|
|
1352
|
+
strong: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Strong<State, Event>;
|
|
1353
|
+
sub: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Sub<State, Event>;
|
|
1354
|
+
summary: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Summary<State, Event>;
|
|
1355
|
+
sup: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Sup<State, Event>;
|
|
1356
|
+
table: (...attrs: AttrOrNodeIdArgs) => (...children: readonly (Tbody<State, Event> | Tfoot<State, Event> | Thead<State, Event> | Tr<State, Event>)[]) => Table<State, Event>;
|
|
1357
|
+
tbody: (...attrs: AttrOrNodeIdArgs) => (...children: readonly Tr<State, Event>[]) => Tbody<State, Event>;
|
|
1358
|
+
td: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Td<State, Event>;
|
|
1359
|
+
textarea: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Textarea<State, Event>;
|
|
1360
|
+
tfoot: (...attrs: AttrOrNodeIdArgs) => (...children: readonly Tr<State, Event>[]) => Tfoot<State, Event>;
|
|
1361
|
+
th: (...attrs: AttrOrNodeIdArgs) => (...children: readonly FlowContent<State, Event>[]) => Th<State, Event>;
|
|
1362
|
+
thead: (...attrs: AttrOrNodeIdArgs) => (...children: readonly Tr<State, Event>[]) => Thead<State, Event>;
|
|
1363
|
+
time: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => Time<State, Event>;
|
|
1364
|
+
tr: (...attrs: AttrOrNodeIdArgs) => (...children: readonly (Td<State, Event> | Th<State, Event>)[]) => Tr<State, Event>;
|
|
1365
|
+
u: (...attrs: AttrOrNodeIdArgs) => (...children: readonly PhrasingContent<State, Event>[]) => U<State, Event>;
|
|
1366
|
+
ul: (...attrs: AttrOrNodeIdArgs) => (...children: readonly Li<State, Event>[]) => Ul<State, Event>;
|
|
1367
|
+
svg: (...attrs: AttrOrNodeIdArgs) => (...children: readonly SvgGraphicElement<State, Event>[]) => Svg<State, Event>;
|
|
1368
|
+
circle: (...attrs: AttrOrNodeIdArgs) => Circle<State, Event>;
|
|
1369
|
+
ellipse: (...attrs: AttrOrNodeIdArgs) => Ellipse<State, Event>;
|
|
1370
|
+
image: (...attrs: AttrOrNodeIdArgs) => Image<State, Event>;
|
|
1371
|
+
line: (...attrs: AttrOrNodeIdArgs) => Line<State, Event>;
|
|
1372
|
+
polyline: (...attrs: AttrOrNodeIdArgs) => Polyline<State, Event>;
|
|
1373
|
+
polygon: (...attrs: AttrOrNodeIdArgs) => Polygon<State, Event>;
|
|
1374
|
+
path: (...attrs: AttrOrNodeIdArgs) => Path<State, Event>;
|
|
1375
|
+
rect: (...attrs: AttrOrNodeIdArgs) => Rect<State, Event>;
|
|
1376
|
+
use: (...attrs: AttrOrNodeIdArgs) => Use<State, Event>;
|
|
1377
|
+
element: (tag: string) => (...attrs: readonly (readonly [string, string] | NodeId)[]) => (...children: readonly FlowContent<State, Event>[]) => CustomElement<State, Event>;
|
|
1378
|
+
nodeGroup: (...nodes: Node<State, Event>[]) => NodeGroup<State, Event>;
|
|
1379
|
+
_: (...nodes: Node<State, Event>[]) => NodeGroup<State, Event>;
|
|
1380
|
+
fixedView: (id: NodeId | string) => (nodes: NodeGroup<State, Event> | Node<State, Event>) => View<State, void, Event>;
|
|
1381
|
+
};
|
|
1382
|
+
/** Pattern-matches over a `Node` value, calling the appropriate case handler and returning its result. */
|
|
1383
|
+
declare function foldNode<State, Event, A>(node: Node<State, Event>, cases: {
|
|
1384
|
+
onText: (text: string) => A;
|
|
1385
|
+
onVoidElement: (element: VoidElement<State, Event, string>) => A;
|
|
1386
|
+
onNonVoidElement: (element: NonVoidElement<State, Event, string, Node<State, Event>>) => A;
|
|
1387
|
+
onComponent: (component: ComponentElement<any, any, any, any, any>) => A;
|
|
1388
|
+
onView: (view: View<State, unknown, Event>) => A;
|
|
1389
|
+
}): A;
|
|
1390
|
+
|
|
1391
|
+
export { getRandom as $, type Attr as A, clearLocalStorage as B, type Component as C, type Dimensions as D, type Effect as E, type FlatMap as F, clearSessionStorage as G, type HttpRequest as H, type InternalLocation as I, Json as J, confirm as K, type Lens as L, type Method as M, type NodeGroup as N, customEffect as O, type Permission as P, type QueryParam as Q, type Result as R, type ScrollOptions as S, type TaskId as T, type Uuid as U, download as V, fireEvent as W, generateUuid as X, getLocalStorageItem as Y, getLocation as Z, getNotificationPermission as _, type EventActions as a, type Em as a$, getSessionStorageItem as a0, getState as a1, getTime as a2, go as a3, isEffect as a4, log as a5, makeEffects as a6, makeHttpRequest as a7, mapEvent as a8, mapState as a9, writeClipboard as aA, type A as aB, type Abbr as aC, type Address as aD, type Article as aE, type Aside as aF, type AttrArg as aG, type AttrOrNodeIdArgs as aH, type B as aI, type BlockElement as aJ, type Blockquote as aK, type Br as aL, type Button as aM, type ButtonContent as aN, type ChangeData as aO, type Circle as aP, type Cite as aQ, type Code as aR, type ComponentElement as aS, type CustomElement as aT, type Dd as aU, type Details as aV, type Div as aW, type Dl as aX, type Dt as aY, type Element as aZ, type Ellipse as a_, noop as aa, openDatabase as ab, postBroadcastMessage as ac, product as ad, prompt as ae, pure as af, pushState as ag, readClipboard as ah, removeLocalStorageItem as ai, removeSessionStorageItem as aj, replaceState as ak, requestNotificationPermission as al, resultT as am, runDbTransaction as an, scheduleTask as ao, scrollElement as ap, scrollWindow as aq, setAppBadge as ar, setDocumentTitle as as, setLocalStorageItem as at, setSessionStorageItem as au, setTimeout as av, subscribeToBroadcastChannel as aw, taskId as ax, traverse as ay, updateState as az, type HttpResponse as b, type Th as b$, type EventListenerResult as b0, type EventOptions as b1, type Fieldset as b2, type Figcaption as b3, type Figure as b4, type FlowContent as b5, type Footer as b6, type Form as b7, type H1 as b8, type H2 as b9, type Path as bA, type PhrasingContent as bB, type Polygon as bC, type Polyline as bD, type Pre as bE, type Prop as bF, type Q as bG, type Rect as bH, type ReplacedElement as bI, type S as bJ, type ScrollData as bK, type Section as bL, type Select as bM, type Small as bN, type Span as bO, type Strong as bP, type Sub as bQ, type Summary as bR, type Sup as bS, type Svg as bT, type SvgGraphicElement as bU, type Table as bV, type Tbody as bW, type Td as bX, type TextState as bY, type Textarea as bZ, type Tfoot as b_, type H3 as ba, type H4 as bb, type H5 as bc, type H6 as bd, type Header as be, type Hr as bf, type I as bg, type Image as bh, type Img as bi, type InlineElement as bj, type Input as bk, type Kbd as bl, type KeyData as bm, type Label as bn, type Li as bo, type Line as bp, type Main as bq, type Mark as br, type MouseMoveData as bs, type Nav as bt, type NodeId as bu, type NonTextNode as bv, type NonVoidElement as bw, type Ol as bx, type Option as by, type P as bz, type RequestError as c, type Thead as c0, type Time as c1, type TouchData as c2, type Tr as c3, type U as c4, type Ul as c5, type Use as c6, type View as c7, type VoidElement as c8, type WheelData as c9, attr as ca, component as cb, cssVars as cc, foldNode as cd, id as ce, makeDom as cf, nodeId as cg, preventDefault as ch, prop as ci, stopPropagation as cj, stopPropagationAndPreventDefault as ck, typeAttr as cl, type HttpError as d, type Node as e, type ClipboardError as f, type DecodingError as g, type DownloadInput as h, isState as i, type Fragment as j, type Headers as k, type Path$1 as l, manageApplication as m, ResponseBody as n, ResultTransformer as o, permission as p, type Return as q, type ScrollElementError as r, type StorageTarget as s, toComponent as t, uuidFromString as u, type Suspend as v, alert as w, async as x, cancelTask as y, clearAppBadge as z };
|