solid-js 2.0.0-beta.11 → 2.0.0-beta.12
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/CHEATSHEET.md +6 -5
- package/dist/dev.cjs +9 -4
- package/dist/dev.js +9 -4
- package/dist/server.cjs +51 -9
- package/dist/server.js +53 -8
- package/dist/solid.cjs +9 -4
- package/dist/solid.js +9 -4
- package/package.json +2 -2
- package/types/client/flow.d.ts +75 -14
- package/types/server/flow.d.ts +58 -5
- package/types/server/signals.d.ts +13 -4
- package/types-cjs/client/flow.d.cts +75 -14
- package/types-cjs/server/flow.d.cts +58 -5
- package/types-cjs/server/signals.d.cts +13 -4
package/CHEATSHEET.md
CHANGED
|
@@ -255,12 +255,12 @@ Optimistic writes revert when the transition completes.
|
|
|
255
255
|
```tsx
|
|
256
256
|
// List, keyed by identity (default)
|
|
257
257
|
<For each={items()}>
|
|
258
|
-
{(item, i) => <Row item={item
|
|
258
|
+
{(item, i) => <Row item={item} index={i()} />}
|
|
259
259
|
</For>
|
|
260
260
|
|
|
261
261
|
// List, non-keyed (replaces <Index>)
|
|
262
262
|
<For each={items()} keyed={false}>
|
|
263
|
-
{(item, i) => <Row item={item()} index={i
|
|
263
|
+
{(item, i) => <Row item={item()} index={i} />}
|
|
264
264
|
</For>
|
|
265
265
|
|
|
266
266
|
// List with custom key
|
|
@@ -316,7 +316,8 @@ import { Dynamic } from "@solidjs/web";
|
|
|
316
316
|
<Dynamic component={isEditing() ? Editor : Viewer} value={value()} />
|
|
317
317
|
```
|
|
318
318
|
|
|
319
|
-
`<For>` non-keyed: `item` and `i`
|
|
319
|
+
`<For>` non-keyed: `item` is an **accessor** and `i` is a plain number.
|
|
320
|
+
`<For>` default/keyed-by-identity: `item` is a **plain value** and `i` is an accessor.
|
|
320
321
|
`<Repeat>`: `i` is a **plain number**.
|
|
321
322
|
|
|
322
323
|
---
|
|
@@ -618,8 +619,8 @@ If your training data is 1.x, these are the corrections. **Read this before gene
|
|
|
618
619
|
- **No top-level reactive reads in component body** — reading signals/props directly at the top of a component warns. Read inside JSX, a memo, or `untrack`.
|
|
619
620
|
- **Props are values, not accessors** — at the call site call accessors (`<X v={count()} />`, not `<X v={count} />`). The single most common AI-generated bug.
|
|
620
621
|
- **Don't destructure props** — `function Comp({ name })` warns; use `props.name` to keep reactivity. (Same root cause as above; see the Props section.)
|
|
621
|
-
- **`<For>`
|
|
622
|
-
- **`<Show>` / `<Match>` function children
|
|
622
|
+
- **`<For>` callback shape follows keying** — default/keyed-by-identity receives a raw item and index accessor; `keyed={false}` receives an item accessor and stable numeric index; custom keys receive accessors.
|
|
623
|
+
- **`<Show>` / `<Match>` function children narrow values** — non-keyed children receive accessors; keyed children receive raw values.
|
|
623
624
|
- **Stores: setters take a draft callback** — mutate the draft in place by default. Returning a new value is shallow (array index-replace, object top-level diff); reach for it for filter/remove. Keyed reconcile is a _projection-fn_ feature, not a setter feature.
|
|
624
625
|
- **`undefined` is a real value in `merge`** — it overrides rather than "skip this key".
|
|
625
626
|
- **Async lives in computations** — return a Promise/AsyncIterable from `createMemo`/`createStore(fn)`/`createProjection`. Reads suspend; wrap in `<Loading>`.
|
package/dist/dev.cjs
CHANGED
|
@@ -809,7 +809,7 @@ function Show(props) {
|
|
|
809
809
|
if (c) {
|
|
810
810
|
const child = props.children;
|
|
811
811
|
const fn = typeof child === "function" && child.length > 0;
|
|
812
|
-
return fn ? signals.untrack(() => child(() => {
|
|
812
|
+
return fn ? keyed ? signals.untrack(() => child(c), "<Show>") : signals.untrack(() => child(() => {
|
|
813
813
|
if (!signals.untrack(condition)) throw narrowedError("Show");
|
|
814
814
|
return conditionValue();
|
|
815
815
|
}), "<Show>") : child;
|
|
@@ -837,7 +837,12 @@ function Switch(props) {
|
|
|
837
837
|
name: "condition",
|
|
838
838
|
sync: true
|
|
839
839
|
} );
|
|
840
|
-
func = () =>
|
|
840
|
+
func = () => {
|
|
841
|
+
const prev = prevFunc();
|
|
842
|
+
if (prev) return prev;
|
|
843
|
+
const c = condition();
|
|
844
|
+
return c ? [index, c, conditionValue, mp] : undefined;
|
|
845
|
+
};
|
|
841
846
|
}
|
|
842
847
|
return func;
|
|
843
848
|
}, {
|
|
@@ -846,10 +851,10 @@ function Switch(props) {
|
|
|
846
851
|
return signals.createMemo(() => {
|
|
847
852
|
const sel = switchFunc()();
|
|
848
853
|
if (!sel) return props.fallback;
|
|
849
|
-
const [index, conditionValue, mp] = sel;
|
|
854
|
+
const [index, value, conditionValue, mp] = sel;
|
|
850
855
|
const child = mp.children;
|
|
851
856
|
const fn = typeof child === "function" && child.length > 0;
|
|
852
|
-
return fn ? signals.untrack(() => child(() => {
|
|
857
|
+
return fn ? mp.keyed ? signals.untrack(() => child(value), "<Match>") : signals.untrack(() => child(() => {
|
|
853
858
|
if (signals.untrack(switchFunc)()?.[0] !== index) throw narrowedError("Match");
|
|
854
859
|
return conditionValue();
|
|
855
860
|
}), "<Match>") : child;
|
package/dist/dev.js
CHANGED
|
@@ -808,7 +808,7 @@ function Show(props) {
|
|
|
808
808
|
if (c) {
|
|
809
809
|
const child = props.children;
|
|
810
810
|
const fn = typeof child === "function" && child.length > 0;
|
|
811
|
-
return fn ? untrack(() => child(() => {
|
|
811
|
+
return fn ? keyed ? untrack(() => child(c), "<Show>") : untrack(() => child(() => {
|
|
812
812
|
if (!untrack(condition)) throw narrowedError("Show");
|
|
813
813
|
return conditionValue();
|
|
814
814
|
}), "<Show>") : child;
|
|
@@ -836,7 +836,12 @@ function Switch(props) {
|
|
|
836
836
|
name: "condition",
|
|
837
837
|
sync: true
|
|
838
838
|
} );
|
|
839
|
-
func = () =>
|
|
839
|
+
func = () => {
|
|
840
|
+
const prev = prevFunc();
|
|
841
|
+
if (prev) return prev;
|
|
842
|
+
const c = condition();
|
|
843
|
+
return c ? [index, c, conditionValue, mp] : undefined;
|
|
844
|
+
};
|
|
840
845
|
}
|
|
841
846
|
return func;
|
|
842
847
|
}, {
|
|
@@ -845,10 +850,10 @@ function Switch(props) {
|
|
|
845
850
|
return createMemo$1(() => {
|
|
846
851
|
const sel = switchFunc()();
|
|
847
852
|
if (!sel) return props.fallback;
|
|
848
|
-
const [index, conditionValue, mp] = sel;
|
|
853
|
+
const [index, value, conditionValue, mp] = sel;
|
|
849
854
|
const child = mp.children;
|
|
850
855
|
const fn = typeof child === "function" && child.length > 0;
|
|
851
|
-
return fn ? untrack(() => child(() => {
|
|
856
|
+
return fn ? mp.keyed ? untrack(() => child(value), "<Match>") : untrack(() => child(() => {
|
|
852
857
|
if (untrack(switchFunc)()?.[0] !== index) throw narrowedError("Match");
|
|
853
858
|
return conditionValue();
|
|
854
859
|
}), "<Match>") : child;
|
package/dist/server.cjs
CHANGED
|
@@ -32,6 +32,9 @@ function nextChildIdFor(owner, consume) {
|
|
|
32
32
|
}
|
|
33
33
|
throw new Error("Cannot get child id from owner without an id");
|
|
34
34
|
}
|
|
35
|
+
function consumeClientComputedSlot(owner) {
|
|
36
|
+
if (owner?.id != null) nextChildIdFor(owner);
|
|
37
|
+
}
|
|
35
38
|
function getNextChildId(owner) {
|
|
36
39
|
return nextChildIdFor(owner);
|
|
37
40
|
}
|
|
@@ -116,6 +119,7 @@ function disposeOwner(owner, self = true) {
|
|
|
116
119
|
if (self) {
|
|
117
120
|
node._disposed = true;
|
|
118
121
|
if (ownerPool.length < OWNER_POOL_MAX) {
|
|
122
|
+
node.id = undefined;
|
|
119
123
|
node._parent = null;
|
|
120
124
|
node._nextSibling = null;
|
|
121
125
|
ownerPool.push(node);
|
|
@@ -142,6 +146,7 @@ function disposeOwner(owner, self = true) {
|
|
|
142
146
|
node._disposal = null;
|
|
143
147
|
}
|
|
144
148
|
if (self && ownerPool.length < OWNER_POOL_MAX) {
|
|
149
|
+
node.id = undefined;
|
|
145
150
|
node._parent = null;
|
|
146
151
|
node._nextSibling = null;
|
|
147
152
|
ownerPool.push(node);
|
|
@@ -744,8 +749,43 @@ function reconcile(value) {
|
|
|
744
749
|
function deep(store) {
|
|
745
750
|
return store;
|
|
746
751
|
}
|
|
752
|
+
function proxySource(read) {
|
|
753
|
+
return new Proxy({}, {
|
|
754
|
+
get(_, property, receiver) {
|
|
755
|
+
if (property === signals.$PROXY) return receiver;
|
|
756
|
+
const source = read() || {};
|
|
757
|
+
return source[property];
|
|
758
|
+
},
|
|
759
|
+
has(_, property) {
|
|
760
|
+
if (property === signals.$PROXY) return true;
|
|
761
|
+
return property in (read() || {});
|
|
762
|
+
},
|
|
763
|
+
ownKeys() {
|
|
764
|
+
return Object.keys(read() || {});
|
|
765
|
+
},
|
|
766
|
+
getOwnPropertyDescriptor(_, property) {
|
|
767
|
+
return {
|
|
768
|
+
configurable: true,
|
|
769
|
+
enumerable: true,
|
|
770
|
+
get() {
|
|
771
|
+
return (read() || {})[property];
|
|
772
|
+
}
|
|
773
|
+
};
|
|
774
|
+
}
|
|
775
|
+
});
|
|
776
|
+
}
|
|
777
|
+
function merge(...sources) {
|
|
778
|
+
for (let i = 0; i < sources.length; i++) {
|
|
779
|
+
if (typeof sources[i] === "function") {
|
|
780
|
+
sources[i] = proxySource(createMemo(sources[i]));
|
|
781
|
+
}
|
|
782
|
+
}
|
|
783
|
+
return signals.merge(...sources);
|
|
784
|
+
}
|
|
747
785
|
function mapArray(list, mapFn, options = {}) {
|
|
748
|
-
|
|
786
|
+
const indexes = mapFn.length > 1;
|
|
787
|
+
const parent = currentOwner;
|
|
788
|
+
const read = createMemo(() => {
|
|
749
789
|
const items = list();
|
|
750
790
|
const s = [];
|
|
751
791
|
if (items && items.length) {
|
|
@@ -758,7 +798,7 @@ function mapArray(list, mapFn, options = {}) {
|
|
|
758
798
|
parent.id = formatChildId(origId, origChildCount + i);
|
|
759
799
|
}
|
|
760
800
|
parent._childCount = 0;
|
|
761
|
-
s.push(mapFn(() => items[i], () => i));
|
|
801
|
+
s.push(options.keyed === false ? indexes ? mapFn(() => items[i], i) : mapFn(() => items[i]) : typeof options.keyed === "function" ? indexes ? mapFn(() => items[i], () => i) : mapFn(() => items[i]) : indexes ? mapFn(items[i], () => i) : mapFn(items[i]));
|
|
762
802
|
}
|
|
763
803
|
} finally {
|
|
764
804
|
parent.id = origId;
|
|
@@ -772,9 +812,12 @@ function mapArray(list, mapFn, options = {}) {
|
|
|
772
812
|
}, {
|
|
773
813
|
sync: true
|
|
774
814
|
});
|
|
815
|
+
consumeClientComputedSlot(parent);
|
|
816
|
+
return read;
|
|
775
817
|
}
|
|
776
818
|
function repeat(count, mapFn, options = {}) {
|
|
777
|
-
|
|
819
|
+
const parent = currentOwner;
|
|
820
|
+
const read = createMemo(() => {
|
|
778
821
|
const len = count();
|
|
779
822
|
const offset = options.from?.() || 0;
|
|
780
823
|
if (!len) {
|
|
@@ -802,6 +845,8 @@ function repeat(count, mapFn, options = {}) {
|
|
|
802
845
|
}, {
|
|
803
846
|
sync: true
|
|
804
847
|
});
|
|
848
|
+
consumeClientComputedSlot(parent);
|
|
849
|
+
return read;
|
|
805
850
|
}
|
|
806
851
|
const ErrorContext = {
|
|
807
852
|
id: Symbol("ErrorContext"),
|
|
@@ -1185,7 +1230,7 @@ function Show(props) {
|
|
|
1185
1230
|
if (when) {
|
|
1186
1231
|
const child = props.children;
|
|
1187
1232
|
if (typeof child === "function" && child.length > 0) {
|
|
1188
|
-
return child(() => when);
|
|
1233
|
+
return props.keyed ? child(when) : child(() => when);
|
|
1189
1234
|
}
|
|
1190
1235
|
return child;
|
|
1191
1236
|
}
|
|
@@ -1205,7 +1250,7 @@ function Switch(props) {
|
|
|
1205
1250
|
const w = conds[i].when;
|
|
1206
1251
|
if (w) {
|
|
1207
1252
|
const c = conds[i].children;
|
|
1208
|
-
return typeof c === "function" && c.length > 0 ? c(() => w) : c;
|
|
1253
|
+
return typeof c === "function" && c.length > 0 ? conds[i].keyed ? c(w) : c(() => w) : c;
|
|
1209
1254
|
}
|
|
1210
1255
|
}
|
|
1211
1256
|
return props.fallback;
|
|
@@ -1436,10 +1481,6 @@ Object.defineProperty(exports, "isWrappable", {
|
|
|
1436
1481
|
enumerable: true,
|
|
1437
1482
|
get: function () { return signals.isWrappable; }
|
|
1438
1483
|
});
|
|
1439
|
-
Object.defineProperty(exports, "merge", {
|
|
1440
|
-
enumerable: true,
|
|
1441
|
-
get: function () { return signals.merge; }
|
|
1442
|
-
});
|
|
1443
1484
|
Object.defineProperty(exports, "omit", {
|
|
1444
1485
|
enumerable: true,
|
|
1445
1486
|
get: function () { return signals.omit; }
|
|
@@ -1498,6 +1539,7 @@ exports.isRefreshing = isRefreshing;
|
|
|
1498
1539
|
exports.latest = latest;
|
|
1499
1540
|
exports.lazy = lazy;
|
|
1500
1541
|
exports.mapArray = mapArray;
|
|
1542
|
+
exports.merge = merge;
|
|
1501
1543
|
exports.onCleanup = onCleanup;
|
|
1502
1544
|
exports.onSettled = onSettled;
|
|
1503
1545
|
exports.reconcile = reconcile;
|
package/dist/server.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { NotReadyError, $REFRESH, isWrappable, NoOwnerError, ContextNotFoundError, flatten } from '@solidjs/signals';
|
|
2
|
-
export { $PROXY, $REFRESH, $TRACK, NotReadyError, enableExternalSource, enforceLoadingBoundary, flatten, isEqual, isWrappable,
|
|
1
|
+
import { NotReadyError, $REFRESH, merge as merge$1, isWrappable, NoOwnerError, ContextNotFoundError, $PROXY, flatten } from '@solidjs/signals';
|
|
2
|
+
export { $PROXY, $REFRESH, $TRACK, NotReadyError, enableExternalSource, enforceLoadingBoundary, flatten, isEqual, isWrappable, omit, snapshot, storePath } from '@solidjs/signals';
|
|
3
3
|
|
|
4
4
|
const NoHydrateContext = {
|
|
5
5
|
id: Symbol("NoHydrateContext"),
|
|
@@ -31,6 +31,9 @@ function nextChildIdFor(owner, consume) {
|
|
|
31
31
|
}
|
|
32
32
|
throw new Error("Cannot get child id from owner without an id");
|
|
33
33
|
}
|
|
34
|
+
function consumeClientComputedSlot(owner) {
|
|
35
|
+
if (owner?.id != null) nextChildIdFor(owner);
|
|
36
|
+
}
|
|
34
37
|
function getNextChildId(owner) {
|
|
35
38
|
return nextChildIdFor(owner);
|
|
36
39
|
}
|
|
@@ -115,6 +118,7 @@ function disposeOwner(owner, self = true) {
|
|
|
115
118
|
if (self) {
|
|
116
119
|
node._disposed = true;
|
|
117
120
|
if (ownerPool.length < OWNER_POOL_MAX) {
|
|
121
|
+
node.id = undefined;
|
|
118
122
|
node._parent = null;
|
|
119
123
|
node._nextSibling = null;
|
|
120
124
|
ownerPool.push(node);
|
|
@@ -141,6 +145,7 @@ function disposeOwner(owner, self = true) {
|
|
|
141
145
|
node._disposal = null;
|
|
142
146
|
}
|
|
143
147
|
if (self && ownerPool.length < OWNER_POOL_MAX) {
|
|
148
|
+
node.id = undefined;
|
|
144
149
|
node._parent = null;
|
|
145
150
|
node._nextSibling = null;
|
|
146
151
|
ownerPool.push(node);
|
|
@@ -743,8 +748,43 @@ function reconcile(value) {
|
|
|
743
748
|
function deep(store) {
|
|
744
749
|
return store;
|
|
745
750
|
}
|
|
751
|
+
function proxySource(read) {
|
|
752
|
+
return new Proxy({}, {
|
|
753
|
+
get(_, property, receiver) {
|
|
754
|
+
if (property === $PROXY) return receiver;
|
|
755
|
+
const source = read() || {};
|
|
756
|
+
return source[property];
|
|
757
|
+
},
|
|
758
|
+
has(_, property) {
|
|
759
|
+
if (property === $PROXY) return true;
|
|
760
|
+
return property in (read() || {});
|
|
761
|
+
},
|
|
762
|
+
ownKeys() {
|
|
763
|
+
return Object.keys(read() || {});
|
|
764
|
+
},
|
|
765
|
+
getOwnPropertyDescriptor(_, property) {
|
|
766
|
+
return {
|
|
767
|
+
configurable: true,
|
|
768
|
+
enumerable: true,
|
|
769
|
+
get() {
|
|
770
|
+
return (read() || {})[property];
|
|
771
|
+
}
|
|
772
|
+
};
|
|
773
|
+
}
|
|
774
|
+
});
|
|
775
|
+
}
|
|
776
|
+
function merge(...sources) {
|
|
777
|
+
for (let i = 0; i < sources.length; i++) {
|
|
778
|
+
if (typeof sources[i] === "function") {
|
|
779
|
+
sources[i] = proxySource(createMemo(sources[i]));
|
|
780
|
+
}
|
|
781
|
+
}
|
|
782
|
+
return merge$1(...sources);
|
|
783
|
+
}
|
|
746
784
|
function mapArray(list, mapFn, options = {}) {
|
|
747
|
-
|
|
785
|
+
const indexes = mapFn.length > 1;
|
|
786
|
+
const parent = currentOwner;
|
|
787
|
+
const read = createMemo(() => {
|
|
748
788
|
const items = list();
|
|
749
789
|
const s = [];
|
|
750
790
|
if (items && items.length) {
|
|
@@ -757,7 +797,7 @@ function mapArray(list, mapFn, options = {}) {
|
|
|
757
797
|
parent.id = formatChildId(origId, origChildCount + i);
|
|
758
798
|
}
|
|
759
799
|
parent._childCount = 0;
|
|
760
|
-
s.push(mapFn(() => items[i], () => i));
|
|
800
|
+
s.push(options.keyed === false ? indexes ? mapFn(() => items[i], i) : mapFn(() => items[i]) : typeof options.keyed === "function" ? indexes ? mapFn(() => items[i], () => i) : mapFn(() => items[i]) : indexes ? mapFn(items[i], () => i) : mapFn(items[i]));
|
|
761
801
|
}
|
|
762
802
|
} finally {
|
|
763
803
|
parent.id = origId;
|
|
@@ -771,9 +811,12 @@ function mapArray(list, mapFn, options = {}) {
|
|
|
771
811
|
}, {
|
|
772
812
|
sync: true
|
|
773
813
|
});
|
|
814
|
+
consumeClientComputedSlot(parent);
|
|
815
|
+
return read;
|
|
774
816
|
}
|
|
775
817
|
function repeat(count, mapFn, options = {}) {
|
|
776
|
-
|
|
818
|
+
const parent = currentOwner;
|
|
819
|
+
const read = createMemo(() => {
|
|
777
820
|
const len = count();
|
|
778
821
|
const offset = options.from?.() || 0;
|
|
779
822
|
if (!len) {
|
|
@@ -801,6 +844,8 @@ function repeat(count, mapFn, options = {}) {
|
|
|
801
844
|
}, {
|
|
802
845
|
sync: true
|
|
803
846
|
});
|
|
847
|
+
consumeClientComputedSlot(parent);
|
|
848
|
+
return read;
|
|
804
849
|
}
|
|
805
850
|
const ErrorContext = {
|
|
806
851
|
id: Symbol("ErrorContext"),
|
|
@@ -1184,7 +1229,7 @@ function Show(props) {
|
|
|
1184
1229
|
if (when) {
|
|
1185
1230
|
const child = props.children;
|
|
1186
1231
|
if (typeof child === "function" && child.length > 0) {
|
|
1187
|
-
return child(() => when);
|
|
1232
|
+
return props.keyed ? child(when) : child(() => when);
|
|
1188
1233
|
}
|
|
1189
1234
|
return child;
|
|
1190
1235
|
}
|
|
@@ -1204,7 +1249,7 @@ function Switch(props) {
|
|
|
1204
1249
|
const w = conds[i].when;
|
|
1205
1250
|
if (w) {
|
|
1206
1251
|
const c = conds[i].children;
|
|
1207
|
-
return typeof c === "function" && c.length > 0 ? c(() => w) : c;
|
|
1252
|
+
return typeof c === "function" && c.length > 0 ? conds[i].keyed ? c(w) : c(() => w) : c;
|
|
1208
1253
|
}
|
|
1209
1254
|
}
|
|
1210
1255
|
return props.fallback;
|
|
@@ -1399,4 +1444,4 @@ function Reveal(props) {
|
|
|
1399
1444
|
|
|
1400
1445
|
const DEV = undefined;
|
|
1401
1446
|
|
|
1402
|
-
export { $DEVCOMP, DEV, Errored, For, Hydration, Loading, Match, NoHydrateContext, NoHydration, Repeat, Reveal, Show, Switch, action, children, createComponent, createContext, createDeepProxy, createEffect, createErrorBoundary, createLoadingBoundary, createMemo, createOptimistic, createOptimisticStore, createOwner, createProjection, createReaction, createRenderEffect, createRevealOrder, createRoot, createSignal, createStore, createTrackedEffect, createUniqueId, deep, enableHydration, flush, getNextChildId, getObserver, getOwner, isDisposed, isPending, isRefreshing, latest, lazy, mapArray, onCleanup, onSettled, reconcile, refresh, repeat, resolve, runWithOwner, sharedConfig, ssrHandleError, untrack, useContext };
|
|
1447
|
+
export { $DEVCOMP, DEV, Errored, For, Hydration, Loading, Match, NoHydrateContext, NoHydration, Repeat, Reveal, Show, Switch, action, children, createComponent, createContext, createDeepProxy, createEffect, createErrorBoundary, createLoadingBoundary, createMemo, createOptimistic, createOptimisticStore, createOwner, createProjection, createReaction, createRenderEffect, createRevealOrder, createRoot, createSignal, createStore, createTrackedEffect, createUniqueId, deep, enableHydration, flush, getNextChildId, getObserver, getOwner, isDisposed, isPending, isRefreshing, latest, lazy, mapArray, merge, onCleanup, onSettled, reconcile, refresh, repeat, resolve, runWithOwner, sharedConfig, ssrHandleError, untrack, useContext };
|
package/dist/solid.cjs
CHANGED
|
@@ -784,7 +784,7 @@ function Show(props) {
|
|
|
784
784
|
if (c) {
|
|
785
785
|
const child = props.children;
|
|
786
786
|
const fn = typeof child === "function" && child.length > 0;
|
|
787
|
-
return fn ? signals.untrack(() => child(() => {
|
|
787
|
+
return fn ? keyed ? signals.untrack(() => child(c), IS_DEV) : signals.untrack(() => child(() => {
|
|
788
788
|
if (!signals.untrack(condition)) throw narrowedError("Show");
|
|
789
789
|
return conditionValue();
|
|
790
790
|
}), IS_DEV) : child;
|
|
@@ -808,7 +808,12 @@ function Switch(props) {
|
|
|
808
808
|
equals: (a, b) => !a === !b,
|
|
809
809
|
sync: true
|
|
810
810
|
});
|
|
811
|
-
func = () =>
|
|
811
|
+
func = () => {
|
|
812
|
+
const prev = prevFunc();
|
|
813
|
+
if (prev) return prev;
|
|
814
|
+
const c = condition();
|
|
815
|
+
return c ? [index, c, conditionValue, mp] : undefined;
|
|
816
|
+
};
|
|
812
817
|
}
|
|
813
818
|
return func;
|
|
814
819
|
}, {
|
|
@@ -817,10 +822,10 @@ function Switch(props) {
|
|
|
817
822
|
return signals.createMemo(() => {
|
|
818
823
|
const sel = switchFunc()();
|
|
819
824
|
if (!sel) return props.fallback;
|
|
820
|
-
const [index, conditionValue, mp] = sel;
|
|
825
|
+
const [index, value, conditionValue, mp] = sel;
|
|
821
826
|
const child = mp.children;
|
|
822
827
|
const fn = typeof child === "function" && child.length > 0;
|
|
823
|
-
return fn ? signals.untrack(() => child(() => {
|
|
828
|
+
return fn ? mp.keyed ? signals.untrack(() => child(value), IS_DEV) : signals.untrack(() => child(() => {
|
|
824
829
|
if (signals.untrack(switchFunc)()?.[0] !== index) throw narrowedError("Match");
|
|
825
830
|
return conditionValue();
|
|
826
831
|
}), IS_DEV) : child;
|
package/dist/solid.js
CHANGED
|
@@ -783,7 +783,7 @@ function Show(props) {
|
|
|
783
783
|
if (c) {
|
|
784
784
|
const child = props.children;
|
|
785
785
|
const fn = typeof child === "function" && child.length > 0;
|
|
786
|
-
return fn ? untrack(() => child(() => {
|
|
786
|
+
return fn ? keyed ? untrack(() => child(c), IS_DEV) : untrack(() => child(() => {
|
|
787
787
|
if (!untrack(condition)) throw narrowedError("Show");
|
|
788
788
|
return conditionValue();
|
|
789
789
|
}), IS_DEV) : child;
|
|
@@ -807,7 +807,12 @@ function Switch(props) {
|
|
|
807
807
|
equals: (a, b) => !a === !b,
|
|
808
808
|
sync: true
|
|
809
809
|
});
|
|
810
|
-
func = () =>
|
|
810
|
+
func = () => {
|
|
811
|
+
const prev = prevFunc();
|
|
812
|
+
if (prev) return prev;
|
|
813
|
+
const c = condition();
|
|
814
|
+
return c ? [index, c, conditionValue, mp] : undefined;
|
|
815
|
+
};
|
|
811
816
|
}
|
|
812
817
|
return func;
|
|
813
818
|
}, {
|
|
@@ -816,10 +821,10 @@ function Switch(props) {
|
|
|
816
821
|
return createMemo$1(() => {
|
|
817
822
|
const sel = switchFunc()();
|
|
818
823
|
if (!sel) return props.fallback;
|
|
819
|
-
const [index, conditionValue, mp] = sel;
|
|
824
|
+
const [index, value, conditionValue, mp] = sel;
|
|
820
825
|
const child = mp.children;
|
|
821
826
|
const fn = typeof child === "function" && child.length > 0;
|
|
822
|
-
return fn ? untrack(() => child(() => {
|
|
827
|
+
return fn ? mp.keyed ? untrack(() => child(value), IS_DEV) : untrack(() => child(() => {
|
|
823
828
|
if (untrack(switchFunc)()?.[0] !== index) throw narrowedError("Match");
|
|
824
829
|
return conditionValue();
|
|
825
830
|
}), IS_DEV) : child;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "solid-js",
|
|
3
3
|
"description": "Reactive JavaScript library for building user interfaces. Compiles JSX to real DOM with fine-grained signal-based updates — no virtual DOM.",
|
|
4
|
-
"version": "2.0.0-beta.
|
|
4
|
+
"version": "2.0.0-beta.12",
|
|
5
5
|
"author": "Ryan Carniato",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"homepage": "https://solidjs.com",
|
|
@@ -107,7 +107,7 @@
|
|
|
107
107
|
"performance"
|
|
108
108
|
],
|
|
109
109
|
"dependencies": {
|
|
110
|
-
"@solidjs/signals": "^2.0.0-beta.
|
|
110
|
+
"@solidjs/signals": "^2.0.0-beta.12",
|
|
111
111
|
"csstype": "^3.1.0",
|
|
112
112
|
"seroval": "~1.5.0",
|
|
113
113
|
"seroval-plugins": "~1.5.0"
|
package/types/client/flow.d.ts
CHANGED
|
@@ -3,18 +3,26 @@ export type { RevealOrder };
|
|
|
3
3
|
import type { Element as SolidElement } from "../types.js";
|
|
4
4
|
type NonZeroParams<T extends (...args: any[]) => any> = Parameters<T>["length"] extends 0 ? never : T;
|
|
5
5
|
type ConditionalRenderCallback<T> = (item: Accessor<NonNullable<T>>) => SolidElement;
|
|
6
|
+
type KeyedConditionalRenderCallback<T> = (item: NonNullable<T>) => SolidElement;
|
|
6
7
|
type ConditionalRenderChildren<T, F extends ConditionalRenderCallback<T> = ConditionalRenderCallback<T>> = SolidElement | NonZeroParams<F>;
|
|
8
|
+
type KeyedConditionalRenderChildren<T, F extends KeyedConditionalRenderCallback<T> = KeyedConditionalRenderCallback<T>> = SolidElement | NonZeroParams<F>;
|
|
7
9
|
/**
|
|
8
10
|
* Creates a list of elements from a list.
|
|
9
11
|
*
|
|
10
|
-
* Receives a map function as its child
|
|
11
|
-
*
|
|
12
|
-
*
|
|
12
|
+
* Receives a map function as its child and returns a JSX element for each
|
|
13
|
+
* list item; if the list is empty, an optional `fallback` is rendered instead.
|
|
14
|
+
*
|
|
15
|
+
* The child callback shape follows the keying mode:
|
|
16
|
+
* - default / `keyed={true}` receives `(item, index)` where `item` is the raw
|
|
17
|
+
* row value and `index` is an accessor.
|
|
18
|
+
* - `keyed={false}` receives `(item, index)` where `item` is an accessor and
|
|
19
|
+
* `index` is a stable number.
|
|
20
|
+
* - `keyed={(item) => key}` receives accessors for both arguments.
|
|
13
21
|
*
|
|
14
22
|
* @example
|
|
15
23
|
* ```tsx
|
|
16
24
|
* <For each={items} fallback={<div>No items</div>}>
|
|
17
|
-
* {(item, index) => <div data-index={index()}>{item
|
|
25
|
+
* {(item, index) => <div data-index={index()}>{item.label}</div>}
|
|
18
26
|
* </For>
|
|
19
27
|
* ```
|
|
20
28
|
*
|
|
@@ -23,7 +31,19 @@ type ConditionalRenderChildren<T, F extends ConditionalRenderCallback<T> = Condi
|
|
|
23
31
|
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
24
32
|
each: T | undefined | null | false;
|
|
25
33
|
fallback?: SolidElement;
|
|
26
|
-
keyed?:
|
|
34
|
+
keyed?: true;
|
|
35
|
+
children: (item: T[number], index: Accessor<number>) => U;
|
|
36
|
+
}): SolidElement;
|
|
37
|
+
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
38
|
+
each: T | undefined | null | false;
|
|
39
|
+
fallback?: SolidElement;
|
|
40
|
+
keyed: false;
|
|
41
|
+
children: (item: Accessor<T[number]>, index: number) => U;
|
|
42
|
+
}): SolidElement;
|
|
43
|
+
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
44
|
+
each: T | undefined | null | false;
|
|
45
|
+
fallback?: SolidElement;
|
|
46
|
+
keyed: (item: T[number]) => any;
|
|
27
47
|
children: (item: Accessor<T[number]>, index: Accessor<number>) => U;
|
|
28
48
|
}): SolidElement;
|
|
29
49
|
/**
|
|
@@ -51,10 +71,10 @@ export declare function Repeat<T extends SolidElement>(props: {
|
|
|
51
71
|
* Conditionally renders its children when `when` is truthy, otherwise renders
|
|
52
72
|
* the optional `fallback`.
|
|
53
73
|
*
|
|
54
|
-
* The function-child form receives
|
|
55
|
-
* it
|
|
56
|
-
*
|
|
57
|
-
* identity changes.
|
|
74
|
+
* The function-child form receives a narrowed value. Without `keyed`
|
|
75
|
+
* (default), it receives an accessor and the child is preserved across truthy
|
|
76
|
+
* values; with `keyed`, it receives the raw value and remounts whenever the
|
|
77
|
+
* value's identity changes.
|
|
58
78
|
*
|
|
59
79
|
* @example
|
|
60
80
|
* ```tsx
|
|
@@ -65,11 +85,29 @@ export declare function Repeat<T extends SolidElement>(props: {
|
|
|
65
85
|
*
|
|
66
86
|
* @description https://docs.solidjs.com/reference/components/show
|
|
67
87
|
*/
|
|
88
|
+
export declare function Show<T>(props: {
|
|
89
|
+
when: T | undefined | null | false;
|
|
90
|
+
keyed: true;
|
|
91
|
+
fallback?: SolidElement;
|
|
92
|
+
children: SolidElement;
|
|
93
|
+
}): SolidElement;
|
|
94
|
+
export declare function Show<T, F extends KeyedConditionalRenderCallback<T>>(props: {
|
|
95
|
+
when: T | undefined | null | false;
|
|
96
|
+
keyed: true;
|
|
97
|
+
fallback?: SolidElement;
|
|
98
|
+
children: NonZeroParams<F>;
|
|
99
|
+
}): SolidElement;
|
|
100
|
+
export declare function Show<T>(props: {
|
|
101
|
+
when: T | undefined | null | false;
|
|
102
|
+
keyed?: false;
|
|
103
|
+
fallback?: SolidElement;
|
|
104
|
+
children: SolidElement;
|
|
105
|
+
}): SolidElement;
|
|
68
106
|
export declare function Show<T, F extends ConditionalRenderCallback<T>>(props: {
|
|
69
107
|
when: T | undefined | null | false;
|
|
70
|
-
keyed?:
|
|
108
|
+
keyed?: false;
|
|
71
109
|
fallback?: SolidElement;
|
|
72
|
-
children:
|
|
110
|
+
children: NonZeroParams<F>;
|
|
73
111
|
}): SolidElement;
|
|
74
112
|
/**
|
|
75
113
|
* Switches between content based on mutually exclusive conditions. Renders
|
|
@@ -96,15 +134,26 @@ export declare function Switch(props: {
|
|
|
96
134
|
}): SolidElement;
|
|
97
135
|
export type MatchProps<T, F extends ConditionalRenderCallback<T> = ConditionalRenderCallback<T>> = {
|
|
98
136
|
when: T | undefined | null | false;
|
|
99
|
-
keyed?:
|
|
137
|
+
keyed?: false;
|
|
100
138
|
children: ConditionalRenderChildren<T, F>;
|
|
101
139
|
};
|
|
140
|
+
export type KeyedMatchProps<T, F extends KeyedConditionalRenderCallback<T> = KeyedConditionalRenderCallback<T>> = {
|
|
141
|
+
when: T | undefined | null | false;
|
|
142
|
+
keyed: true;
|
|
143
|
+
children: KeyedConditionalRenderChildren<T, F>;
|
|
144
|
+
};
|
|
145
|
+
export type AnyMatchProps<T> = MatchProps<T> | KeyedMatchProps<T> | {
|
|
146
|
+
when: T | undefined | null | false;
|
|
147
|
+
keyed?: boolean;
|
|
148
|
+
children: SolidElement;
|
|
149
|
+
};
|
|
102
150
|
/**
|
|
103
151
|
* A branch inside a `<Switch>`. The first `<Match>` whose `when` is truthy
|
|
104
152
|
* wins; remaining matches are skipped.
|
|
105
153
|
*
|
|
106
|
-
* Like `<Show>`, `<Match>` supports a function child
|
|
107
|
-
* accessor for the narrowed value
|
|
154
|
+
* Like `<Show>`, `<Match>` supports a function child. Non-keyed children
|
|
155
|
+
* receive an accessor for the narrowed value; keyed children receive the raw
|
|
156
|
+
* narrowed value.
|
|
108
157
|
*
|
|
109
158
|
* @example
|
|
110
159
|
* ```tsx
|
|
@@ -120,7 +169,19 @@ export type MatchProps<T, F extends ConditionalRenderCallback<T> = ConditionalRe
|
|
|
120
169
|
*
|
|
121
170
|
* @description https://docs.solidjs.com/reference/components/switch-and-match
|
|
122
171
|
*/
|
|
172
|
+
export declare function Match<T>(props: {
|
|
173
|
+
when: T | undefined | null | false;
|
|
174
|
+
keyed: true;
|
|
175
|
+
children: SolidElement;
|
|
176
|
+
}): SolidElement;
|
|
177
|
+
export declare function Match<T, F extends KeyedConditionalRenderCallback<T>>(props: KeyedMatchProps<T, F>): SolidElement;
|
|
178
|
+
export declare function Match<T>(props: {
|
|
179
|
+
when: T | undefined | null | false;
|
|
180
|
+
keyed?: false;
|
|
181
|
+
children: SolidElement;
|
|
182
|
+
}): SolidElement;
|
|
123
183
|
export declare function Match<T, F extends ConditionalRenderCallback<T>>(props: MatchProps<T, F>): SolidElement;
|
|
184
|
+
export declare function Match<T>(props: AnyMatchProps<T>): SolidElement;
|
|
124
185
|
/**
|
|
125
186
|
* Catches uncaught errors inside its subtree and renders fallback content
|
|
126
187
|
* instead. The `fallback` prop can be a JSX element, or a callback that
|
package/types/server/flow.d.ts
CHANGED
|
@@ -3,16 +3,29 @@ import type { Element as SolidElement } from "../types.js";
|
|
|
3
3
|
export type { RevealOrder };
|
|
4
4
|
type NonZeroParams<T extends (...args: any[]) => any> = Parameters<T>["length"] extends 0 ? never : T;
|
|
5
5
|
type ConditionalRenderCallback<T> = (item: Accessor<NonNullable<T>>) => SolidElement;
|
|
6
|
+
type KeyedConditionalRenderCallback<T> = (item: NonNullable<T>) => SolidElement;
|
|
6
7
|
type ConditionalRenderChildren<T, F extends ConditionalRenderCallback<T> = ConditionalRenderCallback<T>> = SolidElement | NonZeroParams<F>;
|
|
8
|
+
type KeyedConditionalRenderChildren<T, F extends KeyedConditionalRenderCallback<T> = KeyedConditionalRenderCallback<T>> = SolidElement | NonZeroParams<F>;
|
|
7
9
|
/**
|
|
8
10
|
* Creates a list of elements from a list
|
|
9
|
-
*
|
|
10
11
|
* @description https://docs.solidjs.com/reference/components/for
|
|
11
12
|
*/
|
|
12
13
|
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
13
14
|
each: T | undefined | null | false;
|
|
14
15
|
fallback?: SolidElement;
|
|
15
|
-
keyed?:
|
|
16
|
+
keyed?: true;
|
|
17
|
+
children: (item: T[number], index: Accessor<number>) => U;
|
|
18
|
+
}): SolidElement;
|
|
19
|
+
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
20
|
+
each: T | undefined | null | false;
|
|
21
|
+
fallback?: SolidElement;
|
|
22
|
+
keyed: false;
|
|
23
|
+
children: (item: Accessor<T[number]>, index: number) => U;
|
|
24
|
+
}): SolidElement;
|
|
25
|
+
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
26
|
+
each: T | undefined | null | false;
|
|
27
|
+
fallback?: SolidElement;
|
|
28
|
+
keyed: (item: T[number]) => any;
|
|
16
29
|
children: (item: Accessor<T[number]>, index: Accessor<number>) => U;
|
|
17
30
|
}): SolidElement;
|
|
18
31
|
/**
|
|
@@ -30,11 +43,29 @@ export declare function Repeat<T extends SolidElement>(props: {
|
|
|
30
43
|
* Conditionally render its children or an optional fallback component
|
|
31
44
|
* @description https://docs.solidjs.com/reference/components/show
|
|
32
45
|
*/
|
|
46
|
+
export declare function Show<T>(props: {
|
|
47
|
+
when: T | undefined | null | false;
|
|
48
|
+
keyed: true;
|
|
49
|
+
fallback?: SolidElement;
|
|
50
|
+
children: SolidElement;
|
|
51
|
+
}): SolidElement;
|
|
52
|
+
export declare function Show<T, F extends KeyedConditionalRenderCallback<T>>(props: {
|
|
53
|
+
when: T | undefined | null | false;
|
|
54
|
+
keyed: true;
|
|
55
|
+
fallback?: SolidElement;
|
|
56
|
+
children: NonZeroParams<F>;
|
|
57
|
+
}): SolidElement;
|
|
58
|
+
export declare function Show<T>(props: {
|
|
59
|
+
when: T | undefined | null | false;
|
|
60
|
+
keyed?: false;
|
|
61
|
+
fallback?: SolidElement;
|
|
62
|
+
children: SolidElement;
|
|
63
|
+
}): SolidElement;
|
|
33
64
|
export declare function Show<T, F extends ConditionalRenderCallback<T>>(props: {
|
|
34
65
|
when: T | undefined | null | false;
|
|
35
|
-
keyed?:
|
|
66
|
+
keyed?: false;
|
|
36
67
|
fallback?: SolidElement;
|
|
37
|
-
children:
|
|
68
|
+
children: NonZeroParams<F>;
|
|
38
69
|
}): SolidElement;
|
|
39
70
|
/**
|
|
40
71
|
* Switches between content based on mutually exclusive conditions
|
|
@@ -46,14 +77,36 @@ export declare function Switch(props: {
|
|
|
46
77
|
}): SolidElement;
|
|
47
78
|
export type MatchProps<T, F extends ConditionalRenderCallback<T> = ConditionalRenderCallback<T>> = {
|
|
48
79
|
when: T | undefined | null | false;
|
|
49
|
-
keyed?:
|
|
80
|
+
keyed?: false;
|
|
50
81
|
children: ConditionalRenderChildren<T, F>;
|
|
51
82
|
};
|
|
83
|
+
export type KeyedMatchProps<T, F extends KeyedConditionalRenderCallback<T> = KeyedConditionalRenderCallback<T>> = {
|
|
84
|
+
when: T | undefined | null | false;
|
|
85
|
+
keyed: true;
|
|
86
|
+
children: KeyedConditionalRenderChildren<T, F>;
|
|
87
|
+
};
|
|
88
|
+
export type AnyMatchProps<T> = MatchProps<T> | KeyedMatchProps<T> | {
|
|
89
|
+
when: T | undefined | null | false;
|
|
90
|
+
keyed?: boolean;
|
|
91
|
+
children: SolidElement;
|
|
92
|
+
};
|
|
52
93
|
/**
|
|
53
94
|
* Selects a content based on condition when inside a `<Switch>` control flow
|
|
54
95
|
* @description https://docs.solidjs.com/reference/components/switch-and-match
|
|
55
96
|
*/
|
|
97
|
+
export declare function Match<T>(props: {
|
|
98
|
+
when: T | undefined | null | false;
|
|
99
|
+
keyed: true;
|
|
100
|
+
children: SolidElement;
|
|
101
|
+
}): SolidElement;
|
|
102
|
+
export declare function Match<T, F extends KeyedConditionalRenderCallback<T>>(props: KeyedMatchProps<T, F>): SolidElement;
|
|
103
|
+
export declare function Match<T>(props: {
|
|
104
|
+
when: T | undefined | null | false;
|
|
105
|
+
keyed?: false;
|
|
106
|
+
children: SolidElement;
|
|
107
|
+
}): SolidElement;
|
|
56
108
|
export declare function Match<T, F extends ConditionalRenderCallback<T>>(props: MatchProps<T, F>): SolidElement;
|
|
109
|
+
export declare function Match<T>(props: AnyMatchProps<T>): SolidElement;
|
|
57
110
|
/**
|
|
58
111
|
* Catches uncaught errors inside components and renders a fallback content
|
|
59
112
|
* @description https://docs.solidjs.com/reference/components/error-boundary
|
|
@@ -2,11 +2,11 @@ import { $REFRESH } from "@solidjs/signals";
|
|
|
2
2
|
export { $REFRESH };
|
|
3
3
|
export { NotReadyError, NoOwnerError, ContextNotFoundError, isEqual, isWrappable, SUPPORTS_PROXY, enableExternalSource, enforceLoadingBoundary } from "@solidjs/signals";
|
|
4
4
|
export { flatten } from "@solidjs/signals";
|
|
5
|
-
export { snapshot,
|
|
5
|
+
export { snapshot, omit, storePath, $PROXY, $TRACK } from "@solidjs/signals";
|
|
6
6
|
import type { Accessor as SignalAccessor, Refreshable } from "@solidjs/signals";
|
|
7
7
|
export type SourceAccessor<T> = Refreshable<SignalAccessor<T>>;
|
|
8
8
|
export type { Accessor, ComputeFunction, EffectFunction, EffectBundle, EffectOptions, ExternalSource, ExternalSourceConfig, ExternalSourceFactory, MemoOptions, NoInfer, SignalOptions, Setter, Signal, Owner, Refreshable, Maybe, Store, StoreSetter, StoreNode, NotWrappable, SolidStore, Merge, Omit, Context, ContextRecord, IQueue, StorePathRange, ArrayFilterFn, CustomPartial, Part, PathSetter } from "@solidjs/signals";
|
|
9
|
-
import type { Accessor, ComputeFunction, EffectFunction, EffectBundle, EffectOptions, MemoOptions, SignalOptions, Signal, Owner, Store, StoreSetter, Context } from "@solidjs/signals";
|
|
9
|
+
import type { Accessor, ComputeFunction, EffectFunction, EffectBundle, EffectOptions, MemoOptions, SignalOptions, Signal, Merge, Owner, Store, StoreSetter, Context } from "@solidjs/signals";
|
|
10
10
|
import { sharedConfig, NoHydrateContext } from "./shared.js";
|
|
11
11
|
type Disposable = () => void;
|
|
12
12
|
export declare function getNextChildId(owner: Owner): string;
|
|
@@ -90,8 +90,17 @@ export declare const createOptimisticStore: typeof createStore;
|
|
|
90
90
|
export declare function createProjection<T extends object>(fn: (draft: T) => void | T | Promise<void | T> | AsyncIterable<void | T>, initialValue: Partial<T>, options?: ServerSsrOptions): Store<T>;
|
|
91
91
|
export declare function reconcile<T extends U, U extends object>(value: T): (state: U) => T;
|
|
92
92
|
export declare function deep<T extends object>(store: Store<T>): Store<T>;
|
|
93
|
-
export declare function
|
|
94
|
-
|
|
93
|
+
export declare function merge<T extends unknown[]>(...sources: T): Merge<T>;
|
|
94
|
+
export declare function mapArray<T, U>(list: Accessor<readonly T[] | undefined | null | false>, mapFn: (v: T, i: Accessor<number>) => U, options?: {
|
|
95
|
+
keyed?: true;
|
|
96
|
+
fallback?: Accessor<any>;
|
|
97
|
+
}): () => U[];
|
|
98
|
+
export declare function mapArray<T, U>(list: Accessor<readonly T[] | undefined | null | false>, mapFn: (v: Accessor<T>, i: number) => U, options: {
|
|
99
|
+
keyed: false;
|
|
100
|
+
fallback?: Accessor<any>;
|
|
101
|
+
}): () => U[];
|
|
102
|
+
export declare function mapArray<T, U>(list: Accessor<readonly T[] | undefined | null | false>, mapFn: (v: Accessor<T>, i: Accessor<number>) => U, options: {
|
|
103
|
+
keyed: (item: T) => any;
|
|
95
104
|
fallback?: Accessor<any>;
|
|
96
105
|
}): () => U[];
|
|
97
106
|
export declare function repeat<T>(count: Accessor<number>, mapFn: (i: number) => T, options?: {
|
|
@@ -3,18 +3,26 @@ export type { RevealOrder };
|
|
|
3
3
|
import type { Element as SolidElement } from "../types.cjs";
|
|
4
4
|
type NonZeroParams<T extends (...args: any[]) => any> = Parameters<T>["length"] extends 0 ? never : T;
|
|
5
5
|
type ConditionalRenderCallback<T> = (item: Accessor<NonNullable<T>>) => SolidElement;
|
|
6
|
+
type KeyedConditionalRenderCallback<T> = (item: NonNullable<T>) => SolidElement;
|
|
6
7
|
type ConditionalRenderChildren<T, F extends ConditionalRenderCallback<T> = ConditionalRenderCallback<T>> = SolidElement | NonZeroParams<F>;
|
|
8
|
+
type KeyedConditionalRenderChildren<T, F extends KeyedConditionalRenderCallback<T> = KeyedConditionalRenderCallback<T>> = SolidElement | NonZeroParams<F>;
|
|
7
9
|
/**
|
|
8
10
|
* Creates a list of elements from a list.
|
|
9
11
|
*
|
|
10
|
-
* Receives a map function as its child
|
|
11
|
-
*
|
|
12
|
-
*
|
|
12
|
+
* Receives a map function as its child and returns a JSX element for each
|
|
13
|
+
* list item; if the list is empty, an optional `fallback` is rendered instead.
|
|
14
|
+
*
|
|
15
|
+
* The child callback shape follows the keying mode:
|
|
16
|
+
* - default / `keyed={true}` receives `(item, index)` where `item` is the raw
|
|
17
|
+
* row value and `index` is an accessor.
|
|
18
|
+
* - `keyed={false}` receives `(item, index)` where `item` is an accessor and
|
|
19
|
+
* `index` is a stable number.
|
|
20
|
+
* - `keyed={(item) => key}` receives accessors for both arguments.
|
|
13
21
|
*
|
|
14
22
|
* @example
|
|
15
23
|
* ```tsx
|
|
16
24
|
* <For each={items} fallback={<div>No items</div>}>
|
|
17
|
-
* {(item, index) => <div data-index={index()}>{item
|
|
25
|
+
* {(item, index) => <div data-index={index()}>{item.label}</div>}
|
|
18
26
|
* </For>
|
|
19
27
|
* ```
|
|
20
28
|
*
|
|
@@ -23,7 +31,19 @@ type ConditionalRenderChildren<T, F extends ConditionalRenderCallback<T> = Condi
|
|
|
23
31
|
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
24
32
|
each: T | undefined | null | false;
|
|
25
33
|
fallback?: SolidElement;
|
|
26
|
-
keyed?:
|
|
34
|
+
keyed?: true;
|
|
35
|
+
children: (item: T[number], index: Accessor<number>) => U;
|
|
36
|
+
}): SolidElement;
|
|
37
|
+
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
38
|
+
each: T | undefined | null | false;
|
|
39
|
+
fallback?: SolidElement;
|
|
40
|
+
keyed: false;
|
|
41
|
+
children: (item: Accessor<T[number]>, index: number) => U;
|
|
42
|
+
}): SolidElement;
|
|
43
|
+
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
44
|
+
each: T | undefined | null | false;
|
|
45
|
+
fallback?: SolidElement;
|
|
46
|
+
keyed: (item: T[number]) => any;
|
|
27
47
|
children: (item: Accessor<T[number]>, index: Accessor<number>) => U;
|
|
28
48
|
}): SolidElement;
|
|
29
49
|
/**
|
|
@@ -51,10 +71,10 @@ export declare function Repeat<T extends SolidElement>(props: {
|
|
|
51
71
|
* Conditionally renders its children when `when` is truthy, otherwise renders
|
|
52
72
|
* the optional `fallback`.
|
|
53
73
|
*
|
|
54
|
-
* The function-child form receives
|
|
55
|
-
* it
|
|
56
|
-
*
|
|
57
|
-
* identity changes.
|
|
74
|
+
* The function-child form receives a narrowed value. Without `keyed`
|
|
75
|
+
* (default), it receives an accessor and the child is preserved across truthy
|
|
76
|
+
* values; with `keyed`, it receives the raw value and remounts whenever the
|
|
77
|
+
* value's identity changes.
|
|
58
78
|
*
|
|
59
79
|
* @example
|
|
60
80
|
* ```tsx
|
|
@@ -65,11 +85,29 @@ export declare function Repeat<T extends SolidElement>(props: {
|
|
|
65
85
|
*
|
|
66
86
|
* @description https://docs.solidjs.com/reference/components/show
|
|
67
87
|
*/
|
|
88
|
+
export declare function Show<T>(props: {
|
|
89
|
+
when: T | undefined | null | false;
|
|
90
|
+
keyed: true;
|
|
91
|
+
fallback?: SolidElement;
|
|
92
|
+
children: SolidElement;
|
|
93
|
+
}): SolidElement;
|
|
94
|
+
export declare function Show<T, F extends KeyedConditionalRenderCallback<T>>(props: {
|
|
95
|
+
when: T | undefined | null | false;
|
|
96
|
+
keyed: true;
|
|
97
|
+
fallback?: SolidElement;
|
|
98
|
+
children: NonZeroParams<F>;
|
|
99
|
+
}): SolidElement;
|
|
100
|
+
export declare function Show<T>(props: {
|
|
101
|
+
when: T | undefined | null | false;
|
|
102
|
+
keyed?: false;
|
|
103
|
+
fallback?: SolidElement;
|
|
104
|
+
children: SolidElement;
|
|
105
|
+
}): SolidElement;
|
|
68
106
|
export declare function Show<T, F extends ConditionalRenderCallback<T>>(props: {
|
|
69
107
|
when: T | undefined | null | false;
|
|
70
|
-
keyed?:
|
|
108
|
+
keyed?: false;
|
|
71
109
|
fallback?: SolidElement;
|
|
72
|
-
children:
|
|
110
|
+
children: NonZeroParams<F>;
|
|
73
111
|
}): SolidElement;
|
|
74
112
|
/**
|
|
75
113
|
* Switches between content based on mutually exclusive conditions. Renders
|
|
@@ -96,15 +134,26 @@ export declare function Switch(props: {
|
|
|
96
134
|
}): SolidElement;
|
|
97
135
|
export type MatchProps<T, F extends ConditionalRenderCallback<T> = ConditionalRenderCallback<T>> = {
|
|
98
136
|
when: T | undefined | null | false;
|
|
99
|
-
keyed?:
|
|
137
|
+
keyed?: false;
|
|
100
138
|
children: ConditionalRenderChildren<T, F>;
|
|
101
139
|
};
|
|
140
|
+
export type KeyedMatchProps<T, F extends KeyedConditionalRenderCallback<T> = KeyedConditionalRenderCallback<T>> = {
|
|
141
|
+
when: T | undefined | null | false;
|
|
142
|
+
keyed: true;
|
|
143
|
+
children: KeyedConditionalRenderChildren<T, F>;
|
|
144
|
+
};
|
|
145
|
+
export type AnyMatchProps<T> = MatchProps<T> | KeyedMatchProps<T> | {
|
|
146
|
+
when: T | undefined | null | false;
|
|
147
|
+
keyed?: boolean;
|
|
148
|
+
children: SolidElement;
|
|
149
|
+
};
|
|
102
150
|
/**
|
|
103
151
|
* A branch inside a `<Switch>`. The first `<Match>` whose `when` is truthy
|
|
104
152
|
* wins; remaining matches are skipped.
|
|
105
153
|
*
|
|
106
|
-
* Like `<Show>`, `<Match>` supports a function child
|
|
107
|
-
* accessor for the narrowed value
|
|
154
|
+
* Like `<Show>`, `<Match>` supports a function child. Non-keyed children
|
|
155
|
+
* receive an accessor for the narrowed value; keyed children receive the raw
|
|
156
|
+
* narrowed value.
|
|
108
157
|
*
|
|
109
158
|
* @example
|
|
110
159
|
* ```tsx
|
|
@@ -120,7 +169,19 @@ export type MatchProps<T, F extends ConditionalRenderCallback<T> = ConditionalRe
|
|
|
120
169
|
*
|
|
121
170
|
* @description https://docs.solidjs.com/reference/components/switch-and-match
|
|
122
171
|
*/
|
|
172
|
+
export declare function Match<T>(props: {
|
|
173
|
+
when: T | undefined | null | false;
|
|
174
|
+
keyed: true;
|
|
175
|
+
children: SolidElement;
|
|
176
|
+
}): SolidElement;
|
|
177
|
+
export declare function Match<T, F extends KeyedConditionalRenderCallback<T>>(props: KeyedMatchProps<T, F>): SolidElement;
|
|
178
|
+
export declare function Match<T>(props: {
|
|
179
|
+
when: T | undefined | null | false;
|
|
180
|
+
keyed?: false;
|
|
181
|
+
children: SolidElement;
|
|
182
|
+
}): SolidElement;
|
|
123
183
|
export declare function Match<T, F extends ConditionalRenderCallback<T>>(props: MatchProps<T, F>): SolidElement;
|
|
184
|
+
export declare function Match<T>(props: AnyMatchProps<T>): SolidElement;
|
|
124
185
|
/**
|
|
125
186
|
* Catches uncaught errors inside its subtree and renders fallback content
|
|
126
187
|
* instead. The `fallback` prop can be a JSX element, or a callback that
|
|
@@ -3,16 +3,29 @@ import type { Element as SolidElement } from "../types.cjs";
|
|
|
3
3
|
export type { RevealOrder };
|
|
4
4
|
type NonZeroParams<T extends (...args: any[]) => any> = Parameters<T>["length"] extends 0 ? never : T;
|
|
5
5
|
type ConditionalRenderCallback<T> = (item: Accessor<NonNullable<T>>) => SolidElement;
|
|
6
|
+
type KeyedConditionalRenderCallback<T> = (item: NonNullable<T>) => SolidElement;
|
|
6
7
|
type ConditionalRenderChildren<T, F extends ConditionalRenderCallback<T> = ConditionalRenderCallback<T>> = SolidElement | NonZeroParams<F>;
|
|
8
|
+
type KeyedConditionalRenderChildren<T, F extends KeyedConditionalRenderCallback<T> = KeyedConditionalRenderCallback<T>> = SolidElement | NonZeroParams<F>;
|
|
7
9
|
/**
|
|
8
10
|
* Creates a list of elements from a list
|
|
9
|
-
*
|
|
10
11
|
* @description https://docs.solidjs.com/reference/components/for
|
|
11
12
|
*/
|
|
12
13
|
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
13
14
|
each: T | undefined | null | false;
|
|
14
15
|
fallback?: SolidElement;
|
|
15
|
-
keyed?:
|
|
16
|
+
keyed?: true;
|
|
17
|
+
children: (item: T[number], index: Accessor<number>) => U;
|
|
18
|
+
}): SolidElement;
|
|
19
|
+
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
20
|
+
each: T | undefined | null | false;
|
|
21
|
+
fallback?: SolidElement;
|
|
22
|
+
keyed: false;
|
|
23
|
+
children: (item: Accessor<T[number]>, index: number) => U;
|
|
24
|
+
}): SolidElement;
|
|
25
|
+
export declare function For<T extends readonly any[], U extends SolidElement>(props: {
|
|
26
|
+
each: T | undefined | null | false;
|
|
27
|
+
fallback?: SolidElement;
|
|
28
|
+
keyed: (item: T[number]) => any;
|
|
16
29
|
children: (item: Accessor<T[number]>, index: Accessor<number>) => U;
|
|
17
30
|
}): SolidElement;
|
|
18
31
|
/**
|
|
@@ -30,11 +43,29 @@ export declare function Repeat<T extends SolidElement>(props: {
|
|
|
30
43
|
* Conditionally render its children or an optional fallback component
|
|
31
44
|
* @description https://docs.solidjs.com/reference/components/show
|
|
32
45
|
*/
|
|
46
|
+
export declare function Show<T>(props: {
|
|
47
|
+
when: T | undefined | null | false;
|
|
48
|
+
keyed: true;
|
|
49
|
+
fallback?: SolidElement;
|
|
50
|
+
children: SolidElement;
|
|
51
|
+
}): SolidElement;
|
|
52
|
+
export declare function Show<T, F extends KeyedConditionalRenderCallback<T>>(props: {
|
|
53
|
+
when: T | undefined | null | false;
|
|
54
|
+
keyed: true;
|
|
55
|
+
fallback?: SolidElement;
|
|
56
|
+
children: NonZeroParams<F>;
|
|
57
|
+
}): SolidElement;
|
|
58
|
+
export declare function Show<T>(props: {
|
|
59
|
+
when: T | undefined | null | false;
|
|
60
|
+
keyed?: false;
|
|
61
|
+
fallback?: SolidElement;
|
|
62
|
+
children: SolidElement;
|
|
63
|
+
}): SolidElement;
|
|
33
64
|
export declare function Show<T, F extends ConditionalRenderCallback<T>>(props: {
|
|
34
65
|
when: T | undefined | null | false;
|
|
35
|
-
keyed?:
|
|
66
|
+
keyed?: false;
|
|
36
67
|
fallback?: SolidElement;
|
|
37
|
-
children:
|
|
68
|
+
children: NonZeroParams<F>;
|
|
38
69
|
}): SolidElement;
|
|
39
70
|
/**
|
|
40
71
|
* Switches between content based on mutually exclusive conditions
|
|
@@ -46,14 +77,36 @@ export declare function Switch(props: {
|
|
|
46
77
|
}): SolidElement;
|
|
47
78
|
export type MatchProps<T, F extends ConditionalRenderCallback<T> = ConditionalRenderCallback<T>> = {
|
|
48
79
|
when: T | undefined | null | false;
|
|
49
|
-
keyed?:
|
|
80
|
+
keyed?: false;
|
|
50
81
|
children: ConditionalRenderChildren<T, F>;
|
|
51
82
|
};
|
|
83
|
+
export type KeyedMatchProps<T, F extends KeyedConditionalRenderCallback<T> = KeyedConditionalRenderCallback<T>> = {
|
|
84
|
+
when: T | undefined | null | false;
|
|
85
|
+
keyed: true;
|
|
86
|
+
children: KeyedConditionalRenderChildren<T, F>;
|
|
87
|
+
};
|
|
88
|
+
export type AnyMatchProps<T> = MatchProps<T> | KeyedMatchProps<T> | {
|
|
89
|
+
when: T | undefined | null | false;
|
|
90
|
+
keyed?: boolean;
|
|
91
|
+
children: SolidElement;
|
|
92
|
+
};
|
|
52
93
|
/**
|
|
53
94
|
* Selects a content based on condition when inside a `<Switch>` control flow
|
|
54
95
|
* @description https://docs.solidjs.com/reference/components/switch-and-match
|
|
55
96
|
*/
|
|
97
|
+
export declare function Match<T>(props: {
|
|
98
|
+
when: T | undefined | null | false;
|
|
99
|
+
keyed: true;
|
|
100
|
+
children: SolidElement;
|
|
101
|
+
}): SolidElement;
|
|
102
|
+
export declare function Match<T, F extends KeyedConditionalRenderCallback<T>>(props: KeyedMatchProps<T, F>): SolidElement;
|
|
103
|
+
export declare function Match<T>(props: {
|
|
104
|
+
when: T | undefined | null | false;
|
|
105
|
+
keyed?: false;
|
|
106
|
+
children: SolidElement;
|
|
107
|
+
}): SolidElement;
|
|
56
108
|
export declare function Match<T, F extends ConditionalRenderCallback<T>>(props: MatchProps<T, F>): SolidElement;
|
|
109
|
+
export declare function Match<T>(props: AnyMatchProps<T>): SolidElement;
|
|
57
110
|
/**
|
|
58
111
|
* Catches uncaught errors inside components and renders a fallback content
|
|
59
112
|
* @description https://docs.solidjs.com/reference/components/error-boundary
|
|
@@ -2,11 +2,11 @@ import { $REFRESH } from "@solidjs/signals";
|
|
|
2
2
|
export { $REFRESH };
|
|
3
3
|
export { NotReadyError, NoOwnerError, ContextNotFoundError, isEqual, isWrappable, SUPPORTS_PROXY, enableExternalSource, enforceLoadingBoundary } from "@solidjs/signals";
|
|
4
4
|
export { flatten } from "@solidjs/signals";
|
|
5
|
-
export { snapshot,
|
|
5
|
+
export { snapshot, omit, storePath, $PROXY, $TRACK } from "@solidjs/signals";
|
|
6
6
|
import type { Accessor as SignalAccessor, Refreshable } from "@solidjs/signals";
|
|
7
7
|
export type SourceAccessor<T> = Refreshable<SignalAccessor<T>>;
|
|
8
8
|
export type { Accessor, ComputeFunction, EffectFunction, EffectBundle, EffectOptions, ExternalSource, ExternalSourceConfig, ExternalSourceFactory, MemoOptions, NoInfer, SignalOptions, Setter, Signal, Owner, Refreshable, Maybe, Store, StoreSetter, StoreNode, NotWrappable, SolidStore, Merge, Omit, Context, ContextRecord, IQueue, StorePathRange, ArrayFilterFn, CustomPartial, Part, PathSetter } from "@solidjs/signals";
|
|
9
|
-
import type { Accessor, ComputeFunction, EffectFunction, EffectBundle, EffectOptions, MemoOptions, SignalOptions, Signal, Owner, Store, StoreSetter, Context } from "@solidjs/signals";
|
|
9
|
+
import type { Accessor, ComputeFunction, EffectFunction, EffectBundle, EffectOptions, MemoOptions, SignalOptions, Signal, Merge, Owner, Store, StoreSetter, Context } from "@solidjs/signals";
|
|
10
10
|
import { sharedConfig, NoHydrateContext } from "./shared.cjs";
|
|
11
11
|
type Disposable = () => void;
|
|
12
12
|
export declare function getNextChildId(owner: Owner): string;
|
|
@@ -90,8 +90,17 @@ export declare const createOptimisticStore: typeof createStore;
|
|
|
90
90
|
export declare function createProjection<T extends object>(fn: (draft: T) => void | T | Promise<void | T> | AsyncIterable<void | T>, initialValue: Partial<T>, options?: ServerSsrOptions): Store<T>;
|
|
91
91
|
export declare function reconcile<T extends U, U extends object>(value: T): (state: U) => T;
|
|
92
92
|
export declare function deep<T extends object>(store: Store<T>): Store<T>;
|
|
93
|
-
export declare function
|
|
94
|
-
|
|
93
|
+
export declare function merge<T extends unknown[]>(...sources: T): Merge<T>;
|
|
94
|
+
export declare function mapArray<T, U>(list: Accessor<readonly T[] | undefined | null | false>, mapFn: (v: T, i: Accessor<number>) => U, options?: {
|
|
95
|
+
keyed?: true;
|
|
96
|
+
fallback?: Accessor<any>;
|
|
97
|
+
}): () => U[];
|
|
98
|
+
export declare function mapArray<T, U>(list: Accessor<readonly T[] | undefined | null | false>, mapFn: (v: Accessor<T>, i: number) => U, options: {
|
|
99
|
+
keyed: false;
|
|
100
|
+
fallback?: Accessor<any>;
|
|
101
|
+
}): () => U[];
|
|
102
|
+
export declare function mapArray<T, U>(list: Accessor<readonly T[] | undefined | null | false>, mapFn: (v: Accessor<T>, i: Accessor<number>) => U, options: {
|
|
103
|
+
keyed: (item: T) => any;
|
|
95
104
|
fallback?: Accessor<any>;
|
|
96
105
|
}): () => U[];
|
|
97
106
|
export declare function repeat<T>(count: Accessor<number>, mapFn: (i: number) => T, options?: {
|