@solidjs/web 2.0.0-experimental.4 → 2.0.0-experimental.6

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/web.js CHANGED
@@ -1,487 +1,24 @@
1
- import {
2
- createRoot,
3
- untrack,
4
- createRenderEffect,
5
- sharedConfig,
6
- flatten,
7
- enableHydration,
8
- createMemo,
9
- omit
10
- } from "solid-js";
11
- export {
12
- ErrorBoundary,
13
- For,
14
- Match,
15
- Show,
16
- Suspense,
17
- Switch,
18
- createComponent,
19
- createRenderEffect as effect,
20
- getOwner,
21
- createMemo as memo,
22
- merge as mergeProps,
23
- untrack
24
- } from "solid-js";
1
+ import { createMemo, createRoot, flatten, untrack, createRenderEffect, sharedConfig, enableHydration, omit } from 'solid-js';
2
+ export { ErrorBoundary, For, Match, Show, Suspense, Switch, createComponent, createRenderEffect as effect, getOwner, merge as mergeProps, untrack } from 'solid-js';
25
3
 
26
- const booleans = [
27
- "allowfullscreen",
28
- "async",
29
- "autofocus",
30
- "autoplay",
31
- "checked",
32
- "controls",
33
- "default",
34
- "disabled",
35
- "formnovalidate",
36
- "hidden",
37
- "indeterminate",
38
- "inert",
39
- "ismap",
40
- "loop",
41
- "multiple",
42
- "muted",
43
- "nomodule",
44
- "novalidate",
45
- "open",
46
- "playsinline",
47
- "readonly",
48
- "required",
49
- "reversed",
50
- "seamless",
51
- "selected"
52
- ];
53
- const Properties = /*#__PURE__*/ new Set([
54
- "value",
55
- "readOnly",
56
- "formNoValidate",
57
- "isMap",
58
- "noModule",
59
- "playsInline",
60
- ...booleans
61
- ]);
62
- const ChildProperties = /*#__PURE__*/ new Set([
63
- "innerHTML",
64
- "textContent",
65
- "innerText",
66
- "children"
67
- ]);
68
- const PropAliases = /*#__PURE__*/ Object.assign(Object.create(null), {
69
- class: "className",
70
- formnovalidate: {
71
- $: "formNoValidate",
72
- BUTTON: 1,
73
- INPUT: 1
74
- },
75
- ismap: {
76
- $: "isMap",
77
- IMG: 1
78
- },
79
- nomodule: {
80
- $: "noModule",
81
- SCRIPT: 1
82
- },
83
- playsinline: {
84
- $: "playsInline",
85
- VIDEO: 1
86
- },
87
- readonly: {
88
- $: "readOnly",
89
- INPUT: 1,
90
- TEXTAREA: 1
91
- }
92
- });
93
- function getPropAlias(prop, tagName) {
94
- const a = PropAliases[prop];
95
- return typeof a === "object" ? (a[tagName] ? a["$"] : undefined) : a;
96
- }
97
- const DelegatedEvents = /*#__PURE__*/ new Set([
98
- "beforeinput",
99
- "click",
100
- "dblclick",
101
- "contextmenu",
102
- "focusin",
103
- "focusout",
104
- "input",
105
- "keydown",
106
- "keyup",
107
- "mousedown",
108
- "mousemove",
109
- "mouseout",
110
- "mouseover",
111
- "mouseup",
112
- "pointerdown",
113
- "pointermove",
114
- "pointerout",
115
- "pointerover",
116
- "pointerup",
117
- "touchend",
118
- "touchmove",
119
- "touchstart"
120
- ]);
121
- const SVGElements = /*#__PURE__*/ new Set([
122
- "altGlyph",
123
- "altGlyphDef",
124
- "altGlyphItem",
125
- "animate",
126
- "animateColor",
127
- "animateMotion",
128
- "animateTransform",
129
- "circle",
130
- "clipPath",
131
- "color-profile",
132
- "cursor",
133
- "defs",
134
- "desc",
135
- "ellipse",
136
- "feBlend",
137
- "feColorMatrix",
138
- "feComponentTransfer",
139
- "feComposite",
140
- "feConvolveMatrix",
141
- "feDiffuseLighting",
142
- "feDisplacementMap",
143
- "feDistantLight",
144
- "feDropShadow",
145
- "feFlood",
146
- "feFuncA",
147
- "feFuncB",
148
- "feFuncG",
149
- "feFuncR",
150
- "feGaussianBlur",
151
- "feImage",
152
- "feMerge",
153
- "feMergeNode",
154
- "feMorphology",
155
- "feOffset",
156
- "fePointLight",
157
- "feSpecularLighting",
158
- "feSpotLight",
159
- "feTile",
160
- "feTurbulence",
161
- "filter",
162
- "font",
163
- "font-face",
164
- "font-face-format",
165
- "font-face-name",
166
- "font-face-src",
167
- "font-face-uri",
168
- "foreignObject",
169
- "g",
170
- "glyph",
171
- "glyphRef",
172
- "hkern",
173
- "image",
174
- "line",
175
- "linearGradient",
176
- "marker",
177
- "mask",
178
- "metadata",
179
- "missing-glyph",
180
- "mpath",
181
- "path",
182
- "pattern",
183
- "polygon",
184
- "polyline",
185
- "radialGradient",
186
- "rect",
187
- "set",
188
- "stop",
189
- "svg",
190
- "switch",
191
- "symbol",
192
- "text",
193
- "textPath",
194
- "tref",
195
- "tspan",
196
- "use",
197
- "view",
198
- "vkern"
199
- ]);
4
+ const Properties = /*#__PURE__*/new Set([
5
+ "value", "checked", "selected", "muted"]);
6
+ const ChildProperties = /*#__PURE__*/new Set(["innerHTML", "textContent", "innerText", "children"]);
7
+ 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"]);
8
+ const SVGElements = /*#__PURE__*/new Set([
9
+ "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",
10
+ "set", "stop",
11
+ "svg", "switch", "symbol", "text", "textPath",
12
+ "tref", "tspan", "use", "view", "vkern"]);
200
13
  const SVGNamespace = {
201
14
  xlink: "http://www.w3.org/1999/xlink",
202
15
  xml: "http://www.w3.org/XML/1998/namespace"
203
16
  };
