jotai-solid-api 1.0.0
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 +169 -0
- package/dist/index.d.ts +861 -0
- package/dist/index.d.ts.map +1 -0
- package/dist/index.js +1470 -0
- package/package.json +53 -0
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,861 @@
|
|
|
1
|
+
import * as React from "react";
|
|
2
|
+
type Cleanup = () => void;
|
|
3
|
+
/**
|
|
4
|
+
* Read-only reactive getter.
|
|
5
|
+
*
|
|
6
|
+
* @example
|
|
7
|
+
* ```ts
|
|
8
|
+
* const [count] = createSignal(1)
|
|
9
|
+
* const value: number = count()
|
|
10
|
+
* ```
|
|
11
|
+
*/
|
|
12
|
+
export type Accessor<T> = () => T;
|
|
13
|
+
/**
|
|
14
|
+
* Reactive setter that accepts either a value or updater function.
|
|
15
|
+
*
|
|
16
|
+
* @example
|
|
17
|
+
* ```ts
|
|
18
|
+
* const [, setCount] = createSignal(1)
|
|
19
|
+
* setCount((n) => n + 1)
|
|
20
|
+
* ```
|
|
21
|
+
*/
|
|
22
|
+
export type Setter<T> = (nextValue: T | ((prev: T) => T)) => T;
|
|
23
|
+
/**
|
|
24
|
+
* Setter shape compatible with Solid's `createSignal` setter.
|
|
25
|
+
*
|
|
26
|
+
* @example
|
|
27
|
+
* ```ts
|
|
28
|
+
* const set: SolidSetter<number> = (next) => next
|
|
29
|
+
* ```
|
|
30
|
+
*/
|
|
31
|
+
export type SolidSetter<T> = (nextValue: T | ((prev: T) => T)) => unknown;
|
|
32
|
+
/**
|
|
33
|
+
* Tuple shape compatible with Solid's signal pair.
|
|
34
|
+
*
|
|
35
|
+
* @example
|
|
36
|
+
* ```ts
|
|
37
|
+
* const pair: SolidSignal<number> = [() => 1, (next) => next]
|
|
38
|
+
* ```
|
|
39
|
+
*/
|
|
40
|
+
export type SolidSignal<T> = readonly [Accessor<T>, SolidSetter<T>];
|
|
41
|
+
/**
|
|
42
|
+
* Async resource lifecycle states.
|
|
43
|
+
*
|
|
44
|
+
* @example
|
|
45
|
+
* ```ts
|
|
46
|
+
* if (user.state() === "ready") {
|
|
47
|
+
* // render user
|
|
48
|
+
* }
|
|
49
|
+
* ```
|
|
50
|
+
*/
|
|
51
|
+
export type ResourceState = "unresolved" | "pending" | "ready" | "errored";
|
|
52
|
+
/**
|
|
53
|
+
* Read function for async resources with state metadata.
|
|
54
|
+
*
|
|
55
|
+
* @example
|
|
56
|
+
* ```ts
|
|
57
|
+
* const [user] = createResource(fetchUser)
|
|
58
|
+
* if (user.loading()) return "Loading"
|
|
59
|
+
* return user()?.name
|
|
60
|
+
* ```
|
|
61
|
+
*/
|
|
62
|
+
export type ResourceAccessor<T> = Accessor<T | undefined> & {
|
|
63
|
+
readonly loading: Accessor<boolean>;
|
|
64
|
+
readonly error: Accessor<unknown>;
|
|
65
|
+
readonly latest: Accessor<T | undefined>;
|
|
66
|
+
readonly state: Accessor<ResourceState>;
|
|
67
|
+
};
|
|
68
|
+
/**
|
|
69
|
+
* Imperative controls returned by {@link createResource}.
|
|
70
|
+
*
|
|
71
|
+
* @example
|
|
72
|
+
* ```ts
|
|
73
|
+
* const [, controls] = createResource(fetchUsers)
|
|
74
|
+
* controls.refetch()
|
|
75
|
+
* ```
|
|
76
|
+
*/
|
|
77
|
+
export type ResourceControls<T> = {
|
|
78
|
+
mutate: Setter<T | undefined>;
|
|
79
|
+
refetch: () => void;
|
|
80
|
+
};
|
|
81
|
+
/**
|
|
82
|
+
* Options for async resources.
|
|
83
|
+
*
|
|
84
|
+
* @example
|
|
85
|
+
* ```ts
|
|
86
|
+
* const [user] = createResource(fetchUser, { initialValue: cachedUser })
|
|
87
|
+
* ```
|
|
88
|
+
*/
|
|
89
|
+
export type ResourceOptions<T> = {
|
|
90
|
+
initialValue?: T;
|
|
91
|
+
};
|
|
92
|
+
/**
|
|
93
|
+
* Creates a writable signal.
|
|
94
|
+
*
|
|
95
|
+
* @param initialValue Initial value stored in the signal.
|
|
96
|
+
* @returns Tuple of `[getter, setter]`.
|
|
97
|
+
*
|
|
98
|
+
* @example
|
|
99
|
+
* ```ts
|
|
100
|
+
* const [count, setCount] = createSignal(0)
|
|
101
|
+
* setCount((n) => n + 1)
|
|
102
|
+
* ```
|
|
103
|
+
*/
|
|
104
|
+
export declare function createSignal<T>(initialValue: T): [Accessor<T>, Setter<T>];
|
|
105
|
+
/**
|
|
106
|
+
* Alias for {@link createSignal}.
|
|
107
|
+
*
|
|
108
|
+
* @example
|
|
109
|
+
* ```ts
|
|
110
|
+
* const [count, setCount] = signal(0)
|
|
111
|
+
* ```
|
|
112
|
+
*/
|
|
113
|
+
export declare const signal: typeof createSignal;
|
|
114
|
+
/**
|
|
115
|
+
* Adapts a Solid-compatible signal pair into this library's strict setter shape.
|
|
116
|
+
*
|
|
117
|
+
* @param solidSignal Signal tuple `[get, set]` from Solid or compatible runtimes.
|
|
118
|
+
* @returns Tuple `[get, set]` where `set` returns the current value.
|
|
119
|
+
*
|
|
120
|
+
* @example
|
|
121
|
+
* ```ts
|
|
122
|
+
* const [count, setCount] = fromSolidSignal(otherSignal)
|
|
123
|
+
* setCount((n) => n + 1)
|
|
124
|
+
* ```
|
|
125
|
+
*/
|
|
126
|
+
export declare function fromSolidSignal<T>(solidSignal: SolidSignal<T>): [Accessor<T>, Setter<T>];
|
|
127
|
+
/**
|
|
128
|
+
* Adapts this library's signal pair to a Solid-compatible tuple shape.
|
|
129
|
+
*
|
|
130
|
+
* @param reactiveSignal Tuple `[get, set]` from this library.
|
|
131
|
+
* @returns Solid-compatible signal tuple.
|
|
132
|
+
*
|
|
133
|
+
* @example
|
|
134
|
+
* ```ts
|
|
135
|
+
* const solidPair = toSolidSignal(createSignal(0))
|
|
136
|
+
* ```
|
|
137
|
+
*/
|
|
138
|
+
export declare function toSolidSignal<T>(reactiveSignal: readonly [Accessor<T>, Setter<T>]): SolidSignal<T>;
|
|
139
|
+
/**
|
|
140
|
+
* Alias for {@link fromSolidSignal}.
|
|
141
|
+
*/
|
|
142
|
+
export declare const fromSignal: typeof fromSolidSignal;
|
|
143
|
+
/**
|
|
144
|
+
* Alias for {@link toSolidSignal}.
|
|
145
|
+
*/
|
|
146
|
+
export declare const toSignal: typeof toSolidSignal;
|
|
147
|
+
/**
|
|
148
|
+
* Creates a cached derived accessor.
|
|
149
|
+
*
|
|
150
|
+
* @param compute Derivation function. Reads inside this function become dependencies.
|
|
151
|
+
* @returns Read-only accessor for the derived value.
|
|
152
|
+
*
|
|
153
|
+
* @example
|
|
154
|
+
* ```ts
|
|
155
|
+
* const total = createMemo(() => items().length)
|
|
156
|
+
* ```
|
|
157
|
+
*/
|
|
158
|
+
export declare function createMemo<T>(compute: () => T): Accessor<T>;
|
|
159
|
+
/**
|
|
160
|
+
* Alias for {@link createMemo}.
|
|
161
|
+
*
|
|
162
|
+
* @example
|
|
163
|
+
* ```ts
|
|
164
|
+
* const total = memo(() => items().length)
|
|
165
|
+
* ```
|
|
166
|
+
*/
|
|
167
|
+
export declare const memo: typeof createMemo;
|
|
168
|
+
/**
|
|
169
|
+
* Registers an effect that runs after React commit.
|
|
170
|
+
*
|
|
171
|
+
* @param effect Effect callback. Return a cleanup function to dispose previous run resources.
|
|
172
|
+
*
|
|
173
|
+
* @example
|
|
174
|
+
* ```ts
|
|
175
|
+
* createEffect(() => {
|
|
176
|
+
* console.log(count())
|
|
177
|
+
* })
|
|
178
|
+
* ```
|
|
179
|
+
*/
|
|
180
|
+
export declare function createEffect(effect: () => void | Cleanup): void;
|
|
181
|
+
/**
|
|
182
|
+
* Alias for {@link createEffect}.
|
|
183
|
+
*
|
|
184
|
+
* @example
|
|
185
|
+
* ```ts
|
|
186
|
+
* effect(() => console.log(count()))
|
|
187
|
+
* ```
|
|
188
|
+
*/
|
|
189
|
+
export declare const effect: typeof createEffect;
|
|
190
|
+
/**
|
|
191
|
+
* Registers an effect that runs in layout phase.
|
|
192
|
+
*
|
|
193
|
+
* @param effect Layout effect callback. Return a cleanup function to dispose previous run resources.
|
|
194
|
+
*
|
|
195
|
+
* @example
|
|
196
|
+
* ```ts
|
|
197
|
+
* createLayoutEffect(() => {
|
|
198
|
+
* measureLayout()
|
|
199
|
+
* })
|
|
200
|
+
* ```
|
|
201
|
+
*/
|
|
202
|
+
export declare function createLayoutEffect(effect: () => void | Cleanup): void;
|
|
203
|
+
/**
|
|
204
|
+
* Alias for {@link createLayoutEffect}.
|
|
205
|
+
*
|
|
206
|
+
* @example
|
|
207
|
+
* ```ts
|
|
208
|
+
* layoutEffect(() => measure())
|
|
209
|
+
* ```
|
|
210
|
+
*/
|
|
211
|
+
export declare const layoutEffect: typeof createLayoutEffect;
|
|
212
|
+
/**
|
|
213
|
+
* Creates a reactive computation for side effects.
|
|
214
|
+
* Alias of {@link createEffect} for Solid-style API compatibility.
|
|
215
|
+
*
|
|
216
|
+
* @param compute Side-effect function.
|
|
217
|
+
*
|
|
218
|
+
* @example
|
|
219
|
+
* ```ts
|
|
220
|
+
* createComputed(() => {
|
|
221
|
+
* syncExternalStore(count())
|
|
222
|
+
* })
|
|
223
|
+
* ```
|
|
224
|
+
*/
|
|
225
|
+
export declare function createComputed(compute: () => void | Cleanup): void;
|
|
226
|
+
/**
|
|
227
|
+
* Alias for {@link createComputed}.
|
|
228
|
+
*
|
|
229
|
+
* @example
|
|
230
|
+
* ```ts
|
|
231
|
+
* computed(() => sync(count()))
|
|
232
|
+
* ```
|
|
233
|
+
*/
|
|
234
|
+
export declare const computed: typeof createComputed;
|
|
235
|
+
/**
|
|
236
|
+
* Runs a callback once on mount and disposes it on unmount if cleanup is returned.
|
|
237
|
+
*
|
|
238
|
+
* @param callback Mount callback.
|
|
239
|
+
*
|
|
240
|
+
* @example
|
|
241
|
+
* ```ts
|
|
242
|
+
* onMount(() => {
|
|
243
|
+
* const ws = connect()
|
|
244
|
+
* return () => ws.close()
|
|
245
|
+
* })
|
|
246
|
+
* ```
|
|
247
|
+
*/
|
|
248
|
+
export declare function onMount(callback: () => void | Cleanup): void;
|
|
249
|
+
/**
|
|
250
|
+
* Alias for {@link onMount}.
|
|
251
|
+
*
|
|
252
|
+
* @example
|
|
253
|
+
* ```ts
|
|
254
|
+
* mount(() => console.log("mounted"))
|
|
255
|
+
* ```
|
|
256
|
+
*/
|
|
257
|
+
export declare const mount: typeof onMount;
|
|
258
|
+
/**
|
|
259
|
+
* Registers cleanup in setup scope or currently running effect.
|
|
260
|
+
*
|
|
261
|
+
* @param cleanup Cleanup callback invoked on re-run or scope disposal.
|
|
262
|
+
*
|
|
263
|
+
* @example
|
|
264
|
+
* ```ts
|
|
265
|
+
* createEffect(() => {
|
|
266
|
+
* const id = setInterval(tick, 1000)
|
|
267
|
+
* onCleanup(() => clearInterval(id))
|
|
268
|
+
* })
|
|
269
|
+
* ```
|
|
270
|
+
*/
|
|
271
|
+
export declare function onCleanup(cleanup: Cleanup): void;
|
|
272
|
+
/**
|
|
273
|
+
* Alias for {@link onCleanup}.
|
|
274
|
+
*
|
|
275
|
+
* @example
|
|
276
|
+
* ```ts
|
|
277
|
+
* cleanup(() => console.log("disposed"))
|
|
278
|
+
* ```
|
|
279
|
+
*/
|
|
280
|
+
export declare const cleanup: typeof onCleanup;
|
|
281
|
+
/**
|
|
282
|
+
* Batches reactive notifications and flushes once at the end.
|
|
283
|
+
*
|
|
284
|
+
* @param fn Function containing grouped signal/store writes.
|
|
285
|
+
* @returns Result of `fn()`.
|
|
286
|
+
*
|
|
287
|
+
* @example
|
|
288
|
+
* ```ts
|
|
289
|
+
* batch(() => {
|
|
290
|
+
* setFirst("Ada")
|
|
291
|
+
* setLast("Lovelace")
|
|
292
|
+
* })
|
|
293
|
+
* ```
|
|
294
|
+
*/
|
|
295
|
+
export declare function batch<T>(fn: () => T): T;
|
|
296
|
+
/**
|
|
297
|
+
* Executes a function without dependency tracking.
|
|
298
|
+
*
|
|
299
|
+
* @param fn Function to execute without capturing dependencies.
|
|
300
|
+
* @returns Result of `fn()`.
|
|
301
|
+
*
|
|
302
|
+
* @example
|
|
303
|
+
* ```ts
|
|
304
|
+
* const stable = untrack(() => expensiveSnapshot())
|
|
305
|
+
* ```
|
|
306
|
+
*/
|
|
307
|
+
export declare function untrack<T>(fn: () => T): T;
|
|
308
|
+
/**
|
|
309
|
+
* Creates an async resource from a fetcher.
|
|
310
|
+
*
|
|
311
|
+
* @param fetcher Async or sync function that resolves the resource value.
|
|
312
|
+
* @param options Optional resource options such as `initialValue`.
|
|
313
|
+
* @returns Tuple of `[resourceAccessor, controls]`.
|
|
314
|
+
*
|
|
315
|
+
* @example
|
|
316
|
+
* ```ts
|
|
317
|
+
* const [users, { refetch }] = createResource(async () => fetchUsers())
|
|
318
|
+
* refetch()
|
|
319
|
+
* ```
|
|
320
|
+
*/
|
|
321
|
+
export declare function createResource<T>(fetcher: () => Promise<T> | T, options?: ResourceOptions<T>): [
|
|
322
|
+
ResourceAccessor<T>,
|
|
323
|
+
ResourceControls<T>
|
|
324
|
+
];
|
|
325
|
+
/**
|
|
326
|
+
* Creates an async resource that re-fetches when `source()` changes.
|
|
327
|
+
*
|
|
328
|
+
* @param source Source accessor. When this value changes, the resource refetches.
|
|
329
|
+
* @param fetcher Fetcher receiving source value and refetch metadata.
|
|
330
|
+
* @param options Optional resource options such as `initialValue`.
|
|
331
|
+
* @returns Tuple of `[resourceAccessor, controls]`.
|
|
332
|
+
*
|
|
333
|
+
* @example
|
|
334
|
+
* ```ts
|
|
335
|
+
* const [user] = createResource(id, (value) => fetchUser(value))
|
|
336
|
+
* ```
|
|
337
|
+
*/
|
|
338
|
+
export declare function createResource<S, T>(source: Accessor<S>, fetcher: (source: S, info: {
|
|
339
|
+
value: T | undefined;
|
|
340
|
+
refetching: boolean;
|
|
341
|
+
}) => Promise<T> | T, options?: ResourceOptions<T>): [
|
|
342
|
+
ResourceAccessor<T>,
|
|
343
|
+
ResourceControls<T>
|
|
344
|
+
];
|
|
345
|
+
/**
|
|
346
|
+
* Alias for {@link createResource}.
|
|
347
|
+
*
|
|
348
|
+
* @example
|
|
349
|
+
* ```ts
|
|
350
|
+
* const [user] = resource(() => fetchUser())
|
|
351
|
+
* ```
|
|
352
|
+
*/
|
|
353
|
+
export declare const resource: typeof createResource;
|
|
354
|
+
/**
|
|
355
|
+
* Shortcut for `createResource(fetcher)[0]`.
|
|
356
|
+
*
|
|
357
|
+
* @param compute Async or sync function that resolves the value.
|
|
358
|
+
* @param options Optional resource options such as `initialValue`.
|
|
359
|
+
* @returns Resource accessor only.
|
|
360
|
+
*
|
|
361
|
+
* @example
|
|
362
|
+
* ```ts
|
|
363
|
+
* const profile = createAsync(() => fetchProfile())
|
|
364
|
+
* ```
|
|
365
|
+
*/
|
|
366
|
+
export declare function createAsync<T>(compute: () => Promise<T> | T, options?: ResourceOptions<T>): ResourceAccessor<T>;
|
|
367
|
+
/**
|
|
368
|
+
* Alias for {@link createAsync}.
|
|
369
|
+
*
|
|
370
|
+
* @example
|
|
371
|
+
* ```ts
|
|
372
|
+
* const profile = asyncSignal(() => fetchProfile())
|
|
373
|
+
* ```
|
|
374
|
+
*/
|
|
375
|
+
export declare const asyncSignal: typeof createAsync;
|
|
376
|
+
/**
|
|
377
|
+
* Reads an accessor value or unwraps a promise in Suspense context.
|
|
378
|
+
*
|
|
379
|
+
* @param value Accessor or thenable/promise value.
|
|
380
|
+
* @returns Current accessor value or resolved promise value.
|
|
381
|
+
*
|
|
382
|
+
* @example
|
|
383
|
+
* ```tsx
|
|
384
|
+
* const value = use(() => count())
|
|
385
|
+
* const data = use(fetchPromise)
|
|
386
|
+
* ```
|
|
387
|
+
*/
|
|
388
|
+
export declare function use<T>(value: Accessor<T>): T;
|
|
389
|
+
export declare function use<T>(value: PromiseLike<T>): T;
|
|
390
|
+
/**
|
|
391
|
+
* Setter for immutable stores.
|
|
392
|
+
*
|
|
393
|
+
* @example
|
|
394
|
+
* ```ts
|
|
395
|
+
* setStore({ filter: "active" })
|
|
396
|
+
* setStore((prev) => ({ count: prev.count + 1 }))
|
|
397
|
+
* ```
|
|
398
|
+
*/
|
|
399
|
+
export type SetStore<T> = (next: T | Partial<T> | ((prev: T) => T | Partial<T>)) => T;
|
|
400
|
+
/**
|
|
401
|
+
* Creates an immutable reactive object store.
|
|
402
|
+
*
|
|
403
|
+
* @param initialValue Initial object state.
|
|
404
|
+
* @returns Tuple of `[storeProxy, setStore]`.
|
|
405
|
+
*
|
|
406
|
+
* @example
|
|
407
|
+
* ```ts
|
|
408
|
+
* const [store, setStore] = createStore({ count: 0 })
|
|
409
|
+
* setStore({ count: 1 })
|
|
410
|
+
* ```
|
|
411
|
+
*/
|
|
412
|
+
export declare function createStore<T extends object>(initialValue: T): [T, SetStore<T>];
|
|
413
|
+
/**
|
|
414
|
+
* Alias for {@link createStore}.
|
|
415
|
+
*
|
|
416
|
+
* @example
|
|
417
|
+
* ```ts
|
|
418
|
+
* const [state, setState] = store({ count: 0 })
|
|
419
|
+
* ```
|
|
420
|
+
*/
|
|
421
|
+
export declare const store: typeof createStore;
|
|
422
|
+
/**
|
|
423
|
+
* Typo-friendly alias for {@link createStore}.
|
|
424
|
+
*
|
|
425
|
+
* @example
|
|
426
|
+
* ```ts
|
|
427
|
+
* const [state, setState] = sotre({ count: 0 })
|
|
428
|
+
* ```
|
|
429
|
+
*/
|
|
430
|
+
export declare const sotre: typeof createStore;
|
|
431
|
+
/**
|
|
432
|
+
* Creates a mutable reactive object.
|
|
433
|
+
*
|
|
434
|
+
* @param initialValue Initial object state.
|
|
435
|
+
* @returns Mutable reactive proxy.
|
|
436
|
+
*
|
|
437
|
+
* @example
|
|
438
|
+
* ```ts
|
|
439
|
+
* const state = createMutable({ count: 0 })
|
|
440
|
+
* state.count += 1
|
|
441
|
+
* ```
|
|
442
|
+
*/
|
|
443
|
+
export declare function createMutable<T extends object>(initialValue: T): T;
|
|
444
|
+
/**
|
|
445
|
+
* Alias for {@link createMutable}.
|
|
446
|
+
*
|
|
447
|
+
* @example
|
|
448
|
+
* ```ts
|
|
449
|
+
* const state = mutable({ count: 0 })
|
|
450
|
+
* ```
|
|
451
|
+
*/
|
|
452
|
+
export declare const mutable: typeof createMutable;
|
|
453
|
+
/**
|
|
454
|
+
* Alias for {@link createMutable}.
|
|
455
|
+
*
|
|
456
|
+
* @param initialValue Initial object state.
|
|
457
|
+
* @returns Mutable reactive proxy.
|
|
458
|
+
*
|
|
459
|
+
* @example
|
|
460
|
+
* ```ts
|
|
461
|
+
* const state = createMutableStore({ value: 1 })
|
|
462
|
+
* ```
|
|
463
|
+
*/
|
|
464
|
+
export declare function createMutableStore<T extends object>(initialValue: T): T;
|
|
465
|
+
/**
|
|
466
|
+
* Creates a mutable reactive array.
|
|
467
|
+
*
|
|
468
|
+
* @param initialValue Initial list values.
|
|
469
|
+
* @returns Mutable reactive array proxy.
|
|
470
|
+
*
|
|
471
|
+
* @example
|
|
472
|
+
* ```ts
|
|
473
|
+
* const list = createReactiveArray([1, 2])
|
|
474
|
+
* list.push(3)
|
|
475
|
+
* ```
|
|
476
|
+
*/
|
|
477
|
+
export declare function createReactiveArray<T>(initialValue?: T[]): T[];
|
|
478
|
+
/**
|
|
479
|
+
* Alias for {@link createReactiveArray}.
|
|
480
|
+
*
|
|
481
|
+
* @param initialValue Initial list values.
|
|
482
|
+
* @returns Mutable reactive array proxy.
|
|
483
|
+
*
|
|
484
|
+
* @example
|
|
485
|
+
* ```ts
|
|
486
|
+
* const list = createArrayStore(["a"])
|
|
487
|
+
* ```
|
|
488
|
+
*/
|
|
489
|
+
export declare function createArrayStore<T>(initialValue?: T[]): T[];
|
|
490
|
+
/**
|
|
491
|
+
* Options for keyed array projections.
|
|
492
|
+
*
|
|
493
|
+
* @example
|
|
494
|
+
* ```ts
|
|
495
|
+
* const rows = createArrayProjection(items, {
|
|
496
|
+
* key: (item) => item.id,
|
|
497
|
+
* map: (item) => ({ ...item }),
|
|
498
|
+
* })
|
|
499
|
+
* ```
|
|
500
|
+
*/
|
|
501
|
+
export type ArrayProjectionOptions<SourceItem, ProjectedItem, Key = unknown> = {
|
|
502
|
+
key?: (item: SourceItem, index: number) => Key;
|
|
503
|
+
map: (item: SourceItem, index: number) => ProjectedItem;
|
|
504
|
+
update?: (projected: ProjectedItem, item: SourceItem, index: number) => void;
|
|
505
|
+
};
|
|
506
|
+
/**
|
|
507
|
+
* Creates a stable projected array with keyed move/insert/remove updates.
|
|
508
|
+
*
|
|
509
|
+
* @param source Source list accessor to project from.
|
|
510
|
+
* @param options Projection behavior (`key`, `map`, optional `update`).
|
|
511
|
+
* @returns Stable mutable projected array.
|
|
512
|
+
*
|
|
513
|
+
* @example
|
|
514
|
+
* ```ts
|
|
515
|
+
* const rows = createArrayProjection(users, {
|
|
516
|
+
* key: (u) => u.id,
|
|
517
|
+
* map: (u) => ({ id: u.id, name: u.name }),
|
|
518
|
+
* update: (row, u) => { row.name = u.name },
|
|
519
|
+
* })
|
|
520
|
+
* ```
|
|
521
|
+
*/
|
|
522
|
+
export declare function createArrayProjection<SourceItem, ProjectedItem, Key = unknown>(source: Accessor<readonly SourceItem[] | null | undefined>, options: ArrayProjectionOptions<SourceItem, ProjectedItem, Key>): ProjectedItem[];
|
|
523
|
+
/**
|
|
524
|
+
* Alias for {@link createArrayProjection}.
|
|
525
|
+
*
|
|
526
|
+
* @example
|
|
527
|
+
* ```ts
|
|
528
|
+
* const rows = arrayProjection(items, { map: (i) => i })
|
|
529
|
+
* ```
|
|
530
|
+
*/
|
|
531
|
+
export declare const arrayProjection: typeof createArrayProjection;
|
|
532
|
+
/**
|
|
533
|
+
* Writable derived signal state returned by {@link createLinkedSignal}.
|
|
534
|
+
*
|
|
535
|
+
* @example
|
|
536
|
+
* ```ts
|
|
537
|
+
* const selected = createLinkedSignal(() => items()[0]?.id ?? null)
|
|
538
|
+
* selected.set("abc")
|
|
539
|
+
* ```
|
|
540
|
+
*/
|
|
541
|
+
export type LinkedSignalState<T> = {
|
|
542
|
+
readonly value: Accessor<T>;
|
|
543
|
+
readonly set: Setter<T>;
|
|
544
|
+
readonly reset: () => T;
|
|
545
|
+
readonly isOverridden: Accessor<boolean>;
|
|
546
|
+
};
|
|
547
|
+
/**
|
|
548
|
+
* Creates a writable derived signal that resets when derivation inputs change.
|
|
549
|
+
*
|
|
550
|
+
* @param derive Function that computes the default value from reactive dependencies.
|
|
551
|
+
* @returns Linked signal state with `value`, `set`, `reset`, and `isOverridden`.
|
|
552
|
+
*
|
|
553
|
+
* @example
|
|
554
|
+
* ```ts
|
|
555
|
+
* const selected = createLinkedSignal(() => items()[0]?.id ?? null)
|
|
556
|
+
* selected.set("custom")
|
|
557
|
+
* ```
|
|
558
|
+
*/
|
|
559
|
+
export declare function createLinkedSignal<T>(derive: () => T): LinkedSignalState<T>;
|
|
560
|
+
/**
|
|
561
|
+
* Alias for {@link createLinkedSignal}.
|
|
562
|
+
*
|
|
563
|
+
* @example
|
|
564
|
+
* ```ts
|
|
565
|
+
* const selected = linkedSignal(() => "default")
|
|
566
|
+
* ```
|
|
567
|
+
*/
|
|
568
|
+
export declare const linkedSignal: typeof createLinkedSignal;
|
|
569
|
+
type ProjectionMutator<Source, Target> = (target: Target, source: Source, previousSource: Source) => void;
|
|
570
|
+
/**
|
|
571
|
+
* Creates a mutable projection with a stable reference.
|
|
572
|
+
*
|
|
573
|
+
* @param source Source accessor that drives projection updates.
|
|
574
|
+
* @param initialize Initializes projection state from the first source value.
|
|
575
|
+
* @param mutate Applies granular updates to the existing projection object.
|
|
576
|
+
* @returns Stable mutable projection object.
|
|
577
|
+
*
|
|
578
|
+
* @example
|
|
579
|
+
* ```ts
|
|
580
|
+
* const projection = createProjection(source, (s) => ({ ...s }), (target, next) => {
|
|
581
|
+
* Object.assign(target, next)
|
|
582
|
+
* })
|
|
583
|
+
* ```
|
|
584
|
+
*/
|
|
585
|
+
export declare function createProjection<Source, Target extends object>(source: Accessor<Source>, initialize: (source: Source) => Target, mutate: ProjectionMutator<Source, Target>): Target;
|
|
586
|
+
/**
|
|
587
|
+
* Alias for {@link createProjection}.
|
|
588
|
+
*
|
|
589
|
+
* @example
|
|
590
|
+
* ```ts
|
|
591
|
+
* const state = projection(source, (s) => ({ ...s }), (t, s) => Object.assign(t, s))
|
|
592
|
+
* ```
|
|
593
|
+
*/
|
|
594
|
+
export declare const projection: typeof createProjection;
|
|
595
|
+
/**
|
|
596
|
+
* Re-export of `React.Suspense` for API consistency.
|
|
597
|
+
*
|
|
598
|
+
* @example
|
|
599
|
+
* ```tsx
|
|
600
|
+
* <Suspense fallback={<p>Loading...</p>}><View /></Suspense>
|
|
601
|
+
* ```
|
|
602
|
+
*/
|
|
603
|
+
export declare const Suspense: React.ExoticComponent<React.SuspenseProps>;
|
|
604
|
+
/**
|
|
605
|
+
* Wrapper around `React.lazy` that also accepts direct component loaders.
|
|
606
|
+
*
|
|
607
|
+
* @param loader Async loader returning either a module with default export or a component.
|
|
608
|
+
* @returns Lazy React component suitable for Suspense boundaries.
|
|
609
|
+
*
|
|
610
|
+
* @example
|
|
611
|
+
* ```ts
|
|
612
|
+
* const Settings = lazy(() => import("./Settings"))
|
|
613
|
+
* ```
|
|
614
|
+
*/
|
|
615
|
+
export declare function lazy<Props>(loader: () => Promise<{
|
|
616
|
+
default: React.ComponentType<Props>;
|
|
617
|
+
} | React.ComponentType<Props>>): React.LazyExoticComponent<React.ComponentType<Props>>;
|
|
618
|
+
type SetupResult = (() => React.ReactNode) | React.ReactNode;
|
|
619
|
+
type SetupFn<Props> = (props: Accessor<Readonly<Props>>) => SetupResult;
|
|
620
|
+
type SetupFnNoProps = () => SetupResult;
|
|
621
|
+
/**
|
|
622
|
+
* Options for wrapped `component(...)` React components.
|
|
623
|
+
*
|
|
624
|
+
* @example
|
|
625
|
+
* ```ts
|
|
626
|
+
* const View = component(setup, { memo: true, displayName: "View" })
|
|
627
|
+
* ```
|
|
628
|
+
*/
|
|
629
|
+
export type ComponentOptions<Props> = {
|
|
630
|
+
memo?: boolean | ((prev: Readonly<Props>, next: Readonly<Props>) => boolean);
|
|
631
|
+
displayName?: string;
|
|
632
|
+
};
|
|
633
|
+
/**
|
|
634
|
+
* Public component type returned by {@link component}.
|
|
635
|
+
*
|
|
636
|
+
* @example
|
|
637
|
+
* ```ts
|
|
638
|
+
* const View: SolidComponent<{ id: string }> = component((props) => () => <p>{props().id}</p>)
|
|
639
|
+
* ```
|
|
640
|
+
*/
|
|
641
|
+
export type SolidComponent<Props> = React.ComponentType<Props>;
|
|
642
|
+
/**
|
|
643
|
+
* Wraps a setup function so Solid-style primitives can be used without custom hooks.
|
|
644
|
+
*
|
|
645
|
+
* @param setup Setup function that runs once per component instance.
|
|
646
|
+
* @param options Wrapper options (`memo`, `displayName`).
|
|
647
|
+
* @returns React function component.
|
|
648
|
+
*
|
|
649
|
+
* @example
|
|
650
|
+
* ```tsx
|
|
651
|
+
* const Counter = component(() => {
|
|
652
|
+
* const [count, setCount] = createSignal(0)
|
|
653
|
+
* return () => <button onClick={() => setCount((n) => n + 1)}>{count()}</button>
|
|
654
|
+
* })
|
|
655
|
+
* ```
|
|
656
|
+
*/
|
|
657
|
+
export declare function component(setup: SetupFnNoProps, options?: ComponentOptions<Record<string, never>>): SolidComponent<Record<string, never>>;
|
|
658
|
+
export declare function component<Props>(setup: SetupFn<Props>, options?: ComponentOptions<Props>): SolidComponent<Props>;
|
|
659
|
+
/**
|
|
660
|
+
* Alias for {@link component}.
|
|
661
|
+
*
|
|
662
|
+
* @example
|
|
663
|
+
* ```ts
|
|
664
|
+
* const View = defineComponent(() => <p>Hello</p>)
|
|
665
|
+
* ```
|
|
666
|
+
*/
|
|
667
|
+
export declare const defineComponent: typeof component;
|
|
668
|
+
/**
|
|
669
|
+
* Utility union type accepted by control-flow primitives.
|
|
670
|
+
*
|
|
671
|
+
* @example
|
|
672
|
+
* ```ts
|
|
673
|
+
* const maybe = () => true
|
|
674
|
+
* const value: MaybeAccessor<boolean> = maybe
|
|
675
|
+
* ```
|
|
676
|
+
*/
|
|
677
|
+
export type MaybeAccessor<T> = T | Accessor<T>;
|
|
678
|
+
/**
|
|
679
|
+
* Props for {@link Show}.
|
|
680
|
+
*
|
|
681
|
+
* @example
|
|
682
|
+
* ```tsx
|
|
683
|
+
* <Show when={user()} fallback={<p>No user</p>}>{(u) => <p>{u.name}</p>}</Show>
|
|
684
|
+
* ```
|
|
685
|
+
*/
|
|
686
|
+
export type ShowProps<T> = {
|
|
687
|
+
/** Condition value (or accessor). Truthy renders children, falsy renders fallback. */
|
|
688
|
+
when: MaybeAccessor<T | null | undefined | false>;
|
|
689
|
+
/** Content rendered when `when` is falsy. */
|
|
690
|
+
fallback?: React.ReactNode;
|
|
691
|
+
/** Reserved compatibility flag for Solid-style signatures. */
|
|
692
|
+
keyed?: boolean;
|
|
693
|
+
/** Render content or render function receiving narrowed truthy value. */
|
|
694
|
+
children: React.ReactNode | ((value: NonNullable<T>) => React.ReactNode);
|
|
695
|
+
};
|
|
696
|
+
/**
|
|
697
|
+
* Conditionally renders content when `when` is truthy.
|
|
698
|
+
*
|
|
699
|
+
* @param props Show control-flow props.
|
|
700
|
+
* @returns Matching branch or fallback.
|
|
701
|
+
*
|
|
702
|
+
* @example
|
|
703
|
+
* ```tsx
|
|
704
|
+
* <Show when={ready()} fallback={<p>Loading</p>}><p>Ready</p></Show>
|
|
705
|
+
* ```
|
|
706
|
+
*/
|
|
707
|
+
export declare function Show<T>(props: ShowProps<T>): React.ReactNode;
|
|
708
|
+
/**
|
|
709
|
+
* Props for {@link For}.
|
|
710
|
+
*
|
|
711
|
+
* @example
|
|
712
|
+
* ```tsx
|
|
713
|
+
* <For each={items()}>{(item) => <li>{item.name}</li>}</For>
|
|
714
|
+
* ```
|
|
715
|
+
*/
|
|
716
|
+
export type ForProps<T> = {
|
|
717
|
+
/** Source list (or accessor) to iterate. */
|
|
718
|
+
each: MaybeAccessor<readonly T[] | null | undefined>;
|
|
719
|
+
/** Rendered when list is empty. */
|
|
720
|
+
fallback?: React.ReactNode;
|
|
721
|
+
/** Item renderer with stable index accessor. */
|
|
722
|
+
children: (item: T, index: Accessor<number>) => React.ReactNode;
|
|
723
|
+
};
|
|
724
|
+
/**
|
|
725
|
+
* Renders each item in a list.
|
|
726
|
+
*
|
|
727
|
+
* @param props For control-flow props.
|
|
728
|
+
* @returns Rendered list or fallback.
|
|
729
|
+
*
|
|
730
|
+
* @example
|
|
731
|
+
* ```tsx
|
|
732
|
+
* <For each={todos()} fallback={<p>Empty</p>}>{(todo) => <p>{todo.title}</p>}</For>
|
|
733
|
+
* ```
|
|
734
|
+
*/
|
|
735
|
+
export declare function For<T>(props: ForProps<T>): React.ReactNode;
|
|
736
|
+
/**
|
|
737
|
+
* Props for {@link Index}.
|
|
738
|
+
*
|
|
739
|
+
* @example
|
|
740
|
+
* ```tsx
|
|
741
|
+
* <Index each={items()}>{(item) => <li>{item().name}</li>}</Index>
|
|
742
|
+
* ```
|
|
743
|
+
*/
|
|
744
|
+
export type IndexProps<T> = {
|
|
745
|
+
/** Source list (or accessor) to iterate. */
|
|
746
|
+
each: MaybeAccessor<readonly T[] | null | undefined>;
|
|
747
|
+
/** Rendered when list is empty. */
|
|
748
|
+
fallback?: React.ReactNode;
|
|
749
|
+
/** Item renderer with accessor per item and index accessor. */
|
|
750
|
+
children: (item: Accessor<T>, index: Accessor<number>) => React.ReactNode;
|
|
751
|
+
};
|
|
752
|
+
/**
|
|
753
|
+
* Renders a list where each child receives an item accessor.
|
|
754
|
+
*
|
|
755
|
+
* @param props Index control-flow props.
|
|
756
|
+
* @returns Rendered list or fallback.
|
|
757
|
+
*
|
|
758
|
+
* @example
|
|
759
|
+
* ```tsx
|
|
760
|
+
* <Index each={rows()}>{(row) => <Row data={row()} />}</Index>
|
|
761
|
+
* ```
|
|
762
|
+
*/
|
|
763
|
+
export declare function Index<T>(props: IndexProps<T>): React.ReactNode;
|
|
764
|
+
/**
|
|
765
|
+
* Props for {@link Match} used inside {@link Switch}.
|
|
766
|
+
*
|
|
767
|
+
* @example
|
|
768
|
+
* ```tsx
|
|
769
|
+
* <Match when={status() === "ready"}><Ready /></Match>
|
|
770
|
+
* ```
|
|
771
|
+
*/
|
|
772
|
+
export type MatchProps<T> = {
|
|
773
|
+
/** Match condition (or accessor). First truthy Match is selected by Switch. */
|
|
774
|
+
when: MaybeAccessor<T | null | undefined | false>;
|
|
775
|
+
/** Render content or render function receiving narrowed truthy match value. */
|
|
776
|
+
children: React.ReactNode | ((value: NonNullable<T>) => React.ReactNode);
|
|
777
|
+
};
|
|
778
|
+
/**
|
|
779
|
+
* Switch branch marker consumed by {@link Switch}.
|
|
780
|
+
*
|
|
781
|
+
* @param _props Match branch props consumed by `Switch`.
|
|
782
|
+
* @returns `null` when rendered standalone.
|
|
783
|
+
*
|
|
784
|
+
* @example
|
|
785
|
+
* ```tsx
|
|
786
|
+
* <Switch><Match when={ok()}>OK</Match></Switch>
|
|
787
|
+
* ```
|
|
788
|
+
*/
|
|
789
|
+
export declare function Match<T>(_props: MatchProps<T>): React.ReactElement | null;
|
|
790
|
+
/**
|
|
791
|
+
* Props for {@link Switch}.
|
|
792
|
+
*
|
|
793
|
+
* @example
|
|
794
|
+
* ```tsx
|
|
795
|
+
* <Switch fallback={<p>Unknown</p>}>...</Switch>
|
|
796
|
+
* ```
|
|
797
|
+
*/
|
|
798
|
+
export type SwitchProps = {
|
|
799
|
+
/** Content rendered when no Match branch is truthy. */
|
|
800
|
+
fallback?: React.ReactNode;
|
|
801
|
+
/** Match branches (typically Match components). */
|
|
802
|
+
children?: React.ReactNode;
|
|
803
|
+
};
|
|
804
|
+
/**
|
|
805
|
+
* Type guard for accessors.
|
|
806
|
+
*
|
|
807
|
+
* @param value Value to check.
|
|
808
|
+
* @returns `true` when value is an accessor function.
|
|
809
|
+
*
|
|
810
|
+
* @example
|
|
811
|
+
* ```ts
|
|
812
|
+
* if (isAccessor(value)) {
|
|
813
|
+
* console.log(value())
|
|
814
|
+
* }
|
|
815
|
+
* ```
|
|
816
|
+
*/
|
|
817
|
+
export declare function isAccessor<T = unknown>(value: unknown): value is Accessor<T>;
|
|
818
|
+
/**
|
|
819
|
+
* Resolves plain values or accessors into a value.
|
|
820
|
+
*
|
|
821
|
+
* @param value Plain value or accessor.
|
|
822
|
+
* @returns Resolved value.
|
|
823
|
+
*
|
|
824
|
+
* @example
|
|
825
|
+
* ```ts
|
|
826
|
+
* const enabled = resolveMaybeAccessor(props.enabled)
|
|
827
|
+
* ```
|
|
828
|
+
*/
|
|
829
|
+
export declare function resolveMaybeAccessor<T>(value: MaybeAccessor<T>): T;
|
|
830
|
+
/**
|
|
831
|
+
* Alias for {@link resolveMaybeAccessor}.
|
|
832
|
+
*/
|
|
833
|
+
export declare const toValue: typeof resolveMaybeAccessor;
|
|
834
|
+
/**
|
|
835
|
+
* Creates a keyed selector helper for efficient equality checks.
|
|
836
|
+
*
|
|
837
|
+
* @param source Source accessor containing the selected value.
|
|
838
|
+
* @param equals Optional comparison function. Defaults to `Object.is`.
|
|
839
|
+
* @returns Function that compares keys to the current source value.
|
|
840
|
+
*
|
|
841
|
+
* @example
|
|
842
|
+
* ```ts
|
|
843
|
+
* const isSelected = createSelector(selectedId)
|
|
844
|
+
* const active = isSelected(row.id)
|
|
845
|
+
* ```
|
|
846
|
+
*/
|
|
847
|
+
export declare function createSelector<T>(source: Accessor<T>, equals?: (left: T, right: T) => boolean): (key: T) => boolean;
|
|
848
|
+
/**
|
|
849
|
+
* Renders the first truthy {@link Match}, else `fallback`.
|
|
850
|
+
*
|
|
851
|
+
* @param props Switch control-flow props.
|
|
852
|
+
* @returns First matched branch or fallback.
|
|
853
|
+
*
|
|
854
|
+
* @example
|
|
855
|
+
* ```tsx
|
|
856
|
+
* <Switch fallback={<p>idle</p>}><Match when={loading()}>loading</Match></Switch>
|
|
857
|
+
* ```
|
|
858
|
+
*/
|
|
859
|
+
export declare function Switch(props: SwitchProps): React.ReactNode;
|
|
860
|
+
export {};
|
|
861
|
+
//# sourceMappingURL=index.d.ts.map
|