solid-js 2.0.0-beta.0 → 2.0.0-beta.1

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/dist/dev.cjs CHANGED
@@ -60,6 +60,10 @@ function registerGraph(value) {
60
60
  value.graph = owner;
61
61
  }
62
62
 
63
+ const NoHydrateContext = {
64
+ id: Symbol("NoHydrateContext"),
65
+ defaultValue: false
66
+ };
63
67
  const sharedConfig = {
64
68
  hydrating: false,
65
69
  registry: undefined,
@@ -67,6 +71,7 @@ const sharedConfig = {
67
71
  getNextContextId() {
68
72
  const o = signals.getOwner();
69
73
  if (!o) throw new Error(`getNextContextId cannot be used under non-hydrating context`);
74
+ if (signals.getContext(NoHydrateContext)) return undefined;
70
75
  return signals.getNextChildId(o);
71
76
  }
72
77
  };
@@ -586,6 +591,17 @@ function Loading(props) {
586
591
  return signals.createLoadBoundary(() => props.children, () => props.fallback);
587
592
  });
588
593
  }
594
+ function NoHydration(props) {
595
+ const o = signals.createOwner();
596
+ return signals.runWithOwner(o, () => {
597
+ signals.setContext(NoHydrateContext, true);
598
+ if (sharedConfig.hydrating) return undefined;
599
+ return props.children;
600
+ });
601
+ }
602
+ function Hydration(props) {
603
+ return props.children;
604
+ }
589
605
 
590
606
  function createComponent(Comp, props) {
591
607
  return devComponent(Comp, props || {});
@@ -617,6 +633,7 @@ function lazy(fn, moduleUrl) {
617
633
  }) : "");
618
634
  };
619
635
  wrap.preload = () => p || ((p = fn()).then(mod => comp = () => mod.default), p);
636
+ wrap.moduleUrl = moduleUrl;
620
637
  return wrap;
621
638
  }
622
639
  let counter = 0;
@@ -869,8 +886,11 @@ exports.$DEVCOMP = $DEVCOMP;
869
886
  exports.DEV = DEV;
870
887
  exports.Errored = Errored;
871
888
  exports.For = For;
889
+ exports.Hydration = Hydration;
872
890
  exports.Loading = Loading;
873
891
  exports.Match = Match;
892
+ exports.NoHydrateContext = NoHydrateContext;
893
+ exports.NoHydration = NoHydration;
874
894
  exports.Repeat = Repeat;
875
895
  exports.Show = Show;
876
896
  exports.Switch = Switch;
package/dist/dev.js CHANGED
@@ -1,4 +1,4 @@
1
- import { getContext, createMemo as createMemo$1, flatten, getOwner, createRoot, setContext, untrack, setStrictRead, createLoadBoundary, onCleanup, isDisposed, runWithOwner, createEffect as createEffect$1, createOptimistic as createOptimistic$1, createOptimisticStore as createOptimisticStore$1, createProjection as createProjection$1, createRenderEffect as createRenderEffect$1, createSignal as createSignal$1, createStore as createStore$1, setSnapshotCapture, releaseSnapshotScope, getNextChildId, createErrorBoundary as createErrorBoundary$1, markSnapshotScope, flush, clearSnapshots, peekNextChildId, mapArray, repeat } from '@solidjs/signals';
1
+ import { getContext, createMemo as createMemo$1, flatten, getOwner, createRoot, setContext, untrack, setStrictRead, createLoadBoundary, onCleanup, isDisposed, runWithOwner, createOwner, createEffect as createEffect$1, createOptimistic as createOptimistic$1, createOptimisticStore as createOptimisticStore$1, createProjection as createProjection$1, createRenderEffect as createRenderEffect$1, createSignal as createSignal$1, createStore as createStore$1, setSnapshotCapture, releaseSnapshotScope, getNextChildId, createErrorBoundary as createErrorBoundary$1, markSnapshotScope, flush, clearSnapshots, peekNextChildId, mapArray, repeat } from '@solidjs/signals';
2
2
  export { $PROXY, $TRACK, NotReadyError, action, createOwner, createReaction, createRoot, createTrackedEffect, deep, flatten, flush, getNextChildId, getObserver, getOwner, isEqual, isPending, isRefreshing, isWrappable, latest, mapArray, merge, omit, onCleanup, onSettled, reconcile, refresh, repeat, resolve, runWithOwner, snapshot, storePath, untrack } from '@solidjs/signals';
3
3
 
4
4
  const $DEVCOMP = Symbol("COMPONENT_DEV" );
@@ -59,6 +59,10 @@ function registerGraph(value) {
59
59
  value.graph = owner;
60
60
  }
61
61
 
62
+ const NoHydrateContext = {
63
+ id: Symbol("NoHydrateContext"),
64
+ defaultValue: false
65
+ };
62
66
  const sharedConfig = {
63
67
  hydrating: false,
64
68
  registry: undefined,
@@ -66,6 +70,7 @@ const sharedConfig = {
66
70
  getNextContextId() {
67
71
  const o = getOwner();
68
72
  if (!o) throw new Error(`getNextContextId cannot be used under non-hydrating context`);
73
+ if (getContext(NoHydrateContext)) return undefined;
69
74
  return getNextChildId(o);
70
75
  }
71
76
  };
@@ -585,6 +590,17 @@ function Loading(props) {
585
590
  return createLoadBoundary(() => props.children, () => props.fallback);
586
591
  });
587
592
  }