204
- const DOMElements = /*#__PURE__*/ new Set([
205
- "html",
206
- "base",
207
- "head",
208
- "link",
209
- "meta",
210
- "style",
211
- "title",
212
- "body",
213
- "address",
214
- "article",
215
- "aside",
216
- "footer",
217
- "header",
218
- "main",
219
- "nav",
220
- "section",
221
- "body",
222
- "blockquote",
223
- "dd",
224
- "div",
225
- "dl",
226
- "dt",
227
- "figcaption",
228
- "figure",
229
- "hr",
230
- "li",
231
- "ol",
232
- "p",
233
- "pre",
234
- "ul",
235
- "a",
236
- "abbr",
237
- "b",
238
- "bdi",
239
- "bdo",
240
- "br",
241
- "cite",
242
- "code",
243
- "data",
244
- "dfn",
245
- "em",
246
- "i",
247
- "kbd",
248
- "mark",
249
- "q",
250
- "rp",
251
- "rt",
252
- "ruby",
253
- "s",
254
- "samp",
255
- "small",
256
- "span",
257
- "strong",
258
- "sub",
259
- "sup",
260
- "time",
261
- "u",
262
- "var",
263
- "wbr",
264
- "area",
265
- "audio",
266
- "img",
267
- "map",
268
- "track",
269
- "video",
270
- "embed",
271
- "iframe",
272
- "object",
273
- "param",
274
- "picture",
275
- "portal",
276
- "source",
277
- "svg",
278
- "math",
279
- "canvas",
280
- "noscript",
281
- "script",
282
- "del",
283
- "ins",
284
- "caption",
285
- "col",
286
- "colgroup",
287
- "table",
288
- "tbody",
289
- "td",
290
- "tfoot",
291
- "th",
292
- "thead",
293
- "tr",
294
- "button",
295
- "datalist",
296
- "fieldset",
297
- "form",
298
- "input",
299
- "label",
300
- "legend",
301
- "meter",
302
- "optgroup",
303
- "option",
304
- "output",
305
- "progress",
306
- "select",
307
- "textarea",
308
- "details",
309
- "dialog",
310
- "menu",
311
- "summary",
312
- "details",
313
- "slot",
314
- "template",
315
- "acronym",
316
- "applet",
317
- "basefont",
318
- "bgsound",
319
- "big",
320
- "blink",
321
- "center",
322
- "content",
323
- "dir",
324
- "font",
325
- "frame",
326
- "frameset",
327
- "hgroup",
328
- "image",
329
- "keygen",
330
- "marquee",
331
- "menuitem",
332
- "nobr",
333
- "noembed",
334
- "noframes",
335
- "plaintext",
336
- "rb",
337
- "rtc",
338
- "shadow",
339
- "spacer",
340
- "strike",
341
- "tt",
342
- "xmp",
343
- "a",
344
- "abbr",
345
- "acronym",
346
- "address",
347
- "applet",
348
- "area",
349
- "article",
350
- "aside",
351
- "audio",
352
- "b",
353
- "base",
354
- "basefont",
355
- "bdi",
356
- "bdo",
357
- "bgsound",
358
- "big",
359
- "blink",
360
- "blockquote",
361
- "body",
362
- "br",
363
- "button",
364
- "canvas",
365
- "caption",
366
- "center",
367
- "cite",
368
- "code",
369
- "col",
370
- "colgroup",
371
- "content",
372
- "data",
373
- "datalist",
374
- "dd",
375
- "del",
376
- "details",
377
- "dfn",
378
- "dialog",
379
- "dir",
380
- "div",
381
- "dl",
382
- "dt",
383
- "em",
384
- "embed",
385
- "fieldset",
386
- "figcaption",
387
- "figure",
388
- "font",
389
- "footer",
390
- "form",
391
- "frame",
392
- "frameset",
393
- "head",
394
- "header",
395
- "hgroup",
396
- "hr",
397
- "html",
398
- "i",
399
- "iframe",
400
- "image",
401
- "img",
402
- "input",
403
- "ins",
404
- "kbd",
405
- "keygen",
406
- "label",
407
- "legend",
408
- "li",
409
- "link",
410
- "main",
411
- "map",
412
- "mark",
413
- "marquee",
414
- "menu",
415
- "menuitem",
416
- "meta",
417
- "meter",
418
- "nav",
419
- "nobr",
420
- "noembed",
421
- "noframes",
422
- "noscript",
423
- "object",
424
- "ol",
425
- "optgroup",
426
- "option",
427
- "output",
428
- "p",
429
- "param",
430
- "picture",
431
- "plaintext",
432
- "portal",
433
- "pre",
434
- "progress",
435
- "q",
436
- "rb",
437
- "rp",
438
- "rt",
439
- "rtc",
440
- "ruby",
441
- "s",
442
- "samp",
443
- "script",
444
- "section",
445
- "select",
446
- "shadow",
447
- "slot",
448
- "small",
449
- "source",
450
- "spacer",
451
- "span",
452
- "strike",
453
- "strong",
454
- "style",
455
- "sub",
456
- "summary",
457
- "sup",
458
- "table",
459
- "tbody",
460
- "td",
461
- "template",
462
- "textarea",
463
- "tfoot",
464
- "th",
465
- "thead",
466
- "time",
467
- "title",
468
- "tr",
469
- "track",
470
- "tt",
471
- "u",
472
- "ul",
473
- "var",
474
- "video",
475
- "wbr",
476
- "xmp",
477
- "input",
478
- "h1",
479
- "h2",
480
- "h3",
481
- "h4",
482
- "h5",
483
- "h6"
484
- ]);
17
+ 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",
18
+ "webview",
19
+ "isindex", "listing", "multicol", "nextid", "noindex", "search"]);
20
+
21
+ const memo = fn => createMemo(() => fn());
485
22
 
