solid-js 1.5.0-beta.0 → 1.5.0-beta.3

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.
Files changed (53) hide show
  1. package/dist/dev.cjs +143 -132
  2. package/dist/dev.js +143 -132
  3. package/dist/server.cjs +86 -35
  4. package/dist/server.js +86 -35
  5. package/dist/solid.cjs +143 -132
  6. package/dist/solid.js +143 -132
  7. package/h/jsx-runtime/types/jsx.d.ts +3 -1
  8. package/h/types/hyperscript.d.ts +17 -0
  9. package/html/types/lit.d.ts +37 -0
  10. package/package.json +103 -41
  11. package/store/dist/dev.js +1 -1
  12. package/store/types/index.d.ts +4 -4
  13. package/store/types/mutable.d.ts +1 -1
  14. package/store/types/server.d.ts +1 -1
  15. package/types/index.d.ts +8 -8
  16. package/types/jsx.d.ts +4 -2
  17. package/types/reactive/array.d.ts +1 -1
  18. package/types/reactive/observable.d.ts +1 -1
  19. package/types/reactive/signal.d.ts +40 -33
  20. package/types/render/Suspense.d.ts +1 -1
  21. package/types/render/component.d.ts +1 -1
  22. package/types/render/flow.d.ts +20 -3
  23. package/types/render/index.d.ts +4 -4
  24. package/types/server/index.d.ts +3 -3
  25. package/types/server/reactive.d.ts +7 -3
  26. package/types/server/rendering.d.ts +15 -6
  27. package/universal/dist/dev.cjs +4 -1
  28. package/universal/dist/dev.js +5 -2
  29. package/universal/dist/universal.cjs +4 -1
  30. package/universal/dist/universal.js +5 -2
  31. package/universal/types/index.d.ts +1 -1
  32. package/web/dist/dev.cjs +5 -0
  33. package/web/dist/dev.js +6 -2
  34. package/web/dist/server.cjs +275 -234
  35. package/web/dist/server.js +275 -234
  36. package/web/dist/web.cjs +5 -0
  37. package/web/dist/web.js +6 -2
  38. package/web/types/client.d.ts +1 -1
  39. package/web/types/core.d.ts +3 -3
  40. package/web/types/index.d.ts +5 -5
  41. package/web/types/jsx.d.ts +1 -1
  42. package/web/types/server.d.ts +70 -0
  43. package/h/README.md +0 -99
  44. package/h/jsx-runtime/package.json +0 -8
  45. package/h/package.json +0 -8
  46. package/html/README.md +0 -84
  47. package/html/package.json +0 -8
  48. package/store/README.md +0 -23
  49. package/store/package.json +0 -35
  50. package/universal/README.md +0 -102
  51. package/universal/package.json +0 -18
  52. package/web/README.md +0 -7
  53. package/web/package.json +0 -35
package/dist/solid.cjs CHANGED
@@ -153,7 +153,6 @@ let Transition = null;
153
153
  let Scheduler = null;
154
154
  let ExternalSourceFactory = null;
155
155
  let Listener = null;
156
- let Pending = null;
157
156
  let Updates = null;
158
157
  let Effects = null;
159
158
  let ExecCount = 0;
@@ -167,7 +166,7 @@ function createRoot(fn, detachedOwner) {
167
166
  context: null,
168
167
  owner: detachedOwner || owner
169
168
  },
170
- updateFn = unowned ? fn : () => fn(() => cleanNode(root));
169
+ updateFn = unowned ? fn : () => fn(() => untrack(() => cleanNode(root)));
171
170
  Owner = root;
172
171
  Listener = null;
173
172
  try {
@@ -235,18 +234,19 @@ function createMemo(fn, value, options) {
235
234
  } else updateComputation(c);
236
235
  return readSignal.bind(c);
237
236
  }
