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/dist/index.js CHANGED
@@ -1,2266 +1,35 @@
1
- "use strict";
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
- var __copyProps = (to, from, except, desc) => {
11
- if (from && typeof from === "object" || typeof from === "function") {
12
- for (let key of __getOwnPropNames(from))
13
- if (!__hasOwnProp.call(to, key) && key !== except)
14
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
15
- }
16
- return to;
17
- };
18
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
19
-
20
- // src/index.ts
21
- var index_exports = {};
22
- __export(index_exports, {
23
- CreateStyle: () => CreateStyle,
24
- DomNode: () => DomNode,
25
- a: () => a,
26
- abbr: () => abbr,
27
- addLink: () => addLink,
28
- addMeta: () => addMeta,
29
- addStyle: () => addStyle,
30
- address: () => address,
31
- area: () => area,
32
- article: () => article,
33
- aside: () => aside,
34
- audio: () => audio,
35
- b: () => b,
36
- base: () => base,
37
- batchRender: () => batchRender,
38
- bdi: () => bdi,
39
- bdo: () => bdo,
40
- bindChecked: () => bindChecked,
41
- bindValue: () => bindValue,
42
- blockquote: () => blockquote,
43
- body: () => body,
44
- br: () => br,
45
- button: () => button,
46
- canvas: () => canvas,
47
- caption: () => caption,
48
- cite: () => cite,
49
- cleanupUnused: () => cleanupUnused,
50
- code: () => code,
51
- col: () => col,
52
- colgroup: () => colgroup,
53
- computed: () => computed,
54
- createElementFactory: () => createElementFactory,
55
- createRouter: () => createRouter,
56
- createRouterView: () => createRouterView,
57
- createState: () => createState,
58
- createVirtualList: () => createVirtualList,
59
- data: () => data,
60
- datalist: () => datalist,
61
- dd: () => dd,
62
- debounce: () => debounce,
63
- del: () => del,
64
- details: () => details,
65
- dfn: () => dfn,
66
- dialog: () => dialog,
67
- div: () => div,
68
- dl: () => dl,
69
- domNode: () => domNode,
70
- dt: () => dt,
71
- effect: () => effect,
72
- elements: () => elements,
73
- em: () => em,
74
- embed: () => embed,
75
- fieldset: () => fieldset,
76
- figcaption: () => figcaption,
77
- figure: () => figure,
78
- footer: () => footer,
79
- form: () => form,
80
- h1: () => h1,
81
- h2: () => h2,
82
- h3: () => h3,
83
- h4: () => h4,
84
- h5: () => h5,
85
- h6: () => h6,
86
- head: () => head,
87
- header: () => header,
88
- hr: () => hr,
89
- html: () => html,
90
- i: () => i,
91
- iframe: () => iframe,
92
- img: () => img,
93
- input: () => input,
94
- ins: () => ins,
95
- jsonToVNode: () => jsonToVNode,
96
- kbd: () => kbd,
97
- label: () => label,
98
- lazy: () => lazy,
99
- legend: () => legend,
100
- li: () => li,
101
- link: () => link,
102
- main: () => main,
103
- map: () => map,
104
- mark: () => mark,
105
- mathMath: () => mathMath,
106
- mathMfrac: () => mathMfrac,
107
- mathMi: () => mathMi,
108
- mathMn: () => mathMn,
109
- mathMo: () => mathMo,
110
- mathMroot: () => mathMroot,
111
- mathMrow: () => mathMrow,
112
- mathMs: () => mathMs,
113
- mathMsqrt: () => mathMsqrt,
114
- mathMsub: () => mathMsub,
115
- mathMsup: () => mathMsup,
116
- mathMtext: () => mathMtext,
117
- menu: () => menu,
118
- meta: () => meta,
119
- meter: () => meter,
120
- nav: () => nav,
121
- noscript: () => noscript,
122
- object: () => object,
123
- ol: () => ol,
124
- optgroup: () => optgroup,
125
- option: () => option,
126
- output: () => output,
127
- p: () => p,
128
- param: () => param,
129
- picture: () => picture,
130
- portal: () => portal,
131
- pre: () => pre,
132
- progress: () => progress,
133
- q: () => q,
134
- reactive: () => reactive,
135
- reactiveAs: () => reactiveAs,
136
- renderChunked: () => renderChunked,
137
- renderJson: () => renderJson,
138
- renderJsonToString: () => renderJsonToString,
139
- renderToHead: () => renderToHead,
140
- renderToString: () => renderToString,
141
- renderVNode: () => renderVNode,
142
- renderVNodeToString: () => renderVNodeToString,
143
- routerLink: () => routerLink,
144
- rp: () => rp,
145
- rt: () => rt,
146
- ruby: () => ruby,
147
- s: () => s,
148
- samp: () => samp,
149
- script: () => script,
150
- section: () => section,
151
- select: () => select,
152
- setTitle: () => setTitle,
153
- slot: () => slot,
154
- small: () => small,
155
- source: () => source,
156
- span: () => span,
157
- strong: () => strong,
158
- style: () => style,
159
- sub: () => sub,
160
- summary: () => summary,
161
- sup: () => sup,
162
- svgAnimate: () => svgAnimate,
163
- svgAnimateMotion: () => svgAnimateMotion,
164
- svgAnimateTransform: () => svgAnimateTransform,
165
- svgCircle: () => svgCircle,
166
- svgClipPath: () => svgClipPath,
167
- svgDefs: () => svgDefs,
168
- svgEllipse: () => svgEllipse,
169
- svgFeBlend: () => svgFeBlend,
170
- svgFeColorMatrix: () => svgFeColorMatrix,
171
- svgFeComponentTransfer: () => svgFeComponentTransfer,
172
- svgFeComposite: () => svgFeComposite,
173
- svgFeConvolveMatrix: () => svgFeConvolveMatrix,
174
- svgFeDiffuseLighting: () => svgFeDiffuseLighting,
175
- svgFeDisplacementMap: () => svgFeDisplacementMap,
176
- svgFeFlood: () => svgFeFlood,
177
- svgFeGaussianBlur: () => svgFeGaussianBlur,
178
- svgFeMorphology: () => svgFeMorphology,
179
- svgFeOffset: () => svgFeOffset,
180
- svgFeSpecularLighting: () => svgFeSpecularLighting,
181
- svgFeTile: () => svgFeTile,
182
- svgFeTurbulence: () => svgFeTurbulence,
183
- svgFilter: () => svgFilter,
184
- svgForeignObject: () => svgForeignObject,
185
- svgG: () => svgG,
186
- svgImage: () => svgImage,
187
- svgLine: () => svgLine,
188
- svgLinearGradient: () => svgLinearGradient,
189
- svgMarker: () => svgMarker,
190
- svgMask: () => svgMask,
191
- svgPath: () => svgPath,
192
- svgPattern: () => svgPattern,
193
- svgPolygon: () => svgPolygon,
194
- svgPolyline: () => svgPolyline,
195
- svgRadialGradient: () => svgRadialGradient,
196
- svgRect: () => svgRect,
197
- svgSet: () => svgSet,
198
- svgStop: () => svgStop,
199
- svgSvg: () => svgSvg,
200
- svgSymbol: () => svgSymbol,
201
- svgText: () => svgText,
202
- svgTspan: () => svgTspan,
203
- svgUse: () => svgUse,
204
- table: () => table,
205
- tbody: () => tbody,
206
- td: () => td,
207
- template: () => template,
208
- text: () => text,
209
- textarea: () => textarea,
210
- tfoot: () => tfoot,
211
- th: () => th,
212
- thead: () => thead,
213
- throttle: () => throttle,
214
- time: () => time,
215
- title: () => title,
216
- tr: () => tr,
217
- track: () => track,
218
- u: () => u,
219
- ul: () => ul,
220
- vNodeJsonToVNode: () => vNodeJsonToVNode,
221
- varElement: () => varElement,
222
- video: () => video,
223
- wbr: () => wbr
224
- });
225
- module.exports = __toCommonJS(index_exports);
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
- "&": "&amp;",
659
- "<": "&lt;",
660
- ">": "&gt;",
661
- '"': "&quot;",
662
- "'": "&#x27;"
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
- // Annotate the CommonJS export names for ESM import in node:
2064
- 0 && (module.exports = {
2065
- CreateStyle,
2066
- DomNode,
2067
- a,
2068
- abbr,
2069
- addLink,
2070
- addMeta,
2071
- addStyle,
2072
- address,
2073
- area,
2074
- article,
2075
- aside,
2076
- audio,
2077
- b,
2078
- base,
2079
- batchRender,
2080
- bdi,
2081
- bdo,
2082
- bindChecked,
2083
- bindValue,
2084
- blockquote,
2085
- body,
2086
- br,
2087
- button,
2088
- canvas,
2089
- caption,
2090
- cite,
2091
- cleanupUnused,
2092
- code,
2093
- col,
2094
- colgroup,
2095
- computed,
2096
- createElementFactory,
2097
- createRouter,
2098
- createRouterView,
2099
- createState,
2100
- createVirtualList,
2101
- data,
2102
- datalist,
2103
- dd,
2104
- debounce,
2105
- del,
2106
- details,
2107
- dfn,
2108
- dialog,
2109
- div,
2110
- dl,
2111
- domNode,
2112
- dt,
2113
- effect,
2114
- elements,
2115
- em,
2116
- embed,
2117
- fieldset,
2118
- figcaption,
2119
- figure,
2120
- footer,
2121
- form,
2122
- h1,
2123
- h2,
2124
- h3,
2125
- h4,
2126
- h5,
2127
- h6,
2128
- head,
2129
- header,
2130
- hr,
2131
- html,
2132
- i,
2133
- iframe,
2134
- img,
2135
- input,
2136
- ins,
2137
- jsonToVNode,
2138
- kbd,
2139
- label,
2140
- lazy,
2141
- legend,
2142
- li,
2143
- link,
2144
- main,
2145
- map,
2146
- mark,
2147
- mathMath,
2148
- mathMfrac,
2149
- mathMi,
2150
- mathMn,
2151
- mathMo,
2152
- mathMroot,
2153
- mathMrow,
2154
- mathMs,
2155
- mathMsqrt,
2156
- mathMsub,
2157
- mathMsup,
2158
- mathMtext,
2159
- menu,
2160
- meta,
2161
- meter,
2162
- nav,
2163
- noscript,
2164
- object,
2165
- ol,
2166
- optgroup,
2167
- option,
2168
- output,
2169
- p,
2170
- param,
2171
- picture,
2172
- portal,
2173
- pre,
2174
- progress,
2175
- q,
2176
- reactive,
2177
- reactiveAs,
2178
- renderChunked,
2179
- renderJson,
2180
- renderJsonToString,
2181
- renderToHead,
2182
- renderToString,
2183
- renderVNode,
2184
- renderVNodeToString,
2185
- routerLink,
2186
- rp,
2187
- rt,
2188
- ruby,
2189
- s,
2190
- samp,
2191
- script,
2192
- section,
2193
- select,
2194
- setTitle,
2195
- slot,
2196
- small,
2197
- source,
2198
- span,
2199
- strong,
2200
- style,
2201
- sub,
2202
- summary,
2203
- sup,
2204
- svgAnimate,
2205
- svgAnimateMotion,
2206
- svgAnimateTransform,
2207
- svgCircle,
2208
- svgClipPath,
2209
- svgDefs,
2210
- svgEllipse,
2211
- svgFeBlend,
2212
- svgFeColorMatrix,
2213
- svgFeComponentTransfer,
2214
- svgFeComposite,
2215
- svgFeConvolveMatrix,
2216
- svgFeDiffuseLighting,
2217
- svgFeDisplacementMap,
2218
- svgFeFlood,
2219
- svgFeGaussianBlur,
2220
- svgFeMorphology,
2221
- svgFeOffset,
2222
- svgFeSpecularLighting,
2223
- svgFeTile,
2224
- svgFeTurbulence,
2225
- svgFilter,
2226
- svgForeignObject,
2227
- svgG,
2228
- svgImage,
2229
- svgLine,
2230
- svgLinearGradient,
2231
- svgMarker,
2232
- svgMask,
2233
- svgPath,
2234
- svgPattern,
2235
- svgPolygon,
2236
- svgPolyline,
2237
- svgRadialGradient,
2238
- svgRect,
2239
- svgSet,
2240
- svgStop,
2241
- svgSvg,
2242
- svgSymbol,
2243
- svgText,
2244
- svgTspan,
2245
- svgUse,
2246
- table,
2247
- tbody,
2248
- td,
2249
- template,
2250
- text,
2251
- textarea,
2252
- tfoot,
2253
- th,
2254
- thead,
2255
- throttle,
2256
- time,
2257
- title,
2258
- tr,
2259
- track,
2260
- u,
2261
- ul,
2262
- vNodeJsonToVNode,
2263
- varElement,
2264
- video,
2265
- wbr
2266
- });
1
+ '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={"&":"&amp;","<":"&lt;",">":"&gt;",'"':"&quot;","'":"&#x27;"};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;