@solidjs/web 2.0.0-beta.0 → 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/README.md +27 -4
- package/dist/dev.cjs +238 -107
- package/dist/dev.js +218 -101
- package/dist/server.cjs +196 -105
- package/dist/server.js +182 -103
- package/dist/web.cjs +224 -98
- package/dist/web.js +204 -92
- package/package.json +98 -33
- package/storage/package.json +8 -3
- package/storage/types/src/index.d.ts +147 -21
- package/storage/types/src/jsx.d.ts +29 -0
- package/storage/types/src/server-mock.d.ts +89 -0
- package/storage/types-cjs/index.d.cts +2 -0
- package/storage/types-cjs/package.json +3 -0
- package/storage/types-cjs/src/client.d.cts +1 -0
- package/storage/types-cjs/src/index.d.cts +171 -0
- package/storage/types-cjs/src/jsx.d.cts +29 -0
- package/storage/types-cjs/src/server-mock.d.cts +161 -0
- package/storage/types-cjs/storage/src/index.d.cts +2 -0
- package/types/client.d.ts +31 -17
- package/types/core.d.ts +1 -1
- package/types/index.d.ts +147 -21
- package/types/jsx-properties.d.ts +92 -0
- package/types/jsx.d.ts +4321 -1
- package/types/server-mock.d.ts +89 -0
- package/types/server.d.ts +35 -16
- package/types-cjs/client.d.cts +104 -0
- package/types-cjs/core.d.cts +3 -0
- package/types-cjs/index.d.cts +171 -0
- package/types-cjs/jsx-properties.d.cts +92 -0
- package/types-cjs/jsx.d.cts +4321 -0
- package/types-cjs/package.json +3 -0
- package/types-cjs/server-mock.d.cts +161 -0
- package/types-cjs/server.d.cts +174 -0
package/dist/web.cjs
CHANGED
|
@@ -2,8 +2,34 @@
|
|
|
2
2
|
|
|
3
3
|
var solidJs = require('solid-js');
|
|
4
4
|
|
|
5
|
-
const
|
|
6
|
-
|
|
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
|
|
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
|
|
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
|
-
|
|
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
|
|
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
|
-
|
|
138
|
+
renderRoot.textContent = "";
|
|
96
139
|
};
|
|
97
140
|
}
|
|
98
|
-
function
|
|
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
|
|
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,
|
|
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 &&
|
|
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 = {},
|
|
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,
|
|
254
|
+
}, props => assign(node, props, true, prevProps, true));
|
|
218
255
|
return prevProps;
|
|
219
256
|
}
|
|
220
257
|
function dynamicProperty(props, key) {
|
|
@@ -234,41 +271,79 @@ 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
|
-
if (isHydrating(parent)
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
278
|
+
if (isHydrating(parent)) {
|
|
279
|
+
if (!multi && initial === undefined && parent) initial = [...childRoot.childNodes];
|
|
280
|
+
if (Array.isArray(initial)) {
|
|
281
|
+
let j = 0;
|
|
282
|
+
for (let i = 0; i < initial.length; i++) {
|
|
283
|
+
if (initial[i].nodeType === 8 && initial[i].nodeValue === "!$") initial[i].remove();else initial[j++] = initial[i];
|
|
284
|
+
}
|
|
285
|
+
initial.length = j;
|
|
244
286
|
}
|
|
245
|
-
initial.length = j;
|
|
246
287
|
}
|
|
247
288
|
if (typeof accessor !== "function") {
|
|
248
289
|
accessor = normalize(accessor, initial, multi, true);
|
|
249
290
|
if (typeof accessor !== "function") return insertExpression(parent, accessor, initial, marker);
|
|
250
291
|
}
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
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;
|
|
254
314
|
props || (props = {});
|
|
255
315
|
for (const prop in prevProps) {
|
|
256
316
|
if (!(prop in props)) {
|
|
257
317
|
if (prop === "children") continue;
|
|
258
|
-
prevProps[prop] = assignProp(node, prop, null, prevProps[prop],
|
|
318
|
+
prevProps[prop] = assignProp(node, prop, null, prevProps[prop], skipRef, nodeName);
|
|
259
319
|
}
|
|
260
320
|
}
|
|
261
321
|
for (const prop in props) {
|
|
262
322
|
if (prop === "children") {
|
|
263
|
-
if (!skipChildren) insertExpression(node, props.children);
|
|
323
|
+
if (!skipChildren) insertExpression(node, normalize(props.children, undefined, false));
|
|
264
324
|
continue;
|
|
265
325
|
}
|
|
266
|
-
|
|
267
|
-
prevProps[prop] = assignProp(node, prop, value, prevProps[prop], isSVG, skipRef);
|
|
326
|
+
prevProps[prop] = assignProp(node, prop, props[prop], prevProps[prop], skipRef, nodeName);
|
|
268
327
|
}
|
|
269
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]);
|
|
342
|
+
}
|
|
343
|
+
return pending.length ? Promise.all(pending).then(() => {}) : undefined;
|
|
344
|
+
}
|
|
270
345
|
function hydrate$1(code, element, options = {}) {
|
|
271
|
-
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);
|
|
272
347
|
options.renderId ||= "";
|
|
273
348
|
if (!globalThis._$HY.modules) globalThis._$HY.modules = {};
|
|
274
349
|
if (!globalThis._$HY.loading) globalThis._$HY.loading = {};
|
|
@@ -277,6 +352,7 @@ function hydrate$1(code, element, options = {}) {
|
|
|
277
352
|
solidJs.sharedConfig.load = id => globalThis._$HY.r[id];
|
|
278
353
|
solidJs.sharedConfig.has = id => id in globalThis._$HY.r;
|
|
279
354
|
solidJs.sharedConfig.gather = root => gatherHydratable(element, root);
|
|
355
|
+
solidJs.sharedConfig.loadModuleAssets = loadModuleAssets;
|
|
280
356
|
solidJs.sharedConfig.cleanupFragment = id => {
|
|
281
357
|
const tpl = document.getElementById("pl-" + id);
|
|
282
358
|
if (tpl) {
|
|
@@ -295,9 +371,27 @@ function hydrate$1(code, element, options = {}) {
|
|
|
295
371
|
};
|
|
296
372
|
solidJs.sharedConfig.registry = new Map();
|
|
297
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
|
+
}
|
|
298
392
|
try {
|
|
299
393
|
gatherHydratable(element, options.renderId);
|
|
300
|
-
return render(code, element, [...element.childNodes], options);
|
|
394
|
+
return render$1(code, element, [...getChildRoot(element).childNodes], options);
|
|
301
395
|
} finally {
|
|
302
396
|
solidJs.sharedConfig.hydrating = false;
|
|
303
397
|
}
|
|
@@ -340,7 +434,7 @@ function getNextMarker(start) {
|
|
|
340
434
|
return [end, current];
|
|
341
435
|
}
|
|
342
436
|
function getFirstChild(node, expectedTag) {
|
|
343
|
-
const child = node.firstChild;
|
|
437
|
+
const child = getChildRoot(node).firstChild;
|
|
344
438
|
return child;
|
|
345
439
|
}
|
|
346
440
|
function getNextSibling(node, expectedTag) {
|
|
@@ -373,6 +467,9 @@ function runHydrationEvents() {
|
|
|
373
467
|
function isHydrating(node) {
|
|
374
468
|
return solidJs.sharedConfig.hydrating && (!node || node.isConnected);
|
|
375
469
|
}
|
|
470
|
+
function getChildRoot(node) {
|
|
471
|
+
return node && node.localName === "template" ? node.content : node;
|
|
472
|
+
}
|
|
376
473
|
function toggleClassKey(node, key, value) {
|
|
377
474
|
const classNames = key.trim().split(/\s+/);
|
|
378
475
|
for (let i = 0, nameLen = classNames.length; i < nameLen; i++) node.classList.toggle(classNames[i], value);
|
|
@@ -391,18 +488,20 @@ function flattenClassList(list, result) {
|
|
|
391
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;
|
|
392
489
|
}
|
|
393
490
|
}
|
|
394
|
-
function assignProp(node, prop, value, prev,
|
|
395
|
-
let forceProp;
|
|
491
|
+
function assignProp(node, prop, value, prev, skipRef, nodeName) {
|
|
396
492
|
if (prop === "style") return style(node, value, prev), value;
|
|
397
|
-
if (prop === "class") return className(node, value,
|
|
398
|
-
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;
|
|
399
495
|
if (prop === "ref") {
|
|
400
496
|
if (!skipRef && value) ref(() => value, node);
|
|
401
|
-
|
|
497
|
+
return value;
|
|
498
|
+
}
|
|
499
|
+
const hasNamespace = prop.indexOf(":") > -1;
|
|
500
|
+
if (hasNamespace && prop.slice(0, 3) === "on:") {
|
|
402
501
|
const e = prop.slice(3);
|
|
403
502
|
prev && node.removeEventListener(e, prev, typeof prev !== "function" && prev);
|
|
404
503
|
value && node.addEventListener(e, value, typeof value !== "function" && value);
|
|
405
|
-
} else if (prop.slice(0, 2) === "on") {
|
|
504
|
+
} else if (!hasNamespace && prop.slice(0, 2) === "on") {
|
|
406
505
|
const name = prop.slice(2).toLowerCase();
|
|
407
506
|
const delegate = DelegatedEvents.has(name);
|
|
408
507
|
if (!delegate && prev) {
|
|
@@ -413,11 +512,11 @@ function assignProp(node, prop, value, prev, isSVG, skipRef) {
|
|
|
413
512
|
addEventListener(node, name, value, delegate);
|
|
414
513
|
delegate && delegateEvents([name]);
|
|
415
514
|
}
|
|
416
|
-
} else if (
|
|
417
|
-
if (
|
|
418
|
-
if (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;
|
|
419
518
|
} else {
|
|
420
|
-
const ns =
|
|
519
|
+
const ns = hasNamespace && Namespaces[prop.split(":")[0]];
|
|
421
520
|
if (ns) setAttributeNS(node, ns, prop, value);else setAttribute(node, prop, value);
|
|
422
521
|
}
|
|
423
522
|
return value;
|
|
@@ -475,21 +574,22 @@ function eventHandler(e) {
|
|
|
475
574
|
function insertExpression(parent, value, current, marker) {
|
|
476
575
|
if (isHydrating(parent)) return;
|
|
477
576
|
if (value === current) return;
|
|
577
|
+
const childRoot = getChildRoot(parent);
|
|
478
578
|
const t = typeof value,
|
|
479
579
|
multi = marker !== undefined;
|
|
480
580
|
if (t === "string" || t === "number") {
|
|
481
581
|
const tc = typeof current;
|
|
482
582
|
if (tc === "string" || tc === "number") {
|
|
483
|
-
|
|
484
|
-
} else
|
|
583
|
+
childRoot.firstChild.data = value;
|
|
584
|
+
} else childRoot.textContent = value;
|
|
485
585
|
} else if (value === undefined) {
|
|
486
586
|
cleanChildren(parent, current, marker);
|
|
487
587
|
} else if (value.nodeType) {
|
|
488
588
|
if (Array.isArray(current)) {
|
|
489
589
|
cleanChildren(parent, current, multi ? marker : null, value);
|
|
490
|
-
} else if (current === undefined || !
|
|
491
|
-
|
|
492
|
-
} else
|
|
590
|
+
} else if (current === undefined || !childRoot.firstChild) {
|
|
591
|
+
childRoot.appendChild(value);
|
|
592
|
+
} else childRoot.replaceChild(value, childRoot.firstChild);
|
|
493
593
|
} else if (Array.isArray(value)) {
|
|
494
594
|
const currentArray = current && Array.isArray(current);
|
|
495
595
|
if (value.length === 0) {
|
|
@@ -497,7 +597,7 @@ function insertExpression(parent, value, current, marker) {
|
|
|
497
597
|
} else if (currentArray) {
|
|
498
598
|
if (current.length === 0) {
|
|
499
599
|
appendNodes(parent, value, marker);
|
|
500
|
-
} else reconcileArrays(
|
|
600
|
+
} else reconcileArrays(childRoot, current, value);
|
|
501
601
|
} else {
|
|
502
602
|
current && cleanChildren(parent);
|
|
503
603
|
appendNodes(parent, value);
|
|
@@ -522,9 +622,11 @@ function normalize(value, current, multi, doNotUnwrap) {
|
|
|
522
622
|
return value;
|
|
523
623
|
}
|
|
524
624
|
function appendNodes(parent, array, marker = null) {
|
|
625
|
+
parent = getChildRoot(parent);
|
|
525
626
|
for (let i = 0, len = array.length; i < len; i++) parent.insertBefore(array[i], marker);
|
|
526
627
|
}
|
|
527
628
|
function cleanChildren(parent, current, marker, replacement) {
|
|
629
|
+
parent = getChildRoot(parent);
|
|
528
630
|
if (marker === undefined) return parent.textContent = "";
|
|
529
631
|
if (current.length) {
|
|
530
632
|
let inserted = false;
|
|
@@ -548,12 +650,6 @@ function gatherHydratable(element, root) {
|
|
|
548
650
|
function getHydrationKey() {
|
|
549
651
|
return solidJs.sharedConfig.getNextContextId();
|
|
550
652
|
}
|
|
551
|
-
function NoHydration(props) {
|
|
552
|
-
return solidJs.sharedConfig.hydrating ? undefined : props.children;
|
|
553
|
-
}
|
|
554
|
-
function Hydration(props) {
|
|
555
|
-
return props.children;
|
|
556
|
-
}
|
|
557
653
|
const voidFn = () => undefined;
|
|
558
654
|
const RequestContext = Symbol();
|
|
559
655
|
|
|
@@ -579,13 +675,21 @@ function ssrHydrationKey() {}
|
|
|
579
675
|
function resolveSSRNode(node) {}
|
|
580
676
|
function escape(html) {}
|
|
581
677
|
|
|
678
|
+
const mergeProps = solidJs.merge;
|
|
582
679
|
const isServer = false;
|
|
583
680
|
const isDev = false;
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
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
|
+
}
|
|
589
693
|
}
|
|
590
694
|
const hydrate = (...args) => {
|
|
591
695
|
solidJs.enableHydration();
|
|
@@ -611,6 +715,33 @@ function Portal(props) {
|
|
|
611
715
|
});
|
|
612
716
|
return treeMarker;
|
|
613
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
|
+
}
|
|
614
745
|
function createElementProxy(el, marker) {
|
|
615
746
|
return new Proxy(el, {
|
|
616
747
|
get(target, prop) {
|
|
@@ -628,25 +759,6 @@ function createElementProxy(el, marker) {
|
|
|
628
759
|
}
|
|
629
760
|
});
|
|
630
761
|
}
|
|
631
|
-
function createDynamic(component, props) {
|
|
632
|
-
const cached = solidJs.createMemo(component);
|
|
633
|
-
return solidJs.createMemo(() => {
|
|
634
|
-
const component = cached();
|
|
635
|
-
switch (typeof component) {
|
|
636
|
-
case "function":
|
|
637
|
-
return solidJs.untrack(() => component(props));
|
|
638
|
-
case "string":
|
|
639
|
-
const isSvg = SVGElements.has(component);
|
|
640
|
-
const el = solidJs.sharedConfig.hydrating ? getNextElement() : createElement(component, isSvg, solidJs.untrack(() => props.is));
|
|
641
|
-
spread(el, props, isSvg);
|
|
642
|
-
return el;
|
|
643
|
-
}
|
|
644
|
-
});
|
|
645
|
-
}
|
|
646
|
-
function Dynamic(props) {
|
|
647
|
-
const others = solidJs.omit(props, "component");
|
|
648
|
-
return createDynamic(() => props.component, others);
|
|
649
|
-
}
|
|
650
762
|
|
|
651
763
|
Object.defineProperty(exports, "Errored", {
|
|
652
764
|
enumerable: true,
|
|
@@ -656,6 +768,10 @@ Object.defineProperty(exports, "For", {
|
|
|
656
768
|
enumerable: true,
|
|
657
769
|
get: function () { return solidJs.For; }
|
|
658
770
|
});
|
|
771
|
+
Object.defineProperty(exports, "Hydration", {
|
|
772
|
+
enumerable: true,
|
|
773
|
+
get: function () { return solidJs.Hydration; }
|
|
774
|
+
});
|
|
659
775
|
Object.defineProperty(exports, "Loading", {
|
|
660
776
|
enumerable: true,
|
|
661
777
|
get: function () { return solidJs.Loading; }
|
|
@@ -664,6 +780,18 @@ Object.defineProperty(exports, "Match", {
|
|
|
664
780
|
enumerable: true,
|
|
665
781
|
get: function () { return solidJs.Match; }
|
|
666
782
|
});
|
|
783
|
+
Object.defineProperty(exports, "NoHydration", {
|
|
784
|
+
enumerable: true,
|
|
785
|
+
get: function () { return solidJs.NoHydration; }
|
|
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
|
+
});
|
|
667
795
|
Object.defineProperty(exports, "Show", {
|
|
668
796
|
enumerable: true,
|
|
669
797
|
get: function () { return solidJs.Show; }
|
|
@@ -680,10 +808,6 @@ Object.defineProperty(exports, "getOwner", {
|
|
|
680
808
|
enumerable: true,
|
|
681
809
|
get: function () { return solidJs.getOwner; }
|
|
682
810
|
});
|
|
683
|
-
Object.defineProperty(exports, "mergeProps", {
|
|
684
|
-
enumerable: true,
|
|
685
|
-
get: function () { return solidJs.merge; }
|
|
686
|
-
});
|
|
687
811
|
Object.defineProperty(exports, "untrack", {
|
|
688
812
|
enumerable: true,
|
|
689
813
|
get: function () { return solidJs.untrack; }
|
|
@@ -691,23 +815,24 @@ Object.defineProperty(exports, "untrack", {
|
|
|
691
815
|
exports.Assets = voidFn;
|
|
692
816
|
exports.ChildProperties = ChildProperties;
|
|
693
817
|
exports.DOMElements = DOMElements;
|
|
818
|
+
exports.DOMWithState = DOMWithState;
|
|
694
819
|
exports.DelegatedEvents = DelegatedEvents;
|
|
695
820
|
exports.Dynamic = Dynamic;
|
|
696
|
-
exports.Hydration = Hydration;
|
|
697
821
|
exports.HydrationScript = voidFn;
|
|
698
|
-
exports.
|
|
822
|
+
exports.MathMLElements = MathMLElements;
|
|
823
|
+
exports.Namespaces = Namespaces;
|
|
699
824
|
exports.Portal = Portal;
|
|
700
|
-
exports.
|
|
825
|
+
exports.RawTextElements = RawTextElements;
|
|
701
826
|
exports.RequestContext = RequestContext;
|
|
702
827
|
exports.SVGElements = SVGElements;
|
|
703
|
-
exports.
|
|
828
|
+
exports.VoidElements = VoidElements;
|
|
704
829
|
exports.addEventListener = addEventListener;
|
|
705
830
|
exports.applyRef = applyRef;
|
|
706
831
|
exports.assign = assign;
|
|
707
832
|
exports.className = className;
|
|
708
833
|
exports.clearDelegatedEvents = clearDelegatedEvents;
|
|
709
|
-
exports.createDynamic = createDynamic;
|
|
710
834
|
exports.delegateEvents = delegateEvents;
|
|
835
|
+
exports.dynamic = dynamic;
|
|
711
836
|
exports.dynamicProperty = dynamicProperty;
|
|
712
837
|
exports.effect = effect;
|
|
713
838
|
exports.escape = escape;
|
|
@@ -725,6 +850,7 @@ exports.insert = insert;
|
|
|
725
850
|
exports.isDev = isDev;
|
|
726
851
|
exports.isServer = isServer;
|
|
727
852
|
exports.memo = memo;
|
|
853
|
+
exports.mergeProps = mergeProps;
|
|
728
854
|
exports.ref = ref;
|
|
729
855
|
exports.render = render;
|
|
730
856
|
exports.renderToStream = renderToStream;
|