238
- function createResource(source, fetcher, options) {
239
- if (arguments.length === 2) {
240
- if (typeof fetcher === "object") {
241
- options = fetcher;
242
- fetcher = source;
243
- source = true;
244
- }
245
- } else if (arguments.length === 1) {
246
- fetcher = source;
237
+ function createResource(pSource, pFetcher, pOptions) {
238
+ let source;
239
+ let fetcher;
240
+ let options;
241
+ if (arguments.length === 2 && typeof pFetcher === "object" || arguments.length === 1) {
247
242
  source = true;
243
+ fetcher = pSource;
244
+ options = pFetcher || {};
245
+ } else {
246
+ source = pSource;
247
+ fetcher = pFetcher;
248
+ options = pOptions || {};
248
249
  }
249
- options || (options = {});
250
250
  let err = undefined,
251
251
  pr = null,
252
252
  initP = NO_INIT,
@@ -264,7 +264,7 @@ function createResource(source, fetcher, options) {
264
264
  if (sharedConfig.context) {
265
265
  id = `${sharedConfig.context.id}${sharedConfig.context.count++}`;
266
266
  let v;
267
- if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
267
+ if (options.useInitialValue) initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
268
268
  }
269
269
  function loadEnd(p, v, success, key) {
270
270
  if (pr === p) {
@@ -292,7 +292,7 @@ function createResource(source, fetcher, options) {
292
292
  function completeLoad(v, success) {
293
293
  !success && (err = castError(v));
294
294
  runUpdates(() => {
295
- setValue(() => success ? v : undefined);
295
+ setValue(() => v);
296
296
  setState(success ? "ready" : "error");
297
297
  for (const c of contexts.keys()) c.decrement();
298
298
  contexts.clear();
@@ -316,7 +316,7 @@ function createResource(source, fetcher, options) {
316
316
  return v;
317
317
  }
318
318
  function load(refetching = true) {
319
- if (refetching && scheduled) return;
319
+ if (refetching !== false && scheduled) return;
320
320
  scheduled = false;
321
321
  err = undefined;
322
322
  const lookup = dynamic ? dynamic() : source;
@@ -416,18 +416,7 @@ function createSelector(source, fn = equalFn, options) {
416
416
  };
417
417
  }
418
418
  function batch(fn) {
419
- if (Pending) return fn();
420
- let result;
421
- const q = Pending = [];
422
- try {
423
- result = fn();
424
- } finally {
425
- Pending = null;
426
- }
427
- runUpdates(() => {
428
- for (let i = 0; i < q.length; i += 1) notifySignal(q[i]);
429
- }, false);
430
- return result;
419
+ return runUpdates(fn, false);
431
420
  }
432
421
  function untrack(fn) {
433
422
  let result,
@@ -563,10 +552,12 @@ function enableExternalSource(factory) {
563
552
  function readSignal() {
564
553
  const runningTransition = Transition && Transition.running;
565
554
  if (this.sources && (!runningTransition && this.state || runningTransition && this.tState)) {
566
- const updates = Updates;
567
- Updates = null;
568
- !runningTransition && this.state === STALE || runningTransition && this.tState === STALE ? updateComputation(this) : lookUpstream(this);
569
- Updates = updates;
555
+ if (!runningTransition && this.state === STALE || runningTransition && this.tState === STALE) updateComputation(this);else {
556
+ const updates = Updates;
557
+ Updates = null;
558
+ runUpdates(() => lookUpstream(this), false);
559
+ Updates = updates;
560
+ }
570
561
  }
571
562
  if (Listener) {
572
563
  const sSlot = this.observers ? this.observers.length : 0;
@@ -599,30 +590,27 @@ function writeSignal(node, value, isComp) {
599
590
  }
600
591
  if (!TransitionRunning) node.value = value;
601
592
  } else node.value = value;
602
- if (Pending) Pending.push(node);else notifySignal(node);
603
- }
604
- return value;
605
- }
606
- function notifySignal(node) {
607
- if (node.observers && node.observers.length) {
608
- runUpdates(() => {
609
- for (let i = 0; i < node.observers.length; i += 1) {
610
- const o = node.observers[i];
611
- const TransitionRunning = Transition && Transition.running;
612
- if (TransitionRunning && Transition.disposed.has(o)) continue;
613
- if (TransitionRunning && !o.tState || !TransitionRunning && !o.state) {
614
- if (o.pure) Updates.push(o);else Effects.push(o);
615
- if (o.observers) markDownstream(o);
593
+ if (node.observers && node.observers.length) {
594
+ runUpdates(() => {
595
+ for (let i = 0; i < node.observers.length; i += 1) {
596
+ const o = node.observers[i];
597
+ const TransitionRunning = Transition && Transition.running;
598
+ if (TransitionRunning && Transition.disposed.has(o)) continue;
599
+ if (TransitionRunning && !o.tState || !TransitionRunning && !o.state) {
600
+ if (o.pure) Updates.push(o);else Effects.push(o);
601
+ if (o.observers) markDownstream(o);
602
+ }
603
+ if (TransitionRunning) o.tState = STALE;else o.state = STALE;
616
604
  }
617
- if (TransitionRunning) o.tState = STALE;else o.state = STALE;
618
- }
619
- if (Updates.length > 10e5) {
620
- Updates = [];
621
- if (false) ;
622
- throw new Error();
623
- }
624
- }, false);
605
+ if (Updates.length > 10e5) {
606
+ Updates = [];
607
+ if (false) ;
608
+ throw new Error();
609
+ }
610
+ }, false);
611
+ }
625
612
  }
613
+ return value;
626
614
  }
627
615
  function updateComputation(node) {
628
616
  if (!node.fn) return;
@@ -648,6 +636,7 @@ function runComputation(node, value, time) {
648
636
  try {
649
637
  nextValue = node.fn(value);
650
638
  } catch (err) {
639
+ if (node.pure) Transition && Transition.running ? node.tState = STALE : node.state = STALE;
651
640
  handleError(err);
652
641
  }
653
642
  if (!node.updatedAt || node.updatedAt <= time) {
@@ -724,7 +713,7 @@ function runTop(node) {
724
713
  } else if (!runningTransition && node.state === PENDING || runningTransition && node.tState === PENDING) {
725
714
  const updates = Updates;
726
715
  Updates = null;
727
- lookUpstream(node, ancestors[0]);
716
+ runUpdates(() => lookUpstream(node, ancestors[0]), false);
728
717
  Updates = updates;
729
718
  }
730
719
  }
@@ -918,7 +907,7 @@ function resolveChildren(children) {
918
907
  function createProvider(id) {
919
908
  return function provider(props) {
920
909
  let res;
921
- createComputed(() => res = untrack(() => {
910
+ createRenderEffect(() => res = untrack(() => {
922
911
  Owner.context = {
923
912
  [id]: props.value
924
913
  };
@@ -941,7 +930,7 @@ function observable(input) {
941
930
  };
942
931
  }
943
932
  const dispose = createRoot(disposer => {
944
- createComputed(() => {
933
+ createEffect(() => {
945
934
  const v = input();
946
935
  untrack(() => handler(v));
947
936
  });
@@ -1293,6 +1282,7 @@ function Index(props) {
1293
1282
  }
1294
1283
  function Show(props) {
1295
1284
  let strictEqual = false;
1285
+ const keyed = props.keyed;
1296
1286
  const condition = createMemo(() => props.when, undefined, {
1297
1287
  equals: (a, b) => strictEqual ? a === b : !a === !b
1298
1288
  });
@@ -1300,20 +1290,26 @@ function Show(props) {
1300
1290
  const c = condition();
1301
1291
  if (c) {
1302
1292
  const child = props.children;
1303
- return (strictEqual = typeof child === "function" && child.length > 0) ? untrack(() => child(c)) : child;
1293
+ const fn = typeof child === "function" && child.length > 0;
1294
+ strictEqual = keyed || fn;
1295
+ return fn ? untrack(() => child(c)) : child;
1304
1296
  }
1305
1297
  return props.fallback;
1306
1298
  });
1307
1299
  }
1308
1300
  function Switch(props) {
1309
1301
  let strictEqual = false;
1302
+ let keyed = false;
1310
1303
  const conditions = children(() => props.children),
1311
1304
  evalConditions = createMemo(() => {
1312
1305
  let conds = conditions();
1313
1306
  if (!Array.isArray(conds)) conds = [conds];
1314
1307
  for (let i = 0; i < conds.length; i++) {
1315
1308
  const c = conds[i].when;
1316
- if (c) return [i, c, conds[i]];
1309
+ if (c) {
1310
+ keyed = !!conds[i].keyed;
1311
+ return [i, c, conds[i]];
1312
+ }
1317
1313
  }
1318
1314
  return [-1];
1319
1315
  }, undefined, {
@@ -1323,7 +1319,9 @@ function Switch(props) {
1323
1319
  const [index, when, cond] = evalConditions();
1324
1320
  if (index < 0) return props.fallback;
1325
1321
  const c = cond.children;
1326
- return (strictEqual = typeof c === "function" && c.length > 0) ? untrack(() => c(when)) : c;
1322
+ const fn = typeof c === "function" && c.length > 0;
1323
+ strictEqual = keyed || fn;
1324
+ return fn ? untrack(() => c(when)) : c;
1327
1325
  });
1328
1326
  }
1329
1327
  function Match(props) {
@@ -1345,81 +1343,94 @@ function ErrorBoundary(props) {
1345
1343
  let e;
1346
1344
  if (e = errored()) {
1347
1345
  const f = props.fallback;
1348
- return typeof f === "function" && f.length ? untrack(() => f(e, setErrored)) : f;
1346
+ const res = typeof f === "function" && f.length ? untrack(() => f(e, () => setErrored())) : f;
1347
+ onError(setErrored);
1348
+ return res;
1349
1349
  }
1350
1350
  onError(setErrored);
1351
1351
  return props.children;
1352
1352
  });
1353
1353
  }
1354
1354
 
1355
+ const suspenseListEquals = (a, b) => a.showContent === b.showContent && a.showFallback === b.showFallback;
1355
1356
  const SuspenseListContext = createContext();
1356
1357
  function SuspenseList(props) {
1357
- let suspenseSetter, showContent, showFallback;
1358
+ let [wrapper, setWrapper] = createSignal(() => ({
1359
+ inFallback: false
1360
+ })),
1361
+ show;
1358
1362
  const listContext = useContext(SuspenseListContext);
1363
+ const [registry, setRegistry] = createSignal([]);
1359
1364
  if (listContext) {
1360
- const [inFallback, setFallback] = createSignal(false);
1361
- suspenseSetter = setFallback;
1362
- [showContent, showFallback] = listContext.register(inFallback);
1365
+ show = listContext.register(createMemo(() => wrapper()().inFallback));
1363
1366
  }
1364
- const [registry, setRegistry] = createSignal([]),
1365
- comp = createComponent(SuspenseListContext.Provider, {
1366
- value: {
1367
- register: inFallback => {
1368
- const [showingContent, showContent] = createSignal(false),
1369
- [showingFallback, showFallback] = createSignal(false);
1370
- setRegistry(registry => [...registry, {
1371
- inFallback,
1372
- showContent,
1373
- showFallback
1374
- }]);
1375
- return [showingContent, showingFallback];
1376
- }
1377
- },
1378
- get children() {
1379
- return props.children;
1380
- }
1381
- });
1382
- createComputed(() => {
1367
+ const resolved = createMemo(prev => {
1383
1368
  const reveal = props.revealOrder,
1384
1369
  tail = props.tail,
1385
- visibleContent = showContent ? showContent() : true,
1386
- visibleFallback = showFallback ? showFallback() : true,
1370
+ {
1371
+ showContent = true,
1372
+ showFallback = true
1373
+ } = show ? show() : {},
1387
1374
  reg = registry(),
1388
1375
  reverse = reveal === "backwards";
1389
1376
  if (reveal === "together") {
1390
- const all = reg.every(i => !i.inFallback());
1391
- suspenseSetter && suspenseSetter(!all);
1392
- reg.forEach(i => {
1393
- i.showContent(all && visibleContent);
1394
- i.showFallback(visibleFallback);
1395
- });
1396
- return;
1377
+ const all = reg.every(inFallback => !inFallback());
1378
+ const res = reg.map(() => ({
1379
+ showContent: all && showContent,
1380
+ showFallback
1381
+ }));
1382
+ res.inFallback = !all;
1383
+ return res;
1397
1384
  }
1398
1385
  let stop = false;
1386
+ let inFallback = prev.inFallback;
1387
+ const res = [];
1399
1388
  for (let i = 0, len = reg.length; i < len; i++) {
1400
1389
  const n = reverse ? len - i - 1 : i,
1401
- s = reg[n].inFallback();
1390
+ s = reg[n]();
1402
1391
  if (!stop && !s) {
1403
- reg[n].showContent(visibleContent);
1404
- reg[n].showFallback(visibleFallback);
1392
+ res[n] = {
1393
+ showContent,
1394
+ showFallback
1395
+ };
1405
1396
  } else {
1406
1397
  const next = !stop;
1407
- if (next && suspenseSetter) suspenseSetter(true);
1408
- if (!tail || next && tail === "collapsed") {
1409
- reg[n].showFallback(visibleFallback);
1410
- } else reg[n].showFallback(false);
1398
+ if (next) inFallback = true;
1399
+ res[n] = {
1400
+ showContent: next,
1401
+ showFallback: !tail || next && tail === "collapsed" ? showFallback : false
1402
+ };
1411
1403
  stop = true;
1412
- reg[n].showContent(next);
1413
1404
  }
1414
1405
  }
1415
- if (!stop && suspenseSetter) suspenseSetter(false);
1406
+ if (!stop) inFallback = false;
1407
+ res.inFallback = inFallback;
1408
+ return res;
1409
+ }, {
1410
+ inFallback: false
1411
+ });
1412
+ setWrapper(() => resolved);
1413
+ return createComponent(SuspenseListContext.Provider, {
1414
+ value: {
1415
+ register: inFallback => {
1416
+ let index;
1417
+ setRegistry(registry => {
1418
+ index = registry.length;
1419
+ return [...registry, inFallback];
1420
+ });
1421
+ return createMemo(() => resolved()[index], undefined, {
1422
+ equals: suspenseListEquals
1423
+ });
1424
+ }
1425
+ },
1426
+ get children() {
1427
+ return props.children;
1428
+ }
1416
1429
  });
1417
- return comp;
1418
1430
  }
1419
1431
  function Suspense(props) {
1420
1432
  let counter = 0,
1421
- showContent,
1422
- showFallback,
1433
+ show,
1423
1434
  ctx,
1424
1435
  p,
1425
1436
  flicker,
@@ -1441,29 +1452,26 @@ function Suspense(props) {
1441
1452
  if (sharedConfig.context && sharedConfig.load) {
1442
1453
  const key = sharedConfig.context.id + sharedConfig.context.count;
1443
1454
  let ref = sharedConfig.load(key);
1444
- if (ref) {
1445
- p = ref[0];
1446
- if (p === "$$$") sharedConfig.gather(key);else {
1447
- if (typeof p !== "object" || !("then" in p)) p = Promise.resolve(p);
1448
- const [s, set] = createSignal(undefined, {
1449
- equals: false
1450
- });
1451
- flicker = s;
1452
- p.then(err => {
1453
- if (err !== "$$$" || sharedConfig.done) {
1454
- err !== "$$$" && (error = err);
1455
- return set();
1456
- }
1457
- sharedConfig.gather(key);
1458
- setHydrateContext(ctx);
1459
- set();
1460
- setHydrateContext();
1461
- });
1462
- }
1455
+ if (ref && (p = ref[0]) && p !== "$$f") {
1456
+ if (typeof p !== "object" || !("then" in p)) p = Promise.resolve(p);
1457
+ const [s, set] = createSignal(undefined, {
1458
+ equals: false
1459
+ });
1460
+ flicker = s;
1461
+ p.then(err => {
1462
+ if (err || sharedConfig.done) {
1463
+ err && (error = err);
1464
+ return set();
1465
+ }
1466
+ sharedConfig.gather(key);
1467
+ setHydrateContext(ctx);
1468
+ set();
1469
+ setHydrateContext();
1470
+ });
1463
1471
  }
1464
1472
  }
1465
1473
  const listContext = useContext(SuspenseListContext);
1466
- if (listContext) [showContent, showFallback] = listContext.register(store.inFallback);
1474
+ if (listContext) show = listContext.register(store.inFallback);
1467
1475
  let dispose;
1468
1476
  onCleanup(() => dispose && dispose());
1469
1477
  return createComponent(SuspenseContext.Provider, {
@@ -1476,20 +1484,23 @@ function Suspense(props) {
1476
1484
  flicker();
1477
1485
  return flicker = undefined;
1478
1486
  }
1479
- if (ctx && !p) setHydrateContext();
1487
+ if (ctx && p === "$$f") setHydrateContext();
1480
1488
  const rendered = createMemo(() => props.children);
1481
- return createMemo(() => {
1489
+ return createMemo(prev => {
1482
1490
  const inFallback = store.inFallback(),
1483
- visibleContent = showContent ? showContent() : true,
1484
- visibleFallback = showFallback ? showFallback() : true;
1485
- dispose && dispose();
1486
- if ((!inFallback || p) && visibleContent) {
1491
+ {
1492
+ showContent = true,
1493
+ showFallback = true
1494
+ } = show ? show() : {};
1495
+ if ((!inFallback || p && p !== "$$f") && showContent) {
1487
1496
  store.resolved = true;
1488
- ctx = p = undefined;
1497
+ dispose && dispose();
1498
+ dispose = ctx = p = undefined;
1489
1499
  resumeEffects(store.effects);
1490
1500
  return rendered();
1491
1501
  }
1492
- if (!visibleFallback) return;
1502
+ if (!showFallback) return;
1503
+ if (dispose) return prev;
1493
1504
  return createRoot(disposer => {
1494
1505
  dispose = disposer;
1495
1506
  if (ctx) {