lightview 2.0.8 → 2.0.9

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.
Files changed (140) hide show
  1. package/README.md +47 -1283
  2. package/components/actions/button.js +5 -5
  3. package/components/actions/dropdown.js +6 -6
  4. package/components/actions/modal.js +9 -9
  5. package/components/actions/swap.js +5 -5
  6. package/components/data-display/accordion.js +6 -6
  7. package/components/data-display/alert.js +6 -6
  8. package/components/data-display/avatar.js +7 -7
  9. package/components/data-display/badge.js +5 -5
  10. package/components/data-display/card.js +7 -7
  11. package/components/data-display/carousel.js +4 -4
  12. package/components/data-display/chart.js +8 -8
  13. package/components/data-display/chat.js +7 -7
  14. package/components/data-display/collapse.js +5 -5
  15. package/components/data-display/countdown.js +3 -3
  16. package/components/data-display/diff.js +6 -6
  17. package/components/data-display/kbd.js +5 -5
  18. package/components/data-display/loading.js +5 -5
  19. package/components/data-display/progress.js +5 -5
  20. package/components/data-display/radial-progress.js +5 -5
  21. package/components/data-display/skeleton.js +3 -3
  22. package/components/data-display/stats.js +9 -9
  23. package/components/data-display/table.js +9 -9
  24. package/components/data-display/timeline.js +8 -8
  25. package/components/data-display/toast.js +3 -3
  26. package/components/data-display/tooltip.js +3 -3
  27. package/components/data-input/checkbox.js +5 -5
  28. package/components/data-input/file-input.js +3 -3
  29. package/components/data-input/input.js +5 -5
  30. package/components/data-input/radio.js +9 -9
  31. package/components/data-input/range.js +3 -3
  32. package/components/data-input/rating.js +3 -3
  33. package/components/data-input/select.js +5 -5
  34. package/components/data-input/textarea.js +3 -3
  35. package/components/data-input/toggle.js +5 -5
  36. package/components/layout/divider.js +3 -3
  37. package/components/layout/drawer.js +7 -7
  38. package/components/layout/footer.js +5 -5
  39. package/components/layout/hero.js +5 -5
  40. package/components/layout/indicator.js +4 -4
  41. package/components/layout/join.js +4 -4
  42. package/components/layout/navbar.js +6 -6
  43. package/components/navigation/breadcrumbs.js +4 -4
  44. package/components/navigation/dock.js +5 -5
  45. package/components/navigation/menu.js +6 -6
  46. package/components/navigation/pagination.js +3 -3
  47. package/components/navigation/steps.js +4 -4
  48. package/components/navigation/tabs.js +5 -5
  49. package/components/theme/theme-switch.js +30 -30
  50. package/docs/about.html +141 -7
  51. package/docs/api/computed.html +1 -6
  52. package/docs/api/effects.html +1 -7
  53. package/docs/api/elements.html +6 -10
  54. package/docs/api/enhance.html +1 -6
  55. package/docs/api/hypermedia.html +154 -22
  56. package/docs/api/index.html +7 -12
  57. package/docs/api/nav.html +18 -1
  58. package/docs/api/signals.html +1 -6
  59. package/docs/api/state.html +1 -6
  60. package/docs/assets/js/examplify-sandbox.html +2 -2
  61. package/docs/assets/js/examplify.js +15 -15
  62. package/docs/components/accordion.html +4 -4
  63. package/docs/components/alert.html +4 -4
  64. package/docs/components/avatar.html +4 -4
  65. package/docs/components/badge.html +4 -4
  66. package/docs/components/breadcrumbs.html +3 -3
  67. package/docs/components/button.html +5 -5
  68. package/docs/components/card.html +4 -4
  69. package/docs/components/carousel.html +3 -3
  70. package/docs/components/chart-area.html +6 -6
  71. package/docs/components/chart-bar.html +6 -6
  72. package/docs/components/chart-column.html +6 -6
  73. package/docs/components/chart-line.html +6 -6
  74. package/docs/components/chart-pie.html +6 -6
  75. package/docs/components/chart.html +2 -2
  76. package/docs/components/chat.html +4 -4
  77. package/docs/components/checkbox.html +4 -4
  78. package/docs/components/collapse.html +4 -4
  79. package/docs/components/countdown.html +4 -4
  80. package/docs/components/diff.html +3 -3
  81. package/docs/components/divider.html +3 -3
  82. package/docs/components/dock.html +3 -3
  83. package/docs/components/drawer.html +4 -4
  84. package/docs/components/dropdown.html +4 -4
  85. package/docs/components/file-input.html +4 -4
  86. package/docs/components/footer.html +3 -3
  87. package/docs/components/gallery.html +2 -2
  88. package/docs/components/hero.html +3 -3
  89. package/docs/components/index.css +5 -3
  90. package/docs/components/index.html +4 -4
  91. package/docs/components/indicator.html +3 -3
  92. package/docs/components/input.html +4 -4
  93. package/docs/components/join.html +3 -3
  94. package/docs/components/kbd.html +3 -3
  95. package/docs/components/loading.html +4 -4
  96. package/docs/components/menu.html +4 -4
  97. package/docs/components/modal.html +4 -4
  98. package/docs/components/navbar.html +3 -3
  99. package/docs/components/pagination.html +3 -3
  100. package/docs/components/progress.html +4 -4
  101. package/docs/components/radial-progress.html +3 -3
  102. package/docs/components/radio.html +4 -4
  103. package/docs/components/range.html +4 -4
  104. package/docs/components/rating.html +4 -4
  105. package/docs/components/select.html +4 -4
  106. package/docs/components/sidebar-setup.js +1 -1
  107. package/docs/components/skeleton.html +4 -4
  108. package/docs/components/spinner.html +4 -4
  109. package/docs/components/stats.html +4 -4
  110. package/docs/components/steps.html +3 -3
  111. package/docs/components/swap.html +4 -4
  112. package/docs/components/switch.html +4 -4
  113. package/docs/components/table.html +4 -4
  114. package/docs/components/tabs.html +4 -4
  115. package/docs/components/text-input.html +4 -4
  116. package/docs/components/textarea.html +4 -4
  117. package/docs/components/timeline.html +4 -4
  118. package/docs/components/toast.html +4 -4
  119. package/docs/components/toggle.html +4 -4
  120. package/docs/components/tooltip.html +4 -4
  121. package/docs/examples/getting-started-example.html +1 -1
  122. package/docs/examples/index.html +1 -2
  123. package/docs/getting-started/index.html +105 -14
  124. package/docs/index.html +2 -7
  125. package/docs/router-nav.html +13 -0
  126. package/docs/router.html +60 -17
  127. package/docs/styles/index.html +2 -7
  128. package/docs/syntax.html +144 -0
  129. package/functions/_middleware.js +17 -10
  130. package/functions/processServerScripts.js +127 -0
  131. package/index.html +8 -8
  132. package/lightview-router.js +71 -22
  133. package/lightview-x.js +500 -139
  134. package/lightview.js +56 -50
  135. package/package.json +33 -26
  136. package/scripts/analysis/README.md +2 -0
  137. package/scripts/analysis/analyze.js +266 -0
  138. package/scripts/analysis/latest_metrics.md +185 -0
  139. package/wrangler.toml +6 -0
  140. package/docs/playground.html +0 -416