593
+ function NoHydration(props) {
594
+ const o = createOwner();
595
+ return runWithOwner(o, () => {
596
+ setContext(NoHydrateContext, true);
597
+ if (sharedConfig.hydrating) return undefined;
598
+ return props.children;
599
+ });
600
+ }
601
+ function Hydration(props) {
602
+ return props.children;
603
+ }
588
604
 
589
605
  function createComponent(Comp, props) {
590
606
  return devComponent(Comp, props || {});
@@ -616,6 +632,7 @@ function lazy(fn, moduleUrl) {
616
632
  }) : "");
617
633
  };
618
634
  wrap.preload = () => p || ((p = fn()).then(mod => comp = () => mod.default), p);
635
+ wrap.moduleUrl = moduleUrl;
619
636
  return wrap;
620
637
  }
621
638
  let counter = 0;
@@ -736,4 +753,4 @@ if (globalThis) {
736
753
  if (!globalThis.Solid$$) globalThis.Solid$$ = true;else console.warn("You appear to have multiple instances of Solid. This can lead to unexpected behavior.");
737
754
  }
738
755
 
739
- export { $DEVCOMP, DEV, Errored, For, Loading, Match, Repeat, Show, Switch, children, createComponent, createContext, createEffect, createMemo, createOptimistic, createOptimisticStore, createProjection, createRenderEffect, createSignal, createStore, createUniqueId, enableHydration, lazy, sharedConfig, ssrHandleError, ssrRunInScope, useContext };
756
+ export { $DEVCOMP, DEV, Errored, For, Hydration, Loading, Match, NoHydrateContext, NoHydration, Repeat, Show, Switch, children, createComponent, createContext, createEffect, createMemo, createOptimistic, createOptimisticStore, createProjection, createRenderEffect, createSignal, createStore, createUniqueId, enableHydration, lazy, sharedConfig, ssrHandleError, ssrRunInScope, useContext };
package/dist/server.cjs CHANGED
@@ -2,10 +2,15 @@
2
2
 
3
3
  var signals = require('@solidjs/signals');
4
4
 
5
+ const NoHydrateContext = {
6
+ id: Symbol("NoHydrateContext"),
7
+ defaultValue: false
8
+ };
5
9
  const sharedConfig = {
6
10
  getNextContextId() {
7
11
  const o = signals.getOwner();
8
12
  if (!o) throw new Error(`getNextContextId cannot be used under non-hydrating context`);
13
+ if (signals.getContext(NoHydrateContext)) return undefined;
9
14
  return signals.getNextChildId(o);
10
15
  }
11
16
  };
@@ -158,6 +163,7 @@ function processResult(comp, result, owner, ctx, deferStream, ssrSource) {
158
163
  if (comp.disposed) return;
159
164
  const id = owner.id;
160
165
  const uninitialized = comp.value === undefined;
166
+ const noHydrate = signals.getContext(NoHydrateContext, owner);
161
167
  if (result instanceof Promise) {
162
168
  result.then(v => {
163
169
  result.s = 1;
@@ -166,7 +172,7 @@ function processResult(comp, result, owner, ctx, deferStream, ssrSource) {
166
172
  comp.value = v;
167
173
  comp.error = undefined;
168
174
  }, () => {});
169
- if (ctx?.async && ctx.serialize && id) ctx.serialize(id, result, deferStream);
175
+ if (ctx?.async && ctx.serialize && id && !noHydrate) ctx.serialize(id, result, deferStream);
170
176
  if (uninitialized) {
171
177
  comp.error = new signals.NotReadyError(result);
172
178
  }
@@ -183,7 +189,7 @@ function processResult(comp, result, owner, ctx, deferStream, ssrSource) {
183
189
  comp.value = v.value;
184
190
  comp.error = undefined;
185
191
  }, () => {});
186
- if (ctx?.async && ctx.serialize && id) ctx.serialize(id, promise, deferStream);
192
+ if (ctx?.async && ctx.serialize && id && !noHydrate) ctx.serialize(id, promise, deferStream);
187
193
  if (uninitialized) {
188
194
  comp.error = new signals.NotReadyError(promise);
189
195
  }
@@ -211,7 +217,7 @@ function processResult(comp, result, owner, ctx, deferStream, ssrSource) {
211
217
  }
212
218
  })
213
219
  };
214
- if (ctx?.async && ctx.serialize && id) ctx.serialize(id, tapped, deferStream);
220
+ if (ctx?.async && ctx.serialize && id && !noHydrate) ctx.serialize(id, tapped, deferStream);
215
221
  if (uninitialized) {
216
222
  comp.error = new signals.NotReadyError(firstReady);
217
223
  }
@@ -331,7 +337,7 @@ function createProjection(fn, initialValue = {}, options) {
331
337
  promise.v = state;
332
338
  markReady();
333
339
  }, () => {});
334
- if (ctx?.async && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, promise, options?.deferStream);
340
+ if (ctx?.async && !signals.getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, promise, options?.deferStream);
335
341
  const [pending, markReady] = createPendingProxy(state, promise);
336
342
  return pending;
337
343
  } else {
@@ -388,7 +394,7 @@ function createProjection(fn, initialValue = {}, options) {
388
394
  }
389
395
  })
390
396
  };
391
- if (ctx?.async && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, tapped, options?.deferStream);
397
+ if (ctx?.async && !signals.getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, tapped, options?.deferStream);
392
398
  const [pending, markReady] = createPendingProxy(state, firstReady);
393
399
  return pending;
394
400
  }
@@ -406,7 +412,7 @@ function createProjection(fn, initialValue = {}, options) {
406
412
  promise.v = state;
407
413
  markReady();
408
414
  }, () => {});
