elit 1.0.0-test → 1.1.0
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/LICENSE +21 -0
- package/README.md +388 -21
- package/dist/index.d.mts +130 -1
- package/dist/index.d.ts +130 -1
- package/dist/index.global.js +35 -2064
- package/dist/index.js +35 -2266
- package/dist/index.mjs +34 -2038
- package/package.json +14 -7
package/dist/index.global.js
CHANGED
|
@@ -1,2064 +1,35 @@
|
|
|
1
|
-
|
|
2
|
-
var DomLib = (() => {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
b: () => b,
|
|
37
|
-
base: () => base,
|
|
38
|
-
batchRender: () => batchRender,
|
|
39
|
-
bdi: () => bdi,
|
|
40
|
-
bdo: () => bdo,
|
|
41
|
-
bindChecked: () => bindChecked,
|
|
42
|
-
bindValue: () => bindValue,
|
|
43
|
-
blockquote: () => blockquote,
|
|
44
|
-
body: () => body,
|
|
45
|
-
br: () => br,
|
|
46
|
-
button: () => button,
|
|
47
|
-
canvas: () => canvas,
|
|
48
|
-
caption: () => caption,
|
|
49
|
-
cite: () => cite,
|
|
50
|
-
cleanupUnused: () => cleanupUnused,
|
|
51
|
-
code: () => code,
|
|
52
|
-
col: () => col,
|
|
53
|
-
colgroup: () => colgroup,
|
|
54
|
-
computed: () => computed,
|
|
55
|
-
createElementFactory: () => createElementFactory,
|
|
56
|
-
createRouter: () => createRouter,
|
|
57
|
-
createRouterView: () => createRouterView,
|
|
58
|
-
createState: () => createState,
|
|
59
|
-
createVirtualList: () => createVirtualList,
|
|
60
|
-
data: () => data,
|
|
61
|
-
datalist: () => datalist,
|
|
62
|
-
dd: () => dd,
|
|
63
|
-
debounce: () => debounce,
|
|
64
|
-
del: () => del,
|
|
65
|
-
details: () => details,
|
|
66
|
-
dfn: () => dfn,
|
|
67
|
-
dialog: () => dialog,
|
|
68
|
-
div: () => div,
|
|
69
|
-
dl: () => dl,
|
|
70
|
-
domNode: () => domNode,
|
|
71
|
-
dt: () => dt,
|
|
72
|
-
effect: () => effect,
|
|
73
|
-
elements: () => elements,
|
|
74
|
-
em: () => em,
|
|
75
|
-
embed: () => embed,
|
|
76
|
-
fieldset: () => fieldset,
|
|
77
|
-
figcaption: () => figcaption,
|
|
78
|
-
figure: () => figure,
|
|
79
|
-
footer: () => footer,
|
|
80
|
-
form: () => form,
|
|
81
|
-
h1: () => h1,
|
|
82
|
-
h2: () => h2,
|
|
83
|
-
h3: () => h3,
|
|
84
|
-
h4: () => h4,
|
|
85
|
-
h5: () => h5,
|
|
86
|
-
h6: () => h6,
|
|
87
|
-
head: () => head,
|
|
88
|
-
header: () => header,
|
|
89
|
-
hr: () => hr,
|
|
90
|
-
html: () => html,
|
|
91
|
-
i: () => i,
|
|
92
|
-
iframe: () => iframe,
|
|
93
|
-
img: () => img,
|
|
94
|
-
input: () => input,
|
|
95
|
-
ins: () => ins,
|
|
96
|
-
jsonToVNode: () => jsonToVNode,
|
|
97
|
-
kbd: () => kbd,
|
|
98
|
-
label: () => label,
|
|
99
|
-
lazy: () => lazy,
|
|
100
|
-
legend: () => legend,
|
|
101
|
-
li: () => li,
|
|
102
|
-
link: () => link,
|
|
103
|
-
main: () => main,
|
|
104
|
-
map: () => map,
|
|
105
|
-
mark: () => mark,
|
|
106
|
-
mathMath: () => mathMath,
|
|
107
|
-
mathMfrac: () => mathMfrac,
|
|
108
|
-
mathMi: () => mathMi,
|
|
109
|
-
mathMn: () => mathMn,
|
|
110
|
-
mathMo: () => mathMo,
|
|
111
|
-
mathMroot: () => mathMroot,
|
|
112
|
-
mathMrow: () => mathMrow,
|
|
113
|
-
mathMs: () => mathMs,
|
|
114
|
-
mathMsqrt: () => mathMsqrt,
|
|
115
|
-
mathMsub: () => mathMsub,
|
|
116
|
-
mathMsup: () => mathMsup,
|
|
117
|
-
mathMtext: () => mathMtext,
|
|
118
|
-
menu: () => menu,
|
|
119
|
-
meta: () => meta,
|
|
120
|
-
meter: () => meter,
|
|
121
|
-
nav: () => nav,
|
|
122
|
-
noscript: () => noscript,
|
|
123
|
-
object: () => object,
|
|
124
|
-
ol: () => ol,
|
|
125
|
-
optgroup: () => optgroup,
|
|
126
|
-
option: () => option,
|
|
127
|
-
output: () => output,
|
|
128
|
-
p: () => p,
|
|
129
|
-
param: () => param,
|
|
130
|
-
picture: () => picture,
|
|
131
|
-
portal: () => portal,
|
|
132
|
-
pre: () => pre,
|
|
133
|
-
progress: () => progress,
|
|
134
|
-
q: () => q,
|
|
135
|
-
reactive: () => reactive,
|
|
136
|
-
reactiveAs: () => reactiveAs,
|
|
137
|
-
renderChunked: () => renderChunked,
|
|
138
|
-
renderJson: () => renderJson,
|
|
139
|
-
renderJsonToString: () => renderJsonToString,
|
|
140
|
-
renderToHead: () => renderToHead,
|
|
141
|
-
renderToString: () => renderToString,
|
|
142
|
-
renderVNode: () => renderVNode,
|
|
143
|
-
renderVNodeToString: () => renderVNodeToString,
|
|
144
|
-
routerLink: () => routerLink,
|
|
145
|
-
rp: () => rp,
|
|
146
|
-
rt: () => rt,
|
|
147
|
-
ruby: () => ruby,
|
|
148
|
-
s: () => s,
|
|
149
|
-
samp: () => samp,
|
|
150
|
-
script: () => script,
|
|
151
|
-
section: () => section,
|
|
152
|
-
select: () => select,
|
|
153
|
-
setTitle: () => setTitle,
|
|
154
|
-
slot: () => slot,
|
|
155
|
-
small: () => small,
|
|
156
|
-
source: () => source,
|
|
157
|
-
span: () => span,
|
|
158
|
-
strong: () => strong,
|
|
159
|
-
style: () => style,
|
|
160
|
-
sub: () => sub,
|
|
161
|
-
summary: () => summary,
|
|
162
|
-
sup: () => sup,
|
|
163
|
-
svgAnimate: () => svgAnimate,
|
|
164
|
-
svgAnimateMotion: () => svgAnimateMotion,
|
|
165
|
-
svgAnimateTransform: () => svgAnimateTransform,
|
|
166
|
-
svgCircle: () => svgCircle,
|
|
167
|
-
svgClipPath: () => svgClipPath,
|
|
168
|
-
svgDefs: () => svgDefs,
|
|
169
|
-
svgEllipse: () => svgEllipse,
|
|
170
|
-
svgFeBlend: () => svgFeBlend,
|
|
171
|
-
svgFeColorMatrix: () => svgFeColorMatrix,
|
|
172
|
-
svgFeComponentTransfer: () => svgFeComponentTransfer,
|
|
173
|
-
svgFeComposite: () => svgFeComposite,
|
|
174
|
-
svgFeConvolveMatrix: () => svgFeConvolveMatrix,
|
|
175
|
-
svgFeDiffuseLighting: () => svgFeDiffuseLighting,
|
|
176
|
-
svgFeDisplacementMap: () => svgFeDisplacementMap,
|
|
177
|
-
svgFeFlood: () => svgFeFlood,
|
|
178
|
-
svgFeGaussianBlur: () => svgFeGaussianBlur,
|
|
179
|
-
svgFeMorphology: () => svgFeMorphology,
|
|
180
|
-
svgFeOffset: () => svgFeOffset,
|
|
181
|
-
svgFeSpecularLighting: () => svgFeSpecularLighting,
|
|
182
|
-
svgFeTile: () => svgFeTile,
|
|
183
|
-
svgFeTurbulence: () => svgFeTurbulence,
|
|
184
|
-
svgFilter: () => svgFilter,
|
|
185
|
-
svgForeignObject: () => svgForeignObject,
|
|
186
|
-
svgG: () => svgG,
|
|
187
|
-
svgImage: () => svgImage,
|
|
188
|
-
svgLine: () => svgLine,
|
|
189
|
-
svgLinearGradient: () => svgLinearGradient,
|
|
190
|
-
svgMarker: () => svgMarker,
|
|
191
|
-
svgMask: () => svgMask,
|
|
192
|
-
svgPath: () => svgPath,
|
|
193
|
-
svgPattern: () => svgPattern,
|
|
194
|
-
svgPolygon: () => svgPolygon,
|
|
195
|
-
svgPolyline: () => svgPolyline,
|
|
196
|
-
svgRadialGradient: () => svgRadialGradient,
|
|
197
|
-
svgRect: () => svgRect,
|
|
198
|
-
svgSet: () => svgSet,
|
|
199
|
-
svgStop: () => svgStop,
|
|
200
|
-
svgSvg: () => svgSvg,
|
|
201
|
-
svgSymbol: () => svgSymbol,
|
|
202
|
-
svgText: () => svgText,
|
|
203
|
-
svgTspan: () => svgTspan,
|
|
204
|
-
svgUse: () => svgUse,
|
|
205
|
-
table: () => table,
|
|
206
|
-
tbody: () => tbody,
|
|
207
|
-
td: () => td,
|
|
208
|
-
template: () => template,
|
|
209
|
-
text: () => text,
|
|
210
|
-
textarea: () => textarea,
|
|
211
|
-
tfoot: () => tfoot,
|
|
212
|
-
th: () => th,
|
|
213
|
-
thead: () => thead,
|
|
214
|
-
throttle: () => throttle,
|
|
215
|
-
time: () => time,
|
|
216
|
-
title: () => title,
|
|
217
|
-
tr: () => tr,
|
|
218
|
-
track: () => track,
|
|
219
|
-
u: () => u,
|
|
220
|
-
ul: () => ul,
|
|
221
|
-
vNodeJsonToVNode: () => vNodeJsonToVNode,
|
|
222
|
-
varElement: () => varElement,
|
|
223
|
-
video: () => video,
|
|
224
|
-
wbr: () => wbr
|
|
225
|
-
});
|
|
226
|
-
|
|
227
|
-
// src/DomNode.ts
|
|
228
|
-
var DomNode = class {
|
|
229
|
-
constructor() {
|
|
230
|
-
this.elementCache = /* @__PURE__ */ new WeakMap();
|
|
231
|
-
this.reactiveNodes = /* @__PURE__ */ new Map();
|
|
232
|
-
}
|
|
233
|
-
createElement(tagName, props = {}, children = []) {
|
|
234
|
-
return { tagName, props, children };
|
|
235
|
-
}
|
|
236
|
-
renderToDOM(vNode, parent) {
|
|
237
|
-
if (vNode == null || vNode === false) {
|
|
238
|
-
return;
|
|
239
|
-
}
|
|
240
|
-
if (typeof vNode !== "object") {
|
|
241
|
-
parent.appendChild(document.createTextNode(String(vNode)));
|
|
242
|
-
return;
|
|
243
|
-
}
|
|
244
|
-
const tagName = vNode.tagName;
|
|
245
|
-
const isSVG = tagName === "svg" || tagName[0] === "s" && tagName[1] === "v" && tagName[2] === "g" || parent.namespaceURI === "http://www.w3.org/2000/svg";
|
|
246
|
-
const el = isSVG ? document.createElementNS("http://www.w3.org/2000/svg", tagName.replace("svg", "").toLowerCase() || tagName) : document.createElement(tagName);
|
|
247
|
-
const props = vNode.props;
|
|
248
|
-
for (const key in props) {
|
|
249
|
-
const value = props[key];
|
|
250
|
-
if (value == null || value === false) continue;
|
|
251
|
-
const c = key.charCodeAt(0);
|
|
252
|
-
if (c === 99) {
|
|
253
|
-
if (key.length < 6 || key[5] === "N") {
|
|
254
|
-
const classValue = Array.isArray(value) ? value.join(" ") : value;
|
|
255
|
-
if (isSVG) {
|
|
256
|
-
el.setAttribute("class", classValue);
|
|
257
|
-
} else {
|
|
258
|
-
el.className = classValue;
|
|
259
|
-
}
|
|
260
|
-
continue;
|
|
261
|
-
}
|
|
262
|
-
} else if (c === 115 && key.length === 5) {
|
|
263
|
-
if (typeof value === "string") {
|
|
264
|
-
el.style.cssText = value;
|
|
265
|
-
} else {
|
|
266
|
-
const s2 = el.style;
|
|
267
|
-
for (const k in value) s2[k] = value[k];
|
|
268
|
-
}
|
|
269
|
-
continue;
|
|
270
|
-
} else if (c === 111 && key.charCodeAt(1) === 110) {
|
|
271
|
-
el[key.toLowerCase()] = value;
|
|
272
|
-
continue;
|
|
273
|
-
} else if (c === 100 && key.length > 20) {
|
|
274
|
-
el.innerHTML = value.__html;
|
|
275
|
-
continue;
|
|
276
|
-
} else if (c === 114 && key.length === 3) {
|
|
277
|
-
setTimeout(() => {
|
|
278
|
-
if (typeof value === "function") {
|
|
279
|
-
value(el);
|
|
280
|
-
} else if (value && "current" in value) {
|
|
281
|
-
value.current = el;
|
|
282
|
-
}
|
|
283
|
-
}, 0);
|
|
284
|
-
continue;
|
|
285
|
-
}
|
|
286
|
-
isSVG ? el.setAttributeNS(null, key, value === true ? "" : String(value)) : el.setAttribute(key, value === true ? "" : String(value));
|
|
287
|
-
}
|
|
288
|
-
const children = vNode.children;
|
|
289
|
-
const len = children.length;
|
|
290
|
-
if (len === 0) {
|
|
291
|
-
parent.appendChild(el);
|
|
292
|
-
return;
|
|
293
|
-
}
|
|
294
|
-
if (len > 30) {
|
|
295
|
-
const fragment = document.createDocumentFragment();
|
|
296
|
-
for (let i2 = 0; i2 < len; i2++) {
|
|
297
|
-
const child = children[i2];
|
|
298
|
-
if (child == null || child === false) continue;
|
|
299
|
-
if (Array.isArray(child)) {
|
|
300
|
-
const childLen = child.length;
|
|
301
|
-
for (let j = 0; j < childLen; j++) {
|
|
302
|
-
const c = child[j];
|
|
303
|
-
if (c != null && c !== false) {
|
|
304
|
-
this.renderToDOM(c, fragment);
|
|
305
|
-
}
|
|
306
|
-
}
|
|
307
|
-
} else {
|
|
308
|
-
this.renderToDOM(child, fragment);
|
|
309
|
-
}
|
|
310
|
-
}
|
|
311
|
-
el.appendChild(fragment);
|
|
312
|
-
} else {
|
|
313
|
-
for (let i2 = 0; i2 < len; i2++) {
|
|
314
|
-
const child = children[i2];
|
|
315
|
-
if (child == null || child === false) continue;
|
|
316
|
-
if (Array.isArray(child)) {
|
|
317
|
-
const childLen = child.length;
|
|
318
|
-
for (let j = 0; j < childLen; j++) {
|
|
319
|
-
const c = child[j];
|
|
320
|
-
if (c != null && c !== false) {
|
|
321
|
-
this.renderToDOM(c, el);
|
|
322
|
-
}
|
|
323
|
-
}
|
|
324
|
-
} else {
|
|
325
|
-
this.renderToDOM(child, el);
|
|
326
|
-
}
|
|
327
|
-
}
|
|
328
|
-
}
|
|
329
|
-
parent.appendChild(el);
|
|
330
|
-
}
|
|
331
|
-
render(rootElement, vNode) {
|
|
332
|
-
const el = typeof rootElement === "string" ? document.getElementById(rootElement.replace("#", "")) : rootElement;
|
|
333
|
-
if (!el) {
|
|
334
|
-
throw new Error(`Element not found: ${rootElement}`);
|
|
335
|
-
}
|
|
336
|
-
if (vNode.children && vNode.children.length > 500) {
|
|
337
|
-
const fragment = document.createDocumentFragment();
|
|
338
|
-
this.renderToDOM(vNode, fragment);
|
|
339
|
-
el.appendChild(fragment);
|
|
340
|
-
} else {
|
|
341
|
-
this.renderToDOM(vNode, el);
|
|
342
|
-
}
|
|
343
|
-
return el;
|
|
344
|
-
}
|
|
345
|
-
batchRender(rootElement, vNodes) {
|
|
346
|
-
const el = typeof rootElement === "string" ? document.getElementById(rootElement.replace("#", "")) : rootElement;
|
|
347
|
-
if (!el) {
|
|
348
|
-
throw new Error(`Element not found: ${rootElement}`);
|
|
349
|
-
}
|
|
350
|
-
const len = vNodes.length;
|
|
351
|
-
if (len > 3e3) {
|
|
352
|
-
const fragment = document.createDocumentFragment();
|
|
353
|
-
let processed = 0;
|
|
354
|
-
const chunkSize = 1500;
|
|
355
|
-
const processChunk = () => {
|
|
356
|
-
const end = Math.min(processed + chunkSize, len);
|
|
357
|
-
for (let i2 = processed; i2 < end; i2++) {
|
|
358
|
-
this.renderToDOM(vNodes[i2], fragment);
|
|
359
|
-
}
|
|
360
|
-
processed = end;
|
|
361
|
-
if (processed >= len) {
|
|
362
|
-
el.appendChild(fragment);
|
|
363
|
-
} else {
|
|
364
|
-
requestAnimationFrame(processChunk);
|
|
365
|
-
}
|
|
366
|
-
};
|
|
367
|
-
processChunk();
|
|
368
|
-
} else {
|
|
369
|
-
const fragment = document.createDocumentFragment();
|
|
370
|
-
for (let i2 = 0; i2 < len; i2++) {
|
|
371
|
-
this.renderToDOM(vNodes[i2], fragment);
|
|
372
|
-
}
|
|
373
|
-
el.appendChild(fragment);
|
|
374
|
-
}
|
|
375
|
-
return el;
|
|
376
|
-
}
|
|
377
|
-
renderChunked(rootElement, vNodes, chunkSize = 5e3, onProgress) {
|
|
378
|
-
const el = typeof rootElement === "string" ? document.getElementById(rootElement.replace("#", "")) : rootElement;
|
|
379
|
-
if (!el) {
|
|
380
|
-
throw new Error(`Element not found: ${rootElement}`);
|
|
381
|
-
}
|
|
382
|
-
const len = vNodes.length;
|
|
383
|
-
let index = 0;
|
|
384
|
-
const renderChunk = () => {
|
|
385
|
-
const end = Math.min(index + chunkSize, len);
|
|
386
|
-
const fragment = document.createDocumentFragment();
|
|
387
|
-
for (let i2 = index; i2 < end; i2++) {
|
|
388
|
-
this.renderToDOM(vNodes[i2], fragment);
|
|
389
|
-
}
|
|
390
|
-
el.appendChild(fragment);
|
|
391
|
-
index = end;
|
|
392
|
-
if (onProgress) onProgress(index, len);
|
|
393
|
-
if (index < len) {
|
|
394
|
-
requestAnimationFrame(renderChunk);
|
|
395
|
-
}
|
|
396
|
-
};
|
|
397
|
-
requestAnimationFrame(renderChunk);
|
|
398
|
-
return el;
|
|
399
|
-
}
|
|
400
|
-
renderToHead(...vNodes) {
|
|
401
|
-
const head2 = document.head;
|
|
402
|
-
if (head2) {
|
|
403
|
-
for (const vNode of vNodes.flat()) {
|
|
404
|
-
vNode && this.renderToDOM(vNode, head2);
|
|
405
|
-
}
|
|
406
|
-
}
|
|
407
|
-
return head2;
|
|
408
|
-
}
|
|
409
|
-
addStyle(cssText) {
|
|
410
|
-
const el = document.createElement("style");
|
|
411
|
-
el.textContent = cssText;
|
|
412
|
-
return document.head.appendChild(el);
|
|
413
|
-
}
|
|
414
|
-
addMeta(attrs) {
|
|
415
|
-
const el = document.createElement("meta");
|
|
416
|
-
for (const k in attrs) el.setAttribute(k, attrs[k]);
|
|
417
|
-
return document.head.appendChild(el);
|
|
418
|
-
}
|
|
419
|
-
addLink(attrs) {
|
|
420
|
-
const el = document.createElement("link");
|
|
421
|
-
for (const k in attrs) el.setAttribute(k, attrs[k]);
|
|
422
|
-
return document.head.appendChild(el);
|
|
423
|
-
}
|
|
424
|
-
setTitle(text2) {
|
|
425
|
-
return document.title = text2;
|
|
426
|
-
}
|
|
427
|
-
// Reactive State Management
|
|
428
|
-
createState(initialValue, options = {}) {
|
|
429
|
-
let value = initialValue;
|
|
430
|
-
const listeners = /* @__PURE__ */ new Set();
|
|
431
|
-
let updateTimer = null;
|
|
432
|
-
const { throttle: throttle2 = 0, deep = false } = options;
|
|
433
|
-
const notify = () => {
|
|
434
|
-
listeners.forEach((fn) => fn(value));
|
|
435
|
-
};
|
|
436
|
-
const scheduleUpdate = () => {
|
|
437
|
-
if (throttle2 > 0) {
|
|
438
|
-
if (!updateTimer) {
|
|
439
|
-
updateTimer = setTimeout(() => {
|
|
440
|
-
updateTimer = null;
|
|
441
|
-
notify();
|
|
442
|
-
}, throttle2);
|
|
443
|
-
}
|
|
444
|
-
} else {
|
|
445
|
-
notify();
|
|
446
|
-
}
|
|
447
|
-
};
|
|
448
|
-
return {
|
|
449
|
-
get value() {
|
|
450
|
-
return value;
|
|
451
|
-
},
|
|
452
|
-
set value(newValue) {
|
|
453
|
-
const changed = deep ? JSON.stringify(value) !== JSON.stringify(newValue) : value !== newValue;
|
|
454
|
-
if (changed) {
|
|
455
|
-
value = newValue;
|
|
456
|
-
scheduleUpdate();
|
|
457
|
-
}
|
|
458
|
-
},
|
|
459
|
-
subscribe(fn) {
|
|
460
|
-
listeners.add(fn);
|
|
461
|
-
return () => {
|
|
462
|
-
listeners.delete(fn);
|
|
463
|
-
};
|
|
464
|
-
},
|
|
465
|
-
destroy() {
|
|
466
|
-
listeners.clear();
|
|
467
|
-
if (updateTimer) clearTimeout(updateTimer);
|
|
468
|
-
}
|
|
469
|
-
};
|
|
470
|
-
}
|
|
471
|
-
computed(states, computeFn) {
|
|
472
|
-
const values = states.map((s2) => s2.value);
|
|
473
|
-
const result = this.createState(computeFn(...values));
|
|
474
|
-
states.forEach((state, index) => {
|
|
475
|
-
state.subscribe((newValue) => {
|
|
476
|
-
values[index] = newValue;
|
|
477
|
-
result.value = computeFn(...values);
|
|
478
|
-
});
|
|
479
|
-
});
|
|
480
|
-
return result;
|
|
481
|
-
}
|
|
482
|
-
effect(stateFn) {
|
|
483
|
-
stateFn();
|
|
484
|
-
}
|
|
485
|
-
// Virtual scrolling helper for large lists
|
|
486
|
-
createVirtualList(container, items, renderItem, itemHeight = 50, bufferSize = 5) {
|
|
487
|
-
const viewportHeight = container.clientHeight;
|
|
488
|
-
const totalHeight = items.length * itemHeight;
|
|
489
|
-
let scrollTop = 0;
|
|
490
|
-
const getVisibleRange = () => {
|
|
491
|
-
const start = Math.max(0, Math.floor(scrollTop / itemHeight) - bufferSize);
|
|
492
|
-
const end = Math.min(items.length, Math.ceil((scrollTop + viewportHeight) / itemHeight) + bufferSize);
|
|
493
|
-
return { start, end };
|
|
494
|
-
};
|
|
495
|
-
const render = () => {
|
|
496
|
-
const { start, end } = getVisibleRange();
|
|
497
|
-
const wrapper = document.createElement("div");
|
|
498
|
-
wrapper.style.cssText = `height:${totalHeight}px;position:relative`;
|
|
499
|
-
for (let i2 = start; i2 < end; i2++) {
|
|
500
|
-
const itemEl = document.createElement("div");
|
|
501
|
-
itemEl.style.cssText = `position:absolute;top:${i2 * itemHeight}px;height:${itemHeight}px;width:100%`;
|
|
502
|
-
this.renderToDOM(renderItem(items[i2], i2), itemEl);
|
|
503
|
-
wrapper.appendChild(itemEl);
|
|
504
|
-
}
|
|
505
|
-
container.innerHTML = "";
|
|
506
|
-
container.appendChild(wrapper);
|
|
507
|
-
};
|
|
508
|
-
const scrollHandler = () => {
|
|
509
|
-
scrollTop = container.scrollTop;
|
|
510
|
-
requestAnimationFrame(render);
|
|
511
|
-
};
|
|
512
|
-
container.addEventListener("scroll", scrollHandler);
|
|
513
|
-
render();
|
|
514
|
-
return {
|
|
515
|
-
render,
|
|
516
|
-
destroy: () => {
|
|
517
|
-
container.removeEventListener("scroll", scrollHandler);
|
|
518
|
-
container.innerHTML = "";
|
|
519
|
-
}
|
|
520
|
-
};
|
|
521
|
-
}
|
|
522
|
-
// Lazy load components
|
|
523
|
-
lazy(loadFn) {
|
|
524
|
-
let component = null;
|
|
525
|
-
let loading = false;
|
|
526
|
-
return async (...args) => {
|
|
527
|
-
if (!component && !loading) {
|
|
528
|
-
loading = true;
|
|
529
|
-
component = await loadFn();
|
|
530
|
-
loading = false;
|
|
531
|
-
}
|
|
532
|
-
return component ? component(...args) : { tagName: "div", props: { class: "loading" }, children: ["Loading..."] };
|
|
533
|
-
};
|
|
534
|
-
}
|
|
535
|
-
// Memory management - cleanup unused elements
|
|
536
|
-
cleanupUnusedElements(root) {
|
|
537
|
-
const walker = document.createTreeWalker(root, NodeFilter.SHOW_ELEMENT);
|
|
538
|
-
const toRemove = [];
|
|
539
|
-
while (walker.nextNode()) {
|
|
540
|
-
const node = walker.currentNode;
|
|
541
|
-
if (node.id && node.id.startsWith("r") && !this.elementCache.has(node)) {
|
|
542
|
-
toRemove.push(node);
|
|
543
|
-
}
|
|
544
|
-
}
|
|
545
|
-
toRemove.forEach((el) => el.remove());
|
|
546
|
-
return toRemove.length;
|
|
547
|
-
}
|
|
548
|
-
// Server-Side Rendering - convert VNode to HTML string
|
|
549
|
-
renderToString(vNode, options = {}) {
|
|
550
|
-
const { pretty = false, indent = 0 } = options;
|
|
551
|
-
const indentStr = pretty ? " ".repeat(indent) : "";
|
|
552
|
-
const newLine = pretty ? "\n" : "";
|
|
553
|
-
let resolvedVNode = this.resolveStateValue(vNode);
|
|
554
|
-
resolvedVNode = this.unwrapReactive(resolvedVNode);
|
|
555
|
-
if (Array.isArray(resolvedVNode)) {
|
|
556
|
-
return resolvedVNode.map((child) => this.renderToString(child, options)).join("");
|
|
557
|
-
}
|
|
558
|
-
if (typeof resolvedVNode !== "object" || resolvedVNode === null) {
|
|
559
|
-
if (resolvedVNode === null || resolvedVNode === void 0 || resolvedVNode === false) {
|
|
560
|
-
return "";
|
|
561
|
-
}
|
|
562
|
-
return this.escapeHtml(String(resolvedVNode));
|
|
563
|
-
}
|
|
564
|
-
const { tagName, props, children } = resolvedVNode;
|
|
565
|
-
const isSelfClosing = this.isSelfClosingTag(tagName);
|
|
566
|
-
let html2 = `${indentStr}<${tagName}`;
|
|
567
|
-
const attrs = this.propsToAttributes(props);
|
|
568
|
-
if (attrs) {
|
|
569
|
-
html2 += ` ${attrs}`;
|
|
570
|
-
}
|
|
571
|
-
if (isSelfClosing) {
|
|
572
|
-
html2 += ` />${newLine}`;
|
|
573
|
-
return html2;
|
|
574
|
-
}
|
|
575
|
-
html2 += ">";
|
|
576
|
-
if (props.dangerouslySetInnerHTML) {
|
|
577
|
-
html2 += props.dangerouslySetInnerHTML.__html;
|
|
578
|
-
html2 += `</${tagName}>${newLine}`;
|
|
579
|
-
return html2;
|
|
580
|
-
}
|
|
581
|
-
if (children && children.length > 0) {
|
|
582
|
-
const resolvedChildren = children.map((c) => {
|
|
583
|
-
const resolved = this.resolveStateValue(c);
|
|
584
|
-
return this.unwrapReactive(resolved);
|
|
585
|
-
});
|
|
586
|
-
const hasComplexChildren = resolvedChildren.some(
|
|
587
|
-
(c) => typeof c === "object" && c !== null && !Array.isArray(c) && "tagName" in c
|
|
588
|
-
);
|
|
589
|
-
if (pretty && hasComplexChildren) {
|
|
590
|
-
html2 += newLine;
|
|
591
|
-
for (const child of resolvedChildren) {
|
|
592
|
-
if (child == null || child === false) continue;
|
|
593
|
-
if (Array.isArray(child)) {
|
|
594
|
-
for (const c of child) {
|
|
595
|
-
if (c != null && c !== false) {
|
|
596
|
-
html2 += this.renderToString(c, { pretty, indent: indent + 1 });
|
|
597
|
-
}
|
|
598
|
-
}
|
|
599
|
-
} else {
|
|
600
|
-
html2 += this.renderToString(child, { pretty, indent: indent + 1 });
|
|
601
|
-
}
|
|
602
|
-
}
|
|
603
|
-
html2 += indentStr;
|
|
604
|
-
} else {
|
|
605
|
-
for (const child of resolvedChildren) {
|
|
606
|
-
if (child == null || child === false) continue;
|
|
607
|
-
if (Array.isArray(child)) {
|
|
608
|
-
for (const c of child) {
|
|
609
|
-
if (c != null && c !== false) {
|
|
610
|
-
html2 += this.renderToString(c, { pretty: false, indent: 0 });
|
|
611
|
-
}
|
|
612
|
-
}
|
|
613
|
-
} else {
|
|
614
|
-
html2 += this.renderToString(child, { pretty: false, indent: 0 });
|
|
615
|
-
}
|
|
616
|
-
}
|
|
617
|
-
}
|
|
618
|
-
}
|
|
619
|
-
html2 += `</${tagName}>${newLine}`;
|
|
620
|
-
return html2;
|
|
621
|
-
}
|
|
622
|
-
resolveStateValue(value) {
|
|
623
|
-
if (value && typeof value === "object" && "value" in value && "subscribe" in value) {
|
|
624
|
-
return value.value;
|
|
625
|
-
}
|
|
626
|
-
return value;
|
|
627
|
-
}
|
|
628
|
-
isReactiveWrapper(vNode) {
|
|
629
|
-
if (!vNode || typeof vNode !== "object" || !vNode.tagName) {
|
|
630
|
-
return false;
|
|
631
|
-
}
|
|
632
|
-
return vNode.tagName === "span" && vNode.props?.id && typeof vNode.props.id === "string" && vNode.props.id.match(/^r[a-z0-9]{9}$/);
|
|
633
|
-
}
|
|
634
|
-
unwrapReactive(vNode) {
|
|
635
|
-
if (!this.isReactiveWrapper(vNode)) {
|
|
636
|
-
return vNode;
|
|
637
|
-
}
|
|
638
|
-
const children = vNode.children;
|
|
639
|
-
if (!children || children.length === 0) {
|
|
640
|
-
return "";
|
|
641
|
-
}
|
|
642
|
-
if (children.length === 1) {
|
|
643
|
-
const child = children[0];
|
|
644
|
-
if (child && typeof child === "object" && child.tagName === "span") {
|
|
645
|
-
const props = child.props;
|
|
646
|
-
const hasNoProps = !props || Object.keys(props).length === 0;
|
|
647
|
-
const hasSingleStringChild = child.children && child.children.length === 1 && typeof child.children[0] === "string";
|
|
648
|
-
if (hasNoProps && hasSingleStringChild) {
|
|
649
|
-
return child.children[0];
|
|
650
|
-
}
|
|
651
|
-
}
|
|
652
|
-
return this.unwrapReactive(child);
|
|
653
|
-
}
|
|
654
|
-
return children.map((c) => this.unwrapReactive(c));
|
|
655
|
-
}
|
|
656
|
-
escapeHtml(text2) {
|
|
657
|
-
const htmlEscapes = {
|
|
658
|
-
"&": "&",
|
|
659
|
-
"<": "<",
|
|
660
|
-
">": ">",
|
|
661
|
-
'"': """,
|
|
662
|
-
"'": "'"
|
|
663
|
-
};
|
|
664
|
-
return text2.replace(/[&<>"']/g, (char) => htmlEscapes[char]);
|
|
665
|
-
}
|
|
666
|
-
isSelfClosingTag(tagName) {
|
|
667
|
-
const selfClosingTags = /* @__PURE__ */ new Set([
|
|
668
|
-
"area",
|
|
669
|
-
"base",
|
|
670
|
-
"br",
|
|
671
|
-
"col",
|
|
672
|
-
"embed",
|
|
673
|
-
"hr",
|
|
674
|
-
"img",
|
|
675
|
-
"input",
|
|
676
|
-
"link",
|
|
677
|
-
"meta",
|
|
678
|
-
"param",
|
|
679
|
-
"source",
|
|
680
|
-
"track",
|
|
681
|
-
"wbr"
|
|
682
|
-
]);
|
|
683
|
-
return selfClosingTags.has(tagName.toLowerCase());
|
|
684
|
-
}
|
|
685
|
-
propsToAttributes(props) {
|
|
686
|
-
const attrs = [];
|
|
687
|
-
for (const key in props) {
|
|
688
|
-
if (key === "children" || key === "dangerouslySetInnerHTML" || key === "ref") {
|
|
689
|
-
continue;
|
|
690
|
-
}
|
|
691
|
-
let value = props[key];
|
|
692
|
-
value = this.resolveStateValue(value);
|
|
693
|
-
if (value == null || value === false) continue;
|
|
694
|
-
if (key.startsWith("on") && typeof value === "function") {
|
|
695
|
-
continue;
|
|
696
|
-
}
|
|
697
|
-
if (key === "className" || key === "class") {
|
|
698
|
-
const className = Array.isArray(value) ? value.join(" ") : value;
|
|
699
|
-
if (className) {
|
|
700
|
-
attrs.push(`class="${this.escapeHtml(String(className))}"`);
|
|
701
|
-
}
|
|
702
|
-
continue;
|
|
703
|
-
}
|
|
704
|
-
if (key === "style") {
|
|
705
|
-
const styleStr = this.styleToString(value);
|
|
706
|
-
if (styleStr) {
|
|
707
|
-
attrs.push(`style="${this.escapeHtml(styleStr)}"`);
|
|
708
|
-
}
|
|
709
|
-
continue;
|
|
710
|
-
}
|
|
711
|
-
if (value === true) {
|
|
712
|
-
attrs.push(key);
|
|
713
|
-
continue;
|
|
714
|
-
}
|
|
715
|
-
attrs.push(`${key}="${this.escapeHtml(String(value))}"`);
|
|
716
|
-
}
|
|
717
|
-
return attrs.join(" ");
|
|
718
|
-
}
|
|
719
|
-
styleToString(style2) {
|
|
720
|
-
if (typeof style2 === "string") {
|
|
721
|
-
return style2;
|
|
722
|
-
}
|
|
723
|
-
if (typeof style2 === "object" && style2 !== null) {
|
|
724
|
-
const styles = [];
|
|
725
|
-
for (const key in style2) {
|
|
726
|
-
const cssKey = key.replace(/([A-Z])/g, "-$1").toLowerCase();
|
|
727
|
-
styles.push(`${cssKey}:${style2[key]}`);
|
|
728
|
-
}
|
|
729
|
-
return styles.join(";");
|
|
730
|
-
}
|
|
731
|
-
return "";
|
|
732
|
-
}
|
|
733
|
-
isState(value) {
|
|
734
|
-
return value && typeof value === "object" && "value" in value && "subscribe" in value && typeof value.subscribe === "function";
|
|
735
|
-
}
|
|
736
|
-
createReactiveChild(state, renderFn) {
|
|
737
|
-
const currentValue = renderFn(state.value);
|
|
738
|
-
if (typeof window !== "undefined" && typeof document !== "undefined") {
|
|
739
|
-
const entry = { node: null, renderFn };
|
|
740
|
-
this.reactiveNodes.set(state, entry);
|
|
741
|
-
state.subscribe(() => {
|
|
742
|
-
if (entry.node && entry.node.parentNode) {
|
|
743
|
-
const newValue = renderFn(state.value);
|
|
744
|
-
entry.node.textContent = String(newValue ?? "");
|
|
745
|
-
}
|
|
746
|
-
});
|
|
747
|
-
}
|
|
748
|
-
return currentValue;
|
|
749
|
-
}
|
|
750
|
-
jsonToVNode(json) {
|
|
751
|
-
if (this.isState(json)) {
|
|
752
|
-
return this.createReactiveChild(json, (v) => v);
|
|
753
|
-
}
|
|
754
|
-
if (json == null || typeof json === "boolean") {
|
|
755
|
-
return json;
|
|
756
|
-
}
|
|
757
|
-
if (typeof json === "string" || typeof json === "number") {
|
|
758
|
-
return json;
|
|
759
|
-
}
|
|
760
|
-
const { tag, attributes = {}, children } = json;
|
|
761
|
-
const props = {};
|
|
762
|
-
for (const key in attributes) {
|
|
763
|
-
const value = attributes[key];
|
|
764
|
-
if (key === "class") {
|
|
765
|
-
props.className = this.isState(value) ? value.value : value;
|
|
766
|
-
} else {
|
|
767
|
-
props[key] = this.isState(value) ? value.value : value;
|
|
768
|
-
}
|
|
769
|
-
}
|
|
770
|
-
const childrenArray = [];
|
|
771
|
-
if (children != null) {
|
|
772
|
-
if (Array.isArray(children)) {
|
|
773
|
-
for (const child of children) {
|
|
774
|
-
if (this.isState(child)) {
|
|
775
|
-
childrenArray.push(this.createReactiveChild(child, (v) => v));
|
|
776
|
-
} else {
|
|
777
|
-
const converted = this.jsonToVNode(child);
|
|
778
|
-
if (converted != null && converted !== false) {
|
|
779
|
-
childrenArray.push(converted);
|
|
780
|
-
}
|
|
781
|
-
}
|
|
782
|
-
}
|
|
783
|
-
} else if (this.isState(children)) {
|
|
784
|
-
childrenArray.push(this.createReactiveChild(children, (v) => v));
|
|
785
|
-
} else if (typeof children === "object" && "tag" in children) {
|
|
786
|
-
const converted = this.jsonToVNode(children);
|
|
787
|
-
if (converted != null && converted !== false) {
|
|
788
|
-
childrenArray.push(converted);
|
|
789
|
-
}
|
|
790
|
-
} else {
|
|
791
|
-
childrenArray.push(children);
|
|
792
|
-
}
|
|
793
|
-
}
|
|
794
|
-
return { tagName: tag, props, children: childrenArray };
|
|
795
|
-
}
|
|
796
|
-
vNodeJsonToVNode(json) {
|
|
797
|
-
if (this.isState(json)) {
|
|
798
|
-
return this.createReactiveChild(json, (v) => v);
|
|
799
|
-
}
|
|
800
|
-
if (json == null || typeof json === "boolean") {
|
|
801
|
-
return json;
|
|
802
|
-
}
|
|
803
|
-
if (typeof json === "string" || typeof json === "number") {
|
|
804
|
-
return json;
|
|
805
|
-
}
|
|
806
|
-
const { tagName, props = {}, children = [] } = json;
|
|
807
|
-
const resolvedProps = {};
|
|
808
|
-
for (const key in props) {
|
|
809
|
-
const value = props[key];
|
|
810
|
-
resolvedProps[key] = this.isState(value) ? value.value : value;
|
|
811
|
-
}
|
|
812
|
-
const childrenArray = [];
|
|
813
|
-
for (const child of children) {
|
|
814
|
-
if (this.isState(child)) {
|
|
815
|
-
childrenArray.push(this.createReactiveChild(child, (v) => v));
|
|
816
|
-
} else {
|
|
817
|
-
const converted = this.vNodeJsonToVNode(child);
|
|
818
|
-
if (converted != null && converted !== false) {
|
|
819
|
-
childrenArray.push(converted);
|
|
820
|
-
}
|
|
821
|
-
}
|
|
822
|
-
}
|
|
823
|
-
return { tagName, props: resolvedProps, children: childrenArray };
|
|
824
|
-
}
|
|
825
|
-
renderJson(rootElement, json) {
|
|
826
|
-
const vNode = this.jsonToVNode(json);
|
|
827
|
-
if (!vNode || typeof vNode !== "object" || !("tagName" in vNode)) {
|
|
828
|
-
throw new Error("Invalid JSON structure");
|
|
829
|
-
}
|
|
830
|
-
return this.render(rootElement, vNode);
|
|
831
|
-
}
|
|
832
|
-
renderVNode(rootElement, json) {
|
|
833
|
-
const vNode = this.vNodeJsonToVNode(json);
|
|
834
|
-
if (!vNode || typeof vNode !== "object" || !("tagName" in vNode)) {
|
|
835
|
-
throw new Error("Invalid VNode JSON structure");
|
|
836
|
-
}
|
|
837
|
-
return this.render(rootElement, vNode);
|
|
838
|
-
}
|
|
839
|
-
renderJsonToString(json, options = {}) {
|
|
840
|
-
const vNode = this.jsonToVNode(json);
|
|
841
|
-
return this.renderToString(vNode, options);
|
|
842
|
-
}
|
|
843
|
-
renderVNodeToString(json, options = {}) {
|
|
844
|
-
const vNode = this.vNodeJsonToVNode(json);
|
|
845
|
-
return this.renderToString(vNode, options);
|
|
846
|
-
}
|
|
847
|
-
// Expose elementCache for reactive updates
|
|
848
|
-
getElementCache() {
|
|
849
|
-
return this.elementCache;
|
|
850
|
-
}
|
|
851
|
-
};
|
|
852
|
-
var domNode = new DomNode();
|
|
853
|
-
|
|
854
|
-
// src/state.ts
|
|
855
|
-
var createState = (initial, options) => domNode.createState(initial, options);
|
|
856
|
-
var computed = (states, fn) => domNode.computed(states, fn);
|
|
857
|
-
var effect = (fn) => domNode.effect(fn);
|
|
858
|
-
var batchRender = (container, vNodes) => domNode.batchRender(container, vNodes);
|
|
859
|
-
var renderChunked = (container, vNodes, chunkSize, onProgress) => domNode.renderChunked(container, vNodes, chunkSize, onProgress);
|
|
860
|
-
var createVirtualList = (container, items, renderItem, itemHeight, bufferSize) => domNode.createVirtualList(container, items, renderItem, itemHeight, bufferSize);
|
|
861
|
-
var lazy = (loadFn) => domNode.lazy(loadFn);
|
|
862
|
-
var cleanupUnused = (root) => domNode.cleanupUnusedElements(root);
|
|
863
|
-
var throttle = (fn, delay) => {
|
|
864
|
-
let timer = null;
|
|
865
|
-
return (...args) => {
|
|
866
|
-
if (!timer) {
|
|
867
|
-
timer = setTimeout(() => {
|
|
868
|
-
timer = null;
|
|
869
|
-
fn(...args);
|
|
870
|
-
}, delay);
|
|
871
|
-
}
|
|
872
|
-
};
|
|
873
|
-
};
|
|
874
|
-
var debounce = (fn, delay) => {
|
|
875
|
-
let timer = null;
|
|
876
|
-
return (...args) => {
|
|
877
|
-
if (timer) clearTimeout(timer);
|
|
878
|
-
timer = setTimeout(() => fn(...args), delay);
|
|
879
|
-
};
|
|
880
|
-
};
|
|
881
|
-
|
|
882
|
-
// src/reactive.ts
|
|
883
|
-
var reactive = (state, renderFn) => {
|
|
884
|
-
let rafId = null;
|
|
885
|
-
let elementRef = null;
|
|
886
|
-
let placeholder = null;
|
|
887
|
-
let isInDOM = true;
|
|
888
|
-
const initialResult = renderFn(state.value);
|
|
889
|
-
const isVNodeResult = initialResult && typeof initialResult === "object" && "tagName" in initialResult;
|
|
890
|
-
const initialIsNull = initialResult == null || initialResult === false;
|
|
891
|
-
state.subscribe(() => {
|
|
892
|
-
if (rafId) cancelAnimationFrame(rafId);
|
|
893
|
-
rafId = requestAnimationFrame(() => {
|
|
894
|
-
if (!elementRef && !placeholder) return;
|
|
895
|
-
const newResult = renderFn(state.value);
|
|
896
|
-
const resultIsNull = newResult == null || newResult === false;
|
|
897
|
-
if (resultIsNull) {
|
|
898
|
-
if (isInDOM && elementRef) {
|
|
899
|
-
placeholder = document.createComment("reactive");
|
|
900
|
-
elementRef.parentNode?.replaceChild(placeholder, elementRef);
|
|
901
|
-
isInDOM = false;
|
|
902
|
-
}
|
|
903
|
-
} else {
|
|
904
|
-
if (!isInDOM && placeholder && elementRef) {
|
|
905
|
-
placeholder.parentNode?.replaceChild(elementRef, placeholder);
|
|
906
|
-
placeholder = null;
|
|
907
|
-
isInDOM = true;
|
|
908
|
-
}
|
|
909
|
-
if (elementRef) {
|
|
910
|
-
const fragment = document.createDocumentFragment();
|
|
911
|
-
if (isVNodeResult && newResult && typeof newResult === "object" && "tagName" in newResult) {
|
|
912
|
-
const vnode = newResult;
|
|
913
|
-
const props = vnode.props;
|
|
914
|
-
for (const key in props) {
|
|
915
|
-
const value = props[key];
|
|
916
|
-
if (key === "ref") continue;
|
|
917
|
-
if (key === "class" || key === "className") {
|
|
918
|
-
elementRef.className = Array.isArray(value) ? value.join(" ") : value || "";
|
|
919
|
-
} else if (key === "style" && typeof value === "object") {
|
|
920
|
-
const s2 = elementRef.style;
|
|
921
|
-
for (const k in value) s2[k] = value[k];
|
|
922
|
-
} else if (key.startsWith("on")) {
|
|
923
|
-
elementRef[key.toLowerCase()] = value;
|
|
924
|
-
} else if (value != null && value !== false) {
|
|
925
|
-
elementRef.setAttribute(key, String(value === true ? "" : value));
|
|
926
|
-
} else {
|
|
927
|
-
elementRef.removeAttribute(key);
|
|
928
|
-
}
|
|
929
|
-
}
|
|
930
|
-
for (const child of vnode.children) {
|
|
931
|
-
domNode.renderToDOM(child, fragment);
|
|
932
|
-
}
|
|
933
|
-
} else {
|
|
934
|
-
domNode.renderToDOM(newResult, fragment);
|
|
935
|
-
}
|
|
936
|
-
elementRef.textContent = "";
|
|
937
|
-
elementRef.appendChild(fragment);
|
|
938
|
-
domNode.getElementCache().set(elementRef, true);
|
|
939
|
-
}
|
|
940
|
-
}
|
|
941
|
-
rafId = null;
|
|
942
|
-
});
|
|
943
|
-
});
|
|
944
|
-
const refCallback = (el) => {
|
|
945
|
-
elementRef = el;
|
|
946
|
-
if (initialIsNull && el.parentNode) {
|
|
947
|
-
placeholder = document.createComment("reactive");
|
|
948
|
-
el.parentNode.replaceChild(placeholder, el);
|
|
949
|
-
isInDOM = false;
|
|
950
|
-
}
|
|
951
|
-
};
|
|
952
|
-
if (isVNodeResult) {
|
|
953
|
-
const vnode = initialResult;
|
|
954
|
-
return {
|
|
955
|
-
tagName: vnode.tagName,
|
|
956
|
-
props: { ...vnode.props, ref: refCallback },
|
|
957
|
-
children: vnode.children
|
|
958
|
-
};
|
|
959
|
-
}
|
|
960
|
-
return { tagName: "span", props: { ref: refCallback }, children: [initialResult] };
|
|
961
|
-
};
|
|
962
|
-
var reactiveAs = (tagName, state, renderFn, props = {}) => {
|
|
963
|
-
let rafId = null;
|
|
964
|
-
let elementRef = null;
|
|
965
|
-
state.subscribe(() => {
|
|
966
|
-
if (rafId) cancelAnimationFrame(rafId);
|
|
967
|
-
rafId = requestAnimationFrame(() => {
|
|
968
|
-
if (elementRef) {
|
|
969
|
-
const fragment = document.createDocumentFragment();
|
|
970
|
-
const newResult = renderFn(state.value);
|
|
971
|
-
if (newResult == null || newResult === false) {
|
|
972
|
-
elementRef.style.display = "none";
|
|
973
|
-
elementRef.textContent = "";
|
|
974
|
-
} else {
|
|
975
|
-
elementRef.style.display = "";
|
|
976
|
-
domNode.renderToDOM(newResult, fragment);
|
|
977
|
-
elementRef.textContent = "";
|
|
978
|
-
elementRef.appendChild(fragment);
|
|
979
|
-
}
|
|
980
|
-
domNode.getElementCache().set(elementRef, true);
|
|
981
|
-
}
|
|
982
|
-
rafId = null;
|
|
983
|
-
});
|
|
984
|
-
});
|
|
985
|
-
const refCallback = (el) => {
|
|
986
|
-
elementRef = el;
|
|
987
|
-
};
|
|
988
|
-
return { tagName, props: { ...props, ref: refCallback }, children: [renderFn(state.value)] };
|
|
989
|
-
};
|
|
990
|
-
var text = (state) => state && state.value !== void 0 ? reactive(state, (v) => ({ tagName: "span", props: {}, children: [String(v)] })) : String(state);
|
|
991
|
-
var bindValue = (state) => ({
|
|
992
|
-
value: state.value,
|
|
993
|
-
oninput: (e) => {
|
|
994
|
-
state.value = e.target.value;
|
|
995
|
-
}
|
|
996
|
-
});
|
|
997
|
-
var bindChecked = (state) => ({
|
|
998
|
-
checked: state.value,
|
|
999
|
-
onchange: (e) => {
|
|
1000
|
-
state.value = e.target.checked;
|
|
1001
|
-
}
|
|
1002
|
-
});
|
|
1003
|
-
|
|
1004
|
-
// src/CreateStyle.ts
|
|
1005
|
-
var CreateStyle = class {
|
|
1006
|
-
constructor() {
|
|
1007
|
-
this.variables = [];
|
|
1008
|
-
this.rules = [];
|
|
1009
|
-
this.mediaRules = [];
|
|
1010
|
-
this.keyframes = [];
|
|
1011
|
-
this.fontFaces = [];
|
|
1012
|
-
this.imports = [];
|
|
1013
|
-
this.containerRules = [];
|
|
1014
|
-
this.supportsRules = [];
|
|
1015
|
-
this.layerRules = [];
|
|
1016
|
-
this._layerOrder = [];
|
|
1017
|
-
}
|
|
1018
|
-
// CSS Variables
|
|
1019
|
-
addVar(name, value) {
|
|
1020
|
-
const cssVar = {
|
|
1021
|
-
name: name.startsWith("--") ? name : `--${name}`,
|
|
1022
|
-
value,
|
|
1023
|
-
toString() {
|
|
1024
|
-
return `var(${this.name})`;
|
|
1025
|
-
}
|
|
1026
|
-
};
|
|
1027
|
-
this.variables.push(cssVar);
|
|
1028
|
-
return cssVar;
|
|
1029
|
-
}
|
|
1030
|
-
var(variable, fallback) {
|
|
1031
|
-
const varName = typeof variable === "string" ? variable.startsWith("--") ? variable : `--${variable}` : variable.name;
|
|
1032
|
-
return fallback ? `var(${varName}, ${fallback})` : `var(${varName})`;
|
|
1033
|
-
}
|
|
1034
|
-
// Basic Selectors
|
|
1035
|
-
addTag(tag, styles) {
|
|
1036
|
-
const rule = { selector: tag, styles, type: "tag" };
|
|
1037
|
-
this.rules.push(rule);
|
|
1038
|
-
return rule;
|
|
1039
|
-
}
|
|
1040
|
-
addClass(name, styles) {
|
|
1041
|
-
const selector = name.startsWith(".") ? name : `.${name}`;
|
|
1042
|
-
const rule = { selector, styles, type: "class" };
|
|
1043
|
-
this.rules.push(rule);
|
|
1044
|
-
return rule;
|
|
1045
|
-
}
|
|
1046
|
-
addId(name, styles) {
|
|
1047
|
-
const selector = name.startsWith("#") ? name : `#${name}`;
|
|
1048
|
-
const rule = { selector, styles, type: "id" };
|
|
1049
|
-
this.rules.push(rule);
|
|
1050
|
-
return rule;
|
|
1051
|
-
}
|
|
1052
|
-
// Pseudo Selectors
|
|
1053
|
-
addPseudoClass(pseudo, styles, baseSelector) {
|
|
1054
|
-
const pseudoClass = pseudo.startsWith(":") ? pseudo : `:${pseudo}`;
|
|
1055
|
-
const selector = baseSelector ? `${baseSelector}${pseudoClass}` : pseudoClass;
|
|
1056
|
-
const rule = { selector, styles, type: "pseudo-class" };
|
|
1057
|
-
this.rules.push(rule);
|
|
1058
|
-
return rule;
|
|
1059
|
-
}
|
|
1060
|
-
addPseudoElement(pseudo, styles, baseSelector) {
|
|
1061
|
-
const pseudoElement = pseudo.startsWith("::") ? pseudo : `::${pseudo}`;
|
|
1062
|
-
const selector = baseSelector ? `${baseSelector}${pseudoElement}` : pseudoElement;
|
|
1063
|
-
const rule = { selector, styles, type: "pseudo-element" };
|
|
1064
|
-
this.rules.push(rule);
|
|
1065
|
-
return rule;
|
|
1066
|
-
}
|
|
1067
|
-
// Attribute Selectors
|
|
1068
|
-
addAttribute(attr, styles, baseSelector) {
|
|
1069
|
-
const attrSelector = attr.startsWith("[") ? attr : `[${attr}]`;
|
|
1070
|
-
const selector = baseSelector ? `${baseSelector}${attrSelector}` : attrSelector;
|
|
1071
|
-
const rule = { selector, styles, type: "attribute" };
|
|
1072
|
-
this.rules.push(rule);
|
|
1073
|
-
return rule;
|
|
1074
|
-
}
|
|
1075
|
-
attrEquals(attr, value, styles, baseSelector) {
|
|
1076
|
-
return this.addAttribute(`${attr}="${value}"`, styles, baseSelector);
|
|
1077
|
-
}
|
|
1078
|
-
attrContainsWord(attr, value, styles, baseSelector) {
|
|
1079
|
-
return this.addAttribute(`${attr}~="${value}"`, styles, baseSelector);
|
|
1080
|
-
}
|
|
1081
|
-
attrStartsWith(attr, value, styles, baseSelector) {
|
|
1082
|
-
return this.addAttribute(`${attr}^="${value}"`, styles, baseSelector);
|
|
1083
|
-
}
|
|
1084
|
-
attrEndsWith(attr, value, styles, baseSelector) {
|
|
1085
|
-
return this.addAttribute(`${attr}$="${value}"`, styles, baseSelector);
|
|
1086
|
-
}
|
|
1087
|
-
attrContains(attr, value, styles, baseSelector) {
|
|
1088
|
-
return this.addAttribute(`${attr}*="${value}"`, styles, baseSelector);
|
|
1089
|
-
}
|
|
1090
|
-
// Combinator Selectors
|
|
1091
|
-
descendant(ancestor, descendant, styles) {
|
|
1092
|
-
const selector = `${ancestor} ${descendant}`;
|
|
1093
|
-
const rule = { selector, styles, type: "custom" };
|
|
1094
|
-
this.rules.push(rule);
|
|
1095
|
-
return rule;
|
|
1096
|
-
}
|
|
1097
|
-
child(parent, childSel, styles) {
|
|
1098
|
-
const selector = `${parent} > ${childSel}`;
|
|
1099
|
-
const rule = { selector, styles, type: "custom" };
|
|
1100
|
-
this.rules.push(rule);
|
|
1101
|
-
return rule;
|
|
1102
|
-
}
|
|
1103
|
-
adjacentSibling(element, sibling, styles) {
|
|
1104
|
-
const selector = `${element} + ${sibling}`;
|
|
1105
|
-
const rule = { selector, styles, type: "custom" };
|
|
1106
|
-
this.rules.push(rule);
|
|
1107
|
-
return rule;
|
|
1108
|
-
}
|
|
1109
|
-
generalSibling(element, sibling, styles) {
|
|
1110
|
-
const selector = `${element} ~ ${sibling}`;
|
|
1111
|
-
const rule = { selector, styles, type: "custom" };
|
|
1112
|
-
this.rules.push(rule);
|
|
1113
|
-
return rule;
|
|
1114
|
-
}
|
|
1115
|
-
multiple(selectors, styles) {
|
|
1116
|
-
const selector = selectors.join(", ");
|
|
1117
|
-
const rule = { selector, styles, type: "custom" };
|
|
1118
|
-
this.rules.push(rule);
|
|
1119
|
-
return rule;
|
|
1120
|
-
}
|
|
1121
|
-
// Nesting (BEM-style)
|
|
1122
|
-
addName(name, styles) {
|
|
1123
|
-
const selector = name.startsWith("--") ? `&${name}` : `&--${name}`;
|
|
1124
|
-
const rule = { selector, styles, type: "name" };
|
|
1125
|
-
return rule;
|
|
1126
|
-
}
|
|
1127
|
-
nesting(parentRule, ...childRules) {
|
|
1128
|
-
parentRule.nested = childRules;
|
|
1129
|
-
return parentRule;
|
|
1130
|
-
}
|
|
1131
|
-
// @keyframes - Animations
|
|
1132
|
-
keyframe(name, steps) {
|
|
1133
|
-
const keyframeSteps = Object.entries(steps).map(([step, styles]) => ({
|
|
1134
|
-
step: step === "from" ? "from" : step === "to" ? "to" : `${step}%`,
|
|
1135
|
-
styles
|
|
1136
|
-
}));
|
|
1137
|
-
const kf = { name, steps: keyframeSteps };
|
|
1138
|
-
this.keyframes.push(kf);
|
|
1139
|
-
return kf;
|
|
1140
|
-
}
|
|
1141
|
-
keyframeFromTo(name, from, to) {
|
|
1142
|
-
return this.keyframe(name, { from, to });
|
|
1143
|
-
}
|
|
1144
|
-
// @font-face - Custom Fonts
|
|
1145
|
-
fontFace(options) {
|
|
1146
|
-
this.fontFaces.push(options);
|
|
1147
|
-
return options;
|
|
1148
|
-
}
|
|
1149
|
-
// @import - Import Stylesheets
|
|
1150
|
-
import(url, mediaQuery) {
|
|
1151
|
-
const importRule = mediaQuery ? `@import url("${url}") ${mediaQuery};` : `@import url("${url}");`;
|
|
1152
|
-
this.imports.push(importRule);
|
|
1153
|
-
return importRule;
|
|
1154
|
-
}
|
|
1155
|
-
// @media - Media Queries
|
|
1156
|
-
media(type, condition, rules) {
|
|
1157
|
-
const cssRules = Object.entries(rules).map(([selector, styles]) => ({
|
|
1158
|
-
selector,
|
|
1159
|
-
styles,
|
|
1160
|
-
type: "custom"
|
|
1161
|
-
}));
|
|
1162
|
-
const mediaRule = { type, condition, rules: cssRules };
|
|
1163
|
-
this.mediaRules.push(mediaRule);
|
|
1164
|
-
return mediaRule;
|
|
1165
|
-
}
|
|
1166
|
-
mediaScreen(condition, rules) {
|
|
1167
|
-
return this.media("screen", condition, rules);
|
|
1168
|
-
}
|
|
1169
|
-
mediaPrint(rules) {
|
|
1170
|
-
return this.media("print", "", rules);
|
|
1171
|
-
}
|
|
1172
|
-
mediaMinWidth(minWidth, rules) {
|
|
1173
|
-
return this.media("screen", `min-width: ${minWidth}`, rules);
|
|
1174
|
-
}
|
|
1175
|
-
mediaMaxWidth(maxWidth, rules) {
|
|
1176
|
-
return this.media("screen", `max-width: ${maxWidth}`, rules);
|
|
1177
|
-
}
|
|
1178
|
-
mediaDark(rules) {
|
|
1179
|
-
const cssRules = Object.entries(rules).map(([selector, styles]) => ({
|
|
1180
|
-
selector,
|
|
1181
|
-
styles,
|
|
1182
|
-
type: "custom"
|
|
1183
|
-
}));
|
|
1184
|
-
const mediaRule = { type: "", condition: "prefers-color-scheme: dark", rules: cssRules };
|
|
1185
|
-
this.mediaRules.push(mediaRule);
|
|
1186
|
-
return mediaRule;
|
|
1187
|
-
}
|
|
1188
|
-
mediaLight(rules) {
|
|
1189
|
-
const cssRules = Object.entries(rules).map(([selector, styles]) => ({
|
|
1190
|
-
selector,
|
|
1191
|
-
styles,
|
|
1192
|
-
type: "custom"
|
|
1193
|
-
}));
|
|
1194
|
-
const mediaRule = { type: "", condition: "prefers-color-scheme: light", rules: cssRules };
|
|
1195
|
-
this.mediaRules.push(mediaRule);
|
|
1196
|
-
return mediaRule;
|
|
1197
|
-
}
|
|
1198
|
-
mediaReducedMotion(rules) {
|
|
1199
|
-
const cssRules = Object.entries(rules).map(([selector, styles]) => ({
|
|
1200
|
-
selector,
|
|
1201
|
-
styles,
|
|
1202
|
-
type: "custom"
|
|
1203
|
-
}));
|
|
1204
|
-
const mediaRule = { type: "", condition: "prefers-reduced-motion: reduce", rules: cssRules };
|
|
1205
|
-
this.mediaRules.push(mediaRule);
|
|
1206
|
-
return mediaRule;
|
|
1207
|
-
}
|
|
1208
|
-
// @container - Container Queries
|
|
1209
|
-
container(condition, rules, name) {
|
|
1210
|
-
const cssRules = Object.entries(rules).map(([selector, styles]) => ({
|
|
1211
|
-
selector,
|
|
1212
|
-
styles,
|
|
1213
|
-
type: "custom"
|
|
1214
|
-
}));
|
|
1215
|
-
const containerRule = { name, condition, rules: cssRules };
|
|
1216
|
-
this.containerRules.push(containerRule);
|
|
1217
|
-
return containerRule;
|
|
1218
|
-
}
|
|
1219
|
-
addContainer(name, styles) {
|
|
1220
|
-
const containerStyles = { ...styles, containerName: name };
|
|
1221
|
-
return this.addClass(name, containerStyles);
|
|
1222
|
-
}
|
|
1223
|
-
// @supports - Feature Queries
|
|
1224
|
-
supports(condition, rules) {
|
|
1225
|
-
const cssRules = Object.entries(rules).map(([selector, styles]) => ({
|
|
1226
|
-
selector,
|
|
1227
|
-
styles,
|
|
1228
|
-
type: "custom"
|
|
1229
|
-
}));
|
|
1230
|
-
const supportsRule = { condition, rules: cssRules };
|
|
1231
|
-
this.supportsRules.push(supportsRule);
|
|
1232
|
-
return supportsRule;
|
|
1233
|
-
}
|
|
1234
|
-
// @layer - Cascade Layers
|
|
1235
|
-
layerOrder(...layers) {
|
|
1236
|
-
this._layerOrder = layers;
|
|
1237
|
-
}
|
|
1238
|
-
layer(name, rules) {
|
|
1239
|
-
const cssRules = Object.entries(rules).map(([selector, styles]) => ({
|
|
1240
|
-
selector,
|
|
1241
|
-
styles,
|
|
1242
|
-
type: "custom"
|
|
1243
|
-
}));
|
|
1244
|
-
const layerRule = { name, rules: cssRules };
|
|
1245
|
-
this.layerRules.push(layerRule);
|
|
1246
|
-
return layerRule;
|
|
1247
|
-
}
|
|
1248
|
-
// Custom Rules
|
|
1249
|
-
add(rules) {
|
|
1250
|
-
const cssRules = Object.entries(rules).map(([selector, styles]) => {
|
|
1251
|
-
const rule = { selector, styles, type: "custom" };
|
|
1252
|
-
this.rules.push(rule);
|
|
1253
|
-
return rule;
|
|
1254
|
-
});
|
|
1255
|
-
return cssRules;
|
|
1256
|
-
}
|
|
1257
|
-
important(value) {
|
|
1258
|
-
return `${value} !important`;
|
|
1259
|
-
}
|
|
1260
|
-
// Utility Methods
|
|
1261
|
-
toKebabCase(str) {
|
|
1262
|
-
return str.replace(/([a-z])([A-Z])/g, "$1-$2").toLowerCase();
|
|
1263
|
-
}
|
|
1264
|
-
stylesToString(styles, indent = " ") {
|
|
1265
|
-
return Object.entries(styles).map(([prop, value]) => {
|
|
1266
|
-
const cssValue = typeof value === "object" && value !== null && "name" in value ? `var(${value.name})` : value;
|
|
1267
|
-
return `${indent}${this.toKebabCase(prop)}: ${cssValue};`;
|
|
1268
|
-
}).join("\n");
|
|
1269
|
-
}
|
|
1270
|
-
renderRule(rule, indent = "") {
|
|
1271
|
-
let css = `${indent}${rule.selector} {
|
|
1272
|
-
${this.stylesToString(rule.styles, indent + " ")}
|
|
1273
|
-
`;
|
|
1274
|
-
if (rule.nested && rule.nested.length > 0) {
|
|
1275
|
-
for (const nestedRule of rule.nested) {
|
|
1276
|
-
const nestedSelector = nestedRule.selector.startsWith("&") ? nestedRule.selector.replace(/&/g, rule.selector) : `${rule.selector} ${nestedRule.selector}`;
|
|
1277
|
-
css += `
|
|
1278
|
-
${indent}${nestedSelector} {
|
|
1279
|
-
${this.stylesToString(nestedRule.styles, indent + " ")}
|
|
1280
|
-
${indent}}
|
|
1281
|
-
`;
|
|
1282
|
-
}
|
|
1283
|
-
}
|
|
1284
|
-
css += `${indent}}`;
|
|
1285
|
-
return css;
|
|
1286
|
-
}
|
|
1287
|
-
renderMediaRule(media) {
|
|
1288
|
-
const condition = media.type && media.condition ? `${media.type} and (${media.condition})` : media.type ? media.type : `(${media.condition})`;
|
|
1289
|
-
let css = `@media ${condition} {
|
|
1290
|
-
`;
|
|
1291
|
-
for (const rule of media.rules) {
|
|
1292
|
-
css += this.renderRule(rule, " ") + "\n";
|
|
1293
|
-
}
|
|
1294
|
-
css += "}";
|
|
1295
|
-
return css;
|
|
1296
|
-
}
|
|
1297
|
-
renderKeyframes(kf) {
|
|
1298
|
-
let css = `@keyframes ${kf.name} {
|
|
1299
|
-
`;
|
|
1300
|
-
for (const step of kf.steps) {
|
|
1301
|
-
css += ` ${step.step} {
|
|
1302
|
-
${this.stylesToString(step.styles, " ")}
|
|
1303
|
-
}
|
|
1304
|
-
`;
|
|
1305
|
-
}
|
|
1306
|
-
css += "}";
|
|
1307
|
-
return css;
|
|
1308
|
-
}
|
|
1309
|
-
renderFontFace(ff) {
|
|
1310
|
-
let css = "@font-face {\n";
|
|
1311
|
-
css += ` font-family: "${ff.fontFamily}";
|
|
1312
|
-
`;
|
|
1313
|
-
css += ` src: ${ff.src};
|
|
1314
|
-
`;
|
|
1315
|
-
if (ff.fontWeight) css += ` font-weight: ${ff.fontWeight};
|
|
1316
|
-
`;
|
|
1317
|
-
if (ff.fontStyle) css += ` font-style: ${ff.fontStyle};
|
|
1318
|
-
`;
|
|
1319
|
-
if (ff.fontDisplay) css += ` font-display: ${ff.fontDisplay};
|
|
1320
|
-
`;
|
|
1321
|
-
if (ff.unicodeRange) css += ` unicode-range: ${ff.unicodeRange};
|
|
1322
|
-
`;
|
|
1323
|
-
css += "}";
|
|
1324
|
-
return css;
|
|
1325
|
-
}
|
|
1326
|
-
renderContainerRule(container) {
|
|
1327
|
-
const nameStr = container.name ? `${container.name} ` : "";
|
|
1328
|
-
let css = `@container ${nameStr}(${container.condition}) {
|
|
1329
|
-
`;
|
|
1330
|
-
for (const rule of container.rules) {
|
|
1331
|
-
css += this.renderRule(rule, " ") + "\n";
|
|
1332
|
-
}
|
|
1333
|
-
css += "}";
|
|
1334
|
-
return css;
|
|
1335
|
-
}
|
|
1336
|
-
renderSupportsRule(supports) {
|
|
1337
|
-
let css = `@supports (${supports.condition}) {
|
|
1338
|
-
`;
|
|
1339
|
-
for (const rule of supports.rules) {
|
|
1340
|
-
css += this.renderRule(rule, " ") + "\n";
|
|
1341
|
-
}
|
|
1342
|
-
css += "}";
|
|
1343
|
-
return css;
|
|
1344
|
-
}
|
|
1345
|
-
renderLayerRule(layer) {
|
|
1346
|
-
let css = `@layer ${layer.name} {
|
|
1347
|
-
`;
|
|
1348
|
-
for (const rule of layer.rules) {
|
|
1349
|
-
css += this.renderRule(rule, " ") + "\n";
|
|
1350
|
-
}
|
|
1351
|
-
css += "}";
|
|
1352
|
-
return css;
|
|
1353
|
-
}
|
|
1354
|
-
// Render Output
|
|
1355
|
-
render(...additionalRules) {
|
|
1356
|
-
const parts = [];
|
|
1357
|
-
if (this.imports.length > 0) {
|
|
1358
|
-
parts.push(this.imports.join("\n"));
|
|
1359
|
-
}
|
|
1360
|
-
if (this._layerOrder.length > 0) {
|
|
1361
|
-
parts.push(`@layer ${this._layerOrder.join(", ")};`);
|
|
1362
|
-
}
|
|
1363
|
-
if (this.variables.length > 0) {
|
|
1364
|
-
const varDeclarations = this.variables.map((v) => ` ${v.name}: ${v.value};`).join("\n");
|
|
1365
|
-
parts.push(`:root {
|
|
1366
|
-
${varDeclarations}
|
|
1367
|
-
}`);
|
|
1368
|
-
}
|
|
1369
|
-
for (const ff of this.fontFaces) {
|
|
1370
|
-
parts.push(this.renderFontFace(ff));
|
|
1371
|
-
}
|
|
1372
|
-
for (const kf of this.keyframes) {
|
|
1373
|
-
parts.push(this.renderKeyframes(kf));
|
|
1374
|
-
}
|
|
1375
|
-
const allRules = [...this.rules];
|
|
1376
|
-
const allMediaRules = [...this.mediaRules];
|
|
1377
|
-
const allKeyframes = [];
|
|
1378
|
-
const allContainerRules = [...this.containerRules];
|
|
1379
|
-
const allSupportsRules = [...this.supportsRules];
|
|
1380
|
-
const allLayerRules = [...this.layerRules];
|
|
1381
|
-
for (const item of additionalRules) {
|
|
1382
|
-
if (!item) continue;
|
|
1383
|
-
if (Array.isArray(item)) {
|
|
1384
|
-
allRules.push(...item);
|
|
1385
|
-
} else if ("condition" in item && "rules" in item && !("name" in item && "steps" in item)) {
|
|
1386
|
-
if ("type" in item) {
|
|
1387
|
-
allMediaRules.push(item);
|
|
1388
|
-
} else if ("name" in item && typeof item.name === "string") {
|
|
1389
|
-
allContainerRules.push(item);
|
|
1390
|
-
} else {
|
|
1391
|
-
allSupportsRules.push(item);
|
|
1392
|
-
}
|
|
1393
|
-
} else if ("name" in item && "steps" in item) {
|
|
1394
|
-
allKeyframes.push(item);
|
|
1395
|
-
} else if ("name" in item && "rules" in item) {
|
|
1396
|
-
allLayerRules.push(item);
|
|
1397
|
-
} else {
|
|
1398
|
-
allRules.push(item);
|
|
1399
|
-
}
|
|
1400
|
-
}
|
|
1401
|
-
for (const kf of allKeyframes) {
|
|
1402
|
-
parts.push(this.renderKeyframes(kf));
|
|
1403
|
-
}
|
|
1404
|
-
for (const layer of allLayerRules) {
|
|
1405
|
-
parts.push(this.renderLayerRule(layer));
|
|
1406
|
-
}
|
|
1407
|
-
for (const rule of allRules) {
|
|
1408
|
-
parts.push(this.renderRule(rule));
|
|
1409
|
-
}
|
|
1410
|
-
for (const supports of allSupportsRules) {
|
|
1411
|
-
parts.push(this.renderSupportsRule(supports));
|
|
1412
|
-
}
|
|
1413
|
-
for (const container of allContainerRules) {
|
|
1414
|
-
parts.push(this.renderContainerRule(container));
|
|
1415
|
-
}
|
|
1416
|
-
for (const media of allMediaRules) {
|
|
1417
|
-
parts.push(this.renderMediaRule(media));
|
|
1418
|
-
}
|
|
1419
|
-
return parts.join("\n\n");
|
|
1420
|
-
}
|
|
1421
|
-
inject(styleId) {
|
|
1422
|
-
const css = this.render();
|
|
1423
|
-
const style2 = document.createElement("style");
|
|
1424
|
-
if (styleId) style2.id = styleId;
|
|
1425
|
-
style2.textContent = css;
|
|
1426
|
-
document.head.appendChild(style2);
|
|
1427
|
-
return style2;
|
|
1428
|
-
}
|
|
1429
|
-
clear() {
|
|
1430
|
-
this.variables = [];
|
|
1431
|
-
this.rules = [];
|
|
1432
|
-
this.mediaRules = [];
|
|
1433
|
-
this.keyframes = [];
|
|
1434
|
-
this.fontFaces = [];
|
|
1435
|
-
this.imports = [];
|
|
1436
|
-
this.containerRules = [];
|
|
1437
|
-
this.supportsRules = [];
|
|
1438
|
-
this.layerRules = [];
|
|
1439
|
-
this._layerOrder = [];
|
|
1440
|
-
}
|
|
1441
|
-
};
|
|
1442
|
-
|
|
1443
|
-
// src/router.ts
|
|
1444
|
-
function matchRoute(pattern, path) {
|
|
1445
|
-
const patternParts = pattern.split("/").filter(Boolean);
|
|
1446
|
-
const pathParts = path.split("/").filter(Boolean);
|
|
1447
|
-
if (pattern.endsWith("*")) {
|
|
1448
|
-
const basePattern = pattern.slice(0, -1);
|
|
1449
|
-
if (path.startsWith(basePattern) || basePattern === "/" || pattern === "*") {
|
|
1450
|
-
return { "*": path.slice(basePattern.length) };
|
|
1451
|
-
}
|
|
1452
|
-
}
|
|
1453
|
-
if (patternParts.length !== pathParts.length) return null;
|
|
1454
|
-
const params = {};
|
|
1455
|
-
for (let i2 = 0; i2 < patternParts.length; i2++) {
|
|
1456
|
-
const patternPart = patternParts[i2];
|
|
1457
|
-
const pathPart = pathParts[i2];
|
|
1458
|
-
if (patternPart.startsWith(":")) {
|
|
1459
|
-
params[patternPart.slice(1)] = decodeURIComponent(pathPart);
|
|
1460
|
-
} else if (patternPart !== pathPart) {
|
|
1461
|
-
return null;
|
|
1462
|
-
}
|
|
1463
|
-
}
|
|
1464
|
-
return params;
|
|
1465
|
-
}
|
|
1466
|
-
function createRouter(options) {
|
|
1467
|
-
const { mode = "history", base: base2 = "", routes } = options;
|
|
1468
|
-
const globalGuards = [];
|
|
1469
|
-
const parseQuery = (search) => {
|
|
1470
|
-
const query = {};
|
|
1471
|
-
const params = new URLSearchParams(search);
|
|
1472
|
-
params.forEach((value, key) => {
|
|
1473
|
-
query[key] = value;
|
|
1474
|
-
});
|
|
1475
|
-
return query;
|
|
1476
|
-
};
|
|
1477
|
-
const getCurrentPath = () => {
|
|
1478
|
-
if (mode === "hash") {
|
|
1479
|
-
return window.location.hash.slice(1) || "/";
|
|
1480
|
-
}
|
|
1481
|
-
return window.location.pathname.replace(base2, "") || "/";
|
|
1482
|
-
};
|
|
1483
|
-
const parseLocation = (path) => {
|
|
1484
|
-
const [pathPart, queryPart = ""] = path.split("?");
|
|
1485
|
-
const [cleanPath, hash = ""] = pathPart.split("#");
|
|
1486
|
-
return {
|
|
1487
|
-
path: cleanPath || "/",
|
|
1488
|
-
params: {},
|
|
1489
|
-
query: parseQuery(queryPart),
|
|
1490
|
-
hash: hash ? "#" + hash : ""
|
|
1491
|
-
};
|
|
1492
|
-
};
|
|
1493
|
-
const findRoute = (path) => {
|
|
1494
|
-
for (const route of routes) {
|
|
1495
|
-
const params = matchRoute(route.path, path);
|
|
1496
|
-
if (params !== null) {
|
|
1497
|
-
return { route, params };
|
|
1498
|
-
}
|
|
1499
|
-
}
|
|
1500
|
-
return null;
|
|
1501
|
-
};
|
|
1502
|
-
const currentRoute = domNode.createState(parseLocation(getCurrentPath()));
|
|
1503
|
-
const navigate = (path, replace = false) => {
|
|
1504
|
-
const location = parseLocation(path);
|
|
1505
|
-
const match = findRoute(location.path);
|
|
1506
|
-
if (match) {
|
|
1507
|
-
location.params = match.params;
|
|
1508
|
-
}
|
|
1509
|
-
for (const guard of globalGuards) {
|
|
1510
|
-
const result = guard(location, currentRoute.value);
|
|
1511
|
-
if (result === false) return;
|
|
1512
|
-
if (typeof result === "string") {
|
|
1513
|
-
navigate(result, replace);
|
|
1514
|
-
return;
|
|
1515
|
-
}
|
|
1516
|
-
}
|
|
1517
|
-
if (match?.route.beforeEnter) {
|
|
1518
|
-
const result = match.route.beforeEnter(location, currentRoute.value);
|
|
1519
|
-
if (result === false) return;
|
|
1520
|
-
if (typeof result === "string") {
|
|
1521
|
-
navigate(result, replace);
|
|
1522
|
-
return;
|
|
1523
|
-
}
|
|
1524
|
-
}
|
|
1525
|
-
const url = mode === "hash" ? "#" + path : base2 + path;
|
|
1526
|
-
if (replace) {
|
|
1527
|
-
window.history.replaceState({ path }, "", url);
|
|
1528
|
-
} else {
|
|
1529
|
-
window.history.pushState({ path }, "", url);
|
|
1530
|
-
}
|
|
1531
|
-
currentRoute.value = location;
|
|
1532
|
-
};
|
|
1533
|
-
const handlePopState = () => {
|
|
1534
|
-
const path = getCurrentPath();
|
|
1535
|
-
const location = parseLocation(path);
|
|
1536
|
-
const match = findRoute(location.path);
|
|
1537
|
-
if (match) {
|
|
1538
|
-
location.params = match.params;
|
|
1539
|
-
}
|
|
1540
|
-
currentRoute.value = location;
|
|
1541
|
-
};
|
|
1542
|
-
if (typeof window !== "undefined") {
|
|
1543
|
-
window.addEventListener("popstate", handlePopState);
|
|
1544
|
-
}
|
|
1545
|
-
return {
|
|
1546
|
-
currentRoute,
|
|
1547
|
-
push: (path) => navigate(path, false),
|
|
1548
|
-
replace: (path) => navigate(path, true),
|
|
1549
|
-
back: () => window.history.back(),
|
|
1550
|
-
forward: () => window.history.forward(),
|
|
1551
|
-
go: (delta) => window.history.go(delta),
|
|
1552
|
-
beforeEach: (guard) => {
|
|
1553
|
-
globalGuards.push(guard);
|
|
1554
|
-
},
|
|
1555
|
-
destroy: () => {
|
|
1556
|
-
if (typeof window !== "undefined") {
|
|
1557
|
-
window.removeEventListener("popstate", handlePopState);
|
|
1558
|
-
}
|
|
1559
|
-
currentRoute.destroy();
|
|
1560
|
-
}
|
|
1561
|
-
};
|
|
1562
|
-
}
|
|
1563
|
-
function createRouterView(router, options) {
|
|
1564
|
-
const { routes, notFound } = options;
|
|
1565
|
-
return () => {
|
|
1566
|
-
const location = router.currentRoute.value;
|
|
1567
|
-
const match = routes.find((r) => matchRoute(r.path, location.path) !== null);
|
|
1568
|
-
if (match) {
|
|
1569
|
-
const params = matchRoute(match.path, location.path) || {};
|
|
1570
|
-
const component = match.component({ ...params, ...location.query });
|
|
1571
|
-
if (typeof component === "object" && component !== null && "tagName" in component) {
|
|
1572
|
-
return component;
|
|
1573
|
-
}
|
|
1574
|
-
return { tagName: "span", props: {}, children: [component] };
|
|
1575
|
-
}
|
|
1576
|
-
if (notFound) {
|
|
1577
|
-
const component = notFound(location.params);
|
|
1578
|
-
if (typeof component === "object" && component !== null && "tagName" in component) {
|
|
1579
|
-
return component;
|
|
1580
|
-
}
|
|
1581
|
-
return { tagName: "span", props: {}, children: [component] };
|
|
1582
|
-
}
|
|
1583
|
-
return { tagName: "div", props: {}, children: ["404 - Not Found"] };
|
|
1584
|
-
};
|
|
1585
|
-
}
|
|
1586
|
-
var routerLink = (router, props, ...children) => {
|
|
1587
|
-
return {
|
|
1588
|
-
tagName: "a",
|
|
1589
|
-
props: {
|
|
1590
|
-
...props,
|
|
1591
|
-
href: props.to,
|
|
1592
|
-
onclick: (e) => {
|
|
1593
|
-
e.preventDefault();
|
|
1594
|
-
router.push(props.to);
|
|
1595
|
-
}
|
|
1596
|
-
},
|
|
1597
|
-
children
|
|
1598
|
-
};
|
|
1599
|
-
};
|
|
1600
|
-
|
|
1601
|
-
// src/elements.ts
|
|
1602
|
-
var createElementFactory = (tag) => {
|
|
1603
|
-
return function(props, ...rest) {
|
|
1604
|
-
if (arguments.length === 0) {
|
|
1605
|
-
return { tagName: tag, props: {}, children: [] };
|
|
1606
|
-
}
|
|
1607
|
-
let actualProps = {};
|
|
1608
|
-
let startIndex = 1;
|
|
1609
|
-
const isState = props && typeof props === "object" && "value" in props && "subscribe" in props;
|
|
1610
|
-
const isVNode = props && typeof props === "object" && "tagName" in props;
|
|
1611
|
-
const isChild = typeof props !== "object" || Array.isArray(props) || props === null || isState || isVNode;
|
|
1612
|
-
if (isChild) {
|
|
1613
|
-
actualProps = {};
|
|
1614
|
-
startIndex = 0;
|
|
1615
|
-
} else {
|
|
1616
|
-
actualProps = props;
|
|
1617
|
-
}
|
|
1618
|
-
const args = startIndex === 0 ? [props, ...rest] : rest;
|
|
1619
|
-
if (args.length === 0) {
|
|
1620
|
-
return { tagName: tag, props: actualProps, children: [] };
|
|
1621
|
-
}
|
|
1622
|
-
if (args.length === 1) {
|
|
1623
|
-
const child = args[0];
|
|
1624
|
-
if (child == null || child === false) {
|
|
1625
|
-
return { tagName: tag, props: actualProps, children: [] };
|
|
1626
|
-
}
|
|
1627
|
-
if (Array.isArray(child)) {
|
|
1628
|
-
const flatChildren2 = [];
|
|
1629
|
-
const len = child.length;
|
|
1630
|
-
for (let j = 0; j < len; j++) {
|
|
1631
|
-
const c = child[j];
|
|
1632
|
-
if (c != null && c !== false) {
|
|
1633
|
-
flatChildren2.push(c);
|
|
1634
|
-
}
|
|
1635
|
-
}
|
|
1636
|
-
return { tagName: tag, props: actualProps, children: flatChildren2 };
|
|
1637
|
-
}
|
|
1638
|
-
return { tagName: tag, props: actualProps, children: [child] };
|
|
1639
|
-
}
|
|
1640
|
-
const flatChildren = [];
|
|
1641
|
-
for (let i2 = 0; i2 < args.length; i2++) {
|
|
1642
|
-
const child = args[i2];
|
|
1643
|
-
if (child == null || child === false) continue;
|
|
1644
|
-
if (Array.isArray(child)) {
|
|
1645
|
-
const len = child.length;
|
|
1646
|
-
for (let j = 0; j < len; j++) {
|
|
1647
|
-
const c = child[j];
|
|
1648
|
-
if (c != null && c !== false) {
|
|
1649
|
-
flatChildren.push(c);
|
|
1650
|
-
}
|
|
1651
|
-
}
|
|
1652
|
-
} else {
|
|
1653
|
-
flatChildren.push(child);
|
|
1654
|
-
}
|
|
1655
|
-
}
|
|
1656
|
-
return { tagName: tag, props: actualProps, children: flatChildren };
|
|
1657
|
-
};
|
|
1658
|
-
};
|
|
1659
|
-
var tags = [
|
|
1660
|
-
"html",
|
|
1661
|
-
"head",
|
|
1662
|
-
"body",
|
|
1663
|
-
"title",
|
|
1664
|
-
"base",
|
|
1665
|
-
"link",
|
|
1666
|
-
"meta",
|
|
1667
|
-
"style",
|
|
1668
|
-
"address",
|
|
1669
|
-
"article",
|
|
1670
|
-
"aside",
|
|
1671
|
-
"footer",
|
|
1672
|
-
"header",
|
|
1673
|
-
"h1",
|
|
1674
|
-
"h2",
|
|
1675
|
-
"h3",
|
|
1676
|
-
"h4",
|
|
1677
|
-
"h5",
|
|
1678
|
-
"h6",
|
|
1679
|
-
"main",
|
|
1680
|
-
"nav",
|
|
1681
|
-
"section",
|
|
1682
|
-
"blockquote",
|
|
1683
|
-
"dd",
|
|
1684
|
-
"div",
|
|
1685
|
-
"dl",
|
|
1686
|
-
"dt",
|
|
1687
|
-
"figcaption",
|
|
1688
|
-
"figure",
|
|
1689
|
-
"hr",
|
|
1690
|
-
"li",
|
|
1691
|
-
"ol",
|
|
1692
|
-
"p",
|
|
1693
|
-
"pre",
|
|
1694
|
-
"ul",
|
|
1695
|
-
"a",
|
|
1696
|
-
"abbr",
|
|
1697
|
-
"b",
|
|
1698
|
-
"bdi",
|
|
1699
|
-
"bdo",
|
|
1700
|
-
"br",
|
|
1701
|
-
"cite",
|
|
1702
|
-
"code",
|
|
1703
|
-
"data",
|
|
1704
|
-
"dfn",
|
|
1705
|
-
"em",
|
|
1706
|
-
"i",
|
|
1707
|
-
"kbd",
|
|
1708
|
-
"mark",
|
|
1709
|
-
"q",
|
|
1710
|
-
"rp",
|
|
1711
|
-
"rt",
|
|
1712
|
-
"ruby",
|
|
1713
|
-
"s",
|
|
1714
|
-
"samp",
|
|
1715
|
-
"small",
|
|
1716
|
-
"span",
|
|
1717
|
-
"strong",
|
|
1718
|
-
"sub",
|
|
1719
|
-
"sup",
|
|
1720
|
-
"time",
|
|
1721
|
-
"u",
|
|
1722
|
-
"wbr",
|
|
1723
|
-
"area",
|
|
1724
|
-
"audio",
|
|
1725
|
-
"img",
|
|
1726
|
-
"map",
|
|
1727
|
-
"track",
|
|
1728
|
-
"video",
|
|
1729
|
-
"embed",
|
|
1730
|
-
"iframe",
|
|
1731
|
-
"object",
|
|
1732
|
-
"param",
|
|
1733
|
-
"picture",
|
|
1734
|
-
"portal",
|
|
1735
|
-
"source",
|
|
1736
|
-
"canvas",
|
|
1737
|
-
"noscript",
|
|
1738
|
-
"script",
|
|
1739
|
-
"del",
|
|
1740
|
-
"ins",
|
|
1741
|
-
"caption",
|
|
1742
|
-
"col",
|
|
1743
|
-
"colgroup",
|
|
1744
|
-
"table",
|
|
1745
|
-
"tbody",
|
|
1746
|
-
"td",
|
|
1747
|
-
"tfoot",
|
|
1748
|
-
"th",
|
|
1749
|
-
"thead",
|
|
1750
|
-
"tr",
|
|
1751
|
-
"button",
|
|
1752
|
-
"datalist",
|
|
1753
|
-
"fieldset",
|
|
1754
|
-
"form",
|
|
1755
|
-
"input",
|
|
1756
|
-
"label",
|
|
1757
|
-
"legend",
|
|
1758
|
-
"meter",
|
|
1759
|
-
"optgroup",
|
|
1760
|
-
"option",
|
|
1761
|
-
"output",
|
|
1762
|
-
"progress",
|
|
1763
|
-
"select",
|
|
1764
|
-
"textarea",
|
|
1765
|
-
"details",
|
|
1766
|
-
"dialog",
|
|
1767
|
-
"menu",
|
|
1768
|
-
"summary",
|
|
1769
|
-
"slot",
|
|
1770
|
-
"template"
|
|
1771
|
-
];
|
|
1772
|
-
var svgTags = [
|
|
1773
|
-
"svg",
|
|
1774
|
-
"circle",
|
|
1775
|
-
"rect",
|
|
1776
|
-
"path",
|
|
1777
|
-
"line",
|
|
1778
|
-
"polyline",
|
|
1779
|
-
"polygon",
|
|
1780
|
-
"ellipse",
|
|
1781
|
-
"g",
|
|
1782
|
-
"text",
|
|
1783
|
-
"tspan",
|
|
1784
|
-
"defs",
|
|
1785
|
-
"linearGradient",
|
|
1786
|
-
"radialGradient",
|
|
1787
|
-
"stop",
|
|
1788
|
-
"pattern",
|
|
1789
|
-
"mask",
|
|
1790
|
-
"clipPath",
|
|
1791
|
-
"use",
|
|
1792
|
-
"symbol",
|
|
1793
|
-
"marker",
|
|
1794
|
-
"image",
|
|
1795
|
-
"foreignObject",
|
|
1796
|
-
"animate",
|
|
1797
|
-
"animateTransform",
|
|
1798
|
-
"animateMotion",
|
|
1799
|
-
"set",
|
|
1800
|
-
"filter",
|
|
1801
|
-
"feBlend",
|
|
1802
|
-
"feColorMatrix",
|
|
1803
|
-
"feComponentTransfer",
|
|
1804
|
-
"feComposite",
|
|
1805
|
-
"feConvolveMatrix",
|
|
1806
|
-
"feDiffuseLighting",
|
|
1807
|
-
"feDisplacementMap",
|
|
1808
|
-
"feFlood",
|
|
1809
|
-
"feGaussianBlur",
|
|
1810
|
-
"feMorphology",
|
|
1811
|
-
"feOffset",
|
|
1812
|
-
"feSpecularLighting",
|
|
1813
|
-
"feTile",
|
|
1814
|
-
"feTurbulence"
|
|
1815
|
-
];
|
|
1816
|
-
var mathTags = [
|
|
1817
|
-
"math",
|
|
1818
|
-
"mi",
|
|
1819
|
-
"mn",
|
|
1820
|
-
"mo",
|
|
1821
|
-
"ms",
|
|
1822
|
-
"mtext",
|
|
1823
|
-
"mrow",
|
|
1824
|
-
"mfrac",
|
|
1825
|
-
"msqrt",
|
|
1826
|
-
"mroot",
|
|
1827
|
-
"msub",
|
|
1828
|
-
"msup"
|
|
1829
|
-
];
|
|
1830
|
-
var elements = {};
|
|
1831
|
-
tags.forEach((tag) => {
|
|
1832
|
-
elements[tag] = createElementFactory(tag);
|
|
1833
|
-
});
|
|
1834
|
-
svgTags.forEach((tag) => {
|
|
1835
|
-
const name = "svg" + tag.charAt(0).toUpperCase() + tag.slice(1);
|
|
1836
|
-
elements[name] = createElementFactory(tag);
|
|
1837
|
-
});
|
|
1838
|
-
mathTags.forEach((tag) => {
|
|
1839
|
-
const name = "math" + tag.charAt(0).toUpperCase() + tag.slice(1);
|
|
1840
|
-
elements[name] = createElementFactory(tag);
|
|
1841
|
-
});
|
|
1842
|
-
elements.varElement = createElementFactory("var");
|
|
1843
|
-
var {
|
|
1844
|
-
html,
|
|
1845
|
-
head,
|
|
1846
|
-
body,
|
|
1847
|
-
title,
|
|
1848
|
-
base,
|
|
1849
|
-
link,
|
|
1850
|
-
meta,
|
|
1851
|
-
style,
|
|
1852
|
-
address,
|
|
1853
|
-
article,
|
|
1854
|
-
aside,
|
|
1855
|
-
footer,
|
|
1856
|
-
header,
|
|
1857
|
-
h1,
|
|
1858
|
-
h2,
|
|
1859
|
-
h3,
|
|
1860
|
-
h4,
|
|
1861
|
-
h5,
|
|
1862
|
-
h6,
|
|
1863
|
-
main,
|
|
1864
|
-
nav,
|
|
1865
|
-
section,
|
|
1866
|
-
blockquote,
|
|
1867
|
-
dd,
|
|
1868
|
-
div,
|
|
1869
|
-
dl,
|
|
1870
|
-
dt,
|
|
1871
|
-
figcaption,
|
|
1872
|
-
figure,
|
|
1873
|
-
hr,
|
|
1874
|
-
li,
|
|
1875
|
-
ol,
|
|
1876
|
-
p,
|
|
1877
|
-
pre,
|
|
1878
|
-
ul,
|
|
1879
|
-
a,
|
|
1880
|
-
abbr,
|
|
1881
|
-
b,
|
|
1882
|
-
bdi,
|
|
1883
|
-
bdo,
|
|
1884
|
-
br,
|
|
1885
|
-
cite,
|
|
1886
|
-
code,
|
|
1887
|
-
data,
|
|
1888
|
-
dfn,
|
|
1889
|
-
em,
|
|
1890
|
-
i,
|
|
1891
|
-
kbd,
|
|
1892
|
-
mark,
|
|
1893
|
-
q,
|
|
1894
|
-
rp,
|
|
1895
|
-
rt,
|
|
1896
|
-
ruby,
|
|
1897
|
-
s,
|
|
1898
|
-
samp,
|
|
1899
|
-
small,
|
|
1900
|
-
span,
|
|
1901
|
-
strong,
|
|
1902
|
-
sub,
|
|
1903
|
-
sup,
|
|
1904
|
-
time,
|
|
1905
|
-
u,
|
|
1906
|
-
wbr,
|
|
1907
|
-
area,
|
|
1908
|
-
audio,
|
|
1909
|
-
img,
|
|
1910
|
-
map,
|
|
1911
|
-
track,
|
|
1912
|
-
video,
|
|
1913
|
-
embed,
|
|
1914
|
-
iframe,
|
|
1915
|
-
object,
|
|
1916
|
-
param,
|
|
1917
|
-
picture,
|
|
1918
|
-
portal,
|
|
1919
|
-
source,
|
|
1920
|
-
canvas,
|
|
1921
|
-
noscript,
|
|
1922
|
-
script,
|
|
1923
|
-
del,
|
|
1924
|
-
ins,
|
|
1925
|
-
caption,
|
|
1926
|
-
col,
|
|
1927
|
-
colgroup,
|
|
1928
|
-
table,
|
|
1929
|
-
tbody,
|
|
1930
|
-
td,
|
|
1931
|
-
tfoot,
|
|
1932
|
-
th,
|
|
1933
|
-
thead,
|
|
1934
|
-
tr,
|
|
1935
|
-
button,
|
|
1936
|
-
datalist,
|
|
1937
|
-
fieldset,
|
|
1938
|
-
form,
|
|
1939
|
-
input,
|
|
1940
|
-
label,
|
|
1941
|
-
legend,
|
|
1942
|
-
meter,
|
|
1943
|
-
optgroup,
|
|
1944
|
-
option,
|
|
1945
|
-
output,
|
|
1946
|
-
progress,
|
|
1947
|
-
select,
|
|
1948
|
-
textarea,
|
|
1949
|
-
details,
|
|
1950
|
-
dialog,
|
|
1951
|
-
menu,
|
|
1952
|
-
summary,
|
|
1953
|
-
slot,
|
|
1954
|
-
template,
|
|
1955
|
-
svgSvg,
|
|
1956
|
-
svgCircle,
|
|
1957
|
-
svgRect,
|
|
1958
|
-
svgPath,
|
|
1959
|
-
svgLine,
|
|
1960
|
-
svgPolyline,
|
|
1961
|
-
svgPolygon,
|
|
1962
|
-
svgEllipse,
|
|
1963
|
-
svgG,
|
|
1964
|
-
svgText,
|
|
1965
|
-
svgTspan,
|
|
1966
|
-
svgDefs,
|
|
1967
|
-
svgLinearGradient,
|
|
1968
|
-
svgRadialGradient,
|
|
1969
|
-
svgStop,
|
|
1970
|
-
svgPattern,
|
|
1971
|
-
svgMask,
|
|
1972
|
-
svgClipPath,
|
|
1973
|
-
svgUse,
|
|
1974
|
-
svgSymbol,
|
|
1975
|
-
svgMarker,
|
|
1976
|
-
svgImage,
|
|
1977
|
-
svgForeignObject,
|
|
1978
|
-
svgAnimate,
|
|
1979
|
-
svgAnimateTransform,
|
|
1980
|
-
svgAnimateMotion,
|
|
1981
|
-
svgSet,
|
|
1982
|
-
svgFilter,
|
|
1983
|
-
svgFeBlend,
|
|
1984
|
-
svgFeColorMatrix,
|
|
1985
|
-
svgFeComponentTransfer,
|
|
1986
|
-
svgFeComposite,
|
|
1987
|
-
svgFeConvolveMatrix,
|
|
1988
|
-
svgFeDiffuseLighting,
|
|
1989
|
-
svgFeDisplacementMap,
|
|
1990
|
-
svgFeFlood,
|
|
1991
|
-
svgFeGaussianBlur,
|
|
1992
|
-
svgFeMorphology,
|
|
1993
|
-
svgFeOffset,
|
|
1994
|
-
svgFeSpecularLighting,
|
|
1995
|
-
svgFeTile,
|
|
1996
|
-
svgFeTurbulence,
|
|
1997
|
-
mathMath,
|
|
1998
|
-
mathMi,
|
|
1999
|
-
mathMn,
|
|
2000
|
-
mathMo,
|
|
2001
|
-
mathMs,
|
|
2002
|
-
mathMtext,
|
|
2003
|
-
mathMrow,
|
|
2004
|
-
mathMfrac,
|
|
2005
|
-
mathMsqrt,
|
|
2006
|
-
mathMroot,
|
|
2007
|
-
mathMsub,
|
|
2008
|
-
mathMsup,
|
|
2009
|
-
varElement
|
|
2010
|
-
} = elements;
|
|
2011
|
-
|
|
2012
|
-
// src/index.ts
|
|
2013
|
-
var renderToHead = (...vNodes) => domNode.renderToHead(...vNodes);
|
|
2014
|
-
var addStyle = (css) => domNode.addStyle(css);
|
|
2015
|
-
var addMeta = (attrs) => domNode.addMeta(attrs);
|
|
2016
|
-
var addLink = (attrs) => domNode.addLink(attrs);
|
|
2017
|
-
var setTitle = (text2) => domNode.setTitle(text2);
|
|
2018
|
-
var renderToString = (vNode, options) => domNode.renderToString(vNode, options);
|
|
2019
|
-
var jsonToVNode = (json) => domNode.jsonToVNode(json);
|
|
2020
|
-
var renderJson = (container, json) => domNode.renderJson(container, json);
|
|
2021
|
-
var renderJsonToString = (json, options) => domNode.renderJsonToString(json, options);
|
|
2022
|
-
var vNodeJsonToVNode = (json) => domNode.vNodeJsonToVNode(json);
|
|
2023
|
-
var renderVNode = (container, json) => domNode.renderVNode(container, json);
|
|
2024
|
-
var renderVNodeToString = (json, options) => domNode.renderVNodeToString(json, options);
|
|
2025
|
-
if (typeof window !== "undefined") {
|
|
2026
|
-
Object.assign(window, {
|
|
2027
|
-
domNode,
|
|
2028
|
-
createElementFactory,
|
|
2029
|
-
renderToHead,
|
|
2030
|
-
addStyle,
|
|
2031
|
-
addMeta,
|
|
2032
|
-
addLink,
|
|
2033
|
-
setTitle,
|
|
2034
|
-
createState,
|
|
2035
|
-
computed,
|
|
2036
|
-
effect,
|
|
2037
|
-
reactive,
|
|
2038
|
-
reactiveAs,
|
|
2039
|
-
text,
|
|
2040
|
-
bindValue,
|
|
2041
|
-
bindChecked,
|
|
2042
|
-
batchRender,
|
|
2043
|
-
renderChunked,
|
|
2044
|
-
createVirtualList,
|
|
2045
|
-
lazy,
|
|
2046
|
-
cleanupUnused,
|
|
2047
|
-
renderToString,
|
|
2048
|
-
jsonToVNode,
|
|
2049
|
-
renderJson,
|
|
2050
|
-
renderJsonToString,
|
|
2051
|
-
vNodeJsonToVNode,
|
|
2052
|
-
renderVNode,
|
|
2053
|
-
renderVNodeToString,
|
|
2054
|
-
throttle,
|
|
2055
|
-
debounce,
|
|
2056
|
-
CreateStyle,
|
|
2057
|
-
createRouter,
|
|
2058
|
-
createRouterView,
|
|
2059
|
-
routerLink,
|
|
2060
|
-
...elements
|
|
2061
|
-
});
|
|
2062
|
-
}
|
|
2063
|
-
return __toCommonJS(index_exports);
|
|
2064
|
-
})();
|
|
1
|
+
var DomLib=(function(exports){'use strict';var Z=Object.defineProperty;var Q=(i,e)=>{for(var t in e)Z(i,t,{get:e[t],enumerable:true});};var E=class{constructor(){this.elementCache=new WeakMap;this.reactiveNodes=new Map;}createElement(e,t={},r=[]){return {tagName:e,props:t,children:r}}renderToDOM(e,t){if(e==null||e===false)return;if(typeof e!="object"){t.appendChild(document.createTextNode(String(e)));return}let{tagName:r,props:n,children:s}=e,a=r==="svg"||r[0]==="s"&&r[1]==="v"&&r[2]==="g"||t.namespaceURI==="http://www.w3.org/2000/svg",o=a?document.createElementNS("http://www.w3.org/2000/svg",r.replace("svg","").toLowerCase()||r):document.createElement(r);for(let p in n){let d=n[p];if(d==null||d===false)continue;let c=p.charCodeAt(0);if(c===99&&(p.length<6||p[5]==="N")){let h=Array.isArray(d)?d.join(" "):d;a?o.setAttribute("class",h):o.className=h;}else if(c===115&&p.length===5)if(typeof d=="string")o.style.cssText=d;else {let h=o.style;for(let g in d)h[g]=d[g];}else c===111&&p.charCodeAt(1)===110?o[p.toLowerCase()]=d:c===100&&p.length>20?o.innerHTML=d.__html:c===114&&p.length===3?setTimeout(()=>{typeof d=="function"?d(o):d.current=o;},0):o.setAttribute(p,d===true?"":String(d));}let u=s.length;if(!u){t.appendChild(o);return}let l=p=>{for(let d=0;d<u;d++){let c=s[d];if(!(c==null||c===false))if(Array.isArray(c))for(let h=0,g=c.length;h<g;h++){let v=c[h];v!=null&&v!==false&&this.renderToDOM(v,p);}else this.renderToDOM(c,p);}};if(u>30){let p=document.createDocumentFragment();l(p),o.appendChild(p);}else l(o);t.appendChild(o);}render(e,t){let r=typeof e=="string"?document.getElementById(e.replace("#","")):e;if(!r)throw new Error(`Element not found: ${e}`);if(t.children&&t.children.length>500){let n=document.createDocumentFragment();this.renderToDOM(t,n),r.appendChild(n);}else this.renderToDOM(t,r);return r}batchRender(e,t){let r=typeof e=="string"?document.getElementById(e.replace("#","")):e;if(!r)throw new Error(`Element not found: ${e}`);let n=t.length;if(n>3e3){let s=document.createDocumentFragment(),a=0,o=1500,u=()=>{let l=Math.min(a+o,n);for(let p=a;p<l;p++)this.renderToDOM(t[p],s);a=l,a>=n?r.appendChild(s):requestAnimationFrame(u);};u();}else {let s=document.createDocumentFragment();for(let a=0;a<n;a++)this.renderToDOM(t[a],s);r.appendChild(s);}return r}renderChunked(e,t,r=5e3,n){let s=typeof e=="string"?document.getElementById(e.replace("#","")):e;if(!s)throw new Error(`Element not found: ${e}`);let a=t.length,o=0,u=()=>{let l=Math.min(o+r,a),p=document.createDocumentFragment();for(let d=o;d<l;d++)this.renderToDOM(t[d],p);s.appendChild(p),o=l,n&&n(o,a),o<a&&requestAnimationFrame(u);};return requestAnimationFrame(u),s}renderToHead(...e){let t=document.head;if(t)for(let r of e.flat())r&&this.renderToDOM(r,t);return t}addStyle(e){let t=document.createElement("style");return t.textContent=e,document.head.appendChild(t)}addMeta(e){let t=document.createElement("meta");for(let r in e)t.setAttribute(r,e[r]);return document.head.appendChild(t)}addLink(e){let t=document.createElement("link");for(let r in e)t.setAttribute(r,e[r]);return document.head.appendChild(t)}setTitle(e){return document.title=e}createState(e,t={}){let r=e,n=new Set,s=null,{throttle:a=0,deep:o=false}=t,u=()=>n.forEach(p=>p(r)),l=()=>{a>0?s||(s=setTimeout(()=>{s=null,u();},a)):u();};return {get value(){return r},set value(p){(o?JSON.stringify(r)!==JSON.stringify(p):r!==p)&&(r=p,l());},subscribe(p){return n.add(p),()=>n.delete(p)},destroy(){n.clear(),s&&clearTimeout(s);}}}computed(e,t){let r=e.map(s=>s.value),n=this.createState(t(...r));return e.forEach((s,a)=>{s.subscribe(o=>{r[a]=o,n.value=t(...r);});}),n}effect(e){e();}createVirtualList(e,t,r,n=50,s=5){let a=e.clientHeight,o=t.length*n,u=0,l=()=>{let c=Math.max(0,Math.floor(u/n)-s),h=Math.min(t.length,Math.ceil((u+a)/n)+s);return {start:c,end:h}},p=()=>{let{start:c,end:h}=l(),g=document.createElement("div");g.style.cssText=`height:${o}px;position:relative`;for(let v=c;v<h;v++){let m=document.createElement("div");m.style.cssText=`position:absolute;top:${v*n}px;height:${n}px;width:100%`,this.renderToDOM(r(t[v],v),m),g.appendChild(m);}e.innerHTML="",e.appendChild(g);},d=()=>{u=e.scrollTop,requestAnimationFrame(p);};return e.addEventListener("scroll",d),p(),{render:p,destroy:()=>{e.removeEventListener("scroll",d),e.innerHTML="";}}}lazy(e){let t=null,r=false;return async(...n)=>(!t&&!r&&(r=true,t=await e(),r=false),t?t(...n):{tagName:"div",props:{class:"loading"},children:["Loading..."]})}cleanupUnusedElements(e){let t=document.createTreeWalker(e,NodeFilter.SHOW_ELEMENT),r=[];for(;t.nextNode();){let n=t.currentNode;n.id&&n.id.startsWith("r")&&!this.elementCache.has(n)&&r.push(n);}return r.forEach(n=>n.remove()),r.length}renderToString(e,t={}){let{pretty:r=false,indent:n=0}=t,s=r?" ".repeat(n):"",a=r?`
|
|
2
|
+
`:"",o=this.resolveStateValue(e);if(o=this.unwrapReactive(o),Array.isArray(o))return o.map(g=>this.renderToString(g,t)).join("");if(typeof o!="object"||o===null)return o==null||o===false?"":this.escapeHtml(String(o));let{tagName:u,props:l,children:p}=o,d=this.isSelfClosingTag(u),c=`${s}<${u}`,h=this.propsToAttributes(l);if(h&&(c+=` ${h}`),d)return c+=` />${a}`,c;if(c+=">",l.dangerouslySetInnerHTML)return c+=l.dangerouslySetInnerHTML.__html,c+=`</${u}>${a}`,c;if(p&&p.length>0){let g=p.map(m=>{let y=this.resolveStateValue(m);return this.unwrapReactive(y)}),v=g.some(m=>typeof m=="object"&&m!==null&&!Array.isArray(m)&&"tagName"in m);if(r&&v){c+=a;for(let m of g)if(!(m==null||m===false))if(Array.isArray(m))for(let y of m)y!=null&&y!==false&&(c+=this.renderToString(y,{pretty:r,indent:n+1}));else c+=this.renderToString(m,{pretty:r,indent:n+1});c+=s;}else for(let m of g)if(!(m==null||m===false))if(Array.isArray(m))for(let y of m)y!=null&&y!==false&&(c+=this.renderToString(y,{pretty:false,indent:0}));else c+=this.renderToString(m,{pretty:false,indent:0});}return c+=`</${u}>${a}`,c}resolveStateValue(e){return e&&typeof e=="object"&&"value"in e&&"subscribe"in e?e.value:e}isReactiveWrapper(e){return !e||typeof e!="object"||!e.tagName?false:e.tagName==="span"&&e.props?.id&&typeof e.props.id=="string"&&e.props.id.match(/^r[a-z0-9]{9}$/)}unwrapReactive(e){if(!this.isReactiveWrapper(e))return e;let t=e.children;if(!t||t.length===0)return "";if(t.length===1){let r=t[0];if(r&&typeof r=="object"&&r.tagName==="span"){let n=r.props,s=!n||Object.keys(n).length===0,a=r.children&&r.children.length===1&&typeof r.children[0]=="string";if(s&&a)return r.children[0]}return this.unwrapReactive(r)}return t.map(r=>this.unwrapReactive(r))}escapeHtml(e){let t={"&":"&","<":"<",">":">",'"':""","'":"'"};return e.replace(/[&<>"']/g,r=>t[r])}isSelfClosingTag(e){return new Set(["area","base","br","col","embed","hr","img","input","link","meta","param","source","track","wbr"]).has(e.toLowerCase())}propsToAttributes(e){let t=[];for(let r in e){if(r==="children"||r==="dangerouslySetInnerHTML"||r==="ref")continue;let n=e[r];if(n=this.resolveStateValue(n),!(n==null||n===false)&&!(r.startsWith("on")&&typeof n=="function")){if(r==="className"||r==="class"){let s=Array.isArray(n)?n.join(" "):n;s&&t.push(`class="${this.escapeHtml(String(s))}"`);continue}if(r==="style"){let s=this.styleToString(n);s&&t.push(`style="${this.escapeHtml(s)}"`);continue}if(n===true){t.push(r);continue}t.push(`${r}="${this.escapeHtml(String(n))}"`);}}return t.join(" ")}styleToString(e){if(typeof e=="string")return e;if(typeof e=="object"&&e!==null){let t=[];for(let r in e){let n=r.replace(/([A-Z])/g,"-$1").toLowerCase();t.push(`${n}:${e[r]}`);}return t.join(";")}return ""}isState(e){return e&&typeof e=="object"&&"value"in e&&"subscribe"in e&&typeof e.subscribe=="function"}createReactiveChild(e,t){let r=t(e.value);if(typeof window<"u"&&typeof document<"u"){let n={node:null,renderFn:t};this.reactiveNodes.set(e,n),e.subscribe(()=>{if(n.node&&n.node.parentNode){let s=t(e.value);n.node.textContent=String(s??"");}});}return r}jsonToVNode(e){if(this.isState(e))return this.createReactiveChild(e,o=>o);if(e==null||typeof e=="boolean"||typeof e=="string"||typeof e=="number")return e;let{tag:t,attributes:r={},children:n}=e,s={};for(let o in r){let u=r[o];o==="class"?s.className=this.isState(u)?u.value:u:s[o]=this.isState(u)?u.value:u;}let a=[];if(n!=null)if(Array.isArray(n))for(let o of n)if(this.isState(o))a.push(this.createReactiveChild(o,u=>u));else {let u=this.jsonToVNode(o);u!=null&&u!==false&&a.push(u);}else if(this.isState(n))a.push(this.createReactiveChild(n,o=>o));else if(typeof n=="object"&&"tag"in n){let o=this.jsonToVNode(n);o!=null&&o!==false&&a.push(o);}else a.push(n);return {tagName:t,props:s,children:a}}vNodeJsonToVNode(e){if(this.isState(e))return this.createReactiveChild(e,o=>o);if(e==null||typeof e=="boolean"||typeof e=="string"||typeof e=="number")return e;let{tagName:t,props:r={},children:n=[]}=e,s={};for(let o in r){let u=r[o];s[o]=this.isState(u)?u.value:u;}let a=[];for(let o of n)if(this.isState(o))a.push(this.createReactiveChild(o,u=>u));else {let u=this.vNodeJsonToVNode(o);u!=null&&u!==false&&a.push(u);}return {tagName:t,props:s,children:a}}renderJson(e,t){let r=this.jsonToVNode(t);if(!r||typeof r!="object"||!("tagName"in r))throw new Error("Invalid JSON structure");return this.render(e,r)}renderVNode(e,t){let r=this.vNodeJsonToVNode(t);if(!r||typeof r!="object"||!("tagName"in r))throw new Error("Invalid VNode JSON structure");return this.render(e,r)}renderJsonToString(e,t={}){let r=this.jsonToVNode(e);return this.renderToString(r,t)}renderVNodeToString(e,t={}){let r=this.vNodeJsonToVNode(e);return this.renderToString(r,t)}getElementCache(){return this.elementCache}},f=new E;var C=(i,e)=>f.createState(i,e),x=(i,e)=>f.computed(i,e),w=i=>f.effect(i),V=(i,e)=>f.batchRender(i,e),$=(i,e,t,r)=>f.renderChunked(i,e,t,r),k=(i,e,t,r,n)=>f.createVirtualList(i,e,t,r,n),F=i=>f.lazy(i),A=i=>f.cleanupUnusedElements(i),H=(i,e)=>{let t=null;return (...r)=>{t||(t=setTimeout(()=>{t=null,i(...r);},e));}},O=(i,e)=>{let t=null;return (...r)=>{t&&clearTimeout(t),t=setTimeout(()=>i(...r),e);}};var M=class{constructor(e,t,r){this.key=e;this.wsUrl=r;this.ws=null;this.pendingUpdates=[];this.localState=C(t),this.previousValue=t,this.connect();}get value(){return this.localState.value}set value(e){this.previousValue=this.localState.value,this.localState.value=e,this.sendToServer(e);}get state(){return this.localState}onChange(e){return this.localState.subscribe(t=>{let r=this.previousValue;this.previousValue=t,e(t,r);})}update(e){this.value=e(this.value);}connect(){if(typeof window>"u")return;let e=this.wsUrl||`ws://${location.host}`;this.ws=new WebSocket(e),this.ws.addEventListener("open",()=>{for(this.subscribe();this.pendingUpdates.length>0;){let t=this.pendingUpdates.shift();this.sendToServer(t);}}),this.ws.addEventListener("message",t=>{this.handleMessage(t.data);}),this.ws.addEventListener("close",()=>{setTimeout(()=>this.connect(),1e3);}),this.ws.addEventListener("error",t=>{console.error("[SharedState] WebSocket error:",t);});}subscribe(){!this.ws||this.ws.readyState!==WebSocket.OPEN||this.ws.send(JSON.stringify({type:"state:subscribe",key:this.key}));}handleMessage(e){try{let t=JSON.parse(e);if(t.key!==this.key)return;(t.type==="state:init"||t.type==="state:update")&&(this.localState.value=t.value);}catch{}}sendToServer(e){if(this.ws){if(this.ws.readyState!==WebSocket.OPEN){this.pendingUpdates.push(e);return}this.ws.send(JSON.stringify({type:"state:change",key:this.key,value:e}));}}disconnect(){this.ws&&(this.ws.close(),this.ws=null);}destroy(){this.disconnect(),this.localState.destroy();}};function j(i,e,t){return new M(i,e,t)}var P=class{constructor(){this.states=new Map;}create(e,t,r){if(this.states.has(e))return this.states.get(e);let n=new M(e,t,r);return this.states.set(e,n),n}get(e){return this.states.get(e)}delete(e){let t=this.states.get(e);return t?(t.destroy(),this.states.delete(e)):false}clear(){this.states.forEach(e=>e.destroy()),this.states.clear();}},J=new P;var L=(i,e)=>{let t=null,r=null,n=null,s=true,a=e(i.value),o=a&&typeof a=="object"&&"tagName"in a,u=a==null||a===false,l=()=>{if(!r&&!n)return;let d=e(i.value);if(d==null||d===false)s&&r&&(n=document.createComment("reactive"),r.parentNode?.replaceChild(n,r),s=false);else if(!s&&n&&r&&(n.parentNode?.replaceChild(r,n),n=null,s=true),r){let h=document.createDocumentFragment();if(o&&d&&typeof d=="object"&&"tagName"in d){let{props:g,children:v}=d;for(let m in g){let y=g[m];if(m!=="ref")if(m==="class"||m==="className")r.className=Array.isArray(y)?y.join(" "):y||"";else if(m==="style"&&typeof y=="object"){let T=r.style;for(let z in y)T[z]=y[z];}else m.startsWith("on")?r[m.toLowerCase()]=y:y!=null&&y!==false?r.setAttribute(m,String(y===true?"":y)):r.removeAttribute(m);}for(let m of v)f.renderToDOM(m,h);}else f.renderToDOM(d,h);r.textContent="",r.appendChild(h),f.getElementCache().set(r,true);}};i.subscribe(()=>{t&&cancelAnimationFrame(t),t=requestAnimationFrame(()=>{l(),t=null;});});let p=d=>{r=d,u&&d.parentNode&&(n=document.createComment("reactive"),d.parentNode.replaceChild(n,d),s=false);};if(o){let d=a;return {tagName:d.tagName,props:{...d.props,ref:p},children:d.children}}return {tagName:"span",props:{ref:p},children:[a]}},D=(i,e,t,r={})=>{let n=null,s=null;return e.subscribe(()=>{n&&cancelAnimationFrame(n),n=requestAnimationFrame(()=>{if(s){let o=document.createDocumentFragment(),u=t(e.value);u==null||u===false?(s.style.display="none",s.textContent=""):(s.style.display="",f.renderToDOM(u,o),s.textContent="",s.appendChild(o)),f.getElementCache().set(s,true);}n=null;});}),{tagName:i,props:{...r,ref:o=>{s=o;}},children:[t(e.value)]}},W=i=>i&&i.value!==void 0?L(i,e=>({tagName:"span",props:{},children:[String(e)]})):String(i),K=i=>({value:i.value,oninput:e=>{i.value=e.target.value;}}),q=i=>({checked:i.value,onchange:e=>{i.value=e.target.checked;}});var N=class{constructor(){this.variables=[];this.rules=[];this.mediaRules=[];this.keyframes=[];this.fontFaces=[];this.imports=[];this.containerRules=[];this.supportsRules=[];this.layerRules=[];this._layerOrder=[];}addVar(e,t){let r={name:e.startsWith("--")?e:`--${e}`,value:t,toString(){return `var(${this.name})`}};return this.variables.push(r),r}var(e,t){let r=typeof e=="string"?e.startsWith("--")?e:`--${e}`:e.name;return t?`var(${r}, ${t})`:`var(${r})`}addTag(e,t){let r={selector:e,styles:t,type:"tag"};return this.rules.push(r),r}addClass(e,t){let n={selector:e.startsWith(".")?e:`.${e}`,styles:t,type:"class"};return this.rules.push(n),n}addId(e,t){let n={selector:e.startsWith("#")?e:`#${e}`,styles:t,type:"id"};return this.rules.push(n),n}addPseudoClass(e,t,r){let n=e.startsWith(":")?e:`:${e}`,a={selector:r?`${r}${n}`:n,styles:t,type:"pseudo-class"};return this.rules.push(a),a}addPseudoElement(e,t,r){let n=e.startsWith("::")?e:`::${e}`,a={selector:r?`${r}${n}`:n,styles:t,type:"pseudo-element"};return this.rules.push(a),a}addAttribute(e,t,r){let n=e.startsWith("[")?e:`[${e}]`,a={selector:r?`${r}${n}`:n,styles:t,type:"attribute"};return this.rules.push(a),a}attrEquals(e,t,r,n){return this.addAttribute(`${e}="${t}"`,r,n)}attrContainsWord(e,t,r,n){return this.addAttribute(`${e}~="${t}"`,r,n)}attrStartsWith(e,t,r,n){return this.addAttribute(`${e}^="${t}"`,r,n)}attrEndsWith(e,t,r,n){return this.addAttribute(`${e}$="${t}"`,r,n)}attrContains(e,t,r,n){return this.addAttribute(`${e}*="${t}"`,r,n)}descendant(e,t,r){let s={selector:`${e} ${t}`,styles:r,type:"custom"};return this.rules.push(s),s}child(e,t,r){let s={selector:`${e} > ${t}`,styles:r,type:"custom"};return this.rules.push(s),s}adjacentSibling(e,t,r){let s={selector:`${e} + ${t}`,styles:r,type:"custom"};return this.rules.push(s),s}generalSibling(e,t,r){let s={selector:`${e} ~ ${t}`,styles:r,type:"custom"};return this.rules.push(s),s}multiple(e,t){let n={selector:e.join(", "),styles:t,type:"custom"};return this.rules.push(n),n}addName(e,t){return {selector:e.startsWith("--")?`&${e}`:`&--${e}`,styles:t,type:"name"}}nesting(e,...t){return e.nested=t,e}keyframe(e,t){let r=Object.entries(t).map(([s,a])=>({step:s==="from"?"from":s==="to"?"to":`${s}%`,styles:a})),n={name:e,steps:r};return this.keyframes.push(n),n}keyframeFromTo(e,t,r){return this.keyframe(e,{from:t,to:r})}fontFace(e){return this.fontFaces.push(e),e}import(e,t){let r=t?`@import url("${e}") ${t};`:`@import url("${e}");`;return this.imports.push(r),r}media(e,t,r){let n=Object.entries(r).map(([a,o])=>({selector:a,styles:o,type:"custom"})),s={type:e,condition:t,rules:n};return this.mediaRules.push(s),s}mediaScreen(e,t){return this.media("screen",e,t)}mediaPrint(e){return this.media("print","",e)}mediaMinWidth(e,t){return this.media("screen",`min-width: ${e}`,t)}mediaMaxWidth(e,t){return this.media("screen",`max-width: ${e}`,t)}mediaDark(e){let r={type:"",condition:"prefers-color-scheme: dark",rules:Object.entries(e).map(([n,s])=>({selector:n,styles:s,type:"custom"}))};return this.mediaRules.push(r),r}mediaLight(e){let r={type:"",condition:"prefers-color-scheme: light",rules:Object.entries(e).map(([n,s])=>({selector:n,styles:s,type:"custom"}))};return this.mediaRules.push(r),r}mediaReducedMotion(e){let r={type:"",condition:"prefers-reduced-motion: reduce",rules:Object.entries(e).map(([n,s])=>({selector:n,styles:s,type:"custom"}))};return this.mediaRules.push(r),r}container(e,t,r){let n=Object.entries(t).map(([a,o])=>({selector:a,styles:o,type:"custom"})),s={name:r,condition:e,rules:n};return this.containerRules.push(s),s}addContainer(e,t){let r={...t,containerName:e};return this.addClass(e,r)}supports(e,t){let r=Object.entries(t).map(([s,a])=>({selector:s,styles:a,type:"custom"})),n={condition:e,rules:r};return this.supportsRules.push(n),n}layerOrder(...e){this._layerOrder=e;}layer(e,t){let r=Object.entries(t).map(([s,a])=>({selector:s,styles:a,type:"custom"})),n={name:e,rules:r};return this.layerRules.push(n),n}add(e){return Object.entries(e).map(([r,n])=>{let s={selector:r,styles:n,type:"custom"};return this.rules.push(s),s})}important(e){return `${e} !important`}toKebabCase(e){return e.replace(/([a-z])([A-Z])/g,"$1-$2").toLowerCase()}stylesToString(e,t=" "){return Object.entries(e).map(([r,n])=>{let s=typeof n=="object"&&n!==null&&"name"in n?`var(${n.name})`:n;return `${t}${this.toKebabCase(r)}: ${s};`}).join(`
|
|
3
|
+
`)}renderRule(e,t=""){let r=`${t}${e.selector} {
|
|
4
|
+
${this.stylesToString(e.styles,t+" ")}
|
|
5
|
+
`;if(e.nested&&e.nested.length>0)for(let n of e.nested){let s=n.selector.startsWith("&")?n.selector.replace(/&/g,e.selector):`${e.selector} ${n.selector}`;r+=`
|
|
6
|
+
${t}${s} {
|
|
7
|
+
${this.stylesToString(n.styles,t+" ")}
|
|
8
|
+
${t}}
|
|
9
|
+
`;}return r+=`${t}}`,r}renderMediaRule(e){let r=`@media ${e.type&&e.condition?`${e.type} and (${e.condition})`:e.type?e.type:`(${e.condition})`} {
|
|
10
|
+
`;for(let n of e.rules)r+=this.renderRule(n," ")+`
|
|
11
|
+
`;return r+="}",r}renderKeyframes(e){let t=`@keyframes ${e.name} {
|
|
12
|
+
`;for(let r of e.steps)t+=` ${r.step} {
|
|
13
|
+
${this.stylesToString(r.styles," ")}
|
|
14
|
+
}
|
|
15
|
+
`;return t+="}",t}renderFontFace(e){let t=`@font-face {
|
|
16
|
+
`;return t+=` font-family: "${e.fontFamily}";
|
|
17
|
+
`,t+=` src: ${e.src};
|
|
18
|
+
`,e.fontWeight&&(t+=` font-weight: ${e.fontWeight};
|
|
19
|
+
`),e.fontStyle&&(t+=` font-style: ${e.fontStyle};
|
|
20
|
+
`),e.fontDisplay&&(t+=` font-display: ${e.fontDisplay};
|
|
21
|
+
`),e.unicodeRange&&(t+=` unicode-range: ${e.unicodeRange};
|
|
22
|
+
`),t+="}",t}renderContainerRule(e){let r=`@container ${e.name?`${e.name} `:""}(${e.condition}) {
|
|
23
|
+
`;for(let n of e.rules)r+=this.renderRule(n," ")+`
|
|
24
|
+
`;return r+="}",r}renderSupportsRule(e){let t=`@supports (${e.condition}) {
|
|
25
|
+
`;for(let r of e.rules)t+=this.renderRule(r," ")+`
|
|
26
|
+
`;return t+="}",t}renderLayerRule(e){let t=`@layer ${e.name} {
|
|
27
|
+
`;for(let r of e.rules)t+=this.renderRule(r," ")+`
|
|
28
|
+
`;return t+="}",t}render(...e){let t=[];if(this.imports.length>0&&t.push(this.imports.join(`
|
|
29
|
+
`)),this._layerOrder.length>0&&t.push(`@layer ${this._layerOrder.join(", ")};`),this.variables.length>0){let l=this.variables.map(p=>` ${p.name}: ${p.value};`).join(`
|
|
30
|
+
`);t.push(`:root {
|
|
31
|
+
${l}
|
|
32
|
+
}`);}for(let l of this.fontFaces)t.push(this.renderFontFace(l));for(let l of this.keyframes)t.push(this.renderKeyframes(l));let r=[...this.rules],n=[...this.mediaRules],s=[],a=[...this.containerRules],o=[...this.supportsRules],u=[...this.layerRules];for(let l of e)l&&(Array.isArray(l)?r.push(...l):"condition"in l&&"rules"in l&&!("name"in l&&"steps"in l)?"type"in l?n.push(l):"name"in l&&typeof l.name=="string"?a.push(l):o.push(l):"name"in l&&"steps"in l?s.push(l):"name"in l&&"rules"in l?u.push(l):r.push(l));for(let l of s)t.push(this.renderKeyframes(l));for(let l of u)t.push(this.renderLayerRule(l));for(let l of r)t.push(this.renderRule(l));for(let l of o)t.push(this.renderSupportsRule(l));for(let l of a)t.push(this.renderContainerRule(l));for(let l of n)t.push(this.renderMediaRule(l));return t.join(`
|
|
33
|
+
|
|
34
|
+
`)}inject(e){let t=this.render(),r=document.createElement("style");return e&&(r.id=e),r.textContent=t,document.head.appendChild(r),r}clear(){this.variables=[],this.rules=[],this.mediaRules=[],this.keyframes=[],this.fontFaces=[],this.imports=[],this.containerRules=[],this.supportsRules=[],this.layerRules=[],this._layerOrder=[];}};function I(i,e){let t=i.split("/").filter(Boolean),r=e.split("/").filter(Boolean);if(i.endsWith("*")){let s=i.slice(0,-1);if(e.startsWith(s)||s==="/"||i==="*")return {"*":e.slice(s.length)}}if(t.length!==r.length)return null;let n={};for(let s=0;s<t.length;s++){let a=t[s],o=r[s];if(a.startsWith(":"))n[a.slice(1)]=decodeURIComponent(o);else if(a!==o)return null}return n}function G(i){let{mode:e="history",base:t="",routes:r}=i,n=[],s=c=>{let h={};return new URLSearchParams(c).forEach((v,m)=>{h[m]=v;}),h},a=()=>e==="hash"?window.location.hash.slice(1)||"/":window.location.pathname.replace(t,"")||"/",o=c=>{let[h,g=""]=c.split("?"),[v,m=""]=h.split("#");return {path:v||"/",params:{},query:s(g),hash:m?"#"+m:""}},u=c=>{for(let h of r){let g=I(h.path,c);if(g!==null)return {route:h,params:g}}return null},l=f.createState(o(a())),p=(c,h=false)=>{let g=o(c),v=u(g.path);v&&(g.params=v.params);for(let y of n){let T=y(g,l.value);if(T===false)return;if(typeof T=="string"){p(T,h);return}}if(v?.route.beforeEnter){let y=v.route.beforeEnter(g,l.value);if(y===false)return;if(typeof y=="string"){p(y,h);return}}let m=e==="hash"?"#"+c:t+c;h?window.history.replaceState({path:c},"",m):window.history.pushState({path:c},"",m),l.value=g;},d=()=>{let c=a(),h=o(c),g=u(h.path);g&&(h.params=g.params),l.value=h;};return typeof window<"u"&&window.addEventListener("popstate",d),{currentRoute:l,push:c=>p(c,false),replace:c=>p(c,true),back:()=>window.history.back(),forward:()=>window.history.forward(),go:c=>window.history.go(c),beforeEach:c=>{n.push(c);},destroy:()=>{typeof window<"u"&&window.removeEventListener("popstate",d),l.destroy();}}}function U(i,e){let{routes:t,notFound:r}=e;return ()=>{let n=i.currentRoute.value,s=t.find(a=>I(a.path,n.path)!==null);if(s){let a=I(s.path,n.path)||{},o=s.component({...a,...n.query});return typeof o=="object"&&o!==null&&"tagName"in o?o:{tagName:"span",props:{},children:[o]}}if(r){let a=r(n.params);return typeof a=="object"&&a!==null&&"tagName"in a?a:{tagName:"span",props:{},children:[a]}}return {tagName:"div",props:{},children:["404 - Not Found"]}}}var B=(i,e,...t)=>({tagName:"a",props:{...e,href:e.to,onclick:r=>{r.preventDefault(),i.push(e.to);}},children:t});var b=i=>function(e,...t){if(!arguments.length)return {tagName:i,props:{},children:[]};let r=e&&typeof e=="object"&&"value"in e&&"subscribe"in e,n=e&&typeof e=="object"&&"tagName"in e,s=typeof e!="object"||Array.isArray(e)||e===null||r||n,a=s?{}:e,o=s?[e,...t]:t;if(!o.length)return {tagName:i,props:a,children:[]};let u=[];for(let l=0,p=o.length;l<p;l++){let d=o[l];if(!(d==null||d===false))if(Array.isArray(d))for(let c=0,h=d.length;c<h;c++){let g=d[c];g!=null&&g!==false&&u.push(g);}else u.push(d);}return {tagName:i,props:a,children:u}},X=["html","head","body","title","base","link","meta","style","address","article","aside","footer","header","h1","h2","h3","h4","h5","h6","main","nav","section","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","wbr","area","audio","img","map","track","video","embed","iframe","object","param","picture","portal","source","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","slot","template"],Y=["svg","circle","rect","path","line","polyline","polygon","ellipse","g","text","tspan","defs","linearGradient","radialGradient","stop","pattern","mask","clipPath","use","symbol","marker","image","foreignObject","animate","animateTransform","animateMotion","set","filter","feBlend","feColorMatrix","feComponentTransfer","feComposite","feConvolveMatrix","feDiffuseLighting","feDisplacementMap","feFlood","feGaussianBlur","feMorphology","feOffset","feSpecularLighting","feTile","feTurbulence"],ee=["math","mi","mn","mo","ms","mtext","mrow","mfrac","msqrt","mroot","msub","msup"],R={};X.forEach(i=>{R[i]=b(i);});Y.forEach(i=>{let e="svg"+i.charAt(0).toUpperCase()+i.slice(1);R[e]=b(i);});ee.forEach(i=>{let e="math"+i.charAt(0).toUpperCase()+i.slice(1);R[e]=b(i);});R.varElement=b("var");var {html:te,head:re,body:ne,title:se,base:oe,link:ie,meta:ae,style:le,address:ue,article:ce,aside:de,footer:pe,header:me,h1:he,h2:ge,h3:fe,h4:ye,h5:Se,h6:ve,main:Re,nav:be,section:Te,blockquote:Ce,dd:Me,div:Ne,dl:Ee,dt:Le,figcaption:xe,figure:we,hr:Ve,li:$e,ol:ke,p:Fe,pre:Ae,ul:He,a:Oe,abbr:Pe,b:je,bdi:Je,bdo:De,br:We,cite:Ke,code:qe,data:Ie,dfn:Ge,em:Ue,i:Be,kbd:_e,mark:ze,q:Ze,rp:Qe,rt:Xe,ruby:Ye,s:et,samp:tt,small:rt,span:nt,strong:st,sub:ot,sup:it,time:at,u:lt,wbr:ut,area:ct,audio:dt,img:pt,map:mt,track:ht,video:gt,embed:ft,iframe:yt,object:St,param:vt,picture:Rt,portal:bt,source:Tt,canvas:Ct,noscript:Mt,script:Nt,del:Et,ins:Lt,caption:xt,col:wt,colgroup:Vt,table:$t,tbody:kt,td:Ft,tfoot:At,th:Ht,thead:Ot,tr:Pt,button:jt,datalist:Jt,fieldset:Dt,form:Wt,input:Kt,label:qt,legend:It,meter:Gt,optgroup:Ut,option:Bt,output:_t,progress:zt,select:Zt,textarea:Qt,details:Xt,dialog:Yt,menu:er,summary:tr,slot:rr,template:nr,svgSvg:sr,svgCircle:or,svgRect:ir,svgPath:ar,svgLine:lr,svgPolyline:ur,svgPolygon:cr,svgEllipse:dr,svgG:pr,svgText:mr,svgTspan:hr,svgDefs:gr,svgLinearGradient:fr,svgRadialGradient:yr,svgStop:Sr,svgPattern:vr,svgMask:Rr,svgClipPath:br,svgUse:Tr,svgSymbol:Cr,svgMarker:Mr,svgImage:Nr,svgForeignObject:Er,svgAnimate:Lr,svgAnimateTransform:xr,svgAnimateMotion:wr,svgSet:Vr,svgFilter:$r,svgFeBlend:kr,svgFeColorMatrix:Fr,svgFeComponentTransfer:Ar,svgFeComposite:Hr,svgFeConvolveMatrix:Or,svgFeDiffuseLighting:Pr,svgFeDisplacementMap:jr,svgFeFlood:Jr,svgFeGaussianBlur:Dr,svgFeMorphology:Wr,svgFeOffset:Kr,svgFeSpecularLighting:qr,svgFeTile:Ir,svgFeTurbulence:Gr,mathMath:Ur,mathMi:Br,mathMn:_r,mathMo:zr,mathMs:Zr,mathMtext:Qr,mathMrow:Xr,mathMfrac:Yr,mathMsqrt:en,mathMroot:tn,mathMsub:rn,mathMsup:nn,varElement:sn}=R;var _={};Q(_,{commentNode:()=>mn,createEl:()=>ln,createMathEl:()=>cn,createSvgEl:()=>un,doc:()=>S,el:()=>on,elClass:()=>gn,elId:()=>hn,elName:()=>yn,elTag:()=>fn,els:()=>an,fragment:()=>dn,textNode:()=>pn});var S=document,on=S.querySelector.bind(S),an=S.querySelectorAll.bind(S),ln=S.createElement.bind(S),un=S.createElementNS.bind(S,"http://www.w3.org/2000/svg"),cn=S.createElementNS.bind(S,"http://www.w3.org/1998/Math/MathML"),dn=S.createDocumentFragment.bind(S),pn=S.createTextNode.bind(S),mn=S.createComment.bind(S),hn=S.getElementById.bind(S),gn=S.getElementsByClassName.bind(S),fn=S.getElementsByTagName.bind(S),yn=S.getElementsByName.bind(S);var Sn=(...i)=>f.renderToHead(...i),vn=i=>f.addStyle(i),Rn=i=>f.addMeta(i),bn=i=>f.addLink(i),Tn=i=>f.setTitle(i),Cn=(i,e)=>f.renderToString(i,e),Mn=i=>f.jsonToVNode(i),Nn=(i,e)=>f.renderJson(i,e),En=(i,e)=>f.renderJsonToString(i,e),Ln=i=>f.vNodeJsonToVNode(i),xn=(i,e)=>f.renderVNode(i,e),wn=(i,e)=>f.renderVNodeToString(i,e);typeof window<"u"&&Object.assign(window,{domNode:f,createElementFactory:b,renderToHead:Sn,addStyle:vn,addMeta:Rn,addLink:bn,setTitle:Tn,createState:C,computed:x,effect:w,createSharedState:j,sharedStateManager:J,reactive:L,reactiveAs:D,text:W,bindValue:K,bindChecked:q,batchRender:V,renderChunked:$,createVirtualList:k,lazy:F,cleanupUnused:A,renderToString:Cn,jsonToVNode:Mn,renderJson:Nn,renderJsonToString:En,vNodeJsonToVNode:Ln,renderVNode:xn,renderVNodeToString:wn,throttle:H,debounce:O,CreateStyle:N,createRouter:G,createRouterView:U,routerLink:B,...R,..._});
|
|
35
|
+
exports.CreateStyle=N;exports.DomNode=E;exports.SharedState=M;exports.a=Oe;exports.abbr=Pe;exports.addLink=bn;exports.addMeta=Rn;exports.addStyle=vn;exports.address=ue;exports.area=ct;exports.article=ce;exports.aside=de;exports.audio=dt;exports.b=je;exports.base=oe;exports.batchRender=V;exports.bdi=Je;exports.bdo=De;exports.bindChecked=q;exports.bindValue=K;exports.blockquote=Ce;exports.body=ne;exports.br=We;exports.button=jt;exports.canvas=Ct;exports.caption=xt;exports.cite=Ke;exports.cleanupUnused=A;exports.code=qe;exports.col=wt;exports.colgroup=Vt;exports.commentNode=mn;exports.computed=x;exports.createEl=ln;exports.createElementFactory=b;exports.createMathEl=cn;exports.createRouter=G;exports.createRouterView=U;exports.createSharedState=j;exports.createState=C;exports.createSvgEl=un;exports.createVirtualList=k;exports.data=Ie;exports.datalist=Jt;exports.dd=Me;exports.debounce=O;exports.del=Et;exports.details=Xt;exports.dfn=Ge;exports.dialog=Yt;exports.div=Ne;exports.dl=Ee;exports.doc=S;exports.domNode=f;exports.dt=Le;exports.effect=w;exports.el=on;exports.elClass=gn;exports.elId=hn;exports.elName=yn;exports.elTag=fn;exports.elements=R;exports.els=an;exports.em=Ue;exports.embed=ft;exports.fieldset=Dt;exports.figcaption=xe;exports.figure=we;exports.footer=pe;exports.form=Wt;exports.fragment=dn;exports.h1=he;exports.h2=ge;exports.h3=fe;exports.h4=ye;exports.h5=Se;exports.h6=ve;exports.head=re;exports.header=me;exports.hr=Ve;exports.html=te;exports.i=Be;exports.iframe=yt;exports.img=pt;exports.input=Kt;exports.ins=Lt;exports.jsonToVNode=Mn;exports.kbd=_e;exports.label=qt;exports.lazy=F;exports.legend=It;exports.li=$e;exports.link=ie;exports.main=Re;exports.map=mt;exports.mark=ze;exports.mathMath=Ur;exports.mathMfrac=Yr;exports.mathMi=Br;exports.mathMn=_r;exports.mathMo=zr;exports.mathMroot=tn;exports.mathMrow=Xr;exports.mathMs=Zr;exports.mathMsqrt=en;exports.mathMsub=rn;exports.mathMsup=nn;exports.mathMtext=Qr;exports.menu=er;exports.meta=ae;exports.meter=Gt;exports.nav=be;exports.noscript=Mt;exports.object=St;exports.ol=ke;exports.optgroup=Ut;exports.option=Bt;exports.output=_t;exports.p=Fe;exports.param=vt;exports.picture=Rt;exports.portal=bt;exports.pre=Ae;exports.progress=zt;exports.q=Ze;exports.reactive=L;exports.reactiveAs=D;exports.renderChunked=$;exports.renderJson=Nn;exports.renderJsonToString=En;exports.renderToHead=Sn;exports.renderToString=Cn;exports.renderVNode=xn;exports.renderVNodeToString=wn;exports.routerLink=B;exports.rp=Qe;exports.rt=Xe;exports.ruby=Ye;exports.s=et;exports.samp=tt;exports.script=Nt;exports.section=Te;exports.select=Zt;exports.setTitle=Tn;exports.sharedStateManager=J;exports.slot=rr;exports.small=rt;exports.source=Tt;exports.span=nt;exports.strong=st;exports.style=le;exports.sub=ot;exports.summary=tr;exports.sup=it;exports.svgAnimate=Lr;exports.svgAnimateMotion=wr;exports.svgAnimateTransform=xr;exports.svgCircle=or;exports.svgClipPath=br;exports.svgDefs=gr;exports.svgEllipse=dr;exports.svgFeBlend=kr;exports.svgFeColorMatrix=Fr;exports.svgFeComponentTransfer=Ar;exports.svgFeComposite=Hr;exports.svgFeConvolveMatrix=Or;exports.svgFeDiffuseLighting=Pr;exports.svgFeDisplacementMap=jr;exports.svgFeFlood=Jr;exports.svgFeGaussianBlur=Dr;exports.svgFeMorphology=Wr;exports.svgFeOffset=Kr;exports.svgFeSpecularLighting=qr;exports.svgFeTile=Ir;exports.svgFeTurbulence=Gr;exports.svgFilter=$r;exports.svgForeignObject=Er;exports.svgG=pr;exports.svgImage=Nr;exports.svgLine=lr;exports.svgLinearGradient=fr;exports.svgMarker=Mr;exports.svgMask=Rr;exports.svgPath=ar;exports.svgPattern=vr;exports.svgPolygon=cr;exports.svgPolyline=ur;exports.svgRadialGradient=yr;exports.svgRect=ir;exports.svgSet=Vr;exports.svgStop=Sr;exports.svgSvg=sr;exports.svgSymbol=Cr;exports.svgText=mr;exports.svgTspan=hr;exports.svgUse=Tr;exports.table=$t;exports.tbody=kt;exports.td=Ft;exports.template=nr;exports.text=W;exports.textNode=pn;exports.textarea=Qt;exports.tfoot=At;exports.th=Ht;exports.thead=Ot;exports.throttle=H;exports.time=at;exports.title=se;exports.tr=Pt;exports.track=ht;exports.u=lt;exports.ul=He;exports.vNodeJsonToVNode=Ln;exports.varElement=sn;exports.video=gt;exports.wbr=ut;return exports;})({});
|