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/dev.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;
@@ -170,7 +169,7 @@ function createRoot(fn, detachedOwner) {
170
169
  },
171
170
  updateFn = unowned ? () => fn(() => {
172
171
  throw new Error("Dispose method must be an explicit argument to createRoot function");
173
- }) : () => fn(() => cleanNode(root));
172
+ }) : () => fn(() => untrack(() => cleanNode(root)));
174
173
  {
175
174
  if (owner) root.name = `${owner.name}-r${rootCount++}`;
176
175
  globalThis._$afterCreateRoot && globalThis._$afterCreateRoot(root);
@@ -243,18 +242,19 @@ function createMemo(fn, value, options) {
243
242
  } else updateComputation(c);
244
243
  return readSignal.bind(c);
245
244
  }
246
- function createResource(source, fetcher, options) {
247
- if (arguments.length === 2) {
248
- if (typeof fetcher === "object") {
249
- options = fetcher;
250
- fetcher = source;
251
- source = true;
252
- }
253
- } else if (arguments.length === 1) {
254
- fetcher = source;
245
+ function createResource(pSource, pFetcher, pOptions) {
246
+ let source;
247
+ let fetcher;
248
+ let options;
249
+ if (arguments.length === 2 && typeof pFetcher === "object" || arguments.length === 1) {
255
250
  source = true;
251
+ fetcher = pSource;
252
+ options = pFetcher || {};
253
+ } else {
254
+ source = pSource;
255
+ fetcher = pFetcher;
256
+ options = pOptions || {};
256
257
  }
257
- options || (options = {});
258
258
  let err = undefined,
259
259
  pr = null,
260
260
  initP = NO_INIT,
@@ -272,7 +272,7 @@ function createResource(source, fetcher, options) {
272
272
  if (sharedConfig.context) {
273
273
  id = `${sharedConfig.context.id}${sharedConfig.context.count++}`;
274
274
  let v;
275
- if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
275
+ if (options.useInitialValue) initP = options.initialValue;else if (sharedConfig.load && (v = sharedConfig.load(id))) initP = v[0];
276
276
  }
277
277
  function loadEnd(p, v, success, key) {
278
278
  if (pr === p) {
@@ -300,7 +300,7 @@ function createResource(source, fetcher, options) {
300
300
  function completeLoad(v, success) {
301
301
  !success && (err = castError(v));
302
302
  runUpdates(() => {
303
- setValue(() => success ? v : undefined);
303
+ setValue(() => v);
304
304
  setState(success ? "ready" : "error");
305
305
  for (const c of contexts.keys()) c.decrement();
306
306
  contexts.clear();
@@ -324,7 +324,7 @@ function createResource(source, fetcher, options) {
324
324
  return v;
325
325
  }
326
326
  function load(refetching = true) {
327
- if (refetching && scheduled) return;
327
+ if (refetching !== false && scheduled) return;
328
328
  scheduled = false;
329
329
  err = undefined;
330
330
  const lookup = dynamic ? dynamic() : source;
@@ -424,18 +424,7 @@ function createSelector(source, fn = equalFn, options) {
424
424
  };
425
425
  }
426
426
  function batch(fn) {
427
- if (Pending) return fn();
428
- let result;
429
- const q = Pending = [];
430
- try {
431
- result = fn();
432
- } finally {
433
- Pending = null;
434
- }
435
- runUpdates(() => {
436
- for (let i = 0; i < q.length; i += 1) notifySignal(q[i]);
437
- }, false);
438
- return result;
427
+ return runUpdates(fn, false);
439
428
  }
440
429
  function untrack(fn) {
441
430
  let result,
@@ -623,10 +612,12 @@ function enableExternalSource(factory) {
623
612
  function readSignal() {
624
613
  const runningTransition = Transition && Transition.running;
625
614
  if (this.sources && (!runningTransition && this.state || runningTransition && this.tState)) {
626
- const updates = Updates;
627
- Updates = null;
628
- !runningTransition && this.state === STALE || runningTransition && this.tState === STALE ? updateComputation(this) : lookUpstream(this);
629
- Updates = updates;
615
+ if (!runningTransition && this.state === STALE || runningTransition && this.tState === STALE) updateComputation(this);else {
616
+ const updates = Updates;
617
+ Updates = null;
618
+ runUpdates(() => lookUpstream(this), false);
619
+ Updates = updates;
620
+ }
630
621
  }
631
622
  if (Listener) {
632
623
  const sSlot = this.observers ? this.observers.length : 0;
@@ -659,30 +650,27 @@ function writeSignal(node, value, isComp) {
659
650
  }
660
651
  if (!TransitionRunning) node.value = value;
661
652
  } else node.value = value;
662
- if (Pending) Pending.push(node);else notifySignal(node);
663
- }
664
- return value;
665
- }
666
- function notifySignal(node) {
667
- if (node.observers && node.observers.length) {
668
- runUpdates(() => {
669
- for (let i = 0; i < node.observers.length; i += 1) {
670
- const o = node.observers[i];
671
- const TransitionRunning = Transition && Transition.running;
672
- if (TransitionRunning && Transition.disposed.has(o)) continue;
673
- if (TransitionRunning && !o.tState || !TransitionRunning && !o.state) {
674
- if (o.pure) Updates.push(o);else Effects.push(o);
675
- if (o.observers) markDownstream(o);
653
+ if (node.observers && node.observers.length) {
654
+ runUpdates(() => {
655
+ for (let i = 0; i < node.observers.length; i += 1) {
656
+ const o = node.observers[i];
657
+ const TransitionRunning = Transition && Transition.running;
658
+ if (TransitionRunning && Transition.disposed.has(o)) continue;
659
+ if (TransitionRunning && !o.tState || !TransitionRunning && !o.state) {
660
+ if (o.pure) Updates.push(o);else Effects.push(o);
661
+ if (o.observers) markDownstream(o);
662
+ }
663
+ if (TransitionRunning) o.tState = STALE;else o.state = STALE;
676
664
  }
677
- if (TransitionRunning) o.tState = STALE;else o.state = STALE;
678
- }
679
- if (Updates.length > 10e5) {
680
- Updates = [];
681
- if ("_SOLID_DEV_") throw new Error("Potential Infinite Loop Detected.");
682
- throw new Error();
683
- }
684
- }, false);
665
+ if (Updates.length > 10e5) {
666
+ Updates = [];
667
+ if ("_SOLID_DEV_") throw new Error("Potential Infinite Loop Detected.");
668
+ throw new Error();
669
+ }
670
+ }, false);
671
+ }
685
672
  }
673
+ return value;
686
674
  }
687
675
  function updateComputation(node) {
688
676
  if (!node.fn) return;
@@ -708,6 +696,7 @@ function runComputation(node, value, time) {
708
696
  try {
709
697
  nextValue = node.fn(value);
710
698
  } catch (err) {
699
+ if (node.pure) Transition && Transition.running ? node.tState = STALE : node.state = STALE;
711
700
  handleError(err);
712
701
  }
713
702
  if (!node.updatedAt || node.updatedAt <= time) {
@@ -785,7 +774,7 @@ function runTop(node) {
785
774
  } else if (!runningTransition && node.state === PENDING || runningTransition && node.tState === PENDING) {
786
775
  const updates = Updates;
787
776
  Updates = null;
788
- lookUpstream(node, ancestors[0]);
777
+ runUpdates(() => lookUpstream(node, ancestors[0]), false);
789
778
  Updates = updates;
790
779
  }
791
780
  }
@@ -980,7 +969,7 @@ function resolveChildren(children) {
980
969
  function createProvider(id) {
981
970
  return function provider(props) {
982
971
  let res;
983
- createComputed(() => res = untrack(() => {
972
+ createRenderEffect(() => res = untrack(() => {
984
973
  Owner.context = {
985
974
  [id]: props.value
986
975
  };
@@ -1026,7 +1015,7 @@ function observable(input) {
1026
1015
  };
1027
1016
  }
1028
1017
  const dispose = createRoot(disposer => {
1029
- createComputed(() => {
1018
+ createEffect(() => {
1030
1019
  const v = input();
1031
1020
  untrack(() => handler(v));
1032
1021
  });
@@ -1381,6 +1370,7 @@ function Index(props) {
1381
1370
  }
1382
1371
  function Show(props) {
1383
1372
  let strictEqual = false;
1373
+ const keyed = props.keyed;
1384
1374
  const condition = createMemo(() => props.when, undefined, {
1385
1375
  equals: (a, b) => strictEqual ? a === b : !a === !b
1386
1376
  });
@@ -1388,20 +1378,26 @@ function Show(props) {
1388
1378
  const c = condition();
1389
1379
  if (c) {
1390
1380
  const child = props.children;
1391
- return (strictEqual = typeof child === "function" && child.length > 0) ? untrack(() => child(c)) : child;
1381
+ const fn = typeof child === "function" && child.length > 0;
1382
+ strictEqual = keyed || fn;
1383
+ return fn ? untrack(() => child(c)) : child;
1392
1384
  }
1393
1385
  return props.fallback;
1394
1386
  });
1395
1387
  }
1396
1388
  function Switch(props) {
1397
1389
  let strictEqual = false;
1390
+ let keyed = false;
1398
1391
  const conditions = children(() => props.children),
1399
1392
  evalConditions = createMemo(() => {
1400
1393
  let conds = conditions();
1401
1394
  if (!Array.isArray(conds)) conds = [conds];
1402
1395
  for (let i = 0; i < conds.length; i++) {
1403
1396
  const c = conds[i].when;
1404
- if (c) return [i, c, conds[i]];
1397
+ if (c) {
1398
+ keyed = !!conds[i].keyed;
1399
+ return [i, c, conds[i]];
1400
+ }
1405
1401
  }
1406
1402
  return [-1];
1407
1403
  }, undefined, {
@@ -1411,7 +1407,9 @@ function Switch(props) {
1411
1407
  const [index, when, cond] = evalConditions();
1412
1408
  if (index < 0) return props.fallback;
1413
1409
  const c = cond.children;
1414
- return (strictEqual = typeof c === "function" && c.length > 0) ? untrack(() => c(when)) : c;
1410
+ const fn = typeof c === "function" && c.length > 0;
1411
+ strictEqual = keyed || fn;
1412
+ return fn ? untrack(() => c(when)) : c;
1415
1413
  });
1416
1414
  }
1417
1415
  function Match(props) {
@@ -1434,81 +1432,94 @@ function ErrorBoundary(props) {
1434
1432
  if (e = errored()) {
1435
1433
  const f = props.fallback;
1436
1434
  if ((typeof f !== "function" || f.length == 0)) console.error(e);
1437
- return typeof f === "function" && f.length ? untrack(() => f(e, setErrored)) : f;
1435
+ const res = typeof f === "function" && f.length ? untrack(() => f(e, () => setErrored())) : f;
1436
+ onError(setErrored);
1437
+ return res;
1438
1438
  }
1439
1439
  onError(setErrored);
1440
1440
  return props.children;
1441
1441
  });
1442
1442
  }
1443
1443
 
1444
+ const suspenseListEquals = (a, b) => a.showContent === b.showContent && a.showFallback === b.showFallback;
1444
1445
  const SuspenseListContext = createContext();
1445
1446
  function SuspenseList(props) {
1446
- let suspenseSetter, showContent, showFallback;
1447
+ let [wrapper, setWrapper] = createSignal(() => ({
1448
+ inFallback: false
1449
+ })),
1450
+ show;
1447
1451
  const listContext = useContext(SuspenseListContext);
1452
+ const [registry, setRegistry] = createSignal([]);
1448
1453
  if (listContext) {
1449
- const [inFallback, setFallback] = createSignal(false);
1450
- suspenseSetter = setFallback;
1451
- [showContent, showFallback] = listContext.register(inFallback);
1454
+ show = listContext.register(createMemo(() => wrapper()().inFallback));
1452
1455
  }
1453
- const [registry, setRegistry] = createSignal([]),
1454
- comp = createComponent(SuspenseListContext.Provider, {
1455
- value: {
1456
- register: inFallback => {
1457
- const [showingContent, showContent] = createSignal(false),
1458
- [showingFallback, showFallback] = createSignal(false);
1459
- setRegistry(registry => [...registry, {
1460
- inFallback,
1461
- showContent,
1462
- showFallback
1463
- }]);
1464
- return [showingContent, showingFallback];
1465
- }
1466
- },
1467
- get children() {
1468
- return props.children;
1469
- }
1470
- });
1471
- createComputed(() => {
1456
+ const resolved = createMemo(prev => {
1472
1457
  const reveal = props.revealOrder,
1473
1458
  tail = props.tail,
1474
- visibleContent = showContent ? showContent() : true,
1475
- visibleFallback = showFallback ? showFallback() : true,
1459
+ {
1460
+ showContent = true,
1461
+ showFallback = true
1462
+ } = show ? show() : {},
1476
1463
  reg = registry(),
1477
1464
  reverse = reveal === "backwards";
1478
1465
  if (reveal === "together") {
1479
- const all = reg.every(i => !i.inFallback());
1480
- suspenseSetter && suspenseSetter(!all);
1481
- reg.forEach(i => {
1482
- i.showContent(all && visibleContent);
1483
- i.showFallback(visibleFallback);
1484
- });
1485
- return;
1466
+ const all = reg.every(inFallback => !inFallback());
1467
+ const res = reg.map(() => ({
1468
+ showContent: all && showContent,
1469
+ showFallback
1470
+ }));
1471
+ res.inFallback = !all;
1472
+ return res;
1486
1473
  }
1487
1474
  let stop = false;
1475
+ let inFallback = prev.inFallback;
1476
+ const res = [];
1488
1477
  for (let i = 0, len = reg.length; i < len; i++) {
1489
1478
  const n = reverse ? len - i - 1 : i,
1490
- s = reg[n].inFallback();
1479
+ s = reg[n]();
1491
1480
  if (!stop && !s) {
1492
- reg[n].showContent(visibleContent);
1493
- reg[n].showFallback(visibleFallback);
1481
+ res[n] = {
1482
+ showContent,
1483
+ showFallback
1484
+ };
1494
1485
  } else {
1495
1486
  const next = !stop;
1496
- if (next && suspenseSetter) suspenseSetter(true);
1497
- if (!tail || next && tail === "collapsed") {
1498
- reg[n].showFallback(visibleFallback);
1499
- } else reg[n].showFallback(false);
1487
+ if (next) inFallback = true;
1488
+ res[n] = {
1489
+ showContent: next,
1490
+ showFallback: !tail || next && tail === "collapsed" ? showFallback : false
1491
+ };
1500
1492
  stop = true;
1501
- reg[n].showContent(next);
1502
1493
  }
1503
1494
  }
1504
- if (!stop && suspenseSetter) suspenseSetter(false);
1495
+ if (!stop) inFallback = false;
1496
+ res.inFallback = inFallback;
1497
+ return res;
1498
+ }, {
1499
+ inFallback: false
1500
+ });
1501
+ setWrapper(() => resolved);
1502
+ return createComponent(SuspenseListContext.Provider, {
1503
+ value: {
1504
+ register: inFallback => {
1505
+ let index;
1506
+ setRegistry(registry => {
1507
+ index = registry.length;
1508
+ return [...registry, inFallback];
1509
+ });
1510
+ return createMemo(() => resolved()[index], undefined, {
1511
+ equals: suspenseListEquals
1512
+ });
1513
+ }
1514
+ },
1515
+ get children() {
1516
+ return props.children;
1517
+ }
1505
1518
  });
1506
- return comp;
1507
1519
  }
1508
1520
  function Suspense(props) {
1509
1521
  let counter = 0,
1510
- showContent,
1511
- showFallback,
1522
+ show,
1512
1523
  ctx,
1513
1524
  p,
1514
1525
  flicker,
@@ -1530,29 +1541,26 @@ function Suspense(props) {
1530
1541
  if (sharedConfig.context && sharedConfig.load) {
1531
1542
  const key = sharedConfig.context.id + sharedConfig.context.count;
1532
1543
  let ref = sharedConfig.load(key);
1533
- if (ref) {
1534
- p = ref[0];
1535
- if (p === "$$$") sharedConfig.gather(key);else {
1536
- if (typeof p !== "object" || !("then" in p)) p = Promise.resolve(p);
1537
- const [s, set] = createSignal(undefined, {
1538
- equals: false
1539
- });
1540
- flicker = s;
1541
- p.then(err => {
1542
- if (err !== "$$$" || sharedConfig.done) {
1543
- err !== "$$$" && (error = err);
1544
- return set();
1545
- }
1546
- sharedConfig.gather(key);
1547
- setHydrateContext(ctx);
1548
- set();
1549
- setHydrateContext();
1550
- });
1551
- }
1544
+ if (ref && (p = ref[0]) && p !== "$$f") {
1545
+ if (typeof p !== "object" || !("then" in p)) p = Promise.resolve(p);
1546
+ const [s, set] = createSignal(undefined, {
1547
+ equals: false
1548
+ });
1549
+ flicker = s;
1550
+ p.then(err => {
1551
+ if (err || sharedConfig.done) {
1552
+ err && (error = err);
1553
+ return set();
1554
+ }
1555
+ sharedConfig.gather(key);
1556
+ setHydrateContext(ctx);
1557
+ set();
1558
+ setHydrateContext();
1559
+ });
1552
1560
  }
1553
1561
  }
1554
1562
  const listContext = useContext(SuspenseListContext);
1555
- if (listContext) [showContent, showFallback] = listContext.register(store.inFallback);
1563
+ if (listContext) show = listContext.register(store.inFallback);
1556
1564
  let dispose;
1557
1565
  onCleanup(() => dispose && dispose());
1558
1566
  return createComponent(SuspenseContext.Provider, {
@@ -1565,20 +1573,23 @@ function Suspense(props) {
1565
1573
  flicker();
1566
1574
  return flicker = undefined;
1567
1575
  }
1568
- if (ctx && !p) setHydrateContext();
1576
+ if (ctx && p === "$$f") setHydrateContext();
1569
1577
  const rendered = createMemo(() => props.children);
1570
- return createMemo(() => {
1578
+ return createMemo(prev => {
1571
1579
  const inFallback = store.inFallback(),
1572
- visibleContent = showContent ? showContent() : true,
1573
- visibleFallback = showFallback ? showFallback() : true;
1574
- dispose && dispose();
1575
- if ((!inFallback || p) && visibleContent) {
1580
+ {
1581
+ showContent = true,
1582
+ showFallback = true
1583
+ } = show ? show() : {};
1584
+ if ((!inFallback || p && p !== "$$f") && showContent) {
1576
1585
  store.resolved = true;
1577
- ctx = p = undefined;
1586
+ dispose && dispose();
1587
+ dispose = ctx = p = undefined;
1578
1588
  resumeEffects(store.effects);
1579
1589
  return rendered();
1580
1590
  }
1581
- if (!visibleFallback) return;
1591
+ if (!showFallback) return;
1592
+ if (dispose) return prev;
1582
1593
  return createRoot(disposer => {
1583
1594
  dispose = disposer;
1584
1595
  if (ctx) {