409
- if (ctx?.async && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, promise, options?.deferStream);
415
+ if (ctx?.async && !signals.getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, promise, options?.deferStream);
410
416
  const [pending, markReady] = createPendingProxy(state, promise);
411
417
  return pending;
412
418
  }
@@ -434,19 +440,23 @@ function deep(store) {
434
440
  return store;
435
441
  }
436
442
  function mapArray(list, mapFn, options = {}) {
437
- const root = signals.getOwner();
438
- const id = signals.getNextChildId(root);
443
+ const parent = signals.createOwner();
439
444
  return () => {
440
445
  const items = list();
441
446
  let s = [];
442
447
  if (items && items.length) {
443
- for (let i = 0, len = items.length; i < len; i++) {
444
- const o = signals.createOwner({
445
- id: id + i
446
- });
447
- s.push(signals.runWithOwner(o, () => mapFn(() => items[i], () => i)));
448
- }
449
- } else if (options.fallback) s = [options.fallback()];
448
+ signals.runWithOwner(parent, () => {
449
+ for (let i = 0, len = items.length; i < len; i++) {
450
+ const o = signals.createOwner();
451
+ s.push(signals.runWithOwner(o, () => mapFn(() => items[i], () => i)));
452
+ }
453
+ });
454
+ } else if (options.fallback) {
455
+ s = [signals.runWithOwner(parent, () => {
456
+ const fo = signals.createOwner();
457
+ return signals.runWithOwner(fo, () => options.fallback());
458
+ })];
459
+ }
450
460
  return s;
451
461
  };
452
462
  }
