solid-js 1.2.6 → 1.3.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.
@@ -1,4 +1,4 @@
1
- import { sharedConfig, awaitSuspense, splitProps } from 'solid-js';
1
+ import { sharedConfig, splitProps } from 'solid-js';
2
2
  export { ErrorBoundary, For, Index, Match, Show, Suspense, SuspenseList, Switch, createComponent, mergeProps } from 'solid-js';
3
3
 
4
4
  const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "controls", "default", "disabled", "formnovalidate", "hidden", "indeterminate", "ismap", "loop", "multiple", "muted", "nomodule", "novalidate", "open", "playsinline", "readonly", "required", "reversed", "seamless", "selected"];
@@ -229,111 +229,205 @@ function stringifyString(str) {
229
229
  return result;
230
230
  }
231
231
 
232
+ const REPLACE_SCRIPT = `function $df(e,y,t){t=document.getElementById(e),document.getElementById("pl"+e).replaceWith(...t.childNodes),_$HY.set(e,y)}`;
233
+ const FRAGMENT_REPLACE = /<!\[([\d.]+)\]>/;
232
234
  function renderToString(code, options = {}) {
233
- sharedConfig.context = Object.assign({
235
+ let scripts = "";
236
+ sharedConfig.context = {
234
237
  id: "",
235
238
  count: 0,
236
- assets: []
237
- }, options);
238
- let html = resolveSSRNode(escape(code()));
239
- return injectAssets(sharedConfig.context.assets, html);
239
+ suspense: {},
240
+ assets: [],
241
+ nonce: options.nonce,
242
+ writeResource(id, p, error) {
243
+ if (error) scripts += `_$HY.set("${id}", ${serializeError(p)});`;
244
+ }
245
+ };
246
+ let html = injectAssets(sharedConfig.context.assets, resolveSSRNode(escape(code())));
247
+ if (scripts.length) html = injectScripts(html, scripts, options.nonce);
248
+ return html;
240
249
  }
