elements-kit 0.0.17 → 0.0.19
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 +97 -19
- package/dist/attributes.d.mts +1 -1
- package/dist/{define-CjbTZ3VG.d.mts → custom-elements-bVYOkHKt.d.mts} +2 -2
- package/dist/custom-elements.d.mts +2 -74
- package/dist/custom-elements.mjs +2 -91
- package/dist/{element-CGVy_8TW.mjs → element-DxmInKJw.mjs} +32 -20
- package/dist/for.d.mts +1 -1
- package/dist/for.mjs +3 -2
- package/dist/infer-Dv5Wk-7E.d.mts +618 -0
- package/dist/integrations/react.d.mts +1 -1
- package/dist/integrations/react.mjs +6 -4
- package/dist/jsx-runtime/index.d.mts +2 -73
- package/dist/jsx-runtime/index.mjs +8 -14
- package/dist/{signals-J8dK_rA4.mjs → lib-D6duEs38.mjs} +1 -105
- package/dist/render.d.mts +21 -0
- package/dist/render.mjs +32 -0
- package/dist/scope-DM2gzOkb.mjs +45 -0
- package/dist/signals/index.d.mts +1 -1
- package/dist/signals/index.mjs +115 -1
- package/dist/{slot-C7GQZe-r.d.mts → slot-B5_VHB7E.d.mts} +10 -0
- package/dist/slot.d.mts +1 -1
- package/dist/{test.BmQO5GaM-DfGStnii.mjs → test.BmQO5GaM-BeO5pvCo.mjs} +1 -1
- package/dist/utilities/_observe.mjs +2 -1
- package/dist/utilities/active-element.d.mts +1 -1
- package/dist/utilities/active-element.mjs +2 -1
- package/dist/utilities/active-element.test.mjs +1 -1
- package/dist/utilities/async.d.mts +1 -1
- package/dist/utilities/async.mjs +2 -1
- package/dist/utilities/async.test.mjs +3 -2
- package/dist/utilities/debounced.d.mts +1 -1
- package/dist/utilities/debounced.mjs +2 -1
- package/dist/utilities/debounced.test.mjs +3 -2
- package/dist/utilities/element-rect.d.mts +1 -1
- package/dist/utilities/element-rect.mjs +2 -1
- package/dist/utilities/element-rect.test.mjs +3 -2
- package/dist/utilities/element-scroll.d.mts +1 -1
- package/dist/utilities/element-scroll.test.mjs +3 -2
- package/dist/utilities/event-driven.d.mts +1 -1
- package/dist/utilities/event-driven.mjs +2 -1
- package/dist/utilities/event-listener.d.mts +1 -1
- package/dist/utilities/event-listener.mjs +2 -1
- package/dist/utilities/event-listener.test.mjs +3 -2
- package/dist/utilities/focus-within.d.mts +1 -1
- package/dist/utilities/focus-within.mjs +2 -1
- package/dist/utilities/focus-within.test.mjs +3 -2
- package/dist/utilities/hover.d.mts +1 -1
- package/dist/utilities/hover.mjs +2 -1
- package/dist/utilities/hover.test.mjs +3 -2
- package/dist/utilities/intersection-observer.test.mjs +3 -2
- package/dist/utilities/interval.d.mts +1 -1
- package/dist/utilities/interval.mjs +2 -1
- package/dist/utilities/interval.test.mjs +3 -2
- package/dist/utilities/location.d.mts +1 -1
- package/dist/utilities/location.mjs +2 -1
- package/dist/utilities/location.test.mjs +1 -1
- package/dist/utilities/long-press.test.mjs +3 -2
- package/dist/utilities/media-devices.d.mts +1 -1
- package/dist/utilities/media-devices.mjs +2 -1
- package/dist/utilities/media-devices.test.mjs +3 -2
- package/dist/utilities/media-player.d.mts +1 -1
- package/dist/utilities/media-player.test.mjs +3 -2
- package/dist/utilities/media-query.d.mts +1 -1
- package/dist/utilities/media-query.mjs +2 -1
- package/dist/utilities/mutation-observer.test.mjs +3 -2
- package/dist/utilities/network.d.mts +1 -1
- package/dist/utilities/network.mjs +2 -1
- package/dist/utilities/network.test.mjs +1 -1
- package/dist/utilities/on-click-outside.test.mjs +3 -2
- package/dist/utilities/orientation.d.mts +1 -1
- package/dist/utilities/orientation.mjs +2 -1
- package/dist/utilities/previous.d.mts +1 -1
- package/dist/utilities/previous.mjs +2 -1
- package/dist/utilities/previous.test.mjs +3 -2
- package/dist/utilities/promise.d.mts +1 -1
- package/dist/utilities/promise.mjs +2 -1
- package/dist/utilities/promise.test.mjs +3 -2
- package/dist/utilities/retry.mjs +2 -1
- package/dist/utilities/retry.test.mjs +3 -2
- package/dist/utilities/routing.d.mts +1 -1
- package/dist/utilities/routing.mjs +2 -1
- package/dist/utilities/routing.test.mjs +1 -1
- package/dist/utilities/search-params.d.mts +1 -1
- package/dist/utilities/search-params.test.mjs +3 -2
- package/dist/utilities/ssr.test.mjs +1 -1
- package/dist/utilities/storage.d.mts +1 -1
- package/dist/utilities/storage.test.mjs +3 -2
- package/dist/utilities/throttled.d.mts +1 -1
- package/dist/utilities/throttled.mjs +2 -1
- package/dist/utilities/throttled.test.mjs +3 -2
- package/dist/utilities/timeout.d.mts +1 -1
- package/dist/utilities/timeout.mjs +2 -1
- package/dist/utilities/timeout.test.mjs +3 -2
- package/dist/utilities/window-focus.d.mts +1 -1
- package/dist/utilities/window-focus.mjs +2 -1
- package/dist/utilities/window-size.d.mts +1 -1
- package/dist/utilities/window-size.mjs +2 -1
- package/dist/utilities/window-size.test.mjs +1 -1
- package/package.json +6 -1
- package/dist/index-DydGTqZU.d.mts +0 -315
- package/dist/infer-BfzRJoCn.d.mts +0 -203
- package/dist/polyfill-BVNd6ogU.d.mts +0 -9
- /package/dist/{attributes-Dtn68R1u.d.mts → attributes-aiRoArZz.d.mts} +0 -0
- /package/dist/{magic-string.es-i62WTP6J.mjs → magic-string.es-cTgJnTCj.mjs} +0 -0
|
@@ -0,0 +1,618 @@
|
|
|
1
|
+
import { n as AttrChangeHandler, t as ATTRIBUTES } from "./attributes-aiRoArZz.mjs";
|
|
2
|
+
import { t as CustomElementRegistry } from "./custom-elements-bVYOkHKt.mjs";
|
|
3
|
+
import { a as PrimitiveNodeType, i as Slots, n as Slot, t as SLOTS } from "./slot-B5_VHB7E.mjs";
|
|
4
|
+
import { JSX } from "dom-expressions/src/jsx-h";
|
|
5
|
+
|
|
6
|
+
//#region src/jsx-runtime/element.d.ts
|
|
7
|
+
declare function createElement(type: string | Component, {
|
|
8
|
+
ref,
|
|
9
|
+
...props
|
|
10
|
+
}?: JSX$1.IntrinsicAttributes & Record<string, unknown>): JSX$1.Element;
|
|
11
|
+
//#endregion
|
|
12
|
+
//#region src/signals/lib.d.ts
|
|
13
|
+
declare const SIGNAL: unique symbol;
|
|
14
|
+
declare const COMPUTED: unique symbol;
|
|
15
|
+
declare const EFFECT: unique symbol;
|
|
16
|
+
declare const EFFECT_SCOPE: unique symbol;
|
|
17
|
+
/**
|
|
18
|
+
* Returns `true` if `fn` is a signal handle created by {@link signal}.
|
|
19
|
+
*
|
|
20
|
+
* Relies on the SIGNAL symbol.
|
|
21
|
+
*/
|
|
22
|
+
declare function isSignal(fn: unknown): boolean;
|
|
23
|
+
/**
|
|
24
|
+
* Returns `true` if `fn` is a computed handle created by {@link computed}.
|
|
25
|
+
*
|
|
26
|
+
* Relies on the COMPUTED symbol.
|
|
27
|
+
*/
|
|
28
|
+
declare function isComputed(fn: unknown): boolean;
|
|
29
|
+
/**
|
|
30
|
+
* Returns `true` if `fn` is an effect cleanup handle created by {@link effect}.
|
|
31
|
+
*
|
|
32
|
+
* Relies on the EFFECT symbol.
|
|
33
|
+
*/
|
|
34
|
+
declare function isEffect(fn: unknown): boolean;
|
|
35
|
+
/**
|
|
36
|
+
* Returns `true` if `fn` is an effectScope cleanup handle created by
|
|
37
|
+
* {@link effectScope}.
|
|
38
|
+
*
|
|
39
|
+
* Relies on `Function.name` matching the internal `effectScopeOper` function name.
|
|
40
|
+
*/
|
|
41
|
+
declare function isEffectScope(fn: () => void): boolean;
|
|
42
|
+
/**
|
|
43
|
+
* Creates a mutable reactive signal.
|
|
44
|
+
*
|
|
45
|
+
* - **Read**: call with no arguments → returns the current value and
|
|
46
|
+
* subscribes the active tracking context.
|
|
47
|
+
* - **Write**: call with a value → updates the signal and schedules
|
|
48
|
+
* downstream effects if the value changed.
|
|
49
|
+
*
|
|
50
|
+
* @example
|
|
51
|
+
* ```ts
|
|
52
|
+
* const count = signal(0);
|
|
53
|
+
* count(); // → 0 (read)
|
|
54
|
+
* count(1); // write – effects depending on count will re-run
|
|
55
|
+
* count(); // → 1
|
|
56
|
+
* ```
|
|
57
|
+
*/
|
|
58
|
+
declare function signal<T>(): Updater<T> & Computed<T>;
|
|
59
|
+
declare function signal<T>(initialValue: T): Updater<T> & Computed<T>;
|
|
60
|
+
/**
|
|
61
|
+
* Creates a lazily-evaluated computed value.
|
|
62
|
+
*
|
|
63
|
+
* The `getter` is only called when the computed value is read **and** one of
|
|
64
|
+
* its dependencies has changed since the last evaluation. If nothing has
|
|
65
|
+
* changed the cached `value` is returned without re-running `getter`.
|
|
66
|
+
*
|
|
67
|
+
* Computed values are read-only; they cannot be set directly.
|
|
68
|
+
*
|
|
69
|
+
* @param getter - Pure function deriving a value from other reactive sources.
|
|
70
|
+
* Receives the previous value as an optional optimisation hint.
|
|
71
|
+
*
|
|
72
|
+
* @example
|
|
73
|
+
* ```ts
|
|
74
|
+
* const a = signal(1);
|
|
75
|
+
* const b = signal(2);
|
|
76
|
+
* const sum = computed(() => a() + b());
|
|
77
|
+
*
|
|
78
|
+
* sum(); // → 3
|
|
79
|
+
* a(10);
|
|
80
|
+
* sum(); // → 12 (re-evaluated lazily)
|
|
81
|
+
* ```
|
|
82
|
+
*/
|
|
83
|
+
declare function computed<T>(getter: (previousValue?: T) => T): () => T;
|
|
84
|
+
/**
|
|
85
|
+
* Creates a reactive side-effect that runs immediately and re-runs whenever
|
|
86
|
+
* any signal or computed it read during its last execution changes.
|
|
87
|
+
*
|
|
88
|
+
* Use {@link onCleanup} inside `fn` to register teardown logic that runs
|
|
89
|
+
* before each re-execution and on final disposal.
|
|
90
|
+
*
|
|
91
|
+
* If `effect` is called inside an `effectScope` or another `effect`, the
|
|
92
|
+
* new effect is automatically owned by the outer scope and will be disposed
|
|
93
|
+
* when the scope is disposed.
|
|
94
|
+
*
|
|
95
|
+
* @param fn - The side-effect body. Reactive reads inside this function
|
|
96
|
+
* establish dependency links.
|
|
97
|
+
* @returns A disposal function. Call it to stop the effect and run any
|
|
98
|
+
* registered cleanup.
|
|
99
|
+
*
|
|
100
|
+
* @example
|
|
101
|
+
* ```ts
|
|
102
|
+
* const url = signal('/api/data');
|
|
103
|
+
*
|
|
104
|
+
* const stop = effect(() => {
|
|
105
|
+
* const controller = new AbortController();
|
|
106
|
+
* fetch(url(), { signal: controller.signal });
|
|
107
|
+
* onCleanup(() => controller.abort());
|
|
108
|
+
* });
|
|
109
|
+
*
|
|
110
|
+
* url('/api/other'); // previous fetch is aborted, new one starts
|
|
111
|
+
* stop(); // final cleanup: abort the last fetch
|
|
112
|
+
* ```
|
|
113
|
+
*/
|
|
114
|
+
declare function effect(fn: () => void): () => void;
|
|
115
|
+
/**
|
|
116
|
+
* Creates an ownership scope that groups reactive effects so they can all be
|
|
117
|
+
* disposed at once.
|
|
118
|
+
*
|
|
119
|
+
* Effects and nested scopes created inside `fn` are linked to this scope.
|
|
120
|
+
* When the returned disposal function is called, all owned effects are stopped
|
|
121
|
+
* in cascade – triggering their registered {@link onCleanup} callbacks – and
|
|
122
|
+
* the scope itself is removed from any parent scope that owns it.
|
|
123
|
+
*
|
|
124
|
+
* @param fn - Synchronous setup function. Create effects and nested scopes
|
|
125
|
+
* here.
|
|
126
|
+
* @returns A disposal function that tears down all owned effects and the scope
|
|
127
|
+
* itself.
|
|
128
|
+
*
|
|
129
|
+
* @example
|
|
130
|
+
* ```ts
|
|
131
|
+
* const stopAll = effectScope(() => {
|
|
132
|
+
* effect(() => console.log('a:', a()));
|
|
133
|
+
* effect(() => console.log('b:', b()));
|
|
134
|
+
* });
|
|
135
|
+
*
|
|
136
|
+
* stopAll(); // both effects stopped simultaneously
|
|
137
|
+
* ```
|
|
138
|
+
*/
|
|
139
|
+
declare function effectScope(fn: () => void): () => void;
|
|
140
|
+
/**
|
|
141
|
+
* Registers a cleanup callback for the currently executing effect or scope.
|
|
142
|
+
*
|
|
143
|
+
* The callback will be called:
|
|
144
|
+
* 1. **Before the next re-run** of the enclosing effect (so resources from
|
|
145
|
+
* the previous run are released before the new run sets them up again).
|
|
146
|
+
* 2. **On final disposal** of the effect, whether triggered explicitly by
|
|
147
|
+
* calling the effect's cleanup handle or implicitly by an owning
|
|
148
|
+
* `effectScope` being disposed.
|
|
149
|
+
*
|
|
150
|
+
* Calling `onCleanup` outside of a tracking context (no active effect) is a
|
|
151
|
+
* no-op; it does **not** throw.
|
|
152
|
+
*
|
|
153
|
+
* Only one cleanup function per effect run is supported. Calling `onCleanup`
|
|
154
|
+
* multiple times within the same run overwrites the previous registration.
|
|
155
|
+
*
|
|
156
|
+
* @param fn - The teardown callback.
|
|
157
|
+
*
|
|
158
|
+
* @example
|
|
159
|
+
* ```ts
|
|
160
|
+
* effect(() => {
|
|
161
|
+
* const id = setInterval(() => tick(), 1000);
|
|
162
|
+
* onCleanup(() => clearInterval(id));
|
|
163
|
+
* });
|
|
164
|
+
* ```
|
|
165
|
+
*
|
|
166
|
+
* @example Composable helper – no prop-drilling needed:
|
|
167
|
+
* ```ts
|
|
168
|
+
* function useEventListener(target: EventTarget, type: string, handler: EventListener) {
|
|
169
|
+
* target.addEventListener(type, handler);
|
|
170
|
+
* onCleanup(() => target.removeEventListener(type, handler));
|
|
171
|
+
* }
|
|
172
|
+
*
|
|
173
|
+
* effect(() => {
|
|
174
|
+
* useEventListener(window, 'resize', onResize);
|
|
175
|
+
* });
|
|
176
|
+
* ```
|
|
177
|
+
*/
|
|
178
|
+
declare function onCleanup(fn: () => void): void;
|
|
179
|
+
/**
|
|
180
|
+
* Runs `fn` as a single atomic update: all signal writes inside `fn` are
|
|
181
|
+
* collected and effects are flushed only once after `fn` returns, rather than
|
|
182
|
+
* after each individual write.
|
|
183
|
+
*
|
|
184
|
+
* Batches can be nested; the flush only occurs when the outermost batch
|
|
185
|
+
* completes.
|
|
186
|
+
*
|
|
187
|
+
* @example
|
|
188
|
+
* ```ts
|
|
189
|
+
* batch(() => {
|
|
190
|
+
* x(1);
|
|
191
|
+
* y(2);
|
|
192
|
+
* z(3);
|
|
193
|
+
* }); // effects that depend on x, y, or z run once here
|
|
194
|
+
* ```
|
|
195
|
+
*/
|
|
196
|
+
declare function batch(fn: () => void): void;
|
|
197
|
+
/**
|
|
198
|
+
* Executes `fn` in a non-tracking context: any signals read inside `fn` do
|
|
199
|
+
* **not** create dependency links on the currently active subscriber.
|
|
200
|
+
*
|
|
201
|
+
* Useful when you need to read a signal's current value without subscribing to
|
|
202
|
+
* future changes.
|
|
203
|
+
*
|
|
204
|
+
* @returns The value returned by `fn`.
|
|
205
|
+
*
|
|
206
|
+
* @example
|
|
207
|
+
* ```ts
|
|
208
|
+
* const logCount = effect(() => {
|
|
209
|
+
* console.log('triggered by a:', a());
|
|
210
|
+
* // read b without subscribing – effect won't re-run when b changes
|
|
211
|
+
* console.log('current b:', untracked(b));
|
|
212
|
+
* });
|
|
213
|
+
* ```
|
|
214
|
+
*/
|
|
215
|
+
declare function untracked<T>(fn: Computed<T>): T;
|
|
216
|
+
/**
|
|
217
|
+
* Manually triggers all subscribers of every signal read inside `fn`.
|
|
218
|
+
*
|
|
219
|
+
* Unlike writing to a signal, `trigger` does not change the signal's value; it
|
|
220
|
+
* only forces downstream effects and computeds to re-evaluate.
|
|
221
|
+
*
|
|
222
|
+
* @param fn - Function whose reactive reads identify the signals to trigger.
|
|
223
|
+
*
|
|
224
|
+
* @example
|
|
225
|
+
* ```ts
|
|
226
|
+
* const items = signal([1, 2, 3]);
|
|
227
|
+
*
|
|
228
|
+
* // Mutate in place (referential equality won't detect the change):
|
|
229
|
+
* items().push(4);
|
|
230
|
+
* trigger(items); // manually notify subscribers
|
|
231
|
+
* ```
|
|
232
|
+
*/
|
|
233
|
+
declare function trigger<T = void>(fn: Computed<T>): void;
|
|
234
|
+
//#endregion
|
|
235
|
+
//#region src/signals/index.d.ts
|
|
236
|
+
declare function isReactive<T>(value: MaybeReactive<T>): value is () => T;
|
|
237
|
+
type Updater<T> = (value: T) => void;
|
|
238
|
+
type Computed<T> = () => T;
|
|
239
|
+
type Signal<T> = Updater<T> & Computed<T>;
|
|
240
|
+
/**
|
|
241
|
+
* A decorator that makes a class field reactive by automatically wrapping its value in a signal.
|
|
242
|
+
*
|
|
243
|
+
* The field behaves like a normal property (get/set) but reactivity is tracked under the hood.
|
|
244
|
+
* Any reads will subscribe to the signal and any writes will trigger updates.
|
|
245
|
+
*
|
|
246
|
+
* @example
|
|
247
|
+
* ```ts
|
|
248
|
+
* class Counter {
|
|
249
|
+
* @reactive()
|
|
250
|
+
* count: number = 0;
|
|
251
|
+
* }
|
|
252
|
+
*
|
|
253
|
+
* const counter = new Counter();
|
|
254
|
+
* counter.count++; // Triggers reactivity
|
|
255
|
+
* console.log(counter.count); // Subscribes to changes
|
|
256
|
+
* ```
|
|
257
|
+
*
|
|
258
|
+
* @remarks
|
|
259
|
+
* Equivalent to manually creating a private signal and getter/setter:
|
|
260
|
+
* ```ts
|
|
261
|
+
* class Counter {
|
|
262
|
+
* #count = signal(0);
|
|
263
|
+
* get count() { return this.#count(); }
|
|
264
|
+
* set count(value) { this.#count(value); }
|
|
265
|
+
* }
|
|
266
|
+
* ```
|
|
267
|
+
*/
|
|
268
|
+
declare function reactive<This extends object, Value>(source?: (self: This) => Signal<Value>): (_target: unknown, context: ClassFieldDecoratorContext<This, Value>) => (this: This, initialValue: Value) => Value;
|
|
269
|
+
/**
|
|
270
|
+
* A value that may be static or reactive. Accepts a plain `T` or a
|
|
271
|
+
* zero-arg getter (`() => T`) — typically a `signal` or `computed`.
|
|
272
|
+
*
|
|
273
|
+
* Used across the library anywhere a prop or attribute may be bound to
|
|
274
|
+
* reactive state. Resolve with {@link resolve}, detect with {@link isReactive}.
|
|
275
|
+
*
|
|
276
|
+
* @template T — the value type.
|
|
277
|
+
*
|
|
278
|
+
* @example
|
|
279
|
+
* ```ts
|
|
280
|
+
* import { signal, computed } from "elements-kit/signals";
|
|
281
|
+
*
|
|
282
|
+
* const count = signal(0);
|
|
283
|
+
* const double = computed(() => count() * 2);
|
|
284
|
+
*
|
|
285
|
+
* const a: MaybeReactive<number> = 5; // static
|
|
286
|
+
* const b: MaybeReactive<number> = count; // signal (getter)
|
|
287
|
+
* const c: MaybeReactive<number> = double; // computed (getter)
|
|
288
|
+
* ```
|
|
289
|
+
*/
|
|
290
|
+
type MaybeReactive<T> = T | Computed<T>;
|
|
291
|
+
/**
|
|
292
|
+
* Resolve a {@link MaybeReactive} to its current value. Calls the getter
|
|
293
|
+
* when reactive; returns the value as-is when static.
|
|
294
|
+
*
|
|
295
|
+
* @example
|
|
296
|
+
* ```ts
|
|
297
|
+
* resolve(5); // 5
|
|
298
|
+
* resolve(() => count()); // current count value
|
|
299
|
+
* ```
|
|
300
|
+
*/
|
|
301
|
+
declare function resolve<T>(value: MaybeReactive<T>): T;
|
|
302
|
+
/**
|
|
303
|
+
* Turn a reactive-props object into a bag of per-key getters. Callers may
|
|
304
|
+
* pass values or reactive sources (`signal`, `computed`); reading
|
|
305
|
+
* `props.name()` inside an effect or JSX getter subscribes to whatever
|
|
306
|
+
* drives it. Static values become stable thunks, signals and computed pass
|
|
307
|
+
* through unchanged — so identity is preserved (`props.name === props.name`).
|
|
308
|
+
*
|
|
309
|
+
* The JSX runtime auto-applies this to function-component props — call
|
|
310
|
+
* directly only for non-JSX call sites or nested prop bags.
|
|
311
|
+
*
|
|
312
|
+
* @example
|
|
313
|
+
* ```ts
|
|
314
|
+
* import { resolveProps } from "elements-kit/signals";
|
|
315
|
+
* import { signal } from "elements-kit/signals";
|
|
316
|
+
*
|
|
317
|
+
* const count = signal(0);
|
|
318
|
+
* const props = resolveProps({ count, label: "n" });
|
|
319
|
+
* props.count(); // 0 — subscribes to count
|
|
320
|
+
* props.label(); // "n"
|
|
321
|
+
* ```
|
|
322
|
+
*/
|
|
323
|
+
declare function resolveProps<P extends object>(raw: { [K in keyof P]: MaybeReactive<P[K]> }): ReactiveProps<P>;
|
|
324
|
+
//#endregion
|
|
325
|
+
//#region src/jsx-runtime/fragment.d.ts
|
|
326
|
+
/**
|
|
327
|
+
* Used by the JSX transform for `<>...</>` fragments.
|
|
328
|
+
*
|
|
329
|
+
* Each child is routed through `mountChild`, which handles Nodes, strings,
|
|
330
|
+
* numbers, arrays, and reactive getters — matching the behavior of any other
|
|
331
|
+
* JSX container. `mountChild` also wires each child's cleanup via its own
|
|
332
|
+
* `effectScope`, which links to the enclosing `effectScope` created by
|
|
333
|
+
* `createElement(Fragment, ...)` for disposal propagation.
|
|
334
|
+
*/
|
|
335
|
+
declare function Fragment(props: {
|
|
336
|
+
children?: () => Child;
|
|
337
|
+
}): DocumentFragment;
|
|
338
|
+
//#endregion
|
|
339
|
+
//#region src/jsx-runtime/index.d.ts
|
|
340
|
+
/**
|
|
341
|
+
* Maps slot names to `Child` content.
|
|
342
|
+
* Use this to type `slot:name` JSX props on a custom component.
|
|
343
|
+
*
|
|
344
|
+
* @example
|
|
345
|
+
* ```tsx
|
|
346
|
+
* function Card(props: { title: string } & SlotProps<"header" | "footer">) { … }
|
|
347
|
+
* // caller: <Card title="…" slot:header={<h1>…</h1>} slot:footer={<p>…</p>} />
|
|
348
|
+
* ```
|
|
349
|
+
*/
|
|
350
|
+
type SlotProps<K extends string> = { [P in K as `slot:${P}`]?: Child };
|
|
351
|
+
/**
|
|
352
|
+
* Get the full JSX prop types for a given tag name, including reactive
|
|
353
|
+
* attributes, events, and all our namespace extensions.
|
|
354
|
+
*
|
|
355
|
+
* @example
|
|
356
|
+
* ```ts
|
|
357
|
+
* type InputProps = Attrs<"input">; // typed props for <input>
|
|
358
|
+
* type DivProps = Attrs<"div">; // typed props for <div>
|
|
359
|
+
* ```
|
|
360
|
+
*/
|
|
361
|
+
type Attrs<K extends keyof JSX$1.IntrinsicElements> = JSX$1.IntrinsicElements[K];
|
|
362
|
+
/** Extra props injected into every intrinsic element beyond dom-expressions defaults. */
|
|
363
|
+
type OurProps = {
|
|
364
|
+
ref?: (el: Element) => void;
|
|
365
|
+
[slot: `slot:${string}`]: Computed<Child>;
|
|
366
|
+
[cls: `class:${string}`]: Computed<boolean>;
|
|
367
|
+
[sty: `style:${string}`]: Computed<string | null>;
|
|
368
|
+
[prop: `prop:${string}`]: Computed<unknown>;
|
|
369
|
+
};
|
|
370
|
+
type WithOurProps<T> = T & OurProps;
|
|
371
|
+
declare namespace JSX$1 {
|
|
372
|
+
export type Element = globalThis.Element | globalThis.DocumentFragment | null;
|
|
373
|
+
export type ElementType = Child | Component;
|
|
374
|
+
export interface ElementChildrenAttribute {
|
|
375
|
+
children: {};
|
|
376
|
+
}
|
|
377
|
+
export interface IntrinsicAttributes {
|
|
378
|
+
ref?: (el: Element) => void;
|
|
379
|
+
}
|
|
380
|
+
export type LibraryManagedAttributes<C, P> = ResolveProps<C, P>;
|
|
381
|
+
type RegisteredElements = { [K in keyof CustomElementRegistry]: CustomElementRegistry[K] extends AnyElementCtor ? ElementProps<CustomElementRegistry[K]> : never };
|
|
382
|
+
export type IntrinsicElements = { [K in keyof JSX.IntrinsicElements]: WithOurProps<JSX.IntrinsicElements[K]> } & RegisteredElements & {
|
|
383
|
+
/** Unregistered custom elements (`x-foo`, `my-component`, …) — loose fallback. */[customElement: `${string}-${string}`]: WithOurProps<JSX.DOMAttributes<HTMLElement>> & Record<string, unknown>;
|
|
384
|
+
};
|
|
385
|
+
export {};
|
|
386
|
+
}
|
|
387
|
+
//#endregion
|
|
388
|
+
//#region src/jsx-runtime/types.d.ts
|
|
389
|
+
/** An instance created by a component class — must expose `render()`. */
|
|
390
|
+
interface ComponentInstance {
|
|
391
|
+
render(): JSX$1.Element;
|
|
392
|
+
}
|
|
393
|
+
/** A class whose constructor returns a ComponentInstance. */
|
|
394
|
+
type ComponentClass<P extends Record<PropertyKey, unknown> = any> = new (props: P) => ComponentInstance;
|
|
395
|
+
type ComponentFn<P extends Record<PropertyKey, unknown> = any> = (props: ReactiveProps<P>) => JSX$1.Element;
|
|
396
|
+
/** Anything valid as the first arg to `createElement` / a JSX tag target. */
|
|
397
|
+
type Component = NonNullable<JSX$1.Element> | ComponentClass | ComponentFn;
|
|
398
|
+
/** A resolved runtime node — what `applyProps` / `applyChildren` operate on. */
|
|
399
|
+
type PropsTarget = NonNullable<JSX$1.Element> | ComponentInstance;
|
|
400
|
+
/** Anything that can appear as a JSX child. */
|
|
401
|
+
type Child = PrimitiveNodeType | JSX$1.Element | AnyFn | Child[];
|
|
402
|
+
type AnyFn = (...args: any[]) => Child;
|
|
403
|
+
//#endregion
|
|
404
|
+
//#region src/jsx-runtime/infer.d.ts
|
|
405
|
+
type AnyElementCtor = abstract new (...args: any[]) => HTMLElement;
|
|
406
|
+
type Inst<C> = C extends (abstract new (...args: any[]) => infer I) ? I : never;
|
|
407
|
+
/**
|
|
408
|
+
* When the instance extends `HTMLElement`, drop the DOM surface so only the
|
|
409
|
+
* user's own fields remain. Plain class components also drop `render` — it's
|
|
410
|
+
* the internal rendering method, not a JSX prop.
|
|
411
|
+
*/
|
|
412
|
+
type PublicPropKeys<I> = I extends HTMLElement ? Exclude<keyof I, keyof HTMLElement | symbol> : Exclude<keyof I, symbol | "render">;
|
|
413
|
+
/**
|
|
414
|
+
* Instance fields typed as `Slot` are default-slot mounts at runtime — the JSX
|
|
415
|
+
* consumer passes DOM content, which `applyChildren` routes via `applySlot`.
|
|
416
|
+
* Surface them as `Child` in the JSX prop shape so callers type-check.
|
|
417
|
+
*/
|
|
418
|
+
type PropValueFor<V> = V extends Slot ? Child : V;
|
|
419
|
+
/**
|
|
420
|
+
* Public instance fields of `I` — all optional. For `HTMLElement` subclasses
|
|
421
|
+
* the DOM surface is excluded; for plain classes, all own keys are kept.
|
|
422
|
+
* `Slot`-typed fields are mapped to `Child` (see {@link PropValueFor}).
|
|
423
|
+
*/
|
|
424
|
+
type PropsOfInstance<I> = { [K in PublicPropKeys<I> & string]?: PropValueFor<I[K]> };
|
|
425
|
+
/**
|
|
426
|
+
* Promote keys `K` of `P` to required; leave the rest unchanged.
|
|
427
|
+
*
|
|
428
|
+
* @template P — the prop object type.
|
|
429
|
+
* @template K — the keys to make required.
|
|
430
|
+
*
|
|
431
|
+
* @example
|
|
432
|
+
* ```ts
|
|
433
|
+
* type Optional = { a?: number; b?: string; c?: boolean };
|
|
434
|
+
* type AB = Require<Optional, "a" | "b">;
|
|
435
|
+
* // { a: number; b: string; c?: boolean }
|
|
436
|
+
* ```
|
|
437
|
+
*/
|
|
438
|
+
type Require<P, K extends keyof P> = { [X in K]-?: P[X] } & Omit<P, K>;
|
|
439
|
+
/**
|
|
440
|
+
* Wrap every prop in {@link MaybeReactive} so callers may pass either a
|
|
441
|
+
* plain value or a reactive getter. Function-typed props (event handlers,
|
|
442
|
+
* render callbacks) are wrapped too — the JSX runtime detects branded
|
|
443
|
+
* signals/computed and re-binds on change. Optionality is preserved at the
|
|
444
|
+
* key level — the `| undefined` stays at the prop, not inside the reactive.
|
|
445
|
+
*
|
|
446
|
+
* @template P — source prop object type.
|
|
447
|
+
*
|
|
448
|
+
* @example
|
|
449
|
+
* ```ts
|
|
450
|
+
* type Raw = { count: number; label?: string; onClick: (e: Event) => void };
|
|
451
|
+
* type Wrapped = MaybeReactiveProps<Raw>;
|
|
452
|
+
* // {
|
|
453
|
+
* // count: MaybeReactive<number>;
|
|
454
|
+
* // label?: MaybeReactive<string>;
|
|
455
|
+
* // onClick: MaybeReactive<(e: Event) => void>; // computed handlers OK
|
|
456
|
+
* // }
|
|
457
|
+
* ```
|
|
458
|
+
*
|
|
459
|
+
* @see {@link MaybeReactive}
|
|
460
|
+
* @see {@link Props}
|
|
461
|
+
*/
|
|
462
|
+
type MaybeReactiveProps<P> = { [K in keyof P]: undefined extends P[K] ? MaybeReactive<Exclude<P[K], undefined>> | undefined : MaybeReactive<P[K]> };
|
|
463
|
+
declare const RAW_PROPS: unique symbol;
|
|
464
|
+
type ReactiveProps<P> = { readonly [K in keyof P]: Computed<P[K]> } & {
|
|
465
|
+
readonly [RAW_PROPS]?: P;
|
|
466
|
+
};
|
|
467
|
+
/** Recover the raw prop shape `P` from a `ReactiveProps<P>`. */
|
|
468
|
+
type RawProps<R> = R extends {
|
|
469
|
+
readonly [RAW_PROPS]?: infer P;
|
|
470
|
+
} ? P : R;
|
|
471
|
+
/**
|
|
472
|
+
* Resolve the JSX call-site prop type for a component (function or class).
|
|
473
|
+
* Wired into `JSX.LibraryManagedAttributes` so parents see the right shape:
|
|
474
|
+
* - branded `ReactiveProps<P>` (function components) → `MaybeReactiveProps<P>`
|
|
475
|
+
* - empty constructor param (instance-field classes) → `Props<C>`
|
|
476
|
+
* - otherwise pass the constructor param shape through (preserves generic
|
|
477
|
+
* inference for classes like `For<T>` whose param is already shaped).
|
|
478
|
+
*
|
|
479
|
+
* Component props only — custom-element attributes go through {@link ElementProps}.
|
|
480
|
+
*/
|
|
481
|
+
type ResolveProps<C, P, NN = NonNullable<P>> = NN extends {
|
|
482
|
+
readonly [RAW_PROPS]?: infer Raw;
|
|
483
|
+
} ? MaybeReactiveProps<Raw> : [keyof NN] extends [never] ? Props<C> : NN;
|
|
484
|
+
type InstancePropsOf<C> = Inst<C> extends infer I ? PropsOfInstance<I> : {};
|
|
485
|
+
type PropKeysOf<C> = keyof InstancePropsOf<C> & string;
|
|
486
|
+
type AttrMap<C> = C extends {
|
|
487
|
+
[ATTRIBUTES]: infer M;
|
|
488
|
+
} ? M : {};
|
|
489
|
+
type HandlerValue<H> = H extends AttrChangeHandler<any> ? string | null : H;
|
|
490
|
+
type AttrsOf<C> = AttrMap<C> extends infer M ? M extends Record<string, unknown> ? { [K in Exclude<keyof M & string, PropKeysOf<C>>]?: MaybeReactive<HandlerValue<M[K]>> } : {} : {};
|
|
491
|
+
type FlatPropsOf<C> = MaybeReactiveProps<InstancePropsOf<C>>;
|
|
492
|
+
type PropNamespacedOf<C> = { [K in PropKeysOf<C> as `prop:${K}`]?: NonNullable<InstancePropsOf<C>[K]> };
|
|
493
|
+
type EventMapOf<C> = C extends {
|
|
494
|
+
events: infer E;
|
|
495
|
+
} ? E : {};
|
|
496
|
+
type Capitalize1<S extends string> = S extends `${infer H}${infer R}` ? `${Uppercase<H>}${R}` : S;
|
|
497
|
+
type EventsOf<C> = EventMapOf<C> extends infer E ? E extends Record<string, Event> ? { [K in keyof E & string as `on:${K}`]?: MaybeReactive<(ev: E[K]) => void> } & { [K in keyof E & string as `on${Capitalize1<K>}`]?: MaybeReactive<(ev: E[K]) => void> } : {} : {};
|
|
498
|
+
type SlotKeys<I> = I extends {
|
|
499
|
+
[SLOTS]: Slots<infer K>;
|
|
500
|
+
} ? K : never;
|
|
501
|
+
type InstanceOf<C> = C extends (abstract new (...args: any[]) => infer I) ? I : C;
|
|
502
|
+
type SlotsOf<C> = SlotKeys<InstanceOf<C>> extends infer K ? [K] extends [string] ? { [P in K as `slot:${P}`]?: Child } : {} : {};
|
|
503
|
+
type ChildrenOf<C> = C extends {
|
|
504
|
+
children: never;
|
|
505
|
+
} ? {} : {
|
|
506
|
+
children?: Child;
|
|
507
|
+
};
|
|
508
|
+
type BaseDOMAttrs = JSX.DOMAttributes<HTMLElement>;
|
|
509
|
+
type Namespaces = {
|
|
510
|
+
ref?: (el: Element) => void;
|
|
511
|
+
[cls: `class:${string}`]: MaybeReactive<boolean>;
|
|
512
|
+
[sty: `style:${string}`]: MaybeReactive<string | null>;
|
|
513
|
+
[prop: `prop:${string}`]: unknown;
|
|
514
|
+
};
|
|
515
|
+
/**
|
|
516
|
+
* Full JSX prop type for a custom-element class (extends `HTMLElement`).
|
|
517
|
+
*
|
|
518
|
+
* Composes every surface the element can receive from JSX:
|
|
519
|
+
* - **Attributes** — keys from `static [ATTRIBUTES]` (typed `MaybeReactive<string | null>`).
|
|
520
|
+
* Keys also present on the instance are dropped here so the flat key carries the property type.
|
|
521
|
+
* - **Flat properties** — public instance fields, wrapped in `MaybeReactive`.
|
|
522
|
+
* - **`prop:*`** — explicit property assignment for every field.
|
|
523
|
+
* - **Events** — keys from `declare static events: { ... }` produce both
|
|
524
|
+
* `on:${K}` and `on${Capitalize<K>}` typed handlers.
|
|
525
|
+
* - **Slots** — keys from `[SLOTS] = Slots.new([...] as const)` produce `slot:${K}`.
|
|
526
|
+
* - **Children** — `children?: Child` unless `static children: never`.
|
|
527
|
+
* - **DOM attrs** — the standard dom-expressions surface (`class`, `style`, `ref`, …).
|
|
528
|
+
*
|
|
529
|
+
* @template C — the custom-element class (constructor type).
|
|
530
|
+
*
|
|
531
|
+
* @example
|
|
532
|
+
* ```ts
|
|
533
|
+
* @attributes
|
|
534
|
+
* class XRange extends HTMLElement {
|
|
535
|
+
* static [ATTRIBUTES]: Attributes<XRange> = { min(v) { this.min = +v! } };
|
|
536
|
+
* declare static events: { commit: CustomEvent<number> };
|
|
537
|
+
* [SLOTS] = Slots.new(["label"] as const);
|
|
538
|
+
* @reactive() min = 0;
|
|
539
|
+
* }
|
|
540
|
+
*
|
|
541
|
+
* type Props = ElementProps<typeof XRange>;
|
|
542
|
+
* // {
|
|
543
|
+
* // min?: MaybeReactive<number>;
|
|
544
|
+
* // "prop:min"?: number;
|
|
545
|
+
* // "on:commit"?: (e: CustomEvent<number>) => void;
|
|
546
|
+
* // onCommit?: (e: CustomEvent<number>) => void;
|
|
547
|
+
* // "slot:label"?: Child;
|
|
548
|
+
* // children?: Child;
|
|
549
|
+
* // // …plus ref, class, class:*, style, style:*, standard DOM events
|
|
550
|
+
* // }
|
|
551
|
+
* ```
|
|
552
|
+
*
|
|
553
|
+
* @see {@link Props} for class-components / function components (no attr/event/slot synthesis).
|
|
554
|
+
*/
|
|
555
|
+
type ElementProps<C extends AnyElementCtor> = BaseDOMAttrs & AttrsOf<C> & FlatPropsOf<C> & PropNamespacedOf<C> & EventsOf<C> & SlotsOf<C> & ChildrenOf<C> & Namespaces;
|
|
556
|
+
/**
|
|
557
|
+
* Props of a class component that receives them via its constructor:
|
|
558
|
+
* `class Comp { constructor(props: P) }`. Reads `ConstructorParameters[0]`.
|
|
559
|
+
*
|
|
560
|
+
* Use this when the component's props live on a constructor parameter rather
|
|
561
|
+
* than on public instance fields. For instance-field components, use {@link Props}.
|
|
562
|
+
*
|
|
563
|
+
* @template C — the class constructor type (e.g. `typeof Card`).
|
|
564
|
+
*
|
|
565
|
+
* @example
|
|
566
|
+
* ```ts
|
|
567
|
+
* class Card {
|
|
568
|
+
* constructor(public props: { title: string; children?: Child }) {}
|
|
569
|
+
* render() { return <div>{this.props.title}</div>; }
|
|
570
|
+
* }
|
|
571
|
+
*
|
|
572
|
+
* type P = ComponentProps<typeof Card>;
|
|
573
|
+
* // { title: string; children?: Child }
|
|
574
|
+
* ```
|
|
575
|
+
*
|
|
576
|
+
* @see {@link Props}
|
|
577
|
+
*/
|
|
578
|
+
type ComponentProps<C extends ComponentClass<any>> = C extends ComponentClass<infer P> ? (P extends object ? P : {}) : {};
|
|
579
|
+
/**
|
|
580
|
+
* Props for any component — class or function. Wraps every non-function
|
|
581
|
+
* prop in {@link MaybeReactive} so callers may pass values or reactive getters.
|
|
582
|
+
*
|
|
583
|
+
* Branches by input shape:
|
|
584
|
+
* - **Class constructor** (`typeof Cls`) → uses `PropsOfInstance<InstanceType<Cls>>`.
|
|
585
|
+
* - **Function component** (`(props: P) => ...`) → uses the first parameter.
|
|
586
|
+
* - **Class instance** (`Cls<T>`) → uses `PropsOfInstance<Cls<T>>` (useful when
|
|
587
|
+
* generics need to flow through — see the `For` example below).
|
|
588
|
+
*
|
|
589
|
+
* Does **not** synthesize `on:*`, `slot:*`, or attribute surface. For custom
|
|
590
|
+
* elements that need those, use {@link ElementProps}.
|
|
591
|
+
*
|
|
592
|
+
* @template C — constructor, function, or instance.
|
|
593
|
+
*
|
|
594
|
+
* @example
|
|
595
|
+
* ```ts
|
|
596
|
+
* // 1. Class instance (lets a generic flow)
|
|
597
|
+
* class For<T> { each: T[] = []; render() { return null } }
|
|
598
|
+
* type ForProps<T> = Props<For<T>>;
|
|
599
|
+
* // ↑ { each?: MaybeReactive<T[]> }
|
|
600
|
+
*
|
|
601
|
+
* // 2. Function component
|
|
602
|
+
* const Greeting = (_p: { name: string; excited?: boolean }) => null;
|
|
603
|
+
* type GreetingProps = Props<typeof Greeting>;
|
|
604
|
+
* // ↑ { name: MaybeReactive<string>; excited?: MaybeReactive<boolean> }
|
|
605
|
+
*
|
|
606
|
+
* // 3. Class constructor
|
|
607
|
+
* class Counter { count = 0; render() { return null } }
|
|
608
|
+
* type CounterProps = Props<typeof Counter>;
|
|
609
|
+
* // ↑ { count?: MaybeReactive<number> }
|
|
610
|
+
* ```
|
|
611
|
+
*
|
|
612
|
+
* @see {@link ElementProps} — custom elements (`HTMLElement` subclasses).
|
|
613
|
+
* @see {@link ComponentProps} — constructor-param-based class components.
|
|
614
|
+
* @see {@link MaybeReactiveProps}
|
|
615
|
+
*/
|
|
616
|
+
type Props<C> = (C extends (abstract new (...args: any[]) => infer I) ? MaybeReactiveProps<PropsOfInstance<I>> : C extends ((props: infer P, ...rest: any[]) => any) ? P extends object ? MaybeReactiveProps<RawProps<P>> : {} : MaybeReactiveProps<PropsOfInstance<C>>) & SlotsOf<C>;
|
|
617
|
+
//#endregion
|
|
618
|
+
export { SIGNAL as A, signal as B, isReactive as C, COMPUTED as D, resolveProps as E, isComputed as F, untracked as H, isEffect as I, isEffectScope as L, computed as M, effect as N, EFFECT as O, effectScope as P, isSignal as R, Updater as S, resolve as T, createElement as U, trigger as V, SlotProps as _, RawProps as a, MaybeReactive as b, ResolveProps as c, ComponentClass as d, ComponentFn as f, JSX$1 as g, Attrs as h, Props as i, batch as j, EFFECT_SCOPE as k, Child as l, PropsTarget as m, ElementProps as n, ReactiveProps as o, ComponentInstance as p, MaybeReactiveProps as r, Require as s, ComponentProps as t, Component as u, Fragment as v, reactive as w, Signal as x, Computed as y, onCleanup as z };
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { m as signal, s as effect } from "../lib-D6duEs38.mjs";
|
|
2
|
+
import "../signals/index.mjs";
|
|
3
|
+
import { t as scope } from "../scope-DM2gzOkb.mjs";
|
|
2
4
|
import { useEffect, useMemo, useRef, useSyncExternalStore } from "react";
|
|
3
5
|
//#region src/integrations/react.ts
|
|
4
6
|
/**
|
|
@@ -65,9 +67,9 @@ function useSignal(value) {
|
|
|
65
67
|
function useScope(callback) {
|
|
66
68
|
const computedRef = useRef(void 0);
|
|
67
69
|
const stopScope = useMemo(() => {
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
70
|
+
const [result, stop] = scope(callback);
|
|
71
|
+
computedRef.current = result;
|
|
72
|
+
return stop;
|
|
71
73
|
}, [callback]);
|
|
72
74
|
const value = useSignal(computedRef.current ?? fallbackSignal);
|
|
73
75
|
useEffect(() => {
|