@@ -483,13 +493,13 @@ function createErrorBoundary(fn, fallback) {
483
493
  return signals.runWithOwner(owner, () => {
484
494
  let result;
485
495
  signals.setContext(ErrorContext, err => {
486
- if (ctx && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, err);
496
+ if (ctx && !signals.getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, err);
487
497
  result = fallback(err, () => {});
488
498
  });
489
499
  try {
490
500
  result = fn();
491
501
  } catch (err) {
492
- if (ctx && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, err);
502
+ if (ctx && !signals.getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, err);
493
503
  result = fallback(err, () => {});
494
504
  }
495
505
  return () => result;
@@ -590,20 +600,23 @@ function lazy(fn, moduleUrl) {
590
600
  return p;
591
601
  };
592
602
  const wrap = props => {
593
- if (!moduleUrl) {
603
+ const noHydrate = signals.getContext(NoHydrateContext);
604
+ if (!noHydrate && !moduleUrl) {
594
605
  throw new Error("lazy() used in SSR without a moduleUrl. " + "All lazy() components require a moduleUrl for correct hydration. " + "This is typically injected by the bundler plugin.");
595
606
  }
596
- if (!sharedConfig.context?.resolveAssets) {
607
+ if (!noHydrate && !sharedConfig.context?.resolveAssets) {
597
608
  throw new Error(`lazy() called with moduleUrl "${moduleUrl}" but no asset manifest is set. ` + "Pass a manifest option to renderToStream/renderToString.");
598
609
  }
599
610
  load();
600
611
  const ctx = sharedConfig.context;
601
- if (!ctx?.registerAsset || !ctx.resolveAssets) return;
612
+ if (!ctx?.registerAsset || !ctx.resolveAssets || !moduleUrl) return;
602
613
  const assets = ctx.resolveAssets(moduleUrl);
603
614
  if (assets) {
604
615
  for (let i = 0; i < assets.css.length; i++) ctx.registerAsset("style", assets.css[i]);
605
- for (let i = 0; i < assets.js.length; i++) ctx.registerAsset("module", assets.js[i]);
606
- ctx.registerModule?.(moduleUrl, assets.js[0]);
616
+ if (!noHydrate) {
617
+ for (let i = 0; i < assets.js.length; i++) ctx.registerAsset("module", assets.js[i]);
618
+ ctx.registerModule?.(moduleUrl, assets.js[0]);
619
+ }
607
620
  }
608
621
  if (ctx?.async) {
609
622
  ctx.block(p.then(() => {
@@ -616,10 +629,13 @@ function lazy(fn, moduleUrl) {
616
629
  });
617
630
  };
618
631
  wrap.preload = load;
632
+ wrap.moduleUrl = moduleUrl;
619
633
  return wrap;
620
634
  }
621
635
  function createUniqueId() {
622
- return sharedConfig.getNextContextId();
636
+ const o = signals.getOwner();
637
+ if (!o) throw new Error(`createUniqueId cannot be used outside of a reactive context`);
638
+ return signals.getNextChildId(o);
623
639
  }
624
640
 
625
641
  function For(props) {
@@ -766,6 +782,23 @@ function Loading(props) {
766
782
  ctx.serialize(id, "$$f");
767
783
  return signals.runWithOwner(fallbackOwner, () => props.fallback);
768
784
  }
785
+ function NoHydration(props) {
786
+ const o = signals.createOwner();
787
+ return signals.runWithOwner(o, () => {
788
+ signals.setContext(NoHydrateContext, true);
789
+ return props.children;
790
+ });
791
+ }
792
+ function Hydration(props) {
793
+ if (!signals.getContext(NoHydrateContext)) return props.children;
794
+ const o = signals.createOwner({
795
+ id: props.id ?? ""
796
+ });
797
+ return signals.runWithOwner(o, () => {
798
+ signals.setContext(NoHydrateContext, false);
799
+ return props.children;
800
+ });
801
+ }
769
802
 
770
803
  const DEV = undefined;
771
804
 
@@ -837,8 +870,11 @@ exports.$DEVCOMP = $DEVCOMP;
837
870
  exports.DEV = DEV;
838
871
  exports.Errored = Errored;
839
872
  exports.For = For;
873
+ exports.Hydration = Hydration;
840
874
  exports.Loading = Loading;
841
875
  exports.Match = Match;
876
+ exports.NoHydrateContext = NoHydrateContext;
877
+ exports.NoHydration = NoHydration;
842
878
  exports.Repeat = Repeat;
843
879
  exports.Show = Show;
844
880
  exports.Switch = Switch;
package/dist/server.js CHANGED
@@ -1,10 +1,15 @@
1
- import { getOwner, getNextChildId, createOwner, runWithOwner, onCleanup, NotReadyError, isWrappable, setContext, getContext, flatten, createRoot } from '@solidjs/signals';
1
+ import { getOwner, getContext, getNextChildId, createOwner, runWithOwner, onCleanup, NotReadyError, isWrappable, setContext, flatten, createRoot } from '@solidjs/signals';
2
2
  export { $PROXY, $TRACK, NotReadyError, createOwner, createRoot, flatten, getNextChildId, getOwner, isEqual, isWrappable, merge, omit, onCleanup, runWithOwner, snapshot, storePath } from '@solidjs/signals';
3
3
 
4
+ const NoHydrateContext = {
5
+ id: Symbol("NoHydrateContext"),
6
+ defaultValue: false
7
+ };
4
8
  const sharedConfig = {
5
9
  getNextContextId() {
6
10
  const o = getOwner();
7
11
  if (!o) throw new Error(`getNextContextId cannot be used under non-hydrating context`);
12
+ if (getContext(NoHydrateContext)) return undefined;
8
13
  return getNextChildId(o);
9
14
  }
10
15
  };
@@ -157,6 +162,7 @@ function processResult(comp, result, owner, ctx, deferStream, ssrSource) {
157
162
  if (comp.disposed) return;
158
163
  const id = owner.id;
159
164
  const uninitialized = comp.value === undefined;
165
+ const noHydrate = getContext(NoHydrateContext, owner);
160
166
  if (result instanceof Promise) {
161
167
  result.then(v => {
162
168
  result.s = 1;
@@ -165,7 +171,7 @@ function processResult(comp, result, owner, ctx, deferStream, ssrSource) {
165
171
  comp.value = v;
166
172
  comp.error = undefined;
167
173
  }, () => {});
168
- if (ctx?.async && ctx.serialize && id) ctx.serialize(id, result, deferStream);
174
+ if (ctx?.async && ctx.serialize && id && !noHydrate) ctx.serialize(id, result, deferStream);
169
175
  if (uninitialized) {
170
176
  comp.error = new NotReadyError(result);
171
177
  }
@@ -182,7 +188,7 @@ function processResult(comp, result, owner, ctx, deferStream, ssrSource) {
182
188
  comp.value = v.value;
183
189
  comp.error = undefined;
184
190
  }, () => {});
185
- if (ctx?.async && ctx.serialize && id) ctx.serialize(id, promise, deferStream);
191
+ if (ctx?.async && ctx.serialize && id && !noHydrate) ctx.serialize(id, promise, deferStream);
186
192
  if (uninitialized) {
187
193
  comp.error = new NotReadyError(promise);
188
194
  }
@@ -210,7 +216,7 @@ function processResult(comp, result, owner, ctx, deferStream, ssrSource) {
210
216
  }
211
217
  })
212
218
  };
213
- if (ctx?.async && ctx.serialize && id) ctx.serialize(id, tapped, deferStream);
219
+ if (ctx?.async && ctx.serialize && id && !noHydrate) ctx.serialize(id, tapped, deferStream);
214
220
  if (uninitialized) {
215
221
  comp.error = new NotReadyError(firstReady);
216
222
  }
@@ -330,7 +336,7 @@ function createProjection(fn, initialValue = {}, options) {
330
336
  promise.v = state;
331
337
  markReady();
332
338
  }, () => {});
333
- if (ctx?.async && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, promise, options?.deferStream);
339
+ if (ctx?.async && !getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, promise, options?.deferStream);
334
340
  const [pending, markReady] = createPendingProxy(state, promise);
335
341
  return pending;
336
342
  } else {
@@ -387,7 +393,7 @@ function createProjection(fn, initialValue = {}, options) {
387
393
  }
388
394
  })
389
395
  };
390
- if (ctx?.async && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, tapped, options?.deferStream);
396
+ if (ctx?.async && !getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, tapped, options?.deferStream);
391
397
  const [pending, markReady] = createPendingProxy(state, firstReady);
392
398
  return pending;
393
399
  }
@@ -405,7 +411,7 @@ function createProjection(fn, initialValue = {}, options) {
405
411
  promise.v = state;
406
412
  markReady();
407
413
  }, () => {});
408
- if (ctx?.async && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, promise, options?.deferStream);
414
+ if (ctx?.async && !getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, promise, options?.deferStream);
409
415
  const [pending, markReady] = createPendingProxy(state, promise);
410
416
  return pending;
411
417
  }
@@ -433,19 +439,23 @@ function deep(store) {
433
439
  return store;
434
440
  }