package/docs/components/drawer.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -69,7 +69,7 @@
69
69
 
70
70
  <!-- Tabs -->
71
71
  <script>
72
- window.switchSyntaxTab = (tabId) => {
72
+ globalThis.switchSyntaxTab = (tabId) => {
73
73
  const tabs = ['tagged', 'vdom', 'object'];
74
74
  tabs.forEach(t => {
75
75
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -244,7 +244,7 @@ $('#demo').content(drawer);</code></pre>
244
244
 
245
245
  <!-- Tabs -->
246
246
  <script>
247
- window.switchReactiveSyntaxTab = (tabId) => {
247
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
248
248
  const tabs = ['tagged', 'vdom', 'object'];
249
249
  tabs.forEach(t => {
250
250
  const tabEl = document.getElementById(`reactive-tab-btn-${t}`);
@@ -512,4 +512,4 @@ $('#demo').content(drawer);</code></pre>
512
512
  </div>
513
513
  </div>
514
514
  </div>
515
- </div>
515
+ </div>
package/docs/components/dropdown.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -68,7 +68,7 @@
68
68
 
69
69
  <!-- Tabs -->
70
70
  <script>
71
- window.switchSyntaxTab = (tabId) => {
71
+ globalThis.switchSyntaxTab = (tabId) => {
72
72
  const tabs = ['tagged', 'vdom', 'object'];
73
73
  tabs.forEach(t => {
74
74
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -197,7 +197,7 @@ $('#example').content({ div: { style: 'height: 10rem;', children: [dropdown] } }
197
197
 
198
198
  <!-- Tabs -->
199
199
  <script>
200
- window.switchReactiveSyntaxTab = (tabId) => {
200
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
201
201
  const tabs = ['tagged', 'vdom', 'object'];
202
202
  tabs.forEach(t => {
203
203
  const tabEl = document.getElementById(`reactive-tab-btn-${t}`);
@@ -476,4 +476,4 @@ $('#example').content(demo);</code></pre>
476
476
  </div>
477
477
  </div>
478
478
  </div>
479
- </div>
479
+ </div>
package/docs/components/file-input.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -71,7 +71,7 @@
71
71
 
72
72
  <!-- Tabs -->
73
73
  <script>
74
- window.switchSyntaxTab = (tabId) => {
74
+ globalThis.switchSyntaxTab = (tabId) => {
75
75
  const tabs = ['tagged', 'vdom', 'object'];
76
76
  tabs.forEach(t => {
77
77
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -216,7 +216,7 @@ $('#example').content(demo);</code></pre>
216
216
 
217
217
  <!-- Tabs -->
218
218
  <script>
219
- window.switchReactiveSyntaxTab = (tabId) => {
219
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
220
220
  const tabs = ['tagged', 'vdom', 'object'];
221
221
  tabs.forEach(t => {
222
222
  const tabEl = document.getElementById(`reactive-tab-btn-${t}`);
@@ -588,4 +588,4 @@ $('#example').content(reactiveDemo);</code></pre>
588
588
  </div>
589
589
  </div>
590
590
  </div>
591
- </div>
591
+ </div>
package/docs/components/footer.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -298,4 +298,4 @@ $('#example').content(footer);</code></pre>
298
298
 
299
299
 
300
300
  </div>
301
- </div>
301
+ </div>
package/docs/components/gallery.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -501,4 +501,4 @@
501
501
  </div>
502
502
  </div>
503
503
  </div>
504
- </div>
504
+ </div>
package/docs/components/hero.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -261,4 +261,4 @@ $('#example').content(hero);</code></pre>
261
261
  </div>
262
262
  </div>
263
263
  </div>
264
- </div>
264
+ </div>
package/docs/components/index.css CHANGED
@@ -166,12 +166,14 @@
166
166
  /* ============= Main Content ============= */
167
167
  .gallery-main {
168
168
  flex: 1;
169
- margin-left: var(--gallery-sidebar-width);
169
+ margin-left: 0;
170
170
  transition: margin-left var(--gallery-transition-slow);
171
171
  }
172
172
 
173
- .gallery-main.sidebar-closed {
174
- margin-left: 0;
173
+ @media (min-width: 1025px) {
174
+ .gallery-main.sidebar-open {
175
+ margin-left: var(--gallery-sidebar-width);
176
+ }
175
177
  }
176
178
 
177
179
  /* ============= Header ============= */
package/docs/components/index.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -52,7 +52,7 @@
52
52
  style (Object DOM and HTML requires <code>lightview-x</code>):</p>
53
53
 
54
54
  <script>
55
- window.switchUsageSyntaxTab = (tabId) => {
55
+ globalThis.switchUsageSyntaxTab = (tabId) => {
56
56
  const tabs = ['tagged', 'vdom', 'object', 'html'];
57
57
  tabs.forEach(t => {
58
58
  const tabEl = document.getElementById(`usage-tab-${t}`);
@@ -209,7 +209,7 @@ $('#example').content(app);</code></pre>
209
209
 
210
210
  function updateSidebarUI() {
211
211
  sidebar.className = `gallery-sidebar ${sidebarOpen.value ? 'open' : 'closed'}`;
212
- main.className = `gallery-main ${sidebarOpen.value ? '' : 'sidebar-closed'}`;
212
+ main.className = `gallery-main ${sidebarOpen.value ? 'sidebar-open' : ''}`;
213
213
  overlay.className = `sidebar-overlay ${sidebarOpen.value ? 'active' : ''}`;
214
214
  toggleIcon.setAttribute('class', `toggle-icon ${sidebarOpen.value ? '' : 'rotated'}`);
215
215
  }
@@ -226,7 +226,7 @@ $('#example').content(app);</code></pre>
226
226
  document.querySelector('.gallery-layout').classList.add('js-ready');
227
227
 
228
228
  // Info icon helper (shared via window)
229
- window.InfoIcon = () => svg(
229
+ globalThis.InfoIcon = () => svg(
230
230
  { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 24 24", class: "info-icon", style: "stroke: currentColor;" },
231
231
  path({ "stroke-linecap": "round", "stroke-linejoin": "round", "stroke-width": "2", d: "M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" })
232
232
  );
package/docs/components/indicator.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -339,4 +339,4 @@ $('#example').content(demo);</code></pre>
339
339
  </div>
340
340
  </div>
341
341
  </div>
342
- </div>
342
+ </div>
package/docs/components/input.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -71,7 +71,7 @@
71
71
 
72
72
  <!-- Tabs -->
73
73
  <script>
74
- window.switchSyntaxTab = (tabId) => {
74
+ globalThis.switchSyntaxTab = (tabId) => {
75
75
  const tabs = ['tagged', 'vdom', 'object', 'html'];
76
76
  tabs.forEach(t => {
77
77
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -283,7 +283,7 @@ $('#example').content(demo);</code></pre>
283
283
 
284
284
  <!-- Tabs -->
285
285
  <script>
286
- window.switchReactiveSyntaxTab = (tabId) => {
286
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
287
287
  const tabs = ['tagged', 'vdom', 'object'];
288
288
  tabs.forEach(t => {
289
289
  const tabEl = document.getElementById(`reactive-tab-btn-${t}`);
@@ -641,4 +641,4 @@ $('#example').content(reactiveDemo);</code></pre>
641
641
  </div>
642
642
  </div>
643
643
  </div>
644
- </div>
644
+ </div>
package/docs/components/join.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -282,4 +282,4 @@ $('#example').content(demo);</code></pre>
282
282
  </div>
283
283
  </div>
284
284
  </div>
285
- </div>
285
+ </div>
package/docs/components/kbd.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object', 'html'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -319,4 +319,4 @@ $('#example').content(shortcuts);</code></pre>
319
319
  </div>
320
320
  </div>
321
321
  </div>
322
- </div>
322
+ </div>
package/docs/components/loading.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object', 'html'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -224,7 +224,7 @@ $('#example').content(loaders);</code></pre>
224
224
 
225
225
  <!-- Tabs -->
226
226
  <script>
227
- window.switchReactiveSyntaxTab = (tabId) => {
227
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
228
228
  const tabs = ['tagged', 'vdom', 'object'];
229
229
  tabs.forEach(t => {
230
230
  const tabEl = document.getElementById(`reactive-tab-btn-${t}`);
@@ -518,4 +518,4 @@ $('#example').content(demo);</code></pre>
518
518
  </button>
519
519
  </div>
520
520
  </div>
521
- </div>
521
+ </div>
package/docs/components/menu.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -200,7 +200,7 @@ $('#example').content(menu);</code></pre>
200
200
 
201
201
  <!-- Tabs -->
202
202
  <script>
203
- window.switchReactiveSyntaxTab = (tabId) => {
203
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
204
204
  const tabs = ['tagged', 'vdom', 'object'];
205
205
  tabs.forEach(t => {
206
206
  const tabEl = document.getElementById(`reactive-tab-btn-${t}`);
@@ -458,4 +458,4 @@ $('#example').content(menu);</code></pre>
458
458
  </div>
459
459
  </div>
460
460
  </div>
461
- </div>
461
+ </div>
package/docs/components/modal.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -71,7 +71,7 @@
71
71
 
72
72
  <!-- Tabs -->
73
73
  <script>
74
- window.switchSyntaxTab = (tabId) => {
74
+ globalThis.switchSyntaxTab = (tabId) => {
75
75
  const tabs = ['tagged', 'vdom', 'object'];
76
76
  tabs.forEach(t => {
77
77
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -251,7 +251,7 @@ $('#example').content([trigger, modal]);</code></pre>
251
251
 
252
252
  <!-- Tabs -->
253
253
  <script>
254
- window.switchReactiveSyntaxTab = (tabId) => {
254
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
255
255
  const tabs = ['tagged', 'vdom', 'object'];
256
256
  tabs.forEach(t => {
257
257
  const tabEl = document.getElementById(`tab-btn-reactive-${t}`);
@@ -636,4 +636,4 @@ $('#example').content(demo);</code></pre>
636
636
 
637
637
 
638
638
  </div>
639
- </div>
639
+ </div>
package/docs/components/navbar.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -318,4 +318,4 @@ $('#example').content(navbar);</code></pre>
318
318
  </div>
319
319
  </div>
320
320
  </div>
321
- </div>
321
+ </div>
package/docs/components/pagination.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -276,4 +276,4 @@ $('#example').content(demo);</code></pre>
276
276
  </div>
277
277
  </div>
278
278
  </div>
279
- </div>
279
+ </div>
package/docs/components/progress.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object', 'html'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -223,7 +223,7 @@ $('#example').content(progressBars);</code></pre>
223
223
 
224
224
  <!-- Tabs -->
225
225
  <script>
226
- window.switchReactiveSyntaxTab = (tabId) => {
226
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
227
227
  const tabs = ['tagged', 'vdom', 'object'];
228
228
  tabs.forEach(t => {
229
229
  const tabEl = document.getElementById(`tab-btn-reactive-${t}`);
@@ -511,4 +511,4 @@ $('#example').content(demo);</code></pre>
511
511
  >
512
512
  </div>
513
513
  </div>
514
- </div>
514
+ </div>
package/docs/components/radial-progress.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object', 'html'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -431,4 +431,4 @@ $('#example').content(demo);</code></pre>
431
431
  </div>
432
432
  </div>
433
433
  </div>
434
- </div>
434
+ </div>
package/docs/components/radio.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object', 'html'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -303,7 +303,7 @@ $('#example').content({
303
303
 
304
304
  <!-- Tabs -->
305
305
  <script>
306
- window.switchReactiveSyntaxTab = (tabId) => {
306
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
307
307
  const tabs = ['tagged', 'vdom', 'object'];
308
308
  tabs.forEach(t => {
309
309
  const tabEl = document.getElementById(`reactive-tab-btn-${t}`);
@@ -652,4 +652,4 @@ $('#example').content(reactiveDemo);</code></pre>
652
652
  </div>
653
653
  </div>
654
654
  </div>
655
- </div>
655
+ </div>
package/docs/components/range.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -71,7 +71,7 @@
71
71
 
72
72
  <!-- Tabs -->
73
73
  <script>
74
- window.switchSyntaxTab = (tabId) => {
74
+ globalThis.switchSyntaxTab = (tabId) => {
75
75
  const tabs = ['tagged', 'vdom', 'object'];
76
76
  tabs.forEach(t => {
77
77
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -261,7 +261,7 @@ $('#example').content({
261
261
 
262
262
  <!-- Tabs -->
263
263
  <script>
264
- window.switchReactiveSyntaxTab = (tabId) => {
264
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
265
265
  const tabs = ['tagged', 'vdom', 'object'];
266
266
  tabs.forEach(t => {
267
267
  const tabEl = document.getElementById(`reactive-tab-btn-${t}`);
@@ -608,4 +608,4 @@ $('#example').content(reactiveDemo);</code></pre>
608
608
  </div>
609
609
  </div>
610
610
  </div>
611
- </div>
611
+ </div>
package/docs/components/rating.html CHANGED
@@ -1,7 +1,7 @@
1
1
  <!-- SEO-friendly SPA Shim -->
2
2
  <script src="/lightview-router.js"></script>
3
3
  <script>
4
- if (window.LightviewRouter) {
4
+ if (globalThis.LightviewRouter) {
5
5
  LightviewRouter.base('/index.html');
6
6
  }
7
7
  </script>
@@ -70,7 +70,7 @@
70
70
 
71
71
  <!-- Tabs -->
72
72
  <script>
73
- window.switchSyntaxTab = (tabId) => {
73
+ globalThis.switchSyntaxTab = (tabId) => {
74
74
  const tabs = ['tagged', 'vdom', 'object'];
75
75
  tabs.forEach(t => {
76
76
  const tabEl = document.getElementById(`tab-btn-${t}`);
@@ -259,7 +259,7 @@ $('#example').content({
259
259
 
260
260
  <!-- Tabs -->
261
261
  <script>
262
- window.switchReactiveSyntaxTab = (tabId) => {
262
+ globalThis.switchReactiveSyntaxTab = (tabId) => {
263
263
  const tabs = ['tagged', 'vdom', 'object'];
264
264
  tabs.forEach(t => {
265
265
  const tabEl = document.getElementById(`reactive-tab-btn-${t}`);
@@ -639,4 +639,4 @@ $('#example').content(reactiveDemo);</code></pre>
639
639
  </div>
640
640
  </div>
641
641
  </div>
642
- </div>
642
+ </div>