@solidjs/web 2.0.0-experimental.3 → 2.0.0-experimental.5

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.js CHANGED
@@ -1,72 +1,10 @@
1
- import {
2
- createRoot,
3
- untrack,
4
- createRenderEffect,
5
- sharedConfig,
6
- flatten,
7
- enableHydration,
8
- createMemo,
9
- $DEVCOMP,
10
- omit
11
- } from "solid-js";
12
- export {
13
- ErrorBoundary,
14
- For,
15
- Match,
16
- Show,
17
- Suspense,
18
- Switch,
19
- createComponent,
20
- createRenderEffect as effect,
21
- getOwner,
22
- createMemo as memo,
23
- merge as mergeProps,
24
- untrack
25
- } from "solid-js";
1
+ import { createMemo, createRoot, flatten, untrack, createRenderEffect, sharedConfig, enableHydration, $DEVCOMP, omit } from 'solid-js';
2
+ export { ErrorBoundary, For, Match, Show, Suspense, Switch, createComponent, createRenderEffect as effect, getOwner, merge as mergeProps, untrack } from 'solid-js';
26
3
 
27
- const booleans = [
28
- "allowfullscreen",
29
- "async",
30
- "autofocus",
31
- "autoplay",
32
- "checked",
33
- "controls",
34
- "default",
35
- "disabled",
36
- "formnovalidate",
37
- "hidden",
38
- "indeterminate",
39
- "inert",
40
- "ismap",
41
- "loop",
42
- "multiple",
43
- "muted",
44
- "nomodule",
45
- "novalidate",
46
- "open",
47
- "playsinline",
48
- "readonly",
49
- "required",
50
- "reversed",
51
- "seamless",
52
- "selected"
53
- ];
54
- const Properties = /*#__PURE__*/ new Set([
55
- "value",
56
- "readOnly",
57
- "formNoValidate",
58
- "isMap",
59
- "noModule",
60
- "playsInline",
61
- ...booleans
62
- ]);
63
- const ChildProperties = /*#__PURE__*/ new Set([
64
- "innerHTML",
65
- "textContent",
66
- "innerText",
67
- "children"
68
- ]);
69
- const PropAliases = /*#__PURE__*/ Object.assign(Object.create(null), {
4
+ const booleans = ["allowfullscreen", "async", "autofocus", "autoplay", "checked", "controls", "default", "disabled", "formnovalidate", "hidden", "indeterminate", "inert", "ismap", "loop", "multiple", "muted", "nomodule", "novalidate", "open", "playsinline", "readonly", "required", "reversed", "seamless", "selected"];
5
+ const Properties = /*#__PURE__*/new Set(["value", "readOnly", "formNoValidate", "isMap", "noModule", "playsInline", ...booleans]);
6
+ const ChildProperties = /*#__PURE__*/new Set(["innerHTML", "textContent", "innerText", "children"]);
7
+ const PropAliases = /*#__PURE__*/Object.assign(Object.create(null), {
70
8
  class: "className",
71
9
  formnovalidate: {
72
10
  $: "formNoValidate",
@@ -93,396 +31,21 @@ const PropAliases = /*#__PURE__*/ Object.assign(Object.create(null), {
93
31
  });
94
32
  function getPropAlias(prop, tagName) {
95
33
  const a = PropAliases[prop];
96
- return typeof a === "object" ? (a[tagName] ? a["$"] : undefined) : a;
97
- }
98
- const DelegatedEvents = /*#__PURE__*/ new Set([
99
- "beforeinput",
100
- "click",
101
- "dblclick",
102
- "contextmenu",
103
- "focusin",
104
- "focusout",
105
- "input",
106
- "keydown",
107
- "keyup",
108
- "mousedown",
109
- "mousemove",
110
- "mouseout",
111
- "mouseover",
112
- "mouseup",
113
- "pointerdown",
114
- "pointermove",
115
- "pointerout",
116
- "pointerover",
117
- "pointerup",
118
- "touchend",
119
- "touchmove",
120
- "touchstart"
121
- ]);
122
- const SVGElements = /*#__PURE__*/ new Set([
123
- "altGlyph",
124
- "altGlyphDef",
125
- "altGlyphItem",
126
- "animate",
127
- "animateColor",
128
- "animateMotion",
129
- "animateTransform",
130
- "circle",
131
- "clipPath",
132
- "color-profile",
133
- "cursor",
134
- "defs",
135
- "desc",
136
- "ellipse",
137
- "feBlend",
138
- "feColorMatrix",
139
- "feComponentTransfer",
140
- "feComposite",
141
- "feConvolveMatrix",
142
- "feDiffuseLighting",
143
- "feDisplacementMap",
144
- "feDistantLight",
145
- "feDropShadow",
146
- "feFlood",
147
- "feFuncA",
148
- "feFuncB",
149
- "feFuncG",
150
- "feFuncR",
151
- "feGaussianBlur",
152
- "feImage",
153
- "feMerge",
154
- "feMergeNode",
155
- "feMorphology",
156
- "feOffset",
157
- "fePointLight",
158
- "feSpecularLighting",
159
- "feSpotLight",
160
- "feTile",
161
- "feTurbulence",
162
- "filter",
163
- "font",
164
- "font-face",
165
- "font-face-format",
166
- "font-face-name",
167
- "font-face-src",
168
- "font-face-uri",
169
- "foreignObject",
170
- "g",
171
- "glyph",
172
- "glyphRef",
173
- "hkern",
174
- "image",
175
- "line",
176
- "linearGradient",
177
- "marker",
178
- "mask",
179
- "metadata",
180
- "missing-glyph",
181
- "mpath",
182
- "path",
183
- "pattern",
184
- "polygon",
185
- "polyline",
186
- "radialGradient",
187
- "rect",
188
- "set",
189
- "stop",
190
- "svg",
191
- "switch",
192
- "symbol",
193
- "text",
194
- "textPath",
195
- "tref",
196
- "tspan",
197
- "use",
198
- "view",
199
- "vkern"
200
- ]);
34
+ return typeof a === "object" ? a[tagName] ? a["$"] : undefined : a;
35
+ }
36
+ const DelegatedEvents = /*#__PURE__*/new Set(["beforeinput", "click", "dblclick", "contextmenu", "focusin", "focusout", "input", "keydown", "keyup", "mousedown", "mousemove", "mouseout", "mouseover", "mouseup", "pointerdown", "pointermove", "pointerout", "pointerover", "pointerup", "touchend", "touchmove", "touchstart"]);
37
+ const SVGElements = /*#__PURE__*/new Set([
38
+ "altGlyph", "altGlyphDef", "altGlyphItem", "animate", "animateColor", "animateMotion", "animateTransform", "circle", "clipPath", "color-profile", "cursor", "defs", "desc", "ellipse", "feBlend", "feColorMatrix", "feComponentTransfer", "feComposite", "feConvolveMatrix", "feDiffuseLighting", "feDisplacementMap", "feDistantLight", "feDropShadow", "feFlood", "feFuncA", "feFuncB", "feFuncG", "feFuncR", "feGaussianBlur", "feImage", "feMerge", "feMergeNode", "feMorphology", "feOffset", "fePointLight", "feSpecularLighting", "feSpotLight", "feTile", "feTurbulence", "filter", "font", "font-face", "font-face-format", "font-face-name", "font-face-src", "font-face-uri", "foreignObject", "g", "glyph", "glyphRef", "hkern", "image", "line", "linearGradient", "marker", "mask", "metadata", "missing-glyph", "mpath", "path", "pattern", "polygon", "polyline", "radialGradient", "rect",
39
+ "set", "stop",
40
+ "svg", "switch", "symbol", "text", "textPath",
41
+ "tref", "tspan", "use", "view", "vkern"]);
201
42
  const SVGNamespace = {
202
43
  xlink: "http://www.w3.org/1999/xlink",
203
44
  xml: "http://www.w3.org/XML/1998/namespace"
204
45
  };
205
- const DOMElements = /*#__PURE__*/ new Set([
206
- "html",
207
- "base",
208
- "head",
209
- "link",
210
- "meta",
211
- "style",
212
- "title",
213
- "body",
214
- "address",
215
- "article",
216
- "aside",
217
- "footer",
218
- "header",
219
- "main",
220
- "nav",
221
- "section",
222
- "body",
223
- "blockquote",
224
- "dd",
225
- "div",
226
- "dl",
227
- "dt",
228
- "figcaption",
229
- "figure",
230
- "hr",
231
- "li",
232
- "ol",
233
- "p",
234
- "pre",
235
- "ul",
236
- "a",
237
- "abbr",
238
- "b",
239
- "bdi",
240
- "bdo",
241
- "br",
242
- "cite",
243
- "code",
244
- "data",
245
- "dfn",
246
- "em",
247
- "i",
248
- "kbd",
249
- "mark",
250
- "q",
251
- "rp",
252
- "rt",
253
- "ruby",
254
- "s",
255
- "samp",
256
- "small",
257
- "span",
258
- "strong",
259
- "sub",
260
- "sup",
261
- "time",
262
- "u",
263
- "var",
264
- "wbr",
265
- "area",
266
- "audio",
267
- "img",
268
- "map",
269
- "track",
270
- "video",
271
- "embed",
272
- "iframe",
273
- "object",
274
- "param",
275
- "picture",
276
- "portal",
277
- "source",
278
- "svg",
279
- "math",
280
- "canvas",
281
- "noscript",
282
- "script",
283
- "del",
284
- "ins",
285
- "caption",
286
- "col",
287
- "colgroup",
288
- "table",
289
- "tbody",
290
- "td",
291
- "tfoot",
292
- "th",
293
- "thead",
294
- "tr",
295
- "button",
296
- "datalist",
297
- "fieldset",
298
- "form",
299
- "input",
300
- "label",
301
- "legend",
302
- "meter",
303
- "optgroup",
304
- "option",
305
- "output",
306
- "progress",
307
- "select",
308
- "textarea",
309
- "details",
310
- "dialog",
311
- "menu",
312
- "summary",
313
- "details",
314
- "slot",
315
- "template",
316
- "acronym",
317
- "applet",
318
- "basefont",
319
- "bgsound",
320
- "big",
321
- "blink",
322
- "center",
323
- "content",
324
- "dir",
325
- "font",
326
- "frame",
327
- "frameset",
328
- "hgroup",
329
- "image",
330
- "keygen",
331
- "marquee",
332
- "menuitem",
333
- "nobr",
334
- "noembed",
335
- "noframes",
336
- "plaintext",
337
- "rb",
338
- "rtc",
339
- "shadow",
340
- "spacer",
341
- "strike",
342
- "tt",
343
- "xmp",
344
- "a",
345
- "abbr",
346
- "acronym",
347
- "address",
348
- "applet",
349
- "area",
350
- "article",
351
- "aside",
352
- "audio",
353
- "b",
354
- "base",
355
- "basefont",
356
- "bdi",
357
- "bdo",
358
- "bgsound",
359
- "big",
360
- "blink",
361
- "blockquote",
362
- "body",
363
- "br",
364
- "button",
365
- "canvas",
366
- "caption",
367
- "center",
368
- "cite",
369
- "code",
370
- "col",
371
- "colgroup",
372
- "content",
373
- "data",
374
- "datalist",
375
- "dd",
376
- "del",
377
- "details",
378
- "dfn",
379
- "dialog",
380
- "dir",
381
- "div",
382
- "dl",
383
- "dt",
384
- "em",
385
- "embed",
386
- "fieldset",
387
- "figcaption",
388
- "figure",
389
- "font",
390
- "footer",
391
- "form",
392
- "frame",
393
- "frameset",
394
- "head",
395
- "header",
396
- "hgroup",
397
- "hr",
398
- "html",
399
- "i",
400
- "iframe",
401
- "image",
402
- "img",
403
- "input",
404
- "ins",
405
- "kbd",
406
- "keygen",
407
- "label",
408
- "legend",
409
- "li",
410
- "link",
411
- "main",
412
- "map",
413
- "mark",
414
- "marquee",
415
- "menu",
416
- "menuitem",
417
- "meta",
418
- "meter",
419
- "nav",
420
- "nobr",
421
- "noembed",
422
- "noframes",
423
- "noscript",
424
- "object",
425
- "ol",
426
- "optgroup",
427
- "option",
428
- "output",
429
- "p",
430
- "param",
431
- "picture",
432
- "plaintext",
433
- "portal",
434
- "pre",
435
- "progress",
436
- "q",
437
- "rb",
438
- "rp",
439
- "rt",
440
- "rtc",
441
- "ruby",
442
- "s",
443
- "samp",
444
- "script",
445
- "section",
446
- "select",
447
- "shadow",
448
- "slot",
449
- "small",
450
- "source",
451
- "spacer",
452
- "span",
453
- "strike",
454
- "strong",
455
- "style",
456
- "sub",
457
- "summary",
458
- "sup",
459
- "table",
460
- "tbody",
461
- "td",
462
- "template",
463
- "textarea",
464
- "tfoot",
465
- "th",
466
- "thead",
467
- "time",
468
- "title",
469
- "tr",
470
- "track",
471
- "tt",
472
- "u",
473
- "ul",
474
- "var",
475
- "video",
476
- "wbr",
477
- "xmp",
478
- "input",
479
- "h1",
480
- "h2",
481
- "h3",
482
- "h4",
483
- "h5",
484
- "h6"
485
- ]);
46
+ const DOMElements = /*#__PURE__*/new Set(["html", "base", "head", "link", "meta", "style", "title", "body", "address", "article", "aside", "footer", "header", "main", "nav", "section", "body", "blockquote", "dd", "div", "dl", "dt", "figcaption", "figure", "hr", "li", "ol", "p", "pre", "ul", "a", "abbr", "b", "bdi", "bdo", "br", "cite", "code", "data", "dfn", "em", "i", "kbd", "mark", "q", "rp", "rt", "ruby", "s", "samp", "small", "span", "strong", "sub", "sup", "time", "u", "var", "wbr", "area", "audio", "img", "map", "track", "video", "embed", "iframe", "object", "param", "picture", "portal", "source", "svg", "math", "canvas", "noscript", "script", "del", "ins", "caption", "col", "colgroup", "table", "tbody", "td", "tfoot", "th", "thead", "tr", "button", "datalist", "fieldset", "form", "input", "label", "legend", "meter", "optgroup", "option", "output", "progress", "select", "textarea", "details", "dialog", "menu", "summary", "details", "slot", "template", "acronym", "applet", "basefont", "bgsound", "big", "blink", "center", "content", "dir", "font", "frame", "frameset", "hgroup", "image", "keygen", "marquee", "menuitem", "nobr", "noembed", "noframes", "plaintext", "rb", "rtc", "shadow", "spacer", "strike", "tt", "xmp", "a", "abbr", "acronym", "address", "applet", "area", "article", "aside", "audio", "b", "base", "basefont", "bdi", "bdo", "bgsound", "big", "blink", "blockquote", "body", "br", "button", "canvas", "caption", "center", "cite", "code", "col", "colgroup", "content", "data", "datalist", "dd", "del", "details", "dfn", "dialog", "dir", "div", "dl", "dt", "em", "embed", "fieldset", "figcaption", "figure", "font", "footer", "form", "frame", "frameset", "head", "header", "hgroup", "hr", "html", "i", "iframe", "image", "img", "input", "ins", "kbd", "keygen", "label", "legend", "li", "link", "main", "map", "mark", "marquee", "menu", "menuitem", "meta", "meter", "nav", "nobr", "noembed", "noframes", "noscript", "object", "ol", "optgroup", "option", "output", "p", "param", "picture", "plaintext", "portal", "pre", "progress", "q", "rb", "rp", "rt", "rtc", "ruby", "s", "samp", "script", "section", "select", "shadow", "slot", "small", "source", "spacer", "span", "strike", "strong", "style", "sub", "summary", "sup", "table", "tbody", "td", "template", "textarea", "tfoot", "th", "thead", "time", "title", "tr", "track", "tt", "u", "ul", "var", "video", "wbr", "xmp", "input", "h1", "h2", "h3", "h4", "h5", "h6"]);
47
+
48
+ const memo = fn => createMemo(() => fn());
486
49
 
487
50
  function reconcileArrays(parentNode, a, b) {
488
51
  let bLength = b.length,
@@ -503,7 +66,7 @@ function reconcileArrays(parentNode, a, b) {
503
66
  bEnd--;
504
67
  }
505
68
  if (aEnd === aStart) {
506
- const node = bEnd < bLength ? (bStart ? b[bStart - 1].nextSibling : b[bEnd - bStart]) : after;
69
+ const node = bEnd < bLength ? bStart ? b[bStart - 1].nextSibling : b[bEnd - bStart] : after;
507
70
  while (bStart < bEnd) parentNode.insertBefore(b[bStart++], node);
508
71
  } else if (bEnd === bStart) {
509
72
  while (aStart < aEnd) {
@@ -544,17 +107,15 @@ function reconcileArrays(parentNode, a, b) {
544
107
  const $$EVENTS = "_$DX_DELEGATE";
545
108
  function render(code, element, init, options = {}) {
546
109
  if (!element) {
547
- throw new Error(
548
- "The `element` passed to `render(..., element)` doesn't exist. Make sure `element` exists in the document."
549
- );
110
+ throw new Error("The `element` passed to `render(..., element)` doesn't exist. Make sure `element` exists in the document.");
550
111
  }
551
112
  let disposer;
552
113
  createRoot(dispose => {
553
114
  disposer = dispose;
554
- element === document
555
- ? code()
556
- : insert(element, code(), element.firstChild ? null : undefined, init);
557
- }, options.owner);
115
+ element === document ? flatten(code) : insert(element, code(), element.firstChild ? null : undefined, init);
116
+ }, {
117
+ id: options.renderId
118
+ });
558
119
  return () => {
559
120
  disposer();
560
121
  element.textContent = "";
@@ -563,19 +124,12 @@ function render(code, element, init, options = {}) {
563
124
  function template(html, isImportNode, isSVG, isMathML) {
564
125
  let node;
565
126
  const create = () => {
566
- if (isHydrating())
567
- throw new Error(
568
- "Failed attempt to create new DOM elements during hydration. Check that the libraries you are using support hydration."
569
- );
570
- const t = isMathML
571
- ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template")
572
- : document.createElement("template");
127
+ if (isHydrating()) throw new Error("Failed attempt to create new DOM elements during hydration. Check that the libraries you are using support hydration.");
128
+ const t = isMathML ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template") : document.createElement("template");
573
129
  t.innerHTML = html;
574
130
  return isSVG ? t.content.firstChild.firstChild : isMathML ? t.firstChild : t.content.firstChild;
575
131
  };
576
- return isImportNode
577
- ? () => untrack(() => document.importNode(node || (node = create()), true))
578
- : () => (node || (node = create())).cloneNode(true);
132
+ return isImportNode ? () => untrack(() => document.importNode(node || (node = create()), true)) : () => (node || (node = create())).cloneNode(true);
579
133
  }
580
134
  function delegateEvents(eventNames, document = window.document) {
581
135
  const e = document[$$EVENTS] || (document[$$EVENTS] = new Set());
@@ -594,27 +148,29 @@ function clearDelegatedEvents(document = window.document) {
594
148
  }
595
149
  }
596
150
  function setProperty(node, name, value) {
151
+ if (isHydrating(node)) return;
597
152
  node[name] = value;
598
153
  }
599
154
  function setAttribute(node, name, value) {
600
- if (value == null) node.removeAttribute(name);
601
- else node.setAttribute(name, value);
155
+ if (isHydrating(node)) return;
156
+ if (value == null) node.removeAttribute(name);else node.setAttribute(name, value);
602
157
  }
603
158
  function setAttributeNS(node, namespace, name, value) {
604
- if (value == null) node.removeAttributeNS(namespace, name);
605
- else node.setAttributeNS(namespace, name, value);
159
+ if (isHydrating(node)) return;
160
+ if (value == null) node.removeAttributeNS(namespace, name);else node.setAttributeNS(namespace, name, value);
606
161
  }
607
162
  function setBoolAttribute(node, name, value) {
608
163
  if (isHydrating(node)) return;
609
164
  value ? node.setAttribute(name, "") : node.removeAttribute(name);
610
165
  }
611
166
  function className(node, value, isSVG, prev) {
167
+ if (isHydrating(node)) return;
612
168
  if (value == null) {
613
169
  prev && node.removeAttribute("class");
614
170
  return;
615
171
  }
616
172
  if (typeof value === "string") {
617
- value !== prev && (isSVG ? node.setAttribute("class", value) : (node.className = value));
173
+ value !== prev && (isSVG ? node.setAttribute("class", value) : node.className = value);
618
174
  return;
619
175
  }
620
176
  if (typeof prev === "string") {
@@ -645,7 +201,7 @@ function addEventListener(node, name, handler, delegate) {
645
201
  } else node[`$$${name}`] = handler;
646
202
  } else if (Array.isArray(handler)) {
647
203
  const handlerFn = handler[0];
648
- node.addEventListener(name, (handler[0] = e => handlerFn.call(node, handler[1], e)));
204
+ node.addEventListener(name, handler[0] = e => handlerFn.call(node, handler[1], e));
649
205
  } else node.addEventListener(name, handler, typeof handler !== "function" && handler);
650
206
  }
651
207
  function style(node, value, prev) {
@@ -654,7 +210,7 @@ function style(node, value, prev) {
654
210
  return;
655
211
  }
656
212
  const nodeStyle = node.style;
657
- if (typeof value === "string") return (nodeStyle.cssText = value);
213
+ if (typeof value === "string") return nodeStyle.cssText = value;
658
214
  typeof prev === "string" && (nodeStyle.cssText = prev = undefined);
659
215
  prev || (prev = {});
660
216
  value || (value = {});
@@ -669,29 +225,20 @@ function style(node, value, prev) {
669
225
  function spread(node, props = {}, isSVG, skipChildren) {
670
226
  const prevProps = {};
671
227
  if (!skipChildren) {
672
- createRenderEffect(
673
- () => normalize(props.children, prevProps.children),
674
- value => {
675
- insertExpression(node, value, prevProps.children);
676
- prevProps.children = value;
677
- }
678
- );
228
+ createRenderEffect(() => normalize(props.children, prevProps.children), value => {
229
+ insertExpression(node, value, prevProps.children);
230
+ prevProps.children = value;
231
+ });
679
232
  }
680
- createRenderEffect(
681
- () => typeof props.ref === "function" && use(props.ref, node),
682
- () => {}
683
- );
684
- createRenderEffect(
685
- () => {
686
- const newProps = {};
687
- for (const prop in props) {
688
- if (prop === "children" || prop === "ref") continue;
689
- newProps[prop] = props[prop];
690
- }
691
- return newProps;
692
- },
693
- props => assign(node, props, isSVG, true, prevProps, true)
694
- );
233
+ createRenderEffect(() => typeof props.ref === "function" && use(props.ref, node), () => {});
234
+ createRenderEffect(() => {
235
+ const newProps = {};
236
+ for (const prop in props) {
237
+ if (prop === "children" || prop === "ref") continue;
238
+ newProps[prop] = props[prop];
239
+ }
240
+ return newProps;
241
+ }, props => assign(node, props, isSVG, true, prevProps, true));
695
242
  return prevProps;
696
243
  }
697
244
  function dynamicProperty(props, key) {
@@ -714,11 +261,7 @@ function insert(parent, accessor, marker, initial) {
714
261
  accessor = normalize(accessor, initial, multi, true);
715
262
  if (typeof accessor !== "function") return insertExpression(parent, accessor, initial, marker);
716
263
  }
717
- createRenderEffect(
718
- prev => normalize(accessor, prev, multi),
719
- (value, current) => insertExpression(parent, value, current, marker),
720
- initial
721
- );
264
+ createRenderEffect(prev => normalize(accessor, prev, multi), (value, current) => insertExpression(parent, value, current, marker), initial);
722
265
  }
723
266
  function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = false) {
724
267
  props || (props = {});
@@ -739,35 +282,29 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = fals
739
282
  }
740
283
  function hydrate$1(code, element, options = {}) {
741
284
  if (globalThis._$HY.done) return render(code, element, [...element.childNodes], options);
285
+ options.renderId ||= "";
742
286
  sharedConfig.completed = globalThis._$HY.completed;
743
287
  sharedConfig.events = globalThis._$HY.events;
744
288
  sharedConfig.load = id => globalThis._$HY.r[id];
745
289
  sharedConfig.has = id => id in globalThis._$HY.r;
746
290
  sharedConfig.gather = root => gatherHydratable(element, root);
747
291
  sharedConfig.registry = new Map();
748
- sharedConfig.context = {
749
- id: options.renderId || "",
750
- count: 0
751
- };
292
+ sharedConfig.hydrating = true;
752
293
  try {
753
294
  gatherHydratable(element, options.renderId);
754
295
  return render(code, element, [...element.childNodes], options);
755
296
  } finally {
756
- sharedConfig.context = null;
297
+ sharedConfig.hydrating = false;
757
298
  }
758
299
  }
759
300
  function getNextElement(template) {
760
301
  let node,
761
302
  key,
762
303
  hydrating = isHydrating();
763
- if (!hydrating || !(node = sharedConfig.registry.get((key = getHydrationKey())))) {
304
+ if (!hydrating || !(node = sharedConfig.registry.get(key = getHydrationKey()))) {
764
305
  if (hydrating) {
765
306
  sharedConfig.done = true;
766
- throw new Error(
767
- `Hydration Mismatch. Unable to find DOM nodes for hydration key: ${key}\n${
768
- template ? template().outerHTML : ""
769
- }`
770
- );
307
+ throw new Error(`Hydration Mismatch. Unable to find DOM nodes for hydration key: ${key}\n${template ? template().outerHTML : ""}`);
771
308
  }
772
309
  return template();
773
310
  }
@@ -787,8 +324,7 @@ function getNextMarker(start) {
787
324
  while (end) {
788
325
  if (end.nodeType === 8) {
789
326
  const v = end.nodeValue;
790
- if (v === "$") count++;
791
- else if (v === "/") {
327
+ if (v === "$") count++;else if (v === "/") {
792
328
  if (count === 0) return [end, current];
793
329
  count--;
794
330
  }
@@ -802,7 +338,10 @@ function getNextMarker(start) {
802
338
  function runHydrationEvents() {
803
339
  if (sharedConfig.events && !sharedConfig.events.queued) {
804
340
  queueMicrotask(() => {
805
- const { completed, events } = sharedConfig;
341
+ const {
342
+ completed,
343
+ events
344
+ } = sharedConfig;
806
345
  if (!events) return;
807
346
  events.queued = false;
808
347
  while (events.length) {
@@ -820,12 +359,11 @@ function runHydrationEvents() {
820
359
  }
821
360
  }
822
361
  function isHydrating(node) {
823
- return !!sharedConfig.context && !sharedConfig.done && (!node || node.isConnected);
362
+ return sharedConfig.hydrating && !sharedConfig.done && (!node || node.isConnected);
824
363
  }
825
364
  function toggleClassKey(node, key, value) {
826
365
  const classNames = key.trim().split(/\s+/);
827
- for (let i = 0, nameLen = classNames.length; i < nameLen; i++)
828
- node.classList.toggle(classNames[i], value);
366
+ for (let i = 0, nameLen = classNames.length; i < nameLen; i++) node.classList.toggle(classNames[i], value);
829
367
  }
830
368
  function classListToObject(classList) {
831
369
  if (Array.isArray(classList)) {
@@ -838,9 +376,7 @@ function classListToObject(classList) {
838
376
  function flattenClassList(list, result) {
839
377
  for (let i = 0, len = list.length; i < len; i++) {
840
378
  const item = list[i];
841
- if (Array.isArray(item)) flattenClassList(item, result);
842
- else if (typeof item === "object" && item != null) Object.assign(result, item);
843
- else if (item || item === 0) result[item] = true;
379
+ if (Array.isArray(item)) flattenClassList(item, result);else if (typeof item === "object" && item != null) Object.assign(result, item);else if (item || item === 0) result[item] = true;
844
380
  }
845
381
  }
846
382
  function assignProp(node, prop, value, prev, isSVG, skipRef) {
@@ -869,20 +405,12 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
869
405
  setAttribute(node, prop.slice(5), value);
870
406
  } else if (prop.slice(0, 5) === "bool:") {
871
407
  setBoolAttribute(node, prop.slice(5), value);
872
- } else if (
873
- (forceProp = prop.slice(0, 5) === "prop:") ||
874
- ChildProperties.has(prop) ||
875
- (!isSVG && (propAlias = getPropAlias(prop, node.tagName))) ||
876
- Properties.has(prop)
877
- ) {
878
- if (forceProp) prop = prop.slice(5);
879
- if (prop === "value" && node.nodeName === "SELECT")
880
- queueMicrotask(() => (node.value = value)) || (node.value = value);
881
- else node[propAlias || prop] = value;
408
+ } else if ((forceProp = prop.slice(0, 5) === "prop:") || ChildProperties.has(prop) || !isSVG && (propAlias = getPropAlias(prop, node.tagName)) || Properties.has(prop)) {
409
+ if (forceProp) prop = prop.slice(5);else if (isHydrating(node)) return value;
410
+ if (prop === "value" && node.nodeName === "SELECT") queueMicrotask(() => node.value = value) || (node.value = value);else node[propAlias || prop] = value;
882
411
  } else {
883
412
  const ns = isSVG && prop.indexOf(":") > -1 && SVGNamespace[prop.split(":")[0]];
884
- if (ns) setAttributeNS(node, ns, prop, value);
885
- else setAttribute(node, prop, value);
413
+ if (ns) setAttributeNS(node, ns, prop, value);else setAttribute(node, prop, value);
886
414
  }
887
415
  return value;
888
416
  }
@@ -894,11 +422,10 @@ function eventHandler(e) {
894
422
  const key = `$$${e.type}`;
895
423
  const oriTarget = e.target;
896
424
  const oriCurrentTarget = e.currentTarget;
897
- const retarget = value =>
898
- Object.defineProperty(e, "target", {
899
- configurable: true,
900
- value
901
- });
425
+ const retarget = value => Object.defineProperty(e, "target", {
426
+ configurable: true,
427
+ value
428
+ });
902
429
  const handleNode = () => {
903
430
  const handler = node[key];
904
431
  if (handler && !node.disabled) {
@@ -906,11 +433,7 @@ function eventHandler(e) {
906
433
  data !== undefined ? handler.call(node, data, e) : handler.call(node, e);
907
434
  if (e.cancelBubble) return;
908
435
  }
909
- node.host &&
910
- typeof node.host !== "string" &&
911
- !node.host._$host &&
912
- node.contains(e.target) &&
913
- retarget(node.host);
436
+ node.host && typeof node.host !== "string" && !node.host._$host && node.contains(e.target) && retarget(node.host);
914
437
  return true;
915
438
  };
916
439
  const walkUpTree = () => {
@@ -938,10 +461,12 @@ function eventHandler(e) {
938
461
  break;
939
462
  }
940
463
  }
941
- } else walkUpTree();
464
+ }
465
+ else walkUpTree();
942
466
  retarget(oriTarget);
943
467
  }
944
468
  function insertExpression(parent, value, current, marker) {
469
+ if (isHydrating(parent)) return;
945
470
  if (value === current) return;
946
471
  const t = typeof value,
947
472
  multi = marker !== undefined;
@@ -984,9 +509,7 @@ function normalize(value, current, multi, doNotUnwrap) {
984
509
  const item = value[i],
985
510
  prev = current && current[i],
986
511
  t = typeof item;
987
- if (t === "string" || t === "number")
988
- value[i] =
989
- prev && prev.nodeType === 3 && prev.data === item ? prev : document.createTextNode(item);
512
+ if (t === "string" || t === "number") value[i] = prev && prev.nodeType === 3 && prev.data === item ? prev : document.createTextNode(item);
990
513
  }
991
514
  }
992
515
  return value;
@@ -995,36 +518,31 @@ function appendNodes(parent, array, marker = null) {
995
518
  for (let i = 0, len = array.length; i < len; i++) parent.insertBefore(array[i], marker);
996
519
  }
997
520
  function cleanChildren(parent, current, marker, replacement) {
998
- if (marker === undefined) return (parent.textContent = "");
521
+ if (marker === undefined) return parent.textContent = "";
999
522
  if (current.length) {
1000
523
  let inserted = false;
1001
524
  for (let i = current.length - 1; i >= 0; i--) {
1002
525
  const el = current[i];
1003
526
  if (replacement !== el) {
1004
527
  const isParent = el.parentNode === parent;
1005
- if (replacement && !inserted && !i)
1006
- isParent
1007
- ? parent.replaceChild(replacement, el)
1008
- : parent.insertBefore(replacement, marker);
1009
- else isParent && el.remove();
528
+ if (replacement && !inserted && !i) isParent ? parent.replaceChild(replacement, el) : parent.insertBefore(replacement, marker);else isParent && el.remove();
1010
529
  } else inserted = true;
1011
530
  }
1012
531
  } else if (replacement) parent.insertBefore(replacement, marker);
1013
532
  }
1014
533
  function gatherHydratable(element, root) {
1015
- const templates = element.querySelectorAll(`*[data-hk]`);
534
+ const templates = element.querySelectorAll(`*[_hk]`);
1016
535
  for (let i = 0; i < templates.length; i++) {
1017
536
  const node = templates[i];
1018
- const key = node.getAttribute("data-hk");
1019
- if ((!root || key.startsWith(root)) && !sharedConfig.registry.has(key))
1020
- sharedConfig.registry.set(key, node);
537
+ const key = node.getAttribute("_hk");
538
+ if ((!root || key.startsWith(root)) && !sharedConfig.registry.has(key)) sharedConfig.registry.set(key, node);
1021
539
  }
1022
540
  }
1023
541
  function getHydrationKey() {
1024
542
  return sharedConfig.getNextContextId();
1025
543
  }
1026
544
  function NoHydration(props) {
1027
- return sharedConfig.context ? undefined : props.children;
545
+ return sharedConfig.hydrating ? undefined : props.children;
1028
546
  }
1029
547
  function Hydration(props) {
1030
548
  return props.children;
@@ -1070,21 +588,18 @@ function Portal(props) {
1070
588
  endMarker = document.createTextNode(""),
1071
589
  mount = () => createElementProxy(props.mount || document.body, treeMarker);
1072
590
  let content = createMemo(() => [startMarker, props.children]);
1073
- createRenderEffect(
1074
- () => [mount(), content()],
1075
- ([m, c]) => {
1076
- m.appendChild(endMarker);
1077
- insert(m, c, endMarker);
1078
- return () => {
1079
- let c = startMarker;
1080
- while (c && c !== endMarker) {
1081
- const n = c.nextSibling;
1082
- m.removeChild(c);
1083
- c = n;
1084
- }
1085
- };
1086
- }
1087
- );
591
+ createRenderEffect(() => [mount(), content()], ([m, c]) => {
592
+ m.appendChild(endMarker);
593
+ insert(m, c, endMarker);
594
+ return () => {
595
+ let c = startMarker;
596
+ while (c && c !== endMarker) {
597
+ const n = c.nextSibling;
598
+ m.removeChild(c);
599
+ c = n;
600
+ }
601
+ };
602
+ });
1088
603
  return treeMarker;
1089
604
  }
1090
605
  function createElementProxy(el, marker) {
@@ -1127,59 +642,4 @@ function Dynamic(props) {
1127
642
  return createDynamic(() => props.component, others);
1128
643
  }
1129
644
 
1130
- export {
1131
- voidFn as Assets,
1132
- ChildProperties,
1133
- DOMElements,
1134
- DelegatedEvents,
1135
- Dynamic,
1136
- Hydration,
1137
- voidFn as HydrationScript,
1138
- NoHydration,
1139
- Portal,
1140
- Properties,
1141
- RequestContext,
1142
- SVGElements,
1143
- SVGNamespace,
1144
- addEventListener,
1145
- assign,
1146
- className,
1147
- clearDelegatedEvents,
1148
- createDynamic,
1149
- delegateEvents,
1150
- dynamicProperty,
1151
- escape,
1152
- voidFn as generateHydrationScript,
1153
- voidFn as getAssets,
1154
- getHydrationKey,
1155
- getNextElement,
1156
- getNextMarker,
1157
- getNextMatch,
1158
- getPropAlias,
1159
- voidFn as getRequestEvent,
1160
- hydrate,
1161
- insert,
1162
- isDev,
1163
- isServer,
1164
- render,
1165
- renderToStream,
1166
- renderToString,
1167
- renderToStringAsync,
1168
- resolveSSRNode,
1169
- runHydrationEvents,
1170
- setAttribute,
1171
- setAttributeNS,
1172
- setBoolAttribute,
1173
- setProperty,
1174
- spread,
1175
- ssr,
1176
- ssrAttribute,
1177
- ssrClassList,
1178
- ssrElement,
1179
- ssrHydrationKey,
1180
- ssrStyle,
1181
- style,
1182
- template,
1183
- use,
1184
- voidFn as useAssets
1185
- };
645
+ export { voidFn as Assets, ChildProperties, DOMElements, DelegatedEvents, Dynamic, Hydration, voidFn as HydrationScript, NoHydration, Portal, Properties, RequestContext, SVGElements, SVGNamespace, addEventListener, assign, className, clearDelegatedEvents, createDynamic, delegateEvents, dynamicProperty, escape, voidFn as generateHydrationScript, voidFn as getAssets, getHydrationKey, getNextElement, getNextMarker, getNextMatch, getPropAlias, voidFn as getRequestEvent, hydrate, insert, isDev, isServer, memo, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, setBoolAttribute, setProperty, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrStyle, style, template, use, voidFn as useAssets };