@solidjs/web 2.0.0-beta.1 → 2.0.0-beta.10

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.cjs CHANGED
@@ -2,8 +2,34 @@
2
2
 
3
3
  var solidJs = require('solid-js');
4
4
 
5
- const Properties = /*#__PURE__*/new Set([
6
- "value", "checked", "selected", "muted"]);
5
+ const DOMWithState = {
6
+ INPUT: {
7
+ value: 1,
8
+ defaultValue: 2,
9
+ checked: 1,
10
+ defaultChecked: 2
11
+ },
12
+ SELECT: {
13
+ value: 1
14
+ },
15
+ OPTION: {
16
+ value: 1,
17
+ selected: 1,
18
+ defaultSelected: 2
19
+ },
20
+ TEXTAREA: {
21
+ value: 1,
22
+ defaultValue: 2
23
+ },
24
+ VIDEO: {
25
+ muted: 1,
26
+ defaultMuted: 2
27
+ },
28
+ AUDIO: {
29
+ muted: 1,
30
+ defaultMuted: 2
31
+ }
32
+ };
7
33
  const ChildProperties = /*#__PURE__*/new Set(["innerHTML", "textContent", "innerText", "children"]);
8
34
  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"]);
9
35
  const SVGElements = /*#__PURE__*/new Set([
@@ -11,17 +37,26 @@ const SVGElements = /*#__PURE__*/new Set([
11
37
  "set", "stop",
12
38
  "svg", "switch", "symbol", "text", "textPath",
13
39
  "tref", "tspan", "use", "view", "vkern"]);
14
- const SVGNamespace = {
40
+ const MathMLElements = /*#__PURE__*/new Set(["annotation", "annotation-xml", "maction", "math", "menclose", "merror", "mfenced", "mfrac", "mi", "mmultiscripts", "mn", "mo", "mover", "mpadded", "mphantom", "mprescripts", "mroot", "mrow", "ms", "mspace", "msqrt", "mstyle", "msub", "msubsup", "msup", "mtable", "mtd", "mtext", "mtr", "munder", "munderover", "semantics"]);
41
+ const Namespaces = {
42
+ svg: "http://www.w3.org/2000/svg",
43
+ mathml: "http://www.w3.org/1998/Math/MathML",
15
44
  xlink: "http://www.w3.org/1999/xlink",
16
45
  xml: "http://www.w3.org/XML/1998/namespace"
17
46
  };
47
+ const VoidElements = /*#__PURE__*/new Set(["area", "base", "br", "col", "embed", "hr", "img", "input", "link", "meta", "param", "source", "track", "wbr"]);
48
+ const RawTextElements = /*#__PURE__*/new Set(["style", "script", "noscript", "template", "textarea", "title"]);
18
49
  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",
19
50
  "webview",
20
51
  "isindex", "listing", "multicol", "nextid", "noindex", "search"]);
21
52
 
22
- const effect = (fn, effectFn, initial) => solidJs.createRenderEffect(fn, effectFn, initial, {
53
+ const transparentOptions = {
23
54
  transparent: true
24
- });
55
+ };
56
+ const effect = (fn, effectFn, options) => solidJs.createRenderEffect(fn, effectFn, options ? {
57
+ transparent: true,
58
+ ...options
59
+ } : transparentOptions);
25
60
  const memo = fn => solidJs.createMemo(() => fn());
26
61
 
27
62
  function reconcileArrays(parentNode, a, b) {
@@ -82,27 +117,35 @@ function reconcileArrays(parentNode, a, b) {
82
117
  }
83
118
 
84
119
  const $$EVENTS = "_$DX_DELEGATE";
85
- function render(code, element, init, options = {}) {
120
+ const INNER_OWNED = {};
121
+ function render$1(code, element, init, options = {}) {
122
+ const renderRoot = getChildRoot(element);
86
123
  let disposer;
87
124
  solidJs.createRoot(dispose => {
88
125
  disposer = dispose;
89
- element === document ? solidJs.flatten(code) : insert(element, code(), element.firstChild ? null : undefined, init);
126
+ if (element === document) {
127
+ const tree = code();
128
+ effect(() => solidJs.flatten(tree), () => {});
129
+ } else {
130
+ const tree = code();
131
+ insert(element, () => tree, renderRoot.firstChild ? null : undefined, init, options.insertOptions);
132
+ }
90
133
  }, {
91
134
  id: options.renderId
92
135
  });
93
136
  return () => {
94
137
  disposer();
95
- element.textContent = "";
138
+ renderRoot.textContent = "";
96
139
  };
97
140
  }
98
- function template(html, isImportNode, isSVG, isMathML) {
141
+ function create(html, bypassGuard, flag) {
142
+ const t = document.createElement("template");
143
+ t.innerHTML = html;
144
+ return flag === 2 ? t.content.firstChild.firstChild : t.content.firstChild;
145
+ }
146
+ function template(html, flag) {
99
147
  let node;
100
- const create = bypassGuard => {
101
- const t = isMathML ? document.createElementNS("http://www.w3.org/1998/Math/MathML", "template") : document.createElement("template");
102
- t.innerHTML = html;
103
- return isSVG ? t.content.firstChild.firstChild : isMathML ? t.firstChild : t.content.firstChild;
104
- };
105
- const fn = isImportNode ? bypassGuard => solidJs.untrack(() => document.importNode(node || (node = create()), true)) : bypassGuard => (node || (node = create())).cloneNode(true);
148
+ const fn = flag === 1 ? bypassGuard => document.importNode(node || (node = create(html, bypassGuard, flag)), true) : bypassGuard => (node || (node = create(html, bypassGuard, flag))).cloneNode(true);
106
149
  return fn;
107
150
  }
108
151
  function delegateEvents(eventNames, document = window.document) {
@@ -131,16 +174,16 @@ function setAttribute(node, name, value) {
131
174
  }
132
175
  function setAttributeNS(node, namespace, name, value) {
133
176
  if (isHydrating(node)) return;
134
- if (value == null) node.removeAttributeNS(namespace, name);else node.setAttributeNS(namespace, name, value);
177
+ if (value == null || value === false) node.removeAttributeNS(namespace, name.indexOf(":") > -1 ? name.split(":").pop() : name);else node.setAttributeNS(namespace, name, value === true ? "" : value);
135
178
  }
136
- function className(node, value, isSVG, prev) {
179
+ function className(node, value, prev) {
137
180
  if (isHydrating(node)) return;
138
181
  if (value == null || value === false) {
139
182
  prev && node.removeAttribute("class");
140
183
  return;
141
184
  }
142
185
  if (typeof value === "string") {
143
- value !== prev && (isSVG ? node.setAttribute("class", value) : node.className = value);
186
+ value !== prev && node.setAttribute("class", value);
144
187
  return;
145
188
  }
146
189
  if (typeof prev === "string") {
@@ -183,7 +226,6 @@ function style(node, value, prev) {
183
226
  if (typeof value === "string") return nodeStyle.cssText = value;
184
227
  typeof prev === "string" && (nodeStyle.cssText = prev = undefined);
185
228
  prev || (prev = {});
186
- value || (value = {});
187
229
  let v, s;
188
230
  for (s in value) {
189
231
  v = value[s];
@@ -195,14 +237,9 @@ function style(node, value, prev) {
195
237
  function setStyleProperty(node, name, value) {
196
238
  value != null ? node.style.setProperty(name, value) : node.style.removeProperty(name);
197
239
  }
198
- function spread(node, props = {}, isSVG, skipChildren) {
240
+ function spread(node, props = {}, skipChildren) {
199
241
  const prevProps = {};
200
- if (!skipChildren) {
201
- effect(() => normalize(props.children, prevProps.children), value => {
202
- insertExpression(node, value, prevProps.children);
203
- prevProps.children = value;
204
- });
205
- }
242
+ if (!skipChildren) insert(node, () => props.children);
206
243
  effect(() => {
207
244
  const r = props.ref;
208
245
  (typeof r === "function" || Array.isArray(r)) && ref(() => r, node);
@@ -214,7 +251,7 @@ function spread(node, props = {}, isSVG, skipChildren) {
214
251
  newProps[prop] = props[prop];
215
252
  }
216
253
  return newProps;
217
- }, props => assign(node, props, isSVG, true, prevProps, true));
254
+ }, props => assign(node, props, true, prevProps, true));
218
255
  return prevProps;
219
256
  }
220
257
  function dynamicProperty(props, key) {
@@ -234,11 +271,12 @@ function ref(fn, element) {
234
271
  const resolved = solidJs.untrack(fn);
235
272
  solidJs.runWithOwner(null, () => applyRef(resolved, element));
236
273
  }
237
- function insert(parent, accessor, marker, initial) {
274
+ function insert(parent, accessor, marker, initial, options) {
275
+ const childRoot = getChildRoot(parent);
238
276
  const multi = marker !== undefined;
239
277
  if (multi && !initial) initial = [];
240
278
  if (isHydrating(parent)) {
241
- if (!multi && initial === undefined && parent) initial = [...parent.childNodes];
279
+ if (!multi && initial === undefined && parent) initial = [...childRoot.childNodes];
242
280
  if (Array.isArray(initial)) {
243
281
  let j = 0;
244
282
  for (let i = 0; i < initial.length; i++) {
@@ -251,27 +289,61 @@ function insert(parent, accessor, marker, initial) {
251
289
  accessor = normalize(accessor, initial, multi, true);
252
290
  if (typeof accessor !== "function") return insertExpression(parent, accessor, initial, marker);
253
291
  }
254
- effect(prev => normalize(accessor, prev, multi), (value, current) => insertExpression(parent, value, current, marker), initial);
255
- }
256
- function assign(node, props, isSVG, skipChildren, prevProps = {}, skipRef = false) {
292
+ if (multi && initial.length === 0) {
293
+ const placeholder = document.createTextNode("");
294
+ childRoot.insertBefore(placeholder, marker);
295
+ initial = [placeholder];
296
+ }
297
+ let current = initial;
298
+ effect(() => {
299
+ const value = normalize(accessor(), current, multi, true);
300
+ if (typeof value !== "function") return value;
301
+ effect(() => normalize(value, current, multi), inner => {
302
+ insertExpression(parent, inner, current, marker);
303
+ current = inner;
304
+ }, options);
305
+ return INNER_OWNED;
306
+ }, value => {
307
+ if (value === INNER_OWNED) return;
308
+ insertExpression(parent, value, current, marker);
309
+ current = value;
310
+ }, options);
311
+ }
312
+ function assign(node, props, skipChildren, prevProps = {}, skipRef = false) {
313
+ const nodeName = node.nodeName;
257
314
  props || (props = {});
258
315
  for (const prop in prevProps) {
259
316
  if (!(prop in props)) {
260
317
  if (prop === "children") continue;
261
- prevProps[prop] = assignProp(node, prop, null, prevProps[prop], isSVG, skipRef);
318
+ prevProps[prop] = assignProp(node, prop, null, prevProps[prop], skipRef, nodeName);
262
319
  }
263
320
  }
264
321
  for (const prop in props) {
265
322
  if (prop === "children") {
266
- if (!skipChildren) insertExpression(node, props.children);
323
+ if (!skipChildren) insertExpression(node, normalize(props.children, undefined, false));
267
324
  continue;
268
325
  }
269
- const value = props[prop];
270
- prevProps[prop] = assignProp(node, prop, value, prevProps[prop], isSVG, skipRef);
326
+ prevProps[prop] = assignProp(node, prop, props[prop], prevProps[prop], skipRef, nodeName);
327
+ }
328
+ }
329
+ function loadModuleAssets(mapping) {
330
+ const hy = globalThis._$HY;
331
+ if (!hy) return;
332
+ const pending = [];
333
+ for (const moduleUrl in mapping) {
334
+ if (hy.modules[moduleUrl]) continue;
335
+ const entryUrl = mapping[moduleUrl];
336
+ if (!hy.loading[moduleUrl]) {
337
+ hy.loading[moduleUrl] = import(entryUrl).then(mod => {
338
+ hy.modules[moduleUrl] = mod;
339
+ });
340
+ }
341
+ pending.push(hy.loading[moduleUrl]);
271
342
  }
343
+ return pending.length ? Promise.all(pending).then(() => {}) : undefined;
272
344
  }
273
345
  function hydrate$1(code, element, options = {}) {
274
- if (globalThis._$HY.done) return render(code, element, [...element.childNodes], options);
346
+ if (globalThis._$HY.done) return render$1(code, element, [...getChildRoot(element).childNodes], options);
275
347
  options.renderId ||= "";
276
348
  if (!globalThis._$HY.modules) globalThis._$HY.modules = {};
277
349
  if (!globalThis._$HY.loading) globalThis._$HY.loading = {};
@@ -280,6 +352,7 @@ function hydrate$1(code, element, options = {}) {
280
352
  solidJs.sharedConfig.load = id => globalThis._$HY.r[id];
281
353
  solidJs.sharedConfig.has = id => id in globalThis._$HY.r;
282
354
  solidJs.sharedConfig.gather = root => gatherHydratable(element, root);
355
+ solidJs.sharedConfig.loadModuleAssets = loadModuleAssets;
283
356
  solidJs.sharedConfig.cleanupFragment = id => {
284
357
  const tpl = document.getElementById("pl-" + id);
285
358
  if (tpl) {
@@ -298,9 +371,27 @@ function hydrate$1(code, element, options = {}) {
298
371
  };
299
372
  solidJs.sharedConfig.registry = new Map();
300
373
  solidJs.sharedConfig.hydrating = true;
374
+ const rootMapping = globalThis._$HY.r && globalThis._$HY.r["_assets"];
375
+ if (rootMapping && typeof rootMapping === "object") {
376
+ const p = loadModuleAssets(rootMapping);
377
+ if (p) {
378
+ gatherHydratable(element, options.renderId);
379
+ let disposer;
380
+ p.then(() => {
381
+ try {
382
+ disposer = render$1(code, element, [...getChildRoot(element).childNodes], options);
383
+ } finally {
384
+ solidJs.sharedConfig.hydrating = false;
385
+ }
386
+ }, () => {
387
+ solidJs.sharedConfig.hydrating = false;
388
+ });
389
+ return () => disposer && disposer();
390
+ }
391
+ }
301
392
  try {
302
393
  gatherHydratable(element, options.renderId);
303
- return render(code, element, [...element.childNodes], options);
394
+ return render$1(code, element, [...getChildRoot(element).childNodes], options);
304
395
  } finally {
305
396
  solidJs.sharedConfig.hydrating = false;
306
397
  }
@@ -343,7 +434,7 @@ function getNextMarker(start) {
343
434
  return [end, current];
344
435
  }
345
436
  function getFirstChild(node, expectedTag) {
346
- const child = node.firstChild;
437
+ const child = getChildRoot(node).firstChild;
347
438
  return child;
348
439
  }
349
440
  function getNextSibling(node, expectedTag) {
@@ -376,6 +467,9 @@ function runHydrationEvents() {
376
467
  function isHydrating(node) {
377
468
  return solidJs.sharedConfig.hydrating && (!node || node.isConnected);
378
469
  }
470
+ function getChildRoot(node) {
471
+ return node && node.localName === "template" ? node.content : node;
472
+ }
379
473
  function toggleClassKey(node, key, value) {
380
474
  const classNames = key.trim().split(/\s+/);
381
475
  for (let i = 0, nameLen = classNames.length; i < nameLen; i++) node.classList.toggle(classNames[i], value);
@@ -394,18 +488,20 @@ function flattenClassList(list, result) {
394
488
  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;
395
489
  }
396
490
  }
397
- function assignProp(node, prop, value, prev, isSVG, skipRef) {
398
- let forceProp;
491
+ function assignProp(node, prop, value, prev, skipRef, nodeName) {
399
492
  if (prop === "style") return style(node, value, prev), value;
400
- if (prop === "class") return className(node, value, isSVG, prev), value;
401
- if (value === prev) return prev;
493
+ if (prop === "class") return className(node, value, prev), value;
494
+ if (value === prev && DOMWithState[nodeName]?.[prop] !== 1) return prev;
402
495
  if (prop === "ref") {
403
496
  if (!skipRef && value) ref(() => value, node);
404
- } else if (prop.slice(0, 3) === "on:") {
497
+ return value;
498
+ }
499
+ const hasNamespace = prop.indexOf(":") > -1;
500
+ if (hasNamespace && prop.slice(0, 3) === "on:") {
405
501
  const e = prop.slice(3);
406
502
  prev && node.removeEventListener(e, prev, typeof prev !== "function" && prev);
407
503
  value && node.addEventListener(e, value, typeof value !== "function" && value);
408
- } else if (prop.slice(0, 2) === "on") {
504
+ } else if (!hasNamespace && prop.slice(0, 2) === "on") {
409
505
  const name = prop.slice(2).toLowerCase();
410
506
  const delegate = DelegatedEvents.has(name);
411
507
  if (!delegate && prev) {
@@ -416,11 +512,11 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
416
512
  addEventListener(node, name, value, delegate);
417
513
  delegate && delegateEvents([name]);
418
514
  }
419
- } else if ((forceProp = prop.slice(0, 5) === "prop:") || ChildProperties.has(prop) || !isSVG && Properties.has(prop)) {
420
- if (forceProp) prop = prop.slice(5);else if (isHydrating(node)) return value;
421
- if (prop === "value" && node.nodeName === "SELECT") queueMicrotask(() => node.value = value) || (node.value = value);else node[prop] = value;
515
+ } else if (hasNamespace && prop.slice(0, 5) === "prop:" || ChildProperties.has(prop) || DOMWithState[nodeName]?.[prop]) {
516
+ if (hasNamespace) prop = prop.slice(5);else if (isHydrating(node)) return value;
517
+ if (prop === "value" && nodeName === "SELECT") queueMicrotask(() => node.value = value) || (node.value = value);else node[prop] = value;
422
518
  } else {
423
- const ns = isSVG && prop.indexOf(":") > -1 && SVGNamespace[prop.split(":")[0]];
519
+ const ns = hasNamespace && Namespaces[prop.split(":")[0]];
424
520
  if (ns) setAttributeNS(node, ns, prop, value);else setAttribute(node, prop, value);
425
521
  }
426
522
  return value;
@@ -478,21 +574,22 @@ function eventHandler(e) {
478
574
  function insertExpression(parent, value, current, marker) {
479
575
  if (isHydrating(parent)) return;
480
576
  if (value === current) return;
577
+ const childRoot = getChildRoot(parent);
481
578
  const t = typeof value,
482
579
  multi = marker !== undefined;
483
580
  if (t === "string" || t === "number") {
484
581
  const tc = typeof current;
485
582
  if (tc === "string" || tc === "number") {
486
- parent.firstChild.data = value;
487
- } else parent.textContent = value;
583
+ childRoot.firstChild.data = value;
584
+ } else childRoot.textContent = value;
488
585
  } else if (value === undefined) {
489
586
  cleanChildren(parent, current, marker);
490
587
  } else if (value.nodeType) {
491
588
  if (Array.isArray(current)) {
492
589
  cleanChildren(parent, current, multi ? marker : null, value);
493
- } else if (current === undefined || !parent.firstChild) {
494
- parent.appendChild(value);
495
- } else parent.replaceChild(value, parent.firstChild);
590
+ } else if (current === undefined || !childRoot.firstChild) {
591
+ childRoot.appendChild(value);
592
+ } else childRoot.replaceChild(value, childRoot.firstChild);
496
593
  } else if (Array.isArray(value)) {
497
594
  const currentArray = current && Array.isArray(current);
498
595
  if (value.length === 0) {
@@ -500,7 +597,7 @@ function insertExpression(parent, value, current, marker) {
500
597
  } else if (currentArray) {
501
598
  if (current.length === 0) {
502
599
  appendNodes(parent, value, marker);
503
- } else reconcileArrays(parent, current, value);
600
+ } else reconcileArrays(childRoot, current, value);
504
601
  } else {
505
602
  current && cleanChildren(parent);
506
603
  appendNodes(parent, value);
@@ -525,9 +622,11 @@ function normalize(value, current, multi, doNotUnwrap) {
525
622
  return value;
526
623
  }
527
624
  function appendNodes(parent, array, marker = null) {
625
+ parent = getChildRoot(parent);
528
626
  for (let i = 0, len = array.length; i < len; i++) parent.insertBefore(array[i], marker);
529
627
  }
530
628
  function cleanChildren(parent, current, marker, replacement) {
629
+ parent = getChildRoot(parent);
531
630
  if (marker === undefined) return parent.textContent = "";
532
631
  if (current.length) {
533
632
  let inserted = false;
@@ -576,13 +675,21 @@ function ssrHydrationKey() {}
576
675
  function resolveSSRNode(node) {}
577
676
  function escape(html) {}
578
677
 
678
+ const mergeProps = solidJs.merge;
579
679
  const isServer = false;
580
680
  const isDev = false;
581
- const SVG_NAMESPACE = "http://www.w3.org/2000/svg";
582
- function createElement(tagName, isSVG = false, is = undefined) {
583
- return isSVG ? document.createElementNS(SVG_NAMESPACE, tagName) : document.createElement(tagName, {
584
- is
585
- });
681
+ function render(code, element, init, options = {}) {
682
+ try {
683
+ const dispose = render$1(code, element, init, {
684
+ ...options,
685
+ insertOptions: {
686
+ schedule: true
687
+ }
688
+ });
689
+ solidJs.flush();
690
+ return dispose;
691
+ } finally {
692
+ }
586
693
  }
587
694
  const hydrate = (...args) => {
588
695
  solidJs.enableHydration();
@@ -608,6 +715,33 @@ function Portal(props) {
608
715
  });
609
716
  return treeMarker;
610
717
  }
718
+ function dynamic(source) {
719
+ const cached = solidJs.createMemo(source, {
720
+ lazy: true
721
+ });
722
+ return props => {
723
+ return solidJs.createMemo(() => {
724
+ const component = cached();
725
+ switch (typeof component) {
726
+ case "function":
727
+ return solidJs.untrack(() => component(props));
728
+ case "string":
729
+ const el = solidJs.sharedConfig.hydrating ? getNextElement() : createElement(component, solidJs.untrack(() => props.is));
730
+ spread(el, props);
731
+ return el;
732
+ }
733
+ });
734
+ };
735
+ }
736
+ function Dynamic(props) {
737
+ const Comp = dynamic(() => props.component);
738
+ return solidJs.createComponent(Comp, solidJs.omit(props, "component"));
739
+ }
740
+ function createElement(tagName, is = undefined) {
741
+ return SVGElements.has(tagName) ? document.createElementNS(Namespaces.svg, tagName) : MathMLElements.has(tagName) ? document.createElementNS(Namespaces.mathml, tagName) : document.createElement(tagName, {
742
+ is
743
+ });
744
+ }
611
745
  function createElementProxy(el, marker) {
612
746
  return new Proxy(el, {
613
747
  get(target, prop) {
@@ -625,25 +759,6 @@ function createElementProxy(el, marker) {
625
759
  }
626
760
  });
627
761
  }
628
- function createDynamic(component, props) {
629
- const cached = solidJs.createMemo(component);
630
- return solidJs.createMemo(() => {
631
- const component = cached();
632
- switch (typeof component) {
633
- case "function":
634
- return solidJs.untrack(() => component(props));
635
- case "string":
636
- const isSvg = SVGElements.has(component);
637
- const el = solidJs.sharedConfig.hydrating ? getNextElement() : createElement(component, isSvg, solidJs.untrack(() => props.is));
638
- spread(el, props, isSvg);
639
- return el;
640
- }
641
- });
642
- }
643
- function Dynamic(props) {
644
- const others = solidJs.omit(props, "component");
645
- return createDynamic(() => props.component, others);
646
- }
647
762
 
648
763
  Object.defineProperty(exports, "Errored", {
649
764
  enumerable: true,
@@ -669,6 +784,14 @@ Object.defineProperty(exports, "NoHydration", {
669
784
  enumerable: true,
670
785
  get: function () { return solidJs.NoHydration; }
671
786
  });
787
+ Object.defineProperty(exports, "Repeat", {
788
+ enumerable: true,
789
+ get: function () { return solidJs.Repeat; }
790
+ });
791
+ Object.defineProperty(exports, "Reveal", {
792
+ enumerable: true,
793
+ get: function () { return solidJs.Reveal; }
794
+ });
672
795
  Object.defineProperty(exports, "Show", {
673
796
  enumerable: true,
674
797
  get: function () { return solidJs.Show; }
@@ -685,10 +808,6 @@ Object.defineProperty(exports, "getOwner", {
685
808
  enumerable: true,
686
809
  get: function () { return solidJs.getOwner; }
687
810
  });
688
- Object.defineProperty(exports, "mergeProps", {
689
- enumerable: true,
690
- get: function () { return solidJs.merge; }
691
- });
692
811
  Object.defineProperty(exports, "untrack", {
693
812
  enumerable: true,
694
813
  get: function () { return solidJs.untrack; }
@@ -696,21 +815,24 @@ Object.defineProperty(exports, "untrack", {
696
815
  exports.Assets = voidFn;
697
816
  exports.ChildProperties = ChildProperties;
698
817
  exports.DOMElements = DOMElements;
818
+ exports.DOMWithState = DOMWithState;
699
819
  exports.DelegatedEvents = DelegatedEvents;
700
820
  exports.Dynamic = Dynamic;
701
821
  exports.HydrationScript = voidFn;
822
+ exports.MathMLElements = MathMLElements;
823
+ exports.Namespaces = Namespaces;
702
824
  exports.Portal = Portal;
703
- exports.Properties = Properties;
825
+ exports.RawTextElements = RawTextElements;
704
826
  exports.RequestContext = RequestContext;
705
827
  exports.SVGElements = SVGElements;
706
- exports.SVGNamespace = SVGNamespace;
828
+ exports.VoidElements = VoidElements;
707
829
  exports.addEventListener = addEventListener;
708
830
  exports.applyRef = applyRef;
709
831
  exports.assign = assign;
710
832
  exports.className = className;
711
833
  exports.clearDelegatedEvents = clearDelegatedEvents;
712
- exports.createDynamic = createDynamic;
713
834
  exports.delegateEvents = delegateEvents;
835
+ exports.dynamic = dynamic;
714
836
  exports.dynamicProperty = dynamicProperty;
715
837
  exports.effect = effect;
716
838
  exports.escape = escape;
@@ -728,6 +850,7 @@ exports.insert = insert;
728
850
  exports.isDev = isDev;
729
851
  exports.isServer = isServer;
730
852
  exports.memo = memo;
853
+ exports.mergeProps = mergeProps;
731
854
  exports.ref = ref;
732
855
  exports.render = render;
733
856
  exports.renderToStream = renderToStream;