241
250
  function renderToStringAsync(code, options = {}) {
242
- options = {
243
- timeoutMs: 30000,
244
- ...options
245
- };
246
- const context = sharedConfig.context = Object.assign({
251
+ const {
252
+ nonce,
253
+ timeoutMs = 30000
254
+ } = options;
255
+ const context = sharedConfig.context = {
247
256
  id: "",
248
257
  count: 0,
249
258
  resources: {},
250
259
  suspense: {},
251
260
  assets: [],
252
- async: true
253
- }, options);
254
- const timeout = new Promise((_, reject) => setTimeout(() => reject("renderToString timed out"), options.timeoutMs));
255
- return Promise.race([awaitSuspense(() => escape(code())), timeout]).then(res => {
256
- let html = resolveSSRNode(res);
257
- return injectAssets(context.assets, html);
261
+ async: true,
262
+ nonce
263
+ };
264
+ let scripts = "";
265
+ sharedConfig.context.writeResource = (id, p, error) => {
266
+ if (error) return scripts += `_$HY.set("${id}", ${serializeError(p)});`;
267
+ p.then(d => scripts += `_$HY.set("${id}", ${devalue(d)});`).catch(() => scripts += `_$HY.set("${id}", null);`);
268
+ };
269
+ const timeout = new Promise((_, reject) => setTimeout(() => reject("renderToString timed out"), timeoutMs));
270
+ function asyncWrap(fn) {
271
+ return new Promise(resolve => {
272
+ const registry = new Set();
273
+ const cache = Object.create(null);
274
+ sharedConfig.context.registerFragment = register;
275
+ const rendered = fn();
276
+ if (!registry.size) resolve(rendered);
277
+ function register(key) {
278
+ registry.add(key);
279
+ return (value = "", error) => {
280
+ cache[key] = value;
281
+ registry.delete(key);
282
+ if (error) return scripts += `_$HY.set("${key}", Promise.resolve(${serializeError(error)}));`;
283
+ if (!registry.size) Promise.resolve().then(() => {
284
+ let source = resolveSSRNode(rendered);
285
+ let final = "";
286
+ let match;
287
+ while (match = source.match(FRAGMENT_REPLACE)) {
288
+ final += source.substring(0, match.index);
289
+ source = cache[match[1]] + source.substring(match.index + match[0].length);
290
+ }
291
+ resolve(final + source);
292
+ });
293
+ return true;
294
+ };
295
+ }
296
+ });
297
+ }
298
+ return Promise.race([asyncWrap(() => escape(code())), timeout]).then(res => {
299
+ let html = injectAssets(context.assets, resolveSSRNode(res));
300
+ if (scripts.length) html = injectScripts(html, scripts, nonce);
301
+ return html;
258
302
  });
259
303
  }
260
- function pipeToNodeWritable(code, writable, options = {}) {
304
+ function renderToPipeableStream(code, options = {}) {
261
305
  const {
262
306
  nonce,
263
- onReady = ({
264
- startWriting
265
- }) => startWriting(),
266
- onComplete
307
+ onCompleteShell,
308
+ onCompleteAll,
309
+ dataOnly
267
310
  } = options;
268
311
  const tmp = [];
269
- let count = 0,
270
- completed = 0,
271
- buffer = {
272
- write(payload) {
273
- tmp.push(payload);
312
+ const tasks = [];
313
+ const registry = new Map();
314
+ const checkEnd = () => {
315
+ if (!registry.size && !completed) {
316
+ onCompleteAll && onCompleteAll(result);
317
+ writable && writable.end();
318
+ completed = true;
274
319
  }
275
320
  };
276
- const result = {
277
- startWriting() {
278
- buffer = writable;
279
- tmp.forEach(chunk => buffer.write(chunk));
280
- setTimeout(checkEnd);
281
- },
282
- write(c) {
283
- writable.write(c);
284
- },
285
- abort() {
286
- completed = count;
287
- checkEnd();
321
+ const writeInitialScript = () => {
322
+ if (tasks.length && !completed) {
323
+ buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>${tasks.join(";")}</script>`);
324
+ tasks.length = 0;
288
325
  }
326
+ scheduled = false;
289
327
  };
290
- const checkEnd = () => {
291
- if (completed === count) {
292
- onComplete && onComplete(result);
293
- writable.end();
328
+ let writable;
329
+ let completed = false;
330
+ let scriptFlushed = false;
331
+ let scheduled = true;
332
+ let buffer = {
333
+ write(payload) {
334
+ tmp.push(payload);
294
335
  }
295
336
  };
296
- sharedConfig.context = Object.assign({
337
+ sharedConfig.context = {
297
338
  id: "",
298
339
  count: 0,
340
+ async: true,
299
341
  streaming: true,
342
+ dataOnly,
343
+ resources: {},
300
344
  suspense: {},
301
- assets: []
302
- }, options);
303
- sharedConfig.context.writeResource = (id, p) => {
304
- count++;
305
- Promise.resolve().then(() => buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HYDRATION.startResource("${id}")</script>`));
306
- p.then(d => {
307
- buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HYDRATION.resolveResource("${id}", ${devalue(d)})</script>`);
308
- ++completed && checkEnd();
309
- });
345
+ assets: [],
346
+ nonce,
347
+ writeResource(id, p, error) {
348
+ if (!scheduled) {
349
+ Promise.resolve().then(writeInitialScript);
350
+ scheduled = true;
351
+ }
352
+ if (error) return tasks.push(`_$HY.set("${id}", ${serializeError(p)})`);
353
+ tasks.push(`_$HY.init("${id}")`);
354
+ p.then(d => {
355
+ !completed && buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HY.set("${id}", ${devalue(d)})</script>`);
356
+ }).catch(() => {
357
+ !completed && buffer.write(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HY.set("${id}", null)</script>`);
358
+ });
359
+ },
360
+ registerFragment(key) {
361
+ registry.set(key, []);
362
+ if (!dataOnly) {
363
+ if (!scheduled) {
364
+ Promise.resolve().then(writeInitialScript);
365
+ scheduled = true;
366
+ }
367
+ tasks.push(`_$HY.init("${key}")`);
368
+ }
369
+ return (value, error) => {
370
+ const keys = registry.get(key);
371
+ registry.delete(key);
372
+ if (waitForFragments(registry, key)) return;
373
+ if ((value !== undefined || error) && !completed) {
374
+ buffer.write(`<div hidden id="${key}">${value !== undefined ? value : " "}</div><script${nonce ? ` nonce="${nonce}"` : ""}>${!scriptFlushed ? REPLACE_SCRIPT : ""}${keys.length ? keys.map(k => `_$HY.unset("${k}");`) : ""}$df("${key}"${error ? "," + serializeError(error) : ""})</script>`);
375
+ scriptFlushed = true;
376
+ }
377
+ checkEnd();
378
+ return true;
379
+ };
380
+ }
310
381
  };
311
382
  let html = resolveSSRNode(escape(code()));
312
383
  html = injectAssets(sharedConfig.context.assets, html);
313
- buffer.write(html);
314
- onReady(result);
384
+ Promise.resolve().then(() => {
385
+ if (tasks.length) html = injectScripts(html, tasks.join(";"), nonce);
386
+ buffer.write(html);
387
+ tasks.length = 0;
388
+ scheduled = false;
389
+ onCompleteShell && onCompleteShell();
390
+ });
391
+ return {
392
+ pipe(w) {
393
+ buffer = writable = w;
394
+ tmp.forEach(chunk => buffer.write(chunk));
395
+ if (completed) writable.end();else setTimeout(checkEnd);
396
+ }
397
+ };
315
398
  }
316
399
  function pipeToWritable(code, writable, options = {}) {
317
400
  const {
318
401
  nonce,
319
- onReady = ({
402
+ onCompleteShell = ({
320
403
  startWriting
321
404
  }) => startWriting(),
322
- onComplete
405
+ onCompleteAll,
406
+ dataOnly
323
407
  } = options;
324
408
  const tmp = [];
409
+ const tasks = [];
325
410
  const writer = writable.getWriter();
326
411
  const encoder = new TextEncoder();
327
- sharedConfig.context = Object.assign({
328
- id: "",
329
- count: 0,
330
- streaming: true,
331
- suspense: {},
332
- assets: []
333
- }, options);
334
- let count = 0,
335
- completed = 0,
336
- buffer = {
412
+ const registry = new Map();
413
+ const checkEnd = () => {
414
+ if (!registry.size && !completed) {
415
+ onCompleteAll && onCompleteAll(result);
416
+ writable && writable.close();
417
+ completed = true;
418
+ }
419
+ };
420
+ const writeInitialScript = () => {
421
+ if (tasks.length) {
422
+ buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>${tasks.join(";")}</script>`));
423
+ tasks.length = 0;
424
+ }
425
+ scheduled = false;
426
+ };
427
+ let completed = false;
428
+ let scriptFlushed = false;
429
+ let scheduled = true;
430
+ let buffer = {
337
431
  write(payload) {
338
432
  tmp.push(payload);
339
433
  }
@@ -348,28 +442,67 @@ function pipeToWritable(code, writable, options = {}) {
348
442
  writer.write(encoder.encode(c));
349
443
  },
350
444
  abort() {
351
- completed = count;
445
+ registry.clear();
352
446
  checkEnd();
353
447
  }
354
448
  };
355
- const checkEnd = () => {
356
- if (completed === count) {
357
- onComplete && onComplete(result);
358
- writable.close();
449
+ sharedConfig.context = {
450
+ id: "",
451
+ count: 0,
452
+ async: true,
453
+ streaming: true,
454
+ dataOnly,
455
+ resources: {},
456
+ suspense: {},
457
+ assets: [],
458
+ nonce,
459
+ writeResource(id, p, error) {
460
+ if (!scheduled) {
461
+ Promise.resolve().then(writeInitialScript);
462
+ scheduled = true;
463
+ }
464
+ if (error) return tasks.push(`_$HY.set("${id}", ${serializeError(p)})`);
465
+ tasks.push(`_$HY.init("${id}")`);
466
+ p.then(d => {
467
+ !completed && buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HY.set("${id}", ${devalue(d)})</script>`));
468
+ }).catch(() => {
469
+ !completed && buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HY.set("${id}", null)</script>`));
470
+ });
471
+ },
472
+ registerFragment(key) {
473
+ registry.set(key, []);
474
+ if (!dataOnly) {
475
+ if (!scheduled) {
476
+ Promise.resolve().then(writeInitialScript);
477
+ scheduled = true;
478
+ }
479
+ tasks.push(`_$HY.init("${key}")`);
480
+ }
481
+ return (value, error) => {
482
+ const keys = registry.get(key);
483
+ registry.delete(key);
484
+ if (waitForFragments(registry, key)) return;
485
+ if ((value !== undefined || error) && !completed) {
486
+ buffer.write(encoder.encode(`<div hidden id="${key}">${value !== undefined ? value : " "}</div><script${nonce ? ` nonce="${nonce}"` : ""}>${!scriptFlushed ? REPLACE_SCRIPT : ""}${keys.length ? keys.map(k => `_$HY.unset("${k}");`) : ""}$df("${key}"${error ? "," + serializeError(error) : ""})</script>`));
487
+ scriptFlushed = true;
488
+ }
489
+ checkEnd();
490
+ return true;
491
+ };
359
492
  }
360
493
  };
361
- sharedConfig.context.writeResource = (id, p) => {
362
- count++;
363
- Promise.resolve().then(() => buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HYDRATION.startResource("${id}")</script>`)));
364
- p.then(d => {
365
- buffer.write(encoder.encode(`<script${nonce ? ` nonce="${nonce}"` : ""}>_$HYDRATION.resolveResource("${id}", ${devalue(d)})</script>`));
366
- ++completed && checkEnd();
367
- });
368
- };
369
494
  let html = resolveSSRNode(escape(code()));
370
495
  html = injectAssets(sharedConfig.context.assets, html);
371
- buffer.write(encoder.encode(html));
372
- onReady(result);
496
+ Promise.resolve().then(() => {
497
+ if (tasks.length) html = injectScripts(html, tasks.join(";"), nonce);
498
+ buffer.write(encoder.encode(html));
499
+ tasks.length = 0;
500
+ scheduled = false;
501
+ onCompleteShell && onCompleteShell(result);
502
+ });
503
+ }
504
+ function pipeToNodeWritable(code, writable, options = {}) {
505
+ renderToPipeableStream(code, options).pipe(writable);
373
506
  }
374
507
  function Assets(props) {
375
508
  sharedConfig.context.assets.push(() => NoHydration({
@@ -379,15 +512,21 @@ function Assets(props) {
379
512
  }));
380
513
  return ssr(`%%$${sharedConfig.context.assets.length - 1}%%`);
381
514
  }
382
- function HydrationScript() {
383
- sharedConfig.context.assets.push(generateHydrationScript);
515
+ function HydrationScript(props) {
516
+ const {
517
+ nonce
518
+ } = sharedConfig.context;
519
+ sharedConfig.context.assets.push(() => generateHydrationScript({
520
+ nonce,
521
+ ...props
522
+ }));
384
523
  return ssr(`%%$${sharedConfig.context.assets.length - 1}%%`);
385
524
  }
386
525
  function NoHydration(props) {
387
526
  const c = sharedConfig.context;
388
- delete sharedConfig.context;
527
+ c.noHydrate = true;
389
528
  const children = props.children;
390
- sharedConfig.context = c;
529
+ c.noHydrate = false;
391
530
  return children;
392
531
  }
393
532
  function ssr(t, ...nodes) {
@@ -515,26 +654,13 @@ function resolveSSRNode(node) {
515
654
  }
516
655
  function getHydrationKey() {
517
656
  const hydrate = sharedConfig.context;
518
- return hydrate && `${hydrate.id}${hydrate.count++}`;
657
+ return hydrate && !hydrate.noHydrate && `${hydrate.id}${hydrate.count++}`;
519
658
  }
520
- function generateHydrationScript() {
521
- const {
522
- nonce,
523
- streaming,
524
- resources,
525
- eventNames = ["click", "input"]
526
- } = sharedConfig.context;
527
- let s = `<script${nonce ? ` nonce="${nonce}"` : ""}>(()=>{_$HYDRATION={events:[],completed:new WeakSet};const t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),e=e=>{let o=e.composedPath&&e.composedPath()[0]||e.target,s=t(o);s&&!_$HYDRATION.completed.has(s)&&_$HYDRATION.events.push([s,e])};["${eventNames.join('","')}"].forEach(t=>document.addEventListener(t,e))})();`;
528
- if (streaming) {
529
- s += `(()=>{const e=_$HYDRATION,o={};e.startResource=e=>{let r;o[e]=[new Promise(e=>r=e),r]},e.resolveResource=(e,r)=>{const n=o[e];if(!n)return o[e]=[r];n[1](r)},e.loadResource=e=>{const r=o[e];if(r)return r[0]}})();`;
530
- }
531
- if (resources) {
532
- s += `_$HYDRATION.resources = ${devalue(Object.keys(resources).reduce((r, k) => {
533
- r[k] = resources[k].data;
534
- return r;
535
- }, {}))};`;
536
- }
537
- return s + `</script>`;
659
+ function generateHydrationScript({
660
+ eventNames = ["click", "input"],
661
+ nonce
662
+ }) {
663
+ return `<script${nonce ? ` nonce="${nonce}"` : ""}>((e,t,o={})=>{t=e=>e&&e.hasAttribute&&(e.hasAttribute("data-hk")?e:t(e.host&&e.host instanceof Node?e.host:e.parentNode)),["${eventNames.join('","')}"].forEach((o=>document.addEventListener(o,(o=>{let n=o.composedPath&&o.composedPath()[0]||o.target,s=t(n);s&&!e.completed.has(s)&&e.events.push([s,o])})))),e.init=(e,t)=>{o[e]=[new Promise((e=>t=e)),t]},e.set=(e,t,n)=>{if(!(n=o[e]))return o[e]=[t];n[1](t)},e.unset=(e)=>{delete o[e]},e.load=(e,t)=>{if(t=o[e])return t[0]}})(window._$HY||(_$HY={events:[],completed:new WeakSet}))</script><!xs>`;
538
664
  }
539
665
  function injectAssets(assets, html) {
540
666
  for (let i = 0; i < assets.length; i++) {
@@ -542,6 +668,26 @@ function injectAssets(assets, html) {
542
668
  }
543
669
  return html;
544
670
  }
671
+ function injectScripts(html, scripts, nonce) {
672
+ const tag = `<script${nonce ? ` nonce="${nonce}"` : ""}>${scripts}</script>`;
673
+ const index = html.indexOf("<!xs>");
674
+ if (index > -1) {
675
+ return html.slice(0, index) + tag + html.slice(index);
676
+ }
677
+ return html + tag;
678
+ }
679
+ function serializeError(error) {
680
+ return error.message ? `new Error(${devalue(error.message)})` : devalue(error);
681
+ }
682
+ function waitForFragments(registry, key) {
683
+ for (const k of [...registry.keys()].reverse()) {
684
+ if (key.startsWith(k)) {
685
+ registry.get(k).push(key);
686
+ return true;
687
+ }
688
+ }
689
+ return false;
690
+ }
545
691
 
546
692
  const isServer = true;
547
693
  function spread() {}
@@ -560,4 +706,4 @@ function Portal(props) {
560
706
  return "";
561
707
  }
562
708
 
563
- export { Assets, Dynamic, HydrationScript, NoHydration, Portal, escape, generateHydrationScript, getHydrationKey, isServer, pipeToNodeWritable, pipeToWritable, renderToString, renderToStringAsync, resolveSSRNode, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle };
709
+ export { Assets, Dynamic, HydrationScript, NoHydration, Portal, escape, generateHydrationScript, getHydrationKey, isServer, pipeToNodeWritable, pipeToWritable, renderToPipeableStream, renderToString, renderToStringAsync, resolveSSRNode, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle };
package/web/dist/web.cjs CHANGED
@@ -218,27 +218,20 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}) {
218
218
  }
219
219
  }
220
220
  function hydrate(code, element) {
221
- solidJs.sharedConfig.resources = globalThis._$HYDRATION.resources;
222
- solidJs.sharedConfig.completed = globalThis._$HYDRATION.completed;
223
- solidJs.sharedConfig.events = globalThis._$HYDRATION.events;
221
+ solidJs.sharedConfig.completed = globalThis._$HY.completed;
222
+ solidJs.sharedConfig.events = globalThis._$HY.events;
223
+ solidJs.sharedConfig.load = globalThis._$HY.load;
224
+ solidJs.sharedConfig.gather = root => gatherHydratable(element, root);
225
+ solidJs.sharedConfig.registry = new Map();
224
226
  solidJs.sharedConfig.context = {
225
227
  id: "",
226
- count: 0,
227
- loadResource: globalThis._$HYDRATION.loadResource
228
+ count: 0
228
229
  };
229
- solidJs.sharedConfig.registry = new Map();
230
230
  gatherHydratable(element);
231
231
  const dispose = render(code, element, [...element.childNodes]);
232
232
  solidJs.sharedConfig.context = null;
233
233
  return dispose;
234
234
  }
235
- function gatherHydratable(element) {
236
- const templates = element.querySelectorAll(`*[data-hk]`);
237
- for (let i = 0; i < templates.length; i++) {
238
- const node = templates[i];
239
- solidJs.sharedConfig.registry.set(node.getAttribute("data-hk"), node);
240
- }
241
- }
242
235
  function getNextElement(template) {
243
236
  let node, key;
244
237
  if (!solidJs.sharedConfig.context || !(node = solidJs.sharedConfig.registry.get(key = getHydrationKey()))) {
@@ -332,7 +325,7 @@ function eventHandler(e) {
332
325
  Object.defineProperty(e, "currentTarget", {
333
326
  configurable: true,
334
327
  get() {
335
- return node;
328
+ return node || document;
336
329
  }
337
330
  });
338
331
  while (node !== null) {
@@ -387,7 +380,12 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
387
380
  solidJs.createRenderEffect(() => current = insertExpression(parent, array, current, marker, true));
388
381
  return () => current;
389
382
  }
390
- if (solidJs.sharedConfig.context && current && current.length) return current;
383
+ if (solidJs.sharedConfig.context && current && current.length) {
384
+ for (let i = 0; i < array.length; i++) {
385
+ if (array[i].parentNode) return current = array;
386
+ }
387
+ return current;
388
+ }
391
389
  if (array.length === 0) {
392
390
  current = cleanChildren(parent, current, marker);
393
391
  if (multi) return current;
@@ -455,6 +453,14 @@ function cleanChildren(parent, current, marker, replacement) {
455
453
  } else parent.insertBefore(node, marker);
456
454
  return [node];
457
455
  }
456
+ function gatherHydratable(element, root) {
457
+ const templates = element.querySelectorAll(`*[data-hk]`);
458
+ for (let i = 0; i < templates.length; i++) {
459
+ const node = templates[i];
460
+ const key = node.getAttribute("data-hk");
461
+ if (!root || key.startsWith(root)) solidJs.sharedConfig.registry.set(key, node);
462
+ }
463
+ }
458
464
  function getHydrationKey() {
459
465
  const hydrate = solidJs.sharedConfig.context;
460
466
  return `${hydrate.id}${hydrate.count++}`;
@@ -629,7 +635,6 @@ exports.clearDelegatedEvents = clearDelegatedEvents;
629
635
  exports.delegateEvents = delegateEvents;
630
636
  exports.dynamicProperty = dynamicProperty;
631
637
  exports.escape = escape;
632
- exports.gatherHydratable = gatherHydratable;
633
638
  exports.generateHydrationScript = generateHydrationScript;
634
639
  exports.getHydrationKey = getHydrationKey;
635
640
  exports.getNextElement = getNextElement;
package/web/dist/web.js CHANGED
@@ -215,27 +215,20 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}) {
215
215
  }
216
216
  }
217
217
  function hydrate(code, element) {
218
- sharedConfig.resources = globalThis._$HYDRATION.resources;
219
- sharedConfig.completed = globalThis._$HYDRATION.completed;
220
- sharedConfig.events = globalThis._$HYDRATION.events;
218
+ sharedConfig.completed = globalThis._$HY.completed;
219
+ sharedConfig.events = globalThis._$HY.events;
220
+ sharedConfig.load = globalThis._$HY.load;
221
+ sharedConfig.gather = root => gatherHydratable(element, root);
222
+ sharedConfig.registry = new Map();
221
223
  sharedConfig.context = {
222
224
  id: "",
223
- count: 0,
224
- loadResource: globalThis._$HYDRATION.loadResource
225
+ count: 0
225
226
  };
226
- sharedConfig.registry = new Map();
227
227
  gatherHydratable(element);
228
228
  const dispose = render(code, element, [...element.childNodes]);
229
229
  sharedConfig.context = null;
230
230
  return dispose;
231
231
  }
232
- function gatherHydratable(element) {
233
- const templates = element.querySelectorAll(`*[data-hk]`);
234
- for (let i = 0; i < templates.length; i++) {
235
- const node = templates[i];
236
- sharedConfig.registry.set(node.getAttribute("data-hk"), node);
237
- }
238
- }
239
232
  function getNextElement(template) {
240
233
  let node, key;
241
234
  if (!sharedConfig.context || !(node = sharedConfig.registry.get(key = getHydrationKey()))) {
@@ -329,7 +322,7 @@ function eventHandler(e) {
329
322
  Object.defineProperty(e, "currentTarget", {
330
323
  configurable: true,
331
324
  get() {
332
- return node;
325
+ return node || document;
333
326
  }
334
327
  });
335
328
  while (node !== null) {
@@ -384,7 +377,12 @@ function insertExpression(parent, value, current, marker, unwrapArray) {
384
377
  createRenderEffect(() => current = insertExpression(parent, array, current, marker, true));
385
378
  return () => current;
386
379
  }
387
- if (sharedConfig.context && current && current.length) return current;
380
+ if (sharedConfig.context && current && current.length) {
381
+ for (let i = 0; i < array.length; i++) {
382
+ if (array[i].parentNode) return current = array;
383
+ }
384
+ return current;
385
+ }
388
386
  if (array.length === 0) {
389
387
  current = cleanChildren(parent, current, marker);
390
388
  if (multi) return current;
@@ -452,6 +450,14 @@ function cleanChildren(parent, current, marker, replacement) {
452
450
  } else parent.insertBefore(node, marker);
453
451
  return [node];
454
452
  }
453
+ function gatherHydratable(element, root) {
454
+ const templates = element.querySelectorAll(`*[data-hk]`);
455
+ for (let i = 0; i < templates.length; i++) {
456
+ const node = templates[i];
457
+ const key = node.getAttribute("data-hk");
458
+ if (!root || key.startsWith(root)) sharedConfig.registry.set(key, node);
459
+ }
460
+ }
455
461
  function getHydrationKey() {
456
462
  const hydrate = sharedConfig.context;
457
463
  return `${hydrate.id}${hydrate.count++}`;
@@ -535,4 +541,4 @@ function Dynamic(props) {
535
541
  });
536
542
  }
537
543
 
538
- export { Aliases, Assets, ChildProperties, DelegatedEvents, Dynamic, Assets as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, gatherHydratable, generateHydrationScript, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, insert, isServer, memo, pipeToNodeWritable, pipeToWritable, render, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle, style, template };
544
+ export { Aliases, Assets, ChildProperties, DelegatedEvents, Dynamic, Assets as HydrationScript, NoHydration, Portal, PropAliases, Properties, SVGElements, SVGNamespace, addEventListener, assign, classList, clearDelegatedEvents, delegateEvents, dynamicProperty, escape, generateHydrationScript, getHydrationKey, getNextElement, getNextMarker, getNextMatch, hydrate, insert, isServer, memo, pipeToNodeWritable, pipeToWritable, render, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, spread, ssr, ssrBoolean, ssrClassList, ssrHydrationKey, ssrSpread, ssrStyle, style, template };
@@ -46,7 +46,6 @@ export function mergeProps(...sources: unknown[]): unknown;
46
46
  export function dynamicProperty(props: unknown, key: string): unknown;
47
47
 
48
48
  export function hydrate(fn: () => JSX.Element, node: MountableElement): () => void;
49
- export function gatherHydratable(node: Element): void;
50
49
  export function getHydrationKey(): string;
51
50
  export function getNextElement(template?: HTMLTemplateElement): Element;
52
51
  export function getNextMatch(start: Node, elementName: string): Element;
@@ -1,3 +1,3 @@
1
- import { createRoot, createRenderEffect, createComponent, getOwner, sharedConfig, awaitSuspense } from "../..";
1
+ import { createRoot, createRenderEffect, createComponent, getOwner, sharedConfig } from "../..";
2
2
  declare function memo<T>(fn: () => T, equals: boolean): import("../..").Accessor<T>;
3
- export { getOwner, createComponent, createRoot as root, createRenderEffect as effect, memo, sharedConfig, awaitSuspense as asyncWrap };
3
+ export { getOwner, createComponent, createRoot as root, createRenderEffect as effect, memo, sharedConfig };