435
441
  function mapArray(list, mapFn, options = {}) {
436
- const root = getOwner();
437
- const id = getNextChildId(root);
442
+ const parent = createOwner();
438
443
  return () => {
439
444
  const items = list();
440
445
  let s = [];
441
446
  if (items && items.length) {
442
- for (let i = 0, len = items.length; i < len; i++) {
443
- const o = createOwner({
444
- id: id + i
445
- });
446
- s.push(runWithOwner(o, () => mapFn(() => items[i], () => i)));
447
- }
448
- } else if (options.fallback) s = [options.fallback()];
447
+ runWithOwner(parent, () => {
448
+ for (let i = 0, len = items.length; i < len; i++) {
449
+ const o = createOwner();
450
+ s.push(runWithOwner(o, () => mapFn(() => items[i], () => i)));
451
+ }
452
+ });
453
+ } else if (options.fallback) {
454
+ s = [runWithOwner(parent, () => {
455
+ const fo = createOwner();
456
+ return runWithOwner(fo, () => options.fallback());
457
+ })];
458
+ }
449
459
  return s;
450
460
  };
451
461
  }
@@ -482,13 +492,13 @@ function createErrorBoundary(fn, fallback) {
482
492
  return runWithOwner(owner, () => {
483
493
  let result;
484
494
  setContext(ErrorContext, err => {
485
- if (ctx && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, err);
495
+ if (ctx && !getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, err);
486
496
  result = fallback(err, () => {});
487
497
  });
488
498
  try {
489
499
  result = fn();
490
500
  } catch (err) {
491
- if (ctx && !ctx.noHydrate && owner.id) ctx.serialize(owner.id, err);
501
+ if (ctx && !getContext(NoHydrateContext) && owner.id) ctx.serialize(owner.id, err);
492
502
  result = fallback(err, () => {});
493
503
  }
494
504
  return () => result;
@@ -589,20 +599,23 @@ function lazy(fn, moduleUrl) {
589
599
  return p;
590
600
  };
591
601
  const wrap = props => {
592
- if (!moduleUrl) {
602
+ const noHydrate = getContext(NoHydrateContext);
603
+ if (!noHydrate && !moduleUrl) {
593
604
  throw new Error("lazy() used in SSR without a moduleUrl. " + "All lazy() components require a moduleUrl for correct hydration. " + "This is typically injected by the bundler plugin.");
594
605
  }
595
- if (!sharedConfig.context?.resolveAssets) {
606
+ if (!noHydrate && !sharedConfig.context?.resolveAssets) {
596
607
  throw new Error(`lazy() called with moduleUrl "${moduleUrl}" but no asset manifest is set. ` + "Pass a manifest option to renderToStream/renderToString.");
597
608
  }
598
609
  load();
599
610
  const ctx = sharedConfig.context;
600
- if (!ctx?.registerAsset || !ctx.resolveAssets) return;
611
+ if (!ctx?.registerAsset || !ctx.resolveAssets || !moduleUrl) return;
601
612
  const assets = ctx.resolveAssets(moduleUrl);
602
613
  if (assets) {
603
614
  for (let i = 0; i < assets.css.length; i++) ctx.registerAsset("style", assets.css[i]);
604
- for (let i = 0; i < assets.js.length; i++) ctx.registerAsset("module", assets.js[i]);
605
- ctx.registerModule?.(moduleUrl, assets.js[0]);
615
+ if (!noHydrate) {
616
+ for (let i = 0; i < assets.js.length; i++) ctx.registerAsset("module", assets.js[i]);
617
+ ctx.registerModule?.(moduleUrl, assets.js[0]);
618
+ }
606
619
  }
607
620
  if (ctx?.async) {
608
621
  ctx.block(p.then(() => {
@@ -615,10 +628,13 @@ function lazy(fn, moduleUrl) {
615
628
  });
616
629
  };
617
630
  wrap.preload = load;
631
+ wrap.moduleUrl = moduleUrl;
618
632
  return wrap;
619
633
  }
620
634
  function createUniqueId() {
621
- return sharedConfig.getNextContextId();
635
+ const o = getOwner();
636
+ if (!o) throw new Error(`createUniqueId cannot be used outside of a reactive context`);
637
+ return getNextChildId(o);
622
638
  }
623
639
 
624
640
  function For(props) {
@@ -765,7 +781,24 @@ function Loading(props) {
765
781
  ctx.serialize(id, "$$f");
766
782
  return runWithOwner(fallbackOwner, () => props.fallback);
767
783
  }
784
+ function NoHydration(props) {
785
+ const o = createOwner();
786
+ return runWithOwner(o, () => {
787
+ setContext(NoHydrateContext, true);
788
+ return props.children;
789
+ });
790
+ }
791
+ function Hydration(props) {
792
+ if (!getContext(NoHydrateContext)) return props.children;
793
+ const o = createOwner({
794
+ id: props.id ?? ""
795
+ });
796
+ return runWithOwner(o, () => {
797
+ setContext(NoHydrateContext, false);
798
+ return props.children;
799
+ });
800
+ }
768
801
 
769
802
  const DEV = undefined;
770
803
 
771
- export { $DEVCOMP, DEV, Errored, For, Loading, Match, Repeat, Show, Switch, action, children, createComponent, createContext, createDeepProxy, createEffect, createMemo, createOptimistic, createOptimisticStore, createProjection, createReaction, createRenderEffect, createSignal, createStore, createTrackedEffect, createUniqueId, deep, enableHydration, flush, getObserver, isPending, isRefreshing, latest, lazy, mapArray, onSettled, reconcile, refresh, repeat, resolve, sharedConfig, ssrHandleError, ssrRunInScope, untrack, useContext };
804
+ export { $DEVCOMP, DEV, Errored, For, Hydration, Loading, Match, NoHydrateContext, NoHydration, Repeat, Show, Switch, action, children, createComponent, createContext, createDeepProxy, createEffect, createMemo, createOptimistic, createOptimisticStore, createProjection, createReaction, createRenderEffect, createSignal, createStore, createTrackedEffect, createUniqueId, deep, enableHydration, flush, getObserver, isPending, isRefreshing, latest, lazy, mapArray, onSettled, reconcile, refresh, repeat, resolve, sharedConfig, ssrHandleError, ssrRunInScope, untrack, useContext };
package/dist/solid.cjs CHANGED
@@ -32,6 +32,10 @@ function children(fn) {
32
32
  return memo;
33
33
  }
34
34
 
35
+ const NoHydrateContext = {
36
+ id: Symbol("NoHydrateContext"),
37
+ defaultValue: false
38
+ };
35
39
  const sharedConfig = {
36
40
  hydrating: false,
37
41
  registry: undefined,
@@ -39,6 +43,7 @@ const sharedConfig = {
39
43
  getNextContextId() {
40
44
  const o = signals.getOwner();
41
45
  if (!o) throw new Error(`getNextContextId cannot be used under non-hydrating context`);
46
+ if (signals.getContext(NoHydrateContext)) return undefined;
42
47
  return signals.getNextChildId(o);
43
48
  }
44
49
  };
@@ -557,6 +562,17 @@ function Loading(props) {
557
562
  return signals.createLoadBoundary(() => props.children, () => props.fallback);
558
563
  });
559
564
  }
565
+ function NoHydration(props) {
566
+ const o = signals.createOwner();
567
+ return signals.runWithOwner(o, () => {
568
+ signals.setContext(NoHydrateContext, true);
569
+ if (sharedConfig.hydrating) return undefined;
570
+ return props.children;
571
+ });
572
+ }
573
+ function Hydration(props) {
574
+ return props.children;
575
+ }
560
576
 
561
577
  function createComponent(Comp, props) {
562
578
  return signals.untrack(() => Comp(props || {}));
@@ -585,6 +601,7 @@ function lazy(fn, moduleUrl) {
585
601
  }) : "");
586
602
  };
587
603
  wrap.preload = () => p || ((p = fn()).then(mod => comp = () => mod.default), p);
604
+ wrap.moduleUrl = moduleUrl;
588
605
  return wrap;
589
606
  }
590
607
  let counter = 0;
@@ -813,8 +830,11 @@ exports.$DEVCOMP = $DEVCOMP;
813
830
  exports.DEV = DEV;
814
831
  exports.Errored = Errored;
815
832
  exports.For = For;
833
+ exports.Hydration = Hydration;
816
834
  exports.Loading = Loading;
817
835
  exports.Match = Match;
836
+ exports.NoHydrateContext = NoHydrateContext;
837
+ exports.NoHydration = NoHydration;
818
838
  exports.Repeat = Repeat;
819
839
  exports.Show = Show;
820
840
  exports.Switch = Switch;
package/dist/solid.js CHANGED
@@ -1,4 +1,4 @@
1
- import { getContext, createMemo as createMemo$1, flatten, createRoot, setContext, createLoadBoundary, getOwner, onCleanup, isDisposed, runWithOwner, createEffect as createEffect$1, createOptimistic as createOptimistic$1, createOptimisticStore as createOptimisticStore$1, createProjection as createProjection$1, createRenderEffect as createRenderEffect$1, createSignal as createSignal$1, createStore as createStore$1, setSnapshotCapture, releaseSnapshotScope, getNextChildId, createErrorBoundary as createErrorBoundary$1, markSnapshotScope, flush, clearSnapshots, peekNextChildId, untrack, mapArray, repeat } from '@solidjs/signals';
1
+ import { getContext, createMemo as createMemo$1, flatten, createRoot, setContext, createLoadBoundary, getOwner, onCleanup, isDisposed, runWithOwner, createOwner, createEffect as createEffect$1, createOptimistic as createOptimistic$1, createOptimisticStore as createOptimisticStore$1, createProjection as createProjection$1, createRenderEffect as createRenderEffect$1, createSignal as createSignal$1, createStore as createStore$1, setSnapshotCapture, releaseSnapshotScope, getNextChildId, createErrorBoundary as createErrorBoundary$1, markSnapshotScope, flush, clearSnapshots, peekNextChildId, untrack, mapArray, repeat } from '@solidjs/signals';
2
2
  export { $PROXY, $TRACK, NotReadyError, action, createOwner, createReaction, createRoot, createTrackedEffect, deep, flatten, flush, getNextChildId, getObserver, getOwner, isEqual, isPending, isRefreshing, isWrappable, latest, mapArray, merge, omit, onCleanup, onSettled, reconcile, refresh, repeat, resolve, runWithOwner, snapshot, storePath, untrack } from '@solidjs/signals';
3
3
 
4
4
  const $DEVCOMP = Symbol(0);
@@ -31,6 +31,10 @@ function children(fn) {
31
31
  return memo;
32
32
  }
33
33
 
34
+ const NoHydrateContext = {
35
+ id: Symbol("NoHydrateContext"),
36
+ defaultValue: false
37
+ };
34
38
  const sharedConfig = {
35
39
  hydrating: false,
36
40
  registry: undefined,
@@ -38,6 +42,7 @@ const sharedConfig = {
38
42
  getNextContextId() {
39
43
  const o = getOwner();
40
44
  if (!o) throw new Error(`getNextContextId cannot be used under non-hydrating context`);
45
+ if (getContext(NoHydrateContext)) return undefined;
41
46
  return getNextChildId(o);
42
47
  }
43
48
  };
@@ -556,6 +561,17 @@ function Loading(props) {
556
561
  return createLoadBoundary(() => props.children, () => props.fallback);
557
562
  });
558
563
  }
564
+ function NoHydration(props) {
565
+ const o = createOwner();
566
+ return runWithOwner(o, () => {
567
+ setContext(NoHydrateContext, true);
568
+ if (sharedConfig.hydrating) return undefined;
569
+ return props.children;
570
+ });
571
+ }
572
+ function Hydration(props) {
573
+ return props.children;
574
+ }
559
575
 
560
576
  function createComponent(Comp, props) {
561
577
  return untrack(() => Comp(props || {}));
@@ -584,6 +600,7 @@ function lazy(fn, moduleUrl) {
584
600
  }) : "");
585
601
  };
586
602
  wrap.preload = () => p || ((p = fn()).then(mod => comp = () => mod.default), p);
603
+ wrap.moduleUrl = moduleUrl;
587
604
  return wrap;
588
605
  }