486
23
  function reconcileArrays(parentNode, a, b) {
487
24
  let bLength = b.length,
@@ -502,7 +39,7 @@ function reconcileArrays(parentNode, a, b) {
502
39
  bEnd--;
503
40
  }
504
41
  if (aEnd === aStart) {
505
- const node = bEnd < bLength ? (bStart ? b[bStart - 1].nextSibling : b[bEnd - bStart]) : after;
42
+ const node = bEnd < bLength ? bStart ? b[bStart - 1].nextSibling : b[bEnd - bStart] : after;
506
43
  while (bStart < bEnd) parentNode.insertBefore(b[bStart++], node);
507
44
  } else if (bEnd === bStart) {
508
45
  while (aStart < aEnd) {
@@ -545,10 +82,10 @@ function render(code, element, init, options = {}) {
545
82
  let disposer;
546
83
  createRoot(dispose => {
547
84
  disposer = dispose;
548
- element === document
549
- ? code()
550
- : insert(element, code(), element.firstChild ? null : undefined, init);
551
- }, options.owner);
85
+ element === document ? flatten(code) : insert(element, code(), element.firstChild ? null : undefined, init);
86
+ }, {
87
+ id: options.renderId
88
+ });
552
89
  return () => {
553
90
  disposer();
554
91
  element.textContent = "";
@@ -557,15 +94,11 @@ function render(code, element, init, options = {}) {
557
94
  function template(html, isImportNode, isSVG, isMathML) {
558
95
  let node;
559
96
  const create = () => {
560
- const t = isMathML
561
- ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template")
562
- : document.createElement("template");
97
+ const t = isMathML ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template") : document.createElement("template");
563
98
  t.innerHTML = html;
564
99
  return isSVG ? t.content.firstChild.firstChild : isMathML ? t.firstChild : t.content.firstChild;
565
100
  };
566
- return isImportNode
567
- ? () => untrack(() => document.importNode(node || (node = create()), true))
568
- : () => (node || (node = create())).cloneNode(true);
101
+ return isImportNode ? () => untrack(() => document.importNode(node || (node = create()), true)) : () => (node || (node = create())).cloneNode(true);
569
102
  }
570
103
  function delegateEvents(eventNames, document = window.document) {
571
104
  const e = document[$$EVENTS] || (document[$$EVENTS] = new Set());
@@ -584,27 +117,25 @@ function clearDelegatedEvents(document = window.document) {
584
117
  }
585
118
  }
586
119
  function setProperty(node, name, value) {
120
+ if (isHydrating(node)) return;
587
121
  node[name] = value;
588
122
  }
589
123
  function setAttribute(node, name, value) {
590
- if (value == null) node.removeAttribute(name);
591
- else node.setAttribute(name, value);
124
+ if (isHydrating(node)) return;
125
+ if (value == null || value === false) node.removeAttribute(name);else node.setAttribute(name, value === true ? "" : value);
592
126
  }
593
127
  function setAttributeNS(node, namespace, name, value) {
594
- if (value == null) node.removeAttributeNS(namespace, name);
595
- else node.setAttributeNS(namespace, name, value);
596
- }
597
- function setBoolAttribute(node, name, value) {
598
128
  if (isHydrating(node)) return;
599
- value ? node.setAttribute(name, "") : node.removeAttribute(name);
129
+ if (value == null) node.removeAttributeNS(namespace, name);else node.setAttributeNS(namespace, name, value);
600
130
  }
601
131
  function className(node, value, isSVG, prev) {
602
- if (value == null) {
132
+ if (isHydrating(node)) return;
133
+ if (value == null || value === false) {
603
134
  prev && node.removeAttribute("class");
604
135
  return;
605
136
  }
606
137
  if (typeof value === "string") {
607
- value !== prev && (isSVG ? node.setAttribute("class", value) : (node.className = value));
138
+ value !== prev && (isSVG ? node.setAttribute("class", value) : node.className = value);
608
139
  return;
609
140
  }
610
141
  if (typeof prev === "string") {
@@ -635,7 +166,7 @@ function addEventListener(node, name, handler, delegate) {
635
166
  } else node[`$$${name}`] = handler;
636
167
  } else if (Array.isArray(handler)) {
637
168
  const handlerFn = handler[0];
638
- node.addEventListener(name, (handler[0] = e => handlerFn.call(node, handler[1], e)));
169
+ node.addEventListener(name, handler[0] = e => handlerFn.call(node, handler[1], e));
639
170
  } else node.addEventListener(name, handler, typeof handler !== "function" && handler);
640
171
  }
641
172
  function style(node, value, prev) {
@@ -644,7 +175,7 @@ function style(node, value, prev) {
644
175
  return;
645
176
  }
646
177
  const nodeStyle = node.style;
647
- if (typeof value === "string") return (nodeStyle.cssText = value);
178
+ if (typeof value === "string") return nodeStyle.cssText = value;
648
179
  typeof prev === "string" && (nodeStyle.cssText = prev = undefined);
649
180
  prev || (prev = {});
650
181
  value || (value = {});
@@ -656,32 +187,26 @@ function style(node, value, prev) {
656
187
  }
657
188
  for (s in prev) value[s] == null && nodeStyle.removeProperty(s);
658
189
  }
190
+ function setStyleProperty(node, name, value) {
191
+ value != null ? node.style.setProperty(name, value) : node.style.removeProperty(name);
192
+ }
659
193
  function spread(node, props = {}, isSVG, skipChildren) {
660
194
  const prevProps = {};
661
195
  if (!skipChildren) {
662
- createRenderEffect(
663
- () => normalize(props.children, prevProps.children),
664
- value => {
665
- insertExpression(node, value, prevProps.children);
666
- prevProps.children = value;
667
- }
668
- );
196
+ createRenderEffect(() => normalize(props.children, prevProps.children), value => {
197
+ insertExpression(node, value, prevProps.children);
198
+ prevProps.children = value;
199
+ });
669
200
  }
670
- createRenderEffect(
671
- () => typeof props.ref === "function" && use(props.ref, node),
672
- () => {}
673
- );
674
- createRenderEffect(
675
- () => {
676
- const newProps = {};
677
- for (const prop in props) {
678
- if (prop === "children" || prop === "ref") continue;
679
- newProps[prop] = props[prop];
680
- }
681
- return newProps;
682
- },
683
- props => assign(node, props, isSVG, true, prevProps, true)
684
- );
201
+ createRenderEffect(() => typeof props.ref === "function" && use(props.ref, node), () => {});
202
+ createRenderEffect(() => {
203
+ const newProps = {};
204
+ for (const prop in props) {
205
+ if (prop === "children" || prop === "ref") continue;
206
+ newProps[prop] = props[prop];
207
+ }
208
+ return newProps;
209
+ }, props => assign(node, props, isSVG, true, prevProps, true));
685
210
  return prevProps;
686
211
  }
687
212
  function dynamicProperty(props, key) {
@@ -704,11 +229,7 @@ function insert(parent, accessor, marker, initial) {
704
229
  accessor = normalize(accessor, initial, multi, true);
705
230
  if (typeof accessor !== "function") return insertExpression(parent, accessor, initial, marker);
706
231
  }
707
- createRenderEffect(
708
- prev => normalize(accessor, prev, multi),
709
- (value, current) => insertExpression(parent, value, current, marker),
710
- initial
711
- );
232
+ createRenderEffect(prev => normalize(accessor, prev, multi), (value, current) => insertExpression(parent, value, current, marker), initial);
712
233
  }
713
234
  function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = false) {
714
235
  props || (props = {});
@@ -729,28 +250,26 @@ function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = fals
729
250
  }
730
251
  function hydrate$1(code, element, options = {}) {
731
252
  if (globalThis._$HY.done) return render(code, element, [...element.childNodes], options);
253
+ options.renderId ||= "";
732
254
  sharedConfig.completed = globalThis._$HY.completed;
733
255
  sharedConfig.events = globalThis._$HY.events;
734
256
  sharedConfig.load = id => globalThis._$HY.r[id];
735
257
  sharedConfig.has = id => id in globalThis._$HY.r;
736
258
  sharedConfig.gather = root => gatherHydratable(element, root);
737
259
  sharedConfig.registry = new Map();
738
- sharedConfig.context = {
739
- id: options.renderId || "",
740
- count: 0
741
- };
260
+ sharedConfig.hydrating = true;
742
261
  try {
743
262
  gatherHydratable(element, options.renderId);
744
263
  return render(code, element, [...element.childNodes], options);
745
264
  } finally {
746
- sharedConfig.context = null;
265
+ sharedConfig.hydrating = false;
747
266
  }
748
267
  }
749
268
  function getNextElement(template) {
750
269
  let node,
751
270
  key,
752
271
  hydrating = isHydrating();
753
- if (!hydrating || !(node = sharedConfig.registry.get((key = getHydrationKey())))) {
272
+ if (!hydrating || !(node = sharedConfig.registry.get(key = getHydrationKey()))) {
754
273
  return template();
755
274
  }
756
275
  if (sharedConfig.completed) sharedConfig.completed.add(node);
@@ -769,8 +288,7 @@ function getNextMarker(start) {
769
288
  while (end) {
770
289
  if (end.nodeType === 8) {
771
290
  const v = end.nodeValue;
772
- if (v === "$") count++;
773
- else if (v === "/") {
291
+ if (v === "$") count++;else if (v === "/") {
774
292
  if (count === 0) return [end, current];
775
293
  count--;
776
294
  }
@@ -784,7 +302,10 @@ function getNextMarker(start) {
784
302
  function runHydrationEvents() {
785
303
  if (sharedConfig.events && !sharedConfig.events.queued) {
786
304
  queueMicrotask(() => {
787
- const { completed, events } = sharedConfig;
305
+ const {
306
+ completed,
307
+ events
308
+ } = sharedConfig;
788
309
  if (!events) return;
789
310
  events.queued = false;
790
311
  while (events.length) {
@@ -802,12 +323,11 @@ function runHydrationEvents() {
802
323
  }
803
324
  }
804
325
  function isHydrating(node) {
805
- return !!sharedConfig.context && !sharedConfig.done && (!node || node.isConnected);
326
+ return sharedConfig.hydrating && !sharedConfig.done && (!node || node.isConnected);
806
327
  }
807
328
  function toggleClassKey(node, key, value) {
808
329
  const classNames = key.trim().split(/\s+/);
809
- for (let i = 0, nameLen = classNames.length; i < nameLen; i++)
810
- node.classList.toggle(classNames[i], value);
330
+ for (let i = 0, nameLen = classNames.length; i < nameLen; i++) node.classList.toggle(classNames[i], value);
811
331
  }
812
332
  function classListToObject(classList) {
813
333
  if (Array.isArray(classList)) {
@@ -820,13 +340,11 @@ function classListToObject(classList) {
820
340
  function flattenClassList(list, result) {
821
341
  for (let i = 0, len = list.length; i < len; i++) {
822
342
  const item = list[i];
823
- if (Array.isArray(item)) flattenClassList(item, result);
824
- else if (typeof item === "object" && item != null) Object.assign(result, item);
825
- else if (item || item === 0) result[item] = true;
343
+ 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;
826
344
  }
827
345
  }
828
346
  function assignProp(node, prop, value, prev, isSVG, skipRef) {
829
- let propAlias, forceProp;
347
+ let forceProp;
830
348
  if (prop === "style") return style(node, value, prev), value;
831
349
  if (prop === "class") return className(node, value, isSVG, prev), value;
832
350
  if (value === prev) return prev;
@@ -847,24 +365,12 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
847
365
  addEventListener(node, name, value, delegate);
848
366
  delegate && delegateEvents([name]);
849
367
  }
850
- } else if (prop.slice(0, 5) === "attr:") {
851
- setAttribute(node, prop.slice(5), value);
852
- } else if (prop.slice(0, 5) === "bool:") {
853
- setBoolAttribute(node, prop.slice(5), value);
854
- } else if (
855
- (forceProp = prop.slice(0, 5) === "prop:") ||
856
- ChildProperties.has(prop) ||
857
- (!isSVG && (propAlias = getPropAlias(prop, node.tagName))) ||
858
- Properties.has(prop)
859
- ) {
860
- if (forceProp) prop = prop.slice(5);
861
- if (prop === "value" && node.nodeName === "SELECT")
862
- queueMicrotask(() => (node.value = value)) || (node.value = value);
863
- else node[propAlias || prop] = value;
368
+ } else if ((forceProp = prop.slice(0, 5) === "prop:") || ChildProperties.has(prop) || !isSVG && Properties.has(prop)) {
369
+ if (forceProp) prop = prop.slice(5);else if (isHydrating(node)) return value;
370
+ if (prop === "value" && node.nodeName === "SELECT") queueMicrotask(() => node.value = value) || (node.value = value);else node[prop] = value;
864
371
  } else {
865
372
  const ns = isSVG && prop.indexOf(":") > -1 && SVGNamespace[prop.split(":")[0]];
866
- if (ns) setAttributeNS(node, ns, prop, value);
867
- else setAttribute(node, prop, value);
373
+ if (ns) setAttributeNS(node, ns, prop, value);else setAttribute(node, prop, value);
868
374
  }
869
375
  return value;
870
376
  }
@@ -876,11 +382,10 @@ function eventHandler(e) {
876
382
  const key = `$$${e.type}`;
877
383
  const oriTarget = e.target;
878
384
  const oriCurrentTarget = e.currentTarget;
879
- const retarget = value =>
880
- Object.defineProperty(e, "target", {
881
- configurable: true,
882
- value
883
- });
385
+ const retarget = value => Object.defineProperty(e, "target", {
386
+ configurable: true,
387
+ value
388
+ });
884
389
  const handleNode = () => {
885
390
  const handler = node[key];
886
391
  if (handler && !node.disabled) {
@@ -888,11 +393,7 @@ function eventHandler(e) {
888
393
  data !== undefined ? handler.call(node, data, e) : handler.call(node, e);
889
394
  if (e.cancelBubble) return;
890
395
  }
891
- node.host &&
892
- typeof node.host !== "string" &&
893
- !node.host._$host &&
894
- node.contains(e.target) &&
895
- retarget(node.host);
396
+ node.host && typeof node.host !== "string" && !node.host._$host && node.contains(e.target) && retarget(node.host);
896
397
  return true;
897
398
  };
898
399
  const walkUpTree = () => {
@@ -920,10 +421,12 @@ function eventHandler(e) {
920
421
  break;
921
422
  }
922
423
  }
923
- } else walkUpTree();
424
+ }
425
+ else walkUpTree();
924
426
  retarget(oriTarget);
925
427
  }
926
428
  function insertExpression(parent, value, current, marker) {
429
+ if (isHydrating(parent)) return;
927
430
  if (value === current) return;
928
431
  const t = typeof value,
929
432
  multi = marker !== undefined;
@@ -952,7 +455,7 @@ function insertExpression(parent, value, current, marker) {
952
455
  current && cleanChildren(parent);
953
456
  appendNodes(parent, value);
954
457
  }
955
- } else;
458
+ } else ;
956
459
  }
957
460
  function normalize(value, current, multi, doNotUnwrap) {
958
461
  value = flatten(value, {
@@ -966,9 +469,7 @@ function normalize(value, current, multi, doNotUnwrap) {
966
469
  const item = value[i],
967
470
  prev = current && current[i],
968
471
  t = typeof item;
969
- if (t === "string" || t === "number")
970
- value[i] =
971
- prev && prev.nodeType === 3 && prev.data === item ? prev : document.createTextNode(item);
472
+ if (t === "string" || t === "number") value[i] = prev && prev.nodeType === 3 && prev.data === item ? prev : document.createTextNode(item);
972
473
  }
973
474
  }
974
475
  return value;
@@ -977,36 +478,31 @@ function appendNodes(parent, array, marker = null) {
977
478
  for (let i = 0, len = array.length; i < len; i++) parent.insertBefore(array[i], marker);
978
479
  }
979
480
  function cleanChildren(parent, current, marker, replacement) {
980
- if (marker === undefined) return (parent.textContent = "");
481
+ if (marker === undefined) return parent.textContent = "";
981
482
  if (current.length) {
982
483
  let inserted = false;
983
484
  for (let i = current.length - 1; i >= 0; i--) {
984
485
  const el = current[i];
985
486
  if (replacement !== el) {
986
487
  const isParent = el.parentNode === parent;
987
- if (replacement && !inserted && !i)
988
- isParent
989
- ? parent.replaceChild(replacement, el)
990
- : parent.insertBefore(replacement, marker);
991
- else isParent && el.remove();
488
+ if (replacement && !inserted && !i) isParent ? parent.replaceChild(replacement, el) : parent.insertBefore(replacement, marker);else isParent && el.remove();
992
489
  } else inserted = true;
993
490
  }
994
491
  } else if (replacement) parent.insertBefore(replacement, marker);
995
492
  }
996
493
  function gatherHydratable(element, root) {
997
- const templates = element.querySelectorAll(`*[data-hk]`);
494
+ const templates = element.querySelectorAll(`*[_hk]`);
998
495
  for (let i = 0; i < templates.length; i++) {
999
496
  const node = templates[i];
1000
- const key = node.getAttribute("data-hk");
1001
- if ((!root || key.startsWith(root)) && !sharedConfig.registry.has(key))
1002
- sharedConfig.registry.set(key, node);
497
+ const key = node.getAttribute("_hk");
498
+ if ((!root || key.startsWith(root)) && !sharedConfig.registry.has(key)) sharedConfig.registry.set(key, node);
1003
499
  }
1004
500
  }
1005
501
  function getHydrationKey() {
1006
502
  return sharedConfig.getNextContextId();
1007
503
  }
1008
504
  function NoHydration(props) {
1009
- return sharedConfig.context ? undefined : props.children;
505
+ return sharedConfig.hydrating ? undefined : props.children;
1010
506
  }
1011
507
  function Hydration(props) {
1012
508
  return props.children;
@@ -1039,8 +535,10 @@ function escape(html) {}
1039
535
  const isServer = false;
1040
536
  const isDev = false;
1041
537
  const SVG_NAMESPACE = "http://www.w3.org/2000/svg";
1042
- function createElement(tagName, isSVG = false) {
1043
- return isSVG ? document.createElementNS(SVG_NAMESPACE, tagName) : document.createElement(tagName);
538
+ function createElement(tagName, isSVG = false, is = undefined) {
539
+ return isSVG ? document.createElementNS(SVG_NAMESPACE, tagName) : document.createElement(tagName, {
540
+ is
541
+ });
1044
542
  }
1045
543
  const hydrate = (...args) => {
1046
544
  enableHydration();
@@ -1052,21 +550,18 @@ function Portal(props) {
1052
550
  endMarker = document.createTextNode(""),
1053
551
  mount = () => createElementProxy(props.mount || document.body, treeMarker);
1054
552
  let content = createMemo(() => [startMarker, props.children]);
1055
- createRenderEffect(
1056
- () => [mount(), content()],
1057
- ([m, c]) => {
1058
- m.appendChild(endMarker);
1059
- insert(m, c, endMarker);
1060
- return () => {
1061
- let c = startMarker;
1062
- while (c && c !== endMarker) {
1063
- const n = c.nextSibling;
1064
- m.removeChild(c);
1065
- c = n;
1066
- }
1067
- };
1068
- }
1069
- );
553
+ createRenderEffect(() => [mount(), content()], ([m, c]) => {
554
+ m.appendChild(endMarker);
555
+ insert(m, c, endMarker);
556
+ return () => {
557
+ let c = startMarker;
558
+ while (c && c !== endMarker) {
559
+ const n = c.nextSibling;
560
+ m.removeChild(c);
561
+ c = n;
562
+ }
563
+ };
564
+ });
1070
565
  return treeMarker;
1071
566
  }
1072
567
  function createElementProxy(el, marker) {
@@ -1095,7 +590,7 @@ function createDynamic(component, props) {
1095
590
  return untrack(() => component(props));
1096
591
  case "string":
1097
592
  const isSvg = SVGElements.has(component);
1098
- const el = sharedConfig.context ? getNextElement() : createElement(component, isSvg);
593
+ const el = sharedConfig.hydrating ? getNextElement() : createElement(component, isSvg, untrack(() => props.is));
1099
594
  spread(el, props, isSvg);
1100
595
  return el;
1101
596
  }
@@ -1106,59 +601,4 @@ function Dynamic(props) {
1106
601
  return createDynamic(() => props.component, others);
1107
602
  }
1108
603
 
1109
- export {
1110
- voidFn as Assets,
1111
- ChildProperties,
1112
- DOMElements,
1113
- DelegatedEvents,
1114
- Dynamic,
1115
- Hydration,
1116
- voidFn as HydrationScript,
1117
- NoHydration,
1118
- Portal,
1119
- Properties,
1120
- RequestContext,
1121
- SVGElements,
1122
- SVGNamespace,
1123
- addEventListener,
1124
- assign,
1125
- className,
1126
- clearDelegatedEvents,
1127
- createDynamic,
1128
- delegateEvents,
1129
- dynamicProperty,
1130
- escape,
1131
- voidFn as generateHydrationScript,
1132
- voidFn as getAssets,
1133
- getHydrationKey,
1134
- getNextElement,
1135
- getNextMarker,
1136
- getNextMatch,
1137
- getPropAlias,
1138
- voidFn as getRequestEvent,
1139
- hydrate,
1140
- insert,
1141
- isDev,
1142
- isServer,
1143
- render,
1144
- renderToStream,
1145
- renderToString,
1146
- renderToStringAsync,
1147
- resolveSSRNode,
1148
- runHydrationEvents,
1149
- setAttribute,
1150
- setAttributeNS,
1151
- setBoolAttribute,
1152
- setProperty,
1153
- spread,
1154
- ssr,
1155
- ssrAttribute,
1156
- ssrClassList,
1157
- ssrElement,
1158
- ssrHydrationKey,
1159
- ssrStyle,
1160
- style,
1161
- template,
1162
- use,
1163
- voidFn as useAssets
1164
- };
604
+ 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, voidFn as getRequestEvent, hydrate, insert, isDev, isServer, memo, render, renderToStream, renderToString, renderToStringAsync, resolveSSRNode, runHydrationEvents, setAttribute, setAttributeNS, setProperty, setStyleProperty, spread, ssr, ssrAttribute, ssrClassList, ssrElement, ssrHydrationKey, ssrStyle, style, template, use, voidFn as useAssets };