589
606
  let counter = 0;
@@ -680,4 +697,4 @@ function ssrHandleError() {}
680
697
  function ssrRunInScope() {}
681
698
  const DEV = undefined;
682
699
 
683
- export { $DEVCOMP, DEV, Errored, For, Loading, Match, Repeat, Show, Switch, children, createComponent, createContext, createEffect, createMemo, createOptimistic, createOptimisticStore, createProjection, createRenderEffect, createSignal, createStore, createUniqueId, enableHydration, lazy, sharedConfig, ssrHandleError, ssrRunInScope, useContext };
700
+ export { $DEVCOMP, DEV, Errored, For, Hydration, Loading, Match, NoHydrateContext, NoHydration, Repeat, Show, Switch, children, createComponent, createContext, createEffect, createMemo, createOptimistic, createOptimisticStore, createProjection, createRenderEffect, createSignal, createStore, createUniqueId, enableHydration, lazy, sharedConfig, ssrHandleError, ssrRunInScope, useContext };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "solid-js",
3
3
  "description": "A declarative JavaScript library for building user interfaces.",
4
- "version": "2.0.0-beta.0",
4
+ "version": "2.0.0-beta.1",
5
5
  "author": "Ryan Carniato",
6
6
  "license": "MIT",
7
7
  "homepage": "https://solidjs.com",
@@ -79,7 +79,7 @@
79
79
  "performance"
80
80
  ],
81
81
  "dependencies": {
82
- "@solidjs/signals": "^0.11.1",
82
+ "@solidjs/signals": "^0.11.3",
83
83
  "csstype": "^3.1.0",
84
84
  "seroval": "~1.5.0",
85
85
  "seroval-plugins": "~1.5.0"
@@ -70,5 +70,6 @@ export declare function lazy<T extends Component<any>>(fn: () => Promise<{
70
70
  preload: () => Promise<{
71
71
  default: T;
72
72
  }>;
73
+ moduleUrl?: string;
73
74
  };
74
75
  export declare function createUniqueId(): string;
@@ -1,4 +1,4 @@
1
- import { createErrorBoundary as coreErrorBoundary, createMemo as coreMemo, createSignal as coreSignal, createOptimistic as coreOptimistic, createRenderEffect as coreRenderEffect, createEffect as coreEffect, type ProjectionOptions, type Store, type StoreSetter } from "@solidjs/signals";
1
+ import { createErrorBoundary as coreErrorBoundary, createMemo as coreMemo, createSignal as coreSignal, createOptimistic as coreOptimistic, createRenderEffect as coreRenderEffect, createEffect as coreEffect, type ProjectionOptions, type Store, type StoreSetter, type Context } from "@solidjs/signals";
2
2
  import { JSX } from "../jsx.js";
3
3
  declare module "@solidjs/signals" {
4
4
  interface MemoOptions<T> {
@@ -18,6 +18,7 @@ export type HydrationProjectionOptions = ProjectionOptions & {
18
18
  ssrSource?: "server" | "hybrid" | "initial" | "client";
19
19
  };
20
20
  export type HydrationContext = {};
21
+ export declare const NoHydrateContext: Context<boolean>;
21
22
  type SharedConfig = {
22
23
  hydrating: boolean;
23
24
  resources?: {
@@ -73,4 +74,19 @@ export declare function Loading(props: {
73
74
  fallback?: JSX.Element;
74
75
  children: JSX.Element;
75
76
  }): JSX.Element;
77
+ /**
78
+ * Disables hydration for its children on the client.
79
+ * During hydration, skips the subtree entirely (returns undefined so DOM is left untouched).
80
+ * After hydration, renders children fresh.
81
+ */
82
+ export declare function NoHydration(props: {
83
+ children: JSX.Element;
84
+ }): JSX.Element;
85
+ /**
86
+ * Re-enables hydration within a NoHydration zone (passthrough on client).
87
+ */
88
+ export declare function Hydration(props: {
89
+ id?: string;
90
+ children: JSX.Element;
91
+ }): JSX.Element;
76
92
  export {};
package/types/index.d.ts CHANGED
@@ -4,7 +4,7 @@ export { $DEVCOMP, children, createContext, useContext } from "./client/core.js"
4
4
  export type { ChildrenReturn, Context, ContextProviderComponent, ResolvedChildren, ResolvedJSXElement } from "./client/core.js";
5
5
  export * from "./client/component.js";
6
6
  export * from "./client/flow.js";
7
- export { sharedConfig, Loading, enableHydration, createMemo, createSignal, createStore, createProjection, createOptimistic, createOptimisticStore, createRenderEffect, createEffect } from "./client/hydration.js";
7
+ export { sharedConfig, Loading, enableHydration, createMemo, createSignal, createStore, createProjection, createOptimistic, createOptimisticStore, createRenderEffect, createEffect, NoHydration, Hydration, NoHydrateContext } from "./client/hydration.js";
8
8
  export declare function ssrHandleError(): void;
9
9
  export declare function ssrRunInScope(): void;
10
10
  import type { JSX } from "./jsx.js";
@@ -62,5 +62,6 @@ export declare function lazy<T extends Component<any>>(fn: () => Promise<{
62
62
  preload: () => Promise<{
63
63
  default: T;
64
64
  }>;
65
+ moduleUrl?: string;
65
66
  };
66
67
  export declare function createUniqueId(): string;
@@ -1,6 +1,6 @@
1
1
  import type { JSX } from "../jsx.js";
2
- export { sharedConfig } from "./shared.js";
3
- export type { HydrationContext } from "./shared.js";
2
+ export { sharedConfig, NoHydrateContext } from "./shared.js";
3
+ export type { HydrationContext, SSRTemplateObject } from "./shared.js";
4
4
  /**
5
5
  * Handles errors during SSR rendering.
6
6
  * Returns the promise source for NotReadyError (for async handling),
@@ -19,3 +19,20 @@ export declare function Loading(props: {
19
19
  fallback?: JSX.Element;
20
20
  children: JSX.Element;
21
21
  }): JSX.Element;
22
+ /**
23
+ * Disables hydration for its children during SSR.
24
+ * Elements inside will not receive hydration keys (`_hk`) and signals will not be serialized.
25
+ * Use `Hydration` to re-enable hydration within a `NoHydration` zone.
26
+ */
27
+ export declare function NoHydration(props: {
28
+ children: JSX.Element;
29
+ }): JSX.Element;
30
+ /**
31
+ * Re-enables hydration within a `NoHydration` zone, establishing a new ID namespace.
32
+ * Pass an `id` prop matching the client's `hydrate({ renderId })` to align hydration keys.
33
+ * Has no effect when not inside a `NoHydration` zone (passthrough).
34
+ */
35
+ export declare function Hydration(props: {
36
+ id?: string;
37
+ children: JSX.Element;
38
+ }): JSX.Element;
@@ -4,7 +4,7 @@ export { $DEVCOMP, children, createContext, useContext, ssrRunInScope } from "./
4
4
  export type { ChildrenReturn, Context, ContextProviderComponent, ResolvedChildren, ResolvedJSXElement } from "./core.js";
5
5
  export * from "./component.js";
6
6
  export * from "./flow.js";
7
- export { sharedConfig, Loading, ssrHandleError } from "./hydration.js";
7
+ export { sharedConfig, Loading, ssrHandleError, NoHydration, Hydration, NoHydrateContext } from "./hydration.js";
8
8
  export type { HydrationContext } from "./hydration.js";
9
9
  import type { JSX } from "../jsx.js";
10
10
  type JSXElement = JSX.Element;
@@ -1,4 +1,5 @@
1
- type SSRTemplateObject = {
1
+ import type { Context } from "@solidjs/signals";
2
+ export type SSRTemplateObject = {
2
3
  t: string[];
3
4
  h: Function[];
4
5
  p: Promise<any>[];
@@ -35,11 +36,11 @@ export type HydrationContext = {
35
36
  assets: any[];
36
37
  /** True only in renderToStream — enables async data serialization and streaming. */
37
38
  async?: boolean;
38
- noHydrate: boolean;
39
39
  };
40
+ export declare const NoHydrateContext: Context<boolean>;
40
41
  type SharedConfig = {
41
42
  context?: HydrationContext;
42
- getNextContextId(): string;
43
+ getNextContextId(): string | undefined;
43
44
  };
44
45
  export declare const sharedConfig: SharedConfig;
45
46
  export {};
@@ -3,6 +3,7 @@ export { flatten } from "@solidjs/signals";
3
3
  export { snapshot, merge, omit, storePath, $PROXY, $TRACK } from "@solidjs/signals";
4
4
  export type { Accessor, ComputeFunction, EffectFunction, EffectBundle, EffectOptions, MemoOptions, NoInfer, SignalOptions, Setter, Signal, Owner, Maybe, Store, StoreSetter, StoreNode, NotWrappable, SolidStore, Merge, Omit, Context, ContextRecord, IQueue, StorePathRange, ArrayFilterFn, CustomPartial, Part, PathSetter } from "@solidjs/signals";
5
5
  import type { Accessor, ComputeFunction, EffectFunction, EffectBundle, EffectOptions, MemoOptions, SignalOptions, Signal, Owner, Store, StoreSetter, Context } from "@solidjs/signals";
6
+ import { NoHydrateContext } from "./shared.js";
6
7
  interface ServerComputation<T = any> {
7
8
  owner: Owner;
8
9
  value: T;
@@ -46,6 +47,7 @@ export declare function repeat<T>(count: Accessor<number>, mapFn: (i: number) =>
46
47
  }): () => T[];
47
48
  declare const ErrorContext: Context<((err: any) => void) | null>;
48
49
  export { ErrorContext };
50
+ export { NoHydrateContext };
49
51
  export declare function createErrorBoundary<U>(fn: () => any, fallback: (error: unknown, reset: () => void) => U): () => unknown;
50
52
  export declare function createLoadBoundary(fn: () => any, fallback: () => any): () => unknown;
51
53
  export declare function untrack<T>(fn: